@imfusion/web-ui 0.5.1-dev.50.ga7a4f1c3 → 0.5.1-dev.52.gcaa229a7

package/dist/integrations/code-highlight/code-highlight.d.ts

@@ -1,20 +1,22 @@
 import { Code } from '../../components/code';
 import { SupportedLanguage } from './highlighter';
-type BlockProps = Omit<React.ComponentProps<typeof Code.Block>, "highlighted" | "language"> & {
+type BlockProps = Omit<React.ComponentProps<typeof Code.Block>, "children" | "language"> & {
     /** Language of `children`: grammar for tokenization and label for the corner notch. Omit to hide the notch and skip highlighting. */
+    children: string;
     language?: SupportedLanguage;
 };
-/** Code.Block — the core `Code.Block` with TanStack Highlight tokens filling its `highlighted` slot. */
-export declare function Block({ language, children, ...props }: BlockProps): import("react/jsx-runtime").JSX.Element;
+/** Code.Block — the core `Code.Block` with TanStack Highlight tokens rendered inside. */
+export declare function Block({ language, children, ...props }: BlockProps): import('react').FunctionComponentElement<any>;
 export declare namespace Block {
     var displayName: string;
 }
-type InlineProps = Omit<React.ComponentProps<typeof Code.Inline>, "highlighted"> & {
+type InlineProps = Omit<React.ComponentProps<typeof Code.Inline>, "children"> & {
     /** Grammar used to tokenize the fragment. Purely visual — the chip shows no language label. Omit for plain text. */
+    children: string;
     language?: SupportedLanguage;
 };
-/** Code.Inline — the core `Code.Inline` with TanStack Highlight tokens filling its `highlighted` slot. */
-export declare function Inline({ language, children, ...props }: InlineProps): import("react/jsx-runtime").JSX.Element;
+/** Code.Inline — the core `Code.Inline` with TanStack Highlight tokens rendered inside. */
+export declare function Inline({ language, children, ...props }: InlineProps): import('react').FunctionComponentElement<any>;
 export declare namespace Inline {
     var displayName: string;
 }

package/dist/integrations/code-highlight.js

@@ -1,17 +1,18 @@
-import { a as e, t } from "../meta-B8C51eyL.js";
-import { i as n, n as r, r as i } from "../code-qBbqAHK-.js";
-import { useMemo as a } from "react";
-import { jsx as o } from "react/jsx-runtime";
-import { createHighlighter as s, defineLanguage as c, renderNodesToHtml as l, renderTokens as u } from "@tanstack/highlight/core";
-import { css as d } from "@tanstack/highlight/languages/css";
-import { json as f } from "@tanstack/highlight/languages/json";
-import { plaintext as p } from "@tanstack/highlight/languages/plaintext";
-import { shell as m } from "@tanstack/highlight/languages/shell";
-import { ts as h } from "@tanstack/highlight/languages/ts";
-import { tsx as g } from "@tanstack/highlight/languages/tsx";
-import { python as _ } from "@tanstack/highlight/languages/python";
+import { n as e } from "../chunk-DA_OvQe2.js";
+import { t } from "../meta-BwCupYyq.js";
+import { i as n, n as r, r as i } from "../code-BRy_lg-h.js";
+import { cloneElement as a, useMemo as o } from "react";
+import { jsx as s } from "react/jsx-runtime";
+import { createHighlighter as c, defineLanguage as l, renderNodesToHtml as u, renderTokens as d } from "@tanstack/highlight/core";
+import { css as f } from "@tanstack/highlight/languages/css";
+import { json as p } from "@tanstack/highlight/languages/json";
+import { plaintext as m } from "@tanstack/highlight/languages/plaintext";
+import { shell as h } from "@tanstack/highlight/languages/shell";
+import { ts as g } from "@tanstack/highlight/languages/ts";
+import { tsx as _ } from "@tanstack/highlight/languages/tsx";
+import { python as v } from "@tanstack/highlight/languages/python";
 //#region src/integrations/code-highlight/language-patterns.ts
-function v(e, t, n = []) {
+function y(e, t, n = []) {
 	let r = [], i = new Uint8Array(e.length);
 	for (let { start: e, end: t } of n) i.fill(1, e, t);
 	for (let n of t) {
@@ -41,7 +42,7 @@ function v(e, t, n = []) {
 }
 //#endregion
 //#region src/integrations/code-highlight/languages/cmake.ts
-var y = [
+var b = [
 	{
 		className: "string",
 		regex: /"(?:\\.|[^"\\\n])*"|\[(=*)\[[\s\S]*?\]\1\]/g
@@ -74,12 +75,12 @@ var y = [
 		className: "operator",
 		regex: /(?:LESS_EQUAL|GREATER_EQUAL|STREQUAL|IN_LIST|MATCHES|EQUAL|LESS|GREATER|AND|OR|NOT|[=<>+*/!-])/gi
 	}
-], b = c({
+], x = l({
 	name: "cmake",
 	tokenize(e) {
-		return v(e, y);
+		return y(e, b);
 	}
-}), x = [
+}), S = [
 	{
 		className: "comment",
 		regex: /\/\/[^\n]*|\/\*[\s\S]*?\*\//g
@@ -116,7 +117,7 @@ var y = [
 		className: "operator",
 		regex: /(?:<<=?|>>=?|->\*|->|\+\+|--|&&|\|\||==|!=|<=|>=|::|\+=|-=|\*=|\/=|%=|&=|\|=|\^=|[-+*/%=&|^!<>?:~])/g
 	}
-], S = c({
+], C = l({
 	name: "cpp",
 	aliases: [
 		"c++",
@@ -125,19 +126,19 @@ var y = [
 		"hpp"
 	],
 	tokenize(e) {
-		return v(e, x);
+		return y(e, S);
 	}
-}), C = [{
+}), w = [{
 	className: "function",
 	regex: /\b[A-Za-z_]\w*(?=\s*\()/g
-}], w = c({
+}], T = l({
 	name: "python",
 	aliases: ["py"],
 	tokenize(e, t) {
-		let n = _.tokenize(e, t), r = v(e, C, n);
+		let n = v.tokenize(e, t), r = y(e, w, n);
 		return [...n, ...r];
 	}
-}), T = {
+}), E = {
 	tsx: { aliases: ["typescriptreact"] },
 	ts: { aliases: ["typescript"] },
 	css: { aliases: ["scss"] },
@@ -156,69 +157,67 @@ var y = [
 	] },
 	python: { aliases: ["py"] },
 	cmake: { aliases: [] }
-}, E = Object.keys(T), D = [...E, ...Object.values(T).flatMap(({ aliases: e }) => e)];
-function O(e) {
-	return D.includes(e);
+}, D = Object.keys(E), O = [...D, ...Object.values(E).flatMap(({ aliases: e }) => e)];
+function k(e) {
+	return O.includes(e);
 }
-function k(e, t) {
+function A(e, t) {
 	return e.aliases.includes(t);
 }
-function A(e) {
-	for (let [t, n] of Object.entries(T)) if (k(n, e)) return t;
+function j(e) {
+	for (let [t, n] of Object.entries(E)) if (A(n, e)) return t;
 	return e;
 }
-var j = s({
+var M = c({
 	languages: [
+		_,
 		g,
-		h,
-		d,
-		m,
 		f,
-		S,
-		w,
-		b,
-		p
+		h,
+		p,
+		C,
+		T,
+		x,
+		m
 	],
 	fallbackLanguage: "plaintext"
 });
-function M(e, t) {
-	let n = A(t), { tokens: r } = j.tokenize(e, { lang: n });
-	return l(u(r));
+function N(e, t) {
+	let n = j(t), { tokens: r } = M.tokenize(e, { lang: n });
+	return u(d(r));
 }
 //#endregion
 //#region src/integrations/code-highlight/code-highlight.tsx
-var N = /* @__PURE__ */ e({
-	Block: () => F,
-	Inline: () => I,
+var P = /* @__PURE__ */ e({
+	Block: () => I,
+	Inline: () => L,
 	InlineLink: () => n
 });
-function P(e, t) {
-	return a(() => {
-		if (!(t == null || e === "")) return /* @__PURE__ */ o("span", { dangerouslySetInnerHTML: { __html: M(e, t) } });
+function F(e, t) {
+	return o(() => {
+		if (!(t == null || e === "")) return /* @__PURE__ */ s("span", { dangerouslySetInnerHTML: { __html: N(e, t) } });
 	}, [e, t]);
 }
-function F({ language: e, children: t, ...n }) {
-	let i = P(t, e);
-	return /* @__PURE__ */ o(r, {
+function I({ language: e, children: t, ...n }) {
+	let i = F(t, e);
+	return a(/* @__PURE__ */ s(r, {
 		...n,
 		language: e,
-		highlighted: i,
 		children: t
-	});
+	}), { children: i ?? t });
 }
-F.displayName = "Code.Block";
-function I({ language: e, children: t, ...n }) {
-	let r = P(t, e);
-	return /* @__PURE__ */ o(i, {
+I.displayName = "Code.Block";
+function L({ language: e, children: t, ...n }) {
+	let r = F(t, e);
+	return a(/* @__PURE__ */ s(i, {
 		...n,
-		highlighted: r,
 		children: t
-	});
+	}), { children: r ?? t });
 }
-I.displayName = "Code.Inline";
+L.displayName = "Code.Inline";
 //#endregion
 //#region src/integrations/code-highlight/code-highlight.meta.ts
-var L = {
+var R = {
 	name: "CodeHighlight",
 	category: t.display,
 	status: "experimental",
@@ -234,4 +233,4 @@ var L = {
 	}
 };
 //#endregion
-export { N as Code, E as SUPPORTED_LANGUAGES, L as codeHighlightMeta, O as isSupportedLanguage };
+export { P as Code, D as SUPPORTED_LANGUAGES, R as codeHighlightMeta, k as isSupportedLanguage };

package/dist/integrations/image-display-options.js

@@ -1,5 +1,5 @@
-import { n as e, t } from "../meta-B8C51eyL.js";
-import { C as n, S as r, a as i, b as a, c as o, d as s, g as c, h as l, i as u, l as d, n as f, o as p, p as m, r as h, t as g, v as _, w as v, x as y, y as b } from "../tabs-CVp_SgBl.js";
+import { C as e, S as t, a as n, b as r, c as i, d as a, g as o, h as s, i as c, l, n as u, o as d, p as f, r as p, t as m, v as h, w as g, x as _, y as v } from "../tabs-CYqtw1q9.js";
+import { n as y, t as b } from "../meta-BwCupYyq.js";
 import { useId as x, useMemo as S, useState as C } from "react";
 import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
 import { useDisplayOptions2d as D, useDisplayOptions3d as O } from "@imfusion/sdk-react";
@@ -71,30 +71,30 @@ function F(e, t) {
 }
 //#endregion
 //#region src/integrations/image-display-options/image-display-options-view.tsx
-var I = e(k.root);
-function L({ spec: e, value: t, row: i, onChange: o }) {
-	let s = /* @__PURE__ */ E(y, {
-		value: t,
-		min: e.min,
-		max: e.max,
-		step: e.step,
-		format: e.format,
+var I = y(k.root);
+function L({ spec: n, value: i, row: a, onChange: o }) {
+	let s = /* @__PURE__ */ E(_, {
+		value: i,
+		min: n.min,
+		max: n.max,
+		step: n.step,
+		format: n.format,
 		onValueChange: (e) => {
 			o(typeof e == "number" ? e : e[0]);
 		},
-		children: [/* @__PURE__ */ E(d, {
+		children: [/* @__PURE__ */ E(l, {
 			justify: "between",
-			children: [/* @__PURE__ */ T(a, { children: e.label }), /* @__PURE__ */ T(v, {})]
-		}), /* @__PURE__ */ T(_, { children: /* @__PURE__ */ E(n, { children: [/* @__PURE__ */ T(b, {}), /* @__PURE__ */ T(r, { "aria-label": e.label })] }) })]
+			children: [/* @__PURE__ */ T(r, { children: n.label }), /* @__PURE__ */ T(g, {})]
+		}), /* @__PURE__ */ T(h, { children: /* @__PURE__ */ E(e, { children: [/* @__PURE__ */ T(v, {}), /* @__PURE__ */ T(t, { "aria-label": n.label })] }) })]
 	});
-	return i ? /* @__PURE__ */ T("div", {
+	return a ? /* @__PURE__ */ T("div", {
 		className: k.rowField,
 		children: s
 	}) : s;
 }
 function R({ checked: e, row: t, onChange: n }) {
 	let r = x();
-	return /* @__PURE__ */ E(d, {
+	return /* @__PURE__ */ E(l, {
 		align: "center",
 		justify: t ? "start" : "between",
 		gap: "2",
@@ -103,18 +103,18 @@ function R({ checked: e, row: t, onChange: n }) {
 			id: r,
 			className: k.invertLabel,
 			children: "Invert"
-		}), /* @__PURE__ */ T(l, {
+		}), /* @__PURE__ */ T(s, {
 			"aria-labelledby": r,
 			checked: e,
 			onCheckedChange: (e) => {
 				n(e);
 			},
-			children: /* @__PURE__ */ T(c, {})
+			children: /* @__PURE__ */ T(o, {})
 		})]
 	});
 }
 function z({ active: e, onChange: t }) {
-	return /* @__PURE__ */ E(s, {
+	return /* @__PURE__ */ E(a, {
 		className: k.segment,
 		"aria-label": "Display dimension",
 		value: [e],
@@ -122,10 +122,10 @@ function z({ active: e, onChange: t }) {
 			let n = e[0];
 			(n === "2d" || n === "3d") && t(n);
 		},
-		children: [/* @__PURE__ */ T(m, {
+		children: [/* @__PURE__ */ T(f, {
 			value: "2d",
 			children: "2D"
-		}), /* @__PURE__ */ T(m, {
+		}), /* @__PURE__ */ T(f, {
 			value: "3d",
 			children: "3D"
 		})]
@@ -148,75 +148,75 @@ function B({ dimension: e, fields: t, options: n, row: r, onChange: i }) {
 		}
 	})] });
 }
-function V({ variant: e = "default", options: t, intensityRange: n, ranges: r, onOptionsChange: a, className: s, ...c }) {
-	let [l, m] = C("2d"), _ = N(n, r), v = (e) => {
-		m(e === "3d" ? "3d" : "2d");
+function V({ variant: e = "default", options: t, intensityRange: r, ranges: a, onOptionsChange: o, className: s, ...f }) {
+	let [h, g] = C("2d"), _ = N(r, a), v = (e) => {
+		g(e === "3d" ? "3d" : "2d");
 	};
 	return /* @__PURE__ */ T("div", {
-		...c,
+		...f,
 		"data-imf-ui-component": "ImageDisplayOptions",
 		className: I({ className: s }),
-		children: e === "default" ? /* @__PURE__ */ E(i, {
-			value: l,
+		children: e === "default" ? /* @__PURE__ */ E(n, {
+			value: h,
 			onValueChange: v,
-			children: [/* @__PURE__ */ E(f, { children: [
-				/* @__PURE__ */ T(p, {
+			children: [/* @__PURE__ */ E(u, { children: [
+				/* @__PURE__ */ T(d, {
 					value: "2d",
 					children: "2D Slices"
 				}),
-				/* @__PURE__ */ T(p, {
+				/* @__PURE__ */ T(d, {
 					value: "3d",
 					children: "3D Volume"
 				}),
-				/* @__PURE__ */ T(g, {})
-			] }), /* @__PURE__ */ E(u, { children: [/* @__PURE__ */ T(h, {
+				/* @__PURE__ */ T(m, {})
+			] }), /* @__PURE__ */ E(c, { children: [/* @__PURE__ */ T(p, {
 				value: "2d",
-				children: /* @__PURE__ */ T(o, {
+				children: /* @__PURE__ */ T(i, {
 					gap: "3",
 					children: /* @__PURE__ */ T(B, {
 						dimension: "2d",
 						fields: _["2d"],
 						options: t,
 						row: !1,
-						onChange: a
+						onChange: o
 					})
 				})
-			}), /* @__PURE__ */ T(h, {
+			}), /* @__PURE__ */ T(p, {
 				value: "3d",
-				children: /* @__PURE__ */ T(o, {
+				children: /* @__PURE__ */ T(i, {
 					gap: "3",
 					children: /* @__PURE__ */ T(B, {
 						dimension: "3d",
 						fields: _["3d"],
 						options: t,
 						row: !1,
-						onChange: a
+						onChange: o
 					})
 				})
 			})] })]
-		}) : e === "horizontal" ? /* @__PURE__ */ E(i, {
+		}) : e === "horizontal" ? /* @__PURE__ */ E(n, {
 			className: k.horizontalTabs,
 			orientation: "vertical",
-			value: l,
+			value: h,
 			onValueChange: v,
-			children: [/* @__PURE__ */ E(f, {
+			children: [/* @__PURE__ */ E(u, {
 				fill: !0,
 				children: [
-					/* @__PURE__ */ T(p, {
+					/* @__PURE__ */ T(d, {
 						value: "2d",
 						children: "2D"
 					}),
-					/* @__PURE__ */ T(p, {
+					/* @__PURE__ */ T(d, {
 						value: "3d",
 						children: "3D"
 					}),
-					/* @__PURE__ */ T(g, {})
+					/* @__PURE__ */ T(m, {})
 				]
-			}), /* @__PURE__ */ E(u, {
+			}), /* @__PURE__ */ E(c, {
 				className: k.horizontalPanel,
-				children: [/* @__PURE__ */ T(h, {
+				children: [/* @__PURE__ */ T(p, {
 					value: "2d",
-					children: /* @__PURE__ */ T(d, {
+					children: /* @__PURE__ */ T(l, {
 						align: "center",
 						gap: "3",
 						className: k.strip,
@@ -225,12 +225,12 @@ function V({ variant: e = "default", options: t, intensityRange: n, ranges: r, o
 							fields: _["2d"],
 							options: t,
 							row: !0,
-							onChange: a
+							onChange: o
 						})
 					})
-				}), /* @__PURE__ */ T(h, {
+				}), /* @__PURE__ */ T(p, {
 					value: "3d",
-					children: /* @__PURE__ */ T(d, {
+					children: /* @__PURE__ */ T(l, {
 						align: "center",
 						gap: "3",
 						className: k.strip,
@@ -239,24 +239,24 @@ function V({ variant: e = "default", options: t, intensityRange: n, ranges: r, o
 							fields: _["3d"],
 							options: t,
 							row: !0,
-							onChange: a
+							onChange: o
 						})
 					})
 				})]
 			})]
-		}) : /* @__PURE__ */ E(d, {
+		}) : /* @__PURE__ */ E(l, {
 			align: "center",
 			gap: "3",
 			className: k.compactStrip,
 			children: [/* @__PURE__ */ T(z, {
-				active: l,
-				onChange: m
+				active: h,
+				onChange: g
 			}), /* @__PURE__ */ T(B, {
-				dimension: l,
-				fields: _[l],
+				dimension: h,
+				fields: _[h],
 				options: t,
 				row: !0,
-				onChange: a
+				onChange: o
 			})]
 		})
 	});
@@ -294,7 +294,7 @@ H.displayName = "ImageDisplayOptions";
 //#region src/integrations/image-display-options/image-display-options.meta.ts
 var U = {
 	name: "ImageDisplayOptions",
-	category: t.inputs,
+	category: b.inputs,
 	status: "experimental",
 	description: "A panel or toolbar of controls bound to an image dataset's display options.",
 	origin: "adapted",

package/dist/meta-BwCupYyq.js

@@ -0,0 +1,64 @@
+//#region node_modules/clsx/dist/clsx.mjs
+function e(t) {
+	var n, r, i = "";
+	if (typeof t == "string" || typeof t == "number") i += t;
+	else if (typeof t == "object") if (Array.isArray(t)) {
+		var a = t.length;
+		for (n = 0; n < a; n++) t[n] && (r = e(t[n])) && (i && (i += " "), i += r);
+	} else for (r in t) t[r] && (i && (i += " "), i += r);
+	return i;
+}
+function t() {
+	for (var t, n, r = 0, i = "", a = arguments.length; r < a; r++) (t = arguments[r]) && (n = e(t)) && (i && (i += " "), i += n);
+	return i;
+}
+//#endregion
+//#region node_modules/class-variance-authority/dist/index.mjs
+var n = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, r = t, i = (e, t) => (i) => {
+	if (t?.variants == null) return r(e, i?.class, i?.className);
+	let { variants: a, defaultVariants: o } = t, s = Object.keys(a).map((e) => {
+		let t = i?.[e], r = o?.[e];
+		if (t === null) return null;
+		let s = n(t) || n(r);
+		return a[e][s];
+	}), c = i && Object.entries(i).reduce((e, t) => {
+		let [n, r] = t;
+		return r === void 0 || (e[n] = r), e;
+	}, {});
+	return r(e, s, t?.compoundVariants?.reduce((e, t) => {
+		let { class: n, className: r, ...i } = t;
+		return Object.entries(i).every((e) => {
+			let [t, n] = e;
+			return Array.isArray(n) ? n.includes({
+				...o,
+				...c
+			}[t]) : {
+				...o,
+				...c
+			}[t] === n;
+		}) ? [
+			...e,
+			n,
+			r
+		] : e;
+	}, []), i?.class, i?.className);
+}, a = {
+	buttons: {
+		id: "buttons",
+		label: "Buttons"
+	},
+	inputs: {
+		id: "inputs",
+		label: "Inputs"
+	},
+	layout: {
+		id: "layout",
+		label: "Layout"
+	},
+	display: {
+		id: "display",
+		label: "Display"
+	}
+};
+//#endregion
+export { i as n, r, a as t };

package/dist/provider/web-ui-provider.d.ts

@@ -1,6 +1,9 @@
 import { ReactNode } from 'react';
+import { IconConfig } from '../icons/icon-context';
 interface Props {
     children: ReactNode;
+    /** SVG defaults for icons in this provider's subtree; omitted fields use the defaults from icon-context.ts. */
+    icons?: IconConfig;
 }
-export declare function WebUIProvider({ children }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function WebUIProvider({ children, icons }: Props): import("react/jsx-runtime").JSX.Element;
 export {};