CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-01 12:30:41 +12:00
Code Issues Projects Releases Wiki Activity
budibase/packages/standard-components/public/bundle.css.map
Michael Shanks b7d9e05641
Work on Components API & bugfixes (#102) 
* typo - screens not being sent to page save

* removed children arg from hydrateChildren (n/a)

* initialiseChildren does not rerender unless forced

* removed derivatives of initialiseChildren

* renamed initialiseChildren > attachChildren

* standard-components - refactoring

div now container
H1, h2... etc now Heading with type
Select now takes option as _children

* loads of bug fixing

* safe props creation
anytime props are loaded,
we make sure they conform to the components props definition
2020-02-14 11:51:45 +00:00

20 lines
16 KiB
Plaintext
Raw Blame History

{
"version": 3,
"file": "bundle.css",
"sources": [
"..\\src\\Test\\TestApp.svelte",
"..\\src\\Login.svelte",
"..\\src\\Button.svelte",
"..\\src\\Nav.svelte",
"..\\src\\Table.svelte"
],
"sourcesContent": [
"<script>\r\n import createApp from \"./createApp\"\r\n import { form } from \"./props\"\r\n let _bb\r\n let currentComponent\r\n let _appPromise\r\n\r\nconst autoAssignIds = (props, count = 0) => {\r\n if (!props._id) {\r\n props._id = `auto_id_${count}`\r\n }\r\n if (props._children) {\r\n for (let child of props._children) {\r\n count += 1\r\n autoAssignIds(child, count)\r\n }\r\n }\r\n}\r\n\r\n $: {\r\n if (currentComponent) {\r\n const _appPromise = createApp()\r\n const page = {\r\n props: form,\r\n }\r\n\r\n autoAssignIds(page.props)\r\n\r\n _appPromise.then(initialise => {\r\n initialise(page, currentComponent, \"\")\r\n })\r\n }\r\n }\r\n</script>\r\n\r\n{#await _appPromise}\r\n loading\r\n{:then _bb}\r\n <div id=\"current_component\" bind:this={currentComponent} />\r\n{/await}\r\n\r\n<style>\r\n #current_component {\r\n height: 100%;\r\n width: 100%;\r\n }\r\n</style>\r\n",
"<script>\r\n import Button from \"./Button.svelte\"\r\n\r\n export let usernameLabel = \"Username\"\r\n export let passwordLabel = \"Password\"\r\n export let loginButtonLabel = \"Login\"\r\n export let loginRedirect = \"\"\r\n export let logo = \"\"\r\n export let buttonClass = \"\"\r\n export let inputClass = \"\"\r\n\r\n export let _bb\r\n\r\n let username = \"\"\r\n let password = \"\"\r\n let busy = false\r\n let incorrect = false\r\n let _logo = \"\"\r\n let _buttonClass = \"\"\r\n let _inputClass = \"\"\r\n\r\n $: {\r\n _logo = _bb.relativeUrl(logo)\r\n _buttonClass = buttonClass || \"default-button\"\r\n _inputClass = inputClass || \"default-input\"\r\n }\r\n\r\n const login = () => {\r\n busy = true\r\n _bb.api\r\n .post(\"/api/authenticate\", { username, password })\r\n .then(r => {\r\n busy = false\r\n if (r.status === 200) {\r\n return r.json()\r\n } else {\r\n incorrect = true\r\n return\r\n }\r\n })\r\n .then(user => {\r\n if (user) {\r\n localStorage.setItem(\"budibase:user\", JSON.stringify(user))\r\n location.reload()\r\n }\r\n })\r\n }\r\n</script>\r\n\r\n<div class=\"root\">\r\n\r\n <div class=\"content\">\r\n\r\n {#if _logo}\r\n <div class=\"logo-container\">\r\n <img src={_logo} alt=\"logo\" />\r\n </div>\r\n {/if}\r\n\r\n <div class=\"form-root\">\r\n <div class=\"label\">{usernameLabel}</div>\r\n <div class=\"control\">\r\n <input bind:value={username} type=\"text\" class={_inputClass} />\r\n </div>\r\n <div class=\"label\">{passwordLabel}</div>\r\n <div class=\"control\">\r\n <input bind:value={password} type=\"password\" class={_inputClass} />\r\n </div>\r\n </div>\r\n\r\n <div class=\"login-button-container\">\r\n <button disabled={busy} on:click={login} class={_buttonClass}>\r\n {loginButtonLabel}\r\n </button>\r\n </div>\r\n\r\n {#if incorrect}\r\n <div class=\"incorrect-details-panel\">Incorrect username or password</div>\r\n {/if}\r\n\r\n </div>\r\n\r\n</div>\r\n\r\n<style>\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 .incorrect-details-panel {\r\n margin-top: 30px;\r\n padding: 10px;\r\n border-style: solid;\r\n border-width: 1px;\r\n border-color: maroon;\r\n border-radius: 1px;\r\n text-align: center;\r\n color: maroon;\r\n background-color: mistyrose;\r\n }\r\n\r\n .form-root {\r\n display: grid;\r\n grid-template-columns: [label] auto [control] 1fr; /* [overflow] auto;*/\r\n }\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\r\n .default-input {\r\n font-family: inherit;\r\n font-size: inherit;\r\n padding: 0.4em;\r\n margin: 0 0 0.5em 0;\r\n box-sizing: border-box;\r\n border: 1px solid #ccc;\r\n border-radius: 2px;\r\n width: 100%;\r\n }\r\n\r\n .default-button {\r\n font-family: inherit;\r\n font-size: inherit;\r\n padding: 0.4em;\r\n margin: 0 0 0.5em 0;\r\n box-sizing: border-box;\r\n border: 1px solid #ccc;\r\n border-radius: 2px;\r\n color: #333;\r\n background-color: #f4f4f4;\r\n outline: none;\r\n }\r\n\r\n .default-button:active {\r\n background-color: #ddd;\r\n }\r\n\r\n .default-button:focus {\r\n border-color: #666;\r\n }\r\n</style>\r\n",
"<script>\r\n import cssVars from \"./cssVars\"\r\n import { buildStyle } from \"./buildStyle\"\r\n export let className = \"default\"\r\n export let disabled = false\r\n export let contentText\r\n export let onClick\r\n export let background\r\n export let color\r\n export let border\r\n export let padding\r\n export let hoverColor\r\n export let hoverBackground\r\n export let hoverBorder\r\n\r\n export let _bb\r\n let theButton\r\n let cssVariables\r\n let buttonStyles\r\n\r\n let customHoverColorClass\r\n let customHoverBorderClass\r\n let customHoverBackClass\r\n\r\n let customClasses = \"\"\r\n\r\n const createClasses = classes => {\r\n let all = \"\"\r\n for (let cls in classes) {\r\n if (classes[cls]) {\r\n all = all + \" \" + cls\r\n }\r\n }\r\n return all\r\n }\r\n\r\n $: if(_bb.props._children.length > 0) theButton && _bb.attachChildren(theButton)\r\n\r\n $: {\r\n cssVariables = {\r\n hoverColor,\r\n hoverBorder,\r\n hoverBackground,\r\n background,\r\n color,\r\n border,\r\n }\r\n\r\n buttonStyles = buildStyle({\r\n padding,\r\n })\r\n\r\n customClasses = createClasses({\r\n hoverColor,\r\n hoverBorder,\r\n hoverBackground,\r\n background,\r\n border,\r\n color,\r\n })\r\n }\r\n\r\n const clickHandler = () => {\r\n _bb.call(onClick)\r\n }\r\n</script>\r\n\r\n<button\r\n bind:this={theButton}\r\n use:cssVars={cssVariables}\r\n class=\"{className}\r\n {customClasses}\"\r\n disabled={disabled || false}\r\n on:click={clickHandler}\r\n style={buttonStyles}>\r\n {#if _bb.props_children.length === 0}{contentText}{/if}\r\n</button>\r\n\r\n<style>\r\n .default {\r\n font-family: inherit;\r\n font-size: inherit;\r\n padding: 0.4em;\r\n margin: 0 0 0.5em 0;\r\n box-sizing: border-box;\r\n border: 1px solid #ccc;\r\n border-radius: 2px;\r\n color: #333;\r\n background-color: #f4f4f4;\r\n outline: none;\r\n }\r\n\r\n .default:active {\r\n background-color: #ddd;\r\n }\r\n\r\n .default:focus {\r\n border-color: #666;\r\n }\r\n\r\n .border {\r\n border: var(--border);\r\n }\r\n\r\n .color {\r\n color: var(--color);\r\n }\r\n\r\n .background {\r\n background: var(--background);\r\n }\r\n\r\n .hoverBorder:hover {\r\n border: var(--hoverBorder);\r\n }\r\n\r\n .hoverColor:hover {\r\n color: var(--hoverColor);\r\n }\r\n\r\n .hoverBack:hover {\r\n background: var(--hoverBackground);\r\n }\r\n</style>\r\n",
"<script>\r\n import cssVars from \"./cssVars\"\r\n\r\n export let navBarBackground = \"\"\r\n export let navBarBorder = \"\"\r\n export let navBarColor = \"\"\r\n export let selectedItemBackground = \"\"\r\n export let selectedItemColor = \"\"\r\n export let selectedItemBorder = \"\"\r\n export let itemHoverBackground = \"\"\r\n export let itemHoverColor = \"\"\r\n export let hideNavBar = false\r\n export let selectedItem = \"\"\r\n\r\n export let _children\r\n export let _bb\r\n\r\n let selectedIndex = -1\r\n let styleVars = {}\r\n let components = {}\r\n let componentElements = {}\r\n\r\n const hasComponentElements = () =>\r\n Object.getOwnPropertyNames(componentElements).length > 0\r\n\r\n $: {\r\n styleVars = {\r\n navBarBackground,\r\n navBarBorder,\r\n navBarColor,\r\n selectedItemBackground,\r\n selectedItemColor,\r\n selectedItemBorder,\r\n itemHoverBackground,\r\n itemHoverColor,\r\n }\r\n\r\n if (_children && _children.length > 0 && hasComponentElements()) {\r\n const currentSelectedItem =\r\n selectedIndex > 0 ? _children[selectedIndex].title : \"\"\r\n if (selectedItem && currentSelectedItem !== selectedItem) {\r\n let i = 0\r\n for (let child of _children) {\r\n if (child.title === selectedItem) {\r\n onSelectItem(i)()\r\n }\r\n i++\r\n }\r\n } else if (!currentSelectedItem) {\r\n onSelectItem(0)\r\n }\r\n }\r\n }\r\n\r\n const onSelectItem = index => () => {\r\n selectedIndex = index\r\n if (!components[index]) {\r\n const comp = _bb.attachChildren(\r\n componentElements[index]\r\n )\r\n components[index] = comp\r\n }\r\n }\r\n</script>\r\n\r\n<div class=\"root\" use:cssVars={styleVars}>\r\n {#if !hideNavBar}\r\n <div class=\"navbar\">\r\n {#each _children as navItem, index}\r\n <div\r\n class=\"navitem\"\r\n on:click={onSelectItem(index)}\r\n class:selected={selectedIndex === index}>\r\n {navItem.title}\r\n </div>\r\n {/each}\r\n </div>\r\n {/if}\r\n {#each _children as navItem, index}\r\n <div class=\"content\" bind:this={componentElements[index]} />\r\n {/each}\r\n</div>\r\n\r\n<style>\r\n .root {\r\n height: 100%;\r\n width: 100%;\r\n grid-template-columns: [navbar] auto [content] 1fr;\r\n display: grid;\r\n }\r\n\r\n .navbar {\r\n grid-column: navbar;\r\n background: var(--navBarBackground);\r\n border: var(--navBarBorder);\r\n color: var(--navBarColor);\r\n }\r\n\r\n .navitem {\r\n padding: 10px 17px;\r\n cursor: pointer;\r\n }\r\n\r\n .navitem:hover {\r\n background: var(--itemHoverBackground);\r\n color: var(--itemHoverColor);\r\n }\r\n\r\n .navitem.selected {\r\n background: var(--selectedItemBackground);\r\n border: var(--selectedItemBorder);\r\n color: var(--selectedItemColor);\r\n }\r\n\r\n .content {\r\n grid-column: content;\r\n }\r\n</style>\r\n",
"<script>\r\n export let columns = []\r\n export let data = \"\"\r\n export let tableClass = \"\"\r\n export let theadClass = \"\"\r\n export let tbodyClass = \"\"\r\n export let trClass = \"\"\r\n export let thClass = \"\"\r\n export let onRowClick\r\n\r\n export let _bb\r\n\r\n const rowClickHandler = row => () => {\r\n _bb.call(onRowClick, row)\r\n }\r\n\r\n const cellValue = (colIndex, row) => {\r\n const val = _bb.getStateOrValue(_bb.props.columns[colIndex].value, row)\r\n return val\r\n }\r\n</script>\r\n\r\n<table class={tableClass}>\r\n <thead class={theadClass}>\r\n <tr class={trClass}>\r\n {#each columns as col}\r\n <th class={thClass}>{col.title}</th>\r\n {/each}\r\n </tr>\r\n </thead>\r\n <tbody class={tbodyClass}>\r\n {#if data}\r\n {#each data as row}\r\n <tr class={trClass} on:click={rowClickHandler(row)}>\r\n {#each columns as col, index}\r\n <th class={thClass}>{cellValue(index, row)}</th>\r\n {/each}\r\n </tr>\r\n {/each}\r\n {/if}\r\n </tbody>\r\n</table>\r\n\r\n<style>\r\n .table-default {\r\n width: 100%;\r\n margin-bottom: 1rem;\r\n color: #212529;\r\n border-collapse: collapse;\r\n }\r\n\r\n .table-default .thead-default .th-default {\r\n vertical-align: bottom;\r\n border-bottom: 2px solid #dee2e6;\r\n font-weight: bold;\r\n }\r\n\r\n .table-default .th-default {\r\n padding: 0.75rem;\r\n vertical-align: top;\r\n border-top: 1px solid #dee2e6;\r\n font-weight: normal;\r\n }\r\n\r\n .th-default {\r\n text-align: inherit;\r\n }\r\n\r\n .table-default .tbody-default .tr-default:hover {\r\n color: #212529;\r\n background-color: rgba(0, 0, 0, 0.075);\r\n cursor: pointer;\r\n }\r\n</style>\r\n"
],
"names": [],
"mappings": "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"
}
Reference in a new issue View git blame Copy permalink