chore: use vite + vitest (#248)

Author: ValeraS

.github/workflows/ci.yml

@@ -5,15 +5,17 @@ on:
     branches: [main, next]
   pull_request:
 
+concurrency:
+  group: ci-${{ github.event.pull_request.number || github.ref }}
+  cancel-in-progress: true
+
 jobs:
   verify_files:
     name: Verify Files
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
         uses: actions/checkout@v6
-        with:
-          fetch-depth: 0
       - name: Setup Node
         uses: actions/setup-node@v6
         with:
@@ -34,14 +36,13 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v6
-        with:
-          fetch-depth: 0
       - name: Setup Node
         uses: actions/setup-node@v6
         with:
           node-version-file: .nvmrc
           cache: 'npm'
       - name: Install Packages
         run: npm ci
-      - name: Unit Tests
+      - uses: ./.github/actions/setup-playwright
+      - name: Tests
         run: npm run test

.github/workflows/main-preview.yml

@@ -11,8 +11,6 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v6
-        with:
-          fetch-depth: 0
       - name: Setup Node
         uses: actions/setup-node@v6
         with:

.github/workflows/pr-preview-build.yml

@@ -3,6 +3,10 @@ name: PR Preview Build
 on:
   pull_request:
 
+concurrency:
+  group: preview-${{ github.event.pull_request.number }}
+  cancel-in-progress: true
+
 jobs:
   build:
     name: Build

.github/workflows/pr-title.yml

@@ -5,11 +5,10 @@ on:
     types:
       - opened
       - synchronize
-      - reopened
       - edited
 
 concurrency:
-  group: ${{github.workflow}}-${{github.ref}}
+  group: title-${{ github.event.pull_request.number }}
   cancel-in-progress: true
 
 jobs:

.github/workflows/pr-visual-tests-report.yml

@@ -30,12 +30,6 @@ jobs:
           registry-url: 'https://registry.npmjs.org'
       - name: Install Packages
         run: npm ci
-      - name: Lint Files
-        run: npm run lint
-      - name: Typecheck
-        run: npm run typecheck
-      - name: Test
-        run: npm test
       - name: Bump version
         run: |
           echo ${{ github.event.inputs.version }}

.github/workflows/pr-visual-tests.yml

@@ -10,12 +10,10 @@ dist
 storybook-static
 .cache
 
-# Playwright
-playwright-report
-playwright-report-docker
-playwright/.cache-docker
-playwright/.cache/
-test-results
+# Tests
+reports
 
 # System files
 .DS_Store
+
+.vitest-*

.github/workflows/release-beta.yml

@@ -1,62 +1,18 @@
-import {defineMain} from '@storybook/react-webpack5/node';
-import * as sass from 'sass';
+import {defineMain} from '@storybook/react-vite/node';
 
 export default defineMain({
     stories: ['../src/**/*.mdx', '../src/**/*.stories.@(ts|tsx)'],
     addons: [
         '@storybook/addon-docs',
         '@storybook/addon-a11y',
         import.meta.resolve('./theme-addon/theme-preset.ts'),
-        '@storybook/addon-webpack5-compiler-babel',
-        {
-            name: '@storybook/addon-styling-webpack',
-            options: {
-                rules: [
-                    {
-                        test: /\.css$/,
-                        sideEffects: true,
-                        use: ['style-loader', 'css-loader'],
-                    },
-                    {
-                        test: /\.scss$/,
-                        sideEffects: true,
-                        use: [
-                            'style-loader',
-                            {
-                                loader: 'css-loader',
-                                options: {importLoaders: 1},
-                            },
-                            {
-                                loader: 'sass-loader',
-                                options: {implementation: sass},
-                            },
-                        ],
-                    },
-                ],
-            },
-        },
+        '@storybook/addon-vitest',
     ],
-    framework: '@storybook/react-webpack5',
+    framework: {name: '@storybook/react-vite', options: {strictMode: true}},
     typescript: {
-        check: false,
-        checkOptions: {},
         reactDocgen: 'react-docgen-typescript',
     },
     core: {
         disableTelemetry: true,
     },
-    babel: {
-        presets: [
-            [
-                '@babel/preset-env',
-                {
-                    targets: {
-                        chrome: 100,
-                    },
-                },
-            ],
-            '@babel/preset-typescript',
-            ['@babel/preset-react', {runtime: 'automatic'}],
-        ],
-    },
 });

.gitignore

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