@ohif/app 3.8.0-beta.7 → 3.8.0-beta.70

package/dist/{471.bundle.49c8d281adbae4a2c4df.js → 121.bundle.21827fec690c01ee9ab3.js}

@@ -1,7 +1,7 @@
 "use strict";
-(self["webpackChunk"] = self["webpackChunk"] || []).push([[471],{
+(globalThis["webpackChunk"] = globalThis["webpackChunk"] || []).push([[121],{
 
-/***/ 56471:
+/***/ 23121:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 // ESM COMPAT FLAG
@@ -13,14 +13,12 @@ __webpack_require__.d(__webpack_exports__, {
 });
 
 // EXTERNAL MODULE: ../../../node_modules/react/index.js
-var react = __webpack_require__(43001);
+var react = __webpack_require__(41766);
 // 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: ../../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);
+// EXTERNAL MODULE: ../../ui/src/index.js + 542 modules
+var src = __webpack_require__(48804);
 ;// CONCATENATED MODULE: ../../../extensions/cornerstone-dicom-rt/src/utils/promptHydrateRT.ts
 
 const RESPONSE = {
@@ -28,15 +26,14 @@ const RESPONSE = {
   CANCEL: 0,
   HYDRATE_SEG: 5
 };
-function promptHydrateRT(_ref) {
-  let {
-    servicesManager,
-    rtDisplaySet,
-    viewportId,
-    toolGroupId = 'default',
-    preHydrateCallbacks,
-    hydrateRTDisplaySet
-  } = _ref;
+function promptHydrateRT({
+  servicesManager,
+  rtDisplaySet,
+  viewportId,
+  toolGroupId = 'default',
+  preHydrateCallbacks,
+  hydrateRTDisplaySet
+}) {
   const {
     uiViewportDialogService
   } = servicesManager.services;
@@ -60,11 +57,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
     }];
@@ -87,49 +84,50 @@ function _askHydrate(uiViewportDialogService, viewportId) {
 }
 /* harmony default export */ const utils_promptHydrateRT = (promptHydrateRT);
 // EXTERNAL MODULE: ../../../node_modules/react-i18next/dist/es/index.js + 15 modules
-var es = __webpack_require__(69190);
+var es = __webpack_require__(80619);
 ;// CONCATENATED MODULE: ../../../extensions/cornerstone-dicom-rt/src/viewports/_getStatusComponent.tsx
 
 
 
-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 RTSTRUCT.");
   }
-  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"
-  }, "RTSTRUCT")), !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"
+    }, "RTSTRUCT")), !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));
@@ -150,17 +148,12 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 
 
-
-const {
-  formatDate
-} = src.utils;
 const RT_TOOLGROUP_BASE_NAME = 'RTToolGroup';
 function OHIFCornerstoneRTViewport(props) {
   const {
     children,
     displaySets,
     viewportOptions,
-    viewportLabel,
     servicesManager,
     extensionManager,
     commandsManager
@@ -170,7 +163,8 @@ function OHIFCornerstoneRTViewport(props) {
     toolGroupService,
     segmentationService,
     uiNotificationService,
-    customizationService
+    customizationService,
+    viewportActionCornersService
   } = servicesManager.services;
   const viewportId = viewportOptions.viewportId;
   const toolGroupId = `${RT_TOOLGROUP_BASE_NAME}-${viewportId}`;
@@ -180,7 +174,7 @@ function OHIFCornerstoneRTViewport(props) {
     throw new Error('RT viewport should only have a single display set');
   }
   const rtDisplaySet = displaySets[0];
-  const [viewportGrid, viewportGridService] = (0,ui_src/* useViewportGrid */.O_)();
+  const [viewportGrid, viewportGridService] = (0,src/* useViewportGrid */.ih)();
 
   // States
   const [isToolGroupCreated, setToolGroupCreated] = (0,react.useState)(false);
@@ -224,20 +218,18 @@ function OHIFCornerstoneRTViewport(props) {
     setElement(null);
   };
   const storePresentationState = (0,react.useCallback)(() => {
-    viewportGrid?.viewports.forEach(_ref => {
-      let {
-        viewportId
-      } = _ref;
+    viewportGrid?.viewports.forEach(({
+      viewportId
+    }) => {
       commandsManager.runCommand('storePresentation', {
         viewportId
       });
     });
   }, [viewportGrid]);
-  const hydrateRTDisplaySet = _ref2 => {
-    let {
-      rtDisplaySet,
-      viewportId
-    } = _ref2;
+  const hydrateRTDisplaySet = ({
+    rtDisplaySet,
+    viewportId
+  }) => {
     commandsManager.runCommand('loadSegmentationDisplaySetsForViewport', {
       displaySets: [rtDisplaySet],
       viewportId
@@ -265,7 +257,6 @@ function OHIFCornerstoneRTViewport(props) {
     }));
   }, [viewportId, rtDisplaySet, toolGroupId]);
   const onSegmentChange = (0,react.useCallback)(direction => {
-    direction = direction === 'left' ? -1 : 1;
     const segmentationId = rtDisplaySet.displaySetInstanceUID;
     const segmentation = segmentationService.getSegmentation(segmentationId);
     const {
@@ -300,6 +291,8 @@ function OHIFCornerstoneRTViewport(props) {
     });
   }, [servicesManager, viewportId, rtDisplaySet, rtIsLoading]);
   (0,react.useEffect)(() => {
+    // I'm not sure what is this, since in RT we support Overlapping segments
+    // via contours
     const {
       unsubscribe
     } = segmentationService.subscribe(segmentationService.EVENTS.SEGMENTATION_LOADING_COMPLETE, evt => {
@@ -321,11 +314,10 @@ function OHIFCornerstoneRTViewport(props) {
   (0,react.useEffect)(() => {
     const {
       unsubscribe
-    } = segmentationService.subscribe(segmentationService.EVENTS.SEGMENT_LOADING_COMPLETE, _ref3 => {
-      let {
-        percentComplete,
-        numSegments
-      } = _ref3;
+    } = segmentationService.subscribe(segmentationService.EVENTS.SEGMENT_LOADING_COMPLETE, ({
+      percentComplete,
+      numSegments
+    }) => {
       setProcessingProgress({
         percentComplete,
         totalSegments: numSegments
@@ -340,10 +332,9 @@ function OHIFCornerstoneRTViewport(props) {
    Cleanup the SEG viewport when the viewport is destroyed
    */
   (0,react.useEffect)(() => {
-    const onDisplaySetsRemovedSubscription = displaySetService.subscribe(displaySetService.EVENTS.DISPLAY_SETS_REMOVED, _ref4 => {
-      let {
-        displaySetInstanceUIDs
-      } = _ref4;
+    const onDisplaySetsRemovedSubscription = displaySetService.subscribe(displaySetService.EVENTS.DISPLAY_SETS_REMOVED, ({
+      displaySetInstanceUIDs
+    }) => {
       const activeViewport = viewports.get(activeViewportId);
       if (displaySetInstanceUIDs.includes(activeViewport.displaySetInstanceUID)) {
         viewportGridService.setDisplaySetsForViewport({
@@ -391,19 +382,7 @@ function OHIFCornerstoneRTViewport(props) {
       });
     });
   }
-  const {
-    PatientID,
-    PatientName,
-    PatientSex,
-    PatientAge,
-    SliceThickness,
-    ManufacturerModelName,
-    StudyDate,
-    SeriesDescription,
-    SpacingBetweenSlices,
-    SeriesNumber
-  } = referencedDisplaySetRef.current.metadata;
-  const onStatusClick = async () => {
+  const onStatusClick = (0,react.useCallback)(async () => {
     // Before hydrating a RT 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 RT. This is
@@ -416,38 +395,32 @@ function OHIFCornerstoneRTViewport(props) {
       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({
+  }, [hydrateRTDisplaySet, rtDisplaySet, storePresentationState, viewportId]);
+  (0,react.useEffect)(() => {
+    viewportActionCornersService.setComponents([{
+      viewportId,
+      id: 'viewportStatusComponent',
+      component: _getStatusComponent({
         isHydrated,
         onStatusClick
-      });
-    },
-    studyData: {
-      label: viewportLabel,
-      useAltStyling: true,
-      studyDate: formatDate(StudyDate),
-      currentSeries: SeriesNumber,
-      seriesDescription: `RT Viewport ${SeriesDescription}`,
-      patientInformation: {
-        patientName: PatientName ? src["default"].utils.formatPN(PatientName.Alphabetic) : '',
-        patientSex: PatientSex || '',
-        patientAge: PatientAge || '',
-        MRN: PatientID || '',
-        thickness: SliceThickness ? `${SliceThickness.toFixed(2)}mm` : '',
-        spacing: SpacingBetweenSlices !== undefined ? `${SpacingBetweenSlices.toFixed(2)}mm` : '',
-        scanner: ManufacturerModelName || ''
-      }
-    }
-  }), /*#__PURE__*/react.createElement("div", {
+      }),
+      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]);
+  return /*#__PURE__*/react.createElement(react.Fragment, null, /*#__PURE__*/react.createElement("div", {
     className: "relative flex h-full w-full flex-row overflow-hidden"
-  }, rtIsLoading && /*#__PURE__*/react.createElement(ui_src/* LoadingIndicatorTotalPercent */.bk, {
+  }, rtIsLoading && /*#__PURE__*/react.createElement(src/* LoadingIndicatorTotalPercent */.pT, {
     className: "h-full w-full",
     totalNumbers: processingProgress.totalSegments,
     percentComplete: processingProgress.percentComplete,