[babel-plugin] group css rules by media query

[mellyeliu]

Adds support for grouping rules under the same media query into a single block.

• Single-rule groups are emitted inline while multi-rule groups use newlines
• Rule ordering within each media query group follows the global priority sort that already exists
  • When CSS layers are enabled, grouping is scoped to each layer
  • When layers are disabled and selector hacks used, grouping is global
• This produces a small size win across the outputted CSS bundle

The broader function could probably broadly use a refactor as it tackles a lot of things

[github-actions]

workflow: benchmarks/perf

Comparison of performance test results, measured in operations per second. Larger is better.

[email protected] compare
node ./compare.js /tmp/tmp.TRSAqeuqQ6 /tmp/tmp.h4AmkE5DL5

Results	Base	Patch	Ratio
babel-plugin: stylex.create
· basic create	627	648	1.03	+
· complex create	201	194	0.97	-
babel-plugin: stylex.createTheme
· basic themes	467	464	0.99	-
· complex themes	44	44	1.00

[github-actions]

workflow: benchmarks/size

Comparison of minified (terser) and compressed (brotli) size results, measured in bytes. Smaller is better.

[email protected] compare
node ./compare.js /tmp/tmp.CoaTvs5vQq /tmp/tmp.32rL5m9kvR

Results	Base	Patch	Ratio
@stylexjs/stylex/lib/cjs/stylex.js
· compressed	1,190	1,190	1.00
· minified	3,541	3,541	1.00
@stylexjs/stylex/lib/cjs/inject.js
· compressed	1,223	1,223	1.00
· minified	3,216	3,216	1.00
benchmarks/size/.build/bundle.js
· compressed	496,650	496,650	1.00
· minified	4,847,840	4,847,840	1.00
benchmarks/size/.build/stylex.css
· compressed	99,853	98,412	0.99	-
· minified	747,541	717,302	0.96	-