next-flow-design 1.5.0 → 1.5.3

package/dist/decorators/safe-register-element.d.ts

@@ -0,0 +1,9 @@
+/**
+ * 自定义装饰器：安全注册 Web Component
+ * 替代 Lit 原生的 @customElement
+ * * 功能：
+ * 1. 检查是否在浏览器环境 (SSR 安全)
+ * 2. 检查 tagName 是否已被注册 (HMR 安全)
+ * 3. 只有未注册时才执行 define
+ */
+export declare const safeRegisterElement: (tagName: string) => (classOrDescriptor: any) => any;

package/dist/index.js

@@ -1,21 +1,16 @@
 import { css as E, LitElement as R, html as f } from "lit";
-const T = (t) => (e, s) => {
-  s !== void 0 ? s.addInitializer(() => {
-    customElements.define(t, e);
-  }) : customElements.define(t, e);
-};
-const Y = globalThis, oe = Y.ShadowRoot && (Y.ShadyCSS === void 0 || Y.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, we = /* @__PURE__ */ Symbol(), ce = /* @__PURE__ */ new WeakMap();
+const Y = globalThis, se = Y.ShadowRoot && (Y.ShadyCSS === void 0 || Y.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, we = /* @__PURE__ */ Symbol(), ce = /* @__PURE__ */ new WeakMap();
 let Se = class {
-  constructor(e, s, o) {
-    if (this._$cssResult$ = !0, o !== we) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
-    this.cssText = e, this.t = s;
+  constructor(e, o, s) {
+    if (this._$cssResult$ = !0, s !== we) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    this.cssText = e, this.t = o;
   }
   get styleSheet() {
     let e = this.o;
-    const s = this.t;
-    if (oe && e === void 0) {
-      const o = s !== void 0 && s.length === 1;
-      o && (e = ce.get(s)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), o && ce.set(s, e));
+    const o = this.t;
+    if (se && e === void 0) {
+      const s = o !== void 0 && o.length === 1;
+      s && (e = ce.get(o)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), s && ce.set(o, e));
     }
     return e;
   }
@@ -24,17 +19,17 @@ let Se = class {
   }
 };
 const Ce = (t) => new Se(typeof t == "string" ? t : t + "", void 0, we), Pe = (t, e) => {
-  if (oe) t.adoptedStyleSheets = e.map((s) => s instanceof CSSStyleSheet ? s : s.styleSheet);
-  else for (const s of e) {
-    const o = document.createElement("style"), r = Y.litNonce;
-    r !== void 0 && o.setAttribute("nonce", r), o.textContent = s.cssText, t.appendChild(o);
-  }
-}, de = oe ? (t) => t : (t) => t instanceof CSSStyleSheet ? ((e) => {
-  let s = "";
-  for (const o of e.cssRules) s += o.cssText;
-  return Ce(s);
+  if (se) t.adoptedStyleSheets = e.map((o) => o instanceof CSSStyleSheet ? o : o.styleSheet);
+  else for (const o of e) {
+    const s = document.createElement("style"), r = Y.litNonce;
+    r !== void 0 && s.setAttribute("nonce", r), s.textContent = o.cssText, t.appendChild(s);
+  }
+}, de = se ? (t) => t : (t) => t instanceof CSSStyleSheet ? ((e) => {
+  let o = "";
+  for (const s of e.cssRules) o += s.cssText;
+  return Ce(o);
 })(t) : t;
-const { is: De, defineProperty: Me, getOwnPropertyDescriptor: Te, getOwnPropertyNames: Oe, getOwnPropertySymbols: Be, getPrototypeOf: Ve } = Object, Q = globalThis, ue = Q.trustedTypes, He = ue ? ue.emptyScript : "", Ne = Q.reactiveElementPolyfillSupport, U = (t, e) => t, X = { toAttribute(t, e) {
+const { is: Me, defineProperty: De, getOwnPropertyDescriptor: Te, getOwnPropertyNames: Oe, getOwnPropertySymbols: Be, getPrototypeOf: Ve } = Object, Q = globalThis, ue = Q.trustedTypes, He = ue ? ue.emptyScript : "", Ne = Q.reactiveElementPolyfillSupport, U = (t, e) => t, X = { toAttribute(t, e) {
   switch (e) {
     case Boolean:
       t = t ? He : null;
@@ -45,24 +40,24 @@ const { is: De, defineProperty: Me, getOwnPropertyDescriptor: Te, getOwnProperty
   }
   return t;
 }, fromAttribute(t, e) {
-  let s = t;
+  let o = t;
   switch (e) {
     case Boolean:
-      s = t !== null;
+      o = t !== null;
       break;
     case Number:
-      s = t === null ? null : Number(t);
+      o = t === null ? null : Number(t);
       break;
     case Object:
     case Array:
       try {
-        s = JSON.parse(t);
+        o = JSON.parse(t);
       } catch {
-        s = null;
+        o = null;
       }
   }
-  return s;
-} }, re = (t, e) => !De(t, e), pe = { attribute: !0, type: String, converter: X, reflect: !1, useDefault: !1, hasChanged: re };
+  return o;
+} }, re = (t, e) => !Me(t, e), pe = { attribute: !0, type: String, converter: X, reflect: !1, useDefault: !1, hasChanged: re };
 Symbol.metadata ??= /* @__PURE__ */ Symbol("metadata"), Q.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
 let B = class extends HTMLElement {
   static addInitializer(e) {
@@ -71,21 +66,21 @@ let B = class extends HTMLElement {
   static get observedAttributes() {
     return this.finalize(), this._$Eh && [...this._$Eh.keys()];
   }
-  static createProperty(e, s = pe) {
-    if (s.state && (s.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(e) && ((s = Object.create(s)).wrapped = !0), this.elementProperties.set(e, s), !s.noAccessor) {
-      const o = /* @__PURE__ */ Symbol(), r = this.getPropertyDescriptor(e, o, s);
-      r !== void 0 && Me(this.prototype, e, r);
+  static createProperty(e, o = pe) {
+    if (o.state && (o.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(e) && ((o = Object.create(o)).wrapped = !0), this.elementProperties.set(e, o), !o.noAccessor) {
+      const s = /* @__PURE__ */ Symbol(), r = this.getPropertyDescriptor(e, s, o);
+      r !== void 0 && De(this.prototype, e, r);
     }
   }
-  static getPropertyDescriptor(e, s, o) {
+  static getPropertyDescriptor(e, o, s) {
     const { get: r, set: i } = Te(this.prototype, e) ?? { get() {
-      return this[s];
+      return this[o];
     }, set(n) {
-      this[s] = n;
+      this[o] = n;
     } };
     return { get: r, set(n) {
       const l = r?.call(this);
-      i?.call(this, n), this.requestUpdate(e, l, o);
+      i?.call(this, n), this.requestUpdate(e, l, s);
     }, configurable: !0, enumerable: !0 };
   }
   static getPropertyOptions(e) {
@@ -99,32 +94,32 @@ let B = class extends HTMLElement {
   static finalize() {
     if (this.hasOwnProperty(U("finalized"))) return;
     if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(U("properties"))) {
-      const s = this.properties, o = [...Oe(s), ...Be(s)];
-      for (const r of o) this.createProperty(r, s[r]);
+      const o = this.properties, s = [...Oe(o), ...Be(o)];
+      for (const r of s) this.createProperty(r, o[r]);
     }
     const e = this[Symbol.metadata];
     if (e !== null) {
-      const s = litPropertyMetadata.get(e);
-      if (s !== void 0) for (const [o, r] of s) this.elementProperties.set(o, r);
+      const o = litPropertyMetadata.get(e);
+      if (o !== void 0) for (const [s, r] of o) this.elementProperties.set(s, r);
     }
     this._$Eh = /* @__PURE__ */ new Map();
-    for (const [s, o] of this.elementProperties) {
-      const r = this._$Eu(s, o);
-      r !== void 0 && this._$Eh.set(r, s);
+    for (const [o, s] of this.elementProperties) {
+      const r = this._$Eu(o, s);
+      r !== void 0 && this._$Eh.set(r, o);
     }
     this.elementStyles = this.finalizeStyles(this.styles);
   }
   static finalizeStyles(e) {
-    const s = [];
+    const o = [];
     if (Array.isArray(e)) {
-      const o = new Set(e.flat(1 / 0).reverse());
-      for (const r of o) s.unshift(de(r));
-    } else e !== void 0 && s.push(de(e));
-    return s;
+      const s = new Set(e.flat(1 / 0).reverse());
+      for (const r of s) o.unshift(de(r));
+    } else e !== void 0 && o.push(de(e));
+    return o;
   }
-  static _$Eu(e, s) {
-    const o = s.attribute;
-    return o === !1 ? void 0 : typeof o == "string" ? o : typeof e == "string" ? e.toLowerCase() : void 0;
+  static _$Eu(e, o) {
+    const s = o.attribute;
+    return s === !1 ? void 0 : typeof s == "string" ? s : typeof e == "string" ? e.toLowerCase() : void 0;
   }
   constructor() {
     super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
@@ -139,8 +134,8 @@ let B = class extends HTMLElement {
     this._$EO?.delete(e);
   }
   _$E_() {
-    const e = /* @__PURE__ */ new Map(), s = this.constructor.elementProperties;
-    for (const o of s.keys()) this.hasOwnProperty(o) && (e.set(o, this[o]), delete this[o]);
+    const e = /* @__PURE__ */ new Map(), o = this.constructor.elementProperties;
+    for (const s of o.keys()) this.hasOwnProperty(s) && (e.set(s, this[s]), delete this[s]);
     e.size > 0 && (this._$Ep = e);
   }
   createRenderRoot() {
@@ -155,42 +150,42 @@ let B = class extends HTMLElement {
   disconnectedCallback() {
     this._$EO?.forEach((e) => e.hostDisconnected?.());
   }
-  attributeChangedCallback(e, s, o) {
-    this._$AK(e, o);
+  attributeChangedCallback(e, o, s) {
+    this._$AK(e, s);
   }
-  _$ET(e, s) {
-    const o = this.constructor.elementProperties.get(e), r = this.constructor._$Eu(e, o);
-    if (r !== void 0 && o.reflect === !0) {
-      const i = (o.converter?.toAttribute !== void 0 ? o.converter : X).toAttribute(s, o.type);
+  _$ET(e, o) {
+    const s = this.constructor.elementProperties.get(e), r = this.constructor._$Eu(e, s);
+    if (r !== void 0 && s.reflect === !0) {
+      const i = (s.converter?.toAttribute !== void 0 ? s.converter : X).toAttribute(o, s.type);
       this._$Em = e, i == null ? this.removeAttribute(r) : this.setAttribute(r, i), this._$Em = null;
     }
   }
-  _$AK(e, s) {
-    const o = this.constructor, r = o._$Eh.get(e);
+  _$AK(e, o) {
+    const s = this.constructor, r = s._$Eh.get(e);
     if (r !== void 0 && this._$Em !== r) {
-      const i = o.getPropertyOptions(r), n = typeof i.converter == "function" ? { fromAttribute: i.converter } : i.converter?.fromAttribute !== void 0 ? i.converter : X;
+      const i = s.getPropertyOptions(r), n = typeof i.converter == "function" ? { fromAttribute: i.converter } : i.converter?.fromAttribute !== void 0 ? i.converter : X;
       this._$Em = r;
-      const l = n.fromAttribute(s, i.type);
+      const l = n.fromAttribute(o, i.type);
       this[r] = l ?? this._$Ej?.get(r) ?? l, this._$Em = null;
     }
   }
-  requestUpdate(e, s, o, r = !1, i) {
+  requestUpdate(e, o, s, r = !1, i) {
     if (e !== void 0) {
       const n = this.constructor;
-      if (r === !1 && (i = this[e]), o ??= n.getPropertyOptions(e), !((o.hasChanged ?? re)(i, s) || o.useDefault && o.reflect && i === this._$Ej?.get(e) && !this.hasAttribute(n._$Eu(e, o)))) return;
-      this.C(e, s, o);
+      if (r === !1 && (i = this[e]), s ??= n.getPropertyOptions(e), !((s.hasChanged ?? re)(i, o) || s.useDefault && s.reflect && i === this._$Ej?.get(e) && !this.hasAttribute(n._$Eu(e, s)))) return;
+      this.C(e, o, s);
     }
     this.isUpdatePending === !1 && (this._$ES = this._$EP());
   }
-  C(e, s, { useDefault: o, reflect: r, wrapped: i }, n) {
-    o && !(this._$Ej ??= /* @__PURE__ */ new Map()).has(e) && (this._$Ej.set(e, n ?? s ?? this[e]), i !== !0 || n !== void 0) || (this._$AL.has(e) || (this.hasUpdated || o || (s = void 0), this._$AL.set(e, s)), r === !0 && this._$Em !== e && (this._$Eq ??= /* @__PURE__ */ new Set()).add(e));
+  C(e, o, { useDefault: s, reflect: r, wrapped: i }, n) {
+    s && !(this._$Ej ??= /* @__PURE__ */ new Map()).has(e) && (this._$Ej.set(e, n ?? o ?? this[e]), i !== !0 || n !== void 0) || (this._$AL.has(e) || (this.hasUpdated || s || (o = void 0), this._$AL.set(e, o)), r === !0 && this._$Em !== e && (this._$Eq ??= /* @__PURE__ */ new Set()).add(e));
   }
   async _$EP() {
     this.isUpdatePending = !0;
     try {
       await this._$ES;
-    } catch (s) {
-      Promise.reject(s);
+    } catch (o) {
+      Promise.reject(o);
     }
     const e = this.scheduleUpdate();
     return e != null && await e, !this.isUpdatePending;
@@ -205,25 +200,25 @@ let B = class extends HTMLElement {
         for (const [r, i] of this._$Ep) this[r] = i;
         this._$Ep = void 0;
       }
-      const o = this.constructor.elementProperties;
-      if (o.size > 0) for (const [r, i] of o) {
+      const s = this.constructor.elementProperties;
+      if (s.size > 0) for (const [r, i] of s) {
         const { wrapped: n } = i, l = this[r];
         n !== !0 || this._$AL.has(r) || l === void 0 || this.C(r, void 0, i, l);
       }
     }
     let e = !1;
-    const s = this._$AL;
+    const o = this._$AL;
     try {
-      e = this.shouldUpdate(s), e ? (this.willUpdate(s), this._$EO?.forEach((o) => o.hostUpdate?.()), this.update(s)) : this._$EM();
-    } catch (o) {
-      throw e = !1, this._$EM(), o;
+      e = this.shouldUpdate(o), e ? (this.willUpdate(o), this._$EO?.forEach((s) => s.hostUpdate?.()), this.update(o)) : this._$EM();
+    } catch (s) {
+      throw e = !1, this._$EM(), s;
     }
-    e && this._$AE(s);
+    e && this._$AE(o);
   }
   willUpdate(e) {
   }
   _$AE(e) {
-    this._$EO?.forEach((s) => s.hostUpdated?.()), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(e)), this.updated(e);
+    this._$EO?.forEach((o) => o.hostUpdated?.()), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(e)), this.updated(e);
   }
   _$EM() {
     this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
@@ -238,7 +233,7 @@ let B = class extends HTMLElement {
     return !0;
   }
   update(e) {
-    this._$Eq &&= this._$Eq.forEach((s) => this._$ET(s, this[s])), this._$EM();
+    this._$Eq &&= this._$Eq.forEach((o) => this._$ET(o, this[o])), this._$EM();
   }
   updated(e) {
   }
@@ -246,11 +241,11 @@ let B = class extends HTMLElement {
   }
 };
 B.elementStyles = [], B.shadowRootOptions = { mode: "open" }, B[U("elementProperties")] = /* @__PURE__ */ new Map(), B[U("finalized")] = /* @__PURE__ */ new Map(), Ne?.({ ReactiveElement: B }), (Q.reactiveElementVersions ??= []).push("2.1.2");
-const Ue = { attribute: !0, type: String, converter: X, reflect: !1, hasChanged: re }, Le = (t = Ue, e, s) => {
-  const { kind: o, metadata: r } = s;
+const Ue = { attribute: !0, type: String, converter: X, reflect: !1, hasChanged: re }, Le = (t = Ue, e, o) => {
+  const { kind: s, metadata: r } = o;
   let i = globalThis.litPropertyMetadata.get(r);
-  if (i === void 0 && globalThis.litPropertyMetadata.set(r, i = /* @__PURE__ */ new Map()), o === "setter" && ((t = Object.create(t)).wrapped = !0), i.set(s.name, t), o === "accessor") {
-    const { name: n } = s;
+  if (i === void 0 && globalThis.litPropertyMetadata.set(r, i = /* @__PURE__ */ new Map()), s === "setter" && ((t = Object.create(t)).wrapped = !0), i.set(o.name, t), s === "accessor") {
+    const { name: n } = o;
     return { set(l) {
       const a = e.get.call(this);
       e.set.call(this, l), this.requestUpdate(n, a, t, !0, l);
@@ -258,50 +253,50 @@ const Ue = { attribute: !0, type: String, converter: X, reflect: !1, hasChanged:
       return l !== void 0 && this.C(n, void 0, t, l), l;
     } };
   }
-  if (o === "setter") {
-    const { name: n } = s;
+  if (s === "setter") {
+    const { name: n } = o;
     return function(l) {
       const a = this[n];
       e.call(this, l), this.requestUpdate(n, a, t, !0, l);
     };
   }
-  throw Error("Unsupported decorator location: " + o);
+  throw Error("Unsupported decorator location: " + s);
 };
 function h(t) {
-  return (e, s) => typeof s == "object" ? Le(t, e, s) : ((o, r, i) => {
+  return (e, o) => typeof o == "object" ? Le(t, e, o) : ((s, r, i) => {
     const n = r.hasOwnProperty(i);
-    return r.constructor.createProperty(i, o), n ? Object.getOwnPropertyDescriptor(r, i) : void 0;
-  })(t, e, s);
+    return r.constructor.createProperty(i, s), n ? Object.getOwnPropertyDescriptor(r, i) : void 0;
+  })(t, e, o);
 }
 function w(t) {
   return h({ ...t, state: !0, attribute: !1 });
 }
 const ie = globalThis, fe = (t) => t, G = ie.trustedTypes, be = G ? G.createPolicy("lit-html", { createHTML: (t) => t }) : void 0, $e = "$lit$", A = `lit$${Math.random().toFixed(9).slice(2)}$`, xe = "?" + A, Fe = `<${xe}>`, P = document, L = () => P.createComment(""), F = (t) => t === null || typeof t != "object" && typeof t != "function", ne = Array.isArray, je = (t) => ne(t) || typeof t?.[Symbol.iterator] == "function", te = `[ 	
 \f\r]`, N = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, me = /-->/g, ge = />/g, S = RegExp(`>|${te}(?:([^\\s"'>=/]+)(${te}*=${te}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), ve = /'/g, _e = /"/g, ke = /^(?:script|style|textarea|title)$/i, ze = (t) => (e, ...s) => ({ _$litType$: t, strings: e, values: s }), se = ze(1), D = /* @__PURE__ */ Symbol.for("lit-noChange"), b = /* @__PURE__ */ Symbol.for("lit-nothing"), ye = /* @__PURE__ */ new WeakMap(), C = P.createTreeWalker(P, 129);
+\f\r"'\`<>=]|("|')|))|$)`, "g"), ve = /'/g, _e = /"/g, ke = /^(?:script|style|textarea|title)$/i, ze = (t) => (e, ...o) => ({ _$litType$: t, strings: e, values: o }), oe = ze(1), M = /* @__PURE__ */ Symbol.for("lit-noChange"), b = /* @__PURE__ */ Symbol.for("lit-nothing"), ye = /* @__PURE__ */ new WeakMap(), C = P.createTreeWalker(P, 129);
 function Ae(t, e) {
   if (!ne(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
   return be !== void 0 ? be.createHTML(e) : e;
 }
 const Ie = (t, e) => {
-  const s = t.length - 1, o = [];
+  const o = t.length - 1, s = [];
   let r, i = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = N;
-  for (let l = 0; l < s; l++) {
+  for (let l = 0; l < o; l++) {
     const a = t[l];
     let c, u, d = -1, $ = 0;
     for (; $ < a.length && (n.lastIndex = $, u = n.exec(a), u !== null); ) $ = n.lastIndex, n === N ? u[1] === "!--" ? n = me : u[1] !== void 0 ? n = ge : u[2] !== void 0 ? (ke.test(u[2]) && (r = RegExp("</" + u[2], "g")), n = S) : u[3] !== void 0 && (n = S) : n === S ? u[0] === ">" ? (n = r ?? N, d = -1) : u[1] === void 0 ? d = -2 : (d = n.lastIndex - u[2].length, c = u[1], n = u[3] === void 0 ? S : u[3] === '"' ? _e : ve) : n === _e || n === ve ? n = S : n === me || n === ge ? n = N : (n = S, r = void 0);
     const k = n === S && t[l + 1].startsWith("/>") ? " " : "";
-    i += n === N ? a + Fe : d >= 0 ? (o.push(c), a.slice(0, d) + $e + a.slice(d) + A + k) : a + A + (d === -2 ? l : k);
+    i += n === N ? a + Fe : d >= 0 ? (s.push(c), a.slice(0, d) + $e + a.slice(d) + A + k) : a + A + (d === -2 ? l : k);
   }
-  return [Ae(t, i + (t[s] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), o];
+  return [Ae(t, i + (t[o] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), s];
 };
 class j {
-  constructor({ strings: e, _$litType$: s }, o) {
+  constructor({ strings: e, _$litType$: o }, s) {
     let r;
     this.parts = [];
     let i = 0, n = 0;
-    const l = e.length - 1, a = this.parts, [c, u] = Ie(e, s);
-    if (this.el = j.createElement(c, o), C.currentNode = this.el.content, s === 2 || s === 3) {
+    const l = e.length - 1, a = this.parts, [c, u] = Ie(e, o);
+    if (this.el = j.createElement(c, s), C.currentNode = this.el.content, o === 2 || o === 3) {
       const d = this.el.content.firstChild;
       d.replaceWith(...d.childNodes);
     }
@@ -327,20 +322,20 @@ class j {
       i++;
     }
   }
-  static createElement(e, s) {
-    const o = P.createElement("template");
-    return o.innerHTML = e, o;
+  static createElement(e, o) {
+    const s = P.createElement("template");
+    return s.innerHTML = e, s;
   }
 }
-function H(t, e, s = t, o) {
-  if (e === D) return e;
-  let r = o !== void 0 ? s._$Co?.[o] : s._$Cl;
+function H(t, e, o = t, s) {
+  if (e === M) return e;
+  let r = s !== void 0 ? o._$Co?.[s] : o._$Cl;
   const i = F(e) ? void 0 : e._$litDirective$;
-  return r?.constructor !== i && (r?._$AO?.(!1), i === void 0 ? r = void 0 : (r = new i(t), r._$AT(t, s, o)), o !== void 0 ? (s._$Co ??= [])[o] = r : s._$Cl = r), r !== void 0 && (e = H(t, r._$AS(t, e.values), r, o)), e;
+  return r?.constructor !== i && (r?._$AO?.(!1), i === void 0 ? r = void 0 : (r = new i(t), r._$AT(t, o, s)), s !== void 0 ? (o._$Co ??= [])[s] = r : o._$Cl = r), r !== void 0 && (e = H(t, r._$AS(t, e.values), r, s)), e;
 }
 class Re {
-  constructor(e, s) {
-    this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM = s;
+  constructor(e, o) {
+    this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM = o;
   }
   get parentNode() {
     return this._$AM.parentNode;
@@ -349,34 +344,34 @@ class Re {
     return this._$AM._$AU;
   }
   u(e) {
-    const { el: { content: s }, parts: o } = this._$AD, r = (e?.creationScope ?? P).importNode(s, !0);
+    const { el: { content: o }, parts: s } = this._$AD, r = (e?.creationScope ?? P).importNode(o, !0);
     C.currentNode = r;
-    let i = C.nextNode(), n = 0, l = 0, a = o[0];
+    let i = C.nextNode(), n = 0, l = 0, a = s[0];
     for (; a !== void 0; ) {
       if (n === a.index) {
         let c;
-        a.type === 2 ? c = new q(i, i.nextSibling, this, e) : a.type === 1 ? c = new a.ctor(i, a.name, a.strings, this, e) : a.type === 6 && (c = new Ze(i, this, e)), this._$AV.push(c), a = o[++l];
+        a.type === 2 ? c = new q(i, i.nextSibling, this, e) : a.type === 1 ? c = new a.ctor(i, a.name, a.strings, this, e) : a.type === 6 && (c = new Ze(i, this, e)), this._$AV.push(c), a = s[++l];
       }
       n !== a?.index && (i = C.nextNode(), n++);
     }
     return C.currentNode = P, r;
   }
   p(e) {
-    let s = 0;
-    for (const o of this._$AV) o !== void 0 && (o.strings !== void 0 ? (o._$AI(e, o, s), s += o.strings.length - 2) : o._$AI(e[s])), s++;
+    let o = 0;
+    for (const s of this._$AV) s !== void 0 && (s.strings !== void 0 ? (s._$AI(e, s, o), o += s.strings.length - 2) : s._$AI(e[o])), o++;
   }
 }
 class q {
   get _$AU() {
     return this._$AM?._$AU ?? this._$Cv;
   }
-  constructor(e, s, o, r) {
-    this.type = 2, this._$AH = b, this._$AN = void 0, this._$AA = e, this._$AB = s, this._$AM = o, this.options = r, this._$Cv = r?.isConnected ?? !0;
+  constructor(e, o, s, r) {
+    this.type = 2, this._$AH = b, this._$AN = void 0, this._$AA = e, this._$AB = o, this._$AM = s, this.options = r, this._$Cv = r?.isConnected ?? !0;
   }
   get parentNode() {
     let e = this._$AA.parentNode;
-    const s = this._$AM;
-    return s !== void 0 && e?.nodeType === 11 && (e = s.parentNode), e;
+    const o = this._$AM;
+    return o !== void 0 && e?.nodeType === 11 && (e = o.parentNode), e;
   }
   get startNode() {
     return this._$AA;
@@ -384,8 +379,8 @@ class q {
   get endNode() {
     return this._$AB;
   }
-  _$AI(e, s = this) {
-    e = H(this, e, s), F(e) ? e === b || e == null || e === "" ? (this._$AH !== b && this._$AR(), this._$AH = b) : e !== this._$AH && e !== D && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : je(e) ? this.k(e) : this._(e);
+  _$AI(e, o = this) {
+    e = H(this, e, o), F(e) ? e === b || e == null || e === "" ? (this._$AH !== b && this._$AR(), this._$AH = b) : e !== this._$AH && e !== M && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : je(e) ? this.k(e) : this._(e);
   }
   O(e) {
     return this._$AA.parentNode.insertBefore(e, this._$AB);
@@ -397,28 +392,28 @@ class q {
     this._$AH !== b && F(this._$AH) ? this._$AA.nextSibling.data = e : this.T(P.createTextNode(e)), this._$AH = e;
   }
   $(e) {
-    const { values: s, _$litType$: o } = e, r = typeof o == "number" ? this._$AC(e) : (o.el === void 0 && (o.el = j.createElement(Ae(o.h, o.h[0]), this.options)), o);
-    if (this._$AH?._$AD === r) this._$AH.p(s);
+    const { values: o, _$litType$: s } = e, r = typeof s == "number" ? this._$AC(e) : (s.el === void 0 && (s.el = j.createElement(Ae(s.h, s.h[0]), this.options)), s);
+    if (this._$AH?._$AD === r) this._$AH.p(o);
     else {
       const i = new Re(r, this), n = i.u(this.options);
-      i.p(s), this.T(n), this._$AH = i;
+      i.p(o), this.T(n), this._$AH = i;
     }
   }
   _$AC(e) {
-    let s = ye.get(e.strings);
-    return s === void 0 && ye.set(e.strings, s = new j(e)), s;
+    let o = ye.get(e.strings);
+    return o === void 0 && ye.set(e.strings, o = new j(e)), o;
   }
   k(e) {
     ne(this._$AH) || (this._$AH = [], this._$AR());
-    const s = this._$AH;
-    let o, r = 0;
-    for (const i of e) r === s.length ? s.push(o = new q(this.O(L()), this.O(L()), this, this.options)) : o = s[r], o._$AI(i), r++;
-    r < s.length && (this._$AR(o && o._$AB.nextSibling, r), s.length = r);
-  }
-  _$AR(e = this._$AA.nextSibling, s) {
-    for (this._$AP?.(!1, !0, s); e !== this._$AB; ) {
-      const o = fe(e).nextSibling;
-      fe(e).remove(), e = o;
+    const o = this._$AH;
+    let s, r = 0;
+    for (const i of e) r === o.length ? o.push(s = new q(this.O(L()), this.O(L()), this, this.options)) : s = o[r], s._$AI(i), r++;
+    r < o.length && (this._$AR(s && s._$AB.nextSibling, r), o.length = r);
+  }
+  _$AR(e = this._$AA.nextSibling, o) {
+    for (this._$AP?.(!1, !0, o); e !== this._$AB; ) {
+      const s = fe(e).nextSibling;
+      fe(e).remove(), e = s;
     }
   }
   setConnected(e) {
@@ -432,17 +427,17 @@ class ee {
   get _$AU() {
     return this._$AM._$AU;
   }
-  constructor(e, s, o, r, i) {
-    this.type = 1, this._$AH = b, this._$AN = void 0, this.element = e, this.name = s, this._$AM = r, this.options = i, o.length > 2 || o[0] !== "" || o[1] !== "" ? (this._$AH = Array(o.length - 1).fill(new String()), this.strings = o) : this._$AH = b;
+  constructor(e, o, s, r, i) {
+    this.type = 1, this._$AH = b, this._$AN = void 0, this.element = e, this.name = o, this._$AM = r, this.options = i, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = b;
   }
-  _$AI(e, s = this, o, r) {
+  _$AI(e, o = this, s, r) {
     const i = this.strings;
     let n = !1;
-    if (i === void 0) e = H(this, e, s, 0), n = !F(e) || e !== this._$AH && e !== D, n && (this._$AH = e);
+    if (i === void 0) e = H(this, e, o, 0), n = !F(e) || e !== this._$AH && e !== M, n && (this._$AH = e);
     else {
       const l = e;
       let a, c;
-      for (e = i[0], a = 0; a < i.length - 1; a++) c = H(this, l[o + a], s, a), c === D && (c = this._$AH[a]), n ||= !F(c) || c !== this._$AH[a], c === b ? e = b : e !== b && (e += (c ?? "") + i[a + 1]), this._$AH[a] = c;
+      for (e = i[0], a = 0; a < i.length - 1; a++) c = H(this, l[s + a], o, a), c === M && (c = this._$AH[a]), n ||= !F(c) || c !== this._$AH[a], c === b ? e = b : e !== b && (e += (c ?? "") + i[a + 1]), this._$AH[a] = c;
     }
     n && !r && this.j(e);
   }
@@ -467,21 +462,21 @@ class We extends ee {
   }
 }
 class Ke extends ee {
-  constructor(e, s, o, r, i) {
-    super(e, s, o, r, i), this.type = 5;
+  constructor(e, o, s, r, i) {
+    super(e, o, s, r, i), this.type = 5;
   }
-  _$AI(e, s = this) {
-    if ((e = H(this, e, s, 0) ?? b) === D) return;
-    const o = this._$AH, r = e === b && o !== b || e.capture !== o.capture || e.once !== o.once || e.passive !== o.passive, i = e !== b && (o === b || r);
-    r && this.element.removeEventListener(this.name, this, o), i && this.element.addEventListener(this.name, this, e), this._$AH = e;
+  _$AI(e, o = this) {
+    if ((e = H(this, e, o, 0) ?? b) === M) return;
+    const s = this._$AH, r = e === b && s !== b || e.capture !== s.capture || e.once !== s.once || e.passive !== s.passive, i = e !== b && (s === b || r);
+    r && this.element.removeEventListener(this.name, this, s), i && this.element.addEventListener(this.name, this, e), this._$AH = e;
   }
   handleEvent(e) {
     typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, e) : this._$AH.handleEvent(e);
   }
 }
 class Ze {
-  constructor(e, s, o) {
-    this.element = e, this.type = 6, this._$AN = void 0, this._$AM = s, this.options = o;
+  constructor(e, o, s) {
+    this.element = e, this.type = 6, this._$AN = void 0, this._$AM = o, this.options = s;
   }
   get _$AU() {
     return this._$AM._$AU;
@@ -492,12 +487,12 @@ class Ze {
 }
 const Ye = ie.litHtmlPolyfillSupport;
 Ye?.(j, q), (ie.litHtmlVersions ??= []).push("3.3.2");
-const Xe = (t, e, s) => {
-  const o = s?.renderBefore ?? e;
-  let r = o._$litPart$;
+const Xe = (t, e, o) => {
+  const s = o?.renderBefore ?? e;
+  let r = s._$litPart$;
   if (r === void 0) {
-    const i = s?.renderBefore ?? null;
-    o._$litPart$ = r = new q(e.insertBefore(L(), i), i, void 0, s ?? {});
+    const i = o?.renderBefore ?? null;
+    s._$litPart$ = r = new q(e.insertBefore(L(), i), i, void 0, o ?? {});
   }
   return r._$AI(t), r;
 };
@@ -511,8 +506,8 @@ let V = class extends B {
     return this.renderOptions.renderBefore ??= e.firstChild, e;
   }
   update(e) {
-    const s = this.render();
-    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(e), this._$Do = Xe(s, this.renderRoot, this.renderOptions);
+    const o = this.render();
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(e), this._$Do = Xe(o, this.renderRoot, this.renderOptions);
   }
   connectedCallback() {
     super.connectedCallback(), this._$Do?.setConnected(!0);
@@ -521,18 +516,18 @@ let V = class extends B {
     super.disconnectedCallback(), this._$Do?.setConnected(!1);
   }
   render() {
-    return D;
+    return M;
   }
 };
 V._$litElement$ = !0, V.finalized = !0, ae.litElementHydrateSupport?.({ LitElement: V });
 const Ge = ae.litElementPolyfillSupport;
 Ge?.({ LitElement: V });
 (ae.litElementVersions ??= []).push("4.2.2");
-const Je = E`:host{cursor:pointer;-webkit-user-select:none;user-select:none;width:calc(1rem + 2px);height:calc(1rem + 2px)}:host([disabled]){cursor:not-allowed;opacity:.6}.checkbox-container{position:relative;transition:opacity .2s ease}.checkbox-box{width:1rem;height:1rem;border-radius:.25rem;background-color:var(--nf-background-color);border:1px solid var(--nf-border-color);display:flex;align-items:center;justify-content:center;transition:background-color .2s ease,border-color .2s ease}:host(:hover:not([checked]):not([disabled])) .checkbox-box{border-color:var(--nf-primary-color,var(--nf-primary-color))}:host([checked]) .checkbox-box{background-color:var(--nf-primary-color,var(--nf-primary-color));border-color:var(--nf-primary-color,var(--nf-primary-color))}:host([disabled]) .checkbox-box{border-color:#fffc;background:#fffc;cursor:not-allowed;pointer-events:none}:host([disabled][checked]) .checkbox-box{background-color:#fffc;border-color:#fffc}.checkbox-icon{color:#fff;font-size:.75rem;line-height:1;font-weight:700;transition:transform .2s ease;display:flex;align-items:center}:host([checked]) .checkbox-icon{transform:scale(1)}:host(:focus) .checkbox-container{outline:.125rem solid var(--nf-primary-color,var(--nf-primary-color));outline-offset:.125rem}`;
-var Qe = Object.defineProperty, et = Object.getOwnPropertyDescriptor, le = (t, e, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? et(e, s) : e, i = t.length - 1, n; i >= 0; i--)
-    (n = t[i]) && (r = (o ? n(e, s, r) : n(r)) || r);
-  return o && r && Qe(e, s, r), r;
+const Je = E`:host{cursor:pointer;-webkit-user-select:none;user-select:none;width:calc(1rem + 2px);height:calc(1rem + 2px)}:host([disabled]){cursor:not-allowed;opacity:.6}.checkbox-container{position:relative;transition:opacity .2s ease}.checkbox-box{width:1rem;height:1rem;border-radius:.25rem;background-color:var(--nf-background-color);border:1px solid var(--nf-border-color);display:flex;align-items:center;justify-content:center;transition:background-color .2s ease,border-color .2s ease}:host(:hover:not([checked]):not([disabled])) .checkbox-box{border-color:var(--nf-primary-color,var(--nf-primary-color))}:host([checked]) .checkbox-box{background-color:var(--nf-primary-color,var(--nf-primary-color));border-color:var(--nf-primary-color,var(--nf-primary-color))}:host([disabled]) .checkbox-box{border-color:#fffc;background:#fffc;cursor:not-allowed;pointer-events:none}:host([disabled][checked]) .checkbox-box{background-color:#fffc;border-color:#fffc}.checkbox-icon{color:#fff;font-size:.75rem;line-height:1;font-weight:700;transition:transform .2s ease;display:flex;align-items:center}:host([checked]) .checkbox-icon{transform:scale(1)}:host(:focus) .checkbox-container{outline:.125rem solid var(--nf-primary-color,var(--nf-primary-color));outline-offset:.125rem}`, T = (t) => (e) => (typeof window > "u" || customElements.get(t) || customElements.define(t, e), e);
+var Qe = Object.defineProperty, et = Object.getOwnPropertyDescriptor, le = (t, e, o, s) => {
+  for (var r = s > 1 ? void 0 : s ? et(e, o) : e, i = t.length - 1, n; i >= 0; i--)
+    (n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
+  return s && r && Qe(e, o, r), r;
 };
 let z = class extends V {
   constructor() {
@@ -550,7 +545,7 @@ let z = class extends V {
   }
   // 渲染复选框组件
   render() {
-    return se`<div class=checkbox-container @click=${this.toggleCheckbox} aria-checked=${this.checked} aria-disabled=${this.disabled} role=checkbox><div class=checkbox-box>${this.checked ? se`<div class=checkbox-icon><svg viewBox="64 64 896 896"focusable=false data-icon=check width=0.625rem height=0.625rem fill=currentColor aria-hidden=true><path d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 00-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"></path></svg></div>` : ""}</div></div>`;
+    return oe`<div class=checkbox-container @click=${this.toggleCheckbox} aria-checked=${this.checked} aria-disabled=${this.disabled} role=checkbox><div class=checkbox-box>${this.checked ? oe`<div class=checkbox-icon><svg viewBox="64 64 896 896"focusable=false data-icon=check width=0.625rem height=0.625rem fill=currentColor aria-hidden=true><path d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 00-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"></path></svg></div>` : ""}</div></div>`;
   }
   connectedCallback() {
     this.style.transition = "none", super.connectedCallback(), requestAnimationFrame(() => {
@@ -568,52 +563,52 @@ le([
 z = le([
   T("nf-checkbox")
 ], z);
-const tt = { ATTRIBUTE: 1 }, st = (t) => (...e) => ({ _$litDirective$: t, values: e });
-let ot = class {
+const tt = { ATTRIBUTE: 1 }, ot = (t) => (...e) => ({ _$litDirective$: t, values: e });
+let st = class {
   constructor(e) {
   }
   get _$AU() {
     return this._$AM._$AU;
   }
-  _$AT(e, s, o) {
-    this._$Ct = e, this._$AM = s, this._$Ci = o;
+  _$AT(e, o, s) {
+    this._$Ct = e, this._$AM = o, this._$Ci = s;
   }
-  _$AS(e, s) {
-    return this.update(e, s);
+  _$AS(e, o) {
+    return this.update(e, o);
   }
-  update(e, s) {
-    return this.render(...s);
+  update(e, o) {
+    return this.render(...o);
   }
 };
-const Ee = "important", rt = " !" + Ee, J = st(class extends ot {
+const Ee = "important", rt = " !" + Ee, J = ot(class extends st {
   constructor(t) {
     if (super(t), t.type !== tt.ATTRIBUTE || t.name !== "style" || t.strings?.length > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
   }
   render(t) {
-    return Object.keys(t).reduce((e, s) => {
-      const o = t[s];
-      return o == null ? e : e + `${s = s.includes("-") ? s : s.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${o};`;
+    return Object.keys(t).reduce((e, o) => {
+      const s = t[o];
+      return s == null ? e : e + `${o = o.includes("-") ? o : o.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${s};`;
     }, "");
   }
   update(t, [e]) {
-    const { style: s } = t.element;
+    const { style: o } = t.element;
     if (this.ft === void 0) return this.ft = new Set(Object.keys(e)), this.render(e);
-    for (const o of this.ft) e[o] == null && (this.ft.delete(o), o.includes("-") ? s.removeProperty(o) : s[o] = null);
-    for (const o in e) {
-      const r = e[o];
+    for (const s of this.ft) e[s] == null && (this.ft.delete(s), s.includes("-") ? o.removeProperty(s) : o[s] = null);
+    for (const s in e) {
+      const r = e[s];
       if (r != null) {
-        this.ft.add(o);
+        this.ft.add(s);
         const i = typeof r == "string" && r.endsWith(rt);
-        o.includes("-") || i ? s.setProperty(o, i ? r.slice(0, -11) : r, i ? Ee : "") : s[o] = r;
+        s.includes("-") || i ? o.setProperty(s, i ? r.slice(0, -11) : r, i ? Ee : "") : o[s] = r;
       }
     }
-    return D;
+    return M;
   }
 }), W = E`:host{display:inline-flex;align-items:center;position:relative;width:var(--nf-width);height:var(--nf-height);padding:var(--nf-padding);margin:var(--nf-margin);font-size:var(--nf-text-font-size);font-weight:var(--nf-font-weight);color:var(--nf-color);background:var(--nf-background-color);border-radius:var(--nf-border-radius);border:1px solid var(--nf-border-color);outline:0;background-clip:padding-box;box-shadow:0 0 0 .15rem var(--nf-box-shadow-color);transition:color var(--nf-transition) ease-in-out,background-color var(--nf-transition) ease-in-out,border-color var(--nf-transition) ease-in-out,box-shadow var(--nf-transition) ease-in-out}:host(:focus){border-color:var(--nf-border-color-hover);box-shadow:0 0 0 .15rem var(--nf-box-shadow-color-focus);background:var(--nf-background-color-hover)}:host(:hover:not([disabled])){border-color:var(--nf-border-color-hover);background:var(--nf-background-color-hover)}:host([disabled]){cursor:not-allowed;opacity:.6;pointer-events:auto}:host([disabled]:hover){border-color:var(--nf-border-color);background:var(--nf-background-color)}`, it = E`:host{display:inline-block;position:relative}:host([disabled]){cursor:not-allowed;opacity:.6}:host([disabled]:hover){border-color:var(--nf-border-color);background:var(--nf-background-color)}:host([open]){border-color:var(--nf-border-color-hover);box-shadow:0 0 0 .15rem var(--nf-box-shadow-color-focus)}.trigger{width:calc(100% + 1.5rem + 2px);height:calc(100% + 2px);margin:-1px -.75rem;padding:1px .75rem;box-sizing:border-box;display:flex;align-items:center;cursor:pointer;transition:all .2s;font-size:.875rem;position:relative}:host(:not([disabled])) .trigger:hover{border-color:var(--nf-color-primary)}.trigger[disabled]{cursor:not-allowed;opacity:.6}:host([disabled]) .trigger{cursor:not-allowed;color:var(--nf-color-disabled)}.color-block{width:1.25rem;height:1.25rem;border-radius:.125rem;margin-left:calc((var(--nf-height) - 1.25rem)/ 2 - .75rem);margin-right:.4rem}:host(.hide-text) .color-block{margin-right:calc((var(--nf-height) - 1.25rem)/ 2 - .75rem)}.color-text{flex:1}.panel{position:absolute;z-index:1000;background:var(--nf-color-picker-card-background,var(--nf-dropdown-background));-webkit-backdrop-filter:blur(64px);backdrop-filter:blur(64px);border-radius:var(--nf-border-radius);box-shadow:0 6px 16px 0 var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow)),0 3px 6px -4px var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow)),0 9px 28px 8px var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow));-webkit-user-select:none;user-select:none}.panel-content{padding:.75rem;width:15rem}.color-selector{height:9.375rem;position:relative;margin-bottom:.75rem;border-radius:var(--nf-border-radius);overflow:hidden}.color-sb{width:100%;height:100%;position:relative;cursor:pointer}.sb-white{position:absolute;inset:0;background:linear-gradient(to right,#fff,#fff0)}.sb-black{position:absolute;inset:0;background:linear-gradient(to top,#000,#0000)}.selector{position:absolute;width:.625rem;height:.625rem;border:.125rem solid #fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 .125rem #00000080;pointer-events:none}.slider-container{margin-bottom:.5rem}.slider-container:last-child{margin-bottom:0}.sliders-row{display:flex;align-items:center;gap:.75rem}.sliders{flex:1}.slider{position:relative;height:.75rem;border-radius:.375rem}.hue-slider{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.alpha-slider{position:relative;background-image:linear-gradient(45deg,var(--nf-color-picker-card-checker,#ccc) 25%,transparent 25%),linear-gradient(-45deg,var(--nf-color-picker-card-checker,#ccc) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--nf-color-picker-card-checker,#ccc) 75%),linear-gradient(-45deg,transparent 75%,var(--nf-color-picker-card-checker,#ccc) 75%);background-size:.375rem .375rem;background-position:0 0,0 .1875rem,.1875rem -.1875rem,-.1875rem 0;background-color:var(--nf-color-picker-card-checker-bg,#fff);border-radius:.375rem}.alpha-slider-input{position:relative;z-index:2}.alpha-gradient{position:absolute;inset:0;border-radius:.375rem}input[type=range]{-webkit-appearance:none;width:100%;height:100%;background:0 0;outline:0;position:absolute;top:0;left:0;margin:0;padding:0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:1rem;height:1rem;border-radius:50%;background:#fff;border:.125rem solid var(--nf-color-border);cursor:pointer;box-shadow:0 0 .125rem #00000080;position:relative;z-index:1}input[type=range]::-moz-range-thumb{width:1rem;height:1rem;border-radius:50%;background:#fff;border:.125rem solid var(--nf-color-border);cursor:pointer;box-shadow:0 0 .125rem #00000080}.current-color-container{display:flex}.current-color{width:2rem;height:2rem;border-radius:var(--nf-border-radius);border:.0625rem solid var(--nf-color-border)}:host(:not([disabled-alpha])) .current-color{width:2.5rem;height:2.5rem}`;
-var nt = Object.defineProperty, at = Object.getOwnPropertyDescriptor, _ = (t, e, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? at(e, s) : e, i = t.length - 1, n; i >= 0; i--)
-    (n = t[i]) && (r = (o ? n(e, s, r) : n(r)) || r);
-  return o && r && nt(e, s, r), r;
+var nt = Object.defineProperty, at = Object.getOwnPropertyDescriptor, _ = (t, e, o, s) => {
+  for (var r = s > 1 ? void 0 : s ? at(e, o) : e, i = t.length - 1, n; i >= 0; i--)
+    (n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
+  return s && r && nt(e, o, r), r;
 };
 let g = class extends R {
   constructor() {
@@ -655,34 +650,34 @@ let g = class extends R {
   }
   // 从HEX颜色值更新HSB值
   _updateHSBFromHex(t) {
-    const e = parseInt(t.slice(1, 3), 16) / 255, s = parseInt(t.slice(3, 5), 16) / 255, o = parseInt(t.slice(5, 7), 16) / 255, r = Math.max(e, s, o), i = Math.min(e, s, o), n = r - i;
+    const e = parseInt(t.slice(1, 3), 16) / 255, o = parseInt(t.slice(3, 5), 16) / 255, s = parseInt(t.slice(5, 7), 16) / 255, r = Math.max(e, o, s), i = Math.min(e, o, s), n = r - i;
     let l = 0, a = 0;
     const c = r;
-    n !== 0 && (a = n / r, r === e ? l = (s - o) / n % 6 : r === s ? l = (o - e) / n + 2 : l = (e - s) / n + 4, l *= 60, l < 0 && (l += 360)), this._hsb = {
+    n !== 0 && (a = n / r, r === e ? l = (o - s) / n % 6 : r === o ? l = (s - e) / n + 2 : l = (e - o) / n + 4, l *= 60, l < 0 && (l += 360)), this._hsb = {
       h: Math.round(l),
       s: Math.round(a * 100),
       b: Math.round(c * 100)
     };
   }
   // 从HSB值生成HEX颜色值
-  _generateHexFromHSB(t, e, s, o = "FF") {
-    e /= 100, s /= 100;
-    const r = s * e, i = r * (1 - Math.abs(t / 60 % 2 - 1)), n = s - r;
+  _generateHexFromHSB(t, e, o, s = "FF") {
+    e /= 100, o /= 100;
+    const r = o * e, i = r * (1 - Math.abs(t / 60 % 2 - 1)), n = o - r;
     let l = 0, a = 0, c = 0;
-    return 0 <= t && t < 60 ? (l = r, a = i, c = 0) : 60 <= t && t < 120 ? (l = i, a = r, c = 0) : 120 <= t && t < 180 ? (l = 0, a = r, c = i) : 180 <= t && t < 240 ? (l = 0, a = i, c = r) : 240 <= t && t < 300 ? (l = i, a = 0, c = r) : 300 <= t && t < 360 && (l = r, a = 0, c = i), l = Math.round((l + n) * 255), a = Math.round((a + n) * 255), c = Math.round((c + n) * 255), "#" + l.toString(16).padStart(2, "0") + a.toString(16).padStart(2, "0") + c.toString(16).padStart(2, "0") + o;
+    return 0 <= t && t < 60 ? (l = r, a = i, c = 0) : 60 <= t && t < 120 ? (l = i, a = r, c = 0) : 120 <= t && t < 180 ? (l = 0, a = r, c = i) : 180 <= t && t < 240 ? (l = 0, a = i, c = r) : 240 <= t && t < 300 ? (l = i, a = 0, c = r) : 300 <= t && t < 360 && (l = r, a = 0, c = i), l = Math.round((l + n) * 255), a = Math.round((a + n) * 255), c = Math.round((c + n) * 255), "#" + l.toString(16).padStart(2, "0") + a.toString(16).padStart(2, "0") + c.toString(16).padStart(2, "0") + s;
   }
   // 计算面板位置
   _updatePanelPosition() {
     requestAnimationFrame(() => {
       const t = this.getBoundingClientRect(), e = this.shadowRoot?.querySelector(".panel");
       if (!e) return;
-      const s = 0.15 * 16, o = 8, r = e.offsetWidth || 240, i = e.offsetHeight || 300;
+      const o = 0.15 * 16, s = 8, r = e.offsetWidth || 240, i = e.offsetHeight || 300;
       let n = this.placement, l = this.align;
-      this.autoAdjust && (n === "bottom" ? window.innerHeight - t.bottom - o < i && t.top - o >= i && (n = "top") : t.top - o < i && window.innerHeight - t.bottom - o >= i && (n = "bottom"), l === "right" ? t.right - s < r && t.left + t.width + s + r <= window.innerWidth && (l = "left") : t.left - s + r > window.innerWidth && t.right - s >= r && (l = "right"));
+      this.autoAdjust && (n === "bottom" ? window.innerHeight - t.bottom - s < i && t.top - s >= i && (n = "top") : t.top - s < i && window.innerHeight - t.bottom - s >= i && (n = "bottom"), l === "right" ? t.right - o < r && t.left + t.width + o + r <= window.innerWidth && (l = "left") : t.left - o + r > window.innerWidth && t.right - o >= r && (l = "right"));
       let a;
-      n === "bottom" ? a = t.height + o : a = -i - o;
+      n === "bottom" ? a = t.height + s : a = -i - s;
       let c;
-      l === "right" ? c = t.width - r + s : c = -s, this._panelPosition = { top: a, left: c };
+      l === "right" ? c = t.width - r + o : c = -o, this._panelPosition = { top: a, left: c };
     });
   }
   // 打开面板
@@ -708,15 +703,15 @@ let g = class extends R {
     this._panelVisible ? this._closePanel() : this._openPanel();
   }
   // 处理HSB颜色变化
-  _handleHSBChange(t, e, s) {
-    this._hsb = { h: t, s: e, b: s };
-    const o = this._internalValue.slice(7), r = this._generateHexFromHSB(t, e, s, o);
+  _handleHSBChange(t, e, o) {
+    this._hsb = { h: t, s: e, b: o };
+    const s = this._internalValue.slice(7), r = this._generateHexFromHSB(t, e, o, s);
     this._handleColorChange(r);
   }
   // 处理Alpha值变化
   _handleAlphaChange(t) {
-    const e = Math.round(t * 255 / 100).toString(16).padStart(2, "0").toUpperCase(), s = "#" + this._internalValue.slice(1, 7) + e;
-    this._handleColorChange(s);
+    const e = Math.round(t * 255 / 100).toString(16).padStart(2, "0").toUpperCase(), o = "#" + this._internalValue.slice(1, 7) + e;
+    this._handleColorChange(o);
   }
   // 处理颜色变化
   _handleColorChange(t) {
@@ -730,20 +725,20 @@ let g = class extends R {
   }
   // 处理色相选择
   _handleHueChange(t) {
-    const e = t.target, s = parseInt(e.value);
-    this._handleHSBChange(s, this._hsb.s, this._hsb.b);
+    const e = t.target, o = parseInt(e.value);
+    this._handleHSBChange(o, this._hsb.s, this._hsb.b);
   }
   // 处理饱和度和亮度选择
   _handleSBChange(t) {
     const e = this.shadowRoot?.querySelector(".color-sb");
     if (!e) return;
-    const s = e.getBoundingClientRect(), o = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX, r = t instanceof MouseEvent ? t.clientY : t.touches[0].clientY, i = Math.max(0, Math.min(100, Math.round((o - s.left) / s.width * 100))), n = Math.max(0, Math.min(100, Math.round((1 - (r - s.top) / s.height) * 100)));
+    const o = e.getBoundingClientRect(), s = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX, r = t instanceof MouseEvent ? t.clientY : t.touches[0].clientY, i = Math.max(0, Math.min(100, Math.round((s - o.left) / o.width * 100))), n = Math.max(0, Math.min(100, Math.round((1 - (r - o.top) / o.height) * 100)));
     this._handleHSBChange(this._hsb.h, i, n);
   }
   // 处理透明度选择
   _handleAlphaChangeInput(t) {
-    const e = t.target, s = parseInt(e.value);
-    this._handleAlphaChange(s);
+    const e = t.target, o = parseInt(e.value);
+    this._handleAlphaChange(o);
   }
   // 渲染触发器
   _renderTrigger() {
@@ -764,7 +759,7 @@ let g = class extends R {
   }
   // 渲染颜色选择区域
   _renderColorSelector() {
-    const t = this._generateHexFromHSB(this._hsb.h, 100, 100, "FF"), e = this._hsb.s / 100 * 100, s = (1 - this._hsb.b / 100) * 100;
+    const t = this._generateHexFromHSB(this._hsb.h, 100, 100, "FF"), e = this._hsb.s / 100 * 100, o = (1 - this._hsb.b / 100) * 100;
     return f`
       <div class="color-selector">
         <div
@@ -782,7 +777,7 @@ let g = class extends R {
             class="selector"
             style=${J({
       left: `${e}%`,
-      top: `${s}%`
+      top: `${o}%`
     })}
           ></div>
         </div>
@@ -921,10 +916,10 @@ g = _([
   T("nf-color-picker")
 ], g);
 const lt = E`:host{width:var(--nf-width);position:relative;display:inline-block}:host([disabled]) .input{cursor:not-allowed;color:var(--nf-color-disabled)}:host([disabled]) .toggle-password{cursor:not-allowed;pointer-events:none;opacity:.5}::slotted(*){position:absolute;top:50%;left:.75rem;transform:translateY(-50%);color:var(--nf-color)}:host([disabled]) ::slotted(*){color:var(--nf-color-disabled)}.input{position:absolute;inset:0;padding:var(--nf-input-padding);outline:0;border:none;background:0 0;box-sizing:border-box;color:var(--nf-color);font-size:var(--nf-font-size);font-weight:var(--nf-font-weight);font-family:var(--nf-font-family),sans-serif}.input:has(.toggle-password){padding-right:2.5rem}.input .toggle-password{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);background:0 0;border:none;cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;color:var(--nf-select-icon-color);transition:color var(--nf-transition-fast) ease;outline:0}.input .toggle-password:hover{color:var(--nf-icon-color-hover)}.input .toggle-password:active{color:var(--nf-icon-color-active)}.input .toggle-password svg{display:block}`;
-var ht = Object.defineProperty, ct = Object.getOwnPropertyDescriptor, O = (t, e, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? ct(e, s) : e, i = t.length - 1, n; i >= 0; i--)
-    (n = t[i]) && (r = (o ? n(e, s, r) : n(r)) || r);
-  return o && r && ht(e, s, r), r;
+var ht = Object.defineProperty, ct = Object.getOwnPropertyDescriptor, O = (t, e, o, s) => {
+  for (var r = s > 1 ? void 0 : s ? ct(e, o) : e, i = t.length - 1, n; i >= 0; i--)
+    (n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
+  return s && r && ht(e, o, r), r;
 };
 let x = class extends R {
   constructor() {
@@ -1009,10 +1004,10 @@ x = O([
   T("nf-input")
 ], x);
 const dt = E`:host{width:var(--nf-width);position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0;overflow:hidden}.input-number{position:relative;padding-right:.6125rem;flex:1;height:100%;outline:0;border:none;background:0 0;box-sizing:border-box;color:var(--nf-color);font-weight:var(--nf-font-weight);text-align:left}.input-number .input-number-input-wrapper{height:100%}.input-number .input-number-input-wrapper .input-number-input{background:0 0;width:100%;height:100%;text-align:start;border:0;outline:0;padding:0;box-sizing:border-box;color:var(--nf-color);font-size:var(--nf-font-size);font-weight:var(--nf-font-weight);font-family:var(--nf-font-family),sans-serif}.input-number::-webkit-inner-spin-button,.input-number::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-number[type=number]{appearance:textfield}.input-number:hover .controls{width:1.5rem}.input-prefix{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding-inline-start:.6125rem;color:var(--nf-color);font-size:var(--nf-font-size);pointer-events:none;-webkit-user-select:none;user-select:none}.input-prefix:not(:empty){padding-inline-end:.25rem}.input-suffix{display:flex;align-items:center;justify-content:center;color:var(--nf-color);font-size:var(--nf-font-size);pointer-events:none;-webkit-user-select:none;user-select:none}.input-suffix:not(:empty){padding-inline-end:.6125rem;padding-inline-start:.5rem}.controls{position:absolute;top:0;right:0;height:100%;width:0;overflow:hidden;display:flex;flex-direction:column;box-sizing:border-box;transition:width var(--nf-transition-fast) ease}.controls:before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:.67px;background-color:var(--nf-control-divider-color)}:host([suffix]) .controls:after{content:\"\";position:absolute;right:0;top:0;bottom:0;width:.67px;background-color:var(--nf-control-divider-color)}.control-btn{flex:1;display:flex;align-items:center;justify-content:center;background:0 0;border:none;cursor:pointer;transition:background-color var(--nf-transition-fast) ease;outline:0;-webkit-user-select:none;user-select:none}.control-btn:hover{background-color:var(--nf-control-btn-background-hover)}.control-btn:active{background-color:var(--nf-control-btn-background-active)}.control-btn:focus-visible{background-color:var(--nf-control-btn-background-hover)}.control-btn svg{display:block;pointer-events:none;fill:none;stroke:var(--nf-select-icon-color);stroke-width:1;stroke-linecap:round}.control-btn-up{border-bottom:.67px solid var(--nf-control-divider-color)}:host(:not([suffix])) .control-btn-up{border-top-right-radius:var(--nf-border-radius)}:host(:not([suffix])) .control-btn-down{border-bottom-right-radius:var(--nf-border-radius)}:host([disabled]) .input-number-input{cursor:not-allowed;color:var(--nf-color-disabled)}:host([disabled]) .input-prefix,:host([disabled]) .input-suffix{color:var(--nf-color-disabled)}:host([disabled]) .controls{display:none}:host([disabled]) .control-btn{cursor:not-allowed;pointer-events:none;opacity:.5}`;
-var ut = Object.defineProperty, pt = Object.getOwnPropertyDescriptor, m = (t, e, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? pt(e, s) : e, i = t.length - 1, n; i >= 0; i--)
-    (n = t[i]) && (r = (o ? n(e, s, r) : n(r)) || r);
-  return o && r && ut(e, s, r), r;
+var ut = Object.defineProperty, pt = Object.getOwnPropertyDescriptor, m = (t, e, o, s) => {
+  for (var r = s > 1 ? void 0 : s ? pt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
+    (n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
+  return s && r && ut(e, o, r), r;
 };
 let p = class extends R {
   constructor() {
@@ -1032,8 +1027,8 @@ let p = class extends R {
   setText(t) {
     let e = t;
     if (e = e.replace(/[^0-9+.\-]/g, ""), this.noNegative && (e = e.replace(/[+\-]/g, "")), this.noDecimal && e.includes(".")) {
-      const s = Number(e);
-      Number.isNaN(s) ? e = e.replace(/\./g, "") : e = String(Math.round(s));
+      const o = Number(e);
+      Number.isNaN(o) ? e = e.replace(/\./g, "") : e = String(Math.round(o));
     }
     return this.text = e, e === t;
   }
@@ -1088,12 +1083,12 @@ let p = class extends R {
     if (e === null)
       return;
     this.value = e;
-    let s = this.fixFloatingPoint(this.value + t * this.step);
-    s = this.clampValue(s);
-    const o = this.validateParsed(s);
-    o !== null && (s = o, s !== this.value && (this.value = s, this.setText(this.formatter(s)), this.dispatchEvent(
+    let o = this.fixFloatingPoint(this.value + t * this.step);
+    o = this.clampValue(o);
+    const s = this.validateParsed(o);
+    s !== null && (o = s, o !== this.value && (this.value = o, this.setText(this.formatter(o)), this.dispatchEvent(
       new CustomEvent("change", {
-        detail: s
+        detail: o
       })
     )));
   }
@@ -1176,12 +1171,12 @@ async function ft(t) {
   return new Promise((e) => setTimeout(e, t));
 }
 const bt = E`:host{width:var(--nf-width);-webkit-user-select:none;user-select:none;cursor:pointer}:host .text{flex-grow:1;display:inline-block;outline:0;white-space:nowrap}:host .icon{width:1.5rem;height:1.5rem;display:inline-block;fill:none;stroke:var(--nf-select-icon-color);stroke-width:1;stroke-linecap:round;margin:0 -.3rem 0 .5rem}:host .dropdown{position:absolute;top:2rem;right:0;left:0;padding:.3rem;background:var(--nf-dropdown-background);-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);border-radius:.5rem;opacity:0;pointer-events:none;color:var(--nf-color);box-shadow:0 0 1rem 0 var(--nf-dropdown-shadow);z-index:1000;transition:opacity var(--nf-transition) ease-out,transform var(--nf-transition) ease-out}:host .dropdown .item{white-space:nowrap;padding:.4rem .7rem;overflow:hidden;text-overflow:ellipsis;border-radius:.3rem;cursor:pointer}:host .dropdown .item-unselected:hover{background:var(--nf-item-background-hover);transition:background-color var(--nf-transition) ease-in-out}:host .dropdown .item-unselected:active{background:var(--nf-item-background-active)}:host .dropdown .item-selected{background-color:color-mix(in srgb,var(--nf-primary-color) 30%,transparent)}:host([disabled]){cursor:not-allowed}:host([disabled]) .text{color:var(--nf-color-disabled)}:host([disabled]) .icon{stroke:var(--nf-color-disabled)}:host([disabled]) .dropdown{display:none}:host(:focus:not([disabled])){color:var(--nf-focus-text-color)}:host(:focus:not([disabled])) .dropdown{transform:translateY(.5rem);opacity:1;pointer-events:auto}:host(:focus:not([disabled])) .cover{pointer-events:auto}`;
-var mt = Object.defineProperty, gt = Object.getOwnPropertyDescriptor, K = (t, e, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? gt(e, s) : e, i = t.length - 1, n; i >= 0; i--)
-    (n = t[i]) && (r = (o ? n(e, s, r) : n(r)) || r);
-  return o && r && mt(e, s, r), r;
+var mt = Object.defineProperty, gt = Object.getOwnPropertyDescriptor, K = (t, e, o, s) => {
+  for (var r = s > 1 ? void 0 : s ? gt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
+    (n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
+  return s && r && mt(e, o, r), r;
 };
-let M = class extends R {
+let D = class extends R {
   constructor() {
     super(...arguments), this.value = "", this.options = [], this.disabled = !1, this.showDropdown = !1, this.jumpCloseFlag = !1, this.timeoutId = null, this.onFocus = () => {
       this.disabled || (this.timeoutId && clearTimeout(this.timeoutId), this.showDropdown = !0, this.jumpCloseFlag = !0);
@@ -1203,9 +1198,9 @@ let M = class extends R {
     this.dispatchEvent(new CustomEvent("input", { detail: t, bubbles: !0, composed: !0 })), this.value !== t && this.dispatchEvent(new CustomEvent("change", { detail: t, bubbles: !0, composed: !0 })), await ft(34), this.blur();
   }
   render() {
-    const t = this.options.findIndex((s) => s.value == this.value), e = t > -1 ? this.options[t]?.label : this.value;
+    const t = this.options.findIndex((o) => o.value == this.value), e = t > -1 ? this.options[t]?.label : this.value;
     return f`<div class=dropdown>${(this.showDropdown ? this.options : []).map(
-      (s) => f`<div @click=${() => this.set(s.value)} class="item ${this.value == s.value ? "item-selected" : "item-unselected"}">${s.label}</div>`
+      (o) => f`<div @click=${() => this.set(o.value)} class="item ${this.value == o.value ? "item-selected" : "item-unselected"}">${o.label}</div>`
     )}</div><slot></slot><div class=text>${e}</div><svg class=icon width=24 height=24 viewBox="0 0 24 24"><path d="M17 10l-5 5.5-5-5.5"/></svg>`;
   }
   connectedCallback() {
@@ -1217,10 +1212,10 @@ let M = class extends R {
     super.disconnectedCallback(), this.removeEventListener("focus", this.onFocus), this.removeEventListener("blur", this.onBlur), this.removeEventListener("click", this.onClick);
   }
 };
-M.styles = [W, bt];
+D.styles = [W, bt];
 K([
   h({ type: String })
-], M.prototype, "value", 2);
+], D.prototype, "value", 2);
 K([
   h({
     type: Array,
@@ -1236,21 +1231,21 @@ K([
       return [];
     }
   })
-], M.prototype, "options", 2);
+], D.prototype, "options", 2);
 K([
   h({ type: Boolean, reflect: !0 })
-], M.prototype, "disabled", 2);
+], D.prototype, "disabled", 2);
 K([
   w()
-], M.prototype, "showDropdown", 2);
-M = K([
+], D.prototype, "showDropdown", 2);
+D = K([
   T("nf-select")
-], M);
+], D);
 const vt = E`:host{display:inline-flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;outline:0}:host[disabled]{cursor:not-allowed;opacity:.6}.switch-wrapper{position:relative;display:inline-block}.switch-container{position:relative;z-index:1;width:3.1rem;height:1.5rem;background-color:var(--nf-background-color);border-radius:.75rem;transition:background-color .2s ease;overflow:hidden}:host(:not([disabled]):not([checked])) .switch-container:hover{background:var(--nf-background-color-hover)}:host([checked]) .switch-container{background-color:var(--nf-primary-color,var(--nf-primary-color))}:host([disabled]) .switch-container{opacity:.5}.ripple{position:absolute;border-radius:.875rem;inset:-.2rem;background-color:#6464641a;animation:ripple-animation 1s ease-out forwards;pointer-events:none;opacity:1}@keyframes ripple-animation{0%{opacity:0}20%{opacity:1}to{opacity:0}}.switch-thumb{position:absolute;top:.125rem;left:0;width:1.25rem;height:1.25rem;transition:transform .2s ease-in-out}.switch-thumb:before{content:\"\";position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:.625rem;box-shadow:0 .125rem .25rem #0003;transition:width .2s ease-in-out,transform .2s ease-in-out}:host(:not([checked])) .switch-thumb{transform:translate(.125rem)}:host(:not([checked])) .switch-container:active .switch-thumb:before{width:1.625rem;border-radius:.625rem}:host([checked]) .switch-thumb{transform:translate(1.725rem)}:host([checked]) .switch-container:active .switch-thumb:before{width:1.625rem;border-radius:.625rem;transform:translate(-.375rem)}:host(:focus) .switch-container{outline:.125rem solid var(--nf-primary-color,var(--nf-primary-color));outline-offset:.125rem}`;
-var _t = Object.defineProperty, yt = Object.getOwnPropertyDescriptor, he = (t, e, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? yt(e, s) : e, i = t.length - 1, n; i >= 0; i--)
-    (n = t[i]) && (r = (o ? n(e, s, r) : n(r)) || r);
-  return o && r && _t(e, s, r), r;
+var _t = Object.defineProperty, yt = Object.getOwnPropertyDescriptor, he = (t, e, o, s) => {
+  for (var r = s > 1 ? void 0 : s ? yt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
+    (n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
+  return s && r && _t(e, o, r), r;
 };
 let I = class extends V {
   constructor() {
@@ -1269,16 +1264,16 @@ let I = class extends V {
   createRipple(t) {
     const e = this.shadowRoot?.querySelector(".switch-wrapper");
     if (!e) return;
-    const s = e.querySelector(".ripple");
-    s && e.removeChild(s);
-    const o = document.createElement("div");
-    o.classList.add("ripple"), e.appendChild(o), o.addEventListener("animationend", () => {
-      e.contains(o) && e.removeChild(o);
+    const o = e.querySelector(".ripple");
+    o && e.removeChild(o);
+    const s = document.createElement("div");
+    s.classList.add("ripple"), e.appendChild(s), s.addEventListener("animationend", () => {
+      e.contains(s) && e.removeChild(s);
     });
   }
   // 渲染开关组件
   render() {
-    return se`<div class=switch-wrapper><div class=switch-container @click=${this.toggleSwitch} aria-checked=${this.checked} aria-disabled=${this.disabled} role=switch><div class=switch-thumb></div></div></div>`;
+    return oe`<div class=switch-wrapper><div class=switch-container @click=${this.toggleSwitch} aria-checked=${this.checked} aria-disabled=${this.disabled} role=switch><div class=switch-thumb></div></div></div>`;
   }
   connectedCallback() {
     this.style.transition = "none", super.connectedCallback(), requestAnimationFrame(() => {
@@ -1297,10 +1292,10 @@ I = he([
   T("nf-switch")
 ], I);
 const wt = E`:host{display:inline-flex;align-items:center;position:relative;width:100%;height:1.25rem;background-color:var(--nf-border-color,#e0e0e0);border-radius:.625rem;cursor:pointer;-webkit-user-select:none;user-select:none;border:none;box-shadow:none;padding:0}:host:hover{background-color:var(--nf-border-color,#e0e0e0);border:none}:host:focus{box-shadow:none;outline:0}:host([disabled]){cursor:not-allowed;opacity:.6}.slider-fill{position:absolute;left:0;top:0;height:100%;background-color:var(--nf-primary-color,#5e72f9);border-radius:.625rem 0 0 .625rem;pointer-events:none}.slider-handle{position:absolute;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:50%;top:50%;transform:translate(-50%,-50%);cursor:grab;outline:0;box-shadow:0 1px 3px #0000004d;transition:transform .15s ease,box-shadow .15s ease;z-index:1}:host([disabled]) .slider-handle{cursor:not-allowed}:host(:not([disabled])) .slider-handle:hover{transform:translate(-50%,-50%) scale(1.05)}:host(:not([disabled])) .slider-handle:active{cursor:grabbing;transform:translate(-50%,-50%) scale(1.15);box-shadow:0 3px 8px #0006}.slider-handle:focus{box-shadow:0 0 0 3px #5e72f94d}.slider-tooltip{position:absolute;bottom:calc(100% + .5rem);left:50%;transform:translate(-50%);background-color:var(--nf-slider-tooltip-background);color:var(--nf-color);padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;white-space:nowrap;opacity:0;transition:opacity .2s ease;pointer-events:none;box-shadow:0 0 .4rem .1rem #0000001a}.slider-tooltip.visible{opacity:1}`;
-var $t = Object.defineProperty, xt = Object.getOwnPropertyDescriptor, y = (t, e, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? xt(e, s) : e, i = t.length - 1, n; i >= 0; i--)
-    (n = t[i]) && (r = (o ? n(e, s, r) : n(r)) || r);
-  return o && r && $t(e, s, r), r;
+var $t = Object.defineProperty, xt = Object.getOwnPropertyDescriptor, y = (t, e, o, s) => {
+  for (var r = s > 1 ? void 0 : s ? xt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
+    (n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
+  return s && r && $t(e, o, r), r;
 };
 let v = class extends R {
   constructor() {
@@ -1373,7 +1368,7 @@ let v = class extends R {
     this._isDragging = !0, this._showTooltip = !0, this._updateValue(t), document.addEventListener("mousemove", this._handleDrag), document.addEventListener("touchmove", this._handleDrag, { passive: !1 }), document.addEventListener("mouseup", this._stopDrag), document.addEventListener("touchend", this._stopDrag);
   }
   _updateValue(t) {
-    const e = this.getBoundingClientRect(), s = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX, o = Math.max(0, Math.min(1, (s - e.left) / e.width)), r = this.max - this.min, i = this.min + o * r, n = Math.round((i - this.min) / this.step), l = this.min + n * this.step;
+    const e = this.getBoundingClientRect(), o = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX, s = Math.max(0, Math.min(1, (o - e.left) / e.width)), r = this.max - this.min, i = this.min + s * r, n = Math.round((i - this.min) / this.step), l = this.min + n * this.step;
     this._currentValue = Math.min(this.max, Math.max(this.min, l)), this.requestUpdate();
   }
   _getValuePercentage() {
@@ -1381,8 +1376,8 @@ let v = class extends R {
     return t === 0 ? 0 : (this._currentValue - this.min) / t * 100;
   }
   render() {
-    const t = this._getValuePercentage(), e = `${t}%`, s = `${t}%`, o = `slider-tooltip ${this._showTooltip || this.tooltip ? "visible" : ""}`;
-    return f`<div class=slider-fill style=${J({ width: s })}></div><div class=slider-handle style=${J({ left: e })} tabindex=${this.disabled ? -1 : 0} @mousedown=${this._handleMouseDown} @touchstart=${this._handleTouchStart} @keydown=${this._handleKeyDown}><div class=${o}>${this._currentValue}</div></div>`;
+    const t = this._getValuePercentage(), e = `${t}%`, o = `${t}%`, s = `slider-tooltip ${this._showTooltip || this.tooltip ? "visible" : ""}`;
+    return f`<div class=slider-fill style=${J({ width: o })}></div><div class=slider-handle style=${J({ left: e })} tabindex=${this.disabled ? -1 : 0} @mousedown=${this._handleMouseDown} @touchstart=${this._handleTouchStart} @keydown=${this._handleKeyDown}><div class=${s}>${this._currentValue}</div></div>`;
   }
 };
 v.styles = [W, wt];
@@ -1427,7 +1422,7 @@ export {
   g as NfColorPickerElement,
   x as NfInputElement,
   p as NfInputNumberElement,
-  M as NfSelectElement,
+  D as NfSelectElement,
   v as NfSliderElement,
   I as NfSwitchElement
 };

package/dist/react/index.js

@@ -1,11 +1,6 @@
 import { createComponent as N } from "@lit/react";
 import T from "react";
 import { css as C, LitElement as W, html as f } from "lit";
-const O = (t) => (e, s) => {
-  s !== void 0 ? s.addInitializer(() => {
-    customElements.define(t, e);
-  }) : customElements.define(t, e);
-};
 const G = globalThis, ie = G.ShadowRoot && (G.ShadyCSS === void 0 || G.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, xe = /* @__PURE__ */ Symbol(), ue = /* @__PURE__ */ new WeakMap();
 let Pe = class {
   constructor(e, s, o) {
@@ -25,7 +20,7 @@ let Pe = class {
     return this.cssText;
   }
 };
-const De = (t) => new Pe(typeof t == "string" ? t : t + "", void 0, xe), Me = (t, e) => {
+const Me = (t) => new Pe(typeof t == "string" ? t : t + "", void 0, xe), De = (t, e) => {
   if (ie) t.adoptedStyleSheets = e.map((s) => s instanceof CSSStyleSheet ? s : s.styleSheet);
   else for (const s of e) {
     const o = document.createElement("style"), r = G.litNonce;
@@ -34,7 +29,7 @@ const De = (t) => new Pe(typeof t == "string" ? t : t + "", void 0, xe), Me = (t
 }, pe = ie ? (t) => t : (t) => t instanceof CSSStyleSheet ? ((e) => {
   let s = "";
   for (const o of e.cssRules) s += o.cssText;
-  return De(s);
+  return Me(s);
 })(t) : t;
 const { is: Ne, defineProperty: Te, getOwnPropertyDescriptor: Oe, getOwnPropertyNames: Be, getOwnPropertySymbols: Ve, getPrototypeOf: He } = Object, te = globalThis, fe = te.trustedTypes, Ue = fe ? fe.emptyScript : "", Le = te.reactiveElementPolyfillSupport, j = (t, e) => t, J = { toAttribute(t, e) {
   switch (e) {
@@ -147,7 +142,7 @@ let V = class extends HTMLElement {
   }
   createRenderRoot() {
     const e = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
-    return Me(e, this.constructor.elementStyles), e;
+    return De(e, this.constructor.elementStyles), e;
   }
   connectedCallback() {
     this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach((e) => e.hostConnected?.());
@@ -278,7 +273,7 @@ function h(t) {
 function w(t) {
   return h({ ...t, state: !0, attribute: !1 });
 }
-const K = C`:host{display:inline-flex;align-items:center;position:relative;width:var(--nf-width);height:var(--nf-height);padding:var(--nf-padding);margin:var(--nf-margin);font-size:var(--nf-text-font-size);font-weight:var(--nf-font-weight);color:var(--nf-color);background:var(--nf-background-color);border-radius:var(--nf-border-radius);border:1px solid var(--nf-border-color);outline:0;background-clip:padding-box;box-shadow:0 0 0 .15rem var(--nf-box-shadow-color);transition:color var(--nf-transition) ease-in-out,background-color var(--nf-transition) ease-in-out,border-color var(--nf-transition) ease-in-out,box-shadow var(--nf-transition) ease-in-out}:host(:focus){border-color:var(--nf-border-color-hover);box-shadow:0 0 0 .15rem var(--nf-box-shadow-color-focus);background:var(--nf-background-color-hover)}:host(:hover:not([disabled])){border-color:var(--nf-border-color-hover);background:var(--nf-background-color-hover)}:host([disabled]){cursor:not-allowed;opacity:.6;pointer-events:auto}:host([disabled]:hover){border-color:var(--nf-border-color);background:var(--nf-background-color)}`, je = C`:host{width:var(--nf-width);position:relative;display:inline-block}:host([disabled]) .input{cursor:not-allowed;color:var(--nf-color-disabled)}:host([disabled]) .toggle-password{cursor:not-allowed;pointer-events:none;opacity:.5}::slotted(*){position:absolute;top:50%;left:.75rem;transform:translateY(-50%);color:var(--nf-color)}:host([disabled]) ::slotted(*){color:var(--nf-color-disabled)}.input{position:absolute;inset:0;padding:var(--nf-input-padding);outline:0;border:none;background:0 0;box-sizing:border-box;color:var(--nf-color);font-size:var(--nf-font-size);font-weight:var(--nf-font-weight);font-family:var(--nf-font-family),sans-serif}.input:has(.toggle-password){padding-right:2.5rem}.input .toggle-password{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);background:0 0;border:none;cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;color:var(--nf-select-icon-color);transition:color var(--nf-transition-fast) ease;outline:0}.input .toggle-password:hover{color:var(--nf-icon-color-hover)}.input .toggle-password:active{color:var(--nf-icon-color-active)}.input .toggle-password svg{display:block}`;
+const K = C`:host{display:inline-flex;align-items:center;position:relative;width:var(--nf-width);height:var(--nf-height);padding:var(--nf-padding);margin:var(--nf-margin);font-size:var(--nf-text-font-size);font-weight:var(--nf-font-weight);color:var(--nf-color);background:var(--nf-background-color);border-radius:var(--nf-border-radius);border:1px solid var(--nf-border-color);outline:0;background-clip:padding-box;box-shadow:0 0 0 .15rem var(--nf-box-shadow-color);transition:color var(--nf-transition) ease-in-out,background-color var(--nf-transition) ease-in-out,border-color var(--nf-transition) ease-in-out,box-shadow var(--nf-transition) ease-in-out}:host(:focus){border-color:var(--nf-border-color-hover);box-shadow:0 0 0 .15rem var(--nf-box-shadow-color-focus);background:var(--nf-background-color-hover)}:host(:hover:not([disabled])){border-color:var(--nf-border-color-hover);background:var(--nf-background-color-hover)}:host([disabled]){cursor:not-allowed;opacity:.6;pointer-events:auto}:host([disabled]:hover){border-color:var(--nf-border-color);background:var(--nf-background-color)}`, je = C`:host{width:var(--nf-width);position:relative;display:inline-block}:host([disabled]) .input{cursor:not-allowed;color:var(--nf-color-disabled)}:host([disabled]) .toggle-password{cursor:not-allowed;pointer-events:none;opacity:.5}::slotted(*){position:absolute;top:50%;left:.75rem;transform:translateY(-50%);color:var(--nf-color)}:host([disabled]) ::slotted(*){color:var(--nf-color-disabled)}.input{position:absolute;inset:0;padding:var(--nf-input-padding);outline:0;border:none;background:0 0;box-sizing:border-box;color:var(--nf-color);font-size:var(--nf-font-size);font-weight:var(--nf-font-weight);font-family:var(--nf-font-family),sans-serif}.input:has(.toggle-password){padding-right:2.5rem}.input .toggle-password{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);background:0 0;border:none;cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;color:var(--nf-select-icon-color);transition:color var(--nf-transition-fast) ease;outline:0}.input .toggle-password:hover{color:var(--nf-icon-color-hover)}.input .toggle-password:active{color:var(--nf-icon-color-active)}.input .toggle-password svg{display:block}`, O = (t) => (e) => (typeof window > "u" || customElements.get(t) || customElements.define(t, e), e);
 var ze = Object.defineProperty, Re = Object.getOwnPropertyDescriptor, B = (t, e, s, o) => {
   for (var r = o > 1 ? void 0 : o ? Re(e, s) : e, i = t.length - 1, n; i >= 0; i--)
     (n = t[i]) && (r = (o ? n(e, s, r) : n(r)) || r);
@@ -459,9 +454,9 @@ const Tt = N({
     onChange: "change"
   }
 });
-const ae = globalThis, me = (t) => t, Q = ae.trustedTypes, ge = Q ? Q.createPolicy("lit-html", { createHTML: (t) => t }) : void 0, ke = "$lit$", A = `lit$${Math.random().toFixed(9).slice(2)}$`, Ae = "?" + A, Ye = `<${Ae}>`, D = document, z = () => D.createComment(""), R = (t) => t === null || typeof t != "object" && typeof t != "function", le = Array.isArray, Xe = (t) => le(t) || typeof t?.[Symbol.iterator] == "function", oe = `[ 	
+const ae = globalThis, me = (t) => t, Q = ae.trustedTypes, ge = Q ? Q.createPolicy("lit-html", { createHTML: (t) => t }) : void 0, ke = "$lit$", A = `lit$${Math.random().toFixed(9).slice(2)}$`, Ae = "?" + A, Ye = `<${Ae}>`, M = document, z = () => M.createComment(""), R = (t) => t === null || typeof t != "object" && typeof t != "function", le = Array.isArray, Xe = (t) => le(t) || typeof t?.[Symbol.iterator] == "function", oe = `[ 	
 \f\r]`, I = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, ve = /-->/g, _e = />/g, S = RegExp(`>|${oe}(?:([^\\s"'>=/]+)(${oe}*=${oe}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), ye = /'/g, we = /"/g, Ee = /^(?:script|style|textarea|title)$/i, Ge = (t) => (e, ...s) => ({ _$litType$: t, strings: e, values: s }), re = Ge(1), M = /* @__PURE__ */ Symbol.for("lit-noChange"), b = /* @__PURE__ */ Symbol.for("lit-nothing"), $e = /* @__PURE__ */ new WeakMap(), P = D.createTreeWalker(D, 129);
+\f\r"'\`<>=]|("|')|))|$)`, "g"), ye = /'/g, we = /"/g, Ee = /^(?:script|style|textarea|title)$/i, Ge = (t) => (e, ...s) => ({ _$litType$: t, strings: e, values: s }), re = Ge(1), D = /* @__PURE__ */ Symbol.for("lit-noChange"), b = /* @__PURE__ */ Symbol.for("lit-nothing"), $e = /* @__PURE__ */ new WeakMap(), P = M.createTreeWalker(M, 129);
 function Ce(t, e) {
   if (!le(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
   return ge !== void 0 ? ge.createHTML(e) : e;
@@ -511,12 +506,12 @@ class q {
     }
   }
   static createElement(e, s) {
-    const o = D.createElement("template");
+    const o = M.createElement("template");
     return o.innerHTML = e, o;
   }
 }
 function U(t, e, s = t, o) {
-  if (e === M) return e;
+  if (e === D) return e;
   let r = o !== void 0 ? s._$Co?.[o] : s._$Cl;
   const i = R(e) ? void 0 : e._$litDirective$;
   return r?.constructor !== i && (r?._$AO?.(!1), i === void 0 ? r = void 0 : (r = new i(t), r._$AT(t, s, o)), o !== void 0 ? (s._$Co ??= [])[o] = r : s._$Cl = r), r !== void 0 && (e = U(t, r._$AS(t, e.values), r, o)), e;
@@ -532,7 +527,7 @@ class Qe {
     return this._$AM._$AU;
   }
   u(e) {
-    const { el: { content: s }, parts: o } = this._$AD, r = (e?.creationScope ?? D).importNode(s, !0);
+    const { el: { content: s }, parts: o } = this._$AD, r = (e?.creationScope ?? M).importNode(s, !0);
     P.currentNode = r;
     let i = P.nextNode(), n = 0, l = 0, a = o[0];
     for (; a !== void 0; ) {
@@ -542,7 +537,7 @@ class Qe {
       }
       n !== a?.index && (i = P.nextNode(), n++);
     }
-    return P.currentNode = D, r;
+    return P.currentNode = M, r;
   }
   p(e) {
     let s = 0;
@@ -568,7 +563,7 @@ class Y {
     return this._$AB;
   }
   _$AI(e, s = this) {
-    e = U(this, e, s), R(e) ? e === b || e == null || e === "" ? (this._$AH !== b && this._$AR(), this._$AH = b) : e !== this._$AH && e !== M && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Xe(e) ? this.k(e) : this._(e);
+    e = U(this, e, s), R(e) ? e === b || e == null || e === "" ? (this._$AH !== b && this._$AR(), this._$AH = b) : e !== this._$AH && e !== D && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Xe(e) ? this.k(e) : this._(e);
   }
   O(e) {
     return this._$AA.parentNode.insertBefore(e, this._$AB);
@@ -577,7 +572,7 @@ class Y {
     this._$AH !== e && (this._$AR(), this._$AH = this.O(e));
   }
   _(e) {
-    this._$AH !== b && R(this._$AH) ? this._$AA.nextSibling.data = e : this.T(D.createTextNode(e)), this._$AH = e;
+    this._$AH !== b && R(this._$AH) ? this._$AA.nextSibling.data = e : this.T(M.createTextNode(e)), this._$AH = e;
   }
   $(e) {
     const { values: s, _$litType$: o } = e, r = typeof o == "number" ? this._$AC(e) : (o.el === void 0 && (o.el = q.createElement(Ce(o.h, o.h[0]), this.options)), o);
@@ -621,11 +616,11 @@ class se {
   _$AI(e, s = this, o, r) {
     const i = this.strings;
     let n = !1;
-    if (i === void 0) e = U(this, e, s, 0), n = !R(e) || e !== this._$AH && e !== M, n && (this._$AH = e);
+    if (i === void 0) e = U(this, e, s, 0), n = !R(e) || e !== this._$AH && e !== D, n && (this._$AH = e);
     else {
       const l = e;
       let a, c;
-      for (e = i[0], a = 0; a < i.length - 1; a++) c = U(this, l[o + a], s, a), c === M && (c = this._$AH[a]), n ||= !R(c) || c !== this._$AH[a], c === b ? e = b : e !== b && (e += (c ?? "") + i[a + 1]), this._$AH[a] = c;
+      for (e = i[0], a = 0; a < i.length - 1; a++) c = U(this, l[o + a], s, a), c === D && (c = this._$AH[a]), n ||= !R(c) || c !== this._$AH[a], c === b ? e = b : e !== b && (e += (c ?? "") + i[a + 1]), this._$AH[a] = c;
     }
     n && !r && this.j(e);
   }
@@ -654,7 +649,7 @@ class st extends se {
     super(e, s, o, r, i), this.type = 5;
   }
   _$AI(e, s = this) {
-    if ((e = U(this, e, s, 0) ?? b) === M) return;
+    if ((e = U(this, e, s, 0) ?? b) === D) return;
     const o = this._$AH, r = e === b && o !== b || e.capture !== o.capture || e.once !== o.once || e.passive !== o.passive, i = e !== b && (o === b || r);
     r && this.element.removeEventListener(this.name, this, o), i && this.element.addEventListener(this.name, this, e), this._$AH = e;
   }
@@ -704,7 +699,7 @@ let H = class extends V {
     super.disconnectedCallback(), this._$Do?.setConnected(!1);
   }
   render() {
-    return M;
+    return D;
   }
 };
 H._$litElement$ = !0, H.finalized = !0, he.litElementHydrateSupport?.({ LitElement: H });
@@ -1026,7 +1021,7 @@ const Se = "important", yt = " !" + Se, ee = vt(class extends _t {
         o.includes("-") || i ? s.setProperty(o, i ? r.slice(0, -11) : r, i ? Se : "") : s[o] = r;
       }
     }
-    return M;
+    return D;
   }
 }), wt = C`:host{display:inline-block;position:relative}:host([disabled]){cursor:not-allowed;opacity:.6}:host([disabled]:hover){border-color:var(--nf-border-color);background:var(--nf-background-color)}:host([open]){border-color:var(--nf-border-color-hover);box-shadow:0 0 0 .15rem var(--nf-box-shadow-color-focus)}.trigger{width:calc(100% + 1.5rem + 2px);height:calc(100% + 2px);margin:-1px -.75rem;padding:1px .75rem;box-sizing:border-box;display:flex;align-items:center;cursor:pointer;transition:all .2s;font-size:.875rem;position:relative}:host(:not([disabled])) .trigger:hover{border-color:var(--nf-color-primary)}.trigger[disabled]{cursor:not-allowed;opacity:.6}:host([disabled]) .trigger{cursor:not-allowed;color:var(--nf-color-disabled)}.color-block{width:1.25rem;height:1.25rem;border-radius:.125rem;margin-left:calc((var(--nf-height) - 1.25rem)/ 2 - .75rem);margin-right:.4rem}:host(.hide-text) .color-block{margin-right:calc((var(--nf-height) - 1.25rem)/ 2 - .75rem)}.color-text{flex:1}.panel{position:absolute;z-index:1000;background:var(--nf-color-picker-card-background,var(--nf-dropdown-background));-webkit-backdrop-filter:blur(64px);backdrop-filter:blur(64px);border-radius:var(--nf-border-radius);box-shadow:0 6px 16px 0 var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow)),0 3px 6px -4px var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow)),0 9px 28px 8px var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow));-webkit-user-select:none;user-select:none}.panel-content{padding:.75rem;width:15rem}.color-selector{height:9.375rem;position:relative;margin-bottom:.75rem;border-radius:var(--nf-border-radius);overflow:hidden}.color-sb{width:100%;height:100%;position:relative;cursor:pointer}.sb-white{position:absolute;inset:0;background:linear-gradient(to right,#fff,#fff0)}.sb-black{position:absolute;inset:0;background:linear-gradient(to top,#000,#0000)}.selector{position:absolute;width:.625rem;height:.625rem;border:.125rem solid #fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 .125rem #00000080;pointer-events:none}.slider-container{margin-bottom:.5rem}.slider-container:last-child{margin-bottom:0}.sliders-row{display:flex;align-items:center;gap:.75rem}.sliders{flex:1}.slider{position:relative;height:.75rem;border-radius:.375rem}.hue-slider{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.alpha-slider{position:relative;background-image:linear-gradient(45deg,var(--nf-color-picker-card-checker,#ccc) 25%,transparent 25%),linear-gradient(-45deg,var(--nf-color-picker-card-checker,#ccc) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--nf-color-picker-card-checker,#ccc) 75%),linear-gradient(-45deg,transparent 75%,var(--nf-color-picker-card-checker,#ccc) 75%);background-size:.375rem .375rem;background-position:0 0,0 .1875rem,.1875rem -.1875rem,-.1875rem 0;background-color:var(--nf-color-picker-card-checker-bg,#fff);border-radius:.375rem}.alpha-slider-input{position:relative;z-index:2}.alpha-gradient{position:absolute;inset:0;border-radius:.375rem}input[type=range]{-webkit-appearance:none;width:100%;height:100%;background:0 0;outline:0;position:absolute;top:0;left:0;margin:0;padding:0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:1rem;height:1rem;border-radius:50%;background:#fff;border:.125rem solid var(--nf-color-border);cursor:pointer;box-shadow:0 0 .125rem #00000080;position:relative;z-index:1}input[type=range]::-moz-range-thumb{width:1rem;height:1rem;border-radius:50%;background:#fff;border:.125rem solid var(--nf-color-border);cursor:pointer;box-shadow:0 0 .125rem #00000080}.current-color-container{display:flex}.current-color{width:2rem;height:2rem;border-radius:var(--nf-border-radius);border:.0625rem solid var(--nf-color-border)}:host(:not([disabled-alpha])) .current-color{width:2.5rem;height:2.5rem}`;
 var $t = Object.defineProperty, xt = Object.getOwnPropertyDescriptor, _ = (t, e, s, o) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-flow-design",
-  "version": "1.5.0",
+  "version": "1.5.3",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",