@editora/ui-core 0.1.19 → 0.1.21

package/dist/color-picker.esm.js

@@ -1,22 +1,18 @@
-import { E as V } from "./ElementBase-909688f3.mjs";
-import { r as W, e as K, l as G, i as I, s as X, c as Y } from "./date-time-utils-a2c7af25.mjs";
-import "./calendar-2c11b824.mjs";
-import "./scroll-lock-31da444f.mjs";
-import "./positioner-e9770c66.mjs";
+import { E as q } from "./ElementBase-YlTLMsGk.mjs";
+import { r as O, e as F, l as U, i as A, s as N, c as V } from "./date-time-utils-y1N2gvG2.mjs";
 function g(s, t, e) {
   return Math.max(t, Math.min(e, s));
 }
-function m(s, t = 3) {
+function _(s, t = 3) {
   const e = 10 ** t;
   return Math.round(s * e) / e;
 }
-function P(s) {
+function S(s) {
   return g(Math.round(s), 0, 255);
 }
-function O(s) {
+function D(s) {
   const t = s.trim();
-  if (!t)
-    return null;
+  if (!t) return null;
   if (t.endsWith("%")) {
     const r = Number(t.slice(0, -1));
     return Number.isFinite(r) ? g(r / 100, 0, 1) : null;
@@ -24,55 +20,50 @@ function O(s) {
   const e = Number(t);
   return Number.isFinite(e) ? g(e, 0, 1) : null;
 }
-function B(s) {
+function P(s) {
   const t = s.trim();
-  if (!t)
-    return null;
+  if (!t) return null;
   if (t.endsWith("%")) {
     const r = Number(t.slice(0, -1));
-    return Number.isFinite(r) ? P(g(r, 0, 100) / 100 * 255) : null;
+    return Number.isFinite(r) ? S(g(r, 0, 100) / 100 * 255) : null;
   }
   const e = Number(t);
-  return Number.isFinite(e) ? P(e) : null;
+  return Number.isFinite(e) ? S(e) : null;
 }
-function H(s) {
+function B(s) {
   const t = s.trim();
-  if (!t.endsWith("%"))
-    return null;
+  if (!t.endsWith("%")) return null;
   const e = Number(t.slice(0, -1));
   return Number.isFinite(e) ? g(e, 0, 100) : null;
 }
-function j(s) {
+function W(s) {
   const t = s.trim().toLowerCase();
-  if (!t)
-    return null;
+  if (!t) return null;
   if (t.endsWith("deg")) {
     const r = Number(t.slice(0, -3));
-    return Number.isFinite(r) ? w(r) : null;
+    return Number.isFinite(r) ? y(r) : null;
   }
   if (t.endsWith("turn")) {
     const r = Number(t.slice(0, -4));
-    return Number.isFinite(r) ? w(r * 360) : null;
+    return Number.isFinite(r) ? y(r * 360) : null;
   }
   if (t.endsWith("rad")) {
     const r = Number(t.slice(0, -3));
-    return Number.isFinite(r) ? w(r * 180 / Math.PI) : null;
+    return Number.isFinite(r) ? y(r * 180 / Math.PI) : null;
   }
   const e = Number(t);
-  return Number.isFinite(e) ? w(e) : null;
+  return Number.isFinite(e) ? y(e) : null;
 }
-function w(s) {
+function y(s) {
   const t = s % 360;
   return t < 0 ? t + 360 : t;
 }
-function F(s) {
+function T(s) {
   const t = s.trim();
-  if (!t)
-    return null;
+  if (!t) return null;
   if (t.includes("/")) {
     const [r, i] = t.split("/");
-    if (i == null)
-      return null;
+    if (i == null) return null;
     const a = r.includes(",") ? r.split(",") : r.trim().split(/\s+/);
     return a.length < 3 ? null : {
       channels: a.map((n) => n.trim()).filter(Boolean),
@@ -92,123 +83,116 @@ function F(s) {
     alpha: e[3] ?? null
   };
 }
-function J(s) {
+function K(s) {
   const t = s.trim().replace(/^#/, "");
-  if (![3, 4, 6, 8].includes(t.length) || !/^[0-9a-f]+$/i.test(t))
-    return null;
+  if (![3, 4, 6, 8].includes(t.length) || !/^[0-9a-f]+$/i.test(t)) return null;
   if (t.length === 3 || t.length === 4) {
     const n = parseInt(t[0] + t[0], 16), o = parseInt(t[1] + t[1], 16), l = parseInt(t[2] + t[2], 16), c = t.length === 4 ? parseInt(t[3] + t[3], 16) / 255 : 1;
-    return h({ r: n, g: o, b: l, a: c });
+    return b({ r: n, g: o, b: l, a: c });
   }
   const e = parseInt(t.slice(0, 2), 16), r = parseInt(t.slice(2, 4), 16), i = parseInt(t.slice(4, 6), 16), a = t.length === 8 ? parseInt(t.slice(6, 8), 16) / 255 : 1;
-  return h({ r: e, g: r, b: i, a });
+  return b({ r: e, g: r, b: i, a });
 }
-function Q(s) {
+function G(s) {
   const t = /^rgba?\((.+)\)$/i.exec(s.trim());
-  if (!t)
-    return null;
-  const e = F(t[1]);
-  if (!e || e.channels.length < 3)
-    return null;
-  const r = B(e.channels[0]), i = B(e.channels[1]), a = B(e.channels[2]);
-  if (r == null || i == null || a == null)
-    return null;
-  const n = e.alpha != null ? O(e.alpha) : 1;
-  return n == null ? null : h({ r, g: i, b: a, a: n });
+  if (!t) return null;
+  const e = T(t[1]);
+  if (!e || e.channels.length < 3) return null;
+  const r = P(e.channels[0]), i = P(e.channels[1]), a = P(e.channels[2]);
+  if (r == null || i == null || a == null) return null;
+  const n = e.alpha != null ? D(e.alpha) : 1;
+  return n == null ? null : b({ r, g: i, b: a, a: n });
 }
-function Z(s) {
+function X(s) {
   const t = /^hsla?\((.+)\)$/i.exec(s.trim());
-  if (!t)
-    return null;
-  const e = F(t[1]);
-  if (!e || e.channels.length < 3)
-    return null;
-  const r = j(e.channels[0]), i = H(e.channels[1]), a = H(e.channels[2]);
-  if (r == null || i == null || a == null)
-    return null;
-  const n = e.alpha != null ? O(e.alpha) : 1;
-  return n == null ? null : U({ h: r, s: i, l: a, a: n });
+  if (!t) return null;
+  const e = T(t[1]);
+  if (!e || e.channels.length < 3) return null;
+  const r = W(e.channels[0]), i = B(e.channels[1]), a = B(e.channels[2]);
+  if (r == null || i == null || a == null) return null;
+  const n = e.alpha != null ? D(e.alpha) : 1;
+  return n == null ? null : $({ h: r, s: i, l: a, a: n });
 }
-function h(s) {
+function b(s) {
   return {
-    r: P(s.r),
-    g: P(s.g),
-    b: P(s.b),
-    a: m(g(s.a, 0, 1), 4)
+    r: S(s.r),
+    g: S(s.g),
+    b: S(s.b),
+    a: _(g(s.a, 0, 1), 4)
   };
 }
 function f(s) {
   const t = (s || "").trim();
-  return t ? t.startsWith("#") ? J(t) : /^rgba?\(/i.test(t) ? Q(t) : /^hsla?\(/i.test(t) ? Z(t) : null : null;
+  return t ? t.startsWith("#") ? K(t) : /^rgba?\(/i.test(t) ? G(t) : /^hsla?\(/i.test(t) ? X(t) : null : null;
 }
-function tt(s, t = !1) {
-  const e = h(s), r = (a) => a.toString(16).padStart(2, "0"), i = `#${r(e.r)}${r(e.g)}${r(e.b)}`;
+function Y(s, t = !1) {
+  const e = b(s), r = (a) => a.toString(16).padStart(2, "0"), i = `#${r(e.r)}${r(e.g)}${r(e.b)}`;
   return t ? `${i}${r(Math.round(e.a * 255))}` : i;
 }
-function et(s, t = !0) {
-  const e = h(s);
-  return !t || e.a >= 1 ? `rgb(${e.r} ${e.g} ${e.b})` : `rgb(${e.r} ${e.g} ${e.b} / ${m(e.a, 3)})`;
+function j(s, t = !0) {
+  const e = b(s);
+  return !t || e.a >= 1 ? `rgb(${e.r} ${e.g} ${e.b})` : `rgb(${e.r} ${e.g} ${e.b} / ${_(e.a, 3)})`;
 }
-function rt(s, t = !0) {
-  const e = Math.round(w(s.h)), r = Math.round(g(s.s, 0, 100)), i = Math.round(g(s.l, 0, 100)), a = m(g(s.a, 0, 1), 3);
+function J(s, t = !0) {
+  const e = Math.round(y(s.h)), r = Math.round(g(s.s, 0, 100)), i = Math.round(g(s.l, 0, 100)), a = _(g(s.a, 0, 1), 3);
   return !t || a >= 1 ? `hsl(${e} ${r}% ${i}%)` : `hsl(${e} ${r}% ${i}% / ${a})`;
 }
-function T(s) {
-  const t = h(s), e = t.r / 255, r = t.g / 255, i = t.b / 255, a = Math.max(e, r, i), n = Math.min(e, r, i), o = a - n;
+function z(s) {
+  const t = b(s), e = t.r / 255, r = t.g / 255, i = t.b / 255, a = Math.max(e, r, i), n = Math.min(e, r, i), o = a - n;
   let l = 0;
   o !== 0 && (a === e ? l = (r - i) / o % 6 : a === r ? l = (i - e) / o + 2 : l = (e - r) / o + 4, l *= 60, l < 0 && (l += 360));
-  const c = a === 0 ? 0 : o / a * 100, b = a * 100;
+  const c = a === 0 ? 0 : o / a * 100, d = a * 100;
   return {
-    h: m(l, 3),
-    s: m(c, 3),
-    v: m(b, 3),
+    h: _(l, 3),
+    s: _(c, 3),
+    v: _(d, 3),
     a: t.a
   };
 }
-function it(s) {
-  const t = w(s.h), e = g(s.s, 0, 100) / 100, r = g(s.v, 0, 100) / 100, i = r * e, a = i * (1 - Math.abs(t / 60 % 2 - 1)), n = r - i;
+function Q(s) {
+  const t = y(s.h), e = g(s.s, 0, 100) / 100, r = g(s.v, 0, 100) / 100, i = r * e, a = i * (1 - Math.abs(t / 60 % 2 - 1)), n = r - i;
   let o = 0, l = 0, c = 0;
-  return t < 60 ? (o = i, l = a) : t < 120 ? (o = a, l = i) : t < 180 ? (l = i, c = a) : t < 240 ? (l = a, c = i) : t < 300 ? (o = a, c = i) : (o = i, c = a), h({
+  return t < 60 ? (o = i, l = a) : t < 120 ? (o = a, l = i) : t < 180 ? (l = i, c = a) : t < 240 ? (l = a, c = i) : t < 300 ? (o = a, c = i) : (o = i, c = a), b({
     r: (o + n) * 255,
     g: (l + n) * 255,
     b: (c + n) * 255,
     a: s.a
   });
 }
-function L(s) {
-  const t = h(s), e = t.r / 255, r = t.g / 255, i = t.b / 255, a = Math.max(e, r, i), n = Math.min(e, r, i), o = a - n, l = (a + n) / 2;
-  let c = 0, b = 0;
-  return o !== 0 && (b = o / (1 - Math.abs(2 * l - 1)), a === e ? c = (r - i) / o % 6 : a === r ? c = (i - e) / o + 2 : c = (e - r) / o + 4, c *= 60, c < 0 && (c += 360)), {
-    h: m(c, 3),
-    s: m(b * 100, 3),
-    l: m(l * 100, 3),
+function I(s) {
+  const t = b(s), e = t.r / 255, r = t.g / 255, i = t.b / 255, a = Math.max(e, r, i), n = Math.min(e, r, i), o = a - n, l = (a + n) / 2;
+  let c = 0, d = 0;
+  return o !== 0 && (d = o / (1 - Math.abs(2 * l - 1)), a === e ? c = (r - i) / o % 6 : a === r ? c = (i - e) / o + 2 : c = (e - r) / o + 4, c *= 60, c < 0 && (c += 360)), {
+    h: _(c, 3),
+    s: _(d * 100, 3),
+    l: _(l * 100, 3),
     a: t.a
   };
 }
-function U(s) {
-  const t = w(s.h), e = g(s.s, 0, 100) / 100, r = g(s.l, 0, 100) / 100, i = (1 - Math.abs(2 * r - 1)) * e, a = i * (1 - Math.abs(t / 60 % 2 - 1)), n = r - i / 2;
+function $(s) {
+  const t = y(s.h), e = g(s.s, 0, 100) / 100, r = g(s.l, 0, 100) / 100, i = (1 - Math.abs(2 * r - 1)) * e, a = i * (1 - Math.abs(t / 60 % 2 - 1)), n = r - i / 2;
   let o = 0, l = 0, c = 0;
-  return t < 60 ? (o = i, l = a) : t < 120 ? (o = a, l = i) : t < 180 ? (l = i, c = a) : t < 240 ? (l = a, c = i) : t < 300 ? (o = a, c = i) : (o = i, c = a), h({
+  return t < 60 ? (o = i, l = a) : t < 120 ? (o = a, l = i) : t < 180 ? (l = i, c = a) : t < 240 ? (l = a, c = i) : t < 300 ? (o = a, c = i) : (o = i, c = a), b({
     r: (o + n) * 255,
     g: (l + n) * 255,
     b: (c + n) * 255,
     a: s.a
   });
 }
-function x(s, t) {
-  return tt(s, t).toUpperCase();
+function m(s, t) {
+  return Y(s, t).toUpperCase();
 }
-function S(s, t) {
-  return et(s, t);
+function w(s, t) {
+  return j(s, t);
 }
-function at(s, t) {
-  return rt(L(s), t);
+function Z(s, t) {
+  return J(I(s), t);
 }
-const z = "#2563eb", $ = "editora:ui-color-picker:recent", nt = `
+const C = "#2563eb", L = "editora:ui-color-picker:recent", tt = `
   <svg viewBox="0 0 20 20" aria-hidden="true" focusable="false">
     <path d="m5.6 7.6 4.4 4.6 4.4-4.6" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
   </svg>
-`, q = `
+`, H = `
   :host {
     --ui-cp-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 96%, transparent);
     --ui-cp-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 74%, transparent);
@@ -855,7 +839,7 @@ const z = "#2563eb", $ = "editora:ui-color-picker:recent", nt = `
       border-color: Highlight;
     }
   }
-`, st = `
+`, et = `
   .overlay {
     position: fixed;
     inset: 0;
@@ -896,16 +880,16 @@ const z = "#2563eb", $ = "editora:ui-color-picker:recent", nt = `
 function u(s, t, e) {
   return Math.max(t, Math.min(e, s));
 }
-function M(s, t) {
+function E(s, t) {
   return Math.abs(s - t) <= 5e-4;
 }
-function A(s) {
+function k(s) {
   return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
-class ot extends V {
+class rt extends q {
   constructor() {
-    super(), this._syncing = !1, this._initialized = !1, this._rgba = h(f(z) || { r: 37, g: 99, b: 235, a: 1 }), this._hsva = T(this._rgba), this._format = "hex", this._open = !1, this._error = "", this._presets = [], this._recentColors = [], this._panelCache = /* @__PURE__ */ new WeakMap(), this._overlay = null, this._overlayRoot = null, this._releaseScrollLock = null, this._restoreFocusEl = null, this._isSheetOpen = !1, this._dragTarget = null, this._dragPointerId = -1, this._dragRect = null, this._dragX = 0, this._dragY = 0, this._dragRaf = 0, this._dragChanged = !1, this._dragSource = "drag", this._renderingSwatches = !1, this._scheduleOverlayPosition = W(() => this._positionOverlay()), this._onRootClickBound = (t) => this._onPanelClick(t, "root"), this._onRootInputBound = (t) => this._onPanelInput(t, "root"), this._onRootChangeBound = (t) => this._onPanelChange(t, "root"), this._onRootKeyDownBound = (t) => this._onPanelKeyDown(t, "root"), this._onRootPointerDownBound = (t) => this._onPanelPointerDown(t, "root"), this._onRootPointerMoveBound = (t) => this._onPanelPointerMove(t), this._onRootPointerUpBound = (t) => this._onPanelPointerUp(t), this._onRootPointerCancelBound = (t) => this._onPanelPointerCancel(t), this._onDocumentPointerDownBound = (t) => this._onDocumentPointerDown(t), this._onDocumentKeyDownBound = (t) => this._onDocumentKeyDown(t), this._onWindowResizeBound = () => this._scheduleOverlayPosition.run(), this._onWindowScrollBound = (t) => {
-      K(t, [this._overlay]) || this._scheduleOverlayPosition.run();
+    super(), this._syncing = !1, this._initialized = !1, this._rgba = b(f(C) || { r: 37, g: 99, b: 235, a: 1 }), this._hsva = z(this._rgba), this._format = "hex", this._open = !1, this._error = "", this._presets = [], this._recentColors = [], this._panelCache = /* @__PURE__ */ new WeakMap(), this._overlay = null, this._overlayRoot = null, this._releaseScrollLock = null, this._restoreFocusEl = null, this._isSheetOpen = !1, this._dragTarget = null, this._dragPointerId = -1, this._dragRect = null, this._dragX = 0, this._dragY = 0, this._dragRaf = 0, this._dragChanged = !1, this._dragSource = "drag", this._renderingSwatches = !1, this._scheduleOverlayPosition = O(() => this._positionOverlay()), this._onRootClickBound = (t) => this._onPanelClick(t, "root"), this._onRootInputBound = (t) => this._onPanelInput(t, "root"), this._onRootChangeBound = (t) => this._onPanelChange(t, "root"), this._onRootKeyDownBound = (t) => this._onPanelKeyDown(t, "root"), this._onRootPointerDownBound = (t) => this._onPanelPointerDown(t, "root"), this._onRootPointerMoveBound = (t) => this._onPanelPointerMove(t), this._onRootPointerUpBound = (t) => this._onPanelPointerUp(t), this._onRootPointerCancelBound = (t) => this._onPanelPointerCancel(t), this._onDocumentPointerDownBound = (t) => this._onDocumentPointerDown(t), this._onDocumentKeyDownBound = (t) => this._onDocumentKeyDown(t), this._onWindowResizeBound = () => this._scheduleOverlayPosition.run(), this._onWindowScrollBound = (t) => {
+      F(t, [this._overlay]) || this._scheduleOverlayPosition.run();
     }, this._applyValueAttribute(!1), this._applyFormatAttribute(), this._open = this.hasAttribute("open"), this._parsePresetsAttribute();
   }
   static get observedAttributes() {
@@ -958,7 +942,7 @@ class ot extends V {
           (this.hasAttribute("disabled") || this._isLoading()) && this._open && this._setOpen(!1, "attribute");
           break;
         case "alpha": {
-          this._alphaEnabled() || (this._rgba = h({ ...this._rgba, a: 1 }), this._hsva = { ...this._hsva, a: 1 }, this._syncValueAttribute());
+          this._alphaEnabled() || (this._rgba = b({ ...this._rgba, a: 1 }), this._hsva = { ...this._hsva, a: 1 }, this._syncValueAttribute());
           break;
         }
       }
@@ -998,9 +982,9 @@ class ot extends V {
     this._error = "", this._applyRgba(e, !1), this._syncValueAttribute(), this._updateUI(!1);
   }
   getColor() {
-    const t = h(this._rgba);
+    const t = b(this._rgba);
     return {
-      hex: x(t, this._alphaEnabled()),
+      hex: m(t, this._alphaEnabled()),
       rgba: t,
       hsva: { ...this._hsva }
     };
@@ -1024,14 +1008,13 @@ class ot extends V {
   _eventHTMLElement(t) {
     const e = typeof t.composedPath == "function" ? t.composedPath() : [];
     for (const i of e)
-      if (i instanceof HTMLElement)
-        return i;
+      if (i instanceof HTMLElement) return i;
     const r = t.target;
     return r instanceof HTMLElement ? r : null;
   }
   _buildTemplate() {
     return `
-      <style>${q}</style>
+      <style>${H}</style>
       <section class="root">
         <div class="trigger-wrap" data-role="trigger-wrap">
           <button
@@ -1044,7 +1027,7 @@ class ot extends V {
           >
             <span class="trigger-preview" data-role="trigger-preview"></span>
             <span class="trigger-value" data-role="trigger-value"></span>
-            <span class="trigger-chevron" aria-hidden="true">${nt}</span>
+            <span class="trigger-chevron" aria-hidden="true">${tt}</span>
           </button>
         </div>
         <div class="panel-inline" data-role="inline-panel" part="popover">
@@ -1094,7 +1077,7 @@ class ot extends V {
           <div class="group" data-format-group="hex">
             <div class="field">
               <span>Value</span>
-              <input class="input" data-input="hex" part="input" spellcheck="false" autocomplete="off" />
+              <input class="input" data-input="hex" part="input" spellcheck="false" autocomplete="off" aria-label="Hex color value" />
             </div>
           </div>
 
@@ -1136,19 +1119,18 @@ class ot extends V {
     `;
   }
   _renderOverlayTemplate() {
-    if (!this._overlay || !this._overlayRoot)
-      return;
+    if (!this._overlay || !this._overlayRoot) return;
     this._syncOverlayHostAttributes();
     const t = this._isMobileSheet(), e = t ? "sheet" : "popover";
     this._overlay.dataset.mode !== e && (this._overlay.dataset.mode = e, this._overlayRoot.innerHTML = `
-      <style>${q}${st}</style>
+      <style>${H}${et}</style>
       <section class="overlay">
         ${t ? '<div class="sheet-backdrop" data-action="close-popover"></div>' : ""}
         <div class="${t ? "sheet-shell" : "popover-shell"}">
           ${this._panelMarkup("overlay")}
         </div>
       </section>
-    `, t && !this._isSheetOpen && (this._isSheetOpen = !0, this._releaseScrollLock = G()), !t && this._isSheetOpen && (this._isSheetOpen = !1, this._releaseScrollLock && (this._releaseScrollLock(), this._releaseScrollLock = null)));
+    `, t && !this._isSheetOpen && (this._isSheetOpen = !0, this._releaseScrollLock = U()), !t && this._isSheetOpen && (this._isSheetOpen = !1, this._releaseScrollLock && (this._releaseScrollLock(), this._releaseScrollLock = null)));
   }
   _isPopoverMode() {
     return (this.getAttribute("mode") || "inline") === "popover";
@@ -1162,11 +1144,10 @@ class ot extends V {
     return t === "neutral" || t === "success" || t === "warning" || t === "danger" ? t : "brand";
   }
   _closeOnEscape() {
-    return I(this.getAttribute("close-on-escape"), !0);
+    return A(this.getAttribute("close-on-escape"), !0);
   }
   _syncOverlayHostAttributes() {
-    if (!this._overlay)
-      return;
+    if (!this._overlay) return;
     const t = (r) => {
       const i = this.getAttribute(r);
       i == null ? this._overlay.removeAttribute(r) : this._overlay.setAttribute(r, i);
@@ -1176,16 +1157,16 @@ class ot extends V {
     t("size"), t("variant"), t("state"), t("tone"), t("close-on-escape"), t("aria-label"), t("aria-labelledby"), t("aria-describedby"), e("disabled"), e("readonly");
   }
   _isMobileSheet() {
-    return X(this.getAttribute("mode") || "inline");
+    return N(this.getAttribute("mode") || "inline");
   }
   _alphaEnabled() {
-    return I(this.getAttribute("alpha"), !1);
+    return A(this.getAttribute("alpha"), !1);
   }
   _recentEnabled() {
-    return I(this.getAttribute("recent"), !0);
+    return A(this.getAttribute("recent"), !0);
   }
   _persistRecent() {
-    return I(this.getAttribute("persist"), !1);
+    return A(this.getAttribute("persist"), !1);
   }
   _isDisabled() {
     return this.hasAttribute("disabled");
@@ -1217,7 +1198,7 @@ class ot extends V {
   _applyValueAttribute(t) {
     const e = this.getAttribute("value");
     if (!e) {
-      this._applyRgba(f(z) || this._rgba, !1);
+      this._applyRgba(f(C) || this._rgba, !1);
       return;
     }
     const r = f(e);
@@ -1241,12 +1222,10 @@ class ot extends V {
       }
       const r = [];
       for (const i of e) {
-        if (typeof i != "string")
-          continue;
+        if (typeof i != "string") continue;
         const a = f(i);
-        if (!a)
-          continue;
-        const n = x(this._normalizeByAlpha(a), this._alphaEnabled());
+        if (!a) continue;
+        const n = m(this._normalizeByAlpha(a), this._alphaEnabled());
         r.includes(n) || r.push(n);
       }
       this._presets = r;
@@ -1261,13 +1240,11 @@ class ot extends V {
     }
     if (!(!this._persistRecent() || typeof localStorage > "u"))
       try {
-        const t = localStorage.getItem($);
-        if (!t)
-          return;
+        const t = localStorage.getItem(L);
+        if (!t) return;
         const e = JSON.parse(t);
-        if (!Array.isArray(e))
-          return;
-        this._recentColors = e.filter((r) => typeof r == "string").map((r) => f(r)).filter((r) => !!r).map((r) => x(this._normalizeByAlpha(r), this._alphaEnabled())).slice(0, this._maxRecent());
+        if (!Array.isArray(e)) return;
+        this._recentColors = e.filter((r) => typeof r == "string").map((r) => f(r)).filter((r) => !!r).map((r) => m(this._normalizeByAlpha(r), this._alphaEnabled())).slice(0, this._maxRecent());
       } catch {
         this._recentColors = [];
       }
@@ -1275,15 +1252,15 @@ class ot extends V {
   _persistRecentColors() {
     if (!(!this._persistRecent() || typeof localStorage > "u"))
       try {
-        localStorage.setItem($, JSON.stringify(this._recentColors));
+        localStorage.setItem(L, JSON.stringify(this._recentColors));
       } catch {
       }
   }
   _normalizeByAlpha(t) {
-    return this._alphaEnabled() ? h(t) : h({ ...t, a: 1 });
+    return this._alphaEnabled() ? b(t) : b({ ...t, a: 1 });
   }
   _applyRgba(t, e) {
-    const r = this._normalizeByAlpha(t), i = T(r);
+    const r = this._normalizeByAlpha(t), i = z(r);
     e && i.s === 0 && (i.h = this._hsva.h), this._rgba = r, this._hsva = {
       h: u(i.h, 0, 360),
       s: u(i.s, 0, 100),
@@ -1292,17 +1269,17 @@ class ot extends V {
     };
   }
   _serializeValue(t = this._format) {
-    return t === "rgb" ? S(this._rgba, this._alphaEnabled()) : t === "hsl" ? at(this._rgba, this._alphaEnabled()) : x(this._rgba, this._alphaEnabled());
+    return t === "rgb" ? w(this._rgba, this._alphaEnabled()) : t === "hsl" ? Z(this._rgba, this._alphaEnabled()) : m(this._rgba, this._alphaEnabled());
   }
   _currentHex() {
-    return x(this._rgba, this._alphaEnabled());
+    return m(this._rgba, this._alphaEnabled());
   }
   _eventDetail(t) {
     return {
       value: this._serializeValue(),
       hex: this._currentHex(),
       rgba: { ...this._rgba },
-      hsla: L(this._rgba),
+      hsla: I(this._rgba),
       source: t
     };
   }
@@ -1327,8 +1304,7 @@ class ot extends V {
     });
   }
   _setOpen(t, e = "api") {
-    if (!this._isPopoverMode() || t && (this._isDisabled() || this._isLoading()) || this._open === t)
-      return;
+    if (!this._isPopoverMode() || t && (this._isDisabled() || this._isLoading()) || this._open === t) return;
     const r = this._open;
     this._open = t, this._syncOpenAttribute(t);
     const i = { open: t, previousOpen: r, source: e };
@@ -1342,9 +1318,8 @@ class ot extends V {
     t && queueMicrotask(() => this._focusFirstOpenControl());
   }
   _focusFirstOpenControl() {
-    if (!this._open)
-      return;
-    const t = this._getCurrentPanel(), e = t == null ? void 0 : t.querySelector('[data-cp="sv"]');
+    if (!this._open) return;
+    const e = this._getCurrentPanel()?.querySelector('[data-cp="sv"]');
     if (e)
       try {
         e.focus();
@@ -1369,8 +1344,7 @@ class ot extends V {
     }
   }
   _ensureOverlay() {
-    if (this._overlay || typeof document > "u")
-      return;
+    if (this._overlay || typeof document > "u") return;
     const t = document.createElement("div");
     t.style.position = "fixed", t.style.inset = "0", t.style.zIndex = "var(--ui-cp-z, 1600)", t.style.pointerEvents = "auto";
     const e = t.attachShadow({ mode: "open" });
@@ -1380,15 +1354,12 @@ class ot extends V {
     this._scheduleOverlayPosition.cancel(), typeof document < "u" && (document.removeEventListener("pointerdown", this._onDocumentPointerDownBound, !0), document.removeEventListener("keydown", this._onDocumentKeyDownBound)), typeof window < "u" && (window.removeEventListener("resize", this._onWindowResizeBound), window.removeEventListener("scroll", this._onWindowScrollBound, !0)), this._overlay && this._overlay.parentElement && this._overlay.parentElement.removeChild(this._overlay), this._overlay = null, this._overlayRoot = null, this._panelCache = /* @__PURE__ */ new WeakMap(), this._isSheetOpen && (this._isSheetOpen = !1, this._releaseScrollLock && (this._releaseScrollLock(), this._releaseScrollLock = null));
   }
   _positionOverlay() {
-    if (!this._overlayRoot || !this._open || this._isMobileSheet())
-      return;
+    if (!this._overlayRoot || !this._open || this._isMobileSheet()) return;
     const t = this.root.querySelector(".trigger"), e = this._overlayRoot.querySelector(".popover-shell");
-    if (!t || !e)
-      return;
+    if (!t || !e) return;
     const r = e.querySelector(".panel");
-    if (!r)
-      return;
-    const i = e.getAttribute("data-placement"), a = Y(
+    if (!r) return;
+    const i = e.getAttribute("data-placement"), a = V(
       t.getBoundingClientRect(),
       r.getBoundingClientRect(),
       8,
@@ -1398,13 +1369,10 @@ class ot extends V {
     e.style.top = `${Math.round(a.top)}px`, e.style.left = `${Math.round(a.left)}px`, e.setAttribute("data-placement", a.placement);
   }
   _onDocumentPointerDown(t) {
-    var i;
-    if (!this._overlay || !this._open)
-      return;
+    if (!this._overlay || !this._open) return;
     const e = typeof t.composedPath == "function" ? t.composedPath() : [];
-    if (e.includes(this))
-      return;
-    const r = (i = this._overlayRoot) == null ? void 0 : i.querySelector('[data-cp-panel="overlay"]');
+    if (e.includes(this)) return;
+    const r = this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');
     r && e.includes(r) || this._setOpen(!1, "outside");
   }
   _onDocumentKeyDown(t) {
@@ -1423,10 +1391,8 @@ class ot extends V {
     return Array.from(e).filter((r) => r.hasAttribute("disabled") || r.getAttribute("aria-hidden") === "true" || r.tabIndex < 0 ? !1 : r.getClientRects().length > 0);
   }
   _trapOverlayFocus(t) {
-    var o;
-    const e = (o = this._overlayRoot) == null ? void 0 : o.querySelector('[data-cp-panel="overlay"]');
-    if (!e)
-      return;
+    const e = this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');
+    if (!e) return;
     const r = this._focusableInPanel(e);
     if (!r.length) {
       t.preventDefault(), e.focus();
@@ -1440,16 +1406,14 @@ class ot extends V {
     (n === -1 || n === r.length - 1) && (t.preventDefault(), r[0].focus());
   }
   _forEachPanel(t) {
-    var i;
     const e = this.root.querySelector('[data-cp-panel="inline"]');
     e && t(this._panelRefs(e));
-    const r = (i = this._overlayRoot) == null ? void 0 : i.querySelector('[data-cp-panel="overlay"]');
+    const r = this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');
     r && t(this._panelRefs(r));
   }
   _panelRefs(t) {
     const e = this._panelCache.get(t);
-    if (e)
-      return e;
+    if (e) return e;
     const r = {
       panel: t,
       label: t.querySelector('[data-role="label"]'),
@@ -1495,18 +1459,18 @@ class ot extends V {
     return this._isPopoverMode() && this._open && this._overlayRoot ? this._overlayRoot.querySelector('[data-cp-panel="overlay"]') : this.root.querySelector('[data-cp-panel="inline"]');
   }
   _updateUI(t, e = !1) {
-    const r = this.root.querySelector('[data-role="trigger-wrap"]'), i = this.root.querySelector(".trigger"), a = this.root.querySelector('[data-role="trigger-value"]'), n = this.root.querySelector('[data-role="trigger-preview"]'), o = this.root.querySelector('[data-role="inline-panel"]'), l = this._isPopoverMode(), c = this._state(), b = this._tone(), v = c === "loading", d = this._isDisabled(), _ = this._isReadonly(), E = this._serializeValue() || this._placeholder();
-    r && (r.hidden = !l), i && (i.disabled = d || v, i.dataset.state = c, i.dataset.tone = b, i.setAttribute("aria-expanded", l && this._open ? "true" : "false"), this._applyAria(i)), a && (a.textContent = E), n && (n.style.background = S(this._rgba, !0)), o && (o.hidden = l), this._forEachPanel((p) => this._updatePanel(p, { skipSwatches: t, disabled: d, readonly: _, loading: v, state: c, tone: b, modePopover: l, liveOnly: e }));
+    const r = this.root.querySelector('[data-role="trigger-wrap"]'), i = this.root.querySelector(".trigger"), a = this.root.querySelector('[data-role="trigger-value"]'), n = this.root.querySelector('[data-role="trigger-preview"]'), o = this.root.querySelector('[data-role="inline-panel"]'), l = this._isPopoverMode(), c = this._state(), d = this._tone(), v = c === "loading", h = this._isDisabled(), x = this._isReadonly(), M = this._serializeValue() || this._placeholder();
+    r && (r.hidden = !l), i && (i.disabled = h || v, i.dataset.state = c, i.dataset.tone = d, i.setAttribute("aria-expanded", l && this._open ? "true" : "false"), this._applyAria(i)), a && (a.textContent = M), n && (n.style.background = w(this._rgba, !0)), o && (o.hidden = l), this._forEachPanel((p) => this._updatePanel(p, { skipSwatches: t, disabled: h, readonly: x, loading: v, state: c, tone: d, modePopover: l, liveOnly: e }));
   }
   _updatePanel(t, e) {
-    const r = this._rgba, i = L(r), a = this._hsva, n = `hsl(${Math.round(a.h)} 100% 50%)`, o = t.panel.getAttribute("data-cp-panel") === "overlay", l = !!this._error || e.state === "error", c = e.disabled || e.readonly || e.loading;
-    if (this._applyAria(t.panel), t.panel.dataset.state = l ? "error" : e.state, t.panel.dataset.tone = e.tone, t.panel.setAttribute("aria-busy", e.loading ? "true" : "false"), o && e.modePopover ? (t.panel.setAttribute("role", "dialog"), t.panel.setAttribute("aria-modal", "true"), t.panel.tabIndex = -1) : (t.panel.removeAttribute("role"), t.panel.removeAttribute("aria-modal"), t.panel.removeAttribute("tabindex")), t.label && (t.label.textContent = this._labelText()), t.valueText && (t.valueText.textContent = this._serializeValue()), t.preview && (t.preview.style.background = S(r, !0)), t.status) {
+    const r = this._rgba, i = I(r), a = this._hsva, n = `hsl(${Math.round(a.h)} 100% 50%)`, o = t.panel.getAttribute("data-cp-panel") === "overlay", l = !!this._error || e.state === "error", c = e.disabled || e.readonly || e.loading;
+    if (this._applyAria(t.panel), t.panel.dataset.state = l ? "error" : e.state, t.panel.dataset.tone = e.tone, t.panel.setAttribute("aria-busy", e.loading ? "true" : "false"), o && e.modePopover ? (t.panel.setAttribute("role", "dialog"), t.panel.setAttribute("aria-modal", "true"), t.panel.tabIndex = -1) : (t.panel.removeAttribute("role"), t.panel.removeAttribute("aria-modal"), t.panel.removeAttribute("tabindex")), t.label && (t.label.textContent = this._labelText()), t.valueText && (t.valueText.textContent = this._serializeValue()), t.preview && (t.preview.style.background = w(r, !0)), t.status) {
       let p = "";
       l ? p = "Error" : e.state === "loading" ? p = "Syncing" : e.state === "success" && (p = "Saved"), t.status.hidden = !p, t.status.textContent = p, t.status.dataset.tone = e.tone;
     }
     if (t.sv && (t.sv.style.background = `linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, ${n})`, t.sv.setAttribute("aria-valuetext", `Saturation ${Math.round(a.s)}%, Value ${Math.round(a.v)}%`), t.sv.setAttribute("aria-disabled", c ? "true" : "false"), t.sv.tabIndex = c ? -1 : 0), t.svThumb) {
-      const p = u(a.s, 1, 99), k = u(100 - a.v, 1, 99);
-      t.svThumb.style.left = `${p}%`, t.svThumb.style.top = `${k}%`;
+      const p = u(a.s, 1, 99), R = u(100 - a.v, 1, 99);
+      t.svThumb.style.left = `${p}%`, t.svThumb.style.top = `${R}%`;
     }
     t.hue && (t.hue.setAttribute("aria-valuemin", "0"), t.hue.setAttribute("aria-valuemax", "360"), t.hue.setAttribute("aria-valuenow", String(Math.round(a.h))), t.hue.setAttribute("aria-disabled", c ? "true" : "false"), t.hue.tabIndex = c ? -1 : 0), t.hueThumb && (t.hueThumb.style.left = `${u(a.h / 360 * 100, 1, 99)}%`), t.alphaRow && (t.alphaRow.hidden = !this._alphaEnabled()), t.alpha && (t.alpha.setAttribute("aria-valuemin", "0"), t.alpha.setAttribute("aria-valuemax", "100"), t.alpha.setAttribute("aria-valuenow", String(Math.round(a.a * 100))), t.alpha.setAttribute("aria-disabled", c || !this._alphaEnabled() ? "true" : "false"), t.alpha.tabIndex = c ? -1 : 0, t.alpha.style.backgroundImage = `
         linear-gradient(45deg, var(--ui-cp-checker-a) 25%, transparent 25%),
@@ -1515,21 +1479,20 @@ class ot extends V {
         linear-gradient(-45deg, transparent 75%, var(--ui-cp-checker-a) 75%),
         linear-gradient(to right, rgba(${r.r}, ${r.g}, ${r.b}, 0), rgba(${r.r}, ${r.g}, ${r.b}, 1))
       `), t.alphaThumb && (t.alphaThumb.style.left = `${u(a.a * 100, 1, 99)}%`);
-    const b = t.panel.getRootNode(), v = b instanceof ShadowRoot ? b.activeElement : t.panel.ownerDocument.activeElement, d = v && t.panel.contains(v) ? v.getAttribute("data-input") : null;
-    if (t.inputHex && d !== "hex" && (t.inputHex.value = x(r, this._alphaEnabled())), t.inputR && d !== "r" && (t.inputR.value = String(r.r)), t.inputG && d !== "g" && (t.inputG.value = String(r.g)), t.inputB && d !== "b" && (t.inputB.value = String(r.b)), t.inputA1 && d !== "a1" && (t.inputA1.value = this._alphaEnabled() ? String(Number(r.a.toFixed(3))) : "1"), t.inputH && d !== "h" && (t.inputH.value = String(Math.round(i.h))), t.inputS && d !== "s" && (t.inputS.value = String(Math.round(i.s))), t.inputL && d !== "l" && (t.inputL.value = String(Math.round(i.l))), t.inputA2 && d !== "a2" && (t.inputA2.value = this._alphaEnabled() ? String(Number(r.a.toFixed(3))) : "1"), e.liveOnly)
-      return;
+    const d = t.panel.getRootNode(), v = d instanceof ShadowRoot ? d.activeElement : t.panel.ownerDocument.activeElement, h = v && t.panel.contains(v) ? v.getAttribute("data-input") : null;
+    if (t.inputHex && h !== "hex" && (t.inputHex.value = m(r, this._alphaEnabled())), t.inputR && h !== "r" && (t.inputR.value = String(r.r)), t.inputG && h !== "g" && (t.inputG.value = String(r.g)), t.inputB && h !== "b" && (t.inputB.value = String(r.b)), t.inputA1 && h !== "a1" && (t.inputA1.value = this._alphaEnabled() ? String(Number(r.a.toFixed(3))) : "1"), t.inputH && h !== "h" && (t.inputH.value = String(Math.round(i.h))), t.inputS && h !== "s" && (t.inputS.value = String(Math.round(i.s))), t.inputL && h !== "l" && (t.inputL.value = String(Math.round(i.l))), t.inputA2 && h !== "a2" && (t.inputA2.value = this._alphaEnabled() ? String(Number(r.a.toFixed(3))) : "1"), e.liveOnly) return;
     if (t.tabHex && (t.tabHex.dataset.active = String(this._format === "hex")), t.tabRgb && (t.tabRgb.dataset.active = String(this._format === "rgb")), t.tabHsl && (t.tabHsl.dataset.active = String(this._format === "hsl")), t.groupHex && (t.groupHex.hidden = this._format !== "hex"), t.groupRgb && (t.groupRgb.hidden = this._format !== "rgb"), t.groupHsl && (t.groupHsl.hidden = this._format !== "hsl"), t.inputA1 && (t.inputA1.disabled = !this._alphaEnabled() || c), t.inputA2 && (t.inputA2.disabled = !this._alphaEnabled() || c), t.error) {
       const p = this._error || (e.state === "error" ? "Unable to validate current color value." : "");
       t.error.hidden = !p, t.error.textContent = p;
     }
-    const _ = c;
+    const x = c;
     if (t.copyHex && (t.copyHex.disabled = e.disabled || e.loading), t.copyRgb && (t.copyRgb.disabled = e.disabled || e.loading), t.eyedropper) {
       const p = typeof window < "u" && typeof window.EyeDropper == "function";
-      t.eyedropper.hidden = !p, t.eyedropper.disabled = _ || !p;
+      t.eyedropper.hidden = !p, t.eyedropper.disabled = x || !p;
     }
-    if (t.clear && (t.clear.disabled = _), t.apply && (t.apply.hidden = !e.modePopover, t.apply.disabled = _), t.panel.querySelectorAll(".input").forEach((p) => {
-      const k = p;
-      k.disabled = _;
+    if (t.clear && (t.clear.disabled = x), t.apply && (t.apply.hidden = !e.modePopover, t.apply.disabled = x), t.panel.querySelectorAll(".input").forEach((p) => {
+      const R = p;
+      R.disabled = x;
     }), !e.skipSwatches && !this._renderingSwatches) {
       this._renderingSwatches = !0;
       try {
@@ -1543,41 +1506,35 @@ class ot extends V {
     const e = this._currentHex().toLowerCase();
     t.presets && (t.presets.innerHTML = this._presets.map((r) => {
       const i = f(r);
-      if (!i)
-        return "";
-      const a = x(this._normalizeByAlpha(i), this._alphaEnabled()), n = a.toLowerCase() === e ? ' data-selected="true"' : "";
-      return `<button type="button" class="swatch" part="swatch" data-action="preset" data-color="${A(a)}"${n} title="${A(a)}" style="background:${A(S(i, !0))}"></button>`;
+      if (!i) return "";
+      const a = m(this._normalizeByAlpha(i), this._alphaEnabled()), n = a.toLowerCase() === e ? ' data-selected="true"' : "";
+      return `<button type="button" class="swatch" part="swatch" data-action="preset" data-color="${k(a)}"${n} title="${k(a)}" style="background:${k(w(i, !0))}"></button>`;
     }).join("")), t.recentTitle && (t.recentTitle.hidden = !this._recentEnabled() || this._recentColors.length === 0), t.recent && (t.recent.hidden = !this._recentEnabled() || this._recentColors.length === 0, t.recent.innerHTML = this._recentColors.map((r) => {
       const i = f(r);
-      if (!i)
-        return "";
-      const a = x(this._normalizeByAlpha(i), this._alphaEnabled()), n = a.toLowerCase() === e ? ' data-selected="true"' : "";
-      return `<button type="button" class="swatch" part="swatch recent" data-action="recent" data-color="${A(a)}"${n} title="${A(a)}" style="background:${A(S(i, !0))}"></button>`;
+      if (!i) return "";
+      const a = m(this._normalizeByAlpha(i), this._alphaEnabled()), n = a.toLowerCase() === e ? ' data-selected="true"' : "";
+      return `<button type="button" class="swatch" part="swatch recent" data-action="recent" data-color="${k(a)}"${n} title="${k(a)}" style="background:${k(w(i, !0))}"></button>`;
     }).join(""));
   }
   _onPanelClick(t, e) {
     const r = this._eventHTMLElement(t);
-    if (!r)
-      return;
+    if (!r) return;
     const i = r.closest("[data-action]");
-    if (!i || this._isDisabled())
-      return;
+    if (!i || this._isDisabled()) return;
     const a = i.getAttribute("data-action");
     if (a === "close-popover") {
       this._setOpen(!1, "outside");
       return;
     }
     if (a === "toggle-popover") {
-      if (!this._isPopoverMode())
-        return;
+      if (!this._isPopoverMode()) return;
       this._setOpen(!this._open, "toggle");
       return;
     }
     if (!this._isLoading()) {
       if (a === "format") {
         const n = i.getAttribute("data-format");
-        if (!n)
-          return;
+        if (!n) return;
         this.setAttribute("format", n), this._error = "", this._updateUI(!1);
         return;
       }
@@ -1586,7 +1543,7 @@ class ot extends V {
         return;
       }
       if (a === "copy-rgb") {
-        this._copyToClipboard(S(this._rgba, this._alphaEnabled()));
+        this._copyToClipboard(w(this._rgba, this._alphaEnabled()));
         return;
       }
       if (a === "eyedropper") {
@@ -1594,9 +1551,8 @@ class ot extends V {
         return;
       }
       if (a === "clear") {
-        if (this._isReadonly())
-          return;
-        const n = f(z);
+        if (this._isReadonly()) return;
+        const n = f(C);
         n && (this._applyRgba(n, !1), this._error = "", this._syncValueAttribute(), this._emitInput("text"), this._emitChange("text"), this._pushRecent(this._currentHex()), this._updateUI(!1));
         return;
       }
@@ -1605,11 +1561,9 @@ class ot extends V {
         return;
       }
       if (a === "preset" || a === "recent") {
-        if (this._isReadonly())
-          return;
+        if (this._isReadonly()) return;
         const n = i.getAttribute("data-color") || "", o = f(n);
-        if (!o)
-          return;
+        if (!o) return;
         const l = a === "preset" ? "preset" : "recent";
         this._applyRgba(o, !0), this._error = "", this._syncValueAttribute(), this._emitInput(l), this._emitChange(l), this._pushRecent(this._currentHex()), this._updateUI(!1);
         return;
@@ -1618,8 +1572,7 @@ class ot extends V {
   }
   _onPanelInput(t, e) {
     const r = this._eventHTMLElement(t);
-    if (!(r instanceof HTMLInputElement) || !r.hasAttribute("data-input") || (t.stopPropagation(), this._isDisabled() || this._isReadonly() || this._isLoading()))
-      return;
+    if (!(r instanceof HTMLInputElement) || !r.hasAttribute("data-input") || (t.stopPropagation(), this._isDisabled() || this._isReadonly() || this._isLoading())) return;
     const i = this._parseInputsFromPanel(r.closest("[data-cp-panel]"));
     if (!i) {
       this._error = "";
@@ -1629,8 +1582,7 @@ class ot extends V {
   }
   _onPanelChange(t, e) {
     const r = this._eventHTMLElement(t);
-    if (!(r instanceof HTMLInputElement) || !r.hasAttribute("data-input") || (t.stopPropagation(), this._isDisabled() || this._isReadonly() || this._isLoading()))
-      return;
+    if (!(r instanceof HTMLInputElement) || !r.hasAttribute("data-input") || (t.stopPropagation(), this._isDisabled() || this._isReadonly() || this._isLoading())) return;
     const i = r.closest("[data-cp-panel]"), a = this._parseInputsFromPanel(i);
     if (!a) {
       const n = r.value || "";
@@ -1641,8 +1593,7 @@ class ot extends V {
   }
   _onPanelKeyDown(t, e) {
     const r = this._eventHTMLElement(t);
-    if (!r || this._isDisabled() || this._isLoading())
-      return;
+    if (!r || this._isDisabled() || this._isLoading()) return;
     if (r instanceof HTMLInputElement && r.hasAttribute("data-input") && t.key === "Enter") {
       t.preventDefault();
       const l = this._parseInputsFromPanel(r.closest("[data-cp-panel]"));
@@ -1654,8 +1605,7 @@ class ot extends V {
       return;
     }
     const i = r.getAttribute("data-cp");
-    if (!i || this._isReadonly() || this._isLoading())
-      return;
+    if (!i || this._isReadonly() || this._isLoading()) return;
     const a = t.shiftKey ? 5 : 1;
     let n = !1;
     const o = { ...this._hsva };
@@ -1676,39 +1626,32 @@ class ot extends V {
     this._setHsva(t), this._syncValueAttribute(), this._emitInput(e), this._emitChange(e), this._pushRecent(this._currentHex()), this._updateUI(!1);
   }
   _parseInputsFromPanel(t) {
-    var l, c, b, v, d, _, E, p, k;
-    if (!t)
-      return null;
+    if (!t) return null;
     const e = this._panelRefs(t);
     if (this._format === "hex") {
-      const y = ((l = e.inputHex) == null ? void 0 : l.value) || "", C = y.trim().startsWith("#") ? y.trim() : `#${y.trim()}`, R = f(C);
-      return R ? this._normalizeByAlpha(R) : null;
+      const l = e.inputHex?.value || "", c = l.trim().startsWith("#") ? l.trim() : `#${l.trim()}`, d = f(c);
+      return d ? this._normalizeByAlpha(d) : null;
     }
     if (this._format === "rgb") {
-      const y = Number(((c = e.inputR) == null ? void 0 : c.value) ?? ""), C = Number(((b = e.inputG) == null ? void 0 : b.value) ?? ""), R = Number(((v = e.inputB) == null ? void 0 : v.value) ?? ""), D = this._alphaEnabled() ? Number(((d = e.inputA1) == null ? void 0 : d.value) ?? "") : 1;
-      return [y, C, R, D].every((N) => Number.isFinite(N)) ? this._normalizeByAlpha({ r: y, g: C, b: R, a: D }) : null;
+      const l = Number(e.inputR?.value ?? ""), c = Number(e.inputG?.value ?? ""), d = Number(e.inputB?.value ?? ""), v = this._alphaEnabled() ? Number(e.inputA1?.value ?? "") : 1;
+      return [l, c, d, v].every((h) => Number.isFinite(h)) ? this._normalizeByAlpha({ r: l, g: c, b: d, a: v }) : null;
     }
-    const r = Number(((_ = e.inputH) == null ? void 0 : _.value) ?? ""), i = Number(((E = e.inputS) == null ? void 0 : E.value) ?? ""), a = Number(((p = e.inputL) == null ? void 0 : p.value) ?? ""), n = this._alphaEnabled() ? Number(((k = e.inputA2) == null ? void 0 : k.value) ?? "") : 1;
-    if (![r, i, a, n].every((y) => Number.isFinite(y)))
-      return null;
+    const r = Number(e.inputH?.value ?? ""), i = Number(e.inputS?.value ?? ""), a = Number(e.inputL?.value ?? ""), n = this._alphaEnabled() ? Number(e.inputA2?.value ?? "") : 1;
+    if (![r, i, a, n].every((l) => Number.isFinite(l))) return null;
     const o = {
       h: u(r, 0, 360),
       s: u(i, 0, 100),
       l: u(a, 0, 100),
       a: u(n, 0, 1)
     };
-    return this._normalizeByAlpha(U(o));
+    return this._normalizeByAlpha($(o));
   }
   _onPanelPointerDown(t, e) {
-    var n;
-    if (this._isDisabled() || this._isReadonly() || this._isLoading())
-      return;
+    if (this._isDisabled() || this._isReadonly() || this._isLoading()) return;
     const r = this._eventHTMLElement(t);
-    if (!r)
-      return;
-    const i = (n = r.closest("[data-cp]")) == null ? void 0 : n.getAttribute("data-cp");
-    if (!i || i === "alpha" && !this._alphaEnabled())
-      return;
+    if (!r) return;
+    const i = r.closest("[data-cp]")?.getAttribute("data-cp");
+    if (!i || i === "alpha" && !this._alphaEnabled()) return;
     const a = r.closest(`[data-cp="${i}"]`);
     if (a) {
       t.preventDefault(), this._dragTarget = i, this._dragPointerId = t.pointerId, this._dragRect = a.getBoundingClientRect(), this._dragX = t.clientX, this._dragY = t.clientY, this._dragChanged = !1, this._dragSource = i === "sv" ? "drag" : "slider";
@@ -1734,8 +1677,7 @@ class ot extends V {
     this._dragRaf && (cancelAnimationFrame(this._dragRaf), this._dragRaf = 0);
   }
   _applyDragPointer(t) {
-    if (!this._dragTarget || !this._dragRect)
-      return;
+    if (!this._dragTarget || !this._dragRect) return;
     const e = this._dragRect, r = u(this._dragX - e.left, 0, e.width || 1), i = u(this._dragY - e.top, 0, e.height || 1), a = { ...this._hsva };
     this._dragTarget === "sv" ? (a.s = u(r / Math.max(e.width, 1) * 100, 0, 100), a.v = u(100 - i / Math.max(e.height, 1) * 100, 0, 100)) : this._dragTarget === "hue" ? a.h = u(r / Math.max(e.width, 1) * 360, 0, 360) : this._dragTarget === "alpha" && (a.a = u(r / Math.max(e.width, 1), 0, 1)), this._setHsva(a) && (this._dragChanged = !0, t && this._emitInput(this._dragSource), this._updateUI(!0, !0));
   }
@@ -1746,7 +1688,7 @@ class ot extends V {
       v: u(t.v, 0, 100),
       a: this._alphaEnabled() ? u(t.a, 0, 1) : 1
     }, r = this._hsva;
-    return M(r.h, e.h) && M(r.s, e.s) && M(r.v, e.v) && M(r.a, e.a) ? !1 : (this._hsva = e, this._rgba = this._normalizeByAlpha(it(this._hsva)), this._error = "", !0);
+    return E(r.h, e.h) && E(r.s, e.s) && E(r.v, e.v) && E(r.a, e.a) ? !1 : (this._hsva = e, this._rgba = this._normalizeByAlpha(Q(this._hsva)), this._error = "", !0);
   }
   _stopDrag(t) {
     this._cancelDragFrame();
@@ -1754,8 +1696,7 @@ class ot extends V {
     this._dragTarget = null, this._dragPointerId = -1, this._dragRect = null, this._dragChanged = !1, e && (this._syncValueAttribute(), this._emitChange(this._dragSource), this._pushRecent(this._currentHex()), this._updateUI(!1));
   }
   _pushRecent(t) {
-    if (!this._recentEnabled())
-      return;
+    if (!this._recentEnabled()) return;
     const e = (t || "").trim().toUpperCase();
     e && (this._recentColors = [e, ...this._recentColors.filter((r) => r.toUpperCase() !== e)].slice(
       0,
@@ -1763,38 +1704,34 @@ class ot extends V {
     ), this._persistRecentColors());
   }
   async _openEyeDropper() {
-    if (this._isDisabled() || this._isReadonly() || this._isLoading() || typeof window > "u")
-      return;
+    if (this._isDisabled() || this._isReadonly() || this._isLoading() || typeof window > "u") return;
     const t = window.EyeDropper;
     if (typeof t == "function")
       try {
-        const r = await new t().open(), i = f((r == null ? void 0 : r.sRGBHex) || "");
-        if (!i)
-          return;
+        const r = await new t().open(), i = f(r?.sRGBHex || "");
+        if (!i) return;
         this._applyRgba(i, !0), this._error = "", this._syncValueAttribute(), this._emitInput("eyedropper"), this._emitChange("eyedropper"), this._pushRecent(this._currentHex()), this._updateUI(!1);
       } catch {
       }
   }
   async _copyToClipboard(t) {
-    var a;
-    if (!t || this._isDisabled())
-      return;
+    if (!t || this._isDisabled()) return;
     let e = !1;
-    if (typeof navigator < "u" && ((a = navigator.clipboard) != null && a.writeText))
+    if (typeof navigator < "u" && navigator.clipboard?.writeText)
       try {
         await navigator.clipboard.writeText(t), e = !0;
       } catch {
         e = !1;
       }
     if (!e && typeof document < "u") {
-      const n = document.createElement("textarea");
-      n.value = t, n.setAttribute("readonly", ""), n.style.position = "fixed", n.style.opacity = "0", document.body.appendChild(n), n.select();
+      const a = document.createElement("textarea");
+      a.value = t, a.setAttribute("readonly", ""), a.style.position = "fixed", a.style.opacity = "0", document.body.appendChild(a), a.select();
       try {
         e = document.execCommand("copy");
       } catch {
         e = !1;
       } finally {
-        n.parentElement && n.parentElement.removeChild(n);
+        a.parentElement && a.parentElement.removeChild(a);
       }
     }
     const r = e ? `Copied ${t}` : `Unable to copy ${t}`, i = typeof window < "u" ? window.showToast : null;
@@ -1812,7 +1749,7 @@ class ot extends V {
     e ? t.setAttribute("aria-labelledby", e) : t.removeAttribute("aria-labelledby"), r ? t.setAttribute("aria-describedby", r) : t.removeAttribute("aria-describedby"), i ? t.setAttribute("aria-label", i) : e || t.setAttribute("aria-label", "Color picker");
   }
 }
-customElements.get("ui-color-picker") || customElements.define("ui-color-picker", ot);
+customElements.get("ui-color-picker") || customElements.define("ui-color-picker", rt);
 export {
-  ot as UIColorPicker
+  rt as UIColorPicker
 };