cloudmr-ux 4.3.0 → 4.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -28,6 +28,11 @@ export interface NiivueSlicePositionProps {
|
|
|
28
28
|
* Comes from Niivue's `onLocationChange` data.
|
|
29
29
|
*/
|
|
30
30
|
mms: number[];
|
|
31
|
+
/**
|
|
32
|
+
* Heading displayed above the sliders.
|
|
33
|
+
* @default "Slice Position"
|
|
34
|
+
*/
|
|
35
|
+
title?: string;
|
|
31
36
|
/**
|
|
32
37
|
* CSS accent color for all three range inputs.
|
|
33
38
|
* @default "#580f8b"
|
|
@@ -63,5 +68,5 @@ export interface NiivueSlicePositionProps {
|
|
|
63
68
|
* <NiivueSlicePosition nv={nv} mins={mins} maxs={maxs} mms={mms} />
|
|
64
69
|
* ```
|
|
65
70
|
*/
|
|
66
|
-
export declare function NiivueSlicePosition({ nv, mins, maxs, mms, accentColor, style, className, }: NiivueSlicePositionProps): import("react/jsx-runtime").JSX.Element;
|
|
71
|
+
export declare function NiivueSlicePosition({ nv, mins, maxs, mms, title, accentColor, style, className, }: NiivueSlicePositionProps): import("react/jsx-runtime").JSX.Element;
|
|
67
72
|
export default NiivueSlicePosition;
|
|
@@ -11,6 +11,7 @@ var __assign = (this && this.__assign) || function () {
|
|
|
11
11
|
};
|
|
12
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
13
|
import React from "react";
|
|
14
|
+
import { Card, CardContent } from "@mui/material";
|
|
14
15
|
import CmrLabel from "../label/Label";
|
|
15
16
|
// ─── Helpers (pure, no React) ─────────────────────────────────────────────────
|
|
16
17
|
var safeSpan = function (min, max) { return Math.max(1e-9, max - min); };
|
|
@@ -46,7 +47,7 @@ var round3 = function (v) { return Math.round(v * 1000) / 1000; };
|
|
|
46
47
|
*/
|
|
47
48
|
export function NiivueSlicePosition(_a) {
|
|
48
49
|
var _b, _c, _d, _e, _f;
|
|
49
|
-
var nv = _a.nv, mins = _a.mins, maxs = _a.maxs, mms = _a.mms, _g = _a.accentColor, accentColor =
|
|
50
|
+
var nv = _a.nv, mins = _a.mins, maxs = _a.maxs, mms = _a.mms, _g = _a.title, title = _g === void 0 ? "Slice Position" : _g, _h = _a.accentColor, accentColor = _h === void 0 ? "#580f8b" : _h, style = _a.style, className = _a.className;
|
|
50
51
|
// ── Derive voxel grid from the loaded volume ─────────────────────────────
|
|
51
52
|
var vol = (_b = nv === null || nv === void 0 ? void 0 : nv.volumes) === null || _b === void 0 ? void 0 : _b[0];
|
|
52
53
|
var meta = (_c = vol === null || vol === void 0 ? void 0 : vol.getImageMetadata) === null || _c === void 0 ? void 0 : _c.call(vol);
|
|
@@ -76,7 +77,7 @@ export function NiivueSlicePosition(_a) {
|
|
|
76
77
|
zAtStart = nv.frac2mm([cx, cy, 0.5 / nz])[2];
|
|
77
78
|
zAtEnd = nv.frac2mm([cx, cy, (nz - 0.5) / nz])[2];
|
|
78
79
|
}
|
|
79
|
-
catch (
|
|
80
|
+
catch (_j) {
|
|
80
81
|
var s = safeSpan(mins[2], maxs[2]) / nz;
|
|
81
82
|
zAtStart = mins[2] + 0.5 * s;
|
|
82
83
|
zAtEnd = maxs[2] - 0.5 * s;
|
|
@@ -127,9 +128,9 @@ export function NiivueSlicePosition(_a) {
|
|
|
127
128
|
}
|
|
128
129
|
};
|
|
129
130
|
// ── Local slider state (mirrors mms; synced by useEffect) ────────────────
|
|
130
|
-
var
|
|
131
|
-
var
|
|
132
|
-
var
|
|
131
|
+
var _k = React.useState(round3(mms[0])), xVal = _k[0], setXVal = _k[1];
|
|
132
|
+
var _l = React.useState(round3(mms[1])), yVal = _l[0], setYVal = _l[1];
|
|
133
|
+
var _m = React.useState(round3(mms[2])), zVal = _m[0], setZVal = _m[1];
|
|
133
134
|
// Keep a ref so snapToVoxel can read the *latest* values without stale closure
|
|
134
135
|
var mmsRef = React.useRef([xVal, yVal, zVal]);
|
|
135
136
|
React.useEffect(function () {
|
|
@@ -207,7 +208,7 @@ export function NiivueSlicePosition(_a) {
|
|
|
207
208
|
try {
|
|
208
209
|
fracZ = nv.mm2frac([xVal, yVal, zVal])[2];
|
|
209
210
|
}
|
|
210
|
-
catch (
|
|
211
|
+
catch (_o) {
|
|
211
212
|
fracZ = ratioAxis(zVal, 2);
|
|
212
213
|
}
|
|
213
214
|
zSliceIndex = clamp(Math.round(fracZ * nz - 0.5), 0, nz - 1);
|
|
@@ -231,24 +232,24 @@ export function NiivueSlicePosition(_a) {
|
|
|
231
232
|
accentColor: accentColor
|
|
232
233
|
};
|
|
233
234
|
// ── Render ────────────────────────────────────────────────────────────────
|
|
234
|
-
return (_jsxs("div", __assign({ style: __assign({
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
235
|
+
return (_jsxs("div", __assign({ style: style, className: className }, { children: [title !== "" && (_jsx("div", __assign({ className: "title", style: { width: "100%" } }, { children: title }))), _jsx(Card, __assign({ variant: "outlined", sx: { mb: 2, borderTopLeftRadius: 0, borderTopRightRadius: 0 } }, { children: _jsx(CardContent, { children: _jsxs("div", __assign({ style: { display: "flex", flexDirection: "column" } }, { children: [_jsxs("div", __assign({ style: { marginBottom: 20 } }, { children: [_jsxs("div", __assign({ style: rowStyle }, { children: [_jsx(CmrLabel, { children: "X:" }), _jsx("input", { type: "number", value: xVal.toFixed(3), min: sliderMinX, max: sliderMaxX, step: stepX, style: inputStyle, onChange: function (e) {
|
|
236
|
+
var next = Number(e.target.value);
|
|
237
|
+
if (Number.isFinite(next))
|
|
238
|
+
applyX(next);
|
|
239
|
+
}, onBlur: function (e) {
|
|
240
|
+
applyX(clamp(Number(e.target.value), sliderMinX, sliderMaxX));
|
|
241
|
+
} })] })), _jsx("input", { id: "xSlice", type: "range", min: sliderMinX, max: sliderMaxX, step: stepX, value: clamp(xVal, sliderMinX, sliderMaxX), style: sliderStyle, onChange: function (e) { return applyX(Number(e.target.value)); } })] })), _jsxs("div", __assign({ style: { marginBottom: 20 } }, { children: [_jsxs("div", __assign({ style: rowStyle }, { children: [_jsx(CmrLabel, { children: "Y:" }), _jsx("input", { type: "number", value: yVal.toFixed(3), min: sliderMinY, max: sliderMaxY, step: stepY, style: inputStyle, onChange: function (e) {
|
|
242
|
+
var next = Number(e.target.value);
|
|
243
|
+
if (Number.isFinite(next))
|
|
244
|
+
applyY(next);
|
|
245
|
+
}, onBlur: function (e) {
|
|
246
|
+
applyY(clamp(Number(e.target.value), sliderMinY, sliderMaxY));
|
|
247
|
+
} })] })), _jsx("input", { id: "ySlice", type: "range", min: sliderMinY, max: sliderMaxY, step: stepY, value: clamp(yVal, sliderMinY, sliderMaxY), style: sliderStyle, onChange: function (e) { return applyY(Number(e.target.value)); } })] })), _jsxs("div", { children: [_jsxs("div", __assign({ style: rowStyle }, { children: [_jsx(CmrLabel, { children: "Z:" }), _jsx("input", { type: "number", value: zVal.toFixed(3), min: sliderMinZ, max: sliderMaxZ, step: stepZ, style: inputStyle, onChange: function (e) {
|
|
248
|
+
var next = Number(e.target.value);
|
|
249
|
+
if (Number.isFinite(next))
|
|
250
|
+
applyZ(next);
|
|
251
|
+
}, onBlur: function (e) {
|
|
252
|
+
applyZ(clamp(Number(e.target.value), sliderMinZ, sliderMaxZ));
|
|
253
|
+
} })] })), _jsx("input", { id: "zSlice", type: "range", min: 0, max: Math.max(0, nz - 1), step: 1, value: zSliceIndex, style: sliderStyle, onChange: function (e) { return applyZBySliceIndex(Number(e.target.value)); } })] })] })) }) }))] })));
|
|
253
254
|
}
|
|
254
255
|
export default NiivueSlicePosition;
|