cortena-ui 1.3.0 → 1.4.0

package/dist/lib/cn.d.ts

@@ -0,0 +1,10 @@
+"use client";
+import { ClassValue } from "clsx";
+//#region src/lib/cn.d.ts
+/**
+ * Merge class names the shadcn way: clsx for conditionals, tailwind-merge so a
+ * consumer's `className` wins over a component's default for the same utility.
+ */
+export declare function cn(...inputs: ClassValue[]): string;
+//#endregion
+//# sourceMappingURL=cn.d.ts.map

package/dist/lib/cn.js

@@ -0,0 +1,15 @@
+"use client";
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+//#region src/lib/cn.ts
+/**
+* Merge class names the shadcn way: clsx for conditionals, tailwind-merge so a
+* consumer's `className` wins over a component's default for the same utility.
+*/
+function cn(...inputs) {
+	return twMerge(clsx(inputs));
+}
+//#endregion
+export { cn };
+
+//# sourceMappingURL=cn.js.map

package/dist/lib/cn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cn.js","names":[],"sources":["../../src/lib/cn.ts"],"sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names the shadcn way: clsx for conditionals, tailwind-merge so a\n * consumer's `className` wins over a component's default for the same utility.\n */\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":";;;;;;;;AAOA,SAAgB,GAAG,GAAG,QAA8B;CAClD,OAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B"}

package/dist/lib/render.d.ts

@@ -0,0 +1,23 @@
+"use client";
+import * as React from "react";
+//#region src/lib/render.d.ts
+/**
+ * The `render` prop for the components that are plain markup rather than Base
+ * UI primitives (Card, SectionCard, ButtonLink, BreadcrumbLink).
+ *
+ * Base UI parts take their own `render` and need nothing from here. The rest
+ * are a `<div>` or an `<a>` this package writes itself, and a consumer
+ * sometimes needs a different element under the same styling: a Card that is
+ * the page's `<aside>` landmark, or a link that is the router's `<Link>`.
+ * Passing an element rather than a component keeps the call site readable and
+ * lets the caller set props on it (`render={<Link to="/x" />}`).
+ *
+ * `props` wins over the passed element's own props, so the `className` and
+ * handlers a component computed are not silently dropped, while the element's
+ * own props (`href`, `to`, `aria-labelledby`) come through untouched. What a
+ * component lets a *caller* override is decided by the order it builds `props`
+ * in, not here. Children are `children`, falling back to the element's.
+ */
+export type RenderProp = React.ReactElement<Record<string, unknown>>;
+//#endregion
+//# sourceMappingURL=render.d.ts.map

package/dist/lib/render.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+//#region src/lib/render.tsx
+function renderWith(render, props, children, Fallback) {
+	if (!render) return /* @__PURE__ */ jsx(Fallback, {
+		...props,
+		children
+	});
+	const Element = render.type;
+	const given = render.props;
+	return /* @__PURE__ */ jsx(Element, {
+		...render.props,
+		...props,
+		children: children ?? given.children
+	});
+}
+//#endregion
+export { renderWith };
+
+//# sourceMappingURL=render.js.map

package/dist/lib/render.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.js","names":["Element"],"sources":["../../src/lib/render.tsx"],"sourcesContent":["import type * as React from \"react\";\n\n/**\n * The `render` prop for the components that are plain markup rather than Base\n * UI primitives (Card, SectionCard, ButtonLink, BreadcrumbLink).\n *\n * Base UI parts take their own `render` and need nothing from here. The rest\n * are a `<div>` or an `<a>` this package writes itself, and a consumer\n * sometimes needs a different element under the same styling: a Card that is\n * the page's `<aside>` landmark, or a link that is the router's `<Link>`.\n * Passing an element rather than a component keeps the call site readable and\n * lets the caller set props on it (`render={<Link to=\"/x\" />}`).\n *\n * `props` wins over the passed element's own props, so the `className` and\n * handlers a component computed are not silently dropped, while the element's\n * own props (`href`, `to`, `aria-labelledby`) come through untouched. What a\n * component lets a *caller* override is decided by the order it builds `props`\n * in, not here. Children are `children`, falling back to the element's.\n */\nexport type RenderProp = React.ReactElement<Record<string, unknown>>;\n\nexport function renderWith(\n  render: RenderProp | undefined,\n  props: Record<string, unknown>,\n  children: React.ReactNode,\n  Fallback: React.ElementType,\n): React.ReactElement {\n  if (!render) {\n    const Element = Fallback;\n    return <Element {...props}>{children}</Element>;\n  }\n  const Element = render.type as React.ElementType;\n  const given = render.props as { children?: React.ReactNode };\n  return (\n    <Element {...(render.props as Record<string, unknown>)} {...props}>\n      {children ?? given.children}\n    </Element>\n  );\n}\n"],"mappings":";;;AAqBA,SAAgB,WACd,QACA,OACA,UACA,UACoB;CACpB,IAAI,CAAC,QAEH,OAAO,oBAACA,UAAD;EAAS,GAAI;EAAQ;CAAkB,CAAA;CAEhD,MAAM,UAAU,OAAO;CACvB,MAAM,QAAQ,OAAO;CACrB,OACE,oBAAC,SAAD;EAAS,GAAK,OAAO;EAAmC,GAAI;EACzD,UAAA,YAAY,MAAM;CACZ,CAAA;AAEb"}

package/dist/lib/shakeable.js

@@ -0,0 +1,39 @@
+"use client";
+//#region src/lib/shakeable.ts
+/**
+* Evaluates `build` immediately and returns its value.
+*
+* A pass-through with exactly one job: to let a consumer's bundler delete what
+* it wraps.
+*
+* The package is one ESM module tree with no side effects, so a bundler is free
+* to drop anything an app does not reach. It can only do that for statements it
+* can prove are safe to skip, and a top-level call it cannot see inside —
+* `tableFeatures({ … })`, a `z.enum(...).describe(...)` chain, `Object.freeze`
+* over a spread — is never provably safe. The statement is kept, and with it
+* every module it can reach. That is how `import { Button } from "cortena-ui"`
+* came to pull recharts, nivo, exceljs, dnd-kit, react-markdown, cmdk and
+* react-day-picker into an app that renders one button: 2,479 kB of it.
+*
+* Wrapped in a thunk the same work is no longer a top-level expression, and the
+* `@__PURE__` annotation each call site carries tells the bundler the call may
+* be dropped when its result is unused. Runtime behaviour is unchanged — the
+* thunk runs on the line it is written — so nothing is deferred, lazy or
+* asynchronous. Only the bundler sees a difference.
+*
+* Use it for a module-scope constant built by a call. Prefer a bare
+* `/* @__PURE__ *\/` annotation where the call's arguments are literals
+* (`cva(...)`, `cn(...)`, `React.createContext(...)`); the thunk is for the
+* cases where the arguments themselves contain calls, because a bundler
+* evaluates arguments even when the call around them is annotated pure.
+*
+* `test/bundle-probe.test.mjs` measures a real consumer bundle, which is what
+* stops any of this being quietly undone.
+*/
+function shakeable(build) {
+	return build();
+}
+//#endregion
+export { shakeable };
+
+//# sourceMappingURL=shakeable.js.map

package/dist/lib/shakeable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shakeable.js","names":[],"sources":["../../src/lib/shakeable.ts"],"sourcesContent":["/**\n * Evaluates `build` immediately and returns its value.\n *\n * A pass-through with exactly one job: to let a consumer's bundler delete what\n * it wraps.\n *\n * The package is one ESM module tree with no side effects, so a bundler is free\n * to drop anything an app does not reach. It can only do that for statements it\n * can prove are safe to skip, and a top-level call it cannot see inside —\n * `tableFeatures({ … })`, a `z.enum(...).describe(...)` chain, `Object.freeze`\n * over a spread — is never provably safe. The statement is kept, and with it\n * every module it can reach. That is how `import { Button } from \"cortena-ui\"`\n * came to pull recharts, nivo, exceljs, dnd-kit, react-markdown, cmdk and\n * react-day-picker into an app that renders one button: 2,479 kB of it.\n *\n * Wrapped in a thunk the same work is no longer a top-level expression, and the\n * `@__PURE__` annotation each call site carries tells the bundler the call may\n * be dropped when its result is unused. Runtime behaviour is unchanged — the\n * thunk runs on the line it is written — so nothing is deferred, lazy or\n * asynchronous. Only the bundler sees a difference.\n *\n * Use it for a module-scope constant built by a call. Prefer a bare\n * `/* @__PURE__ *\\/` annotation where the call's arguments are literals\n * (`cva(...)`, `cn(...)`, `React.createContext(...)`); the thunk is for the\n * cases where the arguments themselves contain calls, because a bundler\n * evaluates arguments even when the call around them is annotated pure.\n *\n * `test/bundle-probe.test.mjs` measures a real consumer bundle, which is what\n * stops any of this being quietly undone.\n */\nexport function shakeable<T>(build: () => T): T {\n  return build();\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,SAAgB,UAAa,OAAmB;CAC9C,OAAO,MAAM;AACf"}

package/dist/markdown.d.ts

@@ -0,0 +1,3 @@
+"use client";
+import { CodeRendererProps, Markdown, MarkdownComponents as Components, MarkdownProps, markdownSanitizeSchema } from "./components/markdown.js";
+export { type CodeRendererProps, Markdown, type Components as MarkdownComponents, type MarkdownProps, markdownSanitizeSchema };

package/dist/markdown.js

@@ -0,0 +1,3 @@
+"use client";
+import { Markdown, markdownSanitizeSchema } from "./components/markdown.js";
+export { Markdown, markdownSanitizeSchema };

package/dist/sortable-list.d.ts

@@ -0,0 +1,3 @@
+"use client";
+import { SortableHandle, SortableHandleProps, SortableList, SortableListProps, SortableRenderState, SortableReorderDetails, arrayMove } from "./components/sortable-list.js";
+export { SortableHandle, type SortableHandleProps, SortableList, type SortableListProps, type SortableRenderState, type SortableReorderDetails, arrayMove };

package/dist/sortable-list.js

@@ -0,0 +1,3 @@
+"use client";
+import { SortableHandle, SortableList, arrayMove } from "./components/sortable-list.js";
+export { SortableHandle, SortableList, arrayMove };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cortena-ui",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "Cortena UI — the shared React component library for cortenaweb and every Cortena extension. shadcn over Base UI, styled entirely from cortena-design tokens.",
   "license": "UNLICENSED",
   "repository": {
@@ -10,7 +10,7 @@
   },
   "type": "module",
   "sideEffects": [
-    "*.css"
+    "**/*.css"
   ],
   "engines": {
     "node": ">=22"
@@ -25,6 +25,34 @@
       "types": "./dist/index.d.ts",
       "default": "./dist/index.js"
     },
+    "./core": {
+      "types": "./dist/core.d.ts",
+      "default": "./dist/core.js"
+    },
+    "./form": {
+      "types": "./dist/form.d.ts",
+      "default": "./dist/form.js"
+    },
+    "./data-table": {
+      "types": "./dist/data-table.d.ts",
+      "default": "./dist/data-table.js"
+    },
+    "./chart": {
+      "types": "./dist/chart.d.ts",
+      "default": "./dist/chart.js"
+    },
+    "./markdown": {
+      "types": "./dist/markdown.d.ts",
+      "default": "./dist/markdown.js"
+    },
+    "./a2ui": {
+      "types": "./dist/a2ui.d.ts",
+      "default": "./dist/a2ui.js"
+    },
+    "./sortable-list": {
+      "types": "./dist/sortable-list.d.ts",
+      "default": "./dist/sortable-list.js"
+    },
     "./styles.css": "./src/styles/index.css",
     "./package.json": "./package.json"
   },
@@ -32,18 +60,20 @@
     "build": "tsdown",
     "check": "tsc --noEmit",
     "lint:design": "node ../../lint/cli.mjs --exempt chart-import src",
-    "test": "vitest run",
+    "test": "vitest run && vitest run --config vitest.bundle.config.ts",
     "guide": "vite --config guide/vite.config.ts",
     "guide:build": "vite build --config guide/vite.config.ts",
     "a2ui:catalogue": "node scripts/a2ui-catalogue.mjs",
-    "prepack": "pnpm build"
+    "prepack": "pnpm build",
+    "test:bundle": "vitest run --config vitest.bundle.config.ts",
+    "bundle:probe": "node scripts/bundle-probe.mjs"
   },
   "peerDependencies": {
+    "@tanstack/react-query": "^5.0.0",
     "cortena-design": ">=3.2.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "zod": "^3.25.0 || ^4.0.0",
-    "@tanstack/react-query": "^5.0.0"
+    "zod": "^3.25.0 || ^4.0.0"
   },
   "dependencies": {
     "@base-ui/react": "^1.8.0",
@@ -89,6 +119,7 @@
     "playwright": "^1.63.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
+    "rehype-raw": "^7.0.0",
     "tailwindcss": "^4.3.3",
     "tsdown": "^0.23.0",
     "typescript": "^5.9.0",
@@ -99,13 +130,5 @@
   },
   "publishConfig": {
     "access": "public"
-  },
-  "peerDependenciesMeta": {
-    "zod": {
-      "optional": true
-    },
-    "@tanstack/react-query": {
-      "optional": true
-    }
   }
 }

package/src/a2ui/catalogue.ts

@@ -25,6 +25,7 @@
  */
 
 import { z } from "zod";
+import { shakeable } from "@/lib/shakeable";
 import type { A2UIComponentSpec } from "./message";
 import * as views from "./views";
 import type { A2UIView } from "./views";
@@ -74,50 +75,75 @@ function entry<P>(definition: A2UICatalogueEntry<P>): A2UICatalogueEntry<never>
  * bare `{ name, context }`, or just the name as a string; the renderer
  * normalises all three to this before validation.
  */
-const Action = z
-  .object({
-    name: z.string().describe("Event name sent back to the agent."),
-    context: z
-      .record(z.string(), z.unknown())
-      .optional()
-      .describe("Extra values merged into the action payload."),
+const Action = /* @__PURE__ */ shakeable(() =>
+  z
+    .object({
+      name: z.string().describe("Event name sent back to the agent."),
+      context: z
+        .record(z.string(), z.unknown())
+        .optional()
+        .describe("Extra values merged into the action payload."),
+    })
+    .describe("An action reported to the agent when the user interacts.")
+);
+
+const Option = /* @__PURE__ */ shakeable(() =>
+  z.object({
+    value: z.string().describe("Value written to the data model."),
+    label: z.string().optional().describe("Text shown to the user; defaults to the value."),
+    disabled: z.boolean().optional(),
   })
-  .describe("An action reported to the agent when the user interacts.");
-
-const Option = z.object({
-  value: z.string().describe("Value written to the data model."),
-  label: z.string().optional().describe("Text shown to the user; defaults to the value."),
-  disabled: z.boolean().optional(),
-});
-
-const gap = z
-  .union([z.literal(0), z.literal(1), z.literal(2), z.literal(3), z.literal(4), z.literal(6), z.literal(8)])
-  .describe("Spacing step between children.");
-
-const padding = z
-  .union([z.literal(0), z.literal(1), z.literal(2), z.literal(3), z.literal(4), z.literal(6), z.literal(8)])
-  .describe("Inner padding step.");
-
-const alignment = z
-  .enum(["start", "center", "end", "stretch", "baseline"])
-  .describe("Cross-axis alignment.");
-
-const justification = z
-  .enum(["start", "center", "end", "between"])
-  .describe("Main-axis distribution.");
-
-const fieldChrome = {
+);
+
+const gap = /* @__PURE__ */ shakeable(() =>
+  z
+    .union([z.literal(0), z.literal(1), z.literal(2), z.literal(3), z.literal(4), z.literal(6), z.literal(8)])
+    .describe("Spacing step between children.")
+);
+
+const padding = /* @__PURE__ */ shakeable(() =>
+  z
+    .union([z.literal(0), z.literal(1), z.literal(2), z.literal(3), z.literal(4), z.literal(6), z.literal(8)])
+    .describe("Inner padding step.")
+);
+
+const alignment = /* @__PURE__ */ shakeable(() =>
+  z
+    .enum(["start", "center", "end", "stretch", "baseline"])
+    .describe("Cross-axis alignment.")
+);
+
+const justification = /* @__PURE__ */ shakeable(() =>
+  z
+    .enum(["start", "center", "end", "between"])
+    .describe("Main-axis distribution.")
+);
+
+const fieldChrome = /* @__PURE__ */ shakeable(() => ({
   label: z.string().optional().describe("Field label."),
   description: z.string().optional().describe("Helper text under the control."),
   error: z.string().optional().describe("Validation message; also marks the field invalid."),
   disabled: z.boolean().optional(),
-};
+}));
 
-const buttonVariant = z
-  .enum(["primary", "secondary", "outline", "ghost", "soft", "destructive", "link"])
-  .describe("Visual weight.");
+const buttonVariant = /* @__PURE__ */ shakeable(() =>
+  z
+    .enum(["primary", "secondary", "outline", "ghost", "soft", "destructive", "link"])
+    .describe("Visual weight.")
+);
 
-const buttonSize = z.enum(["sm", "md", "lg"]).describe("Control size.");
+const buttonSize = /* @__PURE__ */ shakeable(() =>
+  z.enum(["sm", "md", "lg"]).describe("Control size.")
+);
+
+/**
+ * Root-relative means one slash and then a path. `//evil.example/x` is
+ * protocol-relative — the browser resolves it against the page's scheme and
+ * goes off-origin — and `/\evil.example` is the same trick, because browsers
+ * treat a backslash after the leading slash as a second slash.
+ */
+const rootRelative = (value: string) =>
+  value.startsWith("/") && value[1] !== "/" && value[1] !== "\\";
 
 /**
  * A URL an agent may point at.
@@ -126,40 +152,46 @@ const buttonSize = z.enum(["sm", "md", "lg"]).describe("Control size.");
  * friends never reach the DOM because they never pass validation, so the
  * component gets an error card instead.
  */
-const httpUrl = z
-  .string()
-  .refine(
-    (value) => /^https?:\/\//i.test(value) || value.startsWith("/") || value.startsWith("#"),
-    "Must be an http(s), root-relative or fragment URL.",
-  )
-  .describe("Destination URL (http, https, root-relative or fragment).");
-
-const imageUrl = z
-  .string()
-  .refine(
-    (value) => /^https?:\/\//i.test(value) || /^data:image\//i.test(value) || value.startsWith("/"),
-    "Must be an http(s), root-relative or data:image URL.",
-  )
-  .describe("Image URL (http, https, root-relative or data:image).");
+const httpUrl = /* @__PURE__ */ shakeable(() =>
+  z
+    .string()
+    .refine(
+      (value) => /^https?:\/\//i.test(value) || rootRelative(value) || value.startsWith("#"),
+      "Must be an http(s), root-relative or fragment URL.",
+    )
+    .describe("Destination URL (http, https, root-relative or fragment).")
+);
+
+const imageUrl = /* @__PURE__ */ shakeable(() =>
+  z
+    .string()
+    .refine(
+      (value) => /^https?:\/\//i.test(value) || /^data:image\//i.test(value) || rootRelative(value),
+      "Must be an http(s), root-relative or data:image URL.",
+    )
+    .describe("Image URL (http, https, root-relative or data:image).")
+);
 
 /** Every chart type the Chart composite draws, Recharts and Nivo alike. */
-const chartType = z
-  .enum([
-    "bar",
-    "line",
-    "area",
-    "pie",
-    "donut",
-    "scatter",
-    "scatterplot",
-    "radar",
-    "funnel",
-    "heatmap",
-    "calendar",
-    "treemap",
-    "sunburst",
-  ])
-  .describe("Chart type; the package picks Recharts or Nivo for it.");
+const chartType = /* @__PURE__ */ shakeable(() =>
+  z
+    .enum([
+      "bar",
+      "line",
+      "area",
+      "pie",
+      "donut",
+      "scatter",
+      "scatterplot",
+      "radar",
+      "funnel",
+      "heatmap",
+      "calendar",
+      "treemap",
+      "sunburst",
+    ])
+    .describe("Chart type; the package picks Recharts or Nivo for it.")
+);
 
 /**
  * A table's rows, or a handle to them.
@@ -169,26 +201,29 @@ const chartType = z
  * it through `resolveDataSource`, so search, sort and paging stay on the backend
  * and a large result never travels through the model.
  */
-const tableSource = z
-  .union([
-    z.object({
-      kind: z.literal("client"),
-      rows: z.array(z.record(z.string(), z.unknown())).describe("The rows, inline."),
-    }),
-    z.object({
-      kind: z.literal("server"),
-      sourceId: z
-        .string()
-        .describe("Handle obtained from a tool; the host resolves it to a server source."),
-    }),
-  ])
-  .describe("Where the table's rows come from.");
+const tableSource = /* @__PURE__ */ shakeable(() =>
+  z
+    .union([
+      z.object({
+        kind: z.literal("client"),
+        rows: z.array(z.record(z.string(), z.unknown())).describe("The rows, inline."),
+      }),
+      z.object({
+        kind: z.literal("server"),
+        sourceId: z
+          .string()
+          .describe("Handle obtained from a tool; the host resolves it to a server source."),
+      }),
+    ])
+    .describe("Where the table's rows come from.")
+);
+
 
 /* ------------------------------------------------------------------ */
 /* The catalogue                                                       */
 /* ------------------------------------------------------------------ */
 
-const layout = {
+const layout = /* @__PURE__ */ shakeable(() => ({
   Column: entry<views.ColumnProps>({
     name: "Column",
     group: "layout",
@@ -295,9 +330,9 @@ const layout = {
     example: { components: [{ id: "spacer", component: "Spacer", size: 4 }] },
     view: views.SpacerView,
   }),
-};
+}));
 
-const text = {
+const text = /* @__PURE__ */ shakeable(() => ({
   Text: entry<views.TextProps>({
     name: "Text",
     group: "text",
@@ -347,9 +382,9 @@ const text = {
     },
     view: views.MarkdownView,
   }),
-};
+}));
 
-const input = {
+const input = /* @__PURE__ */ shakeable(() => ({
   TextField: entry<views.TextFieldProps>({
     name: "TextField",
     group: "input",
@@ -620,9 +655,9 @@ const input = {
     },
     view: views.ButtonLinkView,
   }),
-};
+}));
 
-const feedback = {
+const feedback = /* @__PURE__ */ shakeable(() => ({
   Badge: entry<views.BadgeViewProps>({
     name: "Badge",
     group: "feedback",
@@ -736,9 +771,9 @@ const feedback = {
     },
     view: views.EmptyStateView,
   }),
-};
+}));
 
-const data = {
+const data = /* @__PURE__ */ shakeable(() => ({
   DataTable: entry<views.DataTableViewProps>({
     name: "DataTable",
     group: "data",
@@ -835,9 +870,9 @@ const data = {
     },
     view: views.ChartView,
   }),
-};
+}));
 
-const other = {
+const other = /* @__PURE__ */ shakeable(() => ({
   Tabs: entry<views.TabsViewProps>({
     name: "Tabs",
     group: "layout",
@@ -923,7 +958,7 @@ const other = {
     },
     view: views.LinkView,
   }),
-};
+}));
 
 /**
  * The catalogue an agent draws from, and the renderer's default.
@@ -932,14 +967,16 @@ const other = {
  * with components the prompt does not describe: an agent can only usefully
  * emit what `catalogue-doc.ts` told it about.
  */
-export const defaultCatalogue: A2UICatalogue = Object.freeze({
-  ...layout,
-  ...text,
-  ...input,
-  ...feedback,
-  ...data,
-  ...other,
-});
+export const defaultCatalogue: A2UICatalogue = /* @__PURE__ */ shakeable(() =>
+  Object.freeze({
+    ...layout,
+    ...text,
+    ...input,
+    ...feedback,
+    ...data,
+    ...other,
+  }),
+);
 
 /** Catalogue id an agent may echo in `createSurface.catalogId`. */
 export const A2UI_CATALOGUE_ID = "https://cortena.ai/a2ui/catalogues/cortena-ui/v1.json";

package/src/a2ui/views.tsx

@@ -25,8 +25,11 @@ import { Badge } from "@/components/badge";
 import { Button } from "@/components/button";
 import { ButtonLink } from "@/components/button-link";
 import { Card, CardContent } from "@/components/card";
-import { Chart } from "@/components/chart";
-import type { ChartDataFor, ChartType } from "@/components/chart";
+// Straight at the composite, not at `@/components/chart`: the chart module's
+// index re-exports the raw Recharts primitives, and reaching the catalogue
+// through it puts them in A2UI's static graph for nothing.
+import { Chart } from "@/components/chart/chart";
+import type { ChartDataFor, ChartType } from "@/components/chart/types";
 import { Checkbox } from "@/components/checkbox";
 import { DataTable } from "@/components/data-table";
 import type { DataSource, DataTableColumnDef } from "@/components/data-table";

package/src/components/alert.tsx

@@ -15,7 +15,7 @@ import { cn } from "@/lib/cn";
 const DESTRUCTIVE_ALERT =
   "bg-[var(--ds-destructive-soft)] border-[var(--ds-destructive)]/35 [&_[data-slot=alert-icon]]:text-[color:var(--ds-destructive)]";
 
-const alertVariants = cva(
+const alertVariants = /* @__PURE__ */ cva(
   [
     "flex gap-3 rounded-[var(--ds-radius-md)] border px-3.5 py-3",
     "text-[length:var(--ds-text-caption-lg)] leading-[var(--ds-text-caption-lg--line-height)]",

package/src/components/badge.tsx

@@ -12,7 +12,7 @@ import { cn } from "@/lib/cn";
  */
 const DESTRUCTIVE_BADGE = "bg-[var(--ds-destructive-soft)] text-[color:var(--ds-destructive)]";
 
-const badgeVariants = cva(
+const badgeVariants = /* @__PURE__ */ cva(
   [
     "inline-flex items-center gap-1.5 px-1.5 py-0.5 whitespace-nowrap",
     "rounded-[var(--ds-radius-sm)]",

package/src/components/button.tsx

@@ -15,7 +15,7 @@ import { cn } from "@/lib/cn";
  * Radix users: `asChild` is gone. Pass `render={<a href=... />}` to change the
  * rendered element, which is Base UI's equivalent.
  */
-const buttonVariants = cva(
+const buttonVariants = /* @__PURE__ */ cva(
   [
     "inline-flex shrink-0 select-none items-center justify-center gap-2 whitespace-nowrap",
     "font-medium",