fix: fix disabling styled components when using css func

azat-io · Jul 22, 2024 · d4e8011 · d4e8011
1 parent c8b2fa4
commit d4e8011
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 3 deletions.
diff --git a/rules/sort-objects.ts b/rules/sort-objects.ts
@@ -154,16 +154,19 @@ export default createEslintRule<Options, MESSAGE_ID>({
         let isStyledCallExpression = (identifier: TSESTree.Expression) =>
           identifier.type === 'Identifier' && identifier.name === 'styled'
 
+        let isCssCallExpression = (identifier: TSESTree.Expression) =>
+          identifier.type === 'Identifier' && identifier.name === 'css'
+
         let isStyledComponents = (
           styledNode: TSESTree.Node | undefined,
         ): boolean =>
           styledNode !== undefined &&
           styledNode.type === 'CallExpression' &&
-          ((styledNode.callee.type === 'MemberExpression' &&
-            isStyledCallExpression(styledNode.callee.object)) ||
+          (isCssCallExpression(styledNode.callee) ||
+            (styledNode.callee.type === 'MemberExpression' &&
+              isStyledCallExpression(styledNode.callee.object)) ||
             (styledNode.callee.type === 'CallExpression' &&
               isStyledCallExpression(styledNode.callee.callee)))
-
         if (
           !options.styledComponents &&
           (isStyledComponents(node.parent) ||

diff --git a/test/sort-objects.test.ts b/test/sort-objects.test.ts
@@ -2754,6 +2754,22 @@ describe(RULE_NAME, () => {
               },
             ],
           },
+          {
+            code: dedent`
+              const headerClass = css({
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'space-between',
+                marginTop: '3',
+                gridGap: '8',
+              });
+            `,
+            options: [
+              {
+                styledComponents: false,
+              },
+            ],
+          },
         ],
         invalid: [],
       },