diff --git a/.github/workflows/verify-and-publish.yml b/.github/workflows/verify-and-publish.yml
index 5945af3..15fc8be 100644
--- a/.github/workflows/verify-and-publish.yml
+++ b/.github/workflows/verify-and-publish.yml
@@ -17,8 +17,8 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - name: Checkout Project
-        uses: actions/checkout@v3
+      - name: Checkout
+        uses: actions/checkout@v4
         with:
           ref: ${{ github.head_ref }}
           fetch-depth: 0
@@ -35,6 +35,9 @@ jobs:
       - name: Install Root
         run: npm ci
 
+      - name: Build
+        run: npm run build
+
       - name: Lint
         run: npm run lint
 
@@ -47,9 +50,6 @@ jobs:
       - name: Test
         run: npm run test
 
-      - name: Build
-        run: npm run build
-
       - name: Publish to Chromatic
         uses: chromaui/action@latest
         with:
diff --git a/web-components/.storybook/main.cjs b/web-components/.storybook/main.cjs
deleted file mode 100644
index e359c48..0000000
--- a/web-components/.storybook/main.cjs
+++ /dev/null
@@ -1,47 +0,0 @@
-const {
-  dirname,
-  join,
-} = require('path');
-const {
-  mergeConfig,
-} = require('vite');
-const svg = require('vite-plugin-svgo');
-const turbosnap = require('vite-plugin-turbosnap');
-
-module.exports = {
-  stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
-  addons: [getAbsolutePath('@storybook/addon-links'), getAbsolutePath('@storybook/addon-essentials')],
-  framework: {
-    name: getAbsolutePath('@storybook/web-components-vite'),
-    options: {},
-  },
-  async viteFinal(config, {configType}) {
-    return mergeConfig(config, {
-      plugins: [
-        ...(configType === 'PRODUCTION' ? [turbosnap({rootDir: config.root ?? process.cwd()})] : []),
-        svg({
-          plugins: [{
-            name: 'preset-default',
-            params: {
-              overrides: {
-                convertColors: {
-                  currentColor: true,
-                },
-                removeViewBox: false,
-              },
-            },
-          }, {
-            name: 'removeDimensions',
-          }],
-        }),
-      ],
-    });
-  },
-  docs: {
-    autodocs: true,
-  },
-};
-
-function getAbsolutePath(value) {
-  return dirname(require.resolve(join(value, 'package.json')));
-}
diff --git a/web-components/.storybook/main.ts b/web-components/.storybook/main.ts
new file mode 100644
index 0000000..1829af4
--- /dev/null
+++ b/web-components/.storybook/main.ts
@@ -0,0 +1,27 @@
+import { dirname, join } from 'path';
+import { mergeConfig } from 'vite';
+import turbosnap from 'vite-plugin-turbosnap';
+import { StorybookConfig } from '@storybook/web-components-vite';
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
+  addons: [getAbsolutePath('@storybook/addon-links'), getAbsolutePath('@storybook/addon-essentials')],
+  framework: {
+    name: '@storybook/web-components-vite',
+    options: {},
+  },
+  async viteFinal(config, { configType }) {
+    return mergeConfig(config, {
+      plugins: configType === 'PRODUCTION' ? [turbosnap({ rootDir: config.root ?? process.cwd() })] : [],
+    });
+  },
+  docs: {
+    autodocs: true,
+  },
+};
+
+export default config;
+
+function getAbsolutePath(value: string) {
+  return dirname(require.resolve(join(value, 'package.json')));
+}
diff --git a/web-components/.storybook/manager.js b/web-components/.storybook/manager.ts
similarity index 66%
rename from web-components/.storybook/manager.js
rename to web-components/.storybook/manager.ts
index 35190ce..0d2135f 100644
--- a/web-components/.storybook/manager.js
+++ b/web-components/.storybook/manager.ts
@@ -1,5 +1,5 @@
-import {addons} from '@storybook/addons';
-import {themes} from '@storybook/theming';
+import { addons } from '@storybook/addons';
+import { themes } from '@storybook/theming';
 
 addons.setConfig({
   enableShortcuts: false,
diff --git a/web-components/.storybook/preview.js b/web-components/.storybook/preview.ts
similarity index 67%
rename from web-components/.storybook/preview.js
rename to web-components/.storybook/preview.ts
index e20fb37..a20e905 100644
--- a/web-components/.storybook/preview.js
+++ b/web-components/.storybook/preview.ts
@@ -1,13 +1,14 @@
 import 'element-internals-polyfill';
-import {setCustomElementsManifest} from '@storybook/web-components';
+import { setCustomElementsManifest } from '@storybook/web-components';
 import customElements from '../dist/custom-elements.json';
 import '../src/rootStyles/style.css';
 
 customElements?.modules?.forEach((module) => {
   module?.declarations?.forEach(declaration => {
-    Object.keys(declaration).forEach(key => {
-      if (Array.isArray(declaration[key])) {
-        declaration[key] = declaration[key].filter((member) => !member.privacy?.includes('private'));
+    Object.entries(declaration).forEach(([key, value]) => {
+      if (Array.isArray(value)) {
+        // @ts-ignore
+        declaration[key] = value.filter((member) => !member.privacy?.includes('private'));
       }
     });
   });
diff --git a/web-components/tsconfig.json b/web-components/tsconfig.json
index dd86787..f27aa30 100644
--- a/web-components/tsconfig.json
+++ b/web-components/tsconfig.json
@@ -39,6 +39,7 @@
     ]
   },
   "include": [
+    ".storybook/*.ts",
     "**/*.ts"
   ],
   "exclude": [