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

package/dist/699.bundle.9367d7ef9f7615b2e733.js

@@ -0,0 +1,772 @@
+"use strict";
+(globalThis["webpackChunk"] = globalThis["webpackChunk"] || []).push([[699],{
+
+/***/ 40080:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  "default": () => (/* binding */ segmentation_src)
+});
+
+// EXTERNAL MODULE: ../../core/src/index.ts + 70 modules
+var src = __webpack_require__(55411);
+;// CONCATENATED MODULE: ../../../modes/segmentation/package.json
+const package_namespaceObject = /*#__PURE__*/JSON.parse('{"UU":"@ohif/mode-segmentation"}');
+;// CONCATENATED MODULE: ../../../modes/segmentation/src/id.js
+
+const id = package_namespaceObject.UU;
+
+;// CONCATENATED MODULE: ../../../modes/segmentation/src/toolbarButtons.ts
+
+const {
+  createButton
+} = src.ToolbarService;
+const ReferenceLinesListeners = [{
+  commandName: 'setSourceViewportForReferenceLinesTool',
+  context: 'CORNERSTONE'
+}];
+const setToolActiveToolbar = {
+  commandName: 'setToolActiveToolbar',
+  commandOptions: {
+    toolGroupIds: ['default', 'mpr', 'SRToolGroup', 'volume3d']
+  }
+};
+const toolbarButtons = [{
+  id: 'Zoom',
+  uiType: 'ohif.radioGroup',
+  props: {
+    icon: 'tool-zoom',
+    label: 'Zoom',
+    commands: setToolActiveToolbar,
+    evaluate: 'evaluate.cornerstoneTool'
+  }
+}, {
+  id: 'WindowLevel',
+  uiType: 'ohif.radioGroup',
+  props: {
+    icon: 'tool-window-level',
+    label: 'Window Level',
+    commands: setToolActiveToolbar,
+    evaluate: 'evaluate.cornerstoneTool'
+  }
+}, {
+  id: 'Pan',
+  uiType: 'ohif.radioGroup',
+  props: {
+    icon: 'tool-move',
+    label: 'Pan',
+    commands: setToolActiveToolbar,
+    evaluate: 'evaluate.cornerstoneTool'
+  }
+}, {
+  id: 'TrackballRotate',
+  uiType: 'ohif.radioGroup',
+  props: {
+    type: 'tool',
+    icon: 'tool-3d-rotate',
+    label: '3D Rotate',
+    commands: setToolActiveToolbar,
+    evaluate: {
+      name: 'evaluate.cornerstoneTool',
+      disabledText: 'Select a 3D viewport to enable this tool'
+    }
+  }
+}, {
+  id: 'Capture',
+  uiType: 'ohif.radioGroup',
+  props: {
+    icon: 'tool-capture',
+    label: 'Capture',
+    commands: 'showDownloadViewportModal',
+    evaluate: 'evaluate.action'
+  }
+}, {
+  id: 'Layout',
+  uiType: 'ohif.layoutSelector',
+  props: {
+    rows: 3,
+    columns: 4,
+    evaluate: 'evaluate.action',
+    commands: 'setViewportGridLayout'
+  }
+}, {
+  id: 'Crosshairs',
+  uiType: 'ohif.radioGroup',
+  props: {
+    icon: 'tool-crosshair',
+    label: 'Crosshairs',
+    commands: {
+      commandName: 'setToolActiveToolbar',
+      commandOptions: {
+        toolGroupIds: ['mpr']
+      }
+    },
+    evaluate: {
+      name: 'evaluate.cornerstoneTool',
+      disabledText: 'Select an MPR viewport to enable this tool'
+    }
+  }
+}, {
+  id: 'MoreTools',
+  uiType: 'ohif.splitButton',
+  props: {
+    groupId: 'MoreTools',
+    evaluate: 'evaluate.group.promoteToPrimaryIfCornerstoneToolNotActiveInTheList',
+    primary: createButton({
+      id: 'Reset',
+      icon: 'tool-reset',
+      tooltip: 'Reset View',
+      label: 'Reset',
+      commands: 'resetViewport',
+      evaluate: 'evaluate.action'
+    }),
+    secondary: {
+      icon: 'chevron-down',
+      label: '',
+      tooltip: 'More Tools'
+    },
+    items: [createButton({
+      id: 'Reset',
+      icon: 'tool-reset',
+      label: 'Reset View',
+      tooltip: 'Reset View',
+      commands: 'resetViewport',
+      evaluate: 'evaluate.action'
+    }), createButton({
+      id: 'rotate-right',
+      icon: 'tool-rotate-right',
+      label: 'Rotate Right',
+      tooltip: 'Rotate +90',
+      commands: 'rotateViewportCW',
+      evaluate: 'evaluate.action'
+    }), createButton({
+      id: 'flipHorizontal',
+      icon: 'tool-flip-horizontal',
+      label: 'Flip Horizontal',
+      tooltip: 'Flip Horizontally',
+      commands: 'flipViewportHorizontal',
+      evaluate: ['evaluate.viewportProperties.toggle', 'evaluate.not3D']
+    }), createButton({
+      id: 'ReferenceLines',
+      icon: 'tool-referenceLines',
+      label: 'Reference Lines',
+      tooltip: 'Show Reference Lines',
+      commands: 'toggleEnabledDisabledToolbar',
+      listeners: {
+        [src/* ViewportGridService */.sI.EVENTS.ACTIVE_VIEWPORT_ID_CHANGED]: ReferenceLinesListeners,
+        [src/* ViewportGridService */.sI.EVENTS.VIEWPORTS_READY]: ReferenceLinesListeners
+      },
+      evaluate: 'evaluate.cornerstoneTool.toggle'
+    }), createButton({
+      id: 'ImageOverlayViewer',
+      icon: 'toggle-dicom-overlay',
+      label: 'Image Overlay',
+      tooltip: 'Toggle Image Overlay',
+      commands: 'toggleEnabledDisabledToolbar',
+      evaluate: 'evaluate.cornerstoneTool.toggle'
+    }), createButton({
+      id: 'StackScroll',
+      icon: 'tool-stack-scroll',
+      label: 'Stack Scroll',
+      tooltip: 'Stack Scroll',
+      commands: setToolActiveToolbar,
+      evaluate: 'evaluate.cornerstoneTool'
+    }), createButton({
+      id: 'invert',
+      icon: 'tool-invert',
+      label: 'Invert',
+      tooltip: 'Invert Colors',
+      commands: 'invertViewport',
+      evaluate: 'evaluate.viewportProperties.toggle'
+    }), createButton({
+      id: 'Probe',
+      icon: 'tool-probe',
+      label: 'Probe',
+      tooltip: 'Probe',
+      commands: setToolActiveToolbar,
+      evaluate: 'evaluate.cornerstoneTool'
+    }), createButton({
+      id: 'Cine',
+      icon: 'tool-cine',
+      label: 'Cine',
+      tooltip: 'Cine',
+      commands: 'toggleCine',
+      evaluate: ['evaluate.cine', 'evaluate.not3D']
+    }), createButton({
+      id: 'Angle',
+      icon: 'tool-angle',
+      label: 'Angle',
+      tooltip: 'Angle',
+      commands: setToolActiveToolbar,
+      evaluate: 'evaluate.cornerstoneTool'
+    }), createButton({
+      id: 'Magnify',
+      icon: 'tool-magnify',
+      label: 'Magnify',
+      tooltip: 'Magnify',
+      commands: setToolActiveToolbar,
+      evaluate: 'evaluate.cornerstoneTool'
+    }), createButton({
+      id: 'RectangleROI',
+      icon: 'tool-rectangle',
+      label: 'Rectangle',
+      tooltip: 'Rectangle',
+      commands: setToolActiveToolbar,
+      evaluate: 'evaluate.cornerstoneTool'
+    }), createButton({
+      id: 'CalibrationLine',
+      icon: 'tool-calibration',
+      label: 'Calibration',
+      tooltip: 'Calibration Line',
+      commands: setToolActiveToolbar,
+      evaluate: 'evaluate.cornerstoneTool'
+    }), createButton({
+      id: 'TagBrowser',
+      icon: 'dicom-tag-browser',
+      label: 'Dicom Tag Browser',
+      tooltip: 'Dicom Tag Browser',
+      commands: 'openDICOMTagViewer'
+    }), createButton({
+      id: 'AdvancedMagnify',
+      icon: 'icon-tool-loupe',
+      label: 'Loupe',
+      tooltip: 'Loupe',
+      commands: 'toggleActiveDisabledToolbar',
+      evaluate: 'evaluate.cornerstoneTool.toggle.ifStrictlyDisabled'
+    }), createButton({
+      id: 'UltrasoundDirectionalTool',
+      icon: 'icon-tool-ultrasound-bidirectional',
+      label: 'Ultrasound Directional',
+      tooltip: 'Ultrasound Directional',
+      commands: setToolActiveToolbar,
+      evaluate: ['evaluate.cornerstoneTool', 'evaluate.isUS']
+    })]
+  }
+}];
+/* harmony default export */ const src_toolbarButtons = (toolbarButtons);
+;// CONCATENATED MODULE: ../../../modes/segmentation/src/segmentationButtons.ts
+function _createSetToolActiveCommands(toolName) {
+  return [{
+    commandName: 'setToolActive',
+    commandOptions: {
+      toolName
+    }
+  }];
+}
+const segmentationButtons_toolbarButtons = [{
+  id: 'BrushTools',
+  uiType: 'ohif.buttonGroup',
+  props: {
+    groupId: 'BrushTools',
+    items: [{
+      id: 'Brush',
+      icon: 'icon-tool-brush',
+      label: 'Brush',
+      evaluate: {
+        name: 'evaluate.cornerstone.segmentation',
+        toolNames: ['CircularBrush', 'SphereBrush'],
+        disabledText: 'Create new segmentation to enable this tool.'
+      },
+      commands: _createSetToolActiveCommands('CircularBrush'),
+      options: [{
+        name: 'Radius (mm)',
+        id: 'brush-radius',
+        type: 'range',
+        min: 0.5,
+        max: 99.5,
+        step: 0.5,
+        value: 25,
+        commands: {
+          commandName: 'setBrushSize',
+          commandOptions: {
+            toolNames: ['CircularBrush', 'SphereBrush']
+          }
+        }
+      }, {
+        name: 'Shape',
+        type: 'radio',
+        id: 'brush-mode',
+        value: 'CircularBrush',
+        values: [{
+          value: 'CircularBrush',
+          label: 'Circle'
+        }, {
+          value: 'SphereBrush',
+          label: 'Sphere'
+        }],
+        commands: 'setToolActiveToolbar'
+      }]
+    }, {
+      id: 'Eraser',
+      icon: 'icon-tool-eraser',
+      label: 'Eraser',
+      evaluate: {
+        name: 'evaluate.cornerstone.segmentation',
+        toolNames: ['CircularEraser', 'SphereEraser']
+      },
+      commands: _createSetToolActiveCommands('CircularEraser'),
+      options: [{
+        name: 'Radius (mm)',
+        id: 'eraser-radius',
+        type: 'range',
+        min: 0.5,
+        max: 99.5,
+        step: 0.5,
+        value: 25,
+        commands: {
+          commandName: 'setBrushSize',
+          commandOptions: {
+            toolNames: ['CircularEraser', 'SphereEraser']
+          }
+        }
+      }, {
+        name: 'Shape',
+        type: 'radio',
+        id: 'eraser-mode',
+        value: 'CircularEraser',
+        values: [{
+          value: 'CircularEraser',
+          label: 'Circle'
+        }, {
+          value: 'SphereEraser',
+          label: 'Sphere'
+        }],
+        commands: 'setToolActiveToolbar'
+      }]
+    }, {
+      id: 'Threshold',
+      icon: 'icon-tool-threshold',
+      label: 'Threshold Tool',
+      evaluate: {
+        name: 'evaluate.cornerstone.segmentation',
+        toolNames: ['ThresholdCircularBrush', 'ThresholdSphereBrush']
+      },
+      commands: _createSetToolActiveCommands('ThresholdCircularBrush'),
+      options: [{
+        name: 'Radius (mm)',
+        id: 'threshold-radius',
+        type: 'range',
+        min: 0.5,
+        max: 99.5,
+        step: 0.5,
+        value: 25,
+        commands: {
+          commandName: 'setBrushSize',
+          commandOptions: {
+            toolNames: ['ThresholdCircularBrush', 'ThresholdSphereBrush']
+          }
+        }
+      }, {
+        name: 'Shape',
+        type: 'radio',
+        id: 'eraser-mode',
+        value: 'ThresholdCircularBrush',
+        values: [{
+          value: 'ThresholdCircularBrush',
+          label: 'Circle'
+        }, {
+          value: 'ThresholdSphereBrush',
+          label: 'Sphere'
+        }],
+        commands: 'setToolActiveToolbar'
+      }, {
+        name: 'Threshold',
+        type: 'radio',
+        id: 'dynamic-mode',
+        value: 'ThresholdRange',
+        values: [{
+          value: 'ThresholdDynamic',
+          label: 'Dynamic'
+        }, {
+          value: 'ThresholdRange',
+          label: 'Range'
+        }],
+        commands: ({
+          value,
+          commandsManager
+        }) => {
+          if (value === 'ThresholdDynamic') {
+            commandsManager.run('setToolActive', {
+              toolName: 'ThresholdCircularBrushDynamic'
+            });
+          } else {
+            commandsManager.run('setToolActive', {
+              toolName: 'ThresholdCircularBrush'
+            });
+          }
+        }
+      }, {
+        name: 'ThresholdRange',
+        type: 'double-range',
+        id: 'threshold-range',
+        min: -1000,
+        max: 1000,
+        step: 1,
+        values: [100, 600],
+        condition: ({
+          options
+        }) => options.find(option => option.id === 'dynamic-mode').value === 'ThresholdRange',
+        commands: {
+          commandName: 'setThresholdRange',
+          commandOptions: {
+            toolNames: ['ThresholdCircularBrush', 'ThresholdSphereBrush']
+          }
+        }
+      }]
+    }]
+  }
+}, {
+  id: 'Shapes',
+  uiType: 'ohif.radioGroup',
+  props: {
+    label: 'Shapes',
+    evaluate: {
+      name: 'evaluate.cornerstone.segmentation',
+      toolNames: ['CircleScissor', 'SphereScissor', 'RectangleScissor']
+    },
+    icon: 'icon-tool-shape',
+    commands: _createSetToolActiveCommands('CircleScissor'),
+    options: [{
+      name: 'Shape',
+      type: 'radio',
+      value: 'CircleScissor',
+      id: 'shape-mode',
+      values: [{
+        value: 'CircleScissor',
+        label: 'Circle'
+      }, {
+        value: 'SphereScissor',
+        label: 'Sphere'
+      }, {
+        value: 'RectangleScissor',
+        label: 'Rectangle'
+      }],
+      commands: 'setToolActiveToolbar'
+    }]
+  }
+}];
+/* harmony default export */ const segmentationButtons = (segmentationButtons_toolbarButtons);
+;// CONCATENATED MODULE: ../../../modes/segmentation/src/initToolGroups.ts
+function createTools(utilityModule) {
+  const {
+    toolNames,
+    Enums
+  } = utilityModule.exports;
+  return {
+    active: [{
+      toolName: toolNames.WindowLevel,
+      bindings: [{
+        mouseButton: Enums.MouseBindings.Primary
+      }]
+    }, {
+      toolName: toolNames.Pan,
+      bindings: [{
+        mouseButton: Enums.MouseBindings.Auxiliary
+      }]
+    }, {
+      toolName: toolNames.Zoom,
+      bindings: [{
+        mouseButton: Enums.MouseBindings.Secondary
+      }]
+    }, {
+      toolName: toolNames.StackScrollMouseWheel,
+      bindings: []
+    }],
+    passive: [{
+      toolName: 'CircularBrush',
+      parentTool: 'Brush',
+      configuration: {
+        activeStrategy: 'FILL_INSIDE_CIRCLE'
+      }
+    }, {
+      toolName: 'CircularEraser',
+      parentTool: 'Brush',
+      configuration: {
+        activeStrategy: 'ERASE_INSIDE_CIRCLE'
+      }
+    }, {
+      toolName: 'SphereBrush',
+      parentTool: 'Brush',
+      configuration: {
+        activeStrategy: 'FILL_INSIDE_SPHERE'
+      }
+    }, {
+      toolName: 'SphereEraser',
+      parentTool: 'Brush',
+      configuration: {
+        activeStrategy: 'ERASE_INSIDE_SPHERE'
+      }
+    }, {
+      toolName: 'ThresholdCircularBrush',
+      parentTool: 'Brush',
+      configuration: {
+        activeStrategy: 'THRESHOLD_INSIDE_CIRCLE'
+      }
+    }, {
+      toolName: 'ThresholdSphereBrush',
+      parentTool: 'Brush',
+      configuration: {
+        activeStrategy: 'THRESHOLD_INSIDE_SPHERE'
+      }
+    }, {
+      toolName: 'ThresholdCircularBrushDynamic',
+      parentTool: 'Brush',
+      configuration: {
+        activeStrategy: 'THRESHOLD_INSIDE_CIRCLE',
+        preview: {
+          enabled: true
+        },
+        strategySpecificConfiguration: {
+          THRESHOLD: {
+            isDynamic: true,
+            dynamicRadius: 3
+          }
+        }
+      }
+    }, {
+      toolName: toolNames.CircleScissors
+    }, {
+      toolName: toolNames.RectangleScissors
+    }, {
+      toolName: toolNames.SphereScissors
+    }, {
+      toolName: toolNames.StackScroll
+    }, {
+      toolName: toolNames.Magnify
+    }, {
+      toolName: toolNames.SegmentationDisplay
+    }, {
+      toolName: toolNames.UltrasoundDirectional
+    }],
+    disabled: [{
+      toolName: toolNames.ReferenceLines
+    }, {
+      toolName: toolNames.AdvancedMagnify
+    }]
+  };
+}
+function initDefaultToolGroup(extensionManager, toolGroupService, commandsManager, toolGroupId) {
+  const utilityModule = extensionManager.getModuleEntry('@ohif/extension-cornerstone.utilityModule.tools');
+  const tools = createTools(utilityModule);
+  toolGroupService.createToolGroupAndAddTools(toolGroupId, tools);
+}
+function initMPRToolGroup(extensionManager, toolGroupService, commandsManager) {
+  const utilityModule = extensionManager.getModuleEntry('@ohif/extension-cornerstone.utilityModule.tools');
+  const tools = createTools(utilityModule);
+  tools.disabled.push({
+    toolName: utilityModule.exports.toolNames.Crosshairs,
+    configuration: {
+      viewportIndicators: false,
+      disableOnPassive: true,
+      autoPan: {
+        enabled: false,
+        panSize: 10
+      }
+    }
+  }, {
+    toolName: utilityModule.exports.toolNames.ReferenceLines
+  });
+  toolGroupService.createToolGroupAndAddTools('mpr', tools);
+}
+function initVolume3DToolGroup(extensionManager, toolGroupService) {
+  const utilityModule = extensionManager.getModuleEntry('@ohif/extension-cornerstone.utilityModule.tools');
+  const {
+    toolNames,
+    Enums
+  } = utilityModule.exports;
+  const tools = {
+    active: [{
+      toolName: toolNames.TrackballRotateTool,
+      bindings: [{
+        mouseButton: Enums.MouseBindings.Primary
+      }]
+    }, {
+      toolName: toolNames.Zoom,
+      bindings: [{
+        mouseButton: Enums.MouseBindings.Secondary
+      }]
+    }, {
+      toolName: toolNames.Pan,
+      bindings: [{
+        mouseButton: Enums.MouseBindings.Auxiliary
+      }]
+    }]
+  };
+  toolGroupService.createToolGroupAndAddTools('volume3d', tools);
+}
+function initToolGroups(extensionManager, toolGroupService, commandsManager) {
+  initDefaultToolGroup(extensionManager, toolGroupService, commandsManager, 'default');
+  initMPRToolGroup(extensionManager, toolGroupService, commandsManager);
+  initVolume3DToolGroup(extensionManager, toolGroupService);
+}
+/* harmony default export */ const src_initToolGroups = (initToolGroups);
+;// CONCATENATED MODULE: ../../../modes/segmentation/src/index.tsx
+
+
+
+
+
+const DEFAULT_TOOL_GROUP_ID = 'default';
+const VOLUME3D_TOOL_GROUP_ID = 'volume3d';
+const ohif = {
+  layout: '@ohif/extension-default.layoutTemplateModule.viewerLayout',
+  sopClassHandler: '@ohif/extension-default.sopClassHandlerModule.stack',
+  hangingProtocol: '@ohif/extension-default.hangingProtocolModule.default',
+  leftPanel: '@ohif/extension-default.panelModule.seriesList',
+  rightPanel: '@ohif/extension-default.panelModule.measure'
+};
+const cornerstone = {
+  viewport: '@ohif/extension-cornerstone.viewportModule.cornerstone'
+};
+const segmentation = {
+  panel: '@ohif/extension-cornerstone-dicom-seg.panelModule.panelSegmentation',
+  panelTool: '@ohif/extension-cornerstone-dicom-seg.panelModule.panelSegmentationWithTools',
+  sopClassHandler: '@ohif/extension-cornerstone-dicom-seg.sopClassHandlerModule.dicom-seg',
+  viewport: '@ohif/extension-cornerstone-dicom-seg.viewportModule.dicom-seg'
+};
+
+/**
+ * Just two dependencies to be able to render a viewport with panels in order
+ * to make sure that the mode is working.
+ */
+const extensionDependencies = {
+  '@ohif/extension-default': '^3.0.0',
+  '@ohif/extension-cornerstone': '^3.0.0',
+  '@ohif/extension-cornerstone-dicom-seg': '^3.0.0'
+};
+function modeFactory({
+  modeConfiguration
+}) {
+  return {
+    /**
+     * Mode ID, which should be unique among modes used by the viewer. This ID
+     * is used to identify the mode in the viewer's state.
+     */
+    id: id,
+    routeName: 'segmentation',
+    /**
+     * Mode name, which is displayed in the viewer's UI in the workList, for the
+     * user to select the mode.
+     */
+    displayName: 'Segmentation',
+    /**
+     * Runs when the Mode Route is mounted to the DOM. Usually used to initialize
+     * Services and other resources.
+     */
+    onModeEnter: ({
+      servicesManager,
+      extensionManager,
+      commandsManager
+    }) => {
+      const {
+        measurementService,
+        toolbarService,
+        toolGroupService
+      } = servicesManager.services;
+      measurementService.clearMeasurements();
+
+      // Init Default and SR ToolGroups
+      src_initToolGroups(extensionManager, toolGroupService, commandsManager);
+      toolbarService.addButtons(src_toolbarButtons);
+      toolbarService.addButtons(segmentationButtons);
+      toolbarService.createButtonSection('primary', ['WindowLevel', 'Pan', 'Zoom', 'TrackballRotate', 'Capture', 'Layout', 'Crosshairs', 'MoreTools']);
+      toolbarService.createButtonSection('segmentationToolbox', ['BrushTools', 'Shapes']);
+    },
+    onModeExit: ({
+      servicesManager
+    }) => {
+      const {
+        toolGroupService,
+        syncGroupService,
+        toolbarService,
+        segmentationService,
+        cornerstoneViewportService,
+        uiDialogService,
+        uiModalService
+      } = servicesManager.services;
+      uiDialogService.dismissAll();
+      uiModalService.hide();
+      toolGroupService.destroy();
+      syncGroupService.destroy();
+      segmentationService.destroy();
+      cornerstoneViewportService.destroy();
+    },
+    /** */
+    validationTags: {
+      study: [],
+      series: []
+    },
+    /**
+     * A boolean return value that indicates whether the mode is valid for the
+     * modalities of the selected studies. Currently we don't have stack viewport
+     * segmentations and we should exclude them
+     */
+    isValidMode: ({
+      modalities
+    }) => {
+      // Don't show the mode if the selected studies have only one modality
+      // that is not supported by the mode
+      const modalitiesArray = modalities.split('\\');
+      return {
+        valid: modalitiesArray.length === 1 ? !['SM', 'US', 'MG', 'OT', 'DOC', 'CR'].includes(modalitiesArray[0]) : true,
+        description: 'The mode does not support studies that ONLY include the following modalities: SM, US, MG, OT, DOC, CR'
+      };
+    },
+    /**
+     * Mode Routes are used to define the mode's behavior. A list of Mode Route
+     * that includes the mode's path and the layout to be used. The layout will
+     * include the components that are used in the layout. For instance, if the
+     * default layoutTemplate is used (id: '@ohif/extension-default.layoutTemplateModule.viewerLayout')
+     * it will include the leftPanels, rightPanels, and viewports. However, if
+     * you define another layoutTemplate that includes a Footer for instance,
+     * you should provide the Footer component here too. Note: We use Strings
+     * to reference the component's ID as they are registered in the internal
+     * ExtensionManager. The template for the string is:
+     * `${extensionId}.{moduleType}.${componentId}`.
+     */
+    routes: [{
+      path: 'template',
+      layoutTemplate: ({
+        location,
+        servicesManager
+      }) => {
+        return {
+          id: ohif.layout,
+          props: {
+            leftPanels: [ohif.leftPanel],
+            rightPanels: [segmentation.panelTool],
+            viewports: [{
+              namespace: cornerstone.viewport,
+              displaySetsToDisplay: [ohif.sopClassHandler]
+            }, {
+              namespace: segmentation.viewport,
+              displaySetsToDisplay: [segmentation.sopClassHandler]
+            }]
+          }
+        };
+      }
+    }],
+    /** List of extensions that are used by the mode */
+    extensions: extensionDependencies,
+    /** HangingProtocol used by the mode */
+    // hangingProtocol: [''],
+    /** SopClassHandlers used by the mode */
+    sopClassHandlers: [ohif.sopClassHandler, segmentation.sopClassHandler],
+    /** hotkeys for mode */
+    hotkeys: [...src/* hotkeys */.ot.defaults.hotkeyBindings]
+  };
+}
+const mode = {
+  id: id,
+  modeFactory,
+  extensionDependencies
+};
+/* harmony default export */ const segmentation_src = (mode);
+
+/***/ })
+
+}]);