@eightshift/ui-components 6.0.13 → 6.1.1

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

@@ -2,16 +2,16 @@ 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-CafsA525.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-CFnNdpNZ.js";
+import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-B4X6-x6r.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-BaN0n5h3.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-D0jMcN-a.js";
+import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-CMLCUova.js";
 import { useRef, cloneElement } from "react";
 import { icons } from "../../icons/icons.js";
-import "../../react-jsx-parser.min-B_hvYYa1.js";
+import "../../react-jsx-parser.min-DAh4myol.js";
 import { Spinner } from "../../icons/spinner.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 import { unescapeHTML } from "../../utilities/text-helpers.js";
@@ -151,7 +151,23 @@ const AsyncMultiSelect = (props) => {
     }
   });
   const handleSelectionChange = (rawSelected) => {
-    const selected = list.filterText.length > 0 ? /* @__PURE__ */ new Set([...value?.map((item) => item?.value) ?? [], ...rawSelected]) : rawSelected;
+    let selected;
+    if (list.filterText.length > 0) {
+      const visibleItemKeys = new Set(list.items?.map((item) => item.value) ?? []);
+      selected = /* @__PURE__ */ new Set();
+      for (const item of value ?? []) {
+        const key = item?.value ?? item;
+        if (!visibleItemKeys.has(key)) {
+          selected.add(key);
+        }
+      }
+      for (const key of rawSelected) {
+        selected.add(key);
+      }
+    } else {
+      selected = rawSelected;
+    }
+    list.setSelectedKeys(selected);
     list.filterText = "";
     if (selected === null || selected === void 0) {
       onChange(null);
@@ -282,35 +298,35 @@ const AsyncMultiSelect = (props) => {
                 ref,
                 children: [
                   /* @__PURE__ */ jsxs($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { className: buttonClass({ size }), children: [
-                    /* @__PURE__ */ jsx($82d7e5349645de74$export$e288731fd71264f0, { className: "es:select-none es:pointer-events-none", children: ({ isPlaceholder, selectedItems }) => {
-                      const [selectedItem] = selectedItems;
-                      if (!currentValueKeys?.length || isPlaceholder) {
+                    /* @__PURE__ */ jsx($82d7e5349645de74$export$e288731fd71264f0, { className: "es:select-none es:pointer-events-none", children: () => {
+                      if (!currentValueKeys?.length) {
                         return /* @__PURE__ */ jsx("span", { className: "es:select-none es:pointer-events-none es:pr-6 es:text-sm es:text-surface-500", children: placeholder });
                       }
-                      let icon2 = getIcon ? getIcon(selectedItem) : selectedItem?.icon ?? null;
-                      if (typeof selectedItem?.icon === "string") {
-                        icon2 = icons?.[selectedItem.icon] ?? null;
+                      const currentItem = value?.[0];
+                      let icon2 = getIcon ? getIcon(currentItem) : currentItem?.icon ?? null;
+                      if (typeof currentItem?.icon === "string") {
+                        icon2 = icons?.[currentItem.icon] ?? null;
                       }
-                      if (selectedItems.length > 1) {
+                      if (value?.length > 1) {
                         return /* @__PURE__ */ jsx(
                           RichLabel,
                           {
                             icon: icons.multiple,
-                            label: sprintf(_n("%s item", "%s items", selectedItems.length, "eightshift-ui-components"), selectedItems.length),
-                            subtitle: selectedItems.map((item) => item?.label ?? item).join(", "),
+                            label: sprintf(_n("%s item", "%s items", value.length, "eightshift-ui-components"), value.length),
+                            subtitle: value.map((item) => item?.label ?? item).join(", "),
                             subtitleClassName: "es:line-clamp-1 es:max-w-56"
                           }
                         );
                       }
-                      if (!isPlaceholder && value && customValueDisplay) {
-                        return customValueDisplay(selectedItem);
+                      if (value && customValueDisplay) {
+                        return customValueDisplay(currentItem);
                       }
                       return /* @__PURE__ */ jsx(
                         RichLabel,
                         {
                           icon: icon2,
-                          label: selectedItem?.label,
-                          subtitle: selectedItem?.subtitle,
+                          label: currentItem?.label,
+                          subtitle: currentItem?.subtitle,
                           className: clsx("es:pr-6 es:grow es:w-full", disabled && "es:grayscale es:pointer-events-none"),
                           iconClassName: "es:pointer-events-none es:select-none",
                           labelClassName: "es:line-clamp-1",
@@ -362,28 +378,34 @@ const AsyncMultiSelect = (props) => {
                           DraggableList,
                           {
                             items: value ?? [],
-                            onChange: (value2) => {
-                              handleSelectionChange(new Set(value2?.map((item) => item?.value ?? item)));
+                            onChange: (reordered) => {
+                              onChange(
+                                reordered.map((item) => ({
+                                  label: item?.label,
+                                  value: item?.value,
+                                  subtitle: item?.subtitle,
+                                  meta: item?.meta
+                                }))
+                              );
                             },
                             className: "es:contents",
                             itemContainerClassName: "es:h-full es:max-h-60 es:overflow-y-auto es:pb-1.5 es:mt-0",
                             itemClassName: "es:z-999999",
                             children: (item) => {
-                              const realItem = list.getItem(item?.value);
-                              let icon2 = getIcon ? getIcon(realItem) : realItem?.icon ?? null;
-                              if (typeof realItem?.icon === "string") {
-                                icon2 = icons?.[realItem.icon] ?? null;
+                              let icon2 = getIcon ? getIcon(item) : item?.icon ?? null;
+                              if (typeof item?.icon === "string") {
+                                icon2 = icons?.[item.icon] ?? null;
                               }
                               return /* @__PURE__ */ jsx(
                                 DraggableListItem,
                                 {
                                   icon: icon2,
-                                  label: realItem?.label,
-                                  subtitle: realItem?.subtitle,
+                                  label: item?.label,
+                                  subtitle: item?.subtitle,
                                   iconClassName: "es:pointer-events-none es:select-none",
                                   labelClassName: "es:line-clamp-1",
                                   subtitleClassName: "es:line-clamp-1",
-                                  className: clsx("es:flex es:items-center es:justify-between", realItem?.icon ? "es:pl-1" : "es:pl-2")
+                                  className: clsx("es:flex es:items-center es:justify-between", item?.icon ? "es:pl-1" : "es:pl-2")
                                 }
                               );
                             }
@@ -473,7 +495,6 @@ const AsyncMultiSelect = (props) => {
                           selectionMode: "multiple",
                           selectionBehavior: "toggle",
                           onSelectionChange: (selected) => {
-                            list.setSelectedKeys(selected);
                             handleSelectionChange(selected);
                           },
                           renderEmptyState: () => /* @__PURE__ */ jsx(

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

@@ -1,16 +1,16 @@
 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-CafsA525.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-CFnNdpNZ.js";
+import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-B4X6-x6r.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-BaN0n5h3.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-D0jMcN-a.js";
+import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-CMLCUova.js";
 import { useRef, cloneElement } from "react";
 import { icons } from "../../icons/icons.js";
-import "../../react-jsx-parser.min-B_hvYYa1.js";
+import "../../react-jsx-parser.min-DAh4myol.js";
 import { Spinner } from "../../icons/spinner.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 import { unescapeHTML } from "../../utilities/text-helpers.js";

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

@@ -2,16 +2,16 @@ 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-CafsA525.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-CFnNdpNZ.js";
+import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-B4X6-x6r.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-BaN0n5h3.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-D0jMcN-a.js";
+import { g as getValue, $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-CMLCUova.js";
 import { useRef, cloneElement, isValidElement } from "react";
 import { icons } from "../../icons/icons.js";
-import "../../react-jsx-parser.min-B_hvYYa1.js";
+import "../../react-jsx-parser.min-DAh4myol.js";
 import { c as clsx } from "../../clsx-DgYk2OaC.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 import { c as cva } from "../../index-BHpUy2Ix.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-8S94U4xM.js";
 /**
  * Multi-select menu.
  *

package/dist/components/select/shared.js

@@ -1,11 +1,11 @@
 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-CFnNdpNZ.js";
+import "../../ListBox-BaN0n5h3.js";
+import { O, S, g, m } from "../../shared-CMLCUova.js";
 import "../../icons/icons.js";
 import "react";
-import "../../react-jsx-parser.min-B_hvYYa1.js";
+import "../../react-jsx-parser.min-DAh4myol.js";
 import "../../clsx-DgYk2OaC.js";
 import "../animated-visibility/animated-visibility.js";
 export {

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

@@ -1,21 +1,21 @@
 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-CafsA525.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-CFnNdpNZ.js";
+import { $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-B4X6-x6r.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-BDlf9vIY.js";
+import { $ as $eed445e0843c11d0$export$41f133550aa26f48 } from "../../ListBox-BaN0n5h3.js";
+import { f as $07b14b47974efb58$export$5b6b19405a83ff9d } from "../../Dialog-D0jMcN-a.js";
+import { $ as $82d7e5349645de74$export$ef9b1a59e592288f, a as $82d7e5349645de74$export$e288731fd71264f0, S as SelectClearButton, O as OptionItemBase } from "../../shared-CMLCUova.js";
 import { useRef, cloneElement } from "react";
 import { icons } from "../../icons/icons.js";
-import "../../react-jsx-parser.min-B_hvYYa1.js";
+import "../../react-jsx-parser.min-DAh4myol.js";
 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-8S94U4xM.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-BIbaMdUE.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-DFlYXk07.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-BIbaMdUE.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-DFlYXk07.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
+    }
+  });
+};