chore(biome): activate sort import

.storybook/components/DocsContainer.tsx

@@ -1,11 +1,11 @@
-import { isValidElement, cloneElement, ReactNode } from 'react'
+import { Global, ThemeProvider } from '@emotion/react'
 import {
   DocsContainer as BaseContainer,
   DocsContainerProps as BaseContainerProps,
   Unstyled,
 } from '@storybook/blocks'
-import { Global, ThemeProvider } from '@emotion/react'
 import { consoleLightTheme as lightTheme } from '@ultraviolet/themes'
+import { ReactNode, cloneElement, isValidElement } from 'react'
 import { globalStyles } from './globalStyle'
 import '@ultraviolet/fonts/fonts.css'
 
@@ -34,6 +34,7 @@ type ExtraProps = {
 
 type DocsContainerProps = BaseContainerProps & {
   context?: {
+    // biome-ignore lint/suspicious/noExplicitAny: <explanation>
     attachedCSFFiles: Set<any>
   }
 } & { children: ReactNode }

.storybook/components/Page.tsx

@@ -1,14 +1,14 @@
+import styled from '@emotion/styled'
+import { linkTo } from '@storybook/addon-links'
 import {
-  Title,
-  Subtitle,
+  Controls,
   Description,
   Primary,
-  Controls,
   Stories,
+  Subtitle,
+  Title,
 } from '@storybook/blocks'
-import { Alert, Text, Stack } from '@ultraviolet/ui'
-import styled from '@emotion/styled'
-import { linkTo } from '@storybook/addon-links'
+import { Alert, Stack, Text } from '@ultraviolet/ui'
 import background from '../assets/brand-background.png'
 
 const TitleDecorator = styled.div`

.storybook/components/globalStyle.ts

@@ -1,6 +1,6 @@
-import { normalize } from '@ultraviolet/ui'
 import { css } from '@emotion/react'
-import lightTheme from '../../packages/ui/src/theme'
+import { normalize } from '@ultraviolet/ui'
+import {space, colors} from '../../packages/ui/src/theme'
 
 export const globalStyles = css`
   ${normalize()}
@@ -10,11 +10,11 @@ export const globalStyles = css`
   }
 
   h1 {
-    margin: ${lightTheme.space['5']} 0;
+    margin: ${space['5']} 0;
   }
 
   h2, h3, h4, h5, h6 {
-    margin: ${lightTheme.space['2']} 0 ${lightTheme.space['1']} 0;
+    margin: ${space['2']} 0 ${space['1']} 0;
   }
 
   .sb-anchor h1, .sb-anchor h2, .sb-anchor h3, .sb-anchor h4, .sb-anchor h5, .sb-anchor h6 {
@@ -26,14 +26,14 @@ export const globalStyles = css`
       font-size: 16px;
       font-weight: 400;
       line-height: 24px;
-      color: ${lightTheme.colors.neutral.text};
+      color: ${colors.neutral.text};
   }
 
   .toc-list-item::before {
-    border-color: ${lightTheme.colors.primary.border} !important;
+    border-color: ${colors.primary.border} !important;
   }
 
   .toc-list-item.is-active-li>a {
-    color: ${lightTheme.colors.primary.text} !important;
+    color: ${colors.primary.text} !important;
   }
 `

.storybook/manager.ts

@@ -1,6 +1,6 @@
 import { addons } from '@storybook/manager-api'
-import { light } from './storybookThemes'
 import { consoleLightTheme } from '@ultraviolet/themes'
+import { light } from './storybookThemes'
 
 addons.setConfig({
   theme: light,

.storybook/preview.tsx

@@ -1,16 +1,16 @@
+import { Global, ThemeProvider } from '@emotion/react'
+import { withThemeFromJSXProvider } from '@storybook/addon-themes'
 import type { Preview, StoryFn } from '@storybook/react'
-import { ThemeProvider, Global } from '@emotion/react'
 import { themes } from '@storybook/theming'
-import { light, dark } from './storybookThemes'
 import {
   consoleDarkTheme as darkTheme,
-  consoleLightTheme as lightTheme,
   consoleDarkerTheme as darkerTheme,
+  consoleLightTheme as lightTheme,
 } from '@ultraviolet/themes'
 import DocsContainer from './components/DocsContainer'
 import Page from './components/Page'
-import { withThemeFromJSXProvider } from '@storybook/addon-themes'
 import { globalStyles } from './components/globalStyle'
+import { dark, light } from './storybookThemes'
 import '@ultraviolet/fonts/fonts.css'
 
 const parameters: Preview['parameters'] = {

.storybook/storybookThemes.ts

@@ -1,8 +1,8 @@
 import { create } from '@storybook/theming'
-import lightBrandImage from './assets/scaleway-text-light.png'
-import logoLight from './assets/logo-light.png'
-import logoDark from './assets/logo-dark.png'
 import lightTheme, { darkTheme } from '../packages/ui/src/theme'
+import logoDark from './assets/logo-dark.png'
+import logoLight from './assets/logo-light.png'
+import lightBrandImage from './assets/scaleway-text-light.png'
 
 enum Base {
   LIGHT = 'light',

.storybook/vite.config.ts

@@ -1,7 +1,7 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-import svgr from '@svgr/rollup'
 import { resolve } from 'path'
+import svgr from '@svgr/rollup'
+import react from '@vitejs/plugin-react'
+import { defineConfig } from 'vite'
 
 // https://vitejs.dev/config/
 export default defineConfig({

biome.json

@@ -1,7 +1,7 @@
 {
   "$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
   "organizeImports": {
-    "enabled": false
+    "enabled": true
   },
   "linter": {
     "enabled": false
@@ -21,7 +21,8 @@
       "**/package.json",
       "**/CHANGELOG.md",
       "*.snap",
-      "**/__snapshots__/"
+      "**/__snapshots__/",
+      ".storybook/**"
     ]
   },
   "formatter": {

eslint.config.mjs

@@ -1,19 +1,26 @@
+import path from 'node:path'
+import { fileURLToPath } from 'node:url'
 import babelParser from '@babel/eslint-parser'
-import { fixupConfigRules } from '@eslint/compat'
-import { FlatCompat } from '@eslint/eslintrc'
 import scwEmotion from '@scaleway/eslint-config-react/emotion'
 import scwJavascript from '@scaleway/eslint-config-react/javascript'
 import scwTypescript from '@scaleway/eslint-config-react/typescript'
 import oxlint from 'eslint-plugin-oxlint'
+import testingLibrary from 'eslint-plugin-testing-library'
 import globals from 'globals'
-import path from 'node:path'
-import { fileURLToPath } from 'node:url'
 
 const filename = fileURLToPath(import.meta.url)
 const dirname = path.dirname(filename)
-const compat = new FlatCompat({
-  baseDirectory: dirname,
-})
+
+const disableRules = {
+  // ---- biome rules ----
+  'import/order': 'off',
+  'import/no-unresolved': 'off',
+
+  // to check
+  'react/no-unused-prop-types': 'off',
+  'react/jsx-props-no-spreading': 'warn',
+  '@typescript-eslint/no-unnecessary-condition': 'off',
+}
 
 export default [
   {
@@ -36,26 +43,42 @@ export default [
       globals: {
         ...globals.browser,
       },
+
+      ecmaVersion: 'latest',
+      sourceType: 'module',
+
+      parserOptions: {
+        tsconfigRootDir: dirname,
+        project: [
+          'tsconfig.json',
+          'packages/*/tsconfig.json',
+          'tools/*/tsconfig.json',
+        ],
+      },
+    },
+
+    settings: {
+      'import/resolver': {
+        node: {
+          extensions: ['.json', '.ts', '.tsx', '.d.ts'],
+          moduleDirectory: ['node_modules', 'src'],
+        },
+      },
     },
   },
   ...[...scwJavascript, ...scwEmotion].map(config => ({
     ...config,
+    languageOptions: {
+      parser: babelParser,
+    },
     files: ['**/*.js', '**/*.mjs'],
     rules: {
       ...config.rules,
-      'import/no-unresolved': 'off',
+      ...disableRules,
     },
   })),
   {
-    files: ['**/*.js', '**/*.mjs'],
-
-    languageOptions: {
-      parser: babelParser,
-    },
-  },
-  {
-    files: ['**/*.ts', '**/*.tsx'],
-
+    files: ['**/*.{ts,tsx}'],
     languageOptions: {
       ecmaVersion: 5,
       sourceType: 'script',
@@ -68,9 +91,10 @@ export default [
 
   ...[...scwTypescript, ...scwEmotion].map(config => ({
     ...config,
-    files: ['**/*.ts', '**/*.tsx'],
+    files: ['**/*.{ts,tsx}'],
     rules: {
       ...config.rules,
+      ...disableRules,
       'react/jsx-props-no-spreading': 'warn',
       '@typescript-eslint/no-unnecessary-condition': 'off',
     },
@@ -112,30 +136,28 @@ export default [
       '**/vite.config.*',
       'utils/test/**/*.{ts,tsx}',
       '**/vitest.setup.ts',
+      '.storybook/**',
     ],
 
     rules: {
       ...config.rules,
+      ...disableRules,
       'no-console': 'off',
       'no-alert': 'off',
       'react/jsx-props-no-spreading': 'off',
       'react/no-unstable-nested-components': 'off',
-      '@typescript-eslint/no-unnecessary-condition': 'off',
       'react/jsx-key': 'off',
       'import/no-extraneous-dependencies': 'off',
       'import/no-relative-packages': 'off',
-      'eslint-plugin-import/no-relative-packages': 'off',
+
+      '@typescript-eslint/no-unnecessary-condition': 'off',
+      'typescript-eslint/no-explicit-any': 'off',
       '@typescript-eslint/no-unsafe-call': 'off',
       '@typescript-eslint/no-unsafe-member-access': 'off',
       '@typescript-eslint/no-unsafe-return': 'off',
     },
   })),
-  ...fixupConfigRules(
-    compat.extends('plugin:testing-library/react').map(config => ({
-      ...config,
-      files: ['**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[jt]s?(x)'],
-    })),
-  ),
+
   {
     files: ['**/*.d.ts', '**/vite.config.ts'],
 
@@ -150,5 +172,13 @@ export default [
       'react/jsx-props-no-spreading': 'off',
     },
   },
+  {
+    files: [
+      '!**/e2e/**',
+      '**/__tests__/**/*.ts?(x)',
+      '**/(*.)+(spec|test).ts?(x)',
+    ],
+    ...testingLibrary.configs['flat/react'],
+  },
   oxlint.configs['flat/all'],
 ]

examples/next-login/src/pages/home/index.tsx

@@ -1,8 +1,8 @@
+import styled from '@emotion/styled'
+import { Stack, SwitchButton } from '@ultraviolet/ui'
 import { useState } from 'react'
 import LogIn from './login'
 import SignUp from './signup'
-import { Stack, SwitchButton } from '@ultraviolet/ui'
-import styled from '@emotion/styled'
 
 const StyledSwitchButton = styled(SwitchButton)`
   margin: auto;

examples/next-login/src/pages/home/login.tsx

@@ -1,5 +1,4 @@
-import { Link, Stack, Text } from '@ultraviolet/ui'
-import { IdIcon } from '@ultraviolet/icons'
+import styled from '@emotion/styled'
 import {
   CheckboxField,
   Form,
@@ -8,8 +7,9 @@ import {
   useForm,
   useWatch,
 } from '@ultraviolet/form'
+import { IdIcon } from '@ultraviolet/icons'
+import { Link, Stack, Text } from '@ultraviolet/ui'
 import { useState } from 'react'
-import styled from '@emotion/styled'
 import { EMAIL_REGEX, mockErrors } from '../../constants'
 
 type FormValues = {

examples/next-login/src/pages/home/signup.tsx

@@ -1,5 +1,4 @@
-import { Alert, Stack, Text } from '@ultraviolet/ui'
-import { ProfileIcon } from '@ultraviolet/icons'
+import styled from '@emotion/styled'
 import {
   DateField,
   Form,
@@ -9,8 +8,9 @@ import {
   useForm,
   useWatch,
 } from '@ultraviolet/form'
+import { ProfileIcon } from '@ultraviolet/icons'
+import { Alert, Stack, Text } from '@ultraviolet/ui'
 import { useState } from 'react'
-import styled from '@emotion/styled'
 import { EMAIL_REGEX, mockErrors } from '../../constants'
 
 type FormValues = {