@budibase/bbui 2.6.18 → 2.6.19-alpha.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@budibase/bbui",
   "description": "A UI solution used in the different Budibase projects.",
-  "version": "2.6.18",
+  "version": "2.6.19-alpha.1",
   "license": "MPL-2.0",
   "svelte": "src/index.js",
   "module": "dist/bbui.es.js",
@@ -38,8 +38,8 @@
   ],
   "dependencies": {
     "@adobe/spectrum-css-workflow-icons": "1.2.1",
-    "@budibase/shared-core": "^2.6.18",
-    "@budibase/string-templates": "^2.6.18",
+    "@budibase/shared-core": "2.6.19-alpha.1",
+    "@budibase/string-templates": "2.6.19-alpha.1",
     "@spectrum-css/accordion": "3.0.24",
     "@spectrum-css/actionbutton": "1.0.1",
     "@spectrum-css/actiongroup": "1.0.1",
@@ -90,5 +90,5 @@
   "resolutions": {
     "loader-utils": "1.4.1"
   },
-  "gitHead": "6e97c358e00e4a7be0c620858c564960c393c1b8"
+  "gitHead": "0c1a7f3a6d7229024e20646bd75ab450abf2f9bb"
 }

package/src/Button/Button.svelte

@@ -2,6 +2,7 @@
   import "@spectrum-css/button/dist/index-vars.css"
   import Tooltip from "../Tooltip/Tooltip.svelte"
 
+  export let type
   export let disabled = false
   export let size = "M"
   export let cta = false
@@ -21,6 +22,7 @@
 
 <button
   {id}
+  {type}
   class:spectrum-Button--cta={cta}
   class:spectrum-Button--primary={primary}
   class:spectrum-Button--secondary={secondary}
@@ -73,6 +75,7 @@
   button {
     position: relative;
   }
+
   .spectrum-Button-label {
     white-space: nowrap;
     overflow: hidden;

package/src/FancyForm/ErrorMessage.svelte

@@ -0,0 +1,19 @@
+<script>
+  import { slide } from "svelte/transition"
+
+  export let error = null
+</script>
+
+<div transition:slide|local={{ duration: 130 }} class="error-message">
+  {error}
+</div>
+
+<style>
+  .error-message {
+    background: var(--spectrum-global-color-red-400);
+    color: white;
+    font-size: 14px;
+    padding: 6px 16px;
+    font-weight: 500;
+  }
+</style>

package/src/FancyForm/FancyField.svelte

@@ -1,7 +1,7 @@
 <script>
   import Icon from "../Icon/Icon.svelte"
   import { getContext, onMount } from "svelte"
-  import { slide } from "svelte/transition"
+  import ErrorMessage from "./ErrorMessage.svelte"
 
   export let disabled = false
   export let error = null
@@ -55,9 +55,7 @@
     {/if}
   </div>
   {#if error}
-    <div transition:slide|local={{ duration: 130 }} class="error-message">
-      {error}
-    </div>
+    <ErrorMessage {error} />
   {/if}
 </div>
 
@@ -110,13 +108,6 @@
   .field {
     flex: 1 1 auto;
   }
-  .error-message {
-    background: var(--spectrum-global-color-red-400);
-    color: white;
-    font-size: 14px;
-    padding: 6px 16px;
-    font-weight: 500;
-  }
   .error-icon {
     flex: 0 0 auto;
   }

package/src/FancyForm/index.js

@@ -4,3 +4,4 @@ export { default as FancySelect } from "./FancySelect.svelte"
 export { default as FancyButton } from "./FancyButton.svelte"
 export { default as FancyForm } from "./FancyForm.svelte"
 export { default as FancyButtonRadio } from "./FancyButtonRadio.svelte"
+export { default as ErrorMessage } from "./ErrorMessage.svelte"

package/src/Form/Core/DatePicker.svelte

@@ -18,10 +18,14 @@
   export let ignoreTimezones = false
   export let time24hr = false
   export let range = false
+  export let flatpickr
+  export let useKeyboardShortcuts = true
+
   const dispatch = createEventDispatcher()
   const flatpickrId = `${uuid()}-wrapper`
+
   let open = false
-  let flatpickr, flatpickrOptions
+  let flatpickrOptions
 
   // Another classic flatpickr issue. Errors were randomly being thrown due to
   // flatpickr internal code. Making sure that "destroy" is a valid function
@@ -59,6 +63,8 @@
         dispatch("change", timestamp.toISOString())
       }
     },
+    onOpen: () => dispatch("open"),
+    onClose: () => dispatch("close"),
   }
 
   $: redrawOptions = {
@@ -113,12 +119,16 @@
 
   const onOpen = () => {
     open = true
-    document.addEventListener("keyup", clearDateOnBackspace)
+    if (useKeyboardShortcuts) {
+      document.addEventListener("keyup", clearDateOnBackspace)
+    }
   }
 
   const onClose = () => {
     open = false
-    document.removeEventListener("keyup", clearDateOnBackspace)
+    if (useKeyboardShortcuts) {
+      document.removeEventListener("keyup", clearDateOnBackspace)
+    }
 
     // Manually blur all input fields since flatpickr creates a second
     // duplicate input field.