@imfusion/web-ui 0.5.1-dev.7.ga571658e → 0.6.0

package/dist/tabs-CMKvMF4E.js

@@ -0,0 +1,369 @@
+import { t as e } from "./chunk-DmhlhrBa.js";
+import { cva as t } from "class-variance-authority";
+import { jsx as n } from "react/jsx-runtime";
+import { Children as r } from "react";
+import { Slider as i } from "@base-ui/react/slider";
+import { Switch as a } from "@base-ui/react/switch";
+import { Toggle as o } from "@base-ui/react/toggle";
+import { ToggleGroup as s } from "@base-ui/react/toggle-group";
+import { Tabs as c } from "@base-ui/react/tabs";
+var l = {
+	control: "imf-ui-slider-module-control",
+	indicator: "imf-ui-slider-module-indicator",
+	label: "imf-ui-slider-module-label",
+	root: "imf-ui-slider-module-root",
+	thumb: "imf-ui-slider-module-thumb",
+	track: "imf-ui-slider-module-track",
+	value: "imf-ui-slider-module-value"
+}, u = /* @__PURE__ */ e({
+	Control: () => x,
+	Indicator: () => C,
+	Label: () => y,
+	Root: () => v,
+	Thumb: () => w,
+	Track: () => S,
+	Value: () => b
+}), d = t(l.root), f = t(l.label), p = t(l.value), m = t(l.control), h = t(l.track), g = t(l.indicator), _ = t(l.thumb);
+function v({ value: e, defaultValue: t, onValueChange: r, onValueCommitted: a, min: o = 0, max: s = 100, step: c = 1, largeStep: l = 10, minStepsBetweenValues: u = 0, disabled: f = !1, orientation: p = "horizontal", name: m, form: h, locale: g, thumbAlignment: _ = "edge", thumbCollisionBehavior: v = "push", format: y, className: b, ...x }) {
+	return /* @__PURE__ */ n(i.Root, {
+		...x,
+		"data-imf-ui-component": "Slider.Root",
+		"data-orientation": p,
+		className: (e) => d({ className: typeof b == "function" ? b(e) : b }),
+		value: e,
+		defaultValue: t,
+		onValueChange: r,
+		onValueCommitted: a,
+		min: o,
+		max: s,
+		step: c,
+		largeStep: l,
+		minStepsBetweenValues: u,
+		disabled: f,
+		orientation: p,
+		name: m,
+		form: h,
+		locale: g,
+		thumbAlignment: _,
+		thumbCollisionBehavior: v,
+		format: y,
+		children: x.children
+	});
+}
+v.displayName = "Slider.Root";
+function y({ className: e, ...t }) {
+	return /* @__PURE__ */ n(i.Label, {
+		...t,
+		"data-imf-ui-component": "Slider.Label",
+		className: (t) => f({ className: typeof e == "function" ? e(t) : e }),
+		children: t.children
+	});
+}
+y.displayName = "Slider.Label";
+function b({ className: e, children: t, ...r }) {
+	return /* @__PURE__ */ n(i.Value, {
+		...r,
+		"data-imf-ui-component": "Slider.Value",
+		className: (t) => p({ className: typeof e == "function" ? e(t) : e }),
+		children: t
+	});
+}
+b.displayName = "Slider.Value";
+function x({ className: e, ...t }) {
+	return /* @__PURE__ */ n(i.Control, {
+		...t,
+		"data-imf-ui-component": "Slider.Control",
+		className: (t) => m({ className: typeof e == "function" ? e(t) : e }),
+		children: t.children
+	});
+}
+x.displayName = "Slider.Control";
+function S({ className: e, ...t }) {
+	return /* @__PURE__ */ n(i.Track, {
+		...t,
+		"data-imf-ui-component": "Slider.Track",
+		className: (t) => h({ className: typeof e == "function" ? e(t) : e }),
+		children: t.children
+	});
+}
+S.displayName = "Slider.Track";
+function C({ className: e, ...t }) {
+	return /* @__PURE__ */ n(i.Indicator, {
+		...t,
+		"data-imf-ui-component": "Slider.Indicator",
+		className: (t) => g({ className: typeof e == "function" ? e(t) : e })
+	});
+}
+C.displayName = "Slider.Indicator";
+function w({ index: e, className: t, ...r }) {
+	return /* @__PURE__ */ n(i.Thumb, {
+		...r,
+		"data-imf-ui-component": "Slider.Thumb",
+		className: (e) => _({ className: typeof t == "function" ? t(e) : t }),
+		index: e
+	});
+}
+w.displayName = "Slider.Thumb";
+var T = {
+	root: "imf-ui-switch-module-root",
+	thumb: "imf-ui-switch-module-thumb"
+}, E = /* @__PURE__ */ e({
+	Root: () => O,
+	Thumb: () => k
+}), D = t(T.root), ee = t(T.thumb);
+function O({ className: e, ...t }) {
+	return /* @__PURE__ */ n(a.Root, {
+		...t,
+		"data-imf-ui-component": "Switch.Root",
+		className: (t) => D({ className: typeof e == "function" ? e(t) : e }),
+		children: t.children
+	});
+}
+O.displayName = "Switch.Root";
+function k({ className: e, ...t }) {
+	return /* @__PURE__ */ n(a.Thumb, {
+		...t,
+		"data-imf-ui-component": "Switch.Thumb",
+		className: (t) => ee({ className: typeof e == "function" ? e(t) : e })
+	});
+}
+k.displayName = "Switch.Thumb";
+//#endregion
+//#region src/components/toggle/toggle.tsx
+var A = t({ root: "imf-ui-toggle-module-root" }.root), j = 2;
+function M(e) {
+	let t = 0;
+	return r.forEach(e, (e) => {
+		typeof e == "string" || typeof e == "number" ? t += String(e).trim().length : e != null && typeof e != "boolean" && (t += j);
+	}), t;
+}
+function N({ className: e, style: t, children: r, ...i }) {
+	let a = {
+		"--glyph-count": M(r),
+		"--max-glyphs": j
+	};
+	return /* @__PURE__ */ n(o, {
+		...i,
+		"data-imf-ui-component": "Toggle",
+		style: (e) => ({
+			...a,
+			...typeof t == "function" ? t(e) : t
+		}),
+		className: (t) => A({ className: typeof e == "function" ? e(t) : e }),
+		children: r
+	});
+}
+//#endregion
+//#region src/components/toggle-group/toggle-group.tsx
+var te = t({ root: "imf-ui-toggle-group-module-root" }.root);
+function ne({ className: e, ...t }) {
+	return /* @__PURE__ */ n(s, {
+		...t,
+		"data-imf-ui-component": "ToggleGroup",
+		className: (t) => te({ className: typeof e == "function" ? e(t) : e })
+	});
+}
+var P = {
+	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"
+}, F = t(P.root, { variants: {
+	gap: {
+		1: P.gap1,
+		2: P.gap2,
+		3: P.gap3,
+		4: P.gap4,
+		5: P.gap5,
+		6: P.gap6,
+		7: P.gap7,
+		8: P.gap8,
+		9: P.gap9,
+		10: P.gap10
+	},
+	align: {
+		start: P.alignStart,
+		center: P.alignCenter,
+		end: P.alignEnd,
+		stretch: P.alignStretch
+	},
+	justify: {
+		start: P.justifyStart,
+		center: P.justifyCenter,
+		end: P.justifyEnd,
+		between: P.justifyBetween,
+		around: P.justifyAround,
+		evenly: P.justifyEvenly
+	},
+	wrap: {
+		true: P.wrap,
+		false: null
+	}
+} });
+function I({ gap: e = "2", align: t = "stretch", justify: r = "start", wrap: i = !1, className: a, ...o }) {
+	return /* @__PURE__ */ n("div", {
+		...o,
+		"data-imf-ui-component": "Row",
+		className: F({
+			gap: e,
+			align: t,
+			justify: r,
+			wrap: i,
+			className: a
+		}),
+		children: o.children
+	});
+}
+var L = {
+	alignCenter: "imf-ui-stack-module-alignCenter",
+	alignEnd: "imf-ui-stack-module-alignEnd",
+	alignStart: "imf-ui-stack-module-alignStart",
+	alignStretch: "imf-ui-stack-module-alignStretch",
+	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"
+}, R = t(L.root, { variants: {
+	gap: {
+		1: L.gap1,
+		2: L.gap2,
+		3: L.gap3,
+		4: L.gap4,
+		5: L.gap5,
+		6: L.gap6,
+		7: L.gap7,
+		8: L.gap8,
+		9: L.gap9,
+		10: L.gap10
+	},
+	align: {
+		start: L.alignStart,
+		center: L.alignCenter,
+		end: L.alignEnd,
+		stretch: L.alignStretch
+	},
+	justify: {
+		start: L.justifyStart,
+		center: L.justifyCenter,
+		end: L.justifyEnd,
+		between: L.justifyBetween,
+		around: L.justifyAround,
+		evenly: L.justifyEvenly
+	}
+} });
+function z({ gap: e = "4", align: t = "stretch", justify: r = "start", className: i, ...a }) {
+	return /* @__PURE__ */ n("div", {
+		...a,
+		"data-imf-ui-component": "Stack",
+		className: R({
+			gap: e,
+			align: t,
+			justify: r,
+			className: i
+		}),
+		children: a.children
+	});
+}
+var B = {
+	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"
+}, V = /* @__PURE__ */ e({
+	Indicator: () => Z,
+	List: () => Y,
+	Panel: () => $,
+	PanelViewport: () => Q,
+	Root: () => J,
+	Tab: () => X
+}), H = t(B.list, { variants: { fill: {
+	true: B.listFill,
+	false: null
+} } }), U = t(B.root), W = t(B.tab), G = t(B.indicator), K = t(B.panelViewport), q = t(B.panel);
+function J({ className: e, ...t }) {
+	return /* @__PURE__ */ n(c.Root, {
+		...t,
+		"data-imf-ui-component": "Tabs.Root",
+		className: (t) => U({ className: typeof e == "function" ? e(t) : e })
+	});
+}
+J.displayName = "Tabs.Root";
+function Y({ fill: e = !1, className: t, ...r }) {
+	return /* @__PURE__ */ n(c.List, {
+		...r,
+		"data-imf-ui-component": "Tabs.List",
+		className: (n) => H({
+			fill: e,
+			className: typeof t == "function" ? t(n) : t
+		})
+	});
+}
+Y.displayName = "Tabs.List";
+function X({ className: e, ...t }) {
+	return /* @__PURE__ */ n(c.Tab, {
+		...t,
+		"data-imf-ui-component": "Tabs.Tab",
+		className: (t) => W({ className: typeof e == "function" ? e(t) : e })
+	});
+}
+X.displayName = "Tabs.Tab";
+function Z({ className: e, ...t }) {
+	return /* @__PURE__ */ n(c.Indicator, {
+		...t,
+		"data-imf-ui-component": "Tabs.Indicator",
+		className: (t) => G({ className: typeof e == "function" ? e(t) : e })
+	});
+}
+Z.displayName = "Tabs.Indicator";
+function Q({ className: e, ...t }) {
+	return /* @__PURE__ */ n("div", {
+		...t,
+		"data-imf-ui-component": "Tabs.PanelViewport",
+		className: K({ className: e })
+	});
+}
+Q.displayName = "Tabs.PanelViewport";
+function $({ className: e, ...t }) {
+	return /* @__PURE__ */ n(c.Panel, {
+		...t,
+		"data-imf-ui-component": "Tabs.Panel",
+		className: (t) => q({ className: typeof e == "function" ? e(t) : e })
+	});
+}
+$.displayName = "Tabs.Panel";
+//#endregion
+export { u as S, y as _, J as a, S as b, z as c, N as d, O as f, C as g, x as h, Q as i, I as l, E as m, Y as n, X as o, k as p, $ as r, V as s, Z as t, ne as u, v, b as x, w as y };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@imfusion/web-ui",
-  "version": "0.5.1-dev.7.ga571658e",
+  "version": "0.6.0",
   "description": "The official Web UI component library for ImFusion web apps",
   "author": "ImFusion GmbH",
   "license": "UNLICENSED",
@@ -9,10 +9,17 @@
     "access": "restricted"
   },
   "type": "module",
+  "engines": {
+    "node": ">=24"
+  },
+  "imports": {
+    "#/*": "./src/*",
+    "#/storybook/*": "./.storybook/*"
+  },
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "bin": {
-    "web-ui-install-skills": "bin/install-skill.js"
+    "web-ui-install": "bin/install.js"
   },
   "exports": {
     ".": {
@@ -23,6 +30,14 @@
       "types": "./dist/integrations/*/index.d.ts",
       "import": "./dist/integrations/*.js"
     },
+    "./build/*": {
+      "types": "./dist/build/*/index.d.ts",
+      "import": "./dist/build/*.js"
+    },
+    "./icons": {
+      "types": "./dist/icons/index.d.ts",
+      "import": "./dist/icons.js"
+    },
     "./styles.css": "./dist/style.css",
     "./docgen.json": "./src/docgen/doc.gen.json",
     "./llms.txt": "./src/llms/llms.gen.txt",
@@ -30,44 +45,50 @@
   },
   "files": [
     "dist",
+    "src/llms/install-templates",
     "src/docgen/doc.gen.json",
     "src/llms/llms.gen.txt",
+    "src/llms/icon-catalog.gen.json",
+    "src/llms/tokens.gen.json",
     "src/llms/skills",
     "bin"
   ],
   "scripts": {
-    "codegen:docgen": "tsx src/docgen/gen-docgen.ts",
-    "codegen:llms": "tsx src/llms/gen-llms.ts",
-    "codegen:watch": "tsx watch src/codegen/run.ts",
-    "codegen:storybook": "tsx src/codegen/run.ts --storybook",
-    "codegen": "tsx src/codegen/run.ts",
-    "build": "npm run codegen && rm -rf dist && vite build && npm run codegen:docgen && npm run codegen:llms",
     "dev": "tsx scripts/dev.ts",
     "dev:host": "tsx scripts/dev.ts --host",
     "dev:lib": "concurrently -n codegen,lib -c yellow,blue \"npm run codegen:watch\" \"vite build --watch\"",
-    "typecheck": "npm run codegen && tsc -p tsconfig.lib.json --noEmit && tsc -p .storybook/tsconfig.json --noEmit",
+    "build": "npm run codegen && rm -rf dist && vite build && npm run codegen:docgen && npm run codegen:llms && npm run codegen:tokens",
+    "build:storybook": "npm run codegen:storybook && storybook build",
+    "storybook": "npm run codegen:storybook && storybook dev -p 6006 --no-open",
+    "storybook:free-ports": "tsx scripts/free-storybook-ports.ts",
+    "codegen": "tsx src/codegen/run.ts",
+    "codegen:watch": "tsx watch src/codegen/run.ts",
+    "codegen:storybook": "tsx src/codegen/run.ts --storybook",
+    "codegen:docgen": "tsx src/docgen/gen-docgen.ts",
+    "codegen:llms": "tsx src/llms/gen-llms.ts",
+    "codegen:tokens": "tsx src/llms/gen-tokens.ts",
+    "verify:format": "prettier --check . --ignore-path .gitignore --ignore-path .prettierignore --ignore-path $(git rev-parse --path-format=absolute --git-path info/exclude)",
+    "verify:lint": "eslint . --cache --max-warnings=0",
+    "verify:typecheck": "npm run codegen && tsc -p tsconfig.json --noEmit && tsc -p tsconfig.lib.json --noEmit && tsc -p .storybook/tsconfig.json --noEmit",
+    "verify:tests": "vitest run",
+    "verify:knip": "knip",
+    "verify:deps": "tsx scripts/check-pinned-dependencies.ts",
+    "verify:icons": "tsx scripts/verify/icons-public-api.ts",
+    "verify:changelog": "tsx scripts/verify/changelog.ts",
+    "verify:staged": "tsx scripts/verify/staged.ts",
+    "verify:full": "tsx scripts/verify/full.ts && npm run verify:tests",
+    "release:prepare": "tsx scripts/release.ts prepare",
+    "release:tag": "tsx scripts/release.ts tag",
     "format": "prettier --write .",
-    "format:check": "prettier --check .",
-    "lint": "eslint . --cache --max-warnings=0",
-    "lint:fix": "eslint . --cache --fix",
+    "lint": "eslint . --cache --fix",
     "lint:inspect": "npx @eslint/config-inspector@latest",
+    "test:unit": "vitest run --project unit",
+    "test:stories": "vitest run --project storybook",
+    "test:watch": "vitest",
     "skills:eval": "node src/llms/evals/run.mjs",
     "skills:eval:dev": "WEB_UI_SKILL_EVAL_ROOT=/private/tmp/web-ui-dev-skill-evals WEB_UI_SKILL_EVAL_RESULTS_DIR=.agents/evals/results WEB_UI_SKILL_EVAL_REPORT_PATH=.agents/evals/REPORT.md WEB_UI_SKILL_EVAL_SKILL_FAMILY=web-ui-dev WEB_UI_SKILL_EVAL_WORKSPACE_LABEL='development repository' node src/llms/evals/run.mjs --scenarios-dir .agents/evals/scenarios --setup .agents/evals/setup-env.sh",
     "skills:eval:compare": "node src/llms/evals/compare.mjs",
     "skills:eval:report": "node src/llms/evals/report.mjs",
-    "storybook": "npm run codegen:storybook && storybook dev -p 6006 --no-open",
-    "storybook:free-ports": "tsx scripts/free-storybook-ports.ts",
-    "build:storybook": "npm run codegen:storybook && storybook build",
-    "test": "vitest run",
-    "test:unit": "vitest run --project unit",
-    "test:stories": "vitest run --project storybook",
-    "test:watch": "vitest",
-    "verify:preflight": "tsx scripts/verify/full.ts",
-    "verify:full": "npm run verify:preflight && npm run test",
-    "worktree:create": "tsx scripts/worktrees.ts create",
-    "worktree:close": "tsx scripts/worktrees.ts close",
-    "worktree:discard": "tsx scripts/worktrees.ts discard",
-    "knip": "knip",
     "git:config": "git config core.hooksPath .githooks && git config pull.rebase true && git config merge.ff only"
   },
   "peerDependencies": {
@@ -92,7 +113,7 @@
     "@base-ui/react": "1.6.0",
     "@clack/prompts": "1.7.0",
     "class-variance-authority": "0.7.1",
-    "lucide-react": "1.16.0"
+    "iconoir-react": "7.12.1"
   },
   "devDependencies": {
     "@eslint/compat": "1.4.1",
@@ -124,6 +145,7 @@
     "globals": "15.15.0",
     "jiti": "2.7.0",
     "knip": "6.14.2",
+    "lightningcss": "1.32.0",
     "nano-staged": "1.0.2",
     "playwright": "1.60.0",
     "prettier": "3.8.3",