copper3d 3.1.2 → 3.2.1

package/dist/bundle.umd.js

@@ -71395,6 +71395,17 @@ void main() {
 	    getChannels() {
 	        return this.numChannels;
 	    }
+	    /**
+	     * Return the number of bytes in one complete z-slice.
+	     *
+	     * Equal to `width × height × channels`. Useful for direct buffer
+	     * index arithmetic in performance-critical code paths.
+	     *
+	     * @returns Bytes per z-slice.
+	     */
+	    getBytesPerSlice() {
+	        return this.bytesPerSlice;
+	    }
 	    /**
 	     * Return total memory used by the backing buffer, in bytes.
 	     *
@@ -71963,41 +71974,48 @@ void main() {
 	    setActiveLayer(layer) {
 	        this.activeLayer = layer;
 	    }
-	    /** Push a delta onto the active layer's undo stack and clear the redo stack. */
+	    /** Push a single delta onto the active layer's undo stack and clear the redo stack. */
 	    push(delta) {
+	        this.pushGroup([delta]);
+	    }
+	    /** Push a group of deltas as a single undo unit (e.g. 3D sphere spanning multiple slices). */
+	    pushGroup(deltas) {
 	        var _a, _b;
-	        const stack = (_a = this.undoStacks.get(delta.layerId)) !== null && _a !== void 0 ? _a : this.undoStacks.get("layer1");
-	        stack.push(delta);
+	        if (deltas.length === 0)
+	            return;
+	        const layerId = deltas[0].layerId;
+	        const stack = (_a = this.undoStacks.get(layerId)) !== null && _a !== void 0 ? _a : this.undoStacks.get("layer1");
+	        stack.push(deltas);
 	        if (stack.length > MAX_STACK_SIZE) {
 	            stack.shift();
 	        }
 	        // Any new operation invalidates the redo history for that layer
-	        const redoStack = (_b = this.redoStacks.get(delta.layerId)) !== null && _b !== void 0 ? _b : this.redoStacks.get("layer1");
+	        const redoStack = (_b = this.redoStacks.get(layerId)) !== null && _b !== void 0 ? _b : this.redoStacks.get("layer1");
 	        redoStack.length = 0;
 	    }
 	    /**
 	     * Undo the last operation on the active layer.
-	     * @returns The delta that was undone, or undefined if nothing to undo.
+	     * @returns The delta(s) that were undone, or undefined if nothing to undo.
 	     */
 	    undo() {
 	        const stack = this.undoStacks.get(this.activeLayer);
-	        const delta = stack.pop();
-	        if (delta) {
-	            this.redoStacks.get(this.activeLayer).push(delta);
+	        const entry = stack.pop();
+	        if (entry) {
+	            this.redoStacks.get(this.activeLayer).push(entry);
 	        }
-	        return delta;
+	        return entry;
 	    }
 	    /**
 	     * Redo the last undone operation on the active layer.
-	     * @returns The delta that was redone, or undefined if nothing to redo.
+	     * @returns The delta(s) that were redone, or undefined if nothing to redo.
 	     */
 	    redo() {
 	        const stack = this.redoStacks.get(this.activeLayer);
-	        const delta = stack.pop();
-	        if (delta) {
-	            this.undoStacks.get(this.activeLayer).push(delta);
+	        const entry = stack.pop();
+	        if (entry) {
+	            this.undoStacks.get(this.activeLayer).push(entry);
 	        }
-	        return delta;
+	        return entry;
 	    }
 	    canUndo() {
 	        var _a, _b;
@@ -73205,8 +73223,8 @@ void main() {
 	                        }
 	                    }
 	                }
-	                // Composite all layers to master canvas
-	                this.compositeAllLayers();
+	                // Composite all layers to master canvas (uses per-layer alpha)
+	                this.callbacks.compositeAllLayers();
 	            }
 	            // Refresh sphere overlay from volume for the new slice
 	            if (this.ctx.gui_states.mode.sphere) {
@@ -73215,23 +73233,6 @@ void main() {
 	            view.switchSliceFlag = false;
 	        }
 	    }
-	    /**
-	     * Composite all visible layer canvases to the master display canvas.
-	     */
-	    compositeAllLayers() {
-	        const masterCtx = this.ctx.protectedData.ctxes.drawingLayerMasterCtx;
-	        const width = this.ctx.nrrd_states.view.changedWidth;
-	        const height = this.ctx.nrrd_states.view.changedHeight;
-	        masterCtx.clearRect(0, 0, width, height);
-	        // Master stores full-alpha composite; globalAlpha applied in start() render loop.
-	        for (const layerId of this.ctx.nrrd_states.image.layers) {
-	            if (!this.ctx.gui_states.layerChannel.layerVisibility[layerId])
-	                continue;
-	            const target = this.ctx.protectedData.layerTargets.get(layerId);
-	            if (target)
-	                masterCtx.drawImage(target.canvas, 0, 0, width, height);
-	        }
-	    }
 	    // ===== Canvas Cleanup =====
 	    cleanCanvases(flag) {
 	        if (flag) {
@@ -73273,7 +73274,7 @@ void main() {
 	}
 
 	class DragOperator {
-	    constructor(container, nrrd_sates, gui_states, protectedData, drawingPrameters, setSyncsliceNum, setIsDrawFalse, flipDisplayImageByAxis, setEmptyCanvasSize, getOrCreateSliceBuffer, renderSliceToCanvas) {
+	    constructor(container, nrrd_sates, gui_states, protectedData, drawingPrameters, setSyncsliceNum, setIsDrawFalse, flipDisplayImageByAxis, setEmptyCanvasSize, getOrCreateSliceBuffer, renderSliceToCanvas, compositeAllLayers) {
 	        this.dragPrameters = {
 	            move: 0,
 	            y: 0,
@@ -73309,6 +73310,7 @@ void main() {
 	        this.setEmptyCanvasSize = setEmptyCanvasSize;
 	        this.getOrCreateSliceBuffer = getOrCreateSliceBuffer;
 	        this.renderSliceToCanvas = renderSliceToCanvas;
+	        this.compositeAllLayers = compositeAllLayers;
 	        this.showDragNumberDiv = createShowSliceNumberDiv();
 	        this.init();
 	    }
@@ -73334,6 +73336,7 @@ void main() {
 	            setEmptyCanvasSize: (axis) => this.setEmptyCanvasSize(axis),
 	            getOrCreateSliceBuffer: (axis) => this.getOrCreateSliceBuffer(axis),
 	            renderSliceToCanvas: (layer, axis, sliceIndex, buffer, targetCtx, w, h) => this.renderSliceToCanvas(layer, axis, sliceIndex, buffer, targetCtx, w, h),
+	            compositeAllLayers: () => this.compositeAllLayers(),
 	            refreshSphereOverlay: () => { var _a; return (_a = this.refreshSphereOverlayCb) === null || _a === void 0 ? void 0 : _a.call(this); },
 	        }, this.showDragNumberDiv, dragEffectCanvases);
 	    }
@@ -73366,7 +73369,9 @@ void main() {
 	            // When leaving draw, contrast, or crosshair mode (returning to idle), restore drag mode
 	            // Do NOT restore if sphere mode is active
 	            if ((prev === 'draw' || prev === 'contrast' || prev === 'crosshair') && next === 'idle') {
-	                if (!this.gui_states.mode.sphere) {
+	                if (!this.gui_states.mode.sphere
+	                    && !this.gui_states.mode.sphereBrush
+	                    && !this.gui_states.mode.sphereEraser) {
 	                    this.configDragMode();
 	                }
 	            }
@@ -73905,6 +73910,7 @@ void main() {
 	        if (ev.key === this.keyboardSettings.draw) {
 	            this.state.shiftHeld = true;
 	            // Block draw mode when crosshair or contrast is active (mutual exclusion)
+	            // Also block when sphereBrush or sphereEraser is active
 	            if (DRAWING_TOOLS.has(this.guiTool) && !this.state.ctrlHeld && !this.state.crosshairEnabled) {
 	                this.setMode('draw');
 	            }
@@ -74304,10 +74310,15 @@ void main() {
 	    configMouseZoomWheel() {
 	        let moveDistance = 1;
 	        return (e) => {
-	            var _a;
+	            var _a, _b;
 	            if ((_a = this.ctx.eventRouter) === null || _a === void 0 ? void 0 : _a.isShiftHeld()) {
 	                return;
 	            }
+	            // Block zoom wheel when sphereBrush/sphereEraser is actively placing (left button held)
+	            if ((this.ctx.gui_states.mode.sphereBrush || this.ctx.gui_states.mode.sphereEraser)
+	                && ((_b = this.ctx.eventRouter) === null || _b === void 0 ? void 0 : _b.isLeftButtonDown())) {
+	                return;
+	            }
 	            e.preventDefault();
 	            const delta = e.detail ? e.detail > 0 : e.wheelDelta < 0;
 	            this.ctx.protectedData.isDrawing = true;
@@ -74909,6 +74920,493 @@ void main() {
 	    }
 	}
 
+	/**
+	 * SphereBrushTool — 3D sphere brush and eraser on layer MaskVolume.
+	 *
+	 * Unlike SphereTool (which uses its own isolated sphereMaskVolume),
+	 * this tool writes/erases directly in the active layer's shared MaskVolume —
+	 * the same volume used by pencil/brush/eraser tools.
+	 *
+	 * Two operation modes handled by one class:
+	 * - **sphereBrush**: Direct click to paint a 3D sphere of the active channel label.
+	 * - **sphereEraser**: Shift+click to erase a 3D sphere (only voxels matching active channel).
+	 *
+	 * Interaction:
+	 * 1. Pointer-down records sphere center, switches wheel to radius mode.
+	 * 2. Scroll wheel adjusts sphereBrushRadius [1, 50].
+	 * 3. Pointer-up writes/erases sphere to volume, captures grouped undo, refreshes canvas.
+	 */
+	class SphereBrushTool extends BaseTool {
+	    constructor(ctx, callbacks) {
+	        super(ctx);
+	        /** Recorded sphere center in canvas mm-space */
+	        this.centerX = 0;
+	        this.centerY = 0;
+	        this.centerSlice = 0;
+	        /** Whether a sphere placement is in progress */
+	        this.active = false;
+	        /** Current operation mode for the active placement */
+	        this.mode = "brush";
+	        /** Cumulative "before" snapshots for drag-erase undo (z-index → slice data) */
+	        this.dragBeforeSnapshots = new Map();
+	        /** Whether a drag-erase has actually moved (vs. simple click-release) */
+	        this.dragMoved = false;
+	        this.callbacks = callbacks;
+	    }
+	    setCallbacks(callbacks) {
+	        this.callbacks = callbacks;
+	    }
+	    // ── Geometry (ported from SphereTool) ──────────────────────────
+	    /**
+	     * Convert canvas mm-space coordinates to 3D voxel coordinates.
+	     */
+	    canvasToVoxelCenter(canvasX, canvasY, sliceIndex, axis) {
+	        const nrrd = this.ctx.nrrd_states;
+	        switch (axis) {
+	            case 'z':
+	                return {
+	                    x: canvasX * nrrd.image.nrrd_x_pixel / nrrd.image.nrrd_x_mm,
+	                    y: canvasY * nrrd.image.nrrd_y_pixel / nrrd.image.nrrd_y_mm,
+	                    z: sliceIndex,
+	                };
+	            case 'y':
+	                return {
+	                    x: canvasX * nrrd.image.nrrd_x_pixel / nrrd.image.nrrd_x_mm,
+	                    y: sliceIndex,
+	                    z: (nrrd.image.nrrd_z_mm - canvasY) * nrrd.image.nrrd_z_pixel / nrrd.image.nrrd_z_mm,
+	                };
+	            case 'x':
+	                return {
+	                    x: sliceIndex,
+	                    y: canvasY * nrrd.image.nrrd_y_pixel / nrrd.image.nrrd_y_mm,
+	                    z: canvasX * nrrd.image.nrrd_z_pixel / nrrd.image.nrrd_z_mm,
+	                };
+	        }
+	    }
+	    /**
+	     * Convert mm radius to per-axis voxel radii.
+	     */
+	    getVoxelRadii(radius) {
+	        const nrrd = this.ctx.nrrd_states;
+	        return {
+	            rx: radius * nrrd.image.nrrd_x_pixel / nrrd.image.nrrd_x_mm,
+	            ry: radius * nrrd.image.nrrd_y_pixel / nrrd.image.nrrd_y_mm,
+	            rz: radius * nrrd.image.nrrd_z_pixel / nrrd.image.nrrd_z_mm,
+	        };
+	    }
+	    /**
+	     * Compute clamped bounding box for an ellipsoid in voxel space.
+	     */
+	    getBoundingBox(center, radii, dims) {
+	        return {
+	            minX: Math.max(0, Math.floor(center.x - radii.rx)),
+	            maxX: Math.min(dims.width - 1, Math.ceil(center.x + radii.rx)),
+	            minY: Math.max(0, Math.floor(center.y - radii.ry)),
+	            maxY: Math.min(dims.height - 1, Math.ceil(center.y + radii.ry)),
+	            minZ: Math.max(0, Math.floor(center.z - radii.rz)),
+	            maxZ: Math.min(dims.depth - 1, Math.ceil(center.z + radii.rz)),
+	        };
+	    }
+	    // ── 3D Volume Write / Erase ────────────────────────────────────
+	    /**
+	     * Write a 3D sphere of the active channel label into the layer's MaskVolume.
+	     */
+	    write3DSphereToBrush(vol, center, radii, bb, label) {
+	        const { rx, ry, rz } = radii;
+	        for (let z = bb.minZ; z <= bb.maxZ; z++) {
+	            for (let y = bb.minY; y <= bb.maxY; y++) {
+	                for (let x = bb.minX; x <= bb.maxX; x++) {
+	                    const dx = rx > 0 ? (x - center.x) / rx : 0;
+	                    const dy = ry > 0 ? (y - center.y) / ry : 0;
+	                    const dz = rz > 0 ? (z - center.z) / rz : 0;
+	                    if (dx * dx + dy * dy + dz * dz <= 1.0) {
+	                        vol.setVoxel(x, y, z, label);
+	                    }
+	                }
+	            }
+	        }
+	    }
+	    /**
+	     * Erase a 3D sphere from the layer's MaskVolume.
+	     * Only clears voxels whose current value equals the active channel label.
+	     */
+	    erase3DSphereFromVolume(vol, center, radii, bb, label) {
+	        const { rx, ry, rz } = radii;
+	        for (let z = bb.minZ; z <= bb.maxZ; z++) {
+	            for (let y = bb.minY; y <= bb.maxY; y++) {
+	                for (let x = bb.minX; x <= bb.maxX; x++) {
+	                    const dx = rx > 0 ? (x - center.x) / rx : 0;
+	                    const dy = ry > 0 ? (y - center.y) / ry : 0;
+	                    const dz = rz > 0 ? (z - center.z) / rz : 0;
+	                    if (dx * dx + dy * dy + dz * dz <= 1.0) {
+	                        if (vol.getVoxel(x, y, z) === label) {
+	                            vol.setVoxel(x, y, z, 0);
+	                        }
+	                    }
+	                }
+	            }
+	        }
+	    }
+	    // ── Undo Capture ───────────────────────────────────────────────
+	    /**
+	     * Capture slice snapshots for all Z-slices in the bounding box.
+	     * Used before and after the sphere operation to build MaskDelta groups.
+	     *
+	     * We always capture along the Z axis since the 3D sphere spans Z slices.
+	     */
+	    captureSliceSnapshots(vol, minZ, maxZ) {
+	        const snapshots = new Map();
+	        for (let z = minZ; z <= maxZ; z++) {
+	            try {
+	                const { data } = vol.getSliceUint8(z, 'z');
+	                snapshots.set(z, data.slice());
+	            }
+	            catch (_a) {
+	                // slice out of bounds — skip
+	            }
+	        }
+	        return snapshots;
+	    }
+	    /**
+	     * Build MaskDelta group from before/after snapshots.
+	     */
+	    buildUndoGroup(layerId, before, after) {
+	        const deltas = [];
+	        for (const [sliceIndex, oldSlice] of before) {
+	            const newSlice = after.get(sliceIndex);
+	            if (!newSlice)
+	                continue;
+	            // Only include slices that actually changed
+	            let changed = false;
+	            for (let i = 0; i < oldSlice.length; i++) {
+	                if (oldSlice[i] !== newSlice[i]) {
+	                    changed = true;
+	                    break;
+	                }
+	            }
+	            if (changed) {
+	                deltas.push({ layerId, axis: 'z', sliceIndex, oldSlice, newSlice });
+	            }
+	        }
+	        return deltas;
+	    }
+	    // ── Preview Rendering ──────────────────────────────────────────
+	    /**
+	     * Draw a preview circle on the sphere canvas during sphere placement.
+	     */
+	    drawPreview(mouseX, mouseY, radius, isEraser) {
+	        const sphereCanvas = this.ctx.protectedData.canvases.drawingSphereCanvas;
+	        const sphereCtx = this.ctx.protectedData.ctxes.drawingSphereCtx;
+	        // Clear and resize sphere canvas
+	        sphereCanvas.width = this.ctx.protectedData.canvases.originCanvas.width;
+	        sphereCanvas.height = this.ctx.protectedData.canvases.originCanvas.height;
+	        sphereCtx.beginPath();
+	        sphereCtx.arc(mouseX, mouseY, radius, 0, 2 * Math.PI);
+	        if (isEraser) {
+	            // Eraser preview: dashed outline
+	            sphereCtx.strokeStyle = "#ff4444";
+	            sphereCtx.lineWidth = 2;
+	            sphereCtx.setLineDash([4, 4]);
+	            sphereCtx.stroke();
+	            sphereCtx.setLineDash([]);
+	        }
+	        else {
+	            // Brush preview: semi-transparent fill with active channel color
+	            const channel = this.ctx.gui_states.layerChannel.activeChannel || 1;
+	            const color = this.getActiveChannelColor(channel);
+	            sphereCtx.fillStyle = color;
+	            sphereCtx.globalAlpha = 0.5;
+	            sphereCtx.fill();
+	            sphereCtx.globalAlpha = 1.0;
+	        }
+	        sphereCtx.closePath();
+	    }
+	    /**
+	     * Clear the sphere preview canvas.
+	     */
+	    clearPreview() {
+	        const sphereCanvas = this.ctx.protectedData.canvases.drawingSphereCanvas;
+	        sphereCanvas.width = sphereCanvas.width;
+	    }
+	    /**
+	     * Get the hex color for the active channel from the layer's MaskVolume.
+	     */
+	    getActiveChannelColor(channel) {
+	        var _a;
+	        const layer = this.ctx.gui_states.layerChannel.layer;
+	        const volumes = this.ctx.protectedData.maskData.volumes;
+	        const vol = volumes[layer];
+	        if (vol) {
+	            const rgba = vol.getChannelColor(channel);
+	            const r = rgba.r.toString(16).padStart(2, '0');
+	            const g = rgba.g.toString(16).padStart(2, '0');
+	            const b = rgba.b.toString(16).padStart(2, '0');
+	            return `#${r}${g}${b}`;
+	        }
+	        return (_a = CHANNEL_HEX_COLORS[channel]) !== null && _a !== void 0 ? _a : "#ff0000";
+	    }
+	    // ── Wheel Handler ──────────────────────────────────────────────
+	    /**
+	     * Returns a wheel event handler for adjusting sphereBrushRadius.
+	     * Used in both sphereBrush and sphereEraser modes.
+	     */
+	    configSphereBrushWheel() {
+	        return (e) => {
+	            e.preventDefault();
+	            const sphere = this.ctx.nrrd_states.sphere;
+	            if (e.deltaY < 0) {
+	                sphere.sphereBrushRadius += 1;
+	            }
+	            else {
+	                sphere.sphereBrushRadius -= 1;
+	            }
+	            sphere.sphereBrushRadius = Math.max(1, Math.min(sphere.sphereBrushRadius, 50));
+	            // Redraw preview
+	            if (this.active) {
+	                this.drawPreview(this.centerX, this.centerY, sphere.sphereBrushRadius, this.mode === "eraser");
+	            }
+	        };
+	    }
+	    // ── Sphere Brush Click/PointerUp ───────────────────────────────
+	    /**
+	     * Handle pointer-down in sphereBrush mode (direct click, no Shift needed).
+	     */
+	    onSphereBrushClick(e) {
+	        this.centerX = e.offsetX / this.ctx.nrrd_states.view.sizeFactor;
+	        this.centerY = e.offsetY / this.ctx.nrrd_states.view.sizeFactor;
+	        this.centerSlice = this.ctx.nrrd_states.view.currentSliceIndex;
+	        this.active = true;
+	        this.mode = "brush";
+	        this.drawPreview(this.centerX, this.centerY, this.ctx.nrrd_states.sphere.sphereBrushRadius, false);
+	    }
+	    /**
+	     * Handle pointer-up in sphereBrush mode — write sphere to volume.
+	     */
+	    onSphereBrushPointerUp() {
+	        if (!this.active || this.mode !== "brush")
+	            return;
+	        this.active = false;
+	        const layer = this.ctx.gui_states.layerChannel.layer;
+	        const channel = this.ctx.gui_states.layerChannel.activeChannel || 1;
+	        const axis = this.ctx.protectedData.axis;
+	        const radius = this.ctx.nrrd_states.sphere.sphereBrushRadius;
+	        let vol;
+	        try {
+	            vol = this.callbacks.getVolumeForLayer(layer);
+	        }
+	        catch (_a) {
+	            this.clearPreview();
+	            return;
+	        }
+	        const dims = vol.getDimensions();
+	        const center = this.canvasToVoxelCenter(this.centerX, this.centerY, this.centerSlice, axis);
+	        const radii = this.getVoxelRadii(radius);
+	        const bb = this.getBoundingBox(center, radii, dims);
+	        // Capture pre-write snapshots
+	        const before = this.captureSliceSnapshots(vol, bb.minZ, bb.maxZ);
+	        // Write sphere
+	        this.write3DSphereToBrush(vol, center, radii, bb, channel);
+	        // Capture post-write snapshots and push undo group
+	        const after = this.captureSliceSnapshots(vol, bb.minZ, bb.maxZ);
+	        const deltas = this.buildUndoGroup(layer, before, after);
+	        if (deltas.length > 0) {
+	            this.callbacks.pushUndoGroup(deltas);
+	        }
+	        // Refresh display and notify backend of ALL changed slices
+	        this.refreshDisplay(layer, deltas);
+	        this.clearPreview();
+	    }
+	    // ── Sphere Eraser Click/PointerUp ──────────────────────────────
+	    /**
+	     * Handle pointer-down in sphereEraser mode.
+	     * Initializes drag tracking for cumulative undo.
+	     */
+	    onSphereEraserClick(e) {
+	        this.centerX = e.offsetX / this.ctx.nrrd_states.view.sizeFactor;
+	        this.centerY = e.offsetY / this.ctx.nrrd_states.view.sizeFactor;
+	        this.centerSlice = this.ctx.nrrd_states.view.currentSliceIndex;
+	        this.active = true;
+	        this.mode = "eraser";
+	        this.dragMoved = false;
+	        this.dragBeforeSnapshots.clear();
+	        // Capture initial "before" snapshots for the first sphere position
+	        const layer = this.ctx.gui_states.layerChannel.layer;
+	        const radius = this.ctx.nrrd_states.sphere.sphereBrushRadius;
+	        try {
+	            const vol = this.callbacks.getVolumeForLayer(layer);
+	            const dims = vol.getDimensions();
+	            const axis = this.ctx.protectedData.axis;
+	            const center = this.canvasToVoxelCenter(this.centerX, this.centerY, this.centerSlice, axis);
+	            const radii = this.getVoxelRadii(radius);
+	            const bb = this.getBoundingBox(center, radii, dims);
+	            this.expandDragBeforeSnapshots(vol, bb.minZ, bb.maxZ);
+	        }
+	        catch (_a) {
+	            // Volume not ready
+	        }
+	        this.drawPreview(this.centerX, this.centerY, radius, true);
+	    }
+	    /**
+	     * Handle pointer-move in sphereEraser mode — drag to continuously erase.
+	     */
+	    onSphereEraserMove(e) {
+	        if (!this.active || this.mode !== "eraser")
+	            return;
+	        this.dragMoved = true;
+	        const mouseX = e.offsetX / this.ctx.nrrd_states.view.sizeFactor;
+	        const mouseY = e.offsetY / this.ctx.nrrd_states.view.sizeFactor;
+	        const sliceIndex = this.ctx.nrrd_states.view.currentSliceIndex;
+	        const layer = this.ctx.gui_states.layerChannel.layer;
+	        const channel = this.ctx.gui_states.layerChannel.activeChannel || 1;
+	        const axis = this.ctx.protectedData.axis;
+	        const radius = this.ctx.nrrd_states.sphere.sphereBrushRadius;
+	        let vol;
+	        try {
+	            vol = this.callbacks.getVolumeForLayer(layer);
+	        }
+	        catch (_a) {
+	            return;
+	        }
+	        const dims = vol.getDimensions();
+	        const center = this.canvasToVoxelCenter(mouseX, mouseY, sliceIndex, axis);
+	        const radii = this.getVoxelRadii(radius);
+	        const bb = this.getBoundingBox(center, radii, dims);
+	        // Expand "before" snapshots to cover any new Z slices
+	        this.expandDragBeforeSnapshots(vol, bb.minZ, bb.maxZ);
+	        // Erase sphere at current position
+	        this.erase3DSphereFromVolume(vol, center, radii, bb, channel);
+	        // Update preview position
+	        this.drawPreview(mouseX, mouseY, radius, true);
+	        // Refresh display so user sees the erase in real-time
+	        this.refreshDisplay(layer);
+	    }
+	    /**
+	     * Handle pointer-up in sphereEraser mode — finalize erase + push undo group.
+	     * Works for both click-release and drag-release.
+	     */
+	    onSphereEraserPointerUp() {
+	        if (!this.active || this.mode !== "eraser")
+	            return;
+	        this.active = false;
+	        const layer = this.ctx.gui_states.layerChannel.layer;
+	        const channel = this.ctx.gui_states.layerChannel.activeChannel || 1;
+	        const axis = this.ctx.protectedData.axis;
+	        const radius = this.ctx.nrrd_states.sphere.sphereBrushRadius;
+	        let vol;
+	        try {
+	            vol = this.callbacks.getVolumeForLayer(layer);
+	        }
+	        catch (_a) {
+	            this.clearPreview();
+	            this.dragBeforeSnapshots.clear();
+	            return;
+	        }
+	        // If no drag occurred, erase at the click position (original click-release behavior)
+	        if (!this.dragMoved) {
+	            const dims = vol.getDimensions();
+	            const center = this.canvasToVoxelCenter(this.centerX, this.centerY, this.centerSlice, axis);
+	            const radii = this.getVoxelRadii(radius);
+	            const bb = this.getBoundingBox(center, radii, dims);
+	            this.erase3DSphereFromVolume(vol, center, radii, bb, channel);
+	        }
+	        // Build undo group from cumulative "before" snapshots vs current state
+	        const after = this.captureSliceSnapshots(vol, this.dragMinZ(), this.dragMaxZ());
+	        const deltas = this.buildUndoGroup(layer, this.dragBeforeSnapshots, after);
+	        if (deltas.length > 0) {
+	            this.callbacks.pushUndoGroup(deltas);
+	        }
+	        // Refresh display and notify backend of ALL changed slices
+	        this.refreshDisplay(layer, deltas);
+	        this.clearPreview();
+	        this.dragBeforeSnapshots.clear();
+	    }
+	    /**
+	     * Expand cumulative "before" snapshots to cover z range [minZ, maxZ].
+	     * Only captures slices not yet in the map (preserves original state).
+	     */
+	    expandDragBeforeSnapshots(vol, minZ, maxZ) {
+	        for (let z = minZ; z <= maxZ; z++) {
+	            if (!this.dragBeforeSnapshots.has(z)) {
+	                try {
+	                    const { data } = vol.getSliceUint8(z, 'z');
+	                    this.dragBeforeSnapshots.set(z, data.slice());
+	                }
+	                catch (_a) {
+	                    // slice out of bounds
+	                }
+	            }
+	        }
+	    }
+	    /** Get minimum Z index from drag snapshots */
+	    dragMinZ() {
+	        let min = Infinity;
+	        for (const z of this.dragBeforeSnapshots.keys()) {
+	            if (z < min)
+	                min = z;
+	        }
+	        return min === Infinity ? 0 : min;
+	    }
+	    /** Get maximum Z index from drag snapshots */
+	    dragMaxZ() {
+	        let max = -Infinity;
+	        for (const z of this.dragBeforeSnapshots.keys()) {
+	            if (z > max)
+	                max = z;
+	        }
+	        return max === -Infinity ? 0 : max;
+	    }
+	    // ── Post-write Display Refresh ─────────────────────────────────
+	    /**
+	     * After writing/erasing the sphere in the volume, re-render the current
+	     * slice's layer canvas and composite all layers to master.
+	     *
+	     * @param changedDeltas - If provided, fire onMaskChanged for ALL changed
+	     *   slices (not just the current view slice) so the backend receives the
+	     *   full 3D sphere data for NII/GLTF export.
+	     */
+	    refreshDisplay(layerId, changedDeltas) {
+	        // Re-render layer canvas from volume for the current slice
+	        const target = this.ctx.protectedData.layerTargets.get(layerId);
+	        if (target) {
+	            const { ctx, canvas } = target;
+	            canvas.width = canvas.width; // clear
+	            const buffer = this.callbacks.getOrCreateSliceBuffer(this.ctx.protectedData.axis);
+	            if (buffer) {
+	                this.callbacks.renderSliceToCanvas(layerId, this.ctx.protectedData.axis, this.ctx.nrrd_states.view.currentSliceIndex, buffer, ctx, this.ctx.nrrd_states.view.changedWidth, this.ctx.nrrd_states.view.changedHeight);
+	            }
+	        }
+	        // Composite all layers to master canvas
+	        this.callbacks.compositeAllLayers();
+	        // Fire onMaskChanged for ALL changed slices (not just the current view slice)
+	        // This ensures the backend receives the full 3D sphere data for export.
+	        try {
+	            const vol = this.callbacks.getVolumeForLayer(layerId);
+	            const channel = this.ctx.gui_states.layerChannel.activeChannel || 1;
+	            if (changedDeltas && changedDeltas.length > 0) {
+	                // Report every changed Z slice
+	                for (const delta of changedDeltas) {
+	                    const { data: sliceData, width, height } = vol.getSliceUint8(delta.sliceIndex, delta.axis);
+	                    this.ctx.callbacks.onMaskChanged(sliceData, layerId, channel, delta.sliceIndex, delta.axis, width, height, false);
+	                }
+	            }
+	            else {
+	                // Fallback: report only the current slice
+	                const axis = this.ctx.protectedData.axis;
+	                const sliceIndex = this.ctx.nrrd_states.view.currentSliceIndex;
+	                const { data: sliceData, width, height } = vol.getSliceUint8(sliceIndex, axis);
+	                this.ctx.callbacks.onMaskChanged(sliceData, layerId, channel, sliceIndex, axis, width, height, false);
+	            }
+	        }
+	        catch (_a) {
+	            // Volume not ready
+	        }
+	    }
+	    /** Whether a sphere placement is currently in progress */
+	    get isActive() {
+	        return this.active;
+	    }
+	}
+
 	/**
 	 * DrawToolCore — Tool orchestration and event routing.
 	 *
@@ -74929,6 +75427,7 @@ void main() {
 	            handleOnDrawingBrushCricleMove: (ev) => { },
 	            handleMouseZoomSliceWheel: (e) => { },
 	            handleSphereWheel: (e) => { },
+	            handleSphereBrushWheel: (e) => { },
 	        };
 	        this.contrastEventPrameters = {
 	            move_x: 0,
@@ -75011,6 +75510,16 @@ void main() {
 	            pushUndoDelta: (delta) => this.undoManager.push(delta),
 	            getEraserUrls: () => this.eraserUrls,
 	        });
+	        this.sphereBrushTool = new SphereBrushTool(toolCtx, {
+	            getVolumeForLayer: (layer) => this.renderer.getVolumeForLayer(layer),
+	            compositeAllLayers: () => this.renderer.compositeAllLayers(),
+	            pushUndoGroup: (deltas) => this.undoManager.pushGroup(deltas),
+	            renderSliceToCanvas: (layer, axis, sliceIndex, buffer, ctx, w, h) => this.renderer.renderSliceToCanvas(layer, axis, sliceIndex, buffer, ctx, w, h),
+	            getOrCreateSliceBuffer: (axis) => this.renderer.getOrCreateSliceBuffer(axis),
+	            setEmptyCanvasSize: (axis) => this.setEmptyCanvasSize(axis),
+	            reloadMasksFromVolume: () => this.reloadMasksFromVolume(),
+	            getEraserUrls: () => this.eraserUrls,
+	        });
 	    }
 	    initDrawToolCore() {
 	        // Initialize EventRouter for centralized event handling
@@ -75055,12 +75564,28 @@ void main() {
 	            if ((ev.ctrlKey || ev.metaKey) && (ev.key === redoKey || (ev.shiftKey && ev.key === undoKeyUpper))) {
 	                this.redoLastPainting();
 	            }
+	            // Handle mouse wheel mode toggle (Ctrl+1 = Scroll:Zoom, Ctrl+2 = Scroll:Slice)
+	            if ((ev.ctrlKey || ev.metaKey) && ev.key === '1') {
+	                ev.preventDefault();
+	                this.state.keyboardSettings.mouseWheel = 'Scroll:Zoom';
+	                this.updateMouseWheelEvent();
+	                return;
+	            }
+	            if ((ev.ctrlKey || ev.metaKey) && ev.key === '2') {
+	                ev.preventDefault();
+	                this.state.keyboardSettings.mouseWheel = 'Scroll:Slice';
+	                this.updateMouseWheelEvent();
+	                return;
+	            }
 	            // Handle crosshair toggle (allowed in drawing tools AND sphere mode)
 	            if (ev.key === this.state.keyboardSettings.crosshair) {
 	                this.eventRouter.toggleCrosshair();
 	            }
 	            // Handle draw mode (Shift key) - EventRouter already tracks this
-	            if (ev.key === this.state.keyboardSettings.draw && !this.state.gui_states.mode.sphere) {
+	            if (ev.key === this.state.keyboardSettings.draw
+	                && !this.state.gui_states.mode.sphere
+	                && !this.state.gui_states.mode.sphereBrush
+	                && !this.state.gui_states.mode.sphereEraser) {
 	                if (this.eventRouter.isCtrlHeld()) {
 	                    return; // Ctrl takes priority
 	                }
@@ -75112,11 +75637,16 @@ void main() {
 	            if (this.drawingTool.isActive || this.panTool.isActive) {
 	                this.drawingPrameters.handleOnDrawingMouseMove(e);
 	            }
+	            // Drag-erase: route move to sphereBrushTool when sphereEraser is active
+	            if (this.sphereBrushTool.isActive && this.state.gui_states.mode.sphereEraser) {
+	                this.sphereBrushTool.onSphereEraserMove(e);
+	            }
 	        });
 	        this.eventRouter.setPointerUpHandler((e) => {
 	            if (this.drawingTool.isActive || this.drawingTool.painting
 	                || this.panTool.isActive
-	                || (this.state.gui_states.mode.sphere && this.eventRouter.getMode() !== 'crosshair')) {
+	                || (this.state.gui_states.mode.sphere && this.eventRouter.getMode() !== 'crosshair')
+	                || this.sphereBrushTool.isActive) {
 	                this.drawingPrameters.handleOnDrawingMouseUp(e);
 	            }
 	        });
@@ -75131,6 +75661,9 @@ void main() {
 	            else if (this.activeWheelMode === 'sphere') {
 	                this.drawingPrameters.handleSphereWheel(e);
 	            }
+	            else if (this.activeWheelMode === 'sphereBrush') {
+	                this.drawingPrameters.handleSphereBrushWheel(e);
+	            }
 	        });
 	        // Bind all event listeners
 	        this.eventRouter.bindAll();
@@ -75194,6 +75727,8 @@ void main() {
 	        }
 	        // sphere Wheel
 	        this.drawingPrameters.handleSphereWheel = this.configMouseSphereWheel();
+	        // sphere brush Wheel
+	        this.drawingPrameters.handleSphereBrushWheel = this.sphereBrushTool.configSphereBrushWheel();
 	        // brush circle move — delegated to DrawingTool
 	        this.drawingPrameters.handleOnDrawingBrushCricleMove =
 	            this.drawingTool.createBrushTrackingHandler();
@@ -75224,6 +75759,16 @@ void main() {
 	                        e.offsetY / this.state.nrrd_states.view.sizeFactor;
 	                    this.enableCrosshair();
 	                }
+	                else if (this.state.gui_states.mode.sphereBrush && !this.eventRouter.isCrosshairEnabled()) {
+	                    // SphereBrush: direct click (no Shift needed)
+	                    this.activeWheelMode = 'sphereBrush';
+	                    this.sphereBrushTool.onSphereBrushClick(e);
+	                }
+	                else if (this.state.gui_states.mode.sphereEraser && !this.eventRouter.isCrosshairEnabled()) {
+	                    // SphereEraser: direct click (Shift handled at mode level)
+	                    this.activeWheelMode = 'sphereBrush';
+	                    this.sphereBrushTool.onSphereEraserClick(e);
+	                }
 	                else if (this.state.gui_states.mode.sphere && !this.eventRouter.isCrosshairEnabled()) {
 	                    this.handleSphereClick(e);
 	                }
@@ -75245,6 +75790,16 @@ void main() {
 	                    this.drawingTool.onPointerUp(e);
 	                    this.activeWheelMode = 'zoom';
 	                }
+	                else if (this.sphereBrushTool.isActive) {
+	                    // SphereBrush or SphereEraser pointer-up
+	                    if (this.state.gui_states.mode.sphereBrush) {
+	                        this.sphereBrushTool.onSphereBrushPointerUp();
+	                    }
+	                    else if (this.state.gui_states.mode.sphereEraser) {
+	                        this.sphereBrushTool.onSphereEraserPointerUp();
+	                    }
+	                    this.activeWheelMode = 'zoom';
+	                }
 	                else if (this.state.gui_states.mode.sphere &&
 	                    !this.eventRouter.isCrosshairEnabled()) {
 	                    this.sphereTool.onSpherePointerUp();
@@ -75289,7 +75844,9 @@ void main() {
 	                    }
 	                }
 	                this.state.protectedData.ctxes.drawingCtx.drawImage(this.state.protectedData.canvases.drawingCanvasLayerMaster, 0, 0);
-	                if (this.state.gui_states.mode.sphere) {
+	                if (this.state.gui_states.mode.sphere
+	                    || this.state.gui_states.mode.sphereBrush
+	                    || this.state.gui_states.mode.sphereEraser) {
 	                    this.state.protectedData.ctxes.drawingCtx.drawImage(this.state.protectedData.canvases.drawingSphereCanvas, 0, 0, this.state.nrrd_states.view.changedWidth, this.state.nrrd_states.view.changedHeight);
 	                }
 	            }
@@ -75476,24 +76033,26 @@ void main() {
 	     * Undo the last drawing operation on the active layer.
 	     */
 	    undoLastPainting() {
-	        const delta = this.undoManager.undo();
-	        if (!delta)
-	            return;
-	        try {
-	            const vol = this.renderer.getVolumeForLayer(delta.layerId);
-	            vol.setSliceUint8(delta.sliceIndex, delta.oldSlice, delta.axis);
-	        }
-	        catch (_a) {
+	        const entry = this.undoManager.undo();
+	        if (!entry)
 	            return;
-	        }
 	        this.state.protectedData.isDrawing = true;
-	        if (delta.axis === this.state.protectedData.axis && delta.sliceIndex === this.state.nrrd_states.view.currentSliceIndex) {
-	            this.applyUndoRedoToCanvas(delta.layerId);
-	        }
-	        if (!this.state.nrrd_states.flags.loadingMaskData) {
-	            const { data: sliceData, width, height } = this.renderer.getVolumeForLayer(delta.layerId)
-	                .getSliceUint8(delta.sliceIndex, delta.axis);
-	            this.state.annotationCallbacks.onMaskChanged(sliceData, delta.layerId, this.state.gui_states.layerChannel.activeChannel || 1, delta.sliceIndex, delta.axis, width, height, false);
+	        for (const delta of entry) {
+	            try {
+	                const vol = this.renderer.getVolumeForLayer(delta.layerId);
+	                vol.setSliceUint8(delta.sliceIndex, delta.oldSlice, delta.axis);
+	            }
+	            catch (_a) {
+	                continue;
+	            }
+	            if (delta.axis === this.state.protectedData.axis && delta.sliceIndex === this.state.nrrd_states.view.currentSliceIndex) {
+	                this.applyUndoRedoToCanvas(delta.layerId);
+	            }
+	            if (!this.state.nrrd_states.flags.loadingMaskData) {
+	                const { data: sliceData, width, height } = this.renderer.getVolumeForLayer(delta.layerId)
+	                    .getSliceUint8(delta.sliceIndex, delta.axis);
+	                this.state.annotationCallbacks.onMaskChanged(sliceData, delta.layerId, this.state.gui_states.layerChannel.activeChannel || 1, delta.sliceIndex, delta.axis, width, height, false);
+	            }
 	        }
 	        this.setIsDrawFalse(1000);
 	    }
@@ -75501,24 +76060,26 @@ void main() {
 	     * Redo the last undone operation on the active layer.
 	     */
 	    redoLastPainting() {
-	        const delta = this.undoManager.redo();
-	        if (!delta)
+	        const entry = this.undoManager.redo();
+	        if (!entry)
 	            return;
-	        try {
-	            const vol = this.renderer.getVolumeForLayer(delta.layerId);
-	            vol.setSliceUint8(delta.sliceIndex, delta.newSlice, delta.axis);
-	        }
-	        catch (_a) {
-	            return;
-	        }
 	        this.state.protectedData.isDrawing = true;
-	        if (delta.axis === this.state.protectedData.axis && delta.sliceIndex === this.state.nrrd_states.view.currentSliceIndex) {
-	            this.applyUndoRedoToCanvas(delta.layerId);
-	        }
-	        if (!this.state.nrrd_states.flags.loadingMaskData) {
-	            const { data: sliceData, width, height } = this.renderer.getVolumeForLayer(delta.layerId)
-	                .getSliceUint8(delta.sliceIndex, delta.axis);
-	            this.state.annotationCallbacks.onMaskChanged(sliceData, delta.layerId, this.state.gui_states.layerChannel.activeChannel || 1, delta.sliceIndex, delta.axis, width, height, false);
+	        for (const delta of entry) {
+	            try {
+	                const vol = this.renderer.getVolumeForLayer(delta.layerId);
+	                vol.setSliceUint8(delta.sliceIndex, delta.newSlice, delta.axis);
+	            }
+	            catch (_a) {
+	                continue;
+	            }
+	            if (delta.axis === this.state.protectedData.axis && delta.sliceIndex === this.state.nrrd_states.view.currentSliceIndex) {
+	                this.applyUndoRedoToCanvas(delta.layerId);
+	            }
+	            if (!this.state.nrrd_states.flags.loadingMaskData) {
+	                const { data: sliceData, width, height } = this.renderer.getVolumeForLayer(delta.layerId)
+	                    .getSliceUint8(delta.sliceIndex, delta.axis);
+	                this.state.annotationCallbacks.onMaskChanged(sliceData, delta.layerId, this.state.gui_states.layerChannel.activeChannel || 1, delta.sliceIndex, delta.axis, width, height, false);
+	            }
 	        }
 	        this.setIsDrawFalse(1000);
 	    }
@@ -75592,6 +76153,14 @@ void main() {
 	    exitSphereMode() {
 	        throw new Error("exitSphereMode must be provided by NrrdTools");
 	    }
+	    /** Override in NrrdTools */
+	    reloadMasksFromVolume() {
+	        throw new Error("reloadMasksFromVolume must be provided by NrrdTools");
+	    }
+	    /** Override in NrrdTools */
+	    updateMouseWheelEvent() {
+	        throw new Error("updateMouseWheelEvent must be provided by NrrdTools");
+	    }
 	}
 
 	/**
@@ -75655,6 +76224,7 @@ void main() {
 	            nippleSphereOrigin: null,
 	            sphereMaskVolume: null,
 	            sphereRadius: 5,
+	            sphereBrushRadius: 10,
 	        };
 	        this.flags = {
 	            stepClear: 1,
@@ -75676,6 +76246,7 @@ void main() {
 	        this.sphere.nippleSphereOrigin = null;
 	        this.sphere.sphereMaskVolume = null;
 	        this.sphere.sphereRadius = 5;
+	        this.sphere.sphereBrushRadius = 10;
 	    }
 	}
 
@@ -75697,6 +76268,8 @@ void main() {
 	            pencil: true,
 	            eraser: false,
 	            sphere: false,
+	            sphereBrush: false,
+	            sphereEraser: false,
 	            activeSphereType: "tumour",
 	        };
 	        this.drawing = {
@@ -75891,6 +76464,216 @@ void main() {
 	    }
 	}
 
+	/**
+	 * GaussianSmoother — 3D Gaussian smoothing for segmentation masks.
+	 *
+	 * Applies a separable 3D Gaussian blur to a single label channel within a
+	 * MaskVolume, then thresholds the result back to a binary mask. This smooths
+	 * jagged edges and fills small holes in segmentation annotations.
+	 *
+	 * Pure, stateless utility — no DOM/Canvas/GUI dependencies.
+	 *
+	 * Performance: uses direct typed-array access (bypassing getVoxel/setVoxel
+	 * boundary checks) and branch-free convolution for the interior region.
+	 */
+	class GaussianSmoother {
+	    /**
+	     * Smooth a single label channel in-place using separable 3D Gaussian blur.
+	     *
+	     * Steps:
+	     *  1. Extract — create a Float32Array with 1.0 where voxel === channel, 0.0 elsewhere.
+	     *  2. Blur — apply separable Gaussian (X → Y → Z) on the float buffer.
+	     *  3. Threshold — binarize at 0.5.
+	     *  4. Write back — overwrite/erase voxels according to the thresholded result.
+	     *
+	     * @param volume  The MaskVolume to operate on (modified in-place).
+	     * @param channel The label value to smooth (must be > 0).
+	     * @param sigma   Base Gaussian sigma in voxel units (default 1.0).
+	     * @param spacing Optional voxel spacing [sx, sy, sz]. When provided, per-axis
+	     *                sigma is computed as `sigma / spacing[axis]` so that the
+	     *                physical smoothing radius is isotropic.
+	     */
+	    static gaussianSmooth3D(volume, channel, sigma = 1.0, spacing) {
+	        const dims = volume.getDimensions();
+	        const { width, height, depth } = dims;
+	        const totalVoxels = width * height * depth;
+	        // Direct access to underlying buffer — bypasses getVoxel/setVoxel
+	        // boundary checks for ~10x speedup in hot loops.
+	        const rawData = volume.getRawData();
+	        const channels = volume.getChannels();
+	        const bytesPerSlice = volume.getBytesPerSlice();
+	        const rowStride = width * channels;
+	        // Compute per-axis sigma (normalized to voxel units)
+	        const sigmaX = spacing ? sigma / spacing[0] : sigma;
+	        const sigmaY = spacing ? sigma / spacing[1] : sigma;
+	        const sigmaZ = spacing ? sigma / spacing[2] : sigma;
+	        // 1. Extract binary float buffer — direct array access
+	        const buffer = new Float32Array(totalVoxels);
+	        for (let z = 0; z < depth; z++) {
+	            const zOffset = z * bytesPerSlice;
+	            for (let y = 0; y < height; y++) {
+	                const zyOffset = zOffset + y * rowStride;
+	                for (let x = 0; x < width; x++) {
+	                    const bufIdx = z * height * width + y * width + x;
+	                    buffer[bufIdx] = rawData[zyOffset + x * channels] === channel ? 1.0 : 0.0;
+	                }
+	            }
+	        }
+	        // 2. Separable Gaussian blur: X → Y → Z
+	        const kernelX = GaussianSmoother.generateKernel1D(sigmaX);
+	        const kernelY = GaussianSmoother.generateKernel1D(sigmaY);
+	        const kernelZ = GaussianSmoother.generateKernel1D(sigmaZ);
+	        GaussianSmoother.convolve1D(buffer, width, height, depth, 0, kernelX); // X axis
+	        GaussianSmoother.convolve1D(buffer, width, height, depth, 1, kernelY); // Y axis
+	        GaussianSmoother.convolve1D(buffer, width, height, depth, 2, kernelZ); // Z axis
+	        // 3 & 4. Threshold and write back — direct array access
+	        for (let z = 0; z < depth; z++) {
+	            const zOffset = z * bytesPerSlice;
+	            for (let y = 0; y < height; y++) {
+	                const zyOffset = zOffset + y * rowStride;
+	                for (let x = 0; x < width; x++) {
+	                    const bufIdx = z * height * width + y * width + x;
+	                    const smoothed = buffer[bufIdx] >= 0.5 ? 1 : 0;
+	                    const rawIdx = zyOffset + x * channels;
+	                    const original = rawData[rawIdx];
+	                    if (smoothed === 1 && original !== channel) {
+	                        // Smoothed region expands into this voxel — overwrite
+	                        rawData[rawIdx] = channel;
+	                    }
+	                    else if (smoothed === 0 && original === channel) {
+	                        // Smoothed region retreats — erase
+	                        rawData[rawIdx] = 0;
+	                    }
+	                    // Otherwise leave unchanged
+	                }
+	            }
+	        }
+	    }
+	    /**
+	     * Generate a normalized 1D Gaussian kernel truncated at ±3σ.
+	     *
+	     * @param sigma Standard deviation (in voxels). Must be > 0.
+	     * @returns Normalized Float32Array of odd length.
+	     */
+	    static generateKernel1D(sigma) {
+	        if (sigma <= 0) {
+	            return new Float32Array([1.0]);
+	        }
+	        const radius = Math.ceil(sigma * 3);
+	        const size = 2 * radius + 1;
+	        const kernel = new Float32Array(size);
+	        const twoSigmaSq = 2 * sigma * sigma;
+	        let sum = 0;
+	        for (let i = 0; i < size; i++) {
+	            const x = i - radius;
+	            kernel[i] = Math.exp(-(x * x) / twoSigmaSq);
+	            sum += kernel[i];
+	        }
+	        // Normalize
+	        for (let i = 0; i < size; i++) {
+	            kernel[i] /= sum;
+	        }
+	        return kernel;
+	    }
+	    /**
+	     * In-place single-axis convolution with zero-padding at boundaries.
+	     *
+	     * Uses a 3-segment approach: left boundary (with bounds check),
+	     * middle interior (branch-free, ~95% of work), right boundary
+	     * (with bounds check). This eliminates per-element branching
+	     * in the hot inner loop.
+	     *
+	     * @param data   Flat float buffer (width × height × depth).
+	     * @param width  X dimension.
+	     * @param height Y dimension.
+	     * @param depth  Z dimension.
+	     * @param axis   0 = X, 1 = Y, 2 = Z.
+	     * @param kernel 1D convolution kernel (odd length).
+	     */
+	    static convolve1D(data, width, height, depth, axis, kernel) {
+	        const kLen = kernel.length;
+	        const radius = (kLen - 1) / 2;
+	        // Determine the dimension length along the convolution axis
+	        // and the stride between consecutive elements along that axis
+	        let axisLen;
+	        let stride;
+	        let outerCount;
+	        if (axis === 0) {
+	            // X axis: stride = 1, iterate over all (y, z) lines
+	            axisLen = width;
+	            stride = 1;
+	            outerCount = height * depth;
+	        }
+	        else if (axis === 1) {
+	            // Y axis: stride = width, iterate over all (x, z) lines
+	            axisLen = height;
+	            stride = width;
+	            outerCount = width * depth;
+	        }
+	        else {
+	            // Z axis: stride = width * height, iterate over all (x, y) lines
+	            axisLen = depth;
+	            stride = width * height;
+	            outerCount = width * height;
+	        }
+	        // Precompute middle segment bounds
+	        const midStart = radius;
+	        const midEnd = axisLen - radius;
+	        // Temporary line buffer to avoid read-after-write issues
+	        const line = new Float32Array(axisLen);
+	        for (let outer = 0; outer < outerCount; outer++) {
+	            // Compute the starting index for this line
+	            let lineStart;
+	            if (axis === 0) {
+	                lineStart = outer * width;
+	            }
+	            else if (axis === 1) {
+	                const z = Math.floor(outer / width);
+	                const x = outer % width;
+	                lineStart = z * width * height + x;
+	            }
+	            else {
+	                lineStart = outer;
+	            }
+	            // Read the line
+	            for (let i = 0; i < axisLen; i++) {
+	                line[i] = data[lineStart + i * stride];
+	            }
+	            // Left boundary segment (i = 0 .. radius-1): lower bound check
+	            for (let i = 0; i < midStart; i++) {
+	                let sum = 0;
+	                for (let k = 0; k < kLen; k++) {
+	                    const j = i + k - radius;
+	                    if (j >= 0) {
+	                        sum += line[j] * kernel[k];
+	                    }
+	                }
+	                data[lineStart + i * stride] = sum;
+	            }
+	            // Middle segment (i = radius .. axisLen-radius-1): NO bounds check
+	            for (let i = midStart; i < midEnd; i++) {
+	                let sum = 0;
+	                const lineOffset = i - radius;
+	                for (let k = 0; k < kLen; k++) {
+	                    sum += line[lineOffset + k] * kernel[k];
+	                }
+	                data[lineStart + i * stride] = sum;
+	            }
+	            // Right boundary segment (i = axisLen-radius .. axisLen-1): upper bound check
+	            for (let i = midEnd; i < axisLen; i++) {
+	                let sum = 0;
+	                for (let k = 0; k < kLen; k++) {
+	                    const j = i + k - radius;
+	                    if (j < axisLen) {
+	                        sum += line[j] * kernel[k];
+	                    }
+	                }
+	                data[lineStart + i * stride] = sum;
+	            }
+	        }
+	    }
+	}
+
 	/**
 	 * Manages layer/channel state: active selection, visibility, and channel colors.
 	 *
@@ -76407,6 +77190,8 @@ void main() {
 	     * Then update the changedWidth and changedHeight based on the sizeFactor.
 	     */
 	    updateOriginAndChangedWH() {
+	        const prevW = this.ctx.nrrd_states.image.originWidth;
+	        const prevH = this.ctx.nrrd_states.image.originHeight;
 	        this.ctx.nrrd_states.image.originWidth =
 	            this.ctx.protectedData.canvases.originCanvas.width;
 	        this.ctx.nrrd_states.image.originHeight =
@@ -76415,7 +77200,12 @@ void main() {
 	        // Setting them here would defeat the sizeChanged detection in resizePaintArea,
 	        // causing canvas elements to keep stale dimensions after axis switches.
 	        this.resizePaintArea(this.ctx.nrrd_states.view.sizeFactor);
-	        this.resetPaintAreaUIPosition();
+	        // Only re-center when origin dimensions changed (e.g. axis switch).
+	        // Contrast toggle doesn't change origin size, so skip to preserve user's pan/zoom.
+	        if (prevW !== this.ctx.nrrd_states.image.originWidth ||
+	            prevH !== this.ctx.nrrd_states.image.originHeight) {
+	            this.resetPaintAreaUIPosition();
+	        }
 	    }
 	    /**
 	     * Keep all contrast slice index to same.
@@ -76629,7 +77419,7 @@ void main() {
 	        // Wire RenderingUtils' setEmptyCanvasSize callback
 	        this.drawCore.renderer.setEmptyCanvasSize = (axis) => this.setEmptyCanvasSize(axis);
 	        this.init();
-	        this.dragOperator = new DragOperator(this.container, this.state.nrrd_states, this.state.gui_states, this.state.protectedData, this.drawCore.drawingPrameters, this.setSyncsliceNum.bind(this), this.setIsDrawFalse.bind(this), this.flipDisplayImageByAxis.bind(this), this.setEmptyCanvasSize.bind(this), this.drawCore.renderer.getOrCreateSliceBuffer.bind(this.drawCore.renderer), this.drawCore.renderer.renderSliceToCanvas.bind(this.drawCore.renderer));
+	        this.dragOperator = new DragOperator(this.container, this.state.nrrd_states, this.state.gui_states, this.state.protectedData, this.drawCore.drawingPrameters, this.setSyncsliceNum.bind(this), this.setIsDrawFalse.bind(this), this.flipDisplayImageByAxis.bind(this), this.setEmptyCanvasSize.bind(this), this.drawCore.renderer.getOrCreateSliceBuffer.bind(this.drawCore.renderer), this.drawCore.renderer.renderSliceToCanvas.bind(this.drawCore.renderer), this.drawCore.renderer.compositeAllLayers.bind(this.drawCore.renderer));
 	        // Inject EventRouter into DragOperator for centralized event handling
 	        if (this.drawCore.eventRouter) {
 	            this.dragOperator.setEventRouter(this.drawCore.eventRouter);
@@ -76656,6 +77446,8 @@ void main() {
 	        this.drawCore.enterSphereMode = () => this.enterSphereMode();
 	        this.drawCore.exitSphereMode = () => this.exitSphereMode();
 	        this.drawCore.configMouseSliceWheel = () => this.configMouseSliceWheel();
+	        this.drawCore.reloadMasksFromVolume = () => this.reloadMasksFromVolume();
+	        this.drawCore.updateMouseWheelEvent = () => this.updateMouseWheelEvent();
 	    }
 	    /**
 	     * A initialise function for nrrd_tools
@@ -76776,13 +77568,18 @@ void main() {
 	     * Set the current tool mode.
 	     */
 	    setMode(mode) {
+	        var _a, _b, _c;
 	        if (!this.guiCallbacks)
 	            return;
 	        const prevSphere = this.state.gui_states.mode.sphere;
+	        const prevSphereBrush = this.state.gui_states.mode.sphereBrush;
+	        const prevSphereEraser = this.state.gui_states.mode.sphereEraser;
 	        const prevCalculator = this._calculatorActive;
 	        this.state.gui_states.mode.pencil = false;
 	        this.state.gui_states.mode.eraser = false;
 	        this.state.gui_states.mode.sphere = false;
+	        this.state.gui_states.mode.sphereBrush = false;
+	        this.state.gui_states.mode.sphereEraser = false;
 	        this._calculatorActive = false;
 	        switch (mode) {
 	            case "pencil":
@@ -76803,6 +77600,24 @@ void main() {
 	                this.state.gui_states.mode.sphere = true;
 	                this._calculatorActive = true;
 	                break;
+	            case "sphereBrush":
+	                this.state.gui_states.mode.sphereBrush = true;
+	                this.dragOperator.removeDragMode();
+	                (_a = this.drawCore.eventRouter) === null || _a === void 0 ? void 0 : _a.setGuiTool('sphereBrush');
+	                break;
+	            case "sphereEraser":
+	                this.state.gui_states.mode.sphereEraser = true;
+	                this.dragOperator.removeDragMode();
+	                (_b = this.drawCore.eventRouter) === null || _b === void 0 ? void 0 : _b.setGuiTool('sphereEraser');
+	                break;
+	        }
+	        // Restore drag mode when leaving sphereBrush/sphereEraser
+	        if ((prevSphereBrush || prevSphereEraser)
+	            && !this.state.gui_states.mode.sphereBrush
+	            && !this.state.gui_states.mode.sphereEraser
+	            && !this.state.gui_states.mode.sphere) {
+	            this.dragOperator.configDragMode();
+	            (_c = this.drawCore.eventRouter) === null || _c === void 0 ? void 0 : _c.setGuiTool('pencil');
 	        }
 	        if (prevSphere && !this.state.gui_states.mode.sphere) {
 	            this.guiCallbacks.updateSphereState();
@@ -76815,6 +77630,10 @@ void main() {
 	    getMode() {
 	        if (this._calculatorActive)
 	            return "calculator";
+	        if (this.state.gui_states.mode.sphereBrush)
+	            return "sphereBrush";
+	        if (this.state.gui_states.mode.sphereEraser)
+	            return "sphereEraser";
 	        if (this.state.gui_states.mode.sphere)
 	            return "sphere";
 	        if (this.state.gui_states.mode.eraser)
@@ -76840,6 +77659,12 @@ void main() {
 	    getBrushSize() {
 	        return this.state.gui_states.drawing.brushAndEraserSize;
 	    }
+	    setSphereBrushRadius(radius) {
+	        this.state.nrrd_states.sphere.sphereBrushRadius = Math.max(1, Math.min(50, radius));
+	    }
+	    getSphereBrushRadius() {
+	        return this.state.nrrd_states.sphere.sphereBrushRadius;
+	    }
 	    setWindowHigh(value) {
 	        var _a;
 	        this.state.gui_states.viewConfig.readyToUpdate = false;
@@ -76913,7 +77738,8 @@ void main() {
 	    getPencilColor() {
 	        return this.state.gui_states.drawing.color;
 	    }
-	    executeAction(action) {
+	    executeAction(action, opts) {
+	        var _a;
 	        switch (action) {
 	            case "undo":
 	                this.undo();
@@ -76951,6 +77777,48 @@ void main() {
 	                enableDownload(config);
 	                break;
 	            }
+	            case "gaussianSmooth": {
+	                const layerId = this.state.gui_states.layerChannel.layer;
+	                const channel = this.state.gui_states.layerChannel.activeChannel;
+	                const volume = this.drawCore.renderer.getVolumeForLayer(layerId);
+	                if (volume && channel > 0) {
+	                    const dims = volume.getDimensions();
+	                    // 1. Snapshot all Z-slices before mutation (undo support)
+	                    const deltas = [];
+	                    for (let z = 0; z < dims.depth; z++) {
+	                        const sliceData = volume.getSliceUint8(z, "z").data;
+	                        const hasChannel = sliceData.some((v) => v === channel);
+	                        if (hasChannel) {
+	                            deltas.push({
+	                                layerId,
+	                                axis: "z",
+	                                sliceIndex: z,
+	                                oldSlice: sliceData.slice(),
+	                                newSlice: new Uint8Array(0), // placeholder, filled after smoothing
+	                            });
+	                        }
+	                    }
+	                    // 2. Apply smoothing with anisotropic spacing
+	                    const spacing = this.state.nrrd_states.image.voxelSpacing;
+	                    const spacingTuple = spacing.length >= 3 ? [spacing[0], spacing[1], spacing[2]] : undefined;
+	                    const sigma = (_a = opts === null || opts === void 0 ? void 0 : opts.sigma) !== null && _a !== void 0 ? _a : 1.0;
+	                    GaussianSmoother.gaussianSmooth3D(volume, channel, sigma, spacingTuple);
+	                    // 3. Capture newSlice data after smoothing and push undo group
+	                    for (const delta of deltas) {
+	                        delta.newSlice = volume.getSliceUint8(delta.sliceIndex, "z").data.slice();
+	                    }
+	                    if (deltas.length > 0) {
+	                        this.drawCore.undoManager.pushGroup(deltas);
+	                    }
+	                    // 4. Notify backend for each changed slice
+	                    for (const delta of deltas) {
+	                        const { data: sliceData, width, height } = volume.getSliceUint8(delta.sliceIndex, "z");
+	                        this.state.annotationCallbacks.onMaskChanged(sliceData, layerId, channel, delta.sliceIndex, "z", width, height, false);
+	                    }
+	                    this.reloadMasksFromVolume();
+	                }
+	                break;
+	            }
 	        }
 	    }
 	    // ═══════════════════════════════════════════════════════════════════════════
@@ -77389,10 +78257,15 @@ void main() {
 	    // ═══════════════════════════════════════════════════════════════════════════
 	    configMouseSliceWheel() {
 	        const handleMouseZoomSliceWheelMove = (e) => {
-	            var _a;
+	            var _a, _b;
 	            if ((_a = this.drawCore.eventRouter) === null || _a === void 0 ? void 0 : _a.isShiftHeld()) {
 	                return;
 	            }
+	            // Block slice wheel when sphereBrush/sphereEraser is actively placing (left button held)
+	            if ((this.state.gui_states.mode.sphereBrush || this.state.gui_states.mode.sphereEraser)
+	                && ((_b = this.drawCore.eventRouter) === null || _b === void 0 ? void 0 : _b.isLeftButtonDown())) {
+	                return;
+	            }
 	            e.preventDefault();
 	            if (e.deltaY < 0) {
 	                this.setSliceMoving(-1);
@@ -77660,13 +78533,14 @@ void main() {
 	}
 
 	// import * as kiwrious from "copper3d_plugin_heart_k";
-	const REVISION = "v3.1.2-beta";
+	const REVISION = "v3.2.1-beta";
 	console.log(`%cCopper3D Visualisation %cBeta:${REVISION}`, "padding: 3px;color:white; background:#023047", "padding: 3px;color:white; background:#f50a25");
 
 	exports.CHANNEL_COLORS = CHANNEL_COLORS;
 	exports.CHANNEL_HEX_COLORS = CHANNEL_HEX_COLORS;
 	exports.CameraViewPoint = CameraViewPoint;
 	exports.Copper3dTrackballControls = Copper3dTrackballControls;
+	exports.GaussianSmoother = GaussianSmoother;
 	exports.MeshNodeTool = MeshNodeTool;
 	exports.NrrdTools = NrrdTools;
 	exports.REVISION = REVISION;