@eightshift/ui-components 5.4.0 → 5.6.0

package/dist/{useDragAndDrop-C08ZXv4F.js → useDragAndDrop-DUXKDS0N.js}

@@ -1,13 +1,13 @@
 import { L as $507fabe10e71c6fb$export$98e20ec92f614cfe, u as $507fabe10e71c6fb$export$630ff653c5ada6a9, H as $6a7db85432448f7f$export$60278871457622de, F as $6a7db85432448f7f$export$29bf1b5f2c56cf63, e as $03deb23ff14920c4$export$4eaf04e54aa8eed6, B as $c87311424ea30a05$export$9ac100e40613ea10, E as $c87311424ea30a05$export$7bef049ce92e4224, C as $c87311424ea30a05$export$78551043582a6a98, b as $c87311424ea30a05$export$fedb369cb70207f1, v as $507fabe10e71c6fb$export$8397ddfc504fdb9a } from "./useHover-BRDW3y7-.js";
-import { c as $319e236875307eab$export$a9b970dcc4ae71a9 } from "./Button-CQ5ZZJ2w.js";
-import { k as $5e3802645cc19319$export$1c3ebcada18427bf } from "./Dialog-BMgMUQuN.js";
+import { c as $319e236875307eab$export$a9b970dcc4ae71a9 } from "./Button-BhEIfWLY.js";
+import { k as $5e3802645cc19319$export$1c3ebcada18427bf } from "./Dialog-B8p4Ymh7.js";
 import React__default, { useState, useEffect, useRef, version, useCallback, useImperativeHandle, useMemo } from "react";
-import { v as $ef06256079686ba0$export$f8aeda7b10753fa1, r as $c5a24bc478652b5f$export$1005530eda016c13, d as $cc38e7bd3fc7b213$export$2bb74740c4e19def } from "./SelectionManager-B6-b5NM2.js";
-import { c as $62d8ded9296f3872$export$cfa2225e87938781 } from "./Separator-B-xeqOkC.js";
+import { v as $ef06256079686ba0$export$f8aeda7b10753fa1, r as $c5a24bc478652b5f$export$1005530eda016c13, d as $cc38e7bd3fc7b213$export$2bb74740c4e19def } from "./SelectionManager-D77bfEbg.js";
+import { c as $62d8ded9296f3872$export$cfa2225e87938781 } from "./Separator-DcqCdD4k.js";
 import { $ as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "./useLocalizedStringFormatter-eaZiN2tE.js";
 import { e as $8ae05eaa5c114e9c$export$7f54fc3180508a52, k as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, d as $bdb11010cef70236$export$f680877a34711e37, b as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "./utils-cvK1vxO7.js";
 import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "./context-DMOmz986.js";
-import { r as reactDomExports } from "./index-D8-Zjpbd.js";
+import { r as reactDomExports } from "./index-DjyEH0Gg.js";
 var $103790afe9474d1c$export$60b7b4bcf3903d8e = /* @__PURE__ */ (function(DROP_OPERATION) {
   DROP_OPERATION[DROP_OPERATION["none"] = 0] = "none";
   DROP_OPERATION[DROP_OPERATION["cancel"] = 0] = "cancel";

package/dist/{useFilter-BlkUH1Ma.js → useFilter-BPcJ-Jzv.js}

@@ -1,4 +1,4 @@
-import { b as $325a3faab7a68acd$export$a16aca283550c30d } from "./Separator-B-xeqOkC.js";
+import { b as $325a3faab7a68acd$export$a16aca283550c30d } from "./Separator-DcqCdD4k.js";
 import { useCallback, useMemo } from "react";
 function $bb77f239b46e8c72$export$3274cf84b703fff(options) {
   let collator = $325a3faab7a68acd$export$a16aca283550c30d({

package/dist/{useListState-RdLrYsMP.js → useListState-DZycqxCn.js}

@@ -1,5 +1,5 @@
 import { version, useMemo, useCallback, useRef, useEffect } from "react";
-import { $ as $7af3f5b51489e0b5$export$253fe78d46329472, a as $7613b1592d41b092$export$6cd28814d92fa9c9, b as $d496c0a20b6e58ec$export$6c8a5aaad13c9852 } from "./SelectionManager-B6-b5NM2.js";
+import { $ as $7af3f5b51489e0b5$export$253fe78d46329472, a as $7613b1592d41b092$export$6cd28814d92fa9c9, b as $d496c0a20b6e58ec$export$6c8a5aaad13c9852 } from "./SelectionManager-D77bfEbg.js";
 function $cdc5a6778b766db2$export$a9d04c5684123369(value) {
   const pieces = version.split(".");
   const major = parseInt(pieces[0], 10);

package/dist/{useNumberField-D16dDfYF.js → useNumberField-CEA9Q4w_.js}

@@ -11,7 +11,7 @@ import { $ as $e9faafb641e167db$export$90fc3a17d93f704c } from "./useEvent-BifIG
 import { d as $2d73ec29415bd339$export$712718f7aec83d5 } from "./Input-8yja_IHC.js";
 import { $ as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "./useLocalizedStringFormatter-eaZiN2tE.js";
 import { $ as $a916eb452884faea$export$b7a616150fdb9f44 } from "./useNumberFormatter-BCmkV-7c.js";
-import { d as $319e236875307eab$export$d10ae4f68404609a, c as $319e236875307eab$export$a9b970dcc4ae71a9 } from "./Button-CQ5ZZJ2w.js";
+import { d as $319e236875307eab$export$d10ae4f68404609a, c as $319e236875307eab$export$a9b970dcc4ae71a9 } from "./Button-BhEIfWLY.js";
 const $6c7bd7858deea686$var$CURRENCY_SIGN_REGEX = new RegExp("^.*\\(.*\\).*$");
 const $6c7bd7858deea686$var$NUMBERING_SYSTEMS = [
   "latn",

package/dist/{usePress-DJskZBH9.js → usePress-BCEPS3hl.js}

@@ -2,7 +2,7 @@ import { D as $c87311424ea30a05$export$b7d78993b74f766d, C as $c87311424ea30a05$
 import { $ as $14c0b72509d70225$export$b0d6fa1ab32e3295, a as $14c0b72509d70225$export$16a4697467175487 } from "./textSelection-DbCKqaw8.js";
 import React__default, { useContext, createContext, useState, useRef, useMemo, useEffect } from "react";
 import { e as $8ae05eaa5c114e9c$export$7f54fc3180508a52, b as $3ef42575df84b30b$export$9d1611c77c2fe928, p as $ff5963eb1fccf552$export$e08e3b67e392101e } from "./utils-cvK1vxO7.js";
-import { r as reactDomExports } from "./index-D8-Zjpbd.js";
+import { r as reactDomExports } from "./index-DjyEH0Gg.js";
 const $ea8dcbcb9ea1b556$var$RouterContext = /* @__PURE__ */ createContext({
   isNative: true,
   open: $ea8dcbcb9ea1b556$var$openSyntheticLink,

package/dist/{useSingleSelectListState-n0AVMr3Y.js → useSingleSelectListState-BFZEfeqI.js}

@@ -1,4 +1,4 @@
-import { $ as $e72dd72e1c76a225$export$2f645645f7bca764 } from "./useListState-RdLrYsMP.js";
+import { $ as $e72dd72e1c76a225$export$2f645645f7bca764 } from "./useListState-DZycqxCn.js";
 import { a as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "./useHover-BRDW3y7-.js";
 import { useMemo } from "react";
 function $a0d645289fe9b86b$export$e7f05e985daf4b5f(props) {

package/dist/{useToggle-DSBDAfdw.js → useToggle-DNoP2bvV.js}

@@ -1,7 +1,7 @@
 import { b as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "./utils-cvK1vxO7.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "./filterDOMProps-D2C6R0DK.js";
 import { $ as $99facab73266f662$export$5add1d006293d136 } from "./useFormReset-yV9VVy9R.js";
-import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "./usePress-DJskZBH9.js";
+import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "./usePress-BCEPS3hl.js";
 import { $ as $f645667febf57a63$export$4c014de7c8940b4c } from "./useHover-BRDW3y7-.js";
 function $d2c8e2b0480f3f34$export$cbe85ee05b554577(props, state, ref) {
   let { isDisabled = false, isReadOnly = false, value, name, form, children, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, validationState = "valid", isInvalid, onPressStart, onPressEnd, onPressChange, onPress, onPressUp, onClick } = props;

package/dist/utilities/general.js

@@ -0,0 +1,10 @@
+import "../sha256-C56UDWfQ.js";
+import { a, b, d, c, g, i } from "../general-6STKQIrk.js";
+export {
+  a as analyzeImage,
+  b as analyzeImageAsync,
+  d as analyzeImageData,
+  c as checkTransparency,
+  g as getFileExtension,
+  i as isColorDark
+};

package/dist/utilities/index.js

@@ -2,14 +2,24 @@ import { arrayMoveMultiple, fixIds } from "./array-helpers.js";
 import { camelCase, has, isEmpty, isEqual, isObject, isPlainObject, isString, kebabCase, lowerFirst, pascalCase, snakeCase, upperFirst } from "./es-dash.js";
 import { truncate, truncateEnd, truncateMiddle, unescapeHTML } from "./text-helpers.js";
 import { debounce, throttle } from "./debounce-throttle.js";
-import { c } from "../lite-DVmmD_-j.js";
+import { a, b, d, c, g, i } from "../general-6STKQIrk.js";
+import { c as c2 } from "../lite-DVmmD_-j.js";
+import { s as sha256Exports } from "../sha256-C56UDWfQ.js";
+const sha224 = sha256Exports.sha224;
+const sha256 = sha256Exports.sha256;
 export {
+  a as analyzeImage,
+  b as analyzeImageAsync,
+  d as analyzeImageData,
   arrayMoveMultiple,
   camelCase,
-  c as clsx,
+  c as checkTransparency,
+  c2 as clsx,
   debounce,
   fixIds,
+  g as getFileExtension,
   has,
+  i as isColorDark,
   isEmpty,
   isEqual,
   isObject,
@@ -18,6 +28,8 @@ export {
   kebabCase,
   lowerFirst,
   pascalCase,
+  sha224,
+  sha256,
   snakeCase,
   throttle,
   truncate,

package/dist/utilities/web-workers.js

@@ -0,0 +1,50 @@
+function useImageAnalysisWorker(workerRef, workerInline) {
+  const getOrCreateWorker = () => {
+    if (!workerRef.current) {
+      workerRef.current = createImageAnalysisWorker(workerInline);
+      workerRef.current.addEventListener("error", (e) => {
+        console.error("Worker error event:", e);
+      });
+    }
+    return workerRef.current;
+  };
+  const analyzeWithWorkerCb = async (imageBitmap, settings) => {
+    const worker = getOrCreateWorker();
+    return analyzeWithWorker(worker, imageBitmap, settings);
+  };
+  return { getOrCreateWorker, analyzeWithWorkerCb };
+}
+function createImageAnalysisWorker(workerInline) {
+  if (!workerInline || typeof workerInline !== "string" || workerInline.length < 100) {
+    throw new Error("Worker could not be created: inline worker code not available. Make sure the worker is properly bundled.");
+  }
+  const blob = new Blob([workerInline], { type: "application/javascript" });
+  return new Worker(URL.createObjectURL(blob), { type: "module" });
+}
+function analyzeWithWorker(worker, imageBitmap, settings) {
+  return new Promise((resolve, reject) => {
+    const handleMessage = (event) => {
+      const { success, data, error } = event.data;
+      if (success) {
+        resolve(data);
+      } else {
+        reject(new Error(error));
+      }
+      worker.removeEventListener("message", handleMessage);
+      worker.removeEventListener("error", handleError);
+    };
+    const handleError = (error) => {
+      reject(error);
+      worker.removeEventListener("message", handleMessage);
+      worker.removeEventListener("error", handleError);
+    };
+    worker.addEventListener("message", handleMessage);
+    worker.addEventListener("error", handleError);
+    worker.postMessage({ imageBitmap, settings }, [imageBitmap]);
+  });
+}
+export {
+  analyzeWithWorker,
+  createImageAnalysisWorker,
+  useImageAnalysisWorker
+};

package/dist/workers/image-analysis.worker.js

@@ -0,0 +1,52 @@
+import { f as floatBufferFromCanvas, d as analyzeImageData, F as FLOAT_RGBA } from "../general-6STKQIrk.js";
+self.onmessage = async (event) => {
+  const { imageBitmap, settings } = event.data;
+  try {
+    const result = await analyzeImageInWorker(imageBitmap, settings);
+    self.postMessage({ success: true, data: result });
+  } catch (error) {
+    self.postMessage({ success: false, error: error.message, stack: error.stack });
+  }
+};
+async function analyzeImageInWorker(imageBitmap, rawSettings) {
+  const defaults = {
+    numColors: 3,
+    lightnessThreshold: 0.5,
+    yFrom: 0,
+    yTo: 1,
+    maxSize: 320,
+    alphaThreshold: 30
+  };
+  const settings = { ...defaults, ...rawSettings };
+  const { yFrom, yTo, maxSize } = settings;
+  const imageWidth = imageBitmap.width;
+  const imageHeight = imageBitmap.height;
+  if (!imageWidth || !imageHeight) return false;
+  let imageScale = 1;
+  if (imageWidth > maxSize || imageHeight > maxSize) {
+    imageScale = Math.min(maxSize / imageWidth, maxSize / imageHeight);
+  }
+  const imageWidthScaled = Math.floor(imageWidth * imageScale);
+  const imageHeightScaled = Math.floor(imageHeight * imageScale);
+  const srcX = 0;
+  const srcY = Math.floor(yFrom * imageHeight);
+  const srcW = Math.max(1, imageWidth);
+  const srcH = Math.max(1, Math.ceil((yTo - yFrom) * imageHeight));
+  const destW = Math.max(1, imageWidthScaled);
+  const destH = Math.max(1, Math.ceil((yTo - yFrom) * imageHeightScaled));
+  const colorCanvas = new OffscreenCanvas(destW, destH);
+  const colorContext = colorCanvas.getContext("2d");
+  colorContext.drawImage(imageBitmap, srcX, srcY, srcW, srcH, 0, 0, destW, destH);
+  const buffer = floatBufferFromCanvas(colorCanvas, FLOAT_RGBA);
+  const transparencyCanvas = new OffscreenCanvas(imageWidthScaled, imageHeightScaled);
+  const transparencyContext = transparencyCanvas.getContext("2d");
+  transparencyContext.drawImage(imageBitmap, 0, 0, imageWidth, imageHeight, 0, 0, imageWidthScaled, imageHeightScaled);
+  const imageData = transparencyContext.getImageData(0, 0, imageWidthScaled, imageHeightScaled).data;
+  return analyzeImageData({
+    buffer,
+    imageData,
+    width: imageWidthScaled,
+    height: imageHeightScaled,
+    settings
+  });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@eightshift/ui-components",
-	"version": "5.4.0",
+	"version": "5.6.0",
 	"type": "module",
 	"main": "./dist/index.js",
 	"module": "./dist/index.js",
@@ -34,7 +34,8 @@
 	"scripts": {
 		"dev": "vite",
 		"start": "vite",
-		"build": "vite build",
+		"build": "bun run update-scripts && vite build",
+		"update-scripts": "vite build --config vite.worker.config.js && node scripts/inline-worker.js",
 		"lint": "bun x eslint",
 		"preview": "vite preview"
 	},
@@ -55,18 +56,18 @@
 		"@eslint/compat": "^1.4.0",
 		"@react-stately/collections": "^3.12.8",
 		"@stylistic/eslint-plugin-js": "^4.4.1",
-		"@tailwindcss/vite": "^4.1.14",
+		"@tailwindcss/vite": "^4.1.15",
 		"@types/react": "^18.3.26",
 		"@types/react-dom": "^18.3.7",
 		"@vitejs/plugin-react-swc": "^4.1.0",
-		"@wordpress/i18n": "^6.5.0",
+		"@wordpress/i18n": "^6.6.0",
 		"autoprefixer": "^10.4.21",
 		"class-variance-authority": "^0.7.1",
 		"clsx": "^2.1.1",
 		"css-gradient-parser": "^0.0.18",
-		"eslint": "^9.37.0",
+		"eslint": "^9.38.0",
 		"eslint-config-prettier": "^10.1.8",
-		"eslint-plugin-jsdoc": "^60.8.3",
+		"eslint-plugin-jsdoc": "^61.1.5",
 		"eslint-plugin-prettier": "^5.5.4",
 		"glob": "^11.0.3",
 		"globals": "^16.4.0",
@@ -79,7 +80,7 @@
 		"lightningcss": "^1.30.2",
 		"postcss": "^8.5.6",
 		"prettier": "^3.6.2",
-		"prettier-plugin-tailwindcss": "^0.6.14",
+		"prettier-plugin-tailwindcss": "^0.7.1",
 		"react": "^18.3.1",
 		"react-aria": "^3.44.0",
 		"react-aria-components": "^1.13.0",
@@ -89,14 +90,20 @@
 		"react-select": "^5.10.2",
 		"react-stately": "^3.42.0",
 		"svg-to-jsx-string": "^0.1.1",
-		"tailwindcss": "^4.1.14",
+		"tailwindcss": "^4.1.15",
 		"tailwindcss-motion": "^1.1.1",
 		"tailwindcss-react-aria-components": "^2.0.1",
-		"vite": "^7.1.9",
+		"vite": "^7.1.11",
 		"vite-plugin-lib-inject-css": "^2.2.2"
 	},
 	"dependencies": {
+		"@atom-universe/use-web-worker": "^2.2.1",
 		"@fontsource-variable/geist": "^5.2.8",
-		"@fontsource-variable/geist-mono": "^5.2.7"
+		"@fontsource-variable/geist-mono": "^5.2.7",
+		"@thi.ng/color": "^5.7.62",
+		"@thi.ng/pixel": "^7.5.10",
+		"@thi.ng/pixel-analysis": "^2.0.9",
+		"@thi.ng/pixel-dominant-colors": "^2.0.14",
+		"js-sha256": "^0.11.1"
 	}
 }