@imfusion/web-ui 0.5.1-dev.6.gece7a7b5 → 0.6.0

package/bin/install.test.ts

@@ -0,0 +1,329 @@
+import { beforeEach, describe, expect, it } from "vitest";
+import { spawnSync } from "node:child_process";
+import {
+  existsSync,
+  lstatSync,
+  mkdirSync,
+  mkdtempSync,
+  readdirSync,
+  readFileSync,
+  statSync,
+  symlinkSync,
+  writeFileSync
+} from "node:fs";
+import { tmpdir } from "node:os";
+import { join, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+
+const installer = resolve(fileURLToPath(new URL(".", import.meta.url)), "install.js");
+
+function runInstall(cwd: string, ...args: string[]) {
+  const result = spawnSync("node", [installer, ...args], { cwd, encoding: "utf-8" });
+  expect(result.status).toBe(0);
+  return result;
+}
+
+function readSettings(cwd: string) {
+  return JSON.parse(readFileSync(join(cwd, ".claude", "settings.json"), "utf-8")) as {
+    permissions?: { allow: string[] };
+    hooks: Record<string, { hooks: { command?: string }[] }[]>;
+  };
+}
+
+let consumer: string;
+const retiredSkillNames = [
+  ["agent", "setup"],
+  ["library", "setup"]
+].map(parts => `imf-web-ui-${parts.join("-")}`);
+
+beforeEach(() => {
+  consumer = mkdtempSync(join(tmpdir(), "web-ui-install-"));
+});
+
+describe("web-ui-install", () => {
+  it("installs skills into both targets with version markers", () => {
+    runInstall(consumer, "--skills", "--target", "agents", "--target", "claude");
+
+    const installed = readdirSync(join(consumer, ".agents", "skills"));
+    expect(installed).toContain("imf-web-ui");
+    expect(installed).toContain("imf-web-ui-conventions");
+    expect(installed).toContain("imf-web-ui-setup");
+    expect(installed).toContain("imf-web-ui-audit");
+    expect(installed).toHaveLength(7);
+    for (const name of retiredSkillNames) expect(installed).not.toContain(name);
+
+    for (const name of installed) {
+      expect(existsSync(join(consumer, ".agents", "skills", name, ".imf-web-ui-skill-version.json"))).toBe(true);
+      expect(lstatSync(join(consumer, ".claude", "skills", name)).isSymbolicLink()).toBe(true);
+    }
+  });
+
+  it("removes skills that are no longer included in the bundle", () => {
+    const orphan = "imf-web-ui-retired-skill";
+    const agentsOrphan = join(consumer, ".agents", "skills", orphan);
+    mkdirSync(agentsOrphan, { recursive: true });
+    writeFileSync(join(agentsOrphan, "SKILL.md"), "# Retired skill\n");
+    const claudeOrphan = join(consumer, ".claude", "skills", orphan);
+    mkdirSync(join(consumer, ".claude", "skills"), { recursive: true });
+    symlinkSync(agentsOrphan, claudeOrphan);
+    expect(lstatSync(claudeOrphan).isSymbolicLink()).toBe(true);
+
+    const result = runInstall(consumer, "--skills", "--target", "agents", "--target", "claude");
+
+    expect(existsSync(agentsOrphan)).toBe(false);
+    expect(lstatSync(claudeOrphan, { throwIfNoEntry: false })).toBeUndefined();
+    expect(result.stdout).toContain(`Removed orphaned skill: ${orphan} (no longer in this bundle)`);
+  });
+
+  it("installs hooks into an installer-owned directory and registers them for both hosts", () => {
+    runInstall(consumer, "--hooks", "--target", "agents");
+
+    const hookDir = join(consumer, ".agents", "hooks", "imf-web-ui");
+    const scripts = readdirSync(hookDir);
+    expect(scripts).toEqual(expect.arrayContaining(["session-start.sh", "subagent-start.sh", "user-prompt-submit.sh"]));
+    for (const script of scripts) {
+      expect(statSync(join(hookDir, script)).mode & 0o100).toBeTruthy();
+    }
+
+    const settings = readSettings(consumer);
+    expect(Object.keys(settings.hooks)).toEqual(
+      expect.arrayContaining(["SessionStart", "SubagentStart", "UserPromptSubmit"])
+    );
+
+    const codexHooks = JSON.parse(readFileSync(join(consumer, ".codex", "hooks.json"), "utf-8")) as {
+      hooks: Record<string, { hooks: { command?: string }[] }[]>;
+    };
+    expect(Object.keys(codexHooks.hooks)).toEqual(Object.keys(settings.hooks));
+    const codexCommands = Object.values(codexHooks.hooks).flatMap(entries =>
+      entries.flatMap(entry => entry.hooks.map(hook => hook.command))
+    );
+    for (const command of codexCommands) {
+      expect(command).toContain("$(git rev-parse --show-toplevel)/.agents/hooks/imf-web-ui/");
+      expect(command).not.toContain("CLAUDE_PROJECT_DIR");
+    }
+
+    expect(readdirSync(join(consumer, ".agents", "skills"))).toHaveLength(7);
+  });
+
+  it("prunes a stale hook script and its registrations on refresh", () => {
+    runInstall(consumer, "--hooks", "--target", "agents");
+    const hookDir = join(consumer, ".agents", "hooks", "imf-web-ui");
+    writeFileSync(join(hookDir, "retired-hook.sh"), "#!/usr/bin/env sh\nexit 0\n");
+    const settingsFile = join(consumer, ".claude", "settings.json");
+    const settings = readSettings(consumer);
+    settings.hooks.PostToolUse = [
+      {
+        hooks: [{ type: "command", command: '"$CLAUDE_PROJECT_DIR/.agents/hooks/imf-web-ui/retired-hook.sh"' }]
+      } as never
+    ];
+    writeFileSync(settingsFile, JSON.stringify(settings));
+
+    runInstall(consumer, "--hooks", "--target", "agents");
+
+    expect(existsSync(join(hookDir, "retired-hook.sh"))).toBe(false);
+    const refreshed = readSettings(consumer);
+    expect(refreshed.hooks.PostToolUse).toBeUndefined();
+  });
+
+  it("prunes per hook, keeping consumer hooks and customized commands in the same entry", () => {
+    runInstall(consumer, "--hooks", "--target", "agents");
+    const hookDir = join(consumer, ".agents", "hooks", "imf-web-ui");
+    writeFileSync(join(hookDir, "retired-hook.sh"), "#!/usr/bin/env sh\nexit 0\n");
+    const settingsFile = join(consumer, ".claude", "settings.json");
+    const settings = readSettings(consumer);
+    const customized = '"$CLAUDE_PROJECT_DIR/.agents/hooks/imf-web-ui/session-start.sh" 2>/dev/null';
+    settings.hooks.PostToolUse = [
+      {
+        hooks: [
+          { type: "command", command: '"$CLAUDE_PROJECT_DIR/.agents/hooks/imf-web-ui/retired-hook.sh"' },
+          { type: "command", command: "npm run my-check" },
+          { type: "command", command: customized }
+        ]
+      } as never
+    ];
+    writeFileSync(settingsFile, JSON.stringify(settings));
+
+    runInstall(consumer, "--hooks", "--target", "agents");
+
+    const commands = readSettings(consumer).hooks.PostToolUse.flatMap(entry => entry.hooks.map(hook => hook.command));
+    expect(commands).toEqual(["npm run my-check", customized]);
+  });
+
+  it("keeps a consumer-adjusted codex command across re-runs, without duplicating it", () => {
+    runInstall(consumer, "--hooks", "--target", "agents");
+    const codexPath = join(consumer, ".codex", "hooks.json");
+    const adjusted = '"$(git rev-parse --show-toplevel)/frontend/.agents/hooks/imf-web-ui/session-start.sh"';
+    const codexHooks = JSON.parse(readFileSync(codexPath, "utf-8")) as {
+      hooks: Record<string, { hooks: { command?: string }[] }[]>;
+    };
+    codexHooks.hooks.SessionStart[0].hooks[0].command = adjusted;
+    writeFileSync(codexPath, JSON.stringify(codexHooks));
+
+    runInstall(consumer, "--hooks", "--target", "agents");
+
+    const refreshed = JSON.parse(readFileSync(codexPath, "utf-8")) as {
+      hooks: Record<string, { hooks: { command?: string }[] }[]>;
+    };
+    const commands = refreshed.hooks.SessionStart.flatMap(entry => entry.hooks.map(hook => hook.command));
+    expect(commands).toEqual([adjusted]);
+  });
+
+  it("merges registrations without clobbering existing settings, idempotently", () => {
+    mkdirSync(join(consumer, ".claude"), { recursive: true });
+    writeFileSync(
+      join(consumer, ".claude", "settings.json"),
+      JSON.stringify({
+        permissions: { allow: ["Bash(git *)"] },
+        hooks: { PostToolUse: [{ matcher: "Edit", hooks: [{ type: "command", command: "echo existing" }] }] }
+      })
+    );
+
+    runInstall(consumer, "--hooks", "--target", "agents");
+    runInstall(consumer, "--hooks", "--target", "agents");
+
+    const settings = readSettings(consumer);
+    expect(settings.permissions?.allow).toEqual(["Bash(git *)"]);
+    const foreign = settings.hooks.PostToolUse.flatMap(entry => entry.hooks.map(hook => hook.command));
+    expect(foreign).toContain("echo existing");
+    // the shipped registration is added exactly once across both runs
+    const commands = settings.hooks.UserPromptSubmit.flatMap(entry => entry.hooks.map(hook => hook.command));
+    expect(commands.filter(command => command?.includes("user-prompt-submit.sh"))).toHaveLength(1);
+  });
+
+  it("recognises registrations written with braced ${CLAUDE_PROJECT_DIR}", () => {
+    mkdirSync(join(consumer, ".claude"), { recursive: true });
+    writeFileSync(
+      join(consumer, ".claude", "settings.json"),
+      JSON.stringify({
+        hooks: {
+          UserPromptSubmit: [
+            {
+              hooks: [
+                {
+                  type: "command",
+                  command: '"${CLAUDE_PROJECT_DIR}/.agents/hooks/imf-web-ui/user-prompt-submit.sh"'
+                }
+              ]
+            },
+            // a foreign entry carrying no `command` at all must not throw
+            { matcher: "Bash", hooks: [{ type: "command", args: ["${CLAUDE_PROJECT_DIR}/other/gate.mjs"] }] }
+          ]
+        }
+      })
+    );
+
+    runInstall(consumer, "--hooks", "--target", "agents");
+
+    const settings = readSettings(consumer);
+    const commands = settings.hooks.UserPromptSubmit.flatMap(entry => entry.hooks.map(hook => hook.command));
+    expect(commands.filter(command => command?.includes("user-prompt-submit.sh"))).toHaveLength(1);
+    expect(commands).toContain('"${CLAUDE_PROJECT_DIR}/.agents/hooks/imf-web-ui/user-prompt-submit.sh"');
+  });
+
+  it("does not touch settings.json when every registration is already present", () => {
+    runInstall(consumer, "--hooks", "--target", "agents");
+    const settingsFile = join(consumer, ".claude", "settings.json");
+    const settings = readSettings(consumer);
+    settings.hooks.PreToolUse = [{ hooks: [{ command: "./other/gate.mjs" }] }];
+    const before = JSON.stringify(settings, null, 4) + "\n";
+    writeFileSync(settingsFile, before);
+
+    const result = runInstall(consumer, "--hooks", "--target", "agents");
+
+    expect(readFileSync(settingsFile, "utf-8")).toBe(before);
+    expect(result.stdout).toContain("Hook registrations already present");
+  });
+
+  it("upserts the fenced AGENTS.md block and leaves the rest untouched", () => {
+    const agentsPath = join(consumer, "AGENTS.md");
+    writeFileSync(
+      agentsPath,
+      "# AGENTS.md\n\nRepo-specific intro.\n\n<!-- imf-web-ui:begin stale -->\nold content\n<!-- imf-web-ui:end -->\n\nRepo-specific outro.\n"
+    );
+
+    runInstall(consumer, "--skills", "--target", "agents");
+    const updated = readFileSync(agentsPath, "utf-8");
+    expect(updated).toContain("Repo-specific intro.");
+    expect(updated).toContain("Repo-specific outro.");
+    expect(updated).not.toContain("old content");
+    expect(updated).toContain("resynced with `npx web-ui-install`");
+
+    // no fence yet → block is appended; missing AGENTS.md entirely → left alone
+    writeFileSync(agentsPath, "# AGENTS.md\n\nNo fence here.\n");
+    runInstall(consumer, "--skills", "--target", "agents");
+    const appended = readFileSync(agentsPath, "utf-8");
+    expect(appended).toContain("No fence here.");
+    expect(appended).toContain("<!-- imf-web-ui:begin");
+  });
+
+  it("ships injection hooks that exit 0 and echo their fixed one-liners", () => {
+    runInstall(consumer, "--hooks", "--target", "agents");
+    const hookDir = join(consumer, ".agents", "hooks", "imf-web-ui");
+
+    const sessionStart = spawnSync("sh", [join(hookDir, "session-start.sh")], { encoding: "utf-8" });
+    expect(sessionStart.status).toBe(0);
+    expect(sessionStart.stdout).toContain("imf-web-ui skill");
+
+    // Subagents get the same router pointer, byte for byte.
+    const subagentStart = spawnSync("sh", [join(hookDir, "subagent-start.sh")], { encoding: "utf-8" });
+    expect(subagentStart.status).toBe(0);
+    expect(subagentStart.stdout).toBe(sessionStart.stdout);
+
+    const promptSubmit = spawnSync("sh", [join(hookDir, "user-prompt-submit.sh")], { encoding: "utf-8" });
+    expect(promptSubmit.status).toBe(0);
+    expect(promptSubmit.stdout).toContain("imf-web-ui-components");
+
+    // no node_modules in the consumer → silent success
+    const staleness = spawnSync("sh", [join(hookDir, "baseline-staleness.sh")], { cwd: consumer, encoding: "utf-8" });
+    expect(staleness.status).toBe(0);
+    expect(staleness.stdout).toBe("");
+  });
+
+  it("gates the turn end only after in-session edits, and never loops", () => {
+    runInstall(consumer, "--hooks", "--target", "agents");
+    const stopHook = join(consumer, ".agents", "hooks", "imf-web-ui", "stop.sh");
+    const transcript = join(consumer, "transcript.jsonl");
+    const runStop = (input: string) => spawnSync("sh", [stopHook], { cwd: consumer, input, encoding: "utf-8" });
+
+    // outside a git repo → silent pass
+    const noGit = runStop("{}");
+    expect(noGit.status).toBe(0);
+    expect(noGit.stdout).toBe("");
+
+    spawnSync("git", ["init", "--quiet", consumer]);
+    mkdirSync(join(consumer, "src"), { recursive: true });
+    writeFileSync(join(consumer, "src", "app.ts"), "export const x = 1;\n");
+    writeFileSync(transcript, '{"type":"assistant","message":{"content":[{"type":"tool_use","name":"Write"}]}}\n');
+    const payload = JSON.stringify({ transcript_path: transcript, stop_hook_active: false });
+
+    const blocked = runStop(payload);
+    expect(blocked.status).toBe(0);
+    expect(blocked.stdout).toContain('"decision":"block"');
+    expect(blocked.stdout).toContain("web-ui stop gate:");
+
+    // re-entry after a block → silent pass
+    const reentry = runStop(JSON.stringify({ transcript_path: transcript, stop_hook_active: true }));
+    expect(reentry.status).toBe(0);
+    expect(reentry.stdout).toBe("");
+
+    // dirty tree, but this session's transcript shows no edits → silent pass
+    writeFileSync(transcript, '{"type":"user","message":{"content":"a question"}}\n');
+    const questionTurn = runStop(payload);
+    expect(questionTurn.status).toBe(0);
+    expect(questionTurn.stdout).toBe("");
+  });
+
+  it("warns from the staleness script when skill markers lag the package", () => {
+    runInstall(consumer, "--skills", "--hooks", "--target", "agents");
+    const pkgDir = join(consumer, "node_modules", "@imfusion", "web-ui");
+    mkdirSync(pkgDir, { recursive: true });
+    writeFileSync(join(pkgDir, "package.json"), JSON.stringify({ version: "99.0.0" }));
+
+    const result = spawnSync("sh", [join(consumer, ".agents", "hooks", "imf-web-ui", "baseline-staleness.sh")], {
+      cwd: consumer,
+      encoding: "utf-8"
+    });
+    expect(result.status).toBe(0);
+    expect(result.stdout).toContain("npx web-ui-install");
+  });
+});

package/dist/build/vite-css-module-names/index.d.ts

@@ -0,0 +1,20 @@
+import { Plugin } from 'vite';
+export interface ReadableCssModuleNamesOptions {
+    /** Namespace for every generated class name. Short, stable, app-scoped (`imf-ui`, `acme`). */
+    prefix: string;
+}
+/**
+ * Generates readable CSS Module class names instead of the default hash, so the DOM
+ * stays legible in devtools and browser automation. `button.module.css` yields
+ * `{prefix}-button-module-root` — `[name]` is the filename, which keeps its `.module`
+ * suffix.
+ *
+ * Register it in every tool that compiles the CSS (the app build AND Storybook). A
+ * compiler left out generates different class names for the same source file and its
+ * styles silently don't apply.
+ *
+ * Defaults to opting into Lightning CSS, which drops `css.modules` options it has no
+ * equivalent for (`localsConvention`). Set `css.transformer: "postcss"` to stay on
+ * the PostCSS pipeline.
+ */
+export declare function readableCssModuleNames({ prefix }: ReadableCssModuleNamesOptions): Plugin;

package/dist/build/vite-css-module-names.js

@@ -0,0 +1,17 @@
+//#region src/build/vite-css-module-names/index.ts
+function e(e, t) {
+	let { lightningcss: n, modules: r, transformer: i } = e.css ?? {}, a = n?.cssModules;
+	if (!(typeof a == "boolean" || r === !1) && !a?.pattern && !(typeof r == "object" && r.generateScopedName)) return i === "postcss" ? { css: { modules: { generateScopedName: t } } } : { css: {
+		transformer: "lightningcss",
+		lightningcss: { cssModules: { pattern: t } }
+	} };
+}
+function t({ prefix: t }) {
+	let n = `${t}-[name]-[local]`;
+	return {
+		name: "imf-ui:readable-css-module-names",
+		config: (t) => e(t, n)
+	};
+}
+//#endregion
+export { t as readableCssModuleNames };

package/dist/chunk-DmhlhrBa.js

@@ -0,0 +1,11 @@
+//#region \0rolldown/runtime.js
+var e = Object.defineProperty, t = (t, n) => {
+	let r = {};
+	for (var i in t) e(r, i, {
+		get: t[i],
+		enumerable: !0
+	});
+	return n || e(r, Symbol.toStringTag, { value: "Module" }), r;
+};
+//#endregion
+export { t };

package/dist/code-Blo48PGr.js

@@ -0,0 +1,136 @@
+import { t as e } from "./chunk-DmhlhrBa.js";
+import { t } from "./meta-CySnRuVp.js";
+import { Ma as n, Qt as r, Xo as i, hn as a, r as o } from "./icons-wBmF0U2x.js";
+import { cx as s } from "class-variance-authority";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { useCallback as u, useEffect as d, useRef as f, useState as p } from "react";
+//#region src/hooks/use-clipboard.ts
+function m({ timeout: e = 1500 } = {}) {
+	let [t, n] = p(!1), r = f(void 0);
+	return d(() => () => clearTimeout(r.current), []), {
+		copied: t,
+		copy: u((t) => {
+			navigator.clipboard.writeText(t).then(() => {
+				n(!0), clearTimeout(r.current), r.current = setTimeout(() => n(!1), e);
+			});
+		}, [e])
+	};
+}
+var h = {
+	block: "imf-ui-code-module-block",
+	copy: "imf-ui-code-module-copy",
+	icon: "imf-ui-code-module-icon",
+	inline: "imf-ui-code-module-inline",
+	inlineCopy: "imf-ui-code-module-inlineCopy",
+	inlineLink: "imf-ui-code-module-inlineLink",
+	language: "imf-ui-code-module-language",
+	pre: "imf-ui-code-module-pre",
+	separator: "imf-ui-code-module-separator"
+}, g = /* @__PURE__ */ e({
+	Block: () => y,
+	Inline: () => _,
+	InlineLink: () => v
+});
+function _({ className: e, copyable: t = !1, children: r, ...a }) {
+	let { copied: u, copy: d } = m(), p = f(null), g = u ? n : i;
+	return /* @__PURE__ */ l("code", {
+		...a,
+		"data-imf-ui-component": "Code.Inline",
+		className: s(h.inline, e),
+		children: [
+			/* @__PURE__ */ c("span", {
+				ref: p,
+				children: r
+			}),
+			t && /* @__PURE__ */ c("span", { className: h.separator }),
+			t && /* @__PURE__ */ c("button", {
+				type: "button",
+				className: h.inlineCopy,
+				"data-copied": u || void 0,
+				"aria-label": u ? "Copied" : "Copy",
+				onClick: () => d(p.current?.textContent ?? ""),
+				children: /* @__PURE__ */ c(o, {
+					glyph: g,
+					size: 12,
+					strokeWidth: 2,
+					"aria-hidden": !0
+				})
+			})
+		]
+	});
+}
+_.displayName = "Code.Inline";
+function v({ className: e, kind: t = "external", children: n, ...i }) {
+	let u = t === "external" ? a : r;
+	return /* @__PURE__ */ l("a", {
+		...t === "external" ? {
+			target: "_blank",
+			rel: "noreferrer"
+		} : {},
+		...i,
+		"data-imf-ui-component": "Code.InlineLink",
+		"data-kind": t,
+		className: s(h.inline, h.inlineLink, e),
+		children: [
+			n,
+			/* @__PURE__ */ c("span", { className: h.separator }),
+			/* @__PURE__ */ c("span", {
+				className: h.icon,
+				"aria-hidden": !0,
+				children: /* @__PURE__ */ c(o, {
+					glyph: u,
+					size: 12,
+					strokeWidth: 2
+				})
+			})
+		]
+	});
+}
+v.displayName = "Code.InlineLink";
+function y({ className: e, language: t, hideCopy: r = !1, children: a, ...u }) {
+	let { copied: d, copy: p } = m(), g = f(null), _ = d ? n : i;
+	return /* @__PURE__ */ l("div", {
+		"data-imf-ui-component": "Code.Block",
+		className: s(h.block, e),
+		children: [
+			t != null && /* @__PURE__ */ c("span", {
+				className: h.language,
+				children: t
+			}),
+			!r && /* @__PURE__ */ c("button", {
+				type: "button",
+				className: h.copy,
+				"data-copied": d || void 0,
+				"aria-label": d ? "Copied" : "Copy",
+				onClick: () => p(g.current?.textContent ?? ""),
+				children: /* @__PURE__ */ c(o, {
+					glyph: _,
+					size: 12,
+					strokeWidth: 2,
+					"aria-hidden": !0
+				})
+			}),
+			/* @__PURE__ */ c("pre", {
+				...u,
+				className: h.pre,
+				children: /* @__PURE__ */ c("code", {
+					ref: g,
+					children: a
+				})
+			})
+		]
+	});
+}
+y.displayName = "Code.Block";
+//#endregion
+//#region src/components/code/code.meta.ts
+var b = {
+	name: "Code",
+	category: t.display,
+	status: "stable",
+	namespace: !0,
+	description: "Displays source code — Code.Inline for a fragment in running text, Code.Block for a fenced block with an optional language label and copy button. Also called a code snippet or code block.",
+	origin: "native"
+};
+//#endregion
+export { g as a, v as i, y as n, m as o, _ as r, b as t };

package/dist/codegen/gen-icons.d.ts

@@ -0,0 +1,24 @@
+export type IconMetadata = {
+    filename: string;
+    category: string;
+    tags: string[];
+};
+export type IconCatalogRecord = {
+    name: string;
+    category: string;
+    tags: string[];
+    style: "regular" | "solid";
+};
+type IconMetadataSource = {
+    commit: string;
+    url: string;
+};
+export declare function parseIconMetadata(csv: string): IconMetadata[];
+export declare function validateIconMetadataSource(source: string): IconMetadataSource;
+export declare function buildIconCatalog(iconNames: readonly string[], metadata: readonly IconMetadata[]): IconCatalogRecord[];
+export declare function renderIconAliases(iconNames: readonly string[]): string;
+export declare function renderIconCatalogJson(records: readonly IconCatalogRecord[]): string;
+export declare function renderIconCatalog(records: readonly IconCatalogRecord[]): string;
+export declare function writeIconAliases(): void;
+export declare function writeIconCatalog(): void;
+export {};

package/dist/components/callout/callout.d.ts

@@ -19,7 +19,7 @@ declare namespace Root {
 type IconProps = React.HTMLAttributes<HTMLSpanElement>;
 /**
  * Callout.Icon — the leading status glyph. With no children it renders the
- * variant's default lucide icon; pass a custom icon as children to override.
+ * variant's default local icon; pass a custom icon as children to override.
  * `aria-hidden` (the variant is conveyed by copy, not the glyph) and inherits
  * the status colour via `currentColor`.
  */

package/dist/components/chip-link/chip-link.d.ts

@@ -11,7 +11,7 @@ type Props = React.AnchorHTMLAttributes<HTMLAnchorElement> & VariantProps<typeof
 /**
  * ChipLink — anchor styled as a Chip. Reuses Chip's shared variants so the
  * variant and appearance axes stay aligned, and auto-appends a directional icon
- * (Lucide `ArrowUpRight` for external, `ArrowRight` for internal).
+ * (local Web UI `ArrowUpRight` for external, `ArrowRight` for internal).
  */
 export declare function ChipLink({ variant, appearance, inline, kind, className, children, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/code/code.d.ts

@@ -1,19 +1,15 @@
 type InlineProps = Omit<React.HTMLAttributes<HTMLElement>, "children"> & {
-    /** The inline code, as a raw string — also the value copied when `copyable`. */
-    children: string;
+    /** Code content shown in the chip. The copy button copies its rendered text. */
+    children: React.ReactNode;
     /** Show a small copy button on the right, behind a hairline separator. @default false */
     copyable?: boolean;
-    /** Pre-rendered display content (e.g. syntax-highlighted tokens) shown in place of `children`, which stays the copied value. The code-highlight integration fills this slot. */
-    highlighted?: React.ReactNode;
 };
 /**
  * Code.Inline — an inline code fragment (a `<code>` chip) for use inside running
- * text. Dumb: styling only — syntax coloring arrives pre-rendered through the
- * `highlighted` slot (the code-highlight integration supplies it). `Typo.InlineCode`
- * renders this under the hood so inline-code chrome is defined in one place.
- * Children must be a string so an opted-in copy button has clean text to copy.
+ * text. `Typo.InlineCode` renders this under the hood so inline-code chrome is
+ * defined in one place. The copy button copies the rendered text.
  */
-export declare function Inline({ className, copyable, highlighted, children, ...props }: InlineProps): import("react/jsx-runtime").JSX.Element;
+export declare function Inline({ className, copyable, children, ...props }: InlineProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Inline {
     var displayName: string;
 }
@@ -36,24 +32,20 @@ export declare namespace InlineLink {
     var displayName: string;
 }
 type BlockProps = Omit<React.HTMLAttributes<HTMLPreElement>, "children"> & {
-    /** The code to display, as a raw string — also the value copied by the copy button. */
-    children: string;
+    /** Code content shown in the block. The copy button copies its rendered text. */
+    children: React.ReactNode;
     /** Language label shown in the corner notch. Omit to hide the notch. */
     language?: string;
     /** Hide the copy button. @default false */
     hideCopy?: boolean;
-    /** Pre-rendered display content (e.g. syntax-highlighted tokens) shown in place of `children`, which stays the copied value. The code-highlight integration fills this slot. */
-    highlighted?: React.ReactNode;
 };
 /**
  * Code.Block — a fenced code block on a flat brand surface, with an optional
  * chamfered language notch (top-left) and a copy button (top-right). The
- * surface follows the global corner-radius token when a preset opts in.
- * Dumb: styling only — syntax coloring arrives pre-rendered through the
- * `highlighted` slot (the code-highlight integration supplies it). Children
- * must be a string so the copy button has clean text to copy.
+ * surface follows the global corner-radius token when a preset opts in. The
+ * copy button copies the rendered text.
  */
-export declare function Block({ className, language, hideCopy, highlighted, children, ...props }: BlockProps): import("react/jsx-runtime").JSX.Element;
+export declare function Block({ className, language, hideCopy, children, ...props }: BlockProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Block {
     var displayName: string;
 }