@ohif/app 3.8.0-beta.8 → 3.8.0-beta.81

package/dist/{451.bundle.57c21db5d003c75e9d61.js → 295.bundle.5ace95771ced62bdcab8.js}

@@ -1,7 +1,7 @@
 "use strict";
-(self["webpackChunk"] = self["webpackChunk"] || []).push([[451],{
+(globalThis["webpackChunk"] = globalThis["webpackChunk"] || []).push([[295],{
 
-/***/ 4451:
+/***/ 58295:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 // ESM COMPAT FLAG
@@ -13,16 +13,14 @@ __webpack_require__.d(__webpack_exports__, {
 });
 
 // EXTERNAL MODULE: ../../../node_modules/prop-types/index.js
-var prop_types = __webpack_require__(3827);
+var prop_types = __webpack_require__(11374);
 var prop_types_default = /*#__PURE__*/__webpack_require__.n(prop_types);
 // EXTERNAL MODULE: ../../../node_modules/react/index.js
-var react = __webpack_require__(43001);
+var react = __webpack_require__(41766);
 // EXTERNAL MODULE: ../../../node_modules/react-i18next/dist/es/index.js + 15 modules
-var es = __webpack_require__(69190);
-// EXTERNAL MODULE: ../../core/src/index.ts + 65 modules
-var src = __webpack_require__(71771);
-// EXTERNAL MODULE: ../../ui/src/index.js + 486 modules
-var ui_src = __webpack_require__(22582);
+var es = __webpack_require__(80619);
+// EXTERNAL MODULE: ../../ui/src/index.js + 785 modules
+var src = __webpack_require__(5085);
 ;// CONCATENATED MODULE: ../../../extensions/cornerstone-dicom-seg/src/utils/initSEGToolGroup.ts
 function createSEGToolGroupAndAddTools(ToolGroupService, customizationService, toolGroupId) {
   const {
@@ -38,14 +36,13 @@ const RESPONSE = {
   CANCEL: 0,
   HYDRATE_SEG: 5
 };
-function promptHydrateSEG(_ref) {
-  let {
-    servicesManager,
-    segDisplaySet,
-    viewportId,
-    preHydrateCallbacks,
-    hydrateSEGDisplaySet
-  } = _ref;
+function promptHydrateSEG({
+  servicesManager,
+  segDisplaySet,
+  viewportId,
+  preHydrateCallbacks,
+  hydrateSEGDisplaySet
+}) {
   const {
     uiViewportDialogService
   } = servicesManager.services;
@@ -67,11 +64,11 @@ function _askHydrate(uiViewportDialogService, viewportId) {
   return new Promise(function (resolve, reject) {
     const message = 'Do you want to open this Segmentation?';
     const actions = [{
-      type: ui_src/* ButtonEnums.type */.LZ.dt.secondary,
+      type: src/* ButtonEnums.type */.Ny.NW.secondary,
       text: 'No',
       value: RESPONSE.CANCEL
     }, {
-      type: ui_src/* ButtonEnums.type */.LZ.dt.primary,
+      type: src/* ButtonEnums.type */.Ny.NW.primary,
       text: 'Yes',
       value: RESPONSE.HYDRATE_SEG
     }];
@@ -88,6 +85,11 @@ function _askHydrate(uiViewportDialogService, viewportId) {
       onOutsideClick: () => {
         uiViewportDialogService.hide();
         resolve(RESPONSE.CANCEL);
+      },
+      onKeyPress: event => {
+        if (event.key === 'Enter') {
+          onSubmit(RESPONSE.HYDRATE_SEG);
+        }
       }
     });
   });
@@ -97,44 +99,45 @@ function _askHydrate(uiViewportDialogService, viewportId) {
 
 
 
-function _getStatusComponent(_ref) {
-  let {
-    isHydrated,
-    onStatusClick
-  } = _ref;
+function _getStatusComponent({
+  isHydrated,
+  onStatusClick
+}) {
   let ToolTipMessage = null;
   let StatusIcon = null;
-  const {
-    t
-  } = (0,es/* useTranslation */.$G)('Common');
-  const loadStr = t('LOAD');
   switch (isHydrated) {
     case true:
-      StatusIcon = () => /*#__PURE__*/react.createElement(ui_src/* Icon */.JO, {
+      StatusIcon = () => /*#__PURE__*/react.createElement(src/* Icon */.In, {
         name: "status-alert"
       });
       ToolTipMessage = () => /*#__PURE__*/react.createElement("div", null, "This Segmentation is loaded in the segmentation panel");
       break;
     case false:
-      StatusIcon = () => /*#__PURE__*/react.createElement(ui_src/* Icon */.JO, {
+      StatusIcon = () => /*#__PURE__*/react.createElement(src/* Icon */.In, {
         className: "text-aqua-pale",
         name: "status-untracked"
       });
       ToolTipMessage = () => /*#__PURE__*/react.createElement("div", null, "Click LOAD to load segmentation.");
   }
-  const StatusArea = () => /*#__PURE__*/react.createElement("div", {
-    className: "flex h-6 cursor-default text-sm leading-6 text-white"
-  }, /*#__PURE__*/react.createElement("div", {
-    className: "bg-customgray-100 flex min-w-[45px] items-center rounded-l-xl rounded-r p-1"
-  }, /*#__PURE__*/react.createElement(StatusIcon, null), /*#__PURE__*/react.createElement("span", {
-    className: "ml-1"
-  }, "SEG")), !isHydrated && /*#__PURE__*/react.createElement("div", {
-    className: "bg-primary-main hover:bg-primary-light ml-1 cursor-pointer rounded px-1.5 hover:text-black"
-    // Using onMouseUp here because onClick is not working when the viewport is not active and is styled with pointer-events:none
-    ,
-    onMouseUp: onStatusClick
-  }, loadStr));
-  return /*#__PURE__*/react.createElement(react.Fragment, null, ToolTipMessage && /*#__PURE__*/react.createElement(ui_src/* Tooltip */.u, {
+  const StatusArea = () => {
+    const {
+      t
+    } = (0,es/* useTranslation */.Bd)('Common');
+    const loadStr = t('LOAD');
+    return /*#__PURE__*/react.createElement("div", {
+      className: "flex h-6 cursor-default text-sm leading-6 text-white"
+    }, /*#__PURE__*/react.createElement("div", {
+      className: "bg-customgray-100 flex min-w-[45px] items-center rounded-l-xl rounded-r p-1"
+    }, /*#__PURE__*/react.createElement(StatusIcon, null), /*#__PURE__*/react.createElement("span", {
+      className: "ml-1"
+    }, "SEG")), !isHydrated && /*#__PURE__*/react.createElement("div", {
+      className: "bg-primary-main hover:bg-primary-light ml-1 cursor-pointer rounded px-1.5 hover:text-black"
+      // Using onMouseUp here because onClick is not working when the viewport is not active and is styled with pointer-events:none
+      ,
+      onMouseUp: onStatusClick
+    }, loadStr));
+  };
+  return /*#__PURE__*/react.createElement(react.Fragment, null, ToolTipMessage && /*#__PURE__*/react.createElement(src/* Tooltip */.m_, {
     content: /*#__PURE__*/react.createElement(ToolTipMessage, null),
     position: "bottom-left"
   }, /*#__PURE__*/react.createElement(StatusArea, null)), !ToolTipMessage && /*#__PURE__*/react.createElement(StatusArea, null));
@@ -148,31 +151,27 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 
 
-
-const {
-  formatDate
-} = src.utils;
 const SEG_TOOLGROUP_BASE_NAME = 'SEGToolGroup';
 function OHIFCornerstoneSEGViewport(props) {
   const {
     children,
     displaySets,
     viewportOptions,
-    viewportLabel,
     servicesManager,
     extensionManager,
     commandsManager
   } = props;
   const {
     t
-  } = (0,es/* useTranslation */.$G)('SEGViewport');
+  } = (0,es/* useTranslation */.Bd)('SEGViewport');
   const viewportId = viewportOptions.viewportId;
   const {
     displaySetService,
     toolGroupService,
     segmentationService,
     uiNotificationService,
-    customizationService
+    customizationService,
+    viewportActionCornersService
   } = servicesManager.services;
   const toolGroupId = `${SEG_TOOLGROUP_BASE_NAME}-${viewportId}`;
 
@@ -181,7 +180,7 @@ function OHIFCornerstoneSEGViewport(props) {
     throw new Error('SEG viewport should only have a single display set');
   }
   const segDisplaySet = displaySets[0];
-  const [viewportGrid, viewportGridService] = (0,ui_src/* useViewportGrid */.O_)();
+  const [viewportGrid, viewportGridService] = (0,src/* useViewportGrid */.ih)();
 
   // States
   const [selectedSegment, setSelectedSegment] = (0,react.useState)(1);
@@ -224,10 +223,9 @@ function OHIFCornerstoneSEGViewport(props) {
     setElement(null);
   };
   const storePresentationState = (0,react.useCallback)(() => {
-    viewportGrid?.viewports.forEach(_ref => {
-      let {
-        viewportId
-      } = _ref;
+    viewportGrid?.viewports.forEach(({
+      viewportId
+    }) => {
       commandsManager.runCommand('storePresentation', {
         viewportId
       });
@@ -250,13 +248,14 @@ function OHIFCornerstoneSEGViewport(props) {
         orientation: viewportOptions.orientation,
         viewportId: viewportOptions.viewportId
       },
-      onElementEnabled: onElementEnabled,
+      onElementEnabled: evt => {
+        props.onElementEnabled?.(evt);
+        onElementEnabled(evt);
+      },
       onElementDisabled: onElementDisabled
-      // initialImageIndex={initialImageIndex}
     }));
   }, [viewportId, segDisplaySet, toolGroupId]);
   const onSegmentChange = (0,react.useCallback)(direction => {
-    direction = direction === 'left' ? -1 : 1;
     const segmentationId = segDisplaySet.displaySetInstanceUID;
     const segmentation = segmentationService.getSegmentation(segmentationId);
     const {
@@ -298,13 +297,6 @@ function OHIFCornerstoneSEGViewport(props) {
       if (evt.segDisplaySet.displaySetInstanceUID === segDisplaySet.displaySetInstanceUID) {
         setSegIsLoading(false);
       }
-      if (evt.overlappingSegments) {
-        uiNotificationService.show({
-          title: 'Overlapping Segments',
-          message: 'Overlapping segments detected which is not currently supported',
-          type: 'warning'
-        });
-      }
     });
     return () => {
       unsubscribe();
@@ -313,11 +305,10 @@ function OHIFCornerstoneSEGViewport(props) {
   (0,react.useEffect)(() => {
     const {
       unsubscribe
-    } = segmentationService.subscribe(segmentationService.EVENTS.SEGMENT_LOADING_COMPLETE, _ref2 => {
-      let {
-        percentComplete,
-        numSegments
-      } = _ref2;
+    } = segmentationService.subscribe(segmentationService.EVENTS.SEGMENT_LOADING_COMPLETE, ({
+      percentComplete,
+      numSegments
+    }) => {
       setProcessingProgress({
         percentComplete,
         totalSegments: numSegments
@@ -332,10 +323,9 @@ function OHIFCornerstoneSEGViewport(props) {
    Cleanup the SEG viewport when the viewport is destroyed
    */
   (0,react.useEffect)(() => {
-    const onDisplaySetsRemovedSubscription = displaySetService.subscribe(displaySetService.EVENTS.DISPLAY_SETS_REMOVED, _ref3 => {
-      let {
-        displaySetInstanceUIDs
-      } = _ref3;
+    const onDisplaySetsRemovedSubscription = displaySetService.subscribe(displaySetService.EVENTS.DISPLAY_SETS_REMOVED, ({
+      displaySetInstanceUIDs
+    }) => {
       const activeViewport = viewports.get(activeViewportId);
       if (displaySetInstanceUIDs.includes(activeViewport.displaySetInstanceUID)) {
         viewportGridService.setDisplaySetsForViewport({
@@ -373,6 +363,51 @@ function OHIFCornerstoneSEGViewport(props) {
       referencedDisplaySetRef.current = null;
     };
   }, [segDisplaySet]);
+  const hydrateSEGDisplaySet = (0,react.useCallback)(({
+    segDisplaySet,
+    viewportId
+  }) => {
+    commandsManager.runCommand('loadSegmentationDisplaySetsForViewport', {
+      displaySets: [segDisplaySet],
+      viewportId
+    });
+  }, [commandsManager]);
+  const onStatusClick = (0,react.useCallback)(async () => {
+    // Before hydrating a SEG and make it added to all viewports in the grid
+    // that share the same frameOfReferenceUID, we need to store the viewport grid
+    // presentation state, so that we can restore it after hydrating the SEG. This is
+    // required if the user has changed the viewport (other viewport than SEG viewport)
+    // presentation state (w/l and invert) and then opens the SEG. If we don't store
+    // the presentation state, the viewport will be reset to the default presentation
+    storePresentationState();
+    const isHydrated = await hydrateSEGDisplaySet({
+      segDisplaySet,
+      viewportId
+    });
+    setIsHydrated(isHydrated);
+  }, [hydrateSEGDisplaySet, segDisplaySet, storePresentationState, viewportId]);
+  (0,react.useEffect)(() => {
+    viewportActionCornersService.setComponents([{
+      viewportId,
+      id: 'viewportStatusComponent',
+      component: _getStatusComponent({
+        isHydrated,
+        onStatusClick
+      }),
+      indexPriority: -100,
+      location: viewportActionCornersService.LOCATIONS.topLeft
+    }, {
+      viewportId,
+      id: 'viewportActionArrowsComponent',
+      component: /*#__PURE__*/react.createElement(src/* ViewportActionArrows */.$I, {
+        key: "actionArrows",
+        onArrowsClick: onSegmentChange,
+        className: viewportId === activeViewportId ? 'visible' : 'invisible group-hover:visible'
+      }),
+      indexPriority: 0,
+      location: viewportActionCornersService.LOCATIONS.topRight
+    }]);
+  }, [activeViewportId, isHydrated, onSegmentChange, onStatusClick, viewportActionCornersService, viewportId]);
 
   // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
   let childrenWithProps = null;
@@ -398,61 +433,9 @@ function OHIFCornerstoneSEGViewport(props) {
     SeriesDescription,
     SpacingBetweenSlices
   } = referencedDisplaySetRef.current.metadata;
-  const hydrateSEGDisplaySet = _ref4 => {
-    let {
-      segDisplaySet,
-      viewportId
-    } = _ref4;
-    commandsManager.runCommand('loadSegmentationDisplaySetsForViewport', {
-      displaySets: [segDisplaySet],
-      viewportId
-    });
-  };
-  const onStatusClick = async () => {
-    // Before hydrating a SEG and make it added to all viewports in the grid
-    // that share the same frameOfReferenceUID, we need to store the viewport grid
-    // presentation state, so that we can restore it after hydrating the SEG. This is
-    // required if the user has changed the viewport (other viewport than SEG viewport)
-    // presentation state (w/l and invert) and then opens the SEG. If we don't store
-    // the presentation state, the viewport will be reset to the default presentation
-    storePresentationState();
-    const isHydrated = await hydrateSEGDisplaySet({
-      segDisplaySet,
-      viewportId
-    });
-    setIsHydrated(isHydrated);
-  };
-  return /*#__PURE__*/react.createElement(react.Fragment, null, /*#__PURE__*/react.createElement(ui_src/* ViewportActionBar */.uY, {
-    onDoubleClick: evt => {
-      evt.stopPropagation();
-      evt.preventDefault();
-    },
-    onArrowsClick: onSegmentChange,
-    getStatusComponent: () => {
-      return _getStatusComponent({
-        isHydrated,
-        onStatusClick
-      });
-    },
-    studyData: {
-      label: viewportLabel,
-      useAltStyling: true,
-      studyDate: formatDate(StudyDate),
-      seriesDescription: `SEG Viewport ${SeriesDescription}`,
-      patientInformation: {
-        patientName: PatientName ? src["default"].utils.formatPN(PatientName.Alphabetic) : '',
-        patientSex: PatientSex || '',
-        patientAge: PatientAge || '',
-        MRN: PatientID || '',
-        thickness: SliceThickness ? src.utils.roundNumber(SliceThickness, 2) : '',
-        thicknessUnits: SliceThickness !== undefined ? 'mm' : '',
-        spacing: SpacingBetweenSlices !== undefined ? src.utils.roundNumber(SpacingBetweenSlices, 2) : '',
-        scanner: ManufacturerModelName || ''
-      }
-    }
-  }), /*#__PURE__*/react.createElement("div", {
+  return /*#__PURE__*/react.createElement(react.Fragment, null, /*#__PURE__*/react.createElement("div", {
     className: "relative flex h-full w-full flex-row overflow-hidden"
-  }, segIsLoading && /*#__PURE__*/react.createElement(ui_src/* LoadingIndicatorTotalPercent */.bk, {
+  }, segIsLoading && /*#__PURE__*/react.createElement(src/* LoadingIndicatorTotalPercent */.pT, {
     className: "h-full w-full",
     totalNumbers: processingProgress.totalSegments,
     percentComplete: processingProgress.percentComplete,

package/dist/{125.bundle.253395f320b72180da63.js → 297.bundle.194d8985ab974839b5b6.js}

@@ -1,22 +1,21 @@
 "use strict";
-(self["webpackChunk"] = self["webpackChunk"] || []).push([[125],{
+(globalThis["webpackChunk"] = globalThis["webpackChunk"] || []).push([[297],{
 
-/***/ 39125:
+/***/ 46297:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(43001);
-/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3827);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(41766);
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(11374);
 /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
 
 
-function OHIFCornerstonePdfViewport(_ref) {
-  let {
-    displaySets
-  } = _ref;
+function OHIFCornerstonePdfViewport({
+  displaySets
+}) {
   const [url, setUrl] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null);
   if (displaySets && displaySets.length > 1) {
     throw new Error('OHIFCornerstonePdfViewport: only one display set is supported for dicom pdf right now');