@budibase/bbui 1.0.50-alpha.5 → 1.0.50-alpha.6

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@budibase/bbui",
   "description": "A UI solution used in the different Budibase projects.",
-  "version": "1.0.50-alpha.5",
+  "version": "1.0.50-alpha.6",
   "license": "MPL-2.0",
   "svelte": "src/index.js",
   "module": "dist/bbui.es.js",
@@ -83,5 +83,5 @@
     "svelte-flatpickr": "^3.2.3",
     "svelte-portal": "^1.0.0"
   },
-  "gitHead": "091100f9351739438a01e32ab71e6bbc6fc9ebb4"
+  "gitHead": "a557d325a5be87361fda1b74da6f9a2e8854c61a"
 }

package/src/ColorPicker/ColorPicker.svelte

@@ -5,7 +5,7 @@
   import { fly } from "svelte/transition"
   import Icon from "../Icon/Icon.svelte"
   import Input from "../Form/Input.svelte"
-  import { capitalise } from "../utils/helpers"
+  import { capitalise } from "../helpers"
 
   export let value
   export let size = "M"

package/src/Form/Core/DatePicker.svelte

@@ -5,7 +5,7 @@
   import "@spectrum-css/textfield/dist/index-vars.css"
   import "@spectrum-css/picker/dist/index-vars.css"
   import { createEventDispatcher } from "svelte"
-  import { generateID } from "../../utils/helpers"
+  import { uuid } from "../../helpers"
 
   export let id = null
   export let disabled = false
@@ -17,7 +17,7 @@
   export let timeOnly = false
 
   const dispatch = createEventDispatcher()
-  const flatpickrId = `${generateID()}-wrapper`
+  const flatpickrId = `${uuid()}-wrapper`
   let open = false
   let flatpickr, flatpickrOptions, isTimeOnly
 

package/src/Form/Core/Dropzone.svelte

@@ -3,7 +3,7 @@
   import "@spectrum-css/typography/dist/index-vars.css"
   import "@spectrum-css/illustratedmessage/dist/index-vars.css"
   import { createEventDispatcher } from "svelte"
-  import { generateID } from "../../utils/helpers"
+  import { uuid } from "../../helpers"
   import Icon from "../../Icon/Icon.svelte"
   import Link from "../../Link/Link.svelte"
   import Tag from "../../Tags/Tag.svelte"
@@ -37,7 +37,7 @@
     "jfif",
   ]
 
-  const fieldId = id || generateID()
+  const fieldId = id || uuid()
   let selectedImageIdx = 0
   let fileDragged = false
   let selectedUrl

package/src/Table/Table.svelte

@@ -4,7 +4,7 @@
   import CellRenderer from "./CellRenderer.svelte"
   import SelectEditRenderer from "./SelectEditRenderer.svelte"
   import { cloneDeep } from "lodash"
-  import { deepGet } from "../utils/helpers"
+  import { deepGet } from "../helpers"
 
   /**
    * The expected schema is our normal couch schemas for our tables.

package/src/{utils/helpers.js → helpers.js}

@@ -1,11 +1,45 @@
-export const generateID = () => {
-  const rand = Math.random().toString(32).substring(2)
+/**
+ * Generates a DOM safe UUID.
+ * Starting with a letter is important to make it DOM safe.
+ * @return {string} a random DOM safe UUID
+ */
+export function uuid() {
+  return "cxxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx".replace(/[xy]/g, c => {
+    const r = (Math.random() * 16) | 0
+    const v = c === "x" ? r : (r & 0x3) | 0x8
+    return v.toString(16)
+  })
+}
 
-  // Starts with a letter so that its a valid DOM ID
-  return `A${rand}`
+/**
+ * Capitalises a string
+ * @param string the string to capitalise
+ * @return {string} the capitalised string
+ */
+export const capitalise = string => {
+  if (!string) {
+    return string
+  }
+  return string.substring(0, 1).toUpperCase() + string.substring(1)
 }
 
-export const capitalise = s => s.substring(0, 1).toUpperCase() + s.substring(1)
+/**
+ * Computes a short hash of a string
+ * @param string the string to compute a hash of
+ * @return {string} the hash string
+ */
+export const hashString = string => {
+  if (!string) {
+    return "0"
+  }
+  let hash = 0
+  for (let i = 0; i < string.length; i++) {
+    let char = string.charCodeAt(i)
+    hash = (hash << 5) - hash + char
+    hash = hash & hash // Convert to 32bit integer
+  }
+  return hash.toString()
+}
 
 /**
  * Gets a key within an object. The key supports dot syntax for retrieving deep

package/src/index.js

@@ -85,5 +85,5 @@ export { default as clickOutside } from "./Actions/click_outside"
 // Stores
 export { notifications, createNotificationStore } from "./Stores/notifications"
 
-// Utils
-export * from "./utils/helpers"
+// Helpers
+export * as Helpers from "./helpers"