aidos-ui 4.0.4 → 4.0.5

package/dist/jsx-dev-runtime.d.ts

@@ -1,2 +1,6 @@
-export { Fragment } from "react/jsx-dev-runtime";
-export declare function jsxDEV(type: any, props: any, key: any, isStaticChildren: boolean, source: any, self: any): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+import * as React from 'react';
+export { Fragment, JSX } from 'react/jsx-dev-runtime';
+
+declare function jsxDEV(type: any, props: any, key: any, isStaticChildren: boolean, source: any, self: any): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+
+export { jsxDEV };

package/dist/jsx-dev-runtime.js

@@ -1,48 +1,93 @@
-// Custom JSX dev runtime that injects <!-- ComponentName --> comments
-// into the DOM at component boundaries.
-//
-// Usage: in tsconfig.json, set "jsxImportSource": "aidos-ui/src"
-// (or wherever this file is importable from)
-export { Fragment } from "react/jsx-dev-runtime";
-import { jsxDEV as _jsxDEV, Fragment } from "react/jsx-dev-runtime";
-import { JSSComment } from "./JSSComment";
-const wrapCache = new WeakMap();
-function getWrapped(type) {
-    let wrapped = wrapCache.get(type);
-    if (wrapped)
-        return wrapped;
-    const name = type.displayName || type.name;
-    wrapped = function JSSBoundary(props) {
-        return _jsxDEV(Fragment, {
-            children: [
-                _jsxDEV(JSSComment, { name }, undefined, false, undefined, undefined),
-                _jsxDEV(type, props, undefined, false, undefined, undefined),
-            ],
-        }, undefined, true, undefined, undefined);
+import { jsxDEV as jsxDEV$1, Fragment } from 'react/jsx-dev-runtime';
+export { Fragment } from 'react/jsx-dev-runtime';
+import React, { useRef, useEffect } from 'react';
+
+// src/jsx-dev-runtime.ts
+function JSSComment({ name }) {
+  const fiberRef = useRef(null);
+  try {
+    const internals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    fiberRef.current = internals?.ReactCurrentOwner?.current;
+  } catch {
+  }
+  useEffect(() => {
+    const fiber = fiberRef.current;
+    if (!fiber) return;
+    const sibling = fiber.sibling;
+    if (!sibling) return;
+    const hostNode = findFirstDOMNode(sibling);
+    if (!hostNode?.parentNode) return;
+    const comment = document.createComment(` ${name} `);
+    hostNode.parentNode.insertBefore(comment, hostNode);
+    return () => {
+      comment.remove();
     };
-    wrapped.displayName = name;
-    wrapCache.set(type, wrapped);
-    return wrapped;
+  }, [name]);
+  return null;
+}
+function findFirstDOMNode(fiber) {
+  let current = fiber;
+  while (current) {
+    if (current.stateNode instanceof Node) {
+      return current.stateNode;
+    }
+    if (current.child) {
+      current = current.child;
+      continue;
+    }
+    break;
+  }
+  return null;
 }
-// Skip our own wrapper components by name
-const SKIP_NAMES = new Set(["JSSComment", "JSSBoundary"]);
+
+// src/jsx-dev-runtime.ts
+var wrapCache = /* @__PURE__ */ new WeakMap();
+function getWrapped(type) {
+  let wrapped = wrapCache.get(type);
+  if (wrapped) return wrapped;
+  const name = type.displayName || type.name;
+  wrapped = function JSSBoundary(props) {
+    return jsxDEV$1(
+      Fragment,
+      {
+        children: [
+          jsxDEV$1(JSSComment, { name }, void 0, false, void 0, void 0),
+          jsxDEV$1(type, props, void 0, false, void 0, void 0)
+        ]
+      },
+      void 0,
+      true,
+      void 0,
+      void 0
+    );
+  };
+  wrapped.displayName = name;
+  wrapCache.set(type, wrapped);
+  return wrapped;
+}
+var SKIP_NAMES = /* @__PURE__ */ new Set(["JSSComment", "JSSBoundary"]);
 function isUserComponent(type, source) {
-    if (typeof type !== "function")
-        return false;
-    const name = type.displayName || type.name;
-    if (!name || !/^[A-Z]/.test(name))
-        return false;
-    if (SKIP_NAMES.has(name))
-        return false;
-    // Use the source fileName from the JSX transform to skip node_modules
-    if (source?.fileName?.includes("node_modules"))
-        return false;
-    return true;
+  if (typeof type !== "function") return false;
+  const name = type.displayName || type.name;
+  if (!name || !/^[A-Z]/.test(name)) return false;
+  if (SKIP_NAMES.has(name)) return false;
+  if (source?.fileName?.includes("node_modules")) return false;
+  return true;
 }
-export function jsxDEV(type, props, key, isStaticChildren, source, self) {
-    if (isUserComponent(type, source)) {
-        return _jsxDEV(getWrapped(type), props, key, isStaticChildren, source, self);
-    }
-    return _jsxDEV(type, props, key, isStaticChildren, source, self);
+function jsxDEV(type, props, key, isStaticChildren, source, self) {
+  if (isUserComponent(type, source)) {
+    return jsxDEV$1(
+      getWrapped(type),
+      props,
+      key,
+      isStaticChildren,
+      source,
+      self
+    );
+  }
+  return jsxDEV$1(type, props, key, isStaticChildren, source, self);
 }
+
+export { jsxDEV };
+//# sourceMappingURL=jsx-dev-runtime.js.map
 //# sourceMappingURL=jsx-dev-runtime.js.map

package/dist/jsx-dev-runtime.js.map

@@ -1 +1 @@
-{"version":3,"file":"jsx-dev-runtime.js","sourceRoot":"","sources":["../src/jsx-dev-runtime.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,wCAAwC;AACxC,EAAE;AACF,iEAAiE;AACjE,6CAA6C;AAE7C,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,MAAM,IAAI,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,SAAS,GAAG,IAAI,OAAO,EAAsB,CAAC;AAEpD,SAAS,UAAU,CAAC,IAAc;IAChC,IAAI,OAAO,GAAG,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAClC,IAAI,OAAO;QAAE,OAAO,OAAO,CAAC;IAE5B,MAAM,IAAI,GAAI,IAAY,CAAC,WAAW,IAAI,IAAI,CAAC,IAAI,CAAC;IAEpD,OAAO,GAAG,SAAS,WAAW,CAAC,KAAU;QACvC,OAAO,OAAO,CACZ,QAAQ,EACR;YACE,QAAQ,EAAE;gBACR,OAAO,CAAC,UAAU,EAAE,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,CAAC;gBACrE,OAAO,CAAC,IAAW,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,CAAC;aACpE;SACF,EACD,SAAS,EACT,IAAI,EACJ,SAAS,EACT,SAAS,CACV,CAAC;IACJ,CAAC,CAAC;IAED,OAAe,CAAC,WAAW,GAAG,IAAI,CAAC;IACpC,SAAS,CAAC,GAAG,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IAE7B,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,0CAA0C;AAC1C,MAAM,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,CAAC;AAE1D,SAAS,eAAe,CAAC,IAAS,EAAE,MAAW;IAC7C,IAAI,OAAO,IAAI,KAAK,UAAU;QAAE,OAAO,KAAK,CAAC;IAC7C,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,IAAI,CAAC;IAC3C,IAAI,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;QAAE,OAAO,KAAK,CAAC;IAChD,IAAI,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC;QAAE,OAAO,KAAK,CAAC;IACvC,sEAAsE;IACtE,IAAI,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC;QAAE,OAAO,KAAK,CAAC;IAC7D,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,UAAU,MAAM,CACpB,IAAS,EACT,KAAU,EACV,GAAQ,EACR,gBAAyB,EACzB,MAAW,EACX,IAAS;IAET,IAAI,eAAe,CAAC,IAAI,EAAE,MAAM,CAAC,EAAE,CAAC;QAClC,OAAO,OAAO,CACZ,UAAU,CAAC,IAAI,CAAQ,EACvB,KAAK,EACL,GAAG,EACH,gBAAgB,EAChB,MAAM,EACN,IAAI,CACL,CAAC;IACJ,CAAC;IAED,OAAO,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,gBAAgB,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC;AACnE,CAAC"}
+{"version":3,"sources":["../src/JSSComment.tsx","../src/jsx-dev-runtime.ts"],"names":["_jsxDEV","Fragment"],"mappings":"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","file":"jsx-dev-runtime.js","sourcesContent":["import React, { useEffect, useRef } from \"react\";\n\n/**\n * Injects a real HTML comment node (<!-- ComponentName -->) into the DOM.\n *\n * Renders nothing (null). Uses the React fiber tree to locate the sibling\n * component's first DOM node, then inserts a comment before it.\n * Client-only — no SSR output, no hydration mismatch.\n */\nexport function JSSComment({ name }: { name: string }) {\n  const fiberRef = useRef<any>(null);\n\n  // Capture our fiber during render\n  try {\n    const internals = (React as any)\n      .__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;\n    fiberRef.current = internals?.ReactCurrentOwner?.current;\n  } catch {}\n\n  useEffect(() => {\n    const fiber = fiberRef.current;\n    if (!fiber) return;\n\n    // Our sibling in the Fragment is the actual component\n    const sibling = fiber.sibling;\n    if (!sibling) return;\n\n    // Walk down the sibling's fiber tree to find its first DOM node\n    const hostNode = findFirstDOMNode(sibling);\n    if (!hostNode?.parentNode) return;\n\n    const comment = document.createComment(` ${name} `);\n    hostNode.parentNode.insertBefore(comment, hostNode);\n\n    return () => {\n      comment.remove();\n    };\n  }, [name]);\n\n  return null;\n}\n\nfunction findFirstDOMNode(fiber: any): Node | null {\n  let current = fiber;\n  while (current) {\n    if (current.stateNode instanceof Node) {\n      return current.stateNode;\n    }\n    if (current.child) {\n      current = current.child;\n      continue;\n    }\n    break;\n  }\n  return null;\n}\n","// Custom JSX dev runtime that injects <!-- ComponentName --> comments\n// into the DOM at component boundaries.\n//\n// Usage: in tsconfig.json, set \"jsxImportSource\": \"aidos-ui/src\"\n// (or wherever this file is importable from)\n\nexport { Fragment } from \"react/jsx-dev-runtime\";\nexport type { JSX } from \"react/jsx-dev-runtime\";\nimport { jsxDEV as _jsxDEV, Fragment } from \"react/jsx-dev-runtime\";\nimport { JSSComment } from \"./JSSComment\";\n\nconst wrapCache = new WeakMap<Function, Function>();\n\nfunction getWrapped(type: Function): Function {\n  let wrapped = wrapCache.get(type);\n  if (wrapped) return wrapped;\n\n  const name = (type as any).displayName || type.name;\n\n  wrapped = function JSSBoundary(props: any) {\n    return _jsxDEV(\n      Fragment,\n      {\n        children: [\n          _jsxDEV(JSSComment, { name }, undefined, false, undefined, undefined),\n          _jsxDEV(type as any, props, undefined, false, undefined, undefined),\n        ],\n      },\n      undefined,\n      true,\n      undefined,\n      undefined\n    );\n  };\n\n  (wrapped as any).displayName = name;\n  wrapCache.set(type, wrapped);\n\n  return wrapped;\n}\n\n// Skip our own wrapper components by name\nconst SKIP_NAMES = new Set([\"JSSComment\", \"JSSBoundary\"]);\n\nfunction isUserComponent(type: any, source: any): boolean {\n  if (typeof type !== \"function\") return false;\n  const name = type.displayName || type.name;\n  if (!name || !/^[A-Z]/.test(name)) return false;\n  if (SKIP_NAMES.has(name)) return false;\n  // Use the source fileName from the JSX transform to skip node_modules\n  if (source?.fileName?.includes(\"node_modules\")) return false;\n  return true;\n}\n\nexport function jsxDEV(\n  type: any,\n  props: any,\n  key: any,\n  isStaticChildren: boolean,\n  source: any,\n  self: any\n) {\n  if (isUserComponent(type, source)) {\n    return _jsxDEV(\n      getWrapped(type) as any,\n      props,\n      key,\n      isStaticChildren,\n      source,\n      self\n    );\n  }\n\n  return _jsxDEV(type, props, key, isStaticChildren, source, self);\n}\n"]}

package/dist/jsx-runtime.d.ts

@@ -1 +1 @@
-export { jsx, jsxs, Fragment } from "react/jsx-runtime";
+export { Fragment, JSX, jsx, jsxs } from 'react/jsx-runtime';

package/dist/jsx-runtime.js

@@ -1,3 +1,3 @@
-// Production JSX runtime — straight passthrough, no component annotations.
-export { jsx, jsxs, Fragment } from "react/jsx-runtime";
+export { Fragment, jsx, jsxs } from 'react/jsx-runtime';
+//# sourceMappingURL=jsx-runtime.js.map
 //# sourceMappingURL=jsx-runtime.js.map

package/dist/jsx-runtime.js.map

@@ -1 +1 @@
-{"version":3,"file":"jsx-runtime.js","sourceRoot":"","sources":["../src/jsx-runtime.ts"],"names":[],"mappings":"AAAA,2EAA2E;AAC3E,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"jsx-runtime.js","sourcesContent":[]}

package/dist/vite-plugin-jss-debug.d.ts

@@ -11,7 +11,7 @@
  *   import jssDebug from "aidos-ui/vite-plugin-jss-debug";
  *   export default defineConfig({ plugins: [jssDebug()] });
  */
-export default function jssDebug(): ({
+declare function jssDebug(): ({
     name: string;
     config(_config: unknown, { command }: {
         command: string;
@@ -35,3 +35,5 @@ export default function jssDebug(): ({
     };
     config?: undefined;
 })[];
+
+export { jssDebug as default };

package/dist/vite-plugin-jss-debug.js

@@ -1,76 +1,59 @@
-import path from "path";
-/**
- * Vite plugin that enables JSS debug tooling:
- *
- * 1. Injects component names into toClassnames() calls so they appear as CSS classes.
- *    toClassnames(jss) → toClassnames(jss, "Card")
- *
- * 2. Configures the custom JSX dev runtime that injects <!-- ComponentName -->
- *    HTML comments at component boundaries (same approach as the Next.js setup).
- *
- * Usage in vite.config.ts:
- *   import jssDebug from "aidos-ui/vite-plugin-jss-debug";
- *   export default defineConfig({ plugins: [jssDebug()] });
- */
-export default function jssDebug() {
-    return [
-        {
-            name: "jss-debug-jsx",
-            config(_config, { command }) {
-                return {
-                    oxc: {
-                        jsx: {
-                            runtime: "automatic",
-                            development: command === "serve",
-                            importSource: "aidos-ui",
-                        },
-                    },
-                };
-            },
-        },
-        {
-            name: "jss-debug-classnames",
-            enforce: "pre",
-            transform(code, id) {
-                if (id.includes("node_modules"))
-                    return;
-                if (!id.match(/\.[jt]sx?$/))
-                    return;
-                if (!code.includes("toClassnames("))
-                    return;
-                const filename = path.basename(id, path.extname(id));
-                const name = JSON.stringify(filename);
-                const needle = "toClassnames(";
-                let result = "";
-                let i = 0;
-                while (i < code.length) {
-                    const idx = code.indexOf(needle, i);
-                    if (idx === -1) {
-                        result += code.slice(i);
-                        break;
-                    }
-                    // Copy everything up to and including "toClassnames("
-                    result += code.slice(i, idx + needle.length);
-                    i = idx + needle.length;
-                    // Track parens to find the matching closing )
-                    let depth = 1;
-                    let j = i;
-                    while (j < code.length && depth > 0) {
-                        const ch = code[j];
-                        if (ch === "(")
-                            depth++;
-                        else if (ch === ")")
-                            depth--;
-                        if (depth > 0)
-                            j++;
-                    }
-                    // Copy the original arguments, then inject the component name
-                    result += code.slice(i, j) + ", " + name;
-                    i = j;
-                }
-                return { code: result, map: null };
-            },
-        },
-    ];
+import path from 'path';
+
+// src/vite-plugin-jss-debug.ts
+function jssDebug() {
+  return [
+    {
+      name: "jss-debug-jsx",
+      config(_config, { command }) {
+        return {
+          oxc: {
+            jsx: {
+              runtime: "automatic",
+              development: command === "serve",
+              importSource: "aidos-ui"
+            }
+          }
+        };
+      }
+    },
+    {
+      name: "jss-debug-classnames",
+      enforce: "pre",
+      transform(code, id) {
+        if (id.includes("node_modules")) return;
+        if (!id.match(/\.[jt]sx?$/)) return;
+        if (!code.includes("toClassnames(")) return;
+        const filename = path.basename(id, path.extname(id));
+        const name = JSON.stringify(filename);
+        const needle = "toClassnames(";
+        let result = "";
+        let i = 0;
+        while (i < code.length) {
+          const idx = code.indexOf(needle, i);
+          if (idx === -1) {
+            result += code.slice(i);
+            break;
+          }
+          result += code.slice(i, idx + needle.length);
+          i = idx + needle.length;
+          let depth = 1;
+          let j = i;
+          while (j < code.length && depth > 0) {
+            const ch = code[j];
+            if (ch === "(") depth++;
+            else if (ch === ")") depth--;
+            if (depth > 0) j++;
+          }
+          result += code.slice(i, j) + ", " + name;
+          i = j;
+        }
+        return { code: result, map: null };
+      }
+    }
+  ];
 }
+
+export { jssDebug as default };
+//# sourceMappingURL=vite-plugin-jss-debug.js.map
 //# sourceMappingURL=vite-plugin-jss-debug.js.map

package/dist/vite-plugin-jss-debug.js.map

@@ -1 +1 @@
-{"version":3,"file":"vite-plugin-jss-debug.js","sourceRoot":"","sources":["../src/vite-plugin-jss-debug.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ;IAC9B,OAAO;QACL;YACE,IAAI,EAAE,eAAe;YACrB,MAAM,CAAC,OAAgB,EAAE,EAAE,OAAO,EAAuB;gBACvD,OAAO;oBACL,GAAG,EAAE;wBACH,GAAG,EAAE;4BACH,OAAO,EAAE,WAAW;4BACpB,WAAW,EAAE,OAAO,KAAK,OAAO;4BAChC,YAAY,EAAE,UAAU;yBACzB;qBACF;iBACF,CAAC;YACJ,CAAC;SACF;QACD;YACE,IAAI,EAAE,sBAAsB;YAC5B,OAAO,EAAE,KAAc;YAEvB,SAAS,CAAC,IAAY,EAAE,EAAU;gBAChC,IAAI,EAAE,CAAC,QAAQ,CAAC,cAAc,CAAC;oBAAE,OAAO;gBACxC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC;oBAAE,OAAO;gBACpC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC;oBAAE,OAAO;gBAE5C,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC;gBACrD,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;gBACtC,MAAM,MAAM,GAAG,eAAe,CAAC;gBAC/B,IAAI,MAAM,GAAG,EAAE,CAAC;gBAChB,IAAI,CAAC,GAAG,CAAC,CAAC;gBAEV,OAAO,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;oBACvB,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;oBACpC,IAAI,GAAG,KAAK,CAAC,CAAC,EAAE,CAAC;wBACf,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;wBACxB,MAAM;oBACR,CAAC;oBAED,sDAAsD;oBACtD,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;oBAC7C,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC;oBAExB,8CAA8C;oBAC9C,IAAI,KAAK,GAAG,CAAC,CAAC;oBACd,IAAI,CAAC,GAAG,CAAC,CAAC;oBACV,OAAO,CAAC,GAAG,IAAI,CAAC,MAAM,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;wBACpC,MAAM,EAAE,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;wBACnB,IAAI,EAAE,KAAK,GAAG;4BAAE,KAAK,EAAE,CAAC;6BACnB,IAAI,EAAE,KAAK,GAAG;4BAAE,KAAK,EAAE,CAAC;wBAC7B,IAAI,KAAK,GAAG,CAAC;4BAAE,CAAC,EAAE,CAAC;oBACrB,CAAC;oBAED,8DAA8D;oBAC9D,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,IAAI,GAAG,IAAI,CAAC;oBACzC,CAAC,GAAG,CAAC,CAAC;gBACR,CAAC;gBAED,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC;YACrC,CAAC;SACF;KACF,CAAC;AACJ,CAAC"}
+{"version":3,"sources":["../src/vite-plugin-jss-debug.ts"],"names":[],"mappings":";;;AAee,SAAR,QAAA,GAA4B;AACjC,EAAA,OAAO;AAAA,IACL;AAAA,MACE,IAAA,EAAM,eAAA;AAAA,MACN,MAAA,CAAO,OAAA,EAAkB,EAAE,OAAA,EAAQ,EAAwB;AACzD,QAAA,OAAO;AAAA,UACL,GAAA,EAAK;AAAA,YACH,GAAA,EAAK;AAAA,cACH,OAAA,EAAS,WAAA;AAAA,cACT,aAAa,OAAA,KAAY,OAAA;AAAA,cACzB,YAAA,EAAc;AAAA;AAChB;AACF,SACF;AAAA,MACF;AAAA,KACF;AAAA,IACA;AAAA,MACE,IAAA,EAAM,sBAAA;AAAA,MACN,OAAA,EAAS,KAAA;AAAA,MAET,SAAA,CAAU,MAAc,EAAA,EAAY;AAClC,QAAA,IAAI,EAAA,CAAG,QAAA,CAAS,cAAc,CAAA,EAAG;AACjC,QAAA,IAAI,CAAC,EAAA,CAAG,KAAA,CAAM,YAAY,CAAA,EAAG;AAC7B,QAAA,IAAI,CAAC,IAAA,CAAK,QAAA,CAAS,eAAe,CAAA,EAAG;AAErC,QAAA,MAAM,WAAW,IAAA,CAAK,QAAA,CAAS,IAAI,IAAA,CAAK,OAAA,CAAQ,EAAE,CAAC,CAAA;AACnD,QAAA,MAAM,IAAA,GAAO,IAAA,CAAK,SAAA,CAAU,QAAQ,CAAA;AACpC,QAAA,MAAM,MAAA,GAAS,eAAA;AACf,QAAA,IAAI,MAAA,GAAS,EAAA;AACb,QAAA,IAAI,CAAA,GAAI,CAAA;AAER,QAAA,OAAO,CAAA,GAAI,KAAK,MAAA,EAAQ;AACtB,UAAA,MAAM,GAAA,GAAM,IAAA,CAAK,OAAA,CAAQ,MAAA,EAAQ,CAAC,CAAA;AAClC,UAAA,IAAI,QAAQ,EAAA,EAAI;AACd,YAAA,MAAA,IAAU,IAAA,CAAK,MAAM,CAAC,CAAA;AACtB,YAAA;AAAA,UACF;AAGA,UAAA,MAAA,IAAU,IAAA,CAAK,KAAA,CAAM,CAAA,EAAG,GAAA,GAAM,OAAO,MAAM,CAAA;AAC3C,UAAA,CAAA,GAAI,MAAM,MAAA,CAAO,MAAA;AAGjB,UAAA,IAAI,KAAA,GAAQ,CAAA;AACZ,UAAA,IAAI,CAAA,GAAI,CAAA;AACR,UAAA,OAAO,CAAA,GAAI,IAAA,CAAK,MAAA,IAAU,KAAA,GAAQ,CAAA,EAAG;AACnC,YAAA,MAAM,EAAA,GAAK,KAAK,CAAC,CAAA;AACjB,YAAA,IAAI,OAAO,GAAA,EAAK,KAAA,EAAA;AAAA,iBAAA,IACP,OAAO,GAAA,EAAK,KAAA,EAAA;AACrB,YAAA,IAAI,QAAQ,CAAA,EAAG,CAAA,EAAA;AAAA,UACjB;AAGA,UAAA,MAAA,IAAU,IAAA,CAAK,KAAA,CAAM,CAAA,EAAG,CAAC,IAAI,IAAA,GAAO,IAAA;AACpC,UAAA,CAAA,GAAI,CAAA;AAAA,QACN;AAEA,QAAA,OAAO,EAAE,IAAA,EAAM,MAAA,EAAQ,GAAA,EAAK,IAAA,EAAK;AAAA,MACnC;AAAA;AACF,GACF;AACF","file":"vite-plugin-jss-debug.js","sourcesContent":["import path from \"node:path\";\n\n/**\n * Vite plugin that enables JSS debug tooling:\n *\n * 1. Injects component names into toClassnames() calls so they appear as CSS classes.\n *    toClassnames(jss) → toClassnames(jss, \"Card\")\n *\n * 2. Configures the custom JSX dev runtime that injects <!-- ComponentName -->\n *    HTML comments at component boundaries (same approach as the Next.js setup).\n *\n * Usage in vite.config.ts:\n *   import jssDebug from \"aidos-ui/vite-plugin-jss-debug\";\n *   export default defineConfig({ plugins: [jssDebug()] });\n */\nexport default function jssDebug() {\n  return [\n    {\n      name: \"jss-debug-jsx\",\n      config(_config: unknown, { command }: { command: string }) {\n        return {\n          oxc: {\n            jsx: {\n              runtime: \"automatic\",\n              development: command === \"serve\",\n              importSource: \"aidos-ui\",\n            },\n          },\n        };\n      },\n    },\n    {\n      name: \"jss-debug-classnames\",\n      enforce: \"pre\" as const,\n\n      transform(code: string, id: string) {\n        if (id.includes(\"node_modules\")) return;\n        if (!id.match(/\\.[jt]sx?$/)) return;\n        if (!code.includes(\"toClassnames(\")) return;\n\n        const filename = path.basename(id, path.extname(id));\n        const name = JSON.stringify(filename);\n        const needle = \"toClassnames(\";\n        let result = \"\";\n        let i = 0;\n\n        while (i < code.length) {\n          const idx = code.indexOf(needle, i);\n          if (idx === -1) {\n            result += code.slice(i);\n            break;\n          }\n\n          // Copy everything up to and including \"toClassnames(\"\n          result += code.slice(i, idx + needle.length);\n          i = idx + needle.length;\n\n          // Track parens to find the matching closing )\n          let depth = 1;\n          let j = i;\n          while (j < code.length && depth > 0) {\n            const ch = code[j];\n            if (ch === \"(\") depth++;\n            else if (ch === \")\") depth--;\n            if (depth > 0) j++;\n          }\n\n          // Copy the original arguments, then inject the component name\n          result += code.slice(i, j) + \", \" + name;\n          i = j;\n        }\n\n        return { code: result, map: null };\n      },\n    },\n  ];\n}\n"]}

package/package.json

@@ -1,45 +1,77 @@
 {
   "name": "aidos-ui",
-  "version": "4.0.4",
-  "description": "A simple UI framework",
+  "version": "4.0.5",
+  "description": "An opinionated React component library with built-in theming and CSS-in-JS",
+  "keywords": [
+    "react",
+    "components",
+    "ui",
+    "design-system",
+    "css-in-js"
+  ],
+  "homepage": "https://aidos-ui.vercel.app",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/germtb/aidos-ui.git"
+  },
+  "bugs": {
+    "url": "https://github.com/germtb/aidos-ui/issues"
+  },
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "default": "./dist/index.js"
+      "import": "./dist/index.js"
     },
     "./jsx-runtime": {
       "types": "./dist/jsx-runtime.d.ts",
-      "default": "./dist/jsx-runtime.js"
+      "import": "./dist/jsx-runtime.js"
     },
     "./jsx-dev-runtime": {
       "types": "./dist/jsx-dev-runtime.d.ts",
-      "default": "./dist/jsx-dev-runtime.js"
+      "import": "./dist/jsx-dev-runtime.js"
     },
     "./vite-plugin-jss-debug": {
       "types": "./dist/vite-plugin-jss-debug.d.ts",
-      "default": "./dist/vite-plugin-jss-debug.js"
-    }
+      "import": "./dist/vite-plugin-jss-debug.js"
+    },
+    "./package.json": "./package.json"
   },
   "scripts": {
     "embeddings": "node ./scripts/embeddings.js",
-    "dev": "next dev",
+    "dev": "next dev docs",
     "publish:patch": "node ./scripts/publish.js --patch",
-    "build": "next build",
-    "build:lib": "rimraf ./dist && tsc --project tsconfig.build.json",
-    "tsc": "tsc",
-    "tsc:watch": "tsc --watch",
-    "start": "next start",
-    "lint": "next lint"
+    "build": "next build docs",
+    "build:lib": "tsup",
+    "prepack": "npm run build:lib",
+    "tsc": "tsc --noEmit && tsc --project docs/tsconfig.json --noEmit",
+    "tsc:watch": "tsc --noEmit --watch",
+    "start": "next start docs",
+    "lint": "eslint src docs",
+    "check:package": "publint && attw --pack . --profile esm-only"
   },
   "type": "module",
   "author": "Gerard Moreno-Torres Bertran",
-  "license": "ISC",
+  "license": "MIT",
+  "engines": {
+    "node": ">=18"
+  },
+  "packageManager": "npm@11.16.0",
+  "publishConfig": {
+    "access": "public"
+  },
   "devDependencies": {
+    "@arethetypeswrong/cli": "^0.18.5",
+    "@iconify-json/fa": "^1.2.2",
+    "@iconify-json/fa-solid": "^1.2.2",
     "@mdx-js/loader": "^3.1.1",
     "@mdx-js/react": "^3.1.1",
-    "@next/mdx": "^16.1.5",
+    "@next/mdx": "^16.2.12",
     "@types/node": "^25.0.10",
     "@types/prismjs": "^1.26.5",
     "@types/react": "^19.2.9",
@@ -47,26 +79,25 @@
     "@xenova/transformers": "^2.17.2",
     "csstype": "^3.2.3",
     "dotenv": "^17.2.3",
-    "install": "^0.13.0",
-    "next": "latest",
-    "npm": "^11.8.0",
+    "eslint": "^9.39.5",
+    "eslint-config-next": "^16.2.12",
+    "next": "^16.2.12",
     "openai": "^6.16.0",
     "prismjs": "^1.30.0",
-    "process": "^0.11.10",
-    "react-dom": "latest",
+    "publint": "^0.3.22",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "remark-gfm": "^4.0.1",
     "remark-mdx": "^3.1.1",
     "remark-parse": "^11.0.0",
-    "rimraf": "^6.1.2",
+    "tsup": "^8.5.1",
     "typescript": "^5.9.3",
     "unified": "^11.0.5"
   },
   "dependencies": {
-    "@iconify-json/fa": "^1.2.2",
-    "@iconify-json/fa-solid": "^1.2.2",
-    "@iconify/react": "^6.0.2",
-    "remark-gfm": "^4.0.1"
+    "@iconify/react": "^6.0.2"
   },
   "peerDependencies": {
-    "react": "latest"
+    "react": ">=18.2.0 <20"
   }
 }

package/.prettierrc

@@ -1,4 +0,0 @@
-{
-  "tabWidth": 2,
-  "useTabs": false
-}

package/CLAUDE.md

@@ -1,72 +0,0 @@
-# CLAUDE.md
-
-This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
-
-## Build Commands
-
-```bash
-npm run build:lib    # Build the library to dist/ (rimraf + tsc)
-npm run dev          # Start Next.js dev server for documentation site
-npm run build        # Build the Next.js documentation site
-npm run lint         # Run Next.js linting
-npm run tsc          # Watch mode TypeScript compilation
-```
-
-No test framework is configured.
-
-## Architecture
-
-Aidos-UI is a zero-dependency React component library with a custom CSS-in-JS styling system.
-
-### Core Styling System (src/jss.tsx)
-
-The library uses a custom JSS (JavaScript Styles) system:
-
-- **`jss` prop**: All components accept a `jss` prop for inline styles
-- **`toClassnames(jss)`**: Converts style objects to hashed class names (e.g., `x1a2b3c`)
-- **Automatic pixel conversion**: Numeric values become pixels for dimension properties
-- **CSS variable theming**: Colors and spacing use CSS custom properties (`--primary-text`, `--spacing-m`)
-
-```tsx
-// Style objects, arrays, and conditionals are supported
-<Box jss={[baseStyles, isActive && activeStyles, { padding: 16 }]} />
-```
-
-**Responsive helpers**: `mobile()`, `tablet()`, `laptop()`, `desktop()` wrap styles in media queries.
-
-### Component Hierarchy
-
-Components follow a three-layer pattern:
-
-1. **Base layer** (`BaseView`, `BaseButton`, `BaseInput`, `BaseLink`): Minimal wrappers that apply `jss` prop
-2. **Semantic layer** (`Button`, `TextInput`, `Link`): Add themed styling and semantic props (`color`, `size`, `padding`)
-3. **Composed layer** (`IconButton`, `TextPairing`, `Sublist`): Combine lower-level components
-
-### Key Files
-
-- **src/jss.tsx**: Styling system, theme definitions, CSS variable injection
-- **src/Providers.tsx**: Root provider that wraps app with theme and context
-- **src/Interactable.tsx**: Shared styling logic for buttons/links (colors, hover states)
-- **src/DarkMode.tsx**: Dark mode context and toggle, persists to cookie
-- **src/Dialog.tsx**: Modal dialog provider with `useDialog()` hook
-- **src/useNavigation.tsx**: Arrow key navigation hook for lists
-
-### Theming
-
-Two built-in themes (`lightTheme`, `darkTheme`) define CSS variables for:
-- Colors: `--primary-text`, `--secondary-background`, `--background-button-positive`, etc.
-- Spacing: `--spacing-xs` through `--spacing-xxxl`
-- Typography: `--font-xsmall` through `--font-xxxlarge`
-- Border radii: `--border-radius-s`, `--border-radius-m`, `--border-radius-l`
-
-Dark mode is toggled via `dark-mode` class on `<body>`.
-
-### SSR Support
-
-- `JSServerStyles` component collects styles during server render
-- `isServer()` utility detects server environment
-- `useCookie()` handles hydration timing
-
-## Output
-
-The library builds to `dist/` as ES modules. Each component produces `.js`, `.js.map`, and `.d.ts` files in a flat structure.

package/dist/Badge.d.ts

@@ -1,6 +0,0 @@
-import { Color, JSS, Size } from "./jss";
-export declare function Badge({ size, color, jss, }: {
-    size?: Size;
-    color?: Color;
-    jss?: JSS;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/Badge.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { BaseView } from "./BaseView";
-import { getBackground } from "./jss";
-const sizes = {
-    xsmall: 4,
-    small: 6,
-    medium: 12,
-    large: 18,
-    xlarge: 24,
-};
-export function Badge({ size = "medium", color = "highlight", jss, }) {
-    return (_jsx(BaseView, { jss: [
-            {
-                width: sizes[size],
-                height: sizes[size],
-                borderRadius: sizes[size] / 2,
-            },
-            getBackground(color),
-            jss,
-        ] }));
-}
-//# sourceMappingURL=Badge.js.map

package/dist/Badge.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../src/Badge.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAoB,aAAa,EAAE,MAAM,OAAO,CAAC;AAExD,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,EAAE;IACV,KAAK,EAAE,EAAE;IACT,MAAM,EAAE,EAAE;CACX,CAAC;AAEF,MAAM,UAAU,KAAK,CAAC,EACpB,IAAI,GAAG,QAAQ,EACf,KAAK,GAAG,WAAW,EACnB,GAAG,GAKJ;IACC,OAAO,CACL,KAAC,QAAQ,IACP,GAAG,EAAE;YACH;gBACE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC;gBAClB,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC;gBACnB,YAAY,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;aAC9B;YACD,aAAa,CAAC,KAAK,CAAC;YACpB,GAAG;SACJ,GACD,CACH,CAAC;AACJ,CAAC"}

package/dist/BaseButton.d.ts

@@ -1,14 +0,0 @@
-import React from "react";
-import { InteractableColor } from "./Interactable";
-import { JSS, Padding } from "./jss";
-export interface BaseButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
-    jss?: JSS;
-    color: InteractableColor;
-    bare?: boolean;
-    border?: boolean;
-    className?: undefined;
-    animateInteraction?: boolean;
-    padding?: Padding;
-}
-export declare const BaseButton: React.ForwardRefExoticComponent<BaseButtonProps & React.RefAttributes<HTMLButtonElement>>;