feat!: update to uikit@5, node@18, storybook@7; remove assets (#116)

* feat!: update to uikit@5, node@18, storybook@7; remove assets

* chore(build): fix preview build

Author: d3m1d0v

.babelrc

@@ -0,0 +1,16 @@
+{
+    "sourceType": "unambiguous",
+    "presets": [
+        [
+            "@babel/preset-env",
+            {
+                "targets": {
+                    "chrome": 100
+                }
+            }
+        ],
+        "@babel/preset-typescript",
+        "@babel/preset-react"
+    ],
+    "plugins": []
+}

.github/workflows/ci.yml

@@ -18,7 +18,7 @@ jobs:
       - name: Setup Node
         uses: actions/setup-node@v2
         with:
-          node-version: '14.x'
+          node-version: '18.x'
           cache: 'npm'
       - name: Install Packages
         run: npm ci

.github/workflows/main-preview.yml

@@ -16,7 +16,7 @@ jobs:
     - name: Setup Node
       uses: actions/setup-node@v2
       with:
-        node-version: 14
+        node-version: 18
     - name: Install Packages
       run: npm ci
       shell: bash

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

@@ -8,6 +8,32 @@ jobs:
     name: Build
     runs-on: ubuntu-latest
     steps:
-    - uses: yandex-cloud/ui-preview-build-action@main
-      env:
-        TS_NODE_PROJECT: .storybook/tsconfig.json
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: Setup Node
+        uses: actions/setup-node@v2
+        with:
+          node-version: 18
+      - name: Install Packages
+        run: npm ci
+        shell: bash
+      - name: Build Storybook
+        run: npm run storybook:build
+        shell: bash
+      - name: Create Static Artifact
+        uses: actions/upload-artifact@v2
+        with:
+          name: static
+          path: ./storybook-static
+      - name: Save PR ID
+        run: |
+          pr="${{ github.event.pull_request.number }}"
+          echo $pr > ./pr-id.txt
+        shell: bash
+      - name: Create PR Artifact
+        uses: actions/upload-artifact@v2
+        with:
+          name: pr
+          path: ./pr-id.txt

.github/workflows/release.yml

@@ -12,4 +12,4 @@ jobs:
         with:
           github-token: ${{ secrets.YC_UI_BOT_GITHUB_TOKEN }}
           npm-token: ${{ secrets.YC_UI_BOT_NPM_TOKEN }}
-          node-version: 14
+          node-version: 18

.nvmrc

@@ -1 +1 @@
-14.20
+18

.storybook/main.js

@@ -0,0 +1,18 @@
+import type {StorybookConfig} from '@storybook/react-webpack5';
+
+const config:StorybookConfig = {
+    framework: {
+        name: '@storybook/react-webpack5',
+        options: {fastRefresh: true},
+    },
+    stories: ['../demo/**/*.stories.@(js|jsx|ts|tsx)'],
+    addons: [
+        '@storybook/preset-scss',
+        {name: '@storybook/addon-essentials', options: {backgrounds: false}},
+    ],
+    typescript: {
+        check: true,
+    },
+};
+
+export default config;

.storybook/main.ts

@@ -0,0 +1,42 @@
+import type {Preview} from '@storybook/react';
+import {MINIMAL_VIEWPORTS} from '@storybook/addon-viewport';
+
+import {withThemeProvider, withLang, backgrounds} from '../demo/utils/preview';
+
+const preview: Preview = {
+    decorators: [withThemeProvider, withLang],
+    parameters: {
+        jsx: {showFunctions: true}, // To show functions in sources
+        viewport: {
+            viewports: MINIMAL_VIEWPORTS,
+        },
+    },
+    globalTypes: {
+        theme: {
+            defaultValue: 'light',
+            toolbar: {
+                title: 'Theme',
+                icon: 'mirror',
+                items: [
+                    {value: 'light', right: '☼', title: 'Light'},
+                    {value: 'dark', right: '☾', title: 'Dark'},
+                    {value: 'light-hc', right: '☼', title: 'High Contrast Light (beta)'},
+                    {value: 'dark-hc', right: '☾', title: 'High Contrast Dark (beta)'},
+                ],
+            },
+        },
+        lang: {
+            defaultValue: 'en',
+            toolbar: {
+                title: 'Language',
+                icon: 'globe',
+                items: [
+                    {value: 'en', right: '🇬🇧', title: 'En'},
+                    {value: 'ru', right: '🇷🇺', title: 'Ru'},
+                ],
+            },
+        },
+    },
+};
+
+export default preview;