@cornerstonejs/tools 2.17.1 → 2.17.3

package/dist/esm/drawingSvg/drawArrow.js

@@ -1,20 +1,47 @@
 import drawLine from './drawLine';
+const svgns = 'http://www.w3.org/2000/svg';
 export default function drawArrow(svgDrawingHelper, annotationUID, arrowUID, start, end, options = {}) {
     if (isNaN(start[0]) || isNaN(start[1]) || isNaN(end[0]) || isNaN(end[1])) {
         return;
     }
-    const { color, width, lineWidth, lineDash } = Object.assign({
-        color: 'rgb(0, 255, 0)',
-        width: '2',
-        lineWidth: undefined,
-        lineDash: undefined,
-    }, options);
-    drawLine(svgDrawingHelper, annotationUID, arrowUID, start, end, {
-        color,
-        width,
-        lineWidth,
-        lineDash,
-    });
+    const { viaMarker = false, color = 'rgb(0, 255, 0)', markerSize = 10, } = options;
+    if (!viaMarker) {
+        legacyDrawArrow(svgDrawingHelper, annotationUID, arrowUID, start, end, options);
+        return;
+    }
+    const layerId = svgDrawingHelper.svgLayerElement.id;
+    const markerBaseId = `arrow-${annotationUID}`;
+    const markerFullId = `${markerBaseId}-${layerId}`;
+    const defs = svgDrawingHelper.svgLayerElement.querySelector('defs');
+    let arrowMarker = defs.querySelector(`#${markerFullId}`);
+    if (!arrowMarker) {
+        arrowMarker = document.createElementNS(svgns, 'marker');
+        arrowMarker.setAttribute('id', markerFullId);
+        arrowMarker.setAttribute('viewBox', '0 0 10 10');
+        arrowMarker.setAttribute('refX', '8');
+        arrowMarker.setAttribute('refY', '5');
+        arrowMarker.setAttribute('markerWidth', `${markerSize}`);
+        arrowMarker.setAttribute('markerHeight', `${markerSize}`);
+        arrowMarker.setAttribute('orient', 'auto');
+        const arrowPath = document.createElementNS(svgns, 'path');
+        arrowPath.setAttribute('d', 'M 0 0 L 10 5 L 0 10 z');
+        arrowPath.setAttribute('fill', color);
+        arrowMarker.appendChild(arrowPath);
+        defs.appendChild(arrowMarker);
+    }
+    else {
+        arrowMarker.setAttribute('markerWidth', `${markerSize}`);
+        arrowMarker.setAttribute('markerHeight', `${markerSize}`);
+        const arrowPath = arrowMarker.querySelector('path');
+        if (arrowPath) {
+            arrowPath.setAttribute('fill', color);
+        }
+    }
+    options.markerEndId = markerFullId;
+    drawLine(svgDrawingHelper, annotationUID, arrowUID, start, end, options);
+}
+function legacyDrawArrow(svgDrawingHelper, annotationUID, arrowUID, start, end, options = {}) {
+    const { color = 'rgb(0, 255, 0)', width = 2, lineWidth, lineDash } = options;
     const headLength = 10;
     const angle = Math.atan2(end[1] - start[1], end[0] - start[0]);
     const firstLine = {
@@ -31,14 +58,22 @@ export default function drawArrow(svgDrawingHelper, annotationUID, arrowUID, sta
         ],
         end: end,
     };
+    drawLine(svgDrawingHelper, annotationUID, arrowUID, start, end, {
+        color,
+        width,
+        lineWidth,
+        lineDash,
+    });
     drawLine(svgDrawingHelper, annotationUID, '2', firstLine.start, firstLine.end, {
         color,
         width,
         lineWidth,
+        lineDash,
     });
     drawLine(svgDrawingHelper, annotationUID, '3', secondLine.start, secondLine.end, {
         color,
         width,
         lineWidth,
+        lineDash,
     });
 }

package/dist/esm/drawingSvg/drawHeight.js

@@ -28,15 +28,18 @@ export default function drawHeight(svgDrawingHelper, annotationUID, heightUID, s
         color,
         width,
         lineWidth,
+        lineDash,
     });
     drawLine(svgDrawingHelper, annotationUID, '2', secondLine.start, secondLine.end, {
         color,
         width,
         lineWidth,
+        lineDash,
     });
     drawLine(svgDrawingHelper, annotationUID, '3', threeLine.start, threeLine.end, {
         color,
         width,
         lineWidth,
+        lineDash,
     });
 }

package/dist/esm/drawingSvg/drawLine.js

@@ -5,20 +5,13 @@ export default function drawLine(svgDrawingHelper, annotationUID, lineUID, start
     if (isNaN(start[0]) || isNaN(start[1]) || isNaN(end[0]) || isNaN(end[1])) {
         return;
     }
-    const { color, width, lineWidth, lineDash, shadow } = Object.assign({
-        color: 'rgb(0, 255, 0)',
-        width: '2',
-        lineWidth: undefined,
-        lineDash: undefined,
-        shadow: undefined,
-    }, options);
+    const { color = 'rgb(0, 255, 0)', width = 10, lineWidth, lineDash, markerStartId = null, markerEndId = null, shadow = false, } = options;
     const strokeWidth = lineWidth || width;
     const svgns = 'http://www.w3.org/2000/svg';
     const svgNodeHash = _getHash(annotationUID, 'line', lineUID);
     const existingLine = svgDrawingHelper.getSvgNode(svgNodeHash);
-    const dropShadowStyle = shadow
-        ? `filter:url(#shadow-${svgDrawingHelper.svgLayerElement.id});`
-        : '';
+    const layerId = svgDrawingHelper.svgLayerElement.id;
+    const dropShadowStyle = shadow ? `filter:url(#shadow-${layerId});` : '';
     const attributes = {
         x1: `${start[0]}`,
         y1: `${start[1]}`,
@@ -28,6 +21,8 @@ export default function drawLine(svgDrawingHelper, annotationUID, lineUID, start
         style: dropShadowStyle,
         'stroke-width': strokeWidth,
         'stroke-dasharray': lineDash,
+        'marker-start': markerStartId ? `url(#${markerStartId})` : '',
+        'marker-end': markerEndId ? `url(#${markerEndId})` : '',
     };
     if (existingLine) {
         setAttributesIfNecessary(attributes, existingLine);

package/dist/esm/drawingSvg/drawPolyline.d.ts

@@ -8,4 +8,6 @@ export default function drawPolyline(svgDrawingHelper: SVGDrawingHelper, annotat
     lineWidth?: number;
     lineDash?: string;
     closePath?: boolean;
+    markerStartId?: string;
+    markerEndId?: string;
 }): void;

package/dist/esm/drawingSvg/drawPolyline.js

@@ -5,7 +5,7 @@ export default function drawPolyline(svgDrawingHelper, annotationUID, polylineUI
     if (points.length < 2) {
         return;
     }
-    const { color = 'rgb(0, 255, 0)', width = 10, fillColor = 'none', fillOpacity = 0, lineWidth, lineDash, closePath = false, } = options;
+    const { color = 'rgb(0, 255, 0)', width = 10, fillColor = 'none', fillOpacity = 0, lineWidth, lineDash, closePath = false, markerStartId = null, markerEndId = null, } = options;
     const strokeWidth = lineWidth || width;
     const svgns = 'http://www.w3.org/2000/svg';
     const svgNodeHash = _getHash(annotationUID, 'polyline', polylineUID);
@@ -25,6 +25,8 @@ export default function drawPolyline(svgDrawingHelper, annotationUID, polylineUI
         'fill-opacity': fillOpacity,
         'stroke-width': strokeWidth,
         'stroke-dasharray': lineDash,
+        'marker-start': markerStartId ? `url(#${markerStartId})` : '',
+        'marker-end': markerEndId ? `url(#${markerEndId})` : '',
     };
     if (existingPolyLine) {
         setAttributesIfNecessary(attributes, existingPolyLine);

package/dist/esm/stateManagement/annotation/config/ToolStyle.js

@@ -19,6 +19,7 @@ class ToolStyle {
             textBoxLinkLineWidth: '1',
             textBoxLinkLineDash: '2,3',
             textBoxShadow: true,
+            markerSize: '10',
         };
         this._initializeConfig(defaultConfig);
     }

package/dist/esm/tools/annotation/ArrowAnnotateTool.js

@@ -20,6 +20,7 @@ class ArrowAnnotateTool extends AnnotationTool {
             changeTextCallback,
             preventHandleOutsideImage: false,
             arrowFirst: true,
+            arrowHeadStyle: 'legacy',
         },
     }) {
         super(toolProps, defaultToolProps);
@@ -302,7 +303,7 @@ class ArrowAnnotateTool extends AnnotationTool {
                 const { handles, text } = data;
                 const { points, activeHandleIndex } = handles;
                 styleSpecifier.annotationUID = annotationUID;
-                const { color, lineWidth, lineDash } = this.getAnnotationStyle({
+                const { color, lineWidth, lineDash, markerSize } = this.getAnnotationStyle({
                     annotation,
                     styleSpecifier,
                 });
@@ -333,6 +334,8 @@ class ArrowAnnotateTool extends AnnotationTool {
                         color,
                         width: lineWidth,
                         lineDash: lineDash,
+                        viaMarker: this.configuration.arrowHeadStyle !== 'legacy',
+                        markerSize,
                     });
                 }
                 else {
@@ -340,6 +343,8 @@ class ArrowAnnotateTool extends AnnotationTool {
                         color,
                         width: lineWidth,
                         lineDash: lineDash,
+                        viaMarker: this.configuration.arrowHeadStyle !== 'legacy',
+                        markerSize,
                     });
                 }
                 renderStatus = true;

package/dist/esm/tools/base/AnnotationTool.js

@@ -158,6 +158,7 @@ class AnnotationTool extends AnnotationDisplayTool {
         const lineWidth = getStyle('lineWidth');
         const lineDash = getStyle('lineDash');
         const color = getStyle('color');
+        const markerSize = getStyle('markerSize');
         const shadow = getStyle('shadow');
         const textboxStyle = this.getLinkedTextBoxStyle(styleSpecifier, annotation);
         return {
@@ -171,6 +172,7 @@ class AnnotationTool extends AnnotationDisplayTool {
             fillOpacity: 0,
             shadow,
             textbox: textboxStyle,
+            markerSize,
         };
     }
     _imagePointNearToolOrHandle(element, annotation, canvasCoords, proximity) {

package/dist/esm/tools/segmentation/LabelmapBaseTool.d.ts

@@ -2,6 +2,7 @@ import type { Types } from '@cornerstonejs/core';
 import { BaseTool } from '../base';
 import type vtkImageData from '@kitware/vtk.js/Common/DataModel/ImageData';
 import * as LabelmapMemo from '../../utilities/segmentation/createLabelmapMemo';
+import type { LabelmapToolOperationData } from '../../types/LabelmapToolOperationData';
 export type PreviewData = {
     preview: unknown;
     timer?: number;
@@ -10,6 +11,25 @@ export type PreviewData = {
     element: HTMLDivElement;
     isDrag: boolean;
 };
+type EditDataReturnType = {
+    volumeId: string;
+    referencedVolumeId: string;
+    segmentsLocked: number[];
+} | {
+    imageId: string;
+    segmentsLocked: number[];
+    override?: {
+        voxelManager: Types.IVoxelManager<number> | Types.IVoxelManager<Types.RGB>;
+        imageData: vtkImageData;
+    };
+} | null;
+type ModifiedLabelmapToolOperationData = Omit<LabelmapToolOperationData, 'voxelManager' | 'override'> & {
+    voxelManager?: Types.IVoxelManager<number> | Types.IVoxelManager<Types.RGB>;
+    override?: {
+        voxelManager: Types.IVoxelManager<number> | Types.IVoxelManager<Types.RGB>;
+        imageData: vtkImageData;
+    };
+};
 export default class LabelmapBaseTool extends BaseTool {
     protected _editData: {
         override: {
@@ -35,28 +55,14 @@ export default class LabelmapBaseTool extends BaseTool {
     constructor(toolProps: any, defaultToolProps: any);
     protected get _previewData(): PreviewData;
     createMemo(segmentId: string, segmentationVoxelManager: any, preview: any): LabelmapMemo.LabelmapMemo;
-    createEditData(element: any): {
-        volumeId: string;
-        referencedVolumeId: any;
-        segmentsLocked: number[] | [];
-        imageId?: undefined;
-        override?: undefined;
-    } | {
-        imageId: string;
-        segmentsLocked: number[] | [];
-        override: {
-            voxelManager: Types.IVoxelManager<number> | Types.IVoxelManager<Types.RGB>;
-            imageData: vtkImageData;
-        };
-        volumeId?: undefined;
-        referencedVolumeId?: undefined;
-    } | {
-        imageId: string;
-        segmentsLocked: number[] | [];
-        volumeId?: undefined;
-        referencedVolumeId?: undefined;
-        override?: undefined;
-    };
+    protected createEditData(element: any): EditDataReturnType;
+    protected getEditData({ viewport, representationData, segmentsLocked, segmentationId, volumeOperation, }: {
+        viewport: any;
+        representationData: any;
+        segmentsLocked: any;
+        segmentationId: any;
+        volumeOperation?: boolean;
+    }): EditDataReturnType;
     protected createHoverData(element: any, centerCanvas?: any): {
         brushCursor: {
             metadata: {
@@ -81,78 +87,7 @@ export default class LabelmapBaseTool extends BaseTool {
         segmentationId: string;
         segmentColor: Types.Color;
     };
-    protected getOperationData(element?: any): {
-        points: any;
-        segmentIndex: number;
-        previewColors: any;
-        viewPlaneNormal: any;
-        toolGroupId: string;
-        segmentationId: string;
-        viewUp: any;
-        strategySpecificConfiguration: any;
-        preview: unknown;
-        createMemo: (segmentId: string, segmentationVoxelManager: any, preview: any) => LabelmapMemo.LabelmapMemo;
-        override: {
-            voxelManager: Types.IVoxelManager<number>;
-            imageData: vtkImageData;
-        };
-        segmentsLocked: number[];
-        imageId?: string;
-        imageIds?: string[];
-        volumeId?: string;
-        referencedVolumeId?: string;
-    } | {
-        points: any;
-        segmentIndex: number;
-        previewColors: any;
-        viewPlaneNormal: any;
-        toolGroupId: string;
-        segmentationId: string;
-        viewUp: any;
-        strategySpecificConfiguration: any;
-        preview: unknown;
-        createMemo: (segmentId: string, segmentationVoxelManager: any, preview: any) => LabelmapMemo.LabelmapMemo;
-        volumeId: string;
-        referencedVolumeId: any;
-        segmentsLocked: number[] | [];
-        imageId?: undefined;
-        override?: undefined;
-    } | {
-        points: any;
-        segmentIndex: number;
-        previewColors: any;
-        viewPlaneNormal: any;
-        toolGroupId: string;
-        segmentationId: string;
-        viewUp: any;
-        strategySpecificConfiguration: any;
-        preview: unknown;
-        createMemo: (segmentId: string, segmentationVoxelManager: any, preview: any) => LabelmapMemo.LabelmapMemo;
-        imageId: string;
-        segmentsLocked: number[] | [];
-        override: {
-            voxelManager: Types.IVoxelManager<number> | Types.IVoxelManager<Types.RGB>;
-            imageData: vtkImageData;
-        };
-        volumeId?: undefined;
-        referencedVolumeId?: undefined;
-    } | {
-        points: any;
-        segmentIndex: number;
-        previewColors: any;
-        viewPlaneNormal: any;
-        toolGroupId: string;
-        segmentationId: string;
-        viewUp: any;
-        strategySpecificConfiguration: any;
-        preview: unknown;
-        createMemo: (segmentId: string, segmentationVoxelManager: any, preview: any) => LabelmapMemo.LabelmapMemo;
-        imageId: string;
-        segmentsLocked: number[] | [];
-        volumeId?: undefined;
-        referencedVolumeId?: undefined;
-        override?: undefined;
-    };
+    protected getOperationData(element?: any): ModifiedLabelmapToolOperationData;
     addPreview(element?: HTMLDivElement, options?: {
         acceptReject: boolean;
     }): unknown;
@@ -162,3 +97,4 @@ export default class LabelmapBaseTool extends BaseTool {
         removeContours: boolean;
     }): void;
 }
+export {};

package/dist/esm/tools/segmentation/LabelmapBaseTool.js

@@ -53,6 +53,15 @@ export default class LabelmapBaseTool extends BaseTool {
         const { segmentationId } = activeSegmentation;
         const segmentsLocked = getLockedSegmentIndices(segmentationId);
         const { representationData } = getSegmentation(segmentationId);
+        const editData = this.getEditData({
+            viewport,
+            representationData,
+            segmentsLocked,
+            segmentationId,
+        });
+        return editData;
+    }
+    getEditData({ viewport, representationData, segmentsLocked, segmentationId, volumeOperation = false, }) {
         if (viewport instanceof BaseVolumeViewport) {
             const { volumeId } = representationData[SegmentationRepresentations.Labelmap];
             const actors = viewport.getActors();
@@ -82,7 +91,8 @@ export default class LabelmapBaseTool extends BaseTool {
             if (!segmentationImageId) {
                 return;
             }
-            if (this.configuration.activeStrategy.includes('SPHERE')) {
+            if (this.configuration.activeStrategy.includes('SPHERE') ||
+                volumeOperation) {
                 const referencedImageIds = viewport.getImageIds();
                 const isValidVolumeForSphere = csUtils.isValidVolume(referencedImageIds);
                 if (!isValidVolumeForSphere) {
@@ -101,7 +111,7 @@ export default class LabelmapBaseTool extends BaseTool {
                     };
                 }
                 else {
-                    const labelmapImageIds = getStackSegmentationImageIdsForViewport(viewport.id, segmentationId);
+                    const { imageIds: labelmapImageIds } = representationData.Labelmap;
                     if (!labelmapImageIds || labelmapImageIds.length === 1) {
                         return {
                             imageId: segmentationImageId,

package/dist/esm/tools/segmentation/SphereScissorsTool.js

@@ -1,5 +1,4 @@
-import { BaseVolumeViewport, cache, getEnabledElement, } from '@cornerstonejs/core';
-import { BaseTool } from '../base';
+import { getEnabledElement } from '@cornerstonejs/core';
 import { fillInsideSphere } from './strategies/fillSphere';
 import { eraseInsideSphere } from './strategies/eraseSphere';
 import { Events, SegmentationRepresentations } from '../../enums';
@@ -88,21 +87,17 @@ class SphereScissorsTool extends LabelmapBaseTool {
                 imageId: null,
             };
             const { representationData } = getSegmentation(segmentationId);
-            const labelmapData = representationData[SegmentationRepresentations.Labelmap];
-            if (viewport instanceof BaseVolumeViewport) {
-                const { volumeId } = labelmapData;
-                const segmentation = cache.getVolume(volumeId);
-                this.editData = {
-                    ...this.editData,
-                    volumeId,
-                    referencedVolumeId: segmentation.referencedVolumeId,
-                };
-            }
-            else {
-                this.editData = {
-                    ...this.editData,
-                };
-            }
+            const editData = this.getEditData({
+                viewport,
+                representationData,
+                segmentsLocked,
+                segmentationId,
+                volumeOperation: true,
+            });
+            this.editData = {
+                ...this.editData,
+                ...editData,
+            };
             this._activateDraw(element);
             hideElementCursor(element);
             evt.preventDefault();

package/dist/esm/types/AnnotationStyle.d.ts

@@ -1,6 +1,6 @@
 type Modes = '' | 'Active' | 'Passive' | 'Enabled';
 type States = '' | 'Highlighted' | 'Selected' | 'Locked' | 'AutoGenerated';
-type Properties = 'color' | 'colorAutoGenerated' | 'lineWidth' | 'lineWidthAutoGenerated' | 'lineDash' | 'textBoxFontFamily' | 'textBoxFontSize' | 'textBoxColor' | 'textBoxBackground' | 'textBoxLinkLineWidth' | 'textBoxLinkLineDash' | 'locked' | 'fillColor' | 'fillOpacity' | 'textbox' | 'shadow' | 'visibility';
+type Properties = 'color' | 'colorAutoGenerated' | 'lineWidth' | 'lineWidthAutoGenerated' | 'lineDash' | 'textBoxFontFamily' | 'textBoxFontSize' | 'textBoxColor' | 'textBoxBackground' | 'textBoxLinkLineWidth' | 'textBoxLinkLineDash' | 'locked' | 'fillColor' | 'fillOpacity' | 'textbox' | 'shadow' | 'visibility' | 'markerSize';
 export type AnnotationStyle = {
     [key in `${Properties}${States}${Modes}`]?: string | number | boolean | Record<string, unknown>;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cornerstonejs/tools",
-  "version": "2.17.1",
+  "version": "2.17.3",
   "description": "Cornerstone3D Tools",
   "types": "./dist/esm/index.d.ts",
   "module": "./dist/esm/index.js",
@@ -104,7 +104,7 @@
     "canvas": "^2.11.2"
   },
   "peerDependencies": {
-    "@cornerstonejs/core": "^2.17.1",
+    "@cornerstonejs/core": "^2.17.3",
     "@kitware/vtk.js": "32.9.0",
     "@types/d3-array": "^3.0.4",
     "@types/d3-interpolate": "^3.0.1",
@@ -123,5 +123,5 @@
     "type": "individual",
     "url": "https://ohif.org/donate"
   },
-  "gitHead": "b68b0b87867bfe60b19cdadb8248654a09f9c8ce"
+  "gitHead": "8fe548248197e61fba869257fdebdd33714e42f8"
 }