chore(version): Update package versions [skip ci]

.circleci/config.yml

@@ -119,21 +119,7 @@ jobs:
             echo "🔍 Running bun audit for security vulnerabilities..."
             echo "Checking for HIGH-RISK vulnerabilities..."
 
-            # Define ignored vulnerabilities with comments
-            IGNORED_VULNS=(
-              "GHSA-5j98-mcp5-4vw2"  # CVE-2025-64756 - glob is not used on the command line
-              "GHSA-8qq5-rm4j-mr97"  # CVE-2026-23745 - limited to build/dev environments
-              "GHSA-r6q2-hw4h-h46w"  # CVE-2026-23950 - limited to build/dev environments
-              "GHSA-34x7-hfp2-rc4v"  # CVE-2026-24842 - limited to build/dev environments
-            )
-
-            # Build ignore flags
-            IGNORE_FLAGS=""
-            for vuln in "${IGNORED_VULNS[@]}"; do
-              IGNORE_FLAGS="$IGNORE_FLAGS --ignore=$vuln"
-            done
-
-            if bun audit $IGNORE_FLAGS --audit-level high; then
+            if bun audit --audit-level high; then
               echo "✅ No high-risk vulnerabilities found"
               echo "🎉 Security audit passed!"
             else
@@ -149,9 +135,7 @@ jobs:
               echo "  5. Re-run: bun audit --audit-level high"
               echo ""
               echo "📋 Full audit report:"
-
-              bun audit $IGNORE_FLAGS --audit-level low || true
-
+              bun audit --audit-level low || true
               echo ""
               echo "❌ This build cannot proceed until high-risk vulnerabilities are resolved."
               exit 1
@@ -387,7 +371,7 @@ jobs:
           name: Export Display Variable
           command: export DISPLAY=:99
       - cypress/install:
-          install-command: yarn install --frozen-lockfile --no-save
+          install-command: yarn install --no-save
       - cypress/run-tests:
           cypress-command: |
             npx wait-on@latest http://localhost:3000 && cd platform/app && npx cypress run --record --parallel

.github/ISSUE_TEMPLATE/bug-report.yml

@@ -51,29 +51,28 @@ body:
     validations:
       required: true
 
-  - type: textarea
-    id: system_info
+  - type: input
+    id: os
     attributes:
-      label: 'System Information'
-      description: 'Please run the following command in your terminal and paste the output:'
-      placeholder: |
-        Run: npx envinfo --system --binaries --browsers
-        
-        Then paste the output here. It should look something like:
-        
-        System:
-          OS: Windows 10 10.0.19042
-          CPU: (8) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
-          Memory: 15.89 GB / 31.74 GB
-          Shell: 1.0.0 - C:\WINDOWS\System32\WindowsPowerShell\v1.0\powershell.exe
-        Binaries:
-          Node: 20.18.1 - C:\Program Files\nodejs\node.EXE
-          Yarn: 1.22.22 - C:\Users\user\AppData\Roaming\npm\yarn.CMD
-          npm: 10.8.2 - C:\Program Files\nodejs\npm.CMD
-        Browsers:
-          Chrome: 83.0.4103.116
-          Edge: Spartan (44.19041.1266.0), Chromium (83.0.478.58)
-          Firefox: 77.0.1
+      label: 'OS'
+      description: 'Your operating system.'
+      placeholder: 'e.g., Windows 10, macOS 10.15.4'
+    validations:
+      required: true
+  - type: input
+    id: node-version
+    attributes:
+      label: 'Node version'
+      description: 'Your Node.js version.'
+      placeholder: 'e.g., 20.18.1'
+    validations:
+      required: true
+  - type: input
+    id: browser
+    attributes:
+      label: 'Browser'
+      description: 'Your browser.'
+      placeholder: 'e.g., Chrome 83.0.4103.116, Firefox 77.0.1, Safari 13.1.1'
     validations:
       required: true
 

.github/workflows/playwright.yml

@@ -23,8 +23,6 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
-      - name: Install Yarn
-        run: npm install -g yarn@1.22.22
       - name: Install dependencies
         run: bun install --frozen-lockfile
       - name: Install Playwright browsers

.netlify/build-deploy-preview.sh

@@ -19,7 +19,7 @@ echo 'Web application built and copied'
 
 # Build && Move Docusaurus Output (for the docs themselves)
 cd platform/docs
-yarn install --frozen-lockfile
+yarn install
 yarn run build
 cd ../..
 mkdir -p ./.netlify/www/docs

.webpack/webpack.base.js

@@ -201,6 +201,8 @@ module.exports = (env, argv, { SRC_DIR, ENTRY }) => {
         '@hooks': path.resolve(__dirname, '../platform/app/src/hooks'),
         '@routes': path.resolve(__dirname, '../platform/app/src/routes'),
         '@state': path.resolve(__dirname, '../platform/app/src/state'),
+        'dicom-microscopy-viewer':
+          'dicom-microscopy-viewer/dist/dynamic-import/dicomMicroscopyViewer.min.js',
       },
       // Which directories to search when resolving modules
       modules: [

README.md

@@ -53,7 +53,7 @@ provided by the <a href="https://ohif.org/">Open Health Imaging Foundation (OHIF
 ## About
 
 The OHIF Viewer can retrieve
-and load images from most sources and formats, render sets in 2D, 3D, and
+and load images from most sources and formats; render sets in 2D, 3D, and
 reconstructed representations; allows for the manipulation, annotation, and
 serialization of observations; supports internationalization, OpenID Connect,
 offline use, hotkeys, and many more features.
@@ -76,7 +76,7 @@ contributions of individuals, research groups, and commercial organizations.
 After more than 8-years of integrating with many companies and organizations,
 The OHIF Viewer has been rebuilt from the ground up to better address the
 varying workflow and configuration needs of its many users. All of the Viewer's
-core features are built using its own extension system. The same extensibility
+core features are built using it's own extension system. The same extensibility
 that allows us to offer:
 
 - 2D and 3D medical image viewing
@@ -147,14 +147,7 @@ Here is a schematic representation of our development workflow:
 3. Navigate to the cloned project's directory
 4. Add this repo as a `remote` named `upstream`
    - `git remote add upstream https://github.com/OHIF/Viewers.git`
-5. `yarn install --frozen-lockfile` to restore dependencies and link projects
-
-:::danger
-In general run `yarn install` with the `--frozen-lockfile` flag to help avoid
-supply chain attacks by enforcing reproducible dependencies. That is, if the
-`yarn.lock` file is clean and does NOT reference compromised packages, then
-no compromised packages should land on your machine by using this flag.
-:::
+5. `yarn install` to restore dependencies and link projects
 
 #### To Develop
 
@@ -165,7 +158,7 @@ _From this repository's root directory:_
 yarn config set workspaces-experimental true
 
 # Restore dependencies
-yarn install --frozen-lockfile
+yarn install
 ```
 
 ## Commands

addOns/externals/devDependencies/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@externals/devDependencies",
   "description": "External dev dependencies - put dev build dependencies here",
-  "version": "3.13.0-beta.12",
+  "version": "3.11.1",
   "license": "MIT",
   "private": true,
   "engines": {
@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@babel/runtime": "7.28.2",
-    "@kitware/vtk.js": "34.15.1",
+    "@kitware/vtk.js": "32.12.0",
     "clsx": "2.1.1",
     "core-js": "3.45.1",
     "moment": "2.30.1"

addOns/externals/dicom-microscopy-viewer/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@externals/dicom-microscopy-viewer",
   "description": "External reference to dicom-microscopy-viewer",
-  "version": "3.13.0-beta.12",
+  "version": "3.11.1",
   "license": "MIT",
   "dependencies": {
-    "dicom-microscopy-viewer": "0.48.17"
+    "dicom-microscopy-viewer": "0.46.1"
   }
 }

addOns/package.json

@@ -38,8 +38,8 @@
   "resolutions": {
     "**/@babel/runtime": "7.28.2",
     "commander": "8.3.0",
-    "dcmjs": "0.49.4",
-    "dicomweb-client": "0.10.4",
+    "dcmjs": "0.43.1",
+    "dicomweb-client": ">=0.10.4",
     "nth-check": "2.1.1",
     "trim-newlines": "5.0.0",
     "glob-parent": "6.0.2",

babel.config.js

@@ -35,7 +35,6 @@ module.exports = {
         '@babel/plugin-transform-typescript',
         '@babel/plugin-transform-class-static-block',
         '@babel/plugin-transform-for-of',
-        ['babel-plugin-transform-import-meta', { module: 'ES6' }],
       ],
     },
     production: {

bunfig.toml

@@ -1,2 +0,0 @@
-[install]
-frozenLockfile = true

bunfig.update-lockfile.toml

@@ -1,2 +0,0 @@
-[install]
-frozenLockfile = false

commit.txt

@@ -1 +1 @@
-739e3239cf5765711050b673b373c0145747824f
+93dabb380574e96fc9d2495978f1ee75acaa6f02

diff.txt

@@ -0,0 +1,118 @@
+diff --git a/extensions/cornerstone/src/components/ViewportOrientationMenu/ViewportOrientationMenu.tsx b/extensions/cornerstone/src/components/ViewportOrientationMenu/ViewportOrientationMenu.tsx
+index 6c1e4f8f6..56dac15b5 100644
+--- a/extensions/cornerstone/src/components/ViewportOrientationMenu/ViewportOrientationMenu.tsx
++++ b/extensions/cornerstone/src/components/ViewportOrientationMenu/ViewportOrientationMenu.tsx
+@@ -156,65 +156,65 @@ function ViewportOrientationMenu({
+       >
+         <Button
+           variant="ghost"
+-          className="flex h-[28px] flex-shrink-0 items-center justify-start self-stretch"
++          className="flex h-7 w-full flex-shrink-0 items-center justify-start self-stretch px-1 py-0"
+           onClick={() => handleOrientationChange('axial')}
+         >
+-          <span className="mr-0 flex w-4 items-center justify-center">
++          <div className="mr-1 flex w-6 items-center justify-start">
+             {currentOrientation === 'axial' ? (
+-              <Icons.Checked className="text-primary h-5 w-5" />
++              <Icons.Checked className="text-primary h-6 w-6" />
+             ) : null}
+-          </span>
+-          <span className="flex-1 text-left">Axial</span>
++          </div>
++          <div className="flex-1 text-left">Axial</div>
+         </Button>
+         <Button
+           variant="ghost"
+-          className="flex h-[28px] flex-shrink-0 items-center justify-start self-stretch"
++          className="flex h-7 w-full flex-shrink-0 items-center justify-start self-stretch px-1 py-0"
+           onClick={() => handleOrientationChange('sagittal')}
+         >
+-          <span className="mr-0 flex w-4 items-center justify-center">
++          <div className="mr-1 flex w-6 items-center justify-start">
+             {currentOrientation === 'sagittal' ? (
+-              <Icons.Checked className="text-primary h-5 w-5" />
++              <Icons.Checked className="text-primary h-6 w-6" />
+             ) : null}
+-          </span>
+-          <span className="flex-1 text-left">Sagittal</span>
++          </div>
++          <div className="flex-1 text-left">Sagittal</div>
+         </Button>
+         <Button
+           variant="ghost"
+-          className="flex h-[28px] flex-shrink-0 items-center justify-start self-stretch"
++          className="flex h-7 w-full flex-shrink-0 items-center justify-start self-stretch px-1 py-0"
+           onClick={() => handleOrientationChange('coronal')}
+         >
+-          <span className="mr-0 flex w-4 items-center justify-center">
++          <div className="mr-1 flex w-6 items-center justify-start">
+             {currentOrientation === 'coronal' ? (
+-              <Icons.Checked className="text-primary h-5 w-5" />
++              <Icons.Checked className="text-primary h-6 w-6" />
+             ) : null}
+-          </span>
+-          <span className="flex-1 text-left">Coronal</span>
++          </div>
++          <div className="flex-1 text-left">Coronal</div>
+         </Button>
+         <Button
+           variant="ghost"
+-          className="flex h-[28px] flex-shrink-0 items-center justify-start self-stretch"
++          className="flex h-7 w-full flex-shrink-0 items-center justify-start self-stretch px-1 py-0"
+           onClick={() => handleOrientationChange('acquisition')}
+         >
+-          <span className="mr-0 flex w-4 items-center justify-center">
++          <div className="mr-1 flex w-6 items-center justify-start">
+             {currentOrientation === 'acquisition' ? (
+-              <Icons.Checked className="text-primary h-5 w-5" />
++              <Icons.Checked className="text-primary h-6 w-6" />
+             ) : null}
+-          </span>
+-          <span className="flex-1 text-left">Acquisition</span>
++          </div>
++          <div className="flex-1 text-left">Acquisition</div>
+         </Button>
+         {/* Divider */}
+-        <div className="my-2 border-t border-white/20" />
++        <div className="mx-1 my-2 border-t border-white/20" />
+         <Button
+           variant="ghost"
+-          className="flex h-[28px] flex-shrink-0 items-center justify-start self-stretch"
++          className="flex h-7 w-full flex-shrink-0 items-center justify-start self-stretch px-1 py-0"
+           onClick={() => handleOrientationChange('reformat')}
+         >
+-          <span className="mr-0 flex w-4 items-center justify-center">
++          <div className="mr-1 flex w-6 items-center justify-start">
+             {currentOrientation === 'reformat' ? (
+-              <Icons.Checked className="text-primary h-5 w-5" />
++              <Icons.Checked className="text-primary h-6 w-6" />
+             ) : null}
+-          </span>
+-          <span className="flex-1 text-left">Reformat</span>
++          </div>
++          <div className="flex-1 text-left">Reformat</div>
+         </Button>
+       </PopoverContent>
+     </Popover>
+diff --git a/platform/ui-next/src/components/Icons/Sources/Checked.tsx b/platform/ui-next/src/components/Icons/Sources/Checked.tsx
+index 83c8fc57e..c88b75e0d 100644
+--- a/platform/ui-next/src/components/Icons/Sources/Checked.tsx
++++ b/platform/ui-next/src/components/Icons/Sources/Checked.tsx
+@@ -4,14 +4,14 @@ import type { IconProps } from '../types';
+ export const Checked = (props: IconProps) => (
+   <svg
+     {...props}
+-    width="24"
++    width="20"
+     height="24"
+-    viewBox="0 0 24 24"
++    viewBox="0 0 20 24"
+     fill="none"
+     xmlns="http://www.w3.org/2000/svg"
+   >
+     <path
+-      d="M16 9L11.3333 15L8 12.4737"
++      d="M14 9L9.3333 15L6 12.4737"
+       stroke="currentColor"
+       strokeWidth="1.5"
+       strokeLinecap="round"

extensions/cornerstone-dicom-pmap/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone-dicom-pmap",
-  "version": "3.13.0-beta.12",
+  "version": "3.11.1",
   "description": "DICOM Parametric Map read workflow",
   "author": "OHIF",
   "license": "MIT",
@@ -33,21 +33,22 @@
     "start": "yarn run dev"
   },
   "peerDependencies": {
-    "@ohif/core": "3.13.0-beta.12",
-    "@ohif/extension-cornerstone": "3.13.0-beta.12",
-    "@ohif/extension-default": "3.13.0-beta.12",
-    "@ohif/i18n": "3.13.0-beta.12",
+    "@ohif/core": "3.11.1",
+    "@ohif/extension-cornerstone": "3.11.1",
+    "@ohif/extension-default": "3.11.1",
+    "@ohif/i18n": "3.11.1",
     "prop-types": "15.8.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-i18next": "12.3.1",
-    "react-router": "6.30.3",
-    "react-router-dom": "6.30.3"
+    "react-router": "6.30.1",
+    "react-router-dom": "6.30.1"
   },
   "dependencies": {
     "@babel/runtime": "7.28.2",
-    "@cornerstonejs/adapters": "4.15.29",
-    "@cornerstonejs/core": "4.15.29",
-    "@kitware/vtk.js": "34.15.1"
+    "@cornerstonejs/adapters": "4.5.13",
+    "@cornerstonejs/core": "4.5.13",
+    "@kitware/vtk.js": "32.12.0",
+    "react-color": "2.19.3"
   }
 }

extensions/cornerstone-dicom-rt/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone-dicom-rt",
-  "version": "3.13.0-beta.12",
+  "version": "3.11.1",
   "description": "DICOM RT read workflow",
   "author": "OHIF",
   "license": "MIT",
@@ -33,18 +33,19 @@
     "start": "yarn run dev"
   },
   "peerDependencies": {
-    "@ohif/core": "3.13.0-beta.12",
-    "@ohif/extension-cornerstone": "3.13.0-beta.12",
-    "@ohif/extension-default": "3.13.0-beta.12",
-    "@ohif/i18n": "3.13.0-beta.12",
+    "@ohif/core": "3.11.1",
+    "@ohif/extension-cornerstone": "3.11.1",
+    "@ohif/extension-default": "3.11.1",
+    "@ohif/i18n": "3.11.1",
     "prop-types": "15.8.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-i18next": "12.3.1",
-    "react-router": "6.30.3",
-    "react-router-dom": "6.30.3"
+    "react-router": "6.30.1",
+    "react-router-dom": "6.30.1"
   },
   "dependencies": {
-    "@babel/runtime": "7.28.2"
+    "@babel/runtime": "7.28.2",
+    "react-color": "2.19.3"
   }
 }

extensions/cornerstone-dicom-rt/src/getSopClassHandlerModule.ts

@@ -4,11 +4,7 @@ import i18n from '@ohif/i18n';
 import { SOPClassHandlerId } from './id';
 import loadRTStruct from './loadRTStruct';
 
-const { sopClassDictionary } = utils;
-
-const sopClassUids = [sopClassDictionary.RTStructureSetStorage];
-
-const cachedRTStructsSEG = new Set<string>();
+const sopClassUids = ['1.2.840.10008.5.1.4.1.1.481.3'];
 
 const loadPromises = {};
 
@@ -17,25 +13,19 @@ function _getDisplaySetsFromSeries(
   servicesManager: AppTypes.ServicesManager,
   extensionManager
 ) {
-  utils.sortStudyInstances(instances);
-  // Choose the LAST instance in the list as the most recently created one.
-  const instance = instances[instances.length - 1];
+  const instance = instances[0];
 
   const {
     StudyInstanceUID,
     SeriesInstanceUID,
     SOPInstanceUID,
-    SeriesDescription = '',
+    SeriesDescription,
     SeriesNumber,
     SeriesDate,
-    SeriesTime,
-    StructureSetDate,
-    StructureSetTime,
     SOPClassUID,
     wadoRoot,
     wadoUri,
     wadoUriRoot,
-    imageId: predecessorImageId,
   } = instance;
 
   const displaySet = {
@@ -45,13 +35,7 @@ function _getDisplaySetsFromSeries(
     displaySetInstanceUID: utils.guid(),
     SeriesDescription,
     SeriesNumber,
-    /**
-     * The "SeriesDate" for a display set is really the display set date, which
-     * should be the date of the instance being used, which will be the structure
-     * set date in this case.
-     */
-    SeriesDate: StructureSetDate || SeriesDate,
-    SeriesTime: StructureSetTime || SeriesTime,
+    SeriesDate,
     SOPInstanceUID,
     SeriesInstanceUID,
     StudyInstanceUID,
@@ -66,8 +50,6 @@ function _getDisplaySetsFromSeries(
     structureSet: null,
     sopClassUids,
     instance,
-    instances,
-    predecessorImageId,
     wadoRoot,
     wadoUriRoot,
     wadoUri,
@@ -76,10 +58,7 @@ function _getDisplaySetsFromSeries(
   };
 
   let referencedSeriesSequence = instance.ReferencedSeriesSequence;
-  if (
-    instance.ReferencedFrameOfReferenceSequence?.RTReferencedStudySequence &&
-    !instance.ReferencedSeriesSequence
-  ) {
+  if (instance.ReferencedFrameOfReferenceSequence && !instance.ReferencedSeriesSequence) {
     instance.ReferencedSeriesSequence = _deriveReferencedSeriesSequenceFromFrameOfReferenceSequence(
       instance.ReferencedFrameOfReferenceSequence
     );
@@ -87,8 +66,7 @@ function _getDisplaySetsFromSeries(
   }
 
   if (!referencedSeriesSequence) {
-    console.error('ReferencedSeriesSequence is missing for the RTSTRUCT');
-    return;
+    throw new Error('ReferencedSeriesSequence is missing for the RTSTRUCT');
   }
 
   const referencedSeries = referencedSeriesSequence[0];
@@ -97,13 +75,9 @@ function _getDisplaySetsFromSeries(
   displaySet.referencedSeriesInstanceUID = referencedSeries.SeriesInstanceUID;
 
   const { displaySetService } = servicesManager.services;
-  const referencedDisplaySets =
-    displaySetService.getDisplaySetsForReferences(referencedSeriesSequence);
-  if (referencedDisplaySets?.length > 1) {
-    console.warn(
-      'Reference applies to more than 1 display set for Contours, applying only to first display set'
-    );
-  }
+  const referencedDisplaySets = displaySetService.getDisplaySetsForSeries(
+    displaySet.referencedSeriesInstanceUID
+  );
 
   if (!referencedDisplaySets || referencedDisplaySets.length === 0) {
     // Instead of throwing error, subscribe to display sets added
@@ -119,7 +93,7 @@ function _getDisplaySetsFromSeries(
       }
     );
   } else {
-    const [referencedDisplaySet] = referencedDisplaySets;
+    const referencedDisplaySet = referencedDisplaySets[0];
     displaySet.referencedDisplaySetInstanceUID = referencedDisplaySet.displaySetInstanceUID;
     displaySet.isReconstructable = referencedDisplaySet.isReconstructable;
   }
@@ -139,45 +113,39 @@ function _load(
 ) {
   const { SOPInstanceUID } = rtDisplaySet;
   const { segmentationService } = servicesManager.services;
-
   if (
     (rtDisplaySet.loading || rtDisplaySet.isLoaded) &&
     loadPromises[SOPInstanceUID] &&
-    cachedRTStructsSEG.has(rtDisplaySet.displaySetInstanceUID)
+    _segmentationExistsInCache(rtDisplaySet, segmentationService)
   ) {
     return loadPromises[SOPInstanceUID];
   }
 
   rtDisplaySet.loading = true;
 
-  const { unsubscribe } = segmentationService.subscribe(
-    segmentationService.EVENTS.SEGMENTATION_LOADING_COMPLETE,
-    (evt: { rtDisplaySet: { displaySetInstanceUID: string } }) => {
-      if (evt.rtDisplaySet?.displaySetInstanceUID === rtDisplaySet.displaySetInstanceUID) {
-        cachedRTStructsSEG.add(rtDisplaySet.displaySetInstanceUID);
-        unsubscribe();
-      }
-    }
-  );
-
   // We don't want to fire multiple loads, so we'll wait for the first to finish
   // and also return the same promise to any other callers.
-  loadPromises[SOPInstanceUID] = new Promise<void>(async (resolve, reject) => {
-    try {
-      if (!rtDisplaySet.structureSet) {
-        const structureSet = await loadRTStruct(extensionManager, rtDisplaySet, headers);
-        rtDisplaySet.structureSet = structureSet;
-      }
+  loadPromises[SOPInstanceUID] = new Promise(async (resolve, reject) => {
+    if (!rtDisplaySet.structureSet) {
+      const structureSet = await loadRTStruct(extensionManager, rtDisplaySet, headers);
 
-      if (createSegmentation) {
-        await segmentationService.createSegmentationForRTDisplaySet(rtDisplaySet);
-      }
+      rtDisplaySet.structureSet = structureSet;
+    }
 
-      resolve();
-    } catch (error) {
-      reject(error);
-    } finally {
+    if (createSegmentation) {
+      segmentationService
+        .createSegmentationForRTDisplaySet(rtDisplaySet)
+        .then(() => {
+          rtDisplaySet.loading = false;
+          resolve();
+        })
+        .catch(error => {
+          rtDisplaySet.loading = false;
+          reject(error);
+        });
+    } else {
       rtDisplaySet.loading = false;
+      resolve();
     }
   });
 
@@ -219,6 +187,11 @@ function _deriveReferencedSeriesSequenceFromFrameOfReferenceSequence(
   return ReferencedSeriesSequence;
 }
 
+function _segmentationExistsInCache() {
+  // Todo: fix this
+  return false;
+}
+
 function getSopClassHandlerModule(params: OhifTypes.Extensions.ExtensionParams) {
   const { servicesManager, extensionManager } = params;
 

extensions/cornerstone-dicom-rt/src/loadRTStruct.js

@@ -2,34 +2,9 @@ import dcmjs from 'dcmjs';
 const { DicomMessage, DicomMetaDictionary } = dcmjs.data;
 const dicomlab2RGB = dcmjs.data.Colors.dicomlab2RGB;
 
-/**
- * Checks and loads contour data for RT Structure Set, handling both inline and bulk data URIs.
- * Processes ROIContourSequence to extract contour data and resolve any bulk data references.
- *
- * @async
- * @function checkAndLoadContourData
- * @param {Object} params - Parameters object
- * @param {Object} params.instance - Initial RT Structure instance
- * @param {Object} params.dataSource - Data source for retrieving bulk data
- * @param {Object} params.extensionManager - OHIF extension manager
- * @param {Object} params.rtStructDisplaySet - RT Structure display set
- * @param {Object} params.headers - HTTP headers for requests
- * @returns {Promise<Object>} Promise that resolves to the processed RT Structure instance with loaded contour data
- * @throws {Promise<string>} Rejects with error message if instance is invalid or data retrieval fails
- */
-async function checkAndLoadContourData({
-  instance: initialInstance,
-  dataSource,
-  extensionManager,
-  rtStructDisplaySet,
-  headers,
-}) {
-  let instance = initialInstance;
+async function checkAndLoadContourData(instance, datasource) {
   if (!instance || !instance.ROIContourSequence) {
-    instance = await getRTStructInstance({ extensionManager, rtStructDisplaySet, headers });
-    if (!instance || !instance.ROIContourSequence) {
-      return Promise.reject('Invalid instance object or ROIContourSequence');
-    }
+    return Promise.reject('Invalid instance object or ROIContourSequence');
   }
 
   const promisesMap = new Map();
@@ -55,11 +30,11 @@ async function checkAndLoadContourData({
       } else if (contourData && contourData.BulkDataURI) {
         const bulkDataURI = contourData.BulkDataURI;
 
-        if (!dataSource || !dataSource.retrieve || !dataSource.retrieve.bulkDataURI) {
-          return Promise.reject('Invalid dataSource object or retrieve function');
+        if (!datasource || !datasource.retrieve || !datasource.retrieve.bulkDataURI) {
+          return Promise.reject('Invalid datasource object or retrieve function');
         }
 
-        const bulkDataPromise = dataSource.retrieve.bulkDataURI({
+        const bulkDataPromise = datasource.retrieve.bulkDataURI({
           BulkDataURI: bulkDataURI,
           StudyInstanceUID: instance.StudyInstanceUID,
           SeriesInstanceUID: instance.SeriesInstanceUID,
@@ -69,40 +44,6 @@ async function checkAndLoadContourData({
         promisesMap.has(referencedROINumber)
           ? promisesMap.get(referencedROINumber).push(bulkDataPromise)
           : promisesMap.set(referencedROINumber, [bulkDataPromise]);
-      } else if (contourData && contourData.InlineBinary) {
-        // Contour data is still in binary format, conversion needed
-        const base64String = contourData.InlineBinary;
-        const decodedText = atob(base64String);
-
-        const rawValues = decodedText.split('\\');
-
-        const result = [];
-
-        // Ensure strictly that we have a full set of 3 coordinates
-        if (rawValues.length % 3 !== 0) {
-          return Promise.reject('ContourData raw values not divisible by 3');
-        }
-
-        for (let i = 0; i < rawValues.length; i += 3) {
-          if (i + 2 < rawValues.length) {
-            const x = parseFloat(rawValues[i]);
-            const y = parseFloat(rawValues[i + 1]);
-            const z = parseFloat(rawValues[i + 2]);
-
-            // Only push if all three are valid numbers (filters out trailing empty splits)
-            if (!isNaN(x) && !isNaN(y) && !isNaN(z)) {
-              result.push(x);
-              result.push(y);
-              result.push(z);
-            } else {
-              return Promise.reject('Error parsing contourData from InlineBinary format');
-            }
-          }
-        }
-
-        promisesMap.has(referencedROINumber)
-          ? promisesMap.get(referencedROINumber).push(result)
-          : promisesMap.set(referencedROINumber, [result]);
       } else {
         return Promise.reject(`Invalid ContourData: ${contourData}`);
       }
@@ -123,12 +64,9 @@ async function checkAndLoadContourData({
         ROIContour.ContourSequence.forEach((Contour, index) => {
           const promise = resolvedPromises[index];
           if (promise.status === 'fulfilled') {
-            if (
-              Array.isArray(promise.value) &&
-              promise.value.every(it => Number.isFinite(Number(it)))
-            ) {
+            if (Array.isArray(promise.value) && promise.value.every(Number.isFinite)) {
               // If promise.value is already an array of numbers, use it directly
-              Contour.ContourData = promise.value.map(Number);
+              Contour.ContourData = promise.value;
             } else {
               // If the resolved promise value is a byte array (Blob), it needs to be decoded
               const uint8Array = new Uint8Array(promise.value);
@@ -149,74 +87,35 @@ async function checkAndLoadContourData({
       console.error(error);
     }
   });
-
-  return instance;
 }
 
-/**
- * Retrieves and parses RT Structure Set instance from DICOM data.
- * Uses the cornerstone utility module to load DICOM data and converts it to a naturalized dataset.
- *
- * @async
- * @function getRTStructInstance
- * @param {Object} params - Parameters object
- * @param {Object} params.extensionManager - OHIF extension manager
- * @param {Object} params.rtStructDisplaySet - RT Structure display set
- * @param {Object} params.headers - HTTP headers for requests
- * @returns {Promise<Object>} Promise that resolves to the parsed RT Structure dataset
- */
-const getRTStructInstance = async ({ extensionManager, rtStructDisplaySet, headers }) => {
+export default async function loadRTStruct(extensionManager, rtStructDisplaySet, headers) {
   const utilityModule = extensionManager.getModuleEntry(
     '@ohif/extension-cornerstone.utilityModule.common'
   );
-  const { dicomLoaderService } = utilityModule.exports;
-  const segArrayBuffer = await dicomLoaderService.findDicomDataPromise(
-    rtStructDisplaySet,
-    null,
-    headers
-  );
-  const dicomData = DicomMessage.readFile(segArrayBuffer);
-  const rtStructDataset = DicomMetaDictionary.naturalizeDataset(dicomData.dict);
-  rtStructDataset._meta = DicomMetaDictionary.namifyDataset(dicomData.meta);
-  return rtStructDataset;
-};
-
-/**
- * Main function to load and process RT Structure Set data.
- * Creates a structure set object with ROI contours, metadata, and visualization properties.
- * Handles both bulk data URI and inline contour data scenarios.
- *
- * @async
- * @function loadRTStruct
- * @param {Object} extensionManager - OHIF extension manager
- * @param {Object} rtStructDisplaySet - RT Structure display set to process
- * @param {Object} headers - HTTP headers for data requests
- * @returns {Promise<Object>} Promise that resolves to a structure set object containing:
- *   - StructureSetLabel: Label of the structure set
- *   - SeriesInstanceUID: Series instance UID
- *   - ROIContours: Array of ROI contour data with points and metadata
- *   - visible: Visibility state
- *   - ReferencedSOPInstanceUIDsSet: Set of referenced SOP instance UIDs
- */
-export default async function loadRTStruct(extensionManager, rtStructDisplaySet, headers) {
   const dataSource = extensionManager.getActiveDataSource()[0];
   const { bulkDataURI } = dataSource.getConfig?.() || {};
 
+  const { dicomLoaderService } = utilityModule.exports;
+
   // Set here is loading is asynchronous.
   // If this function throws its set back to false.
   rtStructDisplaySet.isLoaded = true;
   let instance = rtStructDisplaySet.instance;
 
   if (!bulkDataURI || !bulkDataURI.enabled) {
-    instance = await getRTStructInstance({ extensionManager, rtStructDisplaySet, headers });
-  } else {
-    instance = await checkAndLoadContourData({
-      instance,
-      dataSource,
-      extensionManager,
+    const segArrayBuffer = await dicomLoaderService.findDicomDataPromise(
       rtStructDisplaySet,
-      headers,
-    });
+      null,
+      headers
+    );
+
+    const dicomData = DicomMessage.readFile(segArrayBuffer);
+    const rtStructDataset = DicomMetaDictionary.naturalizeDataset(dicomData.dict);
+    rtStructDataset._meta = DicomMetaDictionary.namifyDataset(dicomData.meta);
+    instance = rtStructDataset;
+  } else {
+    await checkAndLoadContourData(instance, dataSource);
   }
 
   const { StructureSetROISequence, ROIContourSequence, RTROIObservationsSequence } = instance;
@@ -233,16 +132,21 @@ export default async function loadRTStruct(extensionManager, rtStructDisplaySet,
   for (let i = 0; i < ROIContourSequence.length; i++) {
     const ROIContour = ROIContourSequence[i];
     const { ContourSequence } = ROIContour;
+
     if (!ContourSequence) {
       continue;
     }
 
+    const isSupported = false;
+
     const ContourSequenceArray = _toArray(ContourSequence);
 
     const contourPoints = [];
-    for (const ContourSequenceItem of ContourSequenceArray) {
+    for (let c = 0; c < ContourSequenceArray.length; c++) {
       const { ContourData, NumberOfContourPoints, ContourGeometricType, ContourImageSequence } =
-        ContourSequenceItem;
+        ContourSequenceArray[c];
+
+      let isSupported = false;
 
       const points = [];
       for (let p = 0; p < NumberOfContourPoints * 3; p += 3) {
@@ -253,18 +157,22 @@ export default async function loadRTStruct(extensionManager, rtStructDisplaySet,
         });
       }
 
-      const supportedContourTypesMap = new Map([
-        ['CLOSED_PLANAR', false],
-        ['OPEN_NONPLANAR', false],
-        ['OPEN_PLANAR', false],
-        ['POINT', true],
-      ]);
+      switch (ContourGeometricType) {
+        case 'CLOSED_PLANAR':
+        case 'OPEN_PLANAR':
+        case 'POINT':
+          isSupported = true;
+
+          break;
+        default:
+          continue;
+      }
 
       contourPoints.push({
         numberOfPoints: NumberOfContourPoints,
         points,
         type: ContourGeometricType,
-        isSupported: supportedContourTypesMap.get(ContourGeometricType) ?? false,
+        isSupported,
       });
 
       if (ContourImageSequence?.ReferencedSOPInstanceUID) {
@@ -279,30 +187,20 @@ export default async function loadRTStruct(extensionManager, rtStructDisplaySet,
       StructureSetROISequence,
       RTROIObservationsSequence,
       ROIContour,
-      contourPoints
+      contourPoints,
+      isSupported
     );
   }
   return structureSet;
 }
 
-/**
- * Sets metadata for ROI contour data and adds it to the structure set.
- * Extracts ROI information from StructureSetROISequence and RTROIObservationsSequence,
- * then creates a complete ROI contour data object with visualization properties.
- *
- * @function _setROIContourMetadata
- * @param {Object} structureSet - The structure set object to add ROI contour to
- * @param {Array} StructureSetROISequence - Array of structure set ROI definitions
- * @param {Array} RTROIObservationsSequence - Array of RT ROI observations
- * @param {Object} ROIContour - ROI contour object containing contour data
- * @param {Array} contourPoints - Array of processed contour points
- */
 function _setROIContourMetadata(
   structureSet,
   StructureSetROISequence,
   RTROIObservationsSequence,
   ROIContour,
-  contourPoints
+  contourPoints,
+  isSupported
 ) {
   const StructureSetROI = StructureSetROISequence.find(
     structureSetROI => structureSetROI.ROINumber === ROIContour.ReferencedROINumber
@@ -313,9 +211,9 @@ function _setROIContourMetadata(
     ROIName: StructureSetROI.ROIName,
     ROIGenerationAlgorithm: StructureSetROI.ROIGenerationAlgorithm,
     ROIDescription: StructureSetROI.ROIDescription,
+    isSupported,
     contourPoints,
     visible: true,
-    colorArray: [],
   };
 
   _setROIContourDataColor(ROIContour, ROIContourData);
@@ -332,14 +230,6 @@ function _setROIContourMetadata(
   structureSet.ROIContours.push(ROIContourData);
 }
 
-/**
- * Sets the display color for ROI contour data.
- * Uses ROIDisplayColor if available, otherwise converts RecommendedDisplayCIELabValue to RGB.
- *
- * @function _setROIContourDataColor
- * @param {Object} ROIContour - ROI contour object containing color information
- * @param {Object} ROIContourData - ROI contour data object to set color on
- */
 function _setROIContourDataColor(ROIContour, ROIContourData) {
   let { ROIDisplayColor, RecommendedDisplayCIELabValue } = ROIContour;
 
@@ -353,15 +243,6 @@ function _setROIContourDataColor(ROIContour, ROIContourData) {
   }
 }
 
-/**
- * Sets RT ROI observations metadata for ROI contour data.
- * Finds matching RTROIObservations by ROINumber and adds observation details to contour data.
- *
- * @function _setROIContourRTROIObservations
- * @param {Object} ROIContourData - ROI contour data object to add observations to
- * @param {Array} RTROIObservationsSequence - Array of RT ROI observations
- * @param {number} ROINumber - ROI number to match observations
- */
 function _setROIContourRTROIObservations(ROIContourData, RTROIObservationsSequence, ROINumber) {
   const RTROIObservations = RTROIObservationsSequence.find(
     RTROIObservations => RTROIObservations.ReferencedROINumber === ROINumber
@@ -381,14 +262,6 @@ function _setROIContourRTROIObservations(ROIContourData, RTROIObservationsSequen
   }
 }
 
-/**
- * Converts a single object or array to an array.
- * Utility function to ensure consistent array handling for DICOM sequences.
- *
- * @function _toArray
- * @param {*} objOrArray - Object or array to convert
- * @returns {Array} Array containing the input (if already array) or wrapped in array
- */
 function _toArray(objOrArray) {
   return Array.isArray(objOrArray) ? objOrArray : [objOrArray];
 }

extensions/cornerstone-dicom-rt/src/viewports/OHIFCornerstoneRTViewport.tsx

@@ -103,7 +103,7 @@ function OHIFCornerstoneRTViewport(props: withAppTypes) {
     const { unsubscribe } = segmentationService.subscribe(
       segmentationService.EVENTS.SEGMENTATION_LOADING_COMPLETE,
       evt => {
-        if (evt.rtDisplaySet?.displaySetInstanceUID === rtDisplaySet.displaySetInstanceUID) {
+        if (evt.rtDisplaySet.displaySetInstanceUID === rtDisplaySet.displaySetInstanceUID) {
           setRtIsLoading(false);
         }
 

extensions/cornerstone-dicom-seg/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone-dicom-seg",
-  "version": "3.13.0-beta.12",
+  "version": "3.11.1",
   "description": "DICOM SEG read workflow",
   "author": "OHIF",
   "license": "MIT",
@@ -33,21 +33,22 @@
     "start": "yarn run dev"
   },
   "peerDependencies": {
-    "@ohif/core": "3.13.0-beta.12",
-    "@ohif/extension-cornerstone": "3.13.0-beta.12",
-    "@ohif/extension-default": "3.13.0-beta.12",
-    "@ohif/i18n": "3.13.0-beta.12",
+    "@ohif/core": "3.11.1",
+    "@ohif/extension-cornerstone": "3.11.1",
+    "@ohif/extension-default": "3.11.1",
+    "@ohif/i18n": "3.11.1",
     "prop-types": "15.8.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-i18next": "12.3.1",
-    "react-router": "6.30.3",
-    "react-router-dom": "6.30.3"
+    "react-router": "6.30.1",
+    "react-router-dom": "6.30.1"
   },
   "dependencies": {
     "@babel/runtime": "7.28.2",
-    "@cornerstonejs/adapters": "4.15.29",
-    "@cornerstonejs/core": "4.15.29",
-    "@kitware/vtk.js": "34.15.1"
+    "@cornerstonejs/adapters": "4.5.13",
+    "@cornerstonejs/core": "4.5.13",
+    "@kitware/vtk.js": "32.12.0",
+    "react-color": "2.19.3"
   }
 }

extensions/cornerstone-dicom-seg/src/commandsModule.ts

@@ -1,13 +1,15 @@
 import dcmjs from 'dcmjs';
-import { classes, Types, utils } from '@ohif/core';
+import { classes, Types } from '@ohif/core';
 import { cache, metaData } from '@cornerstonejs/core';
 import { segmentation as cornerstoneToolsSegmentation } from '@cornerstonejs/tools';
 import { adaptersRT, helpers, adaptersSEG } from '@cornerstonejs/adapters';
-import { createReportDialogPrompt, useUIStateStore } from '@ohif/extension-default';
+import { createReportDialogPrompt } from '@ohif/extension-default';
 import { DicomMetadataStore } from '@ohif/core';
 
 import PROMPT_RESPONSES from '../../default/src/utils/_shared/PROMPT_RESPONSES';
 
+const { datasetToBlob } = dcmjs.data;
+
 const getTargetViewport = ({ viewportId, viewportGridService }) => {
   const { viewports, activeViewportId } = viewportGridService.getState();
   const targetViewportId = viewportId || activeViewportId;
@@ -25,7 +27,7 @@ const {
 
 const {
   Cornerstone3D: {
-    RTSS: { generateRTSSFromRepresentation },
+    RTSS: { generateRTSSFromSegmentations },
   },
 } = adaptersRT;
 
@@ -35,7 +37,7 @@ const commandsModule = ({
   servicesManager,
   extensionManager,
 }: Types.Extensions.ExtensionParams): Types.Extensions.CommandsModule => {
-  const { segmentationService, displaySetService, viewportGridService } =
+  const { segmentationService, displaySetService, viewportGridService, toolGroupService } =
     servicesManager.services as AppTypes.Services;
 
   const actions = {
@@ -90,7 +92,6 @@ const commandsModule = ({
      */
     generateSegmentation: ({ segmentationId, options = {} }) => {
       const segmentation = cornerstoneToolsSegmentation.state.getSegmentation(segmentationId);
-      const predecessorImageId = options.predecessorImageId ?? segmentation.predecessorImageId;
 
       const { imageIds } = segmentation.representationData.Labelmap;
 
@@ -172,10 +173,12 @@ const commandsModule = ({
         labelmap3D.metadata[segmentIndex] = segmentMetadata;
       });
 
-      const generatedSegmentation = generateSegmentation(referencedImages, labelmap3D, metaData, {
-        predecessorImageId,
-        ...options,
-      });
+      const generatedSegmentation = generateSegmentation(
+        referencedImages,
+        labelmap3D,
+        metaData,
+        options
+      );
 
       return generatedSegmentation;
     },
@@ -209,28 +212,24 @@ const commandsModule = ({
      * @returns {Object|void} Returns the naturalized report if successfully stored,
      * otherwise throws an error.
      */
-    storeSegmentation: async ({ segmentationId, dataSource, modality = 'SEG' }) => {
+    storeSegmentation: async ({ segmentationId, dataSource }) => {
       const segmentation = segmentationService.getSegmentation(segmentationId);
 
       if (!segmentation) {
         throw new Error('No segmentation found');
       }
 
-      const { label, predecessorImageId } = segmentation;
+      const { label } = segmentation;
       const defaultDataSource = dataSource ?? extensionManager.getActiveDataSource()[0];
 
       const {
         value: reportName,
         dataSourceName: selectedDataSource,
-        series,
-        priorSeriesNumber,
         action,
       } = await createReportDialogPrompt({
         servicesManager,
         extensionManager,
-        predecessorImageId,
         title: 'Store Segmentation',
-        modality,
       });
 
       if (action === PROMPT_RESPONSES.CREATE_REPORT) {
@@ -239,18 +238,12 @@ const commandsModule = ({
             ? extensionManager.getDataSources(selectedDataSource)[0]
             : defaultDataSource;
 
-          const args = {
+          const generatedData = actions.generateSegmentation({
             segmentationId,
             options: {
-              SeriesDescription: series ? undefined : reportName || label || 'Contour Series',
-              SeriesNumber: series ? undefined : 1 + priorSeriesNumber,
-              predecessorImageId: series,
+              SeriesDescription: reportName || label || 'Research Derived Series',
             },
-          };
-          const generatedDataAsync =
-            (modality === 'SEG' && actions.generateSegmentation(args)) ||
-            (modality === 'RTSTRUCT' && actions.generateContour(args));
-          const generatedData = await generatedDataAsync;
+          });
 
           if (!generatedData || !generatedData.dataset) {
             throw new Error('Error during segmentation generation');
@@ -277,9 +270,14 @@ const commandsModule = ({
         }
       }
     },
-
-    generateContour: async args => {
-      const { segmentationId, options } = args;
+    /**
+     * Converts segmentations into RTSS for download.
+     * This sample function retrieves all segentations and passes to
+     * cornerstone tool adapter to convert to DICOM RTSS format. It then
+     * converts dataset to downloadable blob.
+     *
+     */
+    downloadRTSS: async ({ segmentationId }) => {
       const segmentations = segmentationService.getSegmentation(segmentationId);
 
       // inject colors to the segmentIndex
@@ -289,54 +287,45 @@ const commandsModule = ({
         segment.color = segmentationService.getSegmentColor(
           firstRepresentation.viewportId,
           segmentationId,
-          Number(segmentIndex)
+          segmentIndex
         );
       });
-      const predecessorImageId = options?.predecessorImageId ?? segmentations.predecessorImageId;
-      const dataset = await generateRTSSFromRepresentation(segmentations, {
-        predecessorImageId,
-        ...options,
-      });
-      return { dataset };
-    },
 
-    /**
-     * Downloads an RTSS instance from a segmentation or contour
-     * representation.
-     */
-    downloadRTSS: async args => {
-      const { dataset } = await actions.generateContour(args);
-      const { InstanceNumber: instanceNumber = 1, SeriesInstanceUID: seriesUID } = dataset;
+      const RTSS = await generateRTSSFromSegmentations(
+        segmentations,
+        classes.MetadataProvider,
+        DicomMetadataStore
+      );
 
       try {
+        const reportBlob = datasetToBlob(RTSS);
+
         //Create a URL for the binary.
-        const filename = `rtss-${seriesUID}-${instanceNumber}.dcm`;
-        downloadDICOMData(dataset, filename);
+        const objectUrl = URL.createObjectURL(reportBlob);
+        window.location.assign(objectUrl);
       } catch (e) {
         console.warn(e);
       }
     },
-
-    toggleActiveSegmentationUtility: ({ itemId: buttonId }) => {
-      const { uiState, setUIState } = useUIStateStore.getState();
-      const isButtonActive = uiState['activeSegmentationUtility'] === buttonId;
-      console.log('toggleActiveSegmentationUtility', isButtonActive, buttonId);
-      // if the button is active, clear the active segmentation utility
-      if (isButtonActive) {
-        setUIState('activeSegmentationUtility', null);
-      } else {
-        setUIState('activeSegmentationUtility', buttonId);
-      }
-    },
   };
 
   const definitions = {
-    loadSegmentationsForViewport: actions.loadSegmentationsForViewport,
-    generateSegmentation: actions.generateSegmentation,
-    downloadSegmentation: actions.downloadSegmentation,
-    storeSegmentation: actions.storeSegmentation,
-    downloadRTSS: actions.downloadRTSS,
-    toggleActiveSegmentationUtility: actions.toggleActiveSegmentationUtility,
+    loadSegmentationsForViewport: {
+      commandFn: actions.loadSegmentationsForViewport,
+    },
+
+    generateSegmentation: {
+      commandFn: actions.generateSegmentation,
+    },
+    downloadSegmentation: {
+      commandFn: actions.downloadSegmentation,
+    },
+    storeSegmentation: {
+      commandFn: actions.storeSegmentation,
+    },
+    downloadRTSS: {
+      commandFn: actions.downloadRTSS,
+    },
   };
 
   return {

extensions/cornerstone-dicom-seg/src/components/LogicalContourOperationsOptions.tsx

@@ -1,246 +0,0 @@
-import React, { useCallback, useEffect, useState } from 'react';
-import { useRunCommand, useSystem } from '@ohif/core';
-import { useActiveViewportSegmentationRepresentations } from '@ohif/extension-cornerstone';
-import {
-  Button,
-  cn,
-  Input,
-  Label,
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-  Separator,
-  Switch,
-  Tabs,
-  TabsList,
-  TabsTrigger,
-} from '@ohif/ui-next';
-import { Icons } from '@ohif/ui-next';
-import { contourSegmentation } from '@cornerstonejs/tools/utilities';
-import { useTranslation } from 'react-i18next';
-import { Segment } from '@cornerstonejs/tools/types';
-
-const { LogicalOperation } = contourSegmentation;
-const options = [
-  {
-    value: 'merge',
-    logicalOperation: LogicalOperation.Union,
-    label: 'Merge',
-    icon: 'actions-combine-merge',
-    helperIcon: 'helper-combine-merge',
-  },
-  {
-    value: 'intersect',
-    logicalOperation: LogicalOperation.Intersect,
-    label: 'Intersect',
-    icon: 'actions-combine-intersect',
-    helperIcon: 'helper-combine-intersect',
-  },
-  {
-    value: 'subtract',
-    logicalOperation: LogicalOperation.Subtract,
-    label: 'Subtract',
-    icon: 'actions-combine-subtract',
-    helperIcon: 'helper-combine-subtract',
-  },
-];
-
-// Shared component for segment selection
-function SegmentSelector({
-  label,
-  value,
-  onValueChange,
-  segments,
-  placeholder = 'Select a segment',
-}: {
-  label: string;
-  value: string;
-  onValueChange: (value: string) => void;
-  segments: Segment[];
-  placeholder?: string;
-}) {
-  const { t } = useTranslation('SegmentationPanel');
-  return (
-    <div className="flex justify-between gap-6">
-      <div>{label}</div>
-      <Select
-        key={`select-segment-${label}`}
-        onValueChange={onValueChange}
-        value={value}
-      >
-        <SelectTrigger className="overflow-hidden">
-          <SelectValue placeholder={t(placeholder)} />
-        </SelectTrigger>
-        <SelectContent>
-          {segments.map(segment => (
-            <SelectItem
-              key={segment.segmentIndex}
-              value={segment.segmentIndex.toString()}
-            >
-              {segment.label}
-            </SelectItem>
-          ))}
-        </SelectContent>
-      </Select>
-    </div>
-  );
-}
-
-function LogicalContourOperationOptions() {
-  const { servicesManager } = useSystem();
-  const { segmentationService } = servicesManager.services;
-  const { t } = useTranslation('SegmentationPanel');
-  const { segmentationsWithRepresentations } = useActiveViewportSegmentationRepresentations();
-
-  const activeRepresentation = segmentationsWithRepresentations?.find(
-    ({ representation }) => representation?.active
-  );
-
-  const segments = activeRepresentation
-    ? Object.values(activeRepresentation.segmentation.segments)
-    : [];
-
-  // Calculate the next available segment index
-  const nextSegmentIndex = activeRepresentation
-    ? segmentationService.getNextAvailableSegmentIndex(
-        activeRepresentation.segmentation.segmentationId
-      )
-    : 1;
-
-  const activeSegment = segments.find(segment => segment.active);
-
-  const activeSegmentIndex = activeSegment?.segmentIndex || 0;
-
-  const [operation, setOperation] = useState(options[0]);
-  const [segmentA, setSegmentA] = useState<string>(activeSegmentIndex?.toString() || '');
-  const [segmentB, setSegmentB] = useState<string>('');
-  const [createNewSegment, setCreateNewSegment] = useState<boolean>(false);
-  const [newSegmentName, setNewSegmentName] = useState<string>('');
-
-  useEffect(() => {
-    setSegmentA(activeSegmentIndex?.toString() || null);
-  }, [activeSegmentIndex]);
-
-  useEffect(() => {
-    setNewSegmentName(`Segment ${nextSegmentIndex}`);
-  }, [nextSegmentIndex]);
-
-  const runCommand = useRunCommand();
-
-  const applyLogicalContourOperation = useCallback(() => {
-    let resultSegmentIndex = segmentA;
-    if (createNewSegment) {
-      resultSegmentIndex = nextSegmentIndex.toString();
-      runCommand('addSegment', {
-        segmentationId: activeRepresentation.segmentation.segmentationId,
-        config: {
-          label: newSegmentName,
-          segmentIndex: nextSegmentIndex,
-        },
-      });
-    }
-    runCommand('applyLogicalContourOperation', {
-      segmentAInfo: {
-        segmentationId: activeRepresentation.segmentation.segmentationId,
-        segmentIndex: parseInt(segmentA),
-      },
-      segmentBInfo: {
-        segmentationId: activeRepresentation.segmentation.segmentationId,
-        segmentIndex: parseInt(segmentB),
-      },
-      resultSegmentInfo: {
-        segmentationId: activeRepresentation.segmentation.segmentationId,
-        segmentIndex: parseInt(resultSegmentIndex),
-      },
-      logicalOperation: operation.logicalOperation,
-    });
-  }, [
-    activeRepresentation?.segmentation?.segmentationId,
-    createNewSegment,
-    newSegmentName,
-    nextSegmentIndex,
-    operation.logicalOperation,
-    runCommand,
-    segmentA,
-    segmentB,
-  ]);
-
-  return (
-    <div className="flex w-[245px] flex-col gap-4">
-      <div className="flex items-start justify-between">
-        <div className="flex w-auto flex-col items-center gap-2 text-base font-normal leading-none">
-          <Tabs value={operation.value}>
-            <TabsList className="inline-flex space-x-1">
-              {options.map(option => {
-                const { value, icon } = option;
-                return (
-                  <TabsTrigger
-                    value={value}
-                    key={`logical-contour-operation-${value}`}
-                    onClick={() => setOperation(option)}
-                  >
-                    <Icons.ByName name={icon}></Icons.ByName>
-                  </TabsTrigger>
-                );
-              })}
-            </TabsList>
-          </Tabs>
-          <div>{t(operation.label)}</div>
-        </div>
-        <div className="bg-muted flex h-[62px] w-[88px] items-center justify-center rounded-lg">
-          <Icons.ByName name={operation.helperIcon}></Icons.ByName>
-        </div>
-      </div>
-      <SegmentSelector
-        label="A"
-        value={segmentA}
-        onValueChange={setSegmentA}
-        segments={segments}
-      />
-      <SegmentSelector
-        label="B"
-        value={segmentB}
-        onValueChange={setSegmentB}
-        segments={segments}
-      />
-      <div className="flex justify-end pl-[34px]">
-        <Button
-          className="border-primary/60 grow border"
-          variant="ghost"
-          onClick={() => {
-            applyLogicalContourOperation();
-          }}
-        >
-          {t(operation.label)}
-        </Button>
-      </div>
-      <Separator className="bg-input mt-2 h-[1px]" />
-      <div className="flex flex-col gap-2">
-        <div className="flex items-center justify-start gap-2">
-          <Switch
-            id="logical-contour-operations-create-new-segment-switch"
-            onCheckedChange={setCreateNewSegment}
-          ></Switch>
-          <Label htmlFor="logical-contour-operations-create-new-segment-switch">
-            {t('Create a new segment')}
-          </Label>
-        </div>
-        <div className="pl-9">
-          <Input
-            className={cn(createNewSegment ? 'visible' : 'hidden')}
-            disabled={!createNewSegment}
-            id="logical-contour-operations-create-new-segment-input"
-            type="text"
-            placeholder={t('New segment name')}
-            value={newSegmentName}
-            onChange={e => setNewSegmentName(e.target.value)}
-          />
-        </div>
-      </div>
-    </div>
-  );
-}
-
-export default LogicalContourOperationOptions;

extensions/cornerstone-dicom-seg/src/components/SimplifyContourOptions.tsx

@@ -1,73 +0,0 @@
-import React, { useState } from 'react';
-import { Button, Input, Label, Separator } from '@ohif/ui-next';
-import { useRunCommand } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
-
-function SimplifyContourOptions() {
-  const [areaThreshold, setAreaThreshold] = useState(10);
-
-  const runCommand = useRunCommand();
-  const { t } = useTranslation('SegmentationPanel');
-
-  return (
-    <div className="flex w-auto w-[252px] flex-col gap-[8px] text-base font-normal leading-none">
-      <div className="flex w-auto flex-col gap-[10px] text-base font-normal leading-none">
-        <div>{t('Fill contour holes')}</div>
-        <Button
-          className="border-primary/60 border"
-          variant="ghost"
-          onClick={() => {
-            runCommand('removeContourHoles');
-          }}
-        >
-          {t('Fill Holes')}
-        </Button>
-        <Separator className="bg-input mt-[20px] h-[1px]" />
-      </div>
-      <div className="flex w-auto flex-col gap-[10px] text-base font-normal leading-none">
-        <div>{t('Remove Small Contours')}</div>
-        <div className="flex items-center gap-2 self-end">
-          <Label
-            htmlFor="simplify-contour-options"
-            className="text-muted-foreground"
-          >
-            {t('Area Threshold')}
-          </Label>
-          <Input
-            id="simplify-contour-options"
-            className="w-20"
-            type="number"
-            value={areaThreshold}
-            onChange={e => setAreaThreshold(Number(e.target.value))}
-          />
-        </div>
-        <Button
-          className="border-primary/60 border"
-          variant="ghost"
-          onClick={() => {
-            runCommand('removeSmallContours', {
-              areaThreshold,
-            });
-          }}
-        >
-          {t('Remove Small Contours')}
-        </Button>
-        <Separator className="bg-input mt-[20px] h-[1px]" />
-      </div>
-      <div className="flex w-auto flex-col gap-[10px] text-base font-normal leading-none">
-        <div>{t('Create New Segment from Holes')}</div>
-        <Button
-          className="border-primary/60 border"
-          variant="ghost"
-          onClick={() => {
-            runCommand('convertContourHoles');
-          }}
-        >
-          {t('Create New Segment')}
-        </Button>
-      </div>
-    </div>
-  );
-}
-
-export default SimplifyContourOptions;

extensions/cornerstone-dicom-seg/src/components/SmoothContoursOptions.tsx

@@ -1,41 +0,0 @@
-import React from 'react';
-import { Button, Separator } from '@ohif/ui-next';
-import { useRunCommand } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
-
-function SmoothContoursOptions() {
-  const runCommand = useRunCommand();
-  const { t } = useTranslation('SegmentationPanel');
-
-  return (
-    <div className="flex w-auto w-[245px] flex-col gap-[8px] text-base font-normal leading-none">
-      <div className="flex w-auto flex-col gap-[10px] text-base font-normal leading-none">
-        <div>{t('Smooth all edges')}</div>
-        <Button
-          className="border-primary/60 border"
-          variant="ghost"
-          onClick={() => {
-            runCommand('smoothContours');
-          }}
-        >
-          {t('Smooth Edges')}
-        </Button>
-        <Separator className="bg-input mt-[20px] h-[1px]" />
-      </div>
-      <div className="flex w-auto flex-col gap-[10px] text-base font-normal leading-none">
-        <div>{t('Remove extra points')}</div>
-        <Button
-          className="border-primary/60 border"
-          variant="ghost"
-          onClick={() => {
-            runCommand('decimateContours');
-          }}
-        >
-          {t('Remove Points')}
-        </Button>
-      </div>
-    </div>
-  );
-}
-
-export default SmoothContoursOptions;

extensions/cornerstone-dicom-seg/src/getSopClassHandlerModule.ts

@@ -16,24 +16,19 @@ function _getDisplaySetsFromSeries(
   servicesManager: AppTypes.ServicesManager,
   extensionManager
 ) {
-  utils.sortStudyInstances(instances);
-
-  // Choose the LAST instance in the list as the most recently created one.
-  const instance = instances[instances.length - 1];
+  const instance = instances[0];
 
   const {
     StudyInstanceUID,
     SeriesInstanceUID,
     SOPInstanceUID,
-    SeriesDescription = '',
+    SeriesDescription,
     SeriesNumber,
     SeriesDate,
-    StructureSetDate,
     SOPClassUID,
     wadoRoot,
     wadoUri,
     wadoUriRoot,
-    imageId: predecessorImageId,
   } = instance;
 
   const displaySet = {
@@ -43,7 +38,7 @@ function _getDisplaySetsFromSeries(
     displaySetInstanceUID: utils.guid(),
     SeriesDescription,
     SeriesNumber,
-    SeriesDate: SeriesDate || StructureSetDate || '',
+    SeriesDate,
     SOPInstanceUID,
     SeriesInstanceUID,
     StudyInstanceUID,
@@ -58,7 +53,6 @@ function _getDisplaySetsFromSeries(
     segments: {},
     sopClassUids,
     instance,
-    predecessorImageId,
     instances: [instance],
     wadoRoot,
     wadoUriRoot,
@@ -79,16 +73,10 @@ function _getDisplaySetsFromSeries(
   displaySet.referencedImages = instance.ReferencedSeriesSequence.ReferencedInstanceSequence;
   displaySet.referencedSeriesInstanceUID = referencedSeries.SeriesInstanceUID;
   const { displaySetService } = servicesManager.services;
-  const referencedDisplaySets = displaySetService.getDisplaySetsForReferences(
-    instance.ReferencedSeriesSequence
+  const referencedDisplaySets = displaySetService.getDisplaySetsForSeries(
+    displaySet.referencedSeriesInstanceUID
   );
 
-  if (referencedDisplaySets?.length > 1) {
-    console.warn(
-      'Segmentation does not currently handle references to multiple series, defaulting to first series'
-    );
-  }
-
   const referencedDisplaySet = referencedDisplaySets[0];
 
   if (!referencedDisplaySet) {

extensions/cornerstone-dicom-seg/src/getToolbarModule.ts

@@ -1,35 +1,6 @@
-import { utilities as cstUtils } from '@cornerstonejs/tools';
-import i18n from '@ohif/i18n';
-import { useUIStateStore } from '@ohif/extension-default';
-
-import LogicalContourOperationsOptions from './components/LogicalContourOperationsOptions';
-import SimplifyContourOptions from './components/SimplifyContourOptions';
-import SmoothContoursOptions from './components/SmoothContoursOptions';
-
 export function getToolbarModule({ servicesManager }: withAppTypes) {
   const { segmentationService, toolbarService, toolGroupService } = servicesManager.services;
   return [
-    {
-      name: 'cornerstone.SimplifyContourOptions',
-      defaultComponent: SimplifyContourOptions,
-    },
-    {
-      name: 'cornerstone.LogicalContourOperationsOptions',
-      defaultComponent: LogicalContourOperationsOptions,
-    },
-    {
-      name: 'cornerstone.SmoothContoursOptions',
-      defaultComponent: SmoothContoursOptions,
-    },
-    {
-      name: 'cornerstone.isActiveSegmentationUtility',
-      evaluate: ({ button }) => {
-        const { uiState } = useUIStateStore.getState();
-        return {
-          isActive: uiState[`activeSegmentationUtility`] === button.id,
-        };
-      },
-    },
     {
       name: 'evaluate.cornerstone.hasSegmentation',
       evaluate: ({ viewportId }) => {
@@ -39,30 +10,6 @@ export function getToolbarModule({ servicesManager }: withAppTypes) {
         };
       },
     },
-    {
-      name: 'evaluate.cornerstone.hasSegmentationOfType',
-      evaluate: ({ viewportId, segmentationRepresentationType }) => {
-        const segmentations = segmentationService.getSegmentationRepresentations(viewportId);
-
-        if (!segmentations?.length) {
-          return {
-            disabled: true,
-            disabledText: i18n.t('SegmentationPanel:No segmentations available'),
-          };
-        }
-
-        if (
-          !segmentations.some(segmentation =>
-            Boolean(segmentation.type === segmentationRepresentationType)
-          )
-        ) {
-          return {
-            disabled: true,
-            disabledText: `No ${segmentationRepresentationType} segmentations available`,
-          };
-        }
-      },
-    },
     {
       name: 'evaluate.cornerstone.segmentation',
       evaluate: ({ viewportId, button, toolNames, disabledText }) => {
@@ -74,7 +21,7 @@ export function getToolbarModule({ servicesManager }: withAppTypes) {
         if (!segmentations?.length) {
           return {
             disabled: true,
-            disabledText: disabledText ?? i18n.t('SegmentationPanel:No segmentations available'),
+            disabledText: disabledText ?? 'No segmentations available',
           };
         }
 
@@ -82,7 +29,7 @@ export function getToolbarModule({ servicesManager }: withAppTypes) {
         if (!Object.keys(activeSegmentation.segments).length) {
           return {
             disabled: true,
-            disabledText: i18n.t('SegmentationPanel:Add segment to enable this tool'),
+            disabledText: 'Add segment to enable this tool',
           };
         }
 
@@ -91,7 +38,7 @@ export function getToolbarModule({ servicesManager }: withAppTypes) {
         if (!toolGroup) {
           return {
             disabled: true,
-            disabledText: disabledText ?? i18n.t('SegmentationPanel:Not available on the current viewport'),
+            disabledText: disabledText ?? 'Not available on the current viewport',
           };
         }
 
@@ -107,7 +54,7 @@ export function getToolbarModule({ servicesManager }: withAppTypes) {
         if (!toolGroup.hasTool(toolName) && !toolNames) {
           return {
             disabled: true,
-            disabledText: disabledText ?? i18n.t('SegmentationPanel:Not available on the current viewport'),
+            disabledText: disabledText ?? 'Not available on the current viewport',
           };
         }
 
@@ -121,23 +68,5 @@ export function getToolbarModule({ servicesManager }: withAppTypes) {
         };
       },
     },
-    {
-      name: 'evaluate.cornerstone.segmentation.synchronizeDrawingRadius',
-      evaluate: ({ button, radiusOptionId }) => {
-        const toolGroupIds = toolGroupService.getToolGroupIds();
-        if (!toolGroupIds?.length) {
-          return;
-        }
-
-        for (const toolGroupId of toolGroupIds) {
-          const brushSize = cstUtils.segmentation.getBrushSizeForToolGroup(toolGroupId);
-
-          if (brushSize) {
-            const option = toolbarService.getOptionById(button, radiusOptionId);
-            option.value = brushSize;
-          }
-        }
-      },
-    },
   ];
 }

extensions/cornerstone-dicom-seg/src/viewports/OHIFCornerstoneSEGViewport.tsx

@@ -60,26 +60,15 @@ function OHIFCornerstoneSEGViewport(props: withAppTypes) {
   // In such cases, we attempt to handle this scenario gracefully by
   // invoking a custom handler. Ideally, if a user tries to launch a series that isn't viewable,
   // (eg.: we can prompt them with an explanation and provide a link to the full study).
-
-  // Additional guard: If no customization handler is registered for missing
-  // referenced display sets, skip SEG rendering to avoid a viewport crash.
   if (!referencedDisplaySetInstanceUID) {
     const missingReferenceDisplaySetHandler = customizationService.getCustomization(
       'missingReferenceDisplaySetHandler'
     );
-    if (typeof missingReferenceDisplaySetHandler === 'function') {
-      const { handled } = missingReferenceDisplaySetHandler();
-      if (handled) {
-        return;
-      }
-    } else {
-      console.log(
-        "No customization 'missingReferenceDisplaySetHandler' registered. Skipping SEG rendering."
-      );
+    const { handled } = missingReferenceDisplaySetHandler();
+    if (handled) {
       return;
     }
   }
-
   const referencedDisplaySet = displaySetService.getDisplaySetByUID(
     referencedDisplaySetInstanceUID
   );
@@ -145,7 +134,7 @@ function OHIFCornerstoneSEGViewport(props: withAppTypes) {
     const { unsubscribe } = segmentationService.subscribe(
       segmentationService.EVENTS.SEGMENTATION_LOADING_COMPLETE,
       evt => {
-        if (evt.segDisplaySet?.displaySetInstanceUID === segDisplaySet?.displaySetInstanceUID) {
+        if (evt.segDisplaySet.displaySetInstanceUID === segDisplaySet.displaySetInstanceUID) {
           setSegIsLoading(false);
         }
 

extensions/cornerstone-dicom-sr/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone-dicom-sr",
-  "version": "3.13.0-beta.12",
+  "version": "3.11.1",
   "description": "OHIF extension for an SR Cornerstone Viewport",
   "author": "OHIF",
   "license": "MIT",
@@ -34,11 +34,11 @@
     "test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
   },
   "peerDependencies": {
-    "@ohif/core": "3.13.0-beta.12",
-    "@ohif/extension-cornerstone": "3.13.0-beta.12",
-    "@ohif/extension-measurement-tracking": "3.13.0-beta.12",
-    "@ohif/ui": "3.13.0-beta.12",
-    "dcmjs": "0.49.4",
+    "@ohif/core": "3.11.1",
+    "@ohif/extension-cornerstone": "3.11.1",
+    "@ohif/extension-measurement-tracking": "3.11.1",
+    "@ohif/ui": "3.11.1",
+    "dcmjs": "0.43.1",
     "dicom-parser": "1.8.21",
     "hammerjs": "2.0.8",
     "prop-types": "15.8.1",
@@ -46,9 +46,9 @@
   },
   "dependencies": {
     "@babel/runtime": "7.28.2",
-    "@cornerstonejs/adapters": "4.15.29",
-    "@cornerstonejs/core": "4.15.29",
-    "@cornerstonejs/tools": "4.15.29",
+    "@cornerstonejs/adapters": "4.5.13",
+    "@cornerstonejs/core": "4.5.13",
+    "@cornerstonejs/tools": "4.5.13",
     "classnames": "2.5.1"
   }
 }

extensions/cornerstone-dicom-sr/src/commandsModule.ts

@@ -1,14 +1,12 @@
-import { metaData } from '@cornerstonejs/core';
+import { metaData, utilities } from '@cornerstonejs/core';
 
-import OHIF, { DicomMetadataStore, utils } from '@ohif/core';
+import OHIF, { DicomMetadataStore } from '@ohif/core';
 import dcmjs from 'dcmjs';
 import { adaptersSR } from '@cornerstonejs/adapters';
 
 import getFilteredCornerstoneToolState from './utils/getFilteredCornerstoneToolState';
 import hydrateStructuredReport from './utils/hydrateStructuredReport';
 
-const { downloadBlob } = utils;
-
 const { MeasurementReport } = adaptersSR.Cornerstone3D;
 const { log } = OHIF;
 
@@ -44,6 +42,8 @@ const _generateReport = (measurementData, additionalFindingTypes, options: Optio
     dataset.SpecificCharacterSet = 'ISO_IR 192';
   }
 
+  dataset.InstanceNumber = options.InstanceNumber ?? 1;
+
   return dataset;
 };
 
@@ -85,7 +85,8 @@ const commandsModule = (props: withAppTypes) => {
       const reportBlob = dcmjs.data.datasetToBlob(srDataset);
 
       //Create a URL for the binary.
-      downloadBlob(reportBlob, { filename: 'dicom-sr.dcm' });
+      const objectUrl = URL.createObjectURL(reportBlob);
+      window.location.assign(objectUrl);
     },
 
     /**

extensions/cornerstone-dicom-sr/src/components/OHIFCornerstoneSRMeasurementViewport.tsx

@@ -86,7 +86,7 @@ function OHIFCornerstoneSRMeasurementViewport(props) {
         const { presentationIds } = viewportOptions;
         const measurement = srDisplaySet.measurements[newMeasurementSelected];
         setPositionPresentation(presentationIds.positionPresentationId, {
-          viewReference: measurement.viewReference || {
+          viewReference: {
             referencedImageId: measurement.imageId,
           },
         });

extensions/cornerstone-dicom-sr/src/components/OHIFCornerstoneSRTextViewport.tsx

@@ -9,7 +9,7 @@ function OHIFCornerstoneSRTextViewport(props: withAppTypes) {
   const instance = displaySet.instances[0];
 
   return (
-    <div className="text-foreground relative flex h-full w-full flex-col overflow-auto p-4">
+    <div className="relative flex h-full w-full flex-col overflow-auto p-4 text-white">
       <div>
         {/* The root level is always a container */}
         <OHIFCornerstoneSRContainer container={instance} />

extensions/cornerstone-dicom-sr/src/getSopClassHandlerModule.ts

@@ -22,7 +22,7 @@ const {
   CodeScheme: Cornerstone3DCodeScheme,
 } = adaptersSR.Cornerstone3D;
 
-type InstanceMetadata = OhifTypes.InstanceMetadata;
+type InstanceMetadata = Types.InstanceMetadata;
 
 /**
  * TODO
@@ -35,7 +35,6 @@ const sopClassUids = [
   sopClassDictionary.BasicTextSR,
   sopClassDictionary.EnhancedSR,
   sopClassDictionary.ComprehensiveSR,
-  sopClassDictionary.Comprehensive3DSR,
 ];
 
 const validateSameStudyUID = (uid: string, instances): void => {
@@ -54,7 +53,7 @@ const validateSameStudyUID = (uid: string, instances): void => {
  * @param instances is a list of instances from THIS series that are not
  *     in this DICOM SR Display Set already.
  */
-function addInstances(instances: InstanceMetadata[], _displaySetService: DisplaySetService) {
+function addInstances(instances: InstanceMetadata[], displaySetService: DisplaySetService) {
   this.instances.push(...instances);
   utils.sortStudyInstances(this.instances);
   // The last instance is the newest one, so is the one most interesting.
@@ -69,10 +68,9 @@ function addInstances(instances: InstanceMetadata[], _displaySetService: Display
  * DICOM SR SOP Class Handler
  * For all referenced images in the TID 1500/300 sections, add an image to the
  * display.
- * @param {InstanceMetadata[]} instances - A set of instances all from the same series
- * @param {AppTypes.ServicesManager} servicesManager - The services that can be used for creating
- * @param {AppTypes.ExtensionManager} extensionManager - The extension manager
- * @returns {Types.DisplaySet[]} The list of display sets created for the given instances object
+ * @param instances is a set of instances all from the same series
+ * @param servicesManager is the services that can be used for creating
+ * @returns The list of display sets created for the given instances object
  */
 function _getDisplaySetsFromSeries(
   instances,
@@ -100,7 +98,6 @@ function _getDisplaySetsFromSeries(
     SeriesTime,
     ConceptNameCodeSequence,
     SOPClassUID,
-    imageId: predecessorImageId,
   } = instance;
   validateSameStudyUID(instance.StudyInstanceUID, instances);
 
@@ -129,7 +126,6 @@ function _getDisplaySetsFromSeries(
     isImagingMeasurementReport,
     sopClassUids,
     instance,
-    predecessorImageId,
     addInstances,
     label: SeriesDescription || `${i18n.t('Series')} ${SeriesNumber} - ${i18n.t('SR')}`,
   };
@@ -146,7 +142,7 @@ function _getDisplaySetsFromSeries(
  * @param extensionManager - The extension manager containing data sources.
  */
 async function _load(
-  srDisplaySet: OhifTypes.DisplaySet,
+  srDisplaySet: Types.DisplaySet,
   servicesManager: AppTypes.ServicesManager,
   extensionManager: AppTypes.ExtensionManager
 ) {
@@ -186,10 +182,6 @@ async function _load(
     srDisplaySet.referencedImages = [];
     srDisplaySet.measurements = [];
   }
-  const { predecessorImageId } = srDisplaySet;
-  for (const measurement of srDisplaySet.measurements) {
-    measurement.predecessorImageId = predecessorImageId;
-  }
 
   const mappings = measurementService.getSourceMappings(
     CORNERSTONE_3D_TOOLS_SOURCE_NAME,
@@ -234,9 +226,17 @@ function _measurementBelongsToDisplaySet({ measurement, displaySet }) {
   );
 }
 
+/**
+ * Checks if measurements can be added to a display set.
+ *
+ * @param srDisplaySet - The source display set containing measurements.
+ * @param newDisplaySet - The new display set to check if measurements can be added.
+ * @param dataSource - The data source used to retrieve image IDs.
+ * @param servicesManager - The services manager.
+ */
 function _checkIfCanAddMeasurementsToDisplaySet(
-  srDisplaySet: OhifTypes.DisplaySet,
-  newDisplaySet: OhifTypes.DisplaySet,
+  srDisplaySet,
+  newDisplaySet,
   dataSource,
   servicesManager: AppTypes.ServicesManager
 ) {
@@ -288,7 +288,7 @@ function _checkIfCanAddMeasurementsToDisplaySet(
       is3DMeasurement &&
       _measurementBelongsToDisplaySet({ measurement, displaySet: newDisplaySet })
     ) {
-      addSRAnnotation({ measurement, displaySet: newDisplaySet });
+      addSRAnnotation(measurement, null, null);
       measurement.loaded = true;
       measurement.displaySetInstanceUID = newDisplaySet.displaySetInstanceUID;
       unloadedMeasurements.splice(j, 1);
@@ -309,12 +309,15 @@ function _checkIfCanAddMeasurementsToDisplaySet(
       imageId &&
       _measurementReferencesSOPInstanceUID(measurement, ReferencedSOPInstanceUID, frame)
     ) {
-      addSRAnnotation({ measurement, imageId, frameNumber: frame, displaySet: newDisplaySet });
+      addSRAnnotation(measurement, imageId, frame);
+
+      // Update measurement properties
       measurement.loaded = true;
       measurement.imageId = imageId;
       measurement.displaySetInstanceUID = newDisplaySet.displaySetInstanceUID;
       measurement.ReferencedSOPInstanceUID = ReferencedSOPInstanceUID;
       measurement.frameNumber = frame;
+
       unloadedMeasurements.splice(j, 1);
     }
   }
@@ -322,10 +325,10 @@ function _checkIfCanAddMeasurementsToDisplaySet(
 
 /**
  * Checks if a measurement references a specific SOP Instance UID.
- * @param {any} measurement - The measurement object.
- * @param {string} sopInstanceUID - The SOP Instance UID to check against.
- * @param {number} frameNumber - The frame number to check against (optional).
- * @returns {boolean} True if the measurement references the specified SOP Instance UID, false otherwise.
+ * @param measurement - The measurement object.
+ * @param SOPInstanceUID - The SOP Instance UID to check against.
+ * @param frameNumber - The frame number to check against (optional).
+ * @returns True if the measurement references the specified SOP Instance UID, false otherwise.
  */
 function _measurementReferencesSOPInstanceUID(measurement, SOPInstanceUID, frameNumber) {
   const { coords } = measurement;
@@ -357,8 +360,10 @@ function _measurementReferencesSOPInstanceUID(measurement, SOPInstanceUID, frame
 /**
  * Retrieves the SOP class handler module.
  *
- * @param {OhifTypes.Extensions.ExtensionParams} params - The extension parameters.
- * @returns {Array} An array containing the SOP class handler modules.
+ * @param {Object} options - The options for retrieving the SOP class handler module.
+ * @param {Object} options.servicesManager - The services manager.
+ * @param {Object} options.extensionManager - The extension manager.
+ * @returns {Array} An array containing the SOP class handler module.
  */
 function getSopClassHandlerModule(params: OhifTypes.Extensions.ExtensionParams) {
   const { servicesManager, extensionManager } = params;
@@ -382,8 +387,8 @@ function getSopClassHandlerModule(params: OhifTypes.Extensions.ExtensionParams)
 /**
  * Retrieves the measurements from the ImagingMeasurementReportContentSequence.
  *
- * @param {any[]} imagingMeasurementReportContentSequence - The ImagingMeasurementReportContentSequence array.
- * @returns {any[]} The array of measurements.
+ * @param {Array} ImagingMeasurementReportContentSequence - The ImagingMeasurementReportContentSequence array.
+ * @returns {Array} - The array of measurements.
  */
 function _getMeasurements(ImagingMeasurementReportContentSequence) {
   const ImagingMeasurements = ImagingMeasurementReportContentSequence.find(
@@ -421,8 +426,8 @@ function _getMeasurements(ImagingMeasurementReportContentSequence) {
 /**
  * Retrieves merged content sequences by tracking unique identifiers.
  *
- * @param {any[]} measurementGroups - The measurement groups.
- * @returns {Object} The merged content sequences by tracking unique identifiers.
+ * @param {Array} MeasurementGroups - The measurement groups.
+ * @returns {Object} - The merged content sequences by tracking unique identifiers.
  */
 function _getMergedContentSequencesByTrackingUniqueIdentifiers(MeasurementGroups) {
   const mergedContentSequencesByTrackingUniqueIdentifiers = {};
@@ -469,8 +474,8 @@ function _getMergedContentSequencesByTrackingUniqueIdentifiers(MeasurementGroups
  * it calls the _processTID1410Measurement function.
  * Otherwise, it calls the _processNonGeometricallyDefinedMeasurement function.
  *
- * @param {any[]} mergedContentSequence - The merged content sequence to process.
- * @returns {any} The processed measurement result.
+ * @param {Array<Object>} mergedContentSequence - The merged content sequence to process.
+ * @returns {any} - The processed measurement result.
  */
 function _processMeasurement(mergedContentSequence) {
   if (mergedContentSequence.some(group => isScoordOr3d(group) && !isTextPosition(group))) {
@@ -485,8 +490,8 @@ function _processMeasurement(mergedContentSequence) {
  * TID 1410 style measurements have a SCOORD or SCOORD3D at the top level,
  * and non-geometric representations where each NUM has "INFERRED FROM" SCOORD/SCOORD3D.
  *
- * @param {any[]} mergedContentSequence - The merged content sequence containing the measurements.
- * @returns {any} The measurement object containing the loaded status, labels, coordinates, tracking unique identifier, and tracking identifier.
+ * @param mergedContentSequence - The merged content sequence containing the measurements.
+ * @returns The measurement object containing the loaded status, labels, coordinates, tracking unique identifier, and tracking identifier.
  */
 function _processTID1410Measurement(mergedContentSequence) {
   // Need to deal with TID 1410 style measurements, which will have a SCOORD or SCOORD3D at the top level,
@@ -559,8 +564,8 @@ function _processTID1410Measurement(mergedContentSequence) {
 /**
  * Processes the non-geometrically defined measurement from the merged content sequence.
  *
- * @param {any[]} mergedContentSequence The merged content sequence containing the measurement data.
- * @returns {any} The processed measurement object.
+ * @param mergedContentSequence The merged content sequence containing the measurement data.
+ * @returns The processed measurement object.
  */
 function _processNonGeometricallyDefinedMeasurement(mergedContentSequence) {
   const NUMContentItems = mergedContentSequence.filter(group => group.ValueType === 'NUM');
@@ -637,20 +642,15 @@ function _processNonGeometricallyDefinedMeasurement(mergedContentSequence) {
   NUMContentItems.forEach(item => {
     const { ConceptNameCodeSequence, ContentSequence, MeasuredValueSequence } = item;
 
-    // Handle spatial reference ONLY if ContentSequence exists
-    if (ContentSequence) {
-      const { ValueType } = ContentSequence;
+    const { ValueType } = ContentSequence;
+    if (!ValueType === 'SCOORD') {
+      console.warn(`Graphic ${ValueType} not currently supported, skipping annotation.`);
+      return;
+    }
 
-      if (ValueType !== 'SCOORD' && ValueType !== 'SCOORD3D') {
-        console.warn(`Graphic ${ValueType} not currently supported, skipping annotation.`);
-        return;
-      }
-
-      const coords = _getCoordsFromSCOORDOrSCOORD3D(ContentSequence);
-
-      if (coords) {
-        measurement.coords.push(coords);
-      }
+    const coords = _getCoordsFromSCOORDOrSCOORD3D(ContentSequence);
+    if (coords) {
+      measurement.coords.push(coords);
     }
 
     if (MeasuredValueSequence) {
@@ -665,8 +665,8 @@ function _processNonGeometricallyDefinedMeasurement(mergedContentSequence) {
 
 /**
  * Extracts coordinates from a graphic item of type SCOORD or SCOORD3D.
- * @param {any} graphicItem - The graphic item containing the coordinates.
- * @returns {any} The extracted coordinates.
+ * @param {object} graphicItem - The graphic item containing the coordinates.
+ * @returns {object} - The extracted coordinates.
  */
 const _getCoordsFromSCOORDOrSCOORD3D = graphicItem => {
   const { ValueType, GraphicType, GraphicData } = graphicItem;
@@ -680,9 +680,9 @@ const _getCoordsFromSCOORDOrSCOORD3D = graphicItem => {
 
 /**
  * Retrieves the label and value from the provided ConceptNameCodeSequence and MeasuredValueSequence.
- * @param {any} conceptNameCodeSequence - The ConceptNameCodeSequence object.
- * @param {any} measuredValueSequence - The MeasuredValueSequence object.
- * @returns {Object} An object containing the label and value.
+ * @param {Object} ConceptNameCodeSequence - The ConceptNameCodeSequence object.
+ * @param {Object} MeasuredValueSequence - The MeasuredValueSequence object.
+ * @returns {Object} - An object containing the label and value.
  *                    The label represents the CodeMeaning from the ConceptNameCodeSequence.
  *                    The value represents the formatted NumericValue and CodeValue from the MeasuredValueSequence.
  *                    Example: { label: 'Long Axis', value: '31.00 mm' }
@@ -701,8 +701,8 @@ function _getLabelFromMeasuredValueSequence(ConceptNameCodeSequence, MeasuredVal
 /**
  * Retrieves a list of referenced images from the Imaging Measurement Report Content Sequence.
  *
- * @param {any[]} imagingMeasurementReportContentSequence - The Imaging Measurement Report Content Sequence.
- * @returns {any[]} The list of referenced images.
+ * @param {Array} ImagingMeasurementReportContentSequence - The Imaging Measurement Report Content Sequence.
+ * @returns {Array} - The list of referenced images.
  */
 function _getReferencedImagesList(ImagingMeasurementReportContentSequence) {
   const ImageLibrary = ImagingMeasurementReportContentSequence.find(
@@ -749,7 +749,7 @@ function _getReferencedImagesList(ImagingMeasurementReportContentSequence) {
  * Otherwise, the sequence is wrapped in an array and returned.
  *
  * @param {any} sequence - The DICOM sequence to convert.
- * @returns {any[]} The converted array.
+ * @returns {any[]} - The converted array.
  */
 function _getSequenceAsArray(sequence) {
   if (!sequence) {

extensions/cornerstone-dicom-sr/src/init.ts

@@ -9,13 +9,18 @@ import {
   LengthTool,
   PlanarFreehandROITool,
   RectangleROITool,
+  utilities as csToolsUtils,
 } from '@cornerstonejs/tools';
-import { Types } from '@ohif/core';
-
+import { Types, MeasurementService } from '@ohif/core';
+import { Enums as CSExtensionEnums } from '@ohif/extension-cornerstone';
 import DICOMSRDisplayTool from './tools/DICOMSRDisplayTool';
+import SCOORD3DPointTool from './tools/SCOORD3DPointTool';
+import SRSCOOR3DProbeMapper from './utils/SRSCOOR3DProbeMapper';
 import addToolInstance from './utils/addToolInstance';
 import toolNames from './tools/toolNames';
 
+const { CORNERSTONE_3D_TOOLS_SOURCE_NAME, CORNERSTONE_3D_TOOLS_SOURCE_VERSION } = CSExtensionEnums;
+
 /**
  * @param {object} configuration
  */
@@ -23,6 +28,8 @@ export default function init({
   configuration = {},
   servicesManager,
 }: Types.Extensions.ExtensionParams): void {
+  const { measurementService, cornerstoneViewportService } = servicesManager.services;
+
   addToolInstance(toolNames.DICOMSRDisplay, DICOMSRDisplayTool);
   addToolInstance(toolNames.SRLength, LengthTool);
   addToolInstance(toolNames.SRBidirectional, BidirectionalTool);
@@ -32,10 +39,26 @@ export default function init({
   addToolInstance(toolNames.SRAngle, AngleTool);
   addToolInstance(toolNames.SRPlanarFreehandROI, PlanarFreehandROITool);
   addToolInstance(toolNames.SRRectangleROI, RectangleROITool);
+  addToolInstance(toolNames.SRSCOORD3DPoint, SCOORD3DPointTool);
 
   // TODO - fix the SR display of Cobb Angle, as it joins the two lines
   addToolInstance(toolNames.SRCobbAngle, CobbAngleTool);
 
+  const csTools3DVer1MeasurementSource = measurementService.getSource(
+    CORNERSTONE_3D_TOOLS_SOURCE_NAME,
+    CORNERSTONE_3D_TOOLS_SOURCE_VERSION
+  );
+
+  const { POINT } = measurementService.VALUE_TYPES;
+
+  measurementService.addMapping(
+    csTools3DVer1MeasurementSource,
+    'SRSCOORD3DPoint',
+    POINT,
+    SRSCOOR3DProbeMapper.toAnnotation,
+    SRSCOOR3DProbeMapper.toMeasurement.bind(null, { servicesManager })
+  );
+
   // Modify annotation tools to use dashed lines on SR
   const dashedLine = {
     lineDash: '4,4',

extensions/cornerstone-dicom-sr/src/tools/SCOORD3DPointTool.ts

@@ -0,0 +1,203 @@
+import { type Types } from '@cornerstonejs/core';
+import {
+  annotation,
+  drawing,
+  utilities,
+  Types as cs3DToolsTypes,
+  AnnotationDisplayTool,
+} from '@cornerstonejs/tools';
+import toolNames from './toolNames';
+import { Annotation } from '@cornerstonejs/tools/dist/types/types';
+
+export default class SCOORD3DPointTool extends AnnotationDisplayTool {
+  static toolName = toolNames.SRSCOORD3DPoint;
+
+  constructor(
+    toolProps = {},
+    defaultToolProps = {
+      configuration: {},
+    }
+  ) {
+    super(toolProps, defaultToolProps);
+  }
+
+  _getTextBoxLinesFromLabels(labels) {
+    // TODO -> max 5 for now (label + shortAxis + longAxis), need a generic solution for this!
+
+    const labelLength = Math.min(labels.length, 5);
+    const lines = [];
+
+    return lines;
+  }
+
+  // This tool should not inherit from AnnotationTool and we should not need
+  // to add the following lines.
+  isPointNearTool = () => null;
+  getHandleNearImagePoint = () => null;
+
+  renderAnnotation = (enabledElement: Types.IEnabledElement, svgDrawingHelper: any): void => {
+    const { viewport } = enabledElement;
+    const { element } = viewport;
+
+    const annotations = annotation.state.getAnnotations(this.getToolName(), element);
+
+    // Todo: We don't need this anymore, filtering happens in triggerAnnotationRender
+    if (!annotations?.length) {
+      return;
+    }
+
+    // Filter toolData to only render the data for the active SR.
+    const filteredAnnotations = annotations;
+    if (!viewport._actors?.size) {
+      return;
+    }
+
+    const styleSpecifier: cs3DToolsTypes.AnnotationStyle.StyleSpecifier = {
+      toolGroupId: this.toolGroupId,
+      toolName: this.getToolName(),
+      viewportId: enabledElement.viewport.id,
+    };
+
+    for (let i = 0; i < filteredAnnotations.length; i++) {
+      const annotation = filteredAnnotations[i];
+
+      const annotationUID = annotation.annotationUID;
+      const { renderableData } = annotation.data;
+      const { POINT: points } = renderableData;
+
+      styleSpecifier.annotationUID = annotationUID;
+
+      const lineWidth = this.getStyle('lineWidth', styleSpecifier, annotation);
+      const lineDash = this.getStyle('lineDash', styleSpecifier, annotation);
+      const color = this.getStyle('color', styleSpecifier, annotation);
+
+      const options = {
+        color,
+        lineDash,
+        lineWidth,
+      };
+
+      const point = points[0][0];
+
+      // check if viewport can render it
+      const viewable = viewport.isReferenceViewable(
+        { FrameOfReferenceUID: annotation.metadata.FrameOfReferenceUID, cameraFocalPoint: point },
+        { asNearbyProjection: true }
+      );
+
+      if (!viewable) {
+        continue;
+      }
+
+      // render the point
+      const arrowPointCanvas = viewport.worldToCanvas(point);
+      // Todo: configure this
+      const arrowEndCanvas = [arrowPointCanvas[0] + 20, arrowPointCanvas[1] + 20];
+      const canvasCoordinates = [arrowPointCanvas, arrowEndCanvas];
+
+      drawing.drawArrow(
+        svgDrawingHelper,
+        annotationUID,
+        '1',
+        canvasCoordinates[1],
+        canvasCoordinates[0],
+        {
+          color: options.color,
+          width: options.lineWidth,
+        }
+      );
+
+      this.renderTextBox(
+        svgDrawingHelper,
+        viewport,
+        canvasCoordinates,
+        annotation,
+        styleSpecifier,
+        options
+      );
+    }
+  };
+
+  renderTextBox(
+    svgDrawingHelper,
+    viewport,
+    canvasCoordinates,
+    annotation,
+    styleSpecifier,
+    options = {}
+  ) {
+    if (!canvasCoordinates || !annotation) {
+      return;
+    }
+
+    const { annotationUID, data = {} } = annotation;
+    const { labels } = data;
+
+    const textLines = [];
+
+    for (const label of labels) {
+      // make this generic
+      // fix this
+      if (label.label === '363698007') {
+        textLines.push(`Finding Site: ${label.value}`);
+      }
+    }
+
+    const { color } = options;
+
+    const adaptedCanvasCoordinates = canvasCoordinates;
+    // adapt coordinates if there is an adapter
+    const canvasTextBoxCoords = utilities.drawing.getTextBoxCoordsCanvas(adaptedCanvasCoordinates);
+
+    if (!annotation.data?.handles?.textBox?.worldPosition) {
+      annotation.data.handles.textBox.worldPosition = viewport.canvasToWorld(canvasTextBoxCoords);
+    }
+
+    const textBoxPosition = viewport.worldToCanvas(annotation.data.handles.textBox.worldPosition);
+
+    const textBoxUID = '1';
+    const textBoxOptions = this.getLinkedTextBoxStyle(styleSpecifier, annotation);
+
+    const boundingBox = drawing.drawLinkedTextBox(
+      svgDrawingHelper,
+      annotationUID,
+      textBoxUID,
+      textLines,
+      textBoxPosition,
+      canvasCoordinates,
+      {},
+      {
+        ...textBoxOptions,
+        color,
+      }
+    );
+
+    const { x: left, y: top, width, height } = boundingBox;
+
+    annotation.data.handles.textBox.worldBoundingBox = {
+      topLeft: viewport.canvasToWorld([left, top]),
+      topRight: viewport.canvasToWorld([left + width, top]),
+      bottomLeft: viewport.canvasToWorld([left, top + height]),
+      bottomRight: viewport.canvasToWorld([left + width, top + height]),
+    };
+  }
+
+  public getLinkedTextBoxStyle(
+    specifications: cs3DToolsTypes.AnnotationStyle.StyleSpecifier,
+    annotation?: Annotation
+  ): Record<string, unknown> {
+    // Todo: this function can be used to set different styles for different toolMode
+    // for the textBox.
+
+    return {
+      visibility: this.getStyle('textBoxVisibility', specifications, annotation),
+      fontFamily: this.getStyle('textBoxFontFamily', specifications, annotation),
+      fontSize: this.getStyle('textBoxFontSize', specifications, annotation),
+      color: this.getStyle('textBoxColor', specifications, annotation),
+      shadow: this.getStyle('textBoxShadow', specifications, annotation),
+      background: this.getStyle('textBoxBackground', specifications, annotation),
+      lineWidth: this.getStyle('textBoxLinkLineWidth', specifications, annotation),
+      lineDash: this.getStyle('textBoxLinkLineDash', specifications, annotation),
+    };
+  }
+}

extensions/cornerstone-dicom-sr/src/tools/toolNames.ts

@@ -9,6 +9,7 @@ const toolNames = {
   SRCobbAngle: 'SRCobbAngle',
   SRRectangleROI: 'SRRectangleROI',
   SRPlanarFreehandROI: 'SRPlanarFreehandROI',
+  SRSCOORD3DPoint: 'SRSCOORD3DPoint',
 };
 
 export default toolNames;

extensions/cornerstone-dicom-sr/src/utils/SRSCOOR3DProbeMapper.ts

@@ -0,0 +1,71 @@
+const SRSCOOR3DProbe = {
+  toAnnotation: measurement => {},
+
+  /**
+   * Maps cornerstone annotation event data to measurement service format.
+   *
+   * @param {Object} cornerstone Cornerstone event data
+   * @return {Measurement} Measurement instance
+   */
+  toMeasurement: ({ servicesManager, getValueTypeFromToolType }, csToolsEventDetail) => {
+    const { displaySetService } = servicesManager.services;
+    const { annotation } = csToolsEventDetail;
+    const { metadata, data, annotationUID } = annotation;
+
+    if (!metadata || !data) {
+      console.warn('Probe tool: Missing metadata or data');
+      return null;
+    }
+
+    const { toolName, FrameOfReferenceUID } = metadata;
+    const { points } = data.handles;
+
+    const displaySets = displaySetService
+      .getActiveDisplaySets()
+      .filter(ds => ds.FrameOfReferenceUID === FrameOfReferenceUID);
+    const displaySet = displaySets.filter(ds => ds.isReconstructable)[0] || displaySets[0];
+
+    const { StudyInstanceUID: referenceStudyUID, SeriesInstanceUID: referenceSeriesUID } =
+      displaySets[0] || {};
+
+    const displayText = getDisplayText(annotation);
+    return {
+      uid: annotationUID,
+      points,
+      metadata,
+      referenceStudyUID,
+      referenceSeriesUID,
+      displaySetInstanceUID: displaySet?.displaySetInstanceUID,
+      toolName: metadata.toolName,
+      label: data.label,
+      displayText: displayText,
+      data: data.cachedStats,
+      type: getValueTypeFromToolType?.(toolName) ?? null,
+    };
+  },
+};
+
+function getDisplayText(annotation) {
+  const { data } = annotation;
+
+  if (!data) {
+    return [''];
+  }
+  const { labels } = data;
+
+  const displayText = [];
+
+  for (const label of labels) {
+    // make this generic
+    if (label.label === '33636980076') {
+      displayText.push(`Finding Site: ${label.value}`);
+    }
+  }
+
+  return {
+    primary: displayText,
+    secondary: [],
+  };
+}
+
+export default SRSCOOR3DProbe;

extensions/cornerstone-dicom-sr/src/utils/addSRAnnotation.ts

@@ -7,53 +7,8 @@ import toolNames from '../tools/toolNames';
 
 const { MeasurementReport } = adaptersSR.Cornerstone3D;
 
-/**
- * Adds a DICOM SR (Structured Report) annotation to the annotation manager.
- * This function processes measurement data from DICOM SR and converts it into
- * a format suitable for display in the Cornerstone3D viewer.
- *
- * @param {Object} params - The parameters object
- * @param {Object} params.measurement - The DICOM SR measurement data containing coordinates, labels, and metadata
- * @param {Array} params.measurement.coords - Array of coordinate objects with GraphicType, ValueType, and other properties
- * @param {string} params.measurement.TrackingUniqueIdentifier - Unique identifier for the measurement
- * @param {string} params.measurement.TrackingIdentifier - Tracking identifier for adapter lookup
- * @param {Array} [params.measurement.labels] - Optional array of label objects
- * @param {string} [params.measurement.displayText] - Optional display text for the annotation
- * @param {Object} [params.measurement.textBox] - Optional text box configuration
- * @param {string|null} [params.imageId] - Optional image ID for the referenced image (defaults to null)
- * @param {number|null} [params.frameNumber] - Optional frame number for multi-frame images (defaults to null)
- * @param {Object} params.displaySet - The display set containing the image
- * @param {string} params.displaySet.displaySetInstanceUID - Unique identifier for the display set
- * @returns {void}
- *
- * @example
- * ```typescript
- * addSRAnnotation({
- *   measurement: {
- *     TrackingUniqueIdentifier: '1.2.3.4.5',
- *     TrackingIdentifier: 'POINT',
- *     coords: [{
- *       GraphicType: 'POINT',
- *       ValueType: 'SCOORD',
- *       // ... other coordinate properties
- *     }],
- *     labels: [{ value: 'Measurement Point' }],
- *     displayText: 'Point measurement'
- *   },
- *   imageId: 'wadouri:file://path/to/image.dcm', // Optional
- *   frameNumber: 0, // Optional
- *   displaySet: { displaySetInstanceUID: '1.2.3.4' }
- * });
- * ```
- */
-export default function addSRAnnotation({ measurement, imageId = null, frameNumber = null, displaySet }) {
-  /** @type {string} The tool name to use for the annotation, defaults to DICOMSRDisplay */
+export default function addSRAnnotation(measurement, imageId, frameNumber) {
   let toolName = toolNames.DICOMSRDisplay;
-  
-  /** 
-   * @type {Object} Renderable data organized by graphic type
-   * Groups coordinate data by GraphicType for efficient rendering
-   */
   const renderableData = measurement.coords.reduce((acc, coordProps) => {
     acc[coordProps.GraphicType] = acc[coordProps.GraphicType] || [];
     acc[coordProps.GraphicType].push(getRenderableData({ ...coordProps, imageId }));
@@ -64,58 +19,37 @@ export default function addSRAnnotation({ measurement, imageId = null, frameNumb
   const { ValueType: valueType, GraphicType: graphicType } = measurement.coords[0];
   const graphicTypePoints = renderableData[graphicType];
 
-  /**
-   * TODO: Read the tool name from the DICOM SR identification type in the future.
-   */
+  /** TODO: Read the tool name from the DICOM SR identification type in the future. */
   let frameOfReferenceUID = null;
-  let planeRestriction = null;
 
-  /**
-   * Store the view reference for use in initial navigation
-   */
   if (imageId) {
     const imagePlaneModule = metaData.get('imagePlaneModule', imageId);
     frameOfReferenceUID = imagePlaneModule?.frameOfReferenceUID;
   }
 
-  /**
-   * Store the view reference for use in initial navigation
-   */
   if (valueType === 'SCOORD3D') {
+    const adapter = MeasurementReport.getAdapterForTrackingIdentifier(
+      measurement.TrackingIdentifier
+    );
+    if (!adapter) {
+      toolName = toolNames.SRSCOORD3DPoint;
+    }
+
+    // get the ReferencedFrameOfReferenceUID from the measurement
     frameOfReferenceUID = measurement.coords[0].ReferencedFrameOfReferenceSequence;
-    planeRestriction = {
-      FrameOfReferenceUID: frameOfReferenceUID,
-      point: graphicTypePoints[0][0],
-    };
   }
 
-  /**
-   * Store the view reference for use in initial navigation
-   */
-  measurement.viewReference = {
-    planeRestriction,
-    FrameOfReferenceUID: frameOfReferenceUID,
-    referencedImageId: imageId,
-  };
-
-  /**
-   * @type {Types.Annotation} The annotation object to be added to the annotation manager
-   * Contains all necessary metadata and data for rendering the DICOM SR measurement
-   */
   const SRAnnotation: Types.Annotation = {
     annotationUID: TrackingUniqueIdentifier,
     highlighted: false,
     isLocked: false,
-    isPreview: toolName === toolNames.DICOMSRDisplay,
     invalidated: false,
     metadata: {
       toolName,
-      planeRestriction,
       valueType,
       graphicType,
       FrameOfReferenceUID: frameOfReferenceUID,
       referencedImageId: imageId,
-      displaySetInstanceUID: displaySet.displaySetInstanceUID,
     },
     data: {
       label: measurement.labels?.[0]?.value || undefined,
@@ -133,11 +67,8 @@ export default function addSRAnnotation({ measurement, imageId = null, frameNumb
   };
 
   /**
-   * Add the annotation to the annotation state manager.
-   * Note: Using annotation.state.addAnnotation() instead of annotationManager.addAnnotation()
-   * because the latter was not triggering annotation_added events properly.
-   * 
-   * @param {Types.Annotation} SRAnnotation - The annotation to add
+   * const annotationManager = annotation.annotationState.getAnnotationManager();
+   * was not triggering annotation_added events.
    */
   annotation.state.addAnnotation(SRAnnotation);
 }

extensions/cornerstone-dicom-sr/src/utils/hydrateStructuredReport.ts

@@ -54,11 +54,6 @@ export default function hydrateStructuredReport(
   const disableEditing = customizationService.getCustomization('panelMeasurement.disableEditing');
 
   const displaySet = displaySetService.getDisplaySetByUID(displaySetInstanceUID);
-  const {
-    StudyInstanceUID: studyUID,
-    SeriesInstanceUID: seriesUID,
-    instance: { SOPInstanceUID: sopUID },
-  } = displaySet;
 
   // TODO -> We should define a strict versioning somewhere.
   const mappings = measurementService.getSourceMappings(
@@ -72,16 +67,24 @@ export default function hydrateStructuredReport(
     );
   }
 
-  const instance = DicomMetadataStore.getInstance(studyUID, seriesUID, sopUID);
+  const instance = DicomMetadataStore.getInstance(
+    displaySet.StudyInstanceUID,
+    displaySet.SeriesInstanceUID,
+    displaySet.SOPInstanceUID
+  );
 
   const sopInstanceUIDToImageId = {};
+  const imageIdsForToolState = {};
 
   displaySet.measurements.forEach(measurement => {
-    const { ReferencedSOPInstanceUID, imageId, frameNumber = 1 } = measurement;
-    const key = `${ReferencedSOPInstanceUID}:${frameNumber}`;
+    const { ReferencedSOPInstanceUID, imageId, frameNumber } = measurement;
 
-    if (!sopInstanceUIDToImageId[key]) {
-      sopInstanceUIDToImageId[key] = imageId;
+    if (!sopInstanceUIDToImageId[ReferencedSOPInstanceUID]) {
+      sopInstanceUIDToImageId[ReferencedSOPInstanceUID] = imageId;
+      imageIdsForToolState[ReferencedSOPInstanceUID] = [];
+    }
+    if (!imageIdsForToolState[ReferencedSOPInstanceUID][frameNumber]) {
+      imageIdsForToolState[ReferencedSOPInstanceUID][frameNumber] = imageId;
     }
   });
 
@@ -130,8 +133,10 @@ export default function hydrateStructuredReport(
       // dcmjs and Cornerstone3D has structural defect in supporting multi-frame
       // files, and looking up the imageId from sopInstanceUIDToImageId results
       // in the wrong value.
-      const frameNumber = toolData.annotation.data?.frameNumber || 1;
-      const imageId = sopInstanceUIDToImageId[`${toolData.sopInstanceUid}:${frameNumber}`];
+      const frameNumber = (toolData.annotation.data && toolData.annotation.data.frameNumber) || 1;
+      const imageId =
+        imageIdsForToolState[toolData.sopInstanceUid][frameNumber] ||
+        sopInstanceUIDToImageId[toolData.sopInstanceUid];
 
       if (!imageIds.includes(imageId)) {
         imageIds.push(imageId);
@@ -170,7 +175,9 @@ export default function hydrateStructuredReport(
     // files, and looking up the imageId from sopInstanceUIDToImageId results
     // in the wrong value.
     const frameNumber = (toolData.annotation.data && toolData.annotation.data.frameNumber) || 1;
-    const imageId = sopInstanceUIDToImageId[`${toolData.sopInstanceUid}:${frameNumber}`];
+    const imageId =
+      imageIdsForToolState[toolData.sopInstanceUid][frameNumber] ||
+      sopInstanceUIDToImageId[toolData.sopInstanceUid];
 
     if (!imageId) {
       return getReferenceData3D(toolData, servicesManager);
@@ -201,7 +208,6 @@ export default function hydrateStructuredReport(
       const annotation = {
         annotationUID: toolData.annotation.annotationUID,
         data: toolData.annotation.data,
-        predecessorImageId: toolData.predecessorImageId,
         metadata: {
           ...referenceData,
           toolName: annotationType,

extensions/cornerstone-dynamic-volume/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone-dynamic-volume",
-  "version": "3.13.0-beta.12",
+  "version": "3.11.1",
   "description": "OHIF extension for 4D volumes data",
   "author": "OHIF",
   "license": "MIT",
@@ -29,12 +29,12 @@
     "test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
   },
   "peerDependencies": {
-    "@ohif/core": "3.13.0-beta.12",
-    "@ohif/extension-cornerstone": "3.13.0-beta.12",
-    "@ohif/extension-default": "3.13.0-beta.12",
-    "@ohif/i18n": "3.13.0-beta.12",
-    "@ohif/ui": "3.13.0-beta.12",
-    "dcmjs": "0.49.4",
+    "@ohif/core": "3.11.1",
+    "@ohif/extension-cornerstone": "3.11.1",
+    "@ohif/extension-default": "3.11.1",
+    "@ohif/i18n": "3.11.1",
+    "@ohif/ui": "3.11.1",
+    "dcmjs": "0.43.1",
     "dicom-parser": "1.8.21",
     "hammerjs": "2.0.8",
     "prop-types": "15.8.1",
@@ -42,8 +42,8 @@
   },
   "dependencies": {
     "@babel/runtime": "7.28.2",
-    "@cornerstonejs/core": "4.15.29",
-    "@cornerstonejs/tools": "4.15.29",
+    "@cornerstonejs/core": "4.5.13",
+    "@cornerstonejs/tools": "4.5.13",
     "classnames": "2.5.1"
   }
 }

extensions/cornerstone-dynamic-volume/src/commandsModule.ts

@@ -1,10 +1,8 @@
+import * as importedActions from './actions';
 import { utilities, Enums } from '@cornerstonejs/tools';
 import { cache } from '@cornerstonejs/core';
-import { utils } from '@ohif/core';
 
-import * as importedActions from './actions';
-
-const { downloadCsv } = utils;
+const LABELMAP = Enums.SegmentationRepresentations.Labelmap;
 
 const commandsModule = ({ commandsManager, servicesManager }: withAppTypes) => {
   const services = servicesManager.services;
@@ -39,7 +37,7 @@ const commandsModule = ({ commandsManager, servicesManager }: withAppTypes) => {
       });
       return computedDisplaySets;
     },
-    exportTimeReportCSV: ({ segmentations, summaryStats }) => {
+    exportTimeReportCSV: ({ segmentations, config, options, summaryStats }) => {
       const dynamic4DDisplaySet = actions.getDynamic4DDisplaySet();
 
       const volumeId = dynamic4DDisplaySet?.displaySetInstanceUID;
@@ -205,7 +203,15 @@ const commandsModule = ({ commandsManager, servicesManager }: withAppTypes) => {
 
       // Generate filename and trigger download
       const filename = `${instance.PatientID}.csv`;
-      downloadCsv(csvContent, { filename });
+      const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
+      const link = document.createElement('a');
+      const url = URL.createObjectURL(blob);
+      link.setAttribute('href', url);
+      link.setAttribute('download', filename);
+      link.style.visibility = 'hidden';
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
     },
     swapDynamicWithComputedDisplaySet: ({ displaySet }) => {
       const computedDisplaySet = displaySet;

extensions/cornerstone-dynamic-volume/src/getPanelModule.tsx

@@ -22,7 +22,7 @@ function getPanelModule({ commandsManager, extensionManager, servicesManager, co
       <>
         <Toolbox
           buttonSectionId={toolbarService.sections.dynamicToolbox}
-          title="Buttons:Threshold Tools"
+          title="Threshold Tools"
         />
         <PanelSegmentation
           servicesManager={servicesManager}

extensions/cornerstone-dynamic-volume/src/panels/DynamicDataPanel.tsx

@@ -5,7 +5,7 @@ function DynamicDataPanel({ servicesManager, commandsManager, tab }: withAppType
   return (
     <>
       <div
-        className="text-foreground flex flex-col"
+        className="flex flex-col text-white"
         data-cy={'dynamic-volume-panel'}
       >
         <PanelGenerateImage

extensions/cornerstone-dynamic-volume/src/panels/WorkflowPanel.tsx

@@ -10,7 +10,7 @@ function WorkflowPanel({ servicesManager }: { servicesManager: ServicesManager }
   return (
     <div
       data-cy={'workflow-panel'}
-      className="bg-popover mb-1 px-3 py-4"
+      className="bg-secondary-dark mb-1 px-3 py-4"
     >
       <div className="mb-1">Workflow</div>
       <div>

extensions/cornerstone/jest.config.js

@@ -1,13 +1,9 @@
 const base = require('../../jest.config.base.js');
+const pkg = require('./package');
 
 module.exports = {
   ...base,
-  moduleNameMapper: {
-    ...base.moduleNameMapper,
-    '@ohif/(.*)': '<rootDir>/../../platform/$1/src',
-    '^@cornerstonejs/([^/]+)/(.*)$': '<rootDir>/../../node_modules/@cornerstonejs/$1/dist/esm/$2',
-    '^@cornerstonejs/([^/]+)$': '<rootDir>/../../node_modules/@cornerstonejs/$1/dist/esm',
-  },
+  displayName: pkg.name,
   // rootDir: "../.."
   // testMatch: [
   //   //`<rootDir>/platform/${pack.name}/**/*.spec.js`

extensions/cornerstone/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone",
-  "version": "3.13.0-beta.12",
+  "version": "3.11.1",
   "description": "OHIF extension for Cornerstone",
   "author": "OHIF",
   "license": "MIT",
@@ -38,12 +38,12 @@
   "peerDependencies": {
     "@cornerstonejs/codec-charls": "1.2.3",
     "@cornerstonejs/codec-libjpeg-turbo-8bit": "1.2.2",
-    "@cornerstonejs/codec-openjpeg": "1.3.0",
+    "@cornerstonejs/codec-openjpeg": "1.2.4",
     "@cornerstonejs/codec-openjph": "2.4.7",
-    "@cornerstonejs/dicom-image-loader": "4.15.29",
-    "@ohif/core": "3.13.0-beta.12",
-    "@ohif/ui": "3.13.0-beta.12",
-    "dcmjs": "0.49.4",
+    "@cornerstonejs/dicom-image-loader": "4.5.13",
+    "@ohif/core": "3.11.1",
+    "@ohif/ui": "3.11.1",
+    "dcmjs": "0.43.1",
     "dicom-parser": "1.8.21",
     "hammerjs": "2.0.8",
     "prop-types": "15.8.1",
@@ -53,20 +53,19 @@
   },
   "dependencies": {
     "@babel/runtime": "7.28.2",
-    "@cornerstonejs/adapters": "4.15.29",
-    "@cornerstonejs/ai": "4.15.29",
-    "@cornerstonejs/core": "4.15.29",
-    "@cornerstonejs/labelmap-interpolation": "4.15.29",
-    "@cornerstonejs/polymorphic-segmentation": "4.15.29",
-    "@cornerstonejs/tools": "4.15.29",
-    "@icr/polyseg-wasm": "0.4.0",
+    "@cornerstonejs/adapters": "4.5.13",
+    "@cornerstonejs/ai": "4.5.13",
+    "@cornerstonejs/core": "4.5.13",
+    "@cornerstonejs/labelmap-interpolation": "4.5.13",
+    "@cornerstonejs/polymorphic-segmentation": "4.5.13",
+    "@cornerstonejs/tools": "4.5.13",
     "@itk-wasm/morphological-contour-interpolation": "1.1.0",
-    "@kitware/vtk.js": "34.15.1",
+    "@kitware/vtk.js": "32.12.0",
     "html2canvas": "1.4.1",
-    "immutability-helper": "3.1.1",
     "lodash.compact": "3.0.1",
     "lodash.debounce": "4.0.8",
     "lodash.flatten": "4.4.0",
+    "lodash.merge": "4.6.2",
     "lodash.zip": "4.2.0",
     "shader-loader": "1.3.1",
     "worker-loader": "3.0.8"

extensions/cornerstone/src/Viewport/Overlays/CustomizableViewportOverlay.tsx

@@ -4,9 +4,9 @@ import PropTypes from 'prop-types';
 import { metaData, Enums, utilities, eventTarget } from '@cornerstonejs/core';
 import { Enums as csToolsEnums, UltrasoundPleuraBLineTool } from '@cornerstonejs/tools';
 import type { ImageSliceData } from '@cornerstonejs/core/types';
-import { ViewportOverlay, formatDICOMDate } from '@ohif/ui-next';
+import { ViewportOverlay } from '@ohif/ui-next';
 import type { InstanceMetadata } from '@ohif/core/src/types';
-import { formatDICOMTime, formatNumberPrecision } from './utils';
+import { formatDICOMDate, formatDICOMTime, formatNumberPrecision } from './utils';
 import { utils } from '@ohif/core';
 import { StackViewportData, VolumeViewportData } from '../../types/CornerstoneCacheService';
 

extensions/cornerstone/src/Viewport/Overlays/ViewportImageSliceLoadingIndicator.tsx

@@ -51,7 +51,7 @@ function ViewportImageSliceLoadingIndicator({ viewportData, element }) {
       <>
         <div className="absolute top-0 left-0 h-full w-full bg-black opacity-50">
           <div className="transparent flex h-full w-full items-center justify-center">
-            <p className="text-highlight text-xl font-light">
+            <p className="text-primary-light text-xl font-light">
               <h4>Error Loading Image</h4>
               <p>An error has occurred.</p>
               <p>{error}</p>
@@ -68,7 +68,7 @@ function ViewportImageSliceLoadingIndicator({ viewportData, element }) {
       // interacting with the mouse, since scrolling should propagate to the viewport underneath
       <div className="pointer-events-none absolute top-0 left-0 h-full w-full bg-black opacity-50">
         <div className="transparent flex h-full w-full items-center justify-center">
-          <p className="text-highlight text-xl font-light">Loading...</p>
+          <p className="text-primary-light text-xl font-light">Loading...</p>
         </div>
       </div>
     );

extensions/cornerstone/src/Viewport/Overlays/ViewportOrientationMarkers.tsx

@@ -1,6 +1,12 @@
-import React, { useEffect, useState, useMemo } from 'react';
+import React, { useEffect, useState, useMemo, useRef } from 'react';
 import classNames from 'classnames';
-import { metaData, Enums, getEnabledElement } from '@cornerstonejs/core';
+import {
+  metaData,
+  Enums,
+  Types,
+  getEnabledElement,
+  utilities as coreUtilities,
+} from '@cornerstonejs/core';
 import { utilities } from '@cornerstonejs/tools';
 import { vec3 } from 'gl-matrix';
 
@@ -16,36 +22,75 @@ function ViewportOrientationMarkers({
   servicesManager,
   orientationMarkers = ['top', 'left'],
 }: withAppTypes) {
-  const [cameraModifiedTime, setCameraModifiedTime] = useState(0);
+  // Rotation is in degrees
+  const [rotation, setRotation] = useState(0);
+  const [flipHorizontal, setFlipHorizontal] = useState(false);
+  const [flipVertical, setFlipVertical] = useState(false);
   const { isViewportBackgroundLight: isLight } = useViewportRendering(viewportId);
   const { cornerstoneViewportService } = servicesManager.services;
 
+  // Store initial viewUp and viewRight for volume viewports
+  const initialVolumeOrientationRef = useRef<{
+    initialViewUp: number[] | null;
+    initialViewRight: number[] | null;
+  }>({
+    initialViewUp: null,
+    initialViewRight: null,
+  });
+
   useEffect(() => {
-    const cameraModifiedListener = () => setCameraModifiedTime(Date.now());
+    initialVolumeOrientationRef.current.initialViewUp = null;
+    initialVolumeOrientationRef.current.initialViewRight = null;
+
+    if (viewportData?.viewportType !== 'stack' && element && getEnabledElement(element)) {
+      const { viewport } = getEnabledElement(element);
+      const { viewUp, viewPlaneNormal } = viewport.getCamera();
+
+      const viewRight = vec3.create();
+      vec3.cross(viewRight, viewUp, viewPlaneNormal);
+
+      initialVolumeOrientationRef.current.initialViewUp = [...viewUp];
+      initialVolumeOrientationRef.current.initialViewRight = [...viewRight];
+    }
+  }, [element, viewportData]);
+
+  useEffect(() => {
+    const cameraModifiedListener = (evt: Types.EventTypes.CameraModifiedEvent) => {
+      const { previousCamera, camera } = evt.detail;
+
+      const { rotation } = camera;
+      if (rotation !== undefined) {
+        setRotation(rotation);
+      }
+
+      if (
+        camera.flipHorizontal !== undefined &&
+        previousCamera.flipHorizontal !== camera.flipHorizontal
+      ) {
+        setFlipHorizontal(camera.flipHorizontal);
+      }
+
+      if (
+        camera.flipVertical !== undefined &&
+        previousCamera.flipVertical !== camera.flipVertical
+      ) {
+        setFlipVertical(camera.flipVertical);
+      }
+    };
+
     element.addEventListener(Enums.Events.CAMERA_MODIFIED, cameraModifiedListener);
 
     return () => {
       element.removeEventListener(Enums.Events.CAMERA_MODIFIED, cameraModifiedListener);
     };
-  }, [element]);
+  }, []);
 
   const markers = useMemo(() => {
-    if (!viewportData || cameraModifiedTime === 0) {
-      return '';
-    }
-
-    if (!element || !getEnabledElement(element)) {
-      console.log(`ViewportOrientationMarkers :: Viewport element not enabled (${viewportId})`);
-      return '';
-    }
-
-    const ohifViewport = cornerstoneViewportService.getViewportInfo(viewportId);
-
-    if (!ohifViewport) {
-      console.log(`ViewportOrientationMarkers :: No viewport (${viewportId})`);
+    if (!viewportData) {
       return '';
     }
 
+    let rowCosines, columnCosines, isDefaultValueSetForRowCosine, isDefaultValueSetForColumnCosine;
     if (viewportData.viewportType === 'stack') {
       const imageIndex = imageSliceData.imageIndex;
       const imageId = viewportData.data[0].imageIds?.[imageIndex];
@@ -55,25 +100,58 @@ function ViewportOrientationMarkers({
         return false;
       }
 
-      const { isDefaultValueSetForRowCosine, isDefaultValueSetForColumnCosine } =
-        metaData.get('imagePlaneModule', imageId) || {};
+      ({
+        rowCosines,
+        columnCosines,
+        isDefaultValueSetForColumnCosine,
+        isDefaultValueSetForColumnCosine,
+      } = metaData.get('imagePlaneModule', imageId) || {});
+    } else {
+      if (!element || !getEnabledElement(element)) {
+        return '';
+      }
 
-      if (isDefaultValueSetForColumnCosine || isDefaultValueSetForRowCosine) {
+      if (
+        initialVolumeOrientationRef.current.initialViewUp &&
+        initialVolumeOrientationRef.current.initialViewRight
+      ) {
+        // Use initial orientation values for consistency, even as the camera changes
+        columnCosines = [
+          -initialVolumeOrientationRef.current.initialViewUp[0],
+          -initialVolumeOrientationRef.current.initialViewUp[1],
+          -initialVolumeOrientationRef.current.initialViewUp[2],
+        ];
+        rowCosines = initialVolumeOrientationRef.current.initialViewRight;
+      } else {
+        console.warn('ViewportOrientationMarkers::No initial orientation values');
         return '';
       }
     }
 
-    const { viewport } = getEnabledElement(element);
-    const p00 = viewport.canvasToWorld([0, 0]);
-    const p10 = viewport.canvasToWorld([1, 0]);
-    const p01 = viewport.canvasToWorld([0, 1]);
-    const rowCosines = vec3.sub(vec3.create(), p10, p00);
-    const columnCosines = vec3.sub(vec3.create(), p01, p00);
+    if (
+      !rowCosines ||
+      !columnCosines ||
+      rotation === undefined ||
+      isDefaultValueSetForRowCosine ||
+      isDefaultValueSetForColumnCosine
+    ) {
+      return '';
+    }
 
-    vec3.normalize(rowCosines, rowCosines);
-    vec3.normalize(columnCosines, columnCosines);
+    const markers = _getOrientationMarkers(
+      rowCosines,
+      columnCosines,
+      rotation,
+      flipVertical,
+      flipHorizontal
+    );
 
-    const markers = _getOrientationMarkers(rowCosines, columnCosines);
+    const ohifViewport = cornerstoneViewportService.getViewportInfo(viewportId);
+
+    if (!ohifViewport) {
+      console.log('ViewportOrientationMarkers::No viewport');
+      return null;
+    }
 
     return orientationMarkers.map((m, index) => (
       <div
@@ -90,7 +168,16 @@ function ViewportOrientationMarkers({
         <div className="orientation-marker-value">{markers[m]}</div>
       </div>
     ));
-  }, [viewportData, imageSliceData, cameraModifiedTime, orientationMarkers, element, isLight]);
+  }, [
+    viewportData,
+    imageSliceData,
+    rotation,
+    flipVertical,
+    flipHorizontal,
+    orientationMarkers,
+    element,
+    isLight,
+  ]);
 
   return <div className="ViewportOrientationMarkers select-none">{markers}</div>;
 }
@@ -102,13 +189,18 @@ function ViewportOrientationMarkers({
  *
  * @param {*} rowCosines
  * @param {*} columnCosines
+ * @param {*} rotation in degrees
+ * @returns
  */
-function _getOrientationMarkers(rowCosines, columnCosines) {
+function _getOrientationMarkers(rowCosines, columnCosines, rotation, flipVertical, flipHorizontal) {
   const rowString = getOrientationStringLPS(rowCosines);
   const columnString = getOrientationStringLPS(columnCosines);
   const oppositeRowString = invertOrientationStringLPS(rowString);
   const oppositeColumnString = invertOrientationStringLPS(columnString);
 
+  // Round to 4 decimal places (after rotate right 3 times and flip horizontally -> rotation is 90.00000000000001)
+  rotation = Math.round(rotation * 10000) / 10000;
+
   const markers = {
     top: oppositeColumnString,
     left: oppositeRowString,
@@ -116,6 +208,43 @@ function _getOrientationMarkers(rowCosines, columnCosines) {
     bottom: columnString,
   };
 
+  // If any vertical or horizontal flips are applied, change the orientation strings ahead of
+  // the rotation applications
+  if (flipVertical) {
+    markers.top = invertOrientationStringLPS(markers.top);
+    markers.bottom = invertOrientationStringLPS(markers.bottom);
+  }
+
+  if (flipHorizontal) {
+    markers.left = invertOrientationStringLPS(markers.left);
+    markers.right = invertOrientationStringLPS(markers.right);
+  }
+
+  // Swap the labels accordingly if the viewport has been rotated
+  // This could be done in a more complex way for intermediate rotation values (e.g. 45 degrees)
+  if (rotation === 90 || rotation === -270) {
+    return {
+      top: markers.left,
+      left: invertOrientationStringLPS(markers.top),
+      right: invertOrientationStringLPS(markers.bottom),
+      bottom: markers.right, // left
+    };
+  } else if (rotation === -90 || rotation === 270) {
+    return {
+      top: invertOrientationStringLPS(markers.left),
+      left: markers.top,
+      bottom: markers.left,
+      right: markers.bottom,
+    };
+  } else if (rotation === 180 || rotation === -180) {
+    return {
+      top: invertOrientationStringLPS(markers.top),
+      left: invertOrientationStringLPS(markers.left),
+      bottom: invertOrientationStringLPS(markers.bottom),
+      right: invertOrientationStringLPS(markers.right),
+    };
+  }
+
   return markers;
 }
 

extensions/cornerstone/src/Viewport/Overlays/utils.ts

@@ -1,7 +1,5 @@
 import moment from 'moment';
-import i18n from 'i18next';
 import { metaData } from '@cornerstonejs/core';
-import { formatDICOMDate } from '@ohif/ui-next';
 
 /**
  * Checks if value is valid.
@@ -26,6 +24,17 @@ export function formatNumberPrecision(number, precision = 0) {
   }
 }
 
+/**
+ * Formats DICOM date.
+ *
+ * @param {string} date
+ * @param {string} strFormat
+ * @returns {string} formatted date.
+ */
+export function formatDICOMDate(date, strFormat = 'MMM D, YYYY') {
+  return moment(date, 'YYYYMMDD').format(strFormat);
+}
+
 /**
  *    DICOM Time is stored as HHmmss.SSS, where:
  *      HH 24 hour time:
@@ -62,5 +71,3 @@ export function getCompression(imageId) {
 
   return 'Lossless / Uncompressed';
 }
-
-export { formatDICOMDate };

extensions/cornerstone/src/commandsModule.ts

@@ -14,18 +14,13 @@ import {
   utilities as cstUtils,
   annotation,
   Types as ToolTypes,
-  SplineContourSegmentationTool,
 } from '@cornerstonejs/tools';
-import {
-  SegmentInfo,
-  LogicalOperation,
-  OperatorOptions,
-} from '@cornerstonejs/tools/utilities/contourSegmentation/logicalOperators';
 import * as cornerstoneTools from '@cornerstonejs/tools';
 import * as labelmapInterpolation from '@cornerstonejs/labelmap-interpolation';
 import { ONNXSegmentationController } from '@cornerstonejs/ai';
 
 import { Types as OhifTypes, utils } from '@ohif/core';
+import i18n from '@ohif/i18n';
 import {
   callInputDialogAutoComplete,
   createReportAsync,
@@ -38,25 +33,13 @@ import { getFirstAnnotationSelected } from './utils/measurementServiceMappings/u
 import { getViewportEnabledElement } from './utils/getViewportEnabledElement';
 import getActiveViewportEnabledElement from './utils/getActiveViewportEnabledElement';
 import toggleVOISliceSync from './utils/toggleVOISliceSync';
-import {
-  usePositionPresentationStore,
-  useSegmentationPresentationStore,
-  useSelectedSegmentationsForViewportStore,
-} from './stores';
+import { usePositionPresentationStore, useSegmentationPresentationStore } from './stores';
 import { toolNames } from './initCornerstoneTools';
 import CornerstoneViewportDownloadForm from './utils/CornerstoneViewportDownloadForm';
 import { updateSegmentBidirectionalStats } from './utils/updateSegmentationStats';
 import { generateSegmentationCSVReport } from './utils/generateSegmentationCSVReport';
 import { getUpdatedViewportsForSegmentation } from './utils/hydrationUtils';
 import { SegmentationRepresentations } from '@cornerstonejs/tools/enums';
-import { isMeasurementWithinViewport } from './utils/isMeasurementWithinViewport';
-import { getCenterExtent } from './utils/getCenterExtent';
-import { EasingFunctionEnum } from './utils/transitions';
-import { createSegmentationForViewport } from './utils/createSegmentationForViewport';
-import { utilities as segmentationUtilities } from '@cornerstonejs/tools/segmentation';
-import i18n from '@ohif/i18n';
-
-const { add, intersect, subtract, copy } = cstUtils.contourSegmentation;
 
 const { DefaultHistoryMemo } = csUtils.HistoryMemo;
 const toggleSyncFunctions = {
@@ -75,7 +58,10 @@ const getLabelmapTools = ({ toolGroupService }) => {
     // tools is an object with toolName as the key and tool as the value
     Object.keys(tools).forEach(toolName => {
       const tool = tools[toolName];
-      if (tool instanceof cornerstoneTools.LabelmapBaseTool) {
+      if (
+        tool instanceof cornerstoneTools.LabelmapBaseTool &&
+        tool.shouldResolvePreviewRequests()
+      ) {
         labelmapTools.push(tool);
       }
     });
@@ -120,7 +106,6 @@ function commandsModule({
 }: OhifTypes.Extensions.ExtensionParams): OhifTypes.Extensions.CommandsModule {
   const {
     viewportGridService,
-    toolbarService,
     toolGroupService,
     cineService,
     uiDialogService,
@@ -160,50 +145,6 @@ function commandsModule({
     };
   }
 
-  function _handleBrushSizeAction(action: 'increase' | 'decrease') {
-    const toolGroupIds = toolGroupService.getToolGroupIds();
-    if (!toolGroupIds?.length) {
-      return;
-    }
-
-    for (const toolGroupId of toolGroupIds) {
-      const brushSize = segmentationUtils.getBrushSizeForToolGroup(toolGroupId);
-
-      const newBrushSize = action === 'increase' ? brushSize + 3 : brushSize - 3;
-
-      if (brushSize) {
-        segmentationUtils.setBrushSizeForToolGroup(toolGroupId, newBrushSize);
-
-        toolbarService.refreshToolbarState({ toolGroupId });
-      }
-    }
-  }
-
-  /**
-   * Creates a command function that sets a style property for segmentation types.
-   * If type is provided, sets the property for that type only.
-   * If type is not provided, sets the property for both Labelmap and Contour types.
-   * @param propertyName - The name of the style property to set
-   * @returns A command function that takes { type, value }
-   */
-  const createSetStyleCommand = (propertyName: string) => {
-    return ({ type, value }) => {
-      const { segmentationService } = servicesManager.services;
-      if (type) {
-        segmentationService.setStyle({ type }, { [propertyName]: value });
-      } else {
-        segmentationService.setStyle(
-          { type: SegmentationRepresentations.Labelmap },
-          { [propertyName]: value }
-        );
-        segmentationService.setStyle(
-          { type: SegmentationRepresentations.Contour },
-          { [propertyName]: value }
-        );
-      }
-    };
-  };
-
   const actions = {
     jumpToMeasurementViewport: ({ annotationUID, measurement }) => {
       cornerstoneTools.annotation.selection.setAnnotationSelected(annotationUID, true);
@@ -220,27 +161,6 @@ function commandsModule({
         const viewport = cornerstoneViewportService.getCornerstoneViewport(viewportId);
         viewport.setViewReference(metadata);
         viewport.render();
-
-        /**
-         * If the measurement is not visible inside the current viewport,
-         * we need to move the camera to the measurement.
-         */
-        if (!isMeasurementWithinViewport(viewport, measurement)) {
-          const camera = viewport.getCamera();
-          const { focalPoint: cameraFocalPoint, position: cameraPosition } = camera;
-          const { center, extent } = getCenterExtent(measurement);
-          const position = vec3.sub(vec3.create(), cameraPosition, cameraFocalPoint);
-          vec3.add(position, position, center);
-          viewport.setCamera({ focalPoint: center, position: position as any });
-          /** Zoom out if the measurement is too large */
-          const measurementSize = vec3.dist(extent.min, extent.max);
-          if (measurementSize > camera.parallelScale) {
-            const scaleFactor = measurementSize / camera.parallelScale;
-            viewport.setZoom(viewport.getZoom() / scaleFactor);
-          }
-          viewport.render();
-        }
-
         return;
       }
 
@@ -295,28 +215,16 @@ function commandsModule({
         return;
       }
 
-      const viewport = cornerstoneViewportService.getCornerstoneViewport(viewportId);
-
-      if (!viewport) {
-        return;
-      }
-
       if (displaySet.isOverlayDisplaySet) {
         // update the previously stored segmentationPresentation with the new viewportId
         // presentation so that when we put the referencedDisplaySet back in the viewport
         // it will have the correct segmentation representation hydrated
-
-        const segmentationType =
-          // Todo: check if PMAP modality should be handled such as SEG
-          displaySet.Modality !== 'SEG'
-            ? SegmentationRepresentations.Contour
-            : viewport.type === CoreEnums.ViewportType.VOLUME_3D
-              ? SegmentationRepresentations.Surface
-              : SegmentationRepresentations.Labelmap;
-
         commandsManager.runCommand('updateStoredSegmentationPresentation', {
           displaySet,
-          type: segmentationType,
+          type:
+            displaySet.Modality === 'SEG'
+              ? SegmentationRepresentations.Labelmap
+              : SegmentationRepresentations.Contour,
         });
       }
 
@@ -614,8 +522,8 @@ function commandsModule({
       if (!labelConfig) {
         const label = await callInputDialog({
           uiDialogService,
-          title: i18n.t('Tools:Edit Measurement Label'),
-          placeholder: measurement.label || i18n.t('Tools:Enter new label'),
+          title: 'Edit Measurement Label',
+          placeholder: measurement.label || 'Enter new label',
           defaultValue: measurement.label,
         });
 
@@ -829,8 +737,8 @@ function commandsModule({
       if (!labelConfig) {
         const label = await callInputDialog({
           uiDialogService,
-          title: i18n.t('Tools:Edit Arrow Text'),
-          placeholder: data?.data?.label || i18n.t('Tools:Enter new text'),
+          title: 'Edit Arrow Text',
+          placeholder: data?.data?.label || 'Enter new text',
           defaultValue: data?.data?.label || '',
         });
 
@@ -1022,21 +930,17 @@ function commandsModule({
         }
       }
     },
-    setToolActiveToolbar: ({ value, itemId, toolName, toolGroupIds = [], bindings }) => {
+    setToolActiveToolbar: ({ value, itemId, toolName, toolGroupIds = [] }) => {
       // Sometimes it is passed as value (tools with options), sometimes as itemId (toolbar buttons)
       toolName = toolName || itemId || value;
 
       toolGroupIds = toolGroupIds.length ? toolGroupIds : toolGroupService.getToolGroupIds();
 
       toolGroupIds.forEach(toolGroupId => {
-        actions.setToolActive({ toolName, toolGroupId, bindings });
+        actions.setToolActive({ toolName, toolGroupId });
       });
     },
-    setToolActive: ({
-      toolName,
-      toolGroupId = null,
-      bindings = [{ mouseButton: Enums.MouseBindings.Primary }],
-    }) => {
+    setToolActive: ({ toolName, toolGroupId = null }) => {
       const { viewports } = viewportGridService.getState();
 
       if (!viewports.size) {
@@ -1064,7 +968,11 @@ function commandsModule({
 
       // Set the new toolName to be active
       toolGroup.setToolActive(toolName, {
-        bindings,
+        bindings: [
+          {
+            mouseButton: Enums.MouseBindings.Primary,
+          },
+        ],
       });
     },
     // capture viewport
@@ -1074,8 +982,8 @@ function commandsModule({
       if (!cornerstoneViewportService.getCornerstoneViewport(activeViewportId)) {
         // Cannot download a non-cornerstone viewport (image).
         uiNotificationService.show({
-          title: i18n.t('Tools:Download Image'),
-          message: i18n.t('Tools:Image cannot be downloaded'),
+          title: 'Download Image',
+          message: 'Image cannot be downloaded',
           type: 'error',
         });
         return;
@@ -1086,7 +994,7 @@ function commandsModule({
       if (uiModalService) {
         uiModalService.show({
           content: CornerstoneViewportDownloadForm,
-          title: i18n.t('Tools:Download High Quality Image'),
+          title: 'Download High Quality Image',
           contentProps: {
             activeViewportId,
             cornerstoneViewportService,
@@ -1537,24 +1445,48 @@ function commandsModule({
      * as a segmentation representation to the viewport.
      */
     createLabelmapForViewport: async ({ viewportId, options = {} }) => {
-      return createSegmentationForViewport(servicesManager, {
-        viewportId,
-        options,
-        segmentationType: SegmentationRepresentations.Labelmap,
-      });
-    },
-    /**
-     * Creates a contour for the active viewport
-     *
-     * The created contour will be registered as a display set and also added
-     * as a segmentation representation to the viewport.
-     */
-    createContourForViewport: async ({ viewportId, options = {} }) => {
-      return createSegmentationForViewport(servicesManager, {
-        viewportId,
-        options,
-        segmentationType: SegmentationRepresentations.Contour,
+      const { viewportGridService, displaySetService, segmentationService } =
+        servicesManager.services;
+      const { viewports } = viewportGridService.getState();
+      const targetViewportId = viewportId;
+
+      const viewport = viewports.get(targetViewportId);
+
+      // Todo: add support for multiple display sets
+      const displaySetInstanceUID =
+        options.displaySetInstanceUID || viewport.displaySetInstanceUIDs[0];
+
+      const segs = segmentationService.getSegmentations();
+
+      const label = options.label || `Segmentation ${segs.length + 1}`;
+      const segmentationId = options.segmentationId || `${csUtils.uuidv4()}`;
+
+      const displaySet = displaySetService.getDisplaySetByUID(displaySetInstanceUID);
+
+      // This will create the segmentation and register it as a display set
+      const generatedSegmentationId = await segmentationService.createLabelmapForDisplaySet(
+        displaySet,
+        {
+          label,
+          segmentationId,
+          segments: options.createInitialSegment
+            ? {
+                1: {
+                  label: `${i18n.t('Segment')} 1`,
+                  active: true,
+                },
+              }
+            : {},
+        }
+      );
+
+      // Also add the segmentation representation to the viewport
+      await segmentationService.addSegmentationRepresentation(viewportId, {
+        segmentationId,
+        type: Enums.SegmentationRepresentations.Labelmap,
       });
+
+      return generatedSegmentationId;
     },
 
     /**
@@ -1573,9 +1505,9 @@ function commandsModule({
      * Adds a new segment to a segmentation
      * @param props.segmentationId - The ID of the segmentation to add the segment to
      */
-    addSegmentCommand: ({ segmentationId, config }) => {
+    addSegmentCommand: ({ segmentationId }) => {
       const { segmentationService } = servicesManager.services;
-      segmentationService.addSegment(segmentationId, config);
+      segmentationService.addSegment(segmentationId);
     },
 
     /**
@@ -1591,33 +1523,7 @@ function commandsModule({
         segmentationId
       );
       segmentationService.setActiveSegment(segmentationId, segmentIndex);
-
-      const { highlightAlpha, highlightSegment, animationLength, animationFunctionType } =
-        (customizationService.getCustomization(
-          'panelSegmentation.jumpToSegmentHighlightAnimationConfig'
-        ) as Object as {
-          highlightAlpha?: number;
-          highlightSegment?: boolean;
-          animationLength?: number;
-          animationFunctionType?: EasingFunctionEnum;
-        }) ?? {};
-
-      const validAnimationFunctionType = Object.values(EasingFunctionEnum).includes(
-        animationFunctionType
-      )
-        ? animationFunctionType
-        : undefined;
-
-      segmentationService.jumpToSegmentNext(
-        segmentationId,
-        segmentIndex,
-        undefined,
-        highlightAlpha,
-        highlightSegment,
-        animationLength,
-        undefined,
-        validAnimationFunctionType
-      );
+      segmentationService.jumpToSegmentCenter(segmentationId, segmentIndex);
     },
 
     /**
@@ -1672,13 +1578,15 @@ function commandsModule({
      * Stores a segmentation and shows it in the viewport
      * @param props.segmentationId - The ID of the segmentation to store
      */
-    storeSegmentationCommand: async args => {
-      const { segmentationId } = args;
+    storeSegmentationCommand: async ({ segmentationId }) => {
       const { segmentationService, viewportGridService } = servicesManager.services;
 
       const displaySetInstanceUIDs = await createReportAsync({
         servicesManager,
-        getReport: () => commandsManager.runCommand('storeSegmentation', args),
+        getReport: () =>
+          commandsManager.runCommand('storeSegmentation', {
+            segmentationId,
+          }),
         reportType: 'Segmentation',
       });
 
@@ -1753,6 +1661,56 @@ function commandsModule({
       segmentationService.setRenderInactiveSegmentations(viewportId, !renderInactive);
     },
 
+    /**
+     * Sets the fill alpha value for a segmentation type
+     * @param props.type - The type of segmentation
+     * @param props.value - The alpha value to set
+     */
+    setFillAlphaCommand: ({ type, value }) => {
+      const { segmentationService } = servicesManager.services;
+      segmentationService.setStyle({ type }, { fillAlpha: value });
+    },
+
+    /**
+     * Sets the outline width for a segmentation type
+     * @param props.type - The type of segmentation
+     * @param props.value - The width value to set
+     */
+    setOutlineWidthCommand: ({ type, value }) => {
+      const { segmentationService } = servicesManager.services;
+      segmentationService.setStyle({ type }, { outlineWidth: value });
+    },
+
+    /**
+     * Sets whether to render fill for a segmentation type
+     * @param props.type - The type of segmentation
+     * @param props.value - Whether to render fill
+     */
+    setRenderFillCommand: ({ type, value }) => {
+      const { segmentationService } = servicesManager.services;
+      segmentationService.setStyle({ type }, { renderFill: value });
+    },
+
+    /**
+     * Sets whether to render outline for a segmentation type
+     * @param props.type - The type of segmentation
+     * @param props.value - Whether to render outline
+     */
+    setRenderOutlineCommand: ({ type, value }) => {
+      const { segmentationService } = servicesManager.services;
+      segmentationService.setStyle({ type }, { renderOutline: value });
+    },
+
+    /**
+     * Sets the fill alpha for inactive segmentations
+     * @param props.type - The type of segmentation
+     * @param props.value - The alpha value to set
+     */
+    setFillAlphaInactiveCommand: ({ type, value }) => {
+      const { segmentationService } = servicesManager.services;
+      segmentationService.setStyle({ type }, { fillAlphaInactive: value });
+    },
+
     editSegmentLabel: async ({ segmentationId, segmentIndex }) => {
       const { segmentationService, uiDialogService } = servicesManager.services;
       const segmentation = segmentationService.getSegmentation(segmentationId);
@@ -1765,8 +1723,8 @@ function commandsModule({
 
       callInputDialog({
         uiDialogService,
-        title: i18n.t('Tools:Edit Segment Label'),
-        placeholder: i18n.t('Tools:Enter new label'),
+        title: 'Edit Segment Label',
+        placeholder: 'Enter new label',
         defaultValue: segment.label,
       }).then(label => {
         segmentationService.setSegmentLabel(segmentationId, segmentIndex, label);
@@ -1785,8 +1743,8 @@ function commandsModule({
 
       callInputDialog({
         uiDialogService,
-        title: i18n.t('Tools:Edit Segmentation Label'),
-        placeholder: i18n.t('Tools:Enter new label'),
+        title: 'Edit Segmentation Label',
+        placeholder: 'Enter new label',
         defaultValue: label,
       }).then(label => {
         segmentationService.addOrUpdateSegmentation({ segmentationId, label });
@@ -1808,7 +1766,7 @@ function commandsModule({
 
       uiDialogService.show({
         content: colorPickerDialog,
-        title: i18n.t('Tools:Segment Color'),
+        title: 'Segment Color',
         contentProps: {
           value: rgbaColor,
           onSave: newRgbaColor => {
@@ -1878,24 +1836,22 @@ function commandsModule({
         }
       });
     },
-    toggleSegmentLabel: ({ enabled }: { enabled?: boolean }) => {
+    toggleSegmentLabel: () => {
       const toolName = cornerstoneTools.SegmentLabelTool.toolName;
       const toolGroupIds = toolGroupService.getToolGroupIds();
 
-      const isToolOn = toolGroupIds.some(toolGroupId => {
+      const isOn = toolGroupIds.some(toolGroupId => {
         const toolGroup = cornerstoneTools.ToolGroupManager.getToolGroup(toolGroupId);
         const mode = toolGroup.getToolInstance(toolName)?.mode;
         return mode === 'Active';
       });
 
-      const enableTool = enabled !== undefined ? enabled : !isToolOn;
-
       toolGroupIds.forEach(toolGroupId => {
         const toolGroup = cornerstoneTools.ToolGroupManager.getToolGroup(toolGroupId);
-        if (enableTool) {
-          toolGroup.setToolActive(toolName);
-        } else {
+        if (isOn) {
           toolGroup.setToolDisabled(toolName);
+        } else {
+          toolGroup.setToolActive(toolName);
         }
       });
     },
@@ -2018,11 +1974,17 @@ function commandsModule({
         segmentAI.initViewport(viewport);
       }
     },
-    setBrushSize: ({ value }) => {
+    setBrushSize: ({ value, toolNames }) => {
       const brushSize = Number(value);
 
       toolGroupService.getToolGroupIds()?.forEach(toolGroupId => {
-        segmentationUtils.setBrushSizeForToolGroup(toolGroupId, brushSize);
+        if (toolNames?.length === 0) {
+          segmentationUtils.setBrushSizeForToolGroup(toolGroupId, brushSize);
+        } else {
+          toolNames?.forEach(toolName => {
+            segmentationUtils.setBrushSizeForToolGroup(toolGroupId, brushSize, toolName);
+          });
+        }
       });
     },
     setThresholdRange: ({
@@ -2051,10 +2013,26 @@ function commandsModule({
       }
     },
     increaseBrushSize: () => {
-      _handleBrushSizeAction('increase');
+      const toolGroupIds = toolGroupService.getToolGroupIds();
+      if (!toolGroupIds?.length) {
+        return;
+      }
+
+      for (const toolGroupId of toolGroupIds) {
+        const brushSize = segmentationUtils.getBrushSizeForToolGroup(toolGroupId);
+        segmentationUtils.setBrushSizeForToolGroup(toolGroupId, brushSize + 3);
+      }
     },
     decreaseBrushSize: () => {
-      _handleBrushSizeAction('decrease');
+      const toolGroupIds = toolGroupService.getToolGroupIds();
+      if (!toolGroupIds?.length) {
+        return;
+      }
+
+      for (const toolGroupId of toolGroupIds) {
+        const brushSize = segmentationUtils.getBrushSizeForToolGroup(toolGroupId);
+        segmentationUtils.setBrushSizeForToolGroup(toolGroupId, brushSize - 3);
+      }
     },
     addNewSegment: () => {
       const { segmentationService } = servicesManager.services;
@@ -2230,205 +2208,6 @@ function commandsModule({
         deleting,
       });
     },
-    activateSelectedSegmentationOfType: ({ segmentationRepresentationType }) => {
-      const { segmentationService, viewportGridService } = servicesManager.services;
-      const activeViewportId = viewportGridService.getActiveViewportId();
-      const { selectedSegmentationsForViewport } =
-        useSelectedSegmentationsForViewportStore.getState();
-      const segmentationId = selectedSegmentationsForViewport[activeViewportId]?.get(
-        segmentationRepresentationType
-      );
-
-      if (!segmentationId) {
-        return;
-      }
-
-      segmentationService.setActiveSegmentation(activeViewportId, segmentationId);
-    },
-    setDynamicCursorSizeForSculptorTool: ({ value: isDynamicCursorSize }) => {
-      const viewportId = viewportGridService.getActiveViewportId();
-      const toolGroup = toolGroupService.getToolGroupForViewport(viewportId);
-      const sculptorToolInstance = toolGroup.getToolInstance(toolNames.SculptorTool);
-      const oldConfiguration = sculptorToolInstance.configuration;
-
-      sculptorToolInstance.configuration = {
-        ...oldConfiguration,
-        updateCursorSize: isDynamicCursorSize ? 'dynamic' : '',
-      };
-    },
-    setInterpolationToolConfiguration: ({ value: interpolateContours, toolNames }) => {
-      const viewportId = viewportGridService.getActiveViewportId();
-      const toolGroup = toolGroupService.getToolGroupForViewport(viewportId);
-
-      // Set the interpolation configuration for the active tool.
-      const activeTool = toolGroupService.getActiveToolForViewport(viewportId);
-      const interpolationConfig = {
-        interpolation: {
-          enabled: interpolateContours,
-        },
-      };
-      toolGroup.setToolConfiguration(activeTool, interpolationConfig);
-
-      // Now set the interpolation configuration for the other tools specified.
-      if (toolNames) {
-        Object.values(toolGroup.getToolInstances()).forEach(toolInstance => {
-          if (toolNames?.includes(toolInstance.toolName)) {
-            toolGroup.setToolConfiguration(toolInstance.toolName, interpolationConfig);
-          }
-        });
-      }
-    },
-    setSimplifiedSplineForSplineContourSegmentationTool: ({ value: simplifiedSpline }) => {
-      const viewportId = viewportGridService.getActiveViewportId();
-      const toolGroup = toolGroupService.getToolGroupForViewport(viewportId);
-      Object.values(toolGroup.getToolInstances()).forEach(toolInstance => {
-        if (toolInstance instanceof SplineContourSegmentationTool) {
-          const oldConfiguration = toolInstance.configuration;
-          toolInstance.configuration = {
-            ...oldConfiguration,
-            simplifiedSpline,
-          };
-        }
-      });
-    },
-    removeSmallContours: ({ areaThreshold: threshold }) => {
-      const viewportId = viewportGridService.getActiveViewportId();
-      const activeSegmentation = segmentationService.getActiveSegmentation(viewportId);
-      const activeSegment = segmentationService.getActiveSegment(viewportId);
-
-      if (!activeSegmentation || !activeSegment) {
-        return;
-      }
-
-      const { removeContourIslands } = segmentationUtilities;
-      removeContourIslands(activeSegmentation.segmentationId, activeSegment.segmentIndex, {
-        threshold,
-      });
-      const renderingEngine = cornerstoneViewportService.getRenderingEngine();
-      renderingEngine.render();
-    },
-    applyLogicalContourOperation: ({
-      segmentAInfo,
-      segmentBInfo,
-      resultSegmentInfo,
-      logicalOperation,
-    }: {
-      segmentAInfo: SegmentInfo;
-      segmentBInfo: SegmentInfo;
-      resultSegmentInfo: OperatorOptions;
-      logicalOperation: LogicalOperation;
-    }) => {
-      switch (logicalOperation) {
-        case LogicalOperation.Union:
-          add(segmentAInfo, segmentBInfo, resultSegmentInfo);
-          break;
-        case LogicalOperation.Intersect:
-          intersect(segmentAInfo, segmentBInfo, resultSegmentInfo);
-          break;
-        case LogicalOperation.Subtract:
-          subtract(segmentAInfo, segmentBInfo, resultSegmentInfo);
-          break;
-        default:
-          throw new Error('Unsupported logical operation');
-      }
-    },
-    copyContourSegment: ({
-      sourceSegmentInfo,
-      targetSegmentInfo,
-    }: {
-      sourceSegmentInfo: SegmentInfo;
-      targetSegmentInfo?: SegmentInfo;
-    }) => {
-      if (!targetSegmentInfo) {
-        targetSegmentInfo = {
-          segmentationId: sourceSegmentInfo.segmentationId,
-          segmentIndex: segmentationService.getNextAvailableSegmentIndex(
-            sourceSegmentInfo.segmentationId
-          ),
-        };
-        segmentationService.addSegment(targetSegmentInfo.segmentationId, {
-          segmentIndex: targetSegmentInfo.segmentIndex,
-        });
-      }
-
-      copy(sourceSegmentInfo, targetSegmentInfo);
-    },
-    smoothContours: () => {
-      const viewportId = viewportGridService.getActiveViewportId();
-      const activeSegmentation = segmentationService.getActiveSegmentation(viewportId);
-      const activeSegment = segmentationService.getActiveSegment(viewportId);
-
-      if (!activeSegmentation || !activeSegment) {
-        return;
-      }
-
-      const { smoothContours } = segmentationUtilities;
-      smoothContours(activeSegmentation.segmentationId, activeSegment.segmentIndex);
-
-      const renderingEngine = cornerstoneViewportService.getRenderingEngine();
-      renderingEngine.render();
-    },
-    removeContourHoles: () => {
-      const viewportId = viewportGridService.getActiveViewportId();
-      const activeSegmentation = segmentationService.getActiveSegmentation(viewportId);
-      const activeSegment = segmentationService.getActiveSegment(viewportId);
-
-      if (!activeSegmentation || !activeSegment) {
-        return;
-      }
-
-      const { removeContourHoles } = segmentationUtilities;
-      removeContourHoles(activeSegmentation.segmentationId, activeSegment.segmentIndex);
-
-      const renderingEngine = cornerstoneViewportService.getRenderingEngine();
-      renderingEngine.render();
-    },
-    decimateContours: () => {
-      const viewportId = viewportGridService.getActiveViewportId();
-      const activeSegmentation = segmentationService.getActiveSegmentation(viewportId);
-      const activeSegment = segmentationService.getActiveSegment(viewportId);
-
-      if (!activeSegmentation || !activeSegment) {
-        return;
-      }
-
-      const { decimateContours } = segmentationUtilities;
-      decimateContours(activeSegmentation.segmentationId, activeSegment.segmentIndex);
-
-      const renderingEngine = cornerstoneViewportService.getRenderingEngine();
-      renderingEngine.render();
-    },
-    convertContourHoles: () => {
-      const viewportId = viewportGridService.getActiveViewportId();
-      const activeSegmentation = segmentationService.getActiveSegmentation(viewportId);
-      const activeSegment = segmentationService.getActiveSegment(viewportId);
-
-      if (!activeSegmentation || !activeSegment) {
-        return;
-      }
-
-      const targetSegmentInfo = {
-        segmentationId: activeSegmentation.segmentationId,
-        segmentIndex: segmentationService.getNextAvailableSegmentIndex(
-          activeSegmentation.segmentationId
-        ),
-      };
-
-      segmentationService.addSegment(targetSegmentInfo.segmentationId, {
-        segmentIndex: targetSegmentInfo.segmentIndex,
-      });
-
-      const { convertContourHoles } = segmentationUtilities;
-      convertContourHoles(
-        activeSegmentation.segmentationId,
-        activeSegment.segmentIndex,
-        targetSegmentInfo.segmentationId,
-        targetSegmentInfo.segmentIndex
-      );
-
-      const renderingEngine = cornerstoneViewportService.getRenderingEngine();
-      renderingEngine.render();
-    },
   };
 
   const definitions = {
@@ -2627,9 +2406,6 @@ function commandsModule({
     createLabelmapForViewport: {
       commandFn: actions.createLabelmapForViewport,
     },
-    createContourForViewport: {
-      commandFn: actions.createContourForViewport,
-    },
     setActiveSegmentation: {
       commandFn: actions.setActiveSegmentation,
     },
@@ -2673,25 +2449,19 @@ function commandsModule({
       commandFn: actions.toggleRenderInactiveSegmentationsCommand,
     },
     setFillAlpha: {
-      commandFn: createSetStyleCommand('fillAlpha'),
+      commandFn: actions.setFillAlphaCommand,
     },
     setOutlineWidth: {
-      commandFn: createSetStyleCommand('outlineWidth'),
+      commandFn: actions.setOutlineWidthCommand,
     },
     setRenderFill: {
-      commandFn: createSetStyleCommand('renderFill'),
-    },
-    setRenderFillInactive: {
-      commandFn: createSetStyleCommand('renderFillInactive'),
+      commandFn: actions.setRenderFillCommand,
     },
     setRenderOutline: {
-      commandFn: createSetStyleCommand('renderOutline'),
-    },
-    setRenderOutlineInactive: {
-      commandFn: createSetStyleCommand('renderOutlineInactive'),
+      commandFn: actions.setRenderOutlineCommand,
     },
     setFillAlphaInactive: {
-      commandFn: createSetStyleCommand('fillAlphaInactive'),
+      commandFn: actions.setFillAlphaInactiveCommand,
     },
     editSegmentLabel: {
       commandFn: actions.editSegmentLabel,
@@ -2737,18 +2507,6 @@ function commandsModule({
     toggleSegmentLabel: actions.toggleSegmentLabel,
     jumpToMeasurementViewport: actions.jumpToMeasurementViewport,
     initializeSegmentLabelTool: actions.initializeSegmentLabelTool,
-    activateSelectedSegmentationOfType: actions.activateSelectedSegmentationOfType,
-    setDynamicCursorSizeForSculptorTool: actions.setDynamicCursorSizeForSculptorTool,
-    setSimplifiedSplineForSplineContourSegmentationTool:
-      actions.setSimplifiedSplineForSplineContourSegmentationTool,
-    removeSmallContours: actions.removeSmallContours,
-    applyLogicalContourOperation: actions.applyLogicalContourOperation,
-    copyContourSegment: actions.copyContourSegment,
-    smoothContours: actions.smoothContours,
-    removeContourHoles: actions.removeContourHoles,
-    decimateContours: actions.decimateContours,
-    convertContourHoles: actions.convertContourHoles,
-    setInterpolationToolConfiguration: actions.setInterpolationToolConfiguration,
   };
 
   return {

extensions/cornerstone/src/components/AccordionGroup/AccordionGroup.tsx

@@ -55,7 +55,7 @@ const DEFAULT_TYPES = [GroupAccordion, Content, Trigger];
  * measurements panel for a practical, working example.
  */
 export function AccordionGroup(props) {
-  const { grouping, items, children, sourceChildren } = props;
+  const { grouping, items, children, sourceChildren, type } = props;
   const childProps = useSystem();
   let defaultValue = props.defaultValue;
   const groups = grouping.groupingFunction(items, grouping, childProps);
@@ -91,14 +91,14 @@ function DefaultAccordion(props) {
     return null;
   }
 
-  if (asChild) {
+  if (Boolean(asChild)) {
     return React.cloneElement(props.children, props);
   }
 
   return (
     <Accordion
       type={grouping.type || 'multiple'}
-      className="text-foreground"
+      className="text-white"
       defaultValue={defaultValue}
     >
       {[...groups.entries()].map(([key, group]) => {

extensions/cornerstone/src/components/DicomUpload/DicomUpload.css

@@ -0,0 +1,23 @@
+.dicom-upload-drop-area-border-dash {
+  background-image: repeating-linear-gradient(
+      to right,
+      #7bb2ce 0%,
+      #7bb2ce 50%,
+      transparent 50%,
+      transparent 100%
+    ),
+    repeating-linear-gradient(to right, #7bb2ce 0%, #7bb2ce 50%, transparent 50%, transparent 100%),
+    repeating-linear-gradient(to bottom, #7bb2ce 0%, #7bb2ce 50%, transparent 50%, transparent 100%),
+    repeating-linear-gradient(to bottom, #7bb2ce 0%, #7bb2ce 50%, transparent 50%, transparent 100%);
+  background-position:
+    left top,
+    left bottom,
+    left top,
+    right top;
+  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
+  background-size:
+    20px 3px,
+    20px 3px,
+    3px 20px,
+    3px 20px;
+}

extensions/cornerstone/src/components/DicomUpload/DicomUpload.tsx

@@ -5,8 +5,8 @@ import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import DicomFileUploader from '../../utils/DicomFileUploader';
 import DicomUploadProgress from './DicomUploadProgress';
-import { Button } from '@ohif/ui-next';
-// Removed dashed border CSS; using simple 1px solid border with muted foreground color
+import { Button, ButtonEnums } from '@ohif/ui';
+import './DicomUpload.css';
 
 type DicomUploadProps = {
   dataSource;
@@ -15,8 +15,7 @@ type DicomUploadProps = {
 };
 
 function DicomUpload({ dataSource, onComplete, onStarted }: DicomUploadProps): ReactElement {
-  const baseClassNames =
-    'min-h-[375px] flex flex-col bg-black select-none rounded-lg overflow-hidden';
+  const baseClassNames = 'min-h-[480px] flex flex-col bg-black select-none';
   const [dicomFileUploaderArr, setDicomFileUploaderArr] = useState([]);
 
   const onDrop = useCallback(async acceptedFiles => {
@@ -35,10 +34,9 @@ function DicomUpload({ dataSource, onComplete, onStarted }: DicomUploadProps): R
         {({ getRootProps }) => (
           <div
             {...getRootProps()}
-            className="m-5 flex h-full flex-col items-center justify-center rounded-2xl border"
-            style={{ borderColor: 'hsl(var(--muted-foreground) / 0.25)' }}
+            className="dicom-upload-drop-area-border-dash m-5 flex h-full flex-col items-center justify-center"
           >
-            <div className="flex gap-2">
+            <div className="flex gap-3">
               <Dropzone
                 onDrop={onDrop}
                 noDrag
@@ -46,16 +44,11 @@ function DicomUpload({ dataSource, onComplete, onStarted }: DicomUploadProps): R
                 {({ getRootProps, getInputProps }) => (
                   <div {...getRootProps()}>
                     <Button
-                      variant="default"
-                      size="lg"
                       disabled={false}
                       onClick={() => {}}
                     >
                       {'Add files'}
-                      <input
-                        {...getInputProps()}
-                        style={{ display: 'none' }}
-                      />
+                      <input {...getInputProps()} />
                     </Button>
                   </div>
                 )}
@@ -67,8 +60,7 @@ function DicomUpload({ dataSource, onComplete, onStarted }: DicomUploadProps): R
                 {({ getRootProps, getInputProps }) => (
                   <div {...getRootProps()}>
                     <Button
-                      variant="secondary"
-                      size="lg"
+                      type={ButtonEnums.type.secondary}
                       disabled={false}
                       onClick={() => {}}
                     >
@@ -77,15 +69,14 @@ function DicomUpload({ dataSource, onComplete, onStarted }: DicomUploadProps): R
                         {...getInputProps()}
                         webkitdirectory="true"
                         mozdirectory="true"
-                        style={{ display: 'none' }}
                       />
                     </Button>
                   </div>
                 )}
               </Dropzone>
             </div>
-            <div className="text-foreground pt-6 text-base">or drag images or folders here</div>
-            <div className="text-muted-foreground pt-1 text-base">(DICOM files supported)</div>
+            <div className="pt-5">or drag images or folders here</div>
+            <div className="text-aqua-pale pt-3 text-lg">(DICOM files supported)</div>
           </div>
         )}
       </Dropzone>

extensions/cornerstone/src/components/DicomUpload/DicomUploadProgress.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useRef, useState, ReactElement } from 'react';
 import PropTypes from 'prop-types';
 import { useSystem } from '@ohif/core';
-import { Button } from '@ohif/ui-next';
+import { Button } from '@ohif/ui';
 import { Icons } from '@ohif/ui-next';
 import DicomFileUploader, {
   EVENTS,
@@ -276,7 +276,7 @@ function DicomUploadProgress({
 
   const getNumCompletedAndTimeRemainingComponent = (): ReactElement => {
     return (
-      <div className="bg-muted text-foreground flex h-14 items-center px-1 pb-4 text-lg">
+      <div className="bg-primary-dark flex h-14 items-center px-1 pb-4 text-lg text-white">
         {numFilesCompleted === dicomFileUploaderArr.length ? (
           <>
             <span className={NO_WRAP_ELLIPSIS_CLASS_NAMES}>{`${dicomFileUploaderArr.length} ${
@@ -308,7 +308,7 @@ function DicomUploadProgress({
 
             <span
               className={
-                'text-primary hover:text-highlight active:text-muted-foreground ml-auto cursor-pointer whitespace-nowrap'
+                'text-primary hover:text-primary-lightactive:text-aqua-pale ml-auto cursor-pointer whitespace-nowrap'
               }
               onClick={cancelAllUploads}
             >
@@ -337,11 +337,11 @@ function DicomUploadProgress({
 
   const getPercentCompleteComponent = (): ReactElement => {
     return (
-      <div className="ohif-scrollbar border-input overflow-y-scroll border-b px-2">
+      <div className="ohif-scrollbar border-secondary-light overflow-y-scroll border-b px-2">
         <div className="min-h-14 flex w-full items-center p-2.5">
           {numFilesCompleted === dicomFileUploaderArr.length ? (
             <>
-              <div className="text-highlight text-xl">
+              <div className="text-primary-light text-xl">
                 {numFails > 0
                   ? `Completed with ${numFails} ${numFails > 1 ? 'errors' : 'error'}!`
                   : 'Completed!'}
@@ -359,7 +359,7 @@ function DicomUploadProgress({
                 ></ProgressLoadingBar>
               </div>
               <div className="ml-1 flex w-24 items-center">
-                <div className="text-foreground w-10 text-right">{`${getPercentCompleteRounded()}%`}</div>
+                <div className="w-10 text-right text-foreground">{`${getPercentCompleteRounded()}%`}</div>
                 {getShowFailedOnlyIconComponent()}
               </div>
             </>

extensions/cornerstone/src/components/DicomUpload/DicomUploadProgressItem.tsx

@@ -56,7 +56,7 @@ const DicomUploadProgressItem = memo(
           return (
             <Icons.ByName
               name="status-tracked"
-              className="text-highlight"
+              className="text-primary-light"
             />
           );
         case UploadStatus.InProgress:
@@ -71,11 +71,11 @@ const DicomUploadProgressItem = memo(
     };
 
     return (
-      <div className="min-h-14 border-input flex w-full items-center overflow-hidden border-b p-2.5 text-lg">
+      <div className="min-h-14 border-secondary-light flex w-full items-center overflow-hidden border-b p-2.5 text-lg">
         <div className="self-top flex w-0 shrink grow flex-col gap-1">
           <div className="flex gap-4">
             <div className="flex w-6 shrink-0 items-center justify-center">{getStatusIcon()}</div>
-            <div className="text-foreground overflow-hidden text-ellipsis whitespace-nowrap">
+            <div className="overflow-hidden text-ellipsis whitespace-nowrap text-white">
               {dicomFileUploader.getFileName()}
             </div>
           </div>

extensions/cornerstone/src/components/ExportSegmentationSubMenuItem.tsx

@@ -1,108 +0,0 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import {
-  DropdownMenuSub,
-  DropdownMenuSubTrigger,
-  DropdownMenuPortal,
-  DropdownMenuSubContent,
-  DropdownMenuLabel,
-  DropdownMenuItem,
-  DropdownMenuSeparator,
-  Icons,
-} from '@ohif/ui-next';
-
-import { SegmentationRepresentations } from '@cornerstonejs/tools/enums';
-
-interface ExportSegmentationSubMenuItemProps {
-  segmentationId: string;
-  segmentationRepresentationType: string;
-  allowExport: boolean;
-  actions: {
-    storeSegmentation: (segmentationId: string, modality?: string) => Promise<unknown>;
-    onSegmentationDownloadRTSS: (segmentationId: string) => void;
-    onSegmentationDownload: (segmentationId: string) => void;
-    downloadCSVSegmentationReport: (segmentationId: string) => void;
-  };
-}
-
-export const ExportSegmentationSubMenuItem: React.FC<ExportSegmentationSubMenuItemProps> = ({
-  segmentationId,
-  segmentationRepresentationType,
-  allowExport,
-  actions,
-}) => {
-  const { t } = useTranslation('SegmentationPanel');
-
-  return (
-    <DropdownMenuSub>
-      <DropdownMenuSubTrigger className="pl-1">
-        <Icons.Export className="text-foreground" />
-        <span className="pl-2">{t('Download & Export')}</span>
-      </DropdownMenuSubTrigger>
-      <DropdownMenuPortal>
-        <DropdownMenuSubContent>
-          <DropdownMenuLabel className="flex items-center pl-0">
-            <Icons.Download className="h-5 w-5" />
-            <span className="pl-1">{t('Download')}</span>
-          </DropdownMenuLabel>
-          {segmentationRepresentationType === SegmentationRepresentations.Labelmap && (
-            <DropdownMenuItem
-              onClick={e => {
-                e.preventDefault();
-                actions.downloadCSVSegmentationReport(segmentationId);
-              }}
-              disabled={!allowExport}
-            >
-              {t('CSV Report')}
-            </DropdownMenuItem>
-          )}
-          {segmentationRepresentationType === SegmentationRepresentations.Labelmap && (
-            <DropdownMenuItem
-              onClick={e => {
-                e.preventDefault();
-                actions.onSegmentationDownload(segmentationId);
-              }}
-              disabled={!allowExport}
-            >
-              {t('DICOM SEG')}
-            </DropdownMenuItem>
-          )}
-          <DropdownMenuItem
-            onClick={e => {
-              e.preventDefault();
-              actions.onSegmentationDownloadRTSS(segmentationId);
-            }}
-            disabled={!allowExport}
-          >
-            {t('DICOM RTSS')}
-          </DropdownMenuItem>
-          <DropdownMenuSeparator />
-          <DropdownMenuLabel className="flex items-center pl-0">
-            <Icons.Export className="h-5 w-5" />
-            <span className="pl-1 pt-1">{t('Export')}</span>
-          </DropdownMenuLabel>
-          {segmentationRepresentationType === SegmentationRepresentations.Labelmap && (
-            <DropdownMenuItem
-              onClick={e => {
-                e.preventDefault();
-                actions.storeSegmentation(segmentationId, 'SEG');
-              }}
-              disabled={!allowExport}
-            >
-              {t('DICOM SEG')}
-            </DropdownMenuItem>
-          )}
-          <DropdownMenuItem
-            onClick={e => {
-              e.preventDefault();
-              actions.storeSegmentation(segmentationId, 'RTSTRUCT');
-            }}
-            disabled={!allowExport}
-          >
-            {t('DICOM RTSS')}
-          </DropdownMenuItem>
-        </DropdownMenuSubContent>
-      </DropdownMenuPortal>
-    </DropdownMenuSub>
-  );
-};

extensions/cornerstone/src/components/MeasurementsMenu.tsx

@@ -8,11 +8,9 @@ import {
   DropdownMenuItem,
   Icons,
 } from '@ohif/ui-next';
-import { useTranslation } from 'react-i18next';
 
 export function MeasumentsMenu(props) {
   const { group, classNames } = props;
-  const { t } = useTranslation('MeasurementTable');
   if (!group.items?.length) {
     console.log('No items to iterate', group.items);
     return null;
@@ -46,7 +44,7 @@ export function MeasumentsMenu(props) {
         className={`h-6 w-6 transition-opacity ${
           isSelected || !isVisible ? 'opacity-100' : 'opacity-50 group-hover:opacity-100'
         }`}
-        aria-label={isVisible ? t('Hide') : t('Show')}
+        aria-label={isVisible ? 'Hide' : 'Show'}
         onClick={e => {
           e.stopPropagation();
           onAction(e, ['jumpToMeasurement', 'toggleVisibilityMeasurement']);
@@ -72,7 +70,7 @@ export function MeasumentsMenu(props) {
         <DropdownMenuContent align="end">
           <DropdownMenuItem onClick={e => onAction(e, 'removeMeasurement')}>
             <Icons.Delete className="text-foreground" />
-            <span className="pl-2">{t('Delete')}</span>
+            <span className="pl-2">Delete</span>
           </DropdownMenuItem>
         </DropdownMenuContent>
       </DropdownMenu>

extensions/cornerstone/src/components/ModalityLoadBadge/ModalityLoadBadge.tsx

@@ -122,9 +122,9 @@ function ModalityLoadBadge({ viewportId }: { viewportId: string }) {
       return (
         <div
           data-cy={`ModalityLoadBadge-${viewportId}`}
-          className="text-foreground flex h-6 cursor-default text-sm leading-6"
+          className="flex h-6 cursor-default text-sm leading-6 text-white"
         >
-          <div className="bg-popover flex min-w-[45px] items-center rounded-l-xl rounded-r p-1">
+          <div className="bg-customgray-100 flex min-w-[45px] items-center rounded-l-xl rounded-r p-1">
             <StatusIcon />
             <span className="ml-1">{statusInfo.type}</span>
           </div>

extensions/cornerstone/src/components/NavigationComponent/NavigationComponent.tsx

@@ -5,7 +5,6 @@ import { utils } from '../..';
 import { useViewportSegmentations } from '../../hooks';
 import { useMeasurementTracking } from '../../hooks/useMeasurementTracking';
 import { useViewportDisplaySets } from '../../hooks/useViewportDisplaySets';
-import { SegmentationRepresentations } from '@cornerstonejs/tools/enums';
 
 /**
  * NavigationComponent provides navigation controls for viewports containing
@@ -28,11 +27,7 @@ function NavigationComponent({ viewportId }: { viewportId: string }) {
     viewportId,
   });
 
-  const hasSegmentations =
-    segmentationsWithRepresentations.length > 0 &&
-    segmentationsWithRepresentations.some(
-      segmentation => segmentation?.representation?.type !== SegmentationRepresentations.Surface
-    );
+  const hasSegmentations = segmentationsWithRepresentations.length > 0;
 
   // prefer segment navigation if available
   const navigationMode = hasSegmentations
@@ -92,10 +87,7 @@ function NavigationComponent({ viewportId }: { viewportId: string }) {
         return;
       }
 
-      const activeSegmentationWithRepresentation = segmentationsWithRepresentations.find(
-        segmentation => segmentation?.representation?.active
-      );
-      const segmentationId = activeSegmentationWithRepresentation.segmentation.segmentationId;
+      const segmentationId = segmentationsWithRepresentations[0].segmentation.segmentationId;
 
       utils.handleSegmentChange({
         direction,

extensions/cornerstone/src/components/SegmentationToolConfig.tsx

@@ -1,71 +0,0 @@
-import React, { useState } from 'react';
-import { Switch } from '@ohif/ui-next';
-import { useSystem } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
-
-export default function SegmentationToolConfig() {
-  const { commandsManager } = useSystem();
-  const { t } = useTranslation('SegmentationPanel');
-
-  // Get initial states based on current configuration
-  const [previewEdits, setPreviewEdits] = useState(false);
-  const [segmentLabelEnabled, setSegmentLabelEnabled] = useState(false);
-  const [toggleSegmentEnabled, setToggleSegmentEnabled] = useState(false);
-  const [useCenterAsSegmentIndex, setUseCenterAsSegmentIndex] = useState(false);
-
-  const handlePreviewEditsChange = checked => {
-    setPreviewEdits(checked);
-    commandsManager.run('toggleSegmentPreviewEdit', { toggle: checked });
-  };
-
-  const handleToggleSegmentEnabledChange = checked => {
-    setToggleSegmentEnabled(checked);
-    commandsManager.run('toggleSegmentSelect', { toggle: checked });
-  };
-
-  const handleUseCenterAsSegmentIndexChange = checked => {
-    setUseCenterAsSegmentIndex(checked);
-    commandsManager.run('toggleUseCenterSegmentIndex', { toggle: checked });
-  };
-
-  const handleSegmentLabelEnabledChange = checked => {
-    setSegmentLabelEnabled(checked);
-    commandsManager.run('toggleSegmentLabel', { enabled: checked });
-  };
-
-  return (
-    <div className="bg-muted flex flex-col gap-2 border-b border-b-[2px] border-black px-2 py-3">
-      <div className="flex items-center gap-2">
-        <Switch
-          checked={previewEdits}
-          onCheckedChange={handlePreviewEditsChange}
-        />
-        <span className="text-foreground text-base">{t('Preview edits before creating')}</span>
-      </div>
-
-      <div className="flex items-center gap-2">
-        <Switch
-          checked={useCenterAsSegmentIndex}
-          onCheckedChange={handleUseCenterAsSegmentIndexChange}
-        />
-        <span className="text-foreground text-base">{t('Use center as segment index')}</span>
-      </div>
-
-      <div className="flex items-center gap-2">
-        <Switch
-          checked={toggleSegmentEnabled}
-          onCheckedChange={handleToggleSegmentEnabledChange}
-        />
-        <span className="text-foreground text-base">{t('Hover on segment border to activate')}</span>
-      </div>
-
-      <div className="flex items-center gap-2">
-        <Switch
-          checked={segmentLabelEnabled}
-          onCheckedChange={handleSegmentLabelEnabledChange}
-        />
-        <span className="text-foreground text-base">{t('Show segment name on hover')}</span>
-      </div>
-    </div>
-  );
-}

extensions/cornerstone/src/components/SegmentationUtilityButton.tsx

@@ -1,64 +0,0 @@
-import React, { useCallback } from 'react';
-import { cn, ToolButton } from '@ohif/ui-next';
-import { useUIStateStore } from '@ohif/extension-default';
-
-interface SegmentationUtilityButtonProps {
-  className?: string;
-  isActive?: boolean;
-  id: string;
-}
-
-/**
- * A button that represents a segmentation utility.
- * It is implicitly the PopoverTrigger for the options Popover panel that is
- * opened in the PanelSegmentation component. It in essence is the PopoverTrigger
- * because typically this button has the associated options to display in the Popover.
- * Furthermore it also typically has a command for toggling the activeSegmentationUtility
- * value in the UIStateStore that triggers the fetching of its options.
-
- * @param props - The props for the button.
- * @param props.className - The class name for the button.
- * @param props.isActive - Whether the button is active
- * @param props.id - The id of the button.
- */
-function SegmentationUtilityButton(props: SegmentationUtilityButtonProps) {
-  const { className, isActive, id } = props;
-
-  const activeSegmentationUtility = useUIStateStore(
-    store => store.uiState.activeSegmentationUtility
-  );
-
-  const toolButtonClassName = cn(
-    'w-7 h-7 text-primary hover:text-primary hover:!bg-primary/30',
-    className,
-    isActive && 'bg-primary/30'
-  );
-
-  const handleMouseDownCapture = useCallback(
-    event => {
-      if (activeSegmentationUtility === id) {
-        // If this active button is clicked, prevent the default Popover
-        // behaviour of closing the Popover on a pointer/mouse down.
-        // Not doing this will cause the Popover to close and then reopen again.
-        // Why? Because propagating this event will cause PanelSegmentation to
-        // close the Popover by clearing the activeSegmentationUtility. Then
-        // this button will set the activeSegmentationUtility again and the
-        // Popover will reopen.
-        event.preventDefault();
-        event.stopPropagation();
-      }
-    },
-    [activeSegmentationUtility, id]
-  );
-
-  return (
-    <div onPointerDownCapture={handleMouseDownCapture}>
-      <ToolButton
-        {...props}
-        className={toolButtonClassName}
-      />
-    </div>
-  );
-}
-
-export default SegmentationUtilityButton;

extensions/cornerstone/src/components/StudyMeasurements.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import { useActiveViewportDisplaySets, utils } from '@ohif/core';
+import { useActiveViewportDisplaySets, useSystem, utils } from '@ohif/core';
+// import { AccordionContent, AccordionItem, AccordionTrigger } from '@ohif/ui-next';
 
 import { AccordionGroup } from './AccordionGroup';
 import MeasurementsOrAdditionalFindings from './MeasurementsOrAdditionalFindings';
@@ -62,7 +63,8 @@ export const groupByStudy = (items, grouping, childProps) => {
 export function StudyMeasurements(props): React.ReactNode {
   const { items, grouping = {}, children } = props;
 
-  const activeDisplaySets = useActiveViewportDisplaySets();
+  const system = useSystem();
+  const activeDisplaySets = useActiveViewportDisplaySets(system);
   const activeStudyUID = activeDisplaySets?.[0]?.StudyInstanceUID;
 
   return (

extensions/cornerstone/src/components/StudyMeasurementsActions.tsx

@@ -1,11 +1,9 @@
 import React from 'react';
 import { Button, Icons } from '@ohif/ui-next';
 import { useSystem } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
 
 export function StudyMeasurementsActions({ items, StudyInstanceUID, measurementFilter, actions }) {
   const { commandsManager } = useSystem();
-  const { t } = useTranslation('MeasurementTable');
   const disabled = !items?.length;
 
   if (disabled) {
@@ -47,7 +45,7 @@ export function StudyMeasurementsActions({ items, StudyInstanceUID, measurementF
           }}
         >
           <Icons.Add />
-          {t('Create SR')}
+          Create SR
         </Button>
         <Button
           size="sm"
@@ -65,7 +63,7 @@ export function StudyMeasurementsActions({ items, StudyInstanceUID, measurementF
           }}
         >
           <Icons.Delete />
-          {t('Delete')}
+          Delete
         </Button>
       </div>
     </div>

extensions/cornerstone/src/components/ViewportDataOverlaySettingMenu/ViewportDataOverlayMenu.tsx

@@ -14,7 +14,6 @@ import {
   Switch,
 } from '@ohif/ui-next';
 import { useSystem } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
 
 import { useViewportDisplaySets } from '../../hooks/useViewportDisplaySets';
 import SelectItemWithModality from '../SelectItemWithModality';
@@ -22,7 +21,6 @@ import { useViewportRendering } from '../../hooks';
 
 function ViewportDataOverlayMenu({ viewportId }: withAppTypes<{ viewportId: string }>) {
   const { commandsManager, servicesManager } = useSystem();
-  const { t } = useTranslation();
   const [pendingForegrounds, setPendingForegrounds] = useState<string[]>([]);
   const [pendingSegmentations, setPendingSegmentations] = useState<string[]>([]);
   const { toggleColorbar } = useViewportRendering(viewportId);
@@ -232,7 +230,7 @@ function ViewportDataOverlayMenu({ viewportId }: withAppTypes<{ viewportId: stri
           disabled={potentialForegroundDisplaySets.length === 0}
         >
           <Icons.Plus className="h-4 w-4" />
-          {t('Common:Foreground')}
+          Foreground
         </Button>
         <Button
           variant="ghost"
@@ -244,7 +242,7 @@ function ViewportDataOverlayMenu({ viewportId }: withAppTypes<{ viewportId: stri
           dataCY={`AddSegmentationDataOverlay-${viewportId}`}
         >
           <Icons.Plus className="h-4 w-4" />
-          {t('Tools:Segmentation')}
+          Segmentation
         </Button>
       </div>
 
@@ -322,7 +320,7 @@ function ViewportDataOverlayMenu({ viewportId }: withAppTypes<{ viewportId: stri
                 onValueChange={value => handlePendingSegmentationSelection(pendingId, value)}
               >
                 <SelectTrigger className="flex-1">
-                  <SelectValue placeholder={t('Common:SELECT A SEGMENTATION')} />
+                  <SelectValue placeholder="SELECT A SEGMENTATION" />
                 </SelectTrigger>
                 <SelectContent>
                   {potentialOverlayDisplaySets.map(item => (
@@ -430,7 +428,7 @@ function ViewportDataOverlayMenu({ viewportId }: withAppTypes<{ viewportId: stri
                 onValueChange={value => handlePendingForegroundSelection(pendingId, value)}
               >
                 <SelectTrigger className="flex-1">
-                  <SelectValue placeholder={t('Common:SELECT A FOREGROUND')} />
+                  <SelectValue placeholder="SELECT A FOREGROUND" />
                 </SelectTrigger>
                 <SelectContent>
                   {potentialForegroundDisplaySets.map(item => (

extensions/cornerstone/src/components/ViewportOrientationMenu/ViewportOrientationMenu.tsx

@@ -203,7 +203,7 @@ function ViewportOrientationMenu({
           <div className="flex-1 text-left">Acquisition</div>
         </Button>
         {/* Divider */}
-        <div className="border-input mx-1 my-2 border-t" />
+        <div className="mx-1 my-2 border-t border-white/20" />
         <Button
           variant="ghost"
           className="flex h-7 w-full flex-shrink-0 items-center justify-start self-stretch px-1 py-0"

extensions/cornerstone/src/components/ViewportWindowLevel/getViewportVolumeHistogram.ts

@@ -17,10 +17,9 @@ const workerFn = () => {
   });
 };
 
-// Register worker once at module load time
-workerManager.registerWorker('histogram-worker', workerFn, WorkerOptions);
-
 const getViewportVolumeHistogram = async (viewport, volume, options?) => {
+  workerManager.registerWorker('histogram-worker', workerFn, WorkerOptions);
+
   const volumeImageData = viewport.getImageData(volume.volumeId);
 
   if (!volumeImageData) {
@@ -30,7 +29,8 @@ const getViewportVolumeHistogram = async (viewport, volume, options?) => {
   let scalarData = volume.scalarData;
 
   if (volume.numTimePoints > 1) {
-    scalarData = volume.voxelManager.getDimensionGroupScalarData(volume.numTimePoints);
+    const targetTimePoint = volume.numTimePoints - 1; // or any other time point you need
+    scalarData = volume.voxelManager.getTimePointScalarData(targetTimePoint);
   } else {
     scalarData = volume.voxelManager.getCompleteScalarDataArray();
   }

extensions/cornerstone/src/components/ViewportWindowLevel/utils.ts

@@ -7,10 +7,6 @@ import { getViewportVolumeHistogram } from './getViewportVolumeHistogram';
  * Gets node opacity from volume actor
  */
 export const getNodeOpacity = (volumeActor, nodeIndex) => {
-  if (!volumeActor) {
-    return undefined;
-  }
-
   const volumeOpacity = volumeActor.getProperty().getScalarOpacity(0);
   const nodeValue = [];
 
@@ -23,10 +19,6 @@ export const getNodeOpacity = (volumeActor, nodeIndex) => {
  * Checks if the opacity applied to the PET volume follows a specific pattern
  */
 export const isPetVolumeWithDefaultOpacity = (volumeId: string, volumeActor) => {
-  if (!volumeActor) {
-    return false;
-  }
-
   const volume = cs3DCache.getVolume(volumeId);
 
   if (!volume || volume.metadata.Modality !== 'PT') {
@@ -67,10 +59,6 @@ export const isPetVolumeWithDefaultOpacity = (volumeId: string, volumeActor) =>
  * Checks if volume has constant opacity
  */
 export const isVolumeWithConstantOpacity = volumeActor => {
-  if (!volumeActor) {
-    return false;
-  }
-
   const volumeOpacity = volumeActor.getProperty().getScalarOpacity(0);
   const opacitySize = volumeOpacity.getSize();
   const firstNodeValue = [];
@@ -103,7 +91,7 @@ export const getWindowLevelsData = async (
 
   const volumeIds = (viewport as Types.IBaseVolumeViewport).getAllVolumeIds();
   const viewportProperties = viewport.getProperties();
-  const { voiRange } = viewportProperties || {};
+  const { voiRange } = viewportProperties;
   const viewportVoi = voiRange
     ? {
         windowWidth: voiRange.upper - voiRange.lower,

extensions/cornerstone/src/components/WindowLevelActionMenu/Colorbar.tsx

@@ -1,11 +1,9 @@
 import React, { ReactElement, useCallback } from 'react';
 import { Switch } from '@ohif/ui-next';
 import { useViewportRendering } from '../../hooks/useViewportRendering';
-import { useTranslation } from 'react-i18next';
 
 export function Colorbar({ viewportId }: { viewportId?: string } = {}): ReactElement {
   const { hasColorbar, toggleColorbar } = useViewportRendering(viewportId);
-  const { t } = useTranslation('WindowLevelActionMenu');
 
   const handleToggle = useCallback(() => {
     toggleColorbar();
@@ -18,7 +16,7 @@ export function Colorbar({ viewportId }: { viewportId?: string } = {}): ReactEle
         className="flex-grow"
         onClick={handleToggle}
       >
-        {t('Display Color bar')}
+        Display Color bar
       </span>
       <Switch
         className="ml-2 flex-shrink-0"

extensions/cornerstone/src/components/WindowLevelActionMenu/Colormap.tsx

@@ -1,11 +1,9 @@
 import React, { ReactElement, useEffect, useRef, useState } from 'react';
 import { AllInOneMenu, ScrollArea, Switch, Tabs, TabsList, TabsTrigger } from '@ohif/ui-next';
 import { useViewportRendering } from '../../hooks/useViewportRendering';
-import { useTranslation } from 'react-i18next';
 
 export function Colormap({ viewportId }: { viewportId?: string } = {}): ReactElement {
   const { viewportDisplaySets } = useViewportRendering(viewportId);
-  const { t } = useTranslation('WindowLevelActionMenu');
 
   const [activeDisplaySetUID, setActiveDisplaySetUID] = useState<string | undefined>(
     viewportDisplaySets?.[0]?.displaySetInstanceUID
@@ -76,7 +74,7 @@ export function Colormap({ viewportId }: { viewportId?: string } = {}): ReactEle
         className="hover:bg-accent flex h-8 w-full flex-shrink-0 cursor-pointer items-center px-2 text-base hover:rounded"
         onClick={() => setShowPreview(!showPreview)}
       >
-        <span className="flex-shrink-0">{t('Preview in viewport')}</span>
+        <span className="flex-shrink-0">Preview in viewport</span>
         <Switch
           className="ml-auto flex-shrink-0"
           checked={showPreview}
@@ -98,7 +96,7 @@ export function Colormap({ viewportId }: { viewportId?: string } = {}): ReactEle
             {colormaps.map((colormap, index) => (
               <AllInOneMenu.Item
                 key={index}
-                label={t(`Colormaps:${colormap.Name}`, { defaultValue: colormap.Name })}
+                label={colormap.description}
                 useIconSpace={false}
                 onClick={() => {
                   setCurrentColormap(colormap);

extensions/cornerstone/src/components/WindowLevelActionMenu/VolumeLighting.tsx

@@ -2,7 +2,6 @@ import React, { ReactElement, useState, useEffect, useCallback } from 'react';
 import { VolumeLightingProps } from '../../types/ViewportPresets';
 import { Numeric } from '@ohif/ui-next';
 import { useSystem } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
 
 export function VolumeLighting({ viewportId, hasShade }: VolumeLightingProps): ReactElement {
   const { servicesManager, commandsManager } = useSystem();
@@ -12,7 +11,6 @@ export function VolumeLighting({ viewportId, hasShade }: VolumeLightingProps): R
     diffuse: null,
     specular: null,
   });
-  const { t } = useTranslation('WindowLevelActionMenu');
 
   // Single callback to handle all lighting property changes
   const onLightingChange = useCallback(
@@ -47,9 +45,9 @@ export function VolumeLighting({ viewportId, hasShade }: VolumeLightingProps): R
 
   // Configuration for our lighting properties
   const lightingProperties = [
-    { key: 'ambient', label: t('Ambient') },
-    { key: 'diffuse', label: t('Diffuse') },
-    { key: 'specular', label: t('Specular') },
+    { key: 'ambient', label: 'Ambient' },
+    { key: 'diffuse', label: 'Diffuse' },
+    { key: 'specular', label: 'Specular' },
   ];
 
   return (

extensions/cornerstone/src/components/WindowLevelActionMenu/VolumeRenderingOptions.tsx

@@ -5,13 +5,10 @@ import { VolumeShift } from './VolumeShift';
 import { VolumeLighting } from './VolumeLighting';
 import { VolumeShade } from './VolumeShade';
 import { useViewportRendering } from '../../hooks/useViewportRendering';
-import { useTranslation } from 'react-i18next';
 
 export function VolumeRenderingOptions({ viewportId }: { viewportId?: string } = {}): ReactElement {
   const { volumeRenderingQualityRange } = useViewportRendering(viewportId);
   const [hasShade, setShade] = useState(false);
-  const { t } = useTranslation('WindowLevelActionMenu');
-
   return (
     <AllInOneMenu.ItemPanel>
       <VolumeRenderingQuality
@@ -20,7 +17,7 @@ export function VolumeRenderingOptions({ viewportId }: { viewportId?: string } =
       />
       <VolumeShift viewportId={viewportId} />
       <div className="mt-2 flex h-8 !h-[20px] w-full flex-shrink-0 items-center justify-start px-2 text-base">
-        <div className="text-muted-foreground text-sm">{t('Lighting')}</div>
+        <div className="text-muted-foreground text-sm">Lighting</div>
       </div>
       <div className="bg-background mt-1 mb-1 h-px w-full"></div>
       <div className="hover:bg-accent flex h-8 w-full flex-shrink-0 items-center px-2 text-base hover:rounded">

extensions/cornerstone/src/components/WindowLevelActionMenu/VolumeRenderingPresets.tsx

@@ -4,19 +4,17 @@ import React, { ReactElement } from 'react';
 import { VolumeRenderingPresetsContent } from './VolumeRenderingPresetsContent';
 import { useSystem } from '@ohif/core';
 import { useViewportRendering } from '../../hooks/useViewportRendering';
-import { useTranslation } from 'react-i18next';
 
 export function VolumeRenderingPresets({ viewportId }: { viewportId?: string } = {}): ReactElement {
   const { volumeRenderingPresets } = useViewportRendering(viewportId);
   const { servicesManager } = useSystem();
   const { uiDialogService } = servicesManager.services;
-  const { t } = useTranslation('WindowLevelActionMenu');
 
   const onClickPresets = () => {
     uiDialogService.show({
       id: 'volume-rendering-presets',
       content: VolumeRenderingPresetsContent,
-      title: t('Rendering Presets'),
+      title: 'Rendering Presets',
       isDraggable: true,
       contentProps: {
         presets: volumeRenderingPresets,
@@ -27,7 +25,7 @@ export function VolumeRenderingPresets({ viewportId }: { viewportId?: string } =
 
   return (
     <AllInOneMenu.Item
-      label={t('Rendering Presets')}
+      label="Rendering Presets"
       icon={<Icons.VolumeRendering />}
       rightIcon={<Icons.ByName name="action-new-dialog" />}
       onClick={onClickPresets}

extensions/cornerstone/src/components/WindowLevelActionMenu/VolumeRenderingPresetsContent.tsx

@@ -3,7 +3,6 @@ import React, { ReactElement, useState, useCallback } from 'react';
 import { PresetDialog } from '@ohif/ui-next';
 import { ViewportPreset, VolumeRenderingPresetsContentProps } from '../../types/ViewportPresets';
 import { useSystem } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
 
 interface Props extends VolumeRenderingPresetsContentProps {
   hide: () => void;
@@ -13,7 +12,6 @@ export function VolumeRenderingPresetsContent({ presets, viewportId, hide }: Pro
   const { commandsManager } = useSystem();
   const [searchValue, setSearchValue] = useState('');
   const [selectedPreset, setSelectedPreset] = useState<ViewportPreset | null>(null);
-  const { t } = useTranslation('WindowLevelActionMenu');
 
   const handleSearchChange = useCallback((event: React.ChangeEvent<HTMLInputElement>) => {
     setSearchValue(event.target.value);
@@ -43,7 +41,7 @@ export function VolumeRenderingPresetsContent({ presets, viewportId, hide }: Pro
           <PresetDialog.PresetSearch
             value={searchValue}
             onChange={handleSearchChange}
-            placeholder={t('Search all', 'Search all')}
+            placeholder="Search all"
           />
         </PresetDialog.PresetFilter>
         <PresetDialog.PresetGrid>
@@ -73,7 +71,7 @@ export function VolumeRenderingPresetsContent({ presets, viewportId, hide }: Pro
       </PresetDialog.PresetBody>
       <FooterAction className="mt-4 flex-shrink-0">
         <FooterAction.Right>
-          <FooterAction.Secondary onClick={hide}>{t('Common:Cancel')}</FooterAction.Secondary>
+          <FooterAction.Secondary onClick={hide}>Cancel</FooterAction.Secondary>
         </FooterAction.Right>
       </FooterAction>
     </PresetDialog>

extensions/cornerstone/src/components/WindowLevelActionMenu/VolumeRenderingQuality.tsx

@@ -2,7 +2,6 @@ import React, { ReactElement, useCallback, useState, useEffect } from 'react';
 import { VolumeRenderingQualityProps } from '../../types/ViewportPresets';
 import { Numeric } from '@ohif/ui-next';
 import { useSystem } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
 
 export function VolumeRenderingQuality({
   volumeRenderingQualityRange,
@@ -12,7 +11,6 @@ export function VolumeRenderingQuality({
   const { cornerstoneViewportService } = servicesManager.services;
   const { min, max, step } = volumeRenderingQualityRange;
   const [quality, setQuality] = useState(null);
-  const { t } = useTranslation('WindowLevelActionMenu');
 
   const onChange = useCallback(
     (value: number) => {
@@ -53,7 +51,7 @@ export function VolumeRenderingQuality({
             onChange={onChange}
           >
             <div className="flex flex-row items-center">
-              <Numeric.Label className="w-16">{t('Quality')}</Numeric.Label>
+              <Numeric.Label className="w-16">Quality</Numeric.Label>
               <Numeric.SingleRange sliderClassName="mx-2 flex-grow" />
             </div>
           </Numeric.Container>

extensions/cornerstone/src/components/WindowLevelActionMenu/VolumeShade.tsx

@@ -2,13 +2,11 @@ import React, { ReactElement, useCallback, useEffect, useState } from 'react';
 import { Switch } from '@ohif/ui-next';
 import { VolumeShadeProps } from '../../types/ViewportPresets';
 import { useSystem } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
 
 export function VolumeShade({
   viewportId,
   onClickShade = bool => {},
 }: VolumeShadeProps): ReactElement {
-  const { t } = useTranslation('WindowLevelActionMenu');
   const { servicesManager, commandsManager } = useSystem();
   const { cornerstoneViewportService } = servicesManager.services;
   const [shade, setShade] = useState(true);
@@ -31,7 +29,7 @@ export function VolumeShade({
 
   return (
     <>
-      <span className="flex-grow">{t('Shade')}</span>
+      <span className="flex-grow">Shade</span>
       <Switch
         className="ml-2 flex-shrink-0"
         key={key}

extensions/cornerstone/src/components/WindowLevelActionMenu/VolumeShift.tsx

@@ -2,7 +2,6 @@ import React, { ReactElement, useCallback, useEffect, useState, useRef } from 'r
 import { VolumeShiftProps } from '../../types/ViewportPresets';
 import { Numeric } from '@ohif/ui-next';
 import { useSystem } from '@ohif/core';
-import { useTranslation } from 'react-i18next';
 
 export function VolumeShift({ viewportId }: VolumeShiftProps): ReactElement {
   const { servicesManager, commandsManager } = useSystem();
@@ -20,7 +19,6 @@ export function VolumeShift({ viewportId }: VolumeShiftProps): ReactElement {
   const viewport = cornerstoneViewportService.getCornerstoneViewport(viewportId);
   const { actor } = viewport.getActors()[0];
   const ofun = actor.getProperty().getScalarOpacity(0);
-  const { t } = useTranslation('WindowLevelActionMenu');
 
   useEffect(() => {
     if (isBlocking) {
@@ -67,7 +65,7 @@ export function VolumeShift({ viewportId }: VolumeShiftProps): ReactElement {
             onMouseUp={() => setIsBlocking(false)}
           >
             <div className="flex flex-row items-center">
-              <Numeric.Label className="w-16">{t('Shift')}</Numeric.Label>
+              <Numeric.Label className="w-16">Shift</Numeric.Label>
               <Numeric.SingleRange sliderClassName="mx-2 flex-grow" />
             </div>
           </Numeric.Container>

extensions/cornerstone/src/components/WindowLevelActionMenu/WindowLevel.tsx

@@ -2,10 +2,8 @@ import React, { ReactElement, useEffect, useRef, useState } from 'react';
 import { AllInOneMenu, ScrollArea, Switch, Tabs, TabsList, TabsTrigger } from '@ohif/ui-next';
 import { useViewportRendering } from '../../hooks/useViewportRendering';
 import { WindowLevelPreset } from '../../types/WindowLevel';
-import { useTranslation } from 'react-i18next';
 
 export function WindowLevel({ viewportId }: { viewportId?: string } = {}): ReactElement {
-  const { t } = useTranslation('WindowLevelActionMenu');
   const { viewportDisplaySets } = useViewportRendering(viewportId);
   const [activeDisplaySetUID, setActiveDisplaySetUID] = useState<string | undefined>(
     viewportDisplaySets?.[0]?.displaySetInstanceUID
@@ -70,7 +68,7 @@ export function WindowLevel({ viewportId }: { viewportId?: string } = {}): React
         className="hover:bg-accent flex h-8 w-full flex-shrink-0 cursor-pointer items-center px-2 text-base hover:rounded"
         onClick={() => setShowPreview(!showPreview)}
       >
-        <span className="flex-shrink-0">{t('Preview in viewport')}</span>
+        <span className="flex-shrink-0">Preview in viewport</span>
         <Switch
           className="ml-auto flex-shrink-0"
           checked={showPreview}
@@ -93,7 +91,7 @@ export function WindowLevel({ viewportId }: { viewportId?: string } = {}): React
             {windowLevelPresets.map((preset, index) => (
               <AllInOneMenu.Item
                 key={index}
-                label={t(preset.description)}
+                label={preset.description}
                 secondaryLabel={`${preset.window} / ${preset.level}`}
                 useIconSpace={false}
                 onClick={() => {

extensions/cornerstone/src/components/WindowLevelActionMenu/WindowLevelActionMenu.tsx

@@ -7,27 +7,25 @@ import { WindowLevel } from './WindowLevel';
 import { VolumeRenderingPresets } from './VolumeRenderingPresets';
 import { VolumeRenderingOptions } from './VolumeRenderingOptions';
 import { useViewportRendering } from '../../hooks/useViewportRendering';
-import i18n from 'i18next';
 
 export type WindowLevelActionMenuProps = {
   viewportId: string;
+  element?: HTMLElement;
   align?: 'start' | 'end' | 'center';
   side?: 'top' | 'bottom' | 'left' | 'right';
-  onVisibilityChange?: (isVisible: boolean) => void;
 };
 
 export function WindowLevelActionMenu({
   viewportId,
+  element,
   align,
   side,
-  onVisibilityChange,
 }: WindowLevelActionMenuProps): ReactElement {
   return (
     <WindowLevelActionMenuContent
       viewportId={viewportId}
       align={align}
       side={side}
-      onVisibilityChange={onVisibilityChange}
     />
   );
 }
@@ -36,12 +34,10 @@ export function WindowLevelActionMenuContent({
   viewportId,
   align,
   side,
-  onVisibilityChange,
 }: {
   viewportId: string;
   align?: string;
   side?: string;
-  onVisibilityChange?: (isVisible: boolean) => void;
 }): ReactElement {
   const { t } = useTranslation('WindowLevelActionMenu');
   // Use a stable key for the menu to avoid infinite re-renders
@@ -62,8 +58,6 @@ export function WindowLevelActionMenuContent({
       isVisible={true}
       align={align}
       side={side}
-      backLabel={i18n.t('WindowLevelActionMenu:Back to Display Options')}
-      onVisibilityChange={onVisibilityChange}
     >
       <AllInOneMenu.ItemPanel>
         {!is3DVolume && <Colorbar viewportId={viewportId} />}
@@ -71,7 +65,7 @@ export function WindowLevelActionMenuContent({
         {colorbarProperties?.colormaps && !is3DVolume && (
           <AllInOneMenu.SubMenu
             key="colorLUTPresets"
-            itemLabel={t('Color LUT')}
+            itemLabel="Color LUT"
             itemIcon="icon-color-lut"
             className="flex h-[calc(100%-32px)] flex-col"
           >
@@ -92,7 +86,7 @@ export function WindowLevelActionMenuContent({
         {volumeRenderingPresets && is3DVolume && <VolumeRenderingPresets viewportId={viewportId} />}
 
         {volumeRenderingQualityRange && is3DVolume && (
-          <AllInOneMenu.SubMenu itemLabel={t('Rendering Options')}>
+          <AllInOneMenu.SubMenu itemLabel="Rendering Options">
             <VolumeRenderingOptions viewportId={viewportId} />
           </AllInOneMenu.SubMenu>
         )}

extensions/cornerstone/src/components/WindowLevelActionMenu/WindowLevelActionMenuWrapper.tsx

@@ -16,6 +16,7 @@ import { useViewportRendering } from '../../hooks';
 export function WindowLevelActionMenuWrapper(
   props: withAppTypes<{
     viewportId: string;
+    element?: HTMLElement;
     location?: number;
     isOpen?: boolean;
     onOpen?: () => void;
@@ -27,6 +28,7 @@ export function WindowLevelActionMenuWrapper(
 ): ReactNode {
   const {
     viewportId,
+    element,
     location,
     isOpen = false,
     onOpen,
@@ -121,9 +123,9 @@ export function WindowLevelActionMenuWrapper(
       >
         <WindowLevelActionMenu
           viewportId={viewportIdToUse}
+          element={element}
           align={align}
           side={side}
-          onVisibilityChange={handleOpenChange}
         />
       </PopoverContent>
     </Popover>

extensions/cornerstone/src/customizations/CustomDropdownMenuContent.tsx

@@ -3,21 +3,24 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuLabel,
+  DropdownMenuPortal,
   DropdownMenuSeparator,
+  DropdownMenuSub,
+  DropdownMenuSubTrigger,
+  DropdownMenuSubContent,
   Icons,
   useSegmentationTableContext,
   useSegmentationExpanded,
 } from '@ohif/ui-next';
 import { useTranslation } from 'react-i18next';
 import { useSystem } from '@ohif/core/src';
-import { ExportSegmentationSubMenuItem } from '../components/ExportSegmentationSubMenuItem';
 
 /**
  * Custom dropdown menu component for segmentation panel that uses context for data
  */
 export const CustomDropdownMenuContent = () => {
   const { commandsManager } = useSystem();
-  const { t } = useTranslation('SegmentationPanel');
+  const { t } = useTranslation('SegmentationTable');
   const {
     onSegmentationAdd,
     onSegmentationRemoveFromViewport,
@@ -26,8 +29,6 @@ export const CustomDropdownMenuContent = () => {
     exportOptions,
     activeSegmentation,
     activeSegmentationId,
-    segmentationRepresentationTypes,
-    disableEditing,
   } = useSegmentationTableContext('CustomDropdownMenu');
 
   // Try to get segmentation data from expanded context first, fall back to table context
@@ -46,21 +47,21 @@ export const CustomDropdownMenuContent = () => {
     segmentationId = activeSegmentationId;
   }
 
-  if (!segmentation || !segmentationId) {
-    return null;
-  }
-
   // Determine if export is allowed for this segmentation
-  if (exportOptions) {
+  if (exportOptions && segmentationId) {
     const exportOption = exportOptions.find(opt => opt.segmentationId === segmentationId);
     allowExport = exportOption?.isExportable || false;
   }
 
+  if (!segmentation || !segmentationId) {
+    return null;
+  }
+
   const actions = {
-    storeSegmentation: async (segmentationId, modality = 'SEG') => {
+    storeSegmentation: async segmentationId => {
       commandsManager.run({
         commandName: 'storeSegmentation',
-        commandOptions: { segmentationId, modality },
+        commandOptions: { segmentationId },
         context: 'CORNERSTONE',
       });
     },
@@ -77,19 +78,10 @@ export const CustomDropdownMenuContent = () => {
 
   return (
     <DropdownMenuContent align="start">
-      {!disableEditing && (
-        <DropdownMenuItem
-          onClick={() =>
-            onSegmentationAdd({
-              segmentationId,
-              segmentationRepresentationType: segmentationRepresentationTypes?.[0],
-            })
-          }
-        >
-          <Icons.Add className="text-foreground" />
-          <span className="pl-2">{t('Create New Segmentation')}</span>
-        </DropdownMenuItem>
-      )}
+      <DropdownMenuItem onClick={() => onSegmentationAdd(segmentationId)}>
+        <Icons.Add className="text-foreground" />
+        <span className="pl-2">{t('Create New Segmentation')}</span>
+      </DropdownMenuItem>
       <DropdownMenuSeparator />
       <DropdownMenuLabel>{t('Manage Current Segmentation')}</DropdownMenuLabel>
       <DropdownMenuItem onClick={() => onSegmentationRemoveFromViewport(segmentationId)}>
@@ -100,12 +92,61 @@ export const CustomDropdownMenuContent = () => {
         <Icons.Rename className="text-foreground" />
         <span className="pl-2">{t('Rename')}</span>
       </DropdownMenuItem>
-      <ExportSegmentationSubMenuItem
-        segmentationId={segmentationId}
-        segmentationRepresentationType={segmentationRepresentationTypes?.[0]}
-        allowExport={allowExport}
-        actions={actions}
-      />
+      <DropdownMenuSub>
+        <DropdownMenuSubTrigger className="pl-1">
+          <Icons.Export className="text-foreground" />
+          <span className="pl-2">{t('Download & Export')}</span>
+        </DropdownMenuSubTrigger>
+        <DropdownMenuPortal>
+          <DropdownMenuSubContent>
+            <DropdownMenuLabel className="flex items-center pl-0">
+              <Icons.Download className="h-5 w-5" />
+              <span className="pl-1">{t('Download')}</span>
+            </DropdownMenuLabel>
+            <DropdownMenuItem
+              onClick={e => {
+                e.preventDefault();
+                actions.downloadCSVSegmentationReport(segmentationId);
+              }}
+              disabled={!allowExport}
+            >
+              {t('CSV Report')}
+            </DropdownMenuItem>
+            <DropdownMenuItem
+              onClick={e => {
+                e.preventDefault();
+                actions.onSegmentationDownload(segmentationId);
+              }}
+              disabled={!allowExport}
+            >
+              {t('DICOM SEG')}
+            </DropdownMenuItem>
+            <DropdownMenuItem
+              onClick={e => {
+                e.preventDefault();
+                actions.onSegmentationDownloadRTSS(segmentationId);
+              }}
+              disabled={!allowExport}
+            >
+              {t('DICOM RTSS')}
+            </DropdownMenuItem>
+            <DropdownMenuSeparator />
+            <DropdownMenuLabel className="flex items-center pl-0">
+              <Icons.Export className="h-5 w-5" />
+              <span className="pl-1 pt-1">{t('Export')}</span>
+            </DropdownMenuLabel>
+            <DropdownMenuItem
+              onClick={e => {
+                e.preventDefault();
+                actions.storeSegmentation(segmentationId);
+              }}
+              disabled={!allowExport}
+            >
+              {t('DICOM SEG')}
+            </DropdownMenuItem>
+          </DropdownMenuSubContent>
+        </DropdownMenuPortal>
+      </DropdownMenuSub>
       <DropdownMenuSeparator />
       <DropdownMenuItem onClick={() => onSegmentationDelete(segmentationId)}>
         <Icons.Delete className="text-red-600" />

extensions/cornerstone/src/customizations/CustomSegmentStatisticsHeader.tsx

@@ -19,7 +19,7 @@ export const CustomSegmentStatisticsHeader = ({
 }: CustomSegmentStatisticsHeaderProps) => {
   const { servicesManager, commandsManager } = useSystem();
   const { segmentationService } = servicesManager.services;
-  const { t } = useTranslation('SegmentationPanel');
+  const { t } = useTranslation('SegmentationTable');
 
   const segmentation = segmentationService.getSegmentation(segmentationId);
   const segment = segmentation.segments[segmentIndex];

extensions/cornerstone/src/customizations/captureViewportModalCustomization.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { ImageModal, FooterAction } from '@ohif/ui-next';
-import { useTranslation } from 'react-i18next';
+
 const MAX_TEXTURE_SIZE = 10000;
 const DEFAULT_FILENAME = 'image';
 
@@ -37,7 +37,6 @@ function ViewportDownloadFormNew({
   const [showWarningMessage, setShowWarningMessage] = useState(true);
   const [filename, setFilename] = useState(DEFAULT_FILENAME);
   const [fileType, setFileType] = useState('jpg');
-  const { t } = useTranslation('CaptureViewportModal');
 
   useEffect(() => {
     if (!viewportElement) {
@@ -83,7 +82,7 @@ function ViewportDownloadFormNew({
               value={filename}
               onChange={e => setFilename(e.target.value)}
             >
-              {t('File name')}
+              File name
             </ImageModal.Filename>
             <ImageModal.Filetype
               selected={fileType}
@@ -95,10 +94,6 @@ function ViewportDownloadFormNew({
           <ImageModal.ImageSize
             width={dimensions.width.toString()}
             height={dimensions.height.toString()}
-            widthLabel={t('Width')}
-            heightLabel={t('Height')}
-            widthPlaceholder={t('Width')}
-            heightPlaceholder={t('Height')}
             onWidthChange={e => {
               onDimensionsChange({
                 ...dimensions,
@@ -114,7 +109,7 @@ function ViewportDownloadFormNew({
             maxWidth={MAX_TEXTURE_SIZE.toString()}
             maxHeight={MAX_TEXTURE_SIZE.toString()}
           >
-            {t('Image size in pixels')}
+            Image size <span className="text-muted-foreground">px</span>
           </ImageModal.ImageSize>
 
           <ImageModal.SwitchOption
@@ -122,7 +117,7 @@ function ViewportDownloadFormNew({
             checked={showAnnotations}
             onCheckedChange={onAnnotationsChange}
           >
-            {t('Include annotations')}
+            Include annotations
           </ImageModal.SwitchOption>
           {warningState.enabled && (
             <ImageModal.SwitchOption
@@ -130,21 +125,19 @@ function ViewportDownloadFormNew({
               checked={showWarningMessage}
               onCheckedChange={setShowWarningMessage}
             >
-              {t('Include warning message')}
+              Include warning message
             </ImageModal.SwitchOption>
           )}
           <FooterAction className="mt-2">
             <FooterAction.Right>
-              <FooterAction.Secondary onClick={onClose}>
-                {t('Common:Cancel')}
-              </FooterAction.Secondary>
+              <FooterAction.Secondary onClick={onClose}>Cancel</FooterAction.Secondary>
               <FooterAction.Primary
                 onClick={() => {
                   onDownload(filename || DEFAULT_FILENAME, fileType);
                   onClose();
                 }}
               >
-                {t('Common:Save')}
+                Save
               </FooterAction.Primary>
             </FooterAction.Right>
           </FooterAction>

extensions/cornerstone/src/customizations/miscCustomization.ts

@@ -1,12 +1,6 @@
 import { CinePlayer } from '@ohif/ui-next';
 import DicomUpload from '../components/DicomUpload/DicomUpload';
 
-// Provide a wider default container for the DICOM Upload modal, without
-// affecting other dialogs. We attach a static property that WorkList reads.
-const DicomUploadWithSize = Object.assign(DicomUpload, {
-  containerClassName: 'max-w-3xl',
-});
-
 export default {
   cinePlayer: CinePlayer,
   autoCineModalities: ['OT', 'US'],
@@ -17,6 +11,6 @@ export default {
   onBeforeDicomStore: ({ dicomDict, measurementData, naturalizedReport }) => {
     return dicomDict;
   },
-  dicomUploadComponent: DicomUploadWithSize,
+  dicomUploadComponent: DicomUpload,
   codingValues: {},
 };

extensions/cornerstone/src/customizations/segmentationPanelCustomization.tsx

@@ -1,94 +1,18 @@
 import { CustomDropdownMenuContent } from './CustomDropdownMenuContent';
 import { CustomSegmentStatisticsHeader } from './CustomSegmentStatisticsHeader';
-import SegmentationToolConfig from '../components/SegmentationToolConfig';
-import React from 'react';
-import { SegmentationRepresentations } from '@cornerstonejs/tools/enums';
+import React, { useState } from 'react';
+import { Switch } from '@ohif/ui-next';
 
 export default function getSegmentationPanelCustomization({ commandsManager, servicesManager }) {
-  const { segmentationService } = servicesManager.services;
-
-  let contourRenderFillChangedGlobally = false;
-
-  // Listen to when the global CONTOUR type renderFill style property is changed.
-  const { unsubscribe } = segmentationService.subscribe(
-    segmentationService.EVENTS.SEGMENTATION_STYLE_MODIFIED,
-    ({ specifier, style }) => {
-      if (
-        specifier.type === SegmentationRepresentations.Contour &&
-        specifier.segmentationId == null &&
-        specifier.viewportId == null &&
-        style.renderFill != null
-      ) {
-        unsubscribe();
-        contourRenderFillChangedGlobally = true;
-      }
-    }
-  );
-
   return {
     'panelSegmentation.customDropdownMenuContent': CustomDropdownMenuContent,
     'panelSegmentation.customSegmentStatisticsHeader': CustomSegmentStatisticsHeader,
     'panelSegmentation.disableEditing': false,
     'panelSegmentation.showAddSegment': true,
-    'panelSegmentation.onSegmentationAdd': async ({
-      segmentationRepresentationType = SegmentationRepresentations.Labelmap,
-    }) => {
+    'panelSegmentation.onSegmentationAdd': () => {
       const { viewportGridService } = servicesManager.services;
       const viewportId = viewportGridService.getState().activeViewportId;
-      if (segmentationRepresentationType === SegmentationRepresentations.Labelmap) {
-        commandsManager.run('createLabelmapForViewport', { viewportId });
-      } else if (segmentationRepresentationType === SegmentationRepresentations.Contour) {
-        const segmentationId = await commandsManager.run('createContourForViewport', {
-          viewportId,
-        });
-        // Override the default (i.e. hydrated RTSTRUCT) style for contours if the global CONTOUR type
-        // renderFill style property has not been changed.
-        if (!contourRenderFillChangedGlobally) {
-          segmentationService.setStyle(
-            { segmentationId, type: SegmentationRepresentations.Contour },
-            {
-              renderFill: true,
-              renderFillInactive: true,
-            },
-            // Do not merge so that these created contours inherit other type-specific style properties like the fill alpha.
-            // Merging would otherwise permanently inherit the fill alpha and any inheritance from the type level would be lost.
-            false
-          );
-        }
-
-        // If the global CONTOUR type renderFill style property is already set, do not subscribe to the SEGMENTATION_STYLE_MODIFIED event.
-        if (contourRenderFillChangedGlobally) {
-          return;
-        }
-
-        // Subscribe to the SEGMENTATION_STYLE_MODIFIED event to listen for changes to the CONTOUR type renderFill style property.
-        const { unsubscribe } = segmentationService.subscribe(
-          segmentationService.EVENTS.SEGMENTATION_STYLE_MODIFIED,
-          ({ specifier, style }) => {
-            if (
-              specifier.type === SegmentationRepresentations.Contour &&
-              specifier.segmentationId == null &&
-              specifier.viewportId == null &&
-              style.renderFill != null
-            ) {
-              // We are here because the renderFill style property is globally being changed for ALL contours.
-              // When this occurs, the desire is for ALL contours to inherit the property. To make this happen,
-              // we have to clear the style property that was set for this specific segmentation
-              // when it was created above.
-              // We can now also unsubscribe because this change only needs to be made when the global CONTOUR type
-              // renderFill style property is first changed.
-
-              contourRenderFillChangedGlobally = true;
-              unsubscribe();
-              segmentationService.setStyle(
-                { segmentationId, type: SegmentationRepresentations.Contour },
-                {},
-                false
-              );
-            }
-          }
-        );
-      }
+      commandsManager.run('createLabelmapForViewport', { viewportId });
     },
     'panelSegmentation.tableMode': 'collapsed',
     'panelSegmentation.readableText': {
@@ -109,11 +33,53 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
       lesionGlycolysis: 'Lesion Glycolysis',
       center: 'Center',
     },
-    'labelMapSegmentationToolbox.config': () => {
-      return <SegmentationToolConfig />;
-    },
-    'contourSegmentationToolbox.config': () => {
-      return <SegmentationToolConfig />;
+    'segmentationToolbox.config': () => {
+      // Get initial states based on current configuration
+      const [previewEdits, setPreviewEdits] = useState(false);
+      const [toggleSegmentEnabled, setToggleSegmentEnabled] = useState(false);
+      const [useCenterAsSegmentIndex, setUseCenterAsSegmentIndex] = useState(false);
+      const handlePreviewEditsChange = checked => {
+        setPreviewEdits(checked);
+        commandsManager.run('toggleSegmentPreviewEdit', { toggle: checked });
+      };
+
+      const handleToggleSegmentEnabledChange = checked => {
+        setToggleSegmentEnabled(checked);
+        commandsManager.run('toggleSegmentSelect', { toggle: checked });
+      };
+
+      const handleUseCenterAsSegmentIndexChange = checked => {
+        setUseCenterAsSegmentIndex(checked);
+        commandsManager.run('toggleUseCenterSegmentIndex', { toggle: checked });
+      };
+
+      return (
+        <div className="bg-muted flex flex-col gap-4 border-b border-b-[2px] border-black px-2 py-3">
+          <div className="flex items-center gap-2">
+            <Switch
+              checked={previewEdits}
+              onCheckedChange={handlePreviewEditsChange}
+            />
+            <span className="text-base text-white">Preview edits before creating</span>
+          </div>
+
+          <div className="flex items-center gap-2">
+            <Switch
+              checked={useCenterAsSegmentIndex}
+              onCheckedChange={handleUseCenterAsSegmentIndexChange}
+            />
+            <span className="text-base text-white">Use center as segment index</span>
+          </div>
+
+          <div className="flex items-center gap-2">
+            <Switch
+              checked={toggleSegmentEnabled}
+              onCheckedChange={handleToggleSegmentEnabledChange}
+            />
+            <span className="text-base text-white">Hover on segment border to activate</span>
+          </div>
+        </div>
+      );
     },
   };
 }

extensions/cornerstone/src/getPanelModule.tsx

@@ -1,67 +1,53 @@
 import React from 'react';
-import { useTranslation } from 'react-i18next';
+
 import { Toolbox } from '@ohif/extension-default';
 import PanelSegmentation from './panels/PanelSegmentation';
 import ActiveViewportWindowLevel from './components/ActiveViewportWindowLevel';
 import PanelMeasurement from './panels/PanelMeasurement';
-import { SegmentationRepresentations } from '@cornerstonejs/tools/enums';
-import i18n from '@ohif/i18n';
 
 const getPanelModule = ({ commandsManager, servicesManager, extensionManager }: withAppTypes) => {
-  const { toolbarService } = servicesManager.services;
-
-  const toolSectionMap = {
-    [SegmentationRepresentations.Labelmap]: toolbarService.sections.labelMapSegmentationToolbox,
-    [SegmentationRepresentations.Contour]: toolbarService.sections.contourSegmentationToolbox,
-  };
-
-  const wrappedPanelSegmentation = props => {
+  const wrappedPanelSegmentation = ({ configuration }) => {
     return (
       <PanelSegmentation
         commandsManager={commandsManager}
         servicesManager={servicesManager}
         extensionManager={extensionManager}
         configuration={{
-          ...props?.configuration,
+          ...configuration,
         }}
-        segmentationRepresentationTypes={props?.segmentationRepresentationTypes}
       />
     );
   };
 
-  const wrappedPanelSegmentationNoHeader = props => {
+  const wrappedPanelSegmentationNoHeader = ({ configuration }) => {
     return (
       <PanelSegmentation
         commandsManager={commandsManager}
         servicesManager={servicesManager}
         extensionManager={extensionManager}
         configuration={{
-          ...props?.configuration,
+          ...configuration,
         }}
-        segmentationRepresentationTypes={props?.segmentationRepresentationTypes}
       />
     );
   };
 
-  const wrappedPanelSegmentationWithTools = props => {
-    const { t } = useTranslation('SegmentationPanel');
-    const tKey = `${props.segmentationRepresentationTypes?.[0] ?? 'Segmentation'} tools`;
-    const tValue = t(tKey);
+  const wrappedPanelSegmentationWithTools = ({ configuration }) => {
+    const { toolbarService } = servicesManager.services;
 
     return (
       <>
         <Toolbox
-          buttonSectionId={toolSectionMap[props.segmentationRepresentationTypes?.[0]]}
-          title={tValue}
+          buttonSectionId={toolbarService.sections.segmentationToolbox}
+          title="Segmentation Tools"
         />
         <PanelSegmentation
           commandsManager={commandsManager}
           servicesManager={servicesManager}
           extensionManager={extensionManager}
           configuration={{
-            ...props?.configuration,
+            ...configuration,
           }}
-          segmentationRepresentationTypes={props?.segmentationRepresentationTypes}
         />
       </>
     );
@@ -96,29 +82,11 @@ const getPanelModule = ({ commandsManager, servicesManager, extensionManager }:
       component: wrappedPanelSegmentationNoHeader,
     },
     {
-      name: 'panelSegmentationWithToolsLabelMap',
+      name: 'panelSegmentationWithTools',
       iconName: 'tab-segmentation',
       iconLabel: 'Segmentation',
-      label: i18n.t('SegmentationPanel:Labelmap'),
-      component: props =>
-        wrappedPanelSegmentationWithTools({
-          ...props,
-          segmentationRepresentationTypes: [
-            SegmentationRepresentations.Labelmap,
-            SegmentationRepresentations.Surface,
-          ],
-        }),
-    },
-    {
-      name: 'panelSegmentationWithToolsContour',
-      iconName: 'tab-contours',
-      iconLabel: 'Segmentation',
-      label: i18n.t('SegmentationPanel:Contour'),
-      component: props =>
-        wrappedPanelSegmentationWithTools({
-          ...props,
-          segmentationRepresentationTypes: [SegmentationRepresentations.Contour],
-        }),
+      label: 'Segmentation',
+      component: wrappedPanelSegmentationWithTools,
     },
   ];
 };

extensions/cornerstone/src/getToolbarModule.tsx

@@ -1,5 +1,4 @@
 import { Enums } from '@cornerstonejs/tools';
-import i18n from '@ohif/i18n';
 import { utils } from '@ohif/ui-next';
 import { ViewportDataOverlayMenuWrapper } from './components/ViewportDataOverlaySettingMenu/ViewportDataOverlayMenuWrapper';
 import { ViewportOrientationMenuWrapper } from './components/ViewportOrientationMenu/ViewportOrientationMenuWrapper';
@@ -15,7 +14,7 @@ import AdvancedRenderingControls from './components/AdvancedRenderingControls';
 
 const getDisabledState = (disabledText?: string) => ({
   disabled: true,
-  disabledText: disabledText ?? i18n.t('Buttons:Not available on the current viewport'),
+  disabledText: disabledText ?? 'Not available on the current viewport',
 });
 
 export default function getToolbarModule({ servicesManager, extensionManager }: withAppTypes) {
@@ -397,9 +396,7 @@ export default function getToolbarModule({ servicesManager, extensionManager }:
           );
 
           if (!hasAnySupportedModality) {
-            return getDisabledState(
-              disabledText || i18n.t('Buttons:Tool not available for this modality')
-            );
+            return getDisabledState(disabledText || 'Tool not available for this modality');
           }
         }
       },

extensions/cornerstone/src/hooks/useMeasurements.ts

@@ -1,8 +1,6 @@
 import { useState, useEffect } from 'react';
 import debounce from 'lodash.debounce';
 import { useSystem } from '@ohif/core';
-import i18n from '@ohif/i18n';
-
 function mapMeasurementToDisplay(measurement, displaySetService) {
   const { referenceSeriesUID } = measurement;
 
@@ -15,8 +13,7 @@ function mapMeasurementToDisplay(measurement, displaySetService) {
   const { findingSites, finding, label: baseLabel, displayText: baseDisplayText } = measurement;
 
   const firstSite = findingSites?.[0];
-  const label =
-    baseLabel || finding?.text || firstSite?.text || i18n.t('MeasurementTable:empty');
+  const label = baseLabel || finding?.text || firstSite?.text || '(empty)';
 
   // Initialize displayText with the structure used in Length.ts and CobbAngle.ts
   const displayText = {

extensions/cornerstone/src/hooks/useViewportRendering.tsx

@@ -682,7 +682,7 @@ export function useViewportRendering(
 
       const actorEntries = viewport.getActors();
       const actorEntry = actorEntries?.find(entry =>
-        entry.referencedId?.includes(activeDisplaySetInstanceUID)
+        entry.referencedId.includes(activeDisplaySetInstanceUID)
       );
 
       if (!actorEntry) {

extensions/cornerstone/src/hooks/useViewportSegmentations.ts

@@ -152,27 +152,15 @@ export function useViewportSegmentations({
 
       const representations = segmentationService.getSegmentationRepresentations(viewportId);
 
-      // Deduplicate representations by segmentationId to prevent showing
-      // the same segmentation multiple times in the panel when it has
-      // multiple representation types (e.g., labelmap and surface)
-      const uniqueSegmentationMap = new Map();
-      representations.forEach(representation => {
-        if (!uniqueSegmentationMap.has(representation.segmentationId)) {
-          uniqueSegmentationMap.set(representation.segmentationId, representation);
-        }
+      const newSegmentationsWithRepresentations = representations.map(representation => {
+        const segmentation = segmentationService.getSegmentation(representation.segmentationId);
+        const mappedSegmentation = mapSegmentationToDisplay(segmentation, customizationService);
+        return {
+          representation,
+          segmentation: mappedSegmentation,
+        };
       });
 
-      const newSegmentationsWithRepresentations = Array.from(uniqueSegmentationMap.values()).map(
-        representation => {
-          const segmentation = segmentationService.getSegmentation(representation.segmentationId);
-          const mappedSegmentation = mapSegmentationToDisplay(segmentation, customizationService);
-          return {
-            representation,
-            segmentation: mappedSegmentation,
-          };
-        }
-      );
-
       setSegmentationsWithRepresentations({
         segmentationsWithRepresentations: newSegmentationsWithRepresentations,
         disabled: false,

extensions/cornerstone/src/hps/fourUp.ts

@@ -1,9 +1,9 @@
 import { HYDRATE_SEG_SYNC_GROUP, VOI_SYNC_GROUP } from './mpr';
-import i18n from 'i18next';
+
 export const fourUp = {
   id: 'fourUp',
   locked: true,
-  name: i18n.t('Hps:3D four up'),
+  name: '3D four up',
   icon: 'layout-advanced-3d-four-up',
   isPreset: true,
   createdDate: '2023-03-15T10:29:44.894Z',