cloudmr-ux 4.5.9 → 4.6.1

package/dist/CmrComponents/niivue-roi-histogram/resampleNiivueRoiHistogram.js

@@ -117,7 +117,7 @@ export function resampleNiivueRoiHistogram(options) {
             x: roi.sample,
             type: "histogram",
             name: roi.alias,
-            opacity: roi.visibility ? 0.5 : 0.1,
+            opacity: roi.visibility ? 0.5 : 0,
             marker: {
                 color: roi.color
             },

package/dist/CmrComponents/niivue-viewer/CloudMrNiivuePanel.js

@@ -186,7 +186,7 @@ export function CloudMrNiivuePanel(props) {
                                     left: 0,
                                     width: "100%",
                                     height: "100%"
-                                } }), props.shapeDraft && (_jsx(ShapeDraftOverlay, { nv: props.nv, draft: props.shapeDraft, onDraftChange: props.onShapeDraftChange, overlayKey: props.mms })), props.penDraft && (_jsx(PenDraftOverlay, { nv: props.nv, draft: props.penDraft, onDraftChange: props.onPenDraftChange, overlayKey: props.mms }))] }))] })), _jsxs(Box, __assign({ sx: {
+                                } }), props.shapeDraft && (_jsx(ShapeDraftOverlay, { nv: props.nv, draft: props.shapeDraft, onDraftChange: props.onShapeDraftChange, onApplyDraft: props.onApplyShapeDraft, overlayKey: props.mms })), props.penDraft && (_jsx(PenDraftOverlay, { nv: props.nv, draft: props.penDraft, onDraftChange: props.onPenDraftChange, onApplyDraft: props.onApplyPenDraft, overlayKey: props.mms }))] }))] })), _jsxs(Box, __assign({ sx: {
                     width: {
                         xs: "100%",
                         md: "35%"

package/dist/CmrComponents/niivue-viewer/CloudMrNiivueViewer.js

@@ -961,32 +961,6 @@ export default function CloudMrNiivueViewer(props) {
     React.useEffect(function () {
         nv._cloudMrShapeDraftActive = shapeDraft != null;
     }, [shapeDraft]);
-    React.useEffect(function () {
-        if (!shapeDraft && !penDraft) {
-            return undefined;
-        }
-        var canvas = document.getElementById("niiCanvas");
-        if (!canvas) {
-            return undefined;
-        }
-        var applyOnRightClick = function (event) {
-            var _a;
-            event.preventDefault();
-            event.stopPropagation();
-            (_a = nv.onApplyActiveDraft) === null || _a === void 0 ? void 0 : _a.call(nv);
-        };
-        var onMouseDown = function (event) {
-            if (event.button === 2) {
-                applyOnRightClick(event);
-            }
-        };
-        canvas.addEventListener("mousedown", onMouseDown, true);
-        canvas.addEventListener("contextmenu", applyOnRightClick, true);
-        return function () {
-            canvas.removeEventListener("mousedown", onMouseDown, true);
-            canvas.removeEventListener("contextmenu", applyOnRightClick, true);
-        };
-    }, [shapeDraft, penDraft]);
     React.useEffect(function () {
         if (!shapeDraft && !penDraft) {
             return undefined;
@@ -1000,16 +974,6 @@ export default function CloudMrNiivueViewer(props) {
                 else if (penDraft) {
                     cancelPenDraftHandler();
                 }
-                return;
-            }
-            if (event.key === "Enter") {
-                event.preventDefault();
-                if (shapeDraft) {
-                    applyShapeDraft();
-                }
-                else if (penDraft) {
-                    applyPenDraftHandler();
-                }
             }
         };
         window.addEventListener("keydown", onKeyDown);

package/dist/CmrComponents/niivue-viewer/NiivuePatcher.js

@@ -4,9 +4,12 @@
 import { Niivue, NVImage, NVImageFromUrlOptions } from "@niivue/niivue";
 import {
   captureDeferredShapeDraft,
+  captureShapeDraftFromClick,
   isDraftTooSmall,
+  redrawDraftShape,
   shouldDeferShapeCommit,
 } from "./shapeDraftUtils.js";
+import { NI_PEN_TYPE } from "./niivuePenType.js";
 import {
   addPolylineVertex,
   axCorSagFromMouse,
@@ -1465,29 +1468,41 @@ Niivue.prototype.cloudMrResetPolyline = function cloudMrResetPolyline() {
   resetPolylineState(this);
 };
 
-const RIGHT_MOUSE_BUTTON = 2;
-
 function cloudMrHasApplyableDraft(nv) {
   return !!(nv._cloudMrShapeDraftActive || nv._cloudMrPenDraftActive);
 }
 
-function cloudMrTryApplyDraftOnRightClick(nv, event) {
-  if (!cloudMrHasApplyableDraft(nv)) {
+/**
+ * When no draft is active and the user clicks an existing ROI voxel while the
+ * rectangle or ellipse tool is selected, reconstruct a ShapeDraft from the
+ * clicked cluster so the bounding-box overlay reappears for re-editing.
+ */
+function cloudMrTryReopenShapeDraftOnClick(nv) {
+  const penType = nv.opts.penType;
+  if (
+    !nv.opts.deferShapeCommit ||
+    !nv.opts.drawingEnabled ||
+    nv._cloudMrShapeDraftActive ||
+    nv._cloudMrPenDraftActive ||
+    !isClickWithoutDrag(nv.uiData) ||
+    (penType !== NI_PEN_TYPE.RECTANGLE && penType !== NI_PEN_TYPE.ELLIPSE)
+  ) {
     return false;
   }
-  event.preventDefault();
-  event.stopPropagation();
-  if (typeof nv.onApplyActiveDraft === "function") {
-    nv.onApplyActiveDraft();
+
+  const reopenDraft = captureShapeDraftFromClick(nv);
+  if (!reopenDraft) return false;
+
+  redrawDraftShape(nv, reopenDraft);
+  nv._cloudMrSuppressDrawingChangedMouseUp = true;
+  if (typeof nv.onShapeDraftReady === "function") {
+    nv.onShapeDraftReady(reopenDraft);
   }
   return true;
 }
 
 const _mouseDownListener = Niivue.prototype.mouseDownListener;
 Niivue.prototype.mouseDownListener = function cloudMrMouseDownListener(e) {
-  if (e.button === RIGHT_MOUSE_BUTTON && cloudMrTryApplyDraftOnRightClick(this, e)) {
-    return;
-  }
   if (shouldDeferFreehandCommit(this) && this.drawBitmap) {
     this._cloudMrFreehandSessionStartBitmap = this.drawBitmap.slice();
     this._cloudMrFreehandAxCorSag = -1;
@@ -1556,12 +1571,16 @@ Niivue.prototype.mouseUpListener = function cloudMrMouseUpListener() {
   }
 
   if (!pendingDraft?.baseBitmap) {
+    // No new draft drawn — check if user clicked an existing ROI to re-edit it
+    cloudMrTryReopenShapeDraftOnClick(this);
     return;
   }
   if (isDraftTooSmall(pendingDraft.ptA, pendingDraft.ptB)) {
     this.drawBitmap.set(pendingDraft.baseBitmap);
     this.refreshDrawing(true, false);
     this.drawScene();
+    // Tiny drag treated as a click — also try to reopen an existing ROI
+    cloudMrTryReopenShapeDraftOnClick(this);
     return;
   }
   this._cloudMrSuppressDrawingChangedMouseUp = true;

package/dist/CmrComponents/niivue-viewer/PenDraftOverlay.d.ts

@@ -1,10 +1,12 @@
 /**
  * Adjust handles for polyline (vertex drag) or freehand (move only) drafts.
+ * @param {{ nv: any, draft: any, onDraftChange: (d: any) => void, onApplyDraft?: () => void, overlayKey?: unknown }} props
  */
-export function PenDraftOverlay({ nv, draft, onDraftChange, overlayKey }: {
+export function PenDraftOverlay({ nv, draft, onDraftChange, onApplyDraft, overlayKey }: {
     nv: any;
     draft: any;
-    onDraftChange: any;
-    overlayKey: any;
+    onDraftChange: (d: any) => void;
+    onApplyDraft?: (() => void) | undefined;
+    overlayKey?: unknown;
 }): import("react/jsx-runtime").JSX.Element | null;
 export default PenDraftOverlay;

package/dist/CmrComponents/niivue-viewer/PenDraftOverlay.js

@@ -29,9 +29,10 @@ function cloneFreehandDraft(draft) {
 }
 /**
  * Adjust handles for polyline (vertex drag) or freehand (move only) drafts.
+ * @param {{ nv: any, draft: any, onDraftChange: (d: any) => void, onApplyDraft?: () => void, overlayKey?: unknown }} props
  */
 export function PenDraftOverlay(_a) {
-    var nv = _a.nv, draft = _a.draft, onDraftChange = _a.onDraftChange, overlayKey = _a.overlayKey;
+    var nv = _a.nv, draft = _a.draft, onDraftChange = _a.onDraftChange, onApplyDraft = _a.onApplyDraft, overlayKey = _a.overlayKey;
     var dragRef = useRef(null);
     var draftRef = useRef(draft);
     draftRef.current = draft;
@@ -109,6 +110,7 @@ export function PenDraftOverlay(_a) {
         onDraftChange(nextDraft);
     }, [nv, onDraftChange]);
     finishDragRef.current = function () {
+        var hadDrag = dragRef.current != null;
         dragRef.current = null;
         if (onPointerMoveRef.current) {
             window.removeEventListener("pointermove", onPointerMoveRef.current);
@@ -116,6 +118,10 @@ export function PenDraftOverlay(_a) {
         if (finishDragRef.current) {
             window.removeEventListener("pointerup", finishDragRef.current);
         }
+        // Auto-apply as soon as the user releases the handle after a move/resize
+        if (hadDrag && onApplyDraft) {
+            onApplyDraft();
+        }
     };
     onPointerMoveRef.current = function (event) {
         var drag = dragRef.current;

package/dist/CmrComponents/niivue-viewer/ShapeDraftOverlay.d.ts

@@ -1,11 +1,12 @@
 /**
  * Overlay handles for adjusting a rectangle/ellipse draft before commit.
- * @param {{ nv: any, draft: import('./shapeDraftUtils').ShapeDraft, onDraftChange: (d: any) => void, overlayKey?: unknown }} props
+ * @param {{ nv: any, draft: import('./shapeDraftUtils').ShapeDraft, onDraftChange: (d: any) => void, onApplyDraft?: () => void, overlayKey?: unknown }} props
  */
-export function ShapeDraftOverlay({ nv, draft, onDraftChange, overlayKey }: {
+export function ShapeDraftOverlay({ nv, draft, onDraftChange, onApplyDraft, overlayKey }: {
     nv: any;
     draft: import('./shapeDraftUtils').ShapeDraft;
     onDraftChange: (d: any) => void;
+    onApplyDraft?: (() => void) | undefined;
     overlayKey?: unknown;
 }): import("react/jsx-runtime").JSX.Element | null;
 export default ShapeDraftOverlay;

package/dist/CmrComponents/niivue-viewer/ShapeDraftOverlay.js

@@ -25,11 +25,11 @@ var HANDLE_SIZE = 10;
 var ACCENT = "#580f8b";
 /**
  * Overlay handles for adjusting a rectangle/ellipse draft before commit.
- * @param {{ nv: any, draft: import('./shapeDraftUtils').ShapeDraft, onDraftChange: (d: any) => void, overlayKey?: unknown }} props
+ * @param {{ nv: any, draft: import('./shapeDraftUtils').ShapeDraft, onDraftChange: (d: any) => void, onApplyDraft?: () => void, overlayKey?: unknown }} props
  */
 export function ShapeDraftOverlay(_a) {
     var _b;
-    var nv = _a.nv, draft = _a.draft, onDraftChange = _a.onDraftChange, overlayKey = _a.overlayKey;
+    var nv = _a.nv, draft = _a.draft, onDraftChange = _a.onDraftChange, onApplyDraft = _a.onApplyDraft, overlayKey = _a.overlayKey;
     var dragRef = useRef(null);
     var draftRef = useRef(draft);
     draftRef.current = draft;
@@ -84,6 +84,7 @@ export function ShapeDraftOverlay(_a) {
         onDraftChange(nextDraft);
     }, [nv, onDraftChange]);
     finishDragRef.current = function () {
+        var hadDrag = dragRef.current != null;
         dragRef.current = null;
         if (onPointerMoveRef.current) {
             window.removeEventListener("pointermove", onPointerMoveRef.current);
@@ -91,6 +92,10 @@ export function ShapeDraftOverlay(_a) {
         if (finishDragRef.current) {
             window.removeEventListener("pointerup", finishDragRef.current);
         }
+        // Auto-apply as soon as the user releases the handle after a move/resize
+        if (hadDrag && onApplyDraft) {
+            onApplyDraft();
+        }
     };
     onPointerMoveRef.current = function (event) {
         var drag = dragRef.current;

package/dist/CmrComponents/niivue-viewer/mro-draw-toolkit/DrawColorPlatte.d.ts

@@ -1,4 +1,4 @@
-export default function DrawColorPlatte({ expanded, updateDrawPen, setDrawingEnabled, showPenModes, penDrawMode, onPenDrawModeChange, polylineVertexCount, penDraftActive, onApplyPenDraft, onCancelPenDraft, onFillPenDraft, brushSize, updateBrushSize, shapeDraftActive, onApplyShapeDraft, onCancelShapeDraft, }: {
+export default function DrawColorPlatte({ expanded, updateDrawPen, setDrawingEnabled, showPenModes, penDrawMode, onPenDrawModeChange, polylineVertexCount, penDraftActive, onCancelPenDraft, onFillPenDraft, brushSize, updateBrushSize, shapeDraftActive, onCancelShapeDraft, }: {
     expanded: any;
     updateDrawPen: any;
     setDrawingEnabled: any;
@@ -7,12 +7,10 @@ export default function DrawColorPlatte({ expanded, updateDrawPen, setDrawingEna
     onPenDrawModeChange: any;
     polylineVertexCount?: number | undefined;
     penDraftActive?: boolean | undefined;
-    onApplyPenDraft: any;
     onCancelPenDraft: any;
     onFillPenDraft: any;
     brushSize?: number | undefined;
     updateBrushSize: any;
     shapeDraftActive?: boolean | undefined;
-    onApplyShapeDraft: any;
     onCancelShapeDraft: any;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/CmrComponents/niivue-viewer/mro-draw-toolkit/DrawColorPlatte.js

@@ -11,12 +11,13 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
- * Pen palette adds freehand vs polyline mode; pen/shape drafts show Apply/Cancel while adjusting.
+ * Pen palette adds freehand vs polyline mode; pen/shape drafts show Cancel while adjusting.
+ * Shapes are applied automatically on mouse release.
  */
 import { Stack, IconButton, Button, Tooltip, Typography } from "@mui/material";
 import FiberManualRecordIcon from "@mui/icons-material/FiberManualRecord";
-import CheckIcon from "@mui/icons-material/Check";
 import CloseIcon from "@mui/icons-material/Close";
+import FormatColorFillIcon from "@mui/icons-material/FormatColorFill";
 import { BrushSizeSlider } from "./BrushSizeSlider";
 var FILLED_COLORS = [
     { sx: { color: "red" } },
@@ -37,7 +38,7 @@ var modeBtnSx = function (active) { return ({
     px: 0.75
 }); };
 export default function DrawColorPlatte(_a) {
-    var expanded = _a.expanded, updateDrawPen = _a.updateDrawPen, setDrawingEnabled = _a.setDrawingEnabled, _b = _a.showPenModes, showPenModes = _b === void 0 ? false : _b, _c = _a.penDrawMode, penDrawMode = _c === void 0 ? "freehand" : _c, onPenDrawModeChange = _a.onPenDrawModeChange, _d = _a.polylineVertexCount, polylineVertexCount = _d === void 0 ? 0 : _d, _e = _a.penDraftActive, penDraftActive = _e === void 0 ? false : _e, onApplyPenDraft = _a.onApplyPenDraft, onCancelPenDraft = _a.onCancelPenDraft, onFillPenDraft = _a.onFillPenDraft, _f = _a.brushSize, brushSize = _f === void 0 ? 1 : _f, updateBrushSize = _a.updateBrushSize, _g = _a.shapeDraftActive, shapeDraftActive = _g === void 0 ? false : _g, onApplyShapeDraft = _a.onApplyShapeDraft, onCancelShapeDraft = _a.onCancelShapeDraft;
+    var expanded = _a.expanded, updateDrawPen = _a.updateDrawPen, setDrawingEnabled = _a.setDrawingEnabled, _b = _a.showPenModes, showPenModes = _b === void 0 ? false : _b, _c = _a.penDrawMode, penDrawMode = _c === void 0 ? "freehand" : _c, onPenDrawModeChange = _a.onPenDrawModeChange, _d = _a.polylineVertexCount, polylineVertexCount = _d === void 0 ? 0 : _d, _e = _a.penDraftActive, penDraftActive = _e === void 0 ? false : _e, onCancelPenDraft = _a.onCancelPenDraft, onFillPenDraft = _a.onFillPenDraft, _f = _a.brushSize, brushSize = _f === void 0 ? 1 : _f, updateBrushSize = _a.updateBrushSize, _g = _a.shapeDraftActive, shapeDraftActive = _g === void 0 ? false : _g, onCancelShapeDraft = _a.onCancelShapeDraft;
     return (_jsxs(Stack, __assign({ style: {
             position: "absolute",
             top: "100%",
@@ -62,36 +63,22 @@ export default function DrawColorPlatte(_a) {
                                 py: 0.25,
                                 px: 0.75,
                                 "& .MuiButton-startIcon": { mr: 0.5, ml: 0 }
-                            } }, { children: "Cancel" })) })), _jsxs(Stack, __assign({ direction: "row", alignItems: "center", spacing: 1 }, { children: [penDrawMode === "polyline" && polylineVertexCount >= 3 && (_jsx(Tooltip, __assign({ title: "Fill interior (keeps outline editable until Apply)" }, { children: _jsx(Button, __assign({ size: "small", "aria-label": "fill polyline", onClick: function () { return onFillPenDraft === null || onFillPenDraft === void 0 ? void 0 : onFillPenDraft(); }, sx: {
-                                        color: "#c9a0e8",
-                                        fontSize: ACTION_FONT_SIZE,
-                                        textTransform: "none",
-                                        minWidth: 0,
-                                        py: 0.25,
-                                        px: 0.75
-                                    } }, { children: "Fill" })) }))), _jsx(Tooltip, __assign({ title: "Apply shape (enter or right-click)" }, { children: _jsx(Button, __assign({ size: "small", "aria-label": "apply pen draft", onClick: function () { return onApplyPenDraft === null || onApplyPenDraft === void 0 ? void 0 : onApplyPenDraft(); }, startIcon: _jsx(CheckIcon, { sx: { fontSize: ACTION_ICON_SIZE } }), sx: {
-                                        color: "#c9a0e8",
-                                        fontSize: ACTION_FONT_SIZE,
-                                        textTransform: "none",
-                                        minWidth: 0,
-                                        py: 0.25,
-                                        px: 0.75,
-                                        "& .MuiButton-startIcon": { mr: 0.5, ml: 0 }
-                                    } }, { children: "Apply" })) }))] }))] }))), shapeDraftActive && expanded && (_jsxs(Stack, __assign({ direction: "row", alignItems: "center", justifyContent: "space-between", sx: { px: 1, py: 0.5, borderTop: "1px solid #555", width: "100%" } }, { children: [_jsx(Tooltip, __assign({ title: "Cancel shape (Esc)" }, { children: _jsx(Button, __assign({ size: "small", "aria-label": "cancel shape", onClick: function () { return onCancelShapeDraft === null || onCancelShapeDraft === void 0 ? void 0 : onCancelShapeDraft(); }, startIcon: _jsx(CloseIcon, { sx: { fontSize: ACTION_ICON_SIZE } }), sx: {
-                                color: "#ccc",
-                                fontSize: ACTION_FONT_SIZE,
-                                textTransform: "none",
-                                minWidth: 0,
-                                py: 0.25,
-                                px: 0.75,
-                                "& .MuiButton-startIcon": { mr: 0.5, ml: 0 }
-                            } }, { children: "Cancel" })) })), _jsx(Tooltip, __assign({ title: "Apply shape (enter or right-click)" }, { children: _jsx(Button, __assign({ size: "small", "aria-label": "apply shape", onClick: function () { return onApplyShapeDraft === null || onApplyShapeDraft === void 0 ? void 0 : onApplyShapeDraft(); }, startIcon: _jsx(CheckIcon, { sx: { fontSize: ACTION_ICON_SIZE } }), sx: {
+                            } }, { children: "Cancel" })) })), penDrawMode === "polyline" && polylineVertexCount >= 3 && (_jsx(Tooltip, __assign({ title: "Fill interior (keeps outline editable until release)" }, { children: _jsx(Button, __assign({ size: "small", "aria-label": "fill polyline", onClick: function () { return onFillPenDraft === null || onFillPenDraft === void 0 ? void 0 : onFillPenDraft(); }, startIcon: _jsx(FormatColorFillIcon, { sx: { fontSize: ACTION_ICON_SIZE } }), sx: {
                                 color: "#c9a0e8",
                                 fontSize: ACTION_FONT_SIZE,
                                 textTransform: "none",
                                 minWidth: 0,
                                 py: 0.25,
                                 px: 0.75,
+                                ml: "auto",
                                 "& .MuiButton-startIcon": { mr: 0.5, ml: 0 }
-                            } }, { children: "Apply" })) }))] })))] })));
+                            } }, { children: "Fill" })) })))] }))), shapeDraftActive && expanded && (_jsx(Stack, __assign({ direction: "row", alignItems: "center", sx: { px: 1, py: 0.5, borderTop: "1px solid #555", width: "100%" } }, { children: _jsx(Tooltip, __assign({ title: "Cancel shape (Esc)" }, { children: _jsx(Button, __assign({ size: "small", "aria-label": "cancel shape", onClick: function () { return onCancelShapeDraft === null || onCancelShapeDraft === void 0 ? void 0 : onCancelShapeDraft(); }, startIcon: _jsx(CloseIcon, { sx: { fontSize: ACTION_ICON_SIZE } }), sx: {
+                            color: "#ccc",
+                            fontSize: ACTION_FONT_SIZE,
+                            textTransform: "none",
+                            minWidth: 0,
+                            py: 0.25,
+                            px: 0.75,
+                            "& .MuiButton-startIcon": { mr: 0.5, ml: 0 }
+                        } }, { children: "Cancel" })) })) })))] })));
 }

package/dist/CmrComponents/niivue-viewer/shapeDraftUtils.d.ts

@@ -49,6 +49,21 @@ export function captureDeferredShapeDraft(nv: any): {
     baseBitmap: Uint8Array | null;
 };
 export function shouldDeferShapeCommit(nv: any): any;
+/**
+ * When the user clicks on an existing filled ROI while the rectangle/ellipse tool
+ * is active (but no draft is currently open), flood-fill the clicked cluster to
+ * reconstruct a ShapeDraft so the bounding-box overlay reappears for re-editing.
+ *
+ * Returns null if the click didn't land on a labeled voxel.
+ */
+export function captureShapeDraftFromClick(nv: any): {
+    ptA: number[];
+    ptB: number[];
+    penValue: any;
+    axCorSag: number;
+    penType: any;
+    baseBitmap: Uint8Array;
+} | null;
 export type ShapeDraftKind = 'rectangle' | 'ellipse';
 export type ShapeDraft = {
     ptA: [number, number, number];

package/dist/CmrComponents/niivue-viewer/shapeDraftUtils.js

@@ -19,6 +19,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 import { NI_PEN_TYPE } from "./niivuePenType";
+import { voxFromMouse } from "./polylinePenUtils";
 /** @typedef {'rectangle' | 'ellipse'} ShapeDraftKind */
 /**
  * @typedef {Object} ShapeDraft
@@ -186,3 +187,94 @@ export function shouldDeferShapeCommit(nv) {
         (penType === NI_PEN_TYPE.RECTANGLE || penType === NI_PEN_TYPE.ELLIPSE) &&
         nv.drawShapePreviewBitmap);
 }
+function voxelIndex(x, y, z, dx, dy) {
+    return x + y * dx + z * dx * dy;
+}
+function decodeVoxelIndex(idx, dx, dy) {
+    var z = Math.floor(idx / (dx * dy));
+    var rem = idx - z * dx * dy;
+    var y = Math.floor(rem / dx);
+    var x = rem % dx;
+    return [x, y, z];
+}
+function inferAxCorSagFromBounds(x1, y1, z1, x2, y2, z2, fallback) {
+    if (fallback === void 0) { fallback = 0; }
+    var spanX = x2 - x1;
+    var spanY = y2 - y1;
+    var spanZ = z2 - z1;
+    if (spanZ <= spanX && spanZ <= spanY)
+        return 0; // axial — flat in Z
+    if (spanY <= spanX && spanY <= spanZ)
+        return 1; // coronal — flat in Y
+    if (spanX <= spanY && spanX <= spanZ)
+        return 2; // sagittal — flat in X
+    return fallback;
+}
+/**
+ * When the user clicks on an existing filled ROI while the rectangle/ellipse tool
+ * is active (but no draft is currently open), flood-fill the clicked cluster to
+ * reconstruct a ShapeDraft so the bounding-box overlay reappears for re-editing.
+ *
+ * Returns null if the click didn't land on a labeled voxel.
+ */
+export function captureShapeDraftFromClick(nv) {
+    var _a;
+    var dims = (_a = nv.back) === null || _a === void 0 ? void 0 : _a.dims;
+    if (!dims || !nv.drawBitmap)
+        return null;
+    var seedVox = voxFromMouse(nv);
+    if (!seedVox)
+        return null;
+    var dx = dims[1];
+    var dy = dims[2];
+    var dz = dims[3];
+    var seedIdx = voxelIndex(seedVox[0], seedVox[1], seedVox[2], dx, dy);
+    var label = nv.drawBitmap[seedIdx];
+    if (!label)
+        return null;
+    // BFS flood-fill to find connected cluster of the same label
+    var visited = new Set();
+    var queue = [seedIdx];
+    visited.add(seedIdx);
+    var x1 = Infinity, y1 = Infinity, z1 = Infinity;
+    var x2 = -Infinity, y2 = -Infinity, z2 = -Infinity;
+    while (queue.length > 0) {
+        var idx = queue.shift();
+        var _b = decodeVoxelIndex(idx, dx, dy), x = _b[0], y = _b[1], z = _b[2];
+        x1 = Math.min(x1, x);
+        y1 = Math.min(y1, y);
+        z1 = Math.min(z1, z);
+        x2 = Math.max(x2, x);
+        y2 = Math.max(y2, y);
+        z2 = Math.max(z2, z);
+        var neighbors = [
+            [x + 1, y, z], [x - 1, y, z],
+            [x, y + 1, z], [x, y - 1, z],
+            [x, y, z + 1], [x, y, z - 1],
+        ];
+        for (var _i = 0, neighbors_1 = neighbors; _i < neighbors_1.length; _i++) {
+            var _c = neighbors_1[_i], nx = _c[0], ny = _c[1], nz = _c[2];
+            if (nx < 0 || ny < 0 || nz < 0 || nx >= dx || ny >= dy || nz >= dz)
+                continue;
+            var nIdx = voxelIndex(nx, ny, nz, dx, dy);
+            if (visited.has(nIdx) || nv.drawBitmap[nIdx] !== label)
+                continue;
+            visited.add(nIdx);
+            queue.push(nIdx);
+        }
+    }
+    if (!Number.isFinite(x1))
+        return null;
+    // baseBitmap is the bitmap with this cluster erased (so re-applying restores it)
+    var baseBitmap = new Uint8Array(nv.drawBitmap);
+    visited.forEach(function (idx) { baseBitmap[idx] = 0; });
+    var axCorSag = inferAxCorSagFromBounds(x1, y1, z1, x2, y2, z2, nv.drawPenAxCorSag >= 0 ? nv.drawPenAxCorSag : 0);
+    return {
+        ptA: [x1, y1, z1],
+        ptB: [x2, y2, z2],
+        penValue: label,
+        axCorSag: axCorSag,
+        penType: nv.opts.penType,
+        baseBitmap: baseBitmap
+    };
+}

package/dist/core/common/components/NiivueTools/Niivue.js

@@ -833,7 +833,7 @@ export default function NiiVueport(props) {
                 x: roi.sample,
                 type: "histogram",
                 name: roi.alias,
-                opacity: roi.visibility ? 0.5 : 0.1,
+                opacity: roi.visibility ? 0.5 : 0,
                 marker: {
                     color: roi.color
                 },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cloudmr-ux",
-  "version": "4.5.9",
+  "version": "4.6.1",
   "author": "erosmontin@gmail.com",
   "license": "MIT",
   "repository": "erosmontin/cloudmr-ux",