@agentaily/design-system 0.1.1 → 0.3.0

package/dist/components/code/JSXPreview.js

@@ -4,8 +4,8 @@ const AX_JSXPREVIEW_CSS = `
 .ax-jsxpreview { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--border-default); border-radius: var(--radius-3); overflow: hidden; }
 .ax-jsxpreview--stacked { grid-template-columns: 1fr; }
 .ax-jsxpreview__pane { min-width: 0; }
-.ax-jsxpreview__pane--code { border-right: 1px solid var(--border-default); background: var(--bg-0); }
-[data-theme="light"] .ax-jsxpreview__pane--code { background: var(--bg-1); }
+.ax-jsxpreview__pane--code { border-right: 1px solid var(--border-default); background: var(--bg-1); }
+[data-theme="dark"] .ax-jsxpreview__pane--code { background: var(--bg-0); }
 .ax-jsxpreview--stacked .ax-jsxpreview__pane--code { border-right: none; border-bottom: 1px solid var(--border-default); }
 .ax-jsxpreview__label { font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--text-faint); padding: 8px 12px; border-bottom: 1px solid var(--border-default); }
 .ax-jsxpreview__pre { margin: 0; padding: 12px; font-family: var(--font-mono); font-size: var(--text-xs); line-height: 1.6; color: var(--text-body); white-space: pre; overflow-x: auto; }
@@ -18,16 +18,23 @@ if (typeof document !== "undefined" && !document.getElementById("ax-jsxpreview-c
   document.head.appendChild(s);
 }
 function JSXPreview({ code, children, stacked = false, className = "", ...rest }) {
-  return /* @__PURE__ */ jsxs("div", { className: ["ax-jsxpreview", stacked ? "ax-jsxpreview--stacked" : "", className].filter(Boolean).join(" "), ...rest, children: [
-    /* @__PURE__ */ jsxs("div", { className: "ax-jsxpreview__pane ax-jsxpreview__pane--code", children: [
-      /* @__PURE__ */ jsx("div", { className: "ax-jsxpreview__label", children: "JSX" }),
-      /* @__PURE__ */ jsx("pre", { className: "ax-jsxpreview__pre", children: code })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "ax-jsxpreview__pane", children: [
-      /* @__PURE__ */ jsx("div", { className: "ax-jsxpreview__label", children: "Preview" }),
-      /* @__PURE__ */ jsx("div", { className: "ax-jsxpreview__render", children })
-    ] })
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: ["ax-jsxpreview", stacked ? "ax-jsxpreview--stacked" : "", className].filter(Boolean).join(" "),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "ax-jsxpreview__pane ax-jsxpreview__pane--code", children: [
+          /* @__PURE__ */ jsx("div", { className: "ax-jsxpreview__label", children: "JSX" }),
+          /* @__PURE__ */ jsx("pre", { className: "ax-jsxpreview__pre", children: code })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "ax-jsxpreview__pane", children: [
+          /* @__PURE__ */ jsx("div", { className: "ax-jsxpreview__label", children: "Preview" }),
+          /* @__PURE__ */ jsx("div", { className: "ax-jsxpreview__render", children })
+        ] })
+      ]
+    }
+  );
 }
 export {
   JSXPreview

package/dist/components/code/JSXPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"JSXPreview.js","sources":["../../../src/components/code/JSXPreview.jsx"],"sourcesContent":["import React from \"react\";\n\nconst AX_JSXPREVIEW_CSS = `\n.ax-jsxpreview { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--border-default); border-radius: var(--radius-3); overflow: hidden; }\n.ax-jsxpreview--stacked { grid-template-columns: 1fr; }\n.ax-jsxpreview__pane { min-width: 0; }\n.ax-jsxpreview__pane--code { border-right: 1px solid var(--border-default); background: var(--bg-0); }\n[data-theme=\"light\"] .ax-jsxpreview__pane--code { background: var(--bg-1); }\n.ax-jsxpreview--stacked .ax-jsxpreview__pane--code { border-right: none; border-bottom: 1px solid var(--border-default); }\n.ax-jsxpreview__label { font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--text-faint); padding: 8px 12px; border-bottom: 1px solid var(--border-default); }\n.ax-jsxpreview__pre { margin: 0; padding: 12px; font-family: var(--font-mono); font-size: var(--text-xs); line-height: 1.6; color: var(--text-body); white-space: pre; overflow-x: auto; }\n.ax-jsxpreview__render { padding: 20px; display: flex; align-items: center; justify-content: center; min-height: 100px; background: var(--surface-card); }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-jsxpreview-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-jsxpreview-css\";\n  s.textContent = AX_JSXPREVIEW_CSS;\n  document.head.appendChild(s);\n}\n\nexport function JSXPreview({ code, children, stacked = false, className = \"\", ...rest }) {\n  return (\n    <div className={[\"ax-jsxpreview\", stacked ? \"ax-jsxpreview--stacked\" : \"\", className].filter(Boolean).join(\" \")} {...rest}>\n      <div className=\"ax-jsxpreview__pane ax-jsxpreview__pane--code\">\n        <div className=\"ax-jsxpreview__label\">JSX</div>\n        <pre className=\"ax-jsxpreview__pre\">{code}</pre>\n      </div>\n      <div className=\"ax-jsxpreview__pane\">\n        <div className=\"ax-jsxpreview__label\">Preview</div>\n        <div className=\"ax-jsxpreview__render\">{children}</div>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAEA,MAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAY1B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,mBAAmB,GAAG;AACpF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEO,SAAS,WAAW,EAAE,MAAM,UAAU,UAAU,OAAO,YAAY,IAAI,GAAG,QAAQ;AACvF,8BACG,OAAA,EAAI,WAAW,CAAC,iBAAiB,UAAU,2BAA2B,IAAI,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAAI,GAAG,MACnH,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,iDACb,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAU,wBAAuB,UAAA,OAAG;AAAA,MACzC,oBAAC,OAAA,EAAI,WAAU,sBAAsB,UAAA,KAAA,CAAK;AAAA,IAAA,GAC5C;AAAA,IACA,qBAAC,OAAA,EAAI,WAAU,uBACb,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAU,wBAAuB,UAAA,WAAO;AAAA,MAC7C,oBAAC,OAAA,EAAI,WAAU,yBAAyB,SAAA,CAAS;AAAA,IAAA,EAAA,CACnD;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"JSXPreview.js","sources":["../../../src/components/code/JSXPreview.jsx"],"sourcesContent":["import React from \"react\";\n\nconst AX_JSXPREVIEW_CSS = `\n.ax-jsxpreview { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--border-default); border-radius: var(--radius-3); overflow: hidden; }\n.ax-jsxpreview--stacked { grid-template-columns: 1fr; }\n.ax-jsxpreview__pane { min-width: 0; }\n.ax-jsxpreview__pane--code { border-right: 1px solid var(--border-default); background: var(--bg-1); }\n[data-theme=\"dark\"] .ax-jsxpreview__pane--code { background: var(--bg-0); }\n.ax-jsxpreview--stacked .ax-jsxpreview__pane--code { border-right: none; border-bottom: 1px solid var(--border-default); }\n.ax-jsxpreview__label { font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--text-faint); padding: 8px 12px; border-bottom: 1px solid var(--border-default); }\n.ax-jsxpreview__pre { margin: 0; padding: 12px; font-family: var(--font-mono); font-size: var(--text-xs); line-height: 1.6; color: var(--text-body); white-space: pre; overflow-x: auto; }\n.ax-jsxpreview__render { padding: 20px; display: flex; align-items: center; justify-content: center; min-height: 100px; background: var(--surface-card); }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-jsxpreview-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-jsxpreview-css\";\n  s.textContent = AX_JSXPREVIEW_CSS;\n  document.head.appendChild(s);\n}\n\nexport function JSXPreview({ code, children, stacked = false, className = \"\", ...rest }) {\n  return (\n    <div\n      className={[\"ax-jsxpreview\", stacked ? \"ax-jsxpreview--stacked\" : \"\", className]\n        .filter(Boolean)\n        .join(\" \")}\n      {...rest}\n    >\n      <div className=\"ax-jsxpreview__pane ax-jsxpreview__pane--code\">\n        <div className=\"ax-jsxpreview__label\">JSX</div>\n        <pre className=\"ax-jsxpreview__pre\">{code}</pre>\n      </div>\n      <div className=\"ax-jsxpreview__pane\">\n        <div className=\"ax-jsxpreview__label\">Preview</div>\n        <div className=\"ax-jsxpreview__render\">{children}</div>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAEA,MAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAY1B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,mBAAmB,GAAG;AACpF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEO,SAAS,WAAW,EAAE,MAAM,UAAU,UAAU,OAAO,YAAY,IAAI,GAAG,QAAQ;AACvF,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,CAAC,iBAAiB,UAAU,2BAA2B,IAAI,SAAS,EAC5E,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACV,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAA,qBAAC,OAAA,EAAI,WAAU,iDACb,UAAA;AAAA,UAAA,oBAAC,OAAA,EAAI,WAAU,wBAAuB,UAAA,OAAG;AAAA,UACzC,oBAAC,OAAA,EAAI,WAAU,sBAAsB,UAAA,KAAA,CAAK;AAAA,QAAA,GAC5C;AAAA,QACA,qBAAC,OAAA,EAAI,WAAU,uBACb,UAAA;AAAA,UAAA,oBAAC,OAAA,EAAI,WAAU,wBAAuB,UAAA,WAAO;AAAA,UAC7C,oBAAC,OAAA,EAAI,WAAU,yBAAyB,SAAA,CAAS;AAAA,QAAA,EAAA,CACnD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/code/Snippet.js

@@ -1,8 +1,8 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useState } from "react";
 const AX_SNIPPET_CSS = `
-.ax-snippet { display: flex; align-items: center; gap: 8px; background: var(--bg-0); border: 1px solid var(--border-default); border-radius: var(--radius-2); padding: 6px 6px 6px 12px; font-family: var(--font-mono); }
-[data-theme="light"] .ax-snippet { background: var(--bg-1); }
+.ax-snippet { display: flex; align-items: center; gap: 8px; background: var(--bg-1); border: 1px solid var(--border-default); border-radius: var(--radius-2); padding: 6px 6px 6px 12px; font-family: var(--font-mono); }
+[data-theme="dark"] .ax-snippet { background: var(--bg-0); }
 .ax-snippet__prompt { color: var(--text-faint); user-select: none; }
 .ax-snippet__code { flex: 1; min-width: 0; overflow-x: auto; white-space: nowrap; font-size: var(--text-sm); color: var(--text-body); }
 .ax-snippet__copy { appearance: none; background: none; border: 1px solid var(--border-default); cursor: pointer; color: var(--text-faint); font-family: var(--font-mono); font-size: 11px; padding: 4px 8px; border-radius: var(--radius-1); flex: none; transition: color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out); }

package/dist/components/code/Snippet.js.map

@@ -1 +1 @@
-{"version":3,"file":"Snippet.js","sources":["../../../src/components/code/Snippet.jsx"],"sourcesContent":["import React, { useState } from \"react\";\n\nconst AX_SNIPPET_CSS = `\n.ax-snippet { display: flex; align-items: center; gap: 8px; background: var(--bg-0); border: 1px solid var(--border-default); border-radius: var(--radius-2); padding: 6px 6px 6px 12px; font-family: var(--font-mono); }\n[data-theme=\"light\"] .ax-snippet { background: var(--bg-1); }\n.ax-snippet__prompt { color: var(--text-faint); user-select: none; }\n.ax-snippet__code { flex: 1; min-width: 0; overflow-x: auto; white-space: nowrap; font-size: var(--text-sm); color: var(--text-body); }\n.ax-snippet__copy { appearance: none; background: none; border: 1px solid var(--border-default); cursor: pointer; color: var(--text-faint); font-family: var(--font-mono); font-size: 11px; padding: 4px 8px; border-radius: var(--radius-1); flex: none; transition: color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out); }\n.ax-snippet__copy:hover { color: var(--text-body); border-color: var(--border-strong); }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-snippet-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-snippet-css\";\n  s.textContent = AX_SNIPPET_CSS;\n  document.head.appendChild(s);\n}\n\nexport function Snippet({ code = \"\", prompt = \"$\", className = \"\", ...rest }) {\n  const [copied, setCopied] = useState(false);\n  const copy = () => {\n    try { navigator.clipboard && navigator.clipboard.writeText(code); } catch (e) {}\n    setCopied(true); setTimeout(() => setCopied(false), 1500);\n  };\n  return (\n    <div className={[\"ax-snippet\", className].filter(Boolean).join(\" \")} {...rest}>\n      {prompt ? <span className=\"ax-snippet__prompt\">{prompt}</span> : null}\n      <code className=\"ax-snippet__code\">{code}</code>\n      <button className=\"ax-snippet__copy\" onClick={copy}>{copied ? \"✓\" : \"copy\"}</button>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAEA,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,gBAAgB,GAAG;AACjF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEO,SAAS,QAAQ,EAAE,OAAO,IAAI,SAAS,KAAK,YAAY,IAAI,GAAG,QAAQ;AAC5E,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,OAAO,MAAM;AACjB,QAAI;AAAE,gBAAU,aAAa,UAAU,UAAU,UAAU,IAAI;AAAA,IAAG,SAAS,GAAG;AAAA,IAAC;AAC/E,cAAU,IAAI;AAAG,eAAW,MAAM,UAAU,KAAK,GAAG,IAAI;AAAA,EAC1D;AACA,SACE,qBAAC,OAAA,EAAI,WAAW,CAAC,cAAc,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAAI,GAAG,MACtE,UAAA;AAAA,IAAA,SAAS,oBAAC,QAAA,EAAK,WAAU,sBAAsB,kBAAO,IAAU;AAAA,IACjE,oBAAC,QAAA,EAAK,WAAU,oBAAoB,UAAA,MAAK;AAAA,IACzC,oBAAC,YAAO,WAAU,oBAAmB,SAAS,MAAO,UAAA,SAAS,MAAM,OAAA,CAAO;AAAA,EAAA,GAC7E;AAEJ;"}
+{"version":3,"file":"Snippet.js","sources":["../../../src/components/code/Snippet.jsx"],"sourcesContent":["import React, { useState } from \"react\";\n\nconst AX_SNIPPET_CSS = `\n.ax-snippet { display: flex; align-items: center; gap: 8px; background: var(--bg-1); border: 1px solid var(--border-default); border-radius: var(--radius-2); padding: 6px 6px 6px 12px; font-family: var(--font-mono); }\n[data-theme=\"dark\"] .ax-snippet { background: var(--bg-0); }\n.ax-snippet__prompt { color: var(--text-faint); user-select: none; }\n.ax-snippet__code { flex: 1; min-width: 0; overflow-x: auto; white-space: nowrap; font-size: var(--text-sm); color: var(--text-body); }\n.ax-snippet__copy { appearance: none; background: none; border: 1px solid var(--border-default); cursor: pointer; color: var(--text-faint); font-family: var(--font-mono); font-size: 11px; padding: 4px 8px; border-radius: var(--radius-1); flex: none; transition: color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out); }\n.ax-snippet__copy:hover { color: var(--text-body); border-color: var(--border-strong); }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-snippet-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-snippet-css\";\n  s.textContent = AX_SNIPPET_CSS;\n  document.head.appendChild(s);\n}\n\nexport function Snippet({ code = \"\", prompt = \"$\", className = \"\", ...rest }) {\n  const [copied, setCopied] = useState(false);\n  const copy = () => {\n    try {\n      navigator.clipboard && navigator.clipboard.writeText(code);\n    } catch (e) {}\n    setCopied(true);\n    setTimeout(() => setCopied(false), 1500);\n  };\n  return (\n    <div className={[\"ax-snippet\", className].filter(Boolean).join(\" \")} {...rest}>\n      {prompt ? <span className=\"ax-snippet__prompt\">{prompt}</span> : null}\n      <code className=\"ax-snippet__code\">{code}</code>\n      <button className=\"ax-snippet__copy\" onClick={copy}>\n        {copied ? \"✓\" : \"copy\"}\n      </button>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAEA,MAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,gBAAgB,GAAG;AACjF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEO,SAAS,QAAQ,EAAE,OAAO,IAAI,SAAS,KAAK,YAAY,IAAI,GAAG,QAAQ;AAC5E,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,OAAO,MAAM;AACjB,QAAI;AACF,gBAAU,aAAa,UAAU,UAAU,UAAU,IAAI;AAAA,IAC3D,SAAS,GAAG;AAAA,IAAC;AACb,cAAU,IAAI;AACd,eAAW,MAAM,UAAU,KAAK,GAAG,IAAI;AAAA,EACzC;AACA,SACE,qBAAC,OAAA,EAAI,WAAW,CAAC,cAAc,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAAI,GAAG,MACtE,UAAA;AAAA,IAAA,SAAS,oBAAC,QAAA,EAAK,WAAU,sBAAsB,kBAAO,IAAU;AAAA,IACjE,oBAAC,QAAA,EAAK,WAAU,oBAAoB,UAAA,MAAK;AAAA,IACzC,oBAAC,YAAO,WAAU,oBAAmB,SAAS,MAC3C,UAAA,SAAS,MAAM,OAAA,CAClB;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/code/Terminal.js

@@ -1,10 +1,8 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useState } from "react";
 const AX_TERMINAL_CSS = `
-.ax-terminal { border: 1px solid var(--border-strong); border-radius: var(--radius-3); overflow: hidden; background: var(--bg-0); font-family: var(--font-mono); }
-[data-theme="light"] .ax-terminal { background: #0A0A0B; }
-.ax-terminal__bar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--bg-1); border-bottom: 1px solid var(--border-default); }
-[data-theme="light"] .ax-terminal__bar { background: #18181B; border-color: rgba(255,255,255,0.1); }
+.ax-terminal { border: 1px solid var(--border-strong); border-radius: var(--radius-3); overflow: hidden; background: #0A0A0B; font-family: var(--font-mono); }
+.ax-terminal__bar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: #18181B; border-bottom: 1px solid rgba(255,255,255,0.1); }
 .ax-terminal__dots { display: flex; gap: 6px; }
 .ax-terminal__dot { width: 9px; height: 9px; border-radius: var(--radius-1); background: rgba(255,255,255,0.18); }
 .ax-terminal__title { font-size: 11px; color: #A1A1AA; letter-spacing: 0.04em; flex: 1; text-align: center; }
@@ -26,10 +24,19 @@ if (typeof document !== "undefined" && !document.getElementById("ax-terminal-css
   s.textContent = AX_TERMINAL_CSS;
   document.head.appendChild(s);
 }
-function Terminal({ title = "bash", lines = [], prompt = "$", cursor = false, className = "", ...rest }) {
+function Terminal({
+  title = "bash",
+  lines = [],
+  prompt = "$",
+  cursor = false,
+  className = "",
+  ...rest
+}) {
   const [copied, setCopied] = useState(false);
   const copy = () => {
-    const text = lines.map((l) => typeof l === "string" ? l : l.type === "command" ? prompt + " " + l.text : l.text).join("\n");
+    const text = lines.map(
+      (l) => typeof l === "string" ? l : l.type === "command" ? prompt + " " + l.text : l.text
+    ).join("\n");
     try {
       navigator.clipboard && navigator.clipboard.writeText(text);
     } catch (e) {
@@ -60,10 +67,17 @@ function Terminal({ title = "bash", lines = [], prompt = "$", cursor = false, cl
           cursor && isLast ? /* @__PURE__ */ jsx("span", { className: "ax-terminal__cursor" }) : null
         ] }, i);
       }
-      return /* @__PURE__ */ jsxs("div", { className: "ax-terminal__line ax-terminal__" + (line.type === "error" ? "err" : "out"), children: [
-        line.text,
-        cursor && isLast ? /* @__PURE__ */ jsx("span", { className: "ax-terminal__cursor" }) : null
-      ] }, i);
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "ax-terminal__line ax-terminal__" + (line.type === "error" ? "err" : "out"),
+          children: [
+            line.text,
+            cursor && isLast ? /* @__PURE__ */ jsx("span", { className: "ax-terminal__cursor" }) : null
+          ]
+        },
+        i
+      );
     }) })
   ] });
 }

package/dist/components/code/Terminal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Terminal.js","sources":["../../../src/components/code/Terminal.jsx"],"sourcesContent":["import React, { useState } from \"react\";\n\nconst AX_TERMINAL_CSS = `\n.ax-terminal { border: 1px solid var(--border-strong); border-radius: var(--radius-3); overflow: hidden; background: var(--bg-0); font-family: var(--font-mono); }\n[data-theme=\"light\"] .ax-terminal { background: #0A0A0B; }\n.ax-terminal__bar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--bg-1); border-bottom: 1px solid var(--border-default); }\n[data-theme=\"light\"] .ax-terminal__bar { background: #18181B; border-color: rgba(255,255,255,0.1); }\n.ax-terminal__dots { display: flex; gap: 6px; }\n.ax-terminal__dot { width: 9px; height: 9px; border-radius: var(--radius-1); background: rgba(255,255,255,0.18); }\n.ax-terminal__title { font-size: 11px; color: #A1A1AA; letter-spacing: 0.04em; flex: 1; text-align: center; }\n.ax-terminal__copy { appearance: none; background: none; border: none; cursor: pointer; color: #63636B; font-size: 11px; padding: 2px 6px; border-radius: var(--radius-1); }\n.ax-terminal__copy:hover { color: #F4F4F5; }\n.ax-terminal__body { padding: 14px 16px; overflow-x: auto; font-size: var(--text-sm); line-height: 1.7; }\n.ax-terminal__line { white-space: pre; color: #E4E4E7; }\n.ax-terminal__prompt { color: #3ECF8E; user-select: none; }\n.ax-terminal__cmd { color: #F4F4F5; }\n.ax-terminal__out { color: #A1A1AA; }\n.ax-terminal__err { color: #E5484D; }\n.ax-terminal__cursor { display: inline-block; width: 0.5em; height: 1em; background: #3ECF8E; vertical-align: text-bottom; animation: ax-term-blink 1.1s steps(1) infinite; }\n@keyframes ax-term-blink { 50% { opacity: 0; } }\n@media (prefers-reduced-motion: reduce) { .ax-terminal__cursor { animation: none; } }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-terminal-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-terminal-css\";\n  s.textContent = AX_TERMINAL_CSS;\n  document.head.appendChild(s);\n}\n\nexport function Terminal({ title = \"bash\", lines = [], prompt = \"$\", cursor = false, className = \"\", ...rest }) {\n  const [copied, setCopied] = useState(false);\n  const copy = () => {\n    const text = lines.map((l) => (typeof l === \"string\" ? l : (l.type === \"command\" ? prompt + \" \" + l.text : l.text))).join(\"\\n\");\n    try { navigator.clipboard && navigator.clipboard.writeText(text); } catch (e) {}\n    setCopied(true); setTimeout(() => setCopied(false), 1500);\n  };\n  return (\n    <div className={[\"ax-terminal\", className].filter(Boolean).join(\" \")} {...rest}>\n      <div className=\"ax-terminal__bar\">\n        <span className=\"ax-terminal__dots\"><span className=\"ax-terminal__dot\"></span><span className=\"ax-terminal__dot\"></span><span className=\"ax-terminal__dot\"></span></span>\n        <span className=\"ax-terminal__title\">{title}</span>\n        <button className=\"ax-terminal__copy\" onClick={copy}>{copied ? \"copied ✓\" : \"copy\"}</button>\n      </div>\n      <div className=\"ax-terminal__body\">\n        {lines.map((l, i) => {\n          const line = typeof l === \"string\" ? { type: \"command\", text: l } : l;\n          const isLast = i === lines.length - 1;\n          if (line.type === \"command\") {\n            return <div className=\"ax-terminal__line\" key={i}><span className=\"ax-terminal__prompt\">{prompt} </span><span className=\"ax-terminal__cmd\">{line.text}</span>{cursor && isLast ? <span className=\"ax-terminal__cursor\"></span> : null}</div>;\n          }\n          return <div className={\"ax-terminal__line ax-terminal__\" + (line.type === \"error\" ? \"err\" : \"out\")} key={i}>{line.text}{cursor && isLast ? <span className=\"ax-terminal__cursor\"></span> : null}</div>;\n        })}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAEA,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBxB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,iBAAiB,GAAG;AAClF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEO,SAAS,SAAS,EAAE,QAAQ,QAAQ,QAAQ,CAAA,GAAI,SAAS,KAAK,SAAS,OAAO,YAAY,IAAI,GAAG,QAAQ;AAC9G,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,OAAO,MAAM;AACjB,UAAM,OAAO,MAAM,IAAI,CAAC,MAAO,OAAO,MAAM,WAAW,IAAK,EAAE,SAAS,YAAY,SAAS,MAAM,EAAE,OAAO,EAAE,IAAM,EAAE,KAAK,IAAI;AAC9H,QAAI;AAAE,gBAAU,aAAa,UAAU,UAAU,UAAU,IAAI;AAAA,IAAG,SAAS,GAAG;AAAA,IAAC;AAC/E,cAAU,IAAI;AAAG,eAAW,MAAM,UAAU,KAAK,GAAG,IAAI;AAAA,EAC1D;AACA,SACE,qBAAC,OAAA,EAAI,WAAW,CAAC,eAAe,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAAI,GAAG,MACxE,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,oBACb,UAAA;AAAA,MAAA,qBAAC,QAAA,EAAK,WAAU,qBAAoB,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,mBAAA,CAAmB;AAAA,QAAO,oBAAC,QAAA,EAAK,WAAU,mBAAA,CAAmB;AAAA,QAAO,oBAAC,QAAA,EAAK,WAAU,mBAAA,CAAmB;AAAA,MAAA,GAAO;AAAA,MAClK,oBAAC,QAAA,EAAK,WAAU,sBAAsB,UAAA,OAAM;AAAA,MAC5C,oBAAC,YAAO,WAAU,qBAAoB,SAAS,MAAO,UAAA,SAAS,aAAa,OAAA,CAAO;AAAA,IAAA,GACrF;AAAA,IACA,oBAAC,SAAI,WAAU,qBACZ,gBAAM,IAAI,CAAC,GAAG,MAAM;AACnB,YAAM,OAAO,OAAO,MAAM,WAAW,EAAE,MAAM,WAAW,MAAM,EAAA,IAAM;AACpE,YAAM,SAAS,MAAM,MAAM,SAAS;AACpC,UAAI,KAAK,SAAS,WAAW;AAC3B,eAAO,qBAAC,OAAA,EAAI,WAAU,qBAA4B,UAAA;AAAA,UAAA,qBAAC,QAAA,EAAK,WAAU,uBAAuB,UAAA;AAAA,YAAA;AAAA,YAAO;AAAA,UAAA,GAAC;AAAA,UAAO,oBAAC,QAAA,EAAK,WAAU,oBAAoB,eAAK,MAAK;AAAA,UAAQ,UAAU,SAAS,oBAAC,QAAA,EAAK,WAAU,uBAAsB,IAAU;AAAA,QAAA,EAAA,GAAlL,CAAuL;AAAA,MACxO;AACA,aAAO,qBAAC,SAAI,WAAW,qCAAqC,KAAK,SAAS,UAAU,QAAQ,QAAiB,UAAA;AAAA,QAAA,KAAK;AAAA,QAAM,UAAU,SAAS,oBAAC,QAAA,EAAK,WAAU,uBAAsB,IAAU;AAAA,MAAA,EAAA,GAAlF,CAAuF;AAAA,IAClM,CAAC,EAAA,CACH;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"Terminal.js","sources":["../../../src/components/code/Terminal.jsx"],"sourcesContent":["import React, { useState } from \"react\";\n\nconst AX_TERMINAL_CSS = `\n.ax-terminal { border: 1px solid var(--border-strong); border-radius: var(--radius-3); overflow: hidden; background: #0A0A0B; font-family: var(--font-mono); }\n.ax-terminal__bar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: #18181B; border-bottom: 1px solid rgba(255,255,255,0.1); }\n.ax-terminal__dots { display: flex; gap: 6px; }\n.ax-terminal__dot { width: 9px; height: 9px; border-radius: var(--radius-1); background: rgba(255,255,255,0.18); }\n.ax-terminal__title { font-size: 11px; color: #A1A1AA; letter-spacing: 0.04em; flex: 1; text-align: center; }\n.ax-terminal__copy { appearance: none; background: none; border: none; cursor: pointer; color: #63636B; font-size: 11px; padding: 2px 6px; border-radius: var(--radius-1); }\n.ax-terminal__copy:hover { color: #F4F4F5; }\n.ax-terminal__body { padding: 14px 16px; overflow-x: auto; font-size: var(--text-sm); line-height: 1.7; }\n.ax-terminal__line { white-space: pre; color: #E4E4E7; }\n.ax-terminal__prompt { color: #3ECF8E; user-select: none; }\n.ax-terminal__cmd { color: #F4F4F5; }\n.ax-terminal__out { color: #A1A1AA; }\n.ax-terminal__err { color: #E5484D; }\n.ax-terminal__cursor { display: inline-block; width: 0.5em; height: 1em; background: #3ECF8E; vertical-align: text-bottom; animation: ax-term-blink 1.1s steps(1) infinite; }\n@keyframes ax-term-blink { 50% { opacity: 0; } }\n@media (prefers-reduced-motion: reduce) { .ax-terminal__cursor { animation: none; } }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-terminal-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-terminal-css\";\n  s.textContent = AX_TERMINAL_CSS;\n  document.head.appendChild(s);\n}\n\nexport function Terminal({\n  title = \"bash\",\n  lines = [],\n  prompt = \"$\",\n  cursor = false,\n  className = \"\",\n  ...rest\n}) {\n  const [copied, setCopied] = useState(false);\n  const copy = () => {\n    const text = lines\n      .map((l) =>\n        typeof l === \"string\" ? l : l.type === \"command\" ? prompt + \" \" + l.text : l.text,\n      )\n      .join(\"\\n\");\n    try {\n      navigator.clipboard && navigator.clipboard.writeText(text);\n    } catch (e) {}\n    setCopied(true);\n    setTimeout(() => setCopied(false), 1500);\n  };\n  return (\n    <div className={[\"ax-terminal\", className].filter(Boolean).join(\" \")} {...rest}>\n      <div className=\"ax-terminal__bar\">\n        <span className=\"ax-terminal__dots\">\n          <span className=\"ax-terminal__dot\"></span>\n          <span className=\"ax-terminal__dot\"></span>\n          <span className=\"ax-terminal__dot\"></span>\n        </span>\n        <span className=\"ax-terminal__title\">{title}</span>\n        <button className=\"ax-terminal__copy\" onClick={copy}>\n          {copied ? \"copied ✓\" : \"copy\"}\n        </button>\n      </div>\n      <div className=\"ax-terminal__body\">\n        {lines.map((l, i) => {\n          const line = typeof l === \"string\" ? { type: \"command\", text: l } : l;\n          const isLast = i === lines.length - 1;\n          if (line.type === \"command\") {\n            return (\n              <div className=\"ax-terminal__line\" key={i}>\n                <span className=\"ax-terminal__prompt\">{prompt} </span>\n                <span className=\"ax-terminal__cmd\">{line.text}</span>\n                {cursor && isLast ? <span className=\"ax-terminal__cursor\"></span> : null}\n              </div>\n            );\n          }\n          return (\n            <div\n              className={\n                \"ax-terminal__line ax-terminal__\" + (line.type === \"error\" ? \"err\" : \"out\")\n              }\n              key={i}\n            >\n              {line.text}\n              {cursor && isLast ? <span className=\"ax-terminal__cursor\"></span> : null}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAEA,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBxB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,iBAAiB,GAAG;AAClF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEO,SAAS,SAAS;AAAA,EACvB,QAAQ;AAAA,EACR,QAAQ,CAAA;AAAA,EACR,SAAS;AAAA,EACT,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,GAAG;AACL,GAAG;AACD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,OAAO,MAAM;AACjB,UAAM,OAAO,MACV;AAAA,MAAI,CAAC,MACJ,OAAO,MAAM,WAAW,IAAI,EAAE,SAAS,YAAY,SAAS,MAAM,EAAE,OAAO,EAAE;AAAA,IAAA,EAE9E,KAAK,IAAI;AACZ,QAAI;AACF,gBAAU,aAAa,UAAU,UAAU,UAAU,IAAI;AAAA,IAC3D,SAAS,GAAG;AAAA,IAAC;AACb,cAAU,IAAI;AACd,eAAW,MAAM,UAAU,KAAK,GAAG,IAAI;AAAA,EACzC;AACA,SACE,qBAAC,OAAA,EAAI,WAAW,CAAC,eAAe,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAAI,GAAG,MACxE,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,oBACb,UAAA;AAAA,MAAA,qBAAC,QAAA,EAAK,WAAU,qBACd,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,mBAAA,CAAmB;AAAA,QACnC,oBAAC,QAAA,EAAK,WAAU,mBAAA,CAAmB;AAAA,QACnC,oBAAC,QAAA,EAAK,WAAU,mBAAA,CAAmB;AAAA,MAAA,GACrC;AAAA,MACA,oBAAC,QAAA,EAAK,WAAU,sBAAsB,UAAA,OAAM;AAAA,MAC5C,oBAAC,YAAO,WAAU,qBAAoB,SAAS,MAC5C,UAAA,SAAS,aAAa,OAAA,CACzB;AAAA,IAAA,GACF;AAAA,IACA,oBAAC,SAAI,WAAU,qBACZ,gBAAM,IAAI,CAAC,GAAG,MAAM;AACnB,YAAM,OAAO,OAAO,MAAM,WAAW,EAAE,MAAM,WAAW,MAAM,EAAA,IAAM;AACpE,YAAM,SAAS,MAAM,MAAM,SAAS;AACpC,UAAI,KAAK,SAAS,WAAW;AAC3B,eACE,qBAAC,OAAA,EAAI,WAAU,qBACb,UAAA;AAAA,UAAA,qBAAC,QAAA,EAAK,WAAU,uBAAuB,UAAA;AAAA,YAAA;AAAA,YAAO;AAAA,UAAA,GAAC;AAAA,UAC/C,oBAAC,QAAA,EAAK,WAAU,oBAAoB,eAAK,MAAK;AAAA,UAC7C,UAAU,SAAS,oBAAC,QAAA,EAAK,WAAU,uBAAsB,IAAU;AAAA,QAAA,EAAA,GAH9B,CAIxC;AAAA,MAEJ;AACA,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WACE,qCAAqC,KAAK,SAAS,UAAU,QAAQ;AAAA,UAItE,UAAA;AAAA,YAAA,KAAK;AAAA,YACL,UAAU,SAAS,oBAAC,QAAA,EAAK,WAAU,uBAAsB,IAAU;AAAA,UAAA;AAAA,QAAA;AAAA,QAH/D;AAAA,MAAA;AAAA,IAMX,CAAC,EAAA,CACH;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/code/WebPreview.js

@@ -5,14 +5,14 @@ const AX_WEBPREVIEW_CSS = `
 .ax-webpreview__bar { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--border-default); }
 .ax-webpreview__nav { display: flex; gap: 4px; }
 .ax-webpreview__navbtn { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-faint); border-radius: var(--radius-1); }
-.ax-webpreview__url { flex: 1; display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; background: var(--bg-0); border: 1px solid var(--border-default); border-radius: var(--radius-1); font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-muted); overflow: hidden; }
-[data-theme="light"] .ax-webpreview__url { background: var(--bg-1); }
+.ax-webpreview__url { flex: 1; display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; background: var(--bg-1); border: 1px solid var(--border-default); border-radius: var(--radius-1); font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-muted); overflow: hidden; }
+[data-theme="dark"] .ax-webpreview__url { background: var(--bg-0); }
 .ax-webpreview__lock { color: var(--ok); flex: none; }
 .ax-webpreview__urltext { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .ax-webpreview__refresh { appearance: none; background: none; border: none; cursor: pointer; color: var(--text-faint); padding: 4px; border-radius: var(--radius-1); flex: none; }
 .ax-webpreview__refresh:hover { color: var(--text-body); }
-.ax-webpreview__viewport { background: var(--bg-0); min-height: 160px; }
-[data-theme="light"] .ax-webpreview__viewport { background: #fff; }
+.ax-webpreview__viewport { background: #fff; min-height: 160px; }
+[data-theme="dark"] .ax-webpreview__viewport { background: var(--bg-0); }
 .ax-webpreview__viewport iframe { width: 100%; height: 100%; min-height: 160px; border: none; display: block; }
 `;
 if (typeof document !== "undefined" && !document.getElementById("ax-webpreview-css")) {
@@ -21,12 +21,46 @@ if (typeof document !== "undefined" && !document.getElementById("ax-webpreview-c
   s.textContent = AX_WEBPREVIEW_CSS;
   document.head.appendChild(s);
 }
-const Lock = /* @__PURE__ */ jsxs("svg", { width: "11", height: "11", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.4", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ jsx("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2" }),
-  /* @__PURE__ */ jsx("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
-] });
-const Refresh = /* @__PURE__ */ jsx("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8M21 3v5h-5" }) });
-function WebPreview({ url = "localhost:3000", height = 200, src, srcDoc, children, className = "", ...rest }) {
+const Lock = /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "11",
+    height: "11",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2.4",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    children: [
+      /* @__PURE__ */ jsx("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2" }),
+      /* @__PURE__ */ jsx("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
+    ]
+  }
+);
+const Refresh = /* @__PURE__ */ jsx(
+  "svg",
+  {
+    width: "13",
+    height: "13",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    children: /* @__PURE__ */ jsx("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8M21 3v5h-5" })
+  }
+);
+function WebPreview({
+  url = "localhost:3000",
+  height = 200,
+  src,
+  srcDoc,
+  children,
+  className = "",
+  ...rest
+}) {
   return /* @__PURE__ */ jsxs("div", { className: ["ax-webpreview", className].filter(Boolean).join(" "), ...rest, children: [
     /* @__PURE__ */ jsxs("div", { className: "ax-webpreview__bar", children: [
       /* @__PURE__ */ jsxs("span", { className: "ax-webpreview__nav", children: [

package/dist/components/code/WebPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"WebPreview.js","sources":["../../../src/components/code/WebPreview.jsx"],"sourcesContent":["import React from \"react\";\n\nconst AX_WEBPREVIEW_CSS = `\n.ax-webpreview { border: 1px solid var(--border-strong); border-radius: var(--radius-3); overflow: hidden; background: var(--surface-card); }\n.ax-webpreview__bar { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--border-default); }\n.ax-webpreview__nav { display: flex; gap: 4px; }\n.ax-webpreview__navbtn { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-faint); border-radius: var(--radius-1); }\n.ax-webpreview__url { flex: 1; display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; background: var(--bg-0); border: 1px solid var(--border-default); border-radius: var(--radius-1); font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-muted); overflow: hidden; }\n[data-theme=\"light\"] .ax-webpreview__url { background: var(--bg-1); }\n.ax-webpreview__lock { color: var(--ok); flex: none; }\n.ax-webpreview__urltext { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.ax-webpreview__refresh { appearance: none; background: none; border: none; cursor: pointer; color: var(--text-faint); padding: 4px; border-radius: var(--radius-1); flex: none; }\n.ax-webpreview__refresh:hover { color: var(--text-body); }\n.ax-webpreview__viewport { background: var(--bg-0); min-height: 160px; }\n[data-theme=\"light\"] .ax-webpreview__viewport { background: #fff; }\n.ax-webpreview__viewport iframe { width: 100%; height: 100%; min-height: 160px; border: none; display: block; }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-webpreview-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-webpreview-css\";\n  s.textContent = AX_WEBPREVIEW_CSS;\n  document.head.appendChild(s);\n}\n\nconst Lock = <svg width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2.4\" strokeLinecap=\"round\" strokeLinejoin=\"round\"><rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\"></rect><path d=\"M7 11V7a5 5 0 0 1 10 0v4\"></path></svg>;\nconst Refresh = <svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"><path d=\"M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8M21 3v5h-5\"></path></svg>;\n\nexport function WebPreview({ url = \"localhost:3000\", height = 200, src, srcDoc, children, className = \"\", ...rest }) {\n  return (\n    <div className={[\"ax-webpreview\", className].filter(Boolean).join(\" \")} {...rest}>\n      <div className=\"ax-webpreview__bar\">\n        <span className=\"ax-webpreview__nav\">\n          <span className=\"ax-webpreview__navbtn\">‹</span>\n          <span className=\"ax-webpreview__navbtn\">›</span>\n        </span>\n        <span className=\"ax-webpreview__url\">\n          <span className=\"ax-webpreview__lock\">{Lock}</span>\n          <span className=\"ax-webpreview__urltext\">{url}</span>\n        </span>\n        <button className=\"ax-webpreview__refresh\">{Refresh}</button>\n      </div>\n      <div className=\"ax-webpreview__viewport\" style={{ height }}>\n        {children ? children : <iframe src={src} srcDoc={srcDoc} title={url} sandbox=\"allow-scripts\"></iframe>}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAEA,MAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgB1B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,mBAAmB,GAAG;AACpF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEA,MAAM,OAAO,qBAAC,OAAA,EAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,OAAM,eAAc,SAAQ,gBAAe,SAAQ,UAAA;AAAA,EAAA,oBAAC,QAAA,EAAK,GAAE,KAAI,GAAE,MAAK,OAAM,MAAK,QAAO,MAAK,IAAG,IAAA,CAAI;AAAA,EAAO,oBAAC,QAAA,EAAK,GAAE,2BAAA,CAA2B;AAAA,GAAO;AAChQ,MAAM,8BAAW,OAAA,EAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KAAI,eAAc,SAAQ,gBAAe,SAAQ,UAAA,oBAAC,QAAA,EAAK,GAAE,+DAAA,CAA+D,EAAA,CAAO;AAEtO,SAAS,WAAW,EAAE,MAAM,kBAAkB,SAAS,KAAK,KAAK,QAAQ,UAAU,YAAY,IAAI,GAAG,QAAQ;AACnH,SACE,qBAAC,OAAA,EAAI,WAAW,CAAC,iBAAiB,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAAI,GAAG,MAC1E,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,sBACb,UAAA;AAAA,MAAA,qBAAC,QAAA,EAAK,WAAU,sBACd,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,KAAC;AAAA,QACzC,oBAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,IAAA,CAAC;AAAA,MAAA,GAC3C;AAAA,MACA,qBAAC,QAAA,EAAK,WAAU,sBACd,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,uBAAuB,UAAA,MAAK;AAAA,QAC5C,oBAAC,QAAA,EAAK,WAAU,0BAA0B,UAAA,IAAA,CAAI;AAAA,MAAA,GAChD;AAAA,MACA,oBAAC,UAAA,EAAO,WAAU,0BAA0B,UAAA,QAAA,CAAQ;AAAA,IAAA,GACtD;AAAA,wBACC,OAAA,EAAI,WAAU,2BAA0B,OAAO,EAAE,UAC/C,UAAA,WAAW,WAAW,oBAAC,YAAO,KAAU,QAAgB,OAAO,KAAK,SAAQ,iBAAgB,EAAA,CAC/F;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"WebPreview.js","sources":["../../../src/components/code/WebPreview.jsx"],"sourcesContent":["import React from \"react\";\n\nconst AX_WEBPREVIEW_CSS = `\n.ax-webpreview { border: 1px solid var(--border-strong); border-radius: var(--radius-3); overflow: hidden; background: var(--surface-card); }\n.ax-webpreview__bar { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--border-default); }\n.ax-webpreview__nav { display: flex; gap: 4px; }\n.ax-webpreview__navbtn { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-faint); border-radius: var(--radius-1); }\n.ax-webpreview__url { flex: 1; display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; background: var(--bg-1); border: 1px solid var(--border-default); border-radius: var(--radius-1); font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-muted); overflow: hidden; }\n[data-theme=\"dark\"] .ax-webpreview__url { background: var(--bg-0); }\n.ax-webpreview__lock { color: var(--ok); flex: none; }\n.ax-webpreview__urltext { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.ax-webpreview__refresh { appearance: none; background: none; border: none; cursor: pointer; color: var(--text-faint); padding: 4px; border-radius: var(--radius-1); flex: none; }\n.ax-webpreview__refresh:hover { color: var(--text-body); }\n.ax-webpreview__viewport { background: #fff; min-height: 160px; }\n[data-theme=\"dark\"] .ax-webpreview__viewport { background: var(--bg-0); }\n.ax-webpreview__viewport iframe { width: 100%; height: 100%; min-height: 160px; border: none; display: block; }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-webpreview-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-webpreview-css\";\n  s.textContent = AX_WEBPREVIEW_CSS;\n  document.head.appendChild(s);\n}\n\nconst Lock = (\n  <svg\n    width=\"11\"\n    height=\"11\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2.4\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n  >\n    <rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\"></rect>\n    <path d=\"M7 11V7a5 5 0 0 1 10 0v4\"></path>\n  </svg>\n);\nconst Refresh = (\n  <svg\n    width=\"13\"\n    height=\"13\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n  >\n    <path d=\"M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8M21 3v5h-5\"></path>\n  </svg>\n);\n\nexport function WebPreview({\n  url = \"localhost:3000\",\n  height = 200,\n  src,\n  srcDoc,\n  children,\n  className = \"\",\n  ...rest\n}) {\n  return (\n    <div className={[\"ax-webpreview\", className].filter(Boolean).join(\" \")} {...rest}>\n      <div className=\"ax-webpreview__bar\">\n        <span className=\"ax-webpreview__nav\">\n          <span className=\"ax-webpreview__navbtn\">‹</span>\n          <span className=\"ax-webpreview__navbtn\">›</span>\n        </span>\n        <span className=\"ax-webpreview__url\">\n          <span className=\"ax-webpreview__lock\">{Lock}</span>\n          <span className=\"ax-webpreview__urltext\">{url}</span>\n        </span>\n        <button className=\"ax-webpreview__refresh\">{Refresh}</button>\n      </div>\n      <div className=\"ax-webpreview__viewport\" style={{ height }}>\n        {children ? (\n          children\n        ) : (\n          <iframe src={src} srcDoc={srcDoc} title={url} sandbox=\"allow-scripts\"></iframe>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAEA,MAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgB1B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,mBAAmB,GAAG;AACpF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEA,MAAM,OACJ;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,QAAO;AAAA,IACP,aAAY;AAAA,IACZ,eAAc;AAAA,IACd,gBAAe;AAAA,IAEf,UAAA;AAAA,MAAA,oBAAC,QAAA,EAAK,GAAE,KAAI,GAAE,MAAK,OAAM,MAAK,QAAO,MAAK,IAAG,IAAA,CAAI;AAAA,MACjD,oBAAC,QAAA,EAAK,GAAE,2BAAA,CAA2B;AAAA,IAAA;AAAA,EAAA;AACrC;AAEF,MAAM,UACJ;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,QAAO;AAAA,IACP,aAAY;AAAA,IACZ,eAAc;AAAA,IACd,gBAAe;AAAA,IAEf,UAAA,oBAAC,QAAA,EAAK,GAAE,+DAAA,CAA+D;AAAA,EAAA;AACzE;AAGK,SAAS,WAAW;AAAA,EACzB,MAAM;AAAA,EACN,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,GAAG;AACL,GAAG;AACD,SACE,qBAAC,OAAA,EAAI,WAAW,CAAC,iBAAiB,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,GAAI,GAAG,MAC1E,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,sBACb,UAAA;AAAA,MAAA,qBAAC,QAAA,EAAK,WAAU,sBACd,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,KAAC;AAAA,QACzC,oBAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,IAAA,CAAC;AAAA,MAAA,GAC3C;AAAA,MACA,qBAAC,QAAA,EAAK,WAAU,sBACd,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,uBAAuB,UAAA,MAAK;AAAA,QAC5C,oBAAC,QAAA,EAAK,WAAU,0BAA0B,UAAA,IAAA,CAAI;AAAA,MAAA,GAChD;AAAA,MACA,oBAAC,UAAA,EAAO,WAAU,0BAA0B,UAAA,QAAA,CAAQ;AAAA,IAAA,GACtD;AAAA,wBACC,OAAA,EAAI,WAAU,2BAA0B,OAAO,EAAE,UAC/C,UAAA,WACC,WAEA,oBAAC,YAAO,KAAU,QAAgB,OAAO,KAAK,SAAQ,iBAAgB,EAAA,CAE1E;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/display/Skeleton.js

@@ -7,11 +7,11 @@ const AX_SKELETON_CSS = `
 }
 .ax-skeleton::after {
   content: ""; position: absolute; inset: 0;
-  background: linear-gradient(90deg, transparent, var(--bg-3), transparent);
+  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);
   transform: translateX(-100%);
   animation: ax-shimmer 1.4s var(--ease-out) infinite;
 }
-[data-theme="light"] .ax-skeleton::after { background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent); }
+[data-theme="dark"] .ax-skeleton::after { background: linear-gradient(90deg, transparent, var(--bg-3), transparent); }
 .ax-skeleton--text { height: 0.7em; margin: 0.2em 0; }
 .ax-skeleton--circle { border-radius: var(--radius-2); }
 @keyframes ax-shimmer { 100% { transform: translateX(100%); } }
@@ -23,7 +23,15 @@ if (typeof document !== "undefined" && !document.getElementById("ax-skeleton-css
   s.textContent = AX_SKELETON_CSS;
   document.head.appendChild(s);
 }
-function Skeleton({ variant = "block", width, height, lines = 1, className = "", style = {}, ...rest }) {
+function Skeleton({
+  variant = "block",
+  width,
+  height,
+  lines = 1,
+  className = "",
+  style = {},
+  ...rest
+}) {
   if (variant === "text" && lines > 1) {
     return /* @__PURE__ */ jsx("div", { className, ...rest, children: Array.from({ length: lines }).map((_, i) => /* @__PURE__ */ jsx(
       "span",
@@ -34,7 +42,12 @@ function Skeleton({ variant = "block", width, height, lines = 1, className = "",
       i
     )) });
   }
-  const cls = ["ax-skeleton", variant === "text" ? "ax-skeleton--text" : "", variant === "circle" ? "ax-skeleton--circle" : "", className].filter(Boolean).join(" ");
+  const cls = [
+    "ax-skeleton",
+    variant === "text" ? "ax-skeleton--text" : "",
+    variant === "circle" ? "ax-skeleton--circle" : "",
+    className
+  ].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx("span", { className: cls, style: { width, height, ...style }, ...rest });
 }
 export {

package/dist/components/display/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","sources":["../../../src/components/display/Skeleton.jsx"],"sourcesContent":["import React from \"react\";\n\nconst AX_SKELETON_CSS = `\n.ax-skeleton {\n  display: block; background: var(--surface-raised);\n  border-radius: var(--radius-1); position: relative; overflow: hidden;\n}\n.ax-skeleton::after {\n  content: \"\"; position: absolute; inset: 0;\n  background: linear-gradient(90deg, transparent, var(--bg-3), transparent);\n  transform: translateX(-100%);\n  animation: ax-shimmer 1.4s var(--ease-out) infinite;\n}\n[data-theme=\"light\"] .ax-skeleton::after { background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent); }\n.ax-skeleton--text { height: 0.7em; margin: 0.2em 0; }\n.ax-skeleton--circle { border-radius: var(--radius-2); }\n@keyframes ax-shimmer { 100% { transform: translateX(100%); } }\n@media (prefers-reduced-motion: reduce) { .ax-skeleton::after { animation: none; } }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-skeleton-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-skeleton-css\";\n  s.textContent = AX_SKELETON_CSS;\n  document.head.appendChild(s);\n}\n\nexport function Skeleton({ variant = \"block\", width, height, lines = 1, className = \"\", style = {}, ...rest }) {\n  if (variant === \"text\" && lines > 1) {\n    return (\n      <div className={className} {...rest}>\n        {Array.from({ length: lines }).map((_, i) => (\n          <span\n            key={i}\n            className=\"ax-skeleton ax-skeleton--text\"\n            style={{ width: i === lines - 1 ? \"60%\" : \"100%\" }}\n          ></span>\n        ))}\n      </div>\n    );\n  }\n  const cls = [\"ax-skeleton\", variant === \"text\" ? \"ax-skeleton--text\" : \"\", variant === \"circle\" ? \"ax-skeleton--circle\" : \"\", className].filter(Boolean).join(\" \");\n  return <span className={cls} style={{ width, height, ...style }} {...rest}></span>;\n}\n"],"names":[],"mappings":";;AAEA,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBxB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,iBAAiB,GAAG;AAClF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEO,SAAS,SAAS,EAAE,UAAU,SAAS,OAAO,QAAQ,QAAQ,GAAG,YAAY,IAAI,QAAQ,CAAA,GAAI,GAAG,QAAQ;AAC7G,MAAI,YAAY,UAAU,QAAQ,GAAG;AACnC,WACE,oBAAC,OAAA,EAAI,WAAuB,GAAG,MAC5B,UAAA,MAAM,KAAK,EAAE,QAAQ,OAAO,EAAE,IAAI,CAAC,GAAG,MACrC;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAU;AAAA,QACV,OAAO,EAAE,OAAO,MAAM,QAAQ,IAAI,QAAQ,OAAA;AAAA,MAAO;AAAA,MAF5C;AAAA,IAAA,CAIR,GACH;AAAA,EAEJ;AACA,QAAM,MAAM,CAAC,eAAe,YAAY,SAAS,sBAAsB,IAAI,YAAY,WAAW,wBAAwB,IAAI,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACjK,SAAO,oBAAC,QAAA,EAAK,WAAW,KAAK,OAAO,EAAE,OAAO,QAAQ,GAAG,SAAU,GAAG,KAAA,CAAM;AAC7E;"}
+{"version":3,"file":"Skeleton.js","sources":["../../../src/components/display/Skeleton.jsx"],"sourcesContent":["import React from \"react\";\n\nconst AX_SKELETON_CSS = `\n.ax-skeleton {\n  display: block; background: var(--surface-raised);\n  border-radius: var(--radius-1); position: relative; overflow: hidden;\n}\n.ax-skeleton::after {\n  content: \"\"; position: absolute; inset: 0;\n  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);\n  transform: translateX(-100%);\n  animation: ax-shimmer 1.4s var(--ease-out) infinite;\n}\n[data-theme=\"dark\"] .ax-skeleton::after { background: linear-gradient(90deg, transparent, var(--bg-3), transparent); }\n.ax-skeleton--text { height: 0.7em; margin: 0.2em 0; }\n.ax-skeleton--circle { border-radius: var(--radius-2); }\n@keyframes ax-shimmer { 100% { transform: translateX(100%); } }\n@media (prefers-reduced-motion: reduce) { .ax-skeleton::after { animation: none; } }\n`;\n\nif (typeof document !== \"undefined\" && !document.getElementById(\"ax-skeleton-css\")) {\n  const s = document.createElement(\"style\");\n  s.id = \"ax-skeleton-css\";\n  s.textContent = AX_SKELETON_CSS;\n  document.head.appendChild(s);\n}\n\nexport function Skeleton({\n  variant = \"block\",\n  width,\n  height,\n  lines = 1,\n  className = \"\",\n  style = {},\n  ...rest\n}) {\n  if (variant === \"text\" && lines > 1) {\n    return (\n      <div className={className} {...rest}>\n        {Array.from({ length: lines }).map((_, i) => (\n          <span\n            key={i}\n            className=\"ax-skeleton ax-skeleton--text\"\n            style={{ width: i === lines - 1 ? \"60%\" : \"100%\" }}\n          ></span>\n        ))}\n      </div>\n    );\n  }\n  const cls = [\n    \"ax-skeleton\",\n    variant === \"text\" ? \"ax-skeleton--text\" : \"\",\n    variant === \"circle\" ? \"ax-skeleton--circle\" : \"\",\n    className,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n  return <span className={cls} style={{ width, height, ...style }} {...rest}></span>;\n}\n"],"names":[],"mappings":";;AAEA,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBxB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,eAAe,iBAAiB,GAAG;AAClF,QAAM,IAAI,SAAS,cAAc,OAAO;AACxC,IAAE,KAAK;AACP,IAAE,cAAc;AAChB,WAAS,KAAK,YAAY,CAAC;AAC7B;AAEO,SAAS,SAAS;AAAA,EACvB,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,QAAQ,CAAA;AAAA,EACR,GAAG;AACL,GAAG;AACD,MAAI,YAAY,UAAU,QAAQ,GAAG;AACnC,WACE,oBAAC,OAAA,EAAI,WAAuB,GAAG,MAC5B,UAAA,MAAM,KAAK,EAAE,QAAQ,OAAO,EAAE,IAAI,CAAC,GAAG,MACrC;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAU;AAAA,QACV,OAAO,EAAE,OAAO,MAAM,QAAQ,IAAI,QAAQ,OAAA;AAAA,MAAO;AAAA,MAF5C;AAAA,IAAA,CAIR,GACH;AAAA,EAEJ;AACA,QAAM,MAAM;AAAA,IACV;AAAA,IACA,YAAY,SAAS,sBAAsB;AAAA,IAC3C,YAAY,WAAW,wBAAwB;AAAA,IAC/C;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AACX,SAAO,oBAAC,QAAA,EAAK,WAAW,KAAK,OAAO,EAAE,OAAO,QAAQ,GAAG,SAAU,GAAG,KAAA,CAAM;AAC7E;"}

package/dist/components/display/StatusPill.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Connection/health status chip built on Badge. Maps a status string to the
+ * right variant + dot + label. idle→neutral, testing→neutral·dot, ok→ok·dot,
+ * error→danger·dot.
+ */
+export interface StatusPillProps {
+  /** @default "idle" */
+  status?: "idle" | "testing" | "ok" | "error";
+  /** Override the per-state label text. */
+  labels?: Partial<Record<"idle" | "testing" | "ok" | "error", string>>;
+}
+export declare function StatusPill(props: StatusPillProps): JSX.Element;

package/dist/components/display/StatusPill.js

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { Badge } from "./Badge.js";
+function StatusPill({ status = "idle", labels = {}, ...rest }) {
+  const L = { idle: "未连接", testing: "测试中", ok: "已连接", error: "连接失败", ...labels };
+  if (status === "ok")
+    return /* @__PURE__ */ jsx(Badge, { variant: "ok", dot: true, ...rest, children: L.ok });
+  if (status === "error")
+    return /* @__PURE__ */ jsx(Badge, { variant: "danger", dot: true, ...rest, children: L.error });
+  if (status === "testing")
+    return /* @__PURE__ */ jsx(Badge, { variant: "neutral", dot: true, ...rest, children: L.testing });
+  return /* @__PURE__ */ jsx(Badge, { variant: "neutral", ...rest, children: L.idle });
+}
+export {
+  StatusPill
+};
+//# sourceMappingURL=StatusPill.js.map

package/dist/components/display/StatusPill.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusPill.js","sources":["../../../src/components/display/StatusPill.jsx"],"sourcesContent":["import React from \"react\";\nimport { Badge } from \"./Badge.jsx\";\n\n// StatusPill — connection/health status mapped onto the DS Badge.\n// Four states: idle (未连接) · testing (测试中) · ok (已连接) · error (连接失败).\n// Labels are overridable for non-connection uses.\nexport function StatusPill({ status = \"idle\", labels = {}, ...rest }) {\n  const L = { idle: \"未连接\", testing: \"测试中\", ok: \"已连接\", error: \"连接失败\", ...labels };\n  if (status === \"ok\")\n    return (\n      <Badge variant=\"ok\" dot {...rest}>\n        {L.ok}\n      </Badge>\n    );\n  if (status === \"error\")\n    return (\n      <Badge variant=\"danger\" dot {...rest}>\n        {L.error}\n      </Badge>\n    );\n  if (status === \"testing\")\n    return (\n      <Badge variant=\"neutral\" dot {...rest}>\n        {L.testing}\n      </Badge>\n    );\n  return (\n    <Badge variant=\"neutral\" {...rest}>\n      {L.idle}\n    </Badge>\n  );\n}\n"],"names":[],"mappings":";;;AAMO,SAAS,WAAW,EAAE,SAAS,QAAQ,SAAS,CAAA,GAAI,GAAG,QAAQ;AACpE,QAAM,IAAI,EAAE,MAAM,OAAO,SAAS,OAAO,IAAI,OAAO,OAAO,QAAQ,GAAG,OAAA;AACtE,MAAI,WAAW;AACb,WACE,oBAAC,SAAM,SAAQ,MAAK,KAAG,MAAE,GAAG,MACzB,UAAA,EAAE,GAAA,CACL;AAEJ,MAAI,WAAW;AACb,WACE,oBAAC,SAAM,SAAQ,UAAS,KAAG,MAAE,GAAG,MAC7B,UAAA,EAAE,MAAA,CACL;AAEJ,MAAI,WAAW;AACb,WACE,oBAAC,SAAM,SAAQ,WAAU,KAAG,MAAE,GAAG,MAC9B,UAAA,EAAE,QAAA,CACL;AAEJ,6BACG,OAAA,EAAM,SAAQ,WAAW,GAAG,MAC1B,YAAE,MACL;AAEJ;"}

package/dist/components/inputs/Form.d.ts

@@ -0,0 +1,164 @@
+import * as React from "react";
+
+/** Structural <form> wrapper. Pure layout — pass form.handleSubmit as onSubmit. */
+export interface FormProps extends React.FormHTMLAttributes<HTMLFormElement> {
+  /** Vertical rhythm between children. @default "normal" */
+  gap?: "tight" | "normal" | "loose";
+  onSubmit?: (e: React.FormEvent<HTMLFormElement>) => void;
+  children?: React.ReactNode;
+}
+
+/** Footer row for submit/cancel buttons. */
+export interface FormActionsProps extends React.HTMLAttributes<HTMLDivElement> {
+  /** Horizontal alignment of the buttons. @default "end" */
+  align?: "start" | "end" | "between";
+  /** Draw a separator line above the row. @default false */
+  bordered?: boolean;
+  /** Stretch buttons to fill the row equally. @default false */
+  full?: boolean;
+  children?: React.ReactNode;
+}
+
+/** A `{ value, message }` pair, or the bare value (message falls back to a default). */
+export type Rule<T> = T | { value: T; message: string };
+
+/** Built-in per-field validation rules, RHF-aligned. Pass as the 2nd arg to register/field. */
+export interface FieldRules<V = Record<string, any>> {
+  /** Non-empty (and, for checkboxes, checked). String = custom message. */
+  required?: boolean | string;
+  minLength?: Rule<number>;
+  maxLength?: Rule<number>;
+  min?: Rule<number>;
+  max?: Rule<number>;
+  pattern?: RegExp | { value: RegExp; message: string };
+  /** Custom validator(s). Return `true` (ok), a string (error message), or `false`. May be async. */
+  validate?:
+    | ((value: any, values: V) => boolean | string | Promise<boolean | string>)
+    | Record<string, (value: any, values: V) => boolean | string | Promise<boolean | string>>;
+  /** Set "checkbox" so register/field bind `checked` instead of `value`. */
+  type?: "checkbox";
+}
+
+export interface RegisterReturn {
+  name: string;
+  value?: any;
+  checked?: boolean;
+  onChange: (e: any) => void;
+  onBlur: () => void;
+}
+export interface FieldReturn extends RegisterReturn {
+  /** Current error for this field (only set once it has been validated). */
+  error?: string;
+}
+
+export interface FormState<V> {
+  errors: Record<string, string>;
+  touched: Record<string, boolean>;
+  dirtyFields: Record<string, boolean>;
+  isDirty: boolean;
+  /** True when the last validation run produced no errors. */
+  isValid: boolean;
+  isValidating: boolean;
+  isSubmitting: boolean;
+  isSubmitted: boolean;
+  isSubmitSuccessful: boolean;
+  submitCount: number;
+}
+
+export interface FormBag<V = Record<string, any>> extends FormState<V> {
+  values: V;
+  /** Alias of isSubmitted, kept for back-compat. */
+  submitted: boolean;
+  formState: FormState<V>;
+
+  /** RHF-compatible binding: `<input {...form.register("email", { required: true })} />`. */
+  register: (name: string, rules?: FieldRules<V>) => RegisterReturn;
+  /** Like register but also injects `error` for DS controls: `<Input {...form.field("email")} />`. */
+  field: (name: string, rules?: FieldRules<V>) => FieldReturn;
+
+  setValue: (
+    name: string,
+    value: any,
+    opts?: { shouldValidate?: boolean; shouldTouch?: boolean; shouldDirty?: boolean },
+  ) => void;
+  setValues: (values: V | ((prev: V) => V)) => void;
+  getValues: (name?: string) => any;
+  /** Read field value(s) reactively (re-renders on change). */
+  watch: (name?: string) => any;
+  /** Set a field error manually (e.g. a server-side error). */
+  setError: (name: string, message: string) => void;
+  clearErrors: (name?: string) => void;
+  /** Imperatively validate the form or one field. Resolves to validity. */
+  trigger: (name?: string) => Promise<boolean>;
+
+  /**
+   * Two call styles:
+   * - `onSubmit={form.handleSubmit}` (uses config.onSubmit) — works as a direct event/onClick handler.
+   * - `onSubmit={form.handleSubmit(onValid, onInvalid?)}` — RHF style, returns a handler.
+   * Always preventDefaults, validates, marks all fields touched, focuses the first error.
+   */
+  handleSubmit: {
+    (e?: React.FormEvent | React.MouseEvent): void;
+    (
+      onValid: (values: V) => void | Promise<any>,
+      onInvalid?: (errors: Record<string, string>) => void,
+    ): (e?: React.SyntheticEvent) => void;
+  };
+  reset: (
+    next?: V,
+    opts?: {
+      keepErrors?: boolean;
+      keepTouched?: boolean;
+      keepDirty?: boolean;
+      keepIsSubmitted?: boolean;
+      keepDefaultValues?: boolean;
+    },
+  ) => void;
+}
+
+export interface UseFormConfig<V = Record<string, any>> {
+  initialValues?: V;
+  /** Alias of initialValues (RHF naming). */
+  defaultValues?: V;
+  /** Schema-style validator: `(values) => ({ field: message })`. Sync or async. Composes with per-field rules. */
+  validate?: (values: V) => Record<string, string> | Promise<Record<string, string>> | undefined;
+  /** When validation first fires. @default "onSubmit" */
+  mode?: "onSubmit" | "onBlur" | "onChange" | "onTouched" | "all";
+  /** When to re-validate after the first submit. @default "onChange" */
+  reValidateMode?: "onChange" | "onBlur";
+  /** Called with values on a clean submit. May return a promise → toggles isSubmitting. */
+  onSubmit?: (values: V) => void | Promise<any>;
+  /** Called with the errors map when submit is attempted while invalid. */
+  onInvalid?: (errors: Record<string, string>) => void;
+  /** Focus the first errored `[name]` control on a failed submit. @default true */
+  shouldFocusError?: boolean;
+}
+
+export interface UseFieldArrayConfig<V = Record<string, any>> {
+  form: FormBag<V>;
+  /** Name of the array field on the form's values. */
+  name: string;
+}
+export interface FieldArrayReturn<T = any> {
+  /** Current rows, each with a stable `id`. */
+  fields: Array<T & { id: number }>;
+  append: (item: T) => void;
+  prepend: (item: T) => void;
+  remove: (index: number) => void;
+  insert: (index: number, item: T) => void;
+  move: (from: number, to: number) => void;
+  replace: (items: T[]) => void;
+  update: (index: number, item: T) => void;
+}
+
+export declare function Form(props: FormProps): JSX.Element;
+export declare namespace Form {
+  /** Production controlled form hook — RHF-aligned. Optional; drop it for RHF/TanStack. */
+  function useForm<V = Record<string, any>>(config?: UseFormConfig<V>): FormBag<V>;
+  /** Dynamic list fields. */
+  function useFieldArray<T = any, V = Record<string, any>>(
+    config: UseFieldArrayConfig<V>,
+  ): FieldArrayReturn<T>;
+  function Actions(props: FormActionsProps): JSX.Element;
+}
+export declare function FormActions(props: FormActionsProps): JSX.Element;