microsoft / griffel

CSS-in-JS with ahead-of-time compilation ⚡️
https://griffel.js.org
MIT License
1.2k stars 61 forks source link

feat: add support for shorthands #544

Closed layershifter closed 6 months ago

layershifter commented 7 months ago

This PR adds support for the most of CSS shorthands into @griffel/core.

See #531 for the explainer. Bundle size is increased as now bundle shorthand definitions, however the increase happens only for runtime version.

github-actions[bot] commented 7 months ago

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
core
makeStyles (runtime)
21.852 kB
8.301 kB
25.905 kB
9.238 kB
4.053 kB
937 B
react
makeStyles (runtime)
24.357 kB
9.275 kB
28.41 kB
10.227 kB
4.053 kB
952 B
Unchanged fixtures | Package & Exports | Size (minified/GZIP) | | -------------------------------------------------------------------------------------------------------------------------- | -------------------------: | | core
\_\_resetStyles (makeResetStyles) | `273 B`
`197 B` | | core
\_\_styles (makeStyles) | `1.727 kB`
`832 B` | | core
makeResetStyles (runtime) | `17.14 kB`
`6.569 kB` | | core
mergeClasses | `1.865 kB`
`900 B` | | core
shorthands.padding() | `4.781 kB`
`1.537 kB` | | react
\_\_css | `1.723 kB`
`812 B` | | react
\_\_styles | `4.187 kB`
`1.832 kB` | | react
makeResetStyles (runtime) | `19.64 kB`
`7.562 kB` | | react
makeStaticStyles (runtime) | `9.576 kB`
`4.182 kB` | | shadow-dom
createShadowDOMRenderer | `4.085 kB`
`1.724 kB` |

🤖 This report was generated against b4ed7ac5ab5b490e7a1b38a214c92af359aa3206