A new start

.eslintrc.cjs

@@ -0,0 +1,131 @@
+module.exports = {
+    root: true,
+    env: {browser: true, es2020: true},
+    parserOptions: {
+        ecmaVersion: 'latest',
+        // eslint-disable-next-line no-undef
+        tsconfigRootDir: __dirname,
+        sourceType: 'module',
+        project: './tsconfig.linter.json',
+    },
+    settings: {
+        react: {
+            version: 'detect',
+        },
+    },
+    extends: [
+        'eslint:recommended',
+        'plugin:@typescript-eslint/recommended',
+        'plugin:@typescript-eslint/stylistic-type-checked',
+        'plugin:react/recommended',
+        'plugin:react/jsx-runtime',
+        'plugin:react-hooks/recommended',
+        'plugin:ssr-friendly/recommended',
+        'plugin:storybook/recommended',
+        'plugin:prettier/recommended',
+    ],
+    parser: '@typescript-eslint/parser',
+    plugins: ['import', 'prettier', '@typescript-eslint', 'ssr-friendly', 'react-refresh'],
+    rules: {
+        /**
+         * Allow empty arrow functions `() => {}`, while keeping other empty functions restricted
+         * @see https://eslint.org/docs/latest/rules/no-empty-function#allow-arrowfunctions
+         */
+        '@typescript-eslint/no-empty-function': ['error', {allow: ['arrowFunctions']}],
+        '@typescript-eslint/ban-ts-comment': 1,
+        'no-const-assign': 'error',
+        /** Restrict imports from devDependencies since they are not included in library build. peerDependencies are ok */
+        'import/no-extraneous-dependencies': [
+            'error',
+            {
+                devDependencies: false,
+                peerDependencies: true,
+            },
+        ],
+        /**
+         * Enforce import order with empty lines between import group
+         * @see https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/order.md
+         */
+        'import/order': [
+            'error',
+            {
+                groups: ['builtin', 'external', 'internal', ['parent', 'sibling', 'index']],
+                pathGroups: [
+                    {
+                        pattern: '@/**',
+                        group: 'internal',
+                    },
+                ],
+                'newlines-between': 'always',
+            },
+        ],
+        /**
+         * Disallow combined module and type imports like this `import React, {FC} from 'react'`.
+         * Eslint will try to split into type and module imports instead
+         * @see https://typescript-eslint.io/rules/consistent-type-imports/
+         */
+        '@typescript-eslint/consistent-type-imports': 'error',
+        'import/no-cycle': 'error',
+        'prettier/prettier': [
+            'error',
+            {
+                semi: true,
+                singleQuote: true,
+                jsxSingleQuote: false,
+                trailingComma: 'es5',
+                bracketSpacing: false,
+                jsxBracketSameLine: true,
+                arrowParens: 'avoid',
+            },
+        ],
+        'react-refresh/only-export-components': ['warn', {allowConstantExport: true}],
+        '@typescript-eslint/consistent-type-definitions': ['error', 'type'],
+    },
+    overrides: [
+        /* Allow require imports for internal scripts */
+        {
+            files: ['*.js', '*.cjs'],
+            rules: {
+                '@typescript-eslint/no-var-requires': 0,
+            },
+        },
+        /* Allow devDependencies imports for tests and config files */
+        {
+            files: [
+                '**/*.spec.*',
+                '**/testUtils/*.*',
+                '**/*.js',
+                '**/*.cjs',
+                '**/setupTests.ts',
+                '**/*.stories.*',
+                'vite.config.ts',
+            ],
+            rules: {
+                'import/no-extraneous-dependencies': [
+                    'error',
+                    {
+                        devDependencies: true,
+                        peerDependencies: true,
+                    },
+                ],
+            },
+        },
+        /* Disable `environment` directory imports for library files */
+        {
+            files: ['./src/lib/**/*.*'],
+            rules: {
+                'no-restricted-imports': [
+                    'error',
+                    {
+                        patterns: [
+                            {
+                                group: ['**/environment/**'],
+                                message: 'Imports from environment directory are forbidden in the library files.',
+                            },
+                        ],
+                    },
+                ],
+            },
+        },
+    ],
+};

.github/dependabot.yml

@@ -0,0 +1,9 @@
+version: 2
+updates:
+- package-ecosystem: npm
+  directory: "/"
+  schedule:
+    interval: monthly
+    time: "03:00"
+  open-pull-requests-limit: 18
+  versioning-strategy: increase

.github/workflows/merge-jobs.yml

@@ -0,0 +1,38 @@
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: Post-merge tasks
+
+on:
+  push:
+    branches: [ master ]
+
+jobs:
+  build-publish:
+
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v3
+      - uses: pnpm/action-setup@v2
+        with:
+          version: 8
+      - name: Cancel Workflow Action
+        uses: styfle/[email protected]
+        with:
+          access_token: ${{ github.token }}
+      - name: Read .nvmrc
+        run: echo ::set-output name=NVMRC::$(cat .nvmrc)
+        id: nvm
+      - name: Use Node.js ${{ steps.nvm.outputs.NVMRC }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ steps.nvm.outputs.NVMRC }}
+          cache: 'pnpm'
+      - name: Run merge tasks
+        run: |
+          pnpm install
+#      - name: Publish NPM package
+#        uses: JS-DevTools/npm-publish@v3
+#        with:
+#          token: ${{ secrets.NPM_TOKEN }}

.github/workflows/pages.yml

@@ -0,0 +1,57 @@
+# Simple workflow for deploying static content to GitHub Pages
+name: Deploy to GitHub Pages
+
+on:
+  # Runs on pushes targeting the default branch
+  push:
+    branches: ["master"]
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow one concurrent deployment
+concurrency:
+  group: "pages"
+  cancel-in-progress: true
+
+jobs:
+  # Single deploy job since we're just deploying
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+      - name: Read .nvmrc
+        run: echo ::set-output name=NVMRC::$(cat .nvmrc)
+        id: nvm
+      - name: Use Node.js ${{ steps.nvm.outputs.NVMRC }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ steps.nvm.outputs.NVMRC }}
+          cache: 'pnpm'
+      - name: Run deploy tasks
+        run: |
+          pnpm install
+          pnpm run build:docs --quiet
+      - name: Setup Pages
+        uses: actions/configure-pages@v2
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v1
+        with:
+          path: './storybook-static'
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v1

.github/workflows/pull-request-jobs.yml

@@ -0,0 +1,41 @@
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: Node.js CI
+
+on:
+  #  push:
+  #    branches: [ master ]
+  pull_request:
+    branches: [ master ]
+
+jobs:
+  lint-test:
+
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v3
+      - uses: pnpm/action-setup@v2
+        with:
+          version: 8
+      - name: Cancel Workflow Action
+        uses: styfle/[email protected]
+        with:
+          access_token: ${{ github.token }}
+      - name: Read .nvmrc
+        run: echo ::set-output name=NVMRC::$(cat .nvmrc)
+        id: nvm
+      - name: Use Node.js ${{ steps.nvm.outputs.NVMRC }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ steps.nvm.outputs.NVMRC }}
+          cache: 'pnpm'
+      - name: Run test tasks
+        run: |
+          pnpm install
+          pnpm run lint:code --quiet
+          pnpm run lint:style --quiet
+          pnpm run test --silent
+          pnpm run start:docs --smoke-test --quiet
+          pnpm run build

.gitignore

@@ -0,0 +1,25 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+storybook-static

.husky/pre-commit

@@ -0,0 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged
+npm run lint:types

.husky/pre-push

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+#CI=true yarn test --passWithNoTests --silent

.lintstagedrc

@@ -0,0 +1,8 @@
+{
+  "*.{js,ts,tsx}": [
+    "eslint --fix"
+  ],
+  "*.css": [
+    "stylelint --fix --quiet"
+  ]
+}

.nvmrc

@@ -0,0 +1 @@
+v18

.storybook/main.ts

@@ -0,0 +1,25 @@
+import type { StorybookConfig } from '@storybook/react-vite';
+import { withoutVitePlugins } from '@storybook/builder-vite'
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  addons: [
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-interactions',
+  ],
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+  docs: {
+    autodocs: 'tag',
+  },
+  async viteFinal(config) {
+    return {
+      ...config,
+      plugins: await withoutVitePlugins(config.plugins, ['vite:dts']),
+    }
+  },
+};
+export default config;

.storybook/preview.ts

@@ -0,0 +1,15 @@
+import type { Preview } from "@storybook/react";
+
+const preview: Preview = {
+  parameters: {
+    actions: { argTypesRegex: "^on[A-Z].*" },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+};
+
+export default preview;