diff --git a/packages/builder/src/builderStore/dataBinding.js b/packages/builder/src/builderStore/dataBinding.js index 647fc194a..cdb53375b 100644 --- a/packages/builder/src/builderStore/dataBinding.js +++ b/packages/builder/src/builderStore/dataBinding.js @@ -71,9 +71,14 @@ export const getBindableComponents = rootComponent => { return definition.bindable } const components = findAllMatchingComponents(rootComponent, componentSelector) - console.log(components) - - return [] + return components.map(component => { + return { + type: "instance", + providerId: component._id, + runtimeBinding: `${component._id}`, + readableBinding: `${component._instanceName}`, + } + }) } /** diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/BindingDropdown.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/BindingDropdown.svelte index 401d0ac3a..2989315ba 100644 --- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/BindingDropdown.svelte +++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/BindingDropdown.svelte @@ -21,42 +21,51 @@ } $: ({ instance, context } = groupBy("type", bindableProperties)) + $: hasBindableProperties = !!bindableProperties?.length
- Objects - - {#if context} - Tables -
    - {#each context as { readableBinding }} -
  • addToText(readableBinding)}>{readableBinding}
    • - {/each} -
- {/if} - {#if instance} - Components -
    - {#each instance as { readableBinding }} -
  • addToText(readableBinding)}>{readableBinding}
    • - {/each} -
+ {#if hasBindableProperties} + {#if context} + Contexts + +
    + {#each context as { readableBinding }} +
  • addToText(readableBinding)}> + {readableBinding} +
    • + {/each} +
+ {/if} + {#if instance} + + Components + +
    + {#each instance as { readableBinding }} +
  • addToText(readableBinding)}> + {readableBinding} +
    • + {/each} +
+ {/if} + {:else} +
There aren't any bindable properties available.
{/if}
- Data binding + Data Binding Binding connects one piece of data to another and makes it dynamic. Click - the objects on the left, to add them to the textbox. + the objects on the left to add them to the extbox.