ui(components): Adds ToolButton and ToolButtonList to ui-next

[dan-rukas]

Context

Introduces two new original core components: ToolButton and ToolButtonList in the ui-next library to provide both "single tool" and “split button” functionality for the OHIF Toolbar. This PR also updates the existing toolbar configuration to demonstrate usage of both components and integrates seamlessly with the ToolbarService logic. Several files have been modified or created to support these changes, and new ui-next components (such as Tooltip, Button, DropdownMenu) are leveraged.

Changes & Results

1. ToolButton.tsx (New ui-next component)
   • Handles single-tool activation with a tooltip and icon.
   • Uses ui-next components: Tooltip, Button, Icons
2. ToolButtonList.tsx (New ui-next component)
   • Created to replicate “split button” functionality using ui-next patterns.
   • Utilizes ToolButton for the primary tool display and DropdownMenu for secondary tools.
   • Integrates TooltipProvider, Button, Icons, and DropdownMenu from ui-next
   • Exports a ToolButtonList component that supports a “primary” tool and a list of additional “secondary tools.”
3. getToolbarModule.tsx
   • Added a new registration for ohif.toolButton and ohif.toolButtonList to map UI Type to the newly created ToolButtonList component.
   • Ensures ToolbarService can render ToolButtonList when uiType: 'ohif.toolButtonList' is encountered.
4. toolbarButtons.ts
   • Toolbar Configuration Update:
     • Swapped MeasurementTools button from ohif.splitButton to ohif.toolButtonList.
     • Retained primary and items structure but now points to the new UI type.
     • Continues to rely on existing evaluate logic (evaluate.group.promoteToPrimaryIfCornerstoneToolNotActiveInTheList) for tool promotion.
5. components-list.tsx (Docs)
   • Documentation Page Update:
     • Demonstrates usage of ToolButton.

Testing

New Toolbar components are currently working in Basic Viewer mode (tested in Chrome)

Checklist

PR

• [✅] My Pull Request title is descriptive, accurate and follows the
  semantic-release format and guidelines.

Code

• [✅] My code has been well-documented (function documentation, inline comments,
  etc.)

Public Documentation Updates

• [✅] The documentation page has been updated as necessary for any public API
  additions or removals.

Tested Environment

• [✅] OS: macOS Sequoia 15.2, M4 Pro
• [✅] Node version: v23.5.0
• [✅] Browser: Chrome 131.0.6778.205 (Official Build) (arm64)

[netlify]

✅ Deploy Preview for ohif-platform-docs ready!

Name	Link
🔨 Latest commit	3c5a40f
🔍 Latest deploy log	https://app.netlify.com/sites/ohif-platform-docs/deploys/67803e5b9f74d90008c49df0
😎 Deploy Preview	https://deploy-preview-4670--ohif-platform-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for ohif-dev ready!

Name	Link
🔨 Latest commit	3c5a40f
🔍 Latest deploy log	https://app.netlify.com/sites/ohif-dev/deploys/67803e5bc1805e00083bc0cf
😎 Deploy Preview	https://deploy-preview-4670--ohif-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.