Add optional onClose event handler for <Tabs> component when closing/removing a tab

[Haouech7]

First, thank you for all the hard work you put into building such a polished and accessible component library, it’s been invaluable to our projects.

I’d like to suggest a potential enhancement for the component:

Currently, there’s no built-in way to detect when a user closes or removes a tab—for instance, when using scroll buttons or clicking a close icon. It would be really helpful to have an optional onClose callback prop on the (or perhaps on or each ), which could be invoked whenever a tab is programmatically or interactively closed.
This is the design I have:

[reidbarber]

Thanks for creating the discussion. Tabs doesn't really support having interactive elements inside at the moment (it would interfere with keyboard navigation). I think this would be a good feature to support, but I don't think we have an issue tracking this at the moment. I think the implementation would probably look similar to TagGroup, which also happens to have an onRemove handler. In the meantime you should be able to use an onPress event on the close button to know when a tab is removed.

[Haouech7]

Thank you for the clarification and for considering this as a potential feature. I understand the keyboard navigation concerns, and the comparison to TagGroup makes sense. I’ll try the onPress workaround for now, and I agree it would be great to have an onClose (or similar) event supported natively in the future. I appreciate your guidance.

[snowystinger]

Unfortunately it's more complicated than the TagGroup. Tabs themselves, according to the spec, do not allow interactive children. Where as the TagGroup was implemented with a gridlist, which does.
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/tab_role#all_descendants_are_presentational