json-schema-builder-react 0.0.4 → 0.0.5

package/dist-lib/index.js

@@ -1,134 +1,134 @@
-import { jsx as n, jsxs as l, Fragment as et } from "react/jsx-runtime";
-import * as I from "react";
-import { createContext as tt, useContext as rt, useState as V, useEffect as be, useMemo as nt, useCallback as H } from "react";
-import { Slot as ot } from "@radix-ui/react-slot";
-import { X as at, ChevronDown as ye, Check as Re, ChevronUp as it, Type as st, Hash as Se, CheckSquare as lt, Braces as dt, List as ct, FileText as mt, Plus as re, Pencil as ut, Trash2 as Le, CheckCircle2 as pt, Copy as ht, Download as ft, ChevronRight as gt, Moon as bt, Sun as yt, Upload as vt } from "lucide-react";
-import * as ne from "@radix-ui/react-tooltip";
+import { jsx as n, jsxs as c, Fragment as Ee } from "react/jsx-runtime";
+import * as S from "react";
+import { createContext as nt, useContext as at, useState as B, useEffect as be, useMemo as ot, useCallback as _ } from "react";
+import { Slot as it } from "@radix-ui/react-slot";
+import { ChevronDown as ye, Check as Oe, ChevronUp as st, X as lt, Type as dt, Hash as ze, CheckSquare as ct, Braces as mt, List as ut, FileText as pt, Plus as Q, Pencil as ht, Trash2 as De, CheckCircle2 as ft, Copy as gt, Download as bt, ChevronRight as yt, Moon as vt, Sun as xt, Upload as wt } from "lucide-react";
+import * as U from "@radix-ui/react-tooltip";
+import * as z from "@radix-ui/react-select";
 import * as D from "@radix-ui/react-dialog";
-import * as qe from "@radix-ui/react-label";
-import * as P from "@radix-ui/react-select";
+import * as Me from "@radix-ui/react-label";
 import * as se from "@radix-ui/react-checkbox";
-function Ee(e) {
-  var r, t, a = "";
-  if (typeof e == "string" || typeof e == "number") a += e;
+function qe(e) {
+  var r, t, o = "";
+  if (typeof e == "string" || typeof e == "number") o += e;
   else if (typeof e == "object") if (Array.isArray(e)) {
-    var o = e.length;
-    for (r = 0; r < o; r++) e[r] && (t = Ee(e[r])) && (a && (a += " "), a += t);
-  } else for (t in e) e[t] && (a && (a += " "), a += t);
-  return a;
+    var a = e.length;
+    for (r = 0; r < a; r++) e[r] && (t = qe(e[r])) && (o && (o += " "), o += t);
+  } else for (t in e) e[t] && (o && (o += " "), o += t);
+  return o;
 }
-function Me() {
-  for (var e, r, t = 0, a = "", o = arguments.length; t < o; t++) (e = arguments[t]) && (r = Ee(e)) && (a && (a += " "), a += r);
-  return a;
+function Fe() {
+  for (var e, r, t = 0, o = "", a = arguments.length; t < a; t++) (e = arguments[t]) && (r = qe(e)) && (o && (o += " "), o += r);
+  return o;
 }
-const Ie = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, Te = Me, Fe = (e, r) => (t) => {
-  var a;
-  if ((r == null ? void 0 : r.variants) == null) return Te(e, t == null ? void 0 : t.class, t == null ? void 0 : t.className);
-  const { variants: o, defaultVariants: i } = r, s = Object.keys(o).map((d) => {
-    const g = t == null ? void 0 : t[d], N = i == null ? void 0 : i[d];
-    if (g === null) return null;
-    const x = Ie(g) || Ie(N);
-    return o[d][x];
-  }), c = t && Object.entries(t).reduce((d, g) => {
-    let [N, x] = g;
-    return x === void 0 || (d[N] = x), d;
-  }, {}), m = r == null || (a = r.compoundVariants) === null || a === void 0 ? void 0 : a.reduce((d, g) => {
-    let { class: N, className: x, ...S } = g;
-    return Object.entries(S).every((y) => {
-      let [p, h] = y;
-      return Array.isArray(h) ? h.includes({
+const je = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, Pe = Fe, Be = (e, r) => (t) => {
+  var o;
+  if ((r == null ? void 0 : r.variants) == null) return Pe(e, t == null ? void 0 : t.class, t == null ? void 0 : t.className);
+  const { variants: a, defaultVariants: i } = r, s = Object.keys(a).map((m) => {
+    const d = t == null ? void 0 : t[m], f = i == null ? void 0 : i[m];
+    if (d === null) return null;
+    const g = je(d) || je(f);
+    return a[m][g];
+  }), l = t && Object.entries(t).reduce((m, d) => {
+    let [f, g] = d;
+    return g === void 0 || (m[f] = g), m;
+  }, {}), h = r == null || (o = r.compoundVariants) === null || o === void 0 ? void 0 : o.reduce((m, d) => {
+    let { class: f, className: g, ...w } = d;
+    return Object.entries(w).every((v) => {
+      let [x, p] = v;
+      return Array.isArray(p) ? p.includes({
         ...i,
-        ...c
-      }[p]) : {
+        ...l
+      }[x]) : {
         ...i,
-        ...c
-      }[p] === h;
+        ...l
+      }[x] === p;
     }) ? [
-      ...d,
-      N,
-      x
-    ] : d;
+      ...m,
+      f,
+      g
+    ] : m;
   }, []);
-  return Te(e, s, m, t == null ? void 0 : t.class, t == null ? void 0 : t.className);
-}, ve = "-", xt = (e) => {
-  const r = Nt(e), {
+  return Pe(e, s, h, t == null ? void 0 : t.class, t == null ? void 0 : t.className);
+}, ve = "-", Nt = (e) => {
+  const r = kt(e), {
     conflictingClassGroups: t,
-    conflictingClassGroupModifiers: a
+    conflictingClassGroupModifiers: o
   } = e;
   return {
     getClassGroupId: (s) => {
-      const c = s.split(ve);
-      return c[0] === "" && c.length !== 1 && c.shift(), Oe(c, r) || wt(s);
+      const l = s.split(ve);
+      return l[0] === "" && l.length !== 1 && l.shift(), Ge(l, r) || Ct(s);
     },
-    getConflictingClassGroupIds: (s, c) => {
-      const m = t[s] || [];
-      return c && a[s] ? [...m, ...a[s]] : m;
+    getConflictingClassGroupIds: (s, l) => {
+      const h = t[s] || [];
+      return l && o[s] ? [...h, ...o[s]] : h;
     }
   };
-}, Oe = (e, r) => {
+}, Ge = (e, r) => {
   var s;
   if (e.length === 0)
     return r.classGroupId;
-  const t = e[0], a = r.nextPart.get(t), o = a ? Oe(e.slice(1), a) : void 0;
-  if (o)
-    return o;
+  const t = e[0], o = r.nextPart.get(t), a = o ? Ge(e.slice(1), o) : void 0;
+  if (a)
+    return a;
   if (r.validators.length === 0)
     return;
   const i = e.join(ve);
   return (s = r.validators.find(({
-    validator: c
-  }) => c(i))) == null ? void 0 : s.classGroupId;
-}, ze = /^\[(.+)\]$/, wt = (e) => {
-  if (ze.test(e)) {
-    const r = ze.exec(e)[1], t = r == null ? void 0 : r.substring(0, r.indexOf(":"));
+    validator: l
+  }) => l(i))) == null ? void 0 : s.classGroupId;
+}, Re = /^\[(.+)\]$/, Ct = (e) => {
+  if (Re.test(e)) {
+    const r = Re.exec(e)[1], t = r == null ? void 0 : r.substring(0, r.indexOf(":"));
     if (t)
       return "arbitrary.." + t;
   }
-}, Nt = (e) => {
+}, kt = (e) => {
   const {
     theme: r,
     prefix: t
-  } = e, a = {
+  } = e, o = {
     nextPart: /* @__PURE__ */ new Map(),
     validators: []
   };
-  return kt(Object.entries(e.classGroups), t).forEach(([i, s]) => {
-    le(s, a, i, r);
-  }), a;
-}, le = (e, r, t, a) => {
-  e.forEach((o) => {
-    if (typeof o == "string") {
-      const i = o === "" ? r : Pe(r, o);
+  return St(Object.entries(e.classGroups), t).forEach(([i, s]) => {
+    le(s, o, i, r);
+  }), o;
+}, le = (e, r, t, o) => {
+  e.forEach((a) => {
+    if (typeof a == "string") {
+      const i = a === "" ? r : Ae(r, a);
       i.classGroupId = t;
       return;
     }
-    if (typeof o == "function") {
-      if (Ct(o)) {
-        le(o(a), r, t, a);
+    if (typeof a == "function") {
+      if (It(a)) {
+        le(a(o), r, t, o);
         return;
       }
       r.validators.push({
-        validator: o,
+        validator: a,
         classGroupId: t
       });
       return;
     }
-    Object.entries(o).forEach(([i, s]) => {
-      le(s, Pe(r, i), t, a);
+    Object.entries(a).forEach(([i, s]) => {
+      le(s, Ae(r, i), t, o);
     });
   });
-}, Pe = (e, r) => {
+}, Ae = (e, r) => {
   let t = e;
-  return r.split(ve).forEach((a) => {
-    t.nextPart.has(a) || t.nextPart.set(a, {
+  return r.split(ve).forEach((o) => {
+    t.nextPart.has(o) || t.nextPart.set(o, {
       nextPart: /* @__PURE__ */ new Map(),
       validators: []
-    }), t = t.nextPart.get(a);
+    }), t = t.nextPart.get(o);
   }), t;
-}, Ct = (e) => e.isThemeGetter, kt = (e, r) => r ? e.map(([t, a]) => {
-  const o = a.map((i) => typeof i == "string" ? r + i : typeof i == "object" ? Object.fromEntries(Object.entries(i).map(([s, c]) => [r + s, c])) : i);
-  return [t, o];
-}) : e, St = (e) => {
+}, It = (e) => e.isThemeGetter, St = (e, r) => r ? e.map(([t, o]) => {
+  const a = o.map((i) => typeof i == "string" ? r + i : typeof i == "object" ? Object.fromEntries(Object.entries(i).map(([s, l]) => [r + s, l])) : i);
+  return [t, a];
+}) : e, Tt = (e) => {
   if (e < 1)
     return {
       get: () => {
@@ -136,179 +136,179 @@ const Ie = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, Te = Me, F
       set: () => {
       }
     };
-  let r = 0, t = /* @__PURE__ */ new Map(), a = /* @__PURE__ */ new Map();
-  const o = (i, s) => {
-    t.set(i, s), r++, r > e && (r = 0, a = t, t = /* @__PURE__ */ new Map());
+  let r = 0, t = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map();
+  const a = (i, s) => {
+    t.set(i, s), r++, r > e && (r = 0, o = t, t = /* @__PURE__ */ new Map());
   };
   return {
     get(i) {
       let s = t.get(i);
       if (s !== void 0)
         return s;
-      if ((s = a.get(i)) !== void 0)
-        return o(i, s), s;
+      if ((s = o.get(i)) !== void 0)
+        return a(i, s), s;
     },
     set(i, s) {
-      t.has(i) ? t.set(i, s) : o(i, s);
+      t.has(i) ? t.set(i, s) : a(i, s);
     }
   };
-}, Ve = "!", It = (e) => {
+}, Ve = "!", zt = (e) => {
   const {
     separator: r,
     experimentalParseClassName: t
-  } = e, a = r.length === 1, o = r[0], i = r.length, s = (c) => {
-    const m = [];
-    let d = 0, g = 0, N;
-    for (let h = 0; h < c.length; h++) {
-      let v = c[h];
-      if (d === 0) {
-        if (v === o && (a || c.slice(h, h + i) === r)) {
-          m.push(c.slice(g, h)), g = h + i;
+  } = e, o = r.length === 1, a = r[0], i = r.length, s = (l) => {
+    const h = [];
+    let m = 0, d = 0, f;
+    for (let p = 0; p < l.length; p++) {
+      let N = l[p];
+      if (m === 0) {
+        if (N === a && (o || l.slice(p, p + i) === r)) {
+          h.push(l.slice(d, p)), d = p + i;
           continue;
         }
-        if (v === "/") {
-          N = h;
+        if (N === "/") {
+          f = p;
           continue;
         }
       }
-      v === "[" ? d++ : v === "]" && d--;
+      N === "[" ? m++ : N === "]" && m--;
     }
-    const x = m.length === 0 ? c : c.substring(g), S = x.startsWith(Ve), y = S ? x.substring(1) : x, p = N && N > g ? N - g : void 0;
+    const g = h.length === 0 ? l : l.substring(d), w = g.startsWith(Ve), v = w ? g.substring(1) : g, x = f && f > d ? f - d : void 0;
     return {
-      modifiers: m,
-      hasImportantModifier: S,
-      baseClassName: y,
-      maybePostfixModifierPosition: p
+      modifiers: h,
+      hasImportantModifier: w,
+      baseClassName: v,
+      maybePostfixModifierPosition: x
     };
   };
-  return t ? (c) => t({
-    className: c,
+  return t ? (l) => t({
+    className: l,
     parseClassName: s
   }) : s;
-}, Tt = (e) => {
+}, jt = (e) => {
   if (e.length <= 1)
     return e;
   const r = [];
   let t = [];
-  return e.forEach((a) => {
-    a[0] === "[" ? (r.push(...t.sort(), a), t = []) : t.push(a);
+  return e.forEach((o) => {
+    o[0] === "[" ? (r.push(...t.sort(), o), t = []) : t.push(o);
   }), r.push(...t.sort()), r;
-}, zt = (e) => ({
-  cache: St(e.cacheSize),
-  parseClassName: It(e),
-  ...xt(e)
-}), Pt = /\s+/, At = (e, r) => {
+}, Pt = (e) => ({
+  cache: Tt(e.cacheSize),
+  parseClassName: zt(e),
+  ...Nt(e)
+}), Rt = /\s+/, At = (e, r) => {
   const {
     parseClassName: t,
-    getClassGroupId: a,
-    getConflictingClassGroupIds: o
-  } = r, i = [], s = e.trim().split(Pt);
-  let c = "";
-  for (let m = s.length - 1; m >= 0; m -= 1) {
-    const d = s[m], {
-      modifiers: g,
-      hasImportantModifier: N,
-      baseClassName: x,
-      maybePostfixModifierPosition: S
-    } = t(d);
-    let y = !!S, p = a(y ? x.substring(0, S) : x);
-    if (!p) {
-      if (!y) {
-        c = d + (c.length > 0 ? " " + c : c);
+    getClassGroupId: o,
+    getConflictingClassGroupIds: a
+  } = r, i = [], s = e.trim().split(Rt);
+  let l = "";
+  for (let h = s.length - 1; h >= 0; h -= 1) {
+    const m = s[h], {
+      modifiers: d,
+      hasImportantModifier: f,
+      baseClassName: g,
+      maybePostfixModifierPosition: w
+    } = t(m);
+    let v = !!w, x = o(v ? g.substring(0, w) : g);
+    if (!x) {
+      if (!v) {
+        l = m + (l.length > 0 ? " " + l : l);
         continue;
       }
-      if (p = a(x), !p) {
-        c = d + (c.length > 0 ? " " + c : c);
+      if (x = o(g), !x) {
+        l = m + (l.length > 0 ? " " + l : l);
         continue;
       }
-      y = !1;
+      v = !1;
     }
-    const h = Tt(g).join(":"), v = N ? h + Ve : h, T = v + p;
-    if (i.includes(T))
+    const p = jt(d).join(":"), N = f ? p + Ve : p, b = N + x;
+    if (i.includes(b))
       continue;
-    i.push(T);
-    const u = o(p, y);
-    for (let A = 0; A < u.length; ++A) {
-      const O = u[A];
-      i.push(v + O);
+    i.push(b);
+    const A = a(x, v);
+    for (let u = 0; u < A.length; ++u) {
+      const j = A[u];
+      i.push(N + j);
     }
-    c = d + (c.length > 0 ? " " + c : c);
+    l = m + (l.length > 0 ? " " + l : l);
   }
-  return c;
+  return l;
 };
-function jt() {
-  let e = 0, r, t, a = "";
+function Lt() {
+  let e = 0, r, t, o = "";
   for (; e < arguments.length; )
-    (r = arguments[e++]) && (t = De(r)) && (a && (a += " "), a += t);
-  return a;
+    (r = arguments[e++]) && (t = $e(r)) && (o && (o += " "), o += t);
+  return o;
 }
-const De = (e) => {
+const $e = (e) => {
   if (typeof e == "string")
     return e;
   let r, t = "";
-  for (let a = 0; a < e.length; a++)
-    e[a] && (r = De(e[a])) && (t && (t += " "), t += r);
+  for (let o = 0; o < e.length; o++)
+    e[o] && (r = $e(e[o])) && (t && (t += " "), t += r);
   return t;
 };
-function Rt(e, ...r) {
-  let t, a, o, i = s;
-  function s(m) {
-    const d = r.reduce((g, N) => N(g), e());
-    return t = zt(d), a = t.cache.get, o = t.cache.set, i = c, c(m);
+function Et(e, ...r) {
+  let t, o, a, i = s;
+  function s(h) {
+    const m = r.reduce((d, f) => f(d), e());
+    return t = Pt(m), o = t.cache.get, a = t.cache.set, i = l, l(h);
   }
-  function c(m) {
-    const d = a(m);
-    if (d)
-      return d;
-    const g = At(m, t);
-    return o(m, g), g;
+  function l(h) {
+    const m = o(h);
+    if (m)
+      return m;
+    const d = At(h, t);
+    return a(h, d), d;
   }
   return function() {
-    return i(jt.apply(null, arguments));
+    return i(Lt.apply(null, arguments));
   };
 }
-const k = (e) => {
+const I = (e) => {
   const r = (t) => t[e] || [];
   return r.isThemeGetter = !0, r;
-}, Ge = /^\[(?:([a-z-]+):)?(.+)\]$/i, Lt = /^\d+\/\d+$/, qt = /* @__PURE__ */ new Set(["px", "full", "screen"]), Et = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, Mt = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, Ft = /^(rgba?|hsla?|hwb|(ok)?(lab|lch))\(.+\)$/, Ot = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Vt = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, $ = (e) => Z(e) || qt.has(e) || Lt.test(e), U = (e) => Q(e, "length", Wt), Z = (e) => !!e && !Number.isNaN(Number(e)), ie = (e) => Q(e, "number", Z), ee = (e) => !!e && Number.isInteger(Number(e)), Dt = (e) => e.endsWith("%") && Z(e.slice(0, -1)), b = (e) => Ge.test(e), W = (e) => Et.test(e), Gt = /* @__PURE__ */ new Set(["length", "size", "percentage"]), Bt = (e) => Q(e, Gt, Be), $t = (e) => Q(e, "position", Be), _t = /* @__PURE__ */ new Set(["image", "url"]), Jt = (e) => Q(e, _t, Ht), Ut = (e) => Q(e, "", Kt), te = () => !0, Q = (e, r, t) => {
-  const a = Ge.exec(e);
-  return a ? a[1] ? typeof r == "string" ? a[1] === r : r.has(a[1]) : t(a[2]) : !1;
-}, Wt = (e) => (
+}, _e = /^\[(?:([a-z-]+):)?(.+)\]$/i, Ot = /^\d+\/\d+$/, Dt = /* @__PURE__ */ new Set(["px", "full", "screen"]), Mt = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, qt = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, Ft = /^(rgba?|hsla?|hwb|(ok)?(lab|lch))\(.+\)$/, Bt = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Gt = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, F = (e) => J(e) || Dt.has(e) || Ot.test(e), G = (e) => W(e, "length", Ht), J = (e) => !!e && !Number.isNaN(Number(e)), ie = (e) => W(e, "number", J), X = (e) => !!e && Number.isInteger(Number(e)), Vt = (e) => e.endsWith("%") && J(e.slice(0, -1)), y = (e) => _e.test(e), V = (e) => Mt.test(e), $t = /* @__PURE__ */ new Set(["length", "size", "percentage"]), _t = (e) => W(e, $t, Ke), Kt = (e) => W(e, "position", Ke), Jt = /* @__PURE__ */ new Set(["image", "url"]), Ut = (e) => W(e, Jt, Zt), Wt = (e) => W(e, "", Xt), Z = () => !0, W = (e, r, t) => {
+  const o = _e.exec(e);
+  return o ? o[1] ? typeof r == "string" ? o[1] === r : r.has(o[1]) : t(o[2]) : !1;
+}, Ht = (e) => (
   // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
   // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
   // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
-  Mt.test(e) && !Ft.test(e)
-), Be = () => !1, Kt = (e) => Ot.test(e), Ht = (e) => Vt.test(e), Xt = () => {
-  const e = k("colors"), r = k("spacing"), t = k("blur"), a = k("brightness"), o = k("borderColor"), i = k("borderRadius"), s = k("borderSpacing"), c = k("borderWidth"), m = k("contrast"), d = k("grayscale"), g = k("hueRotate"), N = k("invert"), x = k("gap"), S = k("gradientColorStops"), y = k("gradientColorStopPositions"), p = k("inset"), h = k("margin"), v = k("opacity"), T = k("padding"), u = k("saturate"), A = k("scale"), O = k("sepia"), _ = k("skew"), M = k("space"), F = k("translate"), E = () => ["auto", "contain", "none"], J = () => ["auto", "hidden", "clip", "visible", "scroll"], G = () => ["auto", b, r], w = () => [b, r], f = () => ["", $, U], q = () => ["auto", Z, b], X = () => ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top"], K = () => ["solid", "dashed", "dotted", "double", "none"], Ce = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], ae = () => ["start", "end", "center", "between", "around", "evenly", "stretch"], Y = () => ["", "0", b], ke = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], B = () => [Z, b];
+  qt.test(e) && !Ft.test(e)
+), Ke = () => !1, Xt = (e) => Bt.test(e), Zt = (e) => Gt.test(e), Qt = () => {
+  const e = I("colors"), r = I("spacing"), t = I("blur"), o = I("brightness"), a = I("borderColor"), i = I("borderRadius"), s = I("borderSpacing"), l = I("borderWidth"), h = I("contrast"), m = I("grayscale"), d = I("hueRotate"), f = I("invert"), g = I("gap"), w = I("gradientColorStops"), v = I("gradientColorStopPositions"), x = I("inset"), p = I("margin"), N = I("opacity"), b = I("padding"), A = I("saturate"), u = I("scale"), j = I("sepia"), $ = I("skew"), K = I("space"), P = I("translate"), O = () => ["auto", "contain", "none"], M = () => ["auto", "hidden", "clip", "visible", "scroll"], Y = () => ["auto", y, r], k = () => [y, r], ke = () => ["", F, G], ee = () => ["auto", J, y], Ie = () => ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top"], te = () => ["solid", "dashed", "dotted", "double", "none"], Se = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], oe = () => ["start", "end", "center", "between", "around", "evenly", "stretch"], H = () => ["", "0", y], Te = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], q = () => [J, y];
   return {
     cacheSize: 500,
     separator: ":",
     theme: {
-      colors: [te],
-      spacing: [$, U],
-      blur: ["none", "", W, b],
-      brightness: B(),
+      colors: [Z],
+      spacing: [F, G],
+      blur: ["none", "", V, y],
+      brightness: q(),
       borderColor: [e],
-      borderRadius: ["none", "", "full", W, b],
-      borderSpacing: w(),
-      borderWidth: f(),
-      contrast: B(),
-      grayscale: Y(),
-      hueRotate: B(),
-      invert: Y(),
-      gap: w(),
+      borderRadius: ["none", "", "full", V, y],
+      borderSpacing: k(),
+      borderWidth: ke(),
+      contrast: q(),
+      grayscale: H(),
+      hueRotate: q(),
+      invert: H(),
+      gap: k(),
       gradientColorStops: [e],
-      gradientColorStopPositions: [Dt, U],
-      inset: G(),
-      margin: G(),
-      opacity: B(),
-      padding: w(),
-      saturate: B(),
-      scale: B(),
-      sepia: Y(),
-      skew: B(),
-      space: w(),
-      translate: w()
+      gradientColorStopPositions: [Vt, G],
+      inset: Y(),
+      margin: Y(),
+      opacity: q(),
+      padding: k(),
+      saturate: q(),
+      scale: q(),
+      sepia: H(),
+      skew: q(),
+      space: k(),
+      translate: k()
     },
     classGroups: {
       // Layout
@@ -317,7 +317,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/aspect-ratio
        */
       aspect: [{
-        aspect: ["auto", "square", "video", b]
+        aspect: ["auto", "square", "video", y]
       }],
       /**
        * Container
@@ -329,21 +329,21 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/columns
        */
       columns: [{
-        columns: [W]
+        columns: [V]
       }],
       /**
        * Break After
        * @see https://tailwindcss.com/docs/break-after
        */
       "break-after": [{
-        "break-after": ke()
+        "break-after": Te()
       }],
       /**
        * Break Before
        * @see https://tailwindcss.com/docs/break-before
        */
       "break-before": [{
-        "break-before": ke()
+        "break-before": Te()
       }],
       /**
        * Break Inside
@@ -402,49 +402,49 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/object-position
        */
       "object-position": [{
-        object: [...X(), b]
+        object: [...Ie(), y]
       }],
       /**
        * Overflow
        * @see https://tailwindcss.com/docs/overflow
        */
       overflow: [{
-        overflow: J()
+        overflow: M()
       }],
       /**
        * Overflow X
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-x": [{
-        "overflow-x": J()
+        "overflow-x": M()
       }],
       /**
        * Overflow Y
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-y": [{
-        "overflow-y": J()
+        "overflow-y": M()
       }],
       /**
        * Overscroll Behavior
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       overscroll: [{
-        overscroll: E()
+        overscroll: O()
       }],
       /**
        * Overscroll Behavior X
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       "overscroll-x": [{
-        "overscroll-x": E()
+        "overscroll-x": O()
       }],
       /**
        * Overscroll Behavior Y
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       "overscroll-y": [{
-        "overscroll-y": E()
+        "overscroll-y": O()
       }],
       /**
        * Position
@@ -456,63 +456,63 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       inset: [{
-        inset: [p]
+        inset: [x]
       }],
       /**
        * Right / Left
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       "inset-x": [{
-        "inset-x": [p]
+        "inset-x": [x]
       }],
       /**
        * Top / Bottom
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       "inset-y": [{
-        "inset-y": [p]
+        "inset-y": [x]
       }],
       /**
        * Start
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       start: [{
-        start: [p]
+        start: [x]
       }],
       /**
        * End
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       end: [{
-        end: [p]
+        end: [x]
       }],
       /**
        * Top
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       top: [{
-        top: [p]
+        top: [x]
       }],
       /**
        * Right
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       right: [{
-        right: [p]
+        right: [x]
       }],
       /**
        * Bottom
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       bottom: [{
-        bottom: [p]
+        bottom: [x]
       }],
       /**
        * Left
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       left: [{
-        left: [p]
+        left: [x]
       }],
       /**
        * Visibility
@@ -524,7 +524,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/z-index
        */
       z: [{
-        z: ["auto", ee, b]
+        z: ["auto", X, y]
       }],
       // Flexbox and Grid
       /**
@@ -532,7 +532,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/flex-basis
        */
       basis: [{
-        basis: G()
+        basis: Y()
       }],
       /**
        * Flex Direction
@@ -553,35 +553,35 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/flex
        */
       flex: [{
-        flex: ["1", "auto", "initial", "none", b]
+        flex: ["1", "auto", "initial", "none", y]
       }],
       /**
        * Flex Grow
        * @see https://tailwindcss.com/docs/flex-grow
        */
       grow: [{
-        grow: Y()
+        grow: H()
       }],
       /**
        * Flex Shrink
        * @see https://tailwindcss.com/docs/flex-shrink
        */
       shrink: [{
-        shrink: Y()
+        shrink: H()
       }],
       /**
        * Order
        * @see https://tailwindcss.com/docs/order
        */
       order: [{
-        order: ["first", "last", "none", ee, b]
+        order: ["first", "last", "none", X, y]
       }],
       /**
        * Grid Template Columns
        * @see https://tailwindcss.com/docs/grid-template-columns
        */
       "grid-cols": [{
-        "grid-cols": [te]
+        "grid-cols": [Z]
       }],
       /**
        * Grid Column Start / End
@@ -589,29 +589,29 @@ const k = (e) => {
        */
       "col-start-end": [{
         col: ["auto", {
-          span: ["full", ee, b]
-        }, b]
+          span: ["full", X, y]
+        }, y]
       }],
       /**
        * Grid Column Start
        * @see https://tailwindcss.com/docs/grid-column
        */
       "col-start": [{
-        "col-start": q()
+        "col-start": ee()
       }],
       /**
        * Grid Column End
        * @see https://tailwindcss.com/docs/grid-column
        */
       "col-end": [{
-        "col-end": q()
+        "col-end": ee()
       }],
       /**
        * Grid Template Rows
        * @see https://tailwindcss.com/docs/grid-template-rows
        */
       "grid-rows": [{
-        "grid-rows": [te]
+        "grid-rows": [Z]
       }],
       /**
        * Grid Row Start / End
@@ -619,22 +619,22 @@ const k = (e) => {
        */
       "row-start-end": [{
         row: ["auto", {
-          span: [ee, b]
-        }, b]
+          span: [X, y]
+        }, y]
       }],
       /**
        * Grid Row Start
        * @see https://tailwindcss.com/docs/grid-row
        */
       "row-start": [{
-        "row-start": q()
+        "row-start": ee()
       }],
       /**
        * Grid Row End
        * @see https://tailwindcss.com/docs/grid-row
        */
       "row-end": [{
-        "row-end": q()
+        "row-end": ee()
       }],
       /**
        * Grid Auto Flow
@@ -648,42 +648,42 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/grid-auto-columns
        */
       "auto-cols": [{
-        "auto-cols": ["auto", "min", "max", "fr", b]
+        "auto-cols": ["auto", "min", "max", "fr", y]
       }],
       /**
        * Grid Auto Rows
        * @see https://tailwindcss.com/docs/grid-auto-rows
        */
       "auto-rows": [{
-        "auto-rows": ["auto", "min", "max", "fr", b]
+        "auto-rows": ["auto", "min", "max", "fr", y]
       }],
       /**
        * Gap
        * @see https://tailwindcss.com/docs/gap
        */
       gap: [{
-        gap: [x]
+        gap: [g]
       }],
       /**
        * Gap X
        * @see https://tailwindcss.com/docs/gap
        */
       "gap-x": [{
-        "gap-x": [x]
+        "gap-x": [g]
       }],
       /**
        * Gap Y
        * @see https://tailwindcss.com/docs/gap
        */
       "gap-y": [{
-        "gap-y": [x]
+        "gap-y": [g]
       }],
       /**
        * Justify Content
        * @see https://tailwindcss.com/docs/justify-content
        */
       "justify-content": [{
-        justify: ["normal", ...ae()]
+        justify: ["normal", ...oe()]
       }],
       /**
        * Justify Items
@@ -704,7 +704,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/align-content
        */
       "align-content": [{
-        content: ["normal", ...ae(), "baseline"]
+        content: ["normal", ...oe(), "baseline"]
       }],
       /**
        * Align Items
@@ -725,7 +725,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/place-content
        */
       "place-content": [{
-        "place-content": [...ae(), "baseline"]
+        "place-content": [...oe(), "baseline"]
       }],
       /**
        * Place Items
@@ -747,133 +747,133 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/padding
        */
       p: [{
-        p: [T]
+        p: [b]
       }],
       /**
        * Padding X
        * @see https://tailwindcss.com/docs/padding
        */
       px: [{
-        px: [T]
+        px: [b]
       }],
       /**
        * Padding Y
        * @see https://tailwindcss.com/docs/padding
        */
       py: [{
-        py: [T]
+        py: [b]
       }],
       /**
        * Padding Start
        * @see https://tailwindcss.com/docs/padding
        */
       ps: [{
-        ps: [T]
+        ps: [b]
       }],
       /**
        * Padding End
        * @see https://tailwindcss.com/docs/padding
        */
       pe: [{
-        pe: [T]
+        pe: [b]
       }],
       /**
        * Padding Top
        * @see https://tailwindcss.com/docs/padding
        */
       pt: [{
-        pt: [T]
+        pt: [b]
       }],
       /**
        * Padding Right
        * @see https://tailwindcss.com/docs/padding
        */
       pr: [{
-        pr: [T]
+        pr: [b]
       }],
       /**
        * Padding Bottom
        * @see https://tailwindcss.com/docs/padding
        */
       pb: [{
-        pb: [T]
+        pb: [b]
       }],
       /**
        * Padding Left
        * @see https://tailwindcss.com/docs/padding
        */
       pl: [{
-        pl: [T]
+        pl: [b]
       }],
       /**
        * Margin
        * @see https://tailwindcss.com/docs/margin
        */
       m: [{
-        m: [h]
+        m: [p]
       }],
       /**
        * Margin X
        * @see https://tailwindcss.com/docs/margin
        */
       mx: [{
-        mx: [h]
+        mx: [p]
       }],
       /**
        * Margin Y
        * @see https://tailwindcss.com/docs/margin
        */
       my: [{
-        my: [h]
+        my: [p]
       }],
       /**
        * Margin Start
        * @see https://tailwindcss.com/docs/margin
        */
       ms: [{
-        ms: [h]
+        ms: [p]
       }],
       /**
        * Margin End
        * @see https://tailwindcss.com/docs/margin
        */
       me: [{
-        me: [h]
+        me: [p]
       }],
       /**
        * Margin Top
        * @see https://tailwindcss.com/docs/margin
        */
       mt: [{
-        mt: [h]
+        mt: [p]
       }],
       /**
        * Margin Right
        * @see https://tailwindcss.com/docs/margin
        */
       mr: [{
-        mr: [h]
+        mr: [p]
       }],
       /**
        * Margin Bottom
        * @see https://tailwindcss.com/docs/margin
        */
       mb: [{
-        mb: [h]
+        mb: [p]
       }],
       /**
        * Margin Left
        * @see https://tailwindcss.com/docs/margin
        */
       ml: [{
-        ml: [h]
+        ml: [p]
       }],
       /**
        * Space Between X
        * @see https://tailwindcss.com/docs/space
        */
       "space-x": [{
-        "space-x": [M]
+        "space-x": [K]
       }],
       /**
        * Space Between X Reverse
@@ -885,7 +885,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/space
        */
       "space-y": [{
-        "space-y": [M]
+        "space-y": [K]
       }],
       /**
        * Space Between Y Reverse
@@ -898,51 +898,51 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/width
        */
       w: [{
-        w: ["auto", "min", "max", "fit", "svw", "lvw", "dvw", b, r]
+        w: ["auto", "min", "max", "fit", "svw", "lvw", "dvw", y, r]
       }],
       /**
        * Min-Width
        * @see https://tailwindcss.com/docs/min-width
        */
       "min-w": [{
-        "min-w": [b, r, "min", "max", "fit"]
+        "min-w": [y, r, "min", "max", "fit"]
       }],
       /**
        * Max-Width
        * @see https://tailwindcss.com/docs/max-width
        */
       "max-w": [{
-        "max-w": [b, r, "none", "full", "min", "max", "fit", "prose", {
-          screen: [W]
-        }, W]
+        "max-w": [y, r, "none", "full", "min", "max", "fit", "prose", {
+          screen: [V]
+        }, V]
       }],
       /**
        * Height
        * @see https://tailwindcss.com/docs/height
        */
       h: [{
-        h: [b, r, "auto", "min", "max", "fit", "svh", "lvh", "dvh"]
+        h: [y, r, "auto", "min", "max", "fit", "svh", "lvh", "dvh"]
       }],
       /**
        * Min-Height
        * @see https://tailwindcss.com/docs/min-height
        */
       "min-h": [{
-        "min-h": [b, r, "min", "max", "fit", "svh", "lvh", "dvh"]
+        "min-h": [y, r, "min", "max", "fit", "svh", "lvh", "dvh"]
       }],
       /**
        * Max-Height
        * @see https://tailwindcss.com/docs/max-height
        */
       "max-h": [{
-        "max-h": [b, r, "min", "max", "fit", "svh", "lvh", "dvh"]
+        "max-h": [y, r, "min", "max", "fit", "svh", "lvh", "dvh"]
       }],
       /**
        * Size
        * @see https://tailwindcss.com/docs/size
        */
       size: [{
-        size: [b, r, "auto", "min", "max", "fit"]
+        size: [y, r, "auto", "min", "max", "fit"]
       }],
       // Typography
       /**
@@ -950,7 +950,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/font-size
        */
       "font-size": [{
-        text: ["base", W, U]
+        text: ["base", V, G]
       }],
       /**
        * Font Smoothing
@@ -974,7 +974,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/font-family
        */
       "font-family": [{
-        font: [te]
+        font: [Z]
       }],
       /**
        * Font Variant Numeric
@@ -1011,35 +1011,35 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/letter-spacing
        */
       tracking: [{
-        tracking: ["tighter", "tight", "normal", "wide", "wider", "widest", b]
+        tracking: ["tighter", "tight", "normal", "wide", "wider", "widest", y]
       }],
       /**
        * Line Clamp
        * @see https://tailwindcss.com/docs/line-clamp
        */
       "line-clamp": [{
-        "line-clamp": ["none", Z, ie]
+        "line-clamp": ["none", J, ie]
       }],
       /**
        * Line Height
        * @see https://tailwindcss.com/docs/line-height
        */
       leading: [{
-        leading: ["none", "tight", "snug", "normal", "relaxed", "loose", $, b]
+        leading: ["none", "tight", "snug", "normal", "relaxed", "loose", F, y]
       }],
       /**
        * List Style Image
        * @see https://tailwindcss.com/docs/list-style-image
        */
       "list-image": [{
-        "list-image": ["none", b]
+        "list-image": ["none", y]
       }],
       /**
        * List Style Type
        * @see https://tailwindcss.com/docs/list-style-type
        */
       "list-style-type": [{
-        list: ["none", "disc", "decimal", b]
+        list: ["none", "disc", "decimal", y]
       }],
       /**
        * List Style Position
@@ -1061,7 +1061,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/placeholder-opacity
        */
       "placeholder-opacity": [{
-        "placeholder-opacity": [v]
+        "placeholder-opacity": [N]
       }],
       /**
        * Text Alignment
@@ -1082,7 +1082,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/text-opacity
        */
       "text-opacity": [{
-        "text-opacity": [v]
+        "text-opacity": [N]
       }],
       /**
        * Text Decoration
@@ -1094,21 +1094,21 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/text-decoration-style
        */
       "text-decoration-style": [{
-        decoration: [...K(), "wavy"]
+        decoration: [...te(), "wavy"]
       }],
       /**
        * Text Decoration Thickness
        * @see https://tailwindcss.com/docs/text-decoration-thickness
        */
       "text-decoration-thickness": [{
-        decoration: ["auto", "from-font", $, U]
+        decoration: ["auto", "from-font", F, G]
       }],
       /**
        * Text Underline Offset
        * @see https://tailwindcss.com/docs/text-underline-offset
        */
       "underline-offset": [{
-        "underline-offset": ["auto", $, b]
+        "underline-offset": ["auto", F, y]
       }],
       /**
        * Text Decoration Color
@@ -1139,14 +1139,14 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/text-indent
        */
       indent: [{
-        indent: w()
+        indent: k()
       }],
       /**
        * Vertical Alignment
        * @see https://tailwindcss.com/docs/vertical-align
        */
       "vertical-align": [{
-        align: ["baseline", "top", "middle", "bottom", "text-top", "text-bottom", "sub", "super", b]
+        align: ["baseline", "top", "middle", "bottom", "text-top", "text-bottom", "sub", "super", y]
       }],
       /**
        * Whitespace
@@ -1174,7 +1174,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/content
        */
       content: [{
-        content: ["none", b]
+        content: ["none", y]
       }],
       // Backgrounds
       /**
@@ -1197,7 +1197,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/background-opacity
        */
       "bg-opacity": [{
-        "bg-opacity": [v]
+        "bg-opacity": [N]
       }],
       /**
        * Background Origin
@@ -1211,7 +1211,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/background-position
        */
       "bg-position": [{
-        bg: [...X(), $t]
+        bg: [...Ie(), Kt]
       }],
       /**
        * Background Repeat
@@ -1227,7 +1227,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/background-size
        */
       "bg-size": [{
-        bg: ["auto", "cover", "contain", Bt]
+        bg: ["auto", "cover", "contain", _t]
       }],
       /**
        * Background Image
@@ -1236,7 +1236,7 @@ const k = (e) => {
       "bg-image": [{
         bg: ["none", {
           "gradient-to": ["t", "tr", "r", "br", "b", "bl", "l", "tl"]
-        }, Jt]
+        }, Ut]
       }],
       /**
        * Background Color
@@ -1250,42 +1250,42 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-from-pos": [{
-        from: [y]
+        from: [v]
       }],
       /**
        * Gradient Color Stops Via Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-via-pos": [{
-        via: [y]
+        via: [v]
       }],
       /**
        * Gradient Color Stops To Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-to-pos": [{
-        to: [y]
+        to: [v]
       }],
       /**
        * Gradient Color Stops From
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-from": [{
-        from: [S]
+        from: [w]
       }],
       /**
        * Gradient Color Stops Via
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-via": [{
-        via: [S]
+        via: [w]
       }],
       /**
        * Gradient Color Stops To
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-to": [{
-        to: [S]
+        to: [w]
       }],
       // Borders
       /**
@@ -1398,84 +1398,84 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w": [{
-        border: [c]
+        border: [l]
       }],
       /**
        * Border Width X
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-x": [{
-        "border-x": [c]
+        "border-x": [l]
       }],
       /**
        * Border Width Y
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-y": [{
-        "border-y": [c]
+        "border-y": [l]
       }],
       /**
        * Border Width Start
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-s": [{
-        "border-s": [c]
+        "border-s": [l]
       }],
       /**
        * Border Width End
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-e": [{
-        "border-e": [c]
+        "border-e": [l]
       }],
       /**
        * Border Width Top
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-t": [{
-        "border-t": [c]
+        "border-t": [l]
       }],
       /**
        * Border Width Right
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-r": [{
-        "border-r": [c]
+        "border-r": [l]
       }],
       /**
        * Border Width Bottom
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-b": [{
-        "border-b": [c]
+        "border-b": [l]
       }],
       /**
        * Border Width Left
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-l": [{
-        "border-l": [c]
+        "border-l": [l]
       }],
       /**
        * Border Opacity
        * @see https://tailwindcss.com/docs/border-opacity
        */
       "border-opacity": [{
-        "border-opacity": [v]
+        "border-opacity": [N]
       }],
       /**
        * Border Style
        * @see https://tailwindcss.com/docs/border-style
        */
       "border-style": [{
-        border: [...K(), "hidden"]
+        border: [...te(), "hidden"]
       }],
       /**
        * Divide Width X
        * @see https://tailwindcss.com/docs/divide-width
        */
       "divide-x": [{
-        "divide-x": [c]
+        "divide-x": [l]
       }],
       /**
        * Divide Width X Reverse
@@ -1487,7 +1487,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/divide-width
        */
       "divide-y": [{
-        "divide-y": [c]
+        "divide-y": [l]
       }],
       /**
        * Divide Width Y Reverse
@@ -1499,105 +1499,105 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/divide-opacity
        */
       "divide-opacity": [{
-        "divide-opacity": [v]
+        "divide-opacity": [N]
       }],
       /**
        * Divide Style
        * @see https://tailwindcss.com/docs/divide-style
        */
       "divide-style": [{
-        divide: K()
+        divide: te()
       }],
       /**
        * Border Color
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color": [{
-        border: [o]
+        border: [a]
       }],
       /**
        * Border Color X
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-x": [{
-        "border-x": [o]
+        "border-x": [a]
       }],
       /**
        * Border Color Y
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-y": [{
-        "border-y": [o]
+        "border-y": [a]
       }],
       /**
        * Border Color S
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-s": [{
-        "border-s": [o]
+        "border-s": [a]
       }],
       /**
        * Border Color E
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-e": [{
-        "border-e": [o]
+        "border-e": [a]
       }],
       /**
        * Border Color Top
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-t": [{
-        "border-t": [o]
+        "border-t": [a]
       }],
       /**
        * Border Color Right
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-r": [{
-        "border-r": [o]
+        "border-r": [a]
       }],
       /**
        * Border Color Bottom
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-b": [{
-        "border-b": [o]
+        "border-b": [a]
       }],
       /**
        * Border Color Left
        * @see https://tailwindcss.com/docs/border-color
        */
       "border-color-l": [{
-        "border-l": [o]
+        "border-l": [a]
       }],
       /**
        * Divide Color
        * @see https://tailwindcss.com/docs/divide-color
        */
       "divide-color": [{
-        divide: [o]
+        divide: [a]
       }],
       /**
        * Outline Style
        * @see https://tailwindcss.com/docs/outline-style
        */
       "outline-style": [{
-        outline: ["", ...K()]
+        outline: ["", ...te()]
       }],
       /**
        * Outline Offset
        * @see https://tailwindcss.com/docs/outline-offset
        */
       "outline-offset": [{
-        "outline-offset": [$, b]
+        "outline-offset": [F, y]
       }],
       /**
        * Outline Width
        * @see https://tailwindcss.com/docs/outline-width
        */
       "outline-w": [{
-        outline: [$, U]
+        outline: [F, G]
       }],
       /**
        * Outline Color
@@ -1611,7 +1611,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/ring-width
        */
       "ring-w": [{
-        ring: f()
+        ring: ke()
       }],
       /**
        * Ring Width Inset
@@ -1630,14 +1630,14 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/ring-opacity
        */
       "ring-opacity": [{
-        "ring-opacity": [v]
+        "ring-opacity": [N]
       }],
       /**
        * Ring Offset Width
        * @see https://tailwindcss.com/docs/ring-offset-width
        */
       "ring-offset-w": [{
-        "ring-offset": [$, U]
+        "ring-offset": [F, G]
       }],
       /**
        * Ring Offset Color
@@ -1652,35 +1652,35 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/box-shadow
        */
       shadow: [{
-        shadow: ["", "inner", "none", W, Ut]
+        shadow: ["", "inner", "none", V, Wt]
       }],
       /**
        * Box Shadow Color
        * @see https://tailwindcss.com/docs/box-shadow-color
        */
       "shadow-color": [{
-        shadow: [te]
+        shadow: [Z]
       }],
       /**
        * Opacity
        * @see https://tailwindcss.com/docs/opacity
        */
       opacity: [{
-        opacity: [v]
+        opacity: [N]
       }],
       /**
        * Mix Blend Mode
        * @see https://tailwindcss.com/docs/mix-blend-mode
        */
       "mix-blend": [{
-        "mix-blend": [...Ce(), "plus-lighter", "plus-darker"]
+        "mix-blend": [...Se(), "plus-lighter", "plus-darker"]
       }],
       /**
        * Background Blend Mode
        * @see https://tailwindcss.com/docs/background-blend-mode
        */
       "bg-blend": [{
-        "bg-blend": Ce()
+        "bg-blend": Se()
       }],
       // Filters
       /**
@@ -1703,56 +1703,56 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/brightness
        */
       brightness: [{
-        brightness: [a]
+        brightness: [o]
       }],
       /**
        * Contrast
        * @see https://tailwindcss.com/docs/contrast
        */
       contrast: [{
-        contrast: [m]
+        contrast: [h]
       }],
       /**
        * Drop Shadow
        * @see https://tailwindcss.com/docs/drop-shadow
        */
       "drop-shadow": [{
-        "drop-shadow": ["", "none", W, b]
+        "drop-shadow": ["", "none", V, y]
       }],
       /**
        * Grayscale
        * @see https://tailwindcss.com/docs/grayscale
        */
       grayscale: [{
-        grayscale: [d]
+        grayscale: [m]
       }],
       /**
        * Hue Rotate
        * @see https://tailwindcss.com/docs/hue-rotate
        */
       "hue-rotate": [{
-        "hue-rotate": [g]
+        "hue-rotate": [d]
       }],
       /**
        * Invert
        * @see https://tailwindcss.com/docs/invert
        */
       invert: [{
-        invert: [N]
+        invert: [f]
       }],
       /**
        * Saturate
        * @see https://tailwindcss.com/docs/saturate
        */
       saturate: [{
-        saturate: [u]
+        saturate: [A]
       }],
       /**
        * Sepia
        * @see https://tailwindcss.com/docs/sepia
        */
       sepia: [{
-        sepia: [O]
+        sepia: [j]
       }],
       /**
        * Backdrop Filter
@@ -1774,56 +1774,56 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/backdrop-brightness
        */
       "backdrop-brightness": [{
-        "backdrop-brightness": [a]
+        "backdrop-brightness": [o]
       }],
       /**
        * Backdrop Contrast
        * @see https://tailwindcss.com/docs/backdrop-contrast
        */
       "backdrop-contrast": [{
-        "backdrop-contrast": [m]
+        "backdrop-contrast": [h]
       }],
       /**
        * Backdrop Grayscale
        * @see https://tailwindcss.com/docs/backdrop-grayscale
        */
       "backdrop-grayscale": [{
-        "backdrop-grayscale": [d]
+        "backdrop-grayscale": [m]
       }],
       /**
        * Backdrop Hue Rotate
        * @see https://tailwindcss.com/docs/backdrop-hue-rotate
        */
       "backdrop-hue-rotate": [{
-        "backdrop-hue-rotate": [g]
+        "backdrop-hue-rotate": [d]
       }],
       /**
        * Backdrop Invert
        * @see https://tailwindcss.com/docs/backdrop-invert
        */
       "backdrop-invert": [{
-        "backdrop-invert": [N]
+        "backdrop-invert": [f]
       }],
       /**
        * Backdrop Opacity
        * @see https://tailwindcss.com/docs/backdrop-opacity
        */
       "backdrop-opacity": [{
-        "backdrop-opacity": [v]
+        "backdrop-opacity": [N]
       }],
       /**
        * Backdrop Saturate
        * @see https://tailwindcss.com/docs/backdrop-saturate
        */
       "backdrop-saturate": [{
-        "backdrop-saturate": [u]
+        "backdrop-saturate": [A]
       }],
       /**
        * Backdrop Sepia
        * @see https://tailwindcss.com/docs/backdrop-sepia
        */
       "backdrop-sepia": [{
-        "backdrop-sepia": [O]
+        "backdrop-sepia": [j]
       }],
       // Tables
       /**
@@ -1874,35 +1874,35 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/transition-property
        */
       transition: [{
-        transition: ["none", "all", "", "colors", "opacity", "shadow", "transform", b]
+        transition: ["none", "all", "", "colors", "opacity", "shadow", "transform", y]
       }],
       /**
        * Transition Duration
        * @see https://tailwindcss.com/docs/transition-duration
        */
       duration: [{
-        duration: B()
+        duration: q()
       }],
       /**
        * Transition Timing Function
        * @see https://tailwindcss.com/docs/transition-timing-function
        */
       ease: [{
-        ease: ["linear", "in", "out", "in-out", b]
+        ease: ["linear", "in", "out", "in-out", y]
       }],
       /**
        * Transition Delay
        * @see https://tailwindcss.com/docs/transition-delay
        */
       delay: [{
-        delay: B()
+        delay: q()
       }],
       /**
        * Animation
        * @see https://tailwindcss.com/docs/animation
        */
       animate: [{
-        animate: ["none", "spin", "ping", "pulse", "bounce", b]
+        animate: ["none", "spin", "ping", "pulse", "bounce", y]
       }],
       // Transforms
       /**
@@ -1917,63 +1917,63 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/scale
        */
       scale: [{
-        scale: [A]
+        scale: [u]
       }],
       /**
        * Scale X
        * @see https://tailwindcss.com/docs/scale
        */
       "scale-x": [{
-        "scale-x": [A]
+        "scale-x": [u]
       }],
       /**
        * Scale Y
        * @see https://tailwindcss.com/docs/scale
        */
       "scale-y": [{
-        "scale-y": [A]
+        "scale-y": [u]
       }],
       /**
        * Rotate
        * @see https://tailwindcss.com/docs/rotate
        */
       rotate: [{
-        rotate: [ee, b]
+        rotate: [X, y]
       }],
       /**
        * Translate X
        * @see https://tailwindcss.com/docs/translate
        */
       "translate-x": [{
-        "translate-x": [F]
+        "translate-x": [P]
       }],
       /**
        * Translate Y
        * @see https://tailwindcss.com/docs/translate
        */
       "translate-y": [{
-        "translate-y": [F]
+        "translate-y": [P]
       }],
       /**
        * Skew X
        * @see https://tailwindcss.com/docs/skew
        */
       "skew-x": [{
-        "skew-x": [_]
+        "skew-x": [$]
       }],
       /**
        * Skew Y
        * @see https://tailwindcss.com/docs/skew
        */
       "skew-y": [{
-        "skew-y": [_]
+        "skew-y": [$]
       }],
       /**
        * Transform Origin
        * @see https://tailwindcss.com/docs/transform-origin
        */
       "transform-origin": [{
-        origin: ["center", "top", "top-right", "right", "bottom-right", "bottom", "bottom-left", "left", "top-left", b]
+        origin: ["center", "top", "top-right", "right", "bottom-right", "bottom", "bottom-left", "left", "top-left", y]
       }],
       // Interactivity
       /**
@@ -1995,7 +1995,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/cursor
        */
       cursor: [{
-        cursor: ["auto", "default", "pointer", "wait", "text", "move", "help", "not-allowed", "none", "context-menu", "progress", "cell", "crosshair", "vertical-text", "alias", "copy", "no-drop", "grab", "grabbing", "all-scroll", "col-resize", "row-resize", "n-resize", "e-resize", "s-resize", "w-resize", "ne-resize", "nw-resize", "se-resize", "sw-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "zoom-in", "zoom-out", b]
+        cursor: ["auto", "default", "pointer", "wait", "text", "move", "help", "not-allowed", "none", "context-menu", "progress", "cell", "crosshair", "vertical-text", "alias", "copy", "no-drop", "grab", "grabbing", "all-scroll", "col-resize", "row-resize", "n-resize", "e-resize", "s-resize", "w-resize", "ne-resize", "nw-resize", "se-resize", "sw-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "zoom-in", "zoom-out", y]
       }],
       /**
        * Caret Color
@@ -2030,126 +2030,126 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-m": [{
-        "scroll-m": w()
+        "scroll-m": k()
       }],
       /**
        * Scroll Margin X
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mx": [{
-        "scroll-mx": w()
+        "scroll-mx": k()
       }],
       /**
        * Scroll Margin Y
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-my": [{
-        "scroll-my": w()
+        "scroll-my": k()
       }],
       /**
        * Scroll Margin Start
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-ms": [{
-        "scroll-ms": w()
+        "scroll-ms": k()
       }],
       /**
        * Scroll Margin End
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-me": [{
-        "scroll-me": w()
+        "scroll-me": k()
       }],
       /**
        * Scroll Margin Top
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mt": [{
-        "scroll-mt": w()
+        "scroll-mt": k()
       }],
       /**
        * Scroll Margin Right
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mr": [{
-        "scroll-mr": w()
+        "scroll-mr": k()
       }],
       /**
        * Scroll Margin Bottom
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mb": [{
-        "scroll-mb": w()
+        "scroll-mb": k()
       }],
       /**
        * Scroll Margin Left
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-ml": [{
-        "scroll-ml": w()
+        "scroll-ml": k()
       }],
       /**
        * Scroll Padding
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-p": [{
-        "scroll-p": w()
+        "scroll-p": k()
       }],
       /**
        * Scroll Padding X
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-px": [{
-        "scroll-px": w()
+        "scroll-px": k()
       }],
       /**
        * Scroll Padding Y
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-py": [{
-        "scroll-py": w()
+        "scroll-py": k()
       }],
       /**
        * Scroll Padding Start
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-ps": [{
-        "scroll-ps": w()
+        "scroll-ps": k()
       }],
       /**
        * Scroll Padding End
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pe": [{
-        "scroll-pe": w()
+        "scroll-pe": k()
       }],
       /**
        * Scroll Padding Top
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pt": [{
-        "scroll-pt": w()
+        "scroll-pt": k()
       }],
       /**
        * Scroll Padding Right
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pr": [{
-        "scroll-pr": w()
+        "scroll-pr": k()
       }],
       /**
        * Scroll Padding Bottom
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pb": [{
-        "scroll-pb": w()
+        "scroll-pb": k()
       }],
       /**
        * Scroll Padding Left
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pl": [{
-        "scroll-pl": w()
+        "scroll-pl": k()
       }],
       /**
        * Scroll Snap Align
@@ -2217,7 +2217,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/will-change
        */
       "will-change": [{
-        "will-change": ["auto", "scroll", "contents", "transform", b]
+        "will-change": ["auto", "scroll", "contents", "transform", y]
       }],
       // SVG
       /**
@@ -2232,7 +2232,7 @@ const k = (e) => {
        * @see https://tailwindcss.com/docs/stroke-width
        */
       "stroke-w": [{
-        stroke: [$, U, ie]
+        stroke: [F, G, ie]
       }],
       /**
        * Stroke
@@ -2307,33 +2307,26 @@ const k = (e) => {
       "font-size": ["leading"]
     }
   };
-}, Zt = /* @__PURE__ */ Rt(Xt);
+}, Yt = /* @__PURE__ */ Et(Qt);
 function C(...e) {
-  return Zt(Me(e));
+  return Yt(Fe(e));
 }
-const Qt = Fe(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 hover-elevate active-elevate-2",
+const er = Be(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-full text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground border border-primary-border",
-        destructive: "bg-destructive text-destructive-foreground border border-destructive-border",
-        outline: (
-          // Shows the background color of whatever card / sidebar / accent background it is inside of.
-          // Inherits the current text color.
-          " border [border-color:var(--button-outline)]  shadow-xs active:shadow-none "
-        ),
-        secondary: "border bg-secondary text-secondary-foreground border border-secondary-border ",
-        // Add a transparent border so that when someone toggles a border on later, it doesn't shift layout/size.
-        ghost: "border border-transparent"
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+        outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline"
       },
-      // Heights are set as "min" heights, because sometimes Ai will place large amount of content
-      // inside buttons. With a min-height they will look appropriate with small amounts of content,
-      // but will expand to fit large amounts of content.
       size: {
-        default: "min-h-9 px-4 py-2",
-        sm: "min-h-8 rounded-md px-3 text-xs",
-        lg: "min-h-10 rounded-md px-8",
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-full px-3 text-xs",
+        lg: "h-10 rounded-full px-8",
         icon: "h-9 w-9"
       }
     },
@@ -2342,63 +2335,167 @@ const Qt = Fe(
       size: "default"
     }
   }
-), R = I.forwardRef(
-  ({ className: e, variant: r, size: t, asChild: a = !1, ...o }, i) => /* @__PURE__ */ n(
-    a ? ot : "button",
+), L = S.forwardRef(
+  ({ className: e, variant: r, size: t, asChild: o = !1, ...a }, i) => /* @__PURE__ */ n(
+    o ? it : "button",
     {
-      className: C(Qt({ variant: r, size: t, className: e })),
+      className: C(er({ variant: r, size: t, className: e })),
       ref: i,
-      ...o
+      ...a
     }
   )
 );
-R.displayName = "Button";
-const L = I.forwardRef(
-  ({ className: e, type: r, ...t }, a) => /* @__PURE__ */ n(
+L.displayName = "Button";
+const E = S.forwardRef(
+  ({ className: e, type: r, ...t }, o) => /* @__PURE__ */ n(
     "input",
     {
       type: r,
       className: C(
-        "flex h-9 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         e
       ),
-      ref: a,
+      ref: o,
       ...t
     }
   )
 );
-L.displayName = "Input";
-const Yt = ne.Provider, er = ne.Root, tr = ne.Trigger, $e = I.forwardRef(({ className: e, sideOffset: r = 4, ...t }, a) => /* @__PURE__ */ n(
-  ne.Content,
+E.displayName = "Input";
+const tr = U.Provider, rr = U.Root, nr = U.Trigger, Je = S.forwardRef(({ className: e, sideOffset: r = 4, ...t }, o) => /* @__PURE__ */ n(U.Portal, { children: /* @__PURE__ */ n(
+  U.Content,
   {
-    ref: a,
+    ref: o,
     sideOffset: r,
     className: C(
-      "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-tooltip-content-transform-origin]",
+      "z-50 overflow-hidden rounded-md bg-popover px-3 py-1.5 text-xs text-popover-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-tooltip-content-transform-origin]",
       e
     ),
     ...t
   }
+) }));
+Je.displayName = U.Content.displayName;
+const de = z.Root, ce = z.Value, ne = S.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ c(
+  z.Trigger,
+  {
+    ref: o,
+    className: C(
+      "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+      e
+    ),
+    ...t,
+    children: [
+      r,
+      /* @__PURE__ */ n(z.Icon, { asChild: !0, children: /* @__PURE__ */ n(ye, { className: "h-4 w-4 opacity-50" }) })
+    ]
+  }
+));
+ne.displayName = z.Trigger.displayName;
+const Ue = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+  z.ScrollUpButton,
+  {
+    ref: t,
+    className: C(
+      "flex cursor-default items-center justify-center py-1",
+      e
+    ),
+    ...r,
+    children: /* @__PURE__ */ n(st, { className: "h-4 w-4" })
+  }
+));
+Ue.displayName = z.ScrollUpButton.displayName;
+const We = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+  z.ScrollDownButton,
+  {
+    ref: t,
+    className: C(
+      "flex cursor-default items-center justify-center py-1",
+      e
+    ),
+    ...r,
+    children: /* @__PURE__ */ n(ye, { className: "h-4 w-4" })
+  }
 ));
-$e.displayName = ne.Content.displayName;
-const rr = D.Root, nr = D.Portal, _e = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+We.displayName = z.ScrollDownButton.displayName;
+const ae = S.forwardRef(({ className: e, children: r, position: t = "popper", ...o }, a) => /* @__PURE__ */ n(z.Portal, { children: /* @__PURE__ */ c(
+  z.Content,
+  {
+    ref: a,
+    className: C(
+      "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-select-content-transform-origin]",
+      t === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+      e
+    ),
+    position: t,
+    ...o,
+    children: [
+      /* @__PURE__ */ n(Ue, {}),
+      /* @__PURE__ */ n(
+        z.Viewport,
+        {
+          className: C(
+            "p-1",
+            t === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+          ),
+          children: r
+        }
+      ),
+      /* @__PURE__ */ n(We, {})
+    ]
+  }
+) }));
+ae.displayName = z.Content.displayName;
+const ar = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+  z.Label,
+  {
+    ref: t,
+    className: C("px-2 py-1.5 text-sm font-semibold", e),
+    ...r
+  }
+));
+ar.displayName = z.Label.displayName;
+const R = S.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ c(
+  z.Item,
+  {
+    ref: o,
+    className: C(
+      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      e
+    ),
+    ...t,
+    children: [
+      /* @__PURE__ */ n("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ n(z.ItemIndicator, { children: /* @__PURE__ */ n(Oe, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ n(z.ItemText, { children: r })
+    ]
+  }
+));
+R.displayName = z.Item.displayName;
+const or = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+  z.Separator,
+  {
+    ref: t,
+    className: C("-mx-1 my-1 h-px bg-muted", e),
+    ...r
+  }
+));
+or.displayName = z.Separator.displayName;
+const ir = D.Root, sr = D.Portal, He = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   D.Overlay,
   {
     ref: t,
     className: C(
-      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       e
     ),
     ...r
   }
 ));
-_e.displayName = D.Overlay.displayName;
-const Je = I.forwardRef(({ className: e, children: r, ...t }, a) => /* @__PURE__ */ l(nr, { children: [
-  /* @__PURE__ */ n(_e, {}),
-  /* @__PURE__ */ l(
+He.displayName = D.Overlay.displayName;
+const Xe = S.forwardRef(({ className: e, children: r, ...t }, o) => /* @__PURE__ */ c(sr, { children: [
+  /* @__PURE__ */ n(He, {}),
+  /* @__PURE__ */ c(
     D.Content,
     {
-      ref: a,
+      ref: o,
       className: C(
         "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
         e
@@ -2406,16 +2503,16 @@ const Je = I.forwardRef(({ className: e, children: r, ...t }, a) => /* @__PURE__
       ...t,
       children: [
         r,
-        /* @__PURE__ */ l(D.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
-          /* @__PURE__ */ n(at, { className: "h-4 w-4" }),
+        /* @__PURE__ */ c(D.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
+          /* @__PURE__ */ n(lt, { className: "h-4 w-4" }),
           /* @__PURE__ */ n("span", { className: "sr-only", children: "Close" })
         ] })
       ]
     }
   )
 ] }));
-Je.displayName = D.Content.displayName;
-const Ue = ({
+Xe.displayName = D.Content.displayName;
+const Ze = ({
   className: e,
   ...r
 }) => /* @__PURE__ */ n(
@@ -2428,8 +2525,8 @@ const Ue = ({
     ...r
   }
 );
-Ue.displayName = "DialogHeader";
-const We = ({
+Ze.displayName = "DialogHeader";
+const Qe = ({
   className: e,
   ...r
 }) => /* @__PURE__ */ n(
@@ -2442,8 +2539,8 @@ const We = ({
     ...r
   }
 );
-We.displayName = "DialogFooter";
-const Ke = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+Qe.displayName = "DialogFooter";
+const Ye = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   D.Title,
   {
     ref: t,
@@ -2454,8 +2551,8 @@ const Ke = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
     ...r
   }
 ));
-Ke.displayName = D.Title.displayName;
-const or = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+Ye.displayName = D.Title.displayName;
+const lr = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   D.Description,
   {
     ref: t,
@@ -2463,146 +2560,42 @@ const or = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
     ...r
   }
 ));
-or.displayName = D.Description.displayName;
-const ar = Fe(
+lr.displayName = D.Description.displayName;
+const dr = Be(
   "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-), z = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
-  qe.Root,
-  {
-    ref: t,
-    className: C(ar(), e),
-    ...r
-  }
-));
-z.displayName = qe.Root.displayName;
-const Ae = P.Root, je = P.Value, de = I.forwardRef(({ className: e, children: r, ...t }, a) => /* @__PURE__ */ l(
-  P.Trigger,
-  {
-    ref: a,
-    className: C(
-      "flex h-9 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
-      e
-    ),
-    ...t,
-    children: [
-      r,
-      /* @__PURE__ */ n(P.Icon, { asChild: !0, children: /* @__PURE__ */ n(ye, { className: "h-4 w-4 opacity-50" }) })
-    ]
-  }
-));
-de.displayName = P.Trigger.displayName;
-const He = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
-  P.ScrollUpButton,
-  {
-    ref: t,
-    className: C(
-      "flex cursor-default items-center justify-center py-1",
-      e
-    ),
-    ...r,
-    children: /* @__PURE__ */ n(it, { className: "h-4 w-4" })
-  }
-));
-He.displayName = P.ScrollUpButton.displayName;
-const Xe = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
-  P.ScrollDownButton,
-  {
-    ref: t,
-    className: C(
-      "flex cursor-default items-center justify-center py-1",
-      e
-    ),
-    ...r,
-    children: /* @__PURE__ */ n(ye, { className: "h-4 w-4" })
-  }
-));
-Xe.displayName = P.ScrollDownButton.displayName;
-const ce = I.forwardRef(({ className: e, children: r, position: t = "popper", ...a }, o) => /* @__PURE__ */ n(P.Portal, { children: /* @__PURE__ */ l(
-  P.Content,
-  {
-    ref: o,
-    className: C(
-      "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-select-content-transform-origin]",
-      t === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-      e
-    ),
-    position: t,
-    ...a,
-    children: [
-      /* @__PURE__ */ n(He, {}),
-      /* @__PURE__ */ n(
-        P.Viewport,
-        {
-          className: C(
-            "p-1",
-            t === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
-          ),
-          children: r
-        }
-      ),
-      /* @__PURE__ */ n(Xe, {})
-    ]
-  }
-) }));
-ce.displayName = P.Content.displayName;
-const ir = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
-  P.Label,
+), T = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+  Me.Root,
   {
     ref: t,
-    className: C("py-1.5 pl-8 pr-2 text-sm font-semibold", e),
+    className: C(dr(), e),
     ...r
   }
 ));
-ir.displayName = P.Label.displayName;
-const j = I.forwardRef(({ className: e, children: r, ...t }, a) => /* @__PURE__ */ l(
-  P.Item,
-  {
-    ref: a,
-    className: C(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      e
-    ),
-    ...t,
-    children: [
-      /* @__PURE__ */ n("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ n(P.ItemIndicator, { children: /* @__PURE__ */ n(Re, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ n(P.ItemText, { children: r })
-    ]
-  }
-));
-j.displayName = P.Item.displayName;
-const sr = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
-  P.Separator,
-  {
-    ref: t,
-    className: C("-mx-1 my-1 h-px bg-muted", e),
-    ...r
-  }
-));
-sr.displayName = P.Separator.displayName;
-const me = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+T.displayName = Me.Root.displayName;
+const me = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   se.Root,
   {
     ref: t,
     className: C(
-      "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+      "grid place-content-center peer h-4 w-4 shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
       e
     ),
     ...r,
     children: /* @__PURE__ */ n(
       se.Indicator,
       {
-        className: C("flex items-center justify-center text-current"),
-        children: /* @__PURE__ */ n(Re, { className: "h-4 w-4" })
+        className: C("grid place-content-center text-current"),
+        children: /* @__PURE__ */ n(Oe, { className: "h-4 w-4" })
       }
     )
   }
 ));
 me.displayName = se.Root.displayName;
-const xe = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const xe = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "textarea",
   {
     className: C(
-      "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+      "flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
       e
     ),
     ref: t,
@@ -2610,7 +2603,7 @@ const xe = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   }
 ));
 xe.displayName = "Textarea";
-const lr = (e) => e.trim().toLowerCase().replace(/[^\w\s]/g, "").replace(/\s+/g, "_"), dr = (e, r, t = !1) => {
+const cr = (e) => e.trim().toLowerCase().replace(/[^\w\s]/g, "").replace(/\s+/g, "_"), mr = (e, r, t = !1, o = !1) => {
   const a = (m, d) => {
     r({ ...e, [m]: d });
   };
@@ -2620,12 +2613,12 @@ const lr = (e) => e.trim().toLowerCase().replace(/[^\w\s]/g, "").replace(/\s+/g,
     },
     handleTitleBlur: () => {
       if (t && e.title) {
-        const m = lr(e.title);
+        const m = cr(e.title);
         a("key", m);
       }
     },
     handleKeyChange: (m) => {
-      t && a("key", m);
+      (t || o) && a("key", m);
     },
     handleFieldChange: a,
     handleConstraintChange: (m, d) => {
@@ -2644,141 +2637,143 @@ const lr = (e) => e.trim().toLowerCase().replace(/[^\w\s]/g, "").replace(/\s+/g,
   array: "Array",
   null: "Null",
   file: "File"
-}, Ze = tt({
+}, et = nt({
   getTypeLabel: (e) => ue[e],
   typeLabels: ue
 });
-function cr({
+function ur({
   children: e,
   customLabels: r = {}
 }) {
-  const t = { ...ue, ...r }, a = (o) => t[o] || o;
-  return /* @__PURE__ */ n(Ze.Provider, { value: { getTypeLabel: a, typeLabels: t }, children: e });
+  const t = { ...ue, ...r }, o = (a) => t[a] || a;
+  return /* @__PURE__ */ n(et.Provider, { value: { getTypeLabel: o, typeLabels: t }, children: e });
 }
-function Qe() {
-  return rt(Ze);
+function tt() {
+  return at(et);
 }
 function pe({
   property: e,
   open: r,
   onOpenChange: t,
-  onUpdate: a,
-  isArrayItem: o = !1,
+  onUpdate: o,
+  isArrayItem: a = !1,
   isNewProperty: i = !1,
   propertyLabel: s = { singular: "Property", plural: "Properties" },
-  showRegex: c = !1
+  showRegex: l = !1,
+  keyEditable: h = !1
 }) {
-  var T;
-  const { typeLabels: m } = Qe(), [d, g] = V(e);
+  var A;
+  const { typeLabels: m } = tt(), [d, f] = B(e);
   be(() => {
-    r && g(e);
+    r && f(e);
   }, [e, r]);
   const {
-    handleTitleChange: N,
-    handleTitleBlur: x,
-    handleKeyChange: S,
-    handleFieldChange: y,
+    handleTitleChange: g,
+    handleTitleBlur: w,
+    handleKeyChange: v,
+    handleFieldChange: x,
     handleConstraintChange: p
-  } = dr(d, g, i), h = () => {
+  } = mr(d, f, i, h), N = () => {
     var u;
-    (u = d.title) != null && u.trim() && (a(d), t(!1));
-  }, v = () => {
-    g(e), t(!1);
+    (u = d.title) != null && u.trim() && (o(d), t(!1));
+  }, b = () => {
+    f(e), t(!1);
   };
-  return /* @__PURE__ */ n(rr, { open: r, onOpenChange: t, children: /* @__PURE__ */ l(
-    Je,
+  return /* @__PURE__ */ n(ir, { open: r, onOpenChange: t, children: /* @__PURE__ */ c(
+    Xe,
     {
       className: "max-w-2xl max-h-[80vh] flex flex-col gap-0 p-0",
       "data-testid": "dialog-edit-property",
       children: [
-        /* @__PURE__ */ n(Ue, { className: "px-6 pt-6 pb-4 shrink-0", children: /* @__PURE__ */ n(Ke, { children: i ? `Add ${s.singular}` : `Edit ${s.singular}` }) }),
-        /* @__PURE__ */ l("div", { className: "space-y-6 px-6 pb-4 overflow-y-auto flex-1 min-h-0", children: [
-          /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ l(z, { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ n(Ze, { className: "px-6 pt-6 pb-4 shrink-0", children: /* @__PURE__ */ n(Ye, { children: i ? `Add ${s.singular}` : `Edit ${s.singular}` }) }),
+        /* @__PURE__ */ c("div", { className: "space-y-6 px-6 pb-4 overflow-y-auto flex-1 min-h-0", children: [
+          /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ c(T, { className: "flex items-center gap-1.5", children: [
               /* @__PURE__ */ n("span", { className: "w-1.5 h-1.5 rounded-full bg-red-500" }),
               "Type"
             ] }),
-            /* @__PURE__ */ l(
-              Ae,
+            /* @__PURE__ */ c(
+              de,
               {
                 value: d.type,
-                onValueChange: (u) => y("type", u),
+                onValueChange: (u) => x("type", u),
                 "data-testid": "select-type-dialog",
                 children: [
-                  /* @__PURE__ */ n(de, { children: /* @__PURE__ */ n(je, {}) }),
-                  /* @__PURE__ */ l(ce, { children: [
-                    /* @__PURE__ */ n(j, { value: "string", children: m.string }),
-                    /* @__PURE__ */ n(j, { value: "number", children: m.number }),
-                    /* @__PURE__ */ n(j, { value: "integer", children: m.integer }),
-                    /* @__PURE__ */ n(j, { value: "boolean", children: m.boolean }),
-                    /* @__PURE__ */ n(j, { value: "object", children: m.object }),
-                    /* @__PURE__ */ n(j, { value: "array", children: m.array }),
-                    /* @__PURE__ */ n(j, { value: "file", children: m.file }),
-                    /* @__PURE__ */ n(j, { value: "null", children: m.null })
+                  /* @__PURE__ */ n(ne, { children: /* @__PURE__ */ n(ce, {}) }),
+                  /* @__PURE__ */ c(ae, { children: [
+                    /* @__PURE__ */ n(R, { value: "string", children: m.string }),
+                    /* @__PURE__ */ n(R, { value: "number", children: m.number }),
+                    /* @__PURE__ */ n(R, { value: "integer", children: m.integer }),
+                    /* @__PURE__ */ n(R, { value: "boolean", children: m.boolean }),
+                    /* @__PURE__ */ n(R, { value: "object", children: m.object }),
+                    /* @__PURE__ */ n(R, { value: "array", children: m.array }),
+                    /* @__PURE__ */ n(R, { value: "file", children: m.file }),
+                    /* @__PURE__ */ n(R, { value: "null", children: m.null })
                   ] })
                 ]
               }
             )
           ] }),
-          /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ l(z, { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ c(T, { className: "flex items-center gap-1.5", children: [
               /* @__PURE__ */ n("span", { className: "w-1.5 h-1.5 rounded-full bg-red-500" }),
               "Title"
             ] }),
             /* @__PURE__ */ n(
-              L,
+              E,
               {
                 value: d.title || "",
-                onChange: (u) => N(u.target.value),
-                onBlur: x,
+                onChange: (u) => g(u.target.value),
+                onBlur: w,
                 placeholder: "Property Title",
                 "data-testid": "input-title-dialog",
                 required: !0
               }
             ),
-            !i && d.key && /* @__PURE__ */ l("p", { className: "text-xs text-muted-foreground font-mono", children: [
+            !i && d.key && /* @__PURE__ */ c("p", { className: "text-xs text-muted-foreground font-mono", children: [
               "Key: ",
               d.key
             ] })
           ] }),
-          i && /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ n(z, { children: "Key" }),
+          (i || h) && /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ n(T, { children: "Key" }),
             /* @__PURE__ */ n(
-              L,
+              E,
               {
                 value: d.key,
-                onChange: (u) => S(u.target.value),
+                onChange: (u) => v(u.target.value),
                 placeholder: "property_key",
                 "data-testid": "input-key-dialog"
               }
-            )
+            ),
+            !i && /* @__PURE__ */ n("p", { className: "text-xs text-yellow-600 dark:text-yellow-500", children: "⚠️ Changing the key may break existing references to this property" })
           ] }),
-          /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ n(z, { children: "Description" }),
+          /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ n(T, { children: "Description" }),
             /* @__PURE__ */ n(
               xe,
               {
                 placeholder: "Optional description",
                 value: d.description || "",
-                onChange: (u) => y("description", u.target.value),
+                onChange: (u) => x("description", u.target.value),
                 rows: 2,
                 "data-testid": "input-edit-description"
               }
             )
           ] }),
-          d.type === "array" && /* @__PURE__ */ l("div", { className: "space-y-2 border-l-2 border-border pl-4 mt-2", children: [
-            /* @__PURE__ */ l(z, { className: "font-semibold text-xs text-muted-foreground", children: [
+          d.type === "array" && /* @__PURE__ */ c("div", { className: "space-y-2 border-l-2 border-border pl-4 mt-2", children: [
+            /* @__PURE__ */ c(T, { className: "font-semibold text-xs text-muted-foreground", children: [
               m.array,
               " Items"
             ] }),
-            d.items ? /* @__PURE__ */ l("div", { className: "bg-muted/40 p-2 rounded", children: [
-              /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                /* @__PURE__ */ n(z, { children: "Item Type" }),
-                /* @__PURE__ */ l(
-                  Ae,
+            d.items ? /* @__PURE__ */ c("div", { className: "bg-muted/40 p-2 rounded", children: [
+              /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ n(T, { children: "Item Type" }),
+                /* @__PURE__ */ c(
+                  de,
                   {
                     value: d.items.type,
-                    onValueChange: (u) => g({
+                    onValueChange: (u) => f({
                       ...d,
                       items: {
                         ...d.items,
@@ -2786,28 +2781,28 @@ function pe({
                       }
                     }),
                     children: [
-                      /* @__PURE__ */ n(de, { children: /* @__PURE__ */ n(je, {}) }),
-                      /* @__PURE__ */ l(ce, { children: [
-                        /* @__PURE__ */ n(j, { value: "string", children: m.string }),
-                        /* @__PURE__ */ n(j, { value: "number", children: m.number }),
-                        /* @__PURE__ */ n(j, { value: "integer", children: m.integer }),
-                        /* @__PURE__ */ n(j, { value: "boolean", children: m.boolean }),
-                        /* @__PURE__ */ n(j, { value: "object", children: m.object }),
-                        /* @__PURE__ */ n(j, { value: "array", children: m.array }),
-                        /* @__PURE__ */ n(j, { value: "file", children: m.file }),
-                        /* @__PURE__ */ n(j, { value: "null", children: m.null })
+                      /* @__PURE__ */ n(ne, { children: /* @__PURE__ */ n(ce, {}) }),
+                      /* @__PURE__ */ c(ae, { children: [
+                        /* @__PURE__ */ n(R, { value: "string", children: m.string }),
+                        /* @__PURE__ */ n(R, { value: "number", children: m.number }),
+                        /* @__PURE__ */ n(R, { value: "integer", children: m.integer }),
+                        /* @__PURE__ */ n(R, { value: "boolean", children: m.boolean }),
+                        /* @__PURE__ */ n(R, { value: "object", children: m.object }),
+                        /* @__PURE__ */ n(R, { value: "array", children: m.array }),
+                        /* @__PURE__ */ n(R, { value: "file", children: m.file }),
+                        /* @__PURE__ */ n(R, { value: "null", children: m.null })
                       ] })
                     ]
                   }
                 )
               ] }),
-              /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                /* @__PURE__ */ n(z, { children: "Item Title" }),
+              /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ n(T, { children: "Item Title" }),
                 /* @__PURE__ */ n(
-                  L,
+                  E,
                   {
                     value: d.items.title || "",
-                    onChange: (u) => g({
+                    onChange: (u) => f({
                       ...d,
                       items: {
                         ...d.items,
@@ -2818,13 +2813,13 @@ function pe({
                   }
                 )
               ] }),
-              /* @__PURE__ */ l(
-                R,
+              /* @__PURE__ */ c(
+                L,
                 {
                   variant: "ghost",
                   size: "sm",
                   className: "mt-2",
-                  onClick: () => g({ ...d, items: void 0 }),
+                  onClick: () => f({ ...d, items: void 0 }),
                   children: [
                     "Remove ",
                     m.array,
@@ -2832,13 +2827,13 @@ function pe({
                   ]
                 }
               )
-            ] }) : /* @__PURE__ */ l(
-              R,
+            ] }) : /* @__PURE__ */ c(
+              L,
               {
                 variant: "outline",
                 size: "sm",
                 onClick: () => {
-                  g({
+                  f({
                     ...d,
                     items: {
                       id: Date.now().toString() + Math.random(),
@@ -2856,29 +2851,29 @@ function pe({
               }
             )
           ] }),
-          !o && /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
+          !a && /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ n(
               me,
               {
                 id: "prop-required",
                 checked: d.required,
-                onCheckedChange: (u) => y("required", u),
+                onCheckedChange: (u) => x("required", u),
                 "data-testid": "checkbox-edit-required"
               }
             ),
-            /* @__PURE__ */ n(z, { htmlFor: "prop-required", className: "cursor-pointer", children: "Required field" })
+            /* @__PURE__ */ n(T, { htmlFor: "prop-required", className: "cursor-pointer", children: "Required field" })
           ] }),
-          d.type === "string" && /* @__PURE__ */ l("details", { className: "border rounded-md", children: [
-            /* @__PURE__ */ n("summary", { className: "p-4 cursor-pointer hover:bg-accent/50 transition-colors", children: /* @__PURE__ */ l("h4", { className: "text-sm font-medium inline", children: [
+          d.type === "string" && /* @__PURE__ */ c("details", { className: "border rounded-md", children: [
+            /* @__PURE__ */ n("summary", { className: "p-4 cursor-pointer hover:bg-accent/50 transition-colors", children: /* @__PURE__ */ c("h4", { className: "text-sm font-medium inline", children: [
               m.string,
               " Constraints"
             ] }) }),
-            /* @__PURE__ */ l("div", { className: "space-y-4 p-4 pt-0", children: [
-              /* @__PURE__ */ l("div", { className: "grid grid-cols-2 gap-4", children: [
-                /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                  /* @__PURE__ */ n(z, { htmlFor: "min-length", children: "Minimum Length" }),
+            /* @__PURE__ */ c("div", { className: "space-y-4 p-4 pt-0", children: [
+              /* @__PURE__ */ c("div", { className: "grid grid-cols-2 gap-4", children: [
+                /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                  /* @__PURE__ */ n(T, { htmlFor: "min-length", children: "Minimum Length" }),
                   /* @__PURE__ */ n(
-                    L,
+                    E,
                     {
                       id: "min-length",
                       type: "number",
@@ -2892,10 +2887,10 @@ function pe({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                  /* @__PURE__ */ n(z, { htmlFor: "max-length", children: "Maximum Length" }),
+                /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                  /* @__PURE__ */ n(T, { htmlFor: "max-length", children: "Maximum Length" }),
                   /* @__PURE__ */ n(
-                    L,
+                    E,
                     {
                       id: "max-length",
                       type: "number",
@@ -2910,10 +2905,10 @@ function pe({
                   )
                 ] })
               ] }),
-              c && /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                /* @__PURE__ */ n(z, { htmlFor: "pattern", children: "Pattern (regex)" }),
+              l && /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ n(T, { htmlFor: "pattern", children: "Pattern (regex)" }),
                 /* @__PURE__ */ n(
-                  L,
+                  E,
                   {
                     id: "pattern",
                     placeholder: "^[a-z]+$",
@@ -2924,51 +2919,51 @@ function pe({
                   }
                 )
               ] }),
-              /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                /* @__PURE__ */ n(z, { children: "Enum Values" }),
-                /* @__PURE__ */ n("div", { className: "space-y-2", children: [...d.enum || [], ""].map((u, A) => {
-                  var O;
+              /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ n(T, { children: "Enum Values" }),
+                /* @__PURE__ */ n("div", { className: "space-y-2", children: [...d.enum || [], ""].map((u, j) => {
+                  var $;
                   return /* @__PURE__ */ n(
-                    L,
+                    E,
                     {
-                      placeholder: A === (((O = d.enum) == null ? void 0 : O.length) || 0) ? "Add new value..." : "Enum value",
+                      placeholder: j === ((($ = d.enum) == null ? void 0 : $.length) || 0) ? "Add new value..." : "Enum value",
                       value: u,
-                      onChange: (_) => {
-                        const M = _.target.value, F = d.enum || [];
-                        if (A === F.length)
-                          M.trim() && p("enum", [
-                            ...F,
-                            M.trim()
+                      onChange: (K) => {
+                        const P = K.target.value, O = d.enum || [];
+                        if (j === O.length)
+                          P.trim() && p("enum", [
+                            ...O,
+                            P.trim()
                           ]);
-                        else if (M.trim()) {
-                          const E = [...F];
-                          E[A] = M.trim(), p("enum", E);
+                        else if (P.trim()) {
+                          const M = [...O];
+                          M[j] = P.trim(), p("enum", M);
                         } else {
-                          const E = F.filter(
-                            (J, G) => G !== A
+                          const M = O.filter(
+                            (Y, k) => k !== j
                           );
                           p(
                             "enum",
-                            E.length > 0 ? E : void 0
+                            M.length > 0 ? M : void 0
                           );
                         }
                       },
-                      "data-testid": `input-edit-enum-${A}`
+                      "data-testid": `input-edit-enum-${j}`
                     },
-                    A
+                    j
                   );
                 }) }),
                 /* @__PURE__ */ n("p", { className: "text-xs text-muted-foreground", children: "Enter allowed values (empty fields will be removed)" })
               ] })
             ] })
           ] }),
-          (d.type === "number" || d.type === "integer") && /* @__PURE__ */ l("details", { className: "border rounded-md", children: [
+          (d.type === "number" || d.type === "integer") && /* @__PURE__ */ c("details", { className: "border rounded-md", children: [
             /* @__PURE__ */ n("summary", { className: "p-4 cursor-pointer hover:bg-accent/50 transition-colors", children: /* @__PURE__ */ n("h4", { className: "text-sm font-medium inline", children: "Numeric Constraints" }) }),
-            /* @__PURE__ */ n("div", { className: "space-y-4 p-4 pt-0", children: /* @__PURE__ */ l("div", { className: "grid grid-cols-2 gap-4", children: [
-              /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                /* @__PURE__ */ n(z, { htmlFor: "minimum", children: "Minimum Value" }),
+            /* @__PURE__ */ n("div", { className: "space-y-4 p-4 pt-0", children: /* @__PURE__ */ c("div", { className: "grid grid-cols-2 gap-4", children: [
+              /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ n(T, { htmlFor: "minimum", children: "Minimum Value" }),
                 /* @__PURE__ */ n(
-                  L,
+                  E,
                   {
                     id: "minimum",
                     type: "number",
@@ -2982,10 +2977,10 @@ function pe({
                   }
                 )
               ] }),
-              /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                /* @__PURE__ */ n(z, { htmlFor: "maximum", children: "Maximum Value" }),
+              /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ n(T, { htmlFor: "maximum", children: "Maximum Value" }),
                 /* @__PURE__ */ n(
-                  L,
+                  E,
                   {
                     id: "maximum",
                     type: "number",
@@ -3001,17 +2996,17 @@ function pe({
               ] })
             ] }) })
           ] }),
-          d.type === "array" && /* @__PURE__ */ l("details", { className: "border rounded-md", children: [
-            /* @__PURE__ */ n("summary", { className: "p-4 cursor-pointer hover:bg-accent/50 transition-colors", children: /* @__PURE__ */ l("h4", { className: "text-sm font-medium inline", children: [
+          d.type === "array" && /* @__PURE__ */ c("details", { className: "border rounded-md", children: [
+            /* @__PURE__ */ n("summary", { className: "p-4 cursor-pointer hover:bg-accent/50 transition-colors", children: /* @__PURE__ */ c("h4", { className: "text-sm font-medium inline", children: [
               m.array,
               " Constraints"
             ] }) }),
-            /* @__PURE__ */ l("div", { className: "space-y-4 p-4 pt-0", children: [
-              /* @__PURE__ */ l("div", { className: "grid grid-cols-2 gap-4", children: [
-                /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                  /* @__PURE__ */ n(z, { htmlFor: "min-items", children: "Minimum Items" }),
+            /* @__PURE__ */ c("div", { className: "space-y-4 p-4 pt-0", children: [
+              /* @__PURE__ */ c("div", { className: "grid grid-cols-2 gap-4", children: [
+                /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                  /* @__PURE__ */ n(T, { htmlFor: "min-items", children: "Minimum Items" }),
                   /* @__PURE__ */ n(
-                    L,
+                    E,
                     {
                       id: "min-items",
                       type: "number",
@@ -3025,10 +3020,10 @@ function pe({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ l("div", { className: "space-y-2", children: [
-                  /* @__PURE__ */ n(z, { htmlFor: "max-items", children: "Maximum Items" }),
+                /* @__PURE__ */ c("div", { className: "space-y-2", children: [
+                  /* @__PURE__ */ n(T, { htmlFor: "max-items", children: "Maximum Items" }),
                   /* @__PURE__ */ n(
-                    L,
+                    E,
                     {
                       id: "max-items",
                       type: "number",
@@ -3043,7 +3038,7 @@ function pe({
                   )
                 ] })
               ] }),
-              /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
                 /* @__PURE__ */ n(
                   me,
                   {
@@ -3053,27 +3048,27 @@ function pe({
                     "data-testid": "checkbox-edit-unique"
                   }
                 ),
-                /* @__PURE__ */ n(z, { htmlFor: "unique-items", className: "cursor-pointer", children: "All items must be unique" })
+                /* @__PURE__ */ n(T, { htmlFor: "unique-items", className: "cursor-pointer", children: "All items must be unique" })
               ] })
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ l(We, { className: "px-6 py-4 border-t bg-background shrink-0", children: [
+        /* @__PURE__ */ c(Qe, { className: "px-6 py-4 border-t bg-background shrink-0", children: [
           /* @__PURE__ */ n(
-            R,
+            L,
             {
               variant: "outline",
-              onClick: v,
+              onClick: b,
               "data-testid": "button-cancel",
               children: "Cancel"
             }
           ),
           /* @__PURE__ */ n(
-            R,
+            L,
             {
-              onClick: h,
+              onClick: N,
               "data-testid": "button-save",
-              disabled: !((T = d.title) != null && T.trim()),
+              disabled: !((A = d.title) != null && A.trim()),
               children: "Save Changes"
             }
           )
@@ -3082,66 +3077,139 @@ function pe({
     }
   ) });
 }
+function Le(e, r, t = {}) {
+  const { allowEmpty: o = !1, onEditStart: a, onEditCancel: i } = t, [s, l] = B(!1), [h, m] = B(e);
+  be(() => {
+    s || m(e);
+  }, [e, s]);
+  const d = () => {
+    m(e), l(!0), a == null || a();
+  }, f = (v) => {
+    m(v);
+  }, g = () => {
+    const v = h.trim();
+    if (!o && !v) {
+      m(e), l(!1);
+      return;
+    }
+    v !== e && r(v), l(!1);
+  };
+  return {
+    isEditing: s,
+    value: h,
+    startEdit: d,
+    handleChange: f,
+    handleBlur: g,
+    handleKeyDown: (v) => {
+      v.key === "Enter" ? g() : v.key === "Escape" && (m(e), l(!1), i == null || i());
+    }
+  };
+}
+function pr(e, r) {
+  const [t, o] = B(!1);
+  return {
+    isChangingType: t,
+    setIsChangingType: o,
+    handleTypeChange: (s) => {
+      const l = { ...e, type: s };
+      s !== "string" && (delete l.minLength, delete l.maxLength, delete l.pattern, delete l.enum), s !== "number" && s !== "integer" && (delete l.minimum, delete l.maximum), s !== "array" && (delete l.minItems, delete l.maxItems, delete l.uniqueItems, delete l.items), s !== "object" && delete l.children, r(l), o(!1);
+    },
+    availableTypes: [
+      "string",
+      "number",
+      "integer",
+      "boolean",
+      "object",
+      "array",
+      "file"
+    ]
+  };
+}
 const we = () => `${Date.now()}-${Math.random()}`;
+function Ne(e = {}) {
+  const { onConfirm: r, onCancel: t, createInitialData: o } = e, [a, i] = B(!1), [s, l] = B(null), h = (g) => {
+    const w = g ?? (o ? o() : null);
+    l(w), i(!0);
+  }, m = () => {
+    i(!1), l(null), t == null || t();
+  };
+  return {
+    isOpen: a,
+    data: s,
+    open: h,
+    close: m,
+    confirm: (g) => {
+      r == null || r(g), i(!1), l(null);
+    },
+    setIsOpen: (g) => {
+      g ? i(!0) : m();
+    }
+  };
+}
+function hr(e, r) {
+  const t = Ne({
+    createInitialData: () => ({
+      id: we(),
+      key: "",
+      type: "string",
+      required: !1
+    }),
+    onConfirm: (i) => {
+      r({
+        ...e,
+        children: [...e.children || [], i]
+      });
+    }
+  });
+  return {
+    addChild: () => t.open(),
+    updateChild: (i, s) => {
+      const l = e.children.map(
+        (h) => h.id === i ? s : h
+      );
+      r({ ...e, children: l });
+    },
+    deleteChild: (i) => {
+      const s = e.children.filter((l) => l.id !== i);
+      r({ ...e, children: s });
+    },
+    addChildDialog: {
+      isOpen: t.isOpen,
+      data: t.data,
+      setIsOpen: t.setIsOpen,
+      confirm: t.confirm
+    }
+  };
+}
 function he({
   property: e,
   onUpdate: r,
   onDelete: t,
-  level: a = 1,
-  isArrayItem: o = !1,
-  showRegex: i = !1
+  level: o = 1,
+  isArrayItem: a = !1,
+  showRegex: i = !1,
+  keyEditable: s = !1
 }) {
-  const { getTypeLabel: s } = Qe(), [c, m] = V(!1), [d, g] = V(null), [N, x] = V(!1), [S, y] = V(!1), [p, h] = V(e.title || "");
-  be(() => {
-    S || h(e.title || "");
-  }, [e.title, S]);
-  const v = `h${Math.min(a, 6)}`, T = e.type === "object", u = T && e.children && e.children.length > 0, A = {
+  const { getTypeLabel: l, typeLabels: h } = tt(), m = Ne(), d = Le(
+    e.title || e.key || "",
+    (b) => r({ ...e, title: b }),
+    { allowEmpty: !1 }
+  ), f = Le(
+    e.description || "",
+    (b) => r({ ...e, description: b || void 0 }),
+    { allowEmpty: !0 }
+  ), g = pr(e, r), w = hr(e, r), v = `h${Math.min(o, 6)}`, x = e.type === "object", p = x && e.children && e.children.length > 0, N = {
     1: "text-lg font-semibold",
     2: "text-base",
     3: "text-base",
     4: "text-base",
     5: "text-sm",
     6: "text-sm"
-  }[a] || "text-sm", O = (f, q) => {
-    const X = e.children.map(
-      (K) => K.id === f ? q : K
-    );
-    r({ ...e, children: X });
-  }, _ = (f) => {
-    const q = e.children.filter((X) => X.id !== f);
-    r({ ...e, children: q });
-  }, M = () => {
-    const f = {
-      id: we(),
-      key: "",
-      type: "string",
-      required: !1
-    };
-    g(f), x(!0);
-  }, F = (f) => {
-    r({
-      ...e,
-      children: [...e.children || [], f]
-    }), x(!1), g(null);
-  }, E = () => {
-    x(!1), g(null);
-  }, J = () => {
-    const f = e.title || e.key || "";
-    h(f), y(!0);
-  }, G = () => {
-    const f = p.trim();
-    if (!f) {
-      h(e.title || ""), y(!1);
-      return;
-    }
-    f !== e.title && r({ ...e, title: f }), y(!1);
-  }, w = (f) => {
-    f.key === "Enter" ? G() : f.key === "Escape" && (h(e.title || ""), y(!1));
-  };
-  return /* @__PURE__ */ l("div", { className: "group", children: [
-    /* @__PURE__ */ l("div", { className: "flex gap-4 items-center rounded-md -mx-2 px-2 py-1 transition-colors hover:bg-accent/50", children: [
-      /* @__PURE__ */ n("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ l("div", { className: "flex items-start gap-3", children: [
-        !o && /* @__PURE__ */ n(
+  }[o] || "text-sm";
+  return /* @__PURE__ */ c("div", { className: "group", children: [
+    /* @__PURE__ */ c("div", { className: "flex gap-4 items-center rounded-md -mx-2 px-2 py-1 transition-colors hover:bg-accent/50", children: [
+      /* @__PURE__ */ n("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ c("div", { className: "flex items-start gap-3", children: [
+        !a && /* @__PURE__ */ n(
           "button",
           {
             onClick: () => r({ ...e, required: !e.required }),
@@ -3150,135 +3218,176 @@ function he({
             children: e.required ? /* @__PURE__ */ n("span", { className: "block w-4 h-4 rounded-full bg-primary" }) : /* @__PURE__ */ n("span", { className: "block w-4 h-4 rounded-full border border-dashed border-gray-400" })
           }
         ),
-        S ? /* @__PURE__ */ n(
-          L,
+        d.isEditing ? /* @__PURE__ */ n(
+          E,
           {
-            value: p,
-            onChange: (f) => h(f.target.value),
-            onBlur: G,
-            onKeyDown: w,
+            value: d.value,
+            onChange: (b) => d.handleChange(b.target.value),
+            onBlur: d.handleBlur,
+            onKeyDown: d.handleKeyDown,
             autoFocus: !0,
-            className: A,
+            className: N,
             placeholder: "Enter title"
           }
-        ) : /* @__PURE__ */ l("div", { className: "flex gap-2 flex-wrap", children: [
-          /* @__PURE__ */ l("div", { className: "flex items-start gap-2", children: [
+        ) : /* @__PURE__ */ c("div", { className: "flex gap-2 flex-wrap flex-1", children: [
+          /* @__PURE__ */ c("div", { className: "flex items-start gap-2", children: [
             /* @__PURE__ */ n(
               v,
               {
-                className: `${A} cursor-pointer hover:text-primary transition-colors leading-none`,
-                onClick: J,
+                className: `${N} cursor-pointer hover:text-primary transition-colors leading-none`,
+                onClick: d.startEdit,
                 children: e.title || e.key || /* @__PURE__ */ n("span", { className: "text-muted-foreground italic", children: "unnamed" })
               }
             ),
-            /* @__PURE__ */ n(Yt, { children: /* @__PURE__ */ l(er, { children: [
-              /* @__PURE__ */ n(tr, { asChild: !0, children: /* @__PURE__ */ l("span", { children: [
-                e.type === "string" && /* @__PURE__ */ n(st, { className: "w-5 h-5 text-muted-foreground" }),
-                e.type === "number" && /* @__PURE__ */ n(Se, { className: "w-5 h-5 text-muted-foreground" }),
-                e.type === "integer" && /* @__PURE__ */ n(Se, { className: "w-5 h-5 text-muted-foreground" }),
-                e.type === "boolean" && /* @__PURE__ */ n(lt, { className: "w-5 h-5 text-muted-foreground" }),
-                e.type === "object" && /* @__PURE__ */ n(dt, { className: "w-5 h-5 text-muted-foreground" }),
-                e.type === "array" && /* @__PURE__ */ n(ct, { className: "w-5 h-5 text-muted-foreground" }),
-                e.type === "file" && /* @__PURE__ */ n(mt, { className: "w-5 h-5 text-muted-foreground" })
-              ] }) }),
-              /* @__PURE__ */ l($e, { side: "top", children: [
-                s(e.type),
-                e.type === "array" && e.items ? ` of ${s(e.items.type)}` : ""
+            g.isChangingType ? /* @__PURE__ */ c(
+              de,
+              {
+                value: e.type,
+                onValueChange: (b) => g.handleTypeChange(b),
+                open: g.isChangingType,
+                onOpenChange: g.setIsChangingType,
+                children: [
+                  /* @__PURE__ */ n(ne, { className: "w-[140px] h-7", children: /* @__PURE__ */ n(ce, {}) }),
+                  /* @__PURE__ */ n(ae, { children: g.availableTypes.map((b) => /* @__PURE__ */ n(R, { value: b, children: h[b] }, b)) })
+                ]
+              }
+            ) : /* @__PURE__ */ n(tr, { children: /* @__PURE__ */ c(rr, { children: [
+              /* @__PURE__ */ n(nr, { asChild: !0, children: /* @__PURE__ */ c(
+                "button",
+                {
+                  onClick: () => g.setIsChangingType(!0),
+                  className: "cursor-pointer hover:bg-accent rounded p-0.5 transition-colors",
+                  children: [
+                    e.type === "string" && /* @__PURE__ */ n(dt, { className: "w-5 h-5 text-muted-foreground" }),
+                    e.type === "number" && /* @__PURE__ */ n(ze, { className: "w-5 h-5 text-muted-foreground" }),
+                    e.type === "integer" && /* @__PURE__ */ n(ze, { className: "w-5 h-5 text-muted-foreground" }),
+                    e.type === "boolean" && /* @__PURE__ */ n(ct, { className: "w-5 h-5 text-muted-foreground" }),
+                    e.type === "object" && /* @__PURE__ */ n(mt, { className: "w-5 h-5 text-muted-foreground" }),
+                    e.type === "array" && /* @__PURE__ */ n(ut, { className: "w-5 h-5 text-muted-foreground" }),
+                    e.type === "file" && /* @__PURE__ */ n(pt, { className: "w-5 h-5 text-muted-foreground" })
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ c(Je, { children: [
+                l(e.type),
+                e.type === "array" && e.items ? ` of ${l(e.items.type)}` : "",
+                /* @__PURE__ */ n("div", { className: "text-xs text-muted-foreground mt-1", children: "Click to change type" })
               ] })
             ] }) }),
             e.type === "object" && /* @__PURE__ */ n(
-              R,
+              L,
               {
                 variant: "ghost",
                 size: "icon",
                 className: "opacity-0 group-hover:opacity-100 h-6 w-6",
-                onClick: M,
+                onClick: w.addChild,
                 "data-testid": `button-add-child-${e.id}`,
-                children: /* @__PURE__ */ n(re, { className: "!w-5 !h-5" })
+                children: /* @__PURE__ */ n(Q, { className: "!w-5 !h-5" })
               }
             )
           ] }),
-          e.description && /* @__PURE__ */ n(
+          /* @__PURE__ */ n("div", { className: "flex-1", children: f.isEditing ? /* @__PURE__ */ n(
+            E,
+            {
+              value: f.value,
+              onChange: (b) => f.handleChange(b.target.value),
+              onBlur: f.handleBlur,
+              onKeyDown: f.handleKeyDown,
+              autoFocus: !0,
+              className: "text-sm flex-1",
+              placeholder: "Enter description"
+            }
+          ) : /* @__PURE__ */ n(Ee, { children: e.description ? /* @__PURE__ */ n(
             "p",
             {
-              className: "text-sm text-muted-foreground flex-1 min-w-[200px]",
+              className: "text-sm text-muted-foreground flex-1 min-w-[200px] cursor-pointer hover:text-foreground transition-colors",
               "data-testid": `text-description-${e.id}`,
+              onClick: f.startEdit,
               children: e.description
             }
-          )
+          ) : /* @__PURE__ */ n(
+            "p",
+            {
+              className: "text-sm text-muted-foreground/50 flex-1 min-w-[200px] cursor-pointer hover:text-muted-foreground italic transition-colors",
+              onClick: f.startEdit,
+              children: "Add description..."
+            }
+          ) }) })
         ] })
       ] }) }),
-      /* @__PURE__ */ l("div", { className: "flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity shrink-0", children: [
+      /* @__PURE__ */ c("div", { className: "flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity shrink-0", children: [
         /* @__PURE__ */ n(
-          R,
+          L,
           {
             variant: "ghost",
             size: "icon",
             className: "h-7 w-7",
-            onClick: () => m(!0),
+            onClick: () => m.open(e),
             "data-testid": `button-edit-${e.id}`,
-            children: /* @__PURE__ */ n(ut, { className: "w-3 h-3" })
+            children: /* @__PURE__ */ n(ht, { className: "w-3 h-3" })
           }
         ),
-        T && e.type !== "object" && /* @__PURE__ */ n(
-          R,
+        x && e.type !== "object" && /* @__PURE__ */ n(
+          L,
           {
             variant: "ghost",
             size: "icon",
             className: "h-7 w-7",
-            onClick: M,
+            onClick: w.addChild,
             "data-testid": `button-add-child-${e.id}`,
-            children: /* @__PURE__ */ n(re, { className: "w-3 h-3" })
+            children: /* @__PURE__ */ n(Q, { className: "w-3 h-3" })
           }
         ),
         /* @__PURE__ */ n(
-          R,
+          L,
           {
             variant: "ghost",
             size: "icon",
             className: "h-7 w-7 text-muted-foreground hover:text-destructive",
             onClick: t,
             "data-testid": `button-delete-${e.id}`,
-            children: /* @__PURE__ */ n(Le, { className: "w-3 h-3" })
+            children: /* @__PURE__ */ n(De, { className: "w-3 h-3" })
           }
         )
       ] })
     ] }),
-    u && /* @__PURE__ */ n(
+    p && /* @__PURE__ */ n(
       "div",
       {
-        className: a === 1 ? "ml-6 mt-1 border-l-2 border-border pl-6" : "ml-4 mt-1 border-l border-border pl-4",
-        children: e.children.map((f) => /* @__PURE__ */ n(
+        className: o === 1 ? "ml-6 mt-1 border-l-2 border-border pl-6" : "ml-4 mt-1 border-l border-border pl-4",
+        children: e.children.map((b) => /* @__PURE__ */ n(
           he,
           {
-            property: f,
-            onUpdate: (q) => O(f.id, q),
-            onDelete: () => _(f.id),
-            level: a + 1,
-            showRegex: i
+            property: b,
+            onUpdate: (A) => w.updateChild(b.id, A),
+            onDelete: () => w.deleteChild(b.id),
+            level: o + 1,
+            showRegex: i,
+            keyEditable: s
           },
-          f.id
+          b.id
         ))
       }
     ),
-    e.type === "array" && e.items && /* @__PURE__ */ l(
+    e.type === "array" && e.items && /* @__PURE__ */ c(
       "div",
       {
-        className: a === 1 ? "ml-6 mt-1 border-l-2 border-border pl-6" : "ml-4 mt-1 border-l border-border pl-4",
+        className: o === 1 ? "ml-6 mt-1 border-l-2 border-border pl-6" : "ml-4 mt-1 border-l border-border pl-4",
         children: [
-          /* @__PURE__ */ l("div", { className: "mb-2 text-xs text-muted-foreground font-semibold uppercase", children: [
-            s("array"),
+          /* @__PURE__ */ c("div", { className: "mb-2 text-xs text-muted-foreground font-semibold uppercase", children: [
+            l("array"),
             " Items"
           ] }),
           /* @__PURE__ */ n(
             he,
             {
               property: e.items,
-              onUpdate: (f) => r({ ...e, items: f }),
+              onUpdate: (b) => r({ ...e, items: b }),
               onDelete: () => r({ ...e, items: void 0 }),
-              level: a + 1,
+              level: o + 1,
               isArrayItem: !0,
-              showRegex: i
+              showRegex: i,
+              keyEditable: s
             }
           )
         ]
@@ -3287,43 +3396,45 @@ function he({
     /* @__PURE__ */ n(
       pe,
       {
-        property: e,
-        open: c,
-        onOpenChange: m,
-        onUpdate: r,
-        isArrayItem: o,
+        property: m.data || e,
+        open: m.isOpen,
+        onOpenChange: m.setIsOpen,
+        onUpdate: (b) => {
+          r(b), m.close();
+        },
+        isArrayItem: a,
         isNewProperty: !1,
-        showRegex: i
+        showRegex: i,
+        keyEditable: s
       }
     ),
-    N && d && /* @__PURE__ */ n(
+    w.addChildDialog.isOpen && w.addChildDialog.data && /* @__PURE__ */ n(
       pe,
       {
-        property: d,
-        open: N,
+        property: w.addChildDialog.data,
+        open: w.addChildDialog.isOpen,
         isNewProperty: !0,
-        onOpenChange: (f) => {
-          f || E();
-        },
-        onUpdate: F,
-        showRegex: i
+        onOpenChange: w.addChildDialog.setIsOpen,
+        onUpdate: w.addChildDialog.confirm,
+        showRegex: i,
+        keyEditable: s
       }
     )
   ] });
 }
-const Ne = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+const Ce = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "div",
   {
     ref: t,
     className: C(
-      "shadcn-card rounded-xl border bg-card border-card-border text-card-foreground shadow-sm",
+      "rounded-xl border bg-card text-card-foreground shadow",
       e
     ),
     ...r
   }
 ));
-Ne.displayName = "Card";
-const mr = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+Ce.displayName = "Card";
+const fr = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "div",
   {
     ref: t,
@@ -3331,20 +3442,17 @@ const mr = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
     ...r
   }
 ));
-mr.displayName = "CardHeader";
-const ur = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+fr.displayName = "CardHeader";
+const gr = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "div",
   {
     ref: t,
-    className: C(
-      "text-2xl font-semibold leading-none tracking-tight",
-      e
-    ),
+    className: C("font-semibold leading-none tracking-tight", e),
     ...r
   }
 ));
-ur.displayName = "CardTitle";
-const pr = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+gr.displayName = "CardTitle";
+const br = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "div",
   {
     ref: t,
@@ -3352,10 +3460,10 @@ const pr = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
     ...r
   }
 ));
-pr.displayName = "CardDescription";
-const hr = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: C("p-6 pt-0", e), ...r }));
-hr.displayName = "CardContent";
-const fr = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
+br.displayName = "CardDescription";
+const yr = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: C("p-6 pt-0", e), ...r }));
+yr.displayName = "CardContent";
+const vr = S.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
   "div",
   {
     ref: t,
@@ -3363,98 +3471,98 @@ const fr = I.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ n(
     ...r
   }
 ));
-fr.displayName = "CardFooter";
-const gr = () => new Promise((e, r) => {
+vr.displayName = "CardFooter";
+const xr = () => new Promise((e, r) => {
   const t = document.createElement("input");
-  t.type = "file", t.accept = ".json", t.onchange = (a) => {
+  t.type = "file", t.accept = ".json", t.onchange = (o) => {
     var s;
-    const o = (s = a.target.files) == null ? void 0 : s[0];
-    if (!o) {
+    const a = (s = o.target.files) == null ? void 0 : s[0];
+    if (!a) {
       r(new Error("No file selected"));
       return;
     }
     const i = new FileReader();
-    i.onload = (c) => {
-      var m;
+    i.onload = (l) => {
+      var h;
       try {
-        const d = JSON.parse((m = c.target) == null ? void 0 : m.result);
-        e(d);
+        const m = JSON.parse((h = l.target) == null ? void 0 : h.result);
+        e(m);
       } catch {
         r(new Error("Invalid JSON file"));
       }
-    }, i.onerror = () => r(new Error("Failed to read file")), i.readAsText(o);
+    }, i.onerror = () => r(new Error("Failed to read file")), i.readAsText(a);
   }, t.click();
-}), Ye = (e, r = "schema.json") => {
-  const t = JSON.stringify(e, null, 2), a = new Blob([t], { type: "application/json" }), o = URL.createObjectURL(a), i = document.createElement("a");
-  i.href = o, i.download = r, document.body.appendChild(i), i.click(), document.body.removeChild(i), URL.revokeObjectURL(o);
+}), rt = (e, r = "schema.json") => {
+  const t = JSON.stringify(e, null, 2), o = new Blob([t], { type: "application/json" }), a = URL.createObjectURL(o), i = document.createElement("a");
+  i.href = a, i.download = r, document.body.appendChild(i), i.click(), document.body.removeChild(i), URL.revokeObjectURL(a);
 };
-function br({ schema: e }) {
-  const [r, t] = V(!1), a = JSON.stringify(e, null, 2);
-  return /* @__PURE__ */ l("div", { className: "h-full flex flex-col", children: [
-    /* @__PURE__ */ l("div", { className: "flex items-center justify-between p-4 border-b", children: [
+function wr({ schema: e }) {
+  const [r, t] = B(!1), o = JSON.stringify(e, null, 2);
+  return /* @__PURE__ */ c("div", { className: "h-full flex flex-col", children: [
+    /* @__PURE__ */ c("div", { className: "flex items-center justify-between p-4 border-b", children: [
       /* @__PURE__ */ n("h2", { className: "text-sm font-medium", children: "JSON Schema Output" }),
-      /* @__PURE__ */ l("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ c("div", { className: "flex gap-2", children: [
         /* @__PURE__ */ n(
-          R,
+          L,
           {
             variant: "outline",
             size: "sm",
             onClick: async () => {
-              await navigator.clipboard.writeText(a), t(!0), setTimeout(() => t(!1), 2e3);
+              await navigator.clipboard.writeText(o), t(!0), setTimeout(() => t(!1), 2e3);
             },
             "data-testid": "button-copy",
-            children: r ? /* @__PURE__ */ n(pt, { className: "w-4 h-4" }) : /* @__PURE__ */ n(ht, { className: "w-4 h-4" })
+            children: r ? /* @__PURE__ */ n(ft, { className: "w-4 h-4" }) : /* @__PURE__ */ n(gt, { className: "w-4 h-4" })
           }
         ),
         /* @__PURE__ */ n(
-          R,
+          L,
           {
             variant: "outline",
             size: "sm",
             onClick: () => {
-              Ye(e, "schema.json");
+              rt(e, "schema.json");
             },
             "data-testid": "button-download",
-            children: /* @__PURE__ */ n(ft, { className: "w-4 h-4" })
+            children: /* @__PURE__ */ n(bt, { className: "w-4 h-4" })
           }
         )
       ] })
     ] }),
-    /* @__PURE__ */ n("div", { className: "flex-1 overflow-auto", children: /* @__PURE__ */ n(Ne, { className: "m-4 bg-muted/30", children: /* @__PURE__ */ n(
+    /* @__PURE__ */ n("div", { className: "flex-1 overflow-auto", children: /* @__PURE__ */ n(Ce, { className: "m-4 bg-muted/30", children: /* @__PURE__ */ n(
       "pre",
       {
         className: "p-6 text-xs font-mono overflow-auto",
         "data-testid": "text-json-output",
-        children: /* @__PURE__ */ n("code", { children: a })
+        children: /* @__PURE__ */ n("code", { children: o })
       }
     ) }) })
   ] });
 }
-function yr({
+function Nr({
   title: e,
   description: r,
   version: t,
-  onUpdate: a
+  onUpdate: o
 }) {
-  const [o, i] = V(!1);
-  return /* @__PURE__ */ l(Ne, { className: "p-4", children: [
-    /* @__PURE__ */ l(
-      R,
+  const [a, i] = B(!1);
+  return /* @__PURE__ */ c(Ce, { className: "p-4", children: [
+    /* @__PURE__ */ c(
+      L,
       {
         variant: "ghost",
-        onClick: () => i(!o),
+        onClick: () => i(!a),
         className: "w-full justify-between px-2 h-auto hover:bg-transparent",
         "data-testid": "button-toggle-metadata",
         children: [
           /* @__PURE__ */ n("h3", { className: "text-sm font-medium", children: "Schema Metadata" }),
-          o ? /* @__PURE__ */ n(ye, { className: "w-4 h-4" }) : /* @__PURE__ */ n(gt, { className: "w-4 h-4" })
+          a ? /* @__PURE__ */ n(ye, { className: "w-4 h-4" }) : /* @__PURE__ */ n(yt, { className: "w-4 h-4" })
         ]
       }
     ),
-    o && /* @__PURE__ */ l("div", { className: "mt-4 space-y-4", children: [
-      /* @__PURE__ */ l("div", { className: "space-y-2", children: [
+    a && /* @__PURE__ */ c("div", { className: "mt-4 space-y-4", children: [
+      /* @__PURE__ */ c("div", { className: "space-y-2", children: [
         /* @__PURE__ */ n(
-          z,
+          T,
           {
             htmlFor: "schema-title",
             className: "text-xs text-muted-foreground",
@@ -3462,19 +3570,19 @@ function yr({
           }
         ),
         /* @__PURE__ */ n(
-          L,
+          E,
           {
             id: "schema-title",
             placeholder: "My Schema",
             value: e,
-            onChange: (s) => a("title", s.target.value),
+            onChange: (s) => o("title", s.target.value),
             "data-testid": "input-title"
           }
         )
       ] }),
-      /* @__PURE__ */ l("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ c("div", { className: "space-y-2", children: [
         /* @__PURE__ */ n(
-          z,
+          T,
           {
             htmlFor: "schema-description",
             className: "text-xs text-muted-foreground",
@@ -3487,16 +3595,16 @@ function yr({
             id: "schema-description",
             placeholder: "Describe your schema...",
             value: r,
-            onChange: (s) => a("description", s.target.value),
+            onChange: (s) => o("description", s.target.value),
             className: "resize-none",
             rows: 3,
             "data-testid": "input-schema-description"
           }
         )
       ] }),
-      /* @__PURE__ */ l("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ c("div", { className: "space-y-2", children: [
         /* @__PURE__ */ n(
-          z,
+          T,
           {
             htmlFor: "schema-version",
             className: "text-xs text-muted-foreground",
@@ -3504,12 +3612,12 @@ function yr({
           }
         ),
         /* @__PURE__ */ n(
-          L,
+          E,
           {
             id: "schema-version",
             placeholder: "1.0.0",
             value: t,
-            onChange: (s) => a("version", s.target.value),
+            onChange: (s) => o("version", s.target.value),
             "data-testid": "input-version"
           }
         )
@@ -3517,30 +3625,30 @@ function yr({
     ] })
   ] });
 }
-const oe = (e, r, t = !0) => {
-  const a = {
+const re = (e, r, t = !0) => {
+  const o = {
     type: "object"
   };
-  t && r && (r.title && (a.title = r.title), r.description && (a.description = r.description));
-  const o = fe(e);
-  Object.keys(o).length > 0 && (a.properties = o);
+  t && r && (r.title && (o.title = r.title), r.description && (o.description = r.description));
+  const a = fe(e);
+  Object.keys(a).length > 0 && (o.properties = a);
   const i = e.filter((s) => s.required && s.key).map((s) => s.key);
-  return i.length > 0 && (a.required = i), a;
+  return i.length > 0 && (o.required = i), o;
 }, fe = (e) => {
   const r = {};
   return e.forEach((t) => {
     if (!t.key) return;
-    const o = { type: t.type === "file" ? "string" : t.type };
-    if (t.title && (o.title = t.title), t.description && (o.description = t.description), t.type === "file" && (o.format = "filename"), t.type === "string" && (t.minLength !== void 0 && (o.minLength = t.minLength), t.maxLength !== void 0 && (o.maxLength = t.maxLength), t.pattern && (o.pattern = t.pattern), t.enum && t.enum.length > 0 && (o.enum = t.enum)), (t.type === "number" || t.type === "integer") && (t.minimum !== void 0 && (o.minimum = t.minimum), t.maximum !== void 0 && (o.maximum = t.maximum)), t.type === "array" && (t.minItems !== void 0 && (o.minItems = t.minItems), t.maxItems !== void 0 && (o.maxItems = t.maxItems), t.uniqueItems && (o.uniqueItems = t.uniqueItems), t.items && (o.items = fe([t.items])[t.items.key] || {
+    const a = { type: t.type === "file" ? "string" : t.type };
+    if (t.title && (a.title = t.title), t.description && (a.description = t.description), t.type === "file" && (a.format = "filename"), t.type === "string" && (t.minLength !== void 0 && (a.minLength = t.minLength), t.maxLength !== void 0 && (a.maxLength = t.maxLength), t.pattern && (a.pattern = t.pattern), t.enum && t.enum.length > 0 && (a.enum = t.enum)), (t.type === "number" || t.type === "integer") && (t.minimum !== void 0 && (a.minimum = t.minimum), t.maximum !== void 0 && (a.maximum = t.maximum)), t.type === "array" && (t.minItems !== void 0 && (a.minItems = t.minItems), t.maxItems !== void 0 && (a.maxItems = t.maxItems), t.uniqueItems && (a.uniqueItems = t.uniqueItems), t.items && (a.items = fe([t.items])[t.items.key] || {
       type: t.items.type
     })), t.type === "object" && t.children && t.children.length > 0) {
-      o.properties = fe(t.children);
+      a.properties = fe(t.children);
       const i = t.children.filter((s) => s.required && s.key).map((s) => s.key);
-      i.length > 0 && (o.required = i);
+      i.length > 0 && (a.required = i);
     }
-    r[t.key] = o;
+    r[t.key] = a;
   }), r;
-}, vr = (e) => {
+}, Cr = (e) => {
   const r = {
     properties: []
   };
@@ -3553,243 +3661,272 @@ const oe = (e, r, t = !0) => {
     e.properties,
     Array.isArray(e.required) ? e.required : []
   )), r;
-}, ge = (e, r = []) => e ? Object.entries(e).filter(([, t]) => typeof t == "object").map(([t, a]) => {
-  const o = a;
-  let i = typeof o.type == "string" ? o.type : "string";
-  i === "string" && o.format === "filename" && (i = "file");
+}, ge = (e, r = []) => e ? Object.entries(e).filter(([, t]) => typeof t == "object").map(([t, o]) => {
+  const a = o;
+  let i = typeof a.type == "string" ? a.type : "string";
+  i === "string" && a.format === "filename" && (i = "file");
   const s = {
     id: we(),
     key: t,
-    title: typeof o.title == "string" ? o.title : void 0,
+    title: typeof a.title == "string" ? a.title : void 0,
     type: i,
-    description: typeof o.description == "string" ? o.description : void 0,
+    description: typeof a.description == "string" ? a.description : void 0,
     required: r.includes(t)
   };
-  return o.minLength !== void 0 && (s.minLength = o.minLength), o.maxLength !== void 0 && (s.maxLength = o.maxLength), o.pattern && (s.pattern = o.pattern), o.enum && Array.isArray(o.enum) && (s.enum = o.enum), o.minimum !== void 0 && (s.minimum = o.minimum), o.maximum !== void 0 && (s.maximum = o.maximum), o.minItems !== void 0 && (s.minItems = o.minItems), o.maxItems !== void 0 && (s.maxItems = o.maxItems), o.uniqueItems && (s.uniqueItems = o.uniqueItems), s.type === "array" && o.items && typeof o.items == "object" && !Array.isArray(o.items) && (s.items = ge(
-    { item: o.items },
+  return a.minLength !== void 0 && (s.minLength = a.minLength), a.maxLength !== void 0 && (s.maxLength = a.maxLength), a.pattern && (s.pattern = a.pattern), a.enum && Array.isArray(a.enum) && (s.enum = a.enum), a.minimum !== void 0 && (s.minimum = a.minimum), a.maximum !== void 0 && (s.maximum = a.maximum), a.minItems !== void 0 && (s.minItems = a.minItems), a.maxItems !== void 0 && (s.maxItems = a.maxItems), a.uniqueItems && (s.uniqueItems = a.uniqueItems), s.type === "array" && a.items && typeof a.items == "object" && !Array.isArray(a.items) && (s.items = ge(
+    { item: a.items },
     []
-  ).find((c) => c.key === "item")), o.properties && typeof o.properties == "object" && (s.children = ge(
-    o.properties,
-    Array.isArray(o.required) ? o.required : []
+  ).find((l) => l.key === "item")), a.properties && typeof a.properties == "object" && (s.children = ge(
+    a.properties,
+    Array.isArray(a.required) ? a.required : []
   )), s;
-}) : [], xr = ({
+}) : [], kr = ({
   schema: e,
   onChange: r,
   includeMetadata: t = !0
 }) => {
-  const { properties: a, metadata: o } = nt(
-    () => vr(e),
+  const { properties: o, metadata: a } = ot(
+    () => Cr(e),
     [e]
-  ), i = a, s = o || {
+  ), i = o, s = a || {
     title: "",
     description: "",
     version: ""
-  }, c = H(() => ({
+  }, l = _(() => ({
     id: we(),
     key: "",
     type: "string",
     required: !1
-  }), []), m = H((y, p) => {
-    const h = i.some((u) => u.id === y);
-    let v;
-    h ? v = i.map((u) => u.id === y ? p : u) : v = [...i, p];
-    const T = oe(v, s, t);
-    r(T);
-  }, [i, s, t, r]), d = H((y) => {
-    const p = i.filter((v) => v.id !== y), h = oe(p, s, t);
-    r(h);
-  }, [i, s, t, r]), g = H(() => {
-    const p = oe([], { title: "", description: "" }, t);
-    r(p);
-  }, [t, r]), N = H((y, p) => {
-    const h = { ...s, [y]: p }, v = oe(i, h, t);
+  }), []), h = _(
+    (v, x) => {
+      const p = i.some((A) => A.id === v);
+      let N;
+      p ? N = i.map((A) => A.id === v ? x : A) : N = [...i, x];
+      const b = re(
+        N,
+        s,
+        t
+      );
+      r(b);
+    },
+    [i, s, t, r]
+  ), m = _(
+    (v) => {
+      const x = i.filter((N) => N.id !== v), p = re(
+        x,
+        s,
+        t
+      );
+      r(p);
+    },
+    [i, s, t, r]
+  ), d = _(() => {
+    const x = re([], { title: "", description: "" }, t);
+    r(x);
+  }, [t, r]), f = _(
+    (v, x) => {
+      const p = { ...s, [v]: x }, N = re(
+        i,
+        p,
+        t
+      );
+      r(N);
+    },
+    [i, s, t, r]
+  ), g = _(async () => {
+    const v = await xr();
     r(v);
-  }, [i, s, t, r]), x = H(async () => {
-    const y = await gr();
-    r(y);
-  }, [r]), S = H(() => {
-    Ye(e, "schema.json");
+  }, [r]), w = _(() => {
+    rt(e, "schema.json");
   }, [e]);
   return {
     properties: i,
     metadata: s,
-    addProperty: c,
-    updateProperty: m,
-    deleteProperty: d,
-    clearAll: g,
-    updateMetadata: N,
-    importSchema: x,
-    downloadSchema: S
+    addProperty: l,
+    updateProperty: h,
+    deleteProperty: m,
+    clearAll: d,
+    updateMetadata: f,
+    importSchema: g,
+    downloadSchema: w
   };
 };
-function wr() {
-  const [e, r] = V("light");
+function Ir() {
+  const [e, r] = B("light");
   return be(() => {
-    const o = localStorage.getItem("theme") || (window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light");
-    r(o), document.documentElement.classList.toggle("dark", o === "dark");
+    const a = localStorage.getItem("theme") || (window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light");
+    r(a), document.documentElement.classList.toggle("dark", a === "dark");
   }, []), /* @__PURE__ */ n(
-    R,
+    L,
     {
       variant: "ghost",
       size: "icon",
       onClick: () => {
-        const a = e === "light" ? "dark" : "light";
-        r(a), localStorage.setItem("theme", a), document.documentElement.classList.toggle("dark", a === "dark");
+        const o = e === "light" ? "dark" : "light";
+        r(o), localStorage.setItem("theme", o), document.documentElement.classList.toggle("dark", o === "dark");
       },
       "data-testid": "button-theme-toggle",
-      children: e === "light" ? /* @__PURE__ */ n(bt, { className: "w-4 h-4" }) : /* @__PURE__ */ n(yt, { className: "w-4 h-4" })
+      children: e === "light" ? /* @__PURE__ */ n(vt, { className: "w-4 h-4" }) : /* @__PURE__ */ n(xt, { className: "w-4 h-4" })
     }
   );
 }
-function Ir({
+function Pr({
   schema: e,
   onChange: r,
   showMetadata: t = !1,
-  showImport: a = !0,
-  showClear: o = !0,
+  showImport: o = !0,
+  showClear: a = !0,
   showOutput: i = !0,
   showHeader: s = !0,
-  className: c = "",
-  showSummary: m = !1,
-  typeLabels: d,
-  propertyLabel: g = { singular: "property", plural: "properties" },
-  showRegex: N = !1
+  className: l = "",
+  showSummary: h = !1,
+  typeLabels: m,
+  propertyLabel: d = { singular: "property", plural: "properties" },
+  showRegex: f = !1,
+  keyEditable: g = !1
 }) {
-  const [x, S] = V(null), [y, p] = V(!1), {
-    properties: h,
+  const {
+    properties: w,
     metadata: v,
-    addProperty: T,
-    updateProperty: u,
-    deleteProperty: A,
-    clearAll: O,
-    updateMetadata: _,
-    importSchema: M
-  } = xr({
+    addProperty: x,
+    updateProperty: p,
+    deleteProperty: N,
+    clearAll: b,
+    updateMetadata: A,
+    importSchema: u
+  } = kr({
     schema: e,
     onChange: r,
     includeMetadata: t
-  }), F = () => {
-    const f = T();
-    S(f), p(!0);
-  }, E = (f) => {
-    u(f.id, f), p(!1), S(null);
-  }, J = () => {
-    p(!1), S(null);
-  }, G = () => {
-    O();
-  }, w = async () => {
-    await M();
+  }), j = Ne({
+    createInitialData: () => x(),
+    onConfirm: (P) => {
+      p(P.id, P);
+    }
+  }), $ = () => {
+    b();
+  }, K = async () => {
+    await u();
   };
-  return /* @__PURE__ */ n(cr, { customLabels: d, children: /* @__PURE__ */ l("div", { className: `${c} flex flex-col json-schema-builder-react`, children: [
-    s && /* @__PURE__ */ n("header", { className: "h-16 border-b flex items-center justify-between px-6", children: /* @__PURE__ */ l("div", { className: "flex items-center gap-3", children: [
-      a && /* @__PURE__ */ n(
-        R,
+  return /* @__PURE__ */ n(ur, { customLabels: m, children: /* @__PURE__ */ c("div", { className: `${l} flex flex-col json-schema-builder-react`, children: [
+    s && /* @__PURE__ */ n("header", { className: "h-16 border-b flex items-center justify-between px-6", children: /* @__PURE__ */ c("div", { className: "flex items-center gap-3", children: [
+      o && /* @__PURE__ */ n(
+        L,
         {
           variant: "outline",
           size: "sm",
-          onClick: w,
+          onClick: K,
           "data-testid": "button-import",
-          children: /* @__PURE__ */ n(vt, { className: "w-4 h-4" })
+          children: /* @__PURE__ */ n(wt, { className: "w-4 h-4" })
         }
       ),
-      o && /* @__PURE__ */ n(
-        R,
+      a && /* @__PURE__ */ n(
+        L,
         {
           variant: "outline",
           size: "sm",
-          onClick: G,
-          disabled: h.length === 0,
+          onClick: $,
+          disabled: w.length === 0,
           "data-testid": "button-clear",
-          children: /* @__PURE__ */ n(Le, { className: "w-4 h-4" })
+          children: /* @__PURE__ */ n(De, { className: "w-4 h-4" })
         }
       ),
-      /* @__PURE__ */ n(wr, {})
+      /* @__PURE__ */ n(Ir, {})
     ] }) }),
-    /* @__PURE__ */ l("div", { className: "flex-1 flex overflow-hidden", children: [
-      /* @__PURE__ */ n("div", { className: i ? "w-3/5 border-r" : "w-full", children: /* @__PURE__ */ l("div", { className: "h-full overflow-auto p-2 space-y-4", children: [
-        t && /* @__PURE__ */ n(
-          yr,
-          {
-            title: v.title,
-            description: v.description,
-            version: v.version,
-            onUpdate: (f, q) => _(f, q)
-          }
-        ),
-        h.length === 0 ? /* @__PURE__ */ l("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
-          /* @__PURE__ */ n("div", { className: "w-16 h-16 rounded-full bg-muted flex items-center justify-center mb-4", children: /* @__PURE__ */ n(re, { className: "w-8 h-8 text-muted-foreground" }) }),
-          /* @__PURE__ */ l("h2", { className: "text-lg font-medium mb-2", children: [
-            "No ",
-            g.plural,
-            " yet"
-          ] }),
-          /* @__PURE__ */ l("p", { className: "text-sm text-muted-foreground mb-6 max-w-sm", children: [
-            "Start building your JSON schema by adding your first",
-            " ",
-            g.singular
-          ] }),
-          /* @__PURE__ */ l(R, { onClick: F, "data-testid": "button-add-first", children: [
-            /* @__PURE__ */ n(re, { className: "w-4 h-4 mr-2" }),
-            "Add ",
-            g.singular
-          ] })
-        ] }) : /* @__PURE__ */ l(et, { children: [
-          /* @__PURE__ */ n("div", { className: "space-y-1", children: h.map((f) => /* @__PURE__ */ n(
-            he,
-            {
-              property: f,
-              onUpdate: (q) => u(f.id, q),
-              onDelete: () => A(f.id),
-              showRegex: N
-            },
-            f.id
-          )) }),
-          /* @__PURE__ */ n("div", { className: "pt-6", children: /* @__PURE__ */ l(
-            R,
+    /* @__PURE__ */ c("div", { className: "flex-1 flex overflow-hidden", children: [
+      /* @__PURE__ */ n("div", { className: i ? "w-3/5 border-r" : "w-full", children: /* @__PURE__ */ c("div", { className: "h-full flex flex-col", children: [
+        /* @__PURE__ */ c("div", { className: "flex-1 overflow-auto p-2 space-y-4", children: [
+          t && /* @__PURE__ */ n(
+            Nr,
             {
-              onClick: F,
-              className: "w-full",
-              variant: "outline",
-              "data-testid": "button-add-property",
-              children: [
-                /* @__PURE__ */ n(re, { className: "w-4 h-4 mr-2" }),
-                "Add ",
-                g.singular
-              ]
+              title: v.title,
+              description: v.description,
+              version: v.version,
+              onUpdate: (P, O) => A(P, O)
             }
-          ) }),
-          m && /* @__PURE__ */ l("div", { className: "pt-4 border-t flex items-center justify-between text-sm text-muted-foreground", children: [
-            /* @__PURE__ */ l("span", { children: [
-              h.length,
+          ),
+          w.length === 0 ? /* @__PURE__ */ c("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
+            /* @__PURE__ */ n("div", { className: "w-16 h-16 rounded-full bg-muted flex items-center justify-center mb-4", children: /* @__PURE__ */ n(Q, { className: "w-8 h-8 text-muted-foreground" }) }),
+            /* @__PURE__ */ c("h2", { className: "text-lg font-medium mb-2", children: [
+              "No ",
+              d.plural,
+              " yet"
+            ] }),
+            /* @__PURE__ */ c("p", { className: "text-sm text-muted-foreground mb-6 max-w-sm", children: [
+              "Start building your JSON schema by adding your first",
               " ",
-              h.length === 1 ? g.singular : g.plural
+              d.singular
             ] }),
-            /* @__PURE__ */ l("span", { children: [
-              h.filter((f) => f.required).length,
-              " required"
+            /* @__PURE__ */ c(
+              L,
+              {
+                onClick: () => j.open(),
+                "data-testid": "button-add-first",
+                children: [
+                  /* @__PURE__ */ n(Q, { className: "w-4 h-4 mr-2" }),
+                  "Add ",
+                  d.singular
+                ]
+              }
+            )
+          ] }) : /* @__PURE__ */ c(Ee, { children: [
+            /* @__PURE__ */ n("div", { className: "space-y-1", children: w.map((P) => /* @__PURE__ */ n(
+              he,
+              {
+                property: P,
+                onUpdate: (O) => p(P.id, O),
+                onDelete: () => N(P.id),
+                showRegex: f,
+                keyEditable: g
+              },
+              P.id
+            )) }),
+            h && /* @__PURE__ */ c("div", { className: "pt-4 border-t flex items-center justify-between text-sm text-muted-foreground", children: [
+              /* @__PURE__ */ c("span", { children: [
+                w.length,
+                " ",
+                w.length === 1 ? d.singular : d.plural
+              ] }),
+              /* @__PURE__ */ c("span", { children: [
+                w.filter((P) => P.required).length,
+                " required"
+              ] })
             ] })
           ] })
-        ] })
+        ] }),
+        w.length > 0 && /* @__PURE__ */ n("div", { className: "border-t p-2 pt-4 bg-background", children: /* @__PURE__ */ c(
+          L,
+          {
+            onClick: () => j.open(),
+            className: "w-full",
+            variant: "outline",
+            "data-testid": "button-add-property",
+            children: [
+              /* @__PURE__ */ n(Q, { className: "w-4 h-4" }),
+              "Add ",
+              d.singular
+            ]
+          }
+        ) })
       ] }) }),
-      i && /* @__PURE__ */ n("div", { className: "w-2/5", children: /* @__PURE__ */ n(br, { schema: e }) })
+      i && /* @__PURE__ */ n("div", { className: "w-2/5", children: /* @__PURE__ */ n(wr, { schema: e }) })
     ] }),
-    y && x && /* @__PURE__ */ n(
+    j.isOpen && j.data && /* @__PURE__ */ n(
       pe,
       {
-        property: x,
-        open: y,
+        property: j.data,
+        open: j.isOpen,
         isNewProperty: !0,
-        onOpenChange: (f) => {
-          f || J();
-        },
-        propertyLabel: g,
-        onUpdate: E,
-        showRegex: N
+        onOpenChange: j.setIsOpen,
+        propertyLabel: d,
+        onUpdate: j.confirm,
+        showRegex: f,
+        keyEditable: g
       }
     )
   ] }) });
 }
 export {
-  Ir as JsonSchemaBuilder
+  Pr as JsonSchemaBuilder
 };
 //# sourceMappingURL=index.js.map