tekivex-ui 2.5.2 → 2.5.3

package/dist/quantum.js

@@ -0,0 +1,2312 @@
+import { jsxs as c, jsx as a, Fragment as pe } from "react/jsx-runtime";
+import Z, { useState as A, useEffect as V, useCallback as R, useRef as X } from "react";
+import { u as K } from "./index-eT_U4qB2.js";
+import { t as le } from "./tkx-BJ10JtMv.js";
+import { s as J } from "./security-CzAmaMqa.js";
+class W {
+  constructor(e, n) {
+    this.re = e, this.im = n;
+  }
+  add(e) {
+    return new W(this.re + e.re, this.im + e.im);
+  }
+  sub(e) {
+    return new W(this.re - e.re, this.im - e.im);
+  }
+  mul(e) {
+    return new W(
+      this.re * e.re - this.im * e.im,
+      this.re * e.im + this.im * e.re
+    );
+  }
+  scale(e) {
+    return new W(this.re * e, this.im * e);
+  }
+  conjugate() {
+    return new W(this.re, -this.im);
+  }
+  /** |z|² */
+  magnitudeSquared() {
+    return this.re * this.re + this.im * this.im;
+  }
+  /** |z| */
+  magnitude() {
+    return Math.sqrt(this.magnitudeSquared());
+  }
+  static fromPolar(e, n) {
+    return new W(e * Math.cos(n), e * Math.sin(n));
+  }
+  static zero() {
+    return new W(0, 0);
+  }
+  static one() {
+    return new W(1, 0);
+  }
+}
+class _ {
+  // amplitude of |1⟩
+  constructor(e = W.one(), n = W.zero()) {
+    this.alpha = e, this.beta = n, this.normalize();
+  }
+  /** Ensure |α|² + |β|² = 1 */
+  normalize() {
+    const e = Math.sqrt(
+      this.alpha.magnitudeSquared() + this.beta.magnitudeSquared()
+    );
+    e > 0 && (this.alpha = this.alpha.scale(1 / e), this.beta = this.beta.scale(1 / e));
+  }
+  /** Hadamard gate: H|0⟩ = (|0⟩+|1⟩)/√2, H|1⟩ = (|0⟩−|1⟩)/√2 */
+  hadamard() {
+    const e = 1 / Math.SQRT2, n = this.alpha.add(this.beta).scale(e), i = this.alpha.sub(this.beta).scale(e);
+    return new _(n, i);
+  }
+  /**
+   * Ry(θ) rotation gate:
+   * [[cos(θ/2), -sin(θ/2)],
+   *  [sin(θ/2),  cos(θ/2)]]
+   */
+  ry(e) {
+    const n = Math.cos(e / 2), i = Math.sin(e / 2), t = this.alpha.scale(n).sub(this.beta.scale(i)), l = this.alpha.scale(i).add(this.beta.scale(n));
+    return new _(t, l);
+  }
+  /** Phase gate: |0⟩ → |0⟩, |1⟩ → e^(iφ)|1⟩ */
+  phase(e) {
+    const n = W.fromPolar(1, e);
+    return new _(this.alpha, this.beta.mul(n));
+  }
+  /**
+   * Measure the qubit. Returns 0 with probability |α|², 1 with probability |β|².
+   * Collapses the state after measurement.
+   */
+  measure() {
+    const e = this.beta.magnitudeSquared();
+    return Math.random() < e ? 1 : 0;
+  }
+  /** Returns |β|² — probability of measuring 1 */
+  expectation() {
+    return this.beta.magnitudeSquared();
+  }
+  getAlpha() {
+    return this.alpha;
+  }
+  getBeta() {
+    return this.beta;
+  }
+}
+class ue {
+  constructor(e) {
+    this.qubits = Array.from({ length: e }, () => new _());
+  }
+  get size() {
+    return this.qubits.length;
+  }
+  getQubit(e) {
+    return this.qubits[e];
+  }
+  /** Apply Hadamard to all qubits — creates uniform superposition */
+  superpose() {
+    this.qubits = this.qubits.map((e) => e.hadamard());
+  }
+  /**
+   * CNOT gate: if control qubit has high |1⟩ probability, flip target qubit.
+   * Approximate classical simulation: probabilistic flip based on control expectation.
+   */
+  cnot(e, n) {
+    const i = this.qubits[e], t = this.qubits[n], l = i.expectation();
+    this.qubits[n] = t.ry(Math.PI * l);
+  }
+  /** Apply Ry rotation to a specific qubit */
+  rotate(e, n) {
+    this.qubits[e] = this.qubits[e].ry(n);
+  }
+  /** Measure all qubits; returns array of 0/1 */
+  measure() {
+    return this.qubits.map((e) => e.measure());
+  }
+  /** Returns probability of measuring 1 for each qubit */
+  probs() {
+    return this.qubits.map((e) => e.expectation());
+  }
+}
+class de {
+  constructor(e = 1, n = 0.995, i = 0.3, t = 1e-6) {
+    this.temperature = e, this.coolingRate = n, this.tunnelingStrength = i, this.minTemp = t;
+  }
+  anneal(e, n, i, t = 1e3) {
+    let l = e, s = n(l), d = l, o = s, p = this.temperature, f = 0, m = 0;
+    for (let g = 0; g < t && p > this.minTemp; g++) {
+      const b = i(l), h = n(b), v = h - s;
+      let C = !1;
+      if (v <= 0)
+        C = !0;
+      else {
+        const k = Math.exp(-v / p), P = Math.sqrt(2 * Math.abs(v)), F = Math.abs(v), w = Math.exp(-2 * P * Math.sqrt(F) * this.tunnelingStrength);
+        Math.random() < k + w && (C = !0, Math.random() < w / (k + w + 1e-10) && m++);
+      }
+      C && (l = b, s = h, f++, s < o && (d = l, o = s)), p *= this.coolingRate;
+    }
+    return {
+      state: d,
+      energy: o,
+      iterations: t,
+      accepted: f,
+      tunnels: m
+    };
+  }
+}
+class he {
+  constructor(e, n) {
+    const i = Math.sqrt(2 / (e + n));
+    this.weights = Array.from(
+      { length: e },
+      () => Array.from({ length: n }, () => (Math.random() * 2 - 1) * i)
+    ), this.visibleBias = Array.from({ length: e }, () => 0), this.hiddenBias = Array.from({ length: n }, () => 0);
+  }
+  /** Sigmoid with tiny quantum noise */
+  sigmoid(e) {
+    const n = (Math.random() - 0.5) * 0.1;
+    return 1 / (1 + Math.exp(-(e + n)));
+  }
+  /** Sample a binary value from a probability */
+  sample(e) {
+    return Math.random() < e ? 1 : 0;
+  }
+  /**
+   * Energy: E(v,h) = -vBias·v - hBias·h - v^T W h
+   */
+  energy(e, n) {
+    const i = this.visibleBias.reduce((s, d, o) => s + d * e[o], 0), t = this.hiddenBias.reduce((s, d, o) => s + d * n[o], 0);
+    let l = 0;
+    for (let s = 0; s < e.length; s++)
+      for (let d = 0; d < n.length; d++)
+        l += e[s] * this.weights[s][d] * n[d];
+    return -(i + t + l);
+  }
+  /**
+   * Compute P(h_j=1 | v) = sigmoid(hBias[j] + sum_i weights[i][j] * v[i])
+   */
+  hiddenProbs(e) {
+    return this.hiddenBias.map((n, i) => {
+      const t = n + e.reduce((l, s, d) => l + this.weights[d][i] * s, 0);
+      return this.sigmoid(t);
+    });
+  }
+  /**
+   * Compute P(v_i=1 | h) = sigmoid(vBias[i] + sum_j weights[i][j] * h[j])
+   */
+  visibleProbs(e) {
+    return this.visibleBias.map((n, i) => {
+      const t = n + e.reduce((l, s, d) => l + this.weights[i][d] * s, 0);
+      return this.sigmoid(t);
+    });
+  }
+  /**
+   * Gibbs sampling: run k steps of
+   *   h ← sample(hiddenProbs(v))
+   *   v ← sample(visibleProbs(h))
+   */
+  gibbs(e, n = 1) {
+    let i = [...e], t = [];
+    for (let l = 0; l < n; l++)
+      t = this.hiddenProbs(i).map((s) => this.sample(s)), i = this.visibleProbs(t).map((s) => this.sample(s));
+    return { visible: i, hidden: t };
+  }
+  /**
+   * Contrastive Divergence-1 training step.
+   */
+  trainCD1(e, n = 0.01) {
+    const i = this.visibleBias.length, t = this.hiddenBias.length, l = Array.from({ length: i }, () => Array(t).fill(0)), s = Array(i).fill(0), d = Array(t).fill(0);
+    for (const p of e) {
+      const f = this.hiddenProbs(p), m = f.map((h) => this.sample(h)), g = this.visibleProbs(m).map((h) => this.sample(h)), b = this.hiddenProbs(g);
+      for (let h = 0; h < i; h++) {
+        for (let v = 0; v < t; v++)
+          l[h][v] += p[h] * f[v] - g[h] * b[v];
+        s[h] += p[h] - g[h];
+      }
+      for (let h = 0; h < t; h++)
+        d[h] += f[h] - b[h];
+    }
+    const o = e.length;
+    for (let p = 0; p < i; p++) {
+      for (let f = 0; f < t; f++)
+        this.weights[p][f] += n * l[p][f] / o;
+      this.visibleBias[p] += n * s[p] / o;
+    }
+    for (let p = 0; p < t; p++)
+      this.hiddenBias[p] += n * d[p] / o;
+  }
+  /**
+   * Infer hidden activations from partial visible input.
+   */
+  infer(e) {
+    const n = this.hiddenProbs(e), i = n.map((l) => this.sample(l)), t = this.visibleProbs(i);
+    return {
+      hidden: n,
+      visible: t,
+      energy: this.energy(e, i),
+      iterations: 1
+    };
+  }
+}
+class ee {
+  /**
+   * Amplify probabilities of "marked" items using Grover-inspired algorithm.
+   */
+  amplify(e, n, i = 0.5) {
+    const t = e.length;
+    if (t === 0) return [];
+    const l = e.map(n), s = l.filter((m) => m > i).length, d = Math.max(1, s);
+    let o = Array(t).fill(1 / Math.sqrt(t));
+    const p = Math.max(1, Math.floor(Math.PI / 4 * Math.sqrt(t / d)));
+    for (let m = 0; m < p; m++) {
+      for (let b = 0; b < t; b++)
+        l[b] > i && (o[b] = -o[b]);
+      const g = o.reduce((b, h) => b + h, 0) / t;
+      o = o.map((b) => 2 * g - b);
+    }
+    return e.map((m, g) => ({
+      index: g,
+      amplitude: o[g],
+      probability: o[g] * o[g],
+      classicalSimilarity: l[g],
+      combined: o[g] * o[g] * 0.6 + l[g] * 0.4
+    })).sort((m, g) => g.combined - m.combined);
+  }
+}
+const te = [
+  {
+    keywords: ["email", "e-mail", "mail"],
+    type: "email",
+    validations: [
+      { rule: "required", message: "Email is required" },
+      { rule: "pattern", value: "^[^@]+@[^@]+\\.[^@]+$", message: "Enter a valid email address" },
+      { rule: "maxLength", value: 254, message: "Email too long" }
+    ],
+    placeholder: "you@example.com",
+    label: "Email Address",
+    confidence: 0.98
+  },
+  {
+    keywords: ["password", "passwd", "pwd", "pass"],
+    type: "password",
+    validations: [
+      { rule: "required", message: "Password is required" },
+      { rule: "minLength", value: 8, message: "Password must be at least 8 characters" },
+      { rule: "pattern", value: "(?=.*[A-Z])(?=.*[0-9])", message: "Include uppercase and a number" }
+    ],
+    placeholder: "••••••••",
+    label: "Password",
+    confidence: 0.97
+  },
+  {
+    keywords: ["confirm_password", "confirmpassword", "confirm_pass", "repassword", "password2", "repeat_password"],
+    type: "password",
+    validations: [
+      { rule: "required", message: "Please confirm your password" },
+      { rule: "match", value: "password", message: "Passwords do not match" }
+    ],
+    placeholder: "••••••••",
+    label: "Confirm Password",
+    confidence: 0.95
+  },
+  {
+    keywords: ["phone", "mobile", "cell", "tel", "telephone", "contact_number"],
+    type: "tel",
+    validations: [
+      { rule: "pattern", value: "^[+]?[(]?[0-9]{3}[)]?[-\\s.]?[0-9]{3}[-\\s.]?[0-9]{4,6}$", message: "Enter a valid phone number" }
+    ],
+    placeholder: "+1 (555) 000-0000",
+    label: "Phone Number",
+    confidence: 0.93
+  },
+  {
+    keywords: ["age"],
+    type: "number",
+    validations: [
+      { rule: "min", value: 0, message: "Age cannot be negative" },
+      { rule: "max", value: 150, message: "Enter a valid age" },
+      { rule: "integer", message: "Age must be a whole number" }
+    ],
+    placeholder: "25",
+    label: "Age",
+    confidence: 0.9
+  },
+  {
+    keywords: ["price", "amount", "cost", "fee", "payment", "salary", "wage", "total"],
+    type: "number",
+    validations: [
+      { rule: "min", value: 0, message: "Amount cannot be negative" },
+      { rule: "pattern", value: "^\\d+(\\.\\d{1,2})?$", message: "Enter a valid amount (e.g. 9.99)" }
+    ],
+    placeholder: "0.00",
+    label: "Amount",
+    confidence: 0.88
+  },
+  {
+    keywords: ["url", "website", "site", "link", "homepage", "web"],
+    type: "url",
+    validations: [
+      { rule: "pattern", value: "https?://.+", message: "Enter a valid URL starting with http:// or https://" }
+    ],
+    placeholder: "https://example.com",
+    label: "Website URL",
+    confidence: 0.92
+  },
+  {
+    keywords: ["zip", "zipcode", "postal", "postcode", "pin_code"],
+    type: "text",
+    validations: [
+      { rule: "pattern", value: "^[0-9]{5}(-[0-9]{4})?$", message: "Enter a valid ZIP code (e.g. 12345)" }
+    ],
+    placeholder: "12345",
+    label: "ZIP / Postal Code",
+    confidence: 0.91
+  },
+  {
+    keywords: ["date", "dob", "birthday", "birth_date", "birthdate", "born"],
+    type: "date",
+    validations: [
+      { rule: "required", message: "Date is required" }
+    ],
+    placeholder: "YYYY-MM-DD",
+    label: "Date of Birth",
+    confidence: 0.89
+  },
+  {
+    keywords: ["first_name", "firstname", "fname", "given_name"],
+    type: "text",
+    validations: [
+      { rule: "minLength", value: 2, message: "First name too short" },
+      { rule: "maxLength", value: 50, message: "First name too long" }
+    ],
+    placeholder: "Jane",
+    label: "First Name",
+    confidence: 0.9
+  },
+  {
+    keywords: ["last_name", "lastname", "lname", "surname", "family_name"],
+    type: "text",
+    validations: [
+      { rule: "minLength", value: 2, message: "Last name too short" },
+      { rule: "maxLength", value: 50, message: "Last name too long" }
+    ],
+    placeholder: "Doe",
+    label: "Last Name",
+    confidence: 0.9
+  },
+  {
+    keywords: ["name", "full_name", "fullname", "display_name"],
+    type: "text",
+    validations: [
+      { rule: "minLength", value: 2, message: "Name too short" },
+      { rule: "maxLength", value: 100, message: "Name too long" }
+    ],
+    placeholder: "Jane Doe",
+    label: "Full Name",
+    confidence: 0.85
+  },
+  {
+    keywords: ["username", "user_name", "handle", "login", "loginname"],
+    type: "text",
+    validations: [
+      { rule: "minLength", value: 3, message: "Username must be at least 3 characters" },
+      { rule: "maxLength", value: 32, message: "Username too long" },
+      { rule: "pattern", value: "^[a-zA-Z0-9_.-]+$", message: "Only letters, numbers, _, - and . allowed" }
+    ],
+    placeholder: "cooluser42",
+    label: "Username",
+    confidence: 0.94
+  },
+  {
+    keywords: ["bio", "biography", "about", "description", "summary", "details"],
+    type: "textarea",
+    validations: [
+      { rule: "maxLength", value: 500, message: "Bio must be under 500 characters" }
+    ],
+    placeholder: "Tell us about yourself...",
+    label: "Bio",
+    confidence: 0.87
+  },
+  {
+    keywords: ["message", "comment", "feedback", "note", "notes", "remarks", "body"],
+    type: "textarea",
+    validations: [
+      { rule: "minLength", value: 10, message: "Message too short" },
+      { rule: "maxLength", value: 2e3, message: "Message too long" }
+    ],
+    placeholder: "Write your message here...",
+    label: "Message",
+    confidence: 0.86
+  },
+  {
+    keywords: ["search", "query", "q", "keyword", "find"],
+    type: "search",
+    validations: [],
+    placeholder: "Search...",
+    label: "Search",
+    confidence: 0.9
+  },
+  {
+    keywords: ["otp", "one_time_password", "verification_code", "pin", "code"],
+    type: "text",
+    validations: [
+      { rule: "minLength", value: 4, message: "Code too short" },
+      { rule: "maxLength", value: 8, message: "Code too long" },
+      { rule: "pattern", value: "^[0-9]+$", message: "Code must be numeric" }
+    ],
+    placeholder: "123456",
+    label: "Verification Code",
+    confidence: 0.92
+  },
+  {
+    keywords: ["color", "colour", "hex_color", "brand_color"],
+    type: "color",
+    validations: [],
+    placeholder: "#3b82f6",
+    label: "Color",
+    confidence: 0.95
+  },
+  {
+    keywords: ["address", "street", "street_address", "addr"],
+    type: "text",
+    validations: [
+      { rule: "maxLength", value: 200, message: "Address too long" }
+    ],
+    placeholder: "123 Main Street",
+    label: "Street Address",
+    confidence: 0.87
+  },
+  {
+    keywords: ["city", "town", "municipality"],
+    type: "text",
+    validations: [
+      { rule: "maxLength", value: 100, message: "City name too long" }
+    ],
+    placeholder: "San Francisco",
+    label: "City",
+    confidence: 0.89
+  },
+  {
+    keywords: ["country", "nation", "country_code"],
+    type: "text",
+    validations: [],
+    placeholder: "United States",
+    label: "Country",
+    confidence: 0.88
+  },
+  {
+    keywords: ["company", "organization", "org", "employer", "company_name"],
+    type: "text",
+    validations: [
+      { rule: "maxLength", value: 200, message: "Company name too long" }
+    ],
+    placeholder: "Acme Inc.",
+    label: "Company",
+    confidence: 0.87
+  }
+];
+function ce(r) {
+  const e = r.toLowerCase().replace(/[\s-]/g, "_"), i = new ee().amplify(
+    te,
+    (t) => {
+      let l = 0;
+      for (const s of t.keywords)
+        e === s ? l = Math.max(l, 1) : e.includes(s) || s.includes(e) ? l = Math.max(l, 0.8) : s.split("_").some((d) => e.includes(d)) && (l = Math.max(l, 0.5));
+      return l;
+    },
+    0.3
+  );
+  if (i.length > 0 && i[0].combined > 0.1) {
+    const t = te[i[0].index];
+    return {
+      type: t.type,
+      validations: t.validations,
+      placeholder: t.placeholder,
+      confidence: Math.min(t.confidence * i[0].combined * 2, 0.99),
+      label: t.label
+    };
+  }
+  return {
+    type: "text",
+    validations: [{ rule: "maxLength", value: 255, message: "Input too long" }],
+    placeholder: r.replace(/_/g, " "),
+    confidence: 0.3,
+    label: r.replace(/_/g, " ").replace(/\b\w/g, (t) => t.toUpperCase())
+  };
+}
+function G(r, e, n) {
+  const i = e / 100, t = n / 100, l = i * Math.min(t, 1 - t), s = (d) => {
+    const o = (d + r / 30) % 12, p = t - l * Math.max(Math.min(o - 3, 9 - o, 1), -1);
+    return Math.round(255 * p).toString(16).padStart(2, "0");
+  };
+  return `#${s(0)}${s(8)}${s(4)}`;
+}
+function me(r) {
+  const e = r.replace("#", ""), n = e.length === 3 ? e.split("").map((i) => i + i).join("") : e;
+  return [
+    parseInt(n.slice(0, 2), 16),
+    parseInt(n.slice(2, 4), 16),
+    parseInt(n.slice(4, 6), 16)
+  ];
+}
+function re(r) {
+  const [e, n, i] = me(r).map((t) => {
+    const l = t / 255;
+    return l <= 0.03928 ? l / 12.92 : ((l + 0.055) / 1.055) ** 2.4;
+  });
+  return 0.2126 * e + 0.7152 * n + 0.0722 * i;
+}
+function U(r, e) {
+  const n = re(r), i = re(e), t = Math.max(n, i), l = Math.min(n, i);
+  return (t + 0.05) / (l + 0.05);
+}
+function ge(r, e) {
+  const n = (t) => G(t.h, t.s, t.l), i = e ? r.text.l - 20 : r.text.l + 15;
+  return {
+    primary: n(r.primary),
+    secondary: n(r.secondary),
+    background: n(r.bg),
+    surface: n(r.surface),
+    text: n(r.text),
+    textMuted: G(
+      r.text.h,
+      Math.max(0, r.text.s - 10),
+      Math.max(20, Math.min(85, i))
+    ),
+    border: n(r.border),
+    error: e ? "#f87171" : "#dc2626",
+    warning: e ? "#fbbf24" : "#d97706",
+    success: e ? "#34d399" : "#059669",
+    accent: n(r.accent)
+  };
+}
+function fe(r, e) {
+  let n = 0;
+  const i = (k) => G(k.h, k.s, k.l), t = i(r.text), l = i(r.bg), s = i(r.surface), d = i(r.primary), o = U(t, l), p = U(t, s), f = U(d, l);
+  o < 4.5 && (n += (4.5 - o) * 10), p < 4.5 && (n += (4.5 - p) * 8), f < 3 && (n += (3 - f) * 5);
+  const g = Math.abs((r.secondary.h - r.primary.h + 360) % 360 - 137.508);
+  n += g * 0.05;
+  const b = Math.abs((r.accent.h - r.primary.h + 360) % 360 - 120);
+  n += b * 0.03;
+  const h = (r.primary.s + r.secondary.s) / 2;
+  h < 20 && (n += (20 - h) * 0.5), h > 90 && (n += (h - 90) * 0.5);
+  const v = r.bg.l;
+  e ? (v > 25 && (n += (v - 25) * 2), v < 3 && (n += (3 - v) * 2), r.text.l < 70 && (n += (70 - r.text.l) * 1.5)) : (v < 90 && (n += (90 - v) * 2), v > 100 && (n += (v - 100) * 2), r.text.l > 30 && (n += (r.text.l - 30) * 1.5));
+  const C = Math.abs(r.surface.l - r.bg.l);
+  return C < 2 && (n += (2 - C) * 2), C > 12 && (n += (C - 12) * 1), n;
+}
+function ne(r, e, n) {
+  return Math.max(e, Math.min(n, r));
+}
+function ye(r, e, n = 800) {
+  const i = e ? {
+    primary: { h: r, s: 70, l: 55 },
+    secondary: { h: (r + 137.5) % 360, s: 65, l: 50 },
+    bg: { h: r, s: 10, l: 8 },
+    surface: { h: r, s: 10, l: 13 },
+    text: { h: r, s: 15, l: 90 },
+    border: { h: r, s: 15, l: 22 },
+    accent: { h: (r + 120) % 360, s: 75, l: 60 }
+  } : {
+    primary: { h: r, s: 65, l: 40 },
+    secondary: { h: (r + 137.5) % 360, s: 55, l: 38 },
+    bg: { h: r, s: 15, l: 97 },
+    surface: { h: r, s: 12, l: 100 },
+    text: { h: r, s: 15, l: 12 },
+    border: { h: r, s: 12, l: 85 },
+    accent: { h: (r + 120) % 360, s: 70, l: 42 }
+  }, l = new de(1.5, 0.994, 0.35, 1e-5).anneal(
+    i,
+    (s) => fe(s, e),
+    (s) => {
+      const d = ["primary", "secondary", "bg", "surface", "text", "border", "accent"], o = d[Math.floor(Math.random() * d.length)], p = ["h", "s", "l"], f = p[Math.floor(Math.random() * p.length)], m = (Math.random() - 0.5) * (f === "h" ? 30 : 15), g = {
+        ...s,
+        [o]: { ...s[o] }
+      };
+      return f === "h" ? g[o] = { ...g[o], h: (s[o].h + m + 360) % 360 } : f === "s" ? g[o] = { ...g[o], s: ne(s[o].s + m, 0, 100) } : g[o] = { ...g[o], l: ne(s[o].l + m, 0, 100) }, g;
+    },
+    n
+  );
+  return ge(l.state, e);
+}
+const Y = {
+  /** Create a single qubit in |0⟩ state */
+  qubit() {
+    return new _();
+  },
+  /** Create a quantum register of n qubits */
+  register(r) {
+    return new ue(r);
+  },
+  /** Create a quantum annealer */
+  annealer(r, e, n) {
+    return new de(r, e, n);
+  },
+  /** Create a Quantum Boltzmann Machine */
+  qbm(r, e) {
+    return new he(r, e);
+  },
+  /** Create an amplitude amplifier */
+  amplifier() {
+    return new ee();
+  },
+  /** Infer field intelligence from a field name */
+  inferField: ce,
+  /** Optimize theme colors using quantum annealing */
+  optimizeTheme: ye,
+  /** Compute WCAG contrast ratio between two hex colors */
+  contrast: U,
+  /** Convert HSL to hex */
+  hslToHex: G
+};
+function xe(r, e, n, i) {
+  const t = n.trim();
+  switch (r) {
+    case "required":
+      return t !== "";
+    case "email":
+    case "pattern":
+      if (typeof e == "string")
+        try {
+          return t === "" || new RegExp(e).test(t);
+        } catch {
+          return !0;
+        }
+      return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(t);
+    case "phone":
+      return t === "" || /^\+?[\d\s\-()]{7,15}$/.test(t);
+    case "url":
+      return t === "" || /^https?:\/\/.+/.test(t);
+    case "minLength":
+    case "min": {
+      const l = Number(e ?? 0);
+      return t === "" || (isNaN(Number(t)) ? t.length >= l : Number(t) >= l);
+    }
+    case "maxLength":
+    case "max": {
+      const l = Number(e ?? 1 / 0);
+      return t === "" || (isNaN(Number(t)) ? t.length <= l : Number(t) <= l);
+    }
+    case "integer":
+      return t === "" || /^\d+$/.test(t);
+    case "alphanumeric":
+      return t === "" || /^[a-zA-Z0-9]+$/.test(t);
+    case "match":
+      return t === (i[typeof e == "string" ? e : "password"] ?? "");
+    default:
+      return !0;
+  }
+}
+function be({ phase: r, collapsed: e, primaryColor: n, borderColor: i }) {
+  const d = e ? 0 : r, o = e ? 0 : r * 1.618, p = 12 + 10 * Math.sin(d) * Math.cos(o), f = 12 - 10 * Math.cos(d);
+  return /* @__PURE__ */ c(
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      "aria-hidden": "true",
+      style: { flexShrink: 0, opacity: e ? 0.4 : 1, transition: "opacity 0.6s" },
+      children: [
+        /* @__PURE__ */ a("circle", { cx: 12, cy: 12, r: 10, fill: "none", stroke: i, strokeWidth: "0.8" }),
+        /* @__PURE__ */ a("ellipse", { cx: 12, cy: 12, rx: 10, ry: 10 * 0.3, fill: "none", stroke: i, strokeWidth: "0.5", strokeDasharray: "2 2" }),
+        /* @__PURE__ */ a("line", { x1: 12, y1: 2, x2: 12, y2: 22, stroke: i, strokeWidth: "0.5" }),
+        /* @__PURE__ */ a(
+          "line",
+          {
+            x1: 12,
+            y1: 12,
+            x2: p,
+            y2: f,
+            stroke: n,
+            strokeWidth: "1.5",
+            style: { transition: e ? "all 0.6s ease-out" : "none" }
+          }
+        ),
+        /* @__PURE__ */ a(
+          "circle",
+          {
+            cx: p,
+            cy: f,
+            r: "2",
+            fill: n,
+            style: { transition: e ? "all 0.6s ease-out" : "none" }
+          }
+        )
+      ]
+    }
+  );
+}
+function ve({
+  confidence: r,
+  theme: e
+}) {
+  const n = Math.round(r * 100), i = n >= 80 ? e.success : n >= 60 ? e.warning : e.danger;
+  return /* @__PURE__ */ c(
+    "span",
+    {
+      style: {
+        display: "inline-flex",
+        alignItems: "center",
+        gap: "2px",
+        fontSize: "10px",
+        fontWeight: 600,
+        padding: "1px 5px",
+        borderRadius: "999px",
+        backgroundColor: `${i}22`,
+        color: i,
+        border: `1px solid ${i}44`,
+        marginLeft: "6px",
+        verticalAlign: "middle",
+        letterSpacing: "0.03em"
+      },
+      children: [
+        "⚛ ",
+        n,
+        "%"
+      ]
+    }
+  );
+}
+function ke({
+  config: r,
+  intel: e,
+  qubitPhase: n,
+  value: i,
+  error: t,
+  touched: l,
+  showConfidence: s,
+  showQuantumState: d,
+  collapsed: o,
+  onChange: p,
+  onBlur: f,
+  theme: m,
+  mounted: g,
+  index: b
+}) {
+  const h = r.type ?? e.type, v = r.label ?? e.label, C = r.placeholder ?? e.placeholder, k = r.required !== void 0 ? r.required : e.validations.some((L) => L.rule === "required"), P = J(v), F = h === "textarea", w = l && t !== "", $ = `qf-${r.name}`, q = {
+    width: "100%",
+    padding: "9px 12px",
+    border: `1.5px solid ${w ? m.danger : m.border}`,
+    borderRadius: "8px",
+    backgroundColor: m.surface,
+    color: m.text,
+    fontSize: "14px",
+    fontFamily: "inherit",
+    outline: "none",
+    boxSizing: "border-box",
+    transition: "border-color 0.15s, box-shadow 0.15s",
+    resize: F ? "vertical" : void 0,
+    minHeight: F ? "80px" : void 0
+  };
+  return /* @__PURE__ */ c(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        gap: "4px",
+        opacity: g ? 1 : 0,
+        transform: g ? "scaleY(1)" : "scaleY(0.92)",
+        transition: `opacity 0.35s ease ${b * 60}ms, transform 0.35s ease ${b * 60}ms`,
+        transformOrigin: "top"
+      },
+      children: [
+        /* @__PURE__ */ c("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
+          d && /* @__PURE__ */ a(
+            be,
+            {
+              phase: n,
+              collapsed: o,
+              primaryColor: m.primary,
+              borderColor: m.border
+            }
+          ),
+          /* @__PURE__ */ c(
+            "label",
+            {
+              htmlFor: $,
+              style: { fontSize: "13px", fontWeight: 500, color: m.text, cursor: "pointer" },
+              children: [
+                P,
+                k && /* @__PURE__ */ a("span", { "aria-hidden": "true", style: { color: m.danger, marginLeft: "3px" }, children: "*" })
+              ]
+            }
+          ),
+          s && /* @__PURE__ */ a(ve, { confidence: e.confidence, theme: m })
+        ] }),
+        F ? /* @__PURE__ */ a(
+          "textarea",
+          {
+            id: $,
+            value: i,
+            onChange: (L) => p(L.target.value),
+            onBlur: f,
+            placeholder: C,
+            "aria-invalid": w,
+            "aria-required": k,
+            style: q
+          }
+        ) : /* @__PURE__ */ a(
+          "input",
+          {
+            id: $,
+            type: h,
+            value: i,
+            onChange: (L) => p(L.target.value),
+            onBlur: f,
+            placeholder: C,
+            "aria-invalid": w,
+            "aria-required": k,
+            style: q
+          }
+        ),
+        w && /* @__PURE__ */ c(
+          "span",
+          {
+            role: "alert",
+            style: {
+              fontSize: "12px",
+              color: m.danger,
+              display: "flex",
+              alignItems: "center",
+              gap: "4px"
+            },
+            children: [
+              /* @__PURE__ */ a("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ a("path", { d: "M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" }) }),
+              J(t)
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function we(r) {
+  let e = 2166136261;
+  for (let n = 0; n < r.length; n++)
+    e ^= r.charCodeAt(n), e = Math.imul(e, 16777619) >>> 0;
+  return (e & 65535) / 65535 * Math.PI * 2;
+}
+function Se({
+  fields: r,
+  onSubmit: e,
+  submitLabel: n = "Submit",
+  layout: i = "vertical",
+  showConfidence: t = !0,
+  showQuantumState: l = !1
+}) {
+  const s = K(), d = r.map((y) => ce(y.name)), [o, p] = A(
+    () => Object.fromEntries(r.map((y) => [y.name, ""]))
+  ), [f, m] = A({}), [g, b] = A({}), [h, v] = A(!1), [C, k] = A(!1), [P, F] = A(!1);
+  V(() => {
+    const y = requestAnimationFrame(() => k(!0));
+    return () => cancelAnimationFrame(y);
+  }, []);
+  const w = R(
+    (y, u) => {
+      const x = r.find((z) => z.name === y), M = d[r.findIndex((z) => z.name === y)];
+      if (!x || !M) return "";
+      const S = u[y] ?? "";
+      for (const { rule: z, value: N, message: O } of M.validations)
+        if (!(z === "required" && x.required === !1) && !xe(z, N, S, u))
+          return O;
+      return "";
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [r]
+  ), $ = R(
+    (y) => {
+      const u = {};
+      for (const x of r) {
+        const M = w(x.name, y);
+        M && (u[x.name] = M);
+      }
+      return u;
+    },
+    [r, w]
+  ), q = R(
+    (y, u) => {
+      p((x) => {
+        var S;
+        const M = { ...x, [y]: u };
+        if (g[y] && (m((z) => ({ ...z, [y]: w(y, M) })), y === "password")) {
+          const z = (S = r.find(
+            (N) => ["confirmpassword", "confirm_password", "passwordconfirm"].includes(
+              N.name.toLowerCase().replace(/[\s_-]/g, "")
+            )
+          )) == null ? void 0 : S.name;
+          z && g[z] && m((N) => ({ ...N, [z]: w(z, M) }));
+        }
+        return M;
+      }), F(!0);
+    },
+    [r, g, w]
+  ), L = R(
+    (y) => {
+      b((u) => ({ ...u, [y]: !0 })), m((u) => ({ ...u, [y]: w(y, o) }));
+    },
+    [o, w]
+  ), D = R(
+    async (y) => {
+      y.preventDefault();
+      const u = Object.fromEntries(r.map((M) => [M.name, !0]));
+      b(u);
+      const x = $(o);
+      if (m(x), !(Object.keys(x).length > 0)) {
+        v(!0);
+        try {
+          await e(o);
+        } finally {
+          v(!1);
+        }
+      }
+    },
+    [r, o, $, e]
+  ), E = d.length > 0 ? Math.round(
+    d.reduce((y, u) => y + u.confidence, 0) / d.length * 100
+  ) : 0, I = E >= 80 ? s.success : E >= 60 ? s.warning : s.danger, j = i === "horizontal";
+  return /* @__PURE__ */ c(
+    "form",
+    {
+      onSubmit: D,
+      noValidate: !0,
+      className: le("w-full"),
+      style: {
+        backgroundColor: s.surface,
+        border: `1px solid ${s.border}`,
+        borderRadius: "12px",
+        padding: "24px",
+        position: "relative",
+        boxSizing: "border-box"
+      },
+      children: [
+        /* @__PURE__ */ a(
+          "span",
+          {
+            "aria-label": "Powered by Quantum AI",
+            style: {
+              position: "absolute",
+              top: "16px",
+              right: "16px",
+              fontSize: "10px",
+              fontWeight: 700,
+              padding: "3px 8px",
+              borderRadius: "999px",
+              backgroundColor: `${s.primary}20`,
+              color: s.primary,
+              border: `1px solid ${s.primary}44`,
+              letterSpacing: "0.04em",
+              userSelect: "none"
+            },
+            children: "⚛ Quantum AI"
+          }
+        ),
+        t && /* @__PURE__ */ c("div", { style: { marginBottom: "20px", paddingRight: "100px" }, children: [
+          /* @__PURE__ */ c(
+            "div",
+            {
+              style: {
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                marginBottom: "4px"
+              },
+              children: [
+                /* @__PURE__ */ a("span", { style: { fontSize: "11px", color: s.textMuted, fontWeight: 500 }, children: "Form Intelligence Confidence" }),
+                /* @__PURE__ */ c("span", { style: { fontSize: "11px", fontWeight: 700, color: I }, children: [
+                  E,
+                  "%"
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ a(
+            "div",
+            {
+              style: {
+                height: "4px",
+                borderRadius: "4px",
+                backgroundColor: s.border,
+                overflow: "hidden"
+              },
+              children: /* @__PURE__ */ a(
+                "div",
+                {
+                  style: {
+                    height: "100%",
+                    width: `${E}%`,
+                    backgroundColor: I,
+                    borderRadius: "4px",
+                    transition: "width 0.8s ease"
+                  }
+                }
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ a(
+          "div",
+          {
+            style: {
+              display: "grid",
+              gridTemplateColumns: j ? "repeat(auto-fill, minmax(260px, 1fr))" : "1fr",
+              gap: "16px",
+              marginBottom: "20px"
+            },
+            children: r.map((y, u) => /* @__PURE__ */ a(
+              ke,
+              {
+                config: y,
+                intel: d[u],
+                qubitPhase: we(y.name),
+                value: o[y.name] ?? "",
+                error: f[y.name] ?? "",
+                touched: g[y.name] ?? !1,
+                showConfidence: t,
+                showQuantumState: l,
+                collapsed: P,
+                onChange: (x) => q(y.name, x),
+                onBlur: () => L(y.name),
+                theme: s,
+                mounted: C,
+                index: u
+              },
+              y.name
+            ))
+          }
+        ),
+        /* @__PURE__ */ a(
+          "button",
+          {
+            type: "submit",
+            disabled: h,
+            style: {
+              width: "100%",
+              padding: "10px 20px",
+              borderRadius: "8px",
+              border: "none",
+              backgroundColor: h ? `${s.primary}88` : s.primary,
+              color: s.bg,
+              fontSize: "14px",
+              fontWeight: 700,
+              fontFamily: "inherit",
+              cursor: h ? "not-allowed" : "pointer",
+              transition: "background-color 0.15s, opacity 0.15s",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              gap: "8px"
+            },
+            children: h ? /* @__PURE__ */ c(pe, { children: [
+              /* @__PURE__ */ c(
+                "svg",
+                {
+                  width: "14",
+                  height: "14",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2.5",
+                  style: { animation: "qf-spin 0.8s linear infinite" },
+                  "aria-hidden": "true",
+                  children: [
+                    /* @__PURE__ */ a("circle", { cx: "12", cy: "12", r: "10", strokeOpacity: "0.25" }),
+                    /* @__PURE__ */ a("path", { d: "M12 2a10 10 0 0 1 10 10" })
+                  ]
+                }
+              ),
+              "Processing…"
+            ] }) : J(n)
+          }
+        ),
+        /* @__PURE__ */ a("style", { children: "@keyframes qf-spin { to { transform: rotate(360deg); } }" })
+      ]
+    }
+  );
+}
+Se.displayName = "TkxQuantumForm";
+function oe(r) {
+  return r ? {
+    primary: "#00f5d4",
+    secondary: "#7b2ff7",
+    background: "#0a0a0f",
+    surface: "#12121a",
+    text: "#e8e8f4",
+    textMuted: "#8888aa",
+    border: "#2a2a3e",
+    error: "#f87171",
+    warning: "#fbbf24",
+    success: "#34d399",
+    accent: "#ff6b6b"
+  } : {
+    primary: "#0d7c5f",
+    secondary: "#6930c3",
+    background: "#f8f6f1",
+    surface: "#ffffff",
+    text: "#1a1815",
+    textMuted: "#6b6560",
+    border: "#ddd8cc",
+    error: "#dc2626",
+    warning: "#d97706",
+    success: "#059669",
+    accent: "#e05a00"
+  };
+}
+function Ce({ points: r, primary: e }) {
+  if (r.length < 2)
+    return /* @__PURE__ */ a("div", { style: { height: 48, display: "flex", alignItems: "center", justifyContent: "center", color: "#888", fontSize: 12 }, children: "Waiting for data..." });
+  const n = 280, i = 48, t = Math.max(...r.map((p) => p.energy)), l = Math.min(...r.map((p) => p.energy)), s = t - l || 1, d = r[r.length - 1].iteration || 1, o = r.map((p) => {
+    const f = p.iteration / d * n, m = i - (p.energy - l) / s * (i - 4) - 2;
+    return `${f.toFixed(1)},${m.toFixed(1)}`;
+  }).join(" ");
+  return /* @__PURE__ */ c("svg", { width: n, height: i, style: { display: "block" }, children: [
+    /* @__PURE__ */ a(
+      "polyline",
+      {
+        points: o,
+        fill: "none",
+        stroke: e,
+        strokeWidth: 1.5,
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        opacity: 0.9
+      }
+    ),
+    /* @__PURE__ */ c("text", { x: 2, y: 10, fontSize: 9, fill: "#888", children: [
+      "E=",
+      t.toFixed(1)
+    ] }),
+    /* @__PURE__ */ c("text", { x: 2, y: i - 2, fontSize: 9, fill: "#888", children: [
+      "E=",
+      l.toFixed(1)
+    ] })
+  ] });
+}
+function Me({ label: r, value: e, onChange: n, text: i, border: t }) {
+  return /* @__PURE__ */ c("div", { style: { display: "flex", alignItems: "center", gap: 8, marginBottom: 6 }, children: [
+    /* @__PURE__ */ a(
+      "input",
+      {
+        type: "color",
+        value: e,
+        onChange: (l) => n(l.target.value),
+        style: {
+          width: 32,
+          height: 32,
+          border: `1px solid ${t}`,
+          borderRadius: 6,
+          padding: 2,
+          cursor: "pointer",
+          background: "transparent"
+        }
+      }
+    ),
+    /* @__PURE__ */ a(
+      "div",
+      {
+        style: {
+          width: 60,
+          height: 28,
+          borderRadius: 6,
+          background: e,
+          border: `1px solid ${t}`
+        }
+      }
+    ),
+    /* @__PURE__ */ a("span", { style: { flex: 1, fontSize: 13, color: i, fontFamily: "monospace" }, children: r }),
+    /* @__PURE__ */ a("code", { style: { fontSize: 12, color: i, opacity: 0.7, fontFamily: "monospace" }, children: e })
+  ] });
+}
+function ze({ label: r, ratio: e }) {
+  const n = e >= 4.5, i = e >= 4.5, t = e >= 7;
+  return /* @__PURE__ */ c("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 4 }, children: [
+    /* @__PURE__ */ a("span", { style: { fontSize: 11, opacity: 0.8, minWidth: 140 }, children: r }),
+    /* @__PURE__ */ c("span", { style: { fontSize: 12, fontWeight: 600 }, children: [
+      e.toFixed(2),
+      ":1"
+    ] }),
+    /* @__PURE__ */ a("span", { style: { fontSize: 11, color: i ? "#22c55e" : "#ef4444" }, children: i ? "✓ AA" : "✗ AA" }),
+    /* @__PURE__ */ a("span", { style: { fontSize: 11, color: t ? "#22c55e" : "#888" }, children: t ? "✓ AAA" : "— AAA" }),
+    /* @__PURE__ */ a("span", { style: { fontSize: 13 }, children: n ? "✅" : "❌" })
+  ] });
+}
+function Ne({
+  onThemeChange: r,
+  initialHue: e = 210,
+  initialMode: n = "dark"
+}) {
+  const i = K(), [t, l] = A(n), [s, d] = A(e), [o, p] = A(() => oe(n === "dark")), [f, m] = A(!1), [g, b] = A([]), [h, v] = A(!1), C = X(null), k = t === "dark", P = R(
+    (u, x) => {
+      p((M) => {
+        const S = { ...M, [u]: x };
+        return r == null || r(S), S;
+      });
+    },
+    [r]
+  ), F = R(() => {
+    if (f) return;
+    m(!0), b([]);
+    let u = 0;
+    const x = 600, M = 60, S = [], z = () => {
+      u += M, Y.optimizeTheme(s, k, u);
+      const N = u / x, O = 50 * (1 - N) + 2, Q = (Math.random() - 0.5) * 8 * (1 - N * 0.8);
+      if (S.push({ iteration: u, energy: Math.max(0, O + Q) }), b([...S]), u < x)
+        C.current = window.setTimeout(z, 40);
+      else {
+        const T = Y.optimizeTheme(s, k, 1e3);
+        p(T), r == null || r(T), m(!1);
+      }
+    };
+    C.current = window.setTimeout(z, 16);
+  }, [s, k, f, r]), w = R(() => {
+    const u = t === "dark" ? "light" : "dark";
+    l(u);
+    const x = oe(u === "dark");
+    p(x), r == null || r(x);
+  }, [t, r]), $ = R(() => {
+    const u = `export const myTheme = {
+${Object.entries(o).map(([x, M]) => `  ${x}: '${M}',`).join(`
+`)}
+};`;
+    typeof navigator < "u" && navigator.clipboard && navigator.clipboard.writeText(u).then(() => {
+      v(!0), setTimeout(() => v(!1), 2e3);
+    });
+  }, [o]), q = [
+    { label: "Text on Background", fg: o.text, bg: o.background },
+    { label: "Text on Surface", fg: o.text, bg: o.surface },
+    { label: "Primary on Background", fg: o.primary, bg: o.background },
+    { label: "TextMuted on Background", fg: o.textMuted, bg: o.background }
+  ], L = "linear-gradient(to right," + [
+    "hsl(0,80%,55%)",
+    "hsl(30,80%,55%)",
+    "hsl(60,80%,55%)",
+    "hsl(90,80%,55%)",
+    "hsl(120,80%,55%)",
+    "hsl(150,80%,55%)",
+    "hsl(180,80%,55%)",
+    "hsl(210,80%,55%)",
+    "hsl(240,80%,55%)",
+    "hsl(270,80%,55%)",
+    "hsl(300,80%,55%)",
+    "hsl(330,80%,55%)",
+    "hsl(360,80%,55%)"
+  ].join(",") + ")", D = {
+    fontFamily: "system-ui, -apple-system, sans-serif",
+    background: o.background,
+    color: o.text,
+    border: `1px solid ${o.border}`,
+    borderRadius: 12,
+    padding: 20,
+    maxWidth: 900,
+    display: "grid",
+    gridTemplateColumns: "1fr 1fr",
+    gap: 20
+  }, E = {
+    background: o.surface,
+    border: `1px solid ${o.border}`,
+    borderRadius: 8,
+    padding: 16
+  }, I = {
+    fontSize: 13,
+    fontWeight: 700,
+    textTransform: "uppercase",
+    letterSpacing: "0.08em",
+    color: o.primary,
+    marginBottom: 12,
+    marginTop: 0
+  }, j = {
+    padding: "8px 16px",
+    borderRadius: 8,
+    border: "none",
+    cursor: "pointer",
+    fontWeight: 600,
+    fontSize: 13,
+    transition: "opacity 0.15s"
+  }, y = le;
+  return /* @__PURE__ */ c("div", { style: D, children: [
+    /* @__PURE__ */ c("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: [
+      /* @__PURE__ */ c("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gridColumn: "1/-1" }, children: [
+        /* @__PURE__ */ c("div", { children: [
+          /* @__PURE__ */ a("h2", { style: { margin: 0, fontSize: 18, fontWeight: 700 }, children: "Theme Builder" }),
+          /* @__PURE__ */ a("p", { style: { margin: "2px 0 0", fontSize: 12, color: o.textMuted }, children: "Quantum-powered color optimization" })
+        ] }),
+        /* @__PURE__ */ a(
+          "button",
+          {
+            onClick: w,
+            style: {
+              ...j,
+              background: o.surface,
+              color: o.text,
+              border: `1px solid ${o.border}`
+            },
+            children: k ? "☀ Light" : "🌙 Dark"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ c("div", { style: E, children: [
+        /* @__PURE__ */ a("p", { style: I, children: "Base Hue" }),
+        /* @__PURE__ */ c("div", { style: { display: "flex", alignItems: "center", gap: 10 }, children: [
+          /* @__PURE__ */ a(
+            "div",
+            {
+              style: {
+                width: 24,
+                height: 24,
+                borderRadius: "50%",
+                background: `hsl(${s},70%,55%)`,
+                border: `2px solid ${o.border}`,
+                flexShrink: 0
+              }
+            }
+          ),
+          /* @__PURE__ */ a(
+            "input",
+            {
+              type: "range",
+              min: 0,
+              max: 360,
+              value: s,
+              onChange: (u) => d(Number(u.target.value)),
+              style: {
+                flex: 1,
+                height: 16,
+                borderRadius: 8,
+                background: L,
+                outline: "none",
+                border: "none",
+                cursor: "pointer",
+                appearance: "none",
+                WebkitAppearance: "none"
+              }
+            }
+          ),
+          /* @__PURE__ */ c("span", { style: { fontSize: 13, fontFamily: "monospace", minWidth: 32 }, children: [
+            s,
+            "°"
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ c("div", { style: E, children: [
+        /* @__PURE__ */ c("div", { style: { display: "flex", alignItems: "center", gap: 8, marginBottom: 10 }, children: [
+          /* @__PURE__ */ a(
+            "button",
+            {
+              onClick: F,
+              disabled: f,
+              style: {
+                ...j,
+                background: f ? o.border : o.primary,
+                color: k ? "#000" : "#fff",
+                opacity: f ? 0.7 : 1,
+                flex: 1
+              },
+              children: f ? "⟳ Optimizing..." : "⚛ Generate with Quantum Annealing"
+            }
+          ),
+          /* @__PURE__ */ a(
+            "div",
+            {
+              style: {
+                padding: "3px 8px",
+                background: o.primary + "22",
+                border: `1px solid ${o.primary}44`,
+                borderRadius: 20,
+                fontSize: 10,
+                color: o.primary,
+                fontWeight: 700,
+                whiteSpace: "nowrap"
+              },
+              children: "⚛ Quantum Annealing"
+            }
+          )
+        ] }),
+        (f || g.length > 0) && /* @__PURE__ */ c("div", { children: [
+          /* @__PURE__ */ a("p", { style: { fontSize: 11, color: o.textMuted, margin: "0 0 4px" }, children: "Energy landscape (lower = better palette)" }),
+          /* @__PURE__ */ a(Ce, { points: g, primary: o.primary })
+        ] })
+      ] }),
+      /* @__PURE__ */ c("div", { style: E, children: [
+        /* @__PURE__ */ a("p", { style: I, children: "Color Tokens" }),
+        Object.keys(o).map((u) => /* @__PURE__ */ a(
+          Me,
+          {
+            label: u,
+            value: o[u],
+            onChange: (x) => P(u, x),
+            text: o.text,
+            border: o.border
+          },
+          u
+        ))
+      ] }),
+      /* @__PURE__ */ a(
+        "button",
+        {
+          onClick: $,
+          style: {
+            ...j,
+            background: o.accent,
+            color: "#fff",
+            width: "100%"
+          },
+          children: h ? "✓ Copied to Clipboard!" : "⬇ Export Theme"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ c("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: [
+      /* @__PURE__ */ c("div", { style: E, children: [
+        /* @__PURE__ */ a("p", { style: I, children: "Live Preview" }),
+        /* @__PURE__ */ c("div", { style: { marginBottom: 12 }, children: [
+          /* @__PURE__ */ a("p", { style: { fontSize: 11, color: o.textMuted, margin: "0 0 6px" }, children: "Buttons" }),
+          /* @__PURE__ */ c("div", { style: { display: "flex", gap: 8, flexWrap: "wrap" }, children: [
+            /* @__PURE__ */ a(
+              "button",
+              {
+                style: {
+                  padding: "8px 16px",
+                  borderRadius: 8,
+                  border: "none",
+                  background: o.primary,
+                  color: k ? "#000" : "#fff",
+                  fontWeight: 600,
+                  fontSize: 13,
+                  cursor: "pointer"
+                },
+                children: "Primary"
+              }
+            ),
+            /* @__PURE__ */ a(
+              "button",
+              {
+                style: {
+                  padding: "8px 16px",
+                  borderRadius: 8,
+                  border: "none",
+                  background: o.secondary,
+                  color: "#fff",
+                  fontWeight: 600,
+                  fontSize: 13,
+                  cursor: "pointer"
+                },
+                children: "Secondary"
+              }
+            ),
+            /* @__PURE__ */ a(
+              "button",
+              {
+                style: {
+                  padding: "8px 16px",
+                  borderRadius: 8,
+                  border: `1px solid ${o.border}`,
+                  background: "transparent",
+                  color: o.text,
+                  fontWeight: 600,
+                  fontSize: 13,
+                  cursor: "pointer"
+                },
+                children: "Outline"
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ c("div", { style: { marginBottom: 12 }, children: [
+          /* @__PURE__ */ a("p", { style: { fontSize: 11, color: o.textMuted, margin: "0 0 6px" }, children: "Card" }),
+          /* @__PURE__ */ c(
+            "div",
+            {
+              style: {
+                background: o.surface,
+                border: `1px solid ${o.border}`,
+                borderRadius: 8,
+                padding: 12
+              },
+              children: [
+                /* @__PURE__ */ a("div", { style: { fontSize: 14, fontWeight: 700, marginBottom: 4 }, children: "Card Title" }),
+                /* @__PURE__ */ a("div", { style: { fontSize: 12, color: o.textMuted, lineHeight: 1.4 }, children: "Sample card with surface background and muted text content." }),
+                /* @__PURE__ */ c("div", { style: { marginTop: 8, display: "flex", gap: 6 }, children: [
+                  /* @__PURE__ */ a(
+                    "span",
+                    {
+                      style: {
+                        padding: "2px 8px",
+                        borderRadius: 20,
+                        background: o.primary + "33",
+                        color: o.primary,
+                        fontSize: 11,
+                        fontWeight: 600
+                      },
+                      children: "Tag"
+                    }
+                  ),
+                  /* @__PURE__ */ a(
+                    "span",
+                    {
+                      style: {
+                        padding: "2px 8px",
+                        borderRadius: 20,
+                        background: o.accent + "33",
+                        color: o.accent,
+                        fontSize: 11,
+                        fontWeight: 600
+                      },
+                      children: "Accent"
+                    }
+                  )
+                ] })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ c("div", { style: { marginBottom: 12 }, children: [
+          /* @__PURE__ */ a("p", { style: { fontSize: 11, color: o.textMuted, margin: "0 0 6px" }, children: "Input" }),
+          /* @__PURE__ */ a(
+            "input",
+            {
+              type: "text",
+              placeholder: "Type something...",
+              readOnly: !0,
+              style: {
+                width: "100%",
+                padding: "8px 12px",
+                borderRadius: 8,
+                border: `1px solid ${o.border}`,
+                background: o.background,
+                color: o.text,
+                fontSize: 13,
+                outline: "none",
+                boxSizing: "border-box"
+              }
+            }
+          )
+        ] }),
+        /* @__PURE__ */ c("div", { style: { marginBottom: 12 }, children: [
+          /* @__PURE__ */ a("p", { style: { fontSize: 11, color: o.textMuted, margin: "0 0 6px" }, children: "Progress" }),
+          /* @__PURE__ */ a(
+            "div",
+            {
+              style: {
+                height: 8,
+                borderRadius: 4,
+                background: o.border,
+                overflow: "hidden"
+              },
+              children: /* @__PURE__ */ a(
+                "div",
+                {
+                  style: {
+                    height: "100%",
+                    width: "68%",
+                    background: `linear-gradient(to right, ${o.primary}, ${o.accent})`,
+                    borderRadius: 4,
+                    transition: "width 0.4s ease"
+                  }
+                }
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ c("div", { children: [
+          /* @__PURE__ */ a("p", { style: { fontSize: 11, color: o.textMuted, margin: "0 0 6px" }, children: "Status Badges" }),
+          /* @__PURE__ */ a("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: [
+            { label: "Error", color: o.error },
+            { label: "Warning", color: o.warning },
+            { label: "Success", color: o.success }
+          ].map(({ label: u, color: x }) => /* @__PURE__ */ a(
+            "span",
+            {
+              style: {
+                padding: "3px 10px",
+                borderRadius: 4,
+                background: x + "22",
+                color: x,
+                border: `1px solid ${x}44`,
+                fontSize: 11,
+                fontWeight: 700
+              },
+              children: u
+            },
+            u
+          )) })
+        ] })
+      ] }),
+      /* @__PURE__ */ c("div", { style: E, children: [
+        /* @__PURE__ */ a("p", { style: I, children: "WCAG Contrast Check" }),
+        q.map((u) => /* @__PURE__ */ a(
+          ze,
+          {
+            label: u.label,
+            ratio: Y.contrast(u.fg, u.bg)
+          },
+          u.label
+        )),
+        /* @__PURE__ */ a("p", { style: { fontSize: 10, color: o.textMuted, marginTop: 8, marginBottom: 0 }, children: "AA requires 4.5:1 (normal text). AAA requires 7:1." })
+      ] }),
+      /* @__PURE__ */ c("div", { style: E, children: [
+        /* @__PURE__ */ a("p", { style: I, children: "Color Palette" }),
+        /* @__PURE__ */ a("div", { style: { display: "flex", gap: 4, flexWrap: "wrap" }, children: Object.entries(o).map(([u, x]) => /* @__PURE__ */ a(
+          "div",
+          {
+            title: `${u}: ${x}`,
+            style: {
+              width: 36,
+              height: 36,
+              borderRadius: 6,
+              background: x,
+              border: `2px solid ${o.border}`,
+              cursor: "default",
+              flexShrink: 0
+            }
+          },
+          u
+        )) })
+      ] })
+    ] }),
+    typeof y == "function" && null,
+    typeof i.bg == "string" && null
+  ] });
+}
+const ie = [
+  {
+    label: "Hello World",
+    code: `<div style={{ padding: 24, fontFamily: 'sans-serif', color: '#e8e8f4' }}>
+  <h2 style={{ margin: 0 }}>👋 Hello, TkxPlayground!</h2>
+  <p style={{ marginTop: 8, opacity: 0.7 }}>Edit the code on the left to see live updates.</p>
+</div>`
+  },
+  {
+    label: "Button Styles",
+    code: `<div style={{ display: 'flex', gap: 12, flexWrap: 'wrap', padding: 24 }}>
+  {['primary', 'success', 'danger', 'warning', 'info'].map(color => (
+    <button
+      key={color}
+      style={{
+        padding: '8px 18px',
+        borderRadius: 8,
+        border: 'none',
+        background: color === 'primary' ? '#00f5d4' : color === 'success' ? '#06d6a0' : color === 'danger' ? '#f72585' : color === 'warning' ? '#ffbe0b' : '#3a86ff',
+        color: '#0a0a0f',
+        fontWeight: 700,
+        cursor: 'pointer',
+        textTransform: 'capitalize',
+      }}
+    >
+      {color}
+    </button>
+  ))}
+</div>`
+  },
+  {
+    label: "Card Grid",
+    code: `<div style={{ display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: 16, padding: 24 }}>
+  {['Alpha', 'Beta', 'Gamma', 'Delta', 'Epsilon', 'Zeta'].map(name => (
+    <div key={name} style={{
+      background: '#1a1a2e',
+      borderRadius: 10,
+      border: '1px solid #2a2a3e',
+      padding: '16px',
+    }}>
+      <div style={{ fontWeight: 700, color: '#00f5d4', marginBottom: 4 }}>{name}</div>
+      <div style={{ fontSize: 12, color: '#8888aa' }}>Quantum module {name.toLowerCase()}</div>
+    </div>
+  ))}
+</div>`
+  },
+  {
+    label: "Animated Counter",
+    code: `(() => {
+  const [count, setCount] = React.useState(0);
+  return (
+    <div style={{ padding: 32, textAlign: 'center', fontFamily: 'sans-serif' }}>
+      <div style={{ fontSize: 64, fontWeight: 900, color: '#00f5d4', marginBottom: 16 }}>
+        {count}
+      </div>
+      <div style={{ display: 'flex', gap: 12, justifyContent: 'center' }}>
+        <button onClick={() => setCount(c => c - 1)} style={{ padding: '8px 20px', borderRadius: 8, border: '1px solid #2a2a3e', background: '#1a1a2e', color: '#e8e8f4', fontSize: 20, cursor: 'pointer' }}>−</button>
+        <button onClick={() => setCount(0)} style={{ padding: '8px 20px', borderRadius: 8, border: '1px solid #2a2a3e', background: '#1a1a2e', color: '#8888aa', cursor: 'pointer' }}>Reset</button>
+        <button onClick={() => setCount(c => c + 1)} style={{ padding: '8px 20px', borderRadius: 8, border: '1px solid #2a2a3e', background: '#1a1a2e', color: '#e8e8f4', fontSize: 20, cursor: 'pointer' }}>+</button>
+      </div>
+    </div>
+  );
+})()`
+  },
+  {
+    label: "Data Table",
+    code: `(() => {
+  const rows = [
+    { id: 1, name: 'Hydrogen', symbol: 'H', mass: 1.008 },
+    { id: 2, name: 'Helium',   symbol: 'He', mass: 4.003 },
+    { id: 3, name: 'Lithium',  symbol: 'Li', mass: 6.941 },
+    { id: 4, name: 'Carbon',   symbol: 'C',  mass: 12.011 },
+    { id: 5, name: 'Nitrogen', symbol: 'N',  mass: 14.007 },
+  ];
+  const cell = { padding: '8px 14px', borderBottom: '1px solid #2a2a3e', color: '#e8e8f4', fontSize: 13 };
+  const hcell = { ...cell, color: '#8888aa', fontWeight: 600, fontSize: 11, textTransform: 'uppercase', letterSpacing: '0.06em' };
+  return (
+    <div style={{ padding: 16 }}>
+      <table style={{ width: '100%', borderCollapse: 'collapse', fontFamily: 'sans-serif' }}>
+        <thead>
+          <tr>{['ID','Element','Symbol','Atomic Mass'].map(h => <th key={h} style={hcell}>{h}</th>)}</tr>
+        </thead>
+        <tbody>
+          {rows.map(r => (
+            <tr key={r.id} style={{ transition: 'background 0.15s' }}>
+              <td style={cell}>{r.id}</td>
+              <td style={cell}>{r.name}</td>
+              <td style={{ ...cell, color: '#00f5d4', fontWeight: 700 }}>{r.symbol}</td>
+              <td style={cell}>{r.mass}</td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  );
+})()`
+  }
+];
+class Te extends Z.Component {
+  constructor(e) {
+    super(e), this.state = { hasError: !1 };
+  }
+  static getDerivedStateFromError() {
+    return { hasError: !0 };
+  }
+  componentDidCatch(e) {
+    this.props.onError(e.message);
+  }
+  componentDidUpdate(e) {
+    e.children !== this.props.children && this.state.hasError && this.setState({ hasError: !1 });
+  }
+  render() {
+    return this.state.hasError ? null : this.props.children;
+  }
+}
+function Ae() {
+  return typeof window > "u" ? null : window.Babel ?? null;
+}
+function Be(r, e) {
+  const n = performance.now();
+  try {
+    const i = r.trim();
+    let s = `
+      function PlaygroundRoot() {
+        ${i.startsWith("<") || i.startsWith("(") ? `return (${i});` : i}
+      }
+      return PlaygroundRoot;
+    `;
+    const d = Ae();
+    d && (s = d.transform(s, {
+      presets: ["react"],
+      filename: "playground.jsx"
+    }).code ?? s);
+    const p = new Function(
+      "React",
+      "imports",
+      `
+      "use strict";
+      const { ${Object.keys(e).join(", ")} } = imports;
+      ${s}
+    `
+    )(Z, e), f = Z.createElement(p), m = parseFloat((performance.now() - n).toFixed(2));
+    return { element: f, error: null, renderMs: m };
+  } catch (i) {
+    const t = parseFloat((performance.now() - n).toFixed(2));
+    return { element: null, error: i instanceof Error ? i.message : String(i), renderMs: t };
+  }
+}
+function Re({ code: r, lineHeight: e }) {
+  const n = r.split(`
+`);
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      "aria-hidden": "true",
+      style: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width: "36px",
+        padding: "12px 0",
+        textAlign: "right",
+        paddingRight: "8px",
+        userSelect: "none",
+        pointerEvents: "none",
+        fontSize: "12px",
+        lineHeight: `${e}px`,
+        color: "#555577",
+        fontFamily: '"Fira Code", "Cascadia Code", "Consolas", monospace',
+        boxSizing: "border-box"
+      },
+      children: n.map((i, t) => /* @__PURE__ */ a("div", { children: t + 1 }, t))
+    }
+  );
+}
+const ae = [
+  "TkxButton",
+  "TkxInput",
+  "TkxCard",
+  "TkxModal",
+  "TkxTable",
+  "TkxSelect",
+  "TkxCheckbox",
+  "TkxRadio",
+  "TkxSwitch",
+  "TkxSlider",
+  "TkxBadge",
+  "TkxAlert",
+  "TkxToast",
+  "TkxTooltip",
+  "TkxPopover",
+  "TkxTabs",
+  "TkxAccordion",
+  "TkxDrawer",
+  "TkxDropdown",
+  "TkxMenu",
+  "TkxForm",
+  "TkxDataGrid",
+  "TkxChart",
+  "TkxSpinner",
+  "TkxSkeleton",
+  "TkxAvatar",
+  "TkxTag",
+  "TkxDivider",
+  "TkxProgress",
+  "TkxStatistic",
+  "TkxQuantumForm",
+  "TkxPlayground"
+], $e = new ee();
+function se(r) {
+  const e = r.match(/([A-Z][a-zA-Z0-9]*)$/);
+  return e ? e[1] : "";
+}
+function Ee(r, e = 4) {
+  if (!r || r.length < 2) return [];
+  const n = r.toLowerCase();
+  return $e.amplify(
+    ae,
+    (t) => {
+      const l = t.toLowerCase();
+      if (l.startsWith(n)) return 1;
+      if (l.includes(n)) return 0.7;
+      let s = 0;
+      for (let d = 0; d < n.length - 1; d++)
+        l.includes(n.slice(d, d + 2)) && (s += 0.15);
+      return Math.min(s, 0.5);
+    },
+    0.1
+  ).slice(0, e).map((t) => ({
+    name: ae[t.index] ?? "",
+    amplitude: parseFloat(t.combined.toFixed(3))
+  })).filter((t) => t.name !== "");
+}
+function We({
+  defaultCode: r,
+  examples: e,
+  height: n = 480,
+  imports: i = {}
+}) {
+  const t = K(), l = [...ie, ...e ?? []], s = r ?? ie[0].code, [d, o] = A(s), [p, f] = A({
+    element: null,
+    error: null,
+    renderMs: 0
+  }), [m, g] = A(null), [b, h] = A([]), [v, C] = A(!1), [k, P] = A(0), F = X(null), w = 18, $ = X(null), q = R(
+    (T) => {
+      g(null);
+      const B = Be(T, i);
+      f(B);
+    },
+    [i]
+  );
+  V(() => ($.current && clearTimeout($.current), $.current = setTimeout(() => q(d), 300), () => {
+    $.current && clearTimeout($.current);
+  }), [d, q]), V(() => {
+    q(s);
+  }, []);
+  const L = R(
+    (T) => {
+      const B = T.target.value;
+      o(B);
+      const H = se(B);
+      H.length >= 2 ? h(Ee(H, 4)) : h([]);
+    },
+    []
+  ), D = R(
+    (T) => {
+      const B = l[T];
+      B && (P(T), o(B.code), h([]));
+    },
+    [l]
+  ), E = R(async () => {
+    try {
+      await navigator.clipboard.writeText(d), C(!0), setTimeout(() => C(!1), 1500);
+    } catch {
+    }
+  }, [d]), I = R(() => {
+    o(s), P(0), h([]);
+  }, [s]), j = R(
+    (T) => {
+      const B = se(d);
+      B && o((H) => H.slice(0, H.lastIndexOf(B)) + T), h([]);
+    },
+    [d]
+  ), y = p.error !== null || m !== null, u = p.error ?? m ?? "", x = t.bg, M = t.surfaceAlt, S = t.border, z = t.surface, N = {
+    width: "50%",
+    display: "flex",
+    flexDirection: "column",
+    borderRight: `1px solid ${S}`,
+    position: "relative"
+  }, O = {
+    display: "flex",
+    alignItems: "center",
+    gap: "6px",
+    padding: "6px 10px",
+    borderBottom: `1px solid ${S}`,
+    backgroundColor: t.surface,
+    flexWrap: "wrap"
+  }, Q = {
+    padding: "3px 10px",
+    borderRadius: "6px",
+    border: `1px solid ${S}`,
+    backgroundColor: "transparent",
+    color: t.textMuted,
+    fontSize: "11px",
+    fontWeight: 600,
+    cursor: "pointer",
+    fontFamily: "inherit",
+    transition: "color 0.15s, border-color 0.15s"
+  };
+  return /* @__PURE__ */ c(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        border: `1px solid ${S}`,
+        borderRadius: "12px",
+        overflow: "hidden",
+        backgroundColor: x,
+        fontFamily: "inherit",
+        boxSizing: "border-box",
+        position: "relative"
+      },
+      children: [
+        /* @__PURE__ */ c(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+              padding: "8px 14px",
+              borderBottom: `1px solid ${S}`,
+              backgroundColor: t.surface
+            },
+            children: [
+              /* @__PURE__ */ a("span", { style: { fontSize: "12px", fontWeight: 700, color: t.primary, letterSpacing: "0.05em" }, children: "⚛ TkxPlayground" }),
+              /* @__PURE__ */ a("span", { style: { fontSize: "10px", color: t.textMuted }, children: "Live JSX Preview" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ a(
+          "div",
+          {
+            style: {
+              display: "flex",
+              gap: "4px",
+              padding: "6px 10px",
+              borderBottom: `1px solid ${S}`,
+              backgroundColor: t.surface,
+              overflowX: "auto"
+            },
+            children: l.map((T, B) => /* @__PURE__ */ a(
+              "button",
+              {
+                onClick: () => D(B),
+                style: {
+                  padding: "3px 10px",
+                  borderRadius: "6px",
+                  border: `1px solid ${B === k ? t.primary : S}`,
+                  backgroundColor: B === k ? `${t.primary}20` : "transparent",
+                  color: B === k ? t.primary : t.textMuted,
+                  fontSize: "11px",
+                  fontWeight: B === k ? 700 : 400,
+                  cursor: "pointer",
+                  whiteSpace: "nowrap",
+                  fontFamily: "inherit",
+                  transition: "all 0.15s"
+                },
+                children: T.label
+              },
+              B
+            ))
+          }
+        ),
+        /* @__PURE__ */ c("div", { style: { display: "flex", height: `${n}px` }, children: [
+          /* @__PURE__ */ c("div", { style: N, children: [
+            /* @__PURE__ */ c("div", { style: O, children: [
+              /* @__PURE__ */ a("span", { style: { fontSize: "11px", color: t.textMuted, marginRight: "auto" }, children: "editor.tsx" }),
+              /* @__PURE__ */ a("button", { onClick: E, style: Q, title: "Copy code", children: v ? "✓ Copied" : "⎘ Copy" }),
+              /* @__PURE__ */ a("button", { onClick: I, style: Q, title: "Reset to default", children: "↺ Reset" })
+            ] }),
+            /* @__PURE__ */ c("div", { style: { position: "relative", flex: 1, overflow: "hidden" }, children: [
+              /* @__PURE__ */ a(Re, { code: d, lineHeight: w }),
+              /* @__PURE__ */ a(
+                "textarea",
+                {
+                  ref: F,
+                  value: d,
+                  onChange: L,
+                  spellCheck: !1,
+                  autoCorrect: "off",
+                  autoCapitalize: "off",
+                  style: {
+                    position: "absolute",
+                    top: 0,
+                    left: 0,
+                    width: "100%",
+                    height: "100%",
+                    padding: "12px 12px 12px 44px",
+                    margin: 0,
+                    border: "none",
+                    outline: "none",
+                    resize: "none",
+                    backgroundColor: x,
+                    color: t.text,
+                    fontSize: "12px",
+                    lineHeight: `${w}px`,
+                    fontFamily: '"Fira Code", "Cascadia Code", "Consolas", "Courier New", monospace',
+                    boxSizing: "border-box",
+                    overflowY: "auto",
+                    tabSize: 2
+                  }
+                }
+              )
+            ] }),
+            b.length > 0 && /* @__PURE__ */ c(
+              "div",
+              {
+                style: {
+                  position: "absolute",
+                  bottom: "40px",
+                  left: "44px",
+                  zIndex: 10,
+                  backgroundColor: t.surface,
+                  border: `1px solid ${t.primary}44`,
+                  borderRadius: "8px",
+                  overflow: "hidden",
+                  boxShadow: "0 4px 16px rgba(0,0,0,0.3)",
+                  minWidth: "180px"
+                },
+                children: [
+                  /* @__PURE__ */ a(
+                    "div",
+                    {
+                      style: {
+                        padding: "4px 10px 4px",
+                        fontSize: "10px",
+                        color: t.primary,
+                        fontWeight: 700,
+                        borderBottom: `1px solid ${S}`,
+                        letterSpacing: "0.05em"
+                      },
+                      children: "⚛ Quantum Suggestions"
+                    }
+                  ),
+                  b.map((T) => /* @__PURE__ */ c(
+                    "button",
+                    {
+                      onClick: () => j(T.name),
+                      style: {
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "space-between",
+                        width: "100%",
+                        padding: "6px 10px",
+                        border: "none",
+                        backgroundColor: "transparent",
+                        color: t.text,
+                        fontSize: "12px",
+                        fontFamily: '"Fira Code", monospace',
+                        cursor: "pointer",
+                        textAlign: "left",
+                        gap: "12px"
+                      },
+                      children: [
+                        /* @__PURE__ */ a("span", { children: T.name }),
+                        /* @__PURE__ */ c(
+                          "span",
+                          {
+                            style: {
+                              fontSize: "10px",
+                              color: t.textMuted,
+                              flexShrink: 0
+                            },
+                            children: [
+                              Math.round(T.amplitude * 100),
+                              "%"
+                            ]
+                          }
+                        )
+                      ]
+                    },
+                    T.name
+                  ))
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ c(
+            "div",
+            {
+              style: {
+                width: "50%",
+                display: "flex",
+                flexDirection: "column"
+              },
+              children: [
+                /* @__PURE__ */ a(
+                  "div",
+                  {
+                    style: {
+                      padding: "6px 10px",
+                      borderBottom: `1px solid ${S}`,
+                      backgroundColor: t.surface,
+                      fontSize: "11px",
+                      color: t.textMuted,
+                      fontWeight: 600
+                    },
+                    children: "Preview"
+                  }
+                ),
+                /* @__PURE__ */ a(
+                  "div",
+                  {
+                    style: {
+                      flex: 1,
+                      overflow: "auto",
+                      backgroundColor: M,
+                      position: "relative"
+                    },
+                    children: y ? /* @__PURE__ */ c(
+                      "div",
+                      {
+                        style: {
+                          padding: "16px",
+                          color: t.danger,
+                          fontFamily: '"Fira Code", monospace',
+                          fontSize: "12px",
+                          lineHeight: 1.6,
+                          whiteSpace: "pre-wrap",
+                          wordBreak: "break-word"
+                        },
+                        children: [
+                          /* @__PURE__ */ c(
+                            "div",
+                            {
+                              style: {
+                                marginBottom: "8px",
+                                fontWeight: 700,
+                                display: "flex",
+                                alignItems: "center",
+                                gap: "6px"
+                              },
+                              children: [
+                                /* @__PURE__ */ a("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ a("path", { d: "M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" }) }),
+                                "Runtime Error"
+                              ]
+                            }
+                          ),
+                          u
+                        ]
+                      }
+                    ) : /* @__PURE__ */ a(Te, { onError: g, children: /* @__PURE__ */ a("div", { style: { minHeight: "100%" }, children: p.element }) })
+                  }
+                )
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ c(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: "16px",
+              padding: "4px 12px",
+              backgroundColor: z,
+              borderTop: `1px solid ${S}`,
+              fontSize: "11px",
+              color: t.textMuted
+            },
+            children: [
+              /* @__PURE__ */ c(
+                "span",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "4px",
+                    color: y ? t.danger : t.success,
+                    fontWeight: 600
+                  },
+                  children: [
+                    /* @__PURE__ */ a(
+                      "span",
+                      {
+                        style: {
+                          width: "6px",
+                          height: "6px",
+                          borderRadius: "50%",
+                          backgroundColor: y ? t.danger : t.success,
+                          display: "inline-block"
+                        }
+                      }
+                    ),
+                    y ? "Error" : "OK"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ c("span", { children: [
+                "⏱ ",
+                p.renderMs,
+                " ms"
+              ] }),
+              /* @__PURE__ */ c("span", { children: [
+                d.split(`
+`).length,
+                " lines"
+              ] }),
+              /* @__PURE__ */ c("span", { children: [
+                d.length,
+                " chars"
+              ] }),
+              b.length > 0 && /* @__PURE__ */ c("span", { style: { marginLeft: "auto", color: t.primary, fontWeight: 600 }, children: [
+                "⚛ ",
+                b.length,
+                " suggestion",
+                b.length > 1 ? "s" : ""
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+We.displayName = "TkxPlayground";
+export {
+  ee as AmplitudeAmplifier,
+  Y as QuantumAI,
+  de as QuantumAnnealer,
+  he as QuantumBoltzmannMachine,
+  ue as QuantumRegister,
+  _ as Qubit,
+  We as TkxPlayground,
+  Se as TkxQuantumForm,
+  Ne as TkxThemeBuilder,
+  G as hslToHex,
+  ce as inferFieldIntelligence,
+  ye as optimizeThemeColors
+};