working on standard component
This commit is contained in:
michael shanks
parent
ef0b1a102e
commit
ea3e847290
|
|
@ -2,14 +2,19 @@ import { map } from "lodash/fp";
|
|||
|
||||
export const loadLibs = async (appName, appPackage) => {
|
||||
|
||||
const makeUrl = l =>
|
||||
`/_builder/api/${appName}/componentlibrary?lib=${encodeURI(l)}`
|
||||
|
||||
const allLibraries = {};
|
||||
for(let lib of appPackage.pages.componentLibraries) {
|
||||
const libModule = await import(makeUrl(lib));
|
||||
const libModule = await import(makeLibraryUrl(appName, lib));
|
||||
allLibraries[lib] = libModule;
|
||||
}
|
||||
|
||||
return allLibraries;
|
||||
}
|
||||
|
||||
export const loadLib = async (appName, lib, allLibs) => {
|
||||
allLibs[lib] = await import(makeLibraryUrl(appName, lib));
|
||||
return allLibs;
|
||||
}
|
||||
|
||||
export const makeLibraryUrl = (appName, lib) =>
|
||||
`/_builder/api/${appName}/componentlibrary?lib=${encodeURI(lib)}`
|
||||
|
|
@ -47,6 +47,7 @@ export const getStore = () => {
|
|||
currentFrontEndItem:null,
|
||||
currentComponentInfo:null,
|
||||
currentComponentIsNew:false,
|
||||
currentPageName: "",
|
||||
currentNodeIsNew: false,
|
||||
errors: [],
|
||||
activeNav: "database",
|
||||
|
|
@ -87,6 +88,7 @@ export const getStore = () => {
|
|||
store.removeComponentLibrary =removeComponentLibrary(store);
|
||||
store.addStylesheet = addStylesheet(store);
|
||||
store.removeStylesheet = removeStylesheet(store);
|
||||
store.savePage = savePage(store);
|
||||
return store;
|
||||
}
|
||||
|
||||
|
|
@ -113,6 +115,7 @@ const initialise = (store, initial) => async () => {
|
|||
initial.hasAppPackage = true;
|
||||
initial.hierarchy = pkg.appDefinition.hierarchy;
|
||||
initial.accessLevels = pkg.accessLevels;
|
||||
initial.derivedComponents = pkg.derivedComponents;
|
||||
initial.allComponents = combineComponents(
|
||||
pkg.derivedComponents, pkg.rootComponents);
|
||||
initial.actions = reduce((arr, action) => {
|
||||
|
|
@ -456,6 +459,18 @@ const renameDerivedComponent = store => (oldname, newname) => {
|
|||
})
|
||||
}
|
||||
|
||||
const savePage = store => async page => {
|
||||
store.update(s => {
|
||||
if(s.currentFrontEndIsComponent || !s.currentFrontEndItem) {
|
||||
return;
|
||||
}
|
||||
|
||||
s.pages[currentPageName] = page;
|
||||
savePackage();
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
const addComponentLibrary = store => async lib => {
|
||||
|
||||
const response =
|
||||
|
|
@ -571,9 +586,9 @@ const setCurrentComponent = store => component => {
|
|||
|
||||
const setCurrentPage = store => pageName => {
|
||||
store.update(s => {
|
||||
const props = s.pages[pageName];
|
||||
s.currentFrontEndItem = {props, name:pageName};
|
||||
s.currentFrontEndItem = s.pages[pageName];
|
||||
s.currentFrontEndIsComponent = false;
|
||||
s.currentPageName = pageName;
|
||||
return s;
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<script>
|
||||
import { store } from "../builderStore";
|
||||
import { makeLibraryUrl } from "../builderStore/loadComponentLibraries";
|
||||
import {
|
||||
last,
|
||||
split,
|
||||
|
|
@ -14,50 +15,69 @@ let component;
|
|||
let stylesheetLinks = "";
|
||||
let componentHtml = "";
|
||||
let props;
|
||||
let componentLibraryUrl = "";
|
||||
let rootComponentName = "";
|
||||
let iframe;
|
||||
|
||||
store.subscribe(s => {
|
||||
const {componentName, libName} = splitName(
|
||||
s.currentComponentInfo.rootComponent.name);
|
||||
|
||||
rootComponentName = componentName;
|
||||
props = s.currentComponentInfo.fullProps;
|
||||
component = s.libraries[libName][componentName];
|
||||
stylesheetLinks = pipe(s.pages.stylesheets, [
|
||||
map(s => `<link rel="stylesheet" href="${s}"/>`),
|
||||
join("\n")
|
||||
])
|
||||
]);
|
||||
componentLibraryUrl = makeLibraryUrl(s.appname, libName);
|
||||
});
|
||||
|
||||
|
||||
|
||||
/*
|
||||
afterUpdate(() => {
|
||||
setTimeout(() => {
|
||||
componentHtml = document.getElementById("comonent-container-mock").innerHTML
|
||||
}, 1);
|
||||
if(iframe) iframeLoaded();
|
||||
});
|
||||
*/
|
||||
|
||||
const iframeLoaded = () => {
|
||||
setTimeout(() => {
|
||||
iframe.style.height = (iframe.contentWindow.document.body.scrollHeight + 1).toString() + "px";
|
||||
iframe.style.width = (iframe.contentWindow.document.body.scrollWidth + 1).toString() + "px";
|
||||
}, 100);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<div class="component-preview" >
|
||||
<div class="component-container">
|
||||
<iframe title="componentPreview"
|
||||
srcdoc={`<html>
|
||||
<iframe bind:this={iframe}
|
||||
on:load={iframeLoaded}
|
||||
title="componentPreview"
|
||||
srcdoc={
|
||||
`<html>
|
||||
|
||||
<head>
|
||||
${stylesheetLinks}
|
||||
</head>
|
||||
<body>
|
||||
${componentHtml}
|
||||
</body>
|
||||
</html>`}>
|
||||
<head>
|
||||
${stylesheetLinks}
|
||||
<script>
|
||||
|
||||
import('${componentLibraryUrl}')
|
||||
.then(module => {
|
||||
const componentClass = module['${rootComponentName}'];
|
||||
const instance = new componentClass({
|
||||
target: document.body,
|
||||
props: JSON.parse('${JSON.stringify(props)}')
|
||||
}) ;
|
||||
})
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>`}>
|
||||
</iframe>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="comonent-container-mock">
|
||||
<svelte:component this={component} {...props}/>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.component-preview {
|
||||
display: grid;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,44 @@
|
|||
<script>
|
||||
|
||||
import Textbox from "../common/Textbox.svelte";
|
||||
import Dropdown from "../common/Dropdown.svelte";
|
||||
import Button from "../common/Button.svelte";
|
||||
import { store } from "../builderStore";
|
||||
import { isRootComponent } from "./pagesParsing/searchComponents";
|
||||
|
||||
let entryComponent;
|
||||
let title = "";
|
||||
let components = [];
|
||||
|
||||
store.subscribe(s => {
|
||||
title = s.currentFrontEndItem.title;
|
||||
entryComponent = s.currentFrontEndItem.entryComponent;
|
||||
components = filter(s => !isRootComponent(s))(s.allComponents);
|
||||
});
|
||||
|
||||
const save = () => {
|
||||
const page = {
|
||||
title,
|
||||
entryComponent,
|
||||
}
|
||||
store.savePage(page);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<p>{$store.currentPageName}</p>
|
||||
|
||||
<form class="uk-form-horizontal">
|
||||
<Textbox bind:value={title} label="Title" />
|
||||
<Dropdown bind:value={title}
|
||||
label="App Entry Component"
|
||||
options={components}
|
||||
selected={entryComponent}
|
||||
textMember="name" />
|
||||
|
||||
<Button on:click={save}>Save</Button>
|
||||
</form>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -41,7 +41,7 @@ const settings = () => {
|
|||
</div>
|
||||
</div>
|
||||
<div class="nav-items-container">
|
||||
<ComponentsHierarchy components={$store.allComponents}/>
|
||||
<ComponentsHierarchy components={$store.derivedComponents}/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
{
|
||||
"name": "Success Button",
|
||||
"description": "",
|
||||
"inherits": "./standard-components/button",
|
||||
"props": {
|
||||
"className": "btn btn-success",
|
||||
"_component": "Success Button"
|
||||
},
|
||||
"tags": [
|
||||
"button"
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
{
|
||||
"name": "login_screen",
|
||||
"description": "",
|
||||
"inherits": "./standard-components/login",
|
||||
"props": {
|
||||
"usernameLabel": "User",
|
||||
"_component": "login_screen"
|
||||
},
|
||||
"tags": [
|
||||
"login",
|
||||
"credentials",
|
||||
"password",
|
||||
"logon"
|
||||
]
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
|
|
@ -9,9 +9,62 @@
|
|||
"props": {
|
||||
"contentText": { "type": "string", "default": "Button" },
|
||||
"contentComponent": "component",
|
||||
"className": "string",
|
||||
"className": {"type": "string", "default": "default"},
|
||||
"disabled": "bool"
|
||||
},
|
||||
"tags": ["button"]
|
||||
},
|
||||
"login" : {
|
||||
"importPath": "login",
|
||||
"name": "Login Control",
|
||||
"desciption": "A control that accepts username, password an also handles password resets",
|
||||
"props" : {
|
||||
"logo": "asset",
|
||||
"loginRedirect": "string",
|
||||
"usernameLabel": {"type":"string", "default": "Username"},
|
||||
"passwordLabel": {"type":"string", "default": "Password"},
|
||||
"loginButtonLabel": {"type":"string", "default": "Login"}
|
||||
},
|
||||
"tags": ["login", "credentials", "password", "logon"]
|
||||
},
|
||||
"formControl" : {
|
||||
"importPath": "formControl",
|
||||
"name": "Form Control",
|
||||
"desciption": "A wrapper for a control, used inside a form. Allows a label, and properly alligns the control inside the parent form",
|
||||
"props" : {
|
||||
"containerClass": "string",
|
||||
"labelContainerClass": "string",
|
||||
"controlContainerClass": "string",
|
||||
"label": "string",
|
||||
"control": "component",
|
||||
"fullWidth": "bool"
|
||||
},
|
||||
"tags": ["login"]
|
||||
},
|
||||
"form" : {
|
||||
"importPath": "form",
|
||||
"name": "Form",
|
||||
"desciption": "A form - you should usually add FormControls as children to get nice allignment",
|
||||
"props" : {
|
||||
"containerClass": "string",
|
||||
"formControls": {
|
||||
"type":"array",
|
||||
"elementDefinition": {
|
||||
"control":"component"
|
||||
}
|
||||
}
|
||||
},
|
||||
"tags": ["form"]
|
||||
},
|
||||
"textbox" : {
|
||||
"importPath": "textbox",
|
||||
"name": "Textbox",
|
||||
"desciption": "An input type=text or password",
|
||||
"props" : {
|
||||
"value": "string",
|
||||
"hideValue": "boolean",
|
||||
"className": {"type": "string", "default": "default"}
|
||||
},
|
||||
"tags": ["form"]
|
||||
}
|
||||
}
|
||||
|
|
@ -4,12 +4,20 @@
|
|||
"main": "index.js",
|
||||
"scripts": {
|
||||
"build": "rollup -c",
|
||||
"prepublishOnly": "npm run build"
|
||||
"prepublishOnly": "npm run build",
|
||||
"testbuild": "rollup -w -c rollup.testconfig.js",
|
||||
"dev": "run-p start:dev testbuild",
|
||||
"start:dev": "sirv public --single --dev"
|
||||
},
|
||||
"devDependencies": {
|
||||
"npm-run-all": "^4.1.5",
|
||||
"rollup": "^1.11.0",
|
||||
"rollup-plugin-node-resolve": "^4.0.0",
|
||||
"rollup-plugin-commonjs": "^10.0.2",
|
||||
"rollup-plugin-livereload": "^1.0.1",
|
||||
"rollup-plugin-node-resolve": "^5.0.0",
|
||||
"rollup-plugin-svelte": "^5.0.0",
|
||||
"rollup-plugin-terser": "^5.1.1",
|
||||
"sirv-cli": "^0.4.4",
|
||||
"svelte": "^3.0.0"
|
||||
},
|
||||
"keywords": [
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
|
|
@ -0,0 +1,9 @@
|
|||
.root.svelte-1s3350l{height:100%;display:grid;grid-template-columns:[left] 1fr [middle] auto [right] 1fr;grid-template-rows:[top] 1fr [center] auto [bottom] 1fr}.content.svelte-1s3350l{grid-column-start:middle;grid-row-start:center;width:400px}.logo-container.svelte-1s3350l{margin-bottom:20px
|
||||
}.logo-container.svelte-1s3350l>img.svelte-1s3350l{max-width:100%}.login-button-container.svelte-1s3350l{text-align:right;margin-top:20px}
|
||||
.label.svelte-98bu7e{grid-column-start:label;padding:5px 10px;vertical-align:middle}.control.svelte-98bu7e{grid-column-start:control;padding:5px 10px}.overflow.svelte-98bu7e{grid-column-start:overflow}.full-width.svelte-98bu7e{width:100%}
|
||||
.form-root.svelte-h706oz{display:grid;grid-template-columns:[label] auto [control] auto}
|
||||
.current.svelte-cgpppc{height:100%;width:100%}
|
||||
input.svelte-bmvn6x{width:100%}input.svelte-bmvn6x{font-family:inherit;font-size:inherit;padding:0.4em;margin:0 0 0.5em 0;box-sizing:border-box;border:1px solid #ccc;border-radius:2px;width:100%}input.svelte-bmvn6x:disabled{color:#ccc}
|
||||
button.svelte-19ku4ig{font-family:inherit;font-size:inherit;padding:0.4em;margin:0 0 0.5em 0;box-sizing:border-box;border:1px solid #ccc;border-radius:2px}button.svelte-19ku4ig{color:#333;background-color:#f4f4f4;outline:none}button.svelte-19ku4ig:active{background-color:#ddd}button.svelte-19ku4ig:focus{border-color:#666}
|
||||
|
||||
/*# sourceMappingURL=bundle.css.map */
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
{
|
||||
"version": 3,
|
||||
"file": "bundle.css",
|
||||
"sources": [
|
||||
"..\\src\\Login.svelte",
|
||||
"..\\src\\FormControl.svelte",
|
||||
"..\\src\\Form.svelte",
|
||||
"..\\src\\Test\\TestApp.svelte",
|
||||
"..\\src\\Textbox.svelte",
|
||||
"..\\src\\Button.svelte"
|
||||
],
|
||||
"sourcesContent": [
|
||||
"<script>\r\n\r\nimport Textbox from \"./Textbox.svelte\";\r\nimport FormControl from \"./FormControl.svelte\";\r\nimport Form from \"./Form.svelte\";\r\nimport Button from \"./Button.svelte\";\r\n\r\nexport let usernameLabel = \"Username\";\r\nexport let passwordLabel = \"Password\";\r\nexport let loginRedirect = \"\";\r\nexport let logo = \"/budibase-logo.png\";\r\n\r\nlet username = \"\";\r\nlet password = \"\";\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n\r\n <div class=\"content\">\r\n\r\n <div class=\"logo-container\">\r\n <img src={logo} alt=\"logo\"/>\r\n </div>\r\n\r\n <Form>\r\n <FormControl label={usernameLabel}>\r\n <Textbox bind:value={username} />\r\n </FormControl>\r\n <FormControl label={passwordLabel}>\r\n <Textbox bind:value={password} hideValue=true />\r\n </FormControl>\r\n </Form>\r\n\r\n <div class=\"login-button-container\">\r\n <Button>Login</Button>\r\n </div>\r\n\r\n </div>\r\n\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n height: 100%;\r\n display:grid;\r\n grid-template-columns: [left] 1fr [middle] auto [right] 1fr;\r\n grid-template-rows: [top] 1fr [center] auto [bottom] 1fr;\r\n}\r\n\r\n.content {\r\n grid-column-start: middle;\r\n grid-row-start: center;\r\n width: 400px;\r\n}\r\n\r\n.logo-container {\r\n margin-bottom: 20px\r\n}\r\n\r\n.logo-container > img {\r\n max-width: 100%;\r\n}\r\n\r\n.login-button-container {\r\n text-align: right;\r\n margin-top: 20px;\r\n}\r\n\r\n</style>",
|
||||
"<script>\r\n\r\nexport let containerClass = \"\";\r\nexport let labelContainerClass = \"\";\r\nexport let controlContainerClass = \"\";\r\nexport let label = \"\";\r\nexport let control;\r\nexport let overflowControl;\r\nexport let fullWidth = false;\r\n\r\n</script>\r\n\r\n<div class=\"label {labelContainerClass}\">{label}</div>\r\n<div class=\"control {controlContainerClass}\" class:full-width={fullWidth}>\r\n {#if control}\r\n <control />\r\n {:else}\r\n <slot />\r\n {/if}\r\n \r\n</div>\r\n<!--div class=\"overflow\">\r\n {#if overflowControl}\r\n <overflowControl />\r\n {:else}\r\n <slot name=\"overflow\" />\r\n {/if}\r\n</div>-->\r\n\r\n<style>\r\n\r\n.label {\r\n grid-column-start: label;\r\n padding: 5px 10px;\r\n vertical-align: middle;\r\n}\r\n.control {\r\n grid-column-start: control;\r\n padding: 5px 10px;\r\n}\r\n.overflow {\r\n grid-column-start: overflow;\r\n}\r\n.full-width {\r\n width: 100%;\r\n}\r\n</style>",
|
||||
"<script>\r\n\r\nexport let containerClass = \"\";\r\nexport let formControls = [];\r\n\r\n</script>\r\n\r\n<div class=\"form-root {containerClass}\">\r\n {#each formControls as formControl}\r\n <formControl />\r\n {:else}\r\n <slot/>\r\n {/each}\r\n</div>\r\n\r\n<style>\r\n.form-root {\r\n display: grid;\r\n grid-template-columns: [label] auto [control] auto; /* [overflow] auto;*/\r\n}\r\n</style>",
|
||||
"<script>\r\nimport Login from \"../Login.svelte\";\r\n</script>\r\n\r\n\r\n<div class=\"current\">\r\n <Login />\r\n</div>\r\n\r\n<style>\r\n.current {\r\n height: 100%;\r\n width: 100%;\r\n}\r\n</style>\r\n\r\n",
|
||||
"<script>\r\n\r\nexport let value=\"\";\r\nexport let hideValue = false;\r\n\r\n</script>\r\n\r\n{#if hideValue}\r\n<input type=\"password\" bind:value={value}/>\r\n{:else}\r\n<input type=\"text\" bind:value={value}/>\r\n{/if}\r\n\r\n<style>\r\ninput {\r\n width: 100%;\r\n}\r\n\r\ninput {\r\n\tfont-family: inherit;\r\n\tfont-size: inherit;\r\n\tpadding: 0.4em;\r\n\tmargin: 0 0 0.5em 0;\r\n\tbox-sizing: border-box;\r\n\tborder: 1px solid #ccc;\r\n border-radius: 2px;\r\n width: 100%;\r\n}\r\n\r\ninput:disabled {\r\n\tcolor: #ccc;\r\n}\r\n\r\n</style>",
|
||||
"<script>\r\nexport let className = \"\";\r\nexport let disabled = false;\r\nexport let contentText;\r\nexport let contentComponent;\r\n</script>\r\n\r\n\r\n<button class={className} {disabled} on:click>\r\n {#if contentComponent}\r\n {contentComponent}\r\n {:else if contentText}\r\n {contentText}\r\n {:else}\r\n <slot />\r\n {/if}\r\n</button>\r\n\r\n\r\n<style>\r\n\r\nbutton {\r\n\tfont-family: inherit;\r\n\tfont-size: inherit;\r\n\tpadding: 0.4em;\r\n\tmargin: 0 0 0.5em 0;\r\n\tbox-sizing: border-box;\r\n\tborder: 1px solid #ccc;\r\n\tborder-radius: 2px;\r\n}\r\n\r\n\r\nbutton {\r\n\tcolor: #333;\r\n\tbackground-color: #f4f4f4;\r\n\toutline: none;\r\n}\r\n\r\nbutton:active {\r\n\tbackground-color: #ddd;\r\n}\r\n\r\nbutton:focus {\r\n\tborder-color: #666;\r\n}\r\n\r\n</style>"
|
||||
],
|
||||
"names": [],
|
||||
"mappings": "AA4CA,KAAK,eAAC,CAAC,AACH,MAAM,CAAE,IAAI,CACZ,QAAQ,IAAI,CACZ,qBAAqB,CAAE,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,CAC3D,kBAAkB,CAAE,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,AAC5D,CAAC,AAED,QAAQ,eAAC,CAAC,AACN,iBAAiB,CAAE,MAAM,CACzB,cAAc,CAAE,MAAM,CACtB,KAAK,CAAE,KAAK,AAChB,CAAC,AAED,eAAe,eAAC,CAAC,AACb,aAAa,CAAE,IAAI;AACvB,CAAC,AAED,8BAAe,CAAG,GAAG,eAAC,CAAC,AACnB,SAAS,CAAE,IAAI,AACnB,CAAC,AAED,uBAAuB,eAAC,CAAC,AACrB,UAAU,CAAE,KAAK,CACjB,UAAU,CAAE,IAAI,AACpB,CAAC;ACrCD,MAAM,cAAC,CAAC,AACJ,iBAAiB,CAAE,KAAK,CACxB,OAAO,CAAE,GAAG,CAAC,IAAI,CACjB,cAAc,CAAE,MAAM,AAC1B,CAAC,AACD,QAAQ,cAAC,CAAC,AACN,iBAAiB,CAAE,OAAO,CAC1B,OAAO,CAAE,GAAG,CAAC,IAAI,AACrB,CAAC,AACD,SAAS,cAAC,CAAC,AACP,iBAAiB,CAAE,QAAQ,AAC/B,CAAC,AACD,WAAW,cAAC,CAAC,AACT,KAAK,CAAE,IAAI,AACf,CAAC;AC7BD,UAAU,cAAC,CAAC,AACR,OAAO,CAAE,IAAI,CACb,qBAAqB,CAAE,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,AACtD,CAAC;ACTD,QAAQ,cAAC,CAAC,AACN,MAAM,CAAE,IAAI,CACZ,KAAK,CAAE,IAAI,AACf,CAAC;ACCD,KAAK,cAAC,CAAC,AACH,KAAK,CAAE,IAAI,AACf,CAAC,AAED,KAAK,cAAC,CAAC,AACN,WAAW,CAAE,OAAO,CACpB,SAAS,CAAE,OAAO,CAClB,OAAO,CAAE,KAAK,CACd,MAAM,CAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CACnB,UAAU,CAAE,UAAU,CACtB,MAAM,CAAE,GAAG,CAAC,KAAK,CAAC,IAAI,CACnB,aAAa,CAAE,GAAG,CAClB,KAAK,CAAE,IAAI,AACf,CAAC,AAED,mBAAK,SAAS,AAAC,CAAC,AACf,KAAK,CAAE,IAAI,AACZ,CAAC;ACVD,MAAM,eAAC,CAAC,AACP,WAAW,CAAE,OAAO,CACpB,SAAS,CAAE,OAAO,CAClB,OAAO,CAAE,KAAK,CACd,MAAM,CAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CACnB,UAAU,CAAE,UAAU,CACtB,MAAM,CAAE,GAAG,CAAC,KAAK,CAAC,IAAI,CACtB,aAAa,CAAE,GAAG,AACnB,CAAC,AAGD,MAAM,eAAC,CAAC,AACP,KAAK,CAAE,IAAI,CACX,gBAAgB,CAAE,OAAO,CACzB,OAAO,CAAE,IAAI,AACd,CAAC,AAED,qBAAM,OAAO,AAAC,CAAC,AACd,gBAAgB,CAAE,IAAI,AACvB,CAAC,AAED,qBAAM,MAAM,AAAC,CAAC,AACb,YAAY,CAAE,IAAI,AACnB,CAAC"
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
|
|
@ -0,0 +1,62 @@
|
|||
html, body {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #333;
|
||||
margin: 0;
|
||||
padding: 8px;
|
||||
box-sizing: border-box;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
|
||||
}
|
||||
|
||||
a {
|
||||
color: rgb(0,100,200);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: rgb(0,80,160);
|
||||
}
|
||||
|
||||
label {
|
||||
display: block;
|
||||
}
|
||||
|
||||
input, button, select, textarea {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
padding: 0.4em;
|
||||
margin: 0 0 0.5em 0;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
input:disabled {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
input[type="range"] {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
button {
|
||||
color: #333;
|
||||
background-color: #f4f4f4;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
button:active {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
border-color: #666;
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset='utf8'>
|
||||
<meta name='viewport' content='width=device-width'>
|
||||
|
||||
<title>Svelte app</title>
|
||||
|
||||
<link rel='icon' type='image/png' href='/favicon.png'>
|
||||
<link rel='stylesheet' href='/global.css'>
|
||||
<link rel='stylesheet' href='/bundle.css'>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<script src='/bundle.js'></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
import svelte from 'rollup-plugin-svelte';
|
||||
import resolve from 'rollup-plugin-node-resolve';
|
||||
import commonjs from 'rollup-plugin-commonjs';
|
||||
import livereload from 'rollup-plugin-livereload';
|
||||
import { terser } from 'rollup-plugin-terser';
|
||||
|
||||
const production = !process.env.ROLLUP_WATCH;
|
||||
|
||||
export default {
|
||||
input: 'src/Test/testMain.js',
|
||||
output: {
|
||||
sourcemap: true,
|
||||
format: 'iife',
|
||||
name: 'app',
|
||||
file: 'public/bundle.js'
|
||||
},
|
||||
plugins: [
|
||||
svelte({
|
||||
// enable run-time checks when not in production
|
||||
dev: !production,
|
||||
// we'll extract any component CSS out into
|
||||
// a separate file — better for performance
|
||||
css: css => {
|
||||
css.write('public/bundle.css');
|
||||
}
|
||||
}),
|
||||
|
||||
// If you have external dependencies installed from
|
||||
// npm, you'll most likely need these plugins. In
|
||||
// some cases you'll need additional configuration —
|
||||
// consult the documentation for details:
|
||||
// https://github.com/rollup/rollup-plugin-commonjs
|
||||
resolve({
|
||||
browser: true,
|
||||
dedupe: importee => importee === 'svelte' || importee.startsWith('svelte/')
|
||||
}),
|
||||
commonjs(),
|
||||
|
||||
// Watch the `public` directory and refresh the
|
||||
// browser on changes when not in production
|
||||
!production && livereload('public'),
|
||||
|
||||
// If we're building for production (npm run build
|
||||
// instead of npm run dev), minify
|
||||
production && terser()
|
||||
],
|
||||
watch: {
|
||||
clearScreen: false
|
||||
}
|
||||
};
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<script>
|
||||
export let className = "default";
|
||||
export let disabled = false;
|
||||
export let contentText;
|
||||
export let contentComponent;
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<button class={className} {disabled} on:click>
|
||||
{#if contentComponent && contentComponent._component}
|
||||
{contentComponent}
|
||||
{:else if contentText}
|
||||
{contentText}
|
||||
{:else}
|
||||
<slot />
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
.default {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
padding: 0.4em;
|
||||
margin: 0 0 0.5em 0;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 2px;
|
||||
color: #333;
|
||||
background-color: #f4f4f4;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.default:active {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
.default:focus {
|
||||
border-color: #666;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<script>
|
||||
|
||||
export let containerClass = "";
|
||||
export let formControls = [];
|
||||
|
||||
</script>
|
||||
|
||||
<div class="form-root {containerClass}">
|
||||
{#each formControls as formControl}
|
||||
<formControl />
|
||||
{:else}
|
||||
<slot/>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.form-root {
|
||||
display: grid;
|
||||
grid-template-columns: [label] auto [control] auto; /* [overflow] auto;*/
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
<script>
|
||||
|
||||
export let containerClass = "";
|
||||
export let labelContainerClass = "";
|
||||
export let controlContainerClass = "";
|
||||
export let label = "";
|
||||
export let control;
|
||||
export let overflowControl;
|
||||
export let fullWidth = false;
|
||||
|
||||
</script>
|
||||
|
||||
<div class="label {labelContainerClass}">{label}</div>
|
||||
<div class="control {controlContainerClass}" class:full-width={fullWidth}>
|
||||
{#if control}
|
||||
<control />
|
||||
{:else}
|
||||
<slot />
|
||||
{/if}
|
||||
|
||||
</div>
|
||||
<!--div class="overflow">
|
||||
{#if overflowControl}
|
||||
<overflowControl />
|
||||
{:else}
|
||||
<slot name="overflow" />
|
||||
{/if}
|
||||
</div>-->
|
||||
|
||||
<style>
|
||||
|
||||
.label {
|
||||
grid-column-start: label;
|
||||
padding: 5px 10px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.control {
|
||||
grid-column-start: control;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
.overflow {
|
||||
grid-column-start: overflow;
|
||||
}
|
||||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,72 @@
|
|||
<script>
|
||||
|
||||
import Textbox from "./Textbox.svelte";
|
||||
import FormControl from "./FormControl.svelte";
|
||||
import Form from "./Form.svelte";
|
||||
import Button from "./Button.svelte";
|
||||
|
||||
export let usernameLabel = "Username";
|
||||
export let passwordLabel = "Password";
|
||||
export let loginButtonLabel = "Login";
|
||||
export let loginRedirect = "";
|
||||
export let logo = "/budibase-logo.png";
|
||||
|
||||
let username = "";
|
||||
let password = "";
|
||||
|
||||
</script>
|
||||
|
||||
<div class="root">
|
||||
|
||||
<div class="content">
|
||||
|
||||
<div class="logo-container">
|
||||
<img src={logo} alt="logo"/>
|
||||
</div>
|
||||
|
||||
<Form>
|
||||
<FormControl label={usernameLabel}>
|
||||
<Textbox bind:value={username} />
|
||||
</FormControl>
|
||||
<FormControl label={passwordLabel}>
|
||||
<Textbox bind:value={password} hideValue=true />
|
||||
</FormControl>
|
||||
</Form>
|
||||
|
||||
<div class="login-button-container">
|
||||
<Button>{loginButtonLabel}</Button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<style>
|
||||
|
||||
.root {
|
||||
height: 100%;
|
||||
display:grid;
|
||||
grid-template-columns: [left] 1fr [middle] auto [right] 1fr;
|
||||
grid-template-rows: [top] 1fr [center] auto [bottom] 1fr;
|
||||
}
|
||||
|
||||
.content {
|
||||
grid-column-start: middle;
|
||||
grid-row-start: center;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.logo-container {
|
||||
margin-bottom: 20px
|
||||
}
|
||||
|
||||
.logo-container > img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.login-button-container {
|
||||
text-align: right;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<script>
|
||||
import Login from "../Login.svelte";
|
||||
</script>
|
||||
|
||||
|
||||
<div class="current">
|
||||
<Login />
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.current {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import App from './TestApp.svelte';
|
||||
|
||||
const app = new App({
|
||||
target: document.body,
|
||||
});
|
||||
|
||||
export default app;
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<script>
|
||||
|
||||
export let value="";
|
||||
export let hideValue = false;
|
||||
export let className = "default";
|
||||
|
||||
</script>
|
||||
|
||||
{#if hideValue}
|
||||
<input class={className} type="password" bind:value={value}/>
|
||||
{:else}
|
||||
<input class={className} type="text" bind:value={value}/>
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
.default {
|
||||
width: 100%;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
padding: 0.4em;
|
||||
margin: 0 0 0.5em 0;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 2px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.default:disabled {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -1,15 +1,44 @@
|
|||
<script>
|
||||
export let className = "";
|
||||
export let className = "default";
|
||||
export let disabled = false;
|
||||
export let contentText = "";
|
||||
export let contentComponent = {};
|
||||
export let contentText;
|
||||
export let contentComponent;
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<button class={className} {disabled} on:click>
|
||||
{#if contentComponent}
|
||||
{#if contentComponent && contentComponent._component}
|
||||
{contentComponent}
|
||||
{:else if contentText}
|
||||
{contentText}
|
||||
{:else}
|
||||
<div>Props..</div>
|
||||
<slot />
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
.default {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
padding: 0.4em;
|
||||
margin: 0 0 0.5em 0;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 2px;
|
||||
color: #333;
|
||||
background-color: #f4f4f4;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.default:active {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
.default:focus {
|
||||
border-color: #666;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -1,40 +1,39 @@
|
|||
main.svelte-j8mzr7{height:100%;width:100%;font-family:"Lato", Helvetica, Arial, sans-serif}
|
||||
.root.svelte-e4n7zy{position:fixed;margin:0 auto;text-align:center;top:20%;width:100%}.inner.svelte-e4n7zy{display:inline-block;margin:auto}.logo.svelte-e4n7zy{width:300px;margin-bottom:40px}.root.svelte-e4n7zy .option{width:250px}.app-link.svelte-e4n7zy{margin-top:10px;display:block}
|
||||
.root.svelte-i0dstr{height:100%}.content.svelte-i0dstr{position:fixed;height:100%;background-color:var(--white);margin:0}
|
||||
.border-normal.svelte-7rfkdx{border-radius:var(--borderradiusall)}.border-left.svelte-7rfkdx{border-radius:var(--borderradius) 0 0 var(--borderradius)}.border-right.svelte-7rfkdx{border-radius:0 var(--borderradius) var(--borderradius) 0}.border-middle.svelte-7rfkdx{border-radius:0}button.svelte-7rfkdx{border-style:solid;padding:7px 15px;cursor:pointer}.primary.svelte-7rfkdx{background-color:var(--primary100);border-color:var(--primary100);color:var(--white)}.primary.svelte-7rfkdx:hover{background-color:var(--primary75);border-color:var(--primary75)}.primary.svelte-7rfkdx:active{background-color:var(--primarydark);border-color:var(--primarydark)}.primary-outline.svelte-7rfkdx{background-color:var(--white);border-color:var(--primary100);color:var(--primary100)}.primary-outline.svelte-7rfkdx:hover{background-color:var(--primary10)}.primary-outline.svelte-7rfkdx:pressed{background-color:var(--primary25)}.secondary.svelte-7rfkdx{background-color:var(--secondary100);border-color:var(--secondary100);color:var(--white)}.secondary.svelte-7rfkdx:hover{background-color:var(--secondary75);border-color:var(--secondary75)}.secondary.svelte-7rfkdx:pressed{background-color:var(--secondarydark);border-color:var(--secondarydark)}.secondary-outline.svelte-7rfkdx{background-color:var(--white);border-color:var(--secondary100);color:var(--secondary100)}.secondary-outline.svelte-7rfkdx:hover{background-color:var(--secondary10)}.secondary-outline.svelte-7rfkdx:pressed{background-color:var(--secondary25)}.success.svelte-7rfkdx{background-color:var(--success100);border-color:var(--success100);color:var(--white)}.success.svelte-7rfkdx:hover{background-color:var(--success75);border-color:var(--success75)}.success.svelte-7rfkdx:pressed{background-color:var(--successdark);border-color:var(--successdark)}.success-outline.svelte-7rfkdx{background-color:var(--white);border-color:var(--success100);color:var(--success100)}.success-outline.svelte-7rfkdx:hover{background-color:var(--success10)}.success-outline.svelte-7rfkdx:pressed{background-color:var(--success25)}.deletion.svelte-7rfkdx{background-color:var(--deletion100);border-color:var(--deletion100);color:var(--white)}.deletion.svelte-7rfkdx:hover{background-color:var(--deletion75);border-color:var(--deletion75)}.deletion.svelte-7rfkdx:pressed{background-color:var(--deletiondark);border-color:var(--deletiondark)}.deletion-outline.svelte-7rfkdx{background-color:var(--white);border-color:var(--deletion100);color:var(--deletion100)}.deletion-outline.svelte-7rfkdx:hover{background-color:var(--deletion10)}.deletion-outline.svelte-7rfkdx:pressed{background-color:var(--deletion25)}
|
||||
.root.svelte-e4n7zy{position:fixed;margin:0 auto;text-align:center;top:20%;width:100%}.inner.svelte-e4n7zy{display:inline-block;margin:auto}.logo.svelte-e4n7zy{width:300px;margin-bottom:40px}.root.svelte-e4n7zy .option{width:250px}.app-link.svelte-e4n7zy{margin-top:10px;display:block}
|
||||
.nav.svelte-lgepe1{height:100%;position:fixed;left:0px;background-color:var(--secondary100);color:var(--darkslate)}.nav.svelte-lgepe1>img.svelte-lgepe1{width:100%;margin-bottom:30px;margin-top:5px;margin-left:0px}
|
||||
.root.svelte-zzs4qg{padding:10px}
|
||||
.root.svelte-ui57a{display:flex;height:100%;position:relative}.hierarchy.svelte-ui57a{flex:0 1 auto;background-color:var(--primary10);overflow-y:auto;height:100%}.node-container.svelte-ui57a{flex:1 1 auto;display:flex;flex-direction:column}.actions-header.svelte-ui57a{flex:0 1 auto}.node-view.svelte-ui57a{overflow-y:auto;flex:1 1 auto}.hierarchy-title-row.svelte-ui57a{padding:15px 7px;font-size:11pt;display:flex;font-weight:bold}.hierarchy-title.svelte-ui57a{flex:auto 1 1}
|
||||
h4.svelte-o0id5a{margin-top:20px}
|
||||
.root.svelte-1dih19s{display:grid;grid-template-columns:[uiNav] 250px [preview] auto [properties] 300px;height:100%;width:100%}.ui-nav.svelte-1dih19s{grid-column-start:uiNav;background-color:var(--primary10);height:100%}.properties-pane.svelte-1dih19s{grid-column-start:properties;background-color:var(--primary10);height:100%}.pages-list-container.svelte-1dih19s{padding-top:20px}.nav-group-header.svelte-1dih19s{font-size:10pt;padding-left:10px}.nav-items-container.svelte-1dih19s{padding-top:10px}.nav-group-header.svelte-1dih19s{display:grid;grid-template-columns:[icon] auto [title] 1fr [button] auto;padding:10px 2px 0px 7px}.nav-group-header.svelte-1dih19s>div.svelte-1dih19s:nth-child(1){padding:0px 7px 0px 0px;vertical-align:bottom;grid-column-start:icon;margin-right:5px}.nav-group-header.svelte-1dih19s>span.svelte-1dih19s:nth-child(2){margin-left:5px;vertical-align:bottom;grid-column-start:title;margin-top:auto}.nav-group-header.svelte-1dih19s>div.svelte-1dih19s:nth-child(3){vertical-align:bottom;grid-column-start:button;cursor:pointer;color:var(--slate)}.nav-group-header.svelte-1dih19s>div.svelte-1dih19s:nth-child(3):hover{color:var(--primary75)}
|
||||
.root.svelte-ui57a{display:flex;height:100%;position:relative}.hierarchy.svelte-ui57a{flex:0 1 auto;background-color:var(--primary10);overflow-y:auto;height:100%}.node-container.svelte-ui57a{flex:1 1 auto;display:flex;flex-direction:column}.actions-header.svelte-ui57a{flex:0 1 auto}.node-view.svelte-ui57a{overflow-y:auto;flex:1 1 auto}.hierarchy-title-row.svelte-ui57a{padding:15px 7px;font-size:11pt;display:flex;font-weight:bold}.hierarchy-title.svelte-ui57a{flex:auto 1 1}
|
||||
.root.svelte-zzs4qg{padding:10px}
|
||||
.root.svelte-1qmjs65{padding:10px}.edit-button.svelte-1qmjs65{cursor:pointer;color:var(--white)}tr.svelte-1qmjs65:hover .edit-button.svelte-1qmjs65{color:var(--secondary75)}
|
||||
.nav-item.svelte-5cf6ht{padding:0px 5px;display:block;padding:10px;color:var(--slate);cursor:pointer}.inner.svelte-5cf6ht{padding:0px 20px 10px 0px;display:inline-block;width:100%}.nav-item.svelte-5cf6ht:hover{background-color:var(--primary25)}.icon.svelte-5cf6ht{font-size:0.9em;display:inline-block;position:relative;top:5px;margin-right:5px;width:100%}.active.svelte-5cf6ht>div.svelte-5cf6ht{background-color:var(--primary10);color:var(--secondary100)}.active.svelte-5cf6ht>div.svelte-5cf6ht:hover{background-color:var(--slate);color:var(--secondary100)}.active.svelte-5cf6ht{background-color:white}
|
||||
.root.svelte-1cnqtw{color:var(--secondary50)}.hierarchy-item.svelte-1cnqtw{cursor:pointer;padding:5px 0px}.hierarchy-item.svelte-1cnqtw:hover{color:var(--secondary75)}.component.svelte-1cnqtw{margin-left:5px}.currentfolder.svelte-1cnqtw{color:var(--secondary100)}.selected.svelte-1cnqtw{color:var(--primary100)}.title.svelte-1cnqtw{margin-left:10px}
|
||||
.root.svelte-ffb307{padding-bottom:10px;padding-left:10px;font-size:16px;color:var(--secondary50)}.hierarchy-item.svelte-ffb307{cursor:pointer;padding:5px 0px}.hierarchy-item.svelte-ffb307:hover{color:var(--secondary75)}.component.svelte-ffb307{margin-left:5px}.selected.svelte-ffb307{color:var(--primary100)}.title.svelte-ffb307{margin-left:10px}
|
||||
.component-preview.svelte-1d56h9p{display:grid;grid-template-rows:[top] 1fr [middle] auto [bottom] 1fr;grid-template-columns:[left] 1fr [middle] auto [right] 1fr;grid-column-start:preview;height:100%}.component-container.svelte-1d56h9p{grid-row-start:middle;grid-column-start:middle}#comonent-container-mock.svelte-1d56h9p{position:fixed;left:-2000px
|
||||
}
|
||||
.root.svelte-xai2hc{height:100%;border-style:solid;border-color:var(--lightslate);border-width:0px 0px 0px 1px}.padding.svelte-xai2hc{padding:0px 5px 0px 10px}.title.svelte-xai2hc{background-color:white;padding:3px;display:grid;grid-template-columns:[name] 1fr [actions] auto}.title.svelte-xai2hc>div.svelte-xai2hc:nth-child(1){grid-column-start:name;color:var(--secondary100)}.title.svelte-xai2hc>div.svelte-xai2hc:nth-child(2){grid-column-start:actions}.section-header.svelte-xai2hc{font-style:italic;color:var(--slate);border-style:solid;border-color:var(--lightslate);border-width:0px 0px 1px 0px}.section-header.svelte-xai2hc{vertical-align:middle;margin-top:20px}
|
||||
button.svelte-4po3k2{border-style:none;background-color:rgba(0,0,0,0);cursor:pointer;outline:none}button.svelte-4po3k2:hover{color:var(--hovercolor)}button.svelte-4po3k2:active{outline:none}
|
||||
.root.svelte-1q40nqm{display:block;font-size:13pt;width:100%;cursor:pointer}.title.svelte-1q40nqm{font:var(--bodytext);padding-top:10px;padding-right:5px;padding-bottom:10px;color:var(--secondary100)}.title.svelte-1q40nqm:hover{background-color:var(--secondary10)}
|
||||
h1.svelte-2ukyrk{font-size:1.2em}
|
||||
.dropdown-background.svelte-179p8ge{position:fixed;top:0;left:0;width:100vw;height:100vh}.root.svelte-179p8ge{cursor:pointer;z-index:1}.dropdown-content.svelte-179p8ge{position:absolute;background-color:var(--white);min-width:160px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);z-index:1;font-weight:normal;border-style:solid;border-width:1px;border-color:var(--secondary10)}.dropdown-content.svelte-179p8ge:not(:focus){display:none}.action-row.svelte-179p8ge{padding:7px 10px;cursor:pointer}.action-row.svelte-179p8ge:hover{background-color:var(--primary100);color:var(--white)}
|
||||
.root.svelte-pq2tmv{height:100%;padding:15px}.allowed-records.svelte-pq2tmv{margin:20px 0px}.allowed-records.svelte-pq2tmv>span.svelte-pq2tmv{margin-right:30px}
|
||||
.root.svelte-1tilbnf{padding:5px;top:0;width:100%}
|
||||
.edit-button.svelte-neetem{cursor:pointer;color:var(--white)}tr.svelte-neetem:hover .edit-button.svelte-neetem{color:var(--secondary75)}
|
||||
.section-container.svelte-1t0x31f{padding:15px;border-style:dotted;border-width:1px;border-color:var(--lightslate);border-radius:2px}.section-container.svelte-1t0x31f:nth-child(1){margin-bottom:15px}.row-text.svelte-1t0x31f{margin-right:15px;color:var(--primary100)}input.svelte-1t0x31f{margin-right:15px}p.svelte-1t0x31f>span.svelte-1t0x31f{margin-left:30px}.header.svelte-1t0x31f{display:grid;grid-template-columns:[title] 1fr [icon] auto}.header.svelte-1t0x31f>div.svelte-1t0x31f:nth-child(1){grid-column-start:title}.header.svelte-1t0x31f>div.svelte-1t0x31f:nth-child(2){grid-column-start:icon}
|
||||
.root.svelte-kswv5p{height:100%;padding:15px}.fields-table.svelte-kswv5p{margin:10px;border-collapse:collapse}.add-field-button.svelte-kswv5p{margin-left:15px;cursor:pointer}.edit-button.svelte-kswv5p{cursor:pointer;color:var(--white)}.edit-button.svelte-kswv5p:hover{color:var(--secondary75)}th.svelte-kswv5p{text-align:left}td.svelte-kswv5p{padding:5px 30px 5px 0px;margin:0}thead.svelte-kswv5p>tr.svelte-kswv5p{border-width:0px 0px 1px 0px;border-style:solid;border-color:var(--secondary75);margin-bottom:20px}tbody.svelte-kswv5p>tr.svelte-kswv5p{border-width:0px 0px 1px 0px;border-style:solid;border-color:var(--primary10)}tbody.svelte-kswv5p>tr.svelte-kswv5p:hover{background-color:var(--primary10)}tbody.svelte-kswv5p>tr:hover .edit-button.svelte-kswv5p{color:var(--secondary75)}.index-container.svelte-kswv5p{border-style:solid;border-width:0 0 1px 0;border-color:var(--secondary25);padding:10px;margin-bottom:5px}.index-label.svelte-kswv5p{color:var(--slate)}.index-name.svelte-kswv5p{font-weight:bold;color:var(--primary100)}.index-container.svelte-kswv5p code.svelte-kswv5p{margin:0;display:inline;background-color:var(--primary10);color:var(--secondary100);padding:3px}.index-field-row.svelte-kswv5p{margin-top:7px}
|
||||
.border-normal.svelte-7rfkdx{border-radius:var(--borderradiusall)}.border-left.svelte-7rfkdx{border-radius:var(--borderradius) 0 0 var(--borderradius)}.border-right.svelte-7rfkdx{border-radius:0 var(--borderradius) var(--borderradius) 0}.border-middle.svelte-7rfkdx{border-radius:0}button.svelte-7rfkdx{border-style:solid;padding:7px 15px;cursor:pointer}.primary.svelte-7rfkdx{background-color:var(--primary100);border-color:var(--primary100);color:var(--white)}.primary.svelte-7rfkdx:hover{background-color:var(--primary75);border-color:var(--primary75)}.primary.svelte-7rfkdx:active{background-color:var(--primarydark);border-color:var(--primarydark)}.primary-outline.svelte-7rfkdx{background-color:var(--white);border-color:var(--primary100);color:var(--primary100)}.primary-outline.svelte-7rfkdx:hover{background-color:var(--primary10)}.primary-outline.svelte-7rfkdx:pressed{background-color:var(--primary25)}.secondary.svelte-7rfkdx{background-color:var(--secondary100);border-color:var(--secondary100);color:var(--white)}.secondary.svelte-7rfkdx:hover{background-color:var(--secondary75);border-color:var(--secondary75)}.secondary.svelte-7rfkdx:pressed{background-color:var(--secondarydark);border-color:var(--secondarydark)}.secondary-outline.svelte-7rfkdx{background-color:var(--white);border-color:var(--secondary100);color:var(--secondary100)}.secondary-outline.svelte-7rfkdx:hover{background-color:var(--secondary10)}.secondary-outline.svelte-7rfkdx:pressed{background-color:var(--secondary25)}.success.svelte-7rfkdx{background-color:var(--success100);border-color:var(--success100);color:var(--white)}.success.svelte-7rfkdx:hover{background-color:var(--success75);border-color:var(--success75)}.success.svelte-7rfkdx:pressed{background-color:var(--successdark);border-color:var(--successdark)}.success-outline.svelte-7rfkdx{background-color:var(--white);border-color:var(--success100);color:var(--success100)}.success-outline.svelte-7rfkdx:hover{background-color:var(--success10)}.success-outline.svelte-7rfkdx:pressed{background-color:var(--success25)}.deletion.svelte-7rfkdx{background-color:var(--deletion100);border-color:var(--deletion100);color:var(--white)}.deletion.svelte-7rfkdx:hover{background-color:var(--deletion75);border-color:var(--deletion75)}.deletion.svelte-7rfkdx:pressed{background-color:var(--deletiondark);border-color:var(--deletiondark)}.deletion-outline.svelte-7rfkdx{background-color:var(--white);border-color:var(--deletion100);color:var(--deletion100)}.deletion-outline.svelte-7rfkdx:hover{background-color:var(--deletion10)}.deletion-outline.svelte-7rfkdx:pressed{background-color:var(--deletion25)}
|
||||
.root.svelte-d6wwkb{display:flex}.root.svelte-d6wwkb:last-child{border-radius:0 var(--borderradius) var(--borderradius) 0}.root.svelte-d6wwkb:first-child{border-radius:var(--borderradius) 0 0 var(--borderradius)}.root.svelte-d6wwkb:not(:first-child):not(:last-child){border-radius:0}
|
||||
.nav-item.svelte-5cf6ht{padding:0px 5px;display:block;padding:10px;color:var(--slate);cursor:pointer}.inner.svelte-5cf6ht{padding:0px 20px 10px 0px;display:inline-block;width:100%}.nav-item.svelte-5cf6ht:hover{background-color:var(--primary25)}.icon.svelte-5cf6ht{font-size:0.9em;display:inline-block;position:relative;top:5px;margin-right:5px;width:100%}.active.svelte-5cf6ht>div.svelte-5cf6ht{background-color:var(--primary10);color:var(--secondary100)}.active.svelte-5cf6ht>div.svelte-5cf6ht:hover{background-color:var(--slate);color:var(--secondary100)}.active.svelte-5cf6ht{background-color:white}
|
||||
.edit-button.svelte-9z4fqi{cursor:pointer;color:var(--white)}tr.svelte-9z4fqi:hover .edit-button.svelte-9z4fqi{color:var(--secondary75)}
|
||||
.root.svelte-1sxai5n{font-size:10pt}.padding.svelte-1sxai5n{padding:0 10px}.inherited-title.svelte-1sxai5n{margin-top:40px;display:grid;grid-template-columns:[name] 1fr [actions] auto;border-style:solid;border-width:0px 0px 1px 0px;border-color:var(--lightslate);font-style:italic}.inherited-title.svelte-1sxai5n>div.svelte-1sxai5n:nth-child(1){grid-column-start:name;color:var(--slate)}.inherited-title.svelte-1sxai5n>div.svelte-1sxai5n:nth-child(2){grid-column-start:actions;color:var(--secondary100)}
|
||||
.edit-button.svelte-neetem{cursor:pointer;color:var(--white)}tr.svelte-neetem:hover .edit-button.svelte-neetem{color:var(--secondary75)}
|
||||
.root.svelte-1q40nqm{display:block;font-size:13pt;width:100%;cursor:pointer}.title.svelte-1q40nqm{font:var(--bodytext);padding-top:10px;padding-right:5px;padding-bottom:10px;color:var(--secondary100)}.title.svelte-1q40nqm:hover{background-color:var(--secondary10)}
|
||||
.root.svelte-kswv5p{height:100%;padding:15px}.fields-table.svelte-kswv5p{margin:10px;border-collapse:collapse}.add-field-button.svelte-kswv5p{margin-left:15px;cursor:pointer}.edit-button.svelte-kswv5p{cursor:pointer;color:var(--white)}.edit-button.svelte-kswv5p:hover{color:var(--secondary75)}th.svelte-kswv5p{text-align:left}td.svelte-kswv5p{padding:5px 30px 5px 0px;margin:0}thead.svelte-kswv5p>tr.svelte-kswv5p{border-width:0px 0px 1px 0px;border-style:solid;border-color:var(--secondary75);margin-bottom:20px}tbody.svelte-kswv5p>tr.svelte-kswv5p{border-width:0px 0px 1px 0px;border-style:solid;border-color:var(--primary10)}tbody.svelte-kswv5p>tr.svelte-kswv5p:hover{background-color:var(--primary10)}tbody.svelte-kswv5p>tr:hover .edit-button.svelte-kswv5p{color:var(--secondary75)}.index-container.svelte-kswv5p{border-style:solid;border-width:0 0 1px 0;border-color:var(--secondary25);padding:10px;margin-bottom:5px}.index-label.svelte-kswv5p{color:var(--slate)}.index-name.svelte-kswv5p{font-weight:bold;color:var(--primary100)}.index-container.svelte-kswv5p code.svelte-kswv5p{margin:0;display:inline;background-color:var(--primary10);color:var(--secondary100);padding:3px}.index-field-row.svelte-kswv5p{margin-top:7px}
|
||||
.root.svelte-1tilbnf{padding:5px;top:0;width:100%}
|
||||
.root.svelte-pq2tmv{height:100%;padding:15px}.allowed-records.svelte-pq2tmv{margin:20px 0px}.allowed-records.svelte-pq2tmv>span.svelte-pq2tmv{margin-right:30px}
|
||||
.dropdown-background.svelte-179p8ge{position:fixed;top:0;left:0;width:100vw;height:100vh}.root.svelte-179p8ge{cursor:pointer;z-index:1}.dropdown-content.svelte-179p8ge{position:absolute;background-color:var(--white);min-width:160px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);z-index:1;font-weight:normal;border-style:solid;border-width:1px;border-color:var(--secondary10)}.dropdown-content.svelte-179p8ge:not(:focus){display:none}.action-row.svelte-179p8ge{padding:7px 10px;cursor:pointer}.action-row.svelte-179p8ge:hover{background-color:var(--primary100);color:var(--white)}
|
||||
.root.svelte-ffb307{padding-bottom:10px;padding-left:10px;font-size:16px;color:var(--secondary50)}.hierarchy-item.svelte-ffb307{cursor:pointer;padding:5px 0px}.hierarchy-item.svelte-ffb307:hover{color:var(--secondary75)}.component.svelte-ffb307{margin-left:5px}.selected.svelte-ffb307{color:var(--primary100)}.title.svelte-ffb307{margin-left:10px}
|
||||
button.svelte-4po3k2{border-style:none;background-color:rgba(0,0,0,0);cursor:pointer;outline:none}button.svelte-4po3k2:hover{color:var(--hovercolor)}button.svelte-4po3k2:active{outline:none}
|
||||
.root.svelte-1cnqtw{color:var(--secondary50)}.hierarchy-item.svelte-1cnqtw{cursor:pointer;padding:5px 0px}.hierarchy-item.svelte-1cnqtw:hover{color:var(--secondary75)}.component.svelte-1cnqtw{margin-left:5px}.currentfolder.svelte-1cnqtw{color:var(--secondary100)}.selected.svelte-1cnqtw{color:var(--primary100)}.title.svelte-1cnqtw{margin-left:10px}
|
||||
.component-preview.svelte-1d56h9p{display:grid;grid-template-rows:[top] 1fr [middle] auto [bottom] 1fr;grid-template-columns:[left] 1fr [middle] auto [right] 1fr;grid-column-start:preview;height:100%}.component-container.svelte-1d56h9p{grid-row-start:middle;grid-column-start:middle}
|
||||
.root.svelte-xai2hc{height:100%;border-style:solid;border-color:var(--lightslate);border-width:0px 0px 0px 1px}.padding.svelte-xai2hc{padding:0px 5px 0px 10px}.title.svelte-xai2hc{background-color:white;padding:3px;display:grid;grid-template-columns:[name] 1fr [actions] auto}.title.svelte-xai2hc>div.svelte-xai2hc:nth-child(1){grid-column-start:name;color:var(--secondary100)}.title.svelte-xai2hc>div.svelte-xai2hc:nth-child(2){grid-column-start:actions}.section-header.svelte-xai2hc{font-style:italic;color:var(--slate);border-style:solid;border-color:var(--lightslate);border-width:0px 0px 1px 0px}.section-header.svelte-xai2hc{vertical-align:middle;margin-top:20px}
|
||||
.section-container.svelte-1t0x31f{padding:15px;border-style:dotted;border-width:1px;border-color:var(--lightslate);border-radius:2px}.section-container.svelte-1t0x31f:nth-child(1){margin-bottom:15px}.row-text.svelte-1t0x31f{margin-right:15px;color:var(--primary100)}input.svelte-1t0x31f{margin-right:15px}p.svelte-1t0x31f>span.svelte-1t0x31f{margin-left:30px}.header.svelte-1t0x31f{display:grid;grid-template-columns:[title] 1fr [icon] auto}.header.svelte-1t0x31f>div.svelte-1t0x31f:nth-child(1){grid-column-start:title}.header.svelte-1t0x31f>div.svelte-1t0x31f:nth-child(2){grid-column-start:icon}
|
||||
h1.svelte-2ukyrk{font-size:1.2em}
|
||||
.info-text.svelte-um9cf7{font-size:0.8em;color:var(--slate)}
|
||||
.component.svelte-13tuzj8{padding:5px;border-style:solid;border-width:0 0 1px 0;border-color:var(--lightslate);cursor:pointer}.component.svelte-13tuzj8:hover{background-color:var(--primary10)}.component.svelte-13tuzj8>.title.svelte-13tuzj8{font-size:13pt;color:var(--secondary100)}.component.svelte-13tuzj8>.description.svelte-13tuzj8{font-size:10pt;color:var(--primary75);font-style:italic}
|
||||
.title.svelte-1pp53c5{padding:3px;background-color:white;color:var(--secondary100);border-style:solid;border-width:1px 0 0 0;border-color:var(--lightslate)}.title.svelte-1pp53c5>span.svelte-1pp53c5{margin-left:10px}
|
||||
.root.svelte-bv289q{padding:10px}.option-container.svelte-bv289q{border-style:dotted;border-width:1px;border-color:var(--primary75);padding:3px;margin-right:5px}
|
||||
textarea.svelte-1ooq0hh{padding:3px;background:var(--darkslate);color:var(--white);font-family:'Courier New', Courier, monospace;width:95%;height:100px}
|
||||
.error-container.svelte-jwy920{padding:10px;border-style:solid;border-color:var(--deletion100);border-radius:var(--borderradiusall);background:var(--deletion75)}.error-row.svelte-jwy920{padding:5px 0px}
|
||||
.root.svelte-bv289q{padding:10px}.option-container.svelte-bv289q{border-style:dotted;border-width:1px;border-color:var(--primary75);padding:3px;margin-right:5px}
|
||||
.title.svelte-1pp53c5{padding:3px;background-color:white;color:var(--secondary100);border-style:solid;border-width:1px 0 0 0;border-color:var(--lightslate)}.title.svelte-1pp53c5>span.svelte-1pp53c5{margin-left:10px}
|
||||
.root.svelte-1sxai5n{font-size:10pt}.padding.svelte-1sxai5n{padding:0 10px}.inherited-title.svelte-1sxai5n{margin-top:40px;display:grid;grid-template-columns:[name] 1fr [actions] auto;border-style:solid;border-width:0px 0px 1px 0px;border-color:var(--lightslate);font-style:italic}.inherited-title.svelte-1sxai5n>div.svelte-1sxai5n:nth-child(1){grid-column-start:name;color:var(--slate)}.inherited-title.svelte-1sxai5n>div.svelte-1sxai5n:nth-child(2){grid-column-start:actions;color:var(--secondary100)}
|
||||
.component.svelte-13tuzj8{padding:5px;border-style:solid;border-width:0 0 1px 0;border-color:var(--lightslate);cursor:pointer}.component.svelte-13tuzj8:hover{background-color:var(--primary10)}.component.svelte-13tuzj8>.title.svelte-13tuzj8{font-size:13pt;color:var(--secondary100)}.component.svelte-13tuzj8>.description.svelte-13tuzj8{font-size:10pt;color:var(--primary75);font-style:italic}
|
||||
input.svelte-66516k{margin-right:7px}
|
||||
textarea.svelte-1wfv4cc{width:300px;height:200px}
|
||||
.root.svelte-woqcuf{display:grid;grid-template-columns:[name] 1fr [actions] auto}.root.svelte-woqcuf>div.svelte-woqcuf:nth-child(1){grid-column-start:name;color:var(--secondary50)}.root.svelte-woqcuf>div.svelte-woqcuf:nth-child(2){grid-column-start:actions}.selectedname.svelte-woqcuf{font-weight:bold;color:var(--secondary)}
|
||||
.root.svelte-w5on8s{padding:3px 5px 7px 10px;border-style:dotted;border-width:0 0 1px 0;border-color:var(--primary25)}
|
||||
textarea.svelte-1wfv4cc{width:300px;height:200px}
|
||||
|
||||
/*# sourceMappingURL=bundle.css.map */
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -256,9 +256,6 @@
|
|||
function onMount(fn) {
|
||||
get_current_component().$$.on_mount.push(fn);
|
||||
}
|
||||
function afterUpdate(fn) {
|
||||
get_current_component().$$.after_update.push(fn);
|
||||
}
|
||||
// TODO figure out if we still want to support
|
||||
// shorthand events, or if we want to implement
|
||||
// a real bubbling mechanism
|
||||
|
|
@ -549,40 +546,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
function get_spread_update(levels, updates) {
|
||||
const update = {};
|
||||
const to_null_out = {};
|
||||
const accounted_for = { $$scope: 1 };
|
||||
let i = levels.length;
|
||||
while (i--) {
|
||||
const o = levels[i];
|
||||
const n = updates[i];
|
||||
if (n) {
|
||||
for (const key in o) {
|
||||
if (!(key in n))
|
||||
to_null_out[key] = 1;
|
||||
}
|
||||
for (const key in n) {
|
||||
if (!accounted_for[key]) {
|
||||
update[key] = n[key];
|
||||
accounted_for[key] = 1;
|
||||
}
|
||||
}
|
||||
levels[i] = n;
|
||||
}
|
||||
else {
|
||||
for (const key in o) {
|
||||
accounted_for[key] = 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
for (const key in to_null_out) {
|
||||
if (!(key in update))
|
||||
update[key] = undefined;
|
||||
}
|
||||
return update;
|
||||
}
|
||||
|
||||
function bind(component, name, callback) {
|
||||
if (component.$$.props.indexOf(name) === -1)
|
||||
return;
|
||||
|
|
@ -28186,9 +28149,13 @@
|
|||
if(isRootComponent(component)) {
|
||||
subComponentProps = subComponentProps||{};
|
||||
const p = createProps(cname, component.props, subComponentProps);
|
||||
const rootProps = createProps(cname, component.props);
|
||||
const inheritedProps = [];
|
||||
const targetComponent = stack.length > 0
|
||||
? fp_12(stack)
|
||||
: component;
|
||||
if(stack.length > 0) {
|
||||
const targetComponent = stack[0];
|
||||
|
||||
for(let prop in subComponentProps) {
|
||||
const hasProp = pipe(targetComponent.props, [
|
||||
fp_30,
|
||||
|
|
@ -28200,24 +28167,27 @@
|
|||
}
|
||||
const unsetProps = pipe(p.props, [
|
||||
fp_30,
|
||||
fp_8(k => !fp_11(k)(fp_30(subComponentProps)))
|
||||
fp_8(k => !fp_11(k)(fp_30(subComponentProps)) && k !== "_component")
|
||||
]);
|
||||
|
||||
const fullProps = fp_4(p.props);
|
||||
fullProps._component = targetComponent.name;
|
||||
|
||||
return ({
|
||||
propsDefinition:expandPropsDefinition(component.props),
|
||||
inheritedProps,
|
||||
rootDefaultProps: p.props,
|
||||
rootDefaultProps: rootProps.props,
|
||||
unsetProps,
|
||||
fullProps: p.props,
|
||||
fullProps: fullProps,
|
||||
errors: p.errors,
|
||||
component: stack.length > 0 ? stack[0] : component,
|
||||
component: targetComponent,
|
||||
rootComponent: component
|
||||
});
|
||||
}
|
||||
return getComponentInfo(
|
||||
allComponents,
|
||||
component.inherits,
|
||||
[...stack, component],
|
||||
[component, ...stack],
|
||||
{...component.props, ...subComponentProps});
|
||||
};
|
||||
|
||||
|
|
@ -28287,18 +28257,18 @@
|
|||
|
||||
const loadLibs = async (appName, appPackage) => {
|
||||
|
||||
const makeUrl = l =>
|
||||
`/_builder/api/${appName}/componentlibrary?lib=${encodeURI(l)}`;
|
||||
|
||||
const allLibraries = {};
|
||||
for(let lib of appPackage.pages.componentLibraries) {
|
||||
const libModule = await import(makeUrl(lib));
|
||||
const libModule = await import(makeLibraryUrl(appName, lib));
|
||||
allLibraries[lib] = libModule;
|
||||
}
|
||||
|
||||
return allLibraries;
|
||||
};
|
||||
|
||||
const makeLibraryUrl = (appName, lib) =>
|
||||
`/_builder/api/${appName}/componentlibrary?lib=${encodeURI(lib)}`;
|
||||
|
||||
const getStore = () => {
|
||||
|
||||
const initial = {
|
||||
|
|
@ -28314,6 +28284,7 @@
|
|||
currentFrontEndItem:null,
|
||||
currentComponentInfo:null,
|
||||
currentComponentIsNew:false,
|
||||
currentPageName: "",
|
||||
currentNodeIsNew: false,
|
||||
errors: [],
|
||||
activeNav: "database",
|
||||
|
|
@ -28354,6 +28325,7 @@
|
|||
store.removeComponentLibrary =removeComponentLibrary(store);
|
||||
store.addStylesheet = addStylesheet(store);
|
||||
store.removeStylesheet = removeStylesheet(store);
|
||||
store.savePage = savePage(store);
|
||||
return store;
|
||||
};
|
||||
|
||||
|
|
@ -28378,6 +28350,7 @@
|
|||
initial.hasAppPackage = true;
|
||||
initial.hierarchy = pkg.appDefinition.hierarchy;
|
||||
initial.accessLevels = pkg.accessLevels;
|
||||
initial.derivedComponents = pkg.derivedComponents;
|
||||
initial.allComponents = combineComponents(
|
||||
pkg.derivedComponents, pkg.rootComponents);
|
||||
initial.actions = fp_2((arr, action) => {
|
||||
|
|
@ -28721,6 +28694,18 @@
|
|||
});
|
||||
};
|
||||
|
||||
const savePage = store => async page => {
|
||||
store.update(s => {
|
||||
if(s.currentFrontEndIsComponent || !s.currentFrontEndItem) {
|
||||
return;
|
||||
}
|
||||
|
||||
s.pages[currentPageName] = page;
|
||||
savePackage();
|
||||
|
||||
});
|
||||
};
|
||||
|
||||
const addComponentLibrary = store => async lib => {
|
||||
|
||||
const response =
|
||||
|
|
@ -28836,9 +28821,9 @@
|
|||
|
||||
const setCurrentPage = store => pageName => {
|
||||
store.update(s => {
|
||||
const props = s.pages[pageName];
|
||||
s.currentFrontEndItem = {props, name:pageName};
|
||||
s.currentFrontEndItem = s.pages[pageName];
|
||||
s.currentFrontEndIsComponent = false;
|
||||
s.currentPageName = pageName;
|
||||
return s;
|
||||
});
|
||||
};
|
||||
|
|
@ -31404,7 +31389,7 @@
|
|||
|
||||
/******/ });
|
||||
});
|
||||
//# sourceMappingURL=feather.js.map
|
||||
|
||||
});
|
||||
|
||||
var feather$1 = unwrapExports(feather);
|
||||
|
|
@ -55974,9 +55959,9 @@
|
|||
add_location(span0, file$u, 155, 12, 4277);
|
||||
attr(div0, "class", "section-header padding svelte-xai2hc");
|
||||
add_location(div0, file$u, 154, 8, 4157);
|
||||
add_location(span1, file$u, 176, 12, 5092);
|
||||
add_location(span1, file$u, 177, 12, 5154);
|
||||
attr(div1, "class", "section-header padding svelte-xai2hc");
|
||||
add_location(div1, file$u, 175, 8, 5042);
|
||||
add_location(div1, file$u, 176, 8, 5104);
|
||||
add_location(div2, file$u, 152, 4, 4140);
|
||||
dispose = listen(div0, "click", ctx.click_handler);
|
||||
},
|
||||
|
|
@ -56126,6 +56111,7 @@
|
|||
let textbox0_props = {
|
||||
label: "Name",
|
||||
infoText: "use forward slash to store in subfolders",
|
||||
disabled: !ctx.$store.currentComponentIsNew,
|
||||
hasError: !!ctx.nameInvalid
|
||||
};
|
||||
if (ctx.name !== void 0) {
|
||||
|
|
@ -56177,7 +56163,7 @@
|
|||
t2 = space();
|
||||
textbox2.$$.fragment.c();
|
||||
attr(div0, "class", "info-text");
|
||||
add_location(div0, file$u, 165, 12, 4725);
|
||||
add_location(div0, file$u, 166, 12, 4787);
|
||||
attr(div1, "class", "padding svelte-xai2hc");
|
||||
add_location(div1, file$u, 160, 8, 4495);
|
||||
},
|
||||
|
|
@ -56196,6 +56182,7 @@
|
|||
|
||||
p: function update(changed, ctx) {
|
||||
var textbox0_changes = {};
|
||||
if (changed.$store) textbox0_changes.disabled = !ctx.$store.currentComponentIsNew;
|
||||
if (changed.nameInvalid) textbox0_changes.hasError = !!ctx.nameInvalid;
|
||||
if (!updating_text && changed.name) {
|
||||
textbox0_changes.text = ctx.name;
|
||||
|
|
@ -56247,7 +56234,7 @@
|
|||
};
|
||||
}
|
||||
|
||||
// (206:16) <Button grouped on:click={confirmDeleteComponent}>
|
||||
// (207:16) <Button grouped on:click={confirmDeleteComponent}>
|
||||
function create_default_slot_2$3(ctx) {
|
||||
var t;
|
||||
|
||||
|
|
@ -56268,7 +56255,7 @@
|
|||
};
|
||||
}
|
||||
|
||||
// (210:16) <Button grouped on:click={hideDialog} color="secondary" >
|
||||
// (211:16) <Button grouped on:click={hideDialog} color="secondary" >
|
||||
function create_default_slot_1$3(ctx) {
|
||||
var t;
|
||||
|
||||
|
|
@ -56289,7 +56276,7 @@
|
|||
};
|
||||
}
|
||||
|
||||
// (205:12) <ButtonGroup>
|
||||
// (206:12) <ButtonGroup>
|
||||
function create_default_slot$4(ctx) {
|
||||
var t, current;
|
||||
|
||||
|
|
@ -56446,16 +56433,16 @@
|
|||
attr(div3, "class", "root svelte-xai2hc");
|
||||
add_location(div3, file$u, 130, 0, 3304);
|
||||
attr(div4, "class", "uk-modal-header");
|
||||
add_location(div4, file$u, 195, 8, 5436);
|
||||
add_location(div4, file$u, 196, 8, 5498);
|
||||
attr(div5, "class", "uk-modal-body");
|
||||
add_location(div5, file$u, 199, 8, 5533);
|
||||
add_location(div5, file$u, 200, 8, 5595);
|
||||
attr(div6, "class", "uk-modal-footer");
|
||||
add_location(div6, file$u, 203, 8, 5650);
|
||||
add_location(div6, file$u, 204, 8, 5712);
|
||||
attr(div7, "class", "uk-modal-dialog");
|
||||
add_location(div7, file$u, 193, 4, 5395);
|
||||
add_location(div7, file$u, 194, 4, 5457);
|
||||
attr(div8, "uk-modal", "");
|
||||
attr(div8, "class", "svelte-xai2hc");
|
||||
add_location(div8, file$u, 192, 0, 5350);
|
||||
add_location(div8, file$u, 193, 0, 5412);
|
||||
},
|
||||
|
||||
l: function claim(nodes) {
|
||||
|
|
@ -56569,6 +56556,11 @@
|
|||
}
|
||||
|
||||
function instance$t($$self, $$props, $$invalidate) {
|
||||
let $store;
|
||||
|
||||
validate_store(store, 'store');
|
||||
subscribe($$self, store, $$value => { $store = $$value; $$invalidate('$store', $store); });
|
||||
|
||||
|
||||
|
||||
let component;
|
||||
|
|
@ -56720,6 +56712,7 @@
|
|||
componentInstanceCancelEdit,
|
||||
componentInstancePropsChanged,
|
||||
shortName,
|
||||
$store,
|
||||
click_handler,
|
||||
textbox0_text_binding,
|
||||
textbox1_text_binding,
|
||||
|
|
@ -56896,55 +56889,40 @@
|
|||
const file$w = "src\\userInterface\\CurrentItemPreview.svelte";
|
||||
|
||||
function create_fragment$v(ctx) {
|
||||
var div1, div0, iframe, iframe_srcdoc_value, t, div2, current;
|
||||
|
||||
var switch_instance_spread_levels = [
|
||||
ctx.$store.currentComponentInfo.fullProps
|
||||
];
|
||||
|
||||
var switch_value = ctx.component;
|
||||
|
||||
function switch_props(ctx) {
|
||||
let switch_instance_props = {};
|
||||
for (var i = 0; i < switch_instance_spread_levels.length; i += 1) {
|
||||
switch_instance_props = assign(switch_instance_props, switch_instance_spread_levels[i]);
|
||||
}
|
||||
return {
|
||||
props: switch_instance_props,
|
||||
$$inline: true
|
||||
};
|
||||
}
|
||||
|
||||
if (switch_value) {
|
||||
var switch_instance = new switch_value(switch_props());
|
||||
}
|
||||
var div1, div0, iframe_1, iframe_1_srcdoc_value, dispose;
|
||||
|
||||
return {
|
||||
c: function create() {
|
||||
div1 = element("div");
|
||||
div0 = element("div");
|
||||
iframe = element("iframe");
|
||||
t = space();
|
||||
div2 = element("div");
|
||||
if (switch_instance) switch_instance.$$.fragment.c();
|
||||
attr(iframe, "title", "componentPreview");
|
||||
attr(iframe, "srcdoc", iframe_srcdoc_value = `<html>
|
||||
iframe_1 = element("iframe");
|
||||
attr(iframe_1, "title", "componentPreview");
|
||||
attr(iframe_1, "srcdoc", iframe_1_srcdoc_value = `<html>
|
||||
|
||||
<head>
|
||||
${ctx.stylesheetLinks}
|
||||
</head>
|
||||
<body>
|
||||
${ctx.componentHtml}
|
||||
</body>
|
||||
</html>`);
|
||||
add_location(iframe, file$w, 38, 8, 881);
|
||||
<head>
|
||||
${ctx.stylesheetLinks}
|
||||
<script>
|
||||
|
||||
import('${ctx.componentLibraryUrl}')
|
||||
.then(module => {
|
||||
const componentClass = module['${ctx.rootComponentName}'];
|
||||
const instance = new componentClass({
|
||||
target: document.body,
|
||||
props: JSON.parse('${JSON.stringify(ctx.props)}')
|
||||
}) ;
|
||||
})
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>`);
|
||||
add_location(iframe_1, file$w, 52, 8, 1422);
|
||||
attr(div0, "class", "component-container svelte-1d56h9p");
|
||||
add_location(div0, file$w, 37, 4, 838);
|
||||
add_location(div0, file$w, 51, 4, 1379);
|
||||
attr(div1, "class", "component-preview svelte-1d56h9p");
|
||||
add_location(div1, file$w, 36, 0, 800);
|
||||
attr(div2, "id", "comonent-container-mock");
|
||||
attr(div2, "class", "svelte-1d56h9p");
|
||||
add_location(div2, file$w, 52, 0, 1195);
|
||||
add_location(div1, file$w, 50, 0, 1341);
|
||||
dispose = listen(iframe_1, "load", ctx.iframeLoaded);
|
||||
},
|
||||
|
||||
l: function claim(nodes) {
|
||||
|
|
@ -56954,118 +56932,100 @@
|
|||
m: function mount(target, anchor) {
|
||||
insert(target, div1, anchor);
|
||||
append(div1, div0);
|
||||
append(div0, iframe);
|
||||
insert(target, t, anchor);
|
||||
insert(target, div2, anchor);
|
||||
|
||||
if (switch_instance) {
|
||||
mount_component(switch_instance, div2, null);
|
||||
}
|
||||
|
||||
current = true;
|
||||
append(div0, iframe_1);
|
||||
ctx.iframe_1_binding(iframe_1);
|
||||
},
|
||||
|
||||
p: function update(changed, ctx) {
|
||||
if ((!current || changed.stylesheetLinks || changed.componentHtml) && iframe_srcdoc_value !== (iframe_srcdoc_value = `<html>
|
||||
if ((changed.stylesheetLinks || changed.componentLibraryUrl || changed.rootComponentName || changed.props) && iframe_1_srcdoc_value !== (iframe_1_srcdoc_value = `<html>
|
||||
|
||||
<head>
|
||||
${ctx.stylesheetLinks}
|
||||
</head>
|
||||
<body>
|
||||
${ctx.componentHtml}
|
||||
</body>
|
||||
</html>`)) {
|
||||
attr(iframe, "srcdoc", iframe_srcdoc_value);
|
||||
}
|
||||
<head>
|
||||
${ctx.stylesheetLinks}
|
||||
<script>
|
||||
|
||||
var switch_instance_changes = changed.$store ? get_spread_update(switch_instance_spread_levels, [
|
||||
ctx.$store.currentComponentInfo.fullProps
|
||||
]) : {};
|
||||
import('${ctx.componentLibraryUrl}')
|
||||
.then(module => {
|
||||
const componentClass = module['${ctx.rootComponentName}'];
|
||||
const instance = new componentClass({
|
||||
target: document.body,
|
||||
props: JSON.parse('${JSON.stringify(ctx.props)}')
|
||||
}) ;
|
||||
})
|
||||
|
||||
if (switch_value !== (switch_value = ctx.component)) {
|
||||
if (switch_instance) {
|
||||
group_outros();
|
||||
const old_component = switch_instance;
|
||||
transition_out(old_component.$$.fragment, 1, 0, () => {
|
||||
destroy_component(old_component, 1);
|
||||
});
|
||||
check_outros();
|
||||
}
|
||||
|
||||
if (switch_value) {
|
||||
switch_instance = new switch_value(switch_props());
|
||||
|
||||
switch_instance.$$.fragment.c();
|
||||
transition_in(switch_instance.$$.fragment, 1);
|
||||
mount_component(switch_instance, div2, null);
|
||||
} else {
|
||||
switch_instance = null;
|
||||
}
|
||||
}
|
||||
|
||||
else if (switch_value) {
|
||||
switch_instance.$set(switch_instance_changes);
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>`)) {
|
||||
attr(iframe_1, "srcdoc", iframe_1_srcdoc_value);
|
||||
}
|
||||
},
|
||||
|
||||
i: function intro(local) {
|
||||
if (current) return;
|
||||
if (switch_instance) transition_in(switch_instance.$$.fragment, local);
|
||||
|
||||
current = true;
|
||||
},
|
||||
|
||||
o: function outro(local) {
|
||||
if (switch_instance) transition_out(switch_instance.$$.fragment, local);
|
||||
current = false;
|
||||
},
|
||||
i: noop,
|
||||
o: noop,
|
||||
|
||||
d: function destroy(detaching) {
|
||||
if (detaching) {
|
||||
detach(div1);
|
||||
detach(t);
|
||||
detach(div2);
|
||||
}
|
||||
|
||||
if (switch_instance) destroy_component(switch_instance);
|
||||
ctx.iframe_1_binding(null);
|
||||
dispose();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function instance$v($$self, $$props, $$invalidate) {
|
||||
let $store;
|
||||
|
||||
validate_store(store, 'store');
|
||||
subscribe($$self, store, $$value => { $store = $$value; $$invalidate('$store', $store); });
|
||||
|
||||
|
||||
|
||||
let component;
|
||||
let stylesheetLinks = "";
|
||||
let componentHtml = "";
|
||||
let props;
|
||||
let componentLibraryUrl = "";
|
||||
let rootComponentName = "";
|
||||
let iframe;
|
||||
|
||||
store.subscribe(s => {
|
||||
const {componentName, libName} = splitName(
|
||||
s.currentComponentInfo.rootComponent.name);
|
||||
|
||||
$$invalidate('component', component = s.libraries[libName][componentName]);
|
||||
$$invalidate('rootComponentName', rootComponentName = componentName);
|
||||
$$invalidate('props', props = s.currentComponentInfo.fullProps);
|
||||
component = s.libraries[libName][componentName];
|
||||
$$invalidate('stylesheetLinks', stylesheetLinks = pipe(s.pages.stylesheets, [
|
||||
fp_7(s => `<link rel="stylesheet" href="${s}"/>`),
|
||||
fp_39("\n")
|
||||
]));
|
||||
$$invalidate('componentLibraryUrl', componentLibraryUrl = makeLibraryUrl(s.appname, libName));
|
||||
});
|
||||
|
||||
|
||||
|
||||
/*
|
||||
afterUpdate(() => {
|
||||
$$invalidate('componentHtml', componentHtml = document.getElementById("comonent-container-mock").innerHTML);
|
||||
if(iframe) iframeLoaded();
|
||||
});
|
||||
*/
|
||||
|
||||
const iframeLoaded = () => {
|
||||
setTimeout(() => {
|
||||
iframe.style.height = (iframe.contentWindow.document.body.scrollHeight + 1).toString() + "px"; $$invalidate('iframe', iframe);
|
||||
iframe.style.width = (iframe.contentWindow.document.body.scrollWidth + 1).toString() + "px"; $$invalidate('iframe', iframe);
|
||||
}, 100);
|
||||
};
|
||||
|
||||
function iframe_1_binding($$value) {
|
||||
binding_callbacks[$$value ? 'unshift' : 'push'](() => {
|
||||
$$invalidate('iframe', iframe = $$value);
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
component,
|
||||
stylesheetLinks,
|
||||
componentHtml,
|
||||
$store
|
||||
props,
|
||||
componentLibraryUrl,
|
||||
rootComponentName,
|
||||
iframe,
|
||||
iframeLoaded,
|
||||
iframe_1_binding
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -57761,7 +57721,7 @@
|
|||
iconbutton1.$on("click", ctx.newComponent);
|
||||
|
||||
var componentshierarchy = new ComponentsHierarchy({
|
||||
props: { components: ctx.$store.allComponents },
|
||||
props: { components: ctx.$store.derivedComponents },
|
||||
$$inline: true
|
||||
});
|
||||
|
||||
|
|
@ -57838,20 +57798,20 @@
|
|||
attr(div4, "class", "components-list-container");
|
||||
add_location(div4, file$y, 30, 8, 805);
|
||||
attr(div5, "class", "svelte-1dih19s");
|
||||
add_location(div5, file$y, 49, 16, 1555);
|
||||
add_location(div5, file$y, 49, 16, 1559);
|
||||
attr(span1, "class", "svelte-1dih19s");
|
||||
add_location(span1, file$y, 50, 16, 1611);
|
||||
add_location(span1, file$y, 50, 16, 1615);
|
||||
attr(div6, "class", "nav-group-header svelte-1dih19s");
|
||||
add_location(div6, file$y, 48, 12, 1508);
|
||||
add_location(div6, file$y, 48, 12, 1512);
|
||||
attr(div7, "class", "nav-items-container svelte-1dih19s");
|
||||
add_location(div7, file$y, 52, 12, 1661);
|
||||
add_location(div7, file$y, 52, 12, 1665);
|
||||
attr(div8, "class", "pages-list-container svelte-1dih19s");
|
||||
add_location(div8, file$y, 47, 8, 1461);
|
||||
add_location(div8, file$y, 47, 8, 1465);
|
||||
attr(div9, "class", "ui-nav svelte-1dih19s");
|
||||
add_location(div9, file$y, 28, 4, 775);
|
||||
add_location(div10, file$y, 59, 4, 1776);
|
||||
add_location(div10, file$y, 59, 4, 1780);
|
||||
attr(div11, "class", "properties-pane svelte-1dih19s");
|
||||
add_location(div11, file$y, 65, 4, 1885);
|
||||
add_location(div11, file$y, 65, 4, 1889);
|
||||
attr(div12, "class", "root svelte-1dih19s");
|
||||
add_location(div12, file$y, 26, 0, 747);
|
||||
},
|
||||
|
|
@ -57902,7 +57862,7 @@
|
|||
|
||||
p: function update(changed, ctx) {
|
||||
var componentshierarchy_changes = {};
|
||||
if (changed.$store) componentshierarchy_changes.components = ctx.$store.allComponents;
|
||||
if (changed.$store) componentshierarchy_changes.components = ctx.$store.derivedComponents;
|
||||
componentshierarchy.$set(componentshierarchy_changes);
|
||||
|
||||
if (ctx.$store.currentFrontEndItem) {
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue