diff --git a/lerna.json b/lerna.json index 964839467a..2c2f69c310 100644 --- a/lerna.json +++ b/lerna.json @@ -1,5 +1,5 @@ { - "version": "2.2.12-alpha.61", + "version": "2.2.12-alpha.66", "npmClient": "yarn", "packages": [ "packages/*" diff --git a/packages/backend-core/package.json b/packages/backend-core/package.json index 1257f7567c..3be4d37dd7 100644 --- a/packages/backend-core/package.json +++ b/packages/backend-core/package.json @@ -1,6 +1,6 @@ { "name": "@budibase/backend-core", - "version": "2.2.12-alpha.61", + "version": "2.2.12-alpha.66", "description": "Budibase backend core libraries used in server and worker", "main": "dist/src/index.js", "types": "dist/src/index.d.ts", @@ -23,7 +23,7 @@ }, "dependencies": { "@budibase/nano": "10.1.1", - "@budibase/types": "2.2.12-alpha.61", + "@budibase/types": "2.2.12-alpha.66", "@shopify/jest-koa-mocks": "5.0.1", "@techpass/passport-openidconnect": "0.3.2", "aws-cloudfront-sign": "2.2.0", diff --git a/packages/backend-core/yarn.lock b/packages/backend-core/yarn.lock index b288cc521b..c1ec890e92 100644 --- a/packages/backend-core/yarn.lock +++ b/packages/backend-core/yarn.lock @@ -310,6 +310,11 @@ qs "^6.11.0" tough-cookie "^4.1.2" +"@budibase/types@2.2.12-alpha.62": + version "2.2.12-alpha.62" + resolved "https://registry.yarnpkg.com/@budibase/types/-/types-2.2.12-alpha.62.tgz#385ef000610d5c00b83cb2eafda2bd63c86b7f3f" + integrity sha512-idlhB4fSyBCEDWsVvQvdmN9Dg9VAEwxZ8TLE9pGnXIRZPg48MKXPNn5AUT9zv6cDlbQdlU2tFFF8st9b6lyLuw== + "@cspotcode/source-map-support@^0.8.0": version "0.8.1" resolved "https://registry.yarnpkg.com/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz#00629c35a688e05a88b1cda684fb9d5e73f000a1" @@ -2773,9 +2778,9 @@ http-assert@^1.3.0: http-errors "~1.8.0" http-cache-semantics@^4.0.0: - version "4.1.0" - resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz#49e91c5cbf36c9b94bcfcd71c23d5249ec74e390" - integrity sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ== + version "4.1.1" + resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz#abe02fcb2985460bf0323be664436ec3476a6d5a" + integrity sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ== http-cookie-agent@^4.0.2: version "4.0.2" diff --git a/packages/bbui/package.json b/packages/bbui/package.json index 8b5cb63708..d055d4c47d 100644 --- a/packages/bbui/package.json +++ b/packages/bbui/package.json @@ -1,7 +1,7 @@ { "name": "@budibase/bbui", "description": "A UI solution used in the different Budibase projects.", - "version": "2.2.12-alpha.61", + "version": "2.2.12-alpha.66", "license": "MPL-2.0", "svelte": "src/index.js", "module": "dist/bbui.es.js", @@ -38,7 +38,7 @@ ], "dependencies": { "@adobe/spectrum-css-workflow-icons": "1.2.1", - "@budibase/string-templates": "2.2.12-alpha.61", + "@budibase/string-templates": "2.2.12-alpha.66", "@spectrum-css/accordion": "3.0.24", "@spectrum-css/actionbutton": "1.0.1", "@spectrum-css/actiongroup": "1.0.1", diff --git a/packages/bbui/src/ActionButton/ActionButton.svelte b/packages/bbui/src/ActionButton/ActionButton.svelte index a8dc989313..663128160f 100644 --- a/packages/bbui/src/ActionButton/ActionButton.svelte +++ b/packages/bbui/src/ActionButton/ActionButton.svelte @@ -86,7 +86,7 @@ } .is-selected:not(.spectrum-ActionButton--emphasized):not(.spectrum-ActionButton--quiet) { background: var(--spectrum-global-color-gray-300); - border-color: var(--spectrum-global-color-gray-700); + border-color: var(--spectrum-global-color-gray-500); } .noPadding { padding: 0; diff --git a/packages/bbui/src/Actions/position_dropdown.js b/packages/bbui/src/Actions/position_dropdown.js index d99601afeb..abc7188985 100644 --- a/packages/bbui/src/Actions/position_dropdown.js +++ b/packages/bbui/src/Actions/position_dropdown.js @@ -1,11 +1,21 @@ -export default function positionDropdown( - element, - { anchor, align, maxWidth, useAnchorWidth, offset = 5 } -) { - const update = () => { +export default function positionDropdown(element, opts) { + let resizeObserver + let latestOpts = opts + + // We need a static reference to this function so that we can properly + // clean up the scroll listener. + const scrollUpdate = () => { + updatePosition(latestOpts) + } + + // Updates the position of the dropdown + const updatePosition = opts => { + const { anchor, align, maxWidth, useAnchorWidth, offset = 5 } = opts if (!anchor) { return } + + // Compute bounds const anchorBounds = anchor.getBoundingClientRect() const elementBounds = element.getBoundingClientRect() let styles = { @@ -51,26 +61,47 @@ export default function positionDropdown( }) } + // The actual svelte action callback which creates observers on the relevant + // DOM elements + const update = newOpts => { + latestOpts = newOpts + + // Cleanup old state + if (resizeObserver) { + resizeObserver.disconnect() + } + + // Do nothing if no anchor + const { anchor } = newOpts + if (!anchor) { + return + } + + // Observe both anchor and element and resize the popover as appropriate + resizeObserver = new ResizeObserver(() => updatePosition(newOpts)) + resizeObserver.observe(anchor) + resizeObserver.observe(element) + resizeObserver.observe(document.body) + } + // Apply initial styles which don't need to change element.style.position = "absolute" element.style.zIndex = "9999" - // Observe both anchor and element and resize the popover as appropriate - const resizeObserver = new ResizeObserver(entries => { - entries.forEach(update) - }) - if (anchor) { - resizeObserver.observe(anchor) - } - resizeObserver.observe(element) - resizeObserver.observe(document.body) + // Set up a scroll listener + document.addEventListener("scroll", scrollUpdate, true) - document.addEventListener("scroll", update, true) + // Perform initial update + update(opts) return { + update, destroy() { - resizeObserver.disconnect() - document.removeEventListener("scroll", update, true) + // Cleanup + if (resizeObserver) { + resizeObserver.disconnect() + } + document.removeEventListener("scroll", scrollUpdate, true) }, } } diff --git a/packages/bbui/src/Popover/Popover.svelte b/packages/bbui/src/Popover/Popover.svelte index b873fabb80..8f6ef06591 100644 --- a/packages/bbui/src/Popover/Popover.svelte +++ b/packages/bbui/src/Popover/Popover.svelte @@ -57,30 +57,28 @@ {#if open} - {#key anchor} - - {}, - anchor, - }} - on:keydown={handleEscape} - class="spectrum-Popover is-open" - role="presentation" - transition:fly|local={{ y: -20, duration: 200 }} - > - - - - {/key} + + {}, + anchor, + }} + on:keydown={handleEscape} + class="spectrum-Popover is-open" + role="presentation" + transition:fly|local={{ y: -20, duration: 200 }} + > + + + {/if} diff --git a/packages/builder/src/pages/builder/auth/login.svelte b/packages/builder/src/pages/builder/auth/login.svelte index 032cf850fa..80122c23a5 100644 --- a/packages/builder/src/pages/builder/auth/login.svelte +++ b/packages/builder/src/pages/builder/auth/login.svelte @@ -66,7 +66,7 @@ - + {#if loaded} @@ -124,14 +124,19 @@ - 0} on:click={login}> + 0} + on:click={login} + > Log in to {company} - $goto("./forgot")}> - Forgot password + $goto("./forgot")}> + Forgot password? diff --git a/packages/builder/src/pages/builder/invite/index.svelte b/packages/builder/src/pages/builder/invite/index.svelte index 4b786db497..35231117c4 100644 --- a/packages/builder/src/pages/builder/invite/index.svelte +++ b/packages/builder/src/pages/builder/invite/index.svelte @@ -68,7 +68,7 @@ - + Join {company} @@ -175,6 +175,7 @@ 0 || onboarding} cta on:click={acceptInvite} diff --git a/packages/builder/src/pages/builder/portal/_layout.svelte b/packages/builder/src/pages/builder/portal/_layout.svelte index 1f95c2f694..e1f6d8ca3f 100644 --- a/packages/builder/src/pages/builder/portal/_layout.svelte +++ b/packages/builder/src/pages/builder/portal/_layout.svelte @@ -14,7 +14,7 @@ let activeTab = "Apps" $: $url(), updateActiveTab($menu) - $: fullScreen = !$apps?.length + $: fullscreen = !$apps.length const updateActiveTab = menu => { for (let entry of menu) { @@ -37,7 +37,8 @@ $redirect("../") } else { try { - await organisation.init() + // We need to load apps to know if we need to show onboarding fullscreen + await Promise.all([apps.load(), organisation.init()]) } catch (error) { notifications.error("Error getting org config") } @@ -47,37 +48,39 @@ }) -{#if fullScreen} - -{:else if $auth.user && loaded} - - - - - +{#if $auth.user && loaded} + {#if fullscreen} + + {:else} + + + + + + + + + {#each $menu as { title, href }} + $goto(href)} /> + {/each} + + + + + + + + + + + - - - {#each $menu as { title, href }} - $goto(href)} /> - {/each} - - - - - - - - - - + + + - - - - - + {/if} {/if}