@chaibuilder/sdk 4.0.0-beta.1 → 4.0.0-beta.2

package/dist/json-diff-viewer-B5dr-Y_L.js

@@ -0,0 +1,258 @@
+import { jsx as e, jsxs as h } from "react/jsx-runtime";
+import { D as V, d as _, e as q, f as G, aj as $, a5 as I, B as z, ak as P } from "./index-S8ibZk9Q.js";
+import { formatDate as Q } from "date-fns";
+import { startsWith as T, replace as W, isString as X, trim as Y, isArray as Z, map as ee, isPlainObject as te, mapValues as re } from "lodash-es";
+import { FileJson as B, Loader as ne, Check as F, Copy as H } from "lucide-react";
+import { useState as D, useMemo as A } from "react";
+import { parseDiff as se, Diff as le, Hunk as ae } from "react-diff-view";
+import { ar as ie, as as oe, A as ce, ap as de } from "./index-BDnwJqMw.js";
+import { useQuery as fe } from "@tanstack/react-query";
+function me(t, n) {
+  const o = ie(), s = oe(), u = T(t.uid, "draft:") || T(n.uid, "live:");
+  return fe({
+    queryKey: ["revision-comparison", t.uid, n.uid],
+    queryFn: async () => {
+      if (!t.uid || !n.uid)
+        throw new Error("Both revision IDs are required for comparison");
+      const l = (f) => f === "draft" || f === "live" ? f : "revision", r = (f) => W(f.uid, `${f.label}:`, "");
+      return await s(o, {
+        action: ce.GET_COMPARE_DATA,
+        data: {
+          versions: {
+            version1: { type: l(t.label), id: r(t) },
+            version2: { type: l(n.label), id: r(n) }
+          }
+        }
+      });
+    },
+    enabled: !!t.uid && !!n.uid,
+    staleTime: u ? 0 : 1 / 0
+  });
+}
+const he = ({ version: t }) => {
+  const n = t == null ? void 0 : t.item, { data: o } = de(n == null ? void 0 : n.currentEditor), s = t.label === "live", u = t.label === "draft";
+  return /* @__PURE__ */ h(
+    "span",
+    {
+      className: `flex items-center gap-x-2 rounded border bg-white px-2 text-xs shadow-lg ${s ? "border-green-500/30" : u ? "border-amber-500/30" : "border-purple-500/30"}`,
+      children: [
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: "h-full items-center rounded px-1.5 py-0.5 font-medium capitalize" + (s ? " bg-green-500 text-green-50" : u ? " bg-amber-500 text-amber-50" : " bg-purple-500 text-purple-50"),
+            children: t.label
+          }
+        ),
+        /* @__PURE__ */ h("div", { className: "py-1 text-xs font-light leading-none text-gray-800", children: [
+          /* @__PURE__ */ h("div", { children: [
+            /* @__PURE__ */ e("span", { className: "font-light opacity-90", children: u ? "Currently editing" : "Published by" }),
+            !u && /* @__PURE__ */ e("span", { className: "pl-1 font-medium", children: (o == null ? void 0 : o.name) || "Unknown" })
+          ] }),
+          /* @__PURE__ */ e("div", { className: "text-[10px] leading-tight", children: Q(n.createdAt, "dd MMM yyyy, h:mm a") })
+        ] })
+      ]
+    }
+  );
+}, K = ({ version: t }) => /* @__PURE__ */ e(he, { version: t });
+function ue(t, n, o = "data.json") {
+  const s = JSON.stringify(t, null, 2), u = JSON.stringify(n, null, 2), l = s.split(`
+`), r = u.split(`
+`);
+  let d = `--- a/${o}
+`;
+  d += `+++ b/${o}
+`;
+  const f = [];
+  let c = 0, p = 0;
+  for (; c < l.length || p < r.length; ) {
+    const g = l[c] || "", N = r[p] || "";
+    if (g === N)
+      f.push(` ${g}`), c++, p++;
+    else {
+      let m = -1, x = -1;
+      for (let a = c + 1; a < l.length; a++)
+        if (r[p] === l[a]) {
+          m = a;
+          break;
+        }
+      for (let a = p + 1; a < r.length; a++)
+        if (l[c] === r[a]) {
+          x = a;
+          break;
+        }
+      if (m !== -1 && (x === -1 || m - c <= x - p)) {
+        for (let a = c; a < m; a++)
+          f.push(`-${l[a]}`);
+        c = m;
+      } else if (x !== -1) {
+        for (let a = p; a < x; a++)
+          f.push(`+${r[a]}`);
+        p = x;
+      } else
+        g && f.push(`-${g}`), N && f.push(`+${N}`), c++, p++;
+    }
+  }
+  const y = l.length, j = r.length;
+  return d += `@@ -1,${y} +1,${j} @@
+`, d += f.join(`
+`) + `
+`, d;
+}
+function S(t, n = !0, o = !1) {
+  if (X(t)) {
+    const s = Y(t);
+    if (T(s, "{") || T(s, "[") || n && (s === "true" || s === "false" || s === "null" || /^-?\d+(\.\d+)?([eE][+-]?\d+)?$/.test(s)))
+      try {
+        const l = JSON.parse(s);
+        return S(l, n, o);
+      } catch {
+        if (o)
+          throw new Error(`Invalid JSON string: ${s}`);
+        return {};
+      }
+    return t;
+  }
+  return Z(t) ? ee(t, (s) => S(s, n, o)) : te(t) ? re(t, (s) => S(s, n, o)) : t;
+}
+const pe = (t) => {
+  switch (t) {
+    case "blocks":
+      return "Blocks";
+    case "seo":
+      return "SEO";
+    case "tracking":
+      return "Tracking";
+    default:
+      return t;
+  }
+}, ge = (t, n) => {
+  if (!t || !n) return [{ key: "blocks", label: "Blocks" }];
+  const o = Object.keys(t), s = Object.keys(n);
+  return o.filter((r) => s.includes(r)).map((r) => ({ key: r, label: pe(r) })).filter((r) => r.key.length > 0);
+}, xe = (t, n = 3) => {
+  const o = /* @__PURE__ */ new Set();
+  t.map((r, d) => ({ change: r, index: d })).filter(({ change: r }) => r.type !== "normal").map(({ index: r }) => r).forEach((r) => {
+    const d = Math.max(0, r - n), f = Math.min(t.length - 1, r + n);
+    for (let c = d; c <= f; c++)
+      o.add(c);
+  });
+  const u = [];
+  let l = -1;
+  return t.forEach((r, d) => {
+    if (o.has(d)) {
+      if (l !== -1 && d - l > 1) {
+        const f = t[l].lineNumber != null ? t[l].lineNumber + 1 : l + 2, c = t[d].lineNumber != null ? t[d].lineNumber - 1 : d;
+        u.push({
+          content: /* @__PURE__ */ e(P, { className: "pointer-events-none w-60 -translate-x-1/2 cursor-default border-none bg-transparent py-1 shadow-none", children: /* @__PURE__ */ h("span", { className: "rounded border border-border bg-muted px-3 py-1 text-xs font-light leading-none text-muted-foreground", children: [
+            "No changes from ",
+            f,
+            " to ",
+            c,
+            " line"
+          ] }) })
+        });
+      }
+      u.push(r), l = d;
+    }
+  }), u;
+};
+function Te({ open: t, compare: n, onOpenChange: o }) {
+  const s = n[0], u = n[1], [l, r] = D(null), [d, f] = D("split"), [c, p] = D(!1), [y, j] = D(!0), [g, N] = D("blocks"), { data: m, isLoading: x } = me(s, u), { leftData: a, rightData: w, options: U } = A(() => {
+    var b, R;
+    const i = (b = m == null ? void 0 : m.version1) == null ? void 0 : b[g], v = (R = m == null ? void 0 : m.version2) == null ? void 0 : R[g], k = S(i), C = S(v), J = ge(m == null ? void 0 : m.version1, m == null ? void 0 : m.version2);
+    return { leftData: k, rightData: C, options: J };
+  }, [m, g]), O = A(() => !a || !w ? "" : ue(a, w), [a, w]), E = A(() => {
+    if (!O) return [];
+    try {
+      return se(O);
+    } catch (i) {
+      return console.error("Failed to parse diff:", i), [];
+    }
+  }, [O]), L = async (i, v) => {
+    try {
+      await navigator.clipboard.writeText(JSON.stringify(i, null, 2)), r(v), setTimeout(() => r(null), 2e3);
+    } catch (k) {
+      console.error("Failed to copy:", k);
+    }
+  }, M = (i) => JSON.stringify(i, null, 2);
+  return /* @__PURE__ */ e(V, { open: t, onOpenChange: o, children: /* @__PURE__ */ h(_, { className: "flex h-[90vh] w-[95vw] max-w-[1900px] flex-col p-6", children: [
+    /* @__PURE__ */ e(q, { className: "pb-4 pt-0", children: /* @__PURE__ */ h(G, { className: "flex items-center justify-between gap-2 leading-none", children: [
+      /* @__PURE__ */ h("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ e(B, { className: "h-5 w-5" }),
+        "Compare",
+        "",
+        U.map((i) => /* @__PURE__ */ e(
+          "div",
+          {
+            className: `cursor-pointer rounded-full border px-2.5 py-1 text-xs leading-none ${g === i.key ? "border-blue-500 bg-blue-500 text-white" : "border-gray-600 text-gray-600 hover:bg-gray-200"}`,
+            onClick: () => N(i.key),
+            children: i.label
+          },
+          i.key
+        ))
+      ] }),
+      /* @__PURE__ */ e("div", { className: "flex flex-1 items-center justify-end pr-8", children: /* @__PURE__ */ h("div", { className: "flex w-max items-center justify-end gap-2 rounded-md border px-1.5 py-1", children: [
+        /* @__PURE__ */ h("div", { className: "flex items-center gap-2 px-2 py-1", children: [
+          /* @__PURE__ */ e(
+            $,
+            {
+              disabled: c,
+              checked: c ? !0 : d === "split",
+              onCheckedChange: (i) => f(i ? "split" : "unified")
+            }
+          ),
+          /* @__PURE__ */ e("label", { className: "text-sm", children: "Split View" })
+        ] }),
+        /* @__PURE__ */ h("div", { className: "flex items-center gap-2 px-2 py-1", children: [
+          /* @__PURE__ */ e($, { checked: c, onCheckedChange: (i) => p(i) }),
+          /* @__PURE__ */ e("label", { className: "text-sm", children: "Show Raw Data" })
+        ] }),
+        /* @__PURE__ */ h("div", { className: "flex items-center gap-2 px-2 py-1", children: [
+          /* @__PURE__ */ e($, { checked: y, onCheckedChange: (i) => j(i) }),
+          /* @__PURE__ */ e("label", { className: "text-sm", children: "Hide Common Data" })
+        ] })
+      ] }) })
+    ] }) }),
+    x ? /* @__PURE__ */ e("div", { className: "flex h-full w-full items-center justify-center", children: /* @__PURE__ */ e(ne, { className: "h-6 w-6 animate-spin text-primary" }) }) : /* @__PURE__ */ e("div", { className: "flex min-h-0 flex-1 flex-col", children: /* @__PURE__ */ h("div", { className: "relative min-h-0 flex-1", children: [
+      /* @__PURE__ */ h("div", { className: "absolute -top-5 z-50 mt-0.5 flex w-full items-center justify-between gap-2", children: [
+        /* @__PURE__ */ e("div", { className: "flex w-1/2 items-center justify-center gap-2", children: /* @__PURE__ */ e(K, { version: s }) }),
+        /* @__PURE__ */ e("div", { className: "flex w-1/2 items-center justify-center gap-2", children: /* @__PURE__ */ e(K, { version: u }) })
+      ] }),
+      c ? /* @__PURE__ */ h("div", { className: "grid h-full grid-cols-2 gap-3 rounded-lg border", children: [
+        /* @__PURE__ */ h("div", { className: "relative flex min-h-0 flex-col border-r", children: [
+          /* @__PURE__ */ e("div", { className: "absolute -top-4 right-4 z-50", children: /* @__PURE__ */ h(z, { variant: "outline", size: "sm", onClick: () => L(a, "left"), children: [
+            l === "left" ? /* @__PURE__ */ e(F, { className: "text-green-500" }) : /* @__PURE__ */ e(H, {}),
+            "Copy"
+          ] }) }),
+          /* @__PURE__ */ e(I, { className: "flex-1 rounded-lg bg-slate-50 p-3 dark:bg-slate-900", children: /* @__PURE__ */ e("pre", { className: "whitespace-pre-wrap font-mono text-xs", children: M(a) }) })
+        ] }),
+        /* @__PURE__ */ h("div", { className: "relative flex min-h-0 flex-col", children: [
+          /* @__PURE__ */ e("div", { className: "absolute -top-4 right-4 z-50", children: /* @__PURE__ */ h(z, { variant: "outline", size: "sm", onClick: () => L(w, "right"), children: [
+            l === "right" ? /* @__PURE__ */ e(F, { className: "text-green-500" }) : /* @__PURE__ */ e(H, {}),
+            "Copy"
+          ] }) }),
+          /* @__PURE__ */ e(I, { className: "flex-1 rounded-lg bg-slate-50 p-3 dark:bg-slate-900", children: /* @__PURE__ */ e("pre", { className: "whitespace-pre-wrap font-mono text-xs", children: M(w) }) })
+        ] })
+      ] }) : /* @__PURE__ */ e(I, { className: "h-full overflow-y-auto rounded-lg border bg-slate-50 text-xs dark:bg-slate-900", children: E.length === 0 ? /* @__PURE__ */ e("div", { className: "flex h-full items-center justify-center p-6", children: /* @__PURE__ */ h("div", { className: "text-center text-muted-foreground", children: [
+        /* @__PURE__ */ e(B, { className: "mx-auto mb-2 h-8 w-8 opacity-50" }),
+        /* @__PURE__ */ e("p", { children: "No differences found or unable to parse diff" })
+      ] }) }) : /* @__PURE__ */ e("div", { children: E.map((i, v) => /* @__PURE__ */ e("div", { className: "relative mb-4", children: /* @__PURE__ */ e(
+        le,
+        {
+          viewType: d,
+          diffType: i.type,
+          hunks: i.hunks,
+          className: "rounded-lg text-xs",
+          children: (k) => k.map((C, J) => {
+            const b = y ? xe(C.changes) : C.changes;
+            return (b == null ? void 0 : b.length) === 0 ? /* @__PURE__ */ e("div", { className: "absolute h-full w-full border-l pt-64 text-center font-sans text-sm", children: /* @__PURE__ */ e("span", { children: "No difference found" }) }) : /* @__PURE__ */ e(ae, { hunk: { ...C, changes: b } }, J);
+          })
+        },
+        y ? "hide-common-data" : "show-common-data"
+      ) }, v)) }) })
+    ] }) })
+  ] }) });
+}
+export {
+  Te as default
+};

package/dist/json-diff-viewer-XX1pgabt.cjs

@@ -0,0 +1,8 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("./index-CnSjWE1P.cjs"),z=require("date-fns"),p=require("lodash-es"),N=require("lucide-react"),b=require("react"),M=require("react-diff-view"),O=require("./index-CbwxUFy_.cjs"),B=require("@tanstack/react-query");function H(t,r){const o=O.useApiUrl(),n=O.useFetch(),f=p.startsWith(t.uid,"draft:")||p.startsWith(r.uid,"live:");return B.useQuery({queryKey:["revision-comparison",t.uid,r.uid],queryFn:async()=>{if(!t.uid||!r.uid)throw new Error("Both revision IDs are required for comparison");const l=u=>u==="draft"||u==="live"?u:"revision",s=u=>p.replace(u.uid,`${u.label}:`,"");return await n(o,{action:O.ACTIONS.GET_COMPARE_DATA,data:{versions:{version1:{type:l(t.label),id:s(t)},version2:{type:l(r.label),id:s(r)}}}})},enabled:!!t.uid&&!!r.uid,staleTime:f?0:1/0})}const K=({version:t})=>{const r=t==null?void 0:t.item,{data:o}=O.useChaiUserInfo(r==null?void 0:r.currentEditor),n=t.label==="live",f=t.label==="draft";return e.jsxs("span",{className:`flex items-center gap-x-2 rounded border bg-white px-2 text-xs shadow-lg ${n?"border-green-500/30":f?"border-amber-500/30":"border-purple-500/30"}`,children:[e.jsx("div",{className:"h-full items-center rounded px-1.5 py-0.5 font-medium capitalize"+(n?" bg-green-500 text-green-50":f?" bg-amber-500 text-amber-50":" bg-purple-500 text-purple-50"),children:t.label}),e.jsxs("div",{className:"py-1 text-xs font-light leading-none text-gray-800",children:[e.jsxs("div",{children:[e.jsx("span",{className:"font-light opacity-90",children:f?"Currently editing":"Published by"}),!f&&e.jsx("span",{className:"pl-1 font-medium",children:(o==null?void 0:o.name)||"Unknown"})]}),e.jsx("div",{className:"text-[10px] leading-tight",children:z.formatDate(r.createdAt,"dd MMM yyyy, h:mm a")})]})]})},L=({version:t})=>e.jsx(K,{version:t});function V(t,r,o="data.json"){const n=JSON.stringify(t,null,2),f=JSON.stringify(r,null,2),l=n.split(`
+`),s=f.split(`
+`);let d=`--- a/${o}
+`;d+=`+++ b/${o}
+`;const u=[];let c=0,m=0;for(;c<l.length||m<s.length;){const g=l[c]||"",v=s[m]||"";if(g===v)u.push(` ${g}`),c++,m++;else{let h=-1,j=-1;for(let a=c+1;a<l.length;a++)if(s[m]===l[a]){h=a;break}for(let a=m+1;a<s.length;a++)if(l[c]===s[a]){j=a;break}if(h!==-1&&(j===-1||h-c<=j-m)){for(let a=c;a<h;a++)u.push(`-${l[a]}`);c=h}else if(j!==-1){for(let a=m;a<j;a++)u.push(`+${s[a]}`);m=j}else g&&u.push(`-${g}`),v&&u.push(`+${v}`),c++,m++}}const w=l.length,J=s.length;return d+=`@@ -1,${w} +1,${J} @@
+`,d+=u.join(`
+`)+`
+`,d}function T(t,r=!0,o=!1){if(p.isString(t)){const n=p.trim(t);if(p.startsWith(n,"{")||p.startsWith(n,"[")||r&&(n==="true"||n==="false"||n==="null"||/^-?\d+(\.\d+)?([eE][+-]?\d+)?$/.test(n)))try{const l=JSON.parse(n);return T(l,r,o)}catch{if(o)throw new Error(`Invalid JSON string: ${n}`);return{}}return t}return p.isArray(t)?p.map(t,n=>T(n,r,o)):p.isPlainObject(t)?p.mapValues(t,n=>T(n,r,o)):t}const U=t=>{switch(t){case"blocks":return"Blocks";case"seo":return"SEO";case"tracking":return"Tracking";default:return t}},W=(t,r)=>{if(!t||!r)return[{key:"blocks",label:"Blocks"}];const o=Object.keys(t),n=Object.keys(r);return o.filter(s=>n.includes(s)).map(s=>({key:s,label:U(s)})).filter(s=>s.key.length>0)},_=(t,r=3)=>{const o=new Set;t.map((s,d)=>({change:s,index:d})).filter(({change:s})=>s.type!=="normal").map(({index:s})=>s).forEach(s=>{const d=Math.max(0,s-r),u=Math.min(t.length-1,s+r);for(let c=d;c<=u;c++)o.add(c)});const f=[];let l=-1;return t.forEach((s,d)=>{if(o.has(d)){if(l!==-1&&d-l>1){const u=t[l].lineNumber!=null?t[l].lineNumber+1:l+2,c=t[d].lineNumber!=null?t[d].lineNumber-1:d;f.push({content:e.jsx(x.Badge,{className:"pointer-events-none w-60 -translate-x-1/2 cursor-default border-none bg-transparent py-1 shadow-none",children:e.jsxs("span",{className:"rounded border border-border bg-muted px-3 py-1 text-xs font-light leading-none text-muted-foreground",children:["No changes from ",u," to ",c," line"]})})})}f.push(s),l=d}}),f};function P({open:t,compare:r,onOpenChange:o}){const n=r[0],f=r[1],[l,s]=b.useState(null),[d,u]=b.useState("split"),[c,m]=b.useState(!1),[w,J]=b.useState(!0),[g,v]=b.useState("blocks"),{data:h,isLoading:j}=H(n,f),{leftData:a,rightData:k,options:F}=b.useMemo(()=>{var y,R;const i=(y=h==null?void 0:h.version1)==null?void 0:y[g],C=(R=h==null?void 0:h.version2)==null?void 0:R[g],S=T(i),D=T(C),q=W(h==null?void 0:h.version1,h==null?void 0:h.version2);return{leftData:S,rightData:D,options:q}},[h,g]),$=b.useMemo(()=>!a||!k?"":V(a,k),[a,k]),A=b.useMemo(()=>{if(!$)return[];try{return M.parseDiff($)}catch(i){return console.error("Failed to parse diff:",i),[]}},[$]),I=async(i,C)=>{try{await navigator.clipboard.writeText(JSON.stringify(i,null,2)),s(C),setTimeout(()=>s(null),2e3)}catch(S){console.error("Failed to copy:",S)}},E=i=>JSON.stringify(i,null,2);return e.jsx(x.Dialog,{open:t,onOpenChange:o,children:e.jsxs(x.DialogContent,{className:"flex h-[90vh] w-[95vw] max-w-[1900px] flex-col p-6",children:[e.jsx(x.DialogHeader,{className:"pb-4 pt-0",children:e.jsxs(x.DialogTitle,{className:"flex items-center justify-between gap-2 leading-none",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(N.FileJson,{className:"h-5 w-5"}),"Compare","",F.map(i=>e.jsx("div",{className:`cursor-pointer rounded-full border px-2.5 py-1 text-xs leading-none ${g===i.key?"border-blue-500 bg-blue-500 text-white":"border-gray-600 text-gray-600 hover:bg-gray-200"}`,onClick:()=>v(i.key),children:i.label},i.key))]}),e.jsx("div",{className:"flex flex-1 items-center justify-end pr-8",children:e.jsxs("div",{className:"flex w-max items-center justify-end gap-2 rounded-md border px-1.5 py-1",children:[e.jsxs("div",{className:"flex items-center gap-2 px-2 py-1",children:[e.jsx(x.Switch,{disabled:c,checked:c?!0:d==="split",onCheckedChange:i=>u(i?"split":"unified")}),e.jsx("label",{className:"text-sm",children:"Split View"})]}),e.jsxs("div",{className:"flex items-center gap-2 px-2 py-1",children:[e.jsx(x.Switch,{checked:c,onCheckedChange:i=>m(i)}),e.jsx("label",{className:"text-sm",children:"Show Raw Data"})]}),e.jsxs("div",{className:"flex items-center gap-2 px-2 py-1",children:[e.jsx(x.Switch,{checked:w,onCheckedChange:i=>J(i)}),e.jsx("label",{className:"text-sm",children:"Hide Common Data"})]})]})})]})}),j?e.jsx("div",{className:"flex h-full w-full items-center justify-center",children:e.jsx(N.Loader,{className:"h-6 w-6 animate-spin text-primary"})}):e.jsx("div",{className:"flex min-h-0 flex-1 flex-col",children:e.jsxs("div",{className:"relative min-h-0 flex-1",children:[e.jsxs("div",{className:"absolute -top-5 z-50 mt-0.5 flex w-full items-center justify-between gap-2",children:[e.jsx("div",{className:"flex w-1/2 items-center justify-center gap-2",children:e.jsx(L,{version:n})}),e.jsx("div",{className:"flex w-1/2 items-center justify-center gap-2",children:e.jsx(L,{version:f})})]}),c?e.jsxs("div",{className:"grid h-full grid-cols-2 gap-3 rounded-lg border",children:[e.jsxs("div",{className:"relative flex min-h-0 flex-col border-r",children:[e.jsx("div",{className:"absolute -top-4 right-4 z-50",children:e.jsxs(x.Button,{variant:"outline",size:"sm",onClick:()=>I(a,"left"),children:[l==="left"?e.jsx(N.Check,{className:"text-green-500"}):e.jsx(N.Copy,{}),"Copy"]})}),e.jsx(x.ScrollArea,{className:"flex-1 rounded-lg bg-slate-50 p-3 dark:bg-slate-900",children:e.jsx("pre",{className:"whitespace-pre-wrap font-mono text-xs",children:E(a)})})]}),e.jsxs("div",{className:"relative flex min-h-0 flex-col",children:[e.jsx("div",{className:"absolute -top-4 right-4 z-50",children:e.jsxs(x.Button,{variant:"outline",size:"sm",onClick:()=>I(k,"right"),children:[l==="right"?e.jsx(N.Check,{className:"text-green-500"}):e.jsx(N.Copy,{}),"Copy"]})}),e.jsx(x.ScrollArea,{className:"flex-1 rounded-lg bg-slate-50 p-3 dark:bg-slate-900",children:e.jsx("pre",{className:"whitespace-pre-wrap font-mono text-xs",children:E(k)})})]})]}):e.jsx(x.ScrollArea,{className:"h-full overflow-y-auto rounded-lg border bg-slate-50 text-xs dark:bg-slate-900",children:A.length===0?e.jsx("div",{className:"flex h-full items-center justify-center p-6",children:e.jsxs("div",{className:"text-center text-muted-foreground",children:[e.jsx(N.FileJson,{className:"mx-auto mb-2 h-8 w-8 opacity-50"}),e.jsx("p",{children:"No differences found or unable to parse diff"})]})}):e.jsx("div",{children:A.map((i,C)=>e.jsx("div",{className:"relative mb-4",children:e.jsx(M.Diff,{viewType:d,diffType:i.type,hunks:i.hunks,className:"rounded-lg text-xs",children:S=>S.map((D,q)=>{const y=w?_(D.changes):D.changes;return(y==null?void 0:y.length)===0?e.jsx("div",{className:"absolute h-full w-full border-l pt-64 text-center font-sans text-sm",children:e.jsx("span",{children:"No difference found"})}):e.jsx(M.Hunk,{hunk:{...D,changes:y}},q)})},w?"hide-common-data":"show-common-data")},C))})})]})})]})})}exports.default=P;

package/dist/lang-panel-BPxex-M2.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("./index-CnSjWE1P.cjs"),n=require("./index-CbwxUFy_.cjs"),r=require("lodash-es"),j=require("lucide-react"),c=require("react"),w=require("react-i18next"),G=require("sonner"),L=require("jotai"),k=({page:s,onClose:S})=>{const{t:a}=w.useTranslation(),[o,E]=c.useState(s.slug||""),{mutate:N,isPending:y}=n.useChangeSlug(),{data:l}=n.usePageTypes(),d=r.find(l,{key:s==null?void 0:s.pageType}),f=h=>{if(h.preventDefault(),!(s!=null&&s.primaryPage)&&Object.keys(n.LANGUAGES).some(p=>o===`/${p}`||r.startsWith(o,`/${p}/`))){G.toast.error(a("Error"),{description:a("Slugs cannot start with a language code for primary page")});return}N({...s,slug:o},{onSuccess:S})},m=(s==null?void 0:s.lang)||"";return e.jsx(i.Dialog,{open:!!s,onOpenChange:S,children:e.jsxs(i.DialogContent,{children:[e.jsxs(i.DialogHeader,{children:[e.jsx(i.DialogTitle,{children:a("Change Slug")}),e.jsx(i.DialogDescription,{className:"text-xs",children:e.jsxs(i.Alert,{variant:"destructive",className:"mt-2",children:[e.jsx(j.AlertCircle,{className:"h-4 w-4"}),a("Changing the slug may have impact on your SEO. Please proceed with caution.")]})})]}),e.jsxs("form",{onSubmit:f,children:[e.jsxs("div",{className:"space-y-4 py-4 text-sm",children:[e.jsxs("div",{className:"space-y-1",children:[e.jsxs("div",{children:[e.jsxs("span",{children:[a("Type"),":"]}),e.jsxs("span",{className:"font-medium text-gray-600",children:[" ",(d==null?void 0:d.name)||(s==null?void 0:s.pageType)]})]}),e.jsxs("div",{children:[e.jsxs("span",{children:[a("Name"),":"]}),e.jsxs("span",{className:"font-medium text-gray-600",children:[" ",s.name]})]})]}),e.jsxs("div",{className:"space-y-1",children:[e.jsxs(i.Label,{htmlFor:"slug",className:"text-right",children:[a("Slug")," ",e.jsxs("small",{className:"font-light text-gray-500",children:[a("Slug should start with")," /",m]})]}),e.jsx(i.Input,{id:"slug",value:o,onChange:h=>{const x=h.target.value;r.startsWith(x,`/${m}`)&&E(x)},className:"col-span-3",required:!0,pattern:"^/.*",title:a("Slug must start with /"),placeholder:a("Enter page slug")})]})]}),e.jsx(i.DialogFooter,{children:e.jsx(i.Button,{type:"submit",disabled:y||!r.startsWith(o,`/${m}`)||r.isEqual(s==null?void 0:s.slug,o),children:a(y?"Changing...":"Change Slug")})})]})]})})},M=c.lazy(()=>Promise.resolve().then(()=>require("./delete-page-ByQwBupJ.cjs"))),T=c.lazy(()=>Promise.resolve().then(()=>require("./unpublish-page-BwSVBf0_.cjs"))),_=()=>{const{t:s}=w.useTranslation(),S=L.useSetAtom(n.addNewLangAtom),{selectedLang:a,fallbackLang:o,setSelectedLang:E}=i.useLanguages(),{data:N,isFetching:y}=n.useLanguagePages(),{data:l}=n.useChaiCurrentPage(),{data:d}=n.usePageTypes(),f=c.useMemo(()=>{const t=d==null?void 0:d.find(g=>g.key===(l==null?void 0:l.pageType));return l!=null&&l.dynamic?t==null?void 0:t.dynamicSlug:""},[d,l==null?void 0:l.pageType,l==null?void 0:l.dynamic]),[m,h]=c.useState(null),[x,P]=c.useState(null),[p,I]=c.useState(null),{data:C}=n.useWebsiteSetting(),A=r.filter(r.get(C,"languages")||["en"],t=>!r.find(N,{lang:t})&&t!==r.get(C,"fallbackLang"));return e.jsxs("div",{className:"space-y-4",children:[e.jsx("ul",{className:"space-y-2",children:y?e.jsxs("div",{className:"w-full space-y-3 py-4",children:[e.jsx("div",{className:"h-8 w-full animate-pulse rounded bg-gray-300"}),e.jsx("div",{className:"h-8 w-full animate-pulse rounded bg-gray-300"}),e.jsx("div",{className:"h-8 w-full animate-pulse rounded bg-gray-300"})]}):r.map(N,t=>{const g=t.lang,v=t.slug,b=!t.primaryPage,D=g===a;return e.jsxs(e.Fragment,{children:[e.jsxs("li",{className:`flex w-full cursor-pointer items-center justify-between rounded p-2 text-slate-500 ${D?"bg-gray-200":"hover:bg-gray-100"}`,onClick:()=>E(g),children:[e.jsxs("div",{className:"flex-1 gap-x-3",children:[e.jsxs("div",{className:"flex items-center gap-x-2 text-[13px] text-slate-800",children:[e.jsx("div",{className:`h-2.5 w-2.5 rounded-full ${t.online?"bg-green-300":"bg-gray-300"}`}),r.get(n.LANGUAGES,b?o:g,g)]}),e.jsxs("div",{children:[v&&e.jsxs("div",{className:"text-[11px] font-light text-slate-600",children:["Slug: ",e.jsx("b",{className:"font-mono font-medium",children:f?`${v}/${f}`:v})]}),e.jsxs("div",{className:"text-[11px] font-light text-slate-600",children:["Name:",e.jsxs("b",{className:"font-medium",children:[" ",t.name," "]})]})]})]}),b?e.jsxs("div",{className:"flex items-center gap-x-1 text-[11px] text-orange-500",children:[e.jsx(j.StarIcon,{fill:"orange",className:"h-3 w-3"}),e.jsx("b",{children:" Primary"})]}):e.jsx("div",{className:"flex items-center gap-x-3",children:e.jsx(n.PermissionChecker,{permissions:[n.PAGES_PERMISSIONS.EDIT_PAGE,n.PAGES_PERMISSIONS.DELETE_PAGE,n.PAGES_PERMISSIONS.UNPUBLISH_PAGE],children:e.jsxs(i.DropdownMenu,{children:[e.jsx(i.DropdownMenuTrigger,{asChild:!0,onClick:u=>u.stopPropagation(),children:e.jsx(i.Button,{variant:"ghost",size:"sm",className:"h-8 w-8 p-0",children:e.jsx(j.MoreHorizontal,{className:"h-4 w-4"})})}),e.jsxs(i.DropdownMenuContent,{align:"end",className:"z-[9999] text-sm",children:[e.jsx(n.PermissionChecker,{permissions:[n.PAGES_PERMISSIONS.EDIT_PAGE],children:e.jsxs(i.DropdownMenuItem,{className:"flex cursor-pointer items-center gap-2",onClick:u=>{u.stopPropagation(),S({edit:!0,id:t.id,primaryPage:t.primaryPage})},children:[e.jsx(j.PencilIcon,{className:"size-3"}),s("Edit")]})}),e.jsx(n.PermissionChecker,{permissions:[n.PAGES_PERMISSIONS.UNPUBLISH_PAGE],children:(t==null?void 0:t.online)&&e.jsxs(i.DropdownMenuItem,{className:"flex cursor-pointer items-center gap-2",onClick:u=>{u.stopPropagation(),P(t)},children:[e.jsx(j.Power,{className:"size-3"}),s("Unpublish")]})}),e.jsx(n.PermissionChecker,{permissions:[n.PAGES_PERMISSIONS.DELETE_PAGE],children:e.jsxs(i.DropdownMenuItem,{className:"flex cursor-pointer items-center gap-2",onClick:u=>{u.stopPropagation(),h(t)},children:[e.jsx(j.TrashIcon,{className:"size-3"}),s("Delete")]})})]})]})})})]},t.id),e.jsx("div",{className:"h-1 w-full border-b"})]})})}),e.jsx(n.PermissionChecker,{permissions:[n.PAGES_PERMISSIONS.ADD_PAGE],children:e.jsx("div",{className:"flex w-full justify-center",children:e.jsx(i.Button,{variant:"default",size:"sm",disabled:r.isEmpty(A),onClick:()=>{S({primaryPage:l==null?void 0:l.id,edit:!1})},children:s("Add new language page")})})}),m&&e.jsx(c.Suspense,{children:e.jsx(M,{page:m,onClose:()=>h(null)})}),x&&e.jsx(c.Suspense,{children:e.jsx(T,{page:x,onClose:()=>P(null)})}),p&&e.jsx(c.Suspense,{children:e.jsx(k,{page:p,onClose:()=>I(null)})})]})};exports.default=_;

package/dist/lang-panel-Cn83SRzd.js

@@ -0,0 +1,215 @@
+import { jsx as e, jsxs as s, Fragment as M } from "react/jsx-runtime";
+import { D as j, d as F, e as B, f as H, p as O, A as W, L as q, I as R, q as J, B as A, n as K, r as Q, s as V, t as X, v as w } from "./index-S8ibZk9Q.js";
+import { au as Y, m as I, L as T, av as Z, l as ee, aw as se, j as ae, ax as f, ay as o } from "./index-BDnwJqMw.js";
+import { find as G, startsWith as E, isEqual as ne, filter as te, get as D, map as le, isEmpty as ie } from "lodash-es";
+import { AlertCircle as re, StarIcon as ce, MoreHorizontal as oe, PencilIcon as de, Power as me, TrashIcon as ue } from "lucide-react";
+import { useState as S, useMemo as he, Suspense as L, lazy as z } from "react";
+import { useTranslation as U } from "react-i18next";
+import { toast as ge } from "sonner";
+import { useSetAtom as pe } from "jotai";
+const fe = ({ page: a, onClose: g }) => {
+  const { t: l } = U(), [i, v] = S(a.slug || ""), { mutate: N, isPending: y } = Y(), { data: t } = I(), r = G(t, { key: a == null ? void 0 : a.pageType }), x = (m) => {
+    if (m.preventDefault(), !(a != null && a.primaryPage) && Object.keys(T).some((p) => i === `/${p}` || E(i, `/${p}/`))) {
+      ge.error(l("Error"), {
+        description: l("Slugs cannot start with a language code for primary page")
+      });
+      return;
+    }
+    N({ ...a, slug: i }, { onSuccess: g });
+  }, d = (a == null ? void 0 : a.lang) || "";
+  return /* @__PURE__ */ e(j, { open: !!a, onOpenChange: g, children: /* @__PURE__ */ s(F, { children: [
+    /* @__PURE__ */ s(B, { children: [
+      /* @__PURE__ */ e(H, { children: l("Change Slug") }),
+      /* @__PURE__ */ e(O, { className: "text-xs", children: /* @__PURE__ */ s(W, { variant: "destructive", className: "mt-2", children: [
+        /* @__PURE__ */ e(re, { className: "h-4 w-4" }),
+        l("Changing the slug may have impact on your SEO. Please proceed with caution.")
+      ] }) })
+    ] }),
+    /* @__PURE__ */ s("form", { onSubmit: x, children: [
+      /* @__PURE__ */ s("div", { className: "space-y-4 py-4 text-sm", children: [
+        /* @__PURE__ */ s("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ s("div", { children: [
+            /* @__PURE__ */ s("span", { children: [
+              l("Type"),
+              ":"
+            ] }),
+            /* @__PURE__ */ s("span", { className: "font-medium text-gray-600", children: [
+              " ",
+              (r == null ? void 0 : r.name) || (a == null ? void 0 : a.pageType)
+            ] })
+          ] }),
+          /* @__PURE__ */ s("div", { children: [
+            /* @__PURE__ */ s("span", { children: [
+              l("Name"),
+              ":"
+            ] }),
+            /* @__PURE__ */ s("span", { className: "font-medium text-gray-600", children: [
+              " ",
+              a.name
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ s("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ s(q, { htmlFor: "slug", className: "text-right", children: [
+            l("Slug"),
+            " ",
+            /* @__PURE__ */ s("small", { className: "font-light text-gray-500", children: [
+              l("Slug should start with"),
+              " /",
+              d
+            ] })
+          ] }),
+          /* @__PURE__ */ e(
+            R,
+            {
+              id: "slug",
+              value: i,
+              onChange: (m) => {
+                const u = m.target.value;
+                E(u, `/${d}`) && v(u);
+              },
+              className: "col-span-3",
+              required: !0,
+              pattern: "^/.*",
+              title: l("Slug must start with /"),
+              placeholder: l("Enter page slug")
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ e(J, { children: /* @__PURE__ */ e(A, { type: "submit", disabled: y || !E(i, `/${d}`) || ne(a == null ? void 0 : a.slug, i), children: l(y ? "Changing..." : "Change Slug") }) })
+    ] })
+  ] }) });
+}, Ne = z(() => import("./delete-page-DC8pzvWW.js")), ye = z(() => import("./unpublish-page-Degu5Cy9.js")), Pe = () => {
+  const { t: a } = U(), g = pe(Z), { selectedLang: l, fallbackLang: i, setSelectedLang: v } = K(), { data: N, isFetching: y } = ee(), { data: t } = se(), { data: r } = I(), x = he(() => {
+    const n = r == null ? void 0 : r.find((h) => h.key === (t == null ? void 0 : t.pageType));
+    return t != null && t.dynamic ? n == null ? void 0 : n.dynamicSlug : "";
+  }, [r, t == null ? void 0 : t.pageType, t == null ? void 0 : t.dynamic]), [d, m] = S(null), [u, C] = S(null), [p, _] = S(null), { data: P } = ae(), $ = te(
+    D(P, "languages") || ["en"],
+    (n) => !G(N, { lang: n }) && n !== D(P, "fallbackLang")
+  );
+  return /* @__PURE__ */ s("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ e("ul", { className: "space-y-2", children: y ? /* @__PURE__ */ s("div", { className: "w-full space-y-3 py-4", children: [
+      /* @__PURE__ */ e("div", { className: "h-8 w-full animate-pulse rounded bg-gray-300" }),
+      /* @__PURE__ */ e("div", { className: "h-8 w-full animate-pulse rounded bg-gray-300" }),
+      /* @__PURE__ */ e("div", { className: "h-8 w-full animate-pulse rounded bg-gray-300" })
+    ] }) : le(N, (n) => {
+      const h = n.lang, b = n.slug, k = !n.primaryPage;
+      return /* @__PURE__ */ s(M, { children: [
+        /* @__PURE__ */ s(
+          "li",
+          {
+            className: `flex w-full cursor-pointer items-center justify-between rounded p-2 text-slate-500 ${h === l ? "bg-gray-200" : "hover:bg-gray-100"}`,
+            onClick: () => v(h),
+            children: [
+              /* @__PURE__ */ s("div", { className: "flex-1 gap-x-3", children: [
+                /* @__PURE__ */ s("div", { className: "flex items-center gap-x-2 text-[13px] text-slate-800", children: [
+                  /* @__PURE__ */ e("div", { className: `h-2.5 w-2.5 rounded-full ${n.online ? "bg-green-300" : "bg-gray-300"}` }),
+                  D(T, k ? i : h, h)
+                ] }),
+                /* @__PURE__ */ s("div", { children: [
+                  b && /* @__PURE__ */ s("div", { className: "text-[11px] font-light text-slate-600", children: [
+                    "Slug: ",
+                    /* @__PURE__ */ e("b", { className: "font-mono font-medium", children: x ? `${b}/${x}` : b })
+                  ] }),
+                  /* @__PURE__ */ s("div", { className: "text-[11px] font-light text-slate-600", children: [
+                    "Name:",
+                    /* @__PURE__ */ s("b", { className: "font-medium", children: [
+                      " ",
+                      n.name,
+                      " "
+                    ] })
+                  ] })
+                ] })
+              ] }),
+              k ? /* @__PURE__ */ s("div", { className: "flex items-center gap-x-1 text-[11px] text-orange-500", children: [
+                /* @__PURE__ */ e(ce, { fill: "orange", className: "h-3 w-3" }),
+                /* @__PURE__ */ e("b", { children: " Primary" })
+              ] }) : /* @__PURE__ */ e("div", { className: "flex items-center gap-x-3", children: /* @__PURE__ */ e(
+                f,
+                {
+                  permissions: [
+                    o.EDIT_PAGE,
+                    o.DELETE_PAGE,
+                    o.UNPUBLISH_PAGE
+                  ],
+                  children: /* @__PURE__ */ s(Q, { children: [
+                    /* @__PURE__ */ e(V, { asChild: !0, onClick: (c) => c.stopPropagation(), children: /* @__PURE__ */ e(A, { variant: "ghost", size: "sm", className: "h-8 w-8 p-0", children: /* @__PURE__ */ e(oe, { className: "h-4 w-4" }) }) }),
+                    /* @__PURE__ */ s(X, { align: "end", className: "z-[9999] text-sm", children: [
+                      /* @__PURE__ */ e(f, { permissions: [o.EDIT_PAGE], children: /* @__PURE__ */ s(
+                        w,
+                        {
+                          className: "flex cursor-pointer items-center gap-2",
+                          onClick: (c) => {
+                            c.stopPropagation(), g({
+                              edit: !0,
+                              id: n.id,
+                              primaryPage: n.primaryPage
+                            });
+                          },
+                          children: [
+                            /* @__PURE__ */ e(de, { className: "size-3" }),
+                            a("Edit")
+                          ]
+                        }
+                      ) }),
+                      /* @__PURE__ */ e(f, { permissions: [o.UNPUBLISH_PAGE], children: (n == null ? void 0 : n.online) && /* @__PURE__ */ s(
+                        w,
+                        {
+                          className: "flex cursor-pointer items-center gap-2",
+                          onClick: (c) => {
+                            c.stopPropagation(), C(n);
+                          },
+                          children: [
+                            /* @__PURE__ */ e(me, { className: "size-3" }),
+                            a("Unpublish")
+                          ]
+                        }
+                      ) }),
+                      /* @__PURE__ */ e(f, { permissions: [o.DELETE_PAGE], children: /* @__PURE__ */ s(
+                        w,
+                        {
+                          className: "flex cursor-pointer items-center gap-2",
+                          onClick: (c) => {
+                            c.stopPropagation(), m(n);
+                          },
+                          children: [
+                            /* @__PURE__ */ e(ue, { className: "size-3" }),
+                            a("Delete")
+                          ]
+                        }
+                      ) })
+                    ] })
+                  ] })
+                }
+              ) })
+            ]
+          },
+          n.id
+        ),
+        /* @__PURE__ */ e("div", { className: "h-1 w-full border-b" })
+      ] });
+    }) }),
+    /* @__PURE__ */ e(f, { permissions: [o.ADD_PAGE], children: /* @__PURE__ */ e("div", { className: "flex w-full justify-center", children: /* @__PURE__ */ e(
+      A,
+      {
+        variant: "default",
+        size: "sm",
+        disabled: ie($),
+        onClick: () => {
+          g({
+            primaryPage: t == null ? void 0 : t.id,
+            edit: !1
+          });
+        },
+        children: a("Add new language page")
+      }
+    ) }) }),
+    d && /* @__PURE__ */ e(L, { children: /* @__PURE__ */ e(Ne, { page: d, onClose: () => m(null) }) }),
+    u && /* @__PURE__ */ e(L, { children: /* @__PURE__ */ e(ye, { page: u, onClose: () => C(null) }) }),
+    p && /* @__PURE__ */ e(L, { children: /* @__PURE__ */ e(fe, { page: p, onClose: () => _(null) }) })
+  ] });
+};
+export {
+  Pe as default
+};

package/dist/manage-design-tokens-ConiyuPr.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("./index-CnSjWE1P.cjs"),W=require("./apply-binding-KKp5PnpZ.cjs"),m=require("@radix-ui/react-icons"),Z=require("jotai"),$=require("nanoid"),o=require("react"),U=require("react-i18next"),N=require("sonner"),Q=require("tailwind-merge"),B=t=>{const n=t.trim();return n.length===0||n.length>25?!1:/^[a-zA-Z0-9]+(-[a-zA-Z0-9]+)*$/.test(n)},_=(t,n,i,u=!1,l)=>{const x=t.trim();return x.length===0?"":x.length>25?i("Token name must be 25 characters or less"):/^[a-zA-Z0-9]+(-[a-zA-Z0-9]+)*$/.test(x)?Object.entries(n).find(([c,j])=>j.name===x&&(!u||c!==l))?i("Token name already exists"):"":i("Only alphanumeric characters and hyphens allowed")},H=t=>t.replace(/\s+/g,"-"),K=o.lazy(()=>Promise.resolve().then(()=>require("./delete-design-token-D_TLlO3I.cjs"))),X=o.lazy(()=>Promise.resolve().then(()=>require("./design-token-usage-BqZeR1sT.cjs"))),J=({tokenId:t,token:n,isDisabled:i,onEdit:u,onDelete:l})=>e.jsxs("div",{className:"group relative flex items-center justify-between overflow-hidden rounded border p-2 transition-all duration-150 hover:bg-muted/90",children:[e.jsxs("div",{className:"min-w-0 flex-1 overflow-hidden",children:[e.jsx("div",{className:"text-xs font-semibold",children:n.name}),e.jsx("div",{className:"w-full max-w-52 truncate text-[10px] font-light",children:n.value})]}),e.jsxs("div",{className:"absolute right-1 top-1 flex flex-shrink-0 items-center opacity-0 transition-opacity duration-150 group-hover:opacity-100",children:[e.jsx(o.Suspense,{fallback:null,children:e.jsx(X,{tokenId:t,tokenName:n.name,children:e.jsx(a.Button,{variant:"ghost",size:"sm",className:"h-6 w-6 rounded-full p-0 hover:bg-primary/10 hover:text-primary",children:e.jsx(m.EyeOpenIcon,{className:"h-3 w-3"})})})}),e.jsx(a.Button,{variant:"ghost",size:"sm",onClick:()=>u(t),disabled:i,className:"h-6 w-6 rounded-full p-0 hover:bg-primary/10 hover:text-primary",children:e.jsx(m.Pencil1Icon,{className:"h-3 w-3"})}),e.jsx(o.Suspense,{fallback:null,children:e.jsx(K,{tokenName:n.name,tokenValue:n.value,onDelete:()=>l(t),children:e.jsx(a.Button,{variant:"ghost",size:"sm",disabled:i,className:"h-6 w-6 rounded-full p-0 hover:bg-destructive/10",children:e.jsx(m.TrashIcon,{className:"h-3 w-3 text-destructive"})})})})]})]}),Y=({})=>{const{t}=U.useTranslation(),[n,i]=Z.useAtom(a.chaiDesignTokensAtom),u=a.useIncrementActionsCount(),[l,x]=o.useState("view"),[v,p]=o.useState(null),[c,j]=o.useState(""),[h,k]=o.useState(""),[b,T]=o.useState(""),[y,E]=o.useState(""),[q,w]=o.useState(!1),f=o.useRef(null),A=o.useMemo(()=>Object.entries(n).filter(([,s])=>s.name.toLowerCase().includes(y.toLowerCase())||s.value.toLowerCase().includes(y.toLowerCase())),[n,y]);o.useEffect(()=>()=>{f.current&&clearTimeout(f.current)},[]);const I=o.useCallback((s,r)=>{!v||l!=="edit"||!s.trim()||!r.trim()||!B(s)||Object.entries(n).find(([g,V])=>V.name===s.trim()&&g!==v)||(w(!0),f.current&&clearTimeout(f.current),f.current=setTimeout(()=>{const g={...n,[v]:{name:s.trim(),value:r.trim()}};i(g),u(),w(!1)},250))},[v,l,n,i,u]),z=()=>{if(!c.trim()||!h.trim()){N.toast.error(t("Please fill in both token name and classes"));return}if(!B(c)){N.toast.error(t("Invalid design token name format"));return}if(Object.values(n).find(g=>g.name===c.trim())){N.toast.error(t("Token already exists"));return}const r=`${W.DESIGN_TOKEN_PREFIX}${$.nanoid(12)}`,d={...n,[r]:{name:c.trim(),value:h.trim()}};i(d),u(),N.toast.success(t("Token added successfully")),C()},M=s=>{const r={...n};delete r[s],i(r),u(),N.toast.success(t("Token deleted successfully"))},P=s=>{const r=n[s];r&&(p(s),j(r.name),k(r.value),T(""),x("edit"))},S=()=>{p(null),j(""),k(""),T(""),x("add")},C=()=>{f.current&&clearTimeout(f.current),p(null),j(""),k(""),T(""),w(!1),x("view")},R=s=>{const r=H(s);j(r);const d=_(r,n,t,l==="edit",v||void 0);T(d),l==="edit"&&!d&&I(r,h)},D=s=>{k(s),l==="edit"&&!b&&c.trim()&&I(c,s)},O=s=>{const r=a.orderClassesByBreakpoint(a.removeDuplicateClasses(Q.twMerge(h,s)));D(r)},L=s=>{const r=h.split(" ").filter(d=>d!==s).join(" ");D(r)},F=()=>{const s=l==="edit",r=t(s?"Edit Design Token":"Add Design Token"),d=t(s?"Update design token. Auto-saved.":"Create a reusable design token");return e.jsxs("div",{className:"flex h-full flex-col",children:[e.jsxs("div",{className:"mb-3 flex items-center gap-2 rounded-md border border-border/50 bg-muted p-1.5",children:[e.jsx(a.Button,{variant:"ghost",size:"sm",onClick:C,className:"h-6 w-6 rounded-full p-0 hover:bg-muted",children:e.jsx(m.ArrowLeftIcon,{className:"h-3 w-3"})}),e.jsxs("div",{className:"flex-1",children:[e.jsx("h3",{className:"text-xs font-semibold text-foreground",children:r}),e.jsx("p",{className:"text-[10px] text-muted-foreground",children:d})]}),s&&q&&e.jsx("div",{className:"flex items-center gap-1 text-[10px] text-muted-foreground",children:e.jsx("div",{className:"h-1.5 w-1.5 animate-pulse rounded-full bg-primary"})})]}),e.jsxs("div",{className:"flex-1 space-y-3 overflow-y-auto",children:[e.jsxs("div",{className:"space-y-1.5",children:[e.jsx(a.Label,{htmlFor:"token-name",className:"text-xs font-medium",children:t("Token Name")}),e.jsx(a.Input,{id:"token-name",placeholder:"Button-Primary",value:c,onChange:g=>R(g.target.value),className:"h-7 text-xs"}),b?e.jsx("span",{className:"text-[10px] text-destructive",children:b}):e.jsx("span",{className:"text-[10px] font-light text-muted-foreground",children:t("Button-Primary, Card-Header, Text-Large etc.")})]}),e.jsx(a.ManualClasses,{from:"designToken",classFromProps:h,onAddNew:O,onRemove:L}),!s&&e.jsxs("div",{className:"mt-3 flex items-center justify-end gap-2 pt-3",children:[e.jsx(a.Button,{variant:"outline",onClick:C,className:"h-7 text-xs",children:t("Cancel")}),e.jsx(a.Button,{onClick:z,disabled:!c.trim()||!h.trim()||!!b,className:"h-7 text-xs",children:t("Add Token")})]})]})]})},G=()=>e.jsxs(e.Fragment,{children:[Object.entries(n).length>0&&e.jsxs("div",{className:"flex items-center justify-between gap-x-2",children:[e.jsxs("div",{className:"relative flex-1",children:[e.jsx(m.MagnifyingGlassIcon,{className:"absolute left-2 top-1/2 h-3 w-3 -translate-y-1/2 text-muted-foreground"}),e.jsx(a.Input,{placeholder:t("Search tokens"),value:y,onChange:s=>E(s.target.value),className:"h-6 pl-7 text-xs"})]}),e.jsxs(a.Button,{variant:"outline",onClick:S,size:"sm",className:"h-6 border-primary text-xs text-primary hover:bg-primary/10 hover:text-primary",children:[e.jsx(m.PlusIcon,{className:"h-3 w-3"}),t("Add")]})]}),e.jsx("div",{className:"no-scrollbar flex flex-1 flex-col overflow-hidden pt-2",children:e.jsx(a.ScrollArea,{className:"h-full flex-1",children:e.jsxs("div",{className:"space-y-1",children:[Object.entries(n).length===0?e.jsxs("div",{className:"flex flex-col items-center justify-center rounded-lg border border-dashed border-muted bg-muted/20 py-8",children:[e.jsx("div",{className:"mb-2 text-3xl",children:e.jsx(m.TokensIcon,{className:"h-12 w-12 text-muted-foreground"})}),e.jsx("p",{className:"mb-1 text-sm font-medium text-foreground",children:t("No design tokens yet")}),e.jsx("p",{className:"text-center text-xs text-muted-foreground",children:t("Create reusable design tokens to streamline your styling")}),e.jsxs(a.Button,{variant:"default",onClick:S,size:"sm",className:"mt-4 h-7 text-xs leading-tight",children:[e.jsx(m.PlusIcon,{className:"mr-1 h-3 w-3"}),t("Add first design token")]})]}):A.length===0?e.jsxs("div",{className:"flex flex-col items-center justify-center rounded-lg border border-dashed border-muted bg-muted/20 py-8",children:[e.jsx("div",{className:"mb-2",children:e.jsx(m.MagnifyingGlassIcon,{className:"h-10 w-10 text-muted-foreground"})}),e.jsx("p",{className:"mb-1 text-sm font-medium text-foreground",children:t("No tokens found")}),e.jsx("p",{className:"text-center text-xs text-muted-foreground",children:t("No design tokens match your search")})]}):A.map(([s,r])=>e.jsx(J,{token:r,tokenId:s,onEdit:P,onDelete:M,isDisabled:!1},s)),e.jsx("div",{className:"h-44"})]})})})]});return e.jsx("div",{className:"flex h-full w-full flex-col",children:l==="view"?G():F()})};exports.default=Y;