@eightshift/ui-components 6.0.13 → 6.1.0

package/dist/components/placeholders/file-picker-shell.js

@@ -5,6 +5,7 @@ import "react";
 import "../../react-jsx-parser.min-B_hvYYa1.js";
 import { truncateMiddle } from "../../utilities/text-helpers.js";
 import { SmartImage } from "../smart-image/smart-image.js";
+import { __SmartImageNext } from "../smart-image/smart-image-next.js";
 /**
  * A shell for a file picker UI, handling both rich visual presentation (e.g. images) and simple file placeholders.
  *
@@ -53,6 +54,7 @@ const FilePickerShell = (props) => {
     className,
     noUrlContent,
     hidden,
+    __useSmartImageNext = false,
     ...rest
   } = props;
   if (hidden) {
@@ -67,11 +69,11 @@ const FilePickerShell = (props) => {
       {
         ...rest,
         className: clsx(
-          "es:border es:border-surface-200 es:bg-white es:bg-linear-to-br es:from-surface-50/5 es:to-surface-50/30 es:flex es:justify-between es:rounded-2xl es:isolate es:relative es:flex-col es:gap-2 es:overflow-clip es:group es:p-2",
+          "es:border es:border-surface-200 es:bg-surface-50 es:flex es:justify-between es:rounded-2xl es:isolate es:relative es:flex-col es:gap-2 es:overflow-clip es:group es:p-2",
           className
         ),
         children: [
-          type === "file" && /* @__PURE__ */ jsxs("div", { className: "es:grow es:flex es:flex-col es:gap-2 es:text-sm es:items-center-safe es:justify-center-safe es:font-mono es:icon:size-6 es:rounded-xl es:bg-surface-50 es:inset-ring es:inset-ring-surface-100 es:icon:text-surface-500 es:text-surface-700 es:p-2", children: [
+          type === "file" && /* @__PURE__ */ jsxs("div", { className: "es:grow es:flex es:flex-col es:gap-2 es:text-sm es:items-center-safe es:justify-center-safe es:font-mono es:icon:size-6 es:rounded-xl es:bg-white/50 es:inset-ring es:inset-ring-surface-100 es:icon:text-surface-500 es:text-surface-700 es:px-2 es:py-4", children: [
             icon,
             /* @__PURE__ */ jsx("span", { className: "es:line-clamp-1", children: truncateMiddle(url, 34) })
           ] }),
@@ -80,57 +82,60 @@ const FilePickerShell = (props) => {
       }
     );
   }
+  const ComponentToRender = __useSmartImageNext ? __SmartImageNext : SmartImage;
   return /* @__PURE__ */ jsx(
-    SmartImage,
+    ComponentToRender,
     {
       src: url,
       alt: "",
-      className: ({ hasAnalysed, isTransparent, transparencyInfo, isDark }) => clsx(
-        hasAnalysed && transparencyInfo?.left && url && "es:pl-3",
-        hasAnalysed && transparencyInfo?.right && url && "es:pr-3",
-        hasAnalysed && transparencyInfo?.top && url && "es:pt-3",
-        hasAnalysed && transparencyInfo?.bottom && url && "es:pb-3",
-        hasAnalysed && isTransparent && isDark && "es:bg-white/60 es:object-contain es:mx-auto",
-        hasAnalysed && isTransparent && !isDark && "es:bg-black/60 es:object-contain es:mx-auto",
+      className: ({ hasAnalysed, isTransparent, transparencyInfo, isDark, hasError }) => clsx(
+        hasAnalysed && isTransparent && url && "es:p-4",
+        hasAnalysed && isTransparent && isDark && "es:object-contain es:mx-auto",
+        hasAnalysed && isTransparent && !isDark && "es:object-contain es:mx-auto",
         hasAnalysed && isTransparent && (transparencyInfo?.left || transparencyInfo?.right) && "es:w-full!",
         hasAnalysed && isTransparent && (transparencyInfo?.top || transparencyInfo?.bottom) && "es:h-full!",
         hasAnalysed && !isTransparent && "es:w-full! es:aspect-3-2 es:object-cover",
-        hasAnalysed && "es:grow es:rounded-xl es:h-fill!"
+        hasAnalysed && "es:grow es:rounded-xl es:h-fill!",
+        hasError && "es:rounded-xl"
       ),
-      errorClassName: "es:aspect-3-2 es:rounded-2xl es:bg-linear-to-br es:from-white es:to-secondary-50 es:border es:border-dashed es:border-secondary-200",
+      errorClassName: !__useSmartImageNext && "es:aspect-3-2 es:rounded-2xl es:bg-linear-to-br es:from-white es:to-secondary-50 es:border es:border-dashed es:border-secondary-200",
       imageAnalysisSettings: { yFrom: 0.25, yTo: 0.75 },
       ...rest,
-      children: ({ image, dominantColors, isDark, hasAnalysed, isTransparent, hasError, errorBadge }) => /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: clsx(
-            "es:border es:justify-between es:rounded-2xl es:isolate es:relative es:flex-col es:gap-y-2 es:grid es:grid-cols-1 es:overflow-clip es:aspect-3-2 es:transition",
-            !hasError && hasAnalysed ? "es:border-secondary-200" : "es:border-secondary-200/0",
-            !hasError && hasAnalysed && !isTransparent && "es:group es:grid-rows-1",
-            !hasError && hasAnalysed && isTransparent && "es:p-2 es:grid-rows-[minmax(0,1fr)_auto] es:h-fit",
-            !hasAnalysed && "es:shimmer-dark es:bg-secondary-50",
-            hasError && "es:flex es:items-center es:justify-center",
-            className
-          ),
-          style: !hasError && hasAnalysed && isTransparent ? { backgroundColor: `color-mix(in srgb, ${dominantColors[0]?.color || "#ffffff"} ${dominantColors[0]?.isDark ? 10 : 80}%, #ffffff)` } : {},
-          children: [
-            image,
-            hasError && errorBadge,
-            children && /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: clsx(
-                  "es:flex es:items-center-safe es:gap-0.75",
-                  "es-button-group-h",
-                  !hasError && !isTransparent && "es:absolute es:bottom-2 es:left-2 es:right-2 es:translate-y-[125%] es:group-hover:translate-y-0 es:has-aria-expanded:translate-y-0 es:has-focus-visible:translate-y-0 es:transition-transform es:ease-spring-smooth",
-                  hasError && "es:absolute es:bottom-2 es:left-2 es:right-2"
-                ),
-                children: typeof children === "function" ? children({ dominantColors, isDark, isTransparent, hasError }) : children
-              }
-            )
-          ]
-        }
-      )
+      children: ({ image, dominantColors, isDark, hasAnalysed, isTransparent, hasError, errorBadge }) => {
+        const dominantDisplayColor = dominantColors?.find((c) => c.saturation > 0.25) || dominantColors?.[0];
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: clsx(
+              "es:border es:justify-between es:rounded-2xl es:isolate es:relative es:flex-col es:gap-y-2 es:grid es:grid-cols-1 es:overflow-clip es:aspect-3-2 es:transition",
+              !hasError && hasAnalysed ? "es:border-secondary-200" : "es:border-secondary-200/0",
+              !hasError && hasAnalysed && !isTransparent && "es:group es:grid-rows-1",
+              (hasAnalysed && isTransparent || hasError) && "es:p-2 es:grid-rows-[minmax(0,1fr)_auto] es:h-fit",
+              !hasError && !hasAnalysed && "es:shimmer-dark es:bg-surface-100",
+              hasError && "es:bg-surface-50 es:border-surface-100",
+              className
+            ),
+            style: !hasError && hasAnalysed && isTransparent ? {
+              backgroundColor: `color-mix(in srgb, ${dominantDisplayColor?.color || "#ffffff"} ${dominantDisplayColor?.isDark ? 5 : 25}%, ${dominantDisplayColor?.isDark ? "#ffffff" : "#000000"})`
+            } : {},
+            children: [
+              !hasError && image,
+              hasError && errorBadge,
+              children && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: clsx(
+                    "es:flex es:items-center-safe es:gap-0.75",
+                    "es-button-group-h",
+                    !hasError && !isTransparent && "es:absolute es:bottom-2 es:left-2 es:right-2 es:translate-y-[125%] es:group-hover:translate-y-0 es:has-aria-expanded:translate-y-0 es:has-focus-visible:translate-y-0 es:transition-transform es:ease-spring-smooth"
+                  ),
+                  children: typeof children === "function" ? children({ dominantColors, isDark, isTransparent, hasError }) : children
+                }
+              )
+            ]
+          }
+        );
+      }
     }
   );
 };

package/dist/components/popover/popover.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { $ as $07b14b47974efb58$export$5b6b19405a83ff9d, g as $de32f1b87079253c$export$3ddf2d174ce01153, h as $de32f1b87079253c$export$2e1e1122cf0cba88 } from "../../Dialog-Dd1yqNus.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d, g as $de32f1b87079253c$export$3ddf2d174ce01153, h as $de32f1b87079253c$export$2e1e1122cf0cba88 } from "../../Dialog-BbNWvB5_.js";
 import { c as clsx } from "../../clsx-DgYk2OaC.js";
 import { _ as __ } from "../../default-i18n-CnQeC5Pl.js";
 import { Button } from "../button/button.js";

package/dist/components/radio/radio.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DPWyf-gp.js";
-import { a as $b6c3ddc6086f204d$export$d7b12c4107be0d61, $ as $b6c3ddc6086f204d$export$a98f0dcb43a68a25 } from "../../RadioGroup-Cp5cdBI_.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { a as $b6c3ddc6086f204d$export$d7b12c4107be0d61, $ as $b6c3ddc6086f204d$export$a98f0dcb43a68a25 } from "../../RadioGroup-BFDueqHz.js";
 import { c as clsx } from "../../clsx-DgYk2OaC.js";
 import { AnimatedVisibility } from "../animated-visibility/animated-visibility.js";
 import { RichLabel } from "../rich-label/rich-label.js";

package/dist/components/responsive/mini-responsive.js

@@ -12,7 +12,7 @@ import { ButtonGroup, Button } from "../button/button.js";
 import { BaseControl } from "../base-control/base-control.js";
 import { TriggeredPopover } from "../popover/popover.js";
 import { OptionSelect } from "../option-select/option-select.js";
-import { $ as $514c0188e459b4c0$export$5f1af8db9871e1d6 } from "../../Text-Dae33gHp.js";
+import { $ as $514c0188e459b4c0$export$5f1af8db9871e1d6 } from "../../Text-CjFEHSfr.js";
 /**
  * A compact, inline version of `Responsive`. Allows the user to set different values for different breakpoints.
  *

package/dist/components/select/async-multi-select.js

@@ -2,13 +2,13 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { s as sprintf } from "../../sprintf-DmNrJSYG.js";
 import { _ as __, a as _n } from "../../default-i18n-CnQeC5Pl.js";
 import { BaseControl } from "../base-control/base-control.js";
-import { $ as $d2f53cda644affe3$export$2f2b9559550c7bbc, a as $440f4836bcb56932$export$b94867ecbd698f21 } from "../../SearchField-CLhr5PGZ.js";
-import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-JRIu2BnS.js";
-import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-Cuw9UbNb.js";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DPWyf-gp.js";
-import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-DT1sFY3e.js";
-import { $ as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-Dd1yqNus.js";
-import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-Bg9lx3pE.js";
+import { $ as $d2f53cda644affe3$export$2f2b9559550c7bbc, a as $440f4836bcb56932$export$b94867ecbd698f21 } from "../../SearchField-CmRhtrQf.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-BTCA69Lt.js";
+import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-Wrnm2nxy.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-yHUyUAAH.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-BbNWvB5_.js";
+import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-DSTKnPjF.js";
 import { useRef, cloneElement } from "react";
 import { icons } from "../../icons/icons.js";
 import "../../react-jsx-parser.min-B_hvYYa1.js";

package/dist/components/select/async-select.js

@@ -1,13 +1,13 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { _ as __ } from "../../default-i18n-CnQeC5Pl.js";
 import { BaseControl } from "../base-control/base-control.js";
-import { $ as $d2f53cda644affe3$export$2f2b9559550c7bbc, a as $440f4836bcb56932$export$b94867ecbd698f21 } from "../../SearchField-CLhr5PGZ.js";
-import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-JRIu2BnS.js";
-import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-Cuw9UbNb.js";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DPWyf-gp.js";
-import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-DT1sFY3e.js";
-import { $ as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-Dd1yqNus.js";
-import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-Bg9lx3pE.js";
+import { $ as $d2f53cda644affe3$export$2f2b9559550c7bbc, a as $440f4836bcb56932$export$b94867ecbd698f21 } from "../../SearchField-CmRhtrQf.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-BTCA69Lt.js";
+import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-Wrnm2nxy.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-yHUyUAAH.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-BbNWvB5_.js";
+import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-DSTKnPjF.js";
 import { useRef, cloneElement } from "react";
 import { icons } from "../../icons/icons.js";
 import "../../react-jsx-parser.min-B_hvYYa1.js";

package/dist/components/select/multi-select.js

@@ -2,13 +2,13 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { s as sprintf } from "../../sprintf-DmNrJSYG.js";
 import { _ as __, a as _n } from "../../default-i18n-CnQeC5Pl.js";
 import { BaseControl } from "../base-control/base-control.js";
-import { $ as $d2f53cda644affe3$export$2f2b9559550c7bbc, a as $440f4836bcb56932$export$b94867ecbd698f21 } from "../../SearchField-CLhr5PGZ.js";
-import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-JRIu2BnS.js";
-import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-Cuw9UbNb.js";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DPWyf-gp.js";
-import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-DT1sFY3e.js";
-import { $ as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-Dd1yqNus.js";
-import { g as getValue, $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-Bg9lx3pE.js";
+import { $ as $d2f53cda644affe3$export$2f2b9559550c7bbc, a as $440f4836bcb56932$export$b94867ecbd698f21 } from "../../SearchField-CmRhtrQf.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-BTCA69Lt.js";
+import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-Wrnm2nxy.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-yHUyUAAH.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-BbNWvB5_.js";
+import { g as getValue, $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-DSTKnPjF.js";
 import { useRef, cloneElement, isValidElement } from "react";
 import { icons } from "../../icons/icons.js";
 import "../../react-jsx-parser.min-B_hvYYa1.js";
@@ -19,7 +19,7 @@ import { TriggeredPopover } from "../popover/popover.js";
 import { DraggableList } from "../draggable-list/draggable-list.js";
 import { DraggableListItem } from "../draggable-list/draggable-list-item.js";
 import { randomId } from "../../utilities/hash.js";
-import { $ as $bb77f239b46e8c72$export$3274cf84b703fff } from "../../useFilter-DYtfYPua.js";
+import { $ as $bb77f239b46e8c72$export$3274cf84b703fff } from "../../useFilter-Cqw0-KoB.js";
 /**
  * Multi-select menu.
  *

package/dist/components/select/shared.js

@@ -1,8 +1,8 @@
 import "react/jsx-runtime";
 import "../../default-i18n-CnQeC5Pl.js";
-import "../../Button-JRIu2BnS.js";
-import "../../ListBox-DT1sFY3e.js";
-import { O, S, g, m } from "../../shared-Bg9lx3pE.js";
+import "../../Button-BTCA69Lt.js";
+import "../../ListBox-yHUyUAAH.js";
+import { O, S, g, m } from "../../shared-DSTKnPjF.js";
 import "../../icons/icons.js";
 import "react";
 import "../../react-jsx-parser.min-B_hvYYa1.js";

package/dist/components/select/single-select.js

@@ -1,13 +1,13 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { _ as __ } from "../../default-i18n-CnQeC5Pl.js";
 import { BaseControl } from "../base-control/base-control.js";
-import { $ as $d2f53cda644affe3$export$2f2b9559550c7bbc, a as $440f4836bcb56932$export$b94867ecbd698f21 } from "../../SearchField-CLhr5PGZ.js";
-import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-JRIu2BnS.js";
-import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-Cuw9UbNb.js";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DPWyf-gp.js";
-import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-DT1sFY3e.js";
-import { $ as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-Dd1yqNus.js";
-import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-Bg9lx3pE.js";
+import { $ as $d2f53cda644affe3$export$2f2b9559550c7bbc, a as $440f4836bcb56932$export$b94867ecbd698f21 } from "../../SearchField-CmRhtrQf.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-BTCA69Lt.js";
+import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-Wrnm2nxy.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-yHUyUAAH.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-BbNWvB5_.js";
+import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-DSTKnPjF.js";
 import { useRef, cloneElement } from "react";
 import { icons } from "../../icons/icons.js";
 import "../../react-jsx-parser.min-B_hvYYa1.js";
@@ -15,7 +15,7 @@ import { c as clsx } from "../../clsx-DgYk2OaC.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 import { c as cva } from "../../index-BHpUy2Ix.js";
 import { randomId } from "../../utilities/hash.js";
-import { $ as $bb77f239b46e8c72$export$3274cf84b703fff } from "../../useFilter-DYtfYPua.js";
+import { $ as $bb77f239b46e8c72$export$3274cf84b703fff } from "../../useFilter-Cqw0-KoB.js";
 /**
  * Select menu.
  *

package/dist/components/slider/column-config-slider.js

@@ -1,13 +1,13 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { s as sprintf } from "../../sprintf-DmNrJSYG.js";
 import { _ as __ } from "../../default-i18n-CnQeC5Pl.js";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DPWyf-gp.js";
-import { $ as $6f909507e6374d18$export$472062a354075cee, a as $6f909507e6374d18$export$105594979f116971, b as $6f909507e6374d18$export$2c1b491743890dec, c as $6f909507e6374d18$export$a590f758a961cb5b } from "../../Slider-CZV3HhHY.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $6f909507e6374d18$export$472062a354075cee, a as $6f909507e6374d18$export$105594979f116971, b as $6f909507e6374d18$export$2c1b491743890dec, c as $6f909507e6374d18$export$a590f758a961cb5b } from "../../Slider-Bl5G0ZHE.js";
 import { BaseControl } from "../base-control/base-control.js";
 import { icons } from "../../icons/icons.js";
 import { getColumnConfigOutputText } from "./utils.js";
 import { c as clsx } from "../../clsx-DgYk2OaC.js";
-import { A as AnimatePresence, m as motion } from "../../proxy-B_RaYTfe.js";
+import { A as AnimatePresence, m as motion } from "../../proxy-CgLBbUpw.js";
 /**
  * A two-thumb slider for selecting a range of columns.
  *

package/dist/components/slider/slider.js

@@ -1,13 +1,13 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useState } from "react";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-DPWyf-gp.js";
-import { $ as $6f909507e6374d18$export$472062a354075cee, a as $6f909507e6374d18$export$105594979f116971, b as $6f909507e6374d18$export$2c1b491743890dec, c as $6f909507e6374d18$export$a590f758a961cb5b } from "../../Slider-CZV3HhHY.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $6f909507e6374d18$export$472062a354075cee, a as $6f909507e6374d18$export$105594979f116971, b as $6f909507e6374d18$export$2c1b491743890dec, c as $6f909507e6374d18$export$a590f758a961cb5b } from "../../Slider-Bl5G0ZHE.js";
 import { BaseControl } from "../base-control/base-control.js";
 import { c as clsx } from "../../clsx-DgYk2OaC.js";
 import { NumberPicker } from "../number-picker/number-picker.js";
 import { generateMarkers, generateGridTemplate } from "./utils.js";
 import { HStack } from "../layout/hstack.js";
-import { A as AnimatePresence, m as motion } from "../../proxy-B_RaYTfe.js";
+import { A as AnimatePresence, m as motion } from "../../proxy-CgLBbUpw.js";
 /**
  * A single/multi-thumb slider component.
  *

package/dist/components/smart-image/image-analysis-worker-next.js

@@ -0,0 +1,144 @@
+const getSaturation = (r, g, b) => {
+  const red = r / 255;
+  const green = g / 255;
+  const blue = b / 255;
+  const max = Math.max(red, green, blue);
+  const min = Math.min(red, green, blue);
+  const delta = max - min;
+  if (max < 0.05) {
+    return 0;
+  }
+  let saturation = 0;
+  if (max !== 0) {
+    saturation = delta / max;
+  }
+  return parseFloat(saturation.toFixed(3));
+};
+const rgbToHex = (r, g, b) => "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1).toUpperCase();
+self.onmessage = (e) => {
+  const { buffer, width, height, config } = e.data;
+  const { maxColors = 5, threshold = 96, transparencyThreshold = 255 } = config;
+  const stride = 4;
+  const isTransparent = (idx) => buffer[idx + 3] < transparencyThreshold;
+  const getIdx = (x, y) => (y * width + x) * stride;
+  const corners = {
+    topLeft: isTransparent(getIdx(0, 0)),
+    topRight: isTransparent(getIdx(width - 1, 0)),
+    bottomLeft: isTransparent(getIdx(0, height - 1)),
+    bottomRight: isTransparent(getIdx(width - 1, height - 1))
+  };
+  const sides = { top: false, bottom: false, left: false, right: false };
+  for (let x = 0; x < width; x += 5) {
+    if (!sides.top && isTransparent(getIdx(x, 0))) {
+      sides.top = true;
+    }
+    if (!sides.bottom && isTransparent(getIdx(x, height - 1))) {
+      sides.bottom = true;
+    }
+  }
+  for (let y = 0; y < height; y += 5) {
+    if (!sides.left && isTransparent(getIdx(0, y))) {
+      sides.left = true;
+    }
+    if (!sides.right && isTransparent(getIdx(width - 1, y))) {
+      sides.right = true;
+    }
+  }
+  let internalTransparent = false;
+  const borderIsSolid = !Object.values(sides).some((v) => v);
+  if (borderIsSolid) {
+    const len = buffer.length;
+    const step = Math.floor(len / 100);
+    for (let i = 0; i < len; i += step) {
+      const idx = i - i % 4;
+      if (buffer[idx + 3] < 255) {
+        internalTransparent = true;
+        break;
+      }
+    }
+  } else {
+    internalTransparent = true;
+  }
+  const colorCounts = {};
+  const samplingRate = 20;
+  let totalSampledPixels = 0;
+  let sumR = 0;
+  let sumG = 0;
+  let sumB = 0;
+  for (let i = 0; i < buffer.length; i += stride * samplingRate) {
+    const rRaw = buffer[i];
+    const gRaw = buffer[i + 1];
+    const bRaw = buffer[i + 2];
+    const a = buffer[i + 3];
+    if (a < 250) continue;
+    totalSampledPixels++;
+    sumR += rRaw;
+    sumG += gRaw;
+    sumB += bRaw;
+    const q = 5;
+    const r = Math.round(rRaw / q) * q;
+    const g = Math.round(gRaw / q) * q;
+    const b = Math.round(bRaw / q) * q;
+    const key = `${r},${g},${b}`;
+    colorCounts[key] = (colorCounts[key] || 0) + 1;
+  }
+  let averageColor = null;
+  if (totalSampledPixels > 0) {
+    const avgR = Math.round(sumR / totalSampledPixels);
+    const avgG = Math.round(sumG / totalSampledPixels);
+    const avgB = Math.round(sumB / totalSampledPixels);
+    const avgLum = 0.2126 * avgR + 0.7152 * avgG + 0.0722 * avgB;
+    averageColor = {
+      color: rgbToHex(avgR, avgG, avgB),
+      isDark: avgLum <= 128,
+      saturation: getSaturation(avgR, avgG, avgB)
+    };
+  }
+  const sortedRawColors = Object.entries(colorCounts).map(([key, count]) => {
+    const [r, g, b] = key.split(",").map(Number);
+    return { r, g, b, count };
+  }).sort((a, b) => b.count - a.count);
+  const distinctPalette = [];
+  for (const candidate of sortedRawColors) {
+    if (distinctPalette.length >= maxColors) break;
+    let isSimilar = false;
+    for (const existing of distinctPalette) {
+      const dist = Math.sqrt(Math.pow(candidate.r - existing.r, 2) + Math.pow(candidate.g - existing.g, 2) + Math.pow(candidate.b - existing.b, 2));
+      if (dist < threshold) {
+        existing.count += candidate.count;
+        isSimilar = true;
+        break;
+      }
+    }
+    if (!isSimilar) {
+      distinctPalette.push({ ...candidate });
+    }
+  }
+  const palette = distinctPalette.map((item) => {
+    const percentage = parseFloat((item.count / totalSampledPixels).toFixed(3));
+    const lum = 0.2126 * item.r + 0.7152 * item.g + 0.0722 * item.b;
+    return {
+      color: rgbToHex(item.r, item.g, item.b),
+      area: percentage,
+      isDark: lum <= 128,
+      saturation: getSaturation(item.r, item.g, item.b)
+    };
+  });
+  self.postMessage({
+    dominantColors: palette,
+    averageColor,
+    isDark: palette[0]?.isDark || false,
+    isTransparent: internalTransparent || Object.values(corners).some((v) => v) || Object.values(sides).some((v) => v),
+    transparencyInfo: {
+      any: internalTransparent,
+      left: sides.left,
+      right: sides.right,
+      top: sides.top,
+      bottom: sides.bottom,
+      topLeftCorner: corners.topLeft,
+      topRightCorner: corners.topRight,
+      bottomLeftCorner: corners.bottomLeft,
+      bottomRightCorner: corners.bottomRight
+    }
+  });
+};