jbetancur / react-data-table-component

A responsive table library with built-in sorting, pagination, selection, expandable rows, and customizable styling.
https://react-data-table-component.netlify.app
Apache License 2.0
2.04k stars 411 forks source link

Styled components warnings on transient props #1168

Closed StuartMorris0 closed 8 months ago

StuartMorris0 commented 11 months ago

Issue Check list

Describe the bug

We are using the component with styled-components and seeing a lot of warnings, after the latest styled components update. styled-components: it looks like an unknown prop "responsive" is being sent through to the DOM, which will likely trigger a React console error. If you would like automatic filtering of unknown props, you can opt-into that behavior via `<StyleSheetManager shouldForwardProp={...}>` (connect an API like `@emotion/is-prop-valid`) or consider using transient props (`$` prefix for automatic filtering.)

The warnings relate to the table component. We do not directly style the component with styled-components, but we do use a wrapper around the component and apply some base styling to that.

The component itself is completely rendered by the package and we just pass props to it. What is strange is that the props are not actually passed to the DOM elements, i.e. there are not invalid DOM attributes passed that I can see, but a lot of warnings.

I wonder if the package needs its styled-components update applied and some transient props used instead.

Versions (please complete the following information)

jbetancur commented 8 months ago

should be resolved in 7.6.2