@imfusion/web-ui 0.7.2-dev.10.gaae39295 → 0.7.2-dev.14.gb40820c1

package/CHANGELOG.md

@@ -4,6 +4,8 @@
 
 ### Added
 
+- Vite plugins — Nikolaus Brunner <brunner@imfusion.com>
+  - `localWebUILink` dedupes the library's peer dependencies in an app that links a local checkout.
 - Storybook — Nikolaus Brunner <brunner@imfusion.com>
   - The token drawer offers Kode Mono as a mono font.
 
@@ -16,6 +18,10 @@
   - `NavigationMenu.InlineSubmenu` spaces its rail and detail pane with one flyout padding.
 - Agent skills — Nikolaus Brunner <brunner@imfusion.com>
   - `imf-web-ui-update` measures the delta from a prerelease baseline by diffing the old package's types and styles.
+  - The component and story dev skills name the Storybook CLI command for each lookup and check, and route only pixels, DOM,
+    focus, and console checks to Chrome DevTools.
+  - `web-ui-dev-new-component` checks existing primitives before any upstream lookup, for a URL or a description, and routes
+    a partial match to `web-ui-dev-update-component`.
 
 ### Fixed
 
@@ -30,6 +36,7 @@
   - The preview stays dark while a page loads in dark mode.
 - Agent skills — Nikolaus Brunner <brunner@imfusion.com>
   - `npx web-ui install skills` formats the skill version markers with the project's Prettier.
+  - `imf-web-ui-audit` has a checklist box for every tooling section, including Vite plugins.
 
 ---
 

package/README.md

@@ -87,3 +87,35 @@ The main development skills are:
 | `/web-ui-dev-claude-design-sync`   | Update the design system in Claude Design.       |
 | `/web-ui-dev-teardown-worktree`    | Remove a finished worktree.                      |
 | `/web-ui-dev-mcp`                  | Recover one optional MCP capability.             |
+
+### Work on it from a consumer app
+
+To change the library while running an app that uses it, point the app's dependency at your checkout:
+
+```json
+"@imfusion/web-ui": "file:../web-ui"
+```
+
+Run `npm install` in the app, then keep `npm run dev:lib` running here. The package resolves to `dist/`, so the app resolves
+nothing until the first watch build has finished, and sees each later change once the rebuild has written it.
+
+npm links the checkout instead of copying it. Without help, the app then loads two copies of React, its own and the one in
+this checkout's `node_modules`, and every hook fails with "Invalid hook call". Register `localWebUILink` in the app's Vite
+config to prevent that:
+
+```ts
+import { localWebUILink } from "@imfusion/web-ui/vite";
+
+export default defineConfig({
+  plugins: [react(), localWebUILink()]
+});
+```
+
+It dedupes every peer dependency of the library, including `@imfusion/sdk` and `@imfusion/sdk-react`. For an installed
+package it does nothing, so it can stay in the config.
+
+It covers the browser in development and in the build. Server rendering, including React Router prerendering, still loads
+dependencies through Node, which picks the checkout's React. Base UI's `use-sync-external-store` dependency is CommonJS, so
+Popover, Select, and other stateful parts can still fail on the server.
+
+Change the dependency back before you commit the app.

package/dist/paths-Oi0v8x-w.js

@@ -0,0 +1,26 @@
+import { existsSync as e } from "node:fs";
+import { dirname as t, resolve as n } from "node:path";
+import { fileURLToPath as r } from "node:url";
+import { spawnSync as i } from "node:child_process";
+//#region src/cli/paths.ts
+function a(r) {
+	let i = r;
+	for (; !e(n(i, "package.json"));) {
+		let e = t(i);
+		if (e === i) throw Error(`Could not find package.json above ${r}`);
+		i = e;
+	}
+	return i;
+}
+var o = a(t(r(import.meta.url))), s = process.cwd();
+function c(r) {
+	let a = s;
+	for (; a !== t(a) && !e(n(a, "node_modules", ".bin"));) a = t(a);
+	let o = n(a, "node_modules", ".bin", "prettier");
+	e(o) && i(o, ["--write", ...r], {
+		cwd: s,
+		stdio: "ignore"
+	});
+}
+//#endregion
+export { o as n, s as r, c as t };

package/dist/vite/index.d.ts

@@ -1,2 +1,3 @@
 export { imfusionBrandAssets } from './brand-assets.ts';
+export { localWebUILink } from './local-web-ui-link.ts';
 export { readableCssModuleNames, type ReadableCssModuleNamesOptions } from './readable-css-module-names.ts';

package/dist/vite/local-web-ui-link.d.ts

@@ -0,0 +1,8 @@
+import { Plugin, UserConfig } from 'vite';
+/** Returns `undefined` for an installed package; only a checkout outside `node_modules` needs the config. */
+export declare function localWebUILinkConfig(root: string): UserConfig | undefined;
+/**
+ * Lets a consumer link a local checkout (`"@imfusion/web-ui": "file:../web-ui"`) without loading two copies of React in
+ * client dev and build. SSR is not covered. Does nothing for an installed package, so it can stay registered.
+ */
+export declare function localWebUILink(): Plugin;

package/dist/vite.js

@@ -1,33 +1,34 @@
-import { readFileSync as e, readdirSync as t } from "node:fs";
-import { dirname as n, join as r } from "node:path";
-import { fileURLToPath as i } from "node:url";
+import { n as e } from "./paths-Oi0v8x-w.js";
+import { readFileSync as t, readdirSync as n, realpathSync as r } from "node:fs";
+import { dirname as i, join as a, resolve as o, sep as s } from "node:path";
+import { fileURLToPath as c } from "node:url";
 //#region src/vite/brand-assets.ts
-var a = n(i(import.meta.resolve("@imfusion/web-ui/assets/favicon/favicon.svg"))), o = t(a).map((t) => ({
-	name: t,
-	source: e(r(a, t))
-})), s = {
+var l = i(c(import.meta.resolve("@imfusion/web-ui/assets/favicon/favicon.svg"))), u = n(l).map((e) => ({
+	name: e,
+	source: t(a(l, e))
+})), d = {
 	".ico": "image/x-icon",
 	".png": "image/png",
 	".svg": "image/svg+xml"
 };
-function c(e) {
-	return s[e.slice(e.lastIndexOf("."))] ?? "application/octet-stream";
+function f(e) {
+	return d[e.slice(e.lastIndexOf("."))] ?? "application/octet-stream";
 }
-function l() {
+function p() {
 	return {
 		name: "imf-ui:brand-assets",
 		configureServer(e) {
 			e.middlewares.use((e, t, n) => {
-				let r = o.find(({ name: t }) => e.url?.split("?")[0] === `/${t}`);
+				let r = u.find(({ name: t }) => e.url?.split("?")[0] === `/${t}`);
 				if (!r) {
 					n();
 					return;
 				}
-				t.setHeader("Content-Type", c(r.name)), t.end(r.source);
+				t.setHeader("Content-Type", f(r.name)), t.end(r.source);
 			});
 		},
 		generateBundle() {
-			for (let e of o) this.emitFile({
+			for (let e of u) this.emitFile({
 				fileName: e.name,
 				source: e.source,
 				type: "asset"
@@ -36,20 +37,34 @@ function l() {
 	};
 }
 //#endregion
+//#region src/vite/local-web-ui-link.ts
+function m(e) {
+	if (r(e).split(s).includes("node_modules")) return;
+	let n = JSON.parse(t(o(e, "package.json"), "utf-8")), i = typeof n == "object" && n ? Reflect.get(n, "peerDependencies") : {};
+	if (typeof i != "object" || !i) throw Error(`${e}/package.json has no peerDependencies`);
+	return { resolve: { dedupe: Object.keys(i) } };
+}
+function h() {
+	return {
+		name: "imf-ui:local-web-ui-link",
+		config: () => m(e)
+	};
+}
+//#endregion
 //#region src/vite/readable-css-module-names.ts
-function u(e, t) {
+function g(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 d({ prefix: e }) {
+function _({ prefix: e }) {
 	let t = `${e}-[name]-[local]`;
 	return {
 		name: "imf-ui:readable-css-module-names",
-		config: (e) => u(e, t)
+		config: (e) => g(e, t)
 	};
 }
 //#endregion
-export { l as imfusionBrandAssets, d as readableCssModuleNames };
+export { p as imfusionBrandAssets, h as localWebUILink, _ as readableCssModuleNames };

package/dist/web-ui-cli.js

@@ -1,11 +1,10 @@
 #!/usr/bin/env node
-import { chmodSync as e, cpSync as t, existsSync as n, lstatSync as r, mkdirSync as i, readFileSync as a, readdirSync as o, readlinkSync as s, realpathSync as c, rmSync as l, symlinkSync as u, writeFileSync as d } from "node:fs";
-import { dirname as f, relative as p, resolve as m } from "node:path";
-import { fileURLToPath as ee } from "node:url";
-import { Command as te, Option as ne } from "commander";
-import * as h from "@clack/prompts";
-import { spawnSync as g } from "node:child_process";
-var _ = {
+import { n as e, r as t, t as n } from "./paths-Oi0v8x-w.js";
+import { chmodSync as r, cpSync as i, existsSync as a, lstatSync as o, mkdirSync as s, readFileSync as c, readdirSync as l, readlinkSync as u, realpathSync as d, rmSync as f, symlinkSync as p, writeFileSync as m } from "node:fs";
+import { dirname as h, relative as g, resolve as _ } from "node:path";
+import { Command as ee, Option as te } from "commander";
+import * as v from "@clack/prompts";
+var y = {
 	harnesses: {
 		claude: {
 			label: "Claude Code",
@@ -25,124 +24,100 @@ var _ = {
 	skillsDir: ".agents/skills",
 	linkDir: ".claude/skills",
 	versionMarker: ".imf-web-ui-skill-version.json"
-};
-//#endregion
-//#region src/cli/paths.ts
-function v(e) {
-	let t = e;
-	for (; !n(m(t, "package.json"));) {
-		let n = f(t);
-		if (n === t) throw Error(`Could not find package.json above ${e}`);
-		t = n;
-	}
-	return t;
-}
-var y = v(f(ee(import.meta.url))), b = process.cwd();
-function x(e) {
-	let t = b;
-	for (; t !== f(t) && !n(m(t, "node_modules", ".bin"));) t = f(t);
-	let r = m(t, "node_modules", ".bin", "prettier");
-	n(r) && g(r, ["--write", ...e], {
-		cwd: b,
-		stdio: "ignore"
-	});
-}
-//#endregion
-//#region src/cli/agents-md.ts
-var re = `<!-- ${_.namespace}:begin`, S = `<!-- ${_.namespace}:end -->`, ie = m(y, _.templatesDir, "AGENTS.md"), C = m(b, "AGENTS.md");
-function w(e) {
-	let t = e.indexOf(re), n = e.indexOf(S);
-	return t === -1 || n === -1 ? null : e.slice(t, n + S.length);
+}, ne = `<!-- ${y.namespace}:begin`, b = `<!-- ${y.namespace}:end -->`, re = _(e, y.templatesDir, "AGENTS.md"), x = _(t, "AGENTS.md");
+function S(e) {
+	let t = e.indexOf(ne), n = e.indexOf(b);
+	return t === -1 || n === -1 ? null : e.slice(t, n + b.length);
 }
-function ae() {
-	if (!n(C)) return "absent";
-	let e = w(a(ie, "utf-8"));
+function ie() {
+	if (!a(x)) return "absent";
+	let e = S(c(re, "utf-8"));
 	if (!e) return "absent";
-	let t = a(C, "utf-8"), r = w(t), i = r ? t.replace(r, e) : `${t.trimEnd()}\n\n${e}\n`;
-	return i === t ? "unchanged" : (d(C, i), r ? "updated" : "added");
+	let t = c(x, "utf-8"), n = S(t), r = n ? t.replace(n, e) : `${t.trimEnd()}\n\n${e}\n`;
+	return r === t ? "unchanged" : (m(x, r), n ? "updated" : "added");
 }
 //#endregion
 //#region src/cli/skills.ts
-var T = Object.keys(_.harnesses).filter((e) => e in _.harnesses), oe = [...T, "all"];
-function E(e) {
-	return e === "all" ? T : [e];
+var C = Object.keys(y.harnesses).filter((e) => e in y.harnesses), w = [...C, "all"];
+function T(e) {
+	return e === "all" ? C : [e];
 }
-function D(e) {
-	return `./${p(b, e)}`;
+function E(e) {
+	return `./${g(t, e)}`;
 }
-var O = _.namespace, k = _.versionMarker, A = m(y, _.skillsSource), j = m(b, _.skillsDir), M = m(b, _.linkDir), N = class extends Error {}, P = JSON.parse(a(m(y, "package.json"), "utf-8"));
-if (typeof P != "object" || !P || !("version" in P) || typeof P.version != "string") throw Error(`${m(y, "package.json")} has no string "version" field`);
-var F = P.version;
-function I(e) {
-	return e === O || e.startsWith(`${O}-`);
+var D = y.namespace, O = y.versionMarker, k = _(e, y.skillsSource), A = _(t, y.skillsDir), j = _(t, y.linkDir), M = class extends Error {}, N = JSON.parse(c(_(e, "package.json"), "utf-8"));
+if (typeof N != "object" || !N || !("version" in N) || typeof N.version != "string") throw Error(`${_(e, "package.json")} has no string "version" field`);
+var P = N.version;
+function F(e) {
+	return e === D || e.startsWith(`${D}-`);
 }
-function L() {
-	return n(A) ? o(A, { withFileTypes: !0 }).filter((e) => e.isDirectory() && I(e.name)).map((e) => e.name).sort() : [];
+function I() {
+	return a(k) ? l(k, { withFileTypes: !0 }).filter((e) => e.isDirectory() && F(e.name)).map((e) => e.name).sort() : [];
 }
-function se(e) {
-	let t = m(j, e, k);
-	if (!n(t)) return null;
+function ae(e) {
+	let t = _(A, e, O);
+	if (!a(t)) return null;
 	try {
-		let e = JSON.parse(a(t, "utf-8"));
+		let e = JSON.parse(c(t, "utf-8"));
 		if (typeof e != "object" || !e) return null;
 		let n = "harnesses" in e && Array.isArray(e.harnesses) ? e.harnesses : null;
-		return n ? T.filter((e) => n.includes(e)) : null;
+		return n ? C.filter((e) => n.includes(e)) : null;
 	} catch {
 		return null;
 	}
 }
-function R(e) {
+function L(e) {
 	for (let t of e) {
-		let e = se(t);
+		let e = ae(t);
 		if (e && e.length > 0) return e;
 	}
 	return null;
 }
-function z(e, t, r) {
-	if (n(e)) for (let n of o(e).filter(I)) t.has(n) || (l(m(e, n), {
+function R(e, t, n) {
+	if (a(e)) for (let r of l(e).filter(F)) t.has(r) || (f(_(e, r), {
 		recursive: !0,
 		force: !0
-	}), h.log.info(`Removed skill: ${n} (${r})`));
+	}), v.log.info(`Removed skill: ${r} (${n})`));
 }
-function ce() {
-	return n(M) && n(j) && c(M) === c(j);
+function oe() {
+	return a(j) && a(A) && d(j) === d(A);
 }
-function le(e) {
-	let t = m(M, e), n = p(M, m(j, e)), a = r(t, { throwIfNoEntry: !1 });
-	a?.isSymbolicLink() && s(t) === n || (a && l(t, {
+function z(e) {
+	let t = _(j, e), n = g(j, _(A, e)), r = o(t, { throwIfNoEntry: !1 });
+	r?.isSymbolicLink() && u(t) === n || (r && f(t, {
 		recursive: !0,
 		force: !0
-	}), i(M, { recursive: !0 }), u(n, t));
+	}), s(j, { recursive: !0 }), p(n, t));
 }
-function ue(e, n) {
+function se(e, t) {
 	try {
-		i(j, { recursive: !0 });
+		s(A, { recursive: !0 });
 		let r = [];
-		for (let i of e) {
-			let e = m(j, i);
-			l(e, {
+		for (let n of e) {
+			let e = _(A, n);
+			f(e, {
 				recursive: !0,
 				force: !0
-			}), t(m(A, i), e, { recursive: !0 });
-			let a = m(e, k);
-			d(a, JSON.stringify({
-				version: F,
-				harnesses: n
+			}), i(_(k, n), e, { recursive: !0 });
+			let a = _(e, O);
+			m(a, JSON.stringify({
+				version: P,
+				harnesses: t
 			}, null, 2) + "\n"), r.push(a);
 		}
-		if (x(r), z(j, new Set(e), "no longer in this bundle"), h.log.success(`Skills -> ${D(j)}/${O}*`), ce()) return;
-		if (n.includes("claude")) {
-			for (let t of e) le(t);
-			z(M, new Set(e), "no longer in this bundle"), h.log.success(`Claude Code -> ${D(M)}/${O}* (symlinks -> ${D(j)})`);
-		} else z(M, /* @__PURE__ */ new Set(), "claude not selected");
+		if (n(r), R(A, new Set(e), "no longer in this bundle"), v.log.success(`Skills -> ${E(A)}/${D}*`), oe()) return;
+		if (t.includes("claude")) {
+			for (let t of e) z(t);
+			R(j, new Set(e), "no longer in this bundle"), v.log.success(`Claude Code -> ${E(j)}/${D}* (symlinks -> ${E(A)})`);
+		} else R(j, /* @__PURE__ */ new Set(), "claude not selected");
 	} catch (e) {
-		throw e instanceof Error ? new N(e.message) : e;
+		throw e instanceof Error ? new M(e.message) : e;
 	}
 }
 //#endregion
 //#region src/cli/hooks.ts
-var B = m(y, _.templatesDir), V = m(B, "hooks"), H = m(b, _.hooksDir), U = class extends Error {};
-function de(e, t) {
+var B = _(e, y.templatesDir), V = _(B, "hooks"), H = _(t, y.hooksDir), U = class extends Error {};
+function ce(e, t) {
 	if (typeof e != "object" || !e || Array.isArray(e)) throw new U(`${t} is not a JSON object.`);
 	let n = { ...e };
 	if ("hooks" in n) {
@@ -154,27 +129,27 @@ function de(e, t) {
 function W(e) {
 	let t;
 	try {
-		t = JSON.parse(a(e, "utf-8"));
+		t = JSON.parse(c(e, "utf-8"));
 	} catch {
 		throw new U(`${e} is not valid JSON.`);
 	}
-	return de(t, e);
+	return ce(t, e);
 }
-function fe() {
-	let n = o(V).filter((e) => e.endsWith(".sh"));
-	i(H, { recursive: !0 });
-	for (let r of n) {
-		let n = m(H, r);
-		t(m(V, r), n, { force: !0 }), e(n, 493);
+function le() {
+	let e = l(V).filter((e) => e.endsWith(".sh"));
+	s(H, { recursive: !0 });
+	for (let t of e) {
+		let e = _(H, t);
+		i(_(V, t), e, { force: !0 }), r(e, 493);
 	}
-	let r = o(H).filter((e) => e.endsWith(".sh") && !n.includes(e));
-	for (let e of r) l(m(H, e), { force: !0 });
+	let t = l(H).filter((t) => t.endsWith(".sh") && !e.includes(t));
+	for (let e of t) f(_(H, e), { force: !0 });
 	return {
-		installed: n,
-		removed: r
+		installed: e,
+		removed: t
 	};
 }
-var G = `${_.hooksDir}/`;
+var G = `${y.hooksDir}/`;
 function K(e) {
 	if (typeof e != "string") return null;
 	let t = e.lastIndexOf(G);
@@ -195,7 +170,7 @@ function X(e) {
 	let t = J(e);
 	return t ? t.map((e) => K(Y(e))).filter((e) => e !== null) : [];
 }
-function pe(e, t, n) {
+function ue(e, t, n) {
 	e.hooks ??= {};
 	let r = 0, i = 0, a = [];
 	for (let [r, o] of Object.entries(e.hooks)) {
@@ -228,73 +203,73 @@ function pe(e, t, n) {
 		removed: i
 	};
 }
-function me(e) {
-	let t = /* @__PURE__ */ new Map(), r = /* @__PURE__ */ new Map();
-	for (let i of T) {
-		let a = m(b, _.harnesses[i].hookSettings);
-		if (n(a) && t.set(i, W(a)), e.includes(i)) {
-			let e = m(B, _.harnesses[i].hookTemplate);
-			r.set(i, W(e).hooks ?? {});
+function de(e) {
+	let r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map();
+	for (let n of C) {
+		let o = _(t, y.harnesses[n].hookSettings);
+		if (a(o) && r.set(n, W(o)), e.includes(n)) {
+			let e = _(B, y.harnesses[n].hookTemplate);
+			i.set(n, W(e).hooks ?? {});
 		}
 	}
-	let { installed: a, removed: o } = fe();
-	h.log.success(`Agent hooks -> ${D(H)} (${String(a.length)} scripts)`), o.length > 0 && h.log.info(`Removed stale hook script(s): ${o.join(", ")} (no longer shipped)`);
-	for (let n of T) {
-		let o = e.includes(n);
-		if (!o && !t.has(n)) continue;
-		let s = m(b, _.harnesses[n].hookSettings), c = r.get(n) ?? {}, l = t.get(n) ?? {}, u = pe(l, c, o ? a : []);
-		if (u.added === 0 && u.removed === 0) {
-			o && h.log.info(`Hook registrations already present in ${D(s)}`);
+	let { installed: o, removed: c } = le();
+	v.log.success(`Agent hooks -> ${E(H)} (${String(o.length)} scripts)`), c.length > 0 && v.log.info(`Removed stale hook script(s): ${c.join(", ")} (no longer shipped)`);
+	for (let a of C) {
+		let c = e.includes(a);
+		if (!c && !r.has(a)) continue;
+		let l = _(t, y.harnesses[a].hookSettings), u = i.get(a) ?? {}, d = r.get(a) ?? {}, f = ue(d, u, c ? o : []);
+		if (f.added === 0 && f.removed === 0) {
+			c && v.log.info(`Hook registrations already present in ${E(l)}`);
 			continue;
 		}
-		i(f(s), { recursive: !0 }), d(s, JSON.stringify(l, null, 2) + "\n"), x([s]);
-		let p = [u.added > 0 && `registered ${String(u.added)}`, u.removed > 0 && `removed ${String(u.removed)} stale`].filter(Boolean);
-		h.log.success(`${p.join(", ")} hook registration(s) in ${D(s)}`);
+		s(h(l), { recursive: !0 }), m(l, JSON.stringify(d, null, 2) + "\n"), n([l]);
+		let p = [f.added > 0 && `registered ${String(f.added)}`, f.removed > 0 && `removed ${String(f.removed)} stale`].filter(Boolean);
+		v.log.success(`${p.join(", ")} hook registration(s) in ${E(l)}`);
 	}
 }
 //#endregion
 //#region src/cli/index.ts
 function Z() {
-	return new ne("--harness <harness>", "claude, codex, or all").choices(oe);
+	return new te("--harness <harness>", "claude, codex, or all").choices(w);
 }
-async function he(e, t, n) {
-	if (t) return h.log.info(`Harness from --harness flag: ${t.join(", ")}`), t;
-	let r = R(e);
-	if (r && !n) return h.log.info(`Refreshing the existing install: ${r.join(", ")} — pass --reconfigure to choose differently.`), r;
+async function fe(e, t, n) {
+	if (t) return v.log.info(`Harness from --harness flag: ${t.join(", ")}`), t;
+	let r = L(e);
+	if (r && !n) return v.log.info(`Refreshing the existing install: ${r.join(", ")} — pass --reconfigure to choose differently.`), r;
 	if (!process.stdin.isTTY) return console.error("Pass --harness=claude|codex|all — no terminal to prompt in."), process.exitCode = 1, null;
-	let i = await h.multiselect({
+	let i = await v.multiselect({
 		message: "Install into which harness (or harnesses)?",
-		options: T.map((e) => ({
+		options: C.map((e) => ({
 			value: e,
-			label: _.harnesses[e].label
+			label: y.harnesses[e].label
 		})),
 		required: !0
 	});
-	return h.isCancel(i) ? (h.cancel("Cancelled — nothing installed."), null) : i;
+	return v.isCancel(i) ? (v.cancel("Cancelled — nothing installed."), null) : i;
 }
-async function ge(e) {
-	let t = e.harness ? E(e.harness) : null, n = L();
-	if (h.intro(`@imfusion/web-ui install skills — ${String(n.length)} skills`), n.length === 0) {
-		h.log.error("No skills found. Reinstall @imfusion/web-ui and try again."), h.outro("Nothing installed."), process.exitCode = 1;
+async function pe(e) {
+	let t = e.harness ? T(e.harness) : null, n = I();
+	if (v.intro(`@imfusion/web-ui install skills — ${String(n.length)} skills`), n.length === 0) {
+		v.log.error("No skills found. Reinstall @imfusion/web-ui and try again."), v.outro("Nothing installed."), process.exitCode = 1;
 		return;
 	}
-	let r = await he(n, t, e.reconfigure === !0);
+	let r = await fe(n, t, e.reconfigure === !0);
 	if (!r) return;
-	h.log.message(`Skills in this bundle:\n${n.map((e) => `  - ${e}`).join("\n")}`);
+	v.log.message(`Skills in this bundle:\n${n.map((e) => `  - ${e}`).join("\n")}`);
 	try {
-		ue(n, r);
+		se(n, r);
 	} catch (e) {
-		if (e instanceof N) {
-			h.log.error(e.message), h.outro("Install failed."), process.exitCode = 1;
+		if (e instanceof M) {
+			v.log.error(e.message), v.outro("Install failed."), process.exitCode = 1;
 			return;
 		}
 		throw e;
 	}
-	let i = ae();
-	(i === "updated" || i === "added") && h.log.success(`Refreshed the ${_.namespace} block in ./AGENTS.md`), h.outro(`Done — ${String(n.length)} skills installed.`);
+	let i = ie();
+	(i === "updated" || i === "added") && v.log.success(`Refreshed the ${y.namespace} block in ./AGENTS.md`), v.outro(`Done — ${String(n.length)} skills installed.`);
 }
-function _e(e) {
-	let t = e.harness ? E(e.harness) : null, n = R(L());
+function me(e) {
+	let t = e.harness ? T(e.harness) : null, n = L(I());
 	if (!t && !n) {
 		console.error("No harness recorded. Pass --harness=claude|codex|all."), process.exitCode = 1;
 		return;
@@ -305,9 +280,9 @@ function _e(e) {
 		process.exitCode = 1;
 		return;
 	}
-	h.intro("@imfusion/web-ui install hooks");
+	v.intro("@imfusion/web-ui install hooks");
 	try {
-		me(r);
+		de(r);
 	} catch (e) {
 		if (e instanceof U) {
 			console.error(e.message), process.exitCode = 1;
@@ -315,12 +290,12 @@ function _e(e) {
 		}
 		throw e;
 	}
-	h.outro("Done — agent hooks installed.");
+	v.outro("Done — agent hooks installed.");
 }
-var Q = new te();
-Q.name("web-ui").description("Command-line tools for @imfusion/web-ui").version(F);
+var Q = new ee();
+Q.name("web-ui").description("Command-line tools for @imfusion/web-ui").version(P);
 var $ = Q.command("install").description("Install @imfusion/web-ui agent skills or hooks into a project");
-$.command("skills").description("Install skills for the chosen harness").addOption(Z()).option("--reconfigure", "Re-open the harness selection prompt on an existing install").action(ge), $.command("hooks").description("Install agent lifecycle hooks (requires skills already installed for the harness)").addOption(Z()).action(_e), $.action(() => {
+$.command("skills").description("Install skills for the chosen harness").addOption(Z()).option("--reconfigure", "Re-open the harness selection prompt on an existing install").action(pe), $.command("hooks").description("Install agent lifecycle hooks (requires skills already installed for the harness)").addOption(Z()).action(me), $.action(() => {
 	$.help();
 }), Q.action(() => {
 	Q.help();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@imfusion/web-ui",
-  "version": "0.7.2-dev.10.gaae39295",
+  "version": "0.7.2-dev.14.gb40820c1",
   "description": "The official Web UI component library for ImFusion web apps",
   "author": "ImFusion GmbH",
   "homepage": "https://imfusion.com",

package/src/llms/skills/imf-web-ui-conventions/templates/AUDIT_CHECKLIST.md

@@ -101,10 +101,9 @@ sections one to one — change a topic's sections and this file follows in the s
 - [ ] Devtools
 - [ ] Docs over memory
 - [ ] Prettier
-- [ ] ESLint
-- [ ] tsconfig
-- [ ] Staged files
-- [ ] CSS class names
+- [ ] ESLint and TypeScript
+- [ ] Pre-commit checks
+- [ ] Vite plugins
 
 ## npm project — `npm-project`
 

package/src/llms/skills/imf-web-ui-conventions/topics/tooling.md

@@ -88,3 +88,6 @@ export default defineConfig({
 `imfusionBrandAssets` serves the complete favicon set during development and emits it at stable root URLs during builds.
 Register `readableCssModuleNames` in every compiler that processes the app's CSS, including development, Storybook, and
 production. A compiler left out produces different class names and styles that appear to work only in some environments.
+
+`localWebUILink` dedupes the library's peer dependencies when `@imfusion/web-ui` is linked from a local checkout
+(`file:../web-ui`), so the app loads one React. It does nothing for an installed package and does not cover server rendering.