@ohif/app 3.8.0-beta.66 → 3.8.0-beta.68

package/dist/{295.bundle.57700cd41fd87e1521b4.js → 295.bundle.41d7b63be6a7d726b87e.js}

@@ -19,10 +19,8 @@ var prop_types_default = /*#__PURE__*/__webpack_require__.n(prop_types);
 var react = __webpack_require__(41766);
 // EXTERNAL MODULE: ../../../node_modules/react-i18next/dist/es/index.js + 15 modules
 var es = __webpack_require__(80619);
-// EXTERNAL MODULE: ../../core/src/index.ts + 67 modules
-var src = __webpack_require__(78198);
-// EXTERNAL MODULE: ../../ui/src/index.js + 497 modules
-var ui_src = __webpack_require__(58046);
+// EXTERNAL MODULE: ../../ui/src/index.js + 521 modules
+var src = __webpack_require__(59134);
 ;// CONCATENATED MODULE: ../../../extensions/cornerstone-dicom-seg/src/utils/initSEGToolGroup.ts
 function createSEGToolGroupAndAddTools(ToolGroupService, customizationService, toolGroupId) {
   const {
@@ -66,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 */.Ny.NW.secondary,
+      type: src/* ButtonEnums.type */.Ny.NW.secondary,
       text: 'No',
       value: RESPONSE.CANCEL
     }, {
-      type: ui_src/* ButtonEnums.type */.Ny.NW.primary,
+      type: src/* ButtonEnums.type */.Ny.NW.primary,
       text: 'Yes',
       value: RESPONSE.HYDRATE_SEG
     }];
@@ -102,37 +100,39 @@ function _getStatusComponent({
 }) {
   let ToolTipMessage = null;
   let StatusIcon = null;
-  const {
-    t
-  } = (0,es/* useTranslation */.Bd)('Common');
-  const loadStr = t('LOAD');
   switch (isHydrated) {
     case true:
-      StatusIcon = () => /*#__PURE__*/react.createElement(ui_src/* Icon */.In, {
+      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 */.In, {
+      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 */.m_, {
+  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));
@@ -146,17 +146,12 @@ 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
@@ -170,7 +165,8 @@ function OHIFCornerstoneSEGViewport(props) {
     toolGroupService,
     segmentationService,
     uiNotificationService,
-    customizationService
+    customizationService,
+    viewportActionCornersService
   } = servicesManager.services;
   const toolGroupId = `${SEG_TOOLGROUP_BASE_NAME}-${viewportId}`;
 
@@ -179,7 +175,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 */.ih)();
+  const [viewportGrid, viewportGridService] = (0,src/* useViewportGrid */.ih)();
 
   // States
   const [selectedSegment, setSelectedSegment] = (0,react.useState)(1);
@@ -252,7 +248,6 @@ function OHIFCornerstoneSEGViewport(props) {
     }));
   }, [viewportId, segDisplaySet, toolGroupId]);
   const onSegmentChange = (0,react.useCallback)(direction => {
-    direction = direction === 'left' ? -1 : 1;
     const segmentationId = segDisplaySet.displaySetInstanceUID;
     const segmentation = segmentationService.getSegmentation(segmentationId);
     const {
@@ -360,6 +355,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;
@@ -385,60 +425,9 @@ function OHIFCornerstoneSEGViewport(props) {
     SeriesDescription,
     SpacingBetweenSlices
   } = referencedDisplaySetRef.current.metadata;
-  const hydrateSEGDisplaySet = ({
-    segDisplaySet,
-    viewportId
-  }) => {
-    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 */.cS, {
-    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 */.Ay.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 */.pT, {
+  }, segIsLoading && /*#__PURE__*/react.createElement(src/* LoadingIndicatorTotalPercent */.pT, {
     className: "h-full w-full",
     totalNumbers: processingProgress.totalSegments,
     percentComplete: processingProgress.percentComplete,

package/dist/{41.bundle.b7bf03502ac3e2ddca35.js → 41.bundle.ad4a012883642620e839.js}

@@ -15,8 +15,8 @@ __webpack_require__.d(__webpack_exports__, {
   toolbarButtons: () => (/* reexport */ src_toolbarButtons)
 });
 
-// EXTERNAL MODULE: ../../core/src/index.ts + 67 modules
-var src = __webpack_require__(78198);
+// EXTERNAL MODULE: ../../core/src/index.ts + 68 modules
+var src = __webpack_require__(85073);
 // EXTERNAL MODULE: ../../../node_modules/i18next/dist/esm/i18next.js
 var i18next = __webpack_require__(92344);
 ;// CONCATENATED MODULE: ../../../modes/longitudinal/package.json
@@ -268,8 +268,6 @@ function initToolGroups(extensionManager, toolGroupService, commandsManager) {
   initVolume3DToolGroup(extensionManager, toolGroupService);
 }
 /* harmony default export */ const src_initToolGroups = (initToolGroups);
-// EXTERNAL MODULE: ../../ui/src/index.js + 497 modules
-var ui_src = __webpack_require__(58046);
 ;// CONCATENATED MODULE: ../../../modes/longitudinal/src/toolbarButtons.ts
 // TODO: torn, can either bake this here; or have to create a whole new button type
 // Only ways that you can pass in a custom React component for render :l
@@ -281,27 +279,6 @@ const {
 const {
   createButton
 } = src.ToolbarService;
-
-/**
- *
- * @param {*} preset - preset number (from above import)
- * @param {*} title
- * @param {*} subtitle
- */
-function _createWwwcPreset(preset, title, subtitle) {
-  return {
-    id: preset.toString(),
-    title,
-    subtitle,
-    commands: [{
-      commandName: 'setWindowLevel',
-      commandOptions: {
-        ...windowLevelPresets[preset]
-      },
-      context: 'CORNERSTONE'
-    }]
-  };
-}
 const setToolActiveToolbar = {
   commandName: 'setToolActiveToolbar',
   commandOptions: {
@@ -374,27 +351,15 @@ const toolbarButtons = [{
     evaluate: 'evaluate.cornerstoneTool'
   }
 },
-// Window Level + Presets...
+// Window Level
 {
   id: 'WindowLevel',
-  uiType: 'ohif.splitButton',
+  uiType: 'ohif.radioGroup',
   props: {
-    groupId: 'WindowLevel',
-    primary: createButton({
-      id: 'WindowLevel',
-      icon: 'tool-window-level',
-      label: 'Window Level',
-      tooltip: 'Window Level',
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool'
-    }),
-    secondary: {
-      icon: 'chevron-down',
-      label: 'W/L Manual',
-      tooltip: 'W/L Presets'
-    },
-    renderer: ui_src/* WindowLevelMenuItem */.d4,
-    items: [_createWwwcPreset(1, 'Soft tissue', '400 / 40'), _createWwwcPreset(2, 'Lung', '1500 / -600'), _createWwwcPreset(3, 'Liver', '150 / 90'), _createWwwcPreset(4, 'Bone', '2500 / 480'), _createWwwcPreset(5, 'Brain', '80 / 40')]
+    icon: 'tool-window-level',
+    label: 'Window Level',
+    commands: setToolActiveToolbar,
+    evaluate: 'evaluate.cornerstoneTool'
   }
 },
 // Pan...
@@ -416,7 +381,10 @@ const toolbarButtons = [{
     icon: 'tool-3d-rotate',
     label: '3D Rotate',
     commands: setToolActiveToolbar,
-    evaluate: 'evaluate.cornerstoneTool'
+    evaluate: {
+      name: 'evaluate.cornerstoneTool',
+      disabledText: 'Select a 3D viewport to enable this tool'
+    }
   }
 }, {
   id: 'Capture',
@@ -448,7 +416,10 @@ const toolbarButtons = [{
         toolGroupIds: ['mpr']
       }
     },
-    evaluate: 'evaluate.cornerstoneTool'
+    evaluate: {
+      name: 'evaluate.cornerstoneTool',
+      disabledText: 'Select an MPR viewport to enable this tool'
+    }
   }
 }];
 /* harmony default export */ const src_toolbarButtons = (toolbarButtons);