@imfusion/web-ui 0.11.1-dev.5.g8a97f4f6 → 0.11.1-dev.52.g8c3c8d4b

package/dist/integrations/code-highlight.js

@@ -1,6 +1,6 @@
-import { r as e } from "../resolve-state-props-DQf9WiGv.js";
+import { t as e } from "../rolldown-runtime-Dy4uBu1J.js";
 import { t } from "../meta-V_KyLeGn.js";
-import { i as n, n as r, r as i } from "../code-NTcddiYk.js";
+import { i as n, n as r, r as i } from "../code-BaLXMEMa.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";

package/dist/integrations/frame-selection.js

@@ -1,5 +1,5 @@
 import { t as e } from "../meta-V_KyLeGn.js";
-import { a as t, i as n, o as r, t as i } from "../slider-Bf274cMe.js";
+import { a as t, i as n, o as r, t as i } from "../slider-CpIZMAFl.js";
 import { t as a } from "../separator-BV2TR8U0.js";
 import { cva as o } from "class-variance-authority";
 import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";

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

@@ -1,7 +1,9 @@
 import { t as e } from "../meta-V_KyLeGn.js";
-import { a as t, c as n, d as r, i, l as a, m as o, n as s, o as c, p as l, r as u, t as d, u as f } from "../tabs-CU46aGud.js";
-import { a as p, i as m, n as h, o as g, r as _, s as v, t as y } from "../slider-Bf274cMe.js";
-import { t as b } from "../scroll-area-z9Lf9uIk.js";
+import { n as t, t as n } from "../toggle-group-eGr6_hgQ.js";
+import { n as r, t as i } from "../row-CImu8yXV.js";
+import { t as a } from "../scroll-area-CXQ_SxPX.js";
+import { a as o, i as s, n as c, o as l, r as u, s as d, t as f } from "../slider-CpIZMAFl.js";
+import { a as p, d as m, i as h, n as g, o as _, r as v, t as y, u as b } from "../tabs-BqgyMmo6.js";
 import { cva as x } from "class-variance-authority";
 import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
 import { useId as T, useMemo as E, useState as D } from "react";
@@ -75,7 +77,7 @@ function I(e, t) {
 //#region src/integrations/image-display-options/image-display-options-view.tsx
 var L = x(A.root);
 function R({ spec: e, value: t, row: n, onChange: r }) {
-	let i = /* @__PURE__ */ w(m, {
+	let a = /* @__PURE__ */ w(s, {
 		value: t,
 		min: e.min,
 		max: e.max,
@@ -84,50 +86,50 @@ function R({ spec: e, value: t, row: n, onChange: r }) {
 		onValueChange: (e) => {
 			r(typeof e == "number" ? e : e[0]);
 		},
-		children: [/* @__PURE__ */ w(a, {
+		children: [/* @__PURE__ */ w(i, {
 			justify: "between",
-			children: [/* @__PURE__ */ C(_, { children: e.label }), /* @__PURE__ */ C(v, {})]
-		}), /* @__PURE__ */ C(y, { children: /* @__PURE__ */ w(g, { children: [/* @__PURE__ */ C(h, {}), /* @__PURE__ */ C(p, { "aria-label": e.label })] }) })]
+			children: [/* @__PURE__ */ C(u, { children: e.label }), /* @__PURE__ */ C(d, {})]
+		}), /* @__PURE__ */ C(f, { children: /* @__PURE__ */ w(l, { children: [/* @__PURE__ */ C(c, {}), /* @__PURE__ */ C(o, { "aria-label": e.label })] }) })]
 	});
 	return n ? /* @__PURE__ */ C("div", {
 		className: A.rowField,
-		children: i
-	}) : i;
+		children: a
+	}) : a;
 }
 function z({ checked: e, row: t, onChange: n }) {
-	let i = T();
-	return /* @__PURE__ */ w(a, {
+	let r = T();
+	return /* @__PURE__ */ w(i, {
 		align: "center",
 		justify: t ? "start" : "between",
 		gap: "2",
 		className: A.invertRow,
 		children: [/* @__PURE__ */ C("span", {
-			id: i,
+			id: r,
 			className: A.invertLabel,
 			children: "Invert"
-		}), /* @__PURE__ */ C(f, {
-			"aria-labelledby": i,
+		}), /* @__PURE__ */ C(b, {
+			"aria-labelledby": r,
 			checked: e,
 			onCheckedChange: (e) => {
 				n(e);
 			},
-			children: /* @__PURE__ */ C(r, {})
+			children: /* @__PURE__ */ C(m, {})
 		})]
 	});
 }
-function B({ active: e, onChange: t }) {
-	return /* @__PURE__ */ w(l, {
+function B({ active: e, onChange: r }) {
+	return /* @__PURE__ */ w(n, {
 		className: A.segment,
 		"aria-label": "Display dimension",
 		value: [e],
 		onValueChange: (e) => {
-			let n = e[0];
-			(n === "2d" || n === "3d") && t(n);
+			let t = e[0];
+			(t === "2d" || t === "3d") && r(t);
 		},
-		children: [/* @__PURE__ */ C(o, {
+		children: [/* @__PURE__ */ C(t, {
 			value: "2d",
 			children: "2D"
-		}), /* @__PURE__ */ C(o, {
+		}), /* @__PURE__ */ C(t, {
 			value: "3d",
 			children: "3D"
 		})]
@@ -150,123 +152,123 @@ function V({ dimension: e, fields: t, options: n, row: r, onChange: i }) {
 		}
 	})] });
 }
-function H({ variant: e = "default", options: r, intensityRange: o, ranges: l, onOptionsChange: f, className: p, ...m }) {
-	let [h, g] = D("2d"), _ = P(o, l), v = (e) => {
-		g(e === "3d" ? "3d" : "2d");
+function H({ variant: e = "default", options: t, intensityRange: n, ranges: o, onOptionsChange: s, className: c, ...l }) {
+	let [u, d] = D("2d"), f = P(n, o), m = (e) => {
+		d(e === "3d" ? "3d" : "2d");
 	};
 	return /* @__PURE__ */ C("div", {
-		...m,
+		...l,
 		"data-imf-ui-component": "ImageDisplayOptions",
-		className: L({ className: p }),
-		children: e === "default" ? /* @__PURE__ */ w(t, {
-			value: h,
-			onValueChange: v,
-			children: [/* @__PURE__ */ w(s, { children: [
-				/* @__PURE__ */ C(c, {
+		className: L({ className: c }),
+		children: e === "default" ? /* @__PURE__ */ w(p, {
+			value: u,
+			onValueChange: m,
+			children: [/* @__PURE__ */ w(g, { children: [
+				/* @__PURE__ */ C(_, {
 					value: "2d",
 					children: "2D Slices"
 				}),
-				/* @__PURE__ */ C(c, {
+				/* @__PURE__ */ C(_, {
 					value: "3d",
 					children: "3D Volume"
 				}),
-				/* @__PURE__ */ C(d, {})
-			] }), /* @__PURE__ */ w(i, { children: [/* @__PURE__ */ C(u, {
+				/* @__PURE__ */ C(y, {})
+			] }), /* @__PURE__ */ w(h, { children: [/* @__PURE__ */ C(v, {
 				value: "2d",
-				children: /* @__PURE__ */ C(n, {
+				children: /* @__PURE__ */ C(r, {
 					gap: "3",
 					children: /* @__PURE__ */ C(V, {
 						dimension: "2d",
-						fields: _["2d"],
-						options: r,
+						fields: f["2d"],
+						options: t,
 						row: !1,
-						onChange: f
+						onChange: s
 					})
 				})
-			}), /* @__PURE__ */ C(u, {
+			}), /* @__PURE__ */ C(v, {
 				value: "3d",
-				children: /* @__PURE__ */ C(n, {
+				children: /* @__PURE__ */ C(r, {
 					gap: "3",
 					children: /* @__PURE__ */ C(V, {
 						dimension: "3d",
-						fields: _["3d"],
-						options: r,
+						fields: f["3d"],
+						options: t,
 						row: !1,
-						onChange: f
+						onChange: s
 					})
 				})
 			})] })]
-		}) : e === "horizontal" ? /* @__PURE__ */ w(t, {
+		}) : e === "horizontal" ? /* @__PURE__ */ w(p, {
 			className: A.horizontalTabs,
 			orientation: "vertical",
-			value: h,
-			onValueChange: v,
-			children: [/* @__PURE__ */ w(s, {
+			value: u,
+			onValueChange: m,
+			children: [/* @__PURE__ */ w(g, {
 				fill: !0,
 				children: [
-					/* @__PURE__ */ C(c, {
+					/* @__PURE__ */ C(_, {
 						value: "2d",
 						children: "2D"
 					}),
-					/* @__PURE__ */ C(c, {
+					/* @__PURE__ */ C(_, {
 						value: "3d",
 						children: "3D"
 					}),
-					/* @__PURE__ */ C(d, {})
+					/* @__PURE__ */ C(y, {})
 				]
-			}), /* @__PURE__ */ w(i, {
+			}), /* @__PURE__ */ w(h, {
 				className: A.horizontalPanel,
-				children: [/* @__PURE__ */ C(u, {
+				children: [/* @__PURE__ */ C(v, {
 					value: "2d",
-					children: /* @__PURE__ */ C(b, {
+					children: /* @__PURE__ */ C(a, {
 						orientation: "horizontal",
 						className: A.strip,
-						children: /* @__PURE__ */ C(a, {
+						children: /* @__PURE__ */ C(i, {
 							align: "center",
 							gap: "3",
 							children: /* @__PURE__ */ C(V, {
 								dimension: "2d",
-								fields: _["2d"],
-								options: r,
+								fields: f["2d"],
+								options: t,
 								row: !0,
-								onChange: f
+								onChange: s
 							})
 						})
 					})
-				}), /* @__PURE__ */ C(u, {
+				}), /* @__PURE__ */ C(v, {
 					value: "3d",
-					children: /* @__PURE__ */ C(b, {
+					children: /* @__PURE__ */ C(a, {
 						orientation: "horizontal",
 						className: A.strip,
-						children: /* @__PURE__ */ C(a, {
+						children: /* @__PURE__ */ C(i, {
 							align: "center",
 							gap: "3",
 							children: /* @__PURE__ */ C(V, {
 								dimension: "3d",
-								fields: _["3d"],
-								options: r,
+								fields: f["3d"],
+								options: t,
 								row: !0,
-								onChange: f
+								onChange: s
 							})
 						})
 					})
 				})]
 			})]
-		}) : /* @__PURE__ */ C(b, {
+		}) : /* @__PURE__ */ C(a, {
 			orientation: "horizontal",
 			className: A.strip,
-			children: /* @__PURE__ */ w(a, {
+			children: /* @__PURE__ */ w(i, {
 				align: "center",
 				gap: "3",
 				children: [/* @__PURE__ */ C(B, {
-					active: h,
-					onChange: g
+					active: u,
+					onChange: d
 				}), /* @__PURE__ */ C(V, {
-					dimension: h,
-					fields: _[h],
-					options: r,
+					dimension: u,
+					fields: f[u],
+					options: t,
 					row: !0,
-					onChange: f
+					onChange: s
 				})]
 			})
 		})

package/dist/integrations/layout-mode/index.d.ts

@@ -0,0 +1,2 @@
+export { LayoutMode } from './layout-mode';
+export { layoutModeMeta } from './layout-mode.meta';

package/dist/integrations/layout-mode/layout-mode-view.d.ts

@@ -0,0 +1,32 @@
+import { VariantProps } from 'class-variance-authority';
+import { ToggleGroup } from '../../components/toggle-group';
+declare const layoutMode: (props?: ({
+    variant?: "compact" | "labeled" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+/** The SDK's `DisplayLayoutMode`, restated so the view stays free of SDK imports. */
+type Mode = "Auto" | "Rows" | "FocusPlusStack" | "FocusPlusRows";
+type LayoutModeViewProps = Omit<React.ComponentProps<typeof ToggleGroup>, "value" | "defaultValue" | "onValueChange" | "multiple" | "children"> & VariantProps<typeof layoutMode> & {
+    /** The pressed layout mode. */
+    mode: Mode;
+    /** Called with the mode the user picks. */
+    onModeChange: (mode: Mode) => void;
+    /** Accessible name of the group. */
+    label?: string;
+    /** Name of the toggle that lets the viewer choose between Rows and Focus + stack. */
+    autoLabel?: string;
+    /** Name of the toggle that arranges the views in up to two rows. */
+    rowsLabel?: string;
+    /** Name of the toggle that shows one large view with the others stacked beside it. */
+    focusPlusStackLabel?: string;
+    /** Name of the toggle that shows one large view with the others in rows beside it. */
+    focusPlusRowsLabel?: string;
+};
+/**
+ * LayoutModeView - the SDK-free presentational surface behind `LayoutMode`:
+ * the same toggles, driven by plain props instead of the viewer's layout mode.
+ */
+export declare function LayoutModeView({ mode, onModeChange, variant, label, autoLabel, rowsLabel, focusPlusStackLabel, focusPlusRowsLabel, orientation, className, ...props }: LayoutModeViewProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace LayoutModeView {
+    var displayName: string;
+}
+export {};

package/dist/integrations/layout-mode/layout-mode.d.ts

@@ -0,0 +1,13 @@
+import { LayoutModeView } from './layout-mode-view';
+type Props = Omit<React.ComponentProps<typeof LayoutModeView>, "mode" | "onModeChange">;
+/**
+ * LayoutMode - picks the ImFusion viewer's layout mode: Auto, Rows, Focus + stack, or Focus + rows.
+ * `compact` is a row of icon toggles; `labeled` stacks them vertically with each mode's name beside its icon.
+ *
+ * Must render inside `ImFusionReady`, within an `ImFusionProvider`.
+ */
+export declare function LayoutMode(props: Props): import("react/jsx-runtime").JSX.Element;
+export declare namespace LayoutMode {
+    var displayName: string;
+}
+export {};

package/dist/integrations/layout-mode/layout-mode.meta.d.ts

@@ -0,0 +1,2 @@
+import { ComponentMeta } from '../../types/meta';
+export declare const layoutModeMeta: ComponentMeta;

package/dist/integrations/layout-mode.js

@@ -0,0 +1,103 @@
+import { Qh as e, Xh as t, Zh as n, _M as r, tg as i } from "../icons-vc1WZCxX.js";
+import { t as a } from "../meta-V_KyLeGn.js";
+import { n as o, t as s } from "../toggle-group-eGr6_hgQ.js";
+import { a as c } from "../utils-J6vbjIt1.js";
+import "../toggle-group-Bhb3qicp.js";
+import { cva as l } from "class-variance-authority";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { useLayoutMode as f } from "@imfusion/sdk-react";
+var p = {
+	labeled: "imf-ui-layout-mode-module-labeled",
+	root: "imf-ui-layout-mode-module-root",
+	toggle: "imf-ui-layout-mode-module-toggle"
+}, m = l(p.root, { variants: { variant: {
+	compact: null,
+	labeled: p.labeled
+} } }), h = [
+	{
+		mode: "Auto",
+		glyph: t
+	},
+	{
+		mode: "Rows",
+		glyph: i
+	},
+	{
+		mode: "FocusPlusStack",
+		glyph: e
+	},
+	{
+		mode: "FocusPlusRows",
+		glyph: n
+	}
+];
+function g(e) {
+	return h.some((t) => t.mode === e);
+}
+function _({ mode: e, onModeChange: t, variant: n = "compact", label: i = "Layout", autoLabel: a = "Auto", rowsLabel: l = "Rows", focusPlusStackLabel: f = "Focus + stack", focusPlusRowsLabel: _ = "Focus + rows", orientation: v = "horizontal", className: y, ...b }) {
+	let x = {
+		Auto: a,
+		Rows: l,
+		FocusPlusStack: f,
+		FocusPlusRows: _
+	}, S = n === "labeled";
+	function C(e) {
+		g(e[0]) && t(e[0]);
+	}
+	return /* @__PURE__ */ u(s, {
+		"aria-label": i,
+		...b,
+		orientation: S ? "vertical" : v,
+		className: (e) => m({
+			variant: n,
+			className: c(y, e)
+		}),
+		value: [e],
+		onValueChange: C,
+		children: h.map(({ mode: e, glyph: t }) => /* @__PURE__ */ d(o, {
+			value: e,
+			"aria-label": S ? void 0 : x[e],
+			className: p.toggle,
+			children: [/* @__PURE__ */ u(r, {
+				glyph: t,
+				size: 16,
+				"aria-hidden": !0
+			}), S && x[e]]
+		}, e))
+	});
+}
+_.displayName = "LayoutModeView";
+//#endregion
+//#region src/integrations/layout-mode/layout-mode.tsx
+function v(e) {
+	let { mode: t, setMode: n } = f();
+	return /* @__PURE__ */ u(_, {
+		...e,
+		mode: t,
+		onModeChange: n
+	});
+}
+v.displayName = "LayoutMode";
+//#endregion
+//#region src/integrations/layout-mode/layout-mode.meta.ts
+var y = {
+	name: "LayoutMode",
+	category: a.inputs,
+	status: "experimental",
+	description: "Picker bound to the ImFusion viewer's layout mode: Auto, Rows, Focus + stack, or Focus + rows, as a compact icon row or a labeled vertical list. Also called a layout or view arrangement switch; for a segmented choice not tied to the SDK, use ToggleGroup.",
+	origin: "adapted",
+	internalDependencies: [
+		"ToggleGroup",
+		"Toggle",
+		"Icon"
+	],
+	upstream: {
+		name: "ImFusion Web SDK",
+		websiteLink: "https://www.imfusion.com/",
+		docLink: "https://docs.imfusion.com/",
+		llmDocLink: "https://docs.imfusion.com/",
+		runtimeDependencies: ["@imfusion/sdk", "@imfusion/sdk-react"]
+	}
+};
+//#endregion
+export { v as LayoutMode, y as layoutModeMeta };

package/dist/integrations/view-tools/index.d.ts

@@ -0,0 +1,4 @@
+export { useViewInteraction } from './use-view-interaction';
+export { ViewTools } from './view-tools';
+export type { ViewToolAction } from './view-tools-view';
+export { viewToolsMeta } from './view-tools.meta';

package/dist/integrations/view-tools/use-view-interaction.d.ts

@@ -0,0 +1,21 @@
+import { SliceViewDefaultEventHandler } from '@imfusion/sdk';
+import { ViewToolAction } from './view-tools-view';
+type InteractiveView = {
+    defaultEventHandler(): Pick<SliceViewDefaultEventHandler, "limitViewInteractionTo" | "restoreDefaultInputMapping"> | null;
+};
+export declare function createViewInteractionStore(views: () => InteractiveView[]): {
+    getViewInteraction: () => ViewToolAction;
+    subscribe: (listener: () => void) => () => boolean;
+    setViewInteraction: (next: ViewToolAction) => void;
+};
+/**
+ * useViewInteraction - the tool that limits the left mouse button in the main 2D and MPR views, shared by every caller
+ * and by `ViewTools`. `setViewInteraction("Default")` restores the default input mapping.
+ *
+ * Must run inside `ImFusionReady`, within an `ImFusionProvider`. Needs `@imfusion/sdk` 1.3.0 or later.
+ */
+export declare function useViewInteraction(): {
+    viewInteraction: ViewToolAction;
+    setViewInteraction: (next: ViewToolAction) => void;
+};
+export {};

package/dist/integrations/view-tools/view-tools-view.d.ts

@@ -0,0 +1,23 @@
+import { SliceViewAction } from '@imfusion/sdk';
+type ViewTool = Extract<SliceViewAction, "Pan" | "Zoom" | "Windowing">;
+/** `Default` restores the SDK's full input mapping; every other value limits the left mouse button to that action. */
+export type ViewToolAction = "Default" | ViewTool;
+type ViewToolsViewProps = React.ComponentProps<"div"> & {
+    /** The active tool, or `"Default"` when none is pressed. */
+    viewInteraction: ViewToolAction;
+    /** Called with the pressed tool, or `"Default"` when the active tool is pressed again. */
+    onViewInteractionChange: (viewInteraction: ViewToolAction) => void;
+    /** Called when the reset button is pressed. */
+    onReset: () => void;
+    /** Lays the tools out in a row or a column. */
+    orientation?: "horizontal" | "vertical";
+};
+/**
+ * ViewToolsView - the SDK-free presentational surface behind `ViewTools`:
+ * the same toggles and reset button, driven by plain props instead of the SDK views.
+ */
+export declare function ViewToolsView({ viewInteraction, onViewInteractionChange, onReset, orientation, "aria-label": ariaLabel, className, ...props }: ViewToolsViewProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ViewToolsView {
+    var displayName: string;
+}
+export {};

package/dist/integrations/view-tools/view-tools.d.ts

@@ -0,0 +1,14 @@
+import { ViewToolsView } from './view-tools-view';
+type Props = Omit<React.ComponentProps<typeof ViewToolsView>, "viewInteraction" | "onViewInteractionChange" | "onReset">;
+/**
+ * ViewTools - Pan, Zoom, and Windowing toggles that limit the left mouse button in the main 2D and MPR views to one
+ * action, and a button that resets the view group. Releasing the active toggle restores the default input mapping.
+ * The active tool is the one `useViewInteraction` reads and sets.
+ *
+ * Must render inside `ImFusionReady`, within an `ImFusionProvider`. Needs `@imfusion/sdk` 1.3.0 or later.
+ */
+export declare function ViewTools(props: Props): import("react/jsx-runtime").JSX.Element;
+export declare namespace ViewTools {
+    var displayName: string;
+}
+export {};

package/dist/integrations/view-tools/view-tools.meta.d.ts

@@ -0,0 +1,2 @@
+import { ComponentMeta } from '../../types/meta';
+export declare const viewToolsMeta: ComponentMeta;

package/dist/integrations/view-tools.js

@@ -0,0 +1,133 @@
+import { _M as e, ek as t, fM as n, hl as r, vC as i } from "../icons-vc1WZCxX.js";
+import { t as a } from "../meta-V_KyLeGn.js";
+import { n as o, t as s } from "../toggle-group-eGr6_hgQ.js";
+import { n as c } from "../icon-button-roSB497o.js";
+import { n as l, t as u } from "../row-CImu8yXV.js";
+import { cva as d } from "class-variance-authority";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { useSyncExternalStore as m } from "react";
+import { useImFusion as h } from "@imfusion/sdk-react";
+//#region src/integrations/view-tools/use-view-interaction.ts
+function g(e) {
+	return [
+		e.display.main2dView(),
+		e.display.mainAxialView(),
+		e.display.mainCoronalView(),
+		e.display.mainSagittalView()
+	];
+}
+function _(e) {
+	let t = "Default", n = /* @__PURE__ */ new Set();
+	return {
+		getViewInteraction: () => t,
+		subscribe: (e) => (n.add(e), () => n.delete(e)),
+		setViewInteraction: (r) => {
+			if (r !== t) {
+				t = r;
+				for (let t of e()) {
+					let e = t.defaultEventHandler();
+					r === "Default" ? e?.restoreDefaultInputMapping() : e?.limitViewInteractionTo(r);
+				}
+				for (let e of n) e();
+			}
+		}
+	};
+}
+var v = /* @__PURE__ */ new WeakMap();
+function y(e) {
+	let t = v.get(e);
+	return t || (t = _(() => g(e)), v.set(e, t)), t;
+}
+function b() {
+	let { getViewInteraction: e, subscribe: t, setViewInteraction: n } = y(h());
+	return {
+		viewInteraction: m(t, e),
+		setViewInteraction: n
+	};
+}
+//#endregion
+//#region src/integrations/view-tools/view-tools-view.tsx
+var x = d({ root: "imf-ui-view-tools-module-root" }.root), S = {
+	Pan: r,
+	Zoom: n,
+	Windowing: t
+};
+function C(e) {
+	return typeof e == "string" && Object.hasOwn(S, e);
+}
+function w({ viewInteraction: t, onViewInteractionChange: n, onReset: r, orientation: a = "horizontal", "aria-label": d = "View tools", className: m, ...h }) {
+	let g = a === "vertical" ? l : u;
+	return /* @__PURE__ */ f("div", {
+		role: "group",
+		"aria-label": d,
+		...h,
+		"data-imf-ui-component": "ViewTools",
+		"data-orientation": a,
+		className: x({ className: m }),
+		children: /* @__PURE__ */ p(g, {
+			gap: "2",
+			align: "center",
+			children: [/* @__PURE__ */ f(s, {
+				orientation: a,
+				value: t === "Default" ? [] : [t],
+				onValueChange: (e) => {
+					n(C(e[0]) ? e[0] : "Default");
+				},
+				children: Object.entries(S).map(([t, n]) => /* @__PURE__ */ f(o, {
+					value: t,
+					"aria-label": t,
+					children: /* @__PURE__ */ f(e, {
+						glyph: n,
+						"aria-hidden": !0
+					})
+				}, t))
+			}), /* @__PURE__ */ f(c, {
+				glyph: i,
+				label: "Reset view",
+				variant: "ghost",
+				onClick: r
+			})]
+		})
+	});
+}
+w.displayName = "ViewToolsView";
+//#endregion
+//#region src/integrations/view-tools/view-tools.tsx
+function T(e) {
+	let t = h(), { viewInteraction: n, setViewInteraction: r } = b();
+	return /* @__PURE__ */ f(w, {
+		...e,
+		viewInteraction: n,
+		onViewInteractionChange: r,
+		onReset: () => {
+			t.display.viewGroup().reset();
+		}
+	});
+}
+T.displayName = "ViewTools";
+//#endregion
+//#region src/integrations/view-tools/view-tools.meta.ts
+var E = {
+	name: "ViewTools",
+	category: a.inputs,
+	status: "experimental",
+	description: "Toolbar that limits mouse interaction in the ImFusion main 2D and MPR views to pan, zoom, or windowing, with a reset button for the view group. For a segmented control not tied to the SDK, use ToggleGroup.",
+	origin: "adapted",
+	internalDependencies: [
+		"ToggleGroup",
+		"Toggle",
+		"Icon",
+		"IconButton",
+		"Row",
+		"Stack"
+	],
+	upstream: {
+		name: "ImFusion Web SDK",
+		websiteLink: "https://www.imfusion.com/",
+		docLink: "https://docs.imfusion.com/",
+		llmDocLink: "https://docs.imfusion.com/",
+		runtimeDependencies: ["@imfusion/sdk", "@imfusion/sdk-react"]
+	}
+};
+//#endregion
+export { T as ViewTools, b as useViewInteraction, E as viewToolsMeta };

package/dist/{resolve-state-props-DQf9WiGv.js → rolldown-runtime-Dy4uBu1J.js}

@@ -8,15 +8,4 @@ var e = Object.defineProperty, t = (t, n) => {
 	return n || e(r, Symbol.toStringTag, { value: "Module" }), r;
 };
 //#endregion
-//#region src/utils/resolve-state-props.ts
-function n(e, t) {
-	return e instanceof Function ? e(t) : e;
-}
-function r(e, t) {
-	return n(e, t);
-}
-function i(e, t) {
-	return n(e, t);
-}
-//#endregion
-export { i as n, t as r, r as t };
+export { t };