From a50bb3b0cc4e575537b247a31a7a07f1a30f6db2 Mon Sep 17 00:00:00 2001 From: kevmodrome Date: Mon, 8 Jun 2020 12:09:01 +0200 Subject: [PATCH 01/10] bump bbui version and rework homepage to use HomeLinks --- packages/builder/package.json | 4 +- packages/builder/src/pages/_layout.svelte | 135 +++------------------- 2 files changed, 18 insertions(+), 121 deletions(-) diff --git a/packages/builder/package.json b/packages/builder/package.json index 65072a9f0f..8ee1de07d0 100644 --- a/packages/builder/package.json +++ b/packages/builder/package.json @@ -39,7 +39,7 @@ }, "dependencies": { "@beyonk/svelte-notifications": "^2.0.3", - "@budibase/bbui": "^0.3.5", + "@budibase/bbui": "^0.3.6", "@budibase/client": "^0.0.32", "@nx-js/compiler-util": "^2.0.0", "codemirror": "^5.51.0", @@ -86,4 +86,4 @@ "svelte": "3.23.x" }, "gitHead": "115189f72a850bfb52b65ec61d932531bf327072" -} +} \ No newline at end of file diff --git a/packages/builder/src/pages/_layout.svelte b/packages/builder/src/pages/_layout.svelte index 09e1254379..f8a0d1d244 100644 --- a/packages/builder/src/pages/_layout.svelte +++ b/packages/builder/src/pages/_layout.svelte @@ -1,5 +1,6 @@
@@ -111,13 +127,7 @@ style="height: 100%; width: 100%" title="componentPreview" bind:this={iframe} - srcdoc={iframeTemplate({ - styles, - stylesheetLinks, - selectedComponentType, - selectedComponentId, - frontendDefinition: JSON.stringify(frontendDefinition), - })} /> + srcdoc={iframeTemplate} /> {/if}
diff --git a/packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js b/packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js index 462becb32f..c7b7aeebcc 100644 --- a/packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js +++ b/packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js @@ -1,20 +1,6 @@ -export default ({ - styles, - stylesheetLinks, - selectedComponentType, - selectedComponentId, - frontendDefinition, -}) => ` +export default ` - ${stylesheetLinks} - From 5799fbf23fc1d61d22f7ab60e0bd6cb74f8b4f81 Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Tue, 9 Jun 2020 06:22:00 +0100 Subject: [PATCH 04/10] code review: add listner once --- .../userInterface/AppPreview/CurrentItemPreview.svelte | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte b/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte index 538e8c0769..53450c2200 100644 --- a/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte +++ b/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte @@ -110,11 +110,8 @@ frontendDefinition, })) } - let iframeLoaded = false - $: if(iframe && !iframeLoaded) { - iframe.contentWindow.addEventListener("bb-ready", refreshContent) - iframeLoaded = true - } + + $: if(iframe) iframe.contentWindow.addEventListener("bb-ready", refreshContent, { once: true }) $: if(iframe && frontendDefinition) { refreshContent() From d640f90e7b2cdb9533262ba4819b262dfabbc55c Mon Sep 17 00:00:00 2001 From: kevmodrome Date: Tue, 9 Jun 2020 11:00:50 +0200 Subject: [PATCH 05/10] feat: move DetailSummary component in properties pane to bbui --- packages/builder/package.json | 2 +- .../userInterface/PropertyGroup.svelte | 85 +++---------------- 2 files changed, 13 insertions(+), 74 deletions(-) diff --git a/packages/builder/package.json b/packages/builder/package.json index d2d9cdb11b..8fe9ffd494 100644 --- a/packages/builder/package.json +++ b/packages/builder/package.json @@ -39,7 +39,7 @@ }, "dependencies": { "@beyonk/svelte-notifications": "^2.0.3", - "@budibase/bbui": "^0.3.7", + "@budibase/bbui": "^1.1.1", "@budibase/client": "^0.0.32", "@nx-js/compiler-util": "^2.0.0", "codemirror": "^5.51.0", diff --git a/packages/builder/src/components/userInterface/PropertyGroup.svelte b/packages/builder/src/components/userInterface/PropertyGroup.svelte index a51607833a..b181b406a7 100644 --- a/packages/builder/src/components/userInterface/PropertyGroup.svelte +++ b/packages/builder/src/components/userInterface/PropertyGroup.svelte @@ -1,6 +1,7 @@ -
-
(show = !show)}> -
- -
-
{capitalize(name)}
-
-
- - {#each properties as props} - onStyleChanged(styleCategory, key, value)} - props={{ ...excludeProps(props, ['control', 'label']) }} /> - {/each} -
-
- - + + {#each properties as props} + onStyleChanged(styleCategory, key, value)} + props={{ ...excludeProps(props, ['control', 'label']) }} /> + {/each} + From d029dc6a4d9a30f1e71be6b46c1ac0b18e507ce6 Mon Sep 17 00:00:00 2001 From: Conor_Mack Date: Tue, 9 Jun 2020 11:33:37 +0100 Subject: [PATCH 06/10] User can now specify suffix in the Input --- .../src/components/common/Inputs/InputGroup.svelte | 8 ++++---- .../src/components/userInterface/propertyCategories.js | 8 -------- 2 files changed, 4 insertions(+), 12 deletions(-) diff --git a/packages/builder/src/components/common/Inputs/InputGroup.svelte b/packages/builder/src/components/common/Inputs/InputGroup.svelte index 3be9f17b16..e5fed68103 100644 --- a/packages/builder/src/components/common/Inputs/InputGroup.svelte +++ b/packages/builder/src/components/common/Inputs/InputGroup.svelte @@ -10,18 +10,18 @@ export let onChange = () => {} function handleChange(val, idx) { - value.splice(idx, 1, val !== "auto" ? val + suffix : val) + value.splice(idx, 1, val !== "auto" && suffix ? val + suffix : val) value = value let _value = value.map(v => - !v.endsWith(suffix) && v !== "auto" ? v + suffix : v + suffix && !v.endsWith(suffix) && v !== "auto" ? v + suffix : v ) onChange(_value) } - $: displayValues = value + $: displayValues = value && suffix ? value.map(v => v.replace(new RegExp(`${suffix}$`), "")) - : [] + : value || []
diff --git a/packages/builder/src/components/userInterface/propertyCategories.js b/packages/builder/src/components/userInterface/propertyCategories.js index 59458edd49..20e4703324 100644 --- a/packages/builder/src/components/userInterface/propertyCategories.js +++ b/packages/builder/src/components/userInterface/propertyCategories.js @@ -84,7 +84,6 @@ export const spacing = [ key: "margin", control: InputGroup, meta: spacingMeta, - suffix: "px", defaultValue: ["0", "0", "0", "0"], }, { @@ -92,7 +91,6 @@ export const spacing = [ key: "padding", control: InputGroup, meta: spacingMeta, - suffix: "px", defaultValue: ["0", "0", "0", "0"], }, ] @@ -103,7 +101,6 @@ export const size = [ key: "width", control: Input, placeholder: "px", - suffix: "px", width: "48px", textAlign: "center", }, @@ -112,7 +109,6 @@ export const size = [ key: "height", control: Input, placeholder: "px", - suffix: "px", width: "48px", textAlign: "center", }, @@ -121,7 +117,6 @@ export const size = [ key: "min-width", control: Input, placeholder: "px", - suffix: "px", width: "48px", textAlign: "center", }, @@ -129,7 +124,6 @@ export const size = [ label: "Min H", key: "min-height", control: Input, - suffix: "px", placeholder: "px", width: "48px", textAlign: "center", @@ -139,7 +133,6 @@ export const size = [ key: "max-width", control: Input, placeholder: "px", - suffix: "px", width: "48px", textAlign: "center", }, @@ -148,7 +141,6 @@ export const size = [ key: "max-height", control: Input, placeholder: "px", - suffix: "px", width: "48px", textAlign: "center", }, From 1c1447011be5f7d4a3c1fd1688f9210dcb1479f6 Mon Sep 17 00:00:00 2001 From: Michael Shanks Date: Tue, 9 Jun 2020 11:44:33 +0100 Subject: [PATCH 07/10] preventDefault on clicks, in preview --- .../components/userInterface/AppPreview/iframeTemplate.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js b/packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js index c7b7aeebcc..3d305f1c1d 100644 --- a/packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js +++ b/packages/builder/src/components/userInterface/AppPreview/iframeTemplate.js @@ -53,6 +53,11 @@ export default ` let styles let selectedComponentStyle + document.addEventListener("click", function(e) { + e.preventDefault() + e.stopPropagation() + return false; + }, true) import('/_builder/budibase-client.esm.mjs') .then(module => { From 96708ce75aa5f3bc0febfd803d656463adad8411 Mon Sep 17 00:00:00 2001 From: Martin McKeaveney Date: Tue, 9 Jun 2020 13:30:01 +0100 Subject: [PATCH 08/10] preview app in new window --- .../builder/src/pages/[application]/_reset.svelte | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/builder/src/pages/[application]/_reset.svelte b/packages/builder/src/pages/[application]/_reset.svelte index 2eec749c8f..63d9ab38d2 100644 --- a/packages/builder/src/pages/[application]/_reset.svelte +++ b/packages/builder/src/pages/[application]/_reset.svelte @@ -59,12 +59,12 @@ on:click={() => $goto(`/settings`)}> - (location = `/${application}`)}> - - + window.open(`/${application}`)}> + +
From a325ef2a8f968be1b51cef9524b9cae60e4f849f Mon Sep 17 00:00:00 2001 From: Martin McKeaveney Date: Tue, 9 Jun 2020 13:34:19 +0100 Subject: [PATCH 09/10] fix spacing --- .../builder/src/pages/[application]/_reset.svelte | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/builder/src/pages/[application]/_reset.svelte b/packages/builder/src/pages/[application]/_reset.svelte index 63d9ab38d2..4d2a708f1e 100644 --- a/packages/builder/src/pages/[application]/_reset.svelte +++ b/packages/builder/src/pages/[application]/_reset.svelte @@ -59,12 +59,12 @@ on:click={() => $goto(`/settings`)}> - window.open(`/${application}`)}> - - + window.open(`/${application}`)}> + + From 35aa2d341a90661dcc733d4e1eb10f8e812a3a31 Mon Sep 17 00:00:00 2001 From: Martin McKeaveney Date: Tue, 9 Jun 2020 19:18:45 +0100 Subject: [PATCH 10/10] Revert "Fixes for Screen and Page Props" --- .../builder/src/builderStore/store/index.js | 12 ------ .../ComponentPropertiesPanel.svelte | 43 ++++++------------- .../userInterface/SettingsView.svelte | 5 +-- .../userInterface/propertyCategories.js | 14 ++---- 4 files changed, 18 insertions(+), 56 deletions(-) diff --git a/packages/builder/src/builderStore/store/index.js b/packages/builder/src/builderStore/store/index.js index ac66643612..9f91550bca 100644 --- a/packages/builder/src/builderStore/store/index.js +++ b/packages/builder/src/builderStore/store/index.js @@ -69,7 +69,6 @@ export const getStore = () => { store.getPathToComponent = getPathToComponent(store) store.addTemplatedComponent = addTemplatedComponent(store) store.setMetadataProp = setMetadataProp(store) - store.editPageOrScreen = editPageOrScreen(store) return store } @@ -172,15 +171,6 @@ const createScreen = store => (screenName, route, layoutComponentName) => { }) } -const editPageOrScreen = store => (key, value) => { - store.update(state => { - state.currentPreviewItem[key] = value - _saveCurrentPreviewItem(state) - - return state - }) -} - const setCurrentScreen = store => screenName => { store.update(s => { const screen = getExactComponent(s.screens, screenName) @@ -295,7 +285,6 @@ const setCurrentPage = store => pageName => { state.currentFrontEndType = "page" state.currentPageName = pageName - state.currentView = "detail" state.screens = Array.isArray(current_screens) ? current_screens : Object.values(current_screens) @@ -456,7 +445,6 @@ const setScreenType = store => type => { state.currentComponentInfo = pageOrScreen ? pageOrScreen.props : null state.currentPreviewItem = pageOrScreen - state.currentView = "detail" return state }) } diff --git a/packages/builder/src/components/userInterface/ComponentPropertiesPanel.svelte b/packages/builder/src/components/userInterface/ComponentPropertiesPanel.svelte index caef9eb2fd..60279aa9a1 100644 --- a/packages/builder/src/components/userInterface/ComponentPropertiesPanel.svelte +++ b/packages/builder/src/components/userInterface/ComponentPropertiesPanel.svelte @@ -1,6 +1,5 @@