budibase/packages/server/builder/bundle.css.map

{
  "version": 3,
  "file": "bundle.css",
  "sources": [
    "..\\..\\builder\\src\\App.svelte",
    "..\\..\\builder\\src\\PackageRoot.svelte",
    "..\\..\\builder\\src\\NoPackage.svelte",
    "..\\..\\builder\\src\\nav\\Nav.svelte",
    "..\\..\\builder\\src\\database\\DatabaseRoot.svelte",
    "..\\..\\builder\\src\\actionsAndTriggers\\ActionsAndTriggersRoot.svelte",
    "..\\..\\builder\\src\\common\\ComingSoon.svelte",
    "..\\..\\builder\\src\\userInterface\\UserInterfaceRoot.svelte",
    "..\\..\\builder\\src\\common\\Button.svelte",
    "..\\..\\builder\\src\\accessLevels\\AccessLevelsRoot.svelte",
    "..\\..\\builder\\src\\nav\\NavItem.svelte",
    "..\\..\\builder\\src\\database\\HierarchyRow.svelte",
    "..\\..\\builder\\src\\database\\RecordView.svelte",
    "..\\..\\builder\\src\\database\\IndexView.svelte",
    "..\\..\\builder\\src\\common\\ButtonGroup.svelte",
    "..\\..\\builder\\src\\database\\ActionsHeader.svelte",
    "..\\..\\builder\\src\\actionsAndTriggers\\Triggers.svelte",
    "..\\..\\builder\\src\\common\\DropdownButton.svelte",
    "..\\..\\builder\\src\\userInterface\\ComponentsHierarchy.svelte",
    "..\\..\\builder\\src\\actionsAndTriggers\\Actions.svelte",
    "..\\..\\builder\\src\\userInterface\\PagesList.svelte",
    "..\\..\\builder\\src\\common\\CodeArea.svelte",
    "..\\..\\builder\\src\\common\\Textbox.svelte",
    "..\\..\\builder\\src\\common\\ErrorsBox.svelte",
    "..\\..\\builder\\src\\common\\Dropdown.svelte",
    "..\\..\\builder\\src\\common\\Checkbox.svelte",
    "..\\..\\builder\\src\\actionsAndTriggers\\ActionView.svelte",
    "..\\..\\builder\\src\\common\\DatePicker.svelte",
    "..\\..\\builder\\src\\common\\NumberBox.svelte",
    "..\\..\\builder\\src\\common\\ValuesList.svelte"
  ],
  "sourcesContent": [
    "<script>\n\t\n\timport NoPackage from \"./NoPackage.svelte\";\n\timport PackageRoot from \"./PackageRoot.svelte\";\n\timport {store, initialise} from \"./builderStore\";\n\timport { onMount } from 'svelte';\n\t\n\tlet init = initialise();\n\n</script>\n\n<main>\n\n\t{#await init}\n\t\n\t\t<h1>loading</h1>\n\n\t{:then result}\n\t\t{#if $store.hasAppPackage}\n\t\t<PackageRoot />\n\t\t{/if}\n\n\t\t{#if !$store.hasAppPackage}\n\t\t<NoPackage />\n\t\t{/if}\n\n\t{:catch err}\n\t\t<h1 style=\"color:red\">{err}</h1>\n\t{/await}\n</main>\n\n<style>\n\tmain {\n\t\theight: 100%;\n\t\twidth: 100%;\n\t\tfont-family: \"Lato\", Helvetica, Arial, sans-serif;\n\t}\n</style>",
    "<script>\r\n\r\nimport Nav from \"./nav/Nav.svelte\";\r\nimport Database from \"./database/DatabaseRoot.svelte\" ;\r\nimport UserInterface from \"./userInterface/UserInterfaceRoot.svelte\" ;\r\nimport ActionsAndTriggers from \"./actionsAndTriggers/ActionsAndTriggersRoot.svelte\" ;\r\nimport AccessLevels from \"./accessLevels/AccessLevelsRoot.svelte\" ;\r\nimport ComingSoon from \"./common/ComingSoon.svelte\";\r\n\r\nimport {store} from \"./builderStore\";\r\n\r\nexport let navWidth = \"50px\";\r\n\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n  <Nav width={navWidth} />\r\n  <div class=\"content\" \r\n       style=\"width: calc(100% - {navWidth}); left: {navWidth}\"> \r\n    {#if $store.activeNav === \"database\"}\r\n    <Database />\r\n    {:else if $store.activeNav === \"actions\"}\r\n    <ActionsAndTriggers />\r\n    {:else if $store.activeNav === \"access levels\"}\r\n    <AccessLevels />\r\n    {:else if $store.activeNav === \"user interface\"}\r\n    <UserInterface />\r\n    {/if}\r\n  </div>\r\n</div>\r\n\r\n\r\n\r\n<style>\r\n\t.root {\r\n    height: 100%;\r\n\t}\r\n  \r\n\r\n  .content {\r\n    position: fixed;\r\n    height: 100%;\r\n    background-color: var(--white);\r\n    margin:0;\r\n  }\r\n\r\n\r\n</style>",
    "<script>\r\n\r\nimport Button from \"./common/Button.svelte\"\r\nimport { store } from \"./builderStore\";\r\n\r\nlet errors = [];\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n    <div class=\"inner\">\r\n        <img src=\"/_builder/assets/budibase-logo.png\" class=\"logo\" alt=\"budibase logo\"/>\r\n        <div>\r\n            \r\n            <div>\r\n                <h4 style=\"margin-bottom: 20px\">Choose an Application</h4>\r\n                {#each $store.apps as app}\r\n                <a href={`#/${app}`} class=\"app-link\">{app}</a>\r\n                {/each}\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    position: fixed;\r\n    margin: 0 auto;\r\n    text-align: center;\r\n    top: 20%;\r\n    /*color: #333333;\r\n    background-color: #fdfdfd;*/\r\n    width:100%;\r\n}\r\n\r\n.inner {\r\n    display:inline-block;\r\n    margin: auto;\r\n}\r\n\r\n.logo {\r\n    width: 300px;\r\n    margin-bottom: 40px;\r\n}\r\n\r\n.root :global(.option) {\r\n    width:250px;\r\n}\r\n\r\n.app-link {\r\n    margin-top: 10px;\r\n    display: block;\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport NavItem from \"./NavItem.svelte\";\r\n\r\nexport let width=50;\r\n\r\n</script>\r\n\r\n<nav class=\"nav\"\r\n     style=\"width: {width};\">\r\n    <img src=\"/_builder/assets/budibase-logo-only.png\" class=\"logo\" alt=\"budibase logo\"/>\r\n    <NavItem name=\"database\" label=\"Database\" icon=\"database\" />\r\n    <NavItem name=\"actions\" label=\"Actions\" icon=\"zap\" />\r\n    <NavItem name=\"access levels\" label=\"Access Levels\" icon=\"user\" />\r\n    <NavItem name=\"user interface\" label=\"User Interface\" icon=\"monitor\"/>\r\n</nav>\r\n\r\n\r\n\r\n<style>\r\n\r\n.nav {\r\n  height: 100%;\r\n  position: fixed;\r\n  left: 0px;\r\n  background-color: var(--secondary100);\r\n  color: var(--darkslate);\r\n}\r\n\r\n.nav > img {\r\n  width:100%;\r\n  margin-bottom: 30px;\r\n  margin-top: 5px;\r\n  margin-left:0px;\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport HierarchyRow from \"./HierarchyRow.svelte\";\r\nimport RecordView from \"./RecordView.svelte\";\r\nimport IndexView from \"./IndexView.svelte\";\r\nimport ActionsHeader from \"./ActionsHeader.svelte\";\r\nimport {store} from \"../builderStore\";\r\nimport getIcon from \"../common/icon\";\r\nimport DropdownButton from \"../common/DropdownButton.svelte\";\r\nimport {hierarchy as hierarchyFunctions} from \"../../../core/src\";\r\n\r\nconst hierarchyWidth = \"200px\";\r\n\r\nconst defaultNewIndexActions =  [{\r\n    label:\"New Root Index\", \r\n    onclick: store.newRootIndex\r\n}];\r\n\r\nconst defaultNewRecordActions = [{\r\n    label:\"New Root Record\", \r\n    onclick: store.newRootRecord\r\n}];\r\n\r\nlet newIndexActions = defaultNewIndexActions;\r\nlet newRecordActions = defaultNewRecordActions;\r\n\r\nstore.subscribe(db => {\r\n    if(!db.currentNode || hierarchyFunctions.isIndex(db.currentNode)) {\r\n        newRecordActions = defaultNewRecordActions;\r\n        newIndexActions = defaultNewIndexActions;\r\n    } else {\r\n        newRecordActions = [\r\n            ...defaultNewRecordActions,\r\n            {label: `New Child Record of ${db.currentNode.name}`, \r\n            onclick: store.newChildRecord}\r\n        ];\r\n\r\n        newIndexActions = [\r\n            ...defaultNewIndexActions,\r\n            {label: `New Index on ${db.currentNode.name}`, \r\n            onclick: store.newChildIndex}\r\n        ];\r\n    }\r\n});\r\n\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n    <div class=\"hierarchy\" style=\"width: {hierarchyWidth}\">\r\n        <div class=\"hierarchy-title-row\">\r\n            <div class=\"hierarchy-title\">Records</div>\r\n            <DropdownButton iconName=\"plus\" actions={newRecordActions} />\r\n        </div>\r\n        {#each $store.hierarchy.children as record}\r\n        <HierarchyRow node={record} />\r\n        {/each}\r\n\r\n        <div class=\"hierarchy-title-row\" style=\"margin-top: 20px\">\r\n            <div class=\"hierarchy-title\">Indexes</div>\r\n            <DropdownButton iconName=\"plus\" actions={newIndexActions} />\r\n        </div>\r\n        {#each $store.hierarchy.indexes as index}\r\n        <HierarchyRow node={index} />\r\n        {/each}\r\n    </div>\r\n    <div class=\"node-container\">\r\n        <div class=\"actions-header\">\r\n            {#if $store.currentNode}\r\n            <ActionsHeader left={hierarchyWidth}/>\r\n            {/if}\r\n        </div>\r\n        <div class=\"node-view\">\r\n            {#if !$store.currentNode}\r\n            <h1 style=\"margin-left: 100px\">:)</h1>\r\n            {:else if $store.currentNode.type === \"record\"}\r\n            <RecordView />\r\n            {:else}\r\n            <IndexView />\r\n            {/if}\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n\r\n<style>\r\n.root {\r\n    display: flex;\r\n    height: 100%;\r\n    position: relative;\r\n}\r\n\r\n.hierarchy {\r\n    flex: 0 1 auto;\r\n    background-color: var(--primary10);\r\n    overflow-y: auto;\r\n    height: 100%;\r\n}\r\n\r\n.node-container {\r\n    flex: 1 1 auto;\r\n    display: flex;\r\n    flex-direction: column;\r\n}\r\n\r\n.actions-header {\r\n    flex: 0 1 auto;\r\n}\r\n\r\n.node-view {\r\n    overflow-y: auto;\r\n    flex: 1 1 auto;\r\n}\r\n\r\n.hierarchy-title-row {\r\n    padding: 15px 7px;\r\n    /*background-color: var(--secondary75);\r\n    color: var(--white);*/\r\n    font-size: 11pt;\r\n    display: flex;\r\n    font-weight: bold;\r\n}\r\n\r\n.hierarchy-title {\r\n    flex: auto 1 1;\r\n}\r\n\r\n\r\n</style>",
    "<script>\r\n\r\nimport getIcon from \"../common/icon\";\r\nimport {store} from \"../builderStore\";\r\nimport Button from \"../common/Button.svelte\";\r\nimport ButtonGroup from \"../common/ButtonGroup.svelte\";\r\nimport Actions from \"./Actions.svelte\";\r\nimport Triggers from \"./Triggers.svelte\";\r\nimport {getNewAction, getNewTrigger} from \"../common/core\";\r\n\r\nlet editingAction = null;\r\nlet editingActionIsNew = true;\r\nlet editingTrigger = null;\r\nlet editingTriggerIsNew = true;\r\n\r\nlet getDefaultOptionsHtml = defaultOptions => \r\n    pipe(defaultOptions, [\r\n        keys,\r\n        map(k => `<span style=\"color:var(--slate)\">${k}: </span>${JSON.parse(typeOptions[k])}`),\r\n        join(\"<br>\")\r\n    ]);\r\n\r\nlet onActionEdit = (action) => {\r\n    editingAction = action;\r\n    editingActionIsNew = false;\r\n}\r\n\r\nlet newAction = () => {\r\n    editingAction = getNewAction();\r\n    editingActionIsNew = true;\r\n}\r\n\r\nlet onActionDelete = (action) => {\r\n    store.deleteAction(action);\r\n}\r\n\r\nlet deleteTrigger = () => {}\r\n\r\nlet editTrigger = (trigger) => {\r\n    editingTrigger = trigger;\r\n    editingTriggerIsNew = false;\r\n}\r\n\r\nlet newTrigger = () => {\r\n    editingTrigger = getNewTrigger();\r\n    editingTriggerIsNew = true;\r\n}\r\n\r\nlet onActionSave = action => {\r\n    store.saveAction(\r\n            action, \r\n            editingActionIsNew, \r\n            editingAction);\r\n\r\n    editingAction = null;\r\n}\r\n\r\nlet onActionCancel = () => {\r\n    editingAction = null;\r\n}\r\n\r\nlet onTriggerSave = trigger => {\r\n    store.saveTrigger(\r\n            trigger, \r\n            editingTriggerIsNew, \r\n            editingTrigger);\r\n\r\n    editingTrigger = null;\r\n}\r\n\r\nlet onTriggerCancel = () => {\r\n    editingTrigger = null;\r\n}\r\n\r\nlet onTriggerEdit = (trigger) => {\r\n    editingTrigger = trigger;\r\n    editingTriggerIsNew = false;\r\n}\r\n\r\n\r\nlet onTriggerDelete = (trigger) => {\r\n    store.deleteTrigger(trigger);\r\n}\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n\r\n<ButtonGroup>\r\n    <Button color=\"secondary\" \r\n            grouped\r\n            on:click={newAction}>Create New Action</Button>\r\n    <Button color=\"secondary\" \r\n            grouped\r\n            on:click={newTrigger}>Create New Trigger</Button>\r\n</ButtonGroup>\r\n\r\n<Actions {editingActionIsNew} {editingAction} \r\n         {onActionEdit} {onActionDelete} {onActionSave}\r\n         {onActionCancel} />\r\n\r\n<Triggers {editingTriggerIsNew} {editingTrigger} \r\n         {onTriggerEdit} {onTriggerDelete} {onTriggerSave}\r\n         {onTriggerCancel} />\r\n\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    padding: 10px;\r\n}\r\n\r\n\r\n</style>",
    "<script>\r\n\r\nexport let name = \"\";\r\n\r\n</script>\r\n\r\n<div>\r\n    <h4>Coming Sometime: {name}</h4>\r\n</div>\r\n\r\n<style>\r\n\r\nh4 {\r\n    margin-top: 20px;\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport ComponentsHierarchy from \"./ComponentsHierarchy.svelte\";\r\nimport PagesList from \"./PagesList.svelte\"\r\nimport { store } from \"../builderStore\";\r\nimport getIcon from \"../common/icon\";\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n    \r\n    <div class=\"ui-nav\">\r\n\r\n        <div class=\"components-list-container\">\r\n            <h5>\r\n                {@html getIcon(\"sidebar\",\"18\")}\r\n                <span class=\"nav-title-inner\">COMPONENTS</span>\r\n            </h5>\r\n            <ComponentsHierarchy components={$store.allComponents}/>\r\n        </div>\r\n\r\n        <div class=\"pages-list-container\">\r\n            <h5>\r\n                {@html getIcon(\"grid\",\"18\")}\r\n                <span class=\"nav-title-inner\">PAGES</span>\r\n            </h5>\r\n            <PagesList />\r\n        </div>\r\n\r\n    </div>\r\n\r\n    <div class=\"component-preview\">\r\n        {#if $store.currentFrontEndItem}\r\n        <div class=\"component-container\">\r\n            <h1>{$store.currentFrontEndItem.name}</h1>\r\n        </div>\r\n        {/if} \r\n    </div>\r\n\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    display: grid;\r\n    grid-template-columns: [uiNav] 300px [preview] auto;\r\n    height: 100%;\r\n    width: 100%;\r\n}\r\n\r\n.ui-nav {\r\n    grid-column-start: uiNav;\r\n    background-color: var(--primary10);\r\n    height: 100%;\r\n}\r\n\r\n.component-preview {\r\n    display: grid;\r\n    grid-template-rows: [top] 1fr [middle] auto [bottom] 1fr;\r\n    grid-template-columns: [left] 1fr [middle] auto [right] 1fr;\r\n    grid-column-start: preview;\r\n}\r\n\r\n.component-container {\r\n    grid-row-start: middle;\r\n    grid-column-start: middle;\r\n}\r\n\r\n.pages-list-container {\r\n    padding-top: 20px;\r\n}\r\n\r\n\r\n\r\nh5 {\r\n    font-size: 10pt;\r\n    padding-left: 10px;\r\n}\r\n\r\n.nav-title-inner {\r\n    margin-left:5px;\r\n    vertical-align: bottom;\r\n}\r\n</style>",
    "<script>\r\n\r\nexport let color = \"primary\";\r\nexport let className = \"\";\r\nexport let style = \"\";\r\nexport let groupPosition = \"\";\r\nexport let grouped = false;\r\n\r\n$: borderClass = grouped \r\n                 ? \"\"\r\n                 : \"border-normal\";\r\n\r\n</script>\r\n\r\n<button class=\"{color} {className} {borderClass} {grouped ? \"grouped\" : \"\"}\" \r\n        style=\"{style}\"\r\n        on:click>\r\n    <slot/>\r\n</button>\r\n\r\n<style>\r\n\r\n.border-normal { border-radius: var(--borderradiusall); }\r\n.border-left { border-radius: var(--borderradius) 0 0 var(--borderradius); }\r\n.border-right { border-radius: 0 var(--borderradius) var(--borderradius) 0; }\r\n.border-middle { border-radius: 0; }\r\n\r\nbutton {  \r\n    border-style: solid; \r\n    padding: 7px 15px;\r\n    cursor:pointer;\r\n}\r\n\r\n/* ---- PRIMARY ----*/\r\n.primary {\r\n    background-color: var(--primary100);\r\n    border-color: var(--primary100);\r\n    color: var(--white);\r\n}\r\n\r\n.primary:hover {\r\n    background-color: var(--primary75);\r\n    border-color: var(--primary75);\r\n}\r\n\r\n.primary:active {\r\n    background-color: var(--primarydark);\r\n    border-color: var(--primarydark);\r\n}\r\n\r\n.primary-outline {\r\n    background-color: var(--white);\r\n    border-color: var(--primary100);\r\n    color: var(--primary100);\r\n}\r\n\r\n.primary-outline:hover {\r\n    background-color: var(--primary10);\r\n}\r\n\r\n.primary-outline:pressed {\r\n    background-color: var(--primary25);\r\n}\r\n\r\n/* ---- secondary ----*/\r\n\r\n.secondary {\r\n    background-color: var(--secondary100);\r\n    border-color: var(--secondary100);\r\n    color: var(--white);\r\n}\r\n\r\n.secondary:hover {\r\n    background-color: var(--secondary75);\r\n    border-color: var(--secondary75);\r\n}\r\n\r\n.secondary:pressed {\r\n    background-color: var(--secondarydark);\r\n    border-color: var(--secondarydark);\r\n}\r\n\r\n.secondary-outline {\r\n    background-color: var(--white);\r\n    border-color: var(--secondary100);\r\n    color: var(--secondary100);\r\n}\r\n\r\n.secondary-outline:hover {\r\n    background-color: var(--secondary10);\r\n}\r\n\r\n.secondary-outline:pressed {\r\n    background-color: var(--secondary25);\r\n}\r\n\r\n\r\n/* ---- success ----*/\r\n.success {\r\n    background-color: var(--success100);\r\n    border-color: var(--success100);\r\n    color: var(--white);\r\n}\r\n\r\n.success:hover {\r\n    background-color: var(--success75);\r\n    border-color: var(--success75);\r\n}\r\n\r\n.success:pressed {\r\n    background-color: var(--successdark);\r\n    border-color: var(--successdark);\r\n}\r\n\r\n.success-outline {\r\n    background-color: var(--white);\r\n    border-color: var(--success100);\r\n    color: var(--success100);\r\n}\r\n\r\n.success-outline:hover {\r\n    background-color: var(--success10);\r\n}\r\n\r\n.success-outline:pressed {\r\n    background-color: var(--success25);\r\n}\r\n\r\n/* ---- deletion ----*/\r\n.deletion {\r\n    background-color: var(--deletion100);\r\n    border-color: var(--deletion100);\r\n    color: var(--white);\r\n}\r\n\r\n.deletion:hover {\r\n    background-color: var(--deletion75);\r\n    border-color: var(--deletion75);\r\n}\r\n\r\n.deletion:pressed {\r\n    background-color: var(--deletiondark);\r\n    border-color: var(--deletiondark);\r\n}\r\n\r\n.deletion-outline {\r\n    background-color: var(--white);\r\n    border-color: var(--deletion100);\r\n    color: var(--deletion100);\r\n}\r\n\r\n.deletion-outline:hover {\r\n    background-color: var(--deletion10);\r\n}\r\n\r\n.deletion-outline:pressed {\r\n    background-color: var(--deletion25);\r\n}\r\n\r\n\r\n</style>",
    "<script>\r\n\r\nimport ButtonGroup from \"../common/ButtonGroup.svelte\";\r\nimport Button from \"../common/Button.svelte\";\r\nimport {store} from \"../builderStore\";\r\nimport {generateFullPermissions, getNewAccessLevel} from \"../common/core\";\r\nimport getIcon from \"../common/icon\";\r\nimport AccessLevelView from \"./AccessLevelView.svelte\";\r\nimport Modal from \"../common/Modal.svelte\";\r\n\r\nlet editingLevel = null;\r\nlet editingLevelIsNew = false;\r\n$: isEditing = (editingLevel !== null); \r\n\r\nlet allPermissions = [];\r\nstore.subscribe(db => {\r\n    allPermissions = generateFullPermissions(db.hierarchy, db.actions);\r\n})\r\n\r\nlet onLevelEdit = (level) => {\r\n    editingLevel = level;\r\n    editingLevelIsNew = false;\r\n};\r\n\r\nlet onLevelCancel = () => {\r\n    editingAction = null;\r\n};\r\n\r\nlet onLevelDelete = (level) => {\r\n    store.deleteLevel(level);\r\n};\r\n\r\n\r\nlet createNewLevel = () => {\r\n    editingLevelIsNew = true;\r\n    editingLevel = getNewAccessLevel();\r\n}\r\n\r\nlet onEditingFinished = (level) => {\r\n    if(level) {\r\n        store.saveLevel(level, editingLevelIsNew, editingLevel);\r\n    }\r\n    editingLevel = null;\r\n}\r\n\r\nconst getPermissionsString = perms => {\r\n    return `${perms.length} / ${allPermissions.length}`;\r\n}\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n\r\n<ButtonGroup>\r\n    <Button grouped color=\"secondary\" on:click={createNewLevel}>Create New Access Level</Button>\r\n</ButtonGroup>\r\n\r\n{#if $store.accessLevels}\r\n<table class=\"fields-table uk-table uk-table-small\">\r\n    <thead>\r\n        <tr>\r\n            <th>Name</th>\r\n            <th>Permissions</th>\r\n            <th></th>\r\n        </tr>\r\n    </thead>\r\n    <tbody>\r\n        {#each $store.accessLevels as level}\r\n        <tr>\r\n            <td >{level.name}</td>\r\n            <td >{getPermissionsString(level.permissions)}</td>\r\n            <td class=\"edit-button\">\r\n                <span on:click={() => onLevelEdit(level)}>{@html getIcon(\"edit\")}</span>\r\n                <span on:click={() => onLevelDelete(level)}>{@html getIcon(\"trash\")}</span>\r\n            </td>\r\n        </tr>\r\n        {/each}\r\n    </tbody>\r\n</table>\r\n{:else}\r\n(no actions added)\r\n{/if}\r\n\r\n\r\n<Modal bind:isOpen={isEditing}>\r\n    {#if isEditing}\r\n    <AccessLevelView level={editingLevel}\r\n                     allPermissions={allPermissions}\r\n                     onFinished={onEditingFinished}\r\n                     isNew={editingLevelIsNew}\r\n                     allLevels={$store.accessLevels}\r\n                     hierarchy={$store.hierarchy}\r\n                     actions={$store.actions} />\r\n    {/if}    \r\n</Modal>\r\n\r\n\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    padding:10px;\r\n}\r\n\r\n.edit-button {\r\n    cursor:pointer;\r\n    color: var(--white);\r\n}\r\n\r\ntr:hover .edit-button  {\r\n    color: var(--secondary75);\r\n}\r\n\r\n\r\n</style>",
    "<script>\r\n\r\nimport {store} from \"../builderStore\";\r\nimport getIcon from \"../common/icon\";\r\n\r\nexport let name = \"\";\r\nexport let label = \"\";\r\nexport let icon = \"\";\r\n\r\nlet navActive = \"\";\r\n\r\nstore.subscribe(db => {\r\n    navActive = (db.activeNav === name ? \"active\" : \"\")\r\n});\r\n\r\nconst setActive = () => \r\n    store.setActiveNav(name);\r\n\r\n</script>\r\n\r\n<div class=\"{navActive}\">\r\n    <div class=\"nav-item\" \r\n        on:click={setActive}>\r\n        <div class=\"inner\">\r\n            <div class=\"icon\">{@html getIcon(icon)}</div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n\r\n<style>\r\n\r\n.nav-item {\r\n    padding: 0px 5px;\r\n    display: block;\r\n    padding: 10px;\r\n    color: var(--slate);\r\n    cursor: pointer;\r\n}\r\n\r\n.inner {\r\n    padding: 0px 20px 10px 0px;\r\n    display: inline-block;\r\n    width:100%;\r\n}\r\n\r\n.nav-item:hover {\r\n    background-color: var(--primary25);\r\n}\r\n\r\n.icon {\r\n    font-size:0.9em; \r\n    display: inline-block; \r\n    position: relative;\r\n    top: 5px;\r\n    margin-right:5px;\r\n    width:100%;\r\n}\r\n\r\n.active > div {\r\n    background-color: var(--primary10);\r\n    color: var(--secondary100);\r\n}\r\n\r\n.active>div:hover {\r\n    background-color: var(--slate);\r\n    color: var(--secondary100);\r\n}\r\n\r\n.active {\r\n    background-color: white; \r\n}\r\n\r\n\r\n</style>",
    "<script>\r\n\r\nimport {store} from \"../builderStore\";\r\nimport {cloneDeep} from \"lodash\";\r\nexport let level = 0;\r\nexport let node;\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n    <div class=\"title\" on:click={() => store.selectExistingNode(node.nodeId)} style=\"padding-left: {20 + (level * 20)}px\">\r\n        {node.name}\r\n    </div>\r\n    {#if node.children}\r\n    {#each node.children as child}\r\n    <svelte:self node={child} \r\n                 level={level+1}/>\r\n    {/each}\r\n    {/if}\r\n</div>\r\n\r\n\r\n<style>\r\n\r\n.root { \r\n    display: block;\r\n    font-size: 13pt;\r\n    width: 100%;\r\n    cursor: pointer;\r\n}\r\n\r\n.title {\r\n    font: var(--bodytext);\r\n    padding-top: 10px;\r\n    padding-right: 5px;\r\n    padding-bottom: 10px;\r\n    color: var(--secondary100);\r\n}\r\n\r\n.title:hover {\r\n    background-color: var(--secondary10);\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport Textbox from \"../common/Textbox.svelte\";\r\nimport Button from \"../common/Button.svelte\";\r\nimport getIcon from \"../common/icon\";\r\nimport FieldView from \"./FieldView.svelte\";\r\nimport Modal from \"../common/Modal.svelte\";\r\nimport {map, join, filter, some, \r\n    find, keys, isDate} from \"lodash/fp\";\r\nimport { store } from \"../builderStore\";\r\nimport {common, hierarchy as h} from \"../../../core/src\";\r\nimport {templateApi, pipe, validate} from \"../common/core\";\r\n\r\nlet record;\r\nlet getIndexAllowedRecords;\r\nlet editingField = false;\r\nlet fieldToEdit;\r\nlet isNewField = false;\r\nlet newField;\r\nlet editField;\r\nlet deleteField;\r\nlet onFinishedFieldEdit;\r\nlet editIndex;\r\n\r\nstore.subscribe($store => {\r\n    record = $store.currentNode;\r\n    const flattened = h.getFlattenedHierarchy($store.hierarchy);\r\n    getIndexAllowedRecords = index => \r\n        pipe(index.allowedRecordNodeIds, [\r\n            filter(id => some(n => n.nodeId === id)(flattened)),\r\n            map(id => find(n => n.nodeId === id)\r\n                          (flattened).name),\r\n            join(\", \")\r\n        ]);\r\n\r\n    newField = () => {\r\n        isNewField = true;\r\n        fieldToEdit = templateApi($store.hierarchy).getNewField(\"string\");\r\n        editingField = true;\r\n    }\r\n\r\n    onFinishedFieldEdit = (field) => {\r\n        if(field) {\r\n            store.saveField(field);\r\n        }\r\n        editingField = false;\r\n    }\r\n\r\n    editField = (field) => {\r\n        isNewField = false;\r\n        fieldToEdit = field;\r\n        editingField = true;\r\n    }\r\n\r\n    deleteField = (field) => {\r\n        store.deleteField(field);\r\n    }\r\n\r\n    editIndex = index => {\r\n        store.selectExistingNode(index.nodeId);\r\n    }\r\n\r\n})\r\n\r\nlet getTypeOptionsValueText = value => {\r\n    if(value === Number.MAX_SAFE_INTEGER\r\n       || value === Number.MIN_SAFE_INTEGER\r\n       || new Date(value).getTime() === new Date(8640000000000000).getTime()\r\n       || new Date(value).getTime() === new Date(-8640000000000000).getTime()) return \"(any)\";\r\n    \r\n    if(value === null) return \"(not set)\";\r\n    return value;\r\n}\r\n\r\nlet getTypeOptions = typeOptions => \r\n    pipe(typeOptions, [\r\n        keys,\r\n        map(k => `<span style=\"color:var(--slate)\">${k}: </span>${getTypeOptionsValueText(typeOptions[k])}`),\r\n        join(\"<br>\")\r\n    ]);\r\n\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n\r\n    <Textbox label=\"Name\" bind:text={record.name} />\r\n    <div>{record.nodeKey()}</div>\r\n    {#if !record.isSingle}\r\n    <Textbox label=\"Collection Name\" bind:text={record.collectionName} />\r\n    <Textbox label=\"Shard Factor\" bind:text={record.allidsShardFactor} />\r\n    {/if}\r\n\r\n    <h4>\r\n        Fields <span class=\"add-field-button\" on:click={newField}>{@html getIcon(\"plus\")}</span>\r\n    </h4>\r\n\r\n    {#if record.fields.length > 0}\r\n    <table class=\"fields-table uk-table\">\r\n        <thead>\r\n            <tr>\r\n                <th>Name</th>\r\n                <th>Type</th>\r\n                <th>Options</th>\r\n                <th></th>\r\n            </tr>\r\n        </thead>\r\n        <tbody>\r\n            {#each record.fields as field}\r\n            <tr>\r\n                <td >\r\n                    <div>{field.label}</div>\r\n                    <div style=\"font-size: 0.7em; color: var(--slate)\">{field.name}</div>\r\n                </td>\r\n                <td >{field.type}</td>\r\n                <td >{@html getTypeOptions(field.typeOptions)}</td>\r\n                <td>\r\n                    <span class=\"edit-button\" on:click={() => editField(field)}>{@html getIcon(\"edit\")}</span>\r\n                    <span class=\"edit-button\" on:click={() => deleteField(field)}>{@html getIcon(\"trash\")}</span>\r\n                </td>\r\n            </tr>\r\n            {/each}\r\n        </tbody>\r\n    </table>\r\n    {:else}\r\n    (no fields added)\r\n    {/if}\r\
    "<script>\r\n\r\nimport Textbox from \"../common/Textbox.svelte\";\r\nimport CodeArea from \"../common/CodeArea.svelte\";\r\nimport Button from \"../common/Button.svelte\";\r\nimport Dropdown from \"../common/Dropdown.svelte\";\r\nimport {store} from \"../builderStore\";\r\nimport {filter, some, map} from \"lodash/fp\";\r\nimport {hierarchy as hierarchyFunctions, common} from \"../../../core/src\";\r\n\r\nconst pipe = common.$;\r\n\r\nlet index;\r\nlet indexableRecords = [];\r\n\r\nstore.subscribe($store => {\r\n    index = $store.currentNode;\r\n    indexableRecords = pipe($store.hierarchy,[\r\n        hierarchyFunctions.getFlattenedHierarchy,\r\n        filter(hierarchyFunctions.isDecendant(index.parent())),\r\n        filter(hierarchyFunctions.isRecord),\r\n        map(n => ({\r\n            node:n,\r\n            isallowed: some(id => n.nodeId === id)(index.allowedRecordNodeIds)\r\n        }))\r\n    ]);\r\n});\r\n\r\nconst toggleAllowedRecord = record => {\r\n    if(record.isallowed) {\r\n        index.allowedRecordNodeIds = filter(id => id !== record.node.nodeId)\r\n                                           (index.allowedRecordNodeIds);\r\n    } else {\r\n        index.allowedRecordNodeIds.push(record.node.nodeId);\r\n    }\r\n};\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n    <Textbox bind:text={index.name} label=\"Name\"/>\r\n    \r\n    <div class=\"allowed-records\">\r\n        <div>Records to Index</div>\r\n        {#each indexableRecords as rec}\r\n        <input type=\"checkbox\" checked={rec.isallowed} on:change={() => toggleAllowedRecord(rec)}/>\r\n        <span>{rec.node.name}</span>\r\n        {/each}\r\n    </div>\r\n\r\n\r\n    <Dropdown label=\"Index Type\" bind:selected={index.indexType} options={[\"ancestor\", \"reference\"]} />\r\n\r\n    <CodeArea bind:text={index.map} label=\"Map (javascript)\"/>\r\n    <CodeArea bind:text={index.filter} label=\"Filter (javascript expression)\"/>\r\n    <CodeArea bind:text={index.getShardName} label=\"Shard Name (javascript expression)\"/>\r\n\r\n    \r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    height: 100%;\r\n    padding: 15px;\r\n}\r\n\r\n.allowed-records {\r\n    margin: 20px 0px;\r\n}\r\n\r\n.allowed-records > span {\r\n    margin-right:30px;\r\n}\r\n\r\n</style>",
    "<script>\r\nexport let style=\"\";\r\n</script>\r\n\r\n<div class=\"root\" style={style}>\r\n    <slot />\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    display: flex;\r\n}\r\n\r\n.root:last-child {\r\n    border-radius: 0 var(--borderradius) var(--borderradius) 0;\r\n}\r\n\r\n.root:first-child {\r\n    border-radius: var(--borderradius) 0 0 var(--borderradius); \r\n}\r\n\r\n.root:not(:first-child):not(:last-child) {\r\n    border-radius: 0;\r\n}\r\n\r\n</style>",
    "<script>\r\nimport Button from \"../common/Button.svelte\";\r\nimport ButtonGroup from \"../common/ButtonGroup.svelte\";\r\nimport {store} from \"../builderStore\";\r\nimport Modal from \"../common/Modal.svelte\";\r\nimport ErrorsBox from \"../common/ErrorsBox.svelte\";\r\n\r\nexport let left;\r\nlet confirmDelete = false;\r\nconst openConfirmDelete = () => {\r\n    confirmDelete = true;\r\n}\r\n\r\nconst deleteCurrentNode = () => {\r\n    confirmDelete = false;\r\n    store.deleteCurrentNode();\r\n}\r\n\r\n</script>\r\n\r\n<div class=\"root\" style=\"left: {left}\">\r\n\r\n    <ButtonGroup>\r\n        <Button color=\"secondary\" grouped on:click={store.saveCurrentNode}>\r\n            {#if $store.currentNodeIsNew}\r\n            Create\r\n            {:else}\r\n            Update\r\n            {/if}\r\n        </Button>\r\n\r\n        {#if !$store.currentNodeIsNew}\r\n        <Button color=\"secondary\" grouped on:click={openConfirmDelete}>\r\n            Delete\r\n        </Button>\r\n        {/if}\r\n    </ButtonGroup>\r\n\r\n    {#if !!$store.errors && $store.errors.length > 0}\r\n    <div style=\"width: 500px\">\r\n        <ErrorsBox errors={$store.errors}/>\r\n    </div>\r\n    {/if}\r\n    \r\n    <Modal bind:isOpen={confirmDelete}>\r\n        <div style=\"margin: 10px 0px 20px 0px\">Are you sure you want to delete {$store.currentNode.name} ?</div>\r\n        <div style=\"float:right\">\r\n            <Button color=\"primary\"  on:click={deleteCurrentNode}>Yes</Button>\r\n            <Button color=\"secondary\" on:click={() => confirmDelete = false}>No</Button>\r\n        </div>\r\n    </Modal>\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    padding:5px;\r\n    top:0;\r\n    width:100%;\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport {store} from \"../builderStore\";\r\nimport getIcon from \"../common/icon\";\r\nimport Button from \"../common/Button.svelte\";\r\nimport Modal from \"../common/Modal.svelte\";\r\nimport TriggerView from \"./TriggerView.svelte\";\r\n\r\n\r\nexport let editingTrigger = null;\r\nexport let editingTriggerIsNew = true;\r\nexport let onTriggerEdit = (trigger) => {};\r\nexport let onTriggerDelete = (trigger) => {};\r\nexport let onTriggerSave = (trigger) => {};\r\nexport let onTriggerCancel = () => {};\r\n\r\n$: isEditing = (editingTrigger !== null); \r\n\r\nlet triggerEditingFinished = (trigger) => {\r\n    \r\n    if(trigger) {\r\n        onTriggerSave(trigger)\r\n    } else {\r\n        onTriggerCancel();\r\n    }\r\n}\r\n\r\n</script>\r\n\r\n<h3>Triggers</h3>\r\n\r\n{#if $store.triggers}\r\n<table class=\"fields-table uk-table uk-table-small\">\r\n    <thead>\r\n        <tr>\r\n            <th>Event</th>\r\n            <th>Action</th>\r\n            <th>Condition</th>\r\n            <th>Create Options</th>\r\n            <th></th>\r\n        </tr>\r\n    </thead>\r\n    <tbody>\r\n        {#each $store.triggers as trigger}\r\n        <tr>\r\n            <td >{trigger.eventName}</td>\r\n            <td >{trigger.actionName}</td>\r\n            <td >{trigger.condition}</td>\r\n            <td >{trigger.optionsCreator}</td>\r\n            <td class=\"edit-button\">\r\n                <span on:click={() => onTriggerEdit(trigger)}>{@html getIcon(\"edit\")}</span>\r\n                <span on:click={() => onTriggerDelete(trigger)}>{@html getIcon(\"trash\")}</span>\r\n            </td>\r\n        </tr>\r\n        {/each}\r\n    </tbody>\r\n</table>\r\n{:else}\r\n(no triggers added)\r\n{/if}\r\n\r\n\r\n<Modal bind:isOpen={isEditing}>\r\n    {#if isEditing}\r\n    <TriggerView trigger={editingTrigger}\r\n                allActions={$store.actions}\r\n                allTriggers={$store.triggers}\r\n                onFinished={triggerEditingFinished}\r\n                isNew={editingTriggerIsNew}/>\r\n    {/if}    \r\n</Modal>\r\n\r\n<style>\r\n\r\n.edit-button {\r\n    cursor:pointer;\r\n    color: var(--white);\r\n}\r\n\r\ntr:hover .edit-button  {\r\n    color: var(--secondary75);\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport getIcon from \"./icon\";\r\nexport let iconName;\r\nexport let actions = []; // [ {label: \"Action Name\", onclick: () => {...} } ]\r\nlet isDroppedDown = false;\r\n\r\n</script>\r\n\r\n\r\n<div class=\"root\" on:click={() => isDroppedDown = !isDroppedDown}>\r\n    {@html getIcon(iconName)}\r\n    \r\n    <div class=\"dropdown-background\" on:click|stopPropagation={() => isDroppedDown = false} style=\"display: {isDroppedDown ? 'block' : 'none'}\"></div>\r\n\r\n    <div class=\"dropdown-content\" style=\"display: {isDroppedDown ? 'inline-block' : 'none'}\">\r\n        {#each actions as action}\r\n        <div class=\"action-row\" on:click={action.onclick}>\r\n            {action.label}\r\n        </div>\r\n        {/each}\r\n    </div>\r\n    \r\n</div>\r\n\r\n\r\n<style>\r\n\r\n.dropdown-background {\r\n    position: fixed;\r\n    top:0;\r\n    left:0;\r\n    width:100vw;\r\n    height:100vh;\r\n}\r\n\r\n.root {\r\n    cursor: pointer;\r\n    z-index: 1;\r\n}\r\n\r\n.dropdown-content {\r\n    position: absolute;\r\n    background-color: var(--white);\r\n    min-width: 160px;\r\n    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\r\n    z-index: 1;\r\n    font-weight: normal;\r\n    border-style:solid;\r\n    border-width: 1px;\r\n    border-color: var(--secondary10);\r\n}\r\n\r\n.dropdown-content:not(:focus) {\r\n    display: none;\r\n}\r\n\r\n.action-row {\r\n    padding: 7px 10px;\r\n    cursor:pointer;\r\n}\r\n\r\n.action-row:hover {\r\n    background-color: var(--primary100);\r\n    color:var(--white);\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport { \r\n    last, \r\n    sortBy, \r\n    filter, \r\n    map,\r\n    uniqWith,\r\n    isEqual,\r\n    trimCharsStart,\r\n    trimChars,\r\n    join\r\n} from \"lodash/fp\";\r\n\r\nimport { pipe } from \"../common/core\";\r\nimport getIcon from \"../common/icon\";\r\nimport { store } from \"../builderStore\";\r\n\r\nexport let components = []\r\nexport let thisLevel = \"\";\r\n\r\nconst joinPath = join(\"/\");\r\n\r\nconst normalizedName = name => pipe(name, [\r\n        trimCharsStart(\"./\"),\r\n        trimCharsStart(\"~/\"),\r\n        trimCharsStart(\"../\"),\r\n        trimChars(\" \")\r\n    ]);\r\n\r\n\r\nconst isOnThisLevel = (c) => \r\n    normalizedName(c.name).split(\"/\").length === pathPartsThisLevel\r\n    &&\r\n    (!thisLevel || normalizedName(c.name).startsWith(normalizedName(thisLevel)));\r\n\r\nconst notOnThisLevel = (c) => !isOnThisLevel(c);\r\n\r\nconst isInSubfolder = (subfolder, c) => \r\n    normalizedName(c.name).startsWith(\r\n        trimCharsStart(\"/\")(\r\n            joinPath([thisLevel, subfolder])));\r\n\r\nconst isOnNextLevel = (c) => \r\n    normalizedName(c.name).split(\"/\").length === pathPartsThisLevel + 1\r\n\r\nconst lastPartOfName = (c) => \r\n    last(c.name.split(\"/\"))\r\n\r\nconst subFolder = (c) => {\r\n    const cname = normalizedName(c.name);\r\n    const folderName = cname.substring(thisLevel.length, cname.length).split(\"/\")[0];\r\n\r\n    return ({\r\n        name: folderName,\r\n        isExpanded: false,\r\n        path: thisLevel + \"/\" + folderName\r\n    });\r\n}\r\n\r\nlet pathPartsThisLevel = !thisLevel \r\n                        ? 1\r\n                        : normalizedName(thisLevel).split(\"/\").length + 1;\r\n\r\nlet componentsThisLevel = \r\n    pipe(components, [\r\n        filter(isOnThisLevel),\r\n        map(c => ({component:c, title:lastPartOfName(c)})),\r\n        sortBy(\"title\")\r\n    ]);\r\n\r\nlet subfolders = \r\n    pipe(components, [\r\n        filter(notOnThisLevel),\r\n        sortBy(\"name\"),\r\n        map(subFolder),\r\n        uniqWith((f1,f2) => f1.path === f2.path)\r\n    ]);\r\n\r\nconst subComponents = (subfolder) => pipe(components, [\r\n        filter(c => isInSubfolder(subfolder, c))\r\n    ]);\r\n\r\nconst expandFolder = folder => {\r\n    const expandedFolder = {...folder};\r\n    expandedFolder.isExpanded = !expandedFolder.isExpanded;\r\n    const newFolders = [...subfolders];\r\n    newFolders.splice(\r\n        newFolders.indexOf(folder),\r\n        1,\r\n        expandedFolder);\r\n    subfolders = newFolders;\r\n}\r\n\r\nconst isComponentSelected = (current,c) =>\r\n    current \r\n    && current.name === c.name\r\n\r\nconst isFolderSelected = (current, folder) => \r\n    isInSubfolder(current, folder)\r\n\r\n</script>\r\n\r\n<div class=\"root\" style={`padding-left: calc(10px * ${pathPartsThisLevel})`}>\r\n \r\n    {#each subfolders as folder}\r\n    <div class=\"hierarchy-item folder\"\r\n         on:click|stopPropagation={() => expandFolder(folder)}>\r\n        <span>{@html getIcon(folder.isExpanded ? \"chevron-down\" : \"chevron-right\", \"16\")}</span>\r\n        <span class=\"title\" class:currentfolder={$store.currentFrontEndItem && isInSubfolder(folder.name, $store.currentFrontEndItem)}>{folder.name}</span>\r\n        {#if folder.isExpanded}\r\n        <svelte:self components={subComponents(folder.name)} \r\n                     thisLevel={folder.path} />\r\n        {/if}\r\n    </div>\r\n    {/each}\r\n\r\n    {#each componentsThisLevel as component}\r\n    <div class=\"hierarchy-item component\" class:selected={isComponentSelected($store.currentFrontEndItem, component.component)}\r\n         on:click|stopPropagation={() => store.setCurrentComponent(component.component)}>\r\n        <span>{@html getIcon(\"circle\", \"7\")}</span>\r\n        <span class=\"title\">{component.title}</span>\r\n    </div>\r\n    {/each}\r\n\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    color: var(--secondary50);\r\n}\r\n\r\n.hierarchy-item {\r\n    cursor: pointer;\r\n    padding: 5px 0px;\r\n}\r\n\r\
    "<script>\r\n\r\nimport getIcon from \"../common/icon\";\r\nimport {store} from \"../builderStore\";\r\nimport Button from \"../common/Button.svelte\";\r\nimport ButtonGroup from \"../common/ButtonGroup.svelte\";\r\nimport ActionView from \"./ActionView.svelte\";\r\nimport Modal from \"../common/Modal.svelte\";\r\nimport {pipe} from \"../common/core\";\r\nimport {keys, map, join} from \"lodash/fp\";\r\n\r\nexport let editingActionIsNew = false;\r\nexport let editingAction = null;\r\nexport let onActionEdit = (action) => {};\r\nexport let onActionDelete = (action) => {};\r\nexport let onActionSave = (action) => {};\r\nexport let onActionCancel = () => {};\r\n\r\n$: isEditing = (editingAction !== null); \r\n\r\nlet getDefaultOptionsHtml = defaultOptions => \r\n    pipe(defaultOptions, [\r\n        keys,\r\n        map(k => `<span style=\"color:var(--slate)\">${k}: </span>${JSON.stringify(defaultOptions[k])}`),\r\n        join(\"<br>\")\r\n    ]);\r\n\r\n\r\nlet actionEditingFinished = (action) => {\r\n    \r\n    if(action) {\r\n        onActionSave(action)\r\n    } else {\r\n        onActionCancel();\r\n    }\r\n}\r\n\r\n</script>\r\n\r\n<h3>Actions</h3>\r\n\r\n{#if $store.actions}\r\n<table class=\"fields-table uk-table uk-table-small\">\r\n    <thead>\r\n        <tr>\r\n            <th>Description</th>\r\n            <th>Behaviour Source</th>\r\n            <th>Behaviour Name</th>\r\n            <th>Default Options</th>\r\n            <th></th>\r\n        </tr>\r\n    </thead>\r\n    <tbody>\r\n        {#each $store.actions as action}\r\n        <tr>\r\n            <td >{action.name}</td>\r\n            <td >{action.behaviourSource}</td>\r\n            <td >{action.behaviourName}</td>\r\n            <td >{@html getDefaultOptionsHtml(action.initialOptions)}</td>\r\n            <td class=\"edit-button\">\r\n                <span on:click={() => onActionEdit(action)}>{@html getIcon(\"edit\")}</span>\r\n                <span on:click={() => onActionDelete(action)}>{@html getIcon(\"trash\")}</span>\r\n            </td>\r\n        </tr>\r\n        {/each}\r\n    </tbody>\r\n</table>\r\n{:else}\r\n(no actions added)\r\n{/if}\r\n\r\n\r\n<Modal bind:isOpen={isEditing}>\r\n    {#if isEditing}\r\n    <ActionView action={editingAction}\r\n                allActions={$store.actions}\r\n                onFinished={actionEditingFinished}\r\n                isNew={editingActionIsNew}/>\r\n    {/if}    \r\n</Modal>\r\n\r\n\r\n<style>\r\n\r\n.edit-button {\r\n    cursor:pointer;\r\n    color: var(--white);\r\n}\r\n\r\ntr:hover .edit-button  {\r\n    color: var(--secondary75);\r\n}\r\n\r\n\r\n</style>",
    "<script>\r\nimport { store } from \"../builderStore\";\r\nimport getIcon from \"../common/icon\";\r\n\r\nconst getPage = (s, name) => {\r\n    const props = s.pages[name];\r\n    return ({name, props});\r\n}\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n    <div class=\"hierarchy-item component\" class:selected={$store.currentFrontEndItem && $store.currentFrontEndItem.name === \"main\"}\r\n            on:click|stopPropagation={() => store.setCurrentPage(\"main\")}>\r\n        <span>{@html getIcon(\"circle\", \"7\")}</span>\r\n        <span class=\"title\">Main</span>\r\n    </div>\r\n\r\n    <div class=\"hierarchy-item component\" class:selected={$store.currentFrontEndItem && $store.currentFrontEndItem.name === \"unauthenticated\"}\r\n            on:click|stopPropagation={() => store.setCurrentPage(\"unauthenticated\")}>\r\n        <span>{@html getIcon(\"circle\", \"7\")}</span>\r\n        <span class=\"title\">Login</span>\r\n    </div>\r\n\r\n</div>\r\n\r\n<style>\r\n\r\n.root {\r\n    padding-left: 20px;\r\n    padding-bottom: 20px;\r\n    color: var(--secondary50);\r\n}\r\n\r\n.hierarchy-item {\r\n    cursor: pointer;\r\n}\r\n\r\n.hierarchy-item:hover {\r\n    color: var(--secondary75);\r\n}\r\n\r\n.component {\r\n    margin-left: 5px;\r\n}\r\n\r\n.selected {\r\n    color: var(--primary100);\r\n}\r\n\r\n\r\n.title {\r\n    margin-left: 10px;\r\n}\r\n\r\n</style>",
    "<script>\r\n// todo: use https://ace.c9.io\r\nexport let text = \"\";\r\nexport let label = \"\";\r\n</script>\r\n\r\n<div>{label}</div>\r\n<textarea  bind:value={text}></textarea>\r\n\r\n<style>\r\n\r\ntextarea {\r\n    padding:3px;\r\n    background: var(--darkslate);\r\n    color: var(--white);\r\n    font-family: 'Courier New', Courier, monospace;\r\n    width:95%;\r\n    height:100px;\r\n}\r\n\r\n</style>",
    "<script>\r\nexport let text = \"\";\r\nexport let label = \"\";\r\n</script>\r\n\r\n<div class=\"container\">\r\n    <div class=\"label\">{label}</div>\r\n    <input class=\"control uk-input\" bind:value={text} >\r\n</div>\r\n\r\n<style>\r\n\r\n.container {\r\n    display: grid;\r\n    grid-template-columns: [label] 100px [control] auto;\r\n    margin: 20px 0px;\r\n}\r\n.label {\r\n    grid-column-start: label;\r\n    align-self: center;\r\n}\r\n.control {\r\n    grid-column-start: control;\r\n    align-self: center;\r\n    margin: 0;\r\n}\r\n\r\ninput {\r\n    width:300px;\r\n}\r\n\r\n</style>",
    "<script>\r\nexport let errors = [];\r\n\r\n$:hasErrors = errors.length > 0;\r\n</script>\r\n\r\n{#if hasErrors}\r\n<div class=\"error-container\">\r\n    {#each errors as error}\r\n    <div class=\"error-row\">{error.field ? `${error.field}: ` : \"\"}{error.error}</div>\r\n    {/each}\r\n</div>\r\n{/if}\r\n\r\n<style>\r\n\r\n.error-container {\r\n    padding:10px;\r\n    border-style: solid;\r\n    border-color: var(--deletion100);\r\n    border-radius: var(--borderradiusall);\r\n    background: var(--deletion75);\r\n}\r\n\r\n.error-row {\r\n    padding: 5px 0px;\r\n}\r\n\r\n</style>",
    "<script>\r\nimport {createEventDispatcher} from \"svelte\";\r\n\r\nexport let selected;\r\nexport let label;\r\nexport let options;\r\nexport let valueMember;\r\nexport let textMember;\r\nexport let multiple=false;\r\n\r\nconst dispatch =createEventDispatcher();\r\n\r\n\r\n</script>\r\n\r\n<div class=\"container\">\r\n    <div class=\"label\">{label}</div>\r\n\r\n    {#if multiple}\r\n    \r\n    <select class=\"control uk-select\" multiple bind:value={selected} on:change>\r\n        {#each options as option}\r\n        <option value={!valueMember ? option : valueMember(option)}>{!textMember ? option : textMember(option)}</option>\r\n        {/each}\r\n    </select>\r\n\r\n    {:else}\r\n\r\n    <select class=\"control uk-select\" bind:value={selected} on:change>\r\n        {#each options as option}\r\n        <option value={!valueMember ? option : valueMember(option)}>{!textMember ? option : textMember(option)}</option>\r\n        {/each}\r\n    </select>\r\n    {/if}\r\n\r\n</div>\r\n\r\n<style>\r\n\r\n.container {\r\n    display: grid;\r\n    grid-template-columns: [label] 100px [control] auto;\r\n    margin: 20px 0px;\r\n}\r\n.label {\r\n    grid-column-start: label;\r\n    align-self: center;\r\n}\r\n.control {\r\n    grid-column-start: control;\r\n    align-self: center;\r\n    margin: 0;\r\n}\r\n\r\nselect {\r\n    width:300px;\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nexport let checked=false;\r\nexport let label=\"\";\r\n\r\n</script>\r\n\r\n<input class=\"uk-checkbox\" type=\"checkbox\" bind:checked on:change />{label}\r\n\r\n<style>\r\n\r\ninput {\r\n    margin-right:7px;\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport Textbox from \"../common/Textbox.svelte\";\r\nimport Button from \"../common/Button.svelte\";\r\nimport ButtonGroup from \"../common/ButtonGroup.svelte\";\r\nimport {cloneDeep, filter, keys,\r\nmap, isUndefined} from \"lodash/fp\";\r\nimport ErrorsBox from \"../common/ErrorsBox.svelte\";\r\nimport {validateActions, pipe} from \"../common/core\";\r\nimport getIcon from \"../common/icon\";\r\n\r\nexport let action;\r\nexport let onFinished = (action) => {};\r\nexport let allActions;\r\nexport let isNew = true;\r\n\r\nlet optKey = \"\";\r\nlet optValue = \"\";\r\n\r\nlet clonedAction = cloneDeep(action); \r\nlet initialOptions = pipe(action.initialOptions, [\r\n    keys,\r\n    map(k => ({key:k, value:action.initialOptions[k]}))\r\n]);\r\nlet errors = [];\r\n\r\nconst addNewOption = () => {\r\n\r\n    if(optKey && optValue && isUndefined(clonedAction.initialOptions[optKey])) {\r\n        clonedAction.initialOptions[optKey] = optValue;\r\n        initialOptions = [...initialOptions, {\r\n            key:optKey, value: optValue\r\n        }];\r\n        optKey = \"\";\r\n        optValue = \"\";\r\n    }\r\n}\r\n\r\nconst removeOption = (opt) => {\r\n    if(opt) {\r\n        delete clonedAction.initialOptions[opt.key]\r\n        initialOptions = pipe(initialOptions, [\r\n            filter(o => o.key !== opt.key)\r\n        ]);\r\n    }\r\n}\r\n\r\nconst save = () => {\r\n\r\n    const newActionsList = [\r\n        ...pipe(allActions ,[filter(a => a !== action)]),\r\n        clonedAction]\r\n\r\n    errors = pipe(newActionsList ,[\r\n        validateActions,\r\n        map(e => e.error)\r\n    ]);\r\n\r\n    if(errors.length === 0)\r\n        onFinished(clonedAction);\r\n}\r\n\r\nconst cancel = () => {\r\n    onFinished();\r\n}\r\n\r\n</script>\r\n\r\n<div class=\"root\">\r\n\r\n    <ErrorsBox {errors} />\r\n\r\n    <Textbox label=\"Name\" bind:text={clonedAction.name} />\r\n    <Textbox label=\"Behaviour Source\" bind:text={clonedAction.behaviourSource} />\r\n    <Textbox label=\"Behaviour\" bind:text={clonedAction.behaviourName} />\r\n\r\n\r\n    <div class=\" uk-form-stacked\" style=\"margin-bottom: 20px\">\r\n        <label class=\"uk-form-label\">Default Options</label>\r\n        <div class=\"uk-grid-small\" uk-grid>\r\n            <input class=\"uk-input uk-width-1-4\" placeholder=\"key\" bind:value={optKey} >        \r\n            <input class=\"uk-input uk-width-1-4\" placeholder=\"value\" bind:value={optValue} >        \r\n            <Button color=\"primary-outline uk-width-1-4\" on:click={addNewOption}>Add</Button>\r\n        </div>\r\n        <div style=\"margin-top: 10px\">\r\n            {#each initialOptions as option}\r\n            <span class=\"option-container\">{option.key} : {option.value} <span style=\"font-size:10pt; cursor: pointer\" on:click={() => removeOption(option)}>{@html getIcon(\"trash-2\")}</span></span>\r\n            {/each}\r\n        </div>\r\n    </div>\r\n\r\n    <ButtonGroup>\r\n        <Button color=\"primary\" grouped on:click={save}>Save</Button>\r\n        <Button color=\"secondary\" grouped on:click={cancel}>Cancel</Button>\r\n    </ButtonGroup>\r\n\r\n    \r\n</div>\r\n\r\n\r\n<style>\r\n\r\n.root {\r\n    padding: 10px;\r\n}\r\n\r\n.option-container {\r\n    border-style: dotted;\r\n    border-width: 1px;\r\n    border-color: var(--primary75);\r\n    padding: 3px;\r\n    margin-right: 5px;\r\n}\r\n\r\n</style>",
    "<script>\r\n\r\nimport flatpickr from \"flatpickr\";\r\nimport \"flatpickr/dist/flatpickr.css\";\r\nimport { onMount } from 'svelte';\r\n\r\nexport let value;\r\nexport let label;\r\nlet input;\r\nlet fpInstance;\r\n\r\n$: if (fpInstance) fpInstance.setDate(value);\r\n\r\nonMount(() => {\r\n    fpInstance =  flatpickr(input, {});\r\n\r\n    fpInstance.config.onChange.push(selectedDates => {\r\n        if(selectedDates.length > 0)\r\n            value = new Date(selectedDates[0]);\r\n    });\r\n\r\n    return fpInstance;\r\n})\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n</script>\r\n\r\n\r\n <div class=\"container\" >\r\n    <div class=\"label\">{label}</div>\r\n    <input class=\"control\" bind:this={input} />\r\n</div>\r\n\r\n<style>\r\n.container {\r\n    display: grid;\r\n    grid-template-columns: [label] 100px [control] auto;\r\n    margin: 20px 0px;\r\n}\r\n.label {\r\n    grid-column-start: label;\r\n    align-self: center;\r\n} \r\n\r\n.control {\r\n    grid-column-start: control;\r\n    align-self: center;\r\n    margin: 0;\r\n}\r\n\r\ninput {\r\n    width:300px;\r\n}\r\n\r\n\r\n</style>",
    "<script>\r\n\r\nexport let value;\r\nexport let label;\r\n\r\nconst inputChanged = ev => {\r\n    try {\r\n        value = Number(ev.target.value);\r\n    } catch(_) {\r\n        value = null;\r\n    }\r\n}\r\n\r\nlet numberText = value === null || value === undefined\r\n                 ? \"\" : value.toString();\r\n\r\n\r\n</script>\r\n\r\n<div class=\"container\">\r\n    <div class=\"label\">{label}</div>\r\n    <input class=\"control\" type=\"text\" value={value} on:change={inputChanged} >\r\n</div>\r\n\r\n<style>\r\n\r\n.container {\r\n    display: grid;\r\n    grid-template-columns: [label] 100px [control] auto;\r\n    margin: 20px 0px;\r\n}\r\n.label {\r\n    grid-column-start: label;\r\n    align-self: center;\r\n}\r\n.control {\r\n    grid-column-start: control;\r\n    align-self: center;\r\n    margin: 0;\r\n}\r\n\r\ninput {\r\n    width:300px;\r\n}\r\n\r\n</style>",
    "<script>\r\nimport {join} from \"lodash/fp\";\r\n\r\nexport let values;\r\nexport let label;\r\n\r\nconst inputChanged = ev => {\r\n    try {\r\n        values = ev.target.value.split(\"\\n\");\r\n    } catch(_) {\r\n        values = [];\r\n    }\r\n}\r\n\r\n$: valuesText = join(\"\\n\")(values);\r\n\r\n\r\n</script>\r\n\r\n<div class=\"container\">\r\n    <div class=\"label\">{label}</div>\r\n    <textarea class=\"control\" value={valuesText} on:change={inputChanged} ></textarea>\r\n</div>\r\n\r\n<style>\r\n\r\n.container {\r\n    display: grid;\r\n    grid-template-columns: [label] 100px [control] auto;\r\n    margin: 20px 0px;\r\n}\r\n.label {\r\n    grid-column-start: label;\r\n    align-self: center;\r\n}\r\n.control {\r\n    grid-column-start: control;\r\n    align-self: center;\r\n    margin: 0;\r\n}\r\n\r\ntextarea {\r\n    width:300px;\r\n    height:200px;\r\n}\r\n\r\n</style>"
  ],
  "names": [],
  "mappings": "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
}