@ohif/app 3.7.0-beta.61 → 3.7.0-beta.63

package/dist/{236.bundle.4aab776fb3e7654f1f0c.js → 236.bundle.308648f0e447eaaeda67.js}

@@ -21,9 +21,9 @@ const id = package_namespaceObject.u2;
 // EXTERNAL MODULE: ../../../node_modules/react/index.js
 var react = __webpack_require__(43001);
 // EXTERNAL MODULE: ../../ui/src/index.js + 458 modules
-var src = __webpack_require__(33570);
-// EXTERNAL MODULE: ../../core/src/index.ts + 106 modules
-var core_src = __webpack_require__(38930);
+var src = __webpack_require__(88344);
+// EXTERNAL MODULE: ../../core/src/index.ts + 107 modules
+var core_src = __webpack_require__(3854);
 // EXTERNAL MODULE: ../../../node_modules/react-i18next/dist/es/index.js + 15 modules
 var es = __webpack_require__(69190);
 // EXTERNAL MODULE: ../../../node_modules/mathjs/lib/esm/index.js + 982 modules
@@ -213,10 +213,10 @@ const EVENTS = {
  * expose only the features/behaviors that are relevant to the application
  */
 class ViewerManager extends core_src/* PubSubService */.hC {
-  constructor(viewer, viewportIndex, container, studyInstanceUID, seriesInstanceUID) {
+  constructor(viewer, viewportId, container, studyInstanceUID, seriesInstanceUID) {
     super(EVENTS);
     this.viewer = viewer;
-    this.viewportIndex = viewportIndex;
+    this.viewportId = viewportId;
     this.container = container;
     this.studyInstanceUID = studyInstanceUID;
     this.seriesInstanceUID = seriesInstanceUID;
@@ -1020,23 +1020,23 @@ class MicroscopyService extends core_src/* PubSubService */.hC {
   }
 
   /**
-   * Creates a managed viewer instance for the given thrid-party API's viewer.
+   * Creates a managed viewer instance for the given third-party API's viewer.
    * Restores existing annotations for the given study/series.
    * Adds event subscriptions for the viewer being added.
    * Focuses the selected annotation when the viewer is being loaded into the
    * active viewport.
    *
-   * @param {Object} viewer Third-party viewer API's object to be managed
-   * @param {Number} viewportIndex The index of the viewport to load the viewer
-   * @param {HTMLElement} container The DOM element where it will be renderd
-   * @param {String} studyInstanceUID The study UID of the loaded image
-   * @param {String} seriesInstanceUID The series UID of the loaded image
-   * @param {Array} displaySets All displaySets related to the same StudyInstanceUID
+   * @param viewer - Third-party viewer API's object to be managed
+   * @param viewportId - The viewport Id where the viewer will be loaded
+   * @param container - The DOM element where it will be rendered
+   * @param studyInstanceUID - The study UID of the loaded image
+   * @param seriesInstanceUID - The series UID of the loaded image
+   * @param displaySets - All displaySets related to the same StudyInstanceUID
    *
    * @returns {ViewerManager} managed viewer
    */
-  addViewer(viewer, viewportIndex, container, studyInstanceUID, seriesInstanceUID) {
-    const managedViewer = new viewerManager(viewer, viewportIndex, container, studyInstanceUID, seriesInstanceUID);
+  addViewer(viewer, viewportId, container, studyInstanceUID, seriesInstanceUID) {
+    const managedViewer = new viewerManager(viewer, viewportId, container, studyInstanceUID, seriesInstanceUID);
     this._restoreAnnotations(managedViewer);
     viewer._manager = managedViewer;
     this.managedViewers.add(managedViewer);
@@ -1045,7 +1045,7 @@ class MicroscopyService extends core_src/* PubSubService */.hC {
     this._addManagedViewerSubscriptions(managedViewer);
     if (this.pendingFocus) {
       this.pendingFocus = false;
-      this.focusAnnotation(this.selectedAnnotation, viewportIndex);
+      this.focusAnnotation(this.selectedAnnotation, viewportId);
     }
     return managedViewer;
   }
@@ -1205,12 +1205,12 @@ class MicroscopyService extends core_src/* PubSubService */.hC {
   /**
    * Toggles overview map
    *
-   * @param viewportIndex The active viewport index
+   * @param viewportId The active viewport index
    * @returns {void}
    */
-  toggleOverviewMap(viewportIndex) {
+  toggleOverviewMap(viewportId) {
     const managedViewers = Array.from(this.managedViewers);
-    const managedViewer = managedViewers.find(mv => mv.viewportIndex === viewportIndex);
+    const managedViewer = managedViewers.find(mv => mv.viewportId === viewportId);
     if (managedViewer) {
       managedViewer.toggleOverviewMap();
     }
@@ -1247,10 +1247,10 @@ class MicroscopyService extends core_src/* PubSubService */.hC {
    * the managed viewer instance is created.
    *
    * @param {RoiAnnotation} roiAnnotation RoiAnnotation instance to be focused
-   * @param {Number} viewportIndex Index of the viewport to focus
+   * @param {string} viewportId Index of the viewport to focus
    */
-  focusAnnotation(roiAnnotation, viewportIndex) {
-    const filter = mv => mv.viewportIndex === viewportIndex;
+  focusAnnotation(roiAnnotation, viewportId) {
+    const filter = mv => mv.viewportId === viewportId;
     const managedViewer = Array.from(this.managedViewers).find(filter);
     if (managedViewer) {
       managedViewer.setViewStateByExtent(roiAnnotation);
@@ -1442,7 +1442,7 @@ function callInputDialog(_ref) {
             label: "Enter your annotation",
             labelClassName: "text-white text-[14px] leading-[1.2]",
             autoFocus: true,
-            className: "bg-black border-primary-main",
+            className: "border-primary-main bg-black",
             type: "text",
             value: value.defaultValue,
             onChange: event => {
@@ -1738,14 +1738,14 @@ function MicroscopyPanel(props) {
     displaySetService
   } = servicesManager.services;
   (0,react.useEffect)(() => {
-    const viewport = props.viewports[props.activeViewportIndex];
+    const viewport = props.viewports[props.activeViewportId];
     if (viewport.displaySetInstanceUIDs[0]) {
       const displaySet = displaySetService.getDisplaySetByUID(viewport.displaySetInstanceUIDs[0]);
       if (displaySet) {
         setStudyInstanceUID(displaySet.StudyInstanceUID);
       }
     }
-  }, [props.viewports, props.activeViewportIndex]);
+  }, [props.viewports, props.activeViewportId]);
   (0,react.useEffect)(() => {
     const onAnnotationUpdated = () => {
       const roiAnnotations = microscopyService.getAnnotationsForStudy(studyInstanceUID);
@@ -1893,7 +1893,7 @@ function MicroscopyPanel(props) {
    */
   const onDeleteCurrentSRHandler = async () => {
     try {
-      const activeViewport = props.viewports[props.activeViewportIndex];
+      const activeViewport = props.viewports[props.activeViewportId];
       const {
         StudyInstanceUID
       } = activeViewport;
@@ -1937,7 +1937,7 @@ function MicroscopyPanel(props) {
     } = _ref;
     const roiAnnotation = microscopyService.getAnnotation(uid);
     microscopyService.selectAnnotation(roiAnnotation);
-    microscopyService.focusAnnotation(roiAnnotation, props.activeViewportIndex);
+    microscopyService.focusAnnotation(roiAnnotation, props.activeViewportId);
   };
 
   /**
@@ -1988,7 +1988,7 @@ function MicroscopyPanel(props) {
   });
   const disabled = data.length === 0;
   return /*#__PURE__*/react.createElement(react.Fragment, null, /*#__PURE__*/react.createElement("div", {
-    className: "overflow-x-hidden overflow-y-auto ohif-scrollbar",
+    className: "ohif-scrollbar overflow-y-auto overflow-x-hidden",
     "data-cy": 'measurements-panel'
   }, /*#__PURE__*/react.createElement(src/* MeasurementTable */.wt, {
     title: "Measurements",
@@ -2023,12 +2023,12 @@ function getPanelModule(_ref) {
   } = _ref;
   const wrappedMeasurementPanel = () => {
     const [{
-      activeViewportIndex,
+      activeViewportId,
       viewports
-    }, viewportGridService] = (0,src/* useViewportGrid */.O_)();
+    }] = (0,src/* useViewportGrid */.O_)();
     return /*#__PURE__*/react.createElement(MicroscopyPanel_MicroscopyPanel, {
       viewports: viewports,
-      activeViewportIndex: activeViewportIndex,
+      activeViewportId: activeViewportId,
       onSaveComplete: () => {},
       onRejectComplete: () => {},
       commandsManager: commandsManager,
@@ -2138,22 +2138,6 @@ function getCommandsModule(_ref) {
         }], dragPanOnMiddle, dragZoomOnRight]);
       }
     },
-    incrementActiveViewport: () => {
-      const {
-        activeViewportIndex,
-        viewports
-      } = viewportGridService.getState();
-      const nextViewportIndex = (activeViewportIndex + 1) % viewports.length;
-      viewportGridService.setActiveViewportIndex(nextViewportIndex);
-    },
-    decrementActiveViewport: () => {
-      const {
-        activeViewportIndex,
-        viewports
-      } = viewportGridService.getState();
-      const nextViewportIndex = (activeViewportIndex - 1 + viewports.length) % viewports.length;
-      viewportGridService.setActiveViewportIndex(nextViewportIndex);
-    },
     toggleOverlays: () => {
       // overlay
       const overlays = document.getElementsByClassName('microscopy-viewport-overlay');
@@ -2167,10 +2151,10 @@ function getCommandsModule(_ref) {
 
       // overview
       const {
-        activeViewportIndex,
+        activeViewportId,
         viewports
       } = viewportGridService.getState();
-      microscopyService.toggleOverviewMap(activeViewportIndex);
+      microscopyService.toggleOverviewMap(activeViewportId);
     },
     toggleAnnotations: () => {
       microscopyService.toggleROIsVisibility();
@@ -2192,14 +2176,6 @@ function getCommandsModule(_ref) {
       storeContexts: [],
       options: {}
     },
-    incrementActiveViewport: {
-      commandFn: actions.incrementActiveViewport,
-      storeContexts: []
-    },
-    decrementActiveViewport: {
-      commandFn: actions.decrementActiveViewport,
-      storeContexts: []
-    },
     toggleOverlays: {
       commandFn: actions.toggleOverlays,
       storeContexts: [],
@@ -2669,7 +2645,7 @@ const MicroscopyViewport = props => {
      *
      * @param props {*}
      * @param props.displaySets
-     * @param props.viewportIndex
+     * @param props.viewportId
      * @param props.viewportLabel
      * @param props.dataSource
      * @param props.viewportOptions
@@ -2682,16 +2658,15 @@ const MicroscopyViewport = props => {
       } = props;
       const [viewportGrid, viewportGridService] = (0,src/* useViewportGrid */.O_)();
       const {
-        viewports,
-        activeViewportIndex
+        activeViewportId
       } = viewportGrid;
       return /*#__PURE__*/react.createElement(MicroscopyViewport, _extends({
         servicesManager: servicesManager,
         extensionManager: extensionManager,
         commandsManager: commandsManager,
-        activeViewportIndex: activeViewportIndex,
-        setViewportActive: viewportIndex => {
-          viewportGridService.setActiveViewportIndex(viewportIndex);
+        activeViewportId: activeViewportId,
+        setViewportActive: viewportId => {
+          viewportGridService.setActiveViewportId(viewportId);
         },
         viewportData: viewportOptions
       }, props));

package/dist/{250.bundle.0d497b1b8afb0cbbe02f.js → 250.bundle.1543b1b8466d43f3465d.js}

@@ -23,7 +23,7 @@ var prop_types_default = /*#__PURE__*/__webpack_require__.n(prop_types);
 var lodash_debounce = __webpack_require__(8324);
 var lodash_debounce_default = /*#__PURE__*/__webpack_require__.n(lodash_debounce);
 // EXTERNAL MODULE: ../../ui/src/index.js + 458 modules
-var src = __webpack_require__(33570);
+var src = __webpack_require__(88344);
 ;// CONCATENATED MODULE: ../../../extensions/dicom-microscopy/src/DicomMicroscopyViewport.css
 // extracted by mini-css-extract-plugin
 
@@ -261,8 +261,8 @@ const itemGenerator = props => {
 /* harmony default export */ const ViewportOverlay = (generateFromConfig({}));
 // EXTERNAL MODULE: ../../../node_modules/dicomweb-client/build/dicomweb-client.es.js
 var dicomweb_client_es = __webpack_require__(97604);
-// EXTERNAL MODULE: ../../core/src/index.ts + 106 modules
-var core_src = __webpack_require__(38930);
+// EXTERNAL MODULE: ../../core/src/index.ts + 107 modules
+var core_src = __webpack_require__(3854);
 ;// CONCATENATED MODULE: ../../../extensions/dicom-microscopy/src/utils/dicomWebClient.ts
 
 
@@ -425,11 +425,11 @@ class DicomMicroscopyViewport extends react.Component {
     this.setViewportActiveHandler = () => {
       const {
         setViewportActive,
-        viewportIndex,
-        activeViewportIndex
+        viewportId,
+        activeViewportId
       } = this.props;
-      if (viewportIndex !== activeViewportIndex) {
-        setViewportActive(viewportIndex);
+      if (viewportId !== activeViewportId) {
+        setViewportActive(viewportId);
       }
     };
     this.onWindowResize = () => {
@@ -583,7 +583,7 @@ class DicomMicroscopyViewport extends react.Component {
         StudyInstanceUID,
         SeriesInstanceUID
       } = displaySet;
-      this.managedViewer = this.microscopyService.addViewer(this.viewer, this.props.viewportIndex, container, StudyInstanceUID, SeriesInstanceUID);
+      this.managedViewer = this.microscopyService.addViewer(this.viewer, this.props.viewportId, container, StudyInstanceUID, SeriesInstanceUID);
       this.managedViewer.addContextMenuCallback(event => {
         // TODO: refactor this after Bill's changes on ContextMenu feature get merged
         // const roiAnnotationNearBy = this.getNearbyROI(event);
@@ -604,9 +604,13 @@ class DicomMicroscopyViewport extends react.Component {
   componentDidMount() {
     const {
       displaySets,
-      viewportIndex
+      viewportOptions
     } = this.props;
-    const displaySet = displaySets[viewportIndex];
+    const {
+      viewportId
+    } = viewportOptions;
+    // Todo-rename: this is always getting the 0
+    const displaySet = displaySets[0];
     this.installOpenLayersRenderer(this.container.current, displaySet).then(() => {
       this.setState({
         isLoaded: true
@@ -670,17 +674,17 @@ class DicomMicroscopyViewport extends react.Component {
       style: style,
       ref: this.container
     }), this.state.isLoaded ? null : /*#__PURE__*/react.createElement(src/* LoadingIndicatorProgress */.LE, {
-      className: 'w-full h-full bg-black'
+      className: 'h-full w-full bg-black'
     }));
   }
 }
 DicomMicroscopyViewport.propTypes = {
   viewportData: (prop_types_default()).object,
-  activeViewportIndex: (prop_types_default()).number,
+  activeViewportId: (prop_types_default()).string,
   setViewportActive: (prop_types_default()).func,
   // props from OHIF Viewport Grid
   displaySets: (prop_types_default()).array,
-  viewportIndex: (prop_types_default()).number,
+  viewportId: (prop_types_default()).string,
   viewportLabel: (prop_types_default()).string,
   dataSource: (prop_types_default()).object,
   viewportOptions: (prop_types_default()).object,

package/dist/{281.bundle.c35a76364b385ee72bfd.js → 281.bundle.015cf8cb9625c7fb3dd5.js}

@@ -13,8 +13,8 @@ __webpack_require__.d(__webpack_exports__, {
   "default": () => (/* binding */ microscopy_src)
 });
 
-// EXTERNAL MODULE: ../../core/src/index.ts + 106 modules
-var src = __webpack_require__(38930);
+// EXTERNAL MODULE: ../../core/src/index.ts + 107 modules
+var src = __webpack_require__(3854);
 ;// CONCATENATED MODULE: ../../../modes/microscopy/package.json
 const package_namespaceObject = JSON.parse('{"u2":"@ohif/mode-microscopy"}');
 ;// CONCATENATED MODULE: ../../../modes/microscopy/src/id.js