feat: add side-effect-style import group

Author: azat-io

docs/rules/sort-imports.md

@@ -99,6 +99,7 @@ type Group =
   | 'parent'
   | 'sibling'
   | 'side-effect'
+  | 'side-effect-style'
   | 'index'
   | 'object'
   | 'style'
@@ -170,6 +171,8 @@ import formatNumber from '../utils/format-number'
 import config from './config'
 // 'side-effect' - Side effect imports
 import './set-production-env.js'
+// side-effect-style - Side effect style imports
+import './styles.scss'
 // 'index' - Main file from the current directory
 import main from '.'
 // 'object' - TypeScript object-imports

rules/sort-imports.ts

@@ -32,6 +32,7 @@ export enum NewlinesBetweenValue {
 }
 
 type Group<T extends string[]> =
+  | 'side-effect-style'
   | 'external-type'
   | 'internal-type'
   | 'builtin-type'
@@ -308,6 +309,10 @@ export default createEslintRule<Options<string[]>, MESSAGE_ID>({
       if (node.type === 'ImportDeclaration') {
         setCustomGroups(options['custom-groups'].value, node.source.value)
 
+        if (isSideEffectImport(node) && isStyle(node.source.value)) {
+          defineGroup('side-effect-style')
+        }
+
         if (isSideEffectImport(node)) {
           defineGroup('side-effect')
         }

test/sort-imports.test.ts

@@ -3736,10 +3736,12 @@ describe(RULE_NAME, () => {
               import { useClient } from '~/hooks/useClient'
 
               import '~/css/globals.css'
+
+              import '~/data'
             `,
             options: [
               {
-                groups: ['internal', 'side-effect'],
+                groups: ['internal', 'side-effect-style', 'side-effect'],
               },
             ],
           },
@@ -3748,24 +3750,27 @@ describe(RULE_NAME, () => {
           {
             code: dedent`
               import { useClient } from '~/hooks/useClient'
+              import '~/data'
               import '~/css/globals.css'
             `,
             output: dedent`
               import { useClient } from '~/hooks/useClient'
 
               import '~/css/globals.css'
+
+              import '~/data'
             `,
             options: [
               {
-                groups: ['internal', 'side-effect'],
+                groups: ['internal', 'side-effect-style', 'side-effect'],
               },
             ],
             errors: [
               {
                 messageId: 'missedSpacingBetweenImports',
                 data: {
                   left: '~/hooks/useClient',
-                  right: '~/css/globals.css',
+                  right: '~/data',
                 },
               },
             ],