npm - wox-gui - Versions diffs - 0.1.8 → 0.1.9 - Mend

wox-gui 0.1.8 → 0.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/dist/wox-gui.cdn.js CHANGED Viewed

@@ -1,11 +1,11 @@
-var yt = Object.defineProperty;
-var kt = (p, c, t) => c in p ? yt(p, c, { enumerable: !0, configurable: !0, writable: !0, value: t }) : p[c] = t;
-var s = (p, c, t) => kt(p, typeof c != "symbol" ? c + "" : c, t);
-const T = class T extends HTMLElement {
+var $t = Object.defineProperty;
+var Et = (p, c, t) => c in p ? $t(p, c, { enumerable: !0, configurable: !0, writable: !0, value: t }) : p[c] = t;
+var s = (p, c, t) => Et(p, typeof c != "symbol" ? c + "" : c, t);
+const P = class P extends HTMLElement {
   constructor() {
     super();
     s(this, "render", (t, e) => {
-      this.shadowRoot.innerHTML = `<style>${T.BASE_STYLES}${t}</style>${e}`;
+      this.shadowRoot.innerHTML = `<style>${P.BASE_STYLES}${t}</style>${e}`;
     });
     s(this, "emit", (t, e) => {
       this.dispatchEvent(new CustomEvent(t, { detail: e, bubbles: !0, composed: !0 }));
@@ -15,13 +15,13 @@ const T = class T extends HTMLElement {
     this.attachShadow({ mode: "open" });
   }
 };
-s(T, "BASE_STYLES", `
+s(P, "BASE_STYLES", `
     *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
     :host { display: inline-block; font-family: var(--wox-font, 'Inter', sans-serif); color: var(--wox-text-primary, #eee); font-size: var(--wox-font-size-base, 12px); }
     :host([hidden]) { display: none !important; }
 `);
-let w = T;
-const M = `
+let w = P;
+const D = `
     /* glow: neon glow effect using --wox-fx-color */
     .glow {
         border-color: var(--wox-fx-color);
@@ -49,7 +49,7 @@ const M = `
         to   { opacity: 0.4; }
     }
 `;
-class H extends w {
+class G extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -60,7 +60,7 @@ class H extends w {
     ::slotted(svg) { width: var(--size, 18px); height: var(--size, 18px); }
     slot { display: inline-flex; align-items: center; justify-content: center; }
     .fx-wrap { display: inline-flex; align-items: center; justify-content: center; border-radius: var(--wox-radius-sm, 3px); padding: 4px; }
- ${M} :host { --size: ${e}px; }`, a);
+ ${D} :host { --size: ${e}px; }`, a);
     });
   }
   connectedCallback() {
@@ -70,8 +70,8 @@ class H extends w {
     this.isConnected && this._render();
   }
 }
-s(H, "observedAttributes", ["name", "size", "color", "glow", "pulse"]);
-class j extends w {
+s(G, "observedAttributes", ["name", "size", "color", "glow", "pulse"]);
+class Y extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -92,8 +92,8 @@ class j extends w {
     this.isConnected && this._render();
   }
 }
-s(j, "observedAttributes", ["direction", "spacing"]);
-class G extends w {
+s(Y, "observedAttributes", ["direction", "spacing"]);
+class X extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -115,17 +115,17 @@ class G extends w {
     this.isConnected && this._render();
   }
 }
-s(G, "observedAttributes", ["variant", "text", "color"]);
-class Y extends w {
+s(X, "observedAttributes", ["variant", "text", "color"]);
+class q extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
-      const t = this.getAttribute("variant") || "icon", e = this.getAttribute("icon") || "", n = this.getAttribute("label") || "", o = this.hasAttribute("active"), i = this.hasAttribute("disabled"), r = this.getAttribute("dash") || "solid", a = this.getAttribute("color") || "", l = this.hasAttribute("glow"), x = this.hasAttribute("pulse"), d = this.getAttribute("border-color") || "", u = this.getAttribute("border-style") || "", h = this.getAttribute("icon-color") || "", v = this.getAttribute("text-color") || "", b = [`v-${t}`, o ? "active" : "", l ? "glow" : "", x ? "pulse" : ""].filter(Boolean).join(" ");
-      let g = "";
-      t === "icon" ? g = e ? `<span class="material-icons">${e}</span>` : "<slot></slot>" : t === "text" ? g = (e ? `<span class="material-icons" style="font-size:14px">${e}</span>` : "") + (n || "<slot></slot>") : t === "tile" ? g = (e ? `<span class="material-icons">${e}</span>` : '<slot name="icon"></slot>') + `<span>${n}</span>` : t === "dash" && (g = `<div class="dash-line${r === "solid" ? "" : ` ${r}`}"></div>`);
-      const f = [];
-      a && f.push(`--wox-fx-color:${a}`), d && f.push(`--wox-btn-border:${d}`), u && f.push(`--wox-btn-border-style:${u}`), h && f.push(`--wox-btn-icon:${h}`), v && f.push(`--wox-btn-text:${v}`);
-      const k = a ? " data-color" : "", E = f.length ? ` style="${f.join(";")}"` : "";
+      const t = this.getAttribute("variant") || "icon", e = this.getAttribute("icon") || "", n = this.getAttribute("label") || "", o = this.hasAttribute("active"), i = this.hasAttribute("disabled"), r = this.getAttribute("dash") || "solid", a = this.getAttribute("color") || "", d = this.hasAttribute("glow"), h = this.hasAttribute("pulse"), l = this.getAttribute("border-color") || "", g = this.getAttribute("border-style") || "", x = this.getAttribute("icon-color") || "", f = this.getAttribute("text-color") || "", b = [`v-${t}`, o ? "active" : "", d ? "glow" : "", h ? "pulse" : ""].filter(Boolean).join(" ");
+      let u = "";
+      t === "icon" ? u = e ? `<span class="material-icons">${e}</span>` : "<slot></slot>" : t === "text" ? u = (e ? `<span class="material-icons" style="font-size:14px">${e}</span>` : "") + (n || "<slot></slot>") : t === "tile" ? u = (e ? `<span class="material-icons">${e}</span>` : '<slot name="icon"></slot>') + `<span>${n}</span>` : t === "dash" && (u = `<div class="dash-line${r === "solid" ? "" : ` ${r}`}"></div>`);
+      const v = [];
+      a && v.push(`--wox-fx-color:${a}`), l && v.push(`--wox-btn-border:${l}`), g && v.push(`--wox-btn-border-style:${g}`), x && v.push(`--wox-btn-icon:${x}`), f && v.push(`--wox-btn-text:${f}`);
+      const k = a ? " data-color" : "", A = v.length ? ` style="${v.join(";")}"` : "";
       this.render(`
     :host { display: inline-block; }
     button {
@@ -192,7 +192,7 @@ class Y extends w {
     button.v-dash.active .dash-line.zigzag { color: var(--wox-btn-text, var(--wox-accent, #00e5ff)); }
     .material-icons { font-family: 'Material Icons'; font-weight: normal; font-style: normal; display: inline-block; line-height: 1; text-transform: none; letter-spacing: normal; word-wrap: normal; white-space: nowrap; direction: ltr; -webkit-font-smoothing: antialiased; }
-` + M, `<button class="${b}"${k}${E} ${i ? "disabled" : ""}>${g}</button>`), this.$("button").addEventListener("click", (z) => {
+` + D, `<button class="${b}"${k}${A} ${i ? "disabled" : ""}>${u}</button>`), this.$("button").addEventListener("click", (z) => {
         i || this.emit("wox-click", { originalEvent: z });
       });
     });
@@ -204,12 +204,13 @@ class Y extends w {
     this.isConnected && this._render();
   }
 }
-s(Y, "observedAttributes", ["variant", "icon", "label", "active", "disabled", "color", "size", "dash", "glow", "pulse", "border-color", "border-style", "icon-color", "text-color"]);
-class X extends w {
+s(q, "observedAttributes", ["variant", "icon", "label", "active", "disabled", "color", "size", "dash", "glow", "pulse", "border-color", "border-style", "icon-color", "text-color"]);
+const Ct = ["text", "number", "password", "email", "url", "tel", "search", "color", "date", "time", "datetime-local", "range"], At = ["number", "range"];
+class J extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
-      const t = this.getAttribute("type") || "text", e = this.getAttribute("value") || "", n = this.getAttribute("unit") || "", o = this.getAttribute("label") || "", i = this.getAttribute("min"), r = this.getAttribute("max"), a = this.getAttribute("step"), l = this.getAttribute("placeholder") || "", x = this.hasAttribute("disabled"), d = t === "number", u = d ? `${i !== null ? ` min="${i}"` : ""}${r !== null ? ` max="${r}"` : ""}${a !== null ? ` step="${a}"` : ""}` : "";
+      const t = this.getAttribute("type") || "text", e = Ct.includes(t) ? t : "text", n = this.getAttribute("value") || "", o = this.getAttribute("unit") || "", i = this.getAttribute("label") || "", r = this.getAttribute("min"), a = this.getAttribute("max"), d = this.getAttribute("step"), h = this.getAttribute("placeholder") || "", l = this.hasAttribute("disabled"), g = At.includes(e), x = e === "number", f = g ? `${r !== null ? ` min="${r}"` : ""}${a !== null ? ` max="${a}"` : ""}${d !== null ? ` step="${d}"` : ""}` : "", b = o && e !== "color" && e !== "range";
       this.render(`
     :host { display: inline-block; }
     .wrapper { display: flex; flex-direction: column; gap: 3px; }
@@ -232,36 +233,53 @@ class X extends w {
     input:disabled { opacity: 0.4; cursor: not-allowed; }
     input.has-unit { padding-right: 28px; }
     .suffix { position: absolute; right: 8px; font-size: var(--wox-font-size-sm, 10px); color: var(--wox-text-secondary, #999); pointer-events: none; }
+    input[type="color"] {
+        padding: 2px; height: 32px; cursor: pointer;
+        border-radius: var(--wox-radius-md, 6px);
+    }
+    input[type="color"]::-webkit-color-swatch-wrapper { padding: 2px; }
+    input[type="color"]::-webkit-color-swatch { border: none; border-radius: 3px; }
+    input[type="color"]::-moz-color-swatch { border: none; border-radius: 3px; }
+    input[type="date"], input[type="time"], input[type="datetime-local"] {
+        color-scheme: dark;
+    }
+    input[type="search"]::-webkit-search-cancel-button { filter: invert(0.7); }
+    input[type="range"] {
+        padding: 0; background: transparent; border: none; box-shadow: none;
+        accent-color: var(--wox-accent, #00e5ff);
+        height: 20px; cursor: pointer;
+    }
+    input[type="range"]:focus { box-shadow: none; border: none; }
 `, `
             <div class="wrapper">
-                ${o ? `<label class="${d ? "scrub" : ""}">${o}${n ? `<span class="unit">${n}</span>` : ""}</label>` : ""}
+                ${i ? `<label class="${x ? "scrub" : ""}">${i}${b ? `<span class="unit">${o}</span>` : ""}</label>` : ""}
                 <div class="input-wrap">
-                    <input type="${d ? "number" : "text"}" value="${e}" placeholder="${l}" ${u} ${x ? "disabled" : ""} class="${n && !o ? "has-unit" : ""}">
-                    ${n && !o ? `<span class="suffix">${n}</span>` : ""}
+                    <input type="${e}" value="${n}" placeholder="${h}" ${f} ${l ? "disabled" : ""} class="${b && !i ? "has-unit" : ""}">
+                    ${b && !i ? `<span class="suffix">${o}</span>` : ""}
                 </div>
             </div>
         `);
-      const h = this.$("input");
-      if (h.addEventListener("input", () => {
-        const v = d ? parseFloat(h.value) : h.value;
+      const u = this.$("input");
+      if (u.addEventListener("input", () => {
+        const v = g ? parseFloat(u.value) : u.value;
         this.emit("wox-input", { value: v });
-      }), h.addEventListener("change", () => {
-        const v = d ? parseFloat(h.value) : h.value;
+      }), u.addEventListener("change", () => {
+        const v = g ? parseFloat(u.value) : u.value;
         this.emit("wox-change", { value: v });
-      }), h.addEventListener("keydown", (v) => {
-        v.key === "Enter" && h.blur();
-      }), d && o) {
+      }), u.addEventListener("keydown", (v) => {
+        v.key === "Enter" && u.blur();
+      }), x && i) {
         const v = this.$("label");
-        let b = 0, g = 0;
-        const f = (E) => {
-          const z = E.clientX - b, m = parseFloat(a) || 1;
-          let y = g + Math.round(z / 2) * m;
-          i !== null && (y = Math.max(parseFloat(i), y)), r !== null && (y = Math.min(parseFloat(r), y)), h.value = y, this.emit("wox-input", { value: y });
-        }, k = () => {
-          document.removeEventListener("mousemove", f), document.removeEventListener("mouseup", k), this.emit("wox-change", { value: parseFloat(h.value) });
+        let k = 0, A = 0;
+        const z = (y) => {
+          const N = y.clientX - k, kt = parseFloat(d) || 1;
+          let L = A + Math.round(N / 2) * kt;
+          r !== null && (L = Math.max(parseFloat(r), L)), a !== null && (L = Math.min(parseFloat(a), L)), u.value = L, this.emit("wox-input", { value: L });
+        }, m = () => {
+          document.removeEventListener("mousemove", z), document.removeEventListener("mouseup", m), this.emit("wox-change", { value: parseFloat(u.value) });
         };
-        v.addEventListener("mousedown", (E) => {
-          x || (b = E.clientX, g = parseFloat(h.value) || 0, document.addEventListener("mousemove", f), document.addEventListener("mouseup", k), E.preventDefault());
+        v.addEventListener("mousedown", (y) => {
+          l || (k = y.clientX, A = parseFloat(u.value) || 0, document.addEventListener("mousemove", z), document.addEventListener("mouseup", m), y.preventDefault());
         });
       }
     });
@@ -288,9 +306,9 @@ class X extends w {
     e && (e.value = t);
   }
 }
-s(X, "observedAttributes", ["type", "value", "unit", "label", "min", "max", "step", "placeholder", "disabled"]);
+s(J, "observedAttributes", ["type", "value", "unit", "label", "min", "max", "step", "placeholder", "disabled"]);
 const $ = (p) => String(p).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
-class q extends w {
+class K extends w {
   constructor() {
     super(...arguments);
     s(this, "_isOpen", !1);
@@ -320,8 +338,8 @@ class q extends w {
     s(this, "_calculateDropdownPosition", () => {
       const t = this.$(".trigger");
       if (!t) return null;
-      const e = t.getBoundingClientRect(), n = window.innerHeight, o = window.innerWidth, i = n - e.bottom, r = e.top, a = e.width, l = Math.max(0, Math.min(e.left, o - a));
-      return this._openUpward ? { bottom: n - e.top + 2, left: l, width: a, maxHeight: Math.max(100, Math.min(200, r - 10)) } : { top: e.bottom + 2, left: l, width: a, maxHeight: Math.max(100, Math.min(200, i - 10)) };
+      const e = t.getBoundingClientRect(), n = window.innerHeight, o = window.innerWidth, i = n - e.bottom, r = e.top, a = e.width, d = Math.max(0, Math.min(e.left, o - a));
+      return this._openUpward ? { bottom: n - e.top + 2, left: d, width: a, maxHeight: Math.max(100, Math.min(200, r - 10)) } : { top: e.bottom + 2, left: d, width: a, maxHeight: Math.max(100, Math.min(200, i - 10)) };
     });
     s(this, "_updateDropdownPosition", () => {
       requestAnimationFrame(() => {
@@ -709,8 +727,8 @@ class q extends w {
     this._selectedOptions = [], this._filteredOptions = [...t], this._parsedOptions = null, this.setAttribute("options", JSON.stringify(t));
   }
 }
-s(q, "observedAttributes", ["multiple", "searchable", "placeholder", "disabled", "value", "options"]);
-class J extends w {
+s(K, "observedAttributes", ["multiple", "searchable", "placeholder", "disabled", "value", "options"]);
+class V extends w {
   constructor() {
     super();
     s(this, "_getConfig", () => ({ min: parseFloat(this.getAttribute("min") ?? 0), max: parseFloat(this.getAttribute("max") ?? 100), step: parseFloat(this.getAttribute("step") ?? 1), unit: this.getAttribute("unit") || "" }));
@@ -723,7 +741,7 @@ class J extends w {
       i && (i.style.width = o + "%"), r && (r.style.left = o + "%"), a && (a.textContent = this._formatVal(n));
     });
     s(this, "_build", () => {
-      const { min: t, max: e } = this._getConfig(), n = parseFloat(this.getAttribute("value") ?? t), o = this.getAttribute("label") || "", i = this.hasAttribute("show-value"), r = (n - t) / (e - t) * 100, a = this.getAttribute("color") || "", l = [this.hasAttribute("glow") ? "glow" : "", this.hasAttribute("pulse") ? "pulse" : ""].filter(Boolean).join(" "), x = a ? `--wox-fx-color:${a};border-color:${a}` : "", d = a ? " custom-color" : "";
+      const { min: t, max: e } = this._getConfig(), n = parseFloat(this.getAttribute("value") ?? t), o = this.getAttribute("label") || "", i = this.hasAttribute("show-value"), r = (n - t) / (e - t) * 100, a = this.getAttribute("color") || "", d = [this.hasAttribute("glow") ? "glow" : "", this.hasAttribute("pulse") ? "pulse" : ""].filter(Boolean).join(" "), h = a ? `--wox-fx-color:${a};border-color:${a}` : "", l = a ? " custom-color" : "";
       this.render(`
     :host { display: inline-block; width: 100%; }
     .wrapper { display: flex; align-items: center; gap: var(--wox-space-lg, 12px); }
@@ -748,38 +766,38 @@ class J extends w {
     }
     .fill.custom-color { background: var(--wox-fx-color); }
     .thumb.glow { width: 16px; height: 16px; }
-` + M, `
+` + D, `
             <div class="wrapper">
                 ${o ? `<span class="label">${o}</span>` : ""}
                 <div class="track-wrap">
-                    <div class="track"><div class="fill${d}" style="width:${r}%;${a ? "--wox-fx-color:" + a : ""}"></div></div>
-                    <div class="thumb ${l}" style="${x};left:${r}%"></div>
+                    <div class="track"><div class="fill${l}" style="width:${r}%;${a ? "--wox-fx-color:" + a : ""}"></div></div>
+                    <div class="thumb ${d}" style="${h};left:${r}%"></div>
                 </div>
                 ${i ? `<span class="value">${this._formatVal(n)}</span>` : ""}
             </div>
         `), this._attachDrag();
     });
     s(this, "_attachDrag", () => {
-      const { min: t, max: e, step: n, unit: o } = this._getConfig(), i = this.$(".track-wrap"), r = this.$(".fill"), a = this.$(".thumb"), l = this.$(".value"), x = (h) => {
-        const v = i.getBoundingClientRect();
-        let b = (h - v.left) / v.width;
+      const { min: t, max: e, step: n, unit: o } = this._getConfig(), i = this.$(".track-wrap"), r = this.$(".fill"), a = this.$(".thumb"), d = this.$(".value"), h = (x) => {
+        const f = i.getBoundingClientRect();
+        let b = (x - f.left) / f.width;
         b = Math.max(0, Math.min(1, b));
-        let g = t + b * (e - t);
-        g = Math.round(g / n) * n, g = Math.max(t, Math.min(e, g));
-        const f = (g - t) / (e - t) * 100;
-        return r.style.width = f + "%", a.style.left = f + "%", l && (l.textContent = o === "%" ? Math.round(100 * g) + "%" : n < 1 ? g.toFixed(2) : String(g)), g;
-      }, d = (h) => {
-        const v = x(h.clientX);
-        this.emit("wox-input", { value: v });
-      }, u = (h) => {
-        this._dragging = !1, a.classList.remove("dragging"), document.removeEventListener("mousemove", d), document.removeEventListener("mouseup", u);
-        const v = x(h.clientX);
-        this.setAttribute("value", v), this.emit("wox-change", { value: v });
+        let u = t + b * (e - t);
+        u = Math.round(u / n) * n, u = Math.max(t, Math.min(e, u));
+        const v = (u - t) / (e - t) * 100;
+        return r.style.width = v + "%", a.style.left = v + "%", d && (d.textContent = o === "%" ? Math.round(100 * u) + "%" : n < 1 ? u.toFixed(2) : String(u)), u;
+      }, l = (x) => {
+        const f = h(x.clientX);
+        this.emit("wox-input", { value: f });
+      }, g = (x) => {
+        this._dragging = !1, a.classList.remove("dragging"), document.removeEventListener("mousemove", l), document.removeEventListener("mouseup", g);
+        const f = h(x.clientX);
+        this.setAttribute("value", f), this.emit("wox-change", { value: f });
       };
-      i.addEventListener("mousedown", (h) => {
+      i.addEventListener("mousedown", (x) => {
         this._dragging = !0, a.classList.add("dragging");
-        const v = x(h.clientX);
-        this.emit("wox-input", { value: v }), document.addEventListener("mousemove", d), document.addEventListener("mouseup", u), h.preventDefault();
+        const f = h(x.clientX);
+        this.emit("wox-input", { value: f }), document.addEventListener("mousemove", l), document.addEventListener("mouseup", g), x.preventDefault();
       });
     });
     this._dragging = !1;
@@ -791,8 +809,8 @@ class J extends w {
     this.isConnected && (this._dragging || (t === "value" ? this._updateVisuals() : this._build()));
   }
 }
-s(J, "observedAttributes", ["value", "min", "max", "step", "label", "unit", "show-value", "color", "glow", "pulse"]);
-class K extends w {
+s(V, "observedAttributes", ["value", "min", "max", "step", "label", "unit", "show-value", "color", "glow", "pulse"]);
+class U extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -814,7 +832,7 @@ class K extends w {
         background: repeating-conic-gradient(#888 0% 25%, #fff 0% 50%) 0 0 / 8px 8px;
     }
     .color { position: absolute; inset: 0; }
- ${M} :host { --size: ${e}px; }`, `<div class="swatch ${r}"${a}>
+ ${D} :host { --size: ${e}px; }`, `<div class="swatch ${r}"${a}>
                 <div class="checker"></div>
                 <div class="color" style="background:${t}"></div>
             </div>`), this.$(".swatch").addEventListener("click", () => {
@@ -829,8 +847,8 @@ class K extends w {
     this.isConnected && this._render();
   }
 }
-s(K, "observedAttributes", ["color", "size", "selected", "glow", "pulse"]);
-class V extends w {
+s(U, "observedAttributes", ["color", "size", "selected", "glow", "pulse"]);
+class Q extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -854,9 +872,9 @@ class V extends w {
     s(this, "_position", () => {
       const t = this.shadowRoot.querySelector(".tip");
       if (!t) return;
-      const e = this.getAttribute("position") || "top", n = this.getBoundingClientRect(), o = t.getBoundingClientRect(), i = window.innerWidth, r = window.innerHeight, a = { top: n.top - 6 - o.height >= 0, bottom: n.bottom + 6 + o.height <= r, left: n.left - 6 - o.width >= 0, right: n.right + 6 + o.width <= i }, l = { top: "bottom", bottom: "top", left: "right", right: "left" }, x = [e, l[e], ...["top", "bottom", "left", "right"].filter((h) => h !== e && h !== l[e])].find((h) => a[h]) || e;
-      let d, u;
-      x === "top" ? (d = n.top - 6 - o.height, u = n.left + n.width / 2 - o.width / 2) : x === "bottom" ? (d = n.bottom + 6, u = n.left + n.width / 2 - o.width / 2) : x === "left" ? (d = n.top + n.height / 2 - o.height / 2, u = n.left - 6 - o.width) : (d = n.top + n.height / 2 - o.height / 2, u = n.right + 6), u = Math.max(4, Math.min(u, i - o.width - 4)), d = Math.max(4, Math.min(d, r - o.height - 4)), t.style.top = `${d}px`, t.style.left = `${u}px`;
+      const e = this.getAttribute("position") || "top", n = this.getBoundingClientRect(), o = t.getBoundingClientRect(), i = window.innerWidth, r = window.innerHeight, a = { top: n.top - 6 - o.height >= 0, bottom: n.bottom + 6 + o.height <= r, left: n.left - 6 - o.width >= 0, right: n.right + 6 + o.width <= i }, d = { top: "bottom", bottom: "top", left: "right", right: "left" }, h = [e, d[e], ...["top", "bottom", "left", "right"].filter((x) => x !== e && x !== d[e])].find((x) => a[x]) || e;
+      let l, g;
+      h === "top" ? (l = n.top - 6 - o.height, g = n.left + n.width / 2 - o.width / 2) : h === "bottom" ? (l = n.bottom + 6, g = n.left + n.width / 2 - o.width / 2) : h === "left" ? (l = n.top + n.height / 2 - o.height / 2, g = n.left - 6 - o.width) : (l = n.top + n.height / 2 - o.height / 2, g = n.right + 6), g = Math.max(4, Math.min(g, i - o.width - 4)), l = Math.max(4, Math.min(l, r - o.height - 4)), t.style.top = `${l}px`, t.style.left = `${g}px`;
     });
   }
   connectedCallback() {
@@ -866,8 +884,8 @@ class V extends w {
     this.isConnected && this._render();
   }
 }
-s(V, "observedAttributes", ["text", "position", "delay"]);
-class U extends w {
+s(Q, "observedAttributes", ["text", "position", "delay"]);
+class Z extends w {
   constructor() {
     super();
     s(this, "_initFromAttrs", () => {
@@ -976,16 +994,16 @@ class U extends w {
       const t = this._wCtx, e = 220;
       t.clearRect(0, 0, e, e);
       const n = t.createConicGradient(-Math.PI / 2, 110, 110);
-      for (let h = 0; h <= 36; h++) n.addColorStop(h / 36, `hsl(${10 * h},100%,50%)`);
+      for (let x = 0; x <= 36; x++) n.addColorStop(x / 36, `hsl(${10 * x},100%,50%)`);
       t.fillStyle = n, t.beginPath(), t.arc(110, 110, 104, 0, 2 * Math.PI), t.fill(), t.save(), t.globalCompositeOperation = "destination-out", t.beginPath(), t.arc(110, 110, 78, 0, 2 * Math.PI), t.fill(), t.restore(), t.strokeStyle = "rgba(0,0,0,0.25)", t.lineWidth = 1, t.beginPath(), t.arc(110, 110, 103.5, 0, 2 * Math.PI), t.stroke(), t.beginPath(), t.arc(110, 110, 78.5, 0, 2 * Math.PI), t.stroke();
       const o = this._hue * Math.PI * 2 - Math.PI / 2, i = 110 + 91 * Math.cos(o), r = 110 + 91 * Math.sin(o);
       t.strokeStyle = "#fff", t.lineWidth = 2.5, t.beginPath(), t.arc(i, r, 8, 0, 2 * Math.PI), t.stroke(), t.strokeStyle = "rgba(0,0,0,0.4)", t.lineWidth = 1, t.beginPath(), t.arc(i, r, 8, 0, 2 * Math.PI), t.stroke();
-      const a = 104, l = t.createLinearGradient(58, 0, 162, 0);
-      l.addColorStop(0, "#fff"), l.addColorStop(1, `hsl(${360 * this._hue},100%,50%)`), t.fillStyle = l, t.fillRect(58, 58, a, a);
-      const x = t.createLinearGradient(0, 58, 0, 162);
-      x.addColorStop(0, "rgba(0,0,0,0)"), x.addColorStop(1, "rgba(0,0,0,1)"), t.fillStyle = x, t.fillRect(58, 58, a, a);
-      const d = 58 + this._sat * a, u = 58 + (1 - this._val) * a;
-      t.strokeStyle = "#fff", t.lineWidth = 2.5, t.beginPath(), t.arc(d, u, 7, 0, 2 * Math.PI), t.stroke(), t.strokeStyle = "rgba(0,0,0,0.4)", t.lineWidth = 1, t.beginPath(), t.arc(d, u, 7, 0, 2 * Math.PI), t.stroke();
+      const a = 104, d = t.createLinearGradient(58, 0, 162, 0);
+      d.addColorStop(0, "#fff"), d.addColorStop(1, `hsl(${360 * this._hue},100%,50%)`), t.fillStyle = d, t.fillRect(58, 58, a, a);
+      const h = t.createLinearGradient(0, 58, 0, 162);
+      h.addColorStop(0, "rgba(0,0,0,0)"), h.addColorStop(1, "rgba(0,0,0,1)"), t.fillStyle = h, t.fillRect(58, 58, a, a);
+      const l = 58 + this._sat * a, g = 58 + (1 - this._val) * a;
+      t.strokeStyle = "#fff", t.lineWidth = 2.5, t.beginPath(), t.arc(l, g, 7, 0, 2 * Math.PI), t.stroke(), t.strokeStyle = "rgba(0,0,0,0.4)", t.lineWidth = 1, t.beginPath(), t.arc(l, g, 7, 0, 2 * Math.PI), t.stroke();
     });
     s(this, "_drawAlpha", () => {
       const t = this._aCtx;
@@ -1053,8 +1071,8 @@ class U extends w {
     } else t !== "color" && t !== "alpha" || (this._initFromAttrs(), this.hasAttribute("open") && this._redraw());
   }
 }
-s(U, "observedAttributes", ["color", "alpha", "open"]);
-const P = `
+s(Z, "observedAttributes", ["color", "alpha", "open"]);
+const F = `
     :host { display: block; }
     .item {
         color: var(--wox-text-primary, #eee); padding: 8px 12px; display: flex; align-items: center;
@@ -1075,12 +1093,12 @@ const P = `
     }
     .material-icons { font-family: 'Material Icons'; font-weight: normal; font-style: normal; display: inline-block; line-height: 1; text-transform: none; letter-spacing: normal; word-wrap: normal; white-space: nowrap; direction: ltr; -webkit-font-smoothing: antialiased; }
 `;
-class Q extends w {
+class tt extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
       const t = this.getAttribute("type") || "item", e = this.getAttribute("label") || "", n = this.getAttribute("shortcut") || "", o = this.getAttribute("icon") || "", i = this.hasAttribute("disabled"), r = this.hasAttribute("submenu");
-      t !== "separator" ? t !== "header" ? (this.render(P, `
+      t !== "separator" ? t !== "header" ? (this.render(F, `
             <div class="item ${i ? "disabled" : ""}">
                 ${o ? `<span class="icon material-icons">${o}</span>` : ""}
                 <span class="label">${e}</span>
@@ -1089,7 +1107,7 @@ class Q extends w {
             </div>
         `), i || this.$(".item").addEventListener("click", () => {
         this.emit("wox-select", { label: e });
-      })) : this.render(P, `<div class="header">${e}</div>`) : this.render(P, '<div class="separator"></div>');
+      })) : this.render(F, `<div class="header">${e}</div>`) : this.render(F, '<div class="separator"></div>');
     });
   }
   connectedCallback() {
@@ -1099,8 +1117,8 @@ class Q extends w {
     this.isConnected && this._render();
   }
 }
-s(Q, "observedAttributes", ["label", "shortcut", "icon", "disabled", "type", "submenu"]);
-class Z extends w {
+s(tt, "observedAttributes", ["label", "shortcut", "icon", "disabled", "type", "submenu"]);
+class et extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1144,8 +1162,8 @@ class Z extends w {
         if (!t || !e) return;
         const n = t.getBoundingClientRect(), o = window.innerWidth, i = window.innerHeight, r = e.getBoundingClientRect();
         n.left + r.width > o ? e.style.left = n.right - r.width + "px" : e.style.left = `${n.left}px`;
-        const a = i - n.bottom, l = n.top;
-        a >= r.height || a >= l ? (e.style.top = `${n.bottom}px`, e.style.bottom = "") : (e.style.top = "", e.style.bottom = i - n.top + "px");
+        const a = i - n.bottom, d = n.top;
+        a >= r.height || a >= d ? (e.style.top = `${n.bottom}px`, e.style.bottom = "") : (e.style.top = "", e.style.bottom = i - n.top + "px");
       });
     });
     s(this, "_close", () => {
@@ -1168,13 +1186,13 @@ class Z extends w {
     this._outsideClick && document.removeEventListener("mousedown", this._outsideClick);
   }
 }
-s(Z, "observedAttributes", ["label", "open", "trigger"]);
-const $t = { rectangle: "crop_square", ellipse: "radio_button_unchecked", path: "timeline", image: "image", text: "text_fields", group: "folder", layer: "layers" };
-class tt extends w {
+s(et, "observedAttributes", ["label", "open", "trigger"]);
+const zt = { rectangle: "crop_square", ellipse: "radio_button_unchecked", path: "timeline", image: "image", text: "text_fields", group: "folder", layer: "layers" };
+class nt extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
-      const t = this.getAttribute("name") || "Layer", e = this.getAttribute("type") || "layer", n = this.hasAttribute("visible"), o = this.hasAttribute("locked"), i = this.hasAttribute("selected"), r = $t[e] || "layers";
+      const t = this.getAttribute("name") || "Layer", e = this.getAttribute("type") || "layer", n = this.hasAttribute("visible"), o = this.hasAttribute("locked"), i = this.hasAttribute("selected"), r = zt[e] || "layers";
       this.render(`
     :host { display: block; }
     .layer {
@@ -1211,12 +1229,12 @@ class tt extends w {
         a.target.closest(".toggle") || this.emit("wox-select", { name: t });
       }), this.$(".name").addEventListener("dblclick", () => this._startEditing()), this.$(".eye").addEventListener("click", (a) => {
         a.stopPropagation();
-        const l = !n;
-        l ? this.setAttribute("visible", "") : this.removeAttribute("visible"), this.emit("wox-visibility", { visible: l });
+        const d = !n;
+        d ? this.setAttribute("visible", "") : this.removeAttribute("visible"), this.emit("wox-visibility", { visible: d });
       }), this.$(".lock").addEventListener("click", (a) => {
         a.stopPropagation();
-        const l = !o;
-        l ? this.setAttribute("locked", "") : this.removeAttribute("locked"), this.emit("wox-lock", { locked: l });
+        const d = !o;
+        d ? this.setAttribute("locked", "") : this.removeAttribute("locked"), this.emit("wox-lock", { locked: d });
       });
     });
     s(this, "_startEditing", () => {
@@ -1238,8 +1256,8 @@ class tt extends w {
     this.isConnected && !this._editing && this._render();
   }
 }
-s(tt, "observedAttributes", ["name", "type", "visible", "locked", "selected", "depth"]);
-class et extends w {
+s(nt, "observedAttributes", ["name", "type", "visible", "locked", "selected", "depth"]);
+class ot extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1296,8 +1314,8 @@ class et extends w {
     this.isConnected && this._render();
   }
 }
-s(et, "observedAttributes", ["title", "collapsed", "icon"]);
-class nt extends w {
+s(ot, "observedAttributes", ["title", "collapsed", "icon"]);
+class it extends w {
   connectedCallback() {
     this.render(`
     :host { display: none; flex: 1; overflow-y: auto; overflow-x: hidden; flex-direction: column; }
@@ -1305,8 +1323,8 @@ class nt extends w {
 `, "<slot></slot>");
   }
 }
-s(nt, "observedAttributes", ["name", "label", "icon", "active"]);
-class ot extends w {
+s(it, "observedAttributes", ["name", "label", "icon", "active"]);
+class st extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1362,10 +1380,10 @@ class ot extends w {
       t.innerHTML = "";
       const e = this._getTabs(), n = this.getAttribute("active") || ((o = e[0]) == null ? void 0 : o.getAttribute("name")) || "";
       e.forEach((i) => {
-        const r = i.getAttribute("name") || "", a = i.getAttribute("label") || r, l = document.createElement("button");
-        l.className = "tab-btn" + (r === n ? " active" : ""), l.textContent = a, l.addEventListener("click", () => {
+        const r = i.getAttribute("name") || "", a = i.getAttribute("label") || r, d = document.createElement("button");
+        d.className = "tab-btn" + (r === n ? " active" : ""), d.textContent = a, d.addEventListener("click", () => {
           this.setAttribute("active", r), this.emit("wox-tab-change", { name: r });
-        }), t.appendChild(l);
+        }), t.appendChild(d);
       }), this._updateActive();
     });
     s(this, "_updateActive", () => {
@@ -1388,8 +1406,8 @@ class ot extends w {
     this.isConnected && this._updateActive();
   }
 }
-s(ot, "observedAttributes", ["active", "placement"]);
-class it extends w {
+s(st, "observedAttributes", ["active", "placement"]);
+class rt extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1411,8 +1429,8 @@ class it extends w {
     this.isConnected && this._render();
   }
 }
-s(it, "observedAttributes", ["label"]);
-class st extends w {
+s(rt, "observedAttributes", ["label"]);
+class at extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1436,8 +1454,8 @@ class st extends w {
     this.isConnected && this._render();
   }
 }
-s(st, "observedAttributes", ["width", "position"]);
-class rt extends w {
+s(at, "observedAttributes", ["width", "position"]);
+class dt extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1463,14 +1481,14 @@ class rt extends w {
         const n = this.$(".resizer");
         if (!n) return;
         let o = 0, i = 0;
-        const r = this.getAttribute("position") === "left", a = (x) => {
-          const d = r ? x.clientX - o : o - x.clientX, u = Math.max(180, Math.min(600, i + d));
-          this.style.width = u + "px";
-        }, l = () => {
-          document.removeEventListener("mousemove", a), document.removeEventListener("mouseup", l);
+        const r = this.getAttribute("position") === "left", a = (h) => {
+          const l = r ? h.clientX - o : o - h.clientX, g = Math.max(180, Math.min(600, i + l));
+          this.style.width = g + "px";
+        }, d = () => {
+          document.removeEventListener("mousemove", a), document.removeEventListener("mouseup", d);
         };
-        n.addEventListener("mousedown", (x) => {
-          o = x.clientX, i = this.getBoundingClientRect().width, document.addEventListener("mousemove", a), document.addEventListener("mouseup", l), x.preventDefault();
+        n.addEventListener("mousedown", (h) => {
+          o = h.clientX, i = this.getBoundingClientRect().width, document.addEventListener("mousemove", a), document.addEventListener("mouseup", d), h.preventDefault();
         });
       }
     });
@@ -1482,8 +1500,8 @@ class rt extends w {
     this.isConnected && this._render();
   }
 }
-s(rt, "observedAttributes", ["width", "position", "resizable"]);
-class at extends w {
+s(dt, "observedAttributes", ["width", "position", "resizable"]);
+class lt extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1509,8 +1527,8 @@ class at extends w {
     this.isConnected && this._render();
   }
 }
-s(at, "observedAttributes", ["height"]);
-class dt extends w {
+s(lt, "observedAttributes", ["height"]);
+class ct extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1538,8 +1556,8 @@ class dt extends w {
     this.isConnected && this._render();
   }
 }
-s(dt, "observedAttributes", ["height"]);
-class lt extends w {
+s(ct, "observedAttributes", ["height"]);
+class pt extends w {
   constructor() {
     super(...arguments);
     s(this, "_render", () => {
@@ -1580,7 +1598,7 @@ class lt extends w {
     .btn-secondary:hover { background: var(--wox-border-light, #444); }
     .btn-primary { background: var(--wox-accent, #00e5ff); color: var(--wox-text-hi, #fff); }
     .btn-primary:hover { filter: brightness(0.85); }
- ${M} .box { --width: ${n}; }`, `
+ ${D} .box { --width: ${n}; }`, `
             <div class="overlay">
                 <div class="box ${i}"${r}>
                     <div class="header">
@@ -1596,19 +1614,19 @@ class lt extends w {
                     </div>
                 </div>
             </div>
-        `), this.$(".overlay").addEventListener("click", (d) => {
-        d.target === this.$(".overlay") && (this.removeAttribute("open"), this.emit("wox-close", {}));
+        `), this.$(".overlay").addEventListener("click", (l) => {
+        l.target === this.$(".overlay") && (this.removeAttribute("open"), this.emit("wox-close", {}));
       });
       const a = this.$(".close-btn");
       a && a.addEventListener("click", () => {
         this.removeAttribute("open"), this.emit("wox-close", {});
       });
-      const l = this.$(".cancel-btn");
-      l && l.addEventListener("click", () => {
+      const d = this.$(".cancel-btn");
+      d && d.addEventListener("click", () => {
         this.removeAttribute("open"), this.emit("wox-cancel", {});
       });
-      const x = this.$(".ok-btn");
-      x && x.addEventListener("click", () => {
+      const h = this.$(".ok-btn");
+      h && h.addEventListener("click", () => {
         this.removeAttribute("open"), this.emit("wox-confirm", {});
       });
     });
@@ -1644,8 +1662,8 @@ class lt extends w {
     t ? this.setAttribute("open", "") : this.removeAttribute("open");
   }
 }
-s(lt, "observedAttributes", ["open", "title", "closable", "width", "color", "glow", "pulse"]);
-class vt extends w {
+s(pt, "observedAttributes", ["open", "title", "closable", "width", "color", "glow", "pulse"]);
+class ft extends w {
   constructor() {
     super(...arguments);
     s(this, "_columns", []);
@@ -1664,18 +1682,18 @@ class vt extends w {
     });
     s(this, "_render", () => {
       const t = this._getSortedRows(), e = this._columns.map((o, i) => {
-        const r = this._sortKey === o.key, a = [r ? "sorted" : "", r && this._sortDir === "desc" ? "desc" : ""].filter(Boolean).join(" "), l = o.sortable !== !1;
+        const r = this._sortKey === o.key, a = [r ? "sorted" : "", r && this._sortDir === "desc" ? "desc" : ""].filter(Boolean).join(" "), d = o.sortable !== !1;
         return `<div class="header-cell ${a}" data-col="${i}" style="width:${this._colWidths[i]}px" draggable="true">
                 <span class="label-text">${o.label || o.key}</span>
-                ${l ? '<span class="sort-arrow">&#9650;</span>' : ""}
+                ${d ? '<span class="sort-arrow">&#9650;</span>' : ""}
                 <div class="resize-handle" data-col="${i}"></div>
             </div>`;
       }).join(""), n = t.length === 0 ? '<div class="empty">No data</div>' : t.map((o, i) => {
-        const r = i % 2 == 0 ? "even" : "odd", a = this._columns.map((l, x) => {
-          const d = l.align ? ` align-${l.align}` : "", u = this._editingCell && this._editingCell.rowIndex === i && this._editingCell.key === l.key, h = o[l.key] != null ? o[l.key] : "";
-          return u ? `<div class="cell${d}" style="width:${this._colWidths[x]}px" data-key="${l.key}">
+        const r = i % 2 == 0 ? "even" : "odd", a = this._columns.map((d, h) => {
+          const l = d.align ? ` align-${d.align}` : "", g = this._editingCell && this._editingCell.rowIndex === i && this._editingCell.key === d.key, x = o[d.key] != null ? o[d.key] : "";
+          return g ? `<div class="cell${l}" style="width:${this._colWidths[h]}px" data-key="${d.key}">
                             <input class="cell-input" spellcheck="false">
-                        </div>` : `<div class="cell${d}" style="width:${this._colWidths[x]}px" data-key="${l.key}">${h}</div>`;
+                        </div>` : `<div class="cell${l}" style="width:${this._colWidths[h]}px" data-key="${d.key}">${x}</div>`;
         }).join("");
         return `<div class="row ${r}" data-row="${i}">${a}</div>`;
       }).join("");
@@ -1772,12 +1790,12 @@ class vt extends w {
         const o = this.$(".cell-input");
         if (o) {
           const { rowIndex: i, key: r } = this._editingCell, a = this._getSortedRows();
-          let l = a[i][r] != null ? a[i][r] : "";
-          const x = document.createElement("div");
-          x.innerHTML = l;
-          const d = x.textContent || x.innerText || l;
-          o.value = d, o.dataset.oldValue = d, o.focus(), o.select(), o.addEventListener("keydown", (u) => {
-            u.key === "Enter" ? this._commitEdit(o.value) : u.key === "Escape" && (this._editingCell = null, this._render());
+          let d = a[i][r] != null ? a[i][r] : "";
+          const h = document.createElement("div");
+          h.innerHTML = d;
+          const l = h.textContent || h.innerText || d;
+          o.value = l, o.dataset.oldValue = l, o.focus(), o.select(), o.addEventListener("keydown", (g) => {
+            g.key === "Enter" ? this._commitEdit(o.value) : g.key === "Escape" && (this._editingCell = null, this._render());
           }), o.addEventListener("blur", () => {
             this._commitEdit(o.value);
           });
@@ -1825,9 +1843,9 @@ class vt extends w {
           e.preventDefault(), e.stopPropagation();
           const n = Number(t.dataset.col), o = e.clientX, i = this._colWidths[n];
           t.classList.add("active");
-          const r = (l) => {
-            const x = l.clientX - o;
-            this._colWidths[n] = Math.max(40, i + x), this._applyWidths();
+          const r = (d) => {
+            const h = d.clientX - o;
+            this._colWidths[n] = Math.max(40, i + h), this._applyWidths();
           }, a = () => {
             t.classList.remove("active"), document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", a);
           };
@@ -1867,12 +1885,12 @@ class vt extends w {
     return this._rows;
   }
 }
-const Ct = 4e3, ht = { TL: { top: "16px", left: "16px" }, TC: { top: "16px", left: "50%", transform: "translateX(-50%)" }, TR: { top: "16px", right: "16px" }, BL: { bottom: "16px", left: "16px" }, BC: { bottom: "16px", left: "50%", transform: "translateX(-50%)" }, BR: { bottom: "16px", right: "16px" } }, Et = { TL: "translateX(-120%)", TC: "translateY(-120%)", TR: "translateX(120%)", BL: "translateX(-120%)", BC: "translateY(120%)", BR: "translateX(120%)" }, At = { success: { bg: "#1a2e1a", border: "#4CAF50", icon: "#66BB6A", progress: "#4CAF50", text: "#c8e6c9" }, error: { bg: "#2e1a1a", border: "#f44336", icon: "#ef5350", progress: "#f44336", text: "#ffcdd2" }, warning: { bg: "#2e2a1a", border: "#FF9800", icon: "#FFA726", progress: "#FF9800", text: "#ffe0b2" }, info: { bg: "#1a222e", border: "#2196F3", icon: "#42A5F5", progress: "#2196F3", text: "#bbdefb" } }, zt = { success: { bg: "#e8f5e9", border: "#2e7d32", icon: "#388e3c", progress: "#2e7d32", text: "#1b5e20" }, error: { bg: "#fce4ec", border: "#c62828", icon: "#d32f2f", progress: "#c62828", text: "#b71c1c" }, warning: { bg: "#fff8e1", border: "#e65100", icon: "#ef6c00", progress: "#e65100", text: "#bf360c" }, info: { bg: "#e3f2fd", border: "#1565c0", icon: "#1976d2", progress: "#1565c0", text: "#0d47a1" } }, xt = { success: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>', error: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="15" y1="9" x2="9" y2="15"/><line x1="9" y1="9" x2="15" y2="15"/></svg>', warning: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>', info: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/></svg>' };
-let ut = !1;
-const N = /* @__PURE__ */ new Set(), F = {}, D = (p, c, t = {}) => {
+const Lt = 4e3, ut = { TL: { top: "16px", left: "16px" }, TC: { top: "16px", left: "50%", transform: "translateX(-50%)" }, TR: { top: "16px", right: "16px" }, BL: { bottom: "16px", left: "16px" }, BC: { bottom: "16px", left: "50%", transform: "translateX(-50%)" }, BR: { bottom: "16px", right: "16px" } }, St = { TL: "translateX(-120%)", TC: "translateY(-120%)", TR: "translateX(120%)", BL: "translateX(-120%)", BC: "translateY(120%)", BR: "translateX(120%)" }, Mt = { success: { bg: "#1a2e1a", border: "#4CAF50", icon: "#66BB6A", progress: "#4CAF50", text: "#c8e6c9" }, error: { bg: "#2e1a1a", border: "#f44336", icon: "#ef5350", progress: "#f44336", text: "#ffcdd2" }, warning: { bg: "#2e2a1a", border: "#FF9800", icon: "#FFA726", progress: "#FF9800", text: "#ffe0b2" }, info: { bg: "#1a222e", border: "#2196F3", icon: "#42A5F5", progress: "#2196F3", text: "#bbdefb" } }, Dt = { success: { bg: "#e8f5e9", border: "#2e7d32", icon: "#388e3c", progress: "#2e7d32", text: "#1b5e20" }, error: { bg: "#fce4ec", border: "#c62828", icon: "#d32f2f", progress: "#c62828", text: "#b71c1c" }, warning: { bg: "#fff8e1", border: "#e65100", icon: "#ef6c00", progress: "#e65100", text: "#bf360c" }, info: { bg: "#e3f2fd", border: "#1565c0", icon: "#1976d2", progress: "#1565c0", text: "#0d47a1" } }, gt = { success: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>', error: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="15" y1="9" x2="9" y2="15"/><line x1="9" y1="9" x2="15" y2="15"/></svg>', warning: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>', info: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/></svg>' };
+let bt = !1;
+const B = /* @__PURE__ */ new Set(), W = {}, R = (p, c, t = {}) => {
   (() => {
-    if (ut) return;
-    ut = !0;
+    if (bt) return;
+    bt = !0;
     const m = document.createElement("style");
     m.textContent = `
 .wox-toast-container {
@@ -1931,60 +1949,60 @@ const N = /* @__PURE__ */ new Set(), F = {}, D = (p, c, t = {}) => {
 `, document.head.appendChild(m);
   })();
   const e = `${p}::${c}`;
-  if (N.has(e)) return;
-  N.add(e);
-  const { duration: n = Ct, closable: o = !0, position: i = "BR" } = t, r = document.documentElement.dataset.woxTheme === "light", a = ((m) => {
-    const y = document.documentElement.dataset.woxTheme === "light" ? zt : At;
+  if (B.has(e)) return;
+  B.add(e);
+  const { duration: n = Lt, closable: o = !0, position: i = "BR" } = t, r = document.documentElement.dataset.woxTheme === "light", a = ((m) => {
+    const y = document.documentElement.dataset.woxTheme === "light" ? Dt : Mt;
     return y[m] || y.info;
-  })(p), l = ht[i] ? i : "BR", x = ((m) => {
-    if (F[m]) return F[m];
+  })(p), d = ut[i] ? i : "BR", h = ((m) => {
+    if (W[m]) return W[m];
     const y = document.createElement("div");
     y.className = `wox-toast-container wox-toast-container-${m}`;
-    const _t = ht[m];
-    return Object.assign(y.style, _t), m.startsWith("B") && (y.style.flexDirection = "column-reverse"), document.body.appendChild(y), F[m] = y, y;
-  })(l), d = document.createElement("div");
-  d.className = `wox-toast wox-toast-${p}`, d.style.backgroundColor = a.bg, d.style.borderLeftColor = a.border, d.style.color = a.text;
-  let u = `
-		<span class="wox-toast-icon" style="color:${a.icon}">${xt[p] || xt.info}</span>
+    const N = ut[m];
+    return Object.assign(y.style, N), m.startsWith("B") && (y.style.flexDirection = "column-reverse"), document.body.appendChild(y), W[m] = y, y;
+  })(d), l = document.createElement("div");
+  l.className = `wox-toast wox-toast-${p}`, l.style.backgroundColor = a.bg, l.style.borderLeftColor = a.border, l.style.color = a.text;
+  let g = `
+		<span class="wox-toast-icon" style="color:${a.icon}">${gt[p] || gt.info}</span>
 		<span class="wox-toast-message">${c}</span>
 	`;
-  if (o && (u += '<button class="wox-toast-close" aria-label="Close">&times;</button>'), d.innerHTML = u, o) {
-    const m = d.querySelector(".wox-toast-close");
+  if (o && (g += '<button class="wox-toast-close" aria-label="Close">&times;</button>'), l.innerHTML = g, o) {
+    const m = l.querySelector(".wox-toast-close");
     m && (m.addEventListener("mouseenter", () => {
       m.style.color = a.icon;
     }), m.addEventListener("mouseleave", () => {
       m.style.color = r ? "#999" : "#666";
     }));
   }
-  let h = null;
-  n > 0 && (h = document.createElement("div"), h.className = "wox-toast-progress", h.style.backgroundColor = a.progress, h.style.width = "100%", d.appendChild(h));
-  const v = Et[l];
-  d.animate([{ transform: v, opacity: 0 }, { transform: "translateX(0) translateY(0)", opacity: 1 }], { duration: 300, easing: "cubic-bezier(.22,1,.36,1)", fill: "forwards" }), x.appendChild(d);
-  let b = null, g = n, f = 0, k = null;
-  const E = () => {
-    n <= 0 || (f = Date.now(), h && (k = h.animate([{ width: h.style.width }, { width: "0%" }], { duration: g, easing: "linear", fill: "forwards" })), b = setTimeout(() => z(), g));
+  let x = null;
+  n > 0 && (x = document.createElement("div"), x.className = "wox-toast-progress", x.style.backgroundColor = a.progress, x.style.width = "100%", l.appendChild(x));
+  const f = St[d];
+  l.animate([{ transform: f, opacity: 0 }, { transform: "translateX(0) translateY(0)", opacity: 1 }], { duration: 300, easing: "cubic-bezier(.22,1,.36,1)", fill: "forwards" }), h.appendChild(l);
+  let b = null, u = n, v = 0, k = null;
+  const A = () => {
+    n <= 0 || (v = Date.now(), x && (k = x.animate([{ width: x.style.width }, { width: "0%" }], { duration: u, easing: "linear", fill: "forwards" })), b = setTimeout(() => z(), u));
   }, z = () => {
-    N.delete(e), b && (clearTimeout(b), b = null), k && k.cancel(), d.animate([{ transform: "translateX(0) translateY(0)", opacity: 1 }, { transform: v, opacity: 0 }], { duration: 300, easing: "cubic-bezier(.22,1,.36,1)", fill: "forwards" }).onfinish = () => {
-      const m = d.offsetHeight;
-      d.style.minHeight = "0", d.style.padding = "0", d.style.margin = "0", d.style.overflow = "hidden", d.animate([{ height: `${m}px` }, { height: "0px" }], { duration: 200, easing: "ease" }).onfinish = () => d.remove();
+    B.delete(e), b && (clearTimeout(b), b = null), k && k.cancel(), l.animate([{ transform: "translateX(0) translateY(0)", opacity: 1 }, { transform: f, opacity: 0 }], { duration: 300, easing: "cubic-bezier(.22,1,.36,1)", fill: "forwards" }).onfinish = () => {
+      const m = l.offsetHeight;
+      l.style.minHeight = "0", l.style.padding = "0", l.style.margin = "0", l.style.overflow = "hidden", l.animate([{ height: `${m}px` }, { height: "0px" }], { duration: 200, easing: "ease" }).onfinish = () => l.remove();
     };
   };
-  if (d.addEventListener("mouseenter", () => {
+  if (l.addEventListener("mouseenter", () => {
     b && (clearTimeout(b), b = null), k && k.pause();
-    const m = Date.now() - f;
-    if (g = Math.max(g - m, 0), h && k) {
-      const y = n > 0 ? g / n * 100 : 0;
-      h.style.width = `${y}%`;
+    const m = Date.now() - v;
+    if (u = Math.max(u - m, 0), x && k) {
+      const y = n > 0 ? u / n * 100 : 0;
+      x.style.width = `${y}%`;
     }
-  }), d.addEventListener("mouseleave", E), o) {
-    const m = d.querySelector(".wox-toast-close");
+  }), l.addEventListener("mouseleave", A), o) {
+    const m = l.querySelector(".wox-toast-close");
     m && m.addEventListener("click", z);
   }
-  E();
+  A();
 };
-class L extends w {
+class S extends w {
 }
-s(L, "success", (c, t) => D("success", c, t)), s(L, "error", (c, t) => D("error", c, t)), s(L, "warning", (c, t) => D("warning", c, t)), s(L, "info", (c, t) => D("info", c, t));
+s(S, "success", (c, t) => R("success", c, t)), s(S, "error", (c, t) => R("error", c, t)), s(S, "warning", (c, t) => R("warning", c, t)), s(S, "info", (c, t) => R("info", c, t));
 const _ = class _ extends w {
 };
 s(_, "_el", null), s(_, "_listenersReady", !1), s(_, "show", (c, t) => {
@@ -2050,12 +2068,12 @@ s(_, "_el", null), s(_, "_listenersReady", !1), s(_, "show", (c, t) => {
 }), s(_, "_onKeyDown", (c) => {
   c.key === "Escape" && _.hide();
 });
-let O = _;
-const A = (p) => {
+let T = _;
+const C = (p) => {
   if (!p || !p.stops || p.stops.length < 2) return "";
   const c = [...p.stops].sort((t, e) => t.position - e.position).map((t) => `${t.color} ${t.position}%`).join(", ");
   return p.type === "linear" ? `linear-gradient(${p.angle}deg, ${c})` : `radial-gradient(circle, ${c})`;
-}, gt = (p) => {
+}, wt = (p) => {
   if (!p) return null;
   let c = null, t = 90, e = null;
   const n = p.match(/^linear-gradient\(\s*(\d+)deg\s*,\s*(.+)\)$/i);
@@ -2069,7 +2087,7 @@ const A = (p) => {
   for (; (r = i.exec(e)) !== null; ) o.push({ color: r[1], position: parseFloat(r[2]) });
   return o.length < 2 ? null : { type: c, angle: t, stops: o };
 };
-class mt extends w {
+class _t extends w {
   constructor() {
     super(...arguments);
     s(this, "_gradient", null);
@@ -2077,7 +2095,7 @@ class mt extends w {
     s(this, "_justDragged", !1);
     s(this, "_build", () => {
       if (!this._gradient) return;
-      const t = A(this._gradient);
+      const t = C(this._gradient);
       this.render(`
     :host { display: block; }
     .editor { padding: var(--wox-space-md, 8px) 0; }
@@ -2111,10 +2129,10 @@ class mt extends w {
     });
     s(this, "_updatePreview", () => {
       const t = this.$(".bar");
-      t && (t.style.background = A(this._gradient));
+      t && (t.style.background = C(this._gradient));
     });
     s(this, "_emitGradient", (t) => {
-      this.emit(t, { gradient: this.gradient, css: A(this._gradient) });
+      this.emit(t, { gradient: this.gradient, css: C(this._gradient) });
     });
     s(this, "_renderStops", () => {
       const t = this.$(".stops");
@@ -2134,30 +2152,30 @@ class mt extends w {
           r.preventDefault(), r.stopPropagation();
           const a = this.$(".bar");
           if (!a) return;
-          const l = a.getBoundingClientRect(), x = parseInt(o.dataset.index, 10);
-          this._dragging = { idx: x, startY: r.clientY }, o.classList.add("dragging");
-          const d = (h) => {
-            const v = (h.clientX - l.left) / l.width * 100, b = Math.max(0, Math.min(100, Math.round(10 * v) / 10));
-            this._gradient.stops[x].position = b, o.style.left = b + "%", Math.abs(h.clientY - this._dragging.startY) > 40 && this._gradient.stops.length > 2 ? o.classList.add("removing") : o.classList.remove("removing"), this._updatePreview(), this._emitGradient("wox-gradient-input");
-          }, u = (h) => {
-            var g;
-            document.removeEventListener("mousemove", d), document.removeEventListener("mouseup", u), o.classList.remove("dragging");
-            const v = Math.abs(h.clientY - this._dragging.startY);
-            v > 40 && this._gradient.stops.length > 2 ? (this._gradient.stops.splice(x, 1), this._renderStops(), this._updatePreview(), this._emitGradient("wox-gradient-change")) : this._emitGradient("wox-gradient-change");
-            const b = Math.abs(h.clientX - (l.left + (((g = this._gradient.stops[x]) == null ? void 0 : g.position) || 0) * l.width / 100));
-            (v > 3 || b > 3) && (this._justDragged = !0), this._dragging = null;
+          const d = a.getBoundingClientRect(), h = parseInt(o.dataset.index, 10);
+          this._dragging = { idx: h, startY: r.clientY }, o.classList.add("dragging");
+          const l = (x) => {
+            const f = (x.clientX - d.left) / d.width * 100, b = Math.max(0, Math.min(100, Math.round(10 * f) / 10));
+            this._gradient.stops[h].position = b, o.style.left = b + "%", Math.abs(x.clientY - this._dragging.startY) > 40 && this._gradient.stops.length > 2 ? o.classList.add("removing") : o.classList.remove("removing"), this._updatePreview(), this._emitGradient("wox-gradient-input");
+          }, g = (x) => {
+            var u;
+            document.removeEventListener("mousemove", l), document.removeEventListener("mouseup", g), o.classList.remove("dragging");
+            const f = Math.abs(x.clientY - this._dragging.startY);
+            f > 40 && this._gradient.stops.length > 2 ? (this._gradient.stops.splice(h, 1), this._renderStops(), this._updatePreview(), this._emitGradient("wox-gradient-change")) : this._emitGradient("wox-gradient-change");
+            const b = Math.abs(x.clientX - (d.left + (((u = this._gradient.stops[h]) == null ? void 0 : u.position) || 0) * d.width / 100));
+            (f > 3 || b > 3) && (this._justDragged = !0), this._dragging = null;
           };
-          document.addEventListener("mousemove", d), document.addEventListener("mouseup", u);
+          document.addEventListener("mousemove", l), document.addEventListener("mouseup", g);
         }), t.appendChild(o);
       }));
     });
     s(this, "_bindBarEvents", () => {
       const t = this.$(".bar");
       t && t.addEventListener("dblclick", (e) => {
-        const n = t.getBoundingClientRect(), o = Math.round((e.clientX - n.left) / n.width * 100), i = Math.max(0, Math.min(100, o)), r = [...this._gradient.stops].sort((l, x) => l.position - x.position);
+        const n = t.getBoundingClientRect(), o = Math.round((e.clientX - n.left) / n.width * 100), i = Math.max(0, Math.min(100, o)), r = [...this._gradient.stops].sort((d, h) => d.position - h.position);
         let a = "#888888";
-        for (let l = 0; l < r.length - 1; l++) if (i >= r[l].position && i <= r[l + 1].position) {
-          a = r[l].color;
+        for (let d = 0; d < r.length - 1; d++) if (i >= r[d].position && i <= r[d + 1].position) {
+          a = r[d].color;
           break;
         }
         this._gradient.stops.push({ color: a, position: i }), this._renderStops(), this._updatePreview(), this._emitGradient("wox-gradient-change");
@@ -2174,8 +2192,8 @@ class mt extends w {
     return this._gradient ? JSON.parse(JSON.stringify(this._gradient)) : null;
   }
 }
-const Lt = [{ id: "grad_preset_sunset", name: "Sunset", type: "linear", angle: 135, stops: [{ color: "#ff512f", position: 0 }, { color: "#f09819", position: 100 }] }, { id: "grad_preset_ocean", name: "Ocean", type: "linear", angle: 135, stops: [{ color: "#2193b0", position: 0 }, { color: "#6dd5ed", position: 100 }] }, { id: "grad_preset_forest", name: "Forest", type: "linear", angle: 135, stops: [{ color: "#11998e", position: 0 }, { color: "#38ef7d", position: 100 }] }, { id: "grad_preset_purple_haze", name: "Purple Haze", type: "linear", angle: 135, stops: [{ color: "#7b4397", position: 0 }, { color: "#dc2430", position: 100 }] }, { id: "grad_preset_midnight", name: "Midnight", type: "linear", angle: 135, stops: [{ color: "#232526", position: 0 }, { color: "#414345", position: 100 }] }, { id: "grad_preset_peach", name: "Peach", type: "linear", angle: 135, stops: [{ color: "#ffecd2", position: 0 }, { color: "#fcb69f", position: 100 }] }], R = () => "grad_" + Date.now().toString(36) + "_" + Math.random().toString(36).slice(2, 7), bt = (p) => !!p && (p.startsWith("linear-gradient") || p.startsWith("radial-gradient"));
-class ct extends w {
+const Rt = [{ id: "grad_preset_sunset", name: "Sunset", type: "linear", angle: 135, stops: [{ color: "#ff512f", position: 0 }, { color: "#f09819", position: 100 }] }, { id: "grad_preset_ocean", name: "Ocean", type: "linear", angle: 135, stops: [{ color: "#2193b0", position: 0 }, { color: "#6dd5ed", position: 100 }] }, { id: "grad_preset_forest", name: "Forest", type: "linear", angle: 135, stops: [{ color: "#11998e", position: 0 }, { color: "#38ef7d", position: 100 }] }, { id: "grad_preset_purple_haze", name: "Purple Haze", type: "linear", angle: 135, stops: [{ color: "#7b4397", position: 0 }, { color: "#dc2430", position: 100 }] }, { id: "grad_preset_midnight", name: "Midnight", type: "linear", angle: 135, stops: [{ color: "#232526", position: 0 }, { color: "#414345", position: 100 }] }, { id: "grad_preset_peach", name: "Peach", type: "linear", angle: 135, stops: [{ color: "#ffecd2", position: 0 }, { color: "#fcb69f", position: 100 }] }], I = () => "grad_" + Date.now().toString(36) + "_" + Math.random().toString(36).slice(2, 7), vt = (p) => !!p && (p.startsWith("linear-gradient") || p.startsWith("radial-gradient"));
+class ht extends w {
   constructor() {
     super(...arguments);
     s(this, "_value", "#ffffff");
@@ -2188,7 +2206,7 @@ class ct extends w {
     s(this, "_editingName", "");
     s(this, "_syncFromAttributes", () => {
       const t = this.getAttribute("value");
-      t && (this._value = t, this._gradient = bt(t) ? gt(t) : null);
+      t && (this._value = t, this._gradient = vt(t) ? wt(t) : null);
       const e = this.getAttribute("animation-speed");
       e !== null && (this._animationSpeed = parseInt(e, 10) || 0);
       const n = this.getAttribute("animation-type");
@@ -2200,7 +2218,7 @@ class ct extends w {
         if (t) return void (this._gradients = JSON.parse(t));
       } catch {
       }
-      this._gradients = Lt.map((t) => ({ ...t, stops: t.stops.map((e) => ({ ...e })) })), this._persistGradients();
+      this._gradients = Rt.map((t) => ({ ...t, stops: t.stops.map((e) => ({ ...e })) })), this._persistGradients();
     });
     s(this, "_persistGradients", () => {
       try {
@@ -2218,8 +2236,8 @@ class ct extends w {
     s(this, "_getById", (t) => this._gradients.find((e) => e.id === t));
     s(this, "_labelForValue", (t) => {
       if (!t) return "None";
-      if (bt(t)) {
-        for (const e of this._gradients) if (A(e) === t) return e.name;
+      if (vt(t)) {
+        for (const e of this._gradients) if (C(e) === t) return e.name;
         return "Custom Gradient";
       }
       return t;
@@ -2368,8 +2386,8 @@ class ct extends w {
       if (!this._gradient) return void t.classList.remove("visible");
       t.classList.add("visible");
       const e = this._gradient.type !== "radial";
-      this.$$(".type-btn").forEach((l) => {
-        l.classList.toggle("active", l.dataset.type === this._gradient.type);
+      this.$$(".type-btn").forEach((d) => {
+        d.classList.toggle("active", d.dataset.type === this._gradient.type);
       });
       const n = this.$(".angle-row");
       n && (n.style.display = e ? "" : "none");
@@ -2383,35 +2401,35 @@ class ct extends w {
       a && (a.value = this._animationType);
     });
     s(this, "_bindEvents", () => {
-      this.$(".current").addEventListener("click", (d) => {
-        d.stopPropagation(), this._open ? this._closeDropdown() : this._openDropdown();
-      }), this.$$(".type-btn").forEach((d) => {
-        d.addEventListener("click", () => {
+      this.$(".current").addEventListener("click", (l) => {
+        l.stopPropagation(), this._open ? this._closeDropdown() : this._openDropdown();
+      }), this.$$(".type-btn").forEach((l) => {
+        l.addEventListener("click", () => {
           if (!this._gradient) return;
-          this.$$(".type-btn").forEach((h) => h.classList.remove("active")), d.classList.add("active"), this._gradient.type = d.dataset.type;
-          const u = this.$(".angle-row");
-          u && (u.style.display = d.dataset.type === "linear" ? "" : "none"), this._applyGradient();
+          this.$$(".type-btn").forEach((x) => x.classList.remove("active")), l.classList.add("active"), this._gradient.type = l.dataset.type;
+          const g = this.$(".angle-row");
+          g && (g.style.display = l.dataset.type === "linear" ? "" : "none"), this._applyGradient();
         });
       });
       const t = this.$(".angle-row wox-slider");
-      t && (t.addEventListener("wox-input", (d) => {
-        this._gradient && (this._gradient.angle = d.detail.value, this._applyGradient());
-      }), t.addEventListener("wox-change", (d) => {
-        this._gradient && (this._gradient.angle = d.detail.value, this._applyGradient());
+      t && (t.addEventListener("wox-input", (l) => {
+        this._gradient && (this._gradient.angle = l.detail.value, this._applyGradient());
+      }), t.addEventListener("wox-change", (l) => {
+        this._gradient && (this._gradient.angle = l.detail.value, this._applyGradient());
       }));
       const e = this.$(".speed-row wox-slider");
-      e && (e.addEventListener("wox-input", (d) => {
-        this._animationSpeed = d.detail.value;
-        const u = this.$(".anim-type-row");
-        u && (u.style.display = this._animationSpeed > 0 ? "" : "none"), this._emitChange();
-      }), e.addEventListener("wox-change", (d) => {
-        this._animationSpeed = d.detail.value;
-        const u = this.$(".anim-type-row");
-        u && (u.style.display = this._animationSpeed > 0 ? "" : "none"), this._emitChange();
+      e && (e.addEventListener("wox-input", (l) => {
+        this._animationSpeed = l.detail.value;
+        const g = this.$(".anim-type-row");
+        g && (g.style.display = this._animationSpeed > 0 ? "" : "none"), this._emitChange();
+      }), e.addEventListener("wox-change", (l) => {
+        this._animationSpeed = l.detail.value;
+        const g = this.$(".anim-type-row");
+        g && (g.style.display = this._animationSpeed > 0 ? "" : "none"), this._emitChange();
       }));
       const n = this.$(".anim-select");
-      n && n.addEventListener("change", (d) => {
-        this._animationType = d.target.value, this._emitChange();
+      n && n.addEventListener("change", (l) => {
+        this._animationType = l.target.value, this._emitChange();
       });
       const o = this.$(".cancel-btn");
       o && o.addEventListener("click", () => {
@@ -2426,17 +2444,17 @@ class ct extends w {
         this._applyFromEditor(!0);
       });
       const a = this.$(".name-input");
-      a && a.addEventListener("input", (d) => {
-        this._editingName = d.target.value.trim();
+      a && a.addEventListener("input", (l) => {
+        this._editingName = l.target.value.trim();
       });
-      const l = this.$(".modal-editor");
-      l && (l.addEventListener("wox-gradient-input", (d) => {
-        this._editingGradient = d.detail.gradient;
-      }), l.addEventListener("wox-gradient-change", (d) => {
-        this._editingGradient = d.detail.gradient;
+      const d = this.$(".modal-editor");
+      d && (d.addEventListener("wox-gradient-input", (l) => {
+        this._editingGradient = l.detail.gradient;
+      }), d.addEventListener("wox-gradient-change", (l) => {
+        this._editingGradient = l.detail.gradient;
       }));
-      const x = this.$(".editor-modal");
-      x && x.addEventListener("wox-close", () => {
+      const h = this.$(".editor-modal");
+      h && h.addEventListener("wox-close", () => {
         this._editingGradient = null, this._editingName = "";
       });
     });
@@ -2466,14 +2484,14 @@ class ct extends w {
                 <input type="color" class="solid-input" value="${n}">
             </div>
         `, this._gradients.forEach((o) => {
-        const i = A(o), r = o.id.startsWith("grad_preset_"), a = r ? `<button class="dropdown-item-btn" data-dup-id="${o.id}" title="Duplicate gradient">&#x2398;</button>` : "", l = r ? "" : `<button class="dropdown-item-btn" data-edit-id="${o.id}" title="Edit gradient">&#9998;</button>`, x = r ? "" : `<button class="dropdown-item-btn delete-btn" data-delete-id="${o.id}" title="Delete gradient">&times;</button>`;
+        const i = C(o), r = o.id.startsWith("grad_preset_"), a = r ? `<button class="dropdown-item-btn" data-dup-id="${o.id}" title="Duplicate gradient">&#x2398;</button>` : "", d = r ? "" : `<button class="dropdown-item-btn" data-edit-id="${o.id}" title="Edit gradient">&#9998;</button>`, h = r ? "" : `<button class="dropdown-item-btn delete-btn" data-delete-id="${o.id}" title="Delete gradient">&times;</button>`;
         e += `
                 <div class="dropdown-item" data-gradient-id="${o.id}">
                     <div class="dropdown-item-preview" style="background: ${i}"></div>
                     <span class="dropdown-item-label">${o.name}</span>
                     ${a}
-                    ${l}
-                    ${x}
+                    ${d}
+                    ${h}
                 </div>
             `;
       }), e += `
@@ -2496,15 +2514,15 @@ class ct extends w {
         i.addEventListener("click", (r) => {
           if (r.target.hasAttribute("data-delete-id") || r.target.hasAttribute("data-edit-id") || r.target.hasAttribute("data-dup-id")) return;
           const a = this._getById(i.dataset.gradientId);
-          a && (this._gradient = JSON.parse(JSON.stringify(a)), this._value = A(this._gradient), this._updatePreview(), this._syncControls(), this._emitChange(), this._closeDropdown());
+          a && (this._gradient = JSON.parse(JSON.stringify(a)), this._value = C(this._gradient), this._updatePreview(), this._syncControls(), this._emitChange(), this._closeDropdown());
         });
       }), t.querySelectorAll("[data-dup-id]").forEach((i) => {
         i.addEventListener("click", (r) => {
           r.stopPropagation();
           const a = this._getById(i.dataset.dupId);
           if (!a) return;
-          const l = { id: R(), name: a.name + " Copy", type: a.type, angle: a.angle, stops: a.stops.map((x) => ({ ...x })) };
-          this._closeDropdown(), this._openEditorDialog(l);
+          const d = { id: I(), name: a.name + " Copy", type: a.type, angle: a.angle, stops: a.stops.map((h) => ({ ...h })) };
+          this._closeDropdown(), this._openEditorDialog(d);
         });
       }), t.querySelectorAll("[data-edit-id]").forEach((i) => {
         i.addEventListener("click", (r) => {
@@ -2524,7 +2542,7 @@ class ct extends w {
     });
     s(this, "_openEditorDialog", (t) => {
       let e;
-      t ? e = JSON.parse(JSON.stringify(t)) : (e = gt(this._value), e ? (e.id = e.id || R(), e.name = e.name || "Custom Gradient") : e = { id: R(), name: "Custom Gradient", type: "linear", angle: 90, stops: [{ color: this._value.startsWith("#") ? this._value : "#000000", position: 0 }, { color: "#ffffff", position: 100 }] }), this._editingGradient = JSON.parse(JSON.stringify(e)), this._editingName = e.name;
+      t ? e = JSON.parse(JSON.stringify(t)) : (e = wt(this._value), e ? (e.id = e.id || I(), e.name = e.name || "Custom Gradient") : e = { id: I(), name: "Custom Gradient", type: "linear", angle: 90, stops: [{ color: this._value.startsWith("#") ? this._value : "#000000", position: 0 }, { color: "#ffffff", position: 100 }] }), this._editingGradient = JSON.parse(JSON.stringify(e)), this._editingName = e.name;
       const n = this.$(".modal-editor");
       n && (n.gradient = this._editingGradient);
       const o = this.$(".name-input");
@@ -2535,14 +2553,14 @@ class ct extends w {
     s(this, "_applyFromEditor", (t) => {
       if (!this._editingGradient) return;
       const e = JSON.parse(JSON.stringify(this._editingGradient));
-      this._editingName && (e.name = this._editingName), e.id = this._editingOriginalId || e.id || R(), t && this._save(e), this._gradient = JSON.parse(JSON.stringify(e)), this._value = A(this._gradient), this._updatePreview(), this._syncControls(), this._emitChange(), this._closeModal();
+      this._editingName && (e.name = this._editingName), e.id = this._editingOriginalId || e.id || I(), t && this._save(e), this._gradient = JSON.parse(JSON.stringify(e)), this._value = C(this._gradient), this._updatePreview(), this._syncControls(), this._emitChange(), this._closeModal();
     });
     s(this, "_closeModal", () => {
       const t = this.$(".editor-modal");
       t && t.removeAttribute("open"), this._editingGradient = null, this._editingName = "", this._editingOriginalId = null;
     });
     s(this, "_applyGradient", () => {
-      this._gradient && (this._value = A(this._gradient), this._updatePreview(), this._emitChange());
+      this._gradient && (this._value = C(this._gradient), this._updatePreview(), this._emitChange());
     });
     s(this, "_emitChange", () => {
       this.emit("wox-gradient-change", { value: this._value, animationSpeed: this._animationSpeed, animationType: this._animationType });
@@ -2560,9 +2578,9 @@ class ct extends w {
     this.isConnected && (this._syncFromAttributes(), this._updatePreview(), this._syncControls());
   }
 }
-s(ct, "observedAttributes", ["value", "animation-speed", "animation-type"]);
-const St = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], Mt = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
-class pt extends w {
+s(ht, "observedAttributes", ["value", "animation-speed", "animation-type"]);
+const It = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], Ot = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+class xt extends w {
   constructor() {
     super(...arguments);
     s(this, "_currentDate", /* @__PURE__ */ new Date());
@@ -2576,14 +2594,14 @@ class pt extends w {
       this._currentDate = new Date(t, this._currentDate.getMonth(), 1), this._render();
     });
     s(this, "_goToday", () => {
-      const t = /* @__PURE__ */ new Date(), e = wt(t);
+      const t = /* @__PURE__ */ new Date(), e = mt(t);
       this._currentDate = new Date(t.getFullYear(), t.getMonth(), 1), this.rangeMode ? this._selectedRange = { start: e, end: null } : (this._selectedDate = e, this.emit("wox-change", { date: e })), this._render();
     });
     s(this, "_handleDayClick", (t) => {
       const e = t.dataset.date;
       if (e) {
         if (t.classList.contains("other-month")) {
-          const n = I(e);
+          const n = O(e);
           this._currentDate = new Date(n.getFullYear(), n.getMonth(), 1);
         }
         this.rangeMode ? this._handleRangeSelection(e) : (this._selectedDate = e, this.emit("wox-change", { date: e }), this._render());
@@ -2609,21 +2627,21 @@ class pt extends w {
       return e;
     });
     s(this, "_generateGrid", (t, e) => {
-      const n = /* @__PURE__ */ new Date(), o = wt(n), i = new Date(t, e, 1).getDay(), r = new Date(t, e + 1, 0).getDate();
+      const n = /* @__PURE__ */ new Date(), o = mt(n), i = new Date(t, e, 1).getDay(), r = new Date(t, e + 1, 0).getDate();
       let a = "";
-      const l = e === 0 ? t - 1 : t, x = e === 0 ? 11 : e - 1, d = new Date(l, x + 1, 0).getDate();
+      const d = e === 0 ? t - 1 : t, h = e === 0 ? 11 : e - 1, l = new Date(d, h + 1, 0).getDate();
       for (let b = i - 1; b >= 0; b--) {
-        const g = d - b;
-        a += `<div class="day-cell other-month" data-date="${B(l, x, g)}">${g}</div>`;
+        const u = l - b;
+        a += `<div class="day-cell other-month" data-date="${H(d, h, u)}">${u}</div>`;
       }
       for (let b = 1; b <= r; b++) {
-        const g = B(t, e, b);
-        let f = "day-cell";
-        g === o && (f += " today"), this.rangeMode ? this._selectedRange.start && g === this._selectedRange.start ? f += " range-start" : this._selectedRange.end && g === this._selectedRange.end ? f += " range-end" : Dt(g, this._selectedRange.start, this._selectedRange.end) && (f += " in-range") : this._selectedDate && g === this._selectedDate && (f += " selected"), a += `<div class="${f}" data-date="${g}">${b}</div>`;
+        const u = H(t, e, b);
+        let v = "day-cell";
+        u === o && (v += " today"), this.rangeMode ? this._selectedRange.start && u === this._selectedRange.start ? v += " range-start" : this._selectedRange.end && u === this._selectedRange.end ? v += " range-end" : Tt(u, this._selectedRange.start, this._selectedRange.end) && (v += " in-range") : this._selectedDate && u === this._selectedDate && (v += " selected"), a += `<div class="${v}" data-date="${u}">${b}</div>`;
       }
-      const u = 7 * Math.ceil((i + r) / 7), h = e === 11 ? t + 1 : t, v = e === 11 ? 0 : e + 1;
-      for (let b = 1; b <= u - i - r; b++)
-        a += `<div class="day-cell other-month" data-date="${B(h, v, b)}">${b}</div>`;
+      const g = 7 * Math.ceil((i + r) / 7), x = e === 11 ? t + 1 : t, f = e === 11 ? 0 : e + 1;
+      for (let b = 1; b <= g - i - r; b++)
+        a += `<div class="day-cell other-month" data-date="${H(x, f, b)}">${b}</div>`;
       return a;
     });
     s(this, "_getModeHint", () => this.rangeMode ? this._selectedRange.start ? this._selectedRange.end ? `${this._selectedRange.start} → ${this._selectedRange.end}` : "Select end date" : "Select start date" : "Select a date");
@@ -2832,13 +2850,13 @@ class pt extends w {
             <div class="header">
                 <button class="nav-btn" id="prev-month">&#8249;</button>
                 <div class="month-year">
-                    ${St[e]}
+                    ${It[e]}
                     <select class="year-select">${this._generateYearOptions(t)}</select>
                 </div>
                 <button class="nav-btn" id="next-month">&#8250;</button>
             </div>
             <div class="day-headers">
-                ${Mt.map((n) => `<div class="day-header">${n}</div>`).join("")}
+                ${Ot.map((n) => `<div class="day-header">${n}</div>`).join("")}
             </div>
             <div class="calendar-grid">
                 ${this._generateGrid(t, e)}
@@ -2879,7 +2897,7 @@ class pt extends w {
       if (t === "range-mode") this._selectedDate = null, this._selectedRange = { start: null, end: null };
       else if (t === "value" && n !== null) {
         this._selectedDate = n;
-        const o = I(n);
+        const o = O(n);
         isNaN(o) || (this._currentDate = new Date(o.getFullYear(), o.getMonth(), 1));
       } else t === "range-start" ? this._selectedRange.start = n : t === "range-end" && (this._selectedRange.end = n);
       this._render();
@@ -2900,13 +2918,13 @@ class pt extends w {
   setDate(t) {
     if (this.rangeMode) return;
     this._selectedDate = t;
-    const e = I(t);
+    const e = O(t);
     isNaN(e) || (this._currentDate = new Date(e.getFullYear(), e.getMonth(), 1)), this._render();
   }
   setRange(t, e) {
     if (!this.rangeMode) return;
     this._selectedRange = { start: t, end: e };
-    const n = I(t);
+    const n = O(t);
     this._currentDate = new Date(n.getFullYear(), n.getMonth(), 1), this._render();
   }
   getSelectedDate() {
@@ -2919,40 +2937,40 @@ class pt extends w {
     this._selectedDate = null, this._selectedRange = { start: null, end: null }, this._render();
   }
 }
-s(pt, "observedAttributes", ["range-mode", "value", "range-start", "range-end", "disabled"]);
-const wt = (p) => `${p.getFullYear()}-${String(p.getMonth() + 1).padStart(2, "0")}-${String(p.getDate()).padStart(2, "0")}`, I = (p) => {
+s(xt, "observedAttributes", ["range-mode", "value", "range-start", "range-end", "disabled"]);
+const mt = (p) => `${p.getFullYear()}-${String(p.getMonth() + 1).padStart(2, "0")}-${String(p.getDate()).padStart(2, "0")}`, O = (p) => {
   const [c, t, e] = p.split("-").map(Number);
   return new Date(c, t - 1, e);
-}, B = (p, c, t) => `${p}-${String(c + 1).padStart(2, "0")}-${String(t).padStart(2, "0")}`, Dt = (p, c, t) => !(!c || !t) && p > c && p < t, W = "woxTheme", C = class C {
+}, H = (p, c, t) => `${p}-${String(c + 1).padStart(2, "0")}-${String(t).padStart(2, "0")}`, Tt = (p, c, t) => !(!c || !t) && p > c && p < t, j = "woxTheme", E = class E {
 };
-s(C, "get", () => document.documentElement.dataset[W] === "light" ? "light" : "dark"), s(C, "set", (c) => {
+s(E, "get", () => document.documentElement.dataset[j] === "light" ? "light" : "dark"), s(E, "set", (c) => {
   if (c === "dark" || c === "light") {
-    c === "light" ? document.documentElement.dataset[W] = "light" : delete document.documentElement.dataset[W];
+    c === "light" ? document.documentElement.dataset[j] = "light" : delete document.documentElement.dataset[j];
     try {
       localStorage.setItem("wox-theme", c);
     } catch {
     }
     document.documentElement.dispatchEvent(new CustomEvent("wox-theme-change", { detail: { theme: c }, bubbles: !0, composed: !0 }));
   }
-}), s(C, "toggle", () => {
-  C.set(C.get() === "dark" ? "light" : "dark");
-}), s(C, "auto", () => {
+}), s(E, "toggle", () => {
+  E.set(E.get() === "dark" ? "light" : "dark");
+}), s(E, "auto", () => {
   try {
     const t = localStorage.getItem("wox-theme");
-    if (t === "dark" || t === "light") return void C.set(t);
+    if (t === "dark" || t === "light") return void E.set(t);
   } catch {
   }
   const c = window.matchMedia("(prefers-color-scheme: light)").matches;
-  C.set(c ? "light" : "dark");
+  E.set(c ? "light" : "dark");
 });
-let S = C;
-class ft extends w {
+let M = E;
+class yt extends w {
   constructor() {
     super(...arguments);
     s(this, "_onThemeChange", null);
   }
   connectedCallback() {
-    this._render(), this.hasAttribute("auto") && S.auto(), this._onThemeChange = () => this._updateIcon(), document.documentElement.addEventListener("wox-theme-change", this._onThemeChange), this._updateIcon();
+    this._render(), this.hasAttribute("auto") && M.auto(), this._onThemeChange = () => this._updateIcon(), document.documentElement.addEventListener("wox-theme-change", this._onThemeChange), this._updateIcon();
   }
   disconnectedCallback() {
     this._onThemeChange && (document.documentElement.removeEventListener("wox-theme-change", this._onThemeChange), this._onThemeChange = null);
@@ -2992,17 +3010,17 @@ class ft extends w {
         -webkit-font-smoothing: antialiased;
         text-rendering: optimizeLegibility;
     }
-`, '<button type="button" title="Toggle theme"><span class="icon">light_mode</span></button>'), this.$("button").addEventListener("click", () => S.toggle());
+`, '<button type="button" title="Toggle theme"><span class="icon">light_mode</span></button>'), this.$("button").addEventListener("click", () => M.toggle());
   }
   _updateIcon() {
     const t = this.$(".icon");
     if (!t) return;
-    const e = S.get() === "dark";
+    const e = M.get() === "dark";
     t.textContent = e ? "light_mode" : "dark_mode", this.$("button").title = e ? "Switch to light mode" : "Switch to dark mode";
   }
 }
-customElements.define("wox-icon", H), customElements.define("wox-separator", j), customElements.define("wox-badge", G), customElements.define("wox-button", Y), customElements.define("wox-input", X), customElements.define("wox-select", q), customElements.define("wox-slider", J), customElements.define("wox-color-swatch", K), customElements.define("wox-tooltip", V), customElements.define("wox-color-picker", U), customElements.define("wox-menu-item", Q), customElements.define("wox-menu", Z), customElements.define("wox-layer-item", tt), customElements.define("wox-section", et), customElements.define("wox-tab", nt), customElements.define("wox-tabs", ot), customElements.define("wox-toolbar-group", it), customElements.define("wox-toolbar", st), customElements.define("wox-panel", rt), customElements.define("wox-menubar", at), customElements.define("wox-statusbar", dt), customElements.define("wox-modal", lt), customElements.define("wox-datagrid", vt), customElements.define("wox-toast", L), customElements.define("wox-context-menu", O), customElements.define("wox-gradient-editor", mt), customElements.define("wox-gradient-selector", ct), customElements.define("wox-date-picker", pt), customElements.define("wox-theme-toggle", ft);
-const Rt = `/* wox-theme.css — Global CSS custom properties for the WOX component library */
+customElements.define("wox-icon", G), customElements.define("wox-separator", Y), customElements.define("wox-badge", X), customElements.define("wox-button", q), customElements.define("wox-input", J), customElements.define("wox-select", K), customElements.define("wox-slider", V), customElements.define("wox-color-swatch", U), customElements.define("wox-tooltip", Q), customElements.define("wox-color-picker", Z), customElements.define("wox-menu-item", tt), customElements.define("wox-menu", et), customElements.define("wox-layer-item", nt), customElements.define("wox-section", ot), customElements.define("wox-tab", it), customElements.define("wox-tabs", st), customElements.define("wox-toolbar-group", rt), customElements.define("wox-toolbar", at), customElements.define("wox-panel", dt), customElements.define("wox-menubar", lt), customElements.define("wox-statusbar", ct), customElements.define("wox-modal", pt), customElements.define("wox-datagrid", ft), customElements.define("wox-toast", S), customElements.define("wox-context-menu", T), customElements.define("wox-gradient-editor", _t), customElements.define("wox-gradient-selector", ht), customElements.define("wox-date-picker", xt), customElements.define("wox-theme-toggle", yt);
+const Pt = `/* wox-theme.css — Global CSS custom properties for the WOX component library */
 :root {
     --wox-bg-app: #121214;
     --wox-bg-panel: #17171a;
@@ -3088,41 +3106,41 @@ const Rt = `/* wox-theme.css — Global CSS custom properties for the WOX compon
 (() => {
   if (document.getElementById("wox-theme")) return;
   const p = document.createElement("style");
-  p.id = "wox-theme", p.textContent = Rt, document.head.appendChild(p);
-})(), window.WoxIcon = H, window.WoxSeparator = j, window.WoxBadge = G, window.WoxButton = Y, window.WoxInput = X, window.WoxSelect = q, window.WoxSlider = J, window.WoxColorSwatch = K, window.WoxTooltip = V, window.WoxColorPicker = U, window.WoxMenuItem = Q, window.WoxMenu = Z, window.WoxLayerItem = tt, window.WoxSection = et, window.WoxTab = nt, window.WoxTabs = ot, window.WoxToolbarGroup = it, window.WoxToolbar = st, window.WoxPanel = rt, window.WoxMenubar = at, window.WoxStatusbar = dt, window.WoxModal = lt, window.WoxDatagrid = vt, window.WoxToast = L, window.WoxContextMenu = O, window.WoxGradientEditor = mt, window.WoxGradientSelector = ct, window.WoxDatePicker = pt, window.WoxThemeToggle = ft;
+  p.id = "wox-theme", p.textContent = Pt, document.head.appendChild(p);
+})(), window.WoxIcon = G, window.WoxSeparator = Y, window.WoxBadge = X, window.WoxButton = q, window.WoxInput = J, window.WoxSelect = K, window.WoxSlider = V, window.WoxColorSwatch = U, window.WoxTooltip = Q, window.WoxColorPicker = Z, window.WoxMenuItem = tt, window.WoxMenu = et, window.WoxLayerItem = nt, window.WoxSection = ot, window.WoxTab = it, window.WoxTabs = st, window.WoxToolbarGroup = rt, window.WoxToolbar = at, window.WoxPanel = dt, window.WoxMenubar = lt, window.WoxStatusbar = ct, window.WoxModal = pt, window.WoxDatagrid = ft, window.WoxToast = S, window.WoxContextMenu = T, window.WoxGradientEditor = _t, window.WoxGradientSelector = ht, window.WoxDatePicker = xt, window.WoxThemeToggle = yt;
 export {
-  M as FX_STYLES,
-  G as WoxBadge,
-  Y as WoxButton,
-  U as WoxColorPicker,
-  K as WoxColorSwatch,
-  O as WoxContextMenu,
-  vt as WoxDatagrid,
-  pt as WoxDatePicker,
+  D as FX_STYLES,
+  X as WoxBadge,
+  q as WoxButton,
+  Z as WoxColorPicker,
+  U as WoxColorSwatch,
+  T as WoxContextMenu,
+  ft as WoxDatagrid,
+  xt as WoxDatePicker,
   w as WoxElement,
-  mt as WoxGradientEditor,
-  ct as WoxGradientSelector,
-  H as WoxIcon,
-  X as WoxInput,
-  tt as WoxLayerItem,
-  Z as WoxMenu,
-  Q as WoxMenuItem,
-  at as WoxMenubar,
-  lt as WoxModal,
-  rt as WoxPanel,
-  et as WoxSection,
-  q as WoxSelect,
-  j as WoxSeparator,
-  J as WoxSlider,
-  dt as WoxStatusbar,
-  nt as WoxTab,
-  ot as WoxTabs,
-  S as WoxTheme,
-  ft as WoxThemeToggle,
-  L as WoxToast,
-  st as WoxToolbar,
-  it as WoxToolbarGroup,
-  V as WoxTooltip,
-  gt as cssToGradient,
-  A as gradientToCSS
+  _t as WoxGradientEditor,
+  ht as WoxGradientSelector,
+  G as WoxIcon,
+  J as WoxInput,
+  nt as WoxLayerItem,
+  et as WoxMenu,
+  tt as WoxMenuItem,
+  lt as WoxMenubar,
+  pt as WoxModal,
+  dt as WoxPanel,
+  ot as WoxSection,
+  K as WoxSelect,
+  Y as WoxSeparator,
+  V as WoxSlider,
+  ct as WoxStatusbar,
+  it as WoxTab,
+  st as WoxTabs,
+  M as WoxTheme,
+  yt as WoxThemeToggle,
+  S as WoxToast,
+  at as WoxToolbar,
+  rt as WoxToolbarGroup,
+  Q as WoxTooltip,
+  wt as cssToGradient,
+  C as gradientToCSS
 };