cloudmr-ux 4.5.5 → 4.5.8

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

@@ -565,13 +565,37 @@ export default function CloudMrNiivueViewer(props) {
         nv.opts.penSize = size;
     }
     function nvUpdateDrawPen(a) {
+        var _a;
         var raw = Number(a.target.value);
         setDrawPen(raw);
-        var penValue = raw;
-        nv.setPenValue(penValue & 7, penValue > 0);
-        if (penValue == 8) {
+        var isEraser = raw === 0 || raw === 8;
+        if (raw === 8) {
             nv.setPenValue(0, true);
         }
+        else {
+            nv.setPenValue(raw & 7, raw > 0);
+        }
+        if (isEraser) {
+            nv.opts.deferFreehandCommit = false;
+            nv.opts.deferShapeCommit = false;
+            nv.opts.polylinePenMode = false;
+            (_a = nv.cloudMrResetPolyline) === null || _a === void 0 ? void 0 : _a.call(nv);
+            if (penDraftRef.current) {
+                cancelPenDraft(nv, penDraftRef.current);
+                setPenDraft(null);
+                penDraftRef.current = null;
+                nv._cloudMrPenDraftActive = false;
+                setPolylineVertexCount(0);
+            }
+            if (shapeDraftRef.current) {
+                cancelShapeDraft();
+            }
+        }
+        else if (drawShapeToolRef.current === "pen") {
+            nv.opts.deferFreehandCommit = penDrawModeRef.current === "freehand";
+            nv.opts.polylinePenMode = penDrawModeRef.current === "polyline";
+            nv.opts.isFilledPen = penDrawModeRef.current === "freehand";
+        }
     }
     function nvUpdateDrawOpacity(a) {
         setDrawOpacity(a);
@@ -886,6 +910,35 @@ export default function CloudMrNiivueViewer(props) {
     React.useEffect(function () {
         nv._cloudMrPenDraftActive = penDraft != null;
     }, [penDraft]);
+    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;

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

@@ -152,13 +152,14 @@ export function ShapeDraftOverlay(_a) {
         boxSizing: "border-box",
         cursor: "pointer",
         zIndex: 3,
-        touchAction: "none"
+        touchAction: "none",
+        pointerEvents: "auto"
     };
     return (_jsxs("div", __assign({ style: {
             position: "absolute",
             inset: 0,
             zIndex: 2,
-            pointerEvents: "auto",
+            pointerEvents: "none",
             overflow: "hidden"
         }, "aria-label": "Adjust ROI shape" }, { children: [_jsx("div", { style: {
                     position: "absolute",

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

@@ -69,7 +69,7 @@ export default function DrawColorPlatte(_a) {
                                         minWidth: 0,
                                         py: 0.25,
                                         px: 0.75
-                                    } }, { children: "Fill" })) }))), _jsx(Tooltip, __assign({ title: "Apply (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: {
+                                    } }, { 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",
@@ -85,7 +85,7 @@ export default function DrawColorPlatte(_a) {
                                 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" })) })), _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: {
                                 color: "#c9a0e8",
                                 fontSize: ACTION_FONT_SIZE,
                                 textTransform: "none",

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

@@ -122,10 +122,12 @@ export function MroDrawToolkit(props) {
         }
     }
     function clickEraser() {
+        var _a;
         if (expandedOption === "e") {
             setExpandedOption("n");
         }
         else {
+            (_a = props.onExitDrawMode) === null || _a === void 0 ? void 0 : _a.call(props);
             props.updateDrawPen({ target: { value: 8 } });
             setExpandedOption("e");
         }

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

@@ -10,6 +10,7 @@
  * @property {{ x1: number, y1: number, x2: number, y2: number, z1: number, z2: number }} [bounds]
  * @property {boolean} [filled]
  */
+export function isEraserActive(nv: any): any;
 export function isFreehandPenActive(nv: any): any;
 export function shouldDeferFreehandCommit(nv: any): any;
 export function redrawPolylineDraft(nv: any, draft: any): void;

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

@@ -32,11 +32,17 @@ import { NI_PEN_TYPE } from "./niivuePenType";
  * @property {{ x1: number, y1: number, x2: number, y2: number, z1: number, z2: number }} [bounds]
  * @property {boolean} [filled]
  */
+export function isEraserActive(nv) {
+    return (nv.opts.drawingEnabled &&
+        nv.opts.penType === NI_PEN_TYPE.PEN &&
+        nv.opts.penValue === 0);
+}
 export function isFreehandPenActive(nv) {
     return (nv.opts.isFilledPen &&
         nv.opts.drawingEnabled &&
         nv.opts.penType === NI_PEN_TYPE.PEN &&
-        !nv.opts.polylinePenMode);
+        !nv.opts.polylinePenMode &&
+        nv.opts.penValue > 0);
 }
 export function shouldDeferFreehandCommit(nv) {
     return !!nv.opts.deferFreehandCommit && isFreehandPenActive(nv);

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

@@ -12,7 +12,8 @@ var CLICK_DRAG_PX = 5;
 export function isPolylinePenActive(nv) {
     return (nv.opts.polylinePenMode &&
         nv.opts.drawingEnabled &&
-        nv.opts.penType === NI_PEN_TYPE.PEN);
+        nv.opts.penType === NI_PEN_TYPE.PEN &&
+        nv.opts.penValue > 0);
 }
 export function isClickWithoutDrag(uiData, thresholdPx) {
     if (thresholdPx === void 0) { thresholdPx = CLICK_DRAG_PX; }

package/package.json

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