bitboss-ui 2.0.136 → 2.0.138

package/dist/index25.js

@@ -1,15 +1,15 @@
-import { defineComponent as ie, ref as o, computed as u, getCurrentInstance as ne, nextTick as N, useAttrs as re, onMounted as ue, onBeforeUnmount as G, watch as de, openBlock as _, createBlock as ce, withCtx as ve, createElementVNode as a, mergeProps as P, createElementBlock as H, renderSlot as d, createTextVNode as fe, toDisplayString as K, createCommentVNode as L } from "vue";
-import { throttle as be } from "./index249.js";
-import { useFocusTrap as pe } from "./index220.js";
-import { useId as U } from "./index8.js";
-import { wait as T } from "./index130.js";
-import { waitFor as me } from "./index247.js";
-import { useModalsState as C } from "./index250.js";
-import { useLogger as ge } from "./index239.js";
-import { useMobile as ye } from "./index9.js";
-import he from "./index251.js";
-import { useLocale as we } from "./index229.js";
-const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PURE__ */ ie({
+import { defineComponent as ne, ref as o, computed as u, getCurrentInstance as re, nextTick as G, useAttrs as ue, onMounted as de, onBeforeUnmount as P, watch as ce, openBlock as _, createBlock as ve, withCtx as fe, createElementVNode as a, mergeProps as K, createElementBlock as $, renderSlot as d, createTextVNode as be, toDisplayString as U, createCommentVNode as M } from "vue";
+import { throttle as pe } from "./index247.js";
+import { useFocusTrap as me } from "./index226.js";
+import { useId as j } from "./index8.js";
+import { wait as C } from "./index130.js";
+import { waitFor as ge } from "./index228.js";
+import { useModalsState as B } from "./index248.js";
+import { useLogger as ye } from "./index217.js";
+import { useMobile as he } from "./index9.js";
+import we from "./index249.js";
+import { useLocale as ke } from "./index223.js";
+const _e = { class: "bb-base-dialog-close" }, Ce = ["aria-label"], Ae = /* @__PURE__ */ ne({
   __name: "BaseDialog",
   props: {
     closeLabel: {},
@@ -30,80 +30,81 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
     modelValue: { type: [Boolean, null] }
   },
   emits: ["shown", "hidden", "update:modelValue"],
-  setup(j, { emit: q }) {
-    var R, W;
-    const l = j, c = q, B = `title_${U().id.value}`, V = `description_${U().id.value}`, { isMobile: J } = ye(), g = o(null), v = o(null), $ = o(null), y = o(null), f = o(null), s = o(null), b = o(null), Q = o(null), M = u(
-      () => l.fullscreen === !0 || l.fullscreen === "mobile" && J.value
-    ), D = !!((W = (R = ne()) == null ? void 0 : R.proxy) != null && W.$nuxt), h = o(0), X = u(() => {
-      const { openedModals: e } = C();
+  setup(q, { emit: J }) {
+    var W, F;
+    const l = q, c = J, V = `title_${j().id.value}`, z = `description_${j().id.value}`, { isMobile: Q } = he(), g = o(null), v = o(null), H = o(null), y = o(null), f = o(null), s = o(null), b = o(null), X = o(null), D = u(
+      () => l.fullscreen === !0 || l.fullscreen === "mobile" && Q.value
+    ), x = !!((F = (W = re()) == null ? void 0 : W.proxy) != null && F.$nuxt), h = o(0), Y = u(() => {
+      const { openedModals: e } = B();
       return e.value && e.value === h.value;
-    }), { activate: Y, deactivate: x } = pe($, {
+    }), { activate: Z, deactivate: O } = me(H, {
       initialFocus: l.focusTarget ?? void 0,
       clickOutsideDeactivates: (e) => e.target === v.value,
       allowOutsideClick: !0,
       /* On esc deactivate the trap, return focus and then close the modal */
-      escapeDeactivates: () => (N(() => {
+      escapeDeactivates: () => (G(() => {
         c("update:modelValue", !1);
       }), !0)
-    }), Z = re(), { t: ee } = we(), le = u(
-      () => l.closeLabel || ee("dialog.closeLabel").value
+    }), ee = ue(), { t: le } = ke(), te = u(
+      () => l.closeLabel || le("dialog.closeLabel").value
     );
-    ue(async () => {
-      s.value && (g.value = new ResizeObserver(r), g.value.observe(s.value)), window.addEventListener("resize", r), r(), !(!l.modelValue && !n.value) && (D && !globalThis.document || A());
-    }), G(() => {
+    de(async () => {
+      s.value && (g.value = new ResizeObserver(r), g.value.observe(s.value)), window.addEventListener("resize", r), r(), !(!l.modelValue && !n.value) && (x && !globalThis.document || E());
+    }), P(() => {
       window.removeEventListener("resize", r);
     });
-    const w = o(!1), p = o(!1), z = o(!0), m = o(!1), n = o(l.eager || l.modelValue), O = u(() => p.value || m.value), te = () => {
+    const w = o(!1), p = o(!1), L = o(!0), m = o(!1), n = o(l.eager || l.modelValue), S = u(() => p.value || m.value), oe = () => {
       if (!globalThis.document) return;
       const e = window.innerWidth - document.documentElement.clientWidth;
       document.body.style.overflow = "hidden", document.body.style.paddingRight = `${e}px`;
-    }, S = () => {
+    }, A = () => {
       globalThis.document && (document.body.style.overflow = "auto", document.body.style.paddingRight = "0px");
     };
-    G(() => {
+    P(() => {
       if (l.modelValue) {
-        const { openedModals: e, modalHasClosed: t } = C();
-        e.value && (t(), h.value = 0, S());
+        const { openedModals: e, modalHasClosed: t } = B();
+        e.value && (t(), h.value = 0, A());
       }
     });
-    const A = async () => {
+    const E = async () => {
       if (l.modelValue) {
-        n.value || (n.value = !0, await me(() => !!s.value), await N(), s.value && (g.value = new ResizeObserver(r), g.value.observe(s.value))), z.value = !1, m.value = !1, p.value = !0;
-        const { modalHasOpened: e, openedModals: t } = C();
-        e(), h.value = t.value, te(), await T(l.transitionDuration), p.value = !1, w.value = !0, c("shown"), Y();
+        n.value || (n.value = !0, await ge(() => !!s.value), await G(), s.value && (g.value = new ResizeObserver(r), g.value.observe(s.value))), L.value = !1, m.value = !1, p.value = !0;
+        const { modalHasOpened: e, openedModals: t } = B();
+        e(), h.value = t.value, oe(), await C(l.transitionDuration), p.value = !1, w.value = !0, c("shown"), Z();
       } else {
-        x(), p.value = !1, w.value = !1, m.value = !0, await T(l.transitionDuration), m.value = !1, z.value = !0;
-        const { modalHasClosed: e, openedModals: t } = C();
-        e(), h.value = 0, t.value || S(), c("hidden");
+        O(), p.value = !1, w.value = !1, m.value = !0, await C(l.transitionDuration), m.value = !1, L.value = !0;
+        const { modalHasClosed: e, openedModals: t } = B();
+        e(), h.value = 0, t.value || A(), c("hidden");
       }
     };
-    de(
+    ce(
       () => l.modelValue,
       () => {
-        !l.modelValue && !n.value || D && !globalThis.document || A();
+        !l.modelValue && !n.value || x && !globalThis.document || E();
       },
       { flush: "post" }
     );
     const k = (e) => {
       e.target === v.value && e.preventDefault();
-    }, oe = (e) => {
-      l.disabled || O.value || v.value && e.target === v.value && (l.persistent || c("update:modelValue", !1));
-    }, E = () => {
-      l.disabled || O.value || (x(), c("update:modelValue", !1));
-    }, ae = u(() => {
+    }, T = o(!1), ae = async (e) => {
+      l.disabled || S.value || v.value && e.target === v.value && (l.persistent ? H.value && (T.value = !0, await C(100), T.value = !1) : c("update:modelValue", !1));
+    }, I = () => {
+      l.disabled || S.value || (O(), c("update:modelValue", !1));
+    }, se = u(() => {
       const e = [
         {
           "bb-base-dialog bb-base-dialog__overlay": !0,
-          "bb-base-dialog--fullscreen": M.value,
-          "bb-base-dialog--faded": !X.value,
+          "bb-base-dialog--fullscreen": D.value,
+          "bb-base-dialog--faded": !Y.value,
           "bb-base-dialog--open": w.value,
           "bb-base-dialog--opening": p.value,
-          "bb-base-dialog--closed": z.value,
-          "bb-base-dialog--closing": m.value
+          "bb-base-dialog--closed": L.value,
+          "bb-base-dialog--closing": m.value,
+          "bb-base-dialog--attempted-closing": T.value
         },
         l.overlayClasses
       ].flat(), t = {
-        onClick: oe,
+        onClick: ae,
         onScroll: k,
         onTouchmove: k,
         onWheel: k,
@@ -115,9 +116,9 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
         class: e,
         style: i,
         ...t,
-        ...Z
+        ...ee
       };
-    }), se = u(() => {
+    }), ie = u(() => {
       const e = [
         {
           "bb-base-dialog__panel": !0,
@@ -129,14 +130,14 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
         "aria-modal": !0,
         "aria-live": w.value ? "polite" : "off"
       };
-      n.value && (l.title && (t["aria-labelledby"] = B), l.description && (t["aria-describedby"] = V));
+      n.value && (l.title && (t["aria-labelledby"] = V), l.description && (t["aria-describedby"] = z));
       let i;
-      const F = {
+      const N = {
         sm: 384,
         md: 652,
         lg: 896
       };
-      return M.value ? i = "100%" : typeof l.size == "number" ? i = l.size + "px" : l.size in F ? i = F[l.size] + "px" : i = l.size + "px", {
+      return D.value ? i = "100%" : typeof l.size == "number" ? i = l.size + "px" : l.size in N ? i = N[l.size] + "px" : i = l.size + "px", {
         class: e,
         style: {
           maxWidth: i
@@ -144,22 +145,22 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
         ...t
       };
     });
-    let I = 0;
-    const r = be(
+    let R = 0;
+    const r = pe(
       async () => {
-        if (I++, I === 100) {
-          const { error: e } = ge();
+        if (R++, R === 100) {
+          const { error: e } = ye();
           e(
             "Dialog is updating its height too often. Please check the content is reliably sized."
           );
         }
         if (l.fullscreen) {
-          Q.value = window.innerHeight;
+          X.value = window.innerHeight;
           return;
         }
         if (f.value && s.value && b.value) {
           const e = f.value.scrollHeight + s.value.scrollHeight + b.value.scrollHeight + 2;
-          if (y.value && (y.value.style.height = "0px", y.value.style.height = `${e + 2}px`, await T(30), f.value && s.value && b.value)) {
+          if (y.value && (y.value.style.height = "0px", y.value.style.height = `${e + 2}px`, await C(30), f.value && s.value && b.value)) {
             const t = f.value.scrollHeight + s.value.scrollHeight + b.value.scrollHeight + 2;
             e !== t && r();
           }
@@ -168,17 +169,17 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
       200,
       { trailing: !0 }
     );
-    return (e, t) => (_(), ce(he, null, {
-      default: ve(() => [
-        a("div", P(ae.value, {
+    return (e, t) => (_(), ve(we, null, {
+      default: fe(() => [
+        a("div", K(se.value, {
           ref_key: "overlay",
           ref: v
         }), [
-          a("div", P(se.value, {
+          a("div", K(ie.value, {
             ref_key: "panel",
-            ref: $
+            ref: H
           }), [
-            n.value ? (_(), H("div", {
+            n.value ? (_(), $("div", {
               key: 0,
               ref_key: "content",
               ref: y,
@@ -190,24 +191,24 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
                 class: "bb-base-dialog__header"
               }, [
                 d(e.$slots, "header", {
-                  close: E,
+                  close: I,
                   title: e.title,
-                  titleId: B
+                  titleId: V
                 }, () => [
                   a("span", {
-                    id: B,
+                    id: V,
                     class: "bb-base-dialog__title"
                   }, [
                     d(e.$slots, "title", { text: e.title }, () => [
-                      fe(K(e.title), 1)
+                      be(U(e.title), 1)
                     ])
                   ]),
-                  a("span", ke, [
-                    e.showClose ? (_(), H("button", {
+                  a("span", _e, [
+                    e.showClose ? (_(), $("button", {
                       key: 0,
-                      "aria-label": le.value,
+                      "aria-label": te.value,
                       type: "button",
-                      onClick: E
+                      onClick: I
                     }, [
                       d(e.$slots, "close", {}, () => [
                         t[0] || (t[0] = a("span", { class: "bb-base-dialog-close__icon" }, [
@@ -221,12 +222,12 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
                               d: "M23 23L1 1M23 1L1 23",
                               stroke: "currentColor",
                               "stroke-linecap": "round",
-                              "stroke-width": "2"
+                              "stroke-width": "3"
                             })
                           ])
                         ], -1))
                       ])
-                    ], 8, _e)) : L("", !0)
+                    ], 8, Ce)) : M("", !0)
                   ])
                 ])
               ], 512),
@@ -236,14 +237,14 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
                 class: "bb-base-dialog__body scrollbar-border"
               }, [
                 d(e.$slots, "description", {
-                  descriptionId: V,
+                  descriptionId: z,
                   text: e.description
                 }, () => [
-                  e.description ? (_(), H("div", {
+                  e.description ? (_(), $("div", {
                     key: 0,
-                    id: V,
+                    id: z,
                     class: "bb-base-dialog__description sr-only"
-                  }, K(e.description), 1)) : L("", !0)
+                  }, U(e.description), 1)) : M("", !0)
                 ]),
                 d(e.$slots, "default")
               ], 512),
@@ -255,7 +256,7 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
               }, [
                 d(e.$slots, "footer")
               ], 512)
-            ], 512)) : L("", !0)
+            ], 512)) : M("", !0)
           ], 16)
         ], 16)
       ]),
@@ -264,5 +265,5 @@ const ke = { class: "bb-base-dialog-close" }, _e = ["aria-label"], Se = /* @__PU
   }
 });
 export {
-  Se as default
+  Ae as default
 };

package/dist/index250.js

@@ -1,9 +1,6 @@
-import { ref as e } from "vue";
-const o = e(0), s = () => {
-  o.value++;
-}, a = () => {
-  o.value--;
-}, d = () => ({ openedModals: o, modalHasOpened: s, modalHasClosed: a });
+function x(e) {
+  return /^#([A-Fa-f0-9]{6})$/.test(e);
+}
 export {
-  d as useModalsState
+  x as isHex
 };

package/dist/index251.js

@@ -1,17 +1,202 @@
-import { defineComponent as a, getCurrentInstance as c, openBlock as l, createBlock as u, Teleport as f, unref as d, renderSlot as m } from "vue";
-const i = /* @__PURE__ */ a({
-  __name: "BbTeleport",
+import { defineComponent as j, ref as c, onMounted as J, watch as Q, openBlock as _, createElementBlock as R, createElementVNode as w, createTextVNode as B, toDisplayString as C, unref as x, createCommentVNode as K } from "vue";
+import { useResizeObserver as Z } from "./index132.js";
+import { hexToRgb as O } from "./index329.js";
+import { getHueFromRGB as F } from "./index330.js";
+import { hslToHex as y } from "./index331.js";
+import { useLocale as ee } from "./index223.js";
+const te = {
+  id: "mainCanvasDesc",
+  "aria-live": "polite",
+  class: "sr-only"
+}, ae = { key: 0 }, ne = {
+  id: "hueCanvasDesc",
+  "aria-live": "polite",
+  class: "sr-only"
+}, oe = { key: 0 }, de = /* @__PURE__ */ j({
+  __name: "ColorPallette",
   props: {
-    target: {}
+    modelValue: {}
   },
-  setup(o) {
-    var t, e;
-    const r = o, n = !!((e = (t = c()) == null ? void 0 : t.proxy) != null && e.$nuxt), p = r.target || (n ? "#teleports" : "body");
-    return (s, _) => (l(), u(f, { to: d(p) }, [
-      m(s.$slots, "default")
-    ], 8, ["to"]));
+  emits: ["update:modelValue"],
+  setup(N, { emit: T }) {
+    const D = N, f = T, { t: h } = ee(), o = c(D.modelValue), d = c(
+      y(F(...O(o.value ?? "#ff0000")), 100, 50)
+    ), P = c(null), s = c(null), r = c(null), l = c({ x: 0, y: 0 }), u = c({ x: 0 }), b = c(!1), k = c(!1), H = () => {
+      const e = s.value, t = r.value;
+      !e || !t || (e.width = e.offsetWidth, e.height = e.offsetHeight, t.width = t.offsetWidth, t.height = t.offsetHeight, v(), m());
+    }, I = () => {
+      const e = s.value;
+      return e ? e.getContext("2d", { willReadFrequently: !0 }) : null;
+    }, v = () => {
+      const e = s.value;
+      if (!e) return;
+      const t = I();
+      if (!t) return;
+      t.clearRect(0, 0, e.width, e.height);
+      const a = t.createLinearGradient(0, 0, e.width, 0);
+      a.addColorStop(0, d.value), a.addColorStop(1, "#ffffff");
+      const n = t.createLinearGradient(0, 0, 0, e.height);
+      n.addColorStop(0, "transparent"), n.addColorStop(1, "#000000"), t.fillStyle = a, t.fillRect(0, 0, e.width, e.height), t.fillStyle = n, t.globalCompositeOperation = "multiply", t.fillRect(0, 0, e.width, e.height), t.globalCompositeOperation = "source-over", t.fillStyle = "#000000", t.strokeStyle = "#000000", t.lineWidth = 1;
+    }, p = () => {
+      const e = I();
+      e && (e.beginPath(), e.arc(
+        l.value.x,
+        l.value.y,
+        8,
+        0,
+        2 * Math.PI
+      ), e.strokeStyle = "#ffffff", e.lineWidth = 2, e.stroke(), e.beginPath(), e.arc(
+        l.value.x,
+        l.value.y,
+        7,
+        0,
+        2 * Math.PI
+      ), e.strokeStyle = "#000000", e.lineWidth = 1, e.stroke(), e.globalCompositeOperation = "source-over");
+    }, V = () => {
+      const e = r.value;
+      return e ? e.getContext("2d", { willReadFrequently: !0 }) : null;
+    }, m = () => {
+      const e = r.value;
+      if (!e) return;
+      const t = V();
+      if (!t) return;
+      const a = t.createLinearGradient(0, 0, e.width, 0);
+      for (let n = 0; n <= 360; n += 60)
+        a.addColorStop(n / 360, `hsl(${n}, 100%, 50%)`);
+      a.addColorStop(1, "hsl(360, 100%, 50%)"), t.fillStyle = a, t.fillRect(0, 0, e.width, e.height), L(), t.fillStyle = "#000000", t.strokeStyle = "#000000", t.lineWidth = 1;
+    }, L = () => {
+      const e = r.value;
+      if (!e) return;
+      const t = V();
+      if (!t) return;
+      const a = 10, n = 16, i = u.value.x - a / 2, S = e.height / 2 - n / 2;
+      t.beginPath(), t.roundRect(i, S, a, n, 2), t.strokeStyle = "lightgray", t.stroke(), t.fillStyle = "#ffffff", t.fill();
+    }, q = (e) => {
+      s.value && (window.addEventListener("pointermove", A), window.addEventListener("pointerup", E), b.value = !0, G(e));
+    }, z = (e) => {
+      r.value && (window.addEventListener("pointermove", A), window.addEventListener("pointerup", E), k.value = !0, W(e));
+    }, G = (e) => {
+      const t = s.value;
+      if (!t) return;
+      const a = t.getBoundingClientRect(), n = Math.max(0, Math.min(t.width, e.clientX - a.left)), i = Math.max(0, Math.min(t.height, e.clientY - a.top));
+      l.value = { x: n, y: i }, v(), p(), o.value = g(), f("update:modelValue", o.value);
+    }, W = (e) => {
+      const t = r.value;
+      if (!t) return;
+      const a = t.getBoundingClientRect(), n = Math.max(0, Math.min(t.width, e.clientX - a.left));
+      u.value = { x: n };
+      const i = n / t.width * 360;
+      d.value = y(i, 100, 50), m(), v(), p(), o.value = g(), f("update:modelValue", o.value);
+    }, A = (e) => {
+      b.value ? G(e) : k.value && W(e);
+    }, E = () => {
+      b.value = !1, k.value = !1;
+    }, U = (e) => {
+      var a, n;
+      switch (e.key) {
+        case "ArrowUp":
+          l.value.y = Math.max(0, l.value.y - 5);
+          break;
+        case "ArrowDown":
+          l.value.y = Math.min(
+            ((a = s.value) == null ? void 0 : a.height) ?? 0,
+            l.value.y + 5
+          );
+          break;
+        case "ArrowLeft":
+          l.value.x = Math.max(0, l.value.x - 5);
+          break;
+        case "ArrowRight":
+          l.value.x = Math.min(
+            ((n = s.value) == null ? void 0 : n.width) ?? 0,
+            l.value.x + 5
+          );
+          break;
+        default:
+          return;
+      }
+      v(), p(), o.value = g(), f("update:modelValue", o.value), e.preventDefault();
+    }, X = (e) => {
+      var n, i;
+      switch (e.key) {
+        case "ArrowLeft":
+          u.value.x = Math.max(0, u.value.x - 5);
+          break;
+        case "ArrowRight":
+          u.value.x = Math.min(
+            ((n = r.value) == null ? void 0 : n.width) ?? 0,
+            u.value.x + 5
+          );
+          break;
+        default:
+          return;
+      }
+      const a = u.value.x / (((i = r.value) == null ? void 0 : i.width) ?? 1) * 360;
+      d.value = y(a, 100, 50), m(), L(), v(), p(), o.value = g(), f("update:modelValue", o.value), e.preventDefault();
+    };
+    J(() => {
+      H(), M(o.value ?? "#ff0000");
+    }), Z(P, () => {
+      H(), M(o.value ?? "#ff0000");
+    }), Q(
+      () => D.modelValue,
+      (e) => {
+        !e || e === o.value || (o.value = e, M(e), m(), v());
+      }
+    );
+    const g = () => {
+      const e = s.value;
+      if (!e) return "#ffffff";
+      const t = e.getContext("2d");
+      if (!t) return "#ffffff";
+      const { x: a, y: n } = l.value, i = t.getImageData(a, n, 1, 1).data, [S, $, Y] = i;
+      return `#${((1 << 24) + (S << 16) + ($ << 8) + Y).toString(16).slice(1)}`;
+    };
+    function M(e) {
+      var a;
+      const t = F(...O(e));
+      d.value = y(t, 100, 50), u.value.x = t / 360 * (((a = r.value) == null ? void 0 : a.width) ?? 0);
+    }
+    return (e, t) => (_(), R("div", {
+      ref_key: "paletteRef",
+      ref: P,
+      "aria-label": "Color Picker",
+      class: "bb-color-palette",
+      role: "application"
+    }, [
+      w("canvas", {
+        ref_key: "mainCanvasRef",
+        ref: s,
+        "aria-describedby": "mainCanvasDesc",
+        "aria-label": "Main Color Selection",
+        class: "bb-color-palette__canvas",
+        role: "application",
+        tabindex: "0",
+        onKeydown: U,
+        onPointerdown: q
+      }, null, 544),
+      w("p", te, [
+        B(C(x(h)("colorInput.mainCanvasDesc")) + " ", 1),
+        o.value ? (_(), R("span", ae, C(x(h)("colorInput.mainCanvasSelectedColor", o.value)), 1)) : K("", !0)
+      ]),
+      w("canvas", {
+        ref_key: "hueCanvasRef",
+        ref: r,
+        "aria-describedby": "hueCanvasDesc",
+        "aria-label": "Hue Selection",
+        class: "bb-color-palette__hue-canvas",
+        role: "application",
+        tabindex: "0",
+        onKeydown: X,
+        onPointerdown: z
+      }, null, 544),
+      w("p", ne, [
+        B(C(x(h)("colorInput.hueCanvasDesc")) + " ", 1),
+        d.value ? (_(), R("span", oe, C(x(h)("colorInput.hueCanvasSelectedHue", d.value)), 1)) : K("", !0)
+      ])
+    ], 512));
   }
 });
 export {
-  i as default
+  de as default
 };

package/dist/{index230.js → index253.js}

@@ -1,4 +1,4 @@
-import r from "./index284.js";
+import r from "./index306.js";
 const t = r;
 export {
   t as deburr