bump bbui

6 years ago · dd76891181
3 changed files with 27 additions and 36 deletions
--- a/packages/builder/package.json
+++ b/packages/builder/package.json
@ -63,7 +63,7 @@
    }
  },
  "dependencies": {
-    "@budibase/bbui": "^1.53.0",
+    "@budibase/bbui": "^1.53.1",
    "@budibase/client": "^0.5.3",
    "@budibase/colorpicker": "^1.0.1",
    "@budibase/svelte-ag-grid": "^0.0.16",
--- a/packages/builder/src/components/userInterface/BindingDropdown.svelte
+++ b/packages/builder/src/components/userInterface/BindingDropdown.svelte
@ -52,52 +52,26 @@
    {/if}
  </div>
  <div class="text">
-    <Heading extraSmall>Data binding</Heading>
-    <Spacer small />
-    <Body extraSmall lh>
-      Binding connects one piece of data to another and makes it dynamic. Click
-      the objects on the left, to add them to the textbox.
-    </Body>
-    <Spacer large />
    <TextArea
      thin
      bind:value
      placeholder="Add text, or click the objects on the left to add them to the
      textbox." />
-    <div class="controls">
-      <a href="https://docs.budibase.com/design/binding">
-        <Body small grey>Learn more about binding</Body>
-      </a>
-      <Button on:click={cancel} secondary>Cancel</Button>
-      <Button on:click={close} primary>Done</Button>
-    </div>
  </div>
 </div>

 <style>
  .container {
    display: grid;
-    grid-template-columns: auto auto;
-  }
-  .list,
-  .text {
-    padding: var(--spacing-m);
-  }
-  .controls {
-    margin-top: var(--spacing-m);
-    display: grid;
-    align-items: center;
-    grid-gap: var(--spacing-l);
-    grid-template-columns: 1fr auto auto;
+    grid-template-columns: auto 1fr;
  }
  .list {
    width: 150px;
    border-right: 1.5px solid var(--grey-4);
-    padding: var(--spacing-xl);
+    padding: var(--spacing-s);
  }
  .text {
-    width: 600px;
-    padding: var(--spacing-xl);
+    padding: var(--spacing-s);
    font-family: var(--font-sans);
  }
  .text :global(p) {
--- a/packages/builder/src/components/userInterface/PropertyControl.svelte
+++ b/packages/builder/src/components/userInterface/PropertyControl.svelte
@ -1,5 +1,5 @@
 <script>
-  import { Icon, Drawer } from "@budibase/bbui"
+  import { Button, Icon, Drawer } from "@budibase/bbui"
  import Input from "./PropertyPanelControls/Input.svelte"
  import { store, backendUiStore, currentAsset } from "builderStore"
  import fetchBindableProperties from "builderStore/fetchBindableProperties"
@ -106,11 +106,24 @@
      handleClose()
      showDrawer = false
    }}>
-    <BindingDropdown
-      {...handlevalueKey(value)}
-      close={() => showDrawer = false}
-      on:update={e => (temporaryBindableValue = e.detail)}
-      {bindableProperties} />
+    <div slot="buttons">
+      <Button
+        blue
+        thin
+        on:click={() => {
+          notifier.success('Query parameters saved.')
+          handleSelected(value)
+        }}>
+        Save
+      </Button>
+    </div>
+    <div class="drawer-contents" slot="body">
+      <BindingDropdown
+        {...handlevalueKey(value)}
+        close={() => showDrawer = false}
+        on:update={e => (temporaryBindableValue = e.detail)}
+        {bindableProperties} />
+    </div>
  </Drawer>
 {/if}

@ -161,4 +174,8 @@
    color: var(--ink);
    cursor: pointer;
  }
+  .drawer-contents {
+    height: 40vh;
+    overflow-y: auto;
+  }
 </style>