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

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/highlighter.d.ts

@@ -1,6 +1,35 @@
-export declare const SUPPORTED_LANGUAGES: readonly ["tsx", "ts", "css", "shell", "json"];
-declare const LANGUAGE_ALIASES: readonly ["typescript", "bash", "sh", "zsh", "shellscript", "scss"];
-export type SupportedLanguage = (typeof SUPPORTED_LANGUAGES)[number] | (typeof LANGUAGE_ALIASES)[number];
+declare const LANGUAGE_DEFINITIONS: {
+    readonly tsx: {
+        readonly aliases: readonly ["typescriptreact"];
+    };
+    readonly ts: {
+        readonly aliases: readonly ["typescript"];
+    };
+    readonly css: {
+        readonly aliases: readonly ["scss"];
+    };
+    readonly shell: {
+        readonly aliases: readonly ["bash", "sh", "zsh", "shellscript"];
+    };
+    readonly json: {
+        readonly aliases: readonly [];
+    };
+    readonly cpp: {
+        readonly aliases: readonly ["c++", "cc", "cxx", "hpp"];
+    };
+    readonly python: {
+        readonly aliases: readonly ["py"];
+    };
+    readonly cmake: {
+        readonly aliases: readonly [];
+    };
+};
+export declare const SUPPORTED_LANGUAGES: string[];
+type CanonicalLanguage = keyof typeof LANGUAGE_DEFINITIONS;
+type LanguageAlias = {
+    [Language in CanonicalLanguage]: (typeof LANGUAGE_DEFINITIONS)[Language]["aliases"][number];
+}[CanonicalLanguage];
+export type SupportedLanguage = CanonicalLanguage | LanguageAlias;
 export declare function isSupportedLanguage(value: string): value is SupportedLanguage;
 export declare function highlightToHtml(code: string, language: SupportedLanguage): string;
 export {};

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

@@ -0,0 +1,7 @@
+import { HighlightTokenClass, TokenRange } from '@tanstack/highlight/core';
+export type LanguagePattern = {
+    className: HighlightTokenClass;
+    group?: number;
+    regex: RegExp;
+};
+export declare function collectPatternRanges(code: string, patterns: readonly LanguagePattern[], initialRanges?: readonly TokenRange[]): TokenRange[];

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

@@ -0,0 +1 @@
+export declare const cmake: import('@tanstack/highlight/core').LanguageDefinition<"cmake">;

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

@@ -0,0 +1 @@
+export declare const cpp: import('@tanstack/highlight/core').LanguageDefinition<"cpp">;

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

@@ -0,0 +1 @@
+export declare const python: import('@tanstack/highlight/core').LanguageDefinition<"python">;

package/dist/integrations/code-highlight.js

@@ -1,84 +1,223 @@
-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, renderNodesToHtml as c, renderTokens as l } from "@tanstack/highlight/core";
-import { css as u } from "@tanstack/highlight/languages/css";
-import { json as d } from "@tanstack/highlight/languages/json";
-import { plaintext as f } from "@tanstack/highlight/languages/plaintext";
-import { shell as p } from "@tanstack/highlight/languages/shell";
-import { ts as m } from "@tanstack/highlight/languages/ts";
-import { tsx as h } from "@tanstack/highlight/languages/tsx";
-//#region src/integrations/code-highlight/highlighter.ts
-var g = [
-	"tsx",
-	"ts",
-	"css",
-	"shell",
-	"json"
-], _ = [
-	"typescript",
-	"bash",
-	"sh",
-	"zsh",
-	"shellscript",
-	"scss"
-], v = [...g, ..._];
-function y(e) {
-	return v.includes(e);
+import { t as e } from "../chunk-DmhlhrBa.js";
+import { t } from "../meta-CySnRuVp.js";
+import { i as n, n as r, r as i } from "../code-Blo48PGr.js";
+import { jsx as a } from "react/jsx-runtime";
+import { cloneElement as o, useMemo as s } from "react";
+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 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) {
+		let t = new RegExp(n.regex.source, n.regex.flags.includes("g") ? n.regex.flags : `${n.regex.flags}g`), a;
+		for (; (a = t.exec(e)) !== null;) {
+			let e = n.group == null ? a[0] : a[n.group];
+			if (e === "") {
+				a[0] === "" && (t.lastIndex += 1);
+				continue;
+			}
+			let o = n.group == null ? 0 : a[0].indexOf(e), s = a.index + o, c = s + e.length;
+			if (s < c) {
+				let e = !1;
+				for (let t = s; t < c; t += 1) if (i[t]) {
+					e = !0;
+					break;
+				}
+				e || (r.push({
+					start: s,
+					end: c,
+					className: n.className
+				}), i.fill(1, s, c));
+			}
+		}
+	}
+	return r;
+}
+//#endregion
+//#region src/integrations/code-highlight/languages/cmake.ts
+var b = [
+	{
+		className: "string",
+		regex: /"(?:\\.|[^"\\\n])*"|\[(=*)\[[\s\S]*?\]\1\]/g
+	},
+	{
+		className: "comment",
+		regex: /#[^\n]*/g
+	},
+	{
+		className: "variable",
+		regex: /\$(?:ENV|CACHE)?\{[^}\n]+\}/g
+	},
+	{
+		className: "keyword",
+		regex: /\b(?:break|continue|else|elseif|endforeach|endfunction|endif|endmacro|endwhile|if|include|macro|return|while)\b/gi
+	},
+	{
+		className: "literal",
+		regex: /\b(?:FALSE|IGNORE|NOTFOUND|NO|OFF|ON|TRUE|YES)\b/gi
+	},
+	{
+		className: "function",
+		regex: /\b[A-Za-z_][\w-]*(?=\s*\()/g
+	},
+	{
+		className: "number",
+		regex: /\b\d+(?:\.\d+)?\b/g
+	},
+	{
+		className: "operator",
+		regex: /(?:LESS_EQUAL|GREATER_EQUAL|STREQUAL|IN_LIST|MATCHES|EQUAL|LESS|GREATER|AND|OR|NOT|[=<>+*/!-])/gi
+	}
+], x = l({
+	name: "cmake",
+	tokenize(e) {
+		return y(e, b);
+	}
+}), S = [
+	{
+		className: "comment",
+		regex: /\/\/[^\n]*|\/\*[\s\S]*?\*\//g
+	},
+	{
+		className: "string",
+		regex: /"(?:\\.|[^"\\\n])*"|'(?:\\.|[^'\\\n])*'/g
+	},
+	{
+		className: "meta",
+		regex: /^[ \t]*#[ \t]*(?:include|define|if|ifdef|ifndef|elif|else|endif|pragma|undef|error|warning)\b/gm
+	},
+	{
+		className: "keyword",
+		regex: /\b(?:alignas|alignof|and|asm|atomic_cancel|atomic_commit|atomic_noexcept|auto|bitand|bitor|break|case|catch|co_await|co_return|co_yield|class|compl|concept|const|consteval|constexpr|constinit|const_cast|continue|default|delete|do|dynamic_cast|else|enum|explicit|export|extern|for|friend|goto|if|inline|mutable|namespace|new|noexcept|not|operator|or|private|protected|public|reflexpr|register|reinterpret_cast|requires|return|sizeof|static|static_assert|static_cast|struct|switch|synchronized|template|this|thread_local|throw|try|typedef|typeid|typename|union|using|virtual|volatile|while|xor)\b/g
+	},
+	{
+		className: "type",
+		regex: /\b(?:bool|char|char8_t|char16_t|char32_t|double|float|int|long|short|signed|unsigned|void|wchar_t)\b/g
+	},
+	{
+		className: "literal",
+		regex: /\b(?:NULL|nullptr|true|false)\b/g
+	},
+	{
+		className: "function",
+		regex: /\b[A-Za-z_]\w*(?=\s*\()/g
+	},
+	{
+		className: "number",
+		regex: /\b(?:0[xX][\da-fA-F']+|0[bB][01']+|\d[\d']*(?:\.\d[\d']*)?(?:[eE][+-]?\d[\d']*)?[uUlLfF]*)\b/g
+	},
+	{
+		className: "operator",
+		regex: /(?:<<=?|>>=?|->\*|->|\+\+|--|&&|\|\||==|!=|<=|>=|::|\+=|-=|\*=|\/=|%=|&=|\|=|\^=|[-+*/%=&|^!<>?:~])/g
+	}
+], C = l({
+	name: "cpp",
+	aliases: [
+		"c++",
+		"cc",
+		"cxx",
+		"hpp"
+	],
+	tokenize(e) {
+		return y(e, S);
+	}
+}), w = [{
+	className: "function",
+	regex: /\b[A-Za-z_]\w*(?=\s*\()/g
+}], T = l({
+	name: "python",
+	aliases: ["py"],
+	tokenize(e, t) {
+		let n = v.tokenize(e, t), r = y(e, w, n);
+		return [...n, ...r];
+	}
+}), E = {
+	tsx: { aliases: ["typescriptreact"] },
+	ts: { aliases: ["typescript"] },
+	css: { aliases: ["scss"] },
+	shell: { aliases: [
+		"bash",
+		"sh",
+		"zsh",
+		"shellscript"
+	] },
+	json: { aliases: [] },
+	cpp: { aliases: [
+		"c++",
+		"cc",
+		"cxx",
+		"hpp"
+	] },
+	python: { aliases: ["py"] },
+	cmake: { aliases: [] }
+}, D = Object.keys(E), O = [...D, ...Object.values(E).flatMap(({ aliases: e }) => e)];
+function k(e) {
+	return O.includes(e);
+}
+function A(e, t) {
+	return e.aliases.includes(t);
+}
+function j(e) {
+	for (let [t, n] of Object.entries(E)) if (A(n, e)) return t;
+	return e;
 }
-var b = {
-	shellscript: "shell",
-	scss: "css"
-}, x = s({
+var M = c({
 	languages: [
+		_,
+		g,
+		f,
 		h,
-		m,
-		u,
 		p,
-		d,
-		f
+		C,
+		T,
+		x,
+		m
 	],
 	fallbackLanguage: "plaintext"
 });
-function S(e, t) {
-	let n = b[t] ?? t, { tokens: r } = x.tokenize(e, { lang: n });
-	return c(l(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 C = /* @__PURE__ */ e({
-	Block: () => T,
-	Inline: () => E,
+var P = /* @__PURE__ */ e({
+	Block: () => I,
+	Inline: () => L,
 	InlineLink: () => n
 });
-function w(e, t) {
-	return a(() => {
-		if (!(t == null || e === "")) return /* @__PURE__ */ o("span", { dangerouslySetInnerHTML: { __html: S(e, t) } });
+function F(e, t) {
+	return s(() => {
+		if (!(t == null || e === "")) return /* @__PURE__ */ a("span", { dangerouslySetInnerHTML: { __html: N(e, t) } });
 	}, [e, t]);
 }
-function T({ language: e, children: t, ...n }) {
-	let i = w(t, e);
-	return /* @__PURE__ */ o(r, {
+function I({ language: e, children: t, ...n }) {
+	let i = F(t, e);
+	return o(/* @__PURE__ */ a(r, {
 		...n,
 		language: e,
-		highlighted: i,
 		children: t
-	});
+	}), { children: i ?? t });
 }
-T.displayName = "Code.Block";
-function E({ language: e, children: t, ...n }) {
-	let r = w(t, e);
-	return /* @__PURE__ */ o(i, {
+I.displayName = "Code.Block";
+function L({ language: e, children: t, ...n }) {
+	let r = F(t, e);
+	return o(/* @__PURE__ */ a(i, {
 		...n,
-		highlighted: r,
 		children: t
-	});
+	}), { children: r ?? t });
 }
-E.displayName = "Code.Inline";
+L.displayName = "Code.Inline";
 //#endregion
 //#region src/integrations/code-highlight/code-highlight.meta.ts
-var D = {
+var R = {
 	name: "CodeHighlight",
 	category: t.display,
 	status: "experimental",
@@ -94,4 +233,4 @@ var D = {
 	}
 };
 //#endregion
-export { C as Code, g as SUPPORTED_LANGUAGES, D as codeHighlightMeta, y as isSupportedLanguage };
+export { P as Code, D as SUPPORTED_LANGUAGES, R as codeHighlightMeta, k as isSupportedLanguage };

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

@@ -1,7 +1,8 @@
-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-DqBFSqq6.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 { t as e } from "../meta-CySnRuVp.js";
+import { _ as t, a as n, b as r, c as i, d as a, f as o, g as s, h as c, i as l, l as u, n as d, o as f, p, r as m, t as h, u as g, v as _, x as v, y } from "../tabs-CMKvMF4E.js";
+import { cva as b } from "class-variance-authority";
+import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
+import { useId as w, useMemo as T, useState as E } from "react";
 import { useDisplayOptions2d as D, useDisplayOptions3d as O } from "@imfusion/sdk-react";
 var k = {
 	compactStrip: "imf-ui-image-display-options-module-compactStrip",
@@ -71,50 +72,50 @@ 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,
+var I = b(k.root);
+function L({ spec: e, value: n, row: i, onChange: a }) {
+	let o = /* @__PURE__ */ C(_, {
+		value: n,
 		min: e.min,
 		max: e.max,
 		step: e.step,
 		format: e.format,
 		onValueChange: (e) => {
-			o(typeof e == "number" ? e : e[0]);
+			a(typeof e == "number" ? e : e[0]);
 		},
-		children: [/* @__PURE__ */ E(d, {
+		children: [/* @__PURE__ */ C(u, {
 			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__ */ S(t, { children: e.label }), /* @__PURE__ */ S(v, {})]
+		}), /* @__PURE__ */ S(c, { children: /* @__PURE__ */ C(r, { children: [/* @__PURE__ */ S(s, {}), /* @__PURE__ */ S(y, { "aria-label": e.label })] }) })]
 	});
-	return i ? /* @__PURE__ */ T("div", {
+	return i ? /* @__PURE__ */ S("div", {
 		className: k.rowField,
-		children: s
-	}) : s;
+		children: o
+	}) : o;
 }
 function R({ checked: e, row: t, onChange: n }) {
-	let r = x();
-	return /* @__PURE__ */ E(d, {
+	let r = w();
+	return /* @__PURE__ */ C(u, {
 		align: "center",
 		justify: t ? "start" : "between",
 		gap: "2",
 		className: k.invertRow,
-		children: [/* @__PURE__ */ T("span", {
+		children: [/* @__PURE__ */ S("span", {
 			id: r,
 			className: k.invertLabel,
 			children: "Invert"
-		}), /* @__PURE__ */ T(l, {
+		}), /* @__PURE__ */ S(o, {
 			"aria-labelledby": r,
 			checked: e,
 			onCheckedChange: (e) => {
 				n(e);
 			},
-			children: /* @__PURE__ */ T(c, {})
+			children: /* @__PURE__ */ S(p, {})
 		})]
 	});
 }
 function z({ active: e, onChange: t }) {
-	return /* @__PURE__ */ E(s, {
+	return /* @__PURE__ */ C(g, {
 		className: k.segment,
 		"aria-label": "Display dimension",
 		value: [e],
@@ -122,10 +123,10 @@ function z({ active: e, onChange: t }) {
 			let n = e[0];
 			(n === "2d" || n === "3d") && t(n);
 		},
-		children: [/* @__PURE__ */ T(m, {
+		children: [/* @__PURE__ */ S(a, {
 			value: "2d",
 			children: "2D"
-		}), /* @__PURE__ */ T(m, {
+		}), /* @__PURE__ */ S(a, {
 			value: "3d",
 			children: "3D"
 		})]
@@ -133,14 +134,14 @@ function z({ active: e, onChange: t }) {
 }
 function B({ dimension: e, fields: t, options: n, row: r, onChange: i }) {
 	let a = n[e];
-	return /* @__PURE__ */ E(w, { children: [t.map((t) => /* @__PURE__ */ T(L, {
+	return /* @__PURE__ */ C(x, { children: [t.map((t) => /* @__PURE__ */ S(L, {
 		spec: t,
 		value: F(a, t.key),
 		row: r,
 		onChange: (n) => {
 			i(e, P(t.key, n));
 		}
-	}, t.key)), /* @__PURE__ */ T(R, {
+	}, t.key)), /* @__PURE__ */ S(R, {
 		checked: a.invert,
 		row: r,
 		onChange: (t) => {
@@ -148,115 +149,115 @@ 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, ...c }) {
+	let [p, g] = E("2d"), _ = N(r, a), v = (e) => {
+		g(e === "3d" ? "3d" : "2d");
 	};
-	return /* @__PURE__ */ T("div", {
+	return /* @__PURE__ */ S("div", {
 		...c,
 		"data-imf-ui-component": "ImageDisplayOptions",
 		className: I({ className: s }),
-		children: e === "default" ? /* @__PURE__ */ E(i, {
-			value: l,
+		children: e === "default" ? /* @__PURE__ */ C(n, {
+			value: p,
 			onValueChange: v,
-			children: [/* @__PURE__ */ E(f, { children: [
-				/* @__PURE__ */ T(p, {
+			children: [/* @__PURE__ */ C(d, { children: [
+				/* @__PURE__ */ S(f, {
 					value: "2d",
 					children: "2D Slices"
 				}),
-				/* @__PURE__ */ T(p, {
+				/* @__PURE__ */ S(f, {
 					value: "3d",
 					children: "3D Volume"
 				}),
-				/* @__PURE__ */ T(g, {})
-			] }), /* @__PURE__ */ E(u, { children: [/* @__PURE__ */ T(h, {
+				/* @__PURE__ */ S(h, {})
+			] }), /* @__PURE__ */ C(l, { children: [/* @__PURE__ */ S(m, {
 				value: "2d",
-				children: /* @__PURE__ */ T(o, {
+				children: /* @__PURE__ */ S(i, {
 					gap: "3",
-					children: /* @__PURE__ */ T(B, {
+					children: /* @__PURE__ */ S(B, {
 						dimension: "2d",
 						fields: _["2d"],
 						options: t,
 						row: !1,
-						onChange: a
+						onChange: o
 					})
 				})
-			}), /* @__PURE__ */ T(h, {
+			}), /* @__PURE__ */ S(m, {
 				value: "3d",
-				children: /* @__PURE__ */ T(o, {
+				children: /* @__PURE__ */ S(i, {
 					gap: "3",
-					children: /* @__PURE__ */ T(B, {
+					children: /* @__PURE__ */ S(B, {
 						dimension: "3d",
 						fields: _["3d"],
 						options: t,
 						row: !1,
-						onChange: a
+						onChange: o
 					})
 				})
 			})] })]
-		}) : e === "horizontal" ? /* @__PURE__ */ E(i, {
+		}) : e === "horizontal" ? /* @__PURE__ */ C(n, {
 			className: k.horizontalTabs,
 			orientation: "vertical",
-			value: l,
+			value: p,
 			onValueChange: v,
-			children: [/* @__PURE__ */ E(f, {
+			children: [/* @__PURE__ */ C(d, {
 				fill: !0,
 				children: [
-					/* @__PURE__ */ T(p, {
+					/* @__PURE__ */ S(f, {
 						value: "2d",
 						children: "2D"
 					}),
-					/* @__PURE__ */ T(p, {
+					/* @__PURE__ */ S(f, {
 						value: "3d",
 						children: "3D"
 					}),
-					/* @__PURE__ */ T(g, {})
+					/* @__PURE__ */ S(h, {})
 				]
-			}), /* @__PURE__ */ E(u, {
+			}), /* @__PURE__ */ C(l, {
 				className: k.horizontalPanel,
-				children: [/* @__PURE__ */ T(h, {
+				children: [/* @__PURE__ */ S(m, {
 					value: "2d",
-					children: /* @__PURE__ */ T(d, {
+					children: /* @__PURE__ */ S(u, {
 						align: "center",
 						gap: "3",
 						className: k.strip,
-						children: /* @__PURE__ */ T(B, {
+						children: /* @__PURE__ */ S(B, {
 							dimension: "2d",
 							fields: _["2d"],
 							options: t,
 							row: !0,
-							onChange: a
+							onChange: o
 						})
 					})
-				}), /* @__PURE__ */ T(h, {
+				}), /* @__PURE__ */ S(m, {
 					value: "3d",
-					children: /* @__PURE__ */ T(d, {
+					children: /* @__PURE__ */ S(u, {
 						align: "center",
 						gap: "3",
 						className: k.strip,
-						children: /* @__PURE__ */ T(B, {
+						children: /* @__PURE__ */ S(B, {
 							dimension: "3d",
 							fields: _["3d"],
 							options: t,
 							row: !0,
-							onChange: a
+							onChange: o
 						})
 					})
 				})]
 			})]
-		}) : /* @__PURE__ */ E(d, {
+		}) : /* @__PURE__ */ C(u, {
 			align: "center",
 			gap: "3",
 			className: k.compactStrip,
-			children: [/* @__PURE__ */ T(z, {
-				active: l,
-				onChange: m
-			}), /* @__PURE__ */ T(B, {
-				dimension: l,
-				fields: _[l],
+			children: [/* @__PURE__ */ S(z, {
+				active: p,
+				onChange: g
+			}), /* @__PURE__ */ S(B, {
+				dimension: p,
+				fields: _[p],
 				options: t,
 				row: !0,
-				onChange: a
+				onChange: o
 			})]
 		})
 	});
@@ -277,8 +278,8 @@ function H({ data: e, variant: t = "default", ranges: n, ...r }) {
 			level: a.level,
 			invert: a.invert
 		}
-	}, s = S(() => e.minmaxIntensityOriginal(), [e]);
-	return /* @__PURE__ */ T(V, {
+	}, s = T(() => e.minmaxIntensityOriginal(), [e]);
+	return /* @__PURE__ */ S(V, {
 		...r,
 		variant: t,
 		options: o,
@@ -294,7 +295,7 @@ H.displayName = "ImageDisplayOptions";
 //#region src/integrations/image-display-options/image-display-options.meta.ts
 var U = {
 	name: "ImageDisplayOptions",
-	category: t.inputs,
+	category: e.inputs,
 	status: "experimental",
 	description: "A panel or toolbar of controls bound to an image dataset's display options.",
 	origin: "adapted",