Skip to content

Conversation

@jonotrujillo
Copy link
Member

What

When using the experimental Button component, the following error is show in the browser terminal:

React does not recognize the `isLoading` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `isloading` instead. If you accidentally passed it from a parent component, remove it from the DOM element.

Why

The isLoading prop is accidentally passed to the button element, which is not recognized.

How

This issue is resolved by utilizing the transient props feature provided by styled-components (https://styled-components.com/docs/api#transient-props).

Copy link
Contributor

@dornelasnelson dornelasnelson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🤩

@jonotrujillo jonotrujillo merged commit ea7d3fe into main May 8, 2025
5 checks passed
@jonotrujillo jonotrujillo deleted the fix/avoid-isLoading-prop-on-button-element branch May 8, 2025 10:34
github-actions bot pushed a commit that referenced this pull request May 8, 2025
### [2.30.2](v2.30.1...v2.30.2) (2025-05-08)

### Bug Fixes

* avoid isLoading prop on button element ([#530](#530)) ([ea7d3fe](ea7d3fe))
@github-actions
Copy link
Contributor

github-actions bot commented May 8, 2025

🎉 This PR is included in version 2.30.2 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Development

Successfully merging this pull request may close these issues.

3 participants