Skip to content

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

Open
abhakat wants to merge 1 commit intomainfrom
logical-border-shorthand-autofix
Open

[eslint-plugin] Add logical border shorthand expansion to stylex-valid-shorthands#1585
abhakat wants to merge 1 commit intomainfrom
logical-border-shorthand-autofix

Conversation

@abhakat
Copy link
Copy Markdown
Contributor

@abhakat abhakat commented Apr 6, 2026

Expand logical border shorthands (borderInlineEnd, borderBlockStart, borderInline,
borderBlockColor, etc.) into their longhand equivalents. Reuses the existing
expandBorderSideShorthand and parseBorderParts helpers for 3-part border-side shorthands,
and adds a new handler for 2-value border-axis shorthands.

Stack: 1/7

What changed / motivation ?

The rule already handled borderTop/Right/Bottom/Left but was missing the logical
(inline/block) variants.

Border-side shorthands (3-part width/style/color expansion):

  • borderInlineEnd: '1px solid red'borderInlineEndWidth + borderInlineEndStyle + borderInlineEndColor
  • Same for borderInlineStart, borderBlockEnd, borderBlockStart, borderInline, borderBlock

Border-axis shorthands (2-value start/end expansion):

  • borderInlineColor: 'red blue'borderInlineStartColor + borderInlineEndColor
  • Same for borderInlineStyle/Width, borderBlockColor/Style/Width

Single values pass through unchanged. Incomplete borders (e.g. missing color) return CANNOT_FIX.

Linked PR/Issues

Follow-up to #1553

Additional Context

Added tests covering: 3-part border expansion, 2-value axis expansion, rgba() colors,
!important propagation, incomplete borders (CANNOT_FIX), single-value passthrough.

Pre-flight checklist

…d-shorthands

Expand logical border shorthands into their longhand equivalents. These
properties currently hard-error in stylex-valid-styles via showError with
no autofix path.

Tier 1 — 3-part border expansion (width/style/color):
  borderInlineEnd, borderInlineStart, borderBlockEnd, borderBlockStart,
  borderInline, borderBlock

Tier 2 — 2-value sub-shorthand expansion (start/end):
  borderInlineColor, borderInlineStyle, borderInlineWidth,
  borderBlockColor, borderBlockStyle, borderBlockWidth
@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 Apr 6, 2026
@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 6, 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 6, 2026 6:28pm

Request Review

@github-actions
Copy link
Copy Markdown

github-actions Bot commented Apr 6, 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.9FnkqW5n64 /tmp/tmp.dAiulxkgVf

Results Base Patch Ratio
babel-plugin: stylex.create
· basic create 532 516 0.97 -
· complex create 64 63 0.98 -
babel-plugin: stylex.createTheme
· basic themes 428 430 1.00 +
· complex themes 33 34 1.03 +
Done in 0.09s.
Done in 0.33s.

@github-actions
Copy link
Copy Markdown

github-actions Bot commented Apr 6, 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.MDoeEpFgQj /tmp/tmp.8XjB0PT0jR

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.08s.
Done in 0.32s.

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.

1 participant