Merge pull request #6830 from Budibase/fix/binding-drawer-positioning

Fix for left positioning of the KeyValueBuilder drawers

packages/builder/src/components/automation/SetupPanel/AutomationBlockSetup.svelte

@@ -246,6 +246,7 @@
             {bindings}
             allowJS={false}
             updateOnChange={false}
+            drawerLeft="260px"
           />
         {/if}
       {:else if value.customType === "query"}
@@ -335,6 +336,7 @@
               {bindings}
               updateOnChange={false}
               placeholder={value.customType === "queryLimit" ? queryLimit : ""}
+              drawerLeft="260px"
             />
           </div>
         {/if}

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

@@ -18,6 +18,7 @@
   export let fillWidth
   export let allowJS = true
   export let updateOnChange = true
+  export let drawerLeft
 
   const dispatch = createEventDispatcher()
   let bindingDrawer
@@ -53,7 +54,7 @@
     </div>
   {/if}
 </div>
-<Drawer {fillWidth} bind:this={bindingDrawer} {title}>
+<Drawer {fillWidth} bind:this={bindingDrawer} {title} left={drawerLeft}>
   <svelte:fragment slot="description">
     Add the objects on the left to enrich your text.
   </svelte:fragment>

packages/builder/src/components/integration/KeyValueBuilder.svelte

@@ -32,6 +32,7 @@
   export let menuItems
   export let showMenu = false
   export let bindings = []
+  export let bindingDrawerLeft
 
   let fields = Object.entries(object || {}).map(([name, value]) => ({
     name,
@@ -119,6 +120,7 @@
           value={field.value}
           allowJS={false}
           fillWidth={true}
+          drawerLeft={bindingDrawerLeft}
         />
       {:else}
         <Input

packages/builder/src/pages/builder/app/[application]/data/datasource/[selectedDatasource]/rest/[query]/index.svelte

@@ -440,6 +440,7 @@
                 ...dynamicRequestBindings,
                 ...dataSourceStaticBindings,
               ]}
+              bindingDrawerLeft="260px"
             />
           </Tab>
           <Tab title="Params">
@@ -448,6 +449,7 @@
               name="param"
               headings
               bindings={mergedBindings}
+              bindingDrawerLeft="260px"
             />
           </Tab>
           <Tab title="Headers">
@@ -458,6 +460,7 @@
               name="header"
               headings
               bindings={mergedBindings}
+              bindingDrawerLeft="260px"
             />
           </Tab>
           <Tab title="Body">