diff --git a/packages/eslint-plugin/__tests__/stylex-valid-shorthands-test.js b/packages/eslint-plugin/__tests__/stylex-valid-shorthands-test.js index 55fd1f1e..85d7f763 100644 --- a/packages/eslint-plugin/__tests__/stylex-valid-shorthands-test.js +++ b/packages/eslint-plugin/__tests__/stylex-valid-shorthands-test.js @@ -758,7 +758,7 @@ eslintTester.run('stylex-valid-shorthands', rule.default, { borderLeftColor: 'var(--fds-gray-40)', }, }) - ` + `, }, { options: [{ preferInline: true }], @@ -804,7 +804,7 @@ eslintTester.run('stylex-valid-shorthands', rule.default, { borderInlineStartColor: 'var(--fds-gray-40)', }, }) - ` + `, }, { code: ` diff --git a/packages/eslint-plugin/src/utils/splitShorthands.js b/packages/eslint-plugin/src/utils/splitShorthands.js index b59e1183..a55574e9 100644 --- a/packages/eslint-plugin/src/utils/splitShorthands.js +++ b/packages/eslint-plugin/src/utils/splitShorthands.js @@ -196,14 +196,18 @@ export function splitSpecificShorthands( right: 'inline-end', }; - // Apply inline transformation to directional properties - const inlineProperties = ['border-width', 'border-color', 'border-style']; + // List directional properties for later inline transform if needed + const directionalProperties = [ + 'border-width', + 'border-color', + 'border-style', + ]; const longformStyle: { [key: string]: number | string } = {}; Object.entries(longform).forEach(([key, val]) => { const newKey = - inlineProperties.includes(property) && + directionalProperties.includes(property) && _preferInline && /-(left|right)/.test(key) ? key.replace( @@ -212,7 +216,6 @@ export function splitSpecificShorthands( ) : key; - // Apply the corrected value, adding spaces or stripping important if necessary const correctedVal = addSpacesAfterCommasInParentheses(val); longformStyle[toCamelCase(newKey)] = allowImportant ? correctedVal