@cornerstonejs/tools 5.4.16 → 5.5.0

package/dist/esm/tools/SliceIntersectionTool.js

@@ -0,0 +1,1065 @@
+import { mat4, vec2, vec3 } from 'gl-matrix';
+import { getEnabledElement, getEnabledElementByIds, eventTarget, triggerEvent, utilities as csUtils, CONSTANTS, Enums, } from '@cornerstonejs/core';
+import { AnnotationTool } from './base/index.js';
+import { getToolGroup } from '../store/ToolGroupManager/index.js';
+import { state } from '../store/state.js';
+import { Events } from '../enums/index.js';
+import { addAnnotation, getAnnotations, removeAnnotation, } from '../stateManagement/annotation/annotationState.js';
+import { drawCircle as drawCircleSvg, drawLine as drawLineSvg, } from '../drawingSvg/index.js';
+import { resetElementCursor, hideElementCursor, } from '../cursors/elementCursor.js';
+import triggerAnnotationRenderForViewportIds from '../utilities/triggerAnnotationRenderForViewportIds.js';
+import getViewportICamera from '../utilities/getViewportICamera.js';
+import { navigatePlanarViewportToPoint } from '../utilities/genericViewportToolHelpers.js';
+import * as lineSegment from '../utilities/math/line/index.js';
+import { getViewportPlane, intersectPlanes, distancePointToPlane, clipWorldLineToViewportCanvas, translateViewportAlongNormal, } from '../utilities/spatial/index.js';
+const { ViewportType } = Enums;
+const { RENDERING_DEFAULTS } = CONSTANTS;
+const LINE_PROXIMITY = 6;
+const MIN_SLAB_HANDLE_CANVAS_OFFSET = 12;
+const SLAB_HANDLE_LINE_FRACTION = 0.85;
+const MAX_INTERMEDIATE_LINES = 50;
+class SliceIntersectionTool extends AnnotationTool {
+    constructor(toolProps = {}, defaultToolProps = {
+        supportedInteractionTypes: ['Mouse', 'Touch'],
+        configuration: {
+            showCurrentSliceLine: true,
+            showSlabThickness: true,
+            showBoundaryLines: false,
+            showIntermediateLines: false,
+            draggable: true,
+            rotatable: true,
+            slabThicknessControls: true,
+            lineWidth: 1,
+            activeLineWidth: 2.5,
+            handleRadius: 3,
+            alignGroupsOnEnable: true,
+            rotationPivotPolicy: 'currentIntersection',
+            familyColors: {
+                axial: 'rgb(200, 60, 60)',
+                sagittal: 'rgb(220, 200, 60)',
+                coronal: 'rgb(60, 200, 60)',
+            },
+            setWorldCrosshairOnIntersectionDoubleClick: false,
+            jumpToIntersectionOnDoubleClick: false,
+            slabThicknessBlendMode: Enums.BlendModes.MAXIMUM_INTENSITY_BLEND,
+            perViewportLines: false,
+        },
+    }) {
+        super(toolProps, defaultToolProps);
+        this._activeOperation = null;
+        this._renderedLines = new Map();
+        this._pendingHandle = null;
+        this._editData = null;
+        this._mprFamilyByViewportId = new Map();
+        this._passViewportsById = null;
+        this._passPlaneGroups = null;
+        this._passCacheClearScheduled = false;
+        this.onCameraModified = (evt) => {
+            const viewportId = evt.detail?.viewportId;
+            if (!viewportId) {
+                this._renderToolViewports();
+                return;
+            }
+            const viewportIdsToRender = new Set();
+            for (const [targetViewportId, lines] of this._renderedLines) {
+                if (targetViewportId === viewportId) {
+                    if (lines.length) {
+                        viewportIdsToRender.add(targetViewportId);
+                    }
+                    continue;
+                }
+                if (lines.some((line) => line.leaderViewportId === viewportId)) {
+                    viewportIdsToRender.add(targetViewportId);
+                }
+            }
+            if (viewportIdsToRender.size) {
+                triggerAnnotationRenderForViewportIds([...viewportIdsToRender]);
+            }
+        };
+        this.renderAnnotation = (enabledElement, svgDrawingHelper) => {
+            const { viewport: targetViewport } = enabledElement;
+            const lines = this._computeLinesForTarget(targetViewport);
+            this._renderedLines.set(targetViewport.id, lines);
+            if (!lines.length) {
+                return false;
+            }
+            const annotation = this._getOrCreateViewportAnnotation(targetViewport);
+            const annotationUID = annotation?.annotationUID ?? `SliceIntersection-${targetViewport.id}`;
+            const { lineWidth, activeLineWidth, handleRadius, showCurrentSliceLine } = this.configuration;
+            lines.forEach((lineInfo) => {
+                const { groupId, canvasPoints, color, isActive } = lineInfo;
+                const width = isActive ? activeLineWidth : lineWidth;
+                if (showCurrentSliceLine) {
+                    drawLineSvg(svgDrawingHelper, annotationUID, `line-${groupId}`, canvasPoints[0], canvasPoints[1], {
+                        color,
+                        width,
+                    }, `${annotationUID}-line-${groupId}`);
+                }
+                lineInfo.slabLineSegments.forEach((segment, index) => {
+                    drawLineSvg(svgDrawingHelper, annotationUID, `slab-${groupId}-${index}`, segment[0], segment[1], {
+                        color,
+                        width: 1,
+                        lineDash: '4,4',
+                        strokeOpacity: 0.8,
+                    });
+                });
+                lineInfo.boundaryLineSegments.forEach((segment, index) => {
+                    drawLineSvg(svgDrawingHelper, annotationUID, `boundary-${groupId}-${index}`, segment[0], segment[1], {
+                        color,
+                        width: 1,
+                        lineDash: '4,4',
+                        strokeOpacity: 0.8,
+                    });
+                });
+                lineInfo.rotateHandles.forEach((handleCanvas, index) => {
+                    drawCircleSvg(svgDrawingHelper, annotationUID, `rotate-handle-${groupId}-${index}`, handleCanvas, handleRadius, {
+                        color,
+                        fill: color,
+                    });
+                });
+                lineInfo.slabHandles.forEach((handleCanvas, index) => {
+                    drawCircleSvg(svgDrawingHelper, annotationUID, `slab-handle-${groupId}-${index}`, handleCanvas, handleRadius, {
+                        color,
+                        fill: 'transparent',
+                    });
+                });
+            });
+            return true;
+        };
+        this.addNewAnnotation = (evt) => {
+            const { element } = evt.detail;
+            const enabledElement = getEnabledElement(element);
+            if (!enabledElement) {
+                return this._createDetachedAnnotation();
+            }
+            return (this._getOrCreateViewportAnnotation(enabledElement.viewport) ??
+                this._createDetachedAnnotation());
+        };
+        this.isPointNearTool = (element, _annotation, canvasCoords, _proximity, _interactionType) => {
+            const enabledElement = getEnabledElement(element);
+            if (!enabledElement) {
+                return false;
+            }
+            return !!this._findLineNear(enabledElement.viewport.id, canvasCoords, LINE_PROXIMITY, true);
+        };
+        this.toolSelectedCallback = (evt, _annotation) => {
+            const { element, currentPoints } = evt.detail;
+            const enabledElement = getEnabledElement(element);
+            if (!enabledElement) {
+                return;
+            }
+            const lineInfo = this._findLineNear(enabledElement.viewport.id, currentPoints.canvas, LINE_PROXIMITY);
+            if (!lineInfo) {
+                return;
+            }
+            this._selectLine(lineInfo);
+            if (this.configuration.draggable) {
+                this._startManipulation(element, lineInfo, 'translate');
+            }
+            evt.preventDefault();
+        };
+        this.handleSelectedCallback = (evt, _annotation, _handle, _interactionType = 'Mouse') => {
+            const { element } = evt.detail;
+            const pendingHandle = this._pendingHandle;
+            this._pendingHandle = null;
+            if (!pendingHandle) {
+                return;
+            }
+            const { operation, lineInfo } = pendingHandle;
+            if (operation === 'rotate' && !this.configuration.rotatable) {
+                return;
+            }
+            if (operation === 'slabThickness' &&
+                !this.configuration.slabThicknessControls) {
+                return;
+            }
+            this._selectLine(lineInfo);
+            this._startManipulation(element, lineInfo, operation);
+            evt.preventDefault();
+        };
+        this.doubleClickCallback = (evt) => {
+            const { setWorldCrosshairOnIntersectionDoubleClick, jumpToIntersectionOnDoubleClick, } = this.configuration;
+            if (!setWorldCrosshairOnIntersectionDoubleClick &&
+                !jumpToIntersectionOnDoubleClick) {
+                return;
+            }
+            const { element, currentPoints } = evt.detail;
+            const enabledElement = getEnabledElement(element);
+            if (!enabledElement) {
+                return;
+            }
+            const { viewport } = enabledElement;
+            const lineInfo = this._findLineNear(viewport.id, currentPoints.canvas, LINE_PROXIMITY);
+            if (!lineInfo) {
+                return;
+            }
+            const pointOnLine = this._closestPointOnLine(lineInfo.line, currentPoints.world);
+            if (jumpToIntersectionOnDoubleClick) {
+                this._centerViewportOnPoint(viewport, pointOnLine);
+            }
+            if (setWorldCrosshairOnIntersectionDoubleClick) {
+                const worldCrosshairInstance = getToolGroup(this.toolGroupId)?.getToolInstance?.('WorldCrosshair');
+                worldCrosshairInstance?.setWorldPoint?.(pointOnLine, {
+                    sourceViewportId: viewport.id,
+                    sourceRenderingEngineId: enabledElement.renderingEngine?.id,
+                    frameOfReferenceUID: enabledElement.FrameOfReferenceUID,
+                });
+            }
+            evt.preventDefault();
+        };
+        this.mouseMoveCallback = (evt, _filteredToolAnnotations) => {
+            const { element, currentPoints } = evt.detail;
+            const enabledElement = getEnabledElement(element);
+            if (!enabledElement) {
+                return false;
+            }
+            const { viewport } = enabledElement;
+            if (!this._isPlanarViewport(viewport)) {
+                return false;
+            }
+            const lineInfo = this._findLineNear(viewport.id, currentPoints.canvas, LINE_PROXIMITY, true);
+            let needsRedraw = false;
+            if (lineInfo) {
+                if (this._activeGroupId !== lineInfo.groupId ||
+                    this._activeTargetViewportId !== viewport.id) {
+                    this._activeGroupId = lineInfo.groupId;
+                    this._activeTargetViewportId = viewport.id;
+                    needsRedraw = true;
+                }
+                return needsRedraw;
+            }
+            if (this._activeTargetViewportId === viewport.id) {
+                this._activeTargetViewportId = undefined;
+                needsRedraw = true;
+            }
+            return needsRedraw;
+        };
+        this.filterInteractableAnnotationsForElement = (element, annotations) => {
+            if (!annotations?.length) {
+                return [];
+            }
+            const enabledElement = getEnabledElement(element);
+            if (!enabledElement) {
+                return [];
+            }
+            const { viewportId } = enabledElement;
+            return annotations.filter((annotation) => annotation.data.viewportId ===
+                viewportId);
+        };
+        this.cancel = (element) => {
+            if (this._editData) {
+                this._endManipulation(element, { suppressEvents: false });
+            }
+        };
+        this._endCallback = (evt) => {
+            const { element } = evt.detail;
+            this._endManipulation(element);
+        };
+        this._dragCallback = (evt) => {
+            const editData = this._editData;
+            if (!editData) {
+                return;
+            }
+            const members = editData.memberViewportIds
+                .map((viewportId) => this._getViewportById(viewportId))
+                .filter(Boolean);
+            if (!members.length) {
+                return;
+            }
+            switch (editData.operation) {
+                case 'translate':
+                    this._applyTranslate(members, evt, editData);
+                    break;
+                case 'rotate':
+                    this._applyRotate(members, evt, editData);
+                    break;
+                case 'slabThickness':
+                    this._applySlabThickness(members, evt, editData);
+                    break;
+            }
+            this._renderToolViewports();
+        };
+    }
+    getState() {
+        return {
+            toolGroupId: this.toolGroupId,
+            activeGroupId: this._activeGroupId,
+            activeTargetViewportId: this._activeTargetViewportId,
+            activeOperation: this._activeOperation,
+        };
+    }
+    getPlaneGroups() {
+        return this._getPlaneGroups().map((group) => ({
+            ...group,
+            viewportIds: [...group.viewportIds],
+        }));
+    }
+    refreshPlaneFamilies() {
+        this._mprFamilyByViewportId.clear();
+        this._clearPassCaches();
+        this._renderToolViewports();
+    }
+    onSetToolEnabled() {
+        if (this.configuration.alignGroupsOnEnable) {
+            this._alignPlaneGroups();
+        }
+        this._renderToolViewports();
+    }
+    onSetToolActive() {
+        this.onSetToolEnabled();
+    }
+    onSetToolPassive() {
+        this.onSetToolEnabled();
+    }
+    onSetToolDisabled() {
+        this._editData = null;
+        this._pendingHandle = null;
+        this._activeOperation = null;
+        this._activeGroupId = undefined;
+        this._activeTargetViewportId = undefined;
+        state.isInteractingWithTool = false;
+        this._renderedLines.clear();
+        this._mprFamilyByViewportId.clear();
+        this._clearPassCaches();
+        this._getViewportsInfo().forEach(({ viewportId, renderingEngineId }) => {
+            const enabledElement = getEnabledElementByIds(viewportId, renderingEngineId);
+            if (!enabledElement) {
+                return;
+            }
+            const annotations = getAnnotations(this.getToolName(), enabledElement.viewport.element);
+            annotations?.forEach((annotation) => {
+                removeAnnotation(annotation.annotationUID);
+            });
+        });
+    }
+    _getMprFamily(viewport) {
+        const cached = this._mprFamilyByViewportId.get(viewport.id);
+        if (cached) {
+            return cached;
+        }
+        const plane = getViewportPlane(viewport);
+        if (!plane) {
+            return null;
+        }
+        const [x, y, z] = plane.normal.map(Math.abs);
+        const family = z >= x && z >= y ? 'axial' : x >= y ? 'sagittal' : 'coronal';
+        this._mprFamilyByViewportId.set(viewport.id, family);
+        return family;
+    }
+    _getPlaneGroups() {
+        if (!this._passPlaneGroups) {
+            this._passPlaneGroups = this._computePlaneGroups();
+            this._schedulePassCacheClear();
+        }
+        return this._passPlaneGroups;
+    }
+    _computePlaneGroups() {
+        const planarViewports = this._getToolGroupViewports().filter((viewport) => this._isPlanarViewport(viewport));
+        if (this.configuration.perViewportLines) {
+            return planarViewports
+                .map((viewport) => {
+                const family = this._getMprFamily(viewport);
+                const frameOfReferenceUID = viewport.getFrameOfReferenceUID?.();
+                if (!family || !frameOfReferenceUID) {
+                    return null;
+                }
+                return {
+                    id: viewport.id,
+                    family,
+                    frameOfReferenceUID,
+                    viewportIds: [viewport.id],
+                    leaderViewportId: viewport.id,
+                };
+            })
+                .filter(Boolean);
+        }
+        const groups = new Map();
+        planarViewports.forEach((viewport) => {
+            const family = this._getMprFamily(viewport);
+            const frameOfReferenceUID = viewport.getFrameOfReferenceUID?.();
+            if (!family || !frameOfReferenceUID) {
+                return;
+            }
+            const id = `${frameOfReferenceUID}:${family}`;
+            let group = groups.get(id);
+            if (!group) {
+                group = {
+                    id,
+                    family,
+                    frameOfReferenceUID,
+                    viewportIds: [],
+                    leaderViewportId: viewport.id,
+                };
+                groups.set(id, group);
+            }
+            group.viewportIds.push(viewport.id);
+            const currentLeader = this._getViewportById(group.leaderViewportId);
+            if (!this._isVolumeModeViewport(currentLeader) &&
+                this._isVolumeModeViewport(viewport)) {
+                group.leaderViewportId = viewport.id;
+            }
+        });
+        return [...groups.values()];
+    }
+    _alignPlaneGroups() {
+        const previousInteracting = state.isInteractingWithTool;
+        state.isInteractingWithTool = true;
+        try {
+            this._getPlaneGroups().forEach((group) => {
+                if (group.viewportIds.length < 2) {
+                    return;
+                }
+                const leader = this._getViewportById(group.leaderViewportId);
+                const leaderPlane = leader && getViewportPlane(leader);
+                if (!leaderPlane) {
+                    return;
+                }
+                group.viewportIds.forEach((viewportId) => {
+                    if (viewportId === group.leaderViewportId) {
+                        return;
+                    }
+                    const member = this._getViewportById(viewportId);
+                    if (!member || !this._isPlanarViewport(member)) {
+                        return;
+                    }
+                    if (navigatePlanarViewportToPoint(member, leaderPlane.point)) {
+                        member.render();
+                    }
+                });
+            });
+        }
+        finally {
+            state.isInteractingWithTool = previousInteracting;
+        }
+    }
+    _computeLinesForTarget(targetViewport) {
+        if (!targetViewport || !this._isPlanarViewport(targetViewport)) {
+            return [];
+        }
+        const targetPlane = getViewportPlane(targetViewport);
+        if (!targetPlane) {
+            return [];
+        }
+        const targetFrameOfReferenceUID = targetViewport.getFrameOfReferenceUID?.();
+        if (!targetFrameOfReferenceUID) {
+            return [];
+        }
+        const lines = [];
+        this._getPlaneGroups().forEach((group) => {
+            if (group.frameOfReferenceUID !== targetFrameOfReferenceUID ||
+                group.viewportIds.includes(targetViewport.id)) {
+                return;
+            }
+            const lineInfo = this._computeLineForGroup(targetViewport, targetPlane, group);
+            if (lineInfo) {
+                lines.push(lineInfo);
+            }
+        });
+        return lines;
+    }
+    _computeLineForGroup(targetViewport, targetPlane, group) {
+        const leaderViewport = this._getViewportById(group.leaderViewportId);
+        if (!leaderViewport) {
+            return null;
+        }
+        const leaderPlane = getViewportPlane(leaderViewport);
+        if (!leaderPlane) {
+            return null;
+        }
+        const line = intersectPlanes(targetPlane, leaderPlane);
+        if (!line) {
+            return null;
+        }
+        const canvasPoints = clipWorldLineToViewportCanvas(line, targetViewport);
+        if (!canvasPoints) {
+            return null;
+        }
+        const { familyColors, getLineColor } = this.configuration;
+        const color = getLineColor?.(group.family, group.id, targetViewport.id) ??
+            familyColors?.[group.family] ??
+            'rgb(0, 200, 200)';
+        const isActive = this._activeGroupId === group.id &&
+            this._activeTargetViewportId === targetViewport.id;
+        const lineInfo = {
+            groupId: group.id,
+            family: group.family,
+            leaderViewportId: group.leaderViewportId,
+            memberViewportIds: [...group.viewportIds],
+            targetViewportId: targetViewport.id,
+            line,
+            leaderPlane,
+            canvasPoints,
+            slabLineSegments: [],
+            boundaryLineSegments: [],
+            rotateHandles: [],
+            slabHandles: [],
+            color,
+            isActive,
+        };
+        this._appendSlabGeometry(lineInfo, targetViewport, targetPlane, leaderViewport, leaderPlane);
+        this._appendBoundaryGeometry(lineInfo, targetViewport, targetPlane, leaderViewport, leaderPlane);
+        if (isActive) {
+            this._appendHandles(lineInfo, targetViewport, leaderViewport);
+        }
+        return lineInfo;
+    }
+    _clipOffsetPlaneIntersection(targetViewport, targetPlane, leaderPlane, offset) {
+        const offsetPlane = {
+            normal: leaderPlane.normal,
+            point: [
+                leaderPlane.point[0] + leaderPlane.normal[0] * offset,
+                leaderPlane.point[1] + leaderPlane.normal[1] * offset,
+                leaderPlane.point[2] + leaderPlane.normal[2] * offset,
+            ],
+        };
+        const line = intersectPlanes(targetPlane, offsetPlane);
+        if (!line) {
+            return null;
+        }
+        return clipWorldLineToViewportCanvas(line, targetViewport);
+    }
+    _appendSlabGeometry(lineInfo, targetViewport, targetPlane, leaderViewport, leaderPlane) {
+        if (!this.configuration.showSlabThickness ||
+            !this._isVolumeModeViewport(leaderViewport)) {
+            return;
+        }
+        const slabThickness = this._getSourceSlabThickness(leaderViewport);
+        if (!slabThickness ||
+            slabThickness <= RENDERING_DEFAULTS.MINIMUM_SLAB_THICKNESS) {
+            return;
+        }
+        [slabThickness / 2, -slabThickness / 2].forEach((offset) => {
+            const segment = this._clipOffsetPlaneIntersection(targetViewport, targetPlane, leaderPlane, offset);
+            if (segment) {
+                lineInfo.slabLineSegments.push(segment);
+            }
+        });
+    }
+    _appendBoundaryGeometry(lineInfo, targetViewport, targetPlane, leaderViewport, leaderPlane) {
+        const { showBoundaryLines, showIntermediateLines } = this.configuration;
+        if (!showBoundaryLines && !showIntermediateLines) {
+            return;
+        }
+        const extent = this._getSourceExtentAlongNormal(leaderViewport, leaderPlane);
+        if (!extent) {
+            return;
+        }
+        const { minOffset, maxOffset, spacing } = extent;
+        const offsets = [];
+        if (showBoundaryLines) {
+            offsets.push(minOffset, maxOffset);
+        }
+        if (showIntermediateLines && spacing > 0) {
+            const range = maxOffset - minOffset;
+            const step = Math.max(spacing, range / MAX_INTERMEDIATE_LINES);
+            for (let offset = Math.ceil(minOffset / step) * step; offset < maxOffset; offset += step) {
+                if (Math.abs(offset) > 1e-6) {
+                    offsets.push(offset);
+                }
+            }
+        }
+        offsets.forEach((offset) => {
+            const segment = this._clipOffsetPlaneIntersection(targetViewport, targetPlane, leaderPlane, offset);
+            if (segment) {
+                lineInfo.boundaryLineSegments.push(segment);
+            }
+        });
+    }
+    _getSourceExtentAlongNormal(sourceViewport, sourcePlane) {
+        let imageData;
+        try {
+            imageData = sourceViewport.getImageData?.();
+        }
+        catch {
+            return null;
+        }
+        const bounds = imageData?.imageData?.getBounds?.();
+        if (!bounds || bounds.length !== 6) {
+            return null;
+        }
+        const [xMin, xMax, yMin, yMax, zMin, zMax] = bounds;
+        const corners = [
+            [xMin, yMin, zMin],
+            [xMax, yMin, zMin],
+            [xMin, yMax, zMin],
+            [xMax, yMax, zMin],
+            [xMin, yMin, zMax],
+            [xMax, yMin, zMax],
+            [xMin, yMax, zMax],
+            [xMax, yMax, zMax],
+        ];
+        let minOffset = Infinity;
+        let maxOffset = -Infinity;
+        corners.forEach((corner) => {
+            const distance = distancePointToPlane(corner, sourcePlane);
+            minOffset = Math.min(minOffset, distance);
+            maxOffset = Math.max(maxOffset, distance);
+        });
+        if (!Number.isFinite(minOffset) || !Number.isFinite(maxOffset)) {
+            return null;
+        }
+        const spacingArray = imageData?.spacing ?? [];
+        const spacing = Math.min(...spacingArray.filter((s) => Number.isFinite(s) && s > 0), Infinity);
+        return {
+            minOffset,
+            maxOffset,
+            spacing: Number.isFinite(spacing) ? spacing : 0,
+        };
+    }
+    _appendHandles(lineInfo, targetViewport, leaderViewport) {
+        const { rotatable, slabThicknessControls, showSlabThickness } = this.configuration;
+        const [start, end] = lineInfo.canvasPoints;
+        const volumeMode = this._isVolumeModeViewport(leaderViewport);
+        if (rotatable && volumeMode) {
+            lineInfo.rotateHandles = [0.25, 0.75].map((fraction) => [
+                start[0] + (end[0] - start[0]) * fraction,
+                start[1] + (end[1] - start[1]) * fraction,
+            ]);
+        }
+        if (slabThicknessControls && showSlabThickness && volumeMode) {
+            lineInfo.slabHandles = this._computeSlabHandles(lineInfo, targetViewport, leaderViewport);
+        }
+    }
+    _computeSlabHandles(lineInfo, targetViewport, leaderViewport) {
+        const [start, end] = lineInfo.canvasPoints;
+        const anchorCanvas = [
+            start[0] + (end[0] - start[0]) * SLAB_HANDLE_LINE_FRACTION,
+            start[1] + (end[1] - start[1]) * SLAB_HANDLE_LINE_FRACTION,
+        ];
+        const slabThickness = this._getSourceSlabThickness(leaderViewport);
+        const anchorWorld = targetViewport.canvasToWorld(anchorCanvas);
+        const { normal } = lineInfo.leaderPlane;
+        const plusWorld = [
+            anchorWorld[0] + normal[0] * (slabThickness / 2),
+            anchorWorld[1] + normal[1] * (slabThickness / 2),
+            anchorWorld[2] + normal[2] * (slabThickness / 2),
+        ];
+        const plusCanvas = targetViewport.worldToCanvas(plusWorld);
+        const canvasOffset = Math.hypot(plusCanvas[0] - anchorCanvas[0], plusCanvas[1] - anchorCanvas[1]);
+        if (canvasOffset >= MIN_SLAB_HANDLE_CANVAS_OFFSET) {
+            const minusWorld = [
+                anchorWorld[0] - normal[0] * (slabThickness / 2),
+                anchorWorld[1] - normal[1] * (slabThickness / 2),
+                anchorWorld[2] - normal[2] * (slabThickness / 2),
+            ];
+            return [plusCanvas, targetViewport.worldToCanvas(minusWorld)];
+        }
+        const direction = vec2.normalize(vec2.create(), vec2.subtract(vec2.create(), end, start));
+        const perpendicular = [-direction[1], direction[0]];
+        return [
+            [
+                anchorCanvas[0] + perpendicular[0] * MIN_SLAB_HANDLE_CANVAS_OFFSET,
+                anchorCanvas[1] + perpendicular[1] * MIN_SLAB_HANDLE_CANVAS_OFFSET,
+            ],
+            [
+                anchorCanvas[0] - perpendicular[0] * MIN_SLAB_HANDLE_CANVAS_OFFSET,
+                anchorCanvas[1] - perpendicular[1] * MIN_SLAB_HANDLE_CANVAS_OFFSET,
+            ],
+        ];
+    }
+    getHandleNearImagePoint(element, _annotation, canvasCoords, proximity) {
+        this._pendingHandle = null;
+        const enabledElement = getEnabledElement(element);
+        if (!enabledElement) {
+            return undefined;
+        }
+        const lines = this._renderedLines.get(enabledElement.viewport.id) ?? [];
+        for (const lineInfo of lines) {
+            const nearRotate = lineInfo.rotateHandles.some((handle) => Math.hypot(handle[0] - canvasCoords[0], handle[1] - canvasCoords[1]) <=
+                this.configuration.handleRadius + proximity);
+            if (nearRotate) {
+                this._pendingHandle = { operation: 'rotate', lineInfo };
+                return lineInfo.line.point;
+            }
+            const nearSlab = lineInfo.slabHandles.some((handle) => Math.hypot(handle[0] - canvasCoords[0], handle[1] - canvasCoords[1]) <=
+                this.configuration.handleRadius + proximity);
+            if (nearSlab) {
+                this._pendingHandle = { operation: 'slabThickness', lineInfo };
+                return lineInfo.line.point;
+            }
+        }
+        return undefined;
+    }
+    _startManipulation(element, lineInfo, operation) {
+        const targetViewport = this._getViewportById(lineInfo.targetViewportId);
+        this._editData = {
+            targetViewportId: lineInfo.targetViewportId,
+            groupId: lineInfo.groupId,
+            family: lineInfo.family,
+            memberViewportIds: [...lineInfo.memberViewportIds],
+            operation,
+        };
+        if (operation === 'rotate' && targetViewport) {
+            const targetPlane = getViewportPlane(targetViewport);
+            this._editData.rotationAxis = targetPlane?.normal;
+            this._editData.pivotWorld = this._resolveRotationPivot(targetViewport, lineInfo);
+        }
+        this._activeOperation = operation;
+        hideElementCursor(element);
+        this._activateModify(element);
+        triggerEvent(eventTarget, Events.SLICE_INTERSECTION_MANIPULATION_STARTED, this._getManipulationDetail(operation));
+    }
+    _endManipulation(element, { suppressEvents = false } = {}) {
+        const editData = this._editData;
+        this._deactivateModify(element);
+        resetElementCursor(element);
+        this._editData = null;
+        this._activeOperation = null;
+        if (editData && !suppressEvents) {
+            triggerEvent(eventTarget, Events.SLICE_INTERSECTION_MANIPULATION_ENDED, this._getManipulationDetail(editData.operation, editData));
+        }
+        this._renderToolViewports();
+    }
+    _applyTranslate(members, evt, editData) {
+        const startWorld = evt.detail.startPoints?.world;
+        const currentWorld = evt.detail.currentPoints?.world;
+        const deltaWorld = evt.detail.deltaPoints?.world;
+        const totalDelta = startWorld && currentWorld
+            ? vec3.subtract(vec3.create(), currentWorld, startWorld)
+            : deltaWorld;
+        if (!totalDelta) {
+            return;
+        }
+        const usingTotalDelta = !!(startWorld && currentWorld);
+        const memberStartPlanePoints = editData?.memberStartPlanePoints ?? new Map();
+        if (editData) {
+            editData.memberStartPlanePoints = memberStartPlanePoints;
+        }
+        members.forEach((member) => {
+            const memberPlane = getViewportPlane(member);
+            if (!memberPlane) {
+                return;
+            }
+            if (!usingTotalDelta) {
+                const scrollDistance = vec3.dot(totalDelta, memberPlane.normal);
+                if (translateViewportAlongNormal(member, scrollDistance)) {
+                    member.render();
+                }
+                return;
+            }
+            let startPlanePoint = memberStartPlanePoints.get(member.id);
+            if (!startPlanePoint) {
+                startPlanePoint = [...memberPlane.point];
+                memberStartPlanePoints.set(member.id, startPlanePoint);
+            }
+            const distance = vec3.dot(totalDelta, memberPlane.normal);
+            const targetPoint = [
+                startPlanePoint[0] + memberPlane.normal[0] * distance,
+                startPlanePoint[1] + memberPlane.normal[1] * distance,
+                startPlanePoint[2] + memberPlane.normal[2] * distance,
+            ];
+            if (navigatePlanarViewportToPoint(member, targetPoint)) {
+                member.render();
+            }
+        });
+    }
+    _applyRotate(members, evt, editData) {
+        const { pivotWorld, rotationAxis, targetViewportId } = editData;
+        if (!pivotWorld || !rotationAxis) {
+            return;
+        }
+        const targetViewport = this._getViewportById(targetViewportId);
+        if (!targetViewport) {
+            return;
+        }
+        const eventDetail = evt.detail;
+        const currentCanvas = eventDetail.currentPoints?.canvas;
+        const deltaCanvas = eventDetail.deltaPoints?.canvas;
+        if (!currentCanvas || !deltaCanvas) {
+            return;
+        }
+        const pivotCanvas = targetViewport.worldToCanvas(pivotWorld);
+        const previousCanvas = [
+            currentCanvas[0] - deltaCanvas[0],
+            currentCanvas[1] - deltaCanvas[1],
+        ];
+        const dir1 = vec2.subtract(vec2.create(), previousCanvas, pivotCanvas);
+        const dir2 = vec2.subtract(vec2.create(), currentCanvas, pivotCanvas);
+        if (vec2.length(dir1) < 1e-6 || vec2.length(dir2) < 1e-6) {
+            return;
+        }
+        let angle = vec2.angle(dir1, dir2);
+        if (!Number.isFinite(angle) || angle === 0) {
+            return;
+        }
+        const cross = dir1[0] * dir2[1] - dir1[1] * dir2[0];
+        if (cross > 0) {
+            angle *= -1;
+        }
+        angle = Math.round(angle * 100) / 100;
+        if (angle === 0) {
+            return;
+        }
+        const normalizedAxis = vec3.normalize(vec3.create(), rotationAxis);
+        if (vec3.length(normalizedAxis) < 1e-10) {
+            return;
+        }
+        const rotation = mat4.fromRotation(mat4.create(), angle, normalizedAxis);
+        if (!rotation) {
+            return;
+        }
+        editData.memberStartScales ??= new Map();
+        members.forEach((member) => {
+            if (!this._isVolumeModeViewport(member)) {
+                return;
+            }
+            const { viewPlaneNormal, viewUp } = getViewportICamera(member);
+            if (!viewPlaneNormal || !viewUp) {
+                return;
+            }
+            const scalableMember = member;
+            if (!editData.memberStartScales.has(member.id)) {
+                editData.memberStartScales.set(member.id, scalableMember.getScale?.() ?? null);
+            }
+            const newViewPlaneNormal = vec3.transformMat4(vec3.create(), viewPlaneNormal, rotation);
+            const newViewUp = vec3.transformMat4(vec3.create(), viewUp, rotation);
+            member.setViewReference({
+                viewPlaneNormal: [
+                    newViewPlaneNormal[0],
+                    newViewPlaneNormal[1],
+                    newViewPlaneNormal[2],
+                ],
+                viewUp: [newViewUp[0], newViewUp[1], newViewUp[2]],
+                cameraFocalPoint: [pivotWorld[0], pivotWorld[1], pivotWorld[2]],
+            });
+            const startScale = editData.memberStartScales.get(member.id);
+            if (startScale) {
+                scalableMember.setScale?.(startScale);
+            }
+            member.render();
+        });
+    }
+    _applySlabThickness(members, evt, editData) {
+        const currentWorld = evt.detail.currentPoints?.world;
+        if (!currentWorld) {
+            return;
+        }
+        const leader = members.find((member) => this._isVolumeModeViewport(member));
+        const leaderPlane = leader && getViewportPlane(leader);
+        if (!leaderPlane) {
+            return;
+        }
+        const slabThickness = Math.max(RENDERING_DEFAULTS.MINIMUM_SLAB_THICKNESS, Math.abs(distancePointToPlane(currentWorld, leaderPlane)) * 2);
+        let changed = false;
+        members.forEach((member) => {
+            if (this._setViewportSlabThickness(member, slabThickness)) {
+                changed = true;
+            }
+        });
+        if (changed) {
+            triggerEvent(eventTarget, Events.SLICE_INTERSECTION_SLAB_THICKNESS_CHANGED, this._getManipulationDetail('slabThickness', editData));
+        }
+    }
+    _setViewportSlabThickness(viewport, slabThickness) {
+        if (!this._isVolumeModeViewport(viewport)) {
+            return false;
+        }
+        const dataId = this._getSourceDataId(viewport);
+        if (!dataId) {
+            return false;
+        }
+        const currentSlabThickness = this._getSourceSlabThickness(viewport);
+        if (Math.abs(currentSlabThickness - slabThickness) < 1e-6) {
+            return false;
+        }
+        let blendMode = this.configuration.slabThicknessBlendMode;
+        if (slabThickness <= RENDERING_DEFAULTS.MINIMUM_SLAB_THICKNESS) {
+            blendMode = Enums.BlendModes.COMPOSITE;
+        }
+        viewport.setDisplaySetPresentation(dataId, {
+            slabThickness,
+            blendMode,
+        });
+        viewport.render();
+        return true;
+    }
+    _isPlanarViewport(viewport) {
+        return (viewport?.type === ViewportType.PLANAR_NEXT &&
+            csUtils.isGenericViewport(viewport));
+    }
+    _isVolumeModeViewport(viewport) {
+        if (!viewport || !this._isPlanarViewport(viewport)) {
+            return false;
+        }
+        try {
+            return viewport.getCurrentMode?.() === 'volume';
+        }
+        catch {
+            return false;
+        }
+    }
+    _getSourceDataId(viewport) {
+        if (!csUtils.viewportSupportsDisplaySetPresentation(viewport)) {
+            return undefined;
+        }
+        return viewport.getSourceDataId();
+    }
+    _getSourceSlabThickness(viewport) {
+        const dataId = this._getSourceDataId(viewport);
+        if (!dataId) {
+            return RENDERING_DEFAULTS.MINIMUM_SLAB_THICKNESS;
+        }
+        const presentation = viewport.getDisplaySetPresentation(dataId);
+        const slabThickness = presentation?.slabThickness;
+        return Number.isFinite(slabThickness) && slabThickness > 0
+            ? slabThickness
+            : RENDERING_DEFAULTS.MINIMUM_SLAB_THICKNESS;
+    }
+    _resolveRotationPivot(targetViewport, lineInfo) {
+        const { rotationPivotPolicy } = this.configuration;
+        if (rotationPivotPolicy === 'worldCrosshairPointIfAvailable') {
+            const worldCrosshairInstance = getToolGroup(this.toolGroupId)?.getToolInstance?.('WorldCrosshair');
+            const worldPoint = worldCrosshairInstance?.getWorldPoint?.();
+            if (worldPoint) {
+                return worldPoint;
+            }
+        }
+        if (rotationPivotPolicy === 'viewportCenter') {
+            const { focalPoint } = getViewportICamera(targetViewport);
+            if (focalPoint) {
+                return focalPoint;
+            }
+        }
+        const { focalPoint } = getViewportICamera(targetViewport);
+        return this._closestPointOnLine(lineInfo.line, focalPoint ?? lineInfo.line.point);
+    }
+    _closestPointOnLine(line, point) {
+        const toPoint = vec3.subtract(vec3.create(), point, line.point);
+        const projection = vec3.dot(toPoint, line.direction);
+        return [
+            line.point[0] + line.direction[0] * projection,
+            line.point[1] + line.direction[1] * projection,
+            line.point[2] + line.direction[2] * projection,
+        ];
+    }
+    _centerViewportOnPoint(viewport, worldPoint) {
+        if (!this._isPlanarViewport(viewport)) {
+            return;
+        }
+        viewport.setViewState({
+            anchorWorld: [worldPoint[0], worldPoint[1], worldPoint[2]],
+            anchorCanvas: [0.5, 0.5],
+        });
+        viewport.render();
+    }
+    _selectLine(lineInfo) {
+        this._activeGroupId = lineInfo.groupId;
+        this._activeTargetViewportId = lineInfo.targetViewportId;
+        triggerEvent(eventTarget, Events.SLICE_INTERSECTION_LINE_SELECTED, {
+            toolGroupId: this.toolGroupId,
+            groupId: lineInfo.groupId,
+            targetViewportId: lineInfo.targetViewportId,
+        });
+    }
+    _findLineNear(viewportId, canvasCoords, proximity, includeHandles = false) {
+        const lines = this._renderedLines.get(viewportId) ?? [];
+        const handleReach = this.configuration.handleRadius + proximity;
+        for (const lineInfo of lines) {
+            const distance = lineSegment.distanceToPoint(lineInfo.canvasPoints[0], lineInfo.canvasPoints[1], canvasCoords);
+            if (distance <= proximity) {
+                return lineInfo;
+            }
+            if (includeHandles) {
+                const nearHandle = [
+                    ...lineInfo.rotateHandles,
+                    ...lineInfo.slabHandles,
+                ].some((handle) => Math.hypot(handle[0] - canvasCoords[0], handle[1] - canvasCoords[1]) <= handleReach);
+                if (nearHandle) {
+                    return lineInfo;
+                }
+            }
+        }
+        return null;
+    }
+    _getViewportsInfo() {
+        return getToolGroup(this.toolGroupId)?.viewportsInfo ?? [];
+    }
+    _getToolGroupViewports() {
+        return this._getViewportsInfo()
+            .map(({ viewportId, renderingEngineId }) => getEnabledElementByIds(viewportId, renderingEngineId)?.viewport)
+            .filter(Boolean);
+    }
+    _getViewportById(viewportId) {
+        if (!viewportId) {
+            return undefined;
+        }
+        if (!this._passViewportsById) {
+            this._passViewportsById = new Map(this._getToolGroupViewports().map((viewport) => [viewport.id, viewport]));
+            this._schedulePassCacheClear();
+        }
+        return this._passViewportsById.get(viewportId);
+    }
+    _clearPassCaches() {
+        this._passViewportsById = null;
+        this._passPlaneGroups = null;
+    }
+    _schedulePassCacheClear() {
+        if (this._passCacheClearScheduled) {
+            return;
+        }
+        this._passCacheClearScheduled = true;
+        queueMicrotask(() => {
+            this._passCacheClearScheduled = false;
+            this._clearPassCaches();
+        });
+    }
+    _renderToolViewports() {
+        const viewportIds = this._getViewportsInfo().map(({ viewportId }) => viewportId);
+        if (viewportIds.length) {
+            triggerAnnotationRenderForViewportIds(viewportIds);
+        }
+    }
+    _getOrCreateViewportAnnotation(viewport) {
+        const { element } = viewport;
+        if (!element) {
+            return null;
+        }
+        const annotations = getAnnotations(this.getToolName(), element);
+        const existing = annotations?.find((annotation) => annotation.data.viewportId ===
+            viewport.id);
+        if (existing) {
+            return existing;
+        }
+        const annotation = {
+            highlighted: false,
+            invalidated: false,
+            metadata: {
+                toolName: this.getToolName(),
+                FrameOfReferenceUID: viewport.getFrameOfReferenceUID?.(),
+            },
+            data: {
+                viewportId: viewport.id,
+                handles: { points: [] },
+            },
+        };
+        addAnnotation(annotation, element);
+        return annotation;
+    }
+    _createDetachedAnnotation() {
+        return {
+            annotationUID: csUtils.uuidv4(),
+            highlighted: false,
+            invalidated: false,
+            metadata: {
+                toolName: this.getToolName(),
+            },
+            data: {
+                viewportId: '',
+                handles: { points: [] },
+            },
+        };
+    }
+    _getManipulationDetail(operation, editData = this._editData) {
+        return {
+            toolGroupId: this.toolGroupId,
+            groupId: editData?.groupId ?? this._activeGroupId ?? '',
+            family: editData?.family,
+            viewportIds: editData?.memberViewportIds ?? [],
+            targetViewportId: editData?.targetViewportId ?? this._activeTargetViewportId ?? '',
+            operation,
+        };
+    }
+}
+SliceIntersectionTool.toolLabel = 'Slice Intersections';
+SliceIntersectionTool.toolName = 'SliceIntersection';
+export default SliceIntersectionTool;