diff --git a/packages/bbui/src/Drawer/DrawerContent.svelte b/packages/bbui/src/Drawer/DrawerContent.svelte index b41b1ab529..955abc0da4 100644 --- a/packages/bbui/src/Drawer/DrawerContent.svelte +++ b/packages/bbui/src/Drawer/DrawerContent.svelte @@ -28,11 +28,9 @@ border-right: var(--border-light); overflow: auto; } - .sidebar::-webkit-scrollbar { display: none; } - .main { font-family: var(--font-sans); } diff --git a/packages/bbui/src/Form/Core/TextArea.svelte b/packages/bbui/src/Form/Core/TextArea.svelte index 28e5955b8d..e4738b8e55 100644 --- a/packages/bbui/src/Form/Core/TextArea.svelte +++ b/packages/bbui/src/Form/Core/TextArea.svelte @@ -37,6 +37,7 @@ {/if} + + >{value || ""} diff --git a/packages/builder/src/components/automation/SetupPanel/AutomationBindingPanel.svelte b/packages/builder/src/components/common/bindings/ServerBindingPanel.svelte similarity index 77% rename from packages/builder/src/components/automation/SetupPanel/AutomationBindingPanel.svelte rename to packages/builder/src/components/common/bindings/ServerBindingPanel.svelte index 0e26b15600..cabc9c9dfb 100644 --- a/packages/builder/src/components/automation/SetupPanel/AutomationBindingPanel.svelte +++ b/packages/builder/src/components/common/bindings/ServerBindingPanel.svelte @@ -10,18 +10,20 @@ import { createEventDispatcher } from "svelte" import { isValid } from "@budibase/string-templates" import { handlebarsCompletions } from "constants/completions" + import { readableToRuntimeBinding } from "../../../builderStore/dataBinding" + import { addToText } from "./utils" const dispatch = createEventDispatcher() - export let value = "" - export let bindingDrawer + export let bindingContainer export let bindableProperties = [] + export let validity = true + export let value = "" - let originalValue = value + let hasReadable = bindableProperties[0].readableBinding != null let helpers = handlebarsCompletions() let getCaretPosition let search = "" - let validity = true $: categories = Object.entries(groupBy("category", bindableProperties)) $: value && checkValid() @@ -29,25 +31,13 @@ $: searchRgx = new RegExp(search, "ig") function checkValid() { - validity = isValid(value) - } - - function addToText(binding) { - const position = getCaretPosition() - const toAdd = `{{ ${binding.path} }}` - if (position.start) { - value = - value.substring(0, position.start) + - toAdd + - value.substring(position.end, value.length) + if (hasReadable) { + const runtime = readableToRuntimeBinding(bindableProperties, value) + validity = isValid(runtime) } else { - value += toAdd + validity = isValid(value) } } - export function cancel() { - dispatch("update", originalValue) - bindingDrawer.close() - } @@ -63,7 +53,12 @@ {#each bindableProperties.filter(binding => binding.label.match(searchRgx) ) as binding} -
addToText(binding)}> +
{ + value = addToText(value, getCaretPosition(), binding) + }} + > {binding.label} {binding.type}
@@ -77,13 +72,18 @@
Helpers {#each helpers.filter(helper => helper.label.match(searchRgx) || helper.description.match(searchRgx)) as helper} -
addToText(helper)}> +
{ + value = addToText(value, getCaretPosition(), helper.text) + }} + > {helper.label}
{@html helper.description || ""}
-
{helper.example || ''}
+
{helper.example || ""}
{/each}
@@ -92,7 +92,6 @@