Merge branch 'master' into cheeks-fixes

packages/bbui/src/Table/CellRenderer.svelte

@@ -12,6 +12,7 @@
   export let schema
   export let value
   export let customRenderers = []
+  export let snippets
 
   let renderer
   const typeMap = {
@@ -32,6 +33,8 @@
   $: renderer = customRenderer?.component ?? typeMap[type] ?? StringRenderer
   $: cellValue = getCellValue(value, schema.template)
 
+  $: console.log(snippets)
+
   const getType = schema => {
     // Use a string renderer for dates if we use a custom template
     if (schema?.type === "datetime" && schema?.template) {
@@ -44,7 +47,7 @@
     if (!template) {
       return value
     }
-    return processStringSync(template, { value })
+    return processStringSync(template, { value, snippets })
   }
 </script>
 

packages/bbui/src/Table/Table.svelte

@@ -42,6 +42,7 @@
   export let customPlaceholder = false
   export let showHeaderBorder = true
   export let placeholderText = "No rows found"
+  export let snippets = []
 
   const dispatch = createEventDispatcher()
 
@@ -425,6 +426,7 @@
                   <CellRenderer
                     {customRenderers}
                     {row}
+                    {snippets}
                     schema={schema[field]}
                     value={deepGet(row, field)}
                     on:clickrelationship

packages/builder/src/components/common/CodeEditor/index.js

@@ -313,7 +313,7 @@ export const bindingsToCompletions = (bindings, mode) => {
       ...bindingByCategory[catKey].reduce((acc, binding) => {
         let displayType = binding.fieldSchema?.type || binding.display?.type
         acc.push({
-          label: binding.display?.name || "NO NAME",
+          label: binding.display?.name || binding.readableBinding || "NO NAME",
           info: completion => {
             return buildBindingInfoNode(completion, binding)
           },

packages/builder/src/components/common/bindings/ClientBindingPanel.svelte

@@ -8,6 +8,7 @@
   export let allowJS = false
   export let allowHelpers = true
   export let autofocusEditor = false
+  export let context = null
 
   $: enrichedBindings = enrichBindings(bindings)
 
@@ -27,7 +28,7 @@
 
 <BindingPanel
   bindings={enrichedBindings}
-  context={$previewStore.selectedComponentContext}
+  context={{ ...$previewStore.selectedComponentContext, ...context }}
   snippets={$snippets}
   {value}
   {allowJS}

packages/builder/src/components/design/settings/controls/ColumnEditor/CellDrawer.svelte

@@ -7,10 +7,13 @@
     Layout,
     Label,
   } from "@budibase/bbui"
-  import { themeStore } from "stores/builder"
+  import { themeStore, previewStore } from "stores/builder"
   import DrawerBindableInput from "components/common/bindings/DrawerBindableInput.svelte"
 
   export let column
+
+  $: columnValue =
+    $previewStore.selectedComponentContext?.eventContext?.row?.[column.name]
 </script>
 
 <DrawerContent>
@@ -41,6 +44,9 @@
             icon: "TableColumnMerge",
           },
         ]}
+        context={{
+          value: columnValue,
+        }}
       />
       <Layout noPadding gap="XS">
         <Label>Background color</Label>

packages/client/src/components/app/deprecated/table/Table.svelte

@@ -16,8 +16,15 @@
   export let noRowsMessage
 
   const component = getContext("component")
-  const { styleable, getAction, ActionTypes, rowSelectionStore } =
-    getContext("sdk")
+  const context = getContext("context")
+  const {
+    styleable,
+    getAction,
+    ActionTypes,
+    rowSelectionStore,
+    generateGoldenSample,
+  } = getContext("sdk")
+
   const customColumnKey = `custom-${Math.random()}`
   const customRenderers = [
     {
@@ -28,6 +35,7 @@
 
   let selectedRows = []
 
+  $: snippets = $context.snippets
   $: hasChildren = $component.children
   $: loading = dataProvider?.loading ?? false
   $: data = dataProvider?.rows || []
@@ -61,6 +69,16 @@
     selectedRows,
   }
 
+  // Provide additional data context for live binding eval
+  export const getAdditionalDataContext = () => {
+    const goldenRow = generateGoldenSample(data)
+    return {
+      eventContext: {
+        row: goldenRow,
+      },
+    }
+  }
+
   const getFields = (
     schema,
     customColumns,
@@ -178,6 +196,7 @@
       {quiet}
       {compact}
       {customRenderers}
+      {snippets}
       allowSelectRows={allowSelectRows && table}
       bind:selectedRows
       allowEditRows={false}