tekivex-ui 2.5.11 → 2.5.12

package/dist/quantum.js

@@ -1,2312 +1,2506 @@
-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-iUUHRxqJ.js";
-import { t as le } from "./tkx-BtHzWKTl.js";
-import { s as J } from "./security-C-ZPGoyG.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
-  }
+import { f as e } from "./themes-BbJanqiC.js";
+import { a as t, m as n } from "./tkx-DQkvHdE5.js";
+import r, { useCallback as i, useEffect as a, useRef as o, useState as s } from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/engine/quantum-ai.ts
+var d = class e {
+	constructor(e, t) {
+		this.re = e, this.im = t;
+	}
+	add(t) {
+		return new e(this.re + t.re, this.im + t.im);
+	}
+	sub(t) {
+		return new e(this.re - t.re, this.im - t.im);
+	}
+	mul(t) {
+		return new e(this.re * t.re - this.im * t.im, this.re * t.im + this.im * t.re);
+	}
+	scale(t) {
+		return new e(this.re * t, this.im * t);
+	}
+	conjugate() {
+		return new e(this.re, -this.im);
+	}
+	magnitudeSquared() {
+		return this.re * this.re + this.im * this.im;
+	}
+	magnitude() {
+		return Math.sqrt(this.magnitudeSquared());
+	}
+	static fromPolar(t, n) {
+		return new e(t * Math.cos(n), t * Math.sin(n));
+	}
+	static zero() {
+		return new e(0, 0);
+	}
+	static one() {
+		return new e(1, 0);
+	}
+}, f = class e {
+	constructor(e = d.one(), t = d.zero()) {
+		this.alpha = e, this.beta = t, this.normalize();
+	}
+	normalize() {
+		let 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() {
+		let t = 1 / Math.SQRT2;
+		return new e(this.alpha.add(this.beta).scale(t), this.alpha.sub(this.beta).scale(t));
+	}
+	ry(t) {
+		let n = Math.cos(t / 2), r = Math.sin(t / 2);
+		return new e(this.alpha.scale(n).sub(this.beta.scale(r)), this.alpha.scale(r).add(this.beta.scale(n)));
+	}
+	phase(t) {
+		let n = d.fromPolar(1, t);
+		return new e(this.alpha, this.beta.mul(n));
+	}
+	measure() {
+		let e = this.beta.magnitudeSquared();
+		return +(Math.random() < e);
+	}
+	expectation() {
+		return this.beta.magnitudeSquared();
+	}
+	getAlpha() {
+		return this.alpha;
+	}
+	getBeta() {
+		return this.beta;
+	}
+}, p = class {
+	constructor(e) {
+		this.qubits = Array.from({ length: e }, () => new f());
+	}
+	get size() {
+		return this.qubits.length;
+	}
+	getQubit(e) {
+		return this.qubits[e];
+	}
+	superpose() {
+		this.qubits = this.qubits.map((e) => e.hadamard());
+	}
+	cnot(e, t) {
+		let n = this.qubits[e], r = this.qubits[t], i = n.expectation();
+		this.qubits[t] = r.ry(Math.PI * i);
+	}
+	rotate(e, t) {
+		this.qubits[e] = this.qubits[e].ry(t);
+	}
+	measure() {
+		return this.qubits.map((e) => e.measure());
+	}
+	probs() {
+		return this.qubits.map((e) => e.expectation());
+	}
+}, m = class {
+	constructor(e = 1, t = .995, n = .3, r = 1e-6) {
+		this.temperature = e, this.coolingRate = t, this.tunnelingStrength = n, this.minTemp = r;
+	}
+	anneal(e, t, n, r = 1e3) {
+		let i = e, a = t(i), o = i, s = a, c = this.temperature, l = 0, u = 0;
+		for (let e = 0; e < r && c > this.minTemp; e++) {
+			let e = n(i), r = t(e), d = r - a, f = !1;
+			if (d <= 0) f = !0;
+			else {
+				let e = Math.exp(-d / c), t = Math.sqrt(2 * Math.abs(d)), n = Math.abs(d), r = Math.exp(-2 * t * Math.sqrt(n) * this.tunnelingStrength);
+				Math.random() < e + r && (f = !0, Math.random() < r / (e + r + 1e-10) && u++);
+			}
+			f && (i = e, a = r, l++, a < s && (o = i, s = a)), c *= this.coolingRate;
+		}
+		return {
+			state: o,
+			energy: s,
+			iterations: r,
+			accepted: l,
+			tunnels: u
+		};
+	}
+}, h = class {
+	constructor(e, t) {
+		let n = Math.sqrt(2 / (e + t));
+		this.weights = Array.from({ length: e }, () => Array.from({ length: t }, () => (Math.random() * 2 - 1) * n)), this.visibleBias = Array.from({ length: e }, () => 0), this.hiddenBias = Array.from({ length: t }, () => 0);
+	}
+	sigmoid(e) {
+		let t = (Math.random() - .5) * .1;
+		return 1 / (1 + Math.exp(-(e + t)));
+	}
+	sample(e) {
+		return +(Math.random() < e);
+	}
+	energy(e, t) {
+		let n = this.visibleBias.reduce((t, n, r) => t + n * e[r], 0), r = this.hiddenBias.reduce((e, n, r) => e + n * t[r], 0), i = 0;
+		for (let n = 0; n < e.length; n++) for (let r = 0; r < t.length; r++) i += e[n] * this.weights[n][r] * t[r];
+		return -(n + r + i);
+	}
+	hiddenProbs(e) {
+		return this.hiddenBias.map((t, n) => {
+			let r = t + e.reduce((e, t, r) => e + this.weights[r][n] * t, 0);
+			return this.sigmoid(r);
+		});
+	}
+	visibleProbs(e) {
+		return this.visibleBias.map((t, n) => {
+			let r = t + e.reduce((e, t, r) => e + this.weights[n][r] * t, 0);
+			return this.sigmoid(r);
+		});
+	}
+	gibbs(e, t = 1) {
+		let n = [...e], r = [];
+		for (let e = 0; e < t; e++) r = this.hiddenProbs(n).map((e) => this.sample(e)), n = this.visibleProbs(r).map((e) => this.sample(e));
+		return {
+			visible: n,
+			hidden: r
+		};
+	}
+	trainCD1(e, t = .01) {
+		let n = this.visibleBias.length, r = this.hiddenBias.length, i = Array.from({ length: n }, () => Array(r).fill(0)), a = Array(n).fill(0), o = Array(r).fill(0);
+		for (let t of e) {
+			let e = this.hiddenProbs(t), s = e.map((e) => this.sample(e)), c = this.visibleProbs(s).map((e) => this.sample(e)), l = this.hiddenProbs(c);
+			for (let o = 0; o < n; o++) {
+				for (let n = 0; n < r; n++) i[o][n] += t[o] * e[n] - c[o] * l[n];
+				a[o] += t[o] - c[o];
+			}
+			for (let t = 0; t < r; t++) o[t] += e[t] - l[t];
+		}
+		let s = e.length;
+		for (let e = 0; e < n; e++) {
+			for (let n = 0; n < r; n++) this.weights[e][n] += t * i[e][n] / s;
+			this.visibleBias[e] += t * a[e] / s;
+		}
+		for (let e = 0; e < r; e++) this.hiddenBias[e] += t * o[e] / s;
+	}
+	infer(e) {
+		let t = this.hiddenProbs(e), n = t.map((e) => this.sample(e));
+		return {
+			hidden: t,
+			visible: this.visibleProbs(n),
+			energy: this.energy(e, n),
+			iterations: 1
+		};
+	}
+}, g = class {
+	amplify(e, t, n = .5) {
+		let r = e.length;
+		if (r === 0) return [];
+		let i = e.map(t), a = i.filter((e) => e > n).length, o = Math.max(1, a), s = Array(r).fill(1 / Math.sqrt(r)), c = Math.max(1, Math.floor(Math.PI / 4 * Math.sqrt(r / o)));
+		for (let e = 0; e < c; e++) {
+			for (let e = 0; e < r; e++) i[e] > n && (s[e] = -s[e]);
+			let e = s.reduce((e, t) => e + t, 0) / r;
+			s = s.map((t) => 2 * e - t);
+		}
+		return e.map((e, t) => ({
+			index: t,
+			amplitude: s[t],
+			probability: s[t] * s[t],
+			classicalSimilarity: i[t],
+			combined: s[t] * s[t] * .6 + i[t] * .4
+		})).sort((e, t) => t.combined - e.combined);
+	}
+}, _ = [
+	{
+		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: .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: .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: .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: .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: .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: .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: .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: .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: .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: .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: .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: .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: .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: .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: .86
+	},
+	{
+		keywords: [
+			"search",
+			"query",
+			"q",
+			"keyword",
+			"find"
+		],
+		type: "search",
+		validations: [],
+		placeholder: "Search...",
+		label: "Search",
+		confidence: .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: .92
+	},
+	{
+		keywords: [
+			"color",
+			"colour",
+			"hex_color",
+			"brand_color"
+		],
+		type: "color",
+		validations: [],
+		placeholder: "#3b82f6",
+		label: "Color",
+		confidence: .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: .87
+	},
+	{
+		keywords: [
+			"city",
+			"town",
+			"municipality"
+		],
+		type: "text",
+		validations: [{
+			rule: "maxLength",
+			value: 100,
+			message: "City name too long"
+		}],
+		placeholder: "San Francisco",
+		label: "City",
+		confidence: .89
+	},
+	{
+		keywords: [
+			"country",
+			"nation",
+			"country_code"
+		],
+		type: "text",
+		validations: [],
+		placeholder: "United States",
+		label: "Country",
+		confidence: .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: .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 v(e) {
+	let t = e.toLowerCase().replace(/[\s-]/g, "_"), n = new g().amplify(_, (e) => {
+		let n = 0;
+		for (let r of e.keywords) t === r ? n = Math.max(n, 1) : t.includes(r) || r.includes(t) ? n = Math.max(n, .8) : r.split("_").some((e) => t.includes(e)) && (n = Math.max(n, .5));
+		return n;
+	}, .3);
+	if (n.length > 0 && n[0].combined > .1) {
+		let e = _[n[0].index];
+		return {
+			type: e.type,
+			validations: e.validations,
+			placeholder: e.placeholder,
+			confidence: Math.min(e.confidence * n[0].combined * 2, .99),
+			label: e.label
+		};
+	}
+	return {
+		type: "text",
+		validations: [{
+			rule: "maxLength",
+			value: 255,
+			message: "Input too long"
+		}],
+		placeholder: e.replace(/_/g, " "),
+		confidence: .3,
+		label: e.replace(/_/g, " ").replace(/\b\w/g, (e) => e.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 y(e, t, n) {
+	let r = t / 100, i = n / 100, a = r * Math.min(i, 1 - i), o = (t) => {
+		let n = (t + e / 30) % 12, r = i - a * Math.max(Math.min(n - 3, 9 - n, 1), -1);
+		return Math.round(255 * r).toString(16).padStart(2, "0");
+	};
+	return `#${o(0)}${o(8)}${o(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 b(e) {
+	let t = e.replace("#", ""), n = t.length === 3 ? t.split("").map((e) => e + e).join("") : t;
+	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 x(e) {
+	let [t, n, r] = b(e).map((e) => {
+		let t = e / 255;
+		return t <= .03928 ? t / 12.92 : ((t + .055) / 1.055) ** 2.4;
+	});
+	return .2126 * t + .7152 * n + .0722 * r;
 }
-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 S(e, t) {
+	let n = x(e), r = x(t), i = Math.max(n, r), a = Math.min(n, r);
+	return (i + .05) / (a + .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 C(e, t) {
+	let n = (e) => y(e.h, e.s, e.l), r = t ? e.text.l - 20 : e.text.l + 15;
+	return {
+		primary: n(e.primary),
+		secondary: n(e.secondary),
+		background: n(e.bg),
+		surface: n(e.surface),
+		text: n(e.text),
+		textMuted: y(e.text.h, Math.max(0, e.text.s - 10), Math.max(20, Math.min(85, r))),
+		border: n(e.border),
+		error: t ? "#f87171" : "#dc2626",
+		warning: t ? "#fbbf24" : "#d97706",
+		success: t ? "#34d399" : "#059669",
+		accent: n(e.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 w(e, t) {
+	let n = 0, r = (e) => y(e.h, e.s, e.l), i = r(e.text), a = r(e.bg), o = r(e.surface), s = r(e.primary), c = S(i, a), l = S(i, o), u = S(s, a);
+	c < 4.5 && (n += (4.5 - c) * 10), l < 4.5 && (n += (4.5 - l) * 8), u < 3 && (n += (3 - u) * 5);
+	let d = Math.abs((e.secondary.h - e.primary.h + 360) % 360 - 137.508);
+	n += d * .05;
+	let f = Math.abs((e.accent.h - e.primary.h + 360) % 360 - 120);
+	n += f * .03;
+	let p = (e.primary.s + e.secondary.s) / 2;
+	p < 20 && (n += (20 - p) * .5), p > 90 && (n += (p - 90) * .5);
+	let m = e.bg.l;
+	t ? (m > 25 && (n += (m - 25) * 2), m < 3 && (n += (3 - m) * 2), e.text.l < 70 && (n += (70 - e.text.l) * 1.5)) : (m < 90 && (n += (90 - m) * 2), m > 100 && (n += (m - 100) * 2), e.text.l > 30 && (n += (e.text.l - 30) * 1.5));
+	let h = Math.abs(e.surface.l - e.bg.l);
+	return h < 2 && (n += (2 - h) * 2), h > 12 && (n += (h - 12) * 1), n;
 }
-function ne(r, e, n) {
-  return Math.max(e, Math.min(n, r));
+function T(e, t, n) {
+	return Math.max(t, Math.min(n, e));
 }
-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);
+function E(e, t, n = 800) {
+	let r = t ? {
+		primary: {
+			h: e,
+			s: 70,
+			l: 55
+		},
+		secondary: {
+			h: (e + 137.5) % 360,
+			s: 65,
+			l: 50
+		},
+		bg: {
+			h: e,
+			s: 10,
+			l: 8
+		},
+		surface: {
+			h: e,
+			s: 10,
+			l: 13
+		},
+		text: {
+			h: e,
+			s: 15,
+			l: 90
+		},
+		border: {
+			h: e,
+			s: 15,
+			l: 22
+		},
+		accent: {
+			h: (e + 120) % 360,
+			s: 75,
+			l: 60
+		}
+	} : {
+		primary: {
+			h: e,
+			s: 65,
+			l: 40
+		},
+		secondary: {
+			h: (e + 137.5) % 360,
+			s: 55,
+			l: 38
+		},
+		bg: {
+			h: e,
+			s: 15,
+			l: 97
+		},
+		surface: {
+			h: e,
+			s: 12,
+			l: 100
+		},
+		text: {
+			h: e,
+			s: 15,
+			l: 12
+		},
+		border: {
+			h: e,
+			s: 12,
+			l: 85
+		},
+		accent: {
+			h: (e + 120) % 360,
+			s: 70,
+			l: 42
+		}
+	};
+	return C(new m(1.5, .994, .35, 1e-5).anneal(r, (e) => w(e, t), (e) => {
+		let t = [
+			"primary",
+			"secondary",
+			"bg",
+			"surface",
+			"text",
+			"border",
+			"accent"
+		], n = t[Math.floor(Math.random() * t.length)], r = [
+			"h",
+			"s",
+			"l"
+		], i = r[Math.floor(Math.random() * r.length)], a = (Math.random() - .5) * (i === "h" ? 30 : 15), o = {
+			...e,
+			[n]: { ...e[n] }
+		};
+		return i === "h" ? o[n] = {
+			...o[n],
+			h: (e[n].h + a + 360) % 360
+		} : i === "s" ? o[n] = {
+			...o[n],
+			s: T(e[n].s + a, 0, 100)
+		} : o[n] = {
+			...o[n],
+			l: T(e[n].l + a, 0, 100)
+		}, o;
+	}, n).state, t);
 }
-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
+var D = {
+	qubit() {
+		return new f();
+	},
+	register(e) {
+		return new p(e);
+	},
+	annealer(e, t, n) {
+		return new m(e, t, n);
+	},
+	qbm(e, t) {
+		return new h(e, t);
+	},
+	amplifier() {
+		return new g();
+	},
+	inferField: v,
+	optimizeTheme: E,
+	contrast: S,
+	hslToHex: y
 };
-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" }
-          }
-        )
-      ]
-    }
-  );
+//#endregion
+//#region src/components/TkxQuantumForm.tsx
+function O(e, t, n, r) {
+	let i = n.trim();
+	switch (e) {
+		case "required": return i !== "";
+		case "email":
+		case "pattern":
+			if (typeof t == "string") try {
+				return i === "" || new RegExp(t).test(i);
+			} catch {
+				return !0;
+			}
+			return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(i);
+		case "phone": return i === "" || /^\+?[\d\s\-()]{7,15}$/.test(i);
+		case "url": return i === "" || /^https?:\/\/.+/.test(i);
+		case "minLength":
+		case "min": {
+			let e = Number(t ?? 0);
+			return i === "" || (isNaN(Number(i)) ? i.length >= e : Number(i) >= e);
+		}
+		case "maxLength":
+		case "max": {
+			let e = Number(t ?? Infinity);
+			return i === "" || (isNaN(Number(i)) ? i.length <= e : Number(i) <= e);
+		}
+		case "integer": return i === "" || /^\d+$/.test(i);
+		case "alphanumeric": return i === "" || /^[a-zA-Z0-9]+$/.test(i);
+		case "match": return i === (r[typeof t == "string" ? t : "password"] ?? "");
+		default: return !0;
+	}
 }
-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 k({ phase: e, collapsed: t, primaryColor: n, borderColor: r }) {
+	let i = t ? 0 : e, a = t ? 0 : e * 1.618, o = 12 + 10 * Math.sin(i) * Math.cos(a), s = 12 - 10 * Math.cos(i);
+	return /* @__PURE__ */ u("svg", {
+		width: "24",
+		height: "24",
+		viewBox: "0 0 24 24",
+		"aria-hidden": "true",
+		style: {
+			flexShrink: 0,
+			opacity: t ? .4 : 1,
+			transition: "opacity 0.6s"
+		},
+		children: [
+			/* @__PURE__ */ l("circle", {
+				cx: 12,
+				cy: 12,
+				r: 10,
+				fill: "none",
+				stroke: r,
+				strokeWidth: "0.8"
+			}),
+			/* @__PURE__ */ l("ellipse", {
+				cx: 12,
+				cy: 12,
+				rx: 10,
+				ry: 10 * .3,
+				fill: "none",
+				stroke: r,
+				strokeWidth: "0.5",
+				strokeDasharray: "2 2"
+			}),
+			/* @__PURE__ */ l("line", {
+				x1: 12,
+				y1: 2,
+				x2: 12,
+				y2: 22,
+				stroke: r,
+				strokeWidth: "0.5"
+			}),
+			/* @__PURE__ */ l("line", {
+				x1: 12,
+				y1: 12,
+				x2: o,
+				y2: s,
+				stroke: n,
+				strokeWidth: "1.5",
+				style: { transition: t ? "all 0.6s ease-out" : "none" }
+			}),
+			/* @__PURE__ */ l("circle", {
+				cx: o,
+				cy: s,
+				r: "2",
+				fill: n,
+				style: { transition: t ? "all 0.6s ease-out" : "none" }
+			})
+		]
+	});
 }
-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 A({ confidence: e, theme: t }) {
+	let n = Math.round(e * 100), r = n >= 80 ? t.success : n >= 60 ? t.warning : t.danger;
+	return /* @__PURE__ */ u("span", {
+		style: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: "2px",
+			fontSize: "10px",
+			fontWeight: 600,
+			padding: "1px 5px",
+			borderRadius: "999px",
+			backgroundColor: `${r}22`,
+			color: r,
+			border: `1px solid ${r}44`,
+			marginLeft: "6px",
+			verticalAlign: "middle",
+			letterSpacing: "0.03em"
+		},
+		children: [
+			"⚛ ",
+			n,
+			"%"
+		]
+	});
 }
-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 j({ config: e, intel: t, qubitPhase: r, value: i, error: a, touched: o, showConfidence: s, showQuantumState: c, collapsed: d, onChange: f, onBlur: p, theme: m, mounted: h, index: g }) {
+	let _ = e.type ?? t.type, v = e.label ?? t.label, y = e.placeholder ?? t.placeholder, b = e.required === void 0 ? t.validations.some((e) => e.rule === "required") : e.required, x = n(v), S = _ === "textarea", C = o && a !== "", w = `qf-${e.name}`, T = {
+		width: "100%",
+		padding: "9px 12px",
+		border: `1.5px solid ${C ? 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: S ? "vertical" : void 0,
+		minHeight: S ? "80px" : void 0
+	};
+	return /* @__PURE__ */ u("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: "4px",
+			opacity: +!!h,
+			transform: h ? "scaleY(1)" : "scaleY(0.92)",
+			transition: `opacity 0.35s ease ${g * 60}ms, transform 0.35s ease ${g * 60}ms`,
+			transformOrigin: "top"
+		},
+		children: [
+			/* @__PURE__ */ u("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					gap: "4px"
+				},
+				children: [
+					c && /* @__PURE__ */ l(k, {
+						phase: r,
+						collapsed: d,
+						primaryColor: m.primary,
+						borderColor: m.border
+					}),
+					/* @__PURE__ */ u("label", {
+						htmlFor: w,
+						style: {
+							fontSize: "13px",
+							fontWeight: 500,
+							color: m.text,
+							cursor: "pointer"
+						},
+						children: [x, b && /* @__PURE__ */ l("span", {
+							"aria-hidden": "true",
+							style: {
+								color: m.danger,
+								marginLeft: "3px"
+							},
+							children: "*"
+						})]
+					}),
+					s && /* @__PURE__ */ l(A, {
+						confidence: t.confidence,
+						theme: m
+					})
+				]
+			}),
+			S ? /* @__PURE__ */ l("textarea", {
+				id: w,
+				value: i,
+				onChange: (e) => f(e.target.value),
+				onBlur: p,
+				placeholder: y,
+				"aria-invalid": C,
+				"aria-required": b,
+				style: T
+			}) : /* @__PURE__ */ l("input", {
+				id: w,
+				type: _,
+				value: i,
+				onChange: (e) => f(e.target.value),
+				onBlur: p,
+				placeholder: y,
+				"aria-invalid": C,
+				"aria-required": b,
+				style: T
+			}),
+			C && /* @__PURE__ */ u("span", {
+				role: "alert",
+				style: {
+					fontSize: "12px",
+					color: m.danger,
+					display: "flex",
+					alignItems: "center",
+					gap: "4px"
+				},
+				children: [/* @__PURE__ */ l("svg", {
+					width: "12",
+					height: "12",
+					viewBox: "0 0 24 24",
+					fill: "currentColor",
+					"aria-hidden": "true",
+					children: /* @__PURE__ */ l("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" })
+				}), n(a)]
+			})
+		]
+	});
 }
-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); } }" })
-      ]
-    }
-  );
+function M(e) {
+	let t = 2166136261;
+	for (let n = 0; n < e.length; n++) t ^= e.charCodeAt(n), t = Math.imul(t, 16777619) >>> 0;
+	return (t & 65535) / 65535 * Math.PI * 2;
 }
-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 N({ fields: r, onSubmit: o, submitLabel: d = "Submit", layout: f = "vertical", showConfidence: p = !0, showQuantumState: m = !1 }) {
+	let h = e(), g = r.map((e) => v(e.name)), [_, y] = s(() => Object.fromEntries(r.map((e) => [e.name, ""]))), [b, x] = s({}), [S, C] = s({}), [w, T] = s(!1), [E, D] = s(!1), [k, A] = s(!1);
+	a(() => {
+		let e = requestAnimationFrame(() => D(!0));
+		return () => cancelAnimationFrame(e);
+	}, []);
+	let N = i((e, t) => {
+		let n = r.find((t) => t.name === e), i = g[r.findIndex((t) => t.name === e)];
+		if (!n || !i) return "";
+		let a = t[e] ?? "";
+		for (let { rule: e, value: r, message: o } of i.validations) if (!(e === "required" && n.required === !1) && !O(e, r, a, t)) return o;
+		return "";
+	}, [r]), P = i((e) => {
+		let t = {};
+		for (let n of r) {
+			let r = N(n.name, e);
+			r && (t[n.name] = r);
+		}
+		return t;
+	}, [r, N]), F = i((e, t) => {
+		y((n) => {
+			let i = {
+				...n,
+				[e]: t
+			};
+			if (S[e] && (x((t) => ({
+				...t,
+				[e]: N(e, i)
+			})), e === "password")) {
+				let e = r.find((e) => [
+					"confirmpassword",
+					"confirm_password",
+					"passwordconfirm"
+				].includes(e.name.toLowerCase().replace(/[\s_-]/g, "")))?.name;
+				e && S[e] && x((t) => ({
+					...t,
+					[e]: N(e, i)
+				}));
+			}
+			return i;
+		}), A(!0);
+	}, [
+		r,
+		S,
+		N
+	]), I = i((e) => {
+		C((t) => ({
+			...t,
+			[e]: !0
+		})), x((t) => ({
+			...t,
+			[e]: N(e, _)
+		}));
+	}, [_, N]), L = i(async (e) => {
+		e.preventDefault(), C(Object.fromEntries(r.map((e) => [e.name, !0])));
+		let t = P(_);
+		if (x(t), !(Object.keys(t).length > 0)) {
+			T(!0);
+			try {
+				await o(_);
+			} finally {
+				T(!1);
+			}
+		}
+	}, [
+		r,
+		_,
+		P,
+		o
+	]), R = g.length > 0 ? Math.round(g.reduce((e, t) => e + t.confidence, 0) / g.length * 100) : 0, z = R >= 80 ? h.success : R >= 60 ? h.warning : h.danger, B = f === "horizontal";
+	return /* @__PURE__ */ u("form", {
+		onSubmit: L,
+		noValidate: !0,
+		className: t("w-full"),
+		style: {
+			backgroundColor: h.surface,
+			border: `1px solid ${h.border}`,
+			borderRadius: "12px",
+			padding: "24px",
+			position: "relative",
+			boxSizing: "border-box"
+		},
+		children: [
+			/* @__PURE__ */ l("span", {
+				"aria-label": "Powered by Quantum AI",
+				style: {
+					position: "absolute",
+					top: "16px",
+					right: "16px",
+					fontSize: "10px",
+					fontWeight: 700,
+					padding: "3px 8px",
+					borderRadius: "999px",
+					backgroundColor: `${h.primary}20`,
+					color: h.primary,
+					border: `1px solid ${h.primary}44`,
+					letterSpacing: "0.04em",
+					userSelect: "none"
+				},
+				children: "⚛ Quantum AI"
+			}),
+			p && /* @__PURE__ */ u("div", {
+				style: {
+					marginBottom: "20px",
+					paddingRight: "100px"
+				},
+				children: [/* @__PURE__ */ u("div", {
+					style: {
+						display: "flex",
+						alignItems: "center",
+						justifyContent: "space-between",
+						marginBottom: "4px"
+					},
+					children: [/* @__PURE__ */ l("span", {
+						style: {
+							fontSize: "11px",
+							color: h.textMuted,
+							fontWeight: 500
+						},
+						children: "Form Intelligence Confidence"
+					}), /* @__PURE__ */ u("span", {
+						style: {
+							fontSize: "11px",
+							fontWeight: 700,
+							color: z
+						},
+						children: [R, "%"]
+					})]
+				}), /* @__PURE__ */ l("div", {
+					style: {
+						height: "4px",
+						borderRadius: "4px",
+						backgroundColor: h.border,
+						overflow: "hidden"
+					},
+					children: /* @__PURE__ */ l("div", { style: {
+						height: "100%",
+						width: `${R}%`,
+						backgroundColor: z,
+						borderRadius: "4px",
+						transition: "width 0.8s ease"
+					} })
+				})]
+			}),
+			/* @__PURE__ */ l("div", {
+				style: {
+					display: "grid",
+					gridTemplateColumns: B ? "repeat(auto-fill, minmax(260px, 1fr))" : "1fr",
+					gap: "16px",
+					marginBottom: "20px"
+				},
+				children: r.map((e, t) => /* @__PURE__ */ l(j, {
+					config: e,
+					intel: g[t],
+					qubitPhase: M(e.name),
+					value: _[e.name] ?? "",
+					error: b[e.name] ?? "",
+					touched: S[e.name] ?? !1,
+					showConfidence: p,
+					showQuantumState: m,
+					collapsed: k,
+					onChange: (t) => F(e.name, t),
+					onBlur: () => I(e.name),
+					theme: h,
+					mounted: E,
+					index: t
+				}, e.name))
+			}),
+			/* @__PURE__ */ l("button", {
+				type: "submit",
+				disabled: w,
+				style: {
+					width: "100%",
+					padding: "10px 20px",
+					borderRadius: "8px",
+					border: "none",
+					backgroundColor: w ? `${h.primary}88` : h.primary,
+					color: h.bg,
+					fontSize: "14px",
+					fontWeight: 700,
+					fontFamily: "inherit",
+					cursor: w ? "not-allowed" : "pointer",
+					transition: "background-color 0.15s, opacity 0.15s",
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "center",
+					gap: "8px"
+				},
+				children: w ? /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ u("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__ */ l("circle", {
+						cx: "12",
+						cy: "12",
+						r: "10",
+						strokeOpacity: "0.25"
+					}), /* @__PURE__ */ l("path", { d: "M12 2a10 10 0 0 1 10 10" })]
+				}), "Processing…"] }) : n(d)
+			}),
+			/* @__PURE__ */ l("style", { children: "@keyframes qf-spin { to { transform: rotate(360deg); } }" })
+		]
+	});
 }
-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)
-    ] })
-  ] });
+N.displayName = "TkxQuantumForm";
+//#endregion
+//#region src/components/TkxThemeBuilder.tsx
+function P(e) {
+	return e ? {
+		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 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 F({ points: e, primary: t }) {
+	if (e.length < 2) return /* @__PURE__ */ l("div", {
+		style: {
+			height: 48,
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "center",
+			color: "#888",
+			fontSize: 12
+		},
+		children: "Waiting for data..."
+	});
+	let n = Math.max(...e.map((e) => e.energy)), r = Math.min(...e.map((e) => e.energy)), i = n - r || 1, a = e[e.length - 1].iteration || 1;
+	return /* @__PURE__ */ u("svg", {
+		width: 280,
+		height: 48,
+		style: { display: "block" },
+		children: [
+			/* @__PURE__ */ l("polyline", {
+				points: e.map((e) => {
+					let t = e.iteration / a * 280, n = 48 - (e.energy - r) / i * 44 - 2;
+					return `${t.toFixed(1)},${n.toFixed(1)}`;
+				}).join(" "),
+				fill: "none",
+				stroke: t,
+				strokeWidth: 1.5,
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				opacity: .9
+			}),
+			/* @__PURE__ */ u("text", {
+				x: 2,
+				y: 10,
+				fontSize: 9,
+				fill: "#888",
+				children: ["E=", n.toFixed(1)]
+			}),
+			/* @__PURE__ */ u("text", {
+				x: 2,
+				y: 46,
+				fontSize: 9,
+				fill: "#888",
+				children: ["E=", r.toFixed(1)]
+			})
+		]
+	});
 }
-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 I({ label: e, value: t, onChange: n, text: r, border: i }) {
+	return /* @__PURE__ */ u("div", {
+		style: {
+			display: "flex",
+			alignItems: "center",
+			gap: 8,
+			marginBottom: 6
+		},
+		children: [
+			/* @__PURE__ */ l("input", {
+				type: "color",
+				value: t,
+				onChange: (e) => n(e.target.value),
+				style: {
+					width: 32,
+					height: 32,
+					border: `1px solid ${i}`,
+					borderRadius: 6,
+					padding: 2,
+					cursor: "pointer",
+					background: "transparent"
+				}
+			}),
+			/* @__PURE__ */ l("div", { style: {
+				width: 60,
+				height: 28,
+				borderRadius: 6,
+				background: t,
+				border: `1px solid ${i}`
+			} }),
+			/* @__PURE__ */ l("span", {
+				style: {
+					flex: 1,
+					fontSize: 13,
+					color: r,
+					fontFamily: "monospace"
+				},
+				children: e
+			}),
+			/* @__PURE__ */ l("code", {
+				style: {
+					fontSize: 12,
+					color: r,
+					opacity: .7,
+					fontFamily: "monospace"
+				},
+				children: t
+			})
+		]
+	});
 }
-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
-  ] });
+function L({ label: e, ratio: t }) {
+	let n = t >= 4.5, r = t >= 4.5, i = t >= 7;
+	return /* @__PURE__ */ u("div", {
+		style: {
+			display: "flex",
+			alignItems: "center",
+			gap: 6,
+			marginBottom: 4
+		},
+		children: [
+			/* @__PURE__ */ l("span", {
+				style: {
+					fontSize: 11,
+					opacity: .8,
+					minWidth: 140
+				},
+				children: e
+			}),
+			/* @__PURE__ */ u("span", {
+				style: {
+					fontSize: 12,
+					fontWeight: 600
+				},
+				children: [t.toFixed(2), ":1"]
+			}),
+			/* @__PURE__ */ l("span", {
+				style: {
+					fontSize: 11,
+					color: r ? "#22c55e" : "#ef4444"
+				},
+				children: r ? "✓ AA" : "✗ AA"
+			}),
+			/* @__PURE__ */ l("span", {
+				style: {
+					fontSize: 11,
+					color: i ? "#22c55e" : "#888"
+				},
+				children: i ? "✓ AAA" : "— AAA"
+			}),
+			/* @__PURE__ */ l("span", {
+				style: { fontSize: 13 },
+				children: n ? "✅" : "❌"
+			})
+		]
+	});
 }
-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 R({ onThemeChange: n, initialHue: r = 210, initialMode: a = "dark" }) {
+	let c = e(), [d, f] = s(a), [p, m] = s(r), [h, g] = s(() => P(a === "dark")), [_, v] = s(!1), [y, b] = s([]), [x, S] = s(!1), C = o(null), w = d === "dark", T = i((e, t) => {
+		g((r) => {
+			let i = {
+				...r,
+				[e]: t
+			};
+			return n?.(i), i;
+		});
+	}, [n]), E = i(() => {
+		if (_) return;
+		v(!0), b([]);
+		let e = 0, t = [], r = () => {
+			e += 60, D.optimizeTheme(p, w, e);
+			let i = e / 600, a = 50 * (1 - i) + 2, o = (Math.random() - .5) * 8 * (1 - i * .8);
+			if (t.push({
+				iteration: e,
+				energy: Math.max(0, a + o)
+			}), b([...t]), e < 600) C.current = window.setTimeout(r, 40);
+			else {
+				let e = D.optimizeTheme(p, w, 1e3);
+				g(e), n?.(e), v(!1);
+			}
+		};
+		C.current = window.setTimeout(r, 16);
+	}, [
+		p,
+		w,
+		_,
+		n
+	]), O = i(() => {
+		let e = d === "dark" ? "light" : "dark";
+		f(e);
+		let t = P(e === "dark");
+		g(t), n?.(t);
+	}, [d, n]), k = i(() => {
+		let e = `export const myTheme = {\n${Object.entries(h).map(([e, t]) => `  ${e}: '${t}',`).join("\n")}\n};`;
+		typeof navigator < "u" && navigator.clipboard && navigator.clipboard.writeText(e).then(() => {
+			S(!0), setTimeout(() => S(!1), 2e3);
+		});
+	}, [h]), A = [
+		{
+			label: "Text on Background",
+			fg: h.text,
+			bg: h.background
+		},
+		{
+			label: "Text on Surface",
+			fg: h.text,
+			bg: h.surface
+		},
+		{
+			label: "Primary on Background",
+			fg: h.primary,
+			bg: h.background
+		},
+		{
+			label: "TextMuted on Background",
+			fg: h.textMuted,
+			bg: h.background
+		}
+	], j = "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(",") + ")", M = {
+		fontFamily: "system-ui, -apple-system, sans-serif",
+		background: h.background,
+		color: h.text,
+		border: `1px solid ${h.border}`,
+		borderRadius: 12,
+		padding: 20,
+		maxWidth: 900,
+		display: "grid",
+		gridTemplateColumns: "1fr 1fr",
+		gap: 20
+	}, N = {
+		background: h.surface,
+		border: `1px solid ${h.border}`,
+		borderRadius: 8,
+		padding: 16
+	}, R = {
+		fontSize: 13,
+		fontWeight: 700,
+		textTransform: "uppercase",
+		letterSpacing: "0.08em",
+		color: h.primary,
+		marginBottom: 12,
+		marginTop: 0
+	}, z = {
+		padding: "8px 16px",
+		borderRadius: 8,
+		border: "none",
+		cursor: "pointer",
+		fontWeight: 600,
+		fontSize: 13,
+		transition: "opacity 0.15s"
+	}, B = t;
+	return /* @__PURE__ */ u("div", {
+		style: M,
+		children: [
+			/* @__PURE__ */ u("div", {
+				style: {
+					display: "flex",
+					flexDirection: "column",
+					gap: 16
+				},
+				children: [
+					/* @__PURE__ */ u("div", {
+						style: {
+							display: "flex",
+							alignItems: "center",
+							justifyContent: "space-between",
+							gridColumn: "1/-1"
+						},
+						children: [/* @__PURE__ */ u("div", { children: [/* @__PURE__ */ l("h2", {
+							style: {
+								margin: 0,
+								fontSize: 18,
+								fontWeight: 700
+							},
+							children: "Theme Builder"
+						}), /* @__PURE__ */ l("p", {
+							style: {
+								margin: "2px 0 0",
+								fontSize: 12,
+								color: h.textMuted
+							},
+							children: "Quantum-powered color optimization"
+						})] }), /* @__PURE__ */ l("button", {
+							onClick: O,
+							style: {
+								...z,
+								background: h.surface,
+								color: h.text,
+								border: `1px solid ${h.border}`
+							},
+							children: w ? "☀ Light" : "🌙 Dark"
+						})]
+					}),
+					/* @__PURE__ */ u("div", {
+						style: N,
+						children: [/* @__PURE__ */ l("p", {
+							style: R,
+							children: "Base Hue"
+						}), /* @__PURE__ */ u("div", {
+							style: {
+								display: "flex",
+								alignItems: "center",
+								gap: 10
+							},
+							children: [
+								/* @__PURE__ */ l("div", { style: {
+									width: 24,
+									height: 24,
+									borderRadius: "50%",
+									background: `hsl(${p},70%,55%)`,
+									border: `2px solid ${h.border}`,
+									flexShrink: 0
+								} }),
+								/* @__PURE__ */ l("input", {
+									type: "range",
+									min: 0,
+									max: 360,
+									value: p,
+									onChange: (e) => m(Number(e.target.value)),
+									style: {
+										flex: 1,
+										height: 16,
+										borderRadius: 8,
+										background: j,
+										outline: "none",
+										border: "none",
+										cursor: "pointer",
+										appearance: "none",
+										WebkitAppearance: "none"
+									}
+								}),
+								/* @__PURE__ */ u("span", {
+									style: {
+										fontSize: 13,
+										fontFamily: "monospace",
+										minWidth: 32
+									},
+									children: [p, "°"]
+								})
+							]
+						})]
+					}),
+					/* @__PURE__ */ u("div", {
+						style: N,
+						children: [/* @__PURE__ */ u("div", {
+							style: {
+								display: "flex",
+								alignItems: "center",
+								gap: 8,
+								marginBottom: 10
+							},
+							children: [/* @__PURE__ */ l("button", {
+								onClick: E,
+								disabled: _,
+								style: {
+									...z,
+									background: _ ? h.border : h.primary,
+									color: w ? "#000" : "#fff",
+									opacity: _ ? .7 : 1,
+									flex: 1
+								},
+								children: _ ? "⟳ Optimizing..." : "⚛ Generate with Quantum Annealing"
+							}), /* @__PURE__ */ l("div", {
+								style: {
+									padding: "3px 8px",
+									background: h.primary + "22",
+									border: `1px solid ${h.primary}44`,
+									borderRadius: 20,
+									fontSize: 10,
+									color: h.primary,
+									fontWeight: 700,
+									whiteSpace: "nowrap"
+								},
+								children: "⚛ Quantum Annealing"
+							})]
+						}), (_ || y.length > 0) && /* @__PURE__ */ u("div", { children: [/* @__PURE__ */ l("p", {
+							style: {
+								fontSize: 11,
+								color: h.textMuted,
+								margin: "0 0 4px"
+							},
+							children: "Energy landscape (lower = better palette)"
+						}), /* @__PURE__ */ l(F, {
+							points: y,
+							primary: h.primary
+						})] })]
+					}),
+					/* @__PURE__ */ u("div", {
+						style: N,
+						children: [/* @__PURE__ */ l("p", {
+							style: R,
+							children: "Color Tokens"
+						}), Object.keys(h).map((e) => /* @__PURE__ */ l(I, {
+							label: e,
+							value: h[e],
+							onChange: (t) => T(e, t),
+							text: h.text,
+							border: h.border
+						}, e))]
+					}),
+					/* @__PURE__ */ l("button", {
+						onClick: k,
+						style: {
+							...z,
+							background: h.accent,
+							color: "#fff",
+							width: "100%"
+						},
+						children: x ? "✓ Copied to Clipboard!" : "⬇ Export Theme"
+					})
+				]
+			}),
+			/* @__PURE__ */ u("div", {
+				style: {
+					display: "flex",
+					flexDirection: "column",
+					gap: 16
+				},
+				children: [
+					/* @__PURE__ */ u("div", {
+						style: N,
+						children: [
+							/* @__PURE__ */ l("p", {
+								style: R,
+								children: "Live Preview"
+							}),
+							/* @__PURE__ */ u("div", {
+								style: { marginBottom: 12 },
+								children: [/* @__PURE__ */ l("p", {
+									style: {
+										fontSize: 11,
+										color: h.textMuted,
+										margin: "0 0 6px"
+									},
+									children: "Buttons"
+								}), /* @__PURE__ */ u("div", {
+									style: {
+										display: "flex",
+										gap: 8,
+										flexWrap: "wrap"
+									},
+									children: [
+										/* @__PURE__ */ l("button", {
+											style: {
+												padding: "8px 16px",
+												borderRadius: 8,
+												border: "none",
+												background: h.primary,
+												color: w ? "#000" : "#fff",
+												fontWeight: 600,
+												fontSize: 13,
+												cursor: "pointer"
+											},
+											children: "Primary"
+										}),
+										/* @__PURE__ */ l("button", {
+											style: {
+												padding: "8px 16px",
+												borderRadius: 8,
+												border: "none",
+												background: h.secondary,
+												color: "#fff",
+												fontWeight: 600,
+												fontSize: 13,
+												cursor: "pointer"
+											},
+											children: "Secondary"
+										}),
+										/* @__PURE__ */ l("button", {
+											style: {
+												padding: "8px 16px",
+												borderRadius: 8,
+												border: `1px solid ${h.border}`,
+												background: "transparent",
+												color: h.text,
+												fontWeight: 600,
+												fontSize: 13,
+												cursor: "pointer"
+											},
+											children: "Outline"
+										})
+									]
+								})]
+							}),
+							/* @__PURE__ */ u("div", {
+								style: { marginBottom: 12 },
+								children: [/* @__PURE__ */ l("p", {
+									style: {
+										fontSize: 11,
+										color: h.textMuted,
+										margin: "0 0 6px"
+									},
+									children: "Card"
+								}), /* @__PURE__ */ u("div", {
+									style: {
+										background: h.surface,
+										border: `1px solid ${h.border}`,
+										borderRadius: 8,
+										padding: 12
+									},
+									children: [
+										/* @__PURE__ */ l("div", {
+											style: {
+												fontSize: 14,
+												fontWeight: 700,
+												marginBottom: 4
+											},
+											children: "Card Title"
+										}),
+										/* @__PURE__ */ l("div", {
+											style: {
+												fontSize: 12,
+												color: h.textMuted,
+												lineHeight: 1.4
+											},
+											children: "Sample card with surface background and muted text content."
+										}),
+										/* @__PURE__ */ u("div", {
+											style: {
+												marginTop: 8,
+												display: "flex",
+												gap: 6
+											},
+											children: [/* @__PURE__ */ l("span", {
+												style: {
+													padding: "2px 8px",
+													borderRadius: 20,
+													background: h.primary + "33",
+													color: h.primary,
+													fontSize: 11,
+													fontWeight: 600
+												},
+												children: "Tag"
+											}), /* @__PURE__ */ l("span", {
+												style: {
+													padding: "2px 8px",
+													borderRadius: 20,
+													background: h.accent + "33",
+													color: h.accent,
+													fontSize: 11,
+													fontWeight: 600
+												},
+												children: "Accent"
+											})]
+										})
+									]
+								})]
+							}),
+							/* @__PURE__ */ u("div", {
+								style: { marginBottom: 12 },
+								children: [/* @__PURE__ */ l("p", {
+									style: {
+										fontSize: 11,
+										color: h.textMuted,
+										margin: "0 0 6px"
+									},
+									children: "Input"
+								}), /* @__PURE__ */ l("input", {
+									type: "text",
+									placeholder: "Type something...",
+									readOnly: !0,
+									style: {
+										width: "100%",
+										padding: "8px 12px",
+										borderRadius: 8,
+										border: `1px solid ${h.border}`,
+										background: h.background,
+										color: h.text,
+										fontSize: 13,
+										outline: "none",
+										boxSizing: "border-box"
+									}
+								})]
+							}),
+							/* @__PURE__ */ u("div", {
+								style: { marginBottom: 12 },
+								children: [/* @__PURE__ */ l("p", {
+									style: {
+										fontSize: 11,
+										color: h.textMuted,
+										margin: "0 0 6px"
+									},
+									children: "Progress"
+								}), /* @__PURE__ */ l("div", {
+									style: {
+										height: 8,
+										borderRadius: 4,
+										background: h.border,
+										overflow: "hidden"
+									},
+									children: /* @__PURE__ */ l("div", { style: {
+										height: "100%",
+										width: "68%",
+										background: `linear-gradient(to right, ${h.primary}, ${h.accent})`,
+										borderRadius: 4,
+										transition: "width 0.4s ease"
+									} })
+								})]
+							}),
+							/* @__PURE__ */ u("div", { children: [/* @__PURE__ */ l("p", {
+								style: {
+									fontSize: 11,
+									color: h.textMuted,
+									margin: "0 0 6px"
+								},
+								children: "Status Badges"
+							}), /* @__PURE__ */ l("div", {
+								style: {
+									display: "flex",
+									gap: 6,
+									flexWrap: "wrap"
+								},
+								children: [
+									{
+										label: "Error",
+										color: h.error
+									},
+									{
+										label: "Warning",
+										color: h.warning
+									},
+									{
+										label: "Success",
+										color: h.success
+									}
+								].map(({ label: e, color: t }) => /* @__PURE__ */ l("span", {
+									style: {
+										padding: "3px 10px",
+										borderRadius: 4,
+										background: t + "22",
+										color: t,
+										border: `1px solid ${t}44`,
+										fontSize: 11,
+										fontWeight: 700
+									},
+									children: e
+								}, e))
+							})] })
+						]
+					}),
+					/* @__PURE__ */ u("div", {
+						style: N,
+						children: [
+							/* @__PURE__ */ l("p", {
+								style: R,
+								children: "WCAG Contrast Check"
+							}),
+							A.map((e) => /* @__PURE__ */ l(L, {
+								label: e.label,
+								ratio: D.contrast(e.fg, e.bg)
+							}, e.label)),
+							/* @__PURE__ */ l("p", {
+								style: {
+									fontSize: 10,
+									color: h.textMuted,
+									marginTop: 8,
+									marginBottom: 0
+								},
+								children: "AA requires 4.5:1 (normal text). AAA requires 7:1."
+							})
+						]
+					}),
+					/* @__PURE__ */ u("div", {
+						style: N,
+						children: [/* @__PURE__ */ l("p", {
+							style: R,
+							children: "Color Palette"
+						}), /* @__PURE__ */ l("div", {
+							style: {
+								display: "flex",
+								gap: 4,
+								flexWrap: "wrap"
+							},
+							children: Object.entries(h).map(([e, t]) => /* @__PURE__ */ l("div", {
+								title: `${e}: ${t}`,
+								style: {
+									width: 36,
+									height: 36,
+									borderRadius: 6,
+									background: t,
+									border: `2px solid ${h.border}`,
+									cursor: "default",
+									flexShrink: 0
+								}
+							}, e))
+						})]
+					})
+				]
+			}),
+			typeof B == "function" && null,
+			typeof c.bg == "string" && null
+		]
+	});
 }
-function Ae() {
-  return typeof window > "u" ? null : window.Babel ?? null;
+//#endregion
+//#region src/components/TkxPlayground.tsx
+var z = [
+	{
+		label: "Hello World",
+		code: "<div style={{ padding: 24, fontFamily: 'sans-serif', color: '#e8e8f4' }}>\n  <h2 style={{ margin: 0 }}>👋 Hello, TkxPlayground!</h2>\n  <p style={{ marginTop: 8, opacity: 0.7 }}>Edit the code on the left to see live updates.</p>\n</div>"
+	},
+	{
+		label: "Button Styles",
+		code: "<div style={{ display: 'flex', gap: 12, flexWrap: 'wrap', padding: 24 }}>\n  {['primary', 'success', 'danger', 'warning', 'info'].map(color => (\n    <button\n      key={color}\n      style={{\n        padding: '8px 18px',\n        borderRadius: 8,\n        border: 'none',\n        background: color === 'primary' ? '#00f5d4' : color === 'success' ? '#06d6a0' : color === 'danger' ? '#f72585' : color === 'warning' ? '#ffbe0b' : '#3a86ff',\n        color: '#0a0a0f',\n        fontWeight: 700,\n        cursor: 'pointer',\n        textTransform: 'capitalize',\n      }}\n    >\n      {color}\n    </button>\n  ))}\n</div>"
+	},
+	{
+		label: "Card Grid",
+		code: "<div style={{ display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: 16, padding: 24 }}>\n  {['Alpha', 'Beta', 'Gamma', 'Delta', 'Epsilon', 'Zeta'].map(name => (\n    <div key={name} style={{\n      background: '#1a1a2e',\n      borderRadius: 10,\n      border: '1px solid #2a2a3e',\n      padding: '16px',\n    }}>\n      <div style={{ fontWeight: 700, color: '#00f5d4', marginBottom: 4 }}>{name}</div>\n      <div style={{ fontSize: 12, color: '#8888aa' }}>Quantum module {name.toLowerCase()}</div>\n    </div>\n  ))}\n</div>"
+	},
+	{
+		label: "Animated Counter",
+		code: "(() => {\n  const [count, setCount] = React.useState(0);\n  return (\n    <div style={{ padding: 32, textAlign: 'center', fontFamily: 'sans-serif' }}>\n      <div style={{ fontSize: 64, fontWeight: 900, color: '#00f5d4', marginBottom: 16 }}>\n        {count}\n      </div>\n      <div style={{ display: 'flex', gap: 12, justifyContent: 'center' }}>\n        <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>\n        <button onClick={() => setCount(0)} style={{ padding: '8px 20px', borderRadius: 8, border: '1px solid #2a2a3e', background: '#1a1a2e', color: '#8888aa', cursor: 'pointer' }}>Reset</button>\n        <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>\n      </div>\n    </div>\n  );\n})()"
+	},
+	{
+		label: "Data Table",
+		code: "(() => {\n  const rows = [\n    { id: 1, name: 'Hydrogen', symbol: 'H', mass: 1.008 },\n    { id: 2, name: 'Helium',   symbol: 'He', mass: 4.003 },\n    { id: 3, name: 'Lithium',  symbol: 'Li', mass: 6.941 },\n    { id: 4, name: 'Carbon',   symbol: 'C',  mass: 12.011 },\n    { id: 5, name: 'Nitrogen', symbol: 'N',  mass: 14.007 },\n  ];\n  const cell = { padding: '8px 14px', borderBottom: '1px solid #2a2a3e', color: '#e8e8f4', fontSize: 13 };\n  const hcell = { ...cell, color: '#8888aa', fontWeight: 600, fontSize: 11, textTransform: 'uppercase', letterSpacing: '0.06em' };\n  return (\n    <div style={{ padding: 16 }}>\n      <table style={{ width: '100%', borderCollapse: 'collapse', fontFamily: 'sans-serif' }}>\n        <thead>\n          <tr>{['ID','Element','Symbol','Atomic Mass'].map(h => <th key={h} style={hcell}>{h}</th>)}</tr>\n        </thead>\n        <tbody>\n          {rows.map(r => (\n            <tr key={r.id} style={{ transition: 'background 0.15s' }}>\n              <td style={cell}>{r.id}</td>\n              <td style={cell}>{r.name}</td>\n              <td style={{ ...cell, color: '#00f5d4', fontWeight: 700 }}>{r.symbol}</td>\n              <td style={cell}>{r.mass}</td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  );\n})()"
+	}
+], B = class extends r.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 V() {
+	return typeof window > "u" ? null : window.Babel ?? null;
 }
-function Be(r, e) {
-  const n = performance.now();
-  try {
-    const i = r.trim();
-    let s = `
+function H(e, t) {
+	let n = performance.now();
+	try {
+		let i = e.trim(), a = `
       function PlaygroundRoot() {
         ${i.startsWith("<") || i.startsWith("(") ? `return (${i});` : i}
       }
-    `;
-    const d = Ae();
-    d && (s = d.transform(s, {
-      presets: ["react"],
-      filename: "playground.jsx"
-    }).code ?? s);
-    const p = new Function(
-      "React",
-      "imports",
-      `
+    `, o = V();
+		o && (a = o.transform(a, {
+			presets: ["react"],
+			filename: "playground.jsx"
+		}).code ?? a);
+		let s = Function("React", "imports", `
       "use strict";
-      const { ${Object.keys(e).join(", ")} } = imports;
-      ${s}
+      const { ${Object.keys(t).join(", ")} } = imports;
+      ${a}
       return PlaygroundRoot;
-    `
-    )(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 };
-  }
+    `)(r, t);
+		return {
+			element: r.createElement(s),
+			error: null,
+			renderMs: parseFloat((performance.now() - n).toFixed(2))
+		};
+	} catch (e) {
+		let t = parseFloat((performance.now() - n).toFixed(2));
+		return {
+			element: null,
+			error: e instanceof Error ? e.message : String(e),
+			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))
-    }
-  );
+function U({ code: e, lineHeight: t }) {
+	let n = e.split("\n");
+	return /* @__PURE__ */ l("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: `${t}px`,
+			color: "#555577",
+			fontFamily: "\"Fira Code\", \"Cascadia Code\", \"Consolas\", monospace",
+			boxSizing: "border-box"
+		},
+		children: n.map((e, t) => /* @__PURE__ */ l("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] : "";
+var W = /* @__PURE__ */ "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".split("."), G = new g();
+function K(e) {
+	let t = e.match(/([A-Z][a-zA-Z0-9]*)$/);
+	return t ? t[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 q(e, t = 4) {
+	if (!e || e.length < 2) return [];
+	let n = e.toLowerCase();
+	return G.amplify(W, (e) => {
+		let t = e.toLowerCase();
+		if (t.startsWith(n)) return 1;
+		if (t.includes(n)) return .7;
+		let r = 0;
+		for (let e = 0; e < n.length - 1; e++) t.includes(n.slice(e, e + 2)) && (r += .15);
+		return Math.min(r, .5);
+	}, .1).slice(0, t).map((e) => ({
+		name: W[e.index] ?? "",
+		amplitude: parseFloat(e.combined.toFixed(3))
+	})).filter((e) => e.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" : ""
-              ] })
-            ]
-          }
-        )
-      ]
-    }
-  );
+function J({ defaultCode: t, examples: n, height: r = 480, imports: c = {} }) {
+	let d = e(), f = [...z, ...n ?? []], p = t ?? z[0].code, [m, h] = s(p), [g, _] = s({
+		element: null,
+		error: null,
+		renderMs: 0
+	}), [v, y] = s(null), [b, x] = s([]), [S, C] = s(!1), [w, T] = s(0), E = o(null), D = o(null), O = i((e) => {
+		y(null), _(H(e, c));
+	}, [c]);
+	a(() => (D.current && clearTimeout(D.current), D.current = setTimeout(() => O(m), 300), () => {
+		D.current && clearTimeout(D.current);
+	}), [m, O]), a(() => {
+		O(p);
+	}, []);
+	let k = i((e) => {
+		let t = e.target.value;
+		h(t);
+		let n = K(t);
+		n.length >= 2 ? x(q(n, 4)) : x([]);
+	}, []), A = i((e) => {
+		let t = f[e];
+		t && (T(e), h(t.code), x([]));
+	}, [f]), j = i(async () => {
+		try {
+			await navigator.clipboard.writeText(m), C(!0), setTimeout(() => C(!1), 1500);
+		} catch {}
+	}, [m]), M = i(() => {
+		h(p), T(0), x([]);
+	}, [p]), N = i((e) => {
+		let t = K(m);
+		t && h((n) => n.slice(0, n.lastIndexOf(t)) + e), x([]);
+	}, [m]), P = g.error !== null || v !== null, F = g.error ?? v ?? "", I = d.bg, L = d.surfaceAlt, R = d.border, V = d.surface, W = {
+		width: "50%",
+		display: "flex",
+		flexDirection: "column",
+		borderRight: `1px solid ${R}`,
+		position: "relative"
+	}, G = {
+		display: "flex",
+		alignItems: "center",
+		gap: "6px",
+		padding: "6px 10px",
+		borderBottom: `1px solid ${R}`,
+		backgroundColor: d.surface,
+		flexWrap: "wrap"
+	}, J = {
+		padding: "3px 10px",
+		borderRadius: "6px",
+		border: `1px solid ${R}`,
+		backgroundColor: "transparent",
+		color: d.textMuted,
+		fontSize: "11px",
+		fontWeight: 600,
+		cursor: "pointer",
+		fontFamily: "inherit",
+		transition: "color 0.15s, border-color 0.15s"
+	};
+	return /* @__PURE__ */ u("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			border: `1px solid ${R}`,
+			borderRadius: "12px",
+			overflow: "hidden",
+			backgroundColor: I,
+			fontFamily: "inherit",
+			boxSizing: "border-box",
+			position: "relative"
+		},
+		children: [
+			/* @__PURE__ */ u("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "space-between",
+					padding: "8px 14px",
+					borderBottom: `1px solid ${R}`,
+					backgroundColor: d.surface
+				},
+				children: [/* @__PURE__ */ l("span", {
+					style: {
+						fontSize: "12px",
+						fontWeight: 700,
+						color: d.primary,
+						letterSpacing: "0.05em"
+					},
+					children: "⚛ TkxPlayground"
+				}), /* @__PURE__ */ l("span", {
+					style: {
+						fontSize: "10px",
+						color: d.textMuted
+					},
+					children: "Live JSX Preview"
+				})]
+			}),
+			/* @__PURE__ */ l("div", {
+				style: {
+					display: "flex",
+					gap: "4px",
+					padding: "6px 10px",
+					borderBottom: `1px solid ${R}`,
+					backgroundColor: d.surface,
+					overflowX: "auto"
+				},
+				children: f.map((e, t) => /* @__PURE__ */ l("button", {
+					onClick: () => A(t),
+					style: {
+						padding: "3px 10px",
+						borderRadius: "6px",
+						border: `1px solid ${t === w ? d.primary : R}`,
+						backgroundColor: t === w ? `${d.primary}20` : "transparent",
+						color: t === w ? d.primary : d.textMuted,
+						fontSize: "11px",
+						fontWeight: t === w ? 700 : 400,
+						cursor: "pointer",
+						whiteSpace: "nowrap",
+						fontFamily: "inherit",
+						transition: "all 0.15s"
+					},
+					children: e.label
+				}, t))
+			}),
+			/* @__PURE__ */ u("div", {
+				style: {
+					display: "flex",
+					height: `${r}px`
+				},
+				children: [/* @__PURE__ */ u("div", {
+					style: W,
+					children: [
+						/* @__PURE__ */ u("div", {
+							style: G,
+							children: [
+								/* @__PURE__ */ l("span", {
+									style: {
+										fontSize: "11px",
+										color: d.textMuted,
+										marginRight: "auto"
+									},
+									children: "editor.tsx"
+								}),
+								/* @__PURE__ */ l("button", {
+									onClick: j,
+									style: J,
+									title: "Copy code",
+									children: S ? "✓ Copied" : "⎘ Copy"
+								}),
+								/* @__PURE__ */ l("button", {
+									onClick: M,
+									style: J,
+									title: "Reset to default",
+									children: "↺ Reset"
+								})
+							]
+						}),
+						/* @__PURE__ */ u("div", {
+							style: {
+								position: "relative",
+								flex: 1,
+								overflow: "hidden"
+							},
+							children: [/* @__PURE__ */ l(U, {
+								code: m,
+								lineHeight: 18
+							}), /* @__PURE__ */ l("textarea", {
+								ref: E,
+								value: m,
+								onChange: k,
+								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: I,
+									color: d.text,
+									fontSize: "12px",
+									lineHeight: "18px",
+									fontFamily: "\"Fira Code\", \"Cascadia Code\", \"Consolas\", \"Courier New\", monospace",
+									boxSizing: "border-box",
+									overflowY: "auto",
+									tabSize: 2
+								}
+							})]
+						}),
+						b.length > 0 && /* @__PURE__ */ u("div", {
+							style: {
+								position: "absolute",
+								bottom: "40px",
+								left: "44px",
+								zIndex: 10,
+								backgroundColor: d.surface,
+								border: `1px solid ${d.primary}44`,
+								borderRadius: "8px",
+								overflow: "hidden",
+								boxShadow: "0 4px 16px rgba(0,0,0,0.3)",
+								minWidth: "180px"
+							},
+							children: [/* @__PURE__ */ l("div", {
+								style: {
+									padding: "4px 10px 4px",
+									fontSize: "10px",
+									color: d.primary,
+									fontWeight: 700,
+									borderBottom: `1px solid ${R}`,
+									letterSpacing: "0.05em"
+								},
+								children: "⚛ Quantum Suggestions"
+							}), b.map((e) => /* @__PURE__ */ u("button", {
+								onClick: () => N(e.name),
+								style: {
+									display: "flex",
+									alignItems: "center",
+									justifyContent: "space-between",
+									width: "100%",
+									padding: "6px 10px",
+									border: "none",
+									backgroundColor: "transparent",
+									color: d.text,
+									fontSize: "12px",
+									fontFamily: "\"Fira Code\", monospace",
+									cursor: "pointer",
+									textAlign: "left",
+									gap: "12px"
+								},
+								children: [/* @__PURE__ */ l("span", { children: e.name }), /* @__PURE__ */ u("span", {
+									style: {
+										fontSize: "10px",
+										color: d.textMuted,
+										flexShrink: 0
+									},
+									children: [Math.round(e.amplitude * 100), "%"]
+								})]
+							}, e.name))]
+						})
+					]
+				}), /* @__PURE__ */ u("div", {
+					style: {
+						width: "50%",
+						display: "flex",
+						flexDirection: "column"
+					},
+					children: [/* @__PURE__ */ l("div", {
+						style: {
+							padding: "6px 10px",
+							borderBottom: `1px solid ${R}`,
+							backgroundColor: d.surface,
+							fontSize: "11px",
+							color: d.textMuted,
+							fontWeight: 600
+						},
+						children: "Preview"
+					}), /* @__PURE__ */ l("div", {
+						style: {
+							flex: 1,
+							overflow: "auto",
+							backgroundColor: L,
+							position: "relative"
+						},
+						children: P ? /* @__PURE__ */ u("div", {
+							style: {
+								padding: "16px",
+								color: d.danger,
+								fontFamily: "\"Fira Code\", monospace",
+								fontSize: "12px",
+								lineHeight: 1.6,
+								whiteSpace: "pre-wrap",
+								wordBreak: "break-word"
+							},
+							children: [/* @__PURE__ */ u("div", {
+								style: {
+									marginBottom: "8px",
+									fontWeight: 700,
+									display: "flex",
+									alignItems: "center",
+									gap: "6px"
+								},
+								children: [/* @__PURE__ */ l("svg", {
+									width: "14",
+									height: "14",
+									viewBox: "0 0 24 24",
+									fill: "currentColor",
+									"aria-hidden": "true",
+									children: /* @__PURE__ */ l("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"]
+							}), F]
+						}) : /* @__PURE__ */ l(B, {
+							onError: y,
+							children: /* @__PURE__ */ l("div", {
+								style: { minHeight: "100%" },
+								children: g.element
+							})
+						})
+					})]
+				})]
+			}),
+			/* @__PURE__ */ u("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					gap: "16px",
+					padding: "4px 12px",
+					backgroundColor: V,
+					borderTop: `1px solid ${R}`,
+					fontSize: "11px",
+					color: d.textMuted
+				},
+				children: [
+					/* @__PURE__ */ u("span", {
+						style: {
+							display: "flex",
+							alignItems: "center",
+							gap: "4px",
+							color: P ? d.danger : d.success,
+							fontWeight: 600
+						},
+						children: [/* @__PURE__ */ l("span", { style: {
+							width: "6px",
+							height: "6px",
+							borderRadius: "50%",
+							backgroundColor: P ? d.danger : d.success,
+							display: "inline-block"
+						} }), P ? "Error" : "OK"]
+					}),
+					/* @__PURE__ */ u("span", { children: [
+						"⏱ ",
+						g.renderMs,
+						" ms"
+					] }),
+					/* @__PURE__ */ u("span", { children: [m.split("\n").length, " lines"] }),
+					/* @__PURE__ */ u("span", { children: [m.length, " chars"] }),
+					b.length > 0 && /* @__PURE__ */ u("span", {
+						style: {
+							marginLeft: "auto",
+							color: d.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
-};
+J.displayName = "TkxPlayground";
+//#endregion
+export { g as AmplitudeAmplifier, D as QuantumAI, m as QuantumAnnealer, h as QuantumBoltzmannMachine, p as QuantumRegister, f as Qubit, J as TkxPlayground, N as TkxQuantumForm, R as TkxThemeBuilder, y as hslToHex, v as inferFieldIntelligence, E as optimizeThemeColors };