Update dependency styled-components to v6.5.0 #93

2026-08-05T04:03:47+04:00

renovate[bot] commented

2026-08-05 04:03:47 +04:00

This PR contains the following updates:

Package	Change	Age	Confidence
styled-components (source)	`6.4.4` → `6.5.0`

Release Notes

styled-components/styled-components (styled-components)

`v6.5.0`

Compare Source

Minor Changes

dfe4baf: React Native components now check style against React Native's own style types. Web-only CSS such as float, and CSS custom properties such as --brand, were previously accepted even though React Native has never done anything with them at runtime. They now surface as a type error where you write them instead of silently doing nothing.
```
const Card = styled.View``;

<Card style={{ padding: 16 }} />; // unchanged
<Card style={{ float: 'left' }} />; // now a type error
```
Web components are unaffected and still accept custom properties.
dfe4baf: Declaring your own style prop type now constrains the fields you name while leaving the rest of CSS alone. Previously a declaration like styled.div<{ style?: { width: number } }> was quietly ignored, because the built-in style type was applied after your props, so any CSS value was still accepted. Now width has to be a number, while color, custom properties, and everything else you did not mention keep working as before.

To remove a field rather than constrain it, declare it as never. To make your type the only thing accepted, wrap it in the new CustomStyle helper, which removes every field you did not list:
```
const Box = styled.div<{ style?: CustomStyle<{ width: number }> }>``;
```
The constraint holds when the component is rendered through as or forwardedAs, so it cannot be sidestepped by rendering the same component as a different tag. Note that CustomStyle removes CSS custom properties too, since they are among the fields you did not list.

One thing to know if you use exactOptionalPropertyTypes: on a component that declares its own style, passing style={undefined} explicitly is now rejected. Leaving the prop off is unaffected. Write style?: { width: number } | undefined in your declaration if you need to pass it explicitly.

Relatedly, reading the style type back off a component (for example with React.ComponentProps) now reports that CSS custom properties are accepted, which matches what was already allowed when rendering.
2949923: Large TypeScript projects type-check dramatically faster. On a 500-component app, tsc check time drops to under a quarter of what 6.4.4 takes and peak memory to under a third, which resolves the out-of-memory failures some projects hit after upgrading past 6.4.2. Both are now better than 6.4.2 was, so there is no longer a reason to pin to it. Editor responsiveness improves by the same margin, and autocomplete on as targets is unchanged.

Patch Changes

dfe4baf: Fixed ref being rejected on React Native components created with the shorthand syntax, such as styled.TextInput. Passing a ref, or a ref callback whose parameter you have not annotated, now works the same way it does with styled(TextInput).

Also fixed a type error when a component's attrs callback is given an explicit parameter type, as in styled.div.attrs<MyProps>(props => props).
dfe4baf: Fixed components built on targets whose props cannot be inspected, such as Mantine's polymorphic components, rejecting children and the target's own props once you added a prop of your own:
```
const Styled = styled(MantineButton)<{ $variant: 'a' | 'b' }>``;

<Styled $variant="a" variant="filled">
  this now works
</Styled>;
```
Wrapping such a target without adding props already worked; adding one turned the permissiveness off. Your own declared props stay strictly typed either way.

Configuration

📅 Schedule: (UTC)

Branch creation
- At any time (no schedule defined)
Automerge
- At any time (no schedule defined)

🚦 Automerge: Enabled.

♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about these updates again.

If you want to rebase/retry this PR, check this box

This PR has been generated by Mend Renovate CLI.

This PR contains the following updates: | Package | Change | [Age](https://docs.renovatebot.com/merge-confidence/) | [Confidence](https://docs.renovatebot.com/merge-confidence/) | |---|---|---|---| | [styled-components](https://styled-components.com) ([source](https://github.com/styled-components/styled-components)) | [`6.4.4` → `6.5.0`](https://renovatebot.com/diffs/npm/styled-components/6.4.4/6.5.0) | ![age](https://developer.mend.io/api/mc/badges/age/npm/styled-components/6.5.0?slim=true) | ![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/styled-components/6.4.4/6.5.0?slim=true) | --- ### Release Notes <details> <summary>styled-components/styled-components (styled-components)</summary> ### [`v6.5.0`](https://github.com/styled-components/styled-components/releases/tag/styled-components%406.5.0) [Compare Source](https://github.com/styled-components/styled-components/compare/styled-components@6.4.4...styled-components@6.5.0) ##### Minor Changes - [`dfe4baf`](https://github.com/styled-components/styled-components/commit/dfe4baf): React Native components now check `style` against React Native's own style types. Web-only CSS such as `float`, and CSS custom properties such as `--brand`, were previously accepted even though React Native has never done anything with them at runtime. They now surface as a type error where you write them instead of silently doing nothing. ```tsx const Card = styled.View``; <Card style={{ padding: 16 }} />; // unchanged <Card style={{ float: 'left' }} />; // now a type error ``` Web components are unaffected and still accept custom properties. - [`dfe4baf`](https://github.com/styled-components/styled-components/commit/dfe4baf): Declaring your own `style` prop type now constrains the fields you name while leaving the rest of CSS alone. Previously a declaration like `styled.div<{ style?: { width: number } }>` was quietly ignored, because the built-in style type was applied after your props, so any CSS value was still accepted. Now `width` has to be a number, while `color`, custom properties, and everything else you did not mention keep working as before. To remove a field rather than constrain it, declare it as `never`. To make your type the only thing accepted, wrap it in the new `CustomStyle` helper, which removes every field you did not list: ```tsx const Box = styled.div<{ style?: CustomStyle<{ width: number }> }>``; ``` The constraint holds when the component is rendered through `as` or `forwardedAs`, so it cannot be sidestepped by rendering the same component as a different tag. Note that `CustomStyle` removes CSS custom properties too, since they are among the fields you did not list. One thing to know if you use `exactOptionalPropertyTypes`: on a component that declares its own `style`, passing `style={undefined}` explicitly is now rejected. Leaving the prop off is unaffected. Write `style?: { width: number } | undefined` in your declaration if you need to pass it explicitly. Relatedly, reading the style type back off a component (for example with `React.ComponentProps`) now reports that CSS custom properties are accepted, which matches what was already allowed when rendering. - [`2949923`](https://github.com/styled-components/styled-components/commit/2949923): Large TypeScript projects type-check dramatically faster. On a 500-component app, `tsc` check time drops to under a quarter of what 6.4.4 takes and peak memory to under a third, which resolves the out-of-memory failures some projects hit after upgrading past 6.4.2. Both are now better than 6.4.2 was, so there is no longer a reason to pin to it. Editor responsiveness improves by the same margin, and autocomplete on `as` targets is unchanged. ##### Patch Changes - [`dfe4baf`](https://github.com/styled-components/styled-components/commit/dfe4baf): Fixed `ref` being rejected on React Native components created with the shorthand syntax, such as `styled.TextInput`. Passing a ref, or a ref callback whose parameter you have not annotated, now works the same way it does with `styled(TextInput)`. Also fixed a type error when a component's `attrs` callback is given an explicit parameter type, as in `styled.div.attrs<MyProps>(props => props)`. - [`dfe4baf`](https://github.com/styled-components/styled-components/commit/dfe4baf): Fixed components built on targets whose props cannot be inspected, such as Mantine's polymorphic components, rejecting `children` and the target's own props once you added a prop of your own: ```tsx const Styled = styled(MantineButton)<{ $variant: 'a' | 'b' }>``; <Styled $variant="a" variant="filled"> this now works </Styled>; ``` Wrapping such a target without adding props already worked; adding one turned the permissiveness off. Your own declared props stay strictly typed either way. </details> --- ### Configuration 📅 **Schedule**: (UTC) - Branch creation - At any time (no schedule defined) - Automerge - At any time (no schedule defined) 🚦 **Automerge**: Enabled. ♻ **Rebasing**: Whenever PR is behind base branch, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about these updates again. --- - [ ] If you want to rebase/retry this PR, check this box --- This PR has been generated by [Mend Renovate CLI](https://github.com/renovatebot/renovate).

renovate[bot] added 1 commit 2026-08-05 04:03:47 +04:00

Update dependency styled-components to v6.5.0

Test / Basic (pull_request) Successful in 3m58s

Details

Test / Basic (push) Successful in 2m50s

Details

b2641abade

renovate[bot] scheduled this pull request to auto merge when all checks succeed 2026-08-05 04:03:47 +04:00

renovate[bot] merged commit b2641abade into master

2026-08-05 04:18:19 +04:00

renovate[bot] deleted branch renovate/all-digest

2026-08-05 04:18:19 +04:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: valentineus/strapi-plugin-checkbox-list#93