@imfusion/web-ui 0.8.1-dev.2.g74f81c31 → 0.8.1-dev.20.g50b02289

package/dist/tabs-9d4oaDwZ.js

@@ -0,0 +1,295 @@
+import { t as e } from "./chunk-DmhlhrBa.js";
+import { l as t, u as n } from "./slider-gyIYWSy3.js";
+import { cva as r } from "class-variance-authority";
+import { jsx as i } from "react/jsx-runtime";
+import { Children as a, useCallback as o } from "react";
+import { Switch as s } from "@base-ui/react/switch";
+import { Toggle as c } from "@base-ui/react/toggle";
+import { ToggleGroup as l } from "@base-ui/react/toggle-group";
+import { Tabs as u } from "@base-ui/react/tabs";
+var d = {
+	root: "imf-ui-switch-module-root",
+	thumb: "imf-ui-switch-module-thumb"
+}, f = /* @__PURE__ */ e({
+	Root: () => h,
+	Thumb: () => g
+}), p = r(d.root), m = r(d.thumb);
+function h(e) {
+	return /* @__PURE__ */ i(s.Root, {
+		...e,
+		"data-imf-ui-component": "Switch.Root",
+		className: (n) => p({ className: t(e.className, n) })
+	});
+}
+h.displayName = "Switch.Root";
+function g(e) {
+	return /* @__PURE__ */ i(s.Thumb, {
+		...e,
+		"data-imf-ui-component": "Switch.Thumb",
+		className: (n) => m({ className: t(e.className, n) })
+	});
+}
+g.displayName = "Switch.Thumb";
+//#endregion
+//#region src/components/toggle/toggle.tsx
+var _ = r({ root: "imf-ui-toggle-module-root" }.root), v = 2;
+function y(e) {
+	let t = 0;
+	return a.forEach(e, (e) => {
+		typeof e == "string" || typeof e == "number" ? t += String(e).trim().length : e != null && typeof e != "boolean" && (t += v);
+	}), t;
+}
+function b({ style: e, children: r, ...a }) {
+	let o = {
+		"--glyph-count": y(r),
+		"--max-glyphs": v
+	};
+	return /* @__PURE__ */ i(c, {
+		...a,
+		"data-imf-ui-component": "Toggle",
+		style: (t) => ({
+			...o,
+			...n(e, t)
+		}),
+		className: (e) => _({ className: t(a.className, e) }),
+		children: r
+	});
+}
+//#endregion
+//#region src/components/toggle-group/toggle-group.tsx
+var x = r({ root: "imf-ui-toggle-group-module-root" }.root);
+function S(e) {
+	return /* @__PURE__ */ i(l, {
+		...e,
+		"data-imf-ui-component": "ToggleGroup",
+		className: (n) => x({ className: t(e.className, n) })
+	});
+}
+var C = {
+	alignCenter: "imf-ui-row-module-alignCenter",
+	alignEnd: "imf-ui-row-module-alignEnd",
+	alignStart: "imf-ui-row-module-alignStart",
+	alignStretch: "imf-ui-row-module-alignStretch",
+	gap1: "imf-ui-row-module-gap1",
+	gap10: "imf-ui-row-module-gap10",
+	gap2: "imf-ui-row-module-gap2",
+	gap3: "imf-ui-row-module-gap3",
+	gap4: "imf-ui-row-module-gap4",
+	gap5: "imf-ui-row-module-gap5",
+	gap6: "imf-ui-row-module-gap6",
+	gap7: "imf-ui-row-module-gap7",
+	gap8: "imf-ui-row-module-gap8",
+	gap9: "imf-ui-row-module-gap9",
+	justifyAround: "imf-ui-row-module-justifyAround",
+	justifyBetween: "imf-ui-row-module-justifyBetween",
+	justifyCenter: "imf-ui-row-module-justifyCenter",
+	justifyEnd: "imf-ui-row-module-justifyEnd",
+	justifyEvenly: "imf-ui-row-module-justifyEvenly",
+	justifyStart: "imf-ui-row-module-justifyStart",
+	root: "imf-ui-row-module-root",
+	wrap: "imf-ui-row-module-wrap"
+}, w = r(C.root, { variants: {
+	gap: {
+		1: C.gap1,
+		2: C.gap2,
+		3: C.gap3,
+		4: C.gap4,
+		5: C.gap5,
+		6: C.gap6,
+		7: C.gap7,
+		8: C.gap8,
+		9: C.gap9,
+		10: C.gap10
+	},
+	align: {
+		start: C.alignStart,
+		center: C.alignCenter,
+		end: C.alignEnd,
+		stretch: C.alignStretch
+	},
+	justify: {
+		start: C.justifyStart,
+		center: C.justifyCenter,
+		end: C.justifyEnd,
+		between: C.justifyBetween,
+		around: C.justifyAround,
+		evenly: C.justifyEvenly
+	},
+	wrap: {
+		true: C.wrap,
+		false: null
+	}
+} });
+function T({ gap: e = "2", align: t = "stretch", justify: n = "start", wrap: r = !1, ...a }) {
+	return /* @__PURE__ */ i("div", {
+		...a,
+		"data-imf-ui-component": "Row",
+		className: w({
+			gap: e,
+			align: t,
+			justify: n,
+			wrap: r,
+			className: a.className
+		})
+	});
+}
+var E = {
+	alignCenter: "imf-ui-stack-module-alignCenter",
+	alignEnd: "imf-ui-stack-module-alignEnd",
+	alignStart: "imf-ui-stack-module-alignStart",
+	alignStretch: "imf-ui-stack-module-alignStretch",
+	gap0: "imf-ui-stack-module-gap0",
+	gap1: "imf-ui-stack-module-gap1",
+	gap10: "imf-ui-stack-module-gap10",
+	gap2: "imf-ui-stack-module-gap2",
+	gap3: "imf-ui-stack-module-gap3",
+	gap4: "imf-ui-stack-module-gap4",
+	gap5: "imf-ui-stack-module-gap5",
+	gap6: "imf-ui-stack-module-gap6",
+	gap7: "imf-ui-stack-module-gap7",
+	gap8: "imf-ui-stack-module-gap8",
+	gap9: "imf-ui-stack-module-gap9",
+	justifyAround: "imf-ui-stack-module-justifyAround",
+	justifyBetween: "imf-ui-stack-module-justifyBetween",
+	justifyCenter: "imf-ui-stack-module-justifyCenter",
+	justifyEnd: "imf-ui-stack-module-justifyEnd",
+	justifyEvenly: "imf-ui-stack-module-justifyEvenly",
+	justifyStart: "imf-ui-stack-module-justifyStart",
+	root: "imf-ui-stack-module-root"
+}, D = r(E.root, { variants: {
+	gap: {
+		0: E.gap0,
+		1: E.gap1,
+		2: E.gap2,
+		3: E.gap3,
+		4: E.gap4,
+		5: E.gap5,
+		6: E.gap6,
+		7: E.gap7,
+		8: E.gap8,
+		9: E.gap9,
+		10: E.gap10
+	},
+	align: {
+		start: E.alignStart,
+		center: E.alignCenter,
+		end: E.alignEnd,
+		stretch: E.alignStretch
+	},
+	justify: {
+		start: E.justifyStart,
+		center: E.justifyCenter,
+		end: E.justifyEnd,
+		between: E.justifyBetween,
+		around: E.justifyAround,
+		evenly: E.justifyEvenly
+	}
+} });
+function O({ gap: e = "4", align: t = "stretch", justify: n = "start", ...r }) {
+	return /* @__PURE__ */ i("div", {
+		...r,
+		"data-imf-ui-component": "Stack",
+		className: D({
+			gap: e,
+			align: t,
+			justify: n,
+			className: r.className
+		})
+	});
+}
+var k = {
+	indicator: "imf-ui-tabs-module-indicator",
+	list: "imf-ui-tabs-module-list",
+	listFill: "imf-ui-tabs-module-listFill",
+	panel: "imf-ui-tabs-module-panel",
+	panelViewport: "imf-ui-tabs-module-panelViewport",
+	root: "imf-ui-tabs-module-root",
+	tab: "imf-ui-tabs-module-tab"
+}, A = /* @__PURE__ */ e({
+	Indicator: () => H,
+	List: () => B,
+	Panel: () => W,
+	PanelViewport: () => U,
+	Root: () => z,
+	Tab: () => V
+}), j = r(k.list, { variants: { fill: {
+	true: k.listFill,
+	false: null
+} } }), M = r(k.root), N = r(k.tab), P = r(k.indicator), F = r(k.panelViewport), I = r(k.panel);
+function L(e, t) {
+	typeof e == "function" ? e(t) : e && (e.current = t);
+}
+function R(e) {
+	let t = new ResizeObserver(() => {
+		let t = e.dataset.orientation === "vertical" ? e.scrollHeight > e.clientHeight : e.scrollWidth > e.clientWidth;
+		e.toggleAttribute("data-overflowing", t);
+	}), n = () => {
+		t.disconnect(), t.observe(e);
+		for (let n of e.children) t.observe(n);
+	}, r = new MutationObserver(n);
+	return r.observe(e, { childList: !0 }), n(), () => {
+		t.disconnect(), r.disconnect();
+	};
+}
+function z(e) {
+	return /* @__PURE__ */ i(u.Root, {
+		...e,
+		"data-imf-ui-component": "Tabs.Root",
+		className: (n) => M({ className: t(e.className, n) })
+	});
+}
+z.displayName = "Tabs.Root";
+function B({ fill: e = !1, ref: n, ...r }) {
+	let a = o((e) => {
+		if (!e) return;
+		L(n, e);
+		let t = R(e);
+		return () => {
+			t(), L(n, null);
+		};
+	}, [n]);
+	return /* @__PURE__ */ i(u.List, {
+		...r,
+		ref: a,
+		"data-imf-ui-component": "Tabs.List",
+		className: (n) => j({
+			fill: e,
+			className: t(r.className, n)
+		})
+	});
+}
+B.displayName = "Tabs.List";
+function V(e) {
+	return /* @__PURE__ */ i(u.Tab, {
+		...e,
+		"data-imf-ui-component": "Tabs.Tab",
+		className: (n) => N({ className: t(e.className, n) })
+	});
+}
+V.displayName = "Tabs.Tab";
+function H(e) {
+	return /* @__PURE__ */ i(u.Indicator, {
+		...e,
+		"data-imf-ui-component": "Tabs.Indicator",
+		className: (n) => P({ className: t(e.className, n) })
+	});
+}
+H.displayName = "Tabs.Indicator";
+function U(e) {
+	return /* @__PURE__ */ i("div", {
+		...e,
+		"data-imf-ui-component": "Tabs.PanelViewport",
+		className: F({ className: e.className })
+	});
+}
+U.displayName = "Tabs.PanelViewport";
+function W(e) {
+	return /* @__PURE__ */ i(u.Panel, {
+		...e,
+		"data-imf-ui-component": "Tabs.Panel",
+		className: (n) => I({ className: t(e.className, n) })
+	});
+}
+W.displayName = "Tabs.Panel";
+//#endregion
+export { z as a, O as c, b as d, h as f, U as i, T as l, f as m, B as n, V as o, g as p, W as r, A as s, H as t, S as u };

package/dist/utils/break-hints.d.ts

@@ -0,0 +1,3 @@
+import { ReactNode } from 'react';
+/** Inserts `<wbr>` before each `@` and after each `.` of string children, so an email wraps at its seams. */
+export declare function withBreakHints(children: ReactNode): ReactNode;

package/dist/utils/status-glyphs.d.ts

@@ -0,0 +1,4 @@
+import { IconComponent } from '../icons';
+export type Status = "info" | "positive" | "warning" | "negative";
+/** The glyph each status shows wherever a component marks it with an icon. */
+export declare const statusGlyphs: Record<Status, IconComponent>;

package/dist/vite.js

@@ -1,4 +1,4 @@
-import { n as e } from "./paths-Oi0v8x-w.js";
+import { n as e } from "./paths-CUyf9wjm.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";

package/dist/web-ui-cli.js

@@ -1,5 +1,5 @@
 #!/usr/bin/env node
-import { n as e, r as t, t as n } from "./paths-Oi0v8x-w.js";
+import { n as e, r as t, t as n } from "./paths-CUyf9wjm.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";

package/docs/user-guide/AgentTooling.mdx

@@ -55,8 +55,12 @@ With the hooks installed, the agent is pointed at the router at the start of eve
 picks it up from the skill's description; invoke it by name when it does not.
 
 The router answers library questions from the packaged user guides and hands other tasks to a skill. Setup, audit, and UX
-work from `imf-web-ui-conventions`, a knowledge skill that holds the ImFusion frontend conventions. Solid outlines are the
-skills you run; dashed boxes are knowledge the agent reads:
+work from `imf-web-ui-conventions`, a knowledge skill that holds the ImFusion frontend conventions. Every skill
+you run first reads `imf-web-ui-user-profile`. On the first run it asks a few questions about your name, your
+background, your experience, how much explanation you want, and how you like to work, then saves the answers to
+`~/.config/imfusion/web-ui/consumer-profile.md` if you agree. Say "change my profile" to answer again.
+
+Solid outlines are the skills you run; dashed boxes are knowledge the agent reads:
 
 <ConsumerLlmFrameworkDiagram />
 
@@ -83,7 +87,8 @@ The hooks put the agent on the right skill at the right moment and ask it to ver
 ## Keeping it current
 
 Ask the agent to update the library, for example "Update @imfusion/web-ui". That runs `/imf-web-ui-update`, which installs
-the newer package and refreshes the skills, hook scripts, and registrations to match it.
+the newer package and refreshes the skills, hook scripts, and registrations to match it. It then reports what the new
+releases change for your code and offers `/imf-web-ui-audit full` as a wider check of the project.
 
 To do the same by hand, update the package, then run:
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@imfusion/web-ui",
-  "version": "0.8.1-dev.2.g74f81c31",
+  "version": "0.8.1-dev.20.g50b02289",
   "description": "The official Web UI component library for ImFusion web apps",
   "author": "ImFusion GmbH",
   "homepage": "https://imfusion.com",