ToolbarButton: Accepts both disabled
and isDisabled
props with different behavior
#63070
Labels
[Package] Components
/packages/components
[Status] In Progress
Tracking issues with work in progress
[Type] Bug
An existing feature does not function as intended
ToolbarButton is intended to be disabled with the designated
isDisabled
prop, judging from the code and TypeScript types.However, it also accepts the standard
disabled
prop because it allows standard<button>
props viarestProps
. To complicate things further, thedisabled
prop in theserestProps
are first passed ontoAriakit.ToolbarItem
before eventually being passed down toButton
, which opts out the toolbar item from the roving tabindex set regardless of whether the underlyingButton
allows focusable disabled.So to allow focusable disabled, you'll need to pass a combination of either
disabled
&accessibleWhenDisabled
(Ariakit API which is undocumented in our docs), orisDisabled
&__experimentalIsFocusable
.I'm not immediately sure how we'd want to address this, but things should be less confusing. We might want to tweak the logic so that passing
disabled
will result in the same behavior as passingisDisabled
.Related: #57701
The text was updated successfully, but these errors were encountered: