[eslint-plugin] Skip single-value flex in valid-shorthands

[henryqdineen]

What changed / motivation ?

Single-value flex usages (flex: 1, flex: 'auto', flex: 'none') are incorrectly flagged as errors by valid-shorthands, with an autofix that expands them to flexGrow/flexShrink/flexBasis. This is inconsistent with the rule's stated purpose — enforcing single-value shorthands and longhands over multi-value shorthands — and inconsistent with how every other property in the rule behaves (border: 'none', margin: '8px' are both allowed).

The root cause is the same as the gap issue fixed in #1668: the flex shorthand alias expands even single values (e.g. flex: 1 → flexGrow/flexShrink/flexBasis). Unlike other shorthands where a single value passes through unchanged, flex: 1 expands to different values, so the existing same-key same-value check doesn't catch it. The post-transformer approach used in #1668 for gap doesn't work here either — gap's two output values happen to equal the original input, but flex's three output values don't.

This PR adds an isSingleToken utility to splitShorthands.js that checks whether a CSS value is a single top-level token before calling the transformer. It correctly handles var(), calc(), and !important. Multi-value flex (flex: '1 0 auto', flex: '1 0') still correctly flags and expands.

Linked PR/Issues

Follow-up to #1537, #1668.

Additional Context

6 single-value flex test cases moved from invalid to valid. All 546 tests pass.

Pre-flight checklist

• I have read the contributing guidelines
  Contribution Guidelines
• Performed a self-review of my code

[vercel]

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

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
stylex	Skipped		May 17, 2026 2:01am

[skovhus]

Thanks for fixing this. We never upgraded the linter due to this restriction.