@budibase/bbui 1.0.15-alpha.0 → 1.0.17

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@budibase/bbui",
   "description": "A UI solution used in the different Budibase projects.",
-  "version": "1.0.15-alpha.0",
+  "version": "1.0.17",
   "license": "MPL-2.0",
   "svelte": "src/index.js",
   "module": "dist/bbui.es.js",
@@ -82,5 +82,5 @@
     "svelte-flatpickr": "^3.2.3",
     "svelte-portal": "^1.0.0"
   },
-  "gitHead": "35b66edf0243601c7b11fbe22b6d39a4f9f768a9"
+  "gitHead": "212bd458435ba8e7a6eee4ac5ec988a2aeebefef"
 }

package/src/Form/Core/Dropzone.svelte

@@ -6,8 +6,6 @@
   import { generateID } from "../../utils/helpers"
   import Icon from "../../Icon/Icon.svelte"
   import Link from "../../Link/Link.svelte"
-  import Tag from "../../Tags/Tag.svelte"
-  import Tags from "../../Tags/Tags.svelte"
 
   const BYTES_IN_KB = 1000
   const BYTES_IN_MB = 1000000
@@ -20,8 +18,6 @@
   export let handleFileTooLarge = null
   export let gallery = true
   export let error = null
-  export let fileTags = []
-  export let maximum = null
 
   const dispatch = createEventDispatcher()
   const imageExtensions = [
@@ -188,118 +184,103 @@
       {/each}
     {/if}
   {/if}
-  {#if !maximum || (maximum && value?.length < maximum)}
-    <div
-      class="spectrum-Dropzone"
-      class:is-invalid={!!error}
-      class:disabled
-      role="region"
-      tabindex="0"
-      on:dragover={handleDragOver}
-      on:dragleave={handleDragLeave}
-      on:dragenter={handleDragOver}
-      on:drop={handleDrop}
-      class:is-dragged={fileDragged}
-    >
-      <div class="spectrum-IllustratedMessage spectrum-IllustratedMessage--cta">
-        <input
-          id={fieldId}
-          {disabled}
-          type="file"
-          multiple
-          on:change={handleFile}
+  <div
+    class="spectrum-Dropzone"
+    class:is-invalid={!!error}
+    class:disabled
+    role="region"
+    tabindex="0"
+    on:dragover={handleDragOver}
+    on:dragleave={handleDragLeave}
+    on:dragenter={handleDragOver}
+    on:drop={handleDrop}
+    class:is-dragged={fileDragged}
+  >
+    <div class="spectrum-IllustratedMessage spectrum-IllustratedMessage--cta">
+      <input
+        id={fieldId}
+        {disabled}
+        type="file"
+        multiple
+        on:change={handleFile}
+      />
+      <svg
+        class="spectrum-IllustratedMessage-illustration"
+        width="125"
+        height="60"
+        viewBox="0 0 199 97.7"
+      >
+        <defs>
+          <style>
+            .cls-1,
+            .cls-2 {
+              fill: none;
+              stroke-linecap: round;
+              stroke-linejoin: round;
+            }
+            .cls-1 {
+              stroke-width: 3px;
+            }
+            .cls-2 {
+              stroke-width: 2px;
+            }
+          </style>
+        </defs>
+        <path
+          class="cls-1"
+          d="M110.53,85.66,100.26,95.89a1.09,1.09,0,0,1-1.52,0L88.47,85.66"
         />
-        <svg
-          class="spectrum-IllustratedMessage-illustration"
-          width="125"
-          height="60"
-          viewBox="0 0 199 97.7"
-        >
-          <defs>
-            <style>
-              .cls-1,
-              .cls-2 {
-                fill: none;
-                stroke-linecap: round;
-                stroke-linejoin: round;
-              }
-              .cls-1 {
-                stroke-width: 3px;
-              }
-              .cls-2 {
-                stroke-width: 2px;
-              }
-            </style>
-          </defs>
-          <path
-            class="cls-1"
-            d="M110.53,85.66,100.26,95.89a1.09,1.09,0,0,1-1.52,0L88.47,85.66"
-          />
-          <line class="cls-1" x1="99.5" y1="95.5" x2="99.5" y2="58.5" />
-          <path class="cls-1" d="M105.5,73.5h19a2,2,0,0,0,2-2v-43" />
-          <path
-            class="cls-1"
-            d="M126.5,22.5h-19a2,2,0,0,1-2-2V1.5h-31a2,2,0,0,0-2,2v68a2,2,0,0,0,2,2h19"
-          />
-          <line class="cls-1" x1="105.5" y1="1.5" x2="126.5" y2="22.5" />
-          <path
-            class="cls-2"
-            d="M47.93,50.49a5,5,0,1,0-4.83-5A4.93,4.93,0,0,0,47.93,50.49Z"
-          />
-          <path
-            class="cls-2"
-            d="M36.6,65.93,42.05,60A2.06,2.06,0,0,1,45,60l12.68,13.2"
-          />
-          <path
-            class="cls-2"
-            d="M3.14,73.23,22.42,53.76a1.65,1.65,0,0,1,2.38,0l19.05,19.7"
-          />
-          <path
-            class="cls-1"
-            d="M139.5,36.5H196A1.49,1.49,0,0,1,197.5,38V72A1.49,1.49,0,0,1,196,73.5H141A1.49,1.49,0,0,1,139.5,72V32A1.49,1.49,0,0,1,141,30.5H154a2.43,2.43,0,0,1,1.67.66l6,5.66"
-          />
-          <rect
-            class="cls-1"
-            x="1.5"
-            y="34.5"
-            width="58"
-            height="39"
-            rx="2"
-            ry="2"
-          />
-        </svg>
-        <h2
-          class="spectrum-Heading spectrum-Heading--sizeL spectrum-Heading--light spectrum-IllustratedMessage-heading"
+        <line class="cls-1" x1="99.5" y1="95.5" x2="99.5" y2="58.5" />
+        <path class="cls-1" d="M105.5,73.5h19a2,2,0,0,0,2-2v-43" />
+        <path
+          class="cls-1"
+          d="M126.5,22.5h-19a2,2,0,0,1-2-2V1.5h-31a2,2,0,0,0-2,2v68a2,2,0,0,0,2,2h19"
+        />
+        <line class="cls-1" x1="105.5" y1="1.5" x2="126.5" y2="22.5" />
+        <path
+          class="cls-2"
+          d="M47.93,50.49a5,5,0,1,0-4.83-5A4.93,4.93,0,0,0,47.93,50.49Z"
+        />
+        <path
+          class="cls-2"
+          d="M36.6,65.93,42.05,60A2.06,2.06,0,0,1,45,60l12.68,13.2"
+        />
+        <path
+          class="cls-2"
+          d="M3.14,73.23,22.42,53.76a1.65,1.65,0,0,1,2.38,0l19.05,19.7"
+        />
+        <path
+          class="cls-1"
+          d="M139.5,36.5H196A1.49,1.49,0,0,1,197.5,38V72A1.49,1.49,0,0,1,196,73.5H141A1.49,1.49,0,0,1,139.5,72V32A1.49,1.49,0,0,1,141,30.5H154a2.43,2.43,0,0,1,1.67.66l6,5.66"
+        />
+        <rect
+          class="cls-1"
+          x="1.5"
+          y="34.5"
+          width="58"
+          height="39"
+          rx="2"
+          ry="2"
+        />
+      </svg>
+      <h2
+        class="spectrum-Heading spectrum-Heading--sizeL spectrum-Heading--light spectrum-IllustratedMessage-heading"
+      >
+        Drag and drop your file
+      </h2>
+      {#if !disabled}
+        <p
+          class="spectrum-Body spectrum-Body--sizeS spectrum-IllustratedMessage-description"
         >
-          Drag and drop your file
-        </h2>
-        {#if !disabled}
-          <p
-            class="spectrum-Body spectrum-Body--sizeS spectrum-IllustratedMessage-description"
-          >
-            <label for={fieldId} class="spectrum-Link">
-              Select a file to upload
-            </label>
-            <br />
-            from your computer
-          </p>
-          {#if fileTags.length}
-            <Tags>
-              <div class="tags">
-                {#each fileTags as tag}
-                  <div class="tag">
-                    <Tag>
-                      {tag}
-                    </Tag>
-                  </div>
-                {/each}
-              </div>
-            </Tags>
-          {/if}
-        {/if}
-      </div>
+          <label for={fieldId} class="spectrum-Link">
+            Select a file to upload
+          </label>
+          <br />
+          from your computer
+        </p>
+      {/if}
     </div>
-  {/if}
+  </div>
 </div>
 
 <style>
@@ -409,15 +390,4 @@
   .disabled .spectrum-Heading--sizeL {
     color: var(--spectrum-alias-text-color-disabled);
   }
-
-  .tags {
-    margin-top: 20px;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-  }
-
-  .tag {
-    margin-top: 8px;
-  }
 </style>

package/src/Form/Dropzone.svelte

@@ -12,8 +12,6 @@
   export let processFiles = undefined
   export let handleFileTooLarge = undefined
   export let gallery = true
-  export let fileTags = []
-  export let maximum = undefined
 
   const dispatch = createEventDispatcher()
   const onChange = e => {
@@ -31,8 +29,6 @@
     {processFiles}
     {handleFileTooLarge}
     {gallery}
-    {fileTags}
-    {maximum}
     on:change={onChange}
   />
 </Field>

package/src/Modal/ModalContent.svelte

@@ -18,22 +18,10 @@
   export let disabled = false
   export let showDivider = true
 
-  export let showSecondaryButton = false
-  export let secondaryButtonText = undefined
-  export let secondaryAction = undefined
-
   const { hide, cancel } = getContext(Context.Modal)
   let loading = false
   $: confirmDisabled = disabled || loading
 
-  async function secondary() {
-    loading = true
-    if (!secondaryAction || (await secondaryAction()) !== false) {
-      hide()
-    }
-    loading = false
-  }
-
   async function confirm() {
     loading = true
     if (!onConfirm || (await onConfirm()) !== false) {
@@ -85,15 +73,6 @@
         class="spectrum-ButtonGroup spectrum-Dialog-buttonGroup spectrum-Dialog-buttonGroup--noFooter"
       >
         <slot name="footer" />
-
-        {#if showSecondaryButton && secondaryButtonText && secondaryAction}
-          <div class="secondary-action">
-            <Button group secondary on:click={secondary}
-              >{secondaryButtonText}</Button
-            >
-          </div>
-        {/if}
-
         {#if showCancelButton}
           <Button group secondary on:click={close}>{cancelText}</Button>
         {/if}
@@ -157,8 +136,4 @@
     display: flex;
     justify-content: space-between;
   }
-
-  .secondary-action {
-    margin-right: auto;
-  }
 </style>