@tachui/core 0.7.1-alpha → 0.8.0-alpha

package/dist/production-minimal-BY_gMc-l.js

@@ -0,0 +1,2532 @@
+import { L as et, M as at, V as st, G as ct, W as lt } from "./scheduler-BKeqwrYE.js";
+import { c as dt } from "./effect-B9Knft0b.js";
+import { g as nt } from "./dom-bridge-CAa1N2zX.js";
+import "./component-XAzF1xqs.js";
+import { u as k } from "./concatenated-component-ByPl3_FF.js";
+import "./index-DIvMCJQO.js";
+import "./constants/layout.js";
+class S {
+  constructor(t) {
+    this.name = t;
+  }
+}
+var ut = Object.defineProperty, ft = (e, t, n) => t in e ? ut(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, K = (e, t, n) => ft(e, typeof t != "symbol" ? t + "" : t, n);
+class u extends S {
+  constructor(t) {
+    if (super(t.name), K(this, "default"), K(this, "light"), K(this, "dark"), !t.default)
+      throw new Error(`ColorAsset "${t.name}" must specify a default color`);
+    const n = u.validateColor(t.default);
+    if (!n.isValid)
+      throw new Error(`Invalid default color format for asset "${t.name}": ${n.error}`);
+    if (t.light) {
+      const r = u.validateColor(t.light);
+      if (!r.isValid)
+        throw new Error(`Invalid light color format for asset "${t.name}": ${r.error}`);
+    }
+    if (t.dark) {
+      const r = u.validateColor(t.dark);
+      if (!r.isValid)
+        throw new Error(`Invalid dark color format for asset "${t.name}": ${r.error}`);
+    }
+    this.default = t.default, this.light = t.light, this.dark = t.dark;
+  }
+  static init(t) {
+    return new u(t);
+  }
+  /**
+   * Validates a color string format
+   * Supports: hex, rgb, rgba, hsl, hsla, and named colors
+   */
+  static validateColor(t) {
+    if (!t || typeof t != "string")
+      return {
+        isValid: !1,
+        error: "Color must be a non-empty string"
+      };
+    const n = t.trim();
+    if (/^#([A-Fa-f0-9]{3}|[A-Fa-f0-9]{6}|[A-Fa-f0-9]{8})$/.test(n))
+      return { isValid: !0, format: "hex" };
+    const o = /^rgb\s*\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)$/;
+    if (o.test(n)) {
+      const d = n.match(o), [, h, g, m] = d.map(Number);
+      return h <= 255 && g <= 255 && m <= 255 ? { isValid: !0, format: "rgb" } : {
+        isValid: !1,
+        error: "RGB values must be between 0 and 255"
+      };
+    }
+    const i = /^rgba\s*\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]*\.?[0-9]+)\s*\)$/;
+    if (i.test(n)) {
+      const d = n.match(i), [, h, g, m, W] = d, q = Number(h), z = Number(g), J = Number(m), A = Number(W);
+      return q <= 255 && z <= 255 && J <= 255 && A >= 0 && A <= 1 ? { isValid: !0, format: "rgba" } : {
+        isValid: !1,
+        error: "RGBA values must be: RGB 0-255, alpha 0-1"
+      };
+    }
+    const s = /^hsl\s*\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})%\s*,\s*([0-9]{1,3})%\s*\)$/;
+    if (s.test(n)) {
+      const d = n.match(s), [, h, g, m] = d.map(Number);
+      return h <= 360 && g <= 100 && m <= 100 ? { isValid: !0, format: "hsl" } : {
+        isValid: !1,
+        error: "HSL values must be: H 0-360, S/L 0-100%"
+      };
+    }
+    const c = /^hsla\s*\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})%\s*,\s*([0-9]{1,3})%\s*,\s*([0-9]*\.?[0-9]+)\s*\)$/;
+    if (c.test(n)) {
+      const d = n.match(c), [, h, g, m, W] = d, q = Number(h), z = Number(g), J = Number(m), A = Number(W);
+      return q <= 360 && z <= 100 && J <= 100 && A >= 0 && A <= 1 ? { isValid: !0, format: "hsla" } : {
+        isValid: !1,
+        error: "HSLA values must be: H 0-360, S/L 0-100%, alpha 0-1"
+      };
+    }
+    return [
+      "transparent",
+      "currentColor",
+      "inherit",
+      "initial",
+      "unset",
+      "black",
+      "white",
+      "red",
+      "green",
+      "blue",
+      "yellow",
+      "cyan",
+      "magenta",
+      "gray",
+      "grey",
+      "orange",
+      "purple",
+      "pink",
+      "brown",
+      "navy",
+      "teal",
+      "lime",
+      "olive",
+      "maroon",
+      "silver",
+      "aqua",
+      "fuchsia"
+    ].includes(n.toLowerCase()) ? { isValid: !0, format: "named" } : n.startsWith("var(--") && n.endsWith(")") ? { isValid: !0, format: "named" } : {
+      isValid: !1,
+      error: "Unsupported color format. Supported: hex, rgb, rgba, hsl, hsla, named colors, CSS custom properties"
+    };
+  }
+  static getCurrentTheme() {
+    return et();
+  }
+  resolve() {
+    return u.getCurrentTheme() === "dark" ? this.dark || this.default : this.light || this.default;
+  }
+}
+var mt = Object.defineProperty, pt = (e, t, n) => t in e ? mt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, x = (e, t, n) => pt(e, typeof t != "symbol" ? t + "" : t, n);
+class C extends S {
+  constructor(t, n = [], r = "", o = {}) {
+    super(r || t), x(this, "family"), x(this, "fallbacks"), x(this, "options"), x(this, "loaded", !1), x(this, "loadPromise", null), this.family = t, this.fallbacks = n, this.options = {
+      loading: "lazy",
+      fontDisplay: "swap",
+      preconnect: !0,
+      ...o
+    }, this.options.loading === "eager" && this.load();
+  }
+  /**
+   * Static factory method for SwiftUI-style initialization
+   */
+  static init(t, n = [], r, o = {}) {
+    return new C(t, n, r, o);
+  }
+  /**
+   * Get the full font-family CSS value including fallbacks
+   */
+  get value() {
+    return [this.family, ...this.fallbacks].map((n) => n.includes(" ") ? `"${n}"` : n).join(", ");
+  }
+  /**
+   * Load the font if not already loaded
+   */
+  async load() {
+    if (!(this.loaded || !this.options.fontUrl)) {
+      if (this.loadPromise)
+        return this.loadPromise;
+      this.loadPromise = this.loadFont(), await this.loadPromise, this.loaded = !0;
+    }
+  }
+  /**
+   * Internal font loading implementation
+   */
+  async loadFont() {
+    const { fontUrl: t, preconnect: n } = this.options;
+    if (t) {
+      if (n && typeof document < "u" && document.querySelector)
+        try {
+          const o = new URL(t).origin;
+          if (!document.querySelector(`link[rel="preconnect"][href="${o}"]`)) {
+            const i = document.createElement("link");
+            i.rel = "preconnect", i.href = o, i.crossOrigin = "anonymous", document.head.appendChild(i);
+          }
+        } catch {
+        }
+      if (t.endsWith(".css") || t.includes("fonts.googleapis.com") ? await this.loadFontCSS(t) : await this.loadFontFile(t), "fonts" in document)
+        try {
+          await document.fonts.ready;
+          const o = `16px ${this.family.includes(" ") ? `"${this.family}"` : this.family}`;
+          document.fonts.check(o) || console.warn(`⚠️ Font "${this.family}" may not have loaded correctly`);
+        } catch {
+        }
+    }
+  }
+  /**
+   * Load a CSS file containing @font-face rules
+   */
+  async loadFontCSS(t) {
+    return new Promise((n, r) => {
+      if (document.querySelector(`link[href="${t}"]`)) {
+        n();
+        return;
+      }
+      const i = document.createElement("link");
+      i.rel = "stylesheet", i.href = t, i.onload = () => {
+        n();
+      }, i.onerror = (s) => {
+        console.warn(`⚠️ Failed to load font CSS for ${this.family}:`, t), n();
+      }, document.head.appendChild(i);
+    });
+  }
+  /**
+   * Load a font file directly and create @font-face rule
+   */
+  async loadFontFile(t) {
+    const { fontFormat: n, fontDisplay: r, weightRange: o, widthRange: i } = this.options;
+    let s = "";
+    n ? s = `format('${n}')` : t.endsWith(".woff2") ? s = "format('woff2')" : t.endsWith(".woff") ? s = "format('woff')" : t.endsWith(".ttf") && (s = "format('truetype')");
+    let c = `
+      @font-face {
+        font-family: "${this.family}";
+        src: url("${t}") ${s};
+        font-display: ${r || "swap"};
+    `;
+    o && (c += `font-weight: ${o[0]} ${o[1]};
+`), i && (c += `font-stretch: ${i[0]}% ${i[1]}%;
+`), c += "}";
+    const f = document.createElement("style");
+    if (f.textContent = c, document.head.appendChild(f), "FontFace" in window)
+      try {
+        const d = new FontFace(this.family, `url(${t})`, {
+          display: r || "swap",
+          weight: o ? `${o[0]} ${o[1]}` : void 0,
+          stretch: i ? `${i[0]}% ${i[1]}%` : void 0
+        });
+        await d.load(), document.fonts.add(d);
+      } catch {
+      }
+  }
+  /**
+   * Create a CSS variable for this font
+   */
+  toCSSVariable(t) {
+    return `${t || `--font-${this.name.toLowerCase().replace(/\s+/g, "-")}`}: ${this.value};`;
+  }
+  /**
+   * Get debug information
+   */
+  [Symbol.for("nodejs.util.inspect.custom")]() {
+    return `FontAsset(${this.family}, loaded: ${this.loaded})`;
+  }
+  /**
+   * Resolve the font value (required by Asset base class)
+   */
+  resolve() {
+    return this.options.loading === "lazy" && !this.loaded && this.options.fontUrl && this.load(), this.value;
+  }
+}
+const Qt = {
+  ultraCondensed: 50,
+  extraCondensed: 62.5,
+  condensed: 75,
+  semiCondensed: 87.5,
+  normal: 100,
+  semiExpanded: 112.5,
+  expanded: 125,
+  extraExpanded: 150,
+  ultraExpanded: 200
+}, X = {
+  sansSerif: ["system-ui", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial", "sans-serif"],
+  serif: ["Georgia", "Cambria", "Times New Roman", "Times", "serif"],
+  monospace: ["ui-monospace", "SFMono-Regular", "SF Mono", "Consolas", "Liberation Mono", "Menlo", "Courier", "monospace"],
+  cursive: ["cursive"],
+  fantasy: ["fantasy"]
+};
+function Xt(e = "sansSerif", t) {
+  return new C("", [...X[e]], t || `system-${e}`);
+}
+function Yt(e, t = [400], n, r = {}) {
+  const o = t.join(";"), s = `https://fonts.googleapis.com/css2?family=${e.replace(/\s+/g, "+")}:wght@${o}&display=swap`;
+  return new C(
+    e,
+    [...X.sansSerif],
+    n || e.toLowerCase().replace(/\s+/g, "-"),
+    {
+      ...r,
+      fontUrl: s,
+      preconnect: !0
+    }
+  );
+}
+function te(e, t, n, r = [...X.sansSerif], o) {
+  const i = {};
+  return n.slant && (i.slnt = n.slant), n.optical && (i.opsz = n.optical), n.custom && Object.assign(i, n.custom), new C(e, r, o, {
+    fontUrl: t,
+    weightRange: n.weight,
+    widthRange: n.width,
+    variableAxes: i,
+    fontDisplay: "swap"
+  });
+}
+var ht = Object.defineProperty, gt = (e, t, n) => t in e ? ht(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, bt = (e, t, n) => gt(e, t + "", n);
+class yt {
+  constructor() {
+    bt(this, "assets", /* @__PURE__ */ new Map());
+  }
+  add(t, n) {
+    this.assets.set(t, n);
+  }
+  get(t) {
+    return this.assets.get(t);
+  }
+  getAll() {
+    return new Map(this.assets);
+  }
+  // Proxy handler for dot notation access
+  asProxy() {
+    return new Proxy(
+      {},
+      {
+        get: (t, n) => {
+          if (n === "toString" || n === "valueOf")
+            return () => "[Assets]";
+          const r = this.assets.get(n);
+          if (r)
+            return r instanceof u ? new Proxy(r, {
+              get: (o, i) => i === "light" || i === "dark" ? o[i] : i === "toString" || i === "valueOf" ? () => o.resolve() : o[i]
+            }) : r instanceof C ? new Proxy(r, {
+              get: (o, i) => i === "family" || i === "fallbacks" || i === "options" ? o[i] : i === "toString" || i === "valueOf" ? () => o.resolve() : o[i]
+            }) : r;
+        },
+        // Add ownKeys handler to support Object.keys() enumeration
+        ownKeys: (t) => Array.from(this.assets.keys()),
+        // Add has handler to support 'in' operator
+        has: (t, n) => this.assets.has(n)
+      }
+    );
+  }
+}
+var Pt = Object.defineProperty, vt = (e, t, n) => t in e ? Pt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, R = (e, t, n) => vt(e, typeof t != "symbol" ? t + "" : t, n);
+class N extends S {
+  constructor(t) {
+    if (super(t.name), R(this, "default"), R(this, "light"), R(this, "dark"), R(this, "alt"), R(this, "placeholder"), !t.default)
+      throw new Error(`ImageAsset "${t.name}" must specify a default image path`);
+    this.default = t.default, this.light = t.light, this.dark = t.dark, this.alt = t.options?.alt, this.placeholder = t.options?.placeholder;
+  }
+  static init(t) {
+    return new N(t);
+  }
+  static getCurrentTheme() {
+    return et();
+  }
+  resolve() {
+    const t = st() !== null;
+    let n;
+    return t ? n = at()() : n = N.getCurrentTheme(), n === "dark" ? this.dark || this.default : this.light || this.default;
+  }
+  // Additional accessors
+  get src() {
+    return this.resolve();
+  }
+  get lightSrc() {
+    return this.light || this.default;
+  }
+  get darkSrc() {
+    return this.dark || this.default;
+  }
+  get defaultSrc() {
+    return this.default;
+  }
+}
+const $ = new yt(), wt = $.asProxy(), ee = wt;
+function P(e, t) {
+  if (typeof e == "string" && t instanceof S)
+    $.add(e, t);
+  else if (e instanceof S && typeof t == "string")
+    $.add(t, e);
+  else if (e instanceof S && t === void 0)
+    $.add(e.name, e);
+  else
+    throw new Error("registerAsset requires either (name, asset), (asset), or (asset, overrideName)");
+}
+function ne(e, t, n = "") {
+  return u.init({
+    default: e,
+    light: e,
+    dark: t,
+    name: n
+  });
+}
+function re(e, t, n, r = "", o) {
+  return N.init({
+    default: e,
+    light: t,
+    dark: n,
+    name: r,
+    options: o
+  });
+}
+function oe(e, t = [], n = "", r) {
+  return C.init(e, t, n, r);
+}
+function ie() {
+  const e = $.getAll(), t = [];
+  for (const [n, r] of e) {
+    let o = "custom";
+    r instanceof u ? o = "color" : r instanceof N ? o = "image" : r instanceof C && (o = "font"), t.push({
+      name: n,
+      type: o,
+      asset: r
+    });
+  }
+  return t.sort((n, r) => n.name.localeCompare(r.name));
+}
+function ae() {
+  return Array.from($.getAll().keys()).sort();
+}
+P(u.init({
+  default: "#007AFF",
+  light: "#007AFF",
+  dark: "#0A84FF",
+  name: "systemBlue"
+}));
+P(u.init({
+  default: "#34C759",
+  light: "#34C759",
+  dark: "#30D158",
+  name: "systemGreen"
+}));
+P(u.init({
+  default: "#FF3B30",
+  light: "#FF3B30",
+  dark: "#FF453A",
+  name: "systemRed"
+}));
+P(u.init({
+  default: "#FF9500",
+  light: "#FF9500",
+  dark: "#FF9F0A",
+  name: "systemOrange"
+}));
+P(u.init({
+  default: "#5856D6",
+  light: "#5856D6",
+  dark: "#5E5CE6",
+  name: "systemPurple"
+}));
+P(u.init({
+  default: "#FF2D55",
+  light: "#FF2D55",
+  dark: "#FF375F",
+  name: "systemPink"
+}));
+P(u.init({
+  default: "#8E8E93",
+  name: "systemGray"
+}));
+P(u.init({
+  default: "#000000",
+  name: "systemBlack"
+}));
+P(u.init({
+  default: "#FFFFFF",
+  name: "systemWhite"
+}));
+var Ct = Object.defineProperty, _t = (e, t, n) => t in e ? Ct(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, I = (e, t, n) => _t(e, typeof t != "symbol" ? t + "" : t, n);
+class St extends S {
+  constructor(t, n) {
+    super(t), this.stateGradients = n, I(this, "currentState", "default"), I(this, "animationOptions"), I(this, "resolvedGradientCache", /* @__PURE__ */ new Map()), I(this, "isTransitioning", !1), this.animationOptions = n.animation || {
+      duration: 300,
+      easing: "ease",
+      delay: 0
+    }, this.preResolveGradients();
+  }
+  /**
+   * Set the current interaction state
+   */
+  setState(t) {
+    t !== this.currentState && this.stateGradients[t] && !this.isTransitioning && (this.currentState = t, this.animationOptions.duration && this.animationOptions.duration > 0 && (this.isTransitioning = !0, setTimeout(() => {
+      this.isTransitioning = !1;
+    }, this.animationOptions.duration + (this.animationOptions.delay || 0))));
+  }
+  /**
+   * Get the current state
+   */
+  getState() {
+    return this.currentState;
+  }
+  /**
+   * Resolve the current gradient to CSS
+   */
+  resolve() {
+    const t = this.currentState;
+    if (this.resolvedGradientCache.has(t))
+      return this.resolvedGradientCache.get(t);
+    const n = this.stateGradients[this.currentState] || this.stateGradients.default, r = this.resolveGradientValue(n);
+    return this.resolvedGradientCache.set(t, r), r;
+  }
+  /**
+   * Get gradient for a specific state without changing current state
+   */
+  getStateGradient(t) {
+    const n = this.stateGradients[t] || this.stateGradients.default;
+    return this.resolveGradientValue(n);
+  }
+  /**
+   * Get animation CSS properties for transitions
+   */
+  getAnimationCSS() {
+    const { duration: t, easing: n, delay: r } = this.animationOptions;
+    return `transition: background ${t}ms ${n} ${r || 0}ms;`;
+  }
+  /**
+   * Get all available states
+   */
+  getAvailableStates() {
+    return Object.keys(this.stateGradients).filter(
+      (t) => this.stateGradients[t] !== void 0
+    );
+  }
+  /**
+   * Check if a state is available
+   */
+  hasState(t) {
+    return t in this.stateGradients && this.stateGradients[t] !== void 0;
+  }
+  /**
+   * Update animation options
+   */
+  setAnimation(t) {
+    this.animationOptions = { ...this.animationOptions, ...t };
+  }
+  resolveGradientValue(t) {
+    return typeof t == "string" ? t : this.isAsset(t) ? t.resolve() : this.isGradientDefinition(t) ? k(t) : "";
+  }
+  isAsset(t) {
+    return t && typeof t == "object" && typeof t.resolve == "function";
+  }
+  isGradientDefinition(t) {
+    return t && typeof t == "object" && "type" in t && "options" in t;
+  }
+  /**
+   * Pre-resolve all gradients to improve runtime performance
+   */
+  preResolveGradients() {
+    Object.keys(this.stateGradients).forEach((t) => {
+      const n = t;
+      if (n !== "animation" && this.stateGradients[n]) {
+        const r = this.resolveGradientValue(this.stateGradients[n]);
+        this.resolvedGradientCache.set(n, r);
+      }
+    });
+  }
+  /**
+   * Clear the gradient cache (useful when gradients change dynamically)
+   */
+  clearCache() {
+    this.resolvedGradientCache.clear(), this.preResolveGradients();
+  }
+  /**
+   * Force update animation options and clear cache if needed
+   */
+  updateStateGradients(t) {
+    this.stateGradients = t, this.animationOptions = t.animation || this.animationOptions, this.clearCache();
+  }
+}
+function v(e, t) {
+  return new St(e, t);
+}
+const b = {
+  // iOS-style colors
+  ios: {
+    blue: ["#007AFF", "#0051D2"],
+    green: ["#30D158", "#248A3D"],
+    red: ["#FF3B30", "#CC2E26"]
+  },
+  // Material Design colors
+  material: {
+    blue: ["#2196F3", "#1976D2"]
+  },
+  // Modern web gradients
+  modern: {
+    ocean: ["#667eea", "#764ba2"],
+    sunset: ["#ff7e5f", "#feb47b"],
+    aurora: ["#4facfe", "#00f2fe"]
+  },
+  // Neutral gradients
+  neutral: {
+    lightGray: ["#f8f9fa", "#e9ecef"],
+    darkGray: ["#495057", "#212529"]
+  }
+}, L = {
+  // Direction-based presets
+  vertical: (e) => a({
+    colors: e,
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  horizontal: (e) => a({
+    colors: e,
+    startPoint: "leading",
+    endPoint: "trailing"
+  }),
+  diagonal: (e) => a({
+    colors: e,
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  }),
+  diagonalReverse: (e) => a({
+    colors: e,
+    startPoint: "topTrailing",
+    endPoint: "bottomLeading"
+  }),
+  // Popular gradient patterns
+  iosBlue: () => a({
+    colors: [...b.ios.blue],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  materialBlue: () => a({
+    colors: [...b.material.blue],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  ocean: () => a({
+    colors: [...b.modern.ocean],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  }),
+  sunset: () => a({
+    colors: [...b.modern.sunset],
+    startPoint: "leading",
+    endPoint: "trailing"
+  }),
+  aurora: () => a({
+    colors: [...b.modern.aurora],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  // Multi-color gradients
+  rainbow: () => a({
+    colors: ["#ff0000", "#ff7f00", "#ffff00", "#00ff00", "#0000ff", "#8f00ff"],
+    startPoint: "leading",
+    endPoint: "trailing",
+    stops: [0, 16.66, 33.33, 50, 66.66, 83.33, 100]
+  }),
+  prism: () => a({
+    colors: ["#ff6b6b", "#4ecdc4", "#45b7d1", "#96ceb4", "#feca57"],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  }),
+  // Card and surface gradients
+  cardLight: () => a({
+    colors: [...b.neutral.lightGray],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  cardDark: () => a({
+    colors: [...b.neutral.darkGray],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  glass: () => a({
+    colors: ["rgba(255, 255, 255, 0.25)", "rgba(255, 255, 255, 0.05)"],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  frosted: () => a({
+    colors: ["rgba(255, 255, 255, 0.1)", "rgba(255, 255, 255, 0.3)"],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  })
+}, O = {
+  primaryButton: () => ({
+    default: L.iosBlue(),
+    hover: a({
+      colors: ["#1A8FFF", "#0062E3"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    active: a({
+      colors: ["#0066CC", "#004499"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    disabled: "#CCCCCC",
+    animation: {
+      duration: 150,
+      easing: "ease-out"
+    }
+  }),
+  secondaryButton: () => ({
+    default: L.cardLight(),
+    hover: a({
+      colors: ["#e9ecef", "#dee2e6"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    active: a({
+      colors: ["#dee2e6", "#ced4da"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: {
+      duration: 100,
+      easing: "ease-out"
+    }
+  }),
+  dangerButton: () => ({
+    default: a({
+      colors: [...b.ios.red],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    hover: a({
+      colors: ["#FF5A52", "#D13029"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    active: a({
+      colors: ["#E6342C", "#B32821"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    disabled: "#CCCCCC",
+    animation: {
+      duration: 120,
+      easing: "ease-out"
+    }
+  }),
+  successButton: () => ({
+    default: a({
+      colors: [...b.ios.green],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    hover: a({
+      colors: ["#40D866", "#2C8F45"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    active: a({
+      colors: ["#28B946", "#1F7A35"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    disabled: "#CCCCCC",
+    animation: {
+      duration: 120,
+      easing: "ease-out"
+    }
+  }),
+  hoverCard: () => ({
+    default: "#FFFFFF",
+    hover: L.glass(),
+    animation: {
+      duration: 200,
+      easing: "ease"
+    }
+  }),
+  focusInput: () => ({
+    default: "#FFFFFF",
+    focus: a({
+      colors: ["#F0F8FF", "#E6F3FF"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    disabled: "#F5F5F5",
+    animation: {
+      duration: 100,
+      easing: "ease-in-out"
+    }
+  })
+}, se = {
+  /**
+   * Create a theme-responsive gradient that switches between light and dark variants
+   */
+  createThemeGradient: (e, t) => e,
+  /**
+   * Auto-generate dark mode variant of a gradient
+   */
+  createDarkVariant: (e) => e
+}, ce = {
+  /**
+   * Reverse the colors in a gradient
+   */
+  reverse: (e) => {
+    const t = { ...e };
+    return "colors" in t.options && (t.options = {
+      ...t.options,
+      colors: [...t.options.colors].reverse()
+    }), t;
+  },
+  /**
+   * Rotate a linear gradient by swapping start and end points
+   */
+  rotate: (e) => ({
+    ...e,
+    startPoint: e.endPoint,
+    endPoint: e.startPoint
+  }),
+  /**
+   * Add transparency to gradient colors
+   */
+  withOpacity: (e, t) => e,
+  /**
+   * Blend two gradients together
+   */
+  blend: (e, t, n = 0.5) => e
+};
+({
+  ...L,
+  ...O
+});
+const _ = {
+  /**
+   * Check if value is a valid gradient definition
+   */
+  isGradientDefinition(e) {
+    if (!e || typeof e != "object") return !1;
+    const t = e;
+    return typeof t.type == "string" && ["linear", "radial", "angular", "conic", "repeating-linear", "repeating-radial", "elliptical"].includes(t.type) && t.options !== void 0 && typeof t.options == "object" && t.options !== null;
+  },
+  /**
+   * Check if value is a linear gradient
+   */
+  isLinearGradient(e) {
+    return this.isGradientDefinition(e) && e.type === "linear";
+  },
+  /**
+   * Check if value is a radial gradient
+   */
+  isRadialGradient(e) {
+    return this.isGradientDefinition(e) && e.type === "radial";
+  },
+  /**
+   * Check if value is an angular gradient
+   */
+  isAngularGradient(e) {
+    return this.isGradientDefinition(e) && e.type === "angular";
+  },
+  /**
+   * Check if value is a state gradient configuration
+   */
+  isStateGradientOptions(e) {
+    if (!e || typeof e != "object") return !1;
+    const t = e;
+    return "default" in t && t.default !== void 0;
+  },
+  /**
+   * Check if value is a stateful background value
+   */
+  isStatefulBackgroundValue(e) {
+    return !!(typeof e == "string" || this.isGradientDefinition(e) || this.isAsset(e) || this.isStateGradientOptions(e));
+  },
+  /**
+   * Check if value is an Asset
+   */
+  isAsset(e) {
+    return e !== null && typeof e == "object" && "resolve" in e && typeof e.resolve == "function";
+  },
+  /**
+   * Check if value is a valid gradient start point
+   */
+  isGradientStartPoint(e) {
+    return typeof e == "string" && [
+      "top",
+      "bottom",
+      "leading",
+      "trailing",
+      "center",
+      "topLeading",
+      "topTrailing",
+      "bottomLeading",
+      "bottomTrailing"
+    ].includes(e);
+  },
+  /**
+   * Check if value is a valid gradient center
+   */
+  isGradientCenter(e) {
+    return typeof e == "string" ? ["center", "top", "bottom", "leading", "trailing"].includes(e) : Array.isArray(e) ? e.length === 2 && typeof e[0] == "number" && typeof e[1] == "number" : !1;
+  }
+}, B = {
+  /**
+   * Validate color format (hex, rgb, rgba, hsl, hsla, named colors, CSS custom properties)
+   */
+  validateColor(e) {
+    return _.isAsset(e) ? { valid: !0 } : typeof e != "string" ? { valid: !1, error: "Color must be a string or Asset" } : /^(transparent|inherit|initial|unset|currentcolor)$/i.test(e) ? { valid: !0 } : /^#([0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(e) ? { valid: !0 } : /^rgba?\(\s*(\d+(?:\.\d+)?%?)\s*,\s*(\d+(?:\.\d+)?%?)\s*,\s*(\d+(?:\.\d+)?%?)\s*(?:,\s*(\d+(?:\.\d+)?%?))?\s*\)$/i.test(e) ? { valid: !0 } : /^hsla?\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?%)\s*,\s*(\d+(?:\.\d+)?%)\s*(?:,\s*(\d+(?:\.\d+)?%?))?\s*\)$/i.test(e) ? { valid: !0 } : /^var\(--[a-zA-Z][a-zA-Z0-9-]*\)$/.test(e) ? { valid: !0 } : { valid: !1, error: `Invalid color format: ${e}` };
+  },
+  /**
+   * Validate gradient colors array
+   */
+  validateColors(e) {
+    const t = [];
+    return Array.isArray(e) ? e.length < 2 ? { valid: !1, errors: ["Gradient must have at least 2 colors"] } : (e.forEach((n, r) => {
+      const o = this.validateColor(n);
+      o.valid || t.push(`Color at index ${r}: ${o.error}`);
+    }), { valid: t.length === 0, errors: t }) : { valid: !1, errors: ["Colors must be an array"] };
+  },
+  /**
+   * Validate color stops array
+   */
+  validateStops(e, t) {
+    if (!Array.isArray(e))
+      return { valid: !1, error: "Stops must be an array" };
+    if (e.length !== t)
+      return { valid: !1, error: "Stops array length must match colors array length" };
+    for (let n = 0; n < e.length; n++) {
+      const r = e[n];
+      if (typeof r != "number")
+        return { valid: !1, error: `Stop at index ${n} must be a number` };
+      if (r < 0 || r > 100)
+        return { valid: !1, error: `Stop at index ${n} must be between 0 and 100` };
+      if (n > 0 && r < e[n - 1])
+        return { valid: !1, error: `Stops must be in ascending order. Stop at index ${n} (${r}) is less than previous stop (${e[n - 1]})` };
+    }
+    return { valid: !0 };
+  },
+  /**
+   * Validate linear gradient options
+   */
+  validateLinearGradient(e) {
+    const t = [], n = this.validateColors(e.colors);
+    if (n.valid || t.push(...n.errors), e.stops) {
+      const r = this.validateStops(e.stops, e.colors.length);
+      r.valid || t.push(r.error);
+    }
+    return _.isGradientStartPoint(e.startPoint) || t.push(`Invalid startPoint: ${e.startPoint}`), _.isGradientStartPoint(e.endPoint) || t.push(`Invalid endPoint: ${e.endPoint}`), e.angle !== void 0 && (typeof e.angle != "number" ? t.push("Angle must be a number") : (e.angle < 0 || e.angle > 360) && t.push("Angle must be between 0 and 360 degrees")), { valid: t.length === 0, errors: t };
+  },
+  /**
+   * Validate radial gradient options
+   */
+  validateRadialGradient(e) {
+    const t = [], n = this.validateColors(e.colors);
+    if (n.valid || t.push(...n.errors), e.stops) {
+      const r = this.validateStops(e.stops, e.colors.length);
+      r.valid || t.push(r.error);
+    }
+    return _.isGradientCenter(e.center) || t.push(`Invalid center: ${e.center}`), (typeof e.startRadius != "number" || e.startRadius < 0) && t.push("startRadius must be a non-negative number"), (typeof e.endRadius != "number" || e.endRadius < 0) && t.push("endRadius must be a non-negative number"), e.startRadius >= e.endRadius && t.push("endRadius must be greater than startRadius"), e.shape && !["circle", "ellipse"].includes(e.shape) && t.push(`Invalid shape: ${e.shape}. Must be 'circle' or 'ellipse'`), { valid: t.length === 0, errors: t };
+  },
+  /**
+   * Validate angular gradient options
+   */
+  validateAngularGradient(e) {
+    const t = [], n = this.validateColors(e.colors);
+    return n.valid || t.push(...n.errors), _.isGradientCenter(e.center) || t.push(`Invalid center: ${e.center}`), typeof e.startAngle != "number" && t.push("startAngle must be a number"), typeof e.endAngle != "number" && t.push("endAngle must be a number"), { valid: t.length === 0, errors: t };
+  },
+  /**
+   * Validate animation options
+   */
+  validateAnimationOptions(e) {
+    const t = [];
+    return e.duration !== void 0 && (typeof e.duration != "number" || e.duration < 0) && t.push("Duration must be a non-negative number"), e.delay !== void 0 && (typeof e.delay != "number" || e.delay < 0) && t.push("Delay must be a non-negative number"), e.easing !== void 0 && typeof e.easing != "string" && t.push("Easing must be a string"), { valid: t.length === 0, errors: t };
+  },
+  /**
+   * Validate state gradient options
+   */
+  validateStateGradientOptions(e) {
+    const t = [];
+    if (e.default || t.push("Default state is required"), ["default", "hover", "active", "focus", "disabled"].forEach((r) => {
+      const o = e[r];
+      o && !_.isStatefulBackgroundValue(o) && t.push(`Invalid ${r} state value`);
+    }), e.animation) {
+      const r = this.validateAnimationOptions(e.animation);
+      r.valid || t.push(...r.errors.map((o) => `Animation: ${o}`));
+    }
+    return { valid: t.length === 0, errors: t };
+  },
+  /**
+   * Comprehensive gradient validation
+   */
+  validateGradient(e) {
+    if (!_.isGradientDefinition(e))
+      return { valid: !1, errors: ["Invalid gradient definition structure"] };
+    switch (e.type) {
+      case "linear":
+        return this.validateLinearGradient(e.options);
+      case "radial":
+        return this.validateRadialGradient(e.options);
+      case "angular":
+      case "conic":
+        return this.validateAngularGradient(e.options);
+      default:
+        return { valid: !1, errors: [`Unsupported gradient type: ${e.type}`] };
+    }
+  }
+}, le = (e) => {
+  const t = B.validateGradient(e);
+  if (!t.valid)
+    throw new Error(`Invalid gradient: ${t.errors.join(", ")}`);
+  return e;
+}, de = (e) => {
+  const t = B.validateStateGradientOptions(e);
+  if (!t.valid)
+    throw new Error(`Invalid state gradient: ${t.errors.join(", ")}`);
+  return e;
+}, ue = {
+  /**
+   * Assert gradient is valid (throws in development, no-op in production)
+   */
+  assertValidGradient(e) {
+    if (process.env.NODE_ENV === "development") {
+      const t = B.validateGradient(e);
+      if (!t.valid)
+        throw console.error("Invalid gradient:", e), console.error("Validation errors:", t.errors), new Error(`Invalid gradient: ${t.errors.join(", ")}`);
+    }
+  },
+  /**
+   * Warn about potential gradient issues
+   */
+  warnGradientIssues(e) {
+    process.env.NODE_ENV === "development" && "colors" in e.options && e.options.colors.length > 5 && console.warn("Gradient has many colors which may impact performance:", e);
+  }
+}, l = {
+  /**
+   * Parse hex color to RGB components
+   */
+  hexToRgb: (e) => {
+    const t = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);
+    return t ? {
+      r: parseInt(t[1], 16),
+      g: parseInt(t[2], 16),
+      b: parseInt(t[3], 16)
+    } : null;
+  },
+  /**
+   * Convert RGB to hex
+   */
+  rgbToHex: (e, t, n) => "#" + ((1 << 24) + (e << 16) + (t << 8) + n).toString(16).slice(1),
+  /**
+   * Add transparency to a color
+   */
+  withAlpha: (e, t) => {
+    if (e.startsWith("#")) {
+      const n = l.hexToRgb(e);
+      if (n)
+        return `rgba(${n.r}, ${n.g}, ${n.b}, ${t})`;
+    }
+    return e.startsWith("rgb(") ? e.replace("rgb(", "rgba(").replace(")", `, ${t})`) : e.startsWith("rgba(") ? e.replace(/,\s*[\d.]+\)$/, `, ${t})`) : e;
+  },
+  /**
+   * Blend two colors
+   */
+  blendColors: (e, t, n = 0.5) => {
+    const r = l.hexToRgb(e), o = l.hexToRgb(t);
+    if (!r || !o) return e;
+    const i = Math.round(r.r * (1 - n) + o.r * n), s = Math.round(r.g * (1 - n) + o.g * n), c = Math.round(r.b * (1 - n) + o.b * n);
+    return l.rgbToHex(i, s, c);
+  },
+  /**
+   * Generate color variations (lighter/darker)
+   */
+  lighten: (e, t = 0.2) => l.blendColors(e, "#ffffff", t),
+  darken: (e, t = 0.2) => l.blendColors(e, "#000000", t),
+  /**
+   * Generate complementary color
+   */
+  complement: (e) => {
+    const t = l.hexToRgb(e);
+    return t ? l.rgbToHex(255 - t.r, 255 - t.g, 255 - t.b) : e;
+  },
+  /**
+   * Get contrast ratio between two colors
+   */
+  getContrastRatio: (e, t) => {
+    const n = (c) => {
+      const f = l.hexToRgb(c);
+      if (!f) return 0;
+      const [d, h, g] = [f.r, f.g, f.b].map((m) => (m = m / 255, m <= 0.03928 ? m / 12.92 : Math.pow((m + 0.055) / 1.055, 2.4)));
+      return 0.2126 * d + 0.7152 * h + 0.0722 * g;
+    }, r = n(e), o = n(t), i = Math.max(r, o), s = Math.min(r, o);
+    return (i + 0.05) / (s + 0.05);
+  }
+}, Z = {
+  /**
+   * Reverse gradient colors
+   */
+  reverse: (e) => {
+    const t = { ...e };
+    return "colors" in t.options && (t.options = {
+      ...t.options,
+      colors: [...t.options.colors].reverse(),
+      stops: t.options.stops ? [...t.options.stops].reverse() : void 0
+    }), t;
+  },
+  /**
+   * Rotate linear gradient direction
+   */
+  rotateLinear: (e, t) => {
+    if (e.type !== "linear") return e;
+    const n = e.options;
+    return {
+      ...e,
+      options: {
+        ...n,
+        angle: (n.angle || 0) + t
+      }
+    };
+  },
+  /**
+   * Scale radial gradient
+   */
+  scaleRadial: (e, t) => {
+    if (e.type !== "radial") return e;
+    const n = e.options;
+    return {
+      ...e,
+      options: {
+        ...n,
+        startRadius: n.startRadius * t,
+        endRadius: n.endRadius * t
+      }
+    };
+  },
+  /**
+   * Add transparency to entire gradient
+   */
+  withOpacity: (e, t) => {
+    const n = { ...e };
+    return "colors" in n.options && (n.options = {
+      ...n.options,
+      colors: n.options.colors.map(
+        (r) => typeof r == "string" ? l.withAlpha(r, t) : r
+      )
+    }), n;
+  },
+  /**
+   * Mirror a linear gradient (swap start and end points)
+   */
+  mirror: (e) => {
+    if (e.type !== "linear") return e;
+    const t = e.options;
+    return {
+      ...e,
+      options: {
+        ...t,
+        startPoint: t.endPoint,
+        endPoint: t.startPoint
+      }
+    };
+  },
+  /**
+   * Convert linear gradient to radial
+   */
+  toRadial: (e, t = 100) => {
+    if (e.type !== "linear") return e;
+    const n = e.options;
+    return G({
+      colors: n.colors,
+      stops: n.stops,
+      center: "center",
+      startRadius: 0,
+      endRadius: t
+    });
+  },
+  /**
+   * Convert to angular/conic gradient
+   */
+  toAngular: (e) => "colors" in e.options ? it({
+    colors: e.options.colors,
+    stops: e.options.stops,
+    center: "center",
+    startAngle: 0,
+    endAngle: 360
+  }) : e
+}, y = {
+  /**
+   * Get gradient color count
+   */
+  getColorCount: (e) => "colors" in e.options ? e.options.colors.length : 0,
+  /**
+   * Extract colors from gradient
+   */
+  extractColors: (e) => "colors" in e.options ? [...e.options.colors] : [],
+  /**
+   * Get gradient complexity score (for performance optimization)
+   */
+  getComplexityScore: (e) => {
+    let t = 0;
+    switch ("colors" in e.options && (t += e.options.colors.length * 2, t += e.options.stops ? e.options.stops.length : 0), e.type) {
+      case "linear":
+        t += 1;
+        break;
+      case "radial":
+        t += 3;
+        break;
+      case "angular":
+        t += 4;
+        break;
+      case "repeating-linear":
+        t += 5;
+        break;
+      case "repeating-radial":
+        t += 6;
+        break;
+    }
+    return t;
+  },
+  /**
+   * Check if gradient has transparency
+   */
+  hasTransparency: (e) => "colors" in e.options ? e.options.colors.some(
+    (t) => typeof t == "string" && (t.includes("rgba") || t.includes("transparent") || t.includes("hsla"))
+  ) : !1,
+  /**
+   * Estimate rendering performance impact
+   */
+  getPerformanceImpact: (e) => {
+    const t = y.getComplexityScore(e);
+    return t <= 5 ? "low" : t <= 10 ? "medium" : "high";
+  }
+}, Gt = {
+  /**
+   * Generate rainbow gradient
+   */
+  rainbow: (e = 6) => {
+    const t = [];
+    for (let n = 0; n < e; n++) {
+      const r = n * 360 / e;
+      t.push(`hsl(${r}, 100%, 50%)`);
+    }
+    return a({
+      colors: t,
+      startPoint: "leading",
+      endPoint: "trailing"
+    });
+  },
+  /**
+   * Generate monochromatic gradient
+   */
+  monochromatic: (e, t = 5) => {
+    const n = [];
+    for (let r = 0; r < t; r++) {
+      const o = r / (t - 1);
+      o < 0.5 ? n.push(l.lighten(e, 0.4 - o * 0.8)) : n.push(l.darken(e, (o - 0.5) * 0.8));
+    }
+    return a({
+      colors: n,
+      startPoint: "top",
+      endPoint: "bottom"
+    });
+  },
+  /**
+   * Generate analogous color gradient
+   */
+  analogous: (e, t = 60) => a({
+    colors: [e, l.lighten(e, 0.2), l.darken(e, 0.2)],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  }),
+  /**
+   * Generate complementary gradient
+   */
+  complementary: (e, t) => {
+    const n = t || l.complement(e);
+    return a({
+      colors: [e, n],
+      startPoint: "topLeading",
+      endPoint: "bottomTrailing"
+    });
+  },
+  /**
+   * Generate sunset gradient
+   */
+  sunset: () => a({
+    colors: ["#ff7e5f", "#feb47b", "#ff6b6b", "#c44569"],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  /**
+   * Generate ocean gradient
+   */
+  ocean: () => a({
+    colors: ["#667eea", "#764ba2", "#667eea"],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  })
+}, $t = {
+  /**
+   * Create hover effect gradient
+   */
+  createHoverEffect: (e, t = 0.1) => {
+    const n = Z.withOpacity(
+      Z.reverse(e),
+      1 - t
+    );
+    return {
+      default: e,
+      hover: n,
+      animation: {
+        duration: 200,
+        easing: "ease-out"
+      }
+    };
+  },
+  /**
+   * Create button gradient states
+   */
+  createButtonStates: (e, t = "primary") => {
+    const r = {
+      primary: { base: e, hover: l.lighten(e, 0.1), active: l.darken(e, 0.1) },
+      secondary: { base: "#f8f9fa", hover: "#e9ecef", active: "#dee2e6" },
+      danger: { base: "#dc3545", hover: l.lighten("#dc3545", 0.1), active: l.darken("#dc3545", 0.1) }
+    }[t];
+    return {
+      default: a({
+        colors: [r.base, l.darken(r.base, 0.05)],
+        startPoint: "top",
+        endPoint: "bottom"
+      }),
+      hover: a({
+        colors: [r.hover, l.darken(r.hover, 0.05)],
+        startPoint: "top",
+        endPoint: "bottom"
+      }),
+      active: a({
+        colors: [r.active, l.darken(r.active, 0.05)],
+        startPoint: "top",
+        endPoint: "bottom"
+      }),
+      disabled: "#cccccc",
+      animation: {
+        duration: 150,
+        easing: "ease-out"
+      }
+    };
+  },
+  /**
+   * Create card hover effect
+   */
+  createCardHover: (e = "#ffffff") => ({
+    default: e,
+    hover: a({
+      colors: [
+        l.withAlpha("#ffffff", 0.1),
+        l.withAlpha("#f8f9fa", 0.1)
+      ],
+      startPoint: "topLeading",
+      endPoint: "bottomTrailing"
+    }),
+    animation: {
+      duration: 200,
+      easing: "ease"
+    }
+  })
+}, Ft = {
+  /**
+   * Generate CSS custom properties for gradient
+   */
+  toCustomProperties: (e, t = "gradient") => {
+    const n = k(e);
+    return {
+      [`--${t}-background`]: n
+    };
+  },
+  /**
+   * Generate fallback CSS for older browsers
+   */
+  withFallback: (e, t) => {
+    const n = k(e);
+    return `background: ${t}; background: ${n};`;
+  },
+  /**
+   * Optimize CSS for performance
+   */
+  optimize: (e) => e.replace(/\s+/g, " ").replace(/,\s+/g, ",").replace(/:\s+/g, ":").trim()
+}, p = {
+  ...l,
+  ...Z,
+  ...y,
+  ...Gt,
+  ...$t,
+  ...Ft,
+  /**
+   * Convert any background value to CSS
+   */
+  toCSS: (e) => typeof e == "string" ? e : "resolve" in e && typeof e.resolve == "function" ? e.resolve() : "type" in e && "options" in e ? k(e) : "default" in e ? p.toCSS(e.default) : "transparent",
+  /**
+   * Deep clone gradient definition
+   */
+  clone: (e) => JSON.parse(JSON.stringify(e)),
+  /**
+   * Compare two gradients for equality
+   */
+  equals: (e, t) => JSON.stringify(e) === JSON.stringify(t)
+}, T = {
+  /**
+   * iOS-style primary button
+   */
+  iosPrimary: () => ({
+    default: a({
+      colors: ["#007AFF", "#0051D2"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    hover: a({
+      colors: ["#1A8FFF", "#0062E3"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    active: a({
+      colors: ["#0066CC", "#004499"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    disabled: "#CCCCCC",
+    animation: { duration: 150, easing: "ease-out" }
+  }),
+  /**
+   * Material Design raised button
+   */
+  materialRaised: () => ({
+    default: a({
+      colors: ["#2196F3", "#1976D2"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    hover: a({
+      colors: ["#42A5F5", "#1E88E5"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    active: a({
+      colors: ["#1565C0", "#0D47A1"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: { duration: 200, easing: "cubic-bezier(0.4, 0, 0.2, 1)" }
+  }),
+  /**
+   * Glass morphism button
+   */
+  glassMorphism: () => ({
+    default: a({
+      colors: ["rgba(255, 255, 255, 0.25)", "rgba(255, 255, 255, 0.05)"],
+      startPoint: "topLeading",
+      endPoint: "bottomTrailing"
+    }),
+    hover: a({
+      colors: ["rgba(255, 255, 255, 0.35)", "rgba(255, 255, 255, 0.15)"],
+      startPoint: "topLeading",
+      endPoint: "bottomTrailing"
+    }),
+    active: a({
+      colors: ["rgba(255, 255, 255, 0.15)", "rgba(255, 255, 255, 0.25)"],
+      startPoint: "topLeading",
+      endPoint: "bottomTrailing"
+    }),
+    animation: { duration: 250, easing: "ease" }
+  }),
+  /**
+   * Neon glow button
+   */
+  neonGlow: (e = "#00ff88") => ({
+    default: a({
+      colors: [e, p.darken(e, 0.3)],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    hover: G({
+      colors: [p.lighten(e, 0.2), e, p.darken(e, 0.4)],
+      center: "center",
+      startRadius: 0,
+      endRadius: 60
+    }),
+    active: a({
+      colors: [p.darken(e, 0.2), p.darken(e, 0.4)],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: { duration: 300, easing: "ease-in-out" }
+  }),
+  /**
+   * Gradient call-to-action button
+   */
+  ctaButton: () => ({
+    default: a({
+      colors: ["#ff416c", "#ff4b2b"],
+      startPoint: "topLeading",
+      endPoint: "bottomTrailing"
+    }),
+    hover: a({
+      colors: ["#ff6b9d", "#ff6347"],
+      startPoint: "topLeading",
+      endPoint: "bottomTrailing"
+    }),
+    active: a({
+      colors: ["#e63946", "#d62828"],
+      startPoint: "topLeading",
+      endPoint: "bottomTrailing"
+    }),
+    animation: { duration: 175, easing: "ease-out" }
+  })
+}, F = {
+  /**
+   * Subtle card hover effect
+   */
+  subtleHover: () => ({
+    default: "#ffffff",
+    hover: a({
+      colors: ["#f8f9fa", "#ffffff"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: { duration: 200, easing: "ease" }
+  }),
+  /**
+   * Dark mode card
+   */
+  darkCard: () => ({
+    default: a({
+      colors: ["#2d3748", "#1a202c"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    hover: a({
+      colors: ["#4a5568", "#2d3748"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: { duration: 250, easing: "ease-in-out" }
+  }),
+  /**
+   * Hero card with rich gradient
+   */
+  heroCard: () => a({
+    colors: [
+      "#667eea",
+      "#764ba2",
+      "rgba(118, 75, 162, 0.8)"
+    ],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  }),
+  /**
+   * Pricing card with accent
+   */
+  pricingCard: (e = "#007AFF") => a({
+    colors: [
+      "#ffffff",
+      "#f8f9fa",
+      p.withAlpha(e, 0.05)
+    ],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  /**
+   * Testimonial card
+   */
+  testimonialCard: () => a({
+    colors: [
+      "rgba(255, 255, 255, 0.9)",
+      "rgba(248, 249, 250, 0.9)",
+      "rgba(233, 236, 239, 0.9)"
+    ],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  })
+}, At = {
+  /**
+   * App header gradient
+   */
+  appHeader: () => a({
+    colors: ["#667eea", "#764ba2"],
+    startPoint: "leading",
+    endPoint: "trailing"
+  }),
+  /**
+   * Tab bar gradient
+   */
+  tabBar: () => ({
+    default: a({
+      colors: ["#f8f9fa", "#e9ecef"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    hover: a({
+      colors: ["#e9ecef", "#dee2e6"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: { duration: 150, easing: "ease-out" }
+  }),
+  /**
+   * Sidebar gradient
+   */
+  sidebar: () => a({
+    colors: [
+      "#2d3748",
+      "#1a202c",
+      "#171923"
+    ],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  /**
+   * Navigation breadcrumb
+   */
+  breadcrumb: () => ({
+    default: "transparent",
+    hover: a({
+      colors: ["rgba(0, 122, 255, 0.1)", "rgba(0, 122, 255, 0.05)"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: { duration: 100, easing: "ease-out" }
+  })
+}, E = {
+  /**
+   * Text input focus effect
+   */
+  textInputFocus: () => ({
+    default: "#ffffff",
+    focus: a({
+      colors: ["#f0f8ff", "#e6f3ff"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    disabled: "#f5f5f5",
+    animation: { duration: 100, easing: "ease-in-out" }
+  }),
+  /**
+   * Form section background
+   */
+  formSection: () => a({
+    colors: [
+      "rgba(248, 249, 250, 0.8)",
+      "rgba(255, 255, 255, 0.8)",
+      "rgba(248, 249, 250, 0.8)"
+    ],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  /**
+   * Submit button gradient
+   */
+  submitButton: () => ({
+    default: a({
+      colors: ["#30d158", "#248a3d"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    hover: a({
+      colors: ["#40d866", "#2c8f45"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    active: a({
+      colors: ["#28b946", "#1f7a35"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: { duration: 120, easing: "ease-out" }
+  }),
+  /**
+   * Error state input
+   */
+  errorInput: () => ({
+    default: a({
+      colors: ["rgba(255, 59, 48, 0.1)", "rgba(255, 59, 48, 0.05)"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    focus: a({
+      colors: ["rgba(255, 59, 48, 0.15)", "rgba(255, 59, 48, 0.08)"],
+      startPoint: "top",
+      endPoint: "bottom"
+    }),
+    animation: { duration: 150, easing: "ease-in-out" }
+  })
+}, xt = {
+  /**
+   * Metric card with positive trend
+   */
+  positiveMetric: () => a({
+    colors: ["#d4edda", "#c3e6cb", "#b8dacc"],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  }),
+  /**
+   * Metric card with negative trend
+   */
+  negativeMetric: () => a({
+    colors: ["#f8d7da", "#f5c6cb", "#f1b0b7"],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  }),
+  /**
+   * Chart background
+   */
+  chartBackground: () => a({
+    colors: [
+      "rgba(255, 255, 255, 0.95)",
+      "rgba(248, 249, 250, 0.95)",
+      "rgba(255, 255, 255, 0.95)"
+    ],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  /**
+   * Progress bar gradient
+   */
+  progressBar: (e = "#007AFF") => a({
+    colors: [
+      p.lighten(e, 0.1),
+      e,
+      p.darken(e, 0.1)
+    ],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  /**
+   * Status indicator gradients
+   */
+  statusSuccess: () => G({
+    colors: ["#30d158", "#248a3d", "rgba(36, 138, 61, 0.8)"],
+    center: "center",
+    startRadius: 0,
+    endRadius: 25
+  }),
+  statusWarning: () => G({
+    colors: ["#ff9500", "#cc7700", "rgba(204, 119, 0, 0.8)"],
+    center: "center",
+    startRadius: 0,
+    endRadius: 25
+  }),
+  statusError: () => G({
+    colors: ["#ff3b30", "#cc2e26", "rgba(204, 46, 38, 0.8)"],
+    center: "center",
+    startRadius: 0,
+    endRadius: 25
+  })
+}, Rt = {
+  /**
+   * Shimmer loading effect
+   */
+  shimmer: () => a({
+    colors: [
+      "rgba(255, 255, 255, 0)",
+      "rgba(255, 255, 255, 0.4)",
+      "rgba(255, 255, 255, 0.8)",
+      "rgba(255, 255, 255, 0.4)",
+      "rgba(255, 255, 255, 0)"
+    ],
+    startPoint: "leading",
+    endPoint: "trailing",
+    stops: [0, 25, 50, 75, 100]
+  }),
+  /**
+   * Skeleton loading gradient
+   */
+  skeleton: () => a({
+    colors: ["#f6f7f8", "#edeef1", "#f6f7f8"],
+    startPoint: "leading",
+    endPoint: "trailing"
+  }),
+  /**
+   * Pulse animation gradient
+   */
+  pulse: (e = "#007AFF") => G({
+    colors: [
+      p.withAlpha(e, 0.8),
+      p.withAlpha(e, 0.4),
+      p.withAlpha(e, 0.1),
+      "transparent"
+    ],
+    center: "center",
+    startRadius: 0,
+    endRadius: 100
+  }),
+  /**
+   * Spinner gradient
+   */
+  spinner: () => it({
+    colors: [
+      "#007AFF",
+      "rgba(0, 122, 255, 0.8)",
+      "rgba(0, 122, 255, 0.4)",
+      "rgba(0, 122, 255, 0.1)",
+      "transparent",
+      "transparent",
+      "#007AFF"
+    ],
+    center: "center",
+    startAngle: 0,
+    endAngle: 360
+  })
+}, j = {
+  /**
+   * App background gradient
+   */
+  appBackground: () => a({
+    colors: [
+      "#f8f9fa",
+      "#ffffff",
+      "#f8f9fa"
+    ],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  /**
+   * Dark mode app background
+   */
+  darkAppBackground: () => a({
+    colors: [
+      "#1a1a1a",
+      "#0f0f0f",
+      "#1a1a1a"
+    ],
+    startPoint: "top",
+    endPoint: "bottom"
+  }),
+  /**
+   * Modal backdrop
+   */
+  modalBackdrop: () => G({
+    colors: [
+      "rgba(0, 0, 0, 0.4)",
+      "rgba(0, 0, 0, 0.6)",
+      "rgba(0, 0, 0, 0.8)"
+    ],
+    center: "center",
+    startRadius: 0,
+    endRadius: 300
+  }),
+  /**
+   * Hero section background
+   */
+  heroSection: () => a({
+    colors: [
+      "#667eea",
+      "#764ba2",
+      "#667eea"
+    ],
+    startPoint: "topLeading",
+    endPoint: "bottomTrailing"
+  }),
+  /**
+   * Footer gradient
+   */
+  footer: () => a({
+    colors: [
+      "#2d3748",
+      "#1a202c"
+    ],
+    startPoint: "top",
+    endPoint: "bottom"
+  })
+}, rt = {
+  /**
+   * iOS theme gradients
+   */
+  ios: {
+    primary: T.iosPrimary,
+    secondary: () => O.secondaryButton(),
+    card: F.subtleHover,
+    input: E.textInputFocus,
+    background: j.appBackground
+  },
+  /**
+   * Material Design theme gradients
+   */
+  material: {
+    primary: T.materialRaised,
+    secondary: () => O.secondaryButton(),
+    card: F.subtleHover,
+    input: E.textInputFocus,
+    background: j.appBackground
+  },
+  /**
+   * Modern/Glass theme gradients
+   */
+  modern: {
+    primary: T.glassMorphism,
+    secondary: T.glassMorphism,
+    card: () => F.subtleHover(),
+    input: E.textInputFocus,
+    background: () => a({
+      colors: [
+        "rgba(255, 255, 255, 0.95)",
+        "rgba(248, 249, 250, 0.95)"
+      ],
+      startPoint: "top",
+      endPoint: "bottom"
+    })
+  }
+}, Vt = (e = "ios") => {
+  const t = rt[e];
+  return {
+    Button: {
+      primary: v("button-primary", t.primary()),
+      secondary: v("button-secondary", t.secondary()),
+      danger: v("button-danger", O.dangerButton()),
+      success: v("button-success", O.successButton())
+    },
+    Card: {
+      default: v("card-default", t.card()),
+      hero: v("card-hero", {
+        default: F.heroCard(),
+        hover: p.reverse(F.heroCard()),
+        animation: { duration: 300, easing: "ease-in-out" }
+      })
+    },
+    Input: {
+      default: v("input-default", t.input()),
+      error: v("input-error", E.errorInput())
+    },
+    Background: {
+      app: t.background(),
+      modal: j.modalBackdrop()
+    }
+  };
+}, fe = {
+  Button: T,
+  Card: F,
+  Navigation: At,
+  Form: E,
+  Dashboard: xt,
+  Animation: Rt,
+  Background: j,
+  Themed: rt,
+  createComponentGradients: Vt
+};
+var Tt = Object.defineProperty, Mt = (e, t, n) => t in e ? Tt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, H = (e, t, n) => Mt(e, typeof t != "symbol" ? t + "" : t, n);
+const ot = class M {
+  constructor() {
+    H(this, "metrics", /* @__PURE__ */ new Map()), H(this, "enabled", process.env.NODE_ENV === "development"), H(this, "totalMetrics", {
+      totalGradients: 0,
+      totalResolutions: 0,
+      totalCacheHits: 0,
+      totalCacheMisses: 0,
+      averageComplexity: 0,
+      memoryPressure: 0
+    });
+  }
+  static getInstance() {
+    return M.instance || (M.instance = new M()), M.instance;
+  }
+  /**
+   * Enable or disable performance monitoring
+   */
+  setEnabled(t) {
+    this.enabled = t;
+  }
+  /**
+   * Track gradient creation
+   */
+  trackCreation(t, n) {
+    if (!this.enabled) return;
+    const r = performance.now(), o = y.getComplexityScore(n), s = {
+      creationTime: performance.now() - r,
+      resolutionTime: 0,
+      cssGenerationTime: 0,
+      memoryUsage: this.estimateMemoryUsage(n),
+      cacheHits: 0,
+      cacheMisses: 0,
+      complexityScore: o,
+      renderCount: 0
+    };
+    this.metrics.set(t, s), this.updateTotalMetrics();
+  }
+  /**
+   * Track gradient resolution (conversion to CSS)
+   */
+  trackResolution(t, n = !1) {
+    if (!this.enabled) return;
+    const r = performance.now(), o = this.metrics.get(t);
+    if (o) {
+      const i = performance.now();
+      o.resolutionTime += i - r, o.renderCount++, n ? (o.cacheHits++, this.totalMetrics.totalCacheHits++) : (o.cacheMisses++, this.totalMetrics.totalCacheMisses++), this.totalMetrics.totalResolutions++;
+    }
+  }
+  /**
+   * Track CSS generation time
+   */
+  trackCSSGeneration(t, n) {
+    if (!this.enabled) return;
+    const r = this.metrics.get(t);
+    r && (r.cssGenerationTime += n);
+  }
+  /**
+   * Get performance metrics for a specific gradient
+   */
+  getMetrics(t) {
+    return this.metrics.get(t);
+  }
+  /**
+   * Get overall performance summary
+   */
+  getSummary() {
+    const n = Array.from(this.metrics.entries()).sort((i, s) => {
+      const [, c] = i, [, f] = s, d = c.cacheHits / (c.cacheHits + c.cacheMisses + 1);
+      return f.cacheHits / (f.cacheHits + f.cacheMisses + 1) - d;
+    }), r = n.slice(0, 5).map(([i, s]) => ({ id: i, metrics: s })), o = n.slice(-5).map(([i, s]) => ({ id: i, metrics: s }));
+    return {
+      totalMetrics: this.totalMetrics,
+      topPerformers: r,
+      poorPerformers: o,
+      recommendations: this.generateRecommendations()
+    };
+  }
+  /**
+   * Reset all metrics
+   */
+  reset() {
+    this.metrics.clear(), this.totalMetrics = {
+      totalGradients: 0,
+      totalResolutions: 0,
+      totalCacheHits: 0,
+      totalCacheMisses: 0,
+      averageComplexity: 0,
+      memoryPressure: 0
+    };
+  }
+  /**
+   * Export metrics to JSON for analysis
+   */
+  exportMetrics() {
+    return JSON.stringify({
+      totalMetrics: this.totalMetrics,
+      gradientMetrics: Object.fromEntries(this.metrics),
+      timestamp: Date.now(),
+      environment: {
+        userAgent: typeof navigator < "u" ? navigator.userAgent : "Node.js",
+        memory: typeof performance < "u" && "memory" in performance ? performance.memory : null
+      }
+    }, null, 2);
+  }
+  estimateMemoryUsage(t) {
+    let n = 0;
+    n += 100, "colors" in t.options && (n += t.options.colors.length * 20, n += t.options.stops ? t.options.stops.length * 8 : 0);
+    const r = y.getComplexityScore(t);
+    return n += r * 10, n;
+  }
+  updateTotalMetrics() {
+    this.totalMetrics.totalGradients = this.metrics.size;
+    const t = Array.from(this.metrics.values()).map((r) => r.complexityScore);
+    this.totalMetrics.averageComplexity = t.length > 0 ? t.reduce((r, o) => r + o, 0) / t.length : 0;
+    const n = Array.from(this.metrics.values()).reduce((r, o) => r + o.memoryUsage, 0);
+    this.totalMetrics.memoryPressure = n;
+  }
+  generateRecommendations() {
+    const t = [];
+    this.totalMetrics.totalCacheHits / (this.totalMetrics.totalCacheHits + this.totalMetrics.totalCacheMisses) < 0.7 && t.push("Consider using StateGradientAsset for frequently used gradients to improve caching"), this.totalMetrics.averageComplexity > 8 && t.push("Average gradient complexity is high. Consider simplifying gradients or using presets"), this.totalMetrics.memoryPressure > 5e4 && t.push("High memory usage detected. Consider cleanup of unused gradients");
+    const r = Array.from(this.metrics.entries()).filter(([, o]) => o.renderCount > 100);
+    return r.length > 0 && t.push(`${r.length} gradients are rendered frequently. Ensure they use caching`), t;
+  }
+};
+H(ot, "instance");
+let Q = ot;
+const Y = {
+  /**
+   * Validate and debug a gradient configuration
+   */
+  debugGradient: (e) => {
+    const t = B.validateGradient(e), n = y.getComplexityScore(e), r = y.getPerformanceImpact(e), o = [];
+    n > 10 && o.push("High complexity gradient may impact performance"), y.hasTransparency(e) && o.push("Gradient uses transparency which may affect compositing performance"), y.getColorCount(e) > 5 && o.push("Many colors in gradient may cause banding on some devices");
+    const i = [];
+    r === "high" && (i.push("Consider simplifying the gradient or using a preset"), i.push("Cache this gradient if used frequently")), n > 15 && i.push("Consider breaking complex gradient into simpler components");
+    let s = "";
+    try {
+      s = k(e);
+    } catch (c) {
+      s = `Error generating CSS: ${c.message}`;
+    }
+    return {
+      isValid: t.valid,
+      errors: t.errors,
+      warnings: o,
+      performance: {
+        complexity: n,
+        impact: r,
+        recommendations: i
+      },
+      cssOutput: s
+    };
+  },
+  /**
+   * Debug state gradient configuration
+   */
+  debugStateGradient: (e) => {
+    const t = B.validateStateGradientOptions(e), n = [], r = {};
+    return Object.entries(e).forEach(([o, i]) => {
+      o !== "animation" && (r[o] = {
+        type: typeof i == "string" ? "string" : i && "type" in i ? "gradient" : "asset",
+        complexity: i && typeof i == "object" && "type" in i ? y.getComplexityScore(i) : 1
+      });
+    }), e.animation && (e.animation.duration && e.animation.duration > 500 && n.push("Long animation duration may feel sluggish"), e.animation.duration && e.animation.duration < 50 && n.push("Very short animation duration may not be noticeable")), {
+      isValid: t.valid,
+      errors: t.errors,
+      warnings: n,
+      stateAnalysis: r
+    };
+  },
+  /**
+   * Performance profiler for gradient operations
+   */
+  profileOperation: (e, t) => {
+    if (process.env.NODE_ENV !== "development")
+      return t();
+    const n = performance.now(), r = t(), o = performance.now();
+    return console.log(`Gradient operation "${e}" took ${(o - n).toFixed(2)}ms`), r;
+  },
+  /**
+   * CSS analyzer for generated gradients
+   */
+  analyzeCSS: (e) => {
+    const t = [], n = [];
+    let r = !1;
+    return e.includes("conic-gradient") && (t.push("Chrome 69+", "Firefox 83+", "Safari 12.1+"), r = !0), e.includes("linear-gradient") && t.push("All modern browsers"), e.includes("radial-gradient") && t.push("All modern browsers"), (e.match(/#[0-9a-f]{6}|rgb\([^)]+\)|hsl\([^)]+\)/gi) || []).length > 5 && n.push("Many colors may cause performance impact on low-end devices"), e.includes("repeating-") && n.push("Repeating gradients can be GPU-intensive"), {
+      browserSupport: t,
+      fallbackRecommended: r,
+      performanceNotes: n
+    };
+  }
+}, me = {
+  /**
+   * Log gradient information to console (development only)
+   */
+  inspect: (e, t) => {
+    if (process.env.NODE_ENV === "development") {
+      if (console.group(`🎨 Gradient Inspector${t ? ` - ${t}` : ""}`), "type" in e) {
+        const n = Y.debugGradient(e);
+        console.log("Type:", e.type), console.log("Valid:", n.isValid), console.log("Complexity:", n.performance.complexity), console.log("Performance Impact:", n.performance.impact), console.log("CSS:", n.cssOutput), n.errors.length > 0 && console.error("Errors:", n.errors), n.warnings.length > 0 && console.warn("Warnings:", n.warnings);
+      } else {
+        const n = Y.debugStateGradient(e);
+        console.log("Type: State Gradient"), console.log("Valid:", n.isValid), console.log("States:", Object.keys(n.stateAnalysis)), console.table(n.stateAnalysis), n.errors.length > 0 && console.error("Errors:", n.errors), n.warnings.length > 0 && console.warn("Warnings:", n.warnings);
+      }
+      console.groupEnd();
+    }
+  },
+  /**
+   * Track gradient usage in components
+   */
+  trackUsage: (e, t) => {
+    if (process.env.NODE_ENV !== "development") return;
+    Q.getInstance().trackCreation(`${e}-${t}`, {
+      type: "linear",
+      options: { colors: ["#000", "#fff"], startPoint: "top", endPoint: "bottom" }
+    });
+  },
+  /**
+   * Generate performance report
+   */
+  generateReport: () => {
+    if (process.env.NODE_ENV !== "development") return;
+    const t = Q.getInstance().getSummary();
+    console.group("📊 Gradient Performance Report"), console.table(t.totalMetrics), t.recommendations.length > 0 && (console.group("💡 Recommendations"), t.recommendations.forEach((n) => console.log(`• ${n}`)), console.groupEnd()), t.poorPerformers.length > 0 && (console.group("⚠️ Poor Performers"), console.table(t.poorPerformers.map((n) => ({ id: n.id, ...n.metrics }))), console.groupEnd()), console.groupEnd();
+  }
+}, pe = Q.getInstance();
+function a(e) {
+  return {
+    type: "linear",
+    options: e
+  };
+}
+function G(e) {
+  return {
+    type: "radial",
+    options: e
+  };
+}
+function it(e) {
+  return {
+    type: "angular",
+    options: e
+  };
+}
+function he(e) {
+  return {
+    type: "conic",
+    options: e
+  };
+}
+function ge(e) {
+  return {
+    type: "repeating-linear",
+    options: e
+  };
+}
+function be(e) {
+  return {
+    type: "repeating-radial",
+    options: e
+  };
+}
+function ye(e) {
+  return {
+    type: "elliptical",
+    options: e
+  };
+}
+var Et = Object.defineProperty, kt = (e, t, n) => t in e ? Et(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, D = (e, t, n) => kt(e, typeof t != "symbol" ? t + "" : t, n);
+class Nt {
+  constructor(t, n, r, o = {}) {
+    D(this, "_accessor"), D(this, "_setter"), D(this, "_binding"), D(this, "_metadata");
+    const [i, s] = ct(t);
+    this._accessor = i, this._setter = s, this._binding = U(i, s, {
+      name: o.name || `${r}Binding`
+    }), this._metadata = {
+      type: "State",
+      propertyName: r,
+      componentId: n.id,
+      options: o
+    }, n.setState(r, t);
+    const c = lt();
+    c && c.cleanups.push(() => {
+      this.cleanup();
+    }), o.resetOnMount && this.resetToInitialValue(t), o.persist && typeof window < "u" && this.setupPersistence(r, t);
+  }
+  get wrappedValue() {
+    return this._accessor();
+  }
+  set wrappedValue(t) {
+    this._setter(t);
+  }
+  get projectedValue() {
+    return this._binding;
+  }
+  /**
+   * Get the underlying signal accessor (for advanced usage)
+   */
+  get accessor() {
+    return this._accessor;
+  }
+  /**
+   * Get the underlying signal setter (for advanced usage)
+   */
+  get setter() {
+    return this._setter;
+  }
+  /**
+   * Get property wrapper metadata
+   */
+  get metadata() {
+    return this._metadata;
+  }
+  /**
+   * Reset to initial value
+   */
+  resetToInitialValue(t) {
+    this._setter(t);
+  }
+  /**
+   * Set up local storage persistence
+   */
+  setupPersistence(t, n) {
+    const r = `tachui_state_${this._metadata.componentId}_${t}`;
+    try {
+      const o = localStorage.getItem(r);
+      if (o != null && o !== "undefined") {
+        const i = JSON.parse(o);
+        this._setter(i);
+      }
+    } catch (o) {
+      console.warn(`Failed to load persisted state for ${t}:`, o);
+    }
+    dt(() => {
+      const o = this._accessor();
+      try {
+        localStorage.setItem(r, JSON.stringify(o));
+      } catch (i) {
+        console.warn(`Failed to persist state for ${t}:`, i);
+      }
+    });
+  }
+  /**
+   * Cleanup resources
+   */
+  cleanup() {
+  }
+}
+function U(e, t, n = {}) {
+  return new Ot(e, t, n);
+}
+let Ot = class {
+  constructor(t, n, r = {}) {
+    this._get = t, this._set = n, this._options = r;
+  }
+  get wrappedValue() {
+    return this._get();
+  }
+  set wrappedValue(t) {
+    this._set(t);
+  }
+  get projectedValue() {
+    return this;
+  }
+  get() {
+    return this._get();
+  }
+  set(t) {
+    this._set(t);
+  }
+  /**
+   * Create a derived binding with transformation
+   */
+  map(t, n) {
+    return U(() => t(this._get()), (i) => {
+      const s = this._get(), c = t(s), f = typeof i == "function" ? i(c) : i, d = n(f, s);
+      this._set(d);
+    }, {
+      name: `${this._options.name || "binding"}_mapped`
+    });
+  }
+  /**
+   * Create a constant binding (read-only)
+   */
+  constant() {
+    return U(
+      this._get,
+      () => (console.warn("Attempted to set value on constant binding"), this._get()),
+      { name: `${this._options.name || "binding"}_constant` }
+    );
+  }
+};
+const ve = (e, t = {}) => {
+  const n = nt(), r = Bt() || "state";
+  return new Nt(e, n, r, t);
+}, we = U;
+function Bt() {
+  try {
+    const e = new Error().stack;
+    if (e)
+      return e.match(/at (\w+)\./)?.[1] || null;
+  } catch {
+  }
+  return null;
+}
+function It(e) {
+  return e && typeof e == "object" && "wrappedValue" in e && "projectedValue" in e;
+}
+function Dt(e) {
+  return e && typeof e == "object" && "get" in e && "set" in e && "wrappedValue" in e;
+}
+function Ce(e) {
+  return It(e) || Dt(e) ? e.wrappedValue : e;
+}
+var Lt = Object.defineProperty, Ht = (e, t, n) => t in e ? Lt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, V = (e, t, n) => Ht(e, typeof t != "symbol" ? t + "" : t, n);
+class w {
+  constructor(t, n, r, o, i = {}) {
+    V(this, "_get"), V(this, "_set"), V(this, "_options"), V(this, "_componentContext"), V(this, "_propertyName"), this._get = t, this._set = n, this._componentContext = r, this._propertyName = o, this._options = i, r.setBinding(o, this);
+  }
+  get wrappedValue() {
+    return this._get();
+  }
+  set wrappedValue(t) {
+    this._set(t), this._componentContext.setState(`_binding_${this._propertyName}_trigger`, Date.now());
+  }
+  get projectedValue() {
+    return this;
+  }
+  get() {
+    return this._get();
+  }
+  set(t) {
+    this._set(t), this._componentContext.setState(`_binding_${this._propertyName}_trigger`, Date.now());
+  }
+  /**
+   * Create a derived binding with transformation
+   */
+  map(t, n) {
+    const r = () => t(this._get()), o = (i) => {
+      const s = this._get(), c = t(s), f = typeof i == "function" ? i(c) : i, d = n(f, s);
+      this._set(d), this._componentContext.setState(`_binding_${this._propertyName}_mapped_trigger`, Date.now());
+    };
+    return new w(
+      r,
+      o,
+      this._componentContext,
+      `${this._propertyName}_mapped`,
+      { name: `${this._options.name || "binding"}_mapped` }
+    );
+  }
+  /**
+   * Create a constant binding (read-only)
+   */
+  constant() {
+    const t = () => (console.warn("Attempted to set value on constant binding"), this._get());
+    return new w(
+      this._get,
+      t,
+      this._componentContext,
+      `${this._propertyName}_constant`,
+      { name: `${this._options.name || "binding"}_constant` }
+    );
+  }
+  /**
+   * Create a binding with validation
+   */
+  withValidation(t, n) {
+    const r = (o) => {
+      const i = typeof o == "function" ? o(this._get()) : o;
+      return t(i) ? (this._set(i), this._componentContext.setState(
+        `_binding_${this._propertyName}_validated_trigger`,
+        Date.now()
+      )) : console.warn(n || `Validation failed for binding ${this._propertyName}`), i;
+    };
+    return new w(
+      this._get,
+      r,
+      this._componentContext,
+      `${this._propertyName}_validated`,
+      { name: `${this._options.name || "binding"}_validated` }
+    );
+  }
+  /**
+   * Create a debounced binding
+   */
+  debounced(t = 300) {
+    let n = null;
+    const r = (o) => {
+      const i = typeof o == "function" ? o(this._get()) : o;
+      return n && clearTimeout(n), n = setTimeout(() => {
+        this._set(i), this._componentContext.setState(
+          `_binding_${this._propertyName}_debounced_trigger`,
+          Date.now()
+        ), n = null;
+      }, t), i;
+    };
+    return new w(
+      this._get,
+      r,
+      this._componentContext,
+      `${this._propertyName}_debounced`,
+      { name: `${this._options.name || "binding"}_debounced` }
+    );
+  }
+}
+function tt(e, t, n = {}) {
+  const r = nt(), o = jt() || "binding";
+  return new w(e, t, r, o, n);
+}
+function jt() {
+  try {
+    const e = new Error().stack;
+    if (e)
+      return e.match(/at (\w+)\./)?.[1] || null;
+  } catch {
+  }
+  return null;
+}
+function _e(e) {
+  return e && typeof e == "object" && "get" in e && "set" in e && "wrappedValue" in e && e instanceof w;
+}
+const Se = {
+  /**
+   * Check if a binding is read-only
+   */
+  isReadOnly(e) {
+    if (e instanceof w)
+      try {
+        const t = e.get(), n = console.warn;
+        let r = !1;
+        return console.warn = (...o) => {
+          o[0] === "Attempted to set value on constant binding" && (r = !0);
+        }, e.set(t), console.warn = n, r;
+      } catch {
+        return !0;
+      }
+    return !1;
+  },
+  /**
+   * Create a computed binding from multiple sources
+   */
+  computed(e, t, n = {}) {
+    const r = () => {
+      const i = e.map((s) => s.get());
+      return t(...i);
+    };
+    return tt(r, () => (console.warn("Cannot set computed binding value"), r()), n);
+  },
+  /**
+   * Chain multiple bindings together
+   */
+  chain(e, t = {}) {
+    const n = () => e.map((o) => o.get());
+    return tt(n, (o) => {
+      const i = typeof o == "function" ? o(n()) : o;
+      return e.forEach((s, c) => {
+        c < i.length && s.set(i[c]);
+      }), i;
+    }, t);
+  }
+};
+export {
+  Se as $,
+  ee as A,
+  de as B,
+  u as C,
+  ue as D,
+  ye as E,
+  C as F,
+  ce as G,
+  T as H,
+  N as I,
+  F as J,
+  E as K,
+  a as L,
+  xt as M,
+  At as N,
+  Rt as O,
+  j as P,
+  rt as Q,
+  G as R,
+  X as S,
+  se as T,
+  Vt as U,
+  fe as V,
+  Q as W,
+  Y as X,
+  me as Y,
+  pe as Z,
+  w as _,
+  S as a,
+  tt as a0,
+  _e as a1,
+  U as a2,
+  we as a3,
+  Dt as a4,
+  It as a5,
+  ve as a6,
+  Ce as a7,
+  Qt as b,
+  Xt as c,
+  Yt as d,
+  te as e,
+  ne as f,
+  re as g,
+  oe as h,
+  ie as i,
+  it as j,
+  he as k,
+  ae as l,
+  ge as m,
+  be as n,
+  L as o,
+  O as p,
+  p as q,
+  P as r,
+  l as s,
+  y as t,
+  $t as u,
+  St as v,
+  v as w,
+  _ as x,
+  B as y,
+  le as z
+};