How do you correctly use a SwiftUI View inside an NSToolbarItem?

I've been struggling to get consistent UI and UX behaviour of SwiftUI Views inside NSToolbarItems and was wondering if there is an official way to use them.

I've now revisited this issue in macOS 27 and continue to see some idiosyncrasies. In the attached screenshot, you can see that the highlight area on mouse down between to the two buttons is different. This is the easiest example I've come up with that shows SwiftUI Views exhibiting different behaviour than AppKit Views.

Two questions:

  1. Is an NSHostingView a valid and supported view type for NSToolbarItem.view?
  2. If so, are there any rules that govern how the SwiftUI view should be configured? (ex: frame, sizing options, supported SwiftUI Views, preferred "root view" types, etc?)

Sample code that created the two NSToolbarItem buttons in the screenshot.

  • macOS 27 ZY21R0CMGL (Public Beta 1)
  • Xcode 27.0 beta
  • Minimum Deployment target: 27.0
// Left-Top SwiftUI Button (Clipped Highlighting)
let item = NSToolbarItem(itemIdentifier: itemIdentifier)
let rootView = Button { } label: { Image(systemName: "sidebar.trailing") }
item.view = NSHostingView(rootView: rootView)

// ... snip .. 

// Right-Bottom AppKit Button (Correct Highlighting)
let item = NSToolbarItem(itemIdentifier: itemIdentifier)
item.image = NSImage(systemSymbolName: "sidebar.trailing", accessibilityDescription: nil)

Both screenshots are taken on mouse down.

How do you correctly use a SwiftUI View inside an NSToolbarItem?
 
 
Q