styled-components / xstyled

A utility-first CSS-in-JS framework built for React. 💅👩‍🎤⚡️
https://xstyled.dev
MIT License
2.27k stars 106 forks source link

breakpoints function does not work with _ in v3 #277

Closed AlfonzAlfonz closed 3 years ago

AlfonzAlfonz commented 3 years ago

💥 Regression Report

Because breakpoint value is no longer present in the defaultTheme breakpoints function now returns null { ... } media query for objects with key. _ key was removed in fe74ec9cbb6ca6876737f0ffc965534193c8bb12.

Fix should be pretty straightforward, either _ breakpoint should be added back or getBreakpointMin should account for this. https://github.com/gregberge/xstyled/blob/4865316ed1d0881e3833c0c6aad139040927e08c/packages/system/src/media.ts#L18

Last working version

Worked up to version: 2.5.0

Stopped working in version: 3.0.0

To Reproduce

Steps to reproduce the behavior:

breakpoints({ _: { width: 10 } })({ theme: defaultTheme })

Expected behavior

Expected:

[{ width: 10 }]

Current:

["null {", { width: 10 }, "}"]

Link to repl or repo (highly encouraged)

https://codesandbox.io/s/magical-framework-6qjbh?file=/src/App.js