.github/workflows/azure-static-web-apps-delightful-beach-055ecb503.yml

@@ -17,14 +17,13 @@ on:
       - 'v*/dev'
       - 'v*/contrib'
       - 'release/*'
-      - '!dependabot/**'
 
 env:
   NODE_OPTIONS: --max_old_space_size=16384
 
 jobs:
   build_and_deploy_job:
-    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
+    if: github.actor != 'dependabot[bot]' && (github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed'))
     runs-on: ubuntu-latest
     name: Build and Deploy Job
     steps:

.github/workflows/chromatic.yml

@@ -48,15 +48,16 @@ jobs:
         with:
           # pulls all commits (needed for chromatic to find baselines)
           fetch-depth: '0'
-      - name: Use Node.js 20
+      - name: Use Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: 20
+          node-version-file: .nvmrc
+          check-latest: true
           cache: 'npm'
       - name: Install dependencies
         run: npm install
       - name: Publish to Chromatic
-        uses: chromaui/action@v11
+        uses: chromaui/action@latest
         continue-on-error: true
         with:
           token: ${{ secrets.GITHUB_TOKEN }}
@@ -65,3 +66,6 @@ jobs:
           exitOnceUploaded: true
           onlyChanged: true,
           untraced: '.storybook/images/**/*,storyhelpers/**/*'
+          autoAcceptChanges: 'v*/contrib'
+          externals: |
+            .storybook/images/**

.github/workflows/publish.yml

@@ -45,10 +45,11 @@ jobs:
           restore-keys: |
             ${{ runner.os }}-cache-
 
-      - name: Use Node.js 20
+      - name: Use Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: 20
+          node-version-file: .nvmrc
+          check-latest: true
           cache: 'npm'
 
       - run: npm -v

.github/workflows/tests.yml

@@ -17,17 +17,13 @@ env:
 jobs:
   test:
     runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [20]
-
     steps:
       - uses: actions/checkout@v4
-      - name: Use Node.js ${{ matrix.node-version }}
+      - name: Use Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: ${{ matrix.node-version }}
+          node-version-file: .nvmrc
+          check-latest: true
           cache: 'npm'
       - run: npm install
       - run: npm run lint
@@ -37,11 +33,6 @@ jobs:
 
   build:
     runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [20]
-
     steps:
       - uses: actions/checkout@v4
       - name: Cache build setup
@@ -51,10 +42,11 @@ jobs:
           key: ${{ runner.os }}-cache-${{ github.sha }}
           restore-keys: |
             ${{ runner.os }}-cache-
-      - name: Use Node.js ${{ matrix.node-version }}
+      - name: Use Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: ${{ matrix.node-version }}
+          node-version-file: .nvmrc
+          check-latest: true
           cache: 'npm'
       - run: npm install
       - run: npm run build:prod

.storybook/main.ts

@@ -1,13 +1,5 @@
 import type { StorybookConfig } from '@storybook/web-components-vite';
-import { join, dirname } from 'path';
-
-/**
- * This function is used to resolve the absolute path of a package.
- * It is needed in projects that use Yarn PnP or are set up within a monorepo.
- */
-function getAbsolutePath(value: string): any {
-  return dirname(require.resolve(join(value, 'package.json')));
-}
+import remarkGfm from 'remark-gfm';
 
 const config: StorybookConfig = {
   stories: [
@@ -19,18 +11,30 @@ const config: StorybookConfig = {
   staticDirs: ['./images'],
 
   addons: [
-    getAbsolutePath('@storybook/addon-links'),
-    getAbsolutePath('@storybook/addon-essentials'),
-    getAbsolutePath('@chromatic-com/storybook'),
-    getAbsolutePath('@storybook/addon-a11y'),
+    {
+      name: '@storybook/addon-docs',
+      options: {
+        mdxPluginOptions: {
+          mdxCompileOptions: {
+            remarkPlugins: [remarkGfm],
+          },
+        },
+      },
+    },
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@chromatic-com/storybook',
+    '@storybook/addon-a11y',
     '../storyhelpers/storybook-readme',
   ],
 
   framework: {
-    name: getAbsolutePath('@storybook/web-components-vite'),
+    name: '@storybook/web-components-vite',
     options: {},
   },
 
-  docs: {},
+  docs: {
+    autodocs: true,
+  },
 };
 export default config;

.storybook/preview.ts

@@ -2,7 +2,7 @@ import {
   setCustomElementsManifest,
   type Preview,
 } from '@storybook/web-components';
-import '../packages/uui-css/lib/uui-css.css';
+import '../packages/uui-css/dist/uui-css.css';
 import customElements from '../custom-elements.json';
 import { html } from 'lit';
 

eslint.config.mjs

@@ -2,8 +2,8 @@ import globals from 'globals';
 import pluginJs from '@eslint/js';
 import tseslint from 'typescript-eslint';
 import localRules from 'eslint-plugin-local-rules';
-import wcPlugin from 'eslint-plugin-wc';
-import litPlugin from 'eslint-plugin-lit';
+import * as wcPlugin from 'eslint-plugin-wc';
+import * as litPlugin from 'eslint-plugin-lit';
 import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended';
 
 import { includeIgnoreFile } from '@eslint/compat';