-
Notifications
You must be signed in to change notification settings - Fork 4.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Button: the disabled attribute doesn't apply to the button element #1775
Comments
As I see, <Button disabled />
<Button as='div' disabled /> <button class="ui disabled button" disabled></button>
<div class="ui disabled button"></div> |
Yes exactly, however the tab index isn't applied when you use it inside a |
A further issue is that the disabled prop is stripped from the props as it is a handled prop of |
I think we can do there something like this: const disabledButton = disabled && ElementType === 'button'
<ElementType {...rest} className={classes} disabled={disabledButton} onClick={this.handleClick} ref={this.handleRef} tabIndex={tabIndex}>
// ...
</ElementType> However, it's quite ugly solution because |
It seems quite bad to treat the button different to other semantic components. Elsewhere this is handled by splitting the props to get the unhandled props and then spreading them onto the child component. I think the solution should take that into account. |
Thanks a lot for fixing, much appreciated |
Steps
Create a
Button
component with disabled set to true.Expected Result
The button should be disabled.
Actual Result
The button only has styles to make it appear disabled, but it still functions if you tab to it due to a missing disabled attribute on the button element.
Version
0.68.3
Testcase
https://codepen.io/anon/pen/OgbeXr
The text was updated successfully, but these errors were encountered: