Skip to content

[eslint-plugin] Add border shorthand expansion to stylex-valid-shorthands#1553

Merged
abhakat merged 1 commit intomainfrom
border-shorthand-autofix
Apr 3, 2026
Merged

[eslint-plugin] Add border shorthand expansion to stylex-valid-shorthands#1553
abhakat merged 1 commit intomainfrom
border-shorthand-autofix

Conversation

@abhakat
Copy link
Copy Markdown
Contributor

@abhakat abhakat commented Mar 25, 2026

Expand border: '<width> <style> <color>' into borderWidth, borderStyle, and borderColor
longhands. Reuses the existing expandBorderSideShorthand and parseBorderParts helpers.
Also adds borderStartborderInlineStart and borderEndborderInlineEnd as legacy
name renames.

What changed / motivation ?

The rule already handled borderTop, borderRight, borderBottom, borderLeft but was missing
the base border shorthand. Incomplete borders (e.g. border: '1px solid' with missing color)
correctly report an error without autofix (CANNOT_FIX).

  • border: '1px solid red'borderWidth: '1px' + borderStyle: 'solid' + borderColor: 'red'
  • border: 'none' → passes through (single value, no expansion needed)
  • border: '1px solid' → error, no autofix (missing color)
  • borderStartborderInlineStart (legacy rename)
  • borderEndborderInlineEnd (legacy rename)

Linked PR/Issues

Follow-up to #1477

Additional Context

Added tests covering: full 3-part expansion, rgba() colors, !important propagation,
incomplete borders (CANNOT_FIX), single-value passthrough, separate legacy rename tests.

Pre-flight checklist

@vercel
Copy link
Copy Markdown

vercel Bot commented Mar 25, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
stylex Skipped Skipped Apr 3, 2026 7:20am

Request Review

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Mar 25, 2026
@github-actions
Copy link
Copy Markdown

github-actions Bot commented Mar 25, 2026

workflow: benchmarks/perf

Comparison of performance test results, measured in operations per second. Larger is better.
yarn workspace v1.22.22
yarn run v1.22.22
$ node ./compare.js /tmp/tmp.MtmDeTNzZj /tmp/tmp.iTRFmmR9K6

Results Base Patch Ratio
babel-plugin: stylex.create
· basic create 541 540 1.00 -
· complex create 66 67 1.02 +
babel-plugin: stylex.createTheme
· basic themes 430 441 1.03 +
· complex themes 34 34 1.00
Done in 0.08s.
Done in 0.34s.

@github-actions
Copy link
Copy Markdown

github-actions Bot commented Mar 25, 2026

workflow: benchmarks/size

Comparison of minified (terser) and compressed (brotli) size results, measured in bytes. Smaller is better.
yarn workspace v1.22.22
yarn run v1.22.22
$ node ./compare.js /tmp/tmp.JwVKfHaihF /tmp/tmp.0nYL23TfmM

Results Base Patch Ratio
@stylexjs/stylex/lib/cjs/stylex.js
· compressed 1,441 1,441 1.00
· minified 4,386 4,386 1.00
@stylexjs/stylex/lib/cjs/inject.js
· compressed 1,793 1,793 1.00
· minified 4,915 4,915 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,653 99,653 1.00
· minified 747,850 747,850 1.00
Done in 0.09s.
Done in 0.34s.

…ands

Expand border: '<width> <style> <color>' into borderWidth, borderStyle,
and borderColor longhands. Reuses the existing expandBorderSideShorthand
and parseBorderParts helpers. Incomplete borders (e.g. missing color)
report an error without autofix. Also adds borderStart → borderInlineStart
and borderEnd → borderInlineEnd legacy renames.
@abhakat abhakat force-pushed the border-shorthand-autofix branch from f90663f to b3b8173 Compare April 3, 2026 07:20
@abhakat abhakat merged commit e0d8ad4 into main Apr 3, 2026
13 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants