From cedbd9f41305b97e0e4e0c224f98609d2f3b7ae6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Oliver=20Sch=C3=BCrch?= <oliver.schuerch@post.ch>
Date: Wed, 12 Jun 2024 13:10:42 +0200
Subject: [PATCH] chore(documentation): add linting for documentation package
 (#3128)

---
 .../post-card-control/post-card-control.tsx   |   3 +-
 packages/documentation/.eslintrc.js           |  55 +
 packages/documentation/package.json           |   9 +-
 .../src/shared/tile/tile.component.ts         |   2 +-
 .../components/accordion/accordion.stories.ts |   4 +-
 .../alert/standard-html/alert.stories.ts      |   3 +-
 .../button-group/button-group.stories.ts      |   2 +-
 .../components/button/button.stories.ts       |  14 +-
 .../cards/card-button/card-button.stories.ts  |   2 +-
 .../components/cards/card/card.stories.ts     |  16 +-
 .../product-card/product-card.stories.ts      |  24 +-
 .../stories/components/chip/chip.stories.ts   |   6 +-
 .../collapsible.snapshot.stories.ts           |   2 +-
 .../card-control.snapshot.stories.ts          |   4 +-
 .../standard-html/card-control.stories.ts     |   6 +-
 .../web-component/card-control.stories.ts     |  15 +-
 .../forms/checkbox/checkbox.stories.ts        |   2 +-
 .../forms/input/input.snapshot.stories.ts     |   2 +-
 .../components/forms/switch/switch.stories.ts |   2 +-
 .../textarea/textarea.snapshot.stories.ts     |   2 +-
 .../stories/components/icons/icon.stories.ts  |  47 +-
 .../breadcrumbs/breadcrumbs.stories.ts        |   6 +-
 .../internet-header/footer/footer.stories.ts  |   6 +-
 .../components/spinner/spinner.stories.ts     |   8 +-
 .../subnavigation/subnavigation.stories.ts    |  11 +-
 .../stories/components/tabs/tabs.stories.ts   |   4 +-
 .../tag/standard-html/tag.stories.ts          |   1 +
 .../tag/web-component/post-tag.stories.ts     |  17 +-
 .../stories/components/toast/toast.stories.ts |   6 +-
 .../stories/foundation/color/color.blocks.tsx |   1 +
 .../stories/foundation/color/color.docs.mdx   |  32 +-
 .../foundation/elevation/elevation.blocks.tsx |   3 +-
 .../foundation/elevation/elevation.docs.mdx   |   4 +-
 .../layout/breakpoints/breakpoints.blocks.tsx |  21 +-
 .../layout/containers/containers.blocks.tsx   |  25 +-
 .../foundation/layout/grid/grid.blocks.tsx    |  19 +-
 .../foundation/layout/grid/grid.docs.mdx      |   8 +-
 .../foundation/layout/shared.blocks.tsx       |  20 +-
 .../typography/typography.blocks.tsx          |  39 +-
 .../stories/getting-started/list-component.ts |   2 +-
 .../migrationv4-5-manual-list.component.ts    |   2 +-
 .../getting-started/migration-guide/types.ts  |   2 +-
 .../migration-guide/util/persist.util.ts      |  15 +-
 .../error-page/error-page.stories.ts          |   4 +-
 .../utilities/background/background.docs.mdx  |  16 +-
 .../utilities/spacing/spacing.docs.mdx        |   6 +-
 .../utilities/spacing/spacing.stories.ts      |  11 +-
 .../stories/utilities/text/text.blocks.tsx    |   5 +-
 packages/documentation/src/utils/bomb-args.ts |  10 +-
 .../src/utils/codeOrSourceMdx.tsx             |   1 +
 .../documentation/src/utils/get-attributes.ts |   6 +-
 .../utils/inputComponentsGetCombinations.ts   |   8 +-
 packages/documentation/src/utils/react.ts     |  12 +-
 .../documentation/src/utils/spread-args.ts    |  34 +-
 packages/documentation/src/utils/version.ts   |  41 +-
 packages/documentation/tsconfig.eslint.json   |   5 +
 packages/documentation/types/json.ts          |   2 +-
 packages/documentation/types/storybook.ts     |   2 +-
 pnpm-lock.yaml                                | 987 ++++++++++++++++++
 59 files changed, 1364 insertions(+), 260 deletions(-)
 create mode 100644 packages/documentation/.eslintrc.js
 create mode 100644 packages/documentation/tsconfig.eslint.json

diff --git a/packages/components/src/components/post-card-control/post-card-control.tsx b/packages/components/src/components/post-card-control/post-card-control.tsx
index 99def9d09a..1f42eb8397 100644
--- a/packages/components/src/components/post-card-control/post-card-control.tsx
+++ b/packages/components/src/components/post-card-control/post-card-control.tsx
@@ -19,7 +19,8 @@ import { version } from '@root/package.json';
 import scss from './post-card-control.module.scss';
 import { parse } from '@/utils/sass-export';
 
-const SCSS_VARIABLES = parse(scss);
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+const SCSS_VARIABLES: any = parse(scss);
 
 let cardControlIds = 0;
 
diff --git a/packages/documentation/.eslintrc.js b/packages/documentation/.eslintrc.js
new file mode 100644
index 0000000000..fa4c32c3f8
--- /dev/null
+++ b/packages/documentation/.eslintrc.js
@@ -0,0 +1,55 @@
+module.exports = {
+  env: {
+    browser: true,
+    node: true,
+    es2021: true,
+  },
+  parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    tsconfigRootDir: __dirname,
+    project: 'tsconfig.eslint.json',
+    extraFileExtensions: ['.mdx'],
+  },
+  ignorePatterns: [
+    'src/**/*.sample.*',
+    '.eslintrc.js',
+    'cypress',
+    'cypress.config.js',
+    'cypress.snapshot.config.js',
+    'public',
+    'storybook-static',
+    'vite.config.js',
+  ],
+  overrides: [
+    {
+      files: ['*.{js,ts,tsx}'],
+      extends: [
+        'eslint:recommended',
+        'plugin:@typescript-eslint/recommended',
+        'plugin:storybook/recommended',
+        'prettier',
+      ],
+      parser: '@typescript-eslint/parser',
+      plugins: ['@typescript-eslint'],
+      rules: {
+        '@typescript-eslint/no-unused-vars': [
+          'error',
+          {
+            caughtErrors: 'none',
+            destructuredArrayIgnorePattern: '^_',
+            ignoreRestSiblings: true,
+          },
+        ],
+      },
+    },
+    {
+      files: ['*.mdx'],
+      extends: ['plugin:mdx/recommended'],
+      parser: 'eslint-mdx',
+      settings: {
+        'mdx/code-blocks': true,
+      },
+    },
+  ],
+};
diff --git a/packages/documentation/package.json b/packages/documentation/package.json
index 08c891e483..3836b90633 100644
--- a/packages/documentation/package.json
+++ b/packages/documentation/package.json
@@ -23,7 +23,8 @@
     "e2e": "cypress run",
     "e2e:ci": "xvfb-run -a cypress run",
     "e2e:watch": "cypress open",
-    "snapshots": "percy exec -- cypress run --config-file ./cypress.snapshot.config.js --record --key 0995e768-43ec-42bd-a127-ff944a2ad8c9"
+    "snapshots": "percy exec -- cypress run --config-file ./cypress.snapshot.config.js --record --key 0995e768-43ec-42bd-a127-ff944a2ad8c9",
+    "lint": "eslint **/*.{js,ts,tsx,mdx}"
   },
   "dependencies": {
     "@swisspost/design-system-components": "workspace:7.1.0",
@@ -60,8 +61,14 @@
     "@types/mdx": "2.0.13",
     "@types/react": "18.3.2",
     "@types/react-syntax-highlighter": "15.5.13",
+    "@typescript-eslint/eslint-plugin": "5.62.0",
+    "@typescript-eslint/parser": "5.62.0",
     "cypress": "13.9.0",
     "cypress-axe": "1.5.0",
+    "eslint": "8.57.0",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-mdx": "3.1.5",
+    "eslint-plugin-storybook": "0.8.0",
     "lit": "3.1.3",
     "lit-html": "3.1.3",
     "prettier": "2.8.8",
diff --git a/packages/documentation/src/shared/tile/tile.component.ts b/packages/documentation/src/shared/tile/tile.component.ts
index fa089a52cc..414de33eff 100644
--- a/packages/documentation/src/shared/tile/tile.component.ts
+++ b/packages/documentation/src/shared/tile/tile.component.ts
@@ -6,7 +6,7 @@ import Styles from './tile.component.scss?inline';
 
 @customElement('ti-le')
 export class TileComponent extends LitElement {
-  @property({ type: String }) title: string = '';
+  @property({ type: String }) title = '';
   @property({ type: String }) ariaLabel: string | null = null;
   @property({ type: String }) href: string | null = null;
 
diff --git a/packages/documentation/src/stories/components/accordion/accordion.stories.ts b/packages/documentation/src/stories/components/accordion/accordion.stories.ts
index 25add90f97..8ada6bd988 100644
--- a/packages/documentation/src/stories/components/accordion/accordion.stories.ts
+++ b/packages/documentation/src/stories/components/accordion/accordion.stories.ts
@@ -1,6 +1,6 @@
 import type { StoryObj } from '@storybook/web-components';
 import { html, nothing, TemplateResult } from 'lit';
-import { MetaComponent } from '@root/types';
+import { MetaComponent, HeadingLevel } from '@root/types';
 import { ifDefined } from 'lit/directives/if-defined.js';
 
 const meta: MetaComponent<HTMLPostAccordionElement & HTMLPostCollapsibleElementEventMap> = {
@@ -72,7 +72,7 @@ type Story = StoryObj<HTMLPostAccordionElement>;
 
 export const Default: Story = {
   args: {
-    headingLevel: '3' as any, // needs to be a string for the control to properly initialize
+    headingLevel: '3' as HeadingLevel, // needs to be a string for the control to properly initialize
   },
 };
 
diff --git a/packages/documentation/src/stories/components/alert/standard-html/alert.stories.ts b/packages/documentation/src/stories/components/alert/standard-html/alert.stories.ts
index 4bd38f6f59..f360875213 100644
--- a/packages/documentation/src/stories/components/alert/standard-html/alert.stories.ts
+++ b/packages/documentation/src/stories/components/alert/standard-html/alert.stories.ts
@@ -1,4 +1,3 @@
-// @ts-ignore
 import { useArgs } from '@storybook/preview-api';
 import { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html, nothing } from 'lit';
@@ -111,7 +110,7 @@ export default meta;
 function externalControl(story: StoryFn, { args, context }: StoryContext) {
   const [_, updateArgs] = useArgs();
 
-  const toggleAlert = (e: MouseEvent, args: Args, updateArgs: Function) => {
+  const toggleAlert = (e: MouseEvent, args: Args, updateArgs: (newArgs: Partial<Args>) => void) => {
     e.preventDefault();
     updateArgs({ show: !args.show });
   };
diff --git a/packages/documentation/src/stories/components/button-group/button-group.stories.ts b/packages/documentation/src/stories/components/button-group/button-group.stories.ts
index b53e5a614c..74526f62ef 100644
--- a/packages/documentation/src/stories/components/button-group/button-group.stories.ts
+++ b/packages/documentation/src/stories/components/button-group/button-group.stories.ts
@@ -193,7 +193,7 @@ function createButtonTemplate(args: Args, context: StoryContext, index: number)
           autocomplete="off"
           ?checked="${isChecked}"
           .checked="${isChecked}"
-          @change="${(e: Event) => {
+          @change="${() => {
             updateArgs({ checked: position });
           }}"
         />
diff --git a/packages/documentation/src/stories/components/button/button.stories.ts b/packages/documentation/src/stories/components/button/button.stories.ts
index e245c9efc9..09739ace2f 100644
--- a/packages/documentation/src/stories/components/button/button.stories.ts
+++ b/packages/documentation/src/stories/components/button/button.stories.ts
@@ -1,4 +1,4 @@
-import type { Args, StoryObj } from '@storybook/web-components';
+import type { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html, unsafeStatic } from 'lit/static-html.js';
 import { spread } from '@open-wc/lit-helpers';
 import { repeat } from 'lit/directives/repeat.js';
@@ -222,7 +222,7 @@ const Template = {
   render: (args: Args) => {
     const tagName = unsafeStatic(args.tag);
     const isAnimated = args.tag !== 'input' && args.animated !== 'none';
-    const props = createProps(args, isAnimated);
+    const props = createProps(args);
 
     if (args.tag === 'input') {
       return html` <${tagName} ${spread(props)} /> `;
@@ -243,7 +243,7 @@ const Template = {
   },
 };
 
-function createProps(args: Args, isAnimated: boolean) {
+function createProps(args: Args) {
   const additionalClasses = args.additionalClasses ?? [];
   return {
     class: [
@@ -269,7 +269,10 @@ export const Default: Story = {
 
 export const Inverted: Story = {
   ...Template,
-  decorators: [(story: Function) => html` <div class="p-3 bg-dark">${story()}</div> `],
+  decorators: [
+    (story: StoryFn, context: StoryContext) =>
+      html` <div class="p-3 bg-dark">${story(context.args, context)}</div> `,
+  ],
 };
 
 const VariantsTemplate = {
@@ -279,7 +282,8 @@ const VariantsTemplate = {
     },
   },
   decorators: [
-    (story: Function) => html` <div class="d-flex gap-small-r flex-wrap">${story()}</div> `,
+    (story: StoryFn, context: StoryContext) =>
+      html` <div class="d-flex gap-small-r flex-wrap">${story(context.args, context)}</div> `,
   ],
   render: (args: Args) =>
     html`
diff --git a/packages/documentation/src/stories/components/cards/card-button/card-button.stories.ts b/packages/documentation/src/stories/components/cards/card-button/card-button.stories.ts
index 999d758953..5e1dd4c118 100644
--- a/packages/documentation/src/stories/components/cards/card-button/card-button.stories.ts
+++ b/packages/documentation/src/stories/components/cards/card-button/card-button.stories.ts
@@ -76,7 +76,7 @@ const meta: MetaComponent = {
   },
 };
 export default meta;
-function cardButtonRender(args: Args, count: number = 42) {
+function cardButtonRender(args: Args, count = 42) {
   const [_, updateArgs] = useArgs();
   return html`
     <div class="card card-button ${args.background}" id="${`card-button${count}`}">
diff --git a/packages/documentation/src/stories/components/cards/card/card.stories.ts b/packages/documentation/src/stories/components/cards/card/card.stories.ts
index 237ab769ac..bdbdc7bfbb 100644
--- a/packages/documentation/src/stories/components/cards/card/card.stories.ts
+++ b/packages/documentation/src/stories/components/cards/card/card.stories.ts
@@ -1,4 +1,4 @@
-import type { Args, StoryObj } from '@storybook/web-components';
+import type { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html, nothing } from 'lit';
 import { choose } from 'lit/directives/choose.js';
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
@@ -206,18 +206,20 @@ const meta: MetaComponent = {
 export default meta;
 
 // DECORATORS
-function clickBlocker(story: any) {
-  return html` <div @click=${(e: Event) => e.preventDefault()}>${story()}</div> `;
+function clickBlocker(story: StoryFn, context: StoryContext) {
+  return html`
+    <div @click=${(e: Event) => e.preventDefault()}>${story(context.args, context)}</div>
+  `;
 }
 
-function paddedContainer(story: any) {
-  return html` <div class="p-mini">${story()}</div> `;
+function paddedContainer(story: StoryFn, context: StoryContext) {
+  return html` <div class="p-mini">${story(context.args, context)}</div> `;
 }
 
-function gridContainer(story: any) {
+function gridContainer(story: StoryFn, context: StoryContext) {
   return html`
     <div class="row">
-      <div class="col-lg-4 col-rg-6 col-12">${story()}</div>
+      <div class="col-lg-4 col-rg-6 col-12">${story(context.args, context)}</div>
     </div>
   `;
 }
diff --git a/packages/documentation/src/stories/components/cards/product-card/product-card.stories.ts b/packages/documentation/src/stories/components/cards/product-card/product-card.stories.ts
index 8411bf230d..d3905c65a8 100644
--- a/packages/documentation/src/stories/components/cards/product-card/product-card.stories.ts
+++ b/packages/documentation/src/stories/components/cards/product-card/product-card.stories.ts
@@ -1,4 +1,4 @@
-import type { Args, StoryObj } from '@storybook/web-components';
+import type { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html, unsafeStatic } from 'lit/static-html.js';
 import { nothing } from 'lit';
 import { MetaComponent } from '@root/types';
@@ -59,18 +59,20 @@ const meta: MetaComponent = {
 export default meta;
 
 // DECORATORS
-function clickBlocker(story: any) {
-  return html` <div @click=${(e: Event) => e.preventDefault()}>${story()}</div> `;
+function clickBlocker(story: StoryFn, context: StoryContext) {
+  return html`
+    <div @click=${(e: Event) => e.preventDefault()}>${story(context.args, context)}</div>
+  `;
 }
 
-function paddedContainer(story: any) {
-  return html` <div class="p-mini">${story()}</div> `;
+function paddedContainer(story: StoryFn, context: StoryContext) {
+  return html` <div class="p-mini">${story(context.args, context)}</div> `;
 }
 
-function gridContainer(story: any) {
+function gridContainer(story: StoryFn, context: StoryContext) {
   return html`
     <div class="row row-cols-md-2 row-cols-xl-3 border-gutters">
-      <div class="col-12">${story()}</div>
+      <div class="col-12">${story(context.args, context)}</div>
     </div>
   `;
 }
@@ -322,12 +324,12 @@ export const Multipart: Story = {
     </div>
   `,
   decorators: [
-    (story: any) => {
-      let timer;
-
+    (story: StoryFn, context: StoryContext) => {
       return html`
-        ${story()}
+        ${story(context.args, context)}
         <script id="toto">
+          let timer;
+
           function syncHeights() {
             const nodes = document.querySelectorAll('[data-sync-height-with]');
 
diff --git a/packages/documentation/src/stories/components/chip/chip.stories.ts b/packages/documentation/src/stories/components/chip/chip.stories.ts
index 97b8c8adbb..5fe47939e0 100644
--- a/packages/documentation/src/stories/components/chip/chip.stories.ts
+++ b/packages/documentation/src/stories/components/chip/chip.stories.ts
@@ -1,5 +1,5 @@
 import { useArgs } from '@storybook/preview-api';
-import type { Args, StoryContext, StoryObj } from '@storybook/web-components';
+import type { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html, nothing } from 'lit';
 import { MetaComponent } from '@root/types';
 
@@ -106,7 +106,7 @@ const meta: MetaComponent = {
 export default meta;
 
 // DECORATORS
-function externalControl(story: any, { args }: StoryContext) {
+function externalControl(story: StoryFn, context: StoryContext) {
   const [_, updateArgs] = useArgs();
 
   const button = html`
@@ -121,7 +121,7 @@ function externalControl(story: any, { args }: StoryContext) {
     </a>
   `;
 
-  return html` ${args.dismissed ? button : nothing} ${story()} `;
+  return html` ${context.args.dismissed ? button : nothing} ${story(context.args, context)} `;
 }
 
 // RENDERER
diff --git a/packages/documentation/src/stories/components/collapsible/collapsible.snapshot.stories.ts b/packages/documentation/src/stories/components/collapsible/collapsible.snapshot.stories.ts
index 20d20e5e9a..38e0585172 100644
--- a/packages/documentation/src/stories/components/collapsible/collapsible.snapshot.stories.ts
+++ b/packages/documentation/src/stories/components/collapsible/collapsible.snapshot.stories.ts
@@ -14,7 +14,7 @@ export default {
 
 type Story = StoryObj<HTMLPostCollapsibleElement>;
 
-export const collapsible: Story = {
+export const Collapsible: Story = {
   render: (_args: Args, context: StoryContext<HTMLPostCollapsibleElement>) => {
     const templateVariants = bombArgs({
       collapsed: [false, true],
diff --git a/packages/documentation/src/stories/components/forms/card-control/standard-html/card-control.snapshot.stories.ts b/packages/documentation/src/stories/components/forms/card-control/standard-html/card-control.snapshot.stories.ts
index 69fccf3f59..0e30a96f02 100644
--- a/packages/documentation/src/stories/components/forms/card-control/standard-html/card-control.snapshot.stories.ts
+++ b/packages/documentation/src/stories/components/forms/card-control/standard-html/card-control.snapshot.stories.ts
@@ -11,8 +11,8 @@ export default {
 };
 
 const bombedArgs = bombArgs({
-  type: meta.argTypes!.type!.options,
-  validation: meta.argTypes!.validation!.options,
+  type: meta.argTypes?.type?.options,
+  validation: meta.argTypes?.validation?.options,
   checked: [false, true],
   disabled: [false, true],
   label: ['Card check text', 'Really long running choice card text that wraps to two lines'],
diff --git a/packages/documentation/src/stories/components/forms/card-control/standard-html/card-control.stories.ts b/packages/documentation/src/stories/components/forms/card-control/standard-html/card-control.stories.ts
index fb73a1c014..846ded9bef 100644
--- a/packages/documentation/src/stories/components/forms/card-control/standard-html/card-control.stories.ts
+++ b/packages/documentation/src/stories/components/forms/card-control/standard-html/card-control.stories.ts
@@ -9,6 +9,8 @@ import scss from '../card-control.module.scss';
 
 const SCSS_VARIABLES: { [key: string]: string } = parse(scss);
 
+type useStateFn = typeof useState;
+
 const meta: MetaComponent = {
   id: '047501dd-a185-4835-be91-09130fa3dad9',
   title: 'Components/Forms/Card-Control',
@@ -129,7 +131,7 @@ let cardControlId = 0;
 const CONTROL_LABELS = ['One', 'Two', 'Three', 'Four', 'Five', 'Six'];
 
 // Firefox fallback for the :has selector
-function inputHandler(e: InputEvent, updateArgs: Function) {
+function inputHandler(e: InputEvent, updateArgs: (newArgs: Partial<Args>) => void) {
   const target = e.target as HTMLInputElement;
   updateArgs({ checked: target.checked });
 
@@ -225,7 +227,7 @@ export const DarkBackground = {
   render: Default.render,
 };
 
-function col(label: string, args: Args, useState: Function) {
+function col(label: string, args: Args, useState: useStateFn) {
   const [id] = useState(cardControlId++);
 
   return html`
diff --git a/packages/documentation/src/stories/components/forms/card-control/web-component/card-control.stories.ts b/packages/documentation/src/stories/components/forms/card-control/web-component/card-control.stories.ts
index 9c6436bfa4..89e9a1c5cc 100644
--- a/packages/documentation/src/stories/components/forms/card-control/web-component/card-control.stories.ts
+++ b/packages/documentation/src/stories/components/forms/card-control/web-component/card-control.stories.ts
@@ -8,7 +8,7 @@ import './card-control.styles.scss';
 import scss from '../card-control.module.scss';
 import { coloredBackground } from '@/shared/decorators/dark-background';
 
-const SCSS_VARIABLES: any = parse(scss);
+const SCSS_VARIABLES: { [key: string]: string | object } = parse(scss);
 
 const meta: MetaComponent = {
   id: '886fabcf-148b-4054-a2ec-4869668294fb',
@@ -273,8 +273,8 @@ export const FormIntegration: Story = {
 
     return html` <form
       id="AssociatedForm"
-      @reset="${(e: any) => formHandler(e, updateArgs)}"
-      @submit="${(e: any) => formHandler(e, updateArgs)}"
+      @reset="${(e: SubmitEvent) => formHandler(e, updateArgs)}"
+      @submit="${(e: SubmitEvent) => formHandler(e, updateArgs)}"
     >
       <fieldset .disabled=${args.checkboxFieldset}>
         <legend>Legend</legend>
@@ -303,15 +303,14 @@ export const FormIntegration: Story = {
   },
 };
 
-function formHandler(e: any, updateArgs: Function) {
+function formHandler(e: SubmitEvent, updateArgs: (newArgs: Partial<Args>) => void) {
   if (e.type === 'submit') e.preventDefault();
 
   setTimeout(() => {
     const formOutput = document.querySelector('#AssociatedFormOutput');
-    const formData: { [key: string]: string } = Array.from(new FormData(e.target).entries()).reduce(
-      (acc, [k, v]) => Object.assign(acc, { [k]: v }),
-      {},
-    );
+    const formData: { [key: string]: string } = Array.from(
+      new FormData(e.target as HTMLFormElement).entries(),
+    ).reduce((acc, [k, v]) => Object.assign(acc, { [k]: v }), {});
 
     if (formOutput) {
       updateArgs({
diff --git a/packages/documentation/src/stories/components/forms/checkbox/checkbox.stories.ts b/packages/documentation/src/stories/components/forms/checkbox/checkbox.stories.ts
index 6c8b87ec97..0d169c0168 100644
--- a/packages/documentation/src/stories/components/forms/checkbox/checkbox.stories.ts
+++ b/packages/documentation/src/stories/components/forms/checkbox/checkbox.stories.ts
@@ -190,7 +190,7 @@ function renderCheckbox(args: Args, context: StoryContext) {
     ['is-' + args.validation]: args.validation !== 'null',
   });
 
-  const handleChange = (e: Event) => {
+  const handleChange = () => {
     updateArgs({ checked: CHECKED_STATE_TOGGLE_MAP[args.checked] });
   };
 
diff --git a/packages/documentation/src/stories/components/forms/input/input.snapshot.stories.ts b/packages/documentation/src/stories/components/forms/input/input.snapshot.stories.ts
index cc997555f9..6a405d79bb 100644
--- a/packages/documentation/src/stories/components/forms/input/input.snapshot.stories.ts
+++ b/packages/documentation/src/stories/components/forms/input/input.snapshot.stories.ts
@@ -48,7 +48,7 @@ function renderInputSnapshot(_args: Args, context: StoryContext) {
                       ? html`
                           <h4>
                             ${Object.entries(context.argTypes.size.control.labels)
-                              .filter(([key, value]) => key === args.size)
+                              .filter(([key]) => key === args.size)
                               .map(s => s[1])}
                           </h4>
                         `
diff --git a/packages/documentation/src/stories/components/forms/switch/switch.stories.ts b/packages/documentation/src/stories/components/forms/switch/switch.stories.ts
index ad1828836c..2ebde7a6ce 100644
--- a/packages/documentation/src/stories/components/forms/switch/switch.stories.ts
+++ b/packages/documentation/src/stories/components/forms/switch/switch.stories.ts
@@ -150,7 +150,7 @@ function renderSwitch(args: Args, context: StoryContext) {
         ?disabled=${args.disabled}
         aria-label=${useAriaLabel ? ariaLabel : nothing}
         aria-invalid=${ifDefined(VALIDATION_STATE_MAP[args.validation])}
-        @change=${(e: Event) => updateArgs({ checked: !args.checked })}
+        @change=${() => updateArgs({ checked: !args.checked })}
       />
       ${labelBefore} ${labelAfter} ${args.validation !== 'null' ? validationFeedback : nothing}
     </div>
diff --git a/packages/documentation/src/stories/components/forms/textarea/textarea.snapshot.stories.ts b/packages/documentation/src/stories/components/forms/textarea/textarea.snapshot.stories.ts
index abdf32b7f9..2ca08413d1 100644
--- a/packages/documentation/src/stories/components/forms/textarea/textarea.snapshot.stories.ts
+++ b/packages/documentation/src/stories/components/forms/textarea/textarea.snapshot.stories.ts
@@ -50,7 +50,7 @@ export const Textarea: Story = {
                         ? html`
                             <h4>
                               ${Object.entries(context.argTypes.size.control.labels)
-                                .filter(([key, value]) => key === args.size)
+                                .filter(([key]) => key === args.size)
                                 .map(s => s[1])}
                             </h4>
                           `
diff --git a/packages/documentation/src/stories/components/icons/icon.stories.ts b/packages/documentation/src/stories/components/icons/icon.stories.ts
index 6c7274a131..a0b5de252a 100644
--- a/packages/documentation/src/stories/components/icons/icon.stories.ts
+++ b/packages/documentation/src/stories/components/icons/icon.stories.ts
@@ -1,5 +1,5 @@
 import { spread } from '@open-wc/lit-helpers';
-import { Args, StoryObj } from '@storybook/web-components';
+import { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { spreadArgs } from '@/utils';
@@ -78,8 +78,12 @@ const renderVariants = (
   `;
 };
 
-const generateDecorators = (story: any, className?: string) => {
-  return html` <div class="${ifDefined(className)}" style="font-size: 32px">${story()}</div> `;
+const generateDecorators = (story: StoryFn, context: StoryContext, className?: string) => {
+  return html`
+    <div class="${ifDefined(className)}" style="font-size: 32px">
+      ${story(context.args, context)}
+    </div>
+  `;
 };
 
 export default meta;
@@ -87,7 +91,7 @@ export default meta;
 type Story = StoryObj<Components.PostIcon>;
 
 export const Default: Story = {
-  decorators: [story => generateDecorators(story)],
+  decorators: [(story: StoryFn, context: StoryContext) => generateDecorators(story, context)],
 };
 
 const colorVariants = [
@@ -106,7 +110,10 @@ export const Color: Story = {
     },
   },
   render: args => renderVariants(args, colorVariants),
-  decorators: [story => generateDecorators(story, 'd-flex flex-wrap gap-2')],
+  decorators: [
+    (story: StoryFn, context: StoryContext) =>
+      generateDecorators(story, context, 'd-flex flex-wrap gap-2'),
+  ],
 };
 
 const sizeVariants = [
@@ -125,7 +132,10 @@ export const Size: Story = {
     },
   },
   render: args => renderVariants(args, sizeVariants),
-  decorators: [story => generateDecorators(story, 'd-flex flex-column')],
+  decorators: [
+    (story: StoryFn, context: StoryContext) =>
+      generateDecorators(story, context, 'd-flex flex-column'),
+  ],
 };
 
 const styleVariants = [
@@ -141,7 +151,10 @@ export const Style: Story = {
     },
   },
   render: args => renderVariants(args, styleVariants),
-  decorators: [story => generateDecorators(story, 'd-flex flex-wrap gap-2')],
+  decorators: [
+    (story: StoryFn, context: StoryContext) =>
+      generateDecorators(story, context, 'd-flex flex-wrap gap-2'),
+  ],
 };
 
 const flipVariants = [
@@ -158,7 +171,10 @@ export const Flip: Story = {
     },
   },
   render: args => renderVariants(args, flipVariants),
-  decorators: [story => generateDecorators(story, 'd-flex flex-wrap gap-2')],
+  decorators: [
+    (story: StoryFn, context: StoryContext) =>
+      generateDecorators(story, context, 'd-flex flex-wrap gap-2'),
+  ],
 };
 
 const scaleVariants = [
@@ -174,7 +190,10 @@ export const Scale: Story = {
     },
   },
   render: args => renderVariants(args, scaleVariants),
-  decorators: [story => generateDecorators(story, 'd-flex flex-wrap gap-4')],
+  decorators: [
+    (story: StoryFn, context: StoryContext) =>
+      generateDecorators(story, context, 'd-flex flex-wrap gap-4'),
+  ],
 };
 
 const rotateVariants = [
@@ -194,7 +213,10 @@ export const Rotate: Story = {
     },
   },
   render: args => renderVariants(args, rotateVariants),
-  decorators: [story => generateDecorators(story, 'd-flex flex-wrap gap-2')],
+  decorators: [
+    (story: StoryFn, context: StoryContext) =>
+      generateDecorators(story, context, 'd-flex flex-wrap gap-2'),
+  ],
 };
 
 const animateVariants = [
@@ -227,5 +249,8 @@ export const Animate: Story = {
     },
   },
   render: args => renderAnimateVariants(args, animateVariants),
-  decorators: [story => generateDecorators(story, 'd-flex flex-wrap text-center')],
+  decorators: [
+    (story: StoryFn, context: StoryContext) =>
+      generateDecorators(story, context, 'd-flex flex-wrap text-center'),
+  ],
 };
diff --git a/packages/documentation/src/stories/components/internet-header/breadcrumbs/breadcrumbs.stories.ts b/packages/documentation/src/stories/components/internet-header/breadcrumbs/breadcrumbs.stories.ts
index 1502cd2c7e..f01e5bca41 100644
--- a/packages/documentation/src/stories/components/internet-header/breadcrumbs/breadcrumbs.stories.ts
+++ b/packages/documentation/src/stories/components/internet-header/breadcrumbs/breadcrumbs.stories.ts
@@ -1,4 +1,4 @@
-import { StoryObj } from '@storybook/web-components';
+import { StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 import { spread } from '@open-wc/lit-helpers';
 import { getAttributes } from '@/utils';
@@ -35,10 +35,10 @@ const meta: MetaComponent<HTMLSwisspostInternetBreadcrumbsElement> = {
 export default meta;
 
 // DECORATORS
-function hiddenHeader(story: any) {
+function hiddenHeader(story: StoryFn, context: StoryContext) {
   return html`
     <swisspost-internet-header project="test" hidden></swisspost-internet-header>
-    ${story()}
+    ${story(context.args, context)}
   `;
 }
 
diff --git a/packages/documentation/src/stories/components/internet-header/footer/footer.stories.ts b/packages/documentation/src/stories/components/internet-header/footer/footer.stories.ts
index 74352c8024..d8695cc4a5 100644
--- a/packages/documentation/src/stories/components/internet-header/footer/footer.stories.ts
+++ b/packages/documentation/src/stories/components/internet-header/footer/footer.stories.ts
@@ -1,4 +1,4 @@
-import { Args, StoryContext, StoryObj } from '@storybook/web-components';
+import { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 import customFooterConfig from './custom-config/custom-footer-config';
 import { spread } from '@open-wc/lit-helpers';
@@ -35,14 +35,14 @@ const meta: MetaComponent = {
 export default meta;
 
 // DECORATORS
-function hiddenHeader(story: any, { args }: StoryContext) {
+function hiddenHeader(story: StoryFn, context: StoryContext) {
   return html`
     <style>
       swisspost-internet-header {
         display: none;
       }
     </style>
-    ${story()}
+    ${story(context.args, context)}
   `;
 }
 
diff --git a/packages/documentation/src/stories/components/spinner/spinner.stories.ts b/packages/documentation/src/stories/components/spinner/spinner.stories.ts
index 6cb8f57184..d7a5c9bff1 100644
--- a/packages/documentation/src/stories/components/spinner/spinner.stories.ts
+++ b/packages/documentation/src/stories/components/spinner/spinner.stories.ts
@@ -1,4 +1,4 @@
-import type { Args, StoryObj } from '@storybook/web-components';
+import type { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html } from 'lit/static-html.js';
 import { MetaComponent } from '@root/types';
 
@@ -7,7 +7,7 @@ const meta: MetaComponent = {
   title: 'Components/Spinner',
   tags: ['package:HTML'],
   render,
-  decorators: [story => generateDecorators(story)],
+  decorators: [(story, context) => generateDecorators(story, context)],
   parameters: {
     badges: [],
     design: {
@@ -53,8 +53,8 @@ export default meta;
 
 type Story = StoryObj;
 
-function generateDecorators(story: any) {
-  return html` <div class="m-5 overflow-hidden">${story()}</div> `;
+function generateDecorators(story: StoryFn, context: StoryContext) {
+  return html` <div class="m-5 overflow-hidden">${story(context.args, context)}</div> `;
 }
 
 function render(args: Args) {
diff --git a/packages/documentation/src/stories/components/subnavigation/subnavigation.stories.ts b/packages/documentation/src/stories/components/subnavigation/subnavigation.stories.ts
index 3722350ef7..f36fe62933 100644
--- a/packages/documentation/src/stories/components/subnavigation/subnavigation.stories.ts
+++ b/packages/documentation/src/stories/components/subnavigation/subnavigation.stories.ts
@@ -1,9 +1,10 @@
-import { Args, StoryContext, StoryObj } from '@storybook/web-components';
+import { Args, StoryContext, StoryFn, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 import { MetaComponent } from '@root/types';
 import { parse } from '@/utils/sass-export';
 import scss from './subnavigation.module.scss';
 
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
 const SCSS_VARIABLES: any = parse(scss);
 
 const meta: MetaComponent = {
@@ -59,11 +60,13 @@ const meta: MetaComponent = {
 export default meta;
 
 // DECORATOR
-function clickBlocker(story: any) {
-  return html` <div @click=${(e: Event) => e.preventDefault()}>${story()}</div> `;
+function clickBlocker(story: StoryFn, context: StoryContext) {
+  return html`
+    <div @click=${(e: Event) => e.preventDefault()}>${story(context.args, context)}</div>
+  `;
 }
 
-function renderTest(args: Args, context: StoryContext) {
+function renderTest(args: Args) {
   return html`
     <div
       class="subnavigation${args.backgroundColor !== 'default' ? ' ' + args.backgroundColor : ''}"
diff --git a/packages/documentation/src/stories/components/tabs/tabs.stories.ts b/packages/documentation/src/stories/components/tabs/tabs.stories.ts
index fd04dae76f..eb6866b715 100644
--- a/packages/documentation/src/stories/components/tabs/tabs.stories.ts
+++ b/packages/documentation/src/stories/components/tabs/tabs.stories.ts
@@ -78,8 +78,8 @@ export const Async: Story = {
         const headers: NodeListOf<HTMLPostTabHeaderElement> =
           document.querySelectorAll('post-tab-header');
 
-        const activeHeader: HTMLPostTabHeaderElement | undefined = Array.from(headers).find(
-          header => document.querySelectorAll('post-tab-header.active'),
+        const activeHeader: HTMLPostTabHeaderElement | undefined = Array.from(headers).find(() =>
+          document.querySelectorAll('post-tab-header.active'),
         );
         activeHeader?.remove();
 
diff --git a/packages/documentation/src/stories/components/tag/standard-html/tag.stories.ts b/packages/documentation/src/stories/components/tag/standard-html/tag.stories.ts
index 23da6b0957..1e372ae3e4 100644
--- a/packages/documentation/src/stories/components/tag/standard-html/tag.stories.ts
+++ b/packages/documentation/src/stories/components/tag/standard-html/tag.stories.ts
@@ -5,6 +5,7 @@ import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 import { parse } from '@/utils/sass-export';
 import scss from '@/stories/components/tag/tag.module.scss';
 
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
 const SCSS_VARIABLES: any = parse(scss);
 
 const meta: MetaComponent = {
diff --git a/packages/documentation/src/stories/components/tag/web-component/post-tag.stories.ts b/packages/documentation/src/stories/components/tag/web-component/post-tag.stories.ts
index 5fdb608d45..ac86b3f25f 100644
--- a/packages/documentation/src/stories/components/tag/web-component/post-tag.stories.ts
+++ b/packages/documentation/src/stories/components/tag/web-component/post-tag.stories.ts
@@ -5,6 +5,7 @@ import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 import { parse } from '@/utils/sass-export';
 import scss from '@/stories/components/tag/tag.module.scss';
 
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
 const SCSS_VARIABLES: any = parse(scss);
 
 const meta: MetaComponent = {
@@ -75,8 +76,8 @@ export const Default: Story = {};
 
 export const Icon: Story = {
   args: {
-    icon: 1001
-  }
+    icon: 1001,
+  },
 };
 
 export const Variants: Story = {
@@ -89,13 +90,11 @@ export const Variants: Story = {
 
     return html`
       ${variants.map(variant =>
-        renderPostTag(
-          {
-            ...args,
-            variant,
-            "slots-default": variant.charAt(0).toUpperCase() + variant.slice(1),
-          },
-        ),
+        renderPostTag({
+          ...args,
+          variant,
+          'slots-default': variant.charAt(0).toUpperCase() + variant.slice(1),
+        }),
       )}
     `;
   },
diff --git a/packages/documentation/src/stories/components/toast/toast.stories.ts b/packages/documentation/src/stories/components/toast/toast.stories.ts
index fc3f200ec9..fa4a69b566 100644
--- a/packages/documentation/src/stories/components/toast/toast.stories.ts
+++ b/packages/documentation/src/stories/components/toast/toast.stories.ts
@@ -316,7 +316,7 @@ const timeoutStores: ITimeoutStores = {
 function onToggle(
   e: MouseEvent | null,
   args: Args,
-  updateArgs: Function,
+  updateArgs: (newArgs: Partial<Args>) => void,
   state: boolean | undefined,
 ) {
   if (e) e.preventDefault();
@@ -326,7 +326,7 @@ function onToggle(
 function createAutoHideTimeout(
   timeoutStore: ReturnType<typeof setTimeout>[],
   args: Args,
-  updateArgs: Function,
+  updateArgs: (newArgs: Partial<Args>) => void,
 ) {
   if (args.position === 'fixed' && args.autoClose > 0 && timeoutStore.length === 0) {
     timeoutStore.push(
@@ -432,7 +432,7 @@ function render(args: Args, context: StoryContext) {
   `;
 }
 
-function updateAlignments(args: Args, updateArgs: Function) {
+function updateAlignments(args: Args, updateArgs: (newArgs: Partial<Args>) => void) {
   if (args.alignH && args.alignHRestricted && args.alignH !== args.alignHRestricted) {
     args.alignV === 'center'
       ? updateArgs({ alignH: args.alignHRestricted })
diff --git a/packages/documentation/src/stories/foundation/color/color.blocks.tsx b/packages/documentation/src/stories/foundation/color/color.blocks.tsx
index 9710b8af07..8ad0f90d75 100644
--- a/packages/documentation/src/stories/foundation/color/color.blocks.tsx
+++ b/packages/documentation/src/stories/foundation/color/color.blocks.tsx
@@ -1,6 +1,7 @@
 import { parse } from '@/utils/sass-export';
 import scss from './color.module.scss';
 
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
 export const SCSS_VARIABLES: any = parse(scss);
 
 export const ColorSwatch = (props: {
diff --git a/packages/documentation/src/stories/foundation/color/color.docs.mdx b/packages/documentation/src/stories/foundation/color/color.docs.mdx
index f23224321d..703efbecb1 100644
--- a/packages/documentation/src/stories/foundation/color/color.docs.mdx
+++ b/packages/documentation/src/stories/foundation/color/color.docs.mdx
@@ -27,8 +27,8 @@ They theme our elements and components.
 ## Brand colors
 
 <section className="color-swatch__section">
-  {forEach(SCSS_VARIABLES.brand, function (data) {
-    return <ColorSwatch key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES.brand, function ({ key, value}) {
+    return <ColorSwatch key={key} name={key} color={value} />;
   })}
 </section>
 
@@ -36,8 +36,8 @@ They theme our elements and components.
 These colors are also available via the **Sass map** `$post-grays`.
 
 <section className="color-swatch__section">
-  {forEach(SCSS_VARIABLES.gray, function (data) {
-    return <ColorSwatch key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES.gray, function ({ key, value}) {
+    return <ColorSwatch key={key} name={key} color={value} />;
   })}
 </section>
 
@@ -45,8 +45,8 @@ These colors are also available via the **Sass map** `$post-grays`.
 These colors are also available via the **Sass map** `$signal-colors`.
 
 <section className="color-swatch__section">
-  {forEach(SCSS_VARIABLES.signal, function (data) {
-    return <ColorSwatch key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES.signal, function ({ key, value}) {
+    return <ColorSwatch key={key} name={key} color={value} />;
   })}
 </section>
 
@@ -54,8 +54,8 @@ These colors are also available via the **Sass map** `$signal-colors`.
 These colors are also available via the **Sass map** `$signal-background-colors`.
 
 <section className="color-swatch__section">
-  {forEach(SCSS_VARIABLES['signal-background'], function (data) {
-    return <ColorSwatch key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES['signal-background'], function ({ key, value}) {
+    return <ColorSwatch key={key} name={key} color={value} />;
   })}
 </section>
 
@@ -63,8 +63,8 @@ These colors are also available via the **Sass map** `$signal-background-colors`
 These colors are also available via the **Sass map** `$accent-colors`.
 
 <section className="color-swatch__section">
-  {forEach(SCSS_VARIABLES.accent, function (data) {
-    return <ColorSwatch key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES.accent, function ({ key, value}) {
+    return <ColorSwatch key={key} name={key} color={value} />;
   })}
 </section>
 
@@ -72,8 +72,8 @@ These colors are also available via the **Sass map** `$accent-colors`.
 These colors are also available via the **Sass map** `$post-black-alphas`.
 
 <section className="color-swatch__section">
-  {forEach(SCSS_VARIABLES['black-alpha'], function (data) {
-    return <ColorSwatch key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES['black-alpha'], function ({ key, value}) {
+    return <ColorSwatch key={key} name={key} color={value} />;
   })}
 </section>
 
@@ -81,16 +81,16 @@ These colors are also available via the **Sass map** `$post-black-alphas`.
 These colors are also available via the **Sass map** `$post-white-alphas`.
 
 <section className="color-swatch__section">
-  {forEach(SCSS_VARIABLES['white-alpha'], function (data) {
-    return <ColorSwatch key={data.key} name={data.key} color={data.value} dark />;
+  {forEach(SCSS_VARIABLES['white-alpha'], function ({ key, value}) {
+    return <ColorSwatch key={key} name={key} color={value} dark />;
   })}
 </section>
 
 ## Focus colors
 
 <section className="color-swatch__section">
-  {forEach(SCSS_VARIABLES.focus, function (data) {
-    return <ColorSwatch key={data.key} name={data.key} color={data.value} noCSS />;
+  {forEach(SCSS_VARIABLES.focus, function ({ key, value}) {
+    return <ColorSwatch key={key} name={key} color={value} noCSS />;
   })}
 </section>
 
diff --git a/packages/documentation/src/stories/foundation/elevation/elevation.blocks.tsx b/packages/documentation/src/stories/foundation/elevation/elevation.blocks.tsx
index a6488f5e5f..8d1e4b20ef 100644
--- a/packages/documentation/src/stories/foundation/elevation/elevation.blocks.tsx
+++ b/packages/documentation/src/stories/foundation/elevation/elevation.blocks.tsx
@@ -1,7 +1,8 @@
 import { parse } from '@/utils/sass-export';
 import scss from './elevation.module.scss';
 
-export const SCSS_VARIABLES = parse(scss);
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+export const SCSS_VARIABLES: any = parse(scss);
 
 export const ElevationTile = (props: { level: string }) => {
   return (
diff --git a/packages/documentation/src/stories/foundation/elevation/elevation.docs.mdx b/packages/documentation/src/stories/foundation/elevation/elevation.docs.mdx
index e45856e3c3..3cc12bff1d 100644
--- a/packages/documentation/src/stories/foundation/elevation/elevation.docs.mdx
+++ b/packages/documentation/src/stories/foundation/elevation/elevation.docs.mdx
@@ -17,8 +17,8 @@ import SampleUse from './elevation-use.sample.scss?raw';
 The higher the elevation, the larger and softer the shadow, expressing a greater distance between an element and the one behind it.
 
 <div className="elevation-container">
-  {forEach(SCSS_VARIABLES.elevation, function(data) {
-    return <ElevationTile key={data.key} level={data.key} />;
+  {forEach(SCSS_VARIABLES.elevation, function({ key }) {
+    return <ElevationTile key={key} level={key} />;
   })}
 </div>
 
diff --git a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints.blocks.tsx b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints.blocks.tsx
index 63f8048ea3..6e51846242 100644
--- a/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints.blocks.tsx
+++ b/packages/documentation/src/stories/foundation/layout/breakpoints/breakpoints.blocks.tsx
@@ -3,33 +3,32 @@ import { parse } from '@/utils/sass-export';
 import { SpecTable } from '@/stories/foundation/layout/shared.blocks';
 import scss from './breakpoints.module.scss';
 
-export const SCSS_VARIABLES = parse(scss);
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+export const SCSS_VARIABLES: any = parse(scss);
 
 export const BreakpointTable = () => (
   <SpecTable>
     <tr>
       <th>Name</th>
-      {forEach(SCSS_VARIABLES.breakpoint, (data: { key: string; value: { name: string } }) => (
-        <td key={data.key}>
-          <small>{data.value.name}</small>
+      {forEach(SCSS_VARIABLES.breakpoint, ({ key, value }) => (
+        <td key={key}>
+          <small>{value.name}</small>
         </td>
       ))}
     </tr>
 
     <tr>
       <th>Code name</th>
-      {forEach(SCSS_VARIABLES.breakpoint, (data: { key: string }) => (
-        <td key={data.key}>
-          <code>{data.key}</code>
+      {forEach(SCSS_VARIABLES.breakpoint, ({ key }) => (
+        <td key={key}>
+          <code>{key}</code>
         </td>
       ))}
     </tr>
     <tr>
       <th>Class infix</th>
-      {forEach(SCSS_VARIABLES.breakpoint, (data: { key: string; value: { infix: string } }) => (
-        <td key={data.key}>
-          {data.value.infix === 'none' ? 'none' : <code>-{data.value.infix}-</code>}
-        </td>
+      {forEach(SCSS_VARIABLES.breakpoint, ({ key, value }) => (
+        <td key={key}>{value.infix === 'none' ? 'none' : <code>-{value.infix}-</code>}</td>
       ))}
     </tr>
   </SpecTable>
diff --git a/packages/documentation/src/stories/foundation/layout/containers/containers.blocks.tsx b/packages/documentation/src/stories/foundation/layout/containers/containers.blocks.tsx
index b84da4a98b..7e0fc7d6ab 100644
--- a/packages/documentation/src/stories/foundation/layout/containers/containers.blocks.tsx
+++ b/packages/documentation/src/stories/foundation/layout/containers/containers.blocks.tsx
@@ -3,7 +3,8 @@ import { forEach } from '@/utils/react';
 import { SpecTable } from '@/stories/foundation/layout/shared.blocks';
 import scss from './containers.module.scss';
 
-export const SCSS_VARIABLES = parse(scss);
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+export const SCSS_VARIABLES: any = parse(scss);
 
 export const ContainersTable = () => (
   <SpecTable>
@@ -11,19 +12,16 @@ export const ContainersTable = () => (
       <th>
         Container <code>max-width</code>
       </th>
-      {forEach(
-        SCSS_VARIABLES.container,
-        (data: { key: string; value: { ['max-width']: string } }) => (
-          <td key={data.key}>{data.value['max-width']}</td>
-        ),
-      )}
+      {forEach(SCSS_VARIABLES.container, ({ key, value }) => (
+        <td key={key}>{value['max-width']}</td>
+      ))}
     </tr>
     <tr>
       <th>
         Container <code>padding</code>
       </th>
-      {forEach(SCSS_VARIABLES.container, (data: { key: string; value: { padding: string } }) => (
-        <td key={data.key}>{data.value.padding}</td>
+      {forEach(SCSS_VARIABLES.container, ({ key, value }) => (
+        <td key={key}>{value.padding}</td>
       ))}
     </tr>
 
@@ -31,12 +29,9 @@ export const ContainersTable = () => (
       <th>
         Container-Fluid <code>padding</code>
       </th>
-      {forEach(
-        SCSS_VARIABLES.container,
-        (data: { key: string; value: { fluid: { padding: string } } }) => (
-          <td key={data.key}>{data.value.fluid.padding}</td>
-        ),
-      )}
+      {forEach(SCSS_VARIABLES.container, ({ key, value }) => (
+        <td key={key}>{value.fluid.padding}</td>
+      ))}
     </tr>
   </SpecTable>
 );
diff --git a/packages/documentation/src/stories/foundation/layout/grid/grid.blocks.tsx b/packages/documentation/src/stories/foundation/layout/grid/grid.blocks.tsx
index dcf17eb06a..2af6b4102a 100644
--- a/packages/documentation/src/stories/foundation/layout/grid/grid.blocks.tsx
+++ b/packages/documentation/src/stories/foundation/layout/grid/grid.blocks.tsx
@@ -3,27 +3,24 @@ import { forEach } from '@/utils/react';
 import { SpecTable } from '@/stories/foundation/layout/shared.blocks';
 import scss from './grid.module.scss';
 
-export const SCSS_VARIABLES = parse(scss);
-
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+export const SCSS_VARIABLES: any = parse(scss);
 export const GridTable = () => (
   <SpecTable>
     <tr>
       <th>Class prefix</th>
-      {forEach(SCSS_VARIABLES.breakpoint, (data: { key: string; value: { infix: string } }) => (
-        <td key={data.key}>
-          <code>.col-{data.value.infix === 'none' ? '' : `${data.value.infix}-`}</code>
+      {forEach(SCSS_VARIABLES.breakpoint, ({ key, value }) => (
+        <td key={key}>
+          <code>.col-{value.infix === 'none' ? '' : `${value.infix}-`}</code>
         </td>
       ))}
     </tr>
 
     <tr>
       <th>Gutter width</th>
-      {forEach(
-        SCSS_VARIABLES.grid,
-        (data: { key: string; value: { ['gutter-width']: string } }) => (
-          <td key={data.key}>{data.value['gutter-width']}</td>
-        ),
-      )}
+      {forEach(SCSS_VARIABLES.grid, ({ key, value }) => (
+        <td key={key}>{value['gutter-width']}</td>
+      ))}
     </tr>
 
     <tr>
diff --git a/packages/documentation/src/stories/foundation/layout/grid/grid.docs.mdx b/packages/documentation/src/stories/foundation/layout/grid/grid.docs.mdx
index ef1d81a595..afeaae780f 100644
--- a/packages/documentation/src/stories/foundation/layout/grid/grid.docs.mdx
+++ b/packages/documentation/src/stories/foundation/layout/grid/grid.docs.mdx
@@ -12,7 +12,7 @@ import SampleScssMixins from './grid-scss-mixins.sample.scss?raw';
 
 <div className="lead">
   Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a
-  twelve column system, {Object.keys(SCSS_VARIABLES.breakpoint).length} default responsive tiers,
+  twelve column system, {SCSS_VARIABLES['breakpoint-count']} default responsive tiers,
   Sass variables and mixins, and dozens of predefined classes.
 </div>
 
@@ -35,7 +35,7 @@ The above example creates three equal-width columns across all devices and viewp
 
 Breaking it down, here’s how the grid system comes together:
 
-- **Our grid supports {Object.keys(SCSS_VARIABLES.breakpoint).length} responsive breakpoints.** Breakpoints are based on `min-width` media queries, meaning they affect that breakpoint and all those above it. This means you can control container and column sizing and behavior by each breakpoint.
+- **Our grid supports <span>{SCSS_VARIABLES['breakpoint-count']}</span> responsive breakpoints.** Breakpoints are based on `min-width` media queries, meaning they affect that breakpoint and all those above it. This means you can control container and column sizing and behavior by each breakpoint.
 - **Container (e.g. `.container`) center and horizontally pad your content.**<br/>
   Don't nest `.containers`, but use them (for example) as a wrapper for your content area:
   <Source language="html" dark code={SampleContainer}></Source>
@@ -46,7 +46,7 @@ Breaking it down, here’s how the grid system comes together:
 
 ## Grid options
 
-Our grid system can adapt across all {Object.keys(SCSS_VARIABLES.breakpoint).length} breakpoints.
+Our grid system can adapt across all <span>{SCSS_VARIABLES['breakpoint-count']}</span> breakpoints.
 Each of these breakpoints have their own specifications, a unique class prefix, and some modifiers.
 
 <GridTable />
@@ -75,7 +75,7 @@ Use `.col-{breakpoint}-auto` classes to size columns based on the natural width
 
 ## Responsive classes
 
-Our grid includes {SCSS_VARIABLES['breakpoint-count']} tiers of predefined classes for building complex responsive layouts.
+Our grid includes <span>{SCSS_VARIABLES['breakpoint-count']}</span> tiers of predefined classes for building complex responsive layouts.
 
 ### All breakpoints
 
diff --git a/packages/documentation/src/stories/foundation/layout/shared.blocks.tsx b/packages/documentation/src/stories/foundation/layout/shared.blocks.tsx
index 736cb7485f..449c92db1d 100644
--- a/packages/documentation/src/stories/foundation/layout/shared.blocks.tsx
+++ b/packages/documentation/src/stories/foundation/layout/shared.blocks.tsx
@@ -2,7 +2,8 @@ import { parse } from '@/utils/sass-export';
 import { forEach } from '@/utils/react';
 import scss from './shared.module.scss';
 
-export const SCSS_VARIABLES = parse(scss);
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+export const SCSS_VARIABLES: any = parse(scss);
 
 export const SpecTable = (props: { children: string | JSX.Element | JSX.Element[] }) => (
   <div className="table-responsive my-big">
@@ -10,16 +11,13 @@ export const SpecTable = (props: { children: string | JSX.Element | JSX.Element[
       <thead>
         <tr>
           <th></th>
-          {forEach(
-            SCSS_VARIABLES.breakpoint,
-            (data: { key: string; value: { dimensions: string } }) => (
-              <th key={data.key}>
-                {data.key}
-                <br />
-                <small className="fw-normal">{data.value.dimensions}</small>
-              </th>
-            ),
-          )}
+          {forEach(SCSS_VARIABLES.breakpoint, ({ key, value }) => (
+            <th key={key}>
+              {key}
+              <br />
+              <small className="fw-normal">{value.dimensions}</small>
+            </th>
+          ))}
         </tr>
       </thead>
       <tbody>{props.children}</tbody>
diff --git a/packages/documentation/src/stories/foundation/typography/typography.blocks.tsx b/packages/documentation/src/stories/foundation/typography/typography.blocks.tsx
index 5b1bdd2d24..8f4aaeb416 100644
--- a/packages/documentation/src/stories/foundation/typography/typography.blocks.tsx
+++ b/packages/documentation/src/stories/foundation/typography/typography.blocks.tsx
@@ -4,7 +4,8 @@ import { forEach } from '@/utils/react';
 import { round } from '@/utils/units';
 import scss from './typography.module.scss';
 
-const SCSS_VARIABLES = parse(scss);
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+const SCSS_VARIABLES: any = parse(scss);
 const baseFontSize = parseFloat(SCSS_VARIABLES.base.fontSize);
 
 export function FontFaceWrapper(props: { children: React.ReactElement[] | null }) {
@@ -57,25 +58,25 @@ export function FontSizesAndLineheights() {
           </tr>
         </thead>
         <tbody>
-          {forEach(SCSS_VARIABLES.fontSizes, (data: { key: string; value: any }) => (
-            <tr key={data.key}>
-              <th>font-size-{data.key}</th>
+          {forEach(SCSS_VARIABLES.fontSizes, ({ key, value }) => (
+            <tr key={key}>
+              <th>font-size-{key}</th>
               <td>
-                <code>font-size-{data.key}</code>
+                <code>font-size-{key}</code>
               </td>
               <td>
-                <code>$font-size-{data.key}</code>
+                <code>$font-size-{key}</code>
               </td>
               <td>
-                <span>{`${round(parseFloat(data.value) * baseFontSize, 4)}px`}</span>
+                <span>{`${round(parseFloat(value) * baseFontSize, 4)}px`}</span>
                 <br />
-                <span className="fs-tiny text-muted">{data.value}</span>
+                <span className="fs-tiny text-muted">{value}</span>
               </td>
               <td>
-                <span>1.{parseInt(data.key) >= 24 ? '2' : '5'}</span>
+                <span>1.{parseInt(key) >= 24 ? '2' : '5'}</span>
                 <br />
                 <span className="fs-tiny text-muted">
-                  {round(parseFloat(data.value) * (parseFloat(data.key) >= 24 ? 1.2 : 1.5), 4)}
+                  {round(parseFloat(value) * (parseFloat(key) >= 24 ? 1.2 : 1.5), 4)}
                   rem
                 </span>
               </td>
@@ -94,20 +95,20 @@ export function FontCurves() {
         <thead>
           <tr>
             <th>Name</th>
-            {forEach(SCSS_VARIABLES.fontCurves.tiny, (data: { key: string; value: any }) => (
-              <th key={data.key}>{data.key}</th>
+            {forEach(SCSS_VARIABLES.fontCurves.tiny, ({ key }) => (
+              <th key={key}>{key}</th>
             ))}
           </tr>
         </thead>
         <tbody>
-          {forEach(SCSS_VARIABLES.fontCurves, (data1: { key: string; value: any }) => (
-            <tr key={data1.key}>
-              <th>{data1.key}</th>
-              {forEach(data1.value, (data2: { key: string; value: any }) => (
-                <td key={data2.key}>
-                  <span>{round(parseFloat(data2.value) * baseFontSize, 4)}px</span>
+          {forEach(SCSS_VARIABLES.fontCurves, curve => (
+            <tr key={curve.key}>
+              <th>{curve.key}</th>
+              {forEach(curve.value, ({ key, value }) => (
+                <td key={key}>
+                  <span>{round(parseFloat(value) * baseFontSize, 4)}px</span>
                   <br />
-                  <span className="fs-tiny text-muted">{data2.value}</span>
+                  <span className="fs-tiny text-muted">{value}</span>
                 </td>
               ))}
             </tr>
diff --git a/packages/documentation/src/stories/getting-started/list-component.ts b/packages/documentation/src/stories/getting-started/list-component.ts
index bb407a93dc..9f4fdd8948 100644
--- a/packages/documentation/src/stories/getting-started/list-component.ts
+++ b/packages/documentation/src/stories/getting-started/list-component.ts
@@ -35,7 +35,7 @@ export class ListComponent extends LitElement {
 
   private _indexTask = new Task(this, {
     task: async ([packageType]) => {
-      const response = (await fetch(INDEX_PATH)) as any;
+      const response = await fetch(INDEX_PATH);
       const rawData: IndexInput = await response.json();
       return (
         Object.values(rawData.entries)
diff --git a/packages/documentation/src/stories/getting-started/migration-guide/migrationv4-5-manual-list.component.ts b/packages/documentation/src/stories/getting-started/migration-guide/migrationv4-5-manual-list.component.ts
index 4f27864616..8734fd75bb 100644
--- a/packages/documentation/src/stories/getting-started/migration-guide/migrationv4-5-manual-list.component.ts
+++ b/packages/documentation/src/stories/getting-started/migration-guide/migrationv4-5-manual-list.component.ts
@@ -2055,7 +2055,7 @@ export class MigrationV45ManualListComponent extends LitElement {
     const keys = path.split('.');
     const last_key = keys.pop();
     if (last_key) {
-      const last_obj = keys.reduce((o: any, k: any) => o[k], this.state);
+      const last_obj = keys.reduce((o, k) => o[k], this.state);
       last_obj[last_key] = !last_obj[last_key];
     }
   }
diff --git a/packages/documentation/src/stories/getting-started/migration-guide/types.ts b/packages/documentation/src/stories/getting-started/migration-guide/types.ts
index b38fe5b570..926ecda60f 100644
--- a/packages/documentation/src/stories/getting-started/migration-guide/types.ts
+++ b/packages/documentation/src/stories/getting-started/migration-guide/types.ts
@@ -1,4 +1,4 @@
-interface TodoListChecks {
+export interface TodoListChecks {
   general: {
     naming_cwfpackagename: boolean;
     naming_entryfiles: boolean;
diff --git a/packages/documentation/src/stories/getting-started/migration-guide/util/persist.util.ts b/packages/documentation/src/stories/getting-started/migration-guide/util/persist.util.ts
index 74573b13df..2108923793 100644
--- a/packages/documentation/src/stories/getting-started/migration-guide/util/persist.util.ts
+++ b/packages/documentation/src/stories/getting-started/migration-guide/util/persist.util.ts
@@ -1,16 +1,11 @@
-export const MIGRATION_TYPE: string = 'post:migration_type';
-export const MIGRATION_CHECKS_KEY: string = 'post:migration_checks';
+export const MIGRATION_TYPE = 'post:migration_type';
+export const MIGRATION_CHECKS_KEY = 'post:migration_checks';
 
-export function getLocaleStorage(key: string): any | null {
+export function getLocaleStorage(key: string): string | null {
   const value = window.localStorage.getItem(key);
-
-  if (!value) {
-    return null;
-  }
-
-  return JSON.parse(value);
+  return !value ? null : JSON.parse(value);
 }
 
-export function setLocaleStorage(key: string, value: any): void {
+export function setLocaleStorage(key: string, value: unknown): void {
   window.localStorage.setItem(key, JSON.stringify(value));
 }
diff --git a/packages/documentation/src/stories/templates/error-page/error-page.stories.ts b/packages/documentation/src/stories/templates/error-page/error-page.stories.ts
index e53b140354..71069b195c 100644
--- a/packages/documentation/src/stories/templates/error-page/error-page.stories.ts
+++ b/packages/documentation/src/stories/templates/error-page/error-page.stories.ts
@@ -1,4 +1,4 @@
-import { Args, Meta, StoryObj } from '@storybook/web-components';
+import { Meta, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 
 const meta: Meta = {
@@ -10,7 +10,7 @@ const meta: Meta = {
   render,
 };
 
-function render(_args: Args) {
+function render() {
   return html`
     <div class="bg-light error-container">
       <div class="container">
diff --git a/packages/documentation/src/stories/utilities/background/background.docs.mdx b/packages/documentation/src/stories/utilities/background/background.docs.mdx
index 3dd3f6ab9f..0feba20683 100644
--- a/packages/documentation/src/stories/utilities/background/background.docs.mdx
+++ b/packages/documentation/src/stories/utilities/background/background.docs.mdx
@@ -32,32 +32,32 @@ To set a background on an element, simply add a `.bg-{colorname}` class to it.
 #### Base
 
 <section className="background-container__section">
-  {forEach(SCSS_VARIABLES.base, function (data) {
-    return <BackgroundContainer key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES.base, function ({ key, value }) {
+    return <BackgroundContainer key={key} name={key} color={value} />;
   })}
 </section>
 
 #### Signal
 
 <section className="background-container__section">
-  {forEach(SCSS_VARIABLES.signal, function (data) {
-    return <BackgroundContainer key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES.signal, function ({ key, value }) {
+    return <BackgroundContainer key={key} name={key} color={value} />;
   })}
 </section>
 
 #### Signal backgrounds
 
 <section className="background-container__section">
-  {forEach(SCSS_VARIABLES['signal-background'], function (data) {
-    return <BackgroundContainer key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES['signal-background'], function ({ key, value }) {
+    return <BackgroundContainer key={key} name={key} color={value} />;
   })}
 </section>
 
 #### Accent
 
 <section className="background-container__section">
-  {forEach(SCSS_VARIABLES.accent, function (data) {
-    return <BackgroundContainer key={data.key} name={data.key} color={data.value} />;
+  {forEach(SCSS_VARIABLES.accent, function ({ key, value }) {
+    return <BackgroundContainer key={key} name={key} color={value} />;
   })}
 </section>
 
diff --git a/packages/documentation/src/stories/utilities/spacing/spacing.docs.mdx b/packages/documentation/src/stories/utilities/spacing/spacing.docs.mdx
index 356dbdad8a..ecd61e9877 100644
--- a/packages/documentation/src/stories/utilities/spacing/spacing.docs.mdx
+++ b/packages/documentation/src/stories/utilities/spacing/spacing.docs.mdx
@@ -44,14 +44,14 @@ By default, the above classes apply to all breakpoints.
 ##### Manually specifying breakpoints
 
 If you need to change the size or spacing of an element based on the breakpoint, you should
-mention it in the class name using one of the following infixes: {Object.values(SpacingStories.SCSS_VARIABLES.breakpoints).map((s, index, array) => (<span><code>{`-${s}-`}</code>{index !== array.length - 1 && ', '}</span>))}.
+mention it in the class name using one of the following infixes: {Object.values(SpacingStories.SCSS_VARIABLES.breakpoints).map((s, index, array) => (<span key={s}><code>{`-${s}-`}</code>{index !== array.length - 1 && ', '}</span>))}.
 When a breakpoint is specified, the size applies to that breakpoint and to all those that are
 larger.
 
 The square below has a big padding from the large breakpoint (i.e. `.p-lg-big`) and a regular
 padding below (i.e. `.p-regular`).
 
-<Canvas of={SpacingStories.responsiveExample} />
+<Canvas of={SpacingStories.ResponsiveExample} />
 
 ##### Using automatic responsive behavior
 
@@ -60,4 +60,4 @@ Another way to define a responsive size is to use the `-r` suffix. It allows to
 The square below has a "large" responsive padding, which means the padding size
 automatically changes based on the breakpoint but remains visually consistent.
 
-<Canvas of={SpacingStories.automaticResponsiveExample} />
+<Canvas of={SpacingStories.AutomaticResponsiveExample} />
diff --git a/packages/documentation/src/stories/utilities/spacing/spacing.stories.ts b/packages/documentation/src/stories/utilities/spacing/spacing.stories.ts
index f9f23c1cd6..16aaeab012 100644
--- a/packages/documentation/src/stories/utilities/spacing/spacing.stories.ts
+++ b/packages/documentation/src/stories/utilities/spacing/spacing.stories.ts
@@ -5,7 +5,8 @@ import { parse } from '@/utils/sass-export';
 import scss from './spacing.module.scss';
 import { MetaExtended } from '@root/types';
 
-export const SCSS_VARIABLES = parse(scss);
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+export const SCSS_VARIABLES: any = parse(scss);
 
 const sizingOptions = ['0', '1', '2', '3', '4', '5', 'auto', ...Object.keys(SCSS_VARIABLES.sizes)];
 
@@ -142,8 +143,8 @@ export const Default: Story = {
   ],
 };
 
-export const responsiveExample: Story = {
-  render: (args: Args) => {
+export const ResponsiveExample: Story = {
+  render: () => {
     return html` <div class="h-bigger-giant w-bigger-giant p-regular p-lg-big"></div> `;
   },
   decorators: [
@@ -160,8 +161,8 @@ export const responsiveExample: Story = {
   ],
 };
 
-export const automaticResponsiveExample: Story = {
-  render: (args: Args) => {
+export const AutomaticResponsiveExample: Story = {
+  render: () => {
     return html` <div class="h-bigger-giant w-bigger-giant p-large-r"></div> `;
   },
   decorators: [
diff --git a/packages/documentation/src/stories/utilities/text/text.blocks.tsx b/packages/documentation/src/stories/utilities/text/text.blocks.tsx
index a4ed8f4401..c952fba55d 100644
--- a/packages/documentation/src/stories/utilities/text/text.blocks.tsx
+++ b/packages/documentation/src/stories/utilities/text/text.blocks.tsx
@@ -2,7 +2,8 @@ import React from 'react';
 import { parse } from '@/utils/sass-export';
 import scss from './text.module.scss';
 
-export const SCSS_VARIABLES = parse(scss);
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+export const SCSS_VARIABLES: any = parse(scss);
 
 export const TextUtilityAPI = (props: {
   cssPrefix: string;
@@ -29,7 +30,7 @@ export const TextUtilityAPI = (props: {
       )}
       <dt className="col-3">Values:</dt>
       <dd className="col-9">
-        {props.values.map((value, index) => (
+        {props.values.map(value => (
           <code key={value} className="me-2">
             {value}
           </code>
diff --git a/packages/documentation/src/utils/bomb-args.ts b/packages/documentation/src/utils/bomb-args.ts
index 74f827d88f..bc62f1f766 100644
--- a/packages/documentation/src/utils/bomb-args.ts
+++ b/packages/documentation/src/utils/bomb-args.ts
@@ -6,13 +6,15 @@
  * @param variants List of args to blow up
  * @returns
  */
-export const bombArgs = (variants: { [key: string]: Array<unknown> }) => {
+export const bombArgs = (variants: { [key: string]: unknown[] | undefined }) => {
   return (function recurse(keys): Array<{ [key: string]: unknown }> {
     if (!keys.length) return [{}];
-    let result = recurse(keys.slice(1));
-    return variants[keys[0]].reduce(
+    const result = recurse(keys.slice(1));
+    const variantsArray = variants[keys[0]] ?? [];
+
+    return variantsArray.reduce(
       (acc: Array<{ [key: string]: unknown }>, value) =>
-        acc.concat(result.map((item: any) => Object.assign({}, item, { [keys[0]]: value }))),
+        acc.concat(result.map((item: object) => Object.assign({}, item, { [keys[0]]: value }))),
       [],
     );
   })(Object.keys(variants));
diff --git a/packages/documentation/src/utils/codeOrSourceMdx.tsx b/packages/documentation/src/utils/codeOrSourceMdx.tsx
index 1b1aad9e61..2b5796870c 100644
--- a/packages/documentation/src/utils/codeOrSourceMdx.tsx
+++ b/packages/documentation/src/utils/codeOrSourceMdx.tsx
@@ -3,6 +3,7 @@ import { Source } from '@storybook/blocks';
 import { Code } from '@storybook/components';
 import { SourceDarkMode } from '@/../.storybook/preview';
 
+/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */
 // @ts-ignore
 export const CodeOrSourceMdx = ({ className, children, ...rest }) => {
   // markdown-to-jsx does not add className to inline code
diff --git a/packages/documentation/src/utils/get-attributes.ts b/packages/documentation/src/utils/get-attributes.ts
index 1df5b958e8..d4fbc6b43a 100644
--- a/packages/documentation/src/utils/get-attributes.ts
+++ b/packages/documentation/src/utils/get-attributes.ts
@@ -1,10 +1,10 @@
 import { Args } from '@storybook/web-components';
 
-export const getAttributes = (args: Args, condition?: (arg: any) => boolean): Args => {
-  const attrs: { [key: string]: any } = {};
+export const getAttributes = (args: Args, condition?: (arg: unknown) => boolean): Args => {
+  const attrs: { [key: string]: unknown } = {};
 
   for (const key in args) {
-    if (args.hasOwnProperty(key) && condition && condition(args[key])) {
+    if (Object.hasOwn(args, key) && condition && condition(args[key])) {
       const attrKey = key.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
 
       // Cast boolean false to string, so it's displayed in the docs code block. False values are otherwise omitted
diff --git a/packages/documentation/src/utils/inputComponentsGetCombinations.ts b/packages/documentation/src/utils/inputComponentsGetCombinations.ts
index c8d8a8b9e6..7604cb204f 100644
--- a/packages/documentation/src/utils/inputComponentsGetCombinations.ts
+++ b/packages/documentation/src/utils/inputComponentsGetCombinations.ts
@@ -36,14 +36,14 @@ export const COMBINATIONS = [
 
 export function getCombinations(
   argumentName: string,
-  argumentValues: Array<unknown>,
+  argumentValues: unknown[] | undefined,
   combinations: Array<{
     label: string;
-    [propName: string]: any;
+    [propName: string]: unknown;
   }>,
 ) {
-  let result: Array<Object> = [];
-  for (const argumentValue of argumentValues) {
+  let result: Array<object> = [];
+  for (const argumentValue of argumentValues ?? []) {
     result = [
       ...result,
       ...combinations.map(c => ({
diff --git a/packages/documentation/src/utils/react.ts b/packages/documentation/src/utils/react.ts
index 98cbe063b5..431f2f17fe 100644
--- a/packages/documentation/src/utils/react.ts
+++ b/packages/documentation/src/utils/react.ts
@@ -1,7 +1,11 @@
-export function forEach (iterable: any[] | object, callback: Function) {
+import { ReactNode } from 'react';
+
+export function forEach(
+  iterable: string[] | number[] | object,
+  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+  callback: ({ key, value }: { key: string; value: any }) => ReactNode | ReactNode[],
+) {
   const input = Object.assign(iterable);
 
-  return Object
-    .entries(input)
-    .map(([key, value]) => callback({ key, value }));
+  return Object.entries(input).map(([key, value]) => callback({ key, value }));
 }
diff --git a/packages/documentation/src/utils/spread-args.ts b/packages/documentation/src/utils/spread-args.ts
index 40ffa7d228..1284218c0d 100644
--- a/packages/documentation/src/utils/spread-args.ts
+++ b/packages/documentation/src/utils/spread-args.ts
@@ -1,11 +1,10 @@
-import { Args } from '@storybook/web-components';
 import { ElementPart, nothing } from 'lit';
 import { AsyncDirective, directive } from 'lit-html/async-directive.js';
 
 type Props = Partial<HTMLElement>;
 type Attrs = Record<string, string | null>;
 
-function formatAttrs(argKey: string, argValue: any): Attrs {
+function formatAttrs(argKey: string, argValue: unknown): Attrs {
   // key to kebab case
   const attrKey = argKey.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
 
@@ -24,7 +23,7 @@ function formatAttrs(argKey: string, argValue: any): Attrs {
 export class SpreadArgsDirective<T extends HTMLElement> extends AsyncDirective {
   prevAttrs: Attrs = {};
 
-  render(_args: Args) {
+  render() {
     return nothing;
   }
 
@@ -34,31 +33,26 @@ export class SpreadArgsDirective<T extends HTMLElement> extends AsyncDirective {
     const props: Props = {};
     const attrs: Attrs = {};
 
-    Object
-      .entries(args)
-      .forEach(([argKey, argValue]) => {
-        if (argKey in HTMLElement.prototype) {
-          Object.assign(props, {[argKey]: argValue});
-        } else {
-          Object.assign(attrs, formatAttrs(argKey, argValue));
-        }
-      });
+    Object.entries(args).forEach(([argKey, argValue]) => {
+      if (argKey in HTMLElement.prototype) {
+        Object.assign(props, { [argKey]: argValue });
+      } else {
+        Object.assign(attrs, formatAttrs(argKey, argValue));
+      }
+    });
 
     // remove previously set attributes
-    Object
-      .keys(this.prevAttrs)
-      .forEach(attrKey => element.removeAttribute(attrKey));
+    Object.keys(this.prevAttrs).forEach(attrKey => element.removeAttribute(attrKey));
 
     // set new attributes
-    Object
-      .entries(attrs)
+    Object.entries(attrs)
       .filter(([_key, value]) => value !== null)
       .forEach(([attrKey, attrValue]) => element.setAttribute(attrKey, attrValue ?? ''));
 
     // set properties
-    Object
-      .entries(args)
-      .forEach(([argKey, argValue]) => Object.assign(element, {[argKey]: argValue}));
+    Object.entries(args).forEach(([argKey, argValue]) =>
+      Object.assign(element, { [argKey]: argValue }),
+    );
 
     // save attributes to be able to remove them on next run
     this.prevAttrs = attrs;
diff --git a/packages/documentation/src/utils/version.ts b/packages/documentation/src/utils/version.ts
index a3ebd40dad..731fb14697 100644
--- a/packages/documentation/src/utils/version.ts
+++ b/packages/documentation/src/utils/version.ts
@@ -1,22 +1,45 @@
 import * as packageJson from '../../package.json';
 
-export const DEPENDENCIES: any = {
-  [packageJson.name]: packageJson.version,
-  ...packageJson.dependencies,
-  ...packageJson.devDependencies,
-  ...packageJson.peerDependencies,
+interface IPackageJson {
+  name: string;
+  version: string;
+  dependencies?: object;
+  devDependencies?: object;
+  peerDependencies?: object;
+  [key: string]: unknown;
+}
+
+interface IDependencies {
+  [key: string]: string;
+}
+
+interface IVersionFilterRegexes {
+  [key: string]: RegExp;
+}
+
+interface IVersionFilterMap {
+  [key: string]: string;
+}
+
+const pkg = packageJson as IPackageJson;
+
+export const DEPENDENCIES: IDependencies = {
+  [pkg.name]: pkg.version,
+  ...pkg.dependencies,
+  ...pkg.devDependencies,
+  ...pkg.peerDependencies,
 };
 
-const versionFilterRegexes: any = {
+const versionFilterRegexes: IVersionFilterRegexes = {
   major: /^(?:(\d+)\.\d+\.\d+)/,
   minor: /^(?:\d+\.(\d+)\.\d+)/,
   patch: /^(?:\d+\.\d+\.(\d+))/,
-  pre: /^(?:\d+\.\d+\.\d+[ .:,;!?_~`'"^*+\-=<>#&$%@|\/()[\]{}]?(.*))/,
+  pre: /^(?:\d+\.\d+\.\d+[ .:,;!?_~`'"^*+\-=<>#&$%@|/()[\]{}]?(.*))/,
   majorminor: /^(?:(\d+\.\d+)\.\d+)/,
   majorminorpatch: /^(\d+\.\d+\.\d+)/,
 };
 
-const versionFilterMap: any = {
+const versionFilterMap: IVersionFilterMap = {
   major: 'major',
   M: 'major',
   minor: 'minor',
@@ -28,7 +51,7 @@ const versionFilterMap: any = {
   Mmp: 'majorminorpatch',
 };
 
-export function getVersion(version: string, filter: string = '') {
+export function getVersion(version: string, filter = '') {
   const cleanVersion = version.replace(/^[^\d]+/, '');
 
   if (filter) {
diff --git a/packages/documentation/tsconfig.eslint.json b/packages/documentation/tsconfig.eslint.json
new file mode 100644
index 0000000000..1dbcdfcbd9
--- /dev/null
+++ b/packages/documentation/tsconfig.eslint.json
@@ -0,0 +1,5 @@
+{
+  "extends": "./tsconfig.json",
+  "include": [".storybook", "src", "types"],
+  "exclude": ["node_modules"]
+}
diff --git a/packages/documentation/types/json.ts b/packages/documentation/types/json.ts
index bbab69d2fb..d282b60803 100644
--- a/packages/documentation/types/json.ts
+++ b/packages/documentation/types/json.ts
@@ -1,4 +1,4 @@
 declare module '*.json' {
-  const value: any;
+  const value: unknown;
   export default value;
 }
diff --git a/packages/documentation/types/storybook.ts b/packages/documentation/types/storybook.ts
index 3c2a07ce65..aace6d8015 100644
--- a/packages/documentation/types/storybook.ts
+++ b/packages/documentation/types/storybook.ts
@@ -12,7 +12,7 @@ export type TagPackagePrefix<K> = K extends string ? `package:${K}` : K;
 export interface MetaComponent<T = Args> extends MetaExtended<T> {
   tags: [TagPackagePrefix<PackageType>, ...string[]];
   parameters: {
-    [key: string]: any;
+    [key: string]: unknown;
     design: DesignParameter;
   };
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3cc066ade5..30531ec77b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -574,12 +574,30 @@ importers:
       '@types/react-syntax-highlighter':
         specifier: 15.5.13
         version: 15.5.13
+      '@typescript-eslint/eslint-plugin':
+        specifier: 5.62.0
+        version: 5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.57.0)(typescript@5.3.3))(eslint@8.57.0)(typescript@5.3.3)
+      '@typescript-eslint/parser':
+        specifier: 5.62.0
+        version: 5.62.0(eslint@8.57.0)(typescript@5.3.3)
       cypress:
         specifier: 13.9.0
         version: 13.9.0
       cypress-axe:
         specifier: 1.5.0
         version: 1.5.0(axe-core@4.7.0)(cypress@13.9.0)
+      eslint:
+        specifier: 8.57.0
+        version: 8.57.0
+      eslint-config-prettier:
+        specifier: 9.1.0
+        version: 9.1.0(eslint@8.57.0)
+      eslint-plugin-mdx:
+        specifier: 3.1.5
+        version: 3.1.5(eslint@8.57.0)
+      eslint-plugin-storybook:
+        specifier: 0.8.0
+        version: 0.8.0(eslint@8.57.0)(typescript@5.3.3)
       lit:
         specifier: 3.1.3
         version: 3.1.3
@@ -2767,6 +2785,10 @@ packages:
     resolution: {integrity: sha512-H4FrOVtNyWC8MUwL3UfjOsAihHvT1Pe8POj3JvjXhSTJipsZMtgUALCT4mGyYZNxymkUfOw3PUj6dE4QPp6osQ==}
     engines: {node: ^16.14.0 || >=18.0.0}
 
+  '@npmcli/config@8.3.3':
+    resolution: {integrity: sha512-sIMKHiiYr91ALiHjhPq64F5P/SCaiSyDfpNmgYHtlIJtLY445+3+r3VoREzpdDrOwIqwQ6iEHinbTfaocL0UgA==}
+    engines: {node: ^16.14.0 || >=18.0.0}
+
   '@npmcli/fs@3.1.0':
     resolution: {integrity: sha512-7kZUAaLscfgbwBQRbvdMYaZOWyMEcPTH/tJjnyAWJ/dvvs9Ef+CERx/qJb9GExJpl1qipaDGn7KqHnFGGixd0w==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
@@ -2780,6 +2802,14 @@ packages:
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
     hasBin: true
 
+  '@npmcli/map-workspaces@3.0.6':
+    resolution: {integrity: sha512-tkYs0OYnzQm6iIRdfy+LcLBjcKuQCeE5YLb8KnrIlutJfheNaPvPpgoFEyEFgbjzl5PLZ3IA/BWAwRU0eHuQDA==}
+    engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
+
+  '@npmcli/name-from-folder@2.0.0':
+    resolution: {integrity: sha512-pwK+BfEBZJbKdNYpHHRTNBwBoqrN/iIMO0AiGvYsp3Hoaq0WbgGSWQR6SCldZovoDpY3yje5lkFUe6gsDgJ2vg==}
+    engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
+
   '@npmcli/node-gyp@3.0.0':
     resolution: {integrity: sha512-gp8pRXC2oOxu0DUE1/M3bYtb1b3/DbJ5aM113+XJBgfXdussRAsX0YOrOhdd8WvnAR6auDBvJomGAkLKA5ydxA==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
@@ -2954,6 +2984,10 @@ packages:
     resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
     engines: {node: '>=14'}
 
+  '@pkgr/core@0.1.1':
+    resolution: {integrity: sha512-cq8o4cWH0ibXh9VGi5P20Tu9XF/0fFXl9EUinr9QfTM7a7p0oTA4iJRCQWppXR1Pg8dSM0UCItCkPwsk9qWWYA==}
+    engines: {node: ^12.20.0 || ^14.18.0 || >=16.0.0}
+
   '@popperjs/core@2.11.8':
     resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
 
@@ -3296,6 +3330,9 @@ packages:
   '@storybook/csf-tools@8.0.10':
     resolution: {integrity: sha512-xUc6fVIKoCujf/7JZhkYjrVXeNsTSoDrZFNmqLEmtfktJVqYdXY4LuSAtlBmAIyETi09ULTuuVexrcKFwjzuBA==}
 
+  '@storybook/csf@0.0.1':
+    resolution: {integrity: sha512-USTLkZze5gkel8MYCujSRBVIrUQ3YPBrLOx7GNk/0wttvVtlzWXAq9eLbQ4p/NicGxP+3T7KPEMVV//g+yubpw==}
+
   '@storybook/csf@0.0.2--canary.4566f4d.1':
     resolution: {integrity: sha512-9OVvMVh3t9znYZwb0Svf/YQoxX2gVOeQTGe2bses2yj+a3+OJnCrUF3/hGv6Em7KujtOdL2LL+JnG49oMVGFgQ==}
 
@@ -3466,6 +3503,9 @@ packages:
     resolution: {integrity: sha512-c8nj8BaOExmZKO2DXhDfegyhSGcG9E/mPN3U13L+/PsoWm1uaGiHHjxqSHQiasDBQwDA3aHuw9+9spYAP1qvvg==}
     engines: {node: ^16.14.0 || >=18.0.0}
 
+  '@types/acorn@4.0.6':
+    resolution: {integrity: sha512-veQTnWP+1D/xbxVrPC3zHnCZRjSrKfhbMUlEA43iMZLu7EsnTtkJklIuwrCPbOi8YkvDQAiW05VQQFvvz9oieQ==}
+
   '@types/aria-query@5.0.1':
     resolution: {integrity: sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==}
 
@@ -3490,6 +3530,9 @@ packages:
   '@types/bonjour@3.5.10':
     resolution: {integrity: sha512-p7ienRMiS41Nu2/igbJxxLDWrSZ0WxM8UQgCeO9KhoVF7cOVFkrKsiDr1EsJIla8vV3oEEjGcz11jc5yimhzZw==}
 
+  '@types/concat-stream@2.0.3':
+    resolution: {integrity: sha512-3qe4oQAPNwVNwK4C9c8u+VJqv9kez+2MR4qJpoPFfXtgxxif1QbFusvXzK0/Wra2VX07smostI2VMmJNSpZjuQ==}
+
   '@types/connect-history-api-fallback@1.5.0':
     resolution: {integrity: sha512-4x5FkPpLipqwthjPsF7ZRbOv3uoLUFkTA9G9v583qi4pACvq0uTELrB8OLUzPWUI4IJIyvM85vzkV1nyiI2Lig==}
 
@@ -3508,6 +3551,9 @@ packages:
   '@types/css-modules@1.0.5':
     resolution: {integrity: sha512-oeKafs/df9lwOvtfiXVliZsocFVOexK9PZtLQWuPeuVCFR7jwiqlg60lu80JTe5NFNtH3tnV6Fs/ySR8BUPHAw==}
 
+  '@types/debug@4.1.12':
+    resolution: {integrity: sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==}
+
   '@types/detect-port@1.3.3':
     resolution: {integrity: sha512-bV/jQlAJ/nPY3XqSatkGpu+nGzou+uSwrH1cROhn+jBFg47yaNH+blW4C7p9KhopC7QxCv/6M86s37k8dMk0Yg==}
 
@@ -3526,6 +3572,9 @@ packages:
   '@types/eslint@8.37.0':
     resolution: {integrity: sha512-Piet7dG2JBuDIfohBngQ3rCt7MgO9xCO4xIMKxBThCq5PNRB91IjlJ10eJVwfoNtvTErmxLzwBZ7rHZtbOMmFQ==}
 
+  '@types/estree-jsx@1.0.5':
+    resolution: {integrity: sha512-52CcUVNFyfb1A2ALocQw/Dd1BQFNmSdkuC3BkZ6iqhdMfQz7JWOFRuJFloOzjk+6WijU56m9oKXFAXc7o3Towg==}
+
   '@types/estree@1.0.5':
     resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
 
@@ -3553,6 +3602,9 @@ packages:
   '@types/iframe-resizer@3.5.13':
     resolution: {integrity: sha512-/Np2ntlOWd/NOHs23Mj7QlNEnZ6SL02AWWdYZLm4RQNukDdpqpagfMAdin5FvQDLngR8LWfh/qUnYxuDmR8BCg==}
 
+  '@types/is-empty@1.2.3':
+    resolution: {integrity: sha512-4J1l5d79hoIvsrKh5VUKVRA1aIdsOb10Hu5j3J2VfP/msDnfTdGPmNp2E1Wg+vs97Bktzo+MZePFFXSGoykYJw==}
+
   '@types/is-function@1.0.1':
     resolution: {integrity: sha512-A79HEEiwXTFtfY+Bcbo58M2GRYzCr9itHWzbzHVFNEYCcoU/MMGwYYf721gBrnhpj1s6RGVVha/IgNFnR0Iw/Q==}
 
@@ -3595,6 +3647,9 @@ packages:
   '@types/mdast@3.0.15':
     resolution: {integrity: sha512-LnwD+mUEfxWMa1QpDraczIn6k0Ee3SMicuYSSzS6ZYl2gKS09EClnJYGd8Du6rfc5r/GZEk5o1mRb8TaTj03sQ==}
 
+  '@types/mdast@4.0.4':
+    resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==}
+
   '@types/mdx@2.0.13':
     resolution: {integrity: sha512-+OWZQfAYyio6YkJb3HLxDrvnx6SWWDbC0zVPfBRzUk0/nqoDyf6dNxQi3eArPe8rJ473nobTMQ/8Zk+LxJ+Yuw==}
 
@@ -3610,6 +3665,9 @@ packages:
   '@types/mock-fs@4.13.4':
     resolution: {integrity: sha512-mXmM0o6lULPI8z3XNnQCpL0BGxPwx1Ul1wXYEPBGl4efShyxW2Rln0JOPEWGyZaYZMM6OVXM/15zUuFMY52ljg==}
 
+  '@types/ms@0.7.34':
+    resolution: {integrity: sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==}
+
   '@types/node-fetch@2.6.11':
     resolution: {integrity: sha512-24xFj9R5+rfQJLRyM56qh+wnVSYhyXC2tkoBndtY0U+vubqNsYXGjufB2nn8Q6gt0LrARwL6UBtMCSVCwl4B1g==}
 
@@ -3682,6 +3740,9 @@ packages:
   '@types/stack-utils@2.0.1':
     resolution: {integrity: sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==}
 
+  '@types/supports-color@8.1.3':
+    resolution: {integrity: sha512-Hy6UMpxhE3j1tLpl27exp1XqHD7n8chAiNPzWfz16LPZoMMoSc4dzLl6w9qijkEb/r5O1ozdu1CWGA2L83ZeZg==}
+
   '@types/throttle-debounce@5.0.2':
     resolution: {integrity: sha512-pDzSNulqooSKvSNcksnV72nk8p7gRqN8As71Sp28nov1IgmPKWbOEIwAWvBME5pPTtaXJAvG3O4oc76HlQ4kqQ==}
 
@@ -4646,6 +4707,9 @@ packages:
   caseless@0.12.0:
     resolution: {integrity: sha512-4tYFyifaFfGacoiObjJegolkwSU4xQNGbVgUiNYVUxbQ2x2lUsFvY4hVgVzGiIe6WLOPqycWXA40l+PWsxthUw==}
 
+  ccount@2.0.1:
+    resolution: {integrity: sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==}
+
   chalk@2.4.2:
     resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==}
     engines: {node: '>=4'}
@@ -4662,15 +4726,27 @@ packages:
     resolution: {integrity: sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==}
     engines: {node: '>=10'}
 
+  character-entities-html4@2.1.0:
+    resolution: {integrity: sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==}
+
   character-entities-legacy@1.1.4:
     resolution: {integrity: sha512-3Xnr+7ZFS1uxeiUDvV02wQ+QDbc55o97tIV5zHScSPJpcLm/r0DFPcoY3tYRp+VZukxuMeKgXYmsXQHO05zQeA==}
 
+  character-entities-legacy@3.0.0:
+    resolution: {integrity: sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ==}
+
   character-entities@1.2.4:
     resolution: {integrity: sha512-iBMyeEHxfVnIakwOuDXpVkc54HijNgCyQB2w0VfGQThle6NXn50zU6V/u+LDhxHcDUPojn6Kpga3PTAD8W1bQw==}
 
+  character-entities@2.0.2:
+    resolution: {integrity: sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==}
+
   character-reference-invalid@1.1.4:
     resolution: {integrity: sha512-mKKUkUbhPpQlCOfIuZkvSEgktjPFIsZKRRbC6KWVEMvlzblj3i3asQv5ODsrwt0N3pHAEvjP8KTQPHkp0+6jOg==}
 
+  character-reference-invalid@2.0.1:
+    resolution: {integrity: sha512-iBZ4F4wRbyORVsu0jPV7gXkOsGYjGHPmAyv+HiHG8gi5PtC9KI2j1+v8/tlibRvjoWX027ypmG/n0HtO5t7unw==}
+
   chardet@0.7.0:
     resolution: {integrity: sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==}
 
@@ -4708,6 +4784,10 @@ packages:
     resolution: {integrity: sha512-eXTggHWSooYhq49F2opQhuHWgzucfF2YgODK4e1566GQs5BIfP30B0oenwBJHfWxAs2fyPB1s7Mg949zLf61Yw==}
     engines: {node: '>=8'}
 
+  ci-info@4.0.0:
+    resolution: {integrity: sha512-TdHqgGf9odd8SXNuxtUBVx8Nv+qZOejE6qyqiy5NtbYYQOeFa6zmHkxlPzmaLxWWHsU6nJmB7AETdVPi+2NBUg==}
+    engines: {node: '>=8'}
+
   cjs-module-lexer@1.2.2:
     resolution: {integrity: sha512-cOU9usZw8/dXIXKtwa8pM0OTJQuJkxMN6w30csNRUerHfeQ5R6U3kkU/FtJeIf3M202OHfY2U8ccInBG7/xogA==}
 
@@ -4848,6 +4928,10 @@ packages:
   concat-map@0.0.1:
     resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
 
+  concat-stream@2.0.0:
+    resolution: {integrity: sha512-MWufYdFw53ccGjCA+Ol7XJYpAlW6/prSMzuPOTRnJGcGzuhLn4Scrz7qf6o8bROZ514ltazcIFJZevcfbo0x7A==}
+    engines: {'0': node >= 6.0}
+
   concat-with-sourcemaps@1.1.0:
     resolution: {integrity: sha512-4gEjHJFT9e+2W/77h/DS5SGUgwDaOwprX8L/gl5+3ixnzkVJJsZWDSelmN3Oilw3LNDZjZV0yqH1hLG3k6nghg==}
 
@@ -5160,6 +5244,9 @@ packages:
   decimal.js@10.4.3:
     resolution: {integrity: sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==}
 
+  decode-named-character-reference@1.0.2:
+    resolution: {integrity: sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==}
+
   dedent@1.2.0:
     resolution: {integrity: sha512-i4tcg0ClgvMUSxwHpt+NHQ01ZJmAkl6eBvDNrSZG9e+oLRTCSHv0wpr/Bzjpf6CwKeIHGevE1M34Y1Axdms5VQ==}
     peerDependencies:
@@ -5276,6 +5363,10 @@ packages:
     resolution: {integrity: sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==}
     engines: {node: '>=0.3.1'}
 
+  diff@5.2.0:
+    resolution: {integrity: sha512-uIFDxqpRZGZ6ThOk84hEfqWoHx2devRFvpTZcTHur85vImfaxUbTW9Ryh4CpCuDnToOP1CEtXKIgytHBPVff5A==}
+    engines: {node: '>=0.3.1'}
+
   dir-glob@3.0.1:
     resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
     engines: {node: '>=8'}
@@ -5378,6 +5469,9 @@ packages:
     resolution: {integrity: sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==}
     engines: {node: '>=12'}
 
+  emoji-regex@10.3.0:
+    resolution: {integrity: sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw==}
+
   emoji-regex@8.0.0:
     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
 
@@ -5578,6 +5672,12 @@ packages:
       typescript:
         optional: true
 
+  eslint-config-prettier@9.1.0:
+    resolution: {integrity: sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==}
+    hasBin: true
+    peerDependencies:
+      eslint: '>=7.0.0'
+
   eslint-config-standard@17.1.0:
     resolution: {integrity: sha512-IwHwmaBNtDK4zDHQukFDW5u/aTb8+meQWZvNFWkiGmbWjD6bqyuSSBxxXKkCftCUzc1zwCH2m/baCNDLGmuO5Q==}
     engines: {node: '>=12.0.0'}
@@ -5597,6 +5697,12 @@ packages:
       eslint: '*'
       eslint-plugin-import: '*'
 
+  eslint-mdx@3.1.5:
+    resolution: {integrity: sha512-ynztX0k7CQ3iDL7fDEIeg3g0O/d6QPv7IBI9fdYLhXp5fAp0fi8X22xF/D3+Pk0f90R27uwqa1clHpay6t0l8Q==}
+    engines: {node: '>=18.0.0'}
+    peerDependencies:
+      eslint: '>=8.0.0'
+
   eslint-module-utils@2.8.0:
     resolution: {integrity: sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==}
     engines: {node: '>=4'}
@@ -5640,6 +5746,18 @@ packages:
     peerDependencies:
       eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8
 
+  eslint-plugin-markdown@3.0.1:
+    resolution: {integrity: sha512-8rqoc148DWdGdmYF6WSQFT3uQ6PO7zXYgeBpHAOAakX/zpq+NvFYbDA/H7PYzHajwtmaOzAwfxyl++x0g1/N9A==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    peerDependencies:
+      eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
+
+  eslint-plugin-mdx@3.1.5:
+    resolution: {integrity: sha512-lUE7tP7IrIRHU3gTtASDe5u4YM2SvQveYVJfuo82yn3MLh/B/v05FNySURCK4aIxIYF1QYo3IRemQG/lyQzpAg==}
+    engines: {node: '>=18.0.0'}
+    peerDependencies:
+      eslint: '>=8.0.0'
+
   eslint-plugin-n@16.6.2:
     resolution: {integrity: sha512-6TyDmZ1HXoFQXnhCTUjVFULReoBPOAjpuiKELMkeP40yffI/1ZRO+d9ug/VC6fqISo2WkuIBk3cvuRPALaWlOQ==}
     engines: {node: '>=16.0.0'}
@@ -5664,6 +5782,12 @@ packages:
     peerDependencies:
       eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8
 
+  eslint-plugin-storybook@0.8.0:
+    resolution: {integrity: sha512-CZeVO5EzmPY7qghO2t64oaFM+8FTaD4uzOEjHKp516exyTKo+skKAL9GI3QALS2BXhyALJjNtwbmr1XinGE8bA==}
+    engines: {node: '>= 18'}
+    peerDependencies:
+      eslint: '>=6'
+
   eslint-scope@5.1.1:
     resolution: {integrity: sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==}
     engines: {node: '>=8.0.0'}
@@ -5720,6 +5844,12 @@ packages:
     resolution: {integrity: sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==}
     engines: {node: '>=4.0'}
 
+  estree-util-is-identifier-name@3.0.0:
+    resolution: {integrity: sha512-hFtqIDZTIUZ9BXLb8y4pYGyk6+wekIivNVTcmvk8NoOh+VeRn5y6cEHzbURrWbfp1fIqdVipilzj+lfaadNZmg==}
+
+  estree-util-visit@2.0.0:
+    resolution: {integrity: sha512-m5KgiH85xAhhW8Wta0vShLcUvOsh3LLPI2YVwcbio1l7E09NTLL1EyMZFM1OyWowoH0skScNbhOPl4kcBgzTww==}
+
   estree-walker@0.6.1:
     resolution: {integrity: sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w==}
 
@@ -6518,6 +6648,9 @@ packages:
     engines: {node: '>=8'}
     hasBin: true
 
+  import-meta-resolve@4.1.0:
+    resolution: {integrity: sha512-I6fiaX09Xivtk+THaMfAwnA3MVA5Big1WHF1Dfx9hFuvNIWpXnorlkzhcQf6ehrqQiiZECRt1poOAkPmer3ruw==}
+
   imurmurhash@0.1.4:
     resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
     engines: {node: '>=0.8.19'}
@@ -6588,9 +6721,15 @@ packages:
   is-alphabetical@1.0.4:
     resolution: {integrity: sha512-DwzsA04LQ10FHTZuL0/grVDk4rFoVH1pjAToYwBrHSxcrBIGQuXrQMtD5U1b0U2XVgKZCTLLP8u2Qxqhy3l2Vg==}
 
+  is-alphabetical@2.0.1:
+    resolution: {integrity: sha512-FWyyY60MeTNyeSRpkM2Iry0G9hpr7/9kD40mD/cGQEuilcZYS4okz8SN2Q6rLCJ8gbCt6fN+rC+6tMGS99LaxQ==}
+
   is-alphanumerical@1.0.4:
     resolution: {integrity: sha512-UzoZUr+XfVz3t3v4KyGEniVL9BDRoQtY7tOyrRybkVNjDFWyo1yhXNGrrBTQxp3ib9BLAWs7k2YKBQsFRkZG9A==}
 
+  is-alphanumerical@2.0.1:
+    resolution: {integrity: sha512-hmbYhX/9MUMF5uh7tOXyK/n0ZvWpad5caBA17GsC6vyuCqaWliRG5K1qS9inmUhEMaOBIW7/whAnSwveW/LtZw==}
+
   is-arguments@1.1.1:
     resolution: {integrity: sha512-8Q7EARjzEnKpt/PCD7e1cgUS0a6X8u5tdSiMqXhojOdoV9TsMsiO+9VLC5vAmO8N7/GmXn7yjR8qnA6bVAEzfA==}
     engines: {node: '>= 0.4'}
@@ -6650,6 +6789,9 @@ packages:
   is-decimal@1.0.4:
     resolution: {integrity: sha512-RGdriMmQQvZ2aqaQq3awNA6dCGtKpiDFcOzrTWrDAT2MiWrKQVPmxLGHl7Y2nNu6led0kEyoX0enY0qXYsv9zw==}
 
+  is-decimal@2.0.1:
+    resolution: {integrity: sha512-AAB9hiomQs5DXWcRB1rqsxGUstbRroFOPPVAomNk/3XHR5JyEZChOyTWe2oayKnsSsr/kcGqF+z6yuH6HHpN0A==}
+
   is-deflate@1.0.0:
     resolution: {integrity: sha512-YDoFpuZWu1VRXlsnlYMzKyVRITXj7Ej/V9gXQ2/pAe7X1J7M/RNOqaIYi6qUn+B7nGyB9pDXrv02dsB58d2ZAQ==}
 
@@ -6658,6 +6800,9 @@ packages:
     engines: {node: '>=8'}
     hasBin: true
 
+  is-empty@1.2.0:
+    resolution: {integrity: sha512-F2FnH/otLNJv0J6wc73A5Xo7oHLNnqplYqZhUu01tD54DIPvxIRSTSLkrUB/M0nHO4vo1O9PDfN4KoTxCzLh/w==}
+
   is-extendable@1.0.1:
     resolution: {integrity: sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==}
     engines: {node: '>=0.10.0'}
@@ -6695,6 +6840,9 @@ packages:
   is-hexadecimal@1.0.4:
     resolution: {integrity: sha512-gyPJuv83bHMpocVYoqof5VDiZveEoGoFL8m3BXNb2VW8Xs+rz9kqO8LOQ5DH6EsuvilT1ApazU0pyl+ytbPtlw==}
 
+  is-hexadecimal@2.0.1:
+    resolution: {integrity: sha512-DgZQp241c8oO6cA1SbTEWiXeoxV42vlcJxgH+B3hi1AiqqKruZR3ZGF8In3fj4+/y/7rHvlOZLZtgJ/4ttYGZg==}
+
   is-installed-globally@0.4.0:
     resolution: {integrity: sha512-iwGqO3J21aaSkC7jWnHP/difazwS7SFeIqxv6wEtLU8Y5KlzFTjyqcSIT0d8s4+dDhKytsk9PJZ2BkS5eZwQRQ==}
     engines: {node: '>=10'}
@@ -7352,6 +7500,9 @@ packages:
   lit@3.1.3:
     resolution: {integrity: sha512-l4slfspEsnCcHVRTvaP7YnkTZEZggNFywLEIhQaGhYDczG+tu/vlgm/KaWIEjIp+ZyV20r2JnZctMb8LeLCG7Q==}
 
+  load-plugin@6.0.3:
+    resolution: {integrity: sha512-kc0X2FEUZr145odl68frm+lMJuQ23+rTXYmR6TImqPtbpmXC4vVXbWKDQ9IzndA0HfyQamWfKLhzsqGSTxE63w==}
+
   load-yaml-file@0.2.0:
     resolution: {integrity: sha512-OfCBkGEw4nN6JLtgRidPX6QxjBQGQf72q3si2uvqyFEMbycSFFHwAZeXx6cJgFM9wmLrf9zBwCP3Ivqa+LLZPw==}
     engines: {node: '>=6'}
@@ -7429,6 +7580,9 @@ packages:
   long-press-event@2.5.0:
     resolution: {integrity: sha512-ku7TWKETdiRlgs66rnYk1UjZXVmYXHzY8ZTo/3xbw/kms+uZHte89X5jAQtQjsOJaYl6lLbAT9CW3gcMIooikA==}
 
+  longest-streak@3.1.0:
+    resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==}
+
   loose-envify@1.4.0:
     resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==}
     hasBin: true
@@ -7510,6 +7664,36 @@ packages:
   mathml-tag-names@2.1.3:
     resolution: {integrity: sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==}
 
+  mdast-util-from-markdown@0.8.5:
+    resolution: {integrity: sha512-2hkTXtYYnr+NubD/g6KGBS/0mFmBcifAsI0yIWRiRo0PjVs6SSOSOdtzbp6kSGnShDN6G5aWZpKQ2lWRy27mWQ==}
+
+  mdast-util-from-markdown@2.0.1:
+    resolution: {integrity: sha512-aJEUyzZ6TzlsX2s5B4Of7lN7EQtAxvtradMMglCQDyaTFgse6CmtmdJ15ElnVRlCg1vpNyVtbem0PWzlNieZsA==}
+
+  mdast-util-mdx-expression@2.0.0:
+    resolution: {integrity: sha512-fGCu8eWdKUKNu5mohVGkhBXCXGnOTLuFqOvGMvdikr+J1w7lDJgxThOKpwRWzzbyXAU2hhSwsmssOY4yTokluw==}
+
+  mdast-util-mdx-jsx@3.1.2:
+    resolution: {integrity: sha512-eKMQDeywY2wlHc97k5eD8VC+9ASMjN8ItEZQNGwJ6E0XWKiW/Z0V5/H8pvoXUf+y+Mj0VIgeRRbujBmFn4FTyA==}
+
+  mdast-util-mdx@3.0.0:
+    resolution: {integrity: sha512-JfbYLAW7XnYTTbUsmpu0kdBUVe+yKVJZBItEjwyYJiDJuZ9w4eeaqks4HQO+R7objWgS2ymV60GYpI14Ug554w==}
+
+  mdast-util-mdxjs-esm@2.0.1:
+    resolution: {integrity: sha512-EcmOpxsZ96CvlP03NghtH1EsLtr0n9Tm4lPUJUBccV9RwUOneqSycg19n5HGzCf+10LozMRSObtVr3ee1WoHtg==}
+
+  mdast-util-phrasing@4.1.0:
+    resolution: {integrity: sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w==}
+
+  mdast-util-to-markdown@2.1.0:
+    resolution: {integrity: sha512-SR2VnIEdVNCJbP6y7kVTJgPLifdr8WEU440fQec7qHoHOUz/oJ2jmNRqdDQ3rbiStOXb2mCDGTuwsK5OPUgYlQ==}
+
+  mdast-util-to-string@2.0.0:
+    resolution: {integrity: sha512-AW4DRS3QbBayY/jJmD8437V1Gombjf8RSOUCMFBuo5iHi58AGEgVCKQ+ezHkZZDpAQS75hcBMpLqjpJTjtUL7w==}
+
+  mdast-util-to-string@4.0.0:
+    resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==}
+
   mdn-data@2.0.14:
     resolution: {integrity: sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==}
 
@@ -7555,6 +7739,93 @@ packages:
     resolution: {integrity: sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==}
     engines: {node: '>= 0.6'}
 
+  micromark-core-commonmark@2.0.1:
+    resolution: {integrity: sha512-CUQyKr1e///ZODyD1U3xit6zXwy1a8q2a1S1HKtIlmgvurrEpaw/Y9y6KSIbF8P59cn/NjzHyO+Q2fAyYLQrAA==}
+
+  micromark-extension-mdx-expression@3.0.0:
+    resolution: {integrity: sha512-sI0nwhUDz97xyzqJAbHQhp5TfaxEvZZZ2JDqUo+7NvyIYG6BZ5CPPqj2ogUoPJlmXHBnyZUzISg9+oUmU6tUjQ==}
+
+  micromark-extension-mdx-jsx@3.0.0:
+    resolution: {integrity: sha512-uvhhss8OGuzR4/N17L1JwvmJIpPhAd8oByMawEKx6NVdBCbesjH4t+vjEp3ZXft9DwvlKSD07fCeI44/N0Vf2w==}
+
+  micromark-extension-mdx-md@2.0.0:
+    resolution: {integrity: sha512-EpAiszsB3blw4Rpba7xTOUptcFeBFi+6PY8VnJ2hhimH+vCQDirWgsMpz7w1XcZE7LVrSAUGb9VJpG9ghlYvYQ==}
+
+  micromark-extension-mdxjs-esm@3.0.0:
+    resolution: {integrity: sha512-DJFl4ZqkErRpq/dAPyeWp15tGrcrrJho1hKK5uBS70BCtfrIFg81sqcTVu3Ta+KD1Tk5vAtBNElWxtAa+m8K9A==}
+
+  micromark-extension-mdxjs@3.0.0:
+    resolution: {integrity: sha512-A873fJfhnJ2siZyUrJ31l34Uqwy4xIFmvPY1oj+Ean5PHcPBYzEsvqvWGaWcfEIr11O5Dlw3p2y0tZWpKHDejQ==}
+
+  micromark-factory-destination@2.0.0:
+    resolution: {integrity: sha512-j9DGrQLm/Uhl2tCzcbLhy5kXsgkHUrjJHg4fFAeoMRwJmJerT9aw4FEhIbZStWN8A3qMwOp1uzHr4UL8AInxtA==}
+
+  micromark-factory-label@2.0.0:
+    resolution: {integrity: sha512-RR3i96ohZGde//4WSe/dJsxOX6vxIg9TimLAS3i4EhBAFx8Sm5SmqVfR8E87DPSR31nEAjZfbt91OMZWcNgdZw==}
+
+  micromark-factory-mdx-expression@2.0.1:
+    resolution: {integrity: sha512-F0ccWIUHRLRrYp5TC9ZYXmZo+p2AM13ggbsW4T0b5CRKP8KHVRB8t4pwtBgTxtjRmwrK0Irwm7vs2JOZabHZfg==}
+
+  micromark-factory-space@2.0.0:
+    resolution: {integrity: sha512-TKr+LIDX2pkBJXFLzpyPyljzYK3MtmllMUMODTQJIUfDGncESaqB90db9IAUcz4AZAJFdd8U9zOp9ty1458rxg==}
+
+  micromark-factory-title@2.0.0:
+    resolution: {integrity: sha512-jY8CSxmpWLOxS+t8W+FG3Xigc0RDQA9bKMY/EwILvsesiRniiVMejYTE4wumNc2f4UbAa4WsHqe3J1QS1sli+A==}
+
+  micromark-factory-whitespace@2.0.0:
+    resolution: {integrity: sha512-28kbwaBjc5yAI1XadbdPYHX/eDnqaUFVikLwrO7FDnKG7lpgxnvk/XGRhX/PN0mOZ+dBSZ+LgunHS+6tYQAzhA==}
+
+  micromark-util-character@2.1.0:
+    resolution: {integrity: sha512-KvOVV+X1yLBfs9dCBSopq/+G1PcgT3lAK07mC4BzXi5E7ahzMAF8oIupDDJ6mievI6F+lAATkbQQlQixJfT3aQ==}
+
+  micromark-util-chunked@2.0.0:
+    resolution: {integrity: sha512-anK8SWmNphkXdaKgz5hJvGa7l00qmcaUQoMYsBwDlSKFKjc6gjGXPDw3FNL3Nbwq5L8gE+RCbGqTw49FK5Qyvg==}
+
+  micromark-util-classify-character@2.0.0:
+    resolution: {integrity: sha512-S0ze2R9GH+fu41FA7pbSqNWObo/kzwf8rN/+IGlW/4tC6oACOs8B++bh+i9bVyNnwCcuksbFwsBme5OCKXCwIw==}
+
+  micromark-util-combine-extensions@2.0.0:
+    resolution: {integrity: sha512-vZZio48k7ON0fVS3CUgFatWHoKbbLTK/rT7pzpJ4Bjp5JjkZeasRfrS9wsBdDJK2cJLHMckXZdzPSSr1B8a4oQ==}
+
+  micromark-util-decode-numeric-character-reference@2.0.1:
+    resolution: {integrity: sha512-bmkNc7z8Wn6kgjZmVHOX3SowGmVdhYS7yBpMnuMnPzDq/6xwVA604DuOXMZTO1lvq01g+Adfa0pE2UKGlxL1XQ==}
+
+  micromark-util-decode-string@2.0.0:
+    resolution: {integrity: sha512-r4Sc6leeUTn3P6gk20aFMj2ntPwn6qpDZqWvYmAG6NgvFTIlj4WtrAudLi65qYoaGdXYViXYw2pkmn7QnIFasA==}
+
+  micromark-util-encode@2.0.0:
+    resolution: {integrity: sha512-pS+ROfCXAGLWCOc8egcBvT0kf27GoWMqtdarNfDcjb6YLuV5cM3ioG45Ys2qOVqeqSbjaKg72vU+Wby3eddPsA==}
+
+  micromark-util-events-to-acorn@2.0.2:
+    resolution: {integrity: sha512-Fk+xmBrOv9QZnEDguL9OI9/NQQp6Hz4FuQ4YmCb/5V7+9eAh1s6AYSvL20kHkD67YIg7EpE54TiSlcsf3vyZgA==}
+
+  micromark-util-html-tag-name@2.0.0:
+    resolution: {integrity: sha512-xNn4Pqkj2puRhKdKTm8t1YHC/BAjx6CEwRFXntTaRf/x16aqka6ouVoutm+QdkISTlT7e2zU7U4ZdlDLJd2Mcw==}
+
+  micromark-util-normalize-identifier@2.0.0:
+    resolution: {integrity: sha512-2xhYT0sfo85FMrUPtHcPo2rrp1lwbDEEzpx7jiH2xXJLqBuy4H0GgXk5ToU8IEwoROtXuL8ND0ttVa4rNqYK3w==}
+
+  micromark-util-resolve-all@2.0.0:
+    resolution: {integrity: sha512-6KU6qO7DZ7GJkaCgwBNtplXCvGkJToU86ybBAUdavvgsCiG8lSSvYxr9MhwmQ+udpzywHsl4RpGJsYWG1pDOcA==}
+
+  micromark-util-sanitize-uri@2.0.0:
+    resolution: {integrity: sha512-WhYv5UEcZrbAtlsnPuChHUAsu/iBPOVaEVsntLBIdpibO0ddy8OzavZz3iL2xVvBZOpolujSliP65Kq0/7KIYw==}
+
+  micromark-util-subtokenize@2.0.1:
+    resolution: {integrity: sha512-jZNtiFl/1aY73yS3UGQkutD0UbhTt68qnRpw2Pifmz5wV9h8gOVsN70v+Lq/f1rKaU/W8pxRe8y8Q9FX1AOe1Q==}
+
+  micromark-util-symbol@2.0.0:
+    resolution: {integrity: sha512-8JZt9ElZ5kyTnO94muPxIGS8oyElRJaiJO8EzV6ZSyGQ1Is8xwl4Q45qU5UOg+bGH4AikWziz0iN4sFLWs8PGw==}
+
+  micromark-util-types@2.0.0:
+    resolution: {integrity: sha512-oNh6S2WMHWRZrmutsRmDDfkzKtxF+bc2VxLC9dvtrDIRFln627VsFP6fLMgTryGDljgLPjkrzQSDcPrjPyDJ5w==}
+
+  micromark@2.11.4:
+    resolution: {integrity: sha512-+WoovN/ppKolQOFIAajxi7Lu9kInbPxFuTBVEavFcL8eAfVstoc5MocPmqBeAdBOJV00uaVjegzH4+MA0DN/uA==}
+
+  micromark@4.0.0:
+    resolution: {integrity: sha512-o/sd0nMof8kYff+TqcDx3VSrgBTcZpSvYcAHIfHhv5VAuNmisCxjhx6YmxS8PFEpb9z5WKWKPdzf0jM23ro3RQ==}
+
   micromatch@4.0.5:
     resolution: {integrity: sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==}
     engines: {node: '>=8.6'}
@@ -7838,6 +8109,11 @@ packages:
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
     hasBin: true
 
+  nopt@7.2.1:
+    resolution: {integrity: sha512-taM24ViiimT/XntxbPyJQzCG+p4EKOpgD3mxFwW38mGjVUrfERQOeY4EDHjdnptttfHuHQXFx+lTP08Q+mLa/w==}
+    engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
+    hasBin: true
+
   normalize-package-data@2.5.0:
     resolution: {integrity: sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==}
 
@@ -8094,6 +8370,9 @@ packages:
   parse-entities@2.0.0:
     resolution: {integrity: sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ==}
 
+  parse-entities@4.0.1:
+    resolution: {integrity: sha512-SWzvYcSJh4d/SGLIOQfZ/CoNv6BTlI6YEQ7Nj82oDVnRpwe/Z/F1EMx42x3JAOwGBlCjeCH0BRJQbQ/opHL17w==}
+
   parse-filepath@1.0.2:
     resolution: {integrity: sha512-FwdRXKCohSVeXqwtYonZTXtbGJKrn+HNyWDYVcp5yuJlesTwNH4rsmRZ+GrKAPJ5bLpRxESMeS+Rl0VCHRvB2Q==}
     engines: {node: '>=0.8'}
@@ -8102,6 +8381,10 @@ packages:
     resolution: {integrity: sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==}
     engines: {node: '>=8'}
 
+  parse-json@7.1.1:
+    resolution: {integrity: sha512-SgOTCX/EZXtZxBE5eJ97P4yGM5n37BwRU+YMsH4vNzFqJV/oWFXXCmwFlgWUM4PrakybVOueJJ6pwHqSVhTFDw==}
+    engines: {node: '>=16'}
+
   parse-node-version@1.0.1:
     resolution: {integrity: sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==}
     engines: {node: '>= 0.10'}
@@ -8615,6 +8898,10 @@ packages:
     resolution: {integrity: sha512-++Vn7NS4Xf9NacaU9Xq3URUuqZETPsf8L4j5/ckhaRYsfPeRyzGw+iDjFhV/Jr3uNmTvvddEJFWh5R1gRgUH8A==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
 
+  proc-log@4.2.0:
+    resolution: {integrity: sha512-g8+OnU/L2v+wyiVK+D5fA34J7EH8jZ8DDlvwhRCMxmMj7UCBvxiO1mGeN+36JXIKF4zevU4kRBd8lVgG9vLelA==}
+    engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
+
   process-nextick-args@2.0.1:
     resolution: {integrity: sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==}
 
@@ -8881,6 +9168,15 @@ packages:
   remark-autolink-headings@7.0.1:
     resolution: {integrity: sha512-a1BIwoJ0cSnX+sPp5u3AFULBFWHGYBt57Fo4a+7IlGiJOQxs8b7uYAE5Iu26Ocl7Y5cvinZy3FaGVruLCKg6vA==}
 
+  remark-mdx@3.0.1:
+    resolution: {integrity: sha512-3Pz3yPQ5Rht2pM5R+0J2MrGoBSrzf+tJG94N+t/ilfdh8YLyyKYtidAYwTveB20BoHAcwIopOUqhcmh2F7hGYA==}
+
+  remark-parse@11.0.0:
+    resolution: {integrity: sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA==}
+
+  remark-stringify@11.0.0:
+    resolution: {integrity: sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==}
+
   remove-trailing-separator@1.1.0:
     resolution: {integrity: sha512-/hS+Y0u3aOfIETiaiirUFwDBDzmXPvO+jAfKTitUngIPzdKc6Z0LoFjM/CK5PL4C+eKwHohlHAb6H0VFfmmUsw==}
 
@@ -8906,6 +9202,10 @@ packages:
   require-main-filename@2.0.0:
     resolution: {integrity: sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==}
 
+  requireindex@1.2.0:
+    resolution: {integrity: sha512-L9jEkOi3ASd9PYit2cwRfyppc9NoABujTP8/5gFcbERmo5jUoAKovIC3fsF17pkTnGsrByysqX+Kxd2OTNI1ww==}
+    engines: {node: '>=0.10.5'}
+
   requires-port@1.0.0:
     resolution: {integrity: sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==}
 
@@ -9038,6 +9338,10 @@ packages:
   rxjs@7.8.1:
     resolution: {integrity: sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==}
 
+  sade@1.8.1:
+    resolution: {integrity: sha512-xal3CZX1Xlo/k4ApwCFrHVACi9fBqJ7V+mwhBsuf/1IOKbBy098Fex+Wa/5QMubw09pSZ/u8EY8PWgevJsXp1A==}
+    engines: {node: '>=6'}
+
   safe-array-concat@1.0.0:
     resolution: {integrity: sha512-9dVEFruWIsnie89yym+xWTAYASdpw3CJV7Li/6zBewGf9z2i1j31rP6jnY0pHEO4QZh6N0K11bFjWmdR8UGdPQ==}
     engines: {node: '>=0.4'}
@@ -9439,6 +9743,10 @@ packages:
     resolution: {integrity: sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==}
     engines: {node: '>=12'}
 
+  string-width@6.1.0:
+    resolution: {integrity: sha512-k01swCJAgQmuADB0YIc+7TuatfNvTBVOoaUWJjTB9R4VJzR5vNWzf5t42ESVZFPS8xTySF7CAdV4t/aaIm3UnQ==}
+    engines: {node: '>=16'}
+
   string.prototype.matchall@4.0.11:
     resolution: {integrity: sha512-NUdh0aDavY2og7IbBPenWqR9exH+E26Sv8e0/eTe1tltDGZL+GtBkDAnnyBtmekfK6/Dq3MkcGtzXFEd1LQrtg==}
     engines: {node: '>= 0.4'}
@@ -9483,6 +9791,9 @@ packages:
   string_decoder@1.3.0:
     resolution: {integrity: sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==}
 
+  stringify-entities@4.0.4:
+    resolution: {integrity: sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==}
+
   strip-ansi@6.0.1:
     resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
     engines: {node: '>=8'}
@@ -9580,6 +9891,10 @@ packages:
     resolution: {integrity: sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==}
     engines: {node: '>=10'}
 
+  supports-color@9.4.0:
+    resolution: {integrity: sha512-VL+lNrEoIXww1coLPOmiEmK/0sGigko5COxI09KzHc2VJXJsQ37UaQ+8quuxjDeA7+KnLGTWRyOXSLLR2Wb4jw==}
+    engines: {node: '>=12'}
+
   supports-hyperlinks@3.0.0:
     resolution: {integrity: sha512-QBDPHyPQDRTy9ku4URNGY5Lah8PAaXs6tAAwp55sL5WCsSW7GIfdf6W5ixfziW+t7wh3GVvHyHHyQ1ESsoRvaA==}
     engines: {node: '>=14.18'}
@@ -9614,6 +9929,10 @@ packages:
   synchronous-promise@2.0.17:
     resolution: {integrity: sha512-AsS729u2RHUfEra9xJrE39peJcc2stq2+poBXX8bcM08Y6g9j/i/PUzwNQqkaJde7Ntg1TO7bSREbR5sdosQ+g==}
 
+  synckit@0.9.0:
+    resolution: {integrity: sha512-7RnqIMq572L8PeEzKeBINYEJDDxpcH8JEgLwUqBd3TkofhFRbkq4QLR0u+36avGAhCRbk2nnmjcW9SE531hPDg==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+
   tabbable@6.2.0:
     resolution: {integrity: sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==}
 
@@ -9903,6 +10222,10 @@ packages:
     resolution: {integrity: sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==}
     engines: {node: '>=12.20'}
 
+  type-fest@3.13.1:
+    resolution: {integrity: sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==}
+    engines: {node: '>=14.16'}
+
   type-is@1.6.18:
     resolution: {integrity: sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==}
     engines: {node: '>= 0.6'}
@@ -9945,6 +10268,9 @@ packages:
   typed-assert@1.0.9:
     resolution: {integrity: sha512-KNNZtayBCtmnNmbo5mG47p1XsCyrx6iVqomjcZnec/1Y5GGARaxPs6r49RnSPeUP3YjNYiU9sQHAtY4BBvnZwg==}
 
+  typedarray@0.0.6:
+    resolution: {integrity: sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==}
+
   typescript@4.9.5:
     resolution: {integrity: sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==}
     engines: {node: '>=4.2.0'}
@@ -10013,6 +10339,9 @@ packages:
     resolution: {integrity: sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==}
     engines: {node: '>=18'}
 
+  unified-engine@11.2.1:
+    resolution: {integrity: sha512-xBAdZ8UY2X4R9Hm6X6kMne4Nz0PlpOc1oE6DPeqJnewr5Imkb8uT5Eyvy1h7xNekPL3PSWh3ZJyNrMW6jnNQBg==}
+
   unified@10.1.2:
     resolution: {integrity: sha512-pUSWAi/RAnVy1Pif2kAoeWNBa3JVrx0MId2LASj8G+7AiHWoKZNTomq6LG326T68U7/e263X6fTdcXIy7XnF7Q==}
 
@@ -10035,12 +10364,24 @@ packages:
     resolution: {integrity: sha512-uNaeirEPvpZWSgzwsPGtU2zVSTrn/8L5q/IexZmH0eH6SA73CmAA5U4GwORTxQAZs95TAXLNqeLoPPNO5gZfWg==}
     engines: {node: '>=8'}
 
+  unist-util-inspect@8.0.0:
+    resolution: {integrity: sha512-/3Wn/wU6/H6UEo4FoYUeo8KUePN8ERiZpQYFWYoihOsr1DoDuv80PeB0hobVZyYSvALa2e556bG1A1/AbwU4yg==}
+
   unist-util-is@5.2.1:
     resolution: {integrity: sha512-u9njyyfEh43npf1M+yGKDGVPbY/JWEemg5nH05ncKPfi+kBbKBJoTdsogMu33uhytuLlv9y0O7GH7fEdwLdLQw==}
 
   unist-util-is@6.0.0:
     resolution: {integrity: sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==}
 
+  unist-util-position-from-estree@2.0.0:
+    resolution: {integrity: sha512-KaFVRjoqLyF6YXCbVLNad/eS4+OfPQQn2yOd7zF/h5T/CSL2v8NpN6a5TPvtbXthAGw5nG+PuTtq+DdIZr+cRQ==}
+
+  unist-util-remove-position@5.0.0:
+    resolution: {integrity: sha512-Hp5Kh3wLxv0PHj9m2yZhhLt58KzPtEYKQQ4yxfYFEO7EvHwzyDYnduhHnY1mDxoqr7VUwVuHXk9RXKIiYS1N8Q==}
+
+  unist-util-stringify-position@2.0.3:
+    resolution: {integrity: sha512-3faScn5I+hy9VleOq/qNbAd6pAx7iH5jYBMS9I1HgQVijz/4mv5Bvw5iw1sC/90CODiKo81G/ps8AJrISn687g==}
+
   unist-util-stringify-position@3.0.3:
     resolution: {integrity: sha512-k5GzIBZ/QatR8N5X2y+drfpWG8IDBzdnVj6OInRNWm1oXrzydiaAT2OQiA8DPRRZyAKb9b6I2a6PxYklZD0gKg==}
 
@@ -10118,6 +10459,11 @@ packages:
     resolution: {integrity: sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==}
     hasBin: true
 
+  uvu@0.5.6:
+    resolution: {integrity: sha512-+g8ENReyr8YsOc6fv/NVJs2vFdHBnBNdfE49rshrTzDWOlUx4Gq7KOS2GD8eqhy2j+Ejq29+SbKH8yjkAqXqoA==}
+    engines: {node: '>=8'}
+    hasBin: true
+
   v8-compile-cache-lib@3.0.1:
     resolution: {integrity: sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==}
 
@@ -10154,6 +10500,15 @@ packages:
   vfile-message@4.0.2:
     resolution: {integrity: sha512-jRDZ1IMLttGj41KcZvlrYAaI3CfqpLpfpf+Mfig13viT6NKvRzWZ+lXz0Y5D60w6uJIBAOGq9mSHf0gktF0duw==}
 
+  vfile-reporter@8.1.1:
+    resolution: {integrity: sha512-qxRZcnFSQt6pWKn3PAk81yLK2rO2i7CDXpy8v8ZquiEOMLSnPw6BMSi9Y1sUCwGGl7a9b3CJT1CKpnRF7pp66g==}
+
+  vfile-sort@4.0.0:
+    resolution: {integrity: sha512-lffPI1JrbHDTToJwcq0rl6rBmkjQmMuXkAxsZPRS9DXbaJQvc642eCg6EGxcX2i1L+esbuhq+2l9tBll5v8AeQ==}
+
+  vfile-statistics@3.0.0:
+    resolution: {integrity: sha512-/qlwqwWBWFOmpXujL/20P+Iuydil0rZZNglR+VNm6J0gpLHwuVM5s7g2TfVoswbXjZ4HuIhLMySEyIw5i7/D8w==}
+
   vfile@5.3.7:
     resolution: {integrity: sha512-r7qlzkgErKjobAmyNIkkSpizsFPYiUPuJb5pNW1RB4JcYVZhs4lIbVqk8XPk033CV/1z8ss5pkax8SuhGpcG8g==}
 
@@ -10224,6 +10579,9 @@ packages:
     engines: {node: '>=12.0.0'}
     hasBin: true
 
+  walk-up-path@3.0.1:
+    resolution: {integrity: sha512-9YlCL/ynK3CTlrSRrDxZvUauLzAswPCrsaCgilqFevUYpeEW0/3ScEjaa3kbW/T0ghhkEr7mv+fpjqn1Y1YuTA==}
+
   walker@1.0.8:
     resolution: {integrity: sha512-ts/8E8l5b7kY0vlWLewOkDXMmPdLcVV4GmOQLyxuSswIJsweeFZtAsMF7k1Nszz+TYBQrlYRmzOnr398y1JemQ==}
 
@@ -10558,6 +10916,9 @@ packages:
   zone.js@0.14.5:
     resolution: {integrity: sha512-9XYWZzY6PhHOSdkYryNcMm7L8EK7a4q+GbTvxbIA2a9lMdRUpGuyaYvLDcg8D6bdn+JomSsbPcilVKg6SmUx6w==}
 
+  zwitch@2.0.4:
+    resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
+
 snapshots:
 
   '@alloc/quick-lru@5.2.0': {}
@@ -13370,6 +13731,17 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@npmcli/config@8.3.3':
+    dependencies:
+      '@npmcli/map-workspaces': 3.0.6
+      ci-info: 4.0.0
+      ini: 4.1.2
+      nopt: 7.2.1
+      proc-log: 4.2.0
+      read-package-json-fast: 3.0.2
+      semver: 7.6.0
+      walk-up-path: 3.0.1
+
   '@npmcli/fs@3.1.0':
     dependencies:
       semver: 7.6.0
@@ -13392,6 +13764,15 @@ snapshots:
       npm-bundled: 3.0.0
       npm-normalize-package-bin: 3.0.1
 
+  '@npmcli/map-workspaces@3.0.6':
+    dependencies:
+      '@npmcli/name-from-folder': 2.0.0
+      glob: 10.3.15
+      minimatch: 9.0.4
+      read-package-json-fast: 3.0.2
+
+  '@npmcli/name-from-folder@2.0.0': {}
+
   '@npmcli/node-gyp@3.0.0': {}
 
   '@npmcli/package-json@5.0.0':
@@ -13624,6 +14005,8 @@ snapshots:
   '@pkgjs/parseargs@0.11.0':
     optional: true
 
+  '@pkgr/core@0.1.1': {}
+
   '@popperjs/core@2.11.8': {}
 
   '@pxtrn/storybook-addon-docs-stencil@6.4.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
@@ -14285,6 +14668,10 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@storybook/csf@0.0.1':
+    dependencies:
+      lodash: 4.17.21
+
   '@storybook/csf@0.0.2--canary.4566f4d.1':
     dependencies:
       lodash: 4.17.21
@@ -14582,6 +14969,10 @@ snapshots:
       '@tufjs/canonical-json': 2.0.0
       minimatch: 9.0.4
 
+  '@types/acorn@4.0.6':
+    dependencies:
+      '@types/estree': 1.0.5
+
   '@types/aria-query@5.0.1': {}
 
   '@types/babel__core@7.20.5':
@@ -14616,6 +15007,10 @@ snapshots:
     dependencies:
       '@types/node': 20.14.0
 
+  '@types/concat-stream@2.0.3':
+    dependencies:
+      '@types/node': 20.12.7
+
   '@types/connect-history-api-fallback@1.5.0':
     dependencies:
       '@types/express-serve-static-core': 4.17.35
@@ -14637,6 +15032,10 @@ snapshots:
 
   '@types/css-modules@1.0.5': {}
 
+  '@types/debug@4.1.12':
+    dependencies:
+      '@types/ms': 0.7.34
+
   '@types/detect-port@1.3.3': {}
 
   '@types/doctrine@0.0.3': {}
@@ -14655,6 +15054,10 @@ snapshots:
       '@types/estree': 1.0.5
       '@types/json-schema': 7.0.15
 
+  '@types/estree-jsx@1.0.5':
+    dependencies:
+      '@types/estree': 1.0.5
+
   '@types/estree@1.0.5': {}
 
   '@types/express-serve-static-core@4.17.35':
@@ -14691,6 +15094,8 @@ snapshots:
 
   '@types/iframe-resizer@3.5.13': {}
 
+  '@types/is-empty@1.2.3': {}
+
   '@types/is-function@1.0.1': {}
 
   '@types/istanbul-lib-coverage@2.0.4': {}
@@ -14736,6 +15141,10 @@ snapshots:
     dependencies:
       '@types/unist': 2.0.6
 
+  '@types/mdast@4.0.4':
+    dependencies:
+      '@types/unist': 3.0.2
+
   '@types/mdx@2.0.13': {}
 
   '@types/mime@1.3.2': {}
@@ -14748,6 +15157,8 @@ snapshots:
     dependencies:
       '@types/node': 20.14.0
 
+  '@types/ms@0.7.34': {}
+
   '@types/node-fetch@2.6.11':
     dependencies:
       '@types/node': 20.14.0
@@ -14822,6 +15233,8 @@ snapshots:
 
   '@types/stack-utils@2.0.1': {}
 
+  '@types/supports-color@8.1.3': {}
+
   '@types/throttle-debounce@5.0.2': {}
 
   '@types/tough-cookie@4.0.5': {}
@@ -16292,6 +16705,8 @@ snapshots:
 
   caseless@0.12.0: {}
 
+  ccount@2.0.1: {}
+
   chalk@2.4.2:
     dependencies:
       ansi-styles: 3.2.1
@@ -16307,12 +16722,20 @@ snapshots:
 
   char-regex@1.0.2: {}
 
+  character-entities-html4@2.1.0: {}
+
   character-entities-legacy@1.1.4: {}
 
+  character-entities-legacy@3.0.0: {}
+
   character-entities@1.2.4: {}
 
+  character-entities@2.0.2: {}
+
   character-reference-invalid@1.1.4: {}
 
+  character-reference-invalid@2.0.1: {}
+
   chardet@0.7.0: {}
 
   check-more-types@2.24.0: {}
@@ -16368,6 +16791,8 @@ snapshots:
 
   ci-info@3.8.0: {}
 
+  ci-info@4.0.0: {}
+
   cjs-module-lexer@1.2.2: {}
 
   clean-stack@2.2.0: {}
@@ -16489,6 +16914,13 @@ snapshots:
 
   concat-map@0.0.1: {}
 
+  concat-stream@2.0.0:
+    dependencies:
+      buffer-from: 1.1.2
+      inherits: 2.0.4
+      readable-stream: 3.6.2
+      typedarray: 0.0.6
+
   concat-with-sourcemaps@1.1.0:
     dependencies:
       source-map: 0.6.1
@@ -16928,6 +17360,10 @@ snapshots:
 
   decimal.js@10.4.3: {}
 
+  decode-named-character-reference@1.0.2:
+    dependencies:
+      character-entities: 2.0.2
+
   dedent@1.2.0: {}
 
   deep-equal@2.2.1:
@@ -17043,6 +17479,8 @@ snapshots:
 
   diff@4.0.2: {}
 
+  diff@5.2.0: {}
+
   dir-glob@3.0.1:
     dependencies:
       path-type: 4.0.0
@@ -17149,6 +17587,8 @@ snapshots:
 
   emittery@0.13.1: {}
 
+  emoji-regex@10.3.0: {}
+
   emoji-regex@8.0.0: {}
 
   emoji-regex@9.2.2: {}
@@ -17544,6 +17984,10 @@ snapshots:
       - eslint-import-resolver-webpack
       - supports-color
 
+  eslint-config-prettier@9.1.0(eslint@8.57.0):
+    dependencies:
+      eslint: 8.57.0
+
   eslint-config-standard@17.1.0(eslint-plugin-import@2.29.1(@typescript-eslint/parser@6.21.0(eslint@8.57.0)(typescript@4.9.5))(eslint@8.57.0))(eslint-plugin-n@16.6.2(eslint@8.57.0))(eslint-plugin-promise@6.1.1(eslint@8.57.0))(eslint@8.57.0):
     dependencies:
       eslint: 8.57.0
@@ -17576,6 +18020,26 @@ snapshots:
       - eslint-import-resolver-webpack
       - supports-color
 
+  eslint-mdx@3.1.5(eslint@8.57.0):
+    dependencies:
+      acorn: 8.11.3
+      acorn-jsx: 5.3.2(acorn@8.11.3)
+      eslint: 8.57.0
+      espree: 9.6.1
+      estree-util-visit: 2.0.0
+      remark-mdx: 3.0.1
+      remark-parse: 11.0.0
+      remark-stringify: 11.0.0
+      synckit: 0.9.0
+      tslib: 2.6.2
+      unified: 11.0.4
+      unified-engine: 11.2.1
+      unist-util-visit: 5.0.0
+      uvu: 0.5.6
+      vfile: 6.0.1
+    transitivePeerDependencies:
+      - supports-color
+
   eslint-module-utils@2.8.0(@typescript-eslint/parser@6.21.0(eslint@8.57.0)(typescript@4.9.5))(eslint-import-resolver-node@0.3.9)(eslint@8.57.0):
     dependencies:
       debug: 3.2.7(supports-color@8.1.1)
@@ -17678,6 +18142,27 @@ snapshots:
       object.entries: 1.1.7
       object.fromentries: 2.0.7
 
+  eslint-plugin-markdown@3.0.1(eslint@8.57.0):
+    dependencies:
+      eslint: 8.57.0
+      mdast-util-from-markdown: 0.8.5
+    transitivePeerDependencies:
+      - supports-color
+
+  eslint-plugin-mdx@3.1.5(eslint@8.57.0):
+    dependencies:
+      eslint: 8.57.0
+      eslint-mdx: 3.1.5(eslint@8.57.0)
+      eslint-plugin-markdown: 3.0.1(eslint@8.57.0)
+      remark-mdx: 3.0.1
+      remark-parse: 11.0.0
+      remark-stringify: 11.0.0
+      tslib: 2.6.2
+      unified: 11.0.4
+      vfile: 6.0.1
+    transitivePeerDependencies:
+      - supports-color
+
   eslint-plugin-n@16.6.2(eslint@8.57.0):
     dependencies:
       '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0)
@@ -17723,6 +18208,17 @@ snapshots:
       semver: 6.3.1
       string.prototype.matchall: 4.0.11
 
+  eslint-plugin-storybook@0.8.0(eslint@8.57.0)(typescript@5.3.3):
+    dependencies:
+      '@storybook/csf': 0.0.1
+      '@typescript-eslint/utils': 5.62.0(eslint@8.57.0)(typescript@5.3.3)
+      eslint: 8.57.0
+      requireindex: 1.2.0
+      ts-dedent: 2.2.0
+    transitivePeerDependencies:
+      - supports-color
+      - typescript
+
   eslint-scope@5.1.1:
     dependencies:
       esrecurse: 4.3.0
@@ -17810,6 +18306,13 @@ snapshots:
 
   estraverse@5.3.0: {}
 
+  estree-util-is-identifier-name@3.0.0: {}
+
+  estree-util-visit@2.0.0:
+    dependencies:
+      '@types/estree-jsx': 1.0.5
+      '@types/unist': 3.0.2
+
   estree-walker@0.6.1: {}
 
   estree-walker@2.0.2: {}
@@ -18796,6 +19299,8 @@ snapshots:
       pkg-dir: 4.2.0
       resolve-cwd: 3.0.0
 
+  import-meta-resolve@4.1.0: {}
+
   imurmurhash@0.1.4: {}
 
   indent-string@4.0.0: {}
@@ -18866,11 +19371,18 @@ snapshots:
 
   is-alphabetical@1.0.4: {}
 
+  is-alphabetical@2.0.1: {}
+
   is-alphanumerical@1.0.4:
     dependencies:
       is-alphabetical: 1.0.4
       is-decimal: 1.0.4
 
+  is-alphanumerical@2.0.1:
+    dependencies:
+      is-alphabetical: 2.0.1
+      is-decimal: 2.0.1
+
   is-arguments@1.1.1:
     dependencies:
       call-bind: 1.0.7
@@ -18932,10 +19444,14 @@ snapshots:
 
   is-decimal@1.0.4: {}
 
+  is-decimal@2.0.1: {}
+
   is-deflate@1.0.0: {}
 
   is-docker@2.2.1: {}
 
+  is-empty@1.2.0: {}
+
   is-extendable@1.0.1:
     dependencies:
       is-plain-object: 2.0.4
@@ -18964,6 +19480,8 @@ snapshots:
 
   is-hexadecimal@1.0.4: {}
 
+  is-hexadecimal@2.0.1: {}
+
   is-installed-globally@0.4.0:
     dependencies:
       global-dirs: 3.0.1
@@ -20143,6 +20661,11 @@ snapshots:
       lit-element: 4.0.4
       lit-html: 3.1.3
 
+  load-plugin@6.0.3:
+    dependencies:
+      '@npmcli/config': 8.3.3
+      import-meta-resolve: 4.1.0
+
   load-yaml-file@0.2.0:
     dependencies:
       graceful-fs: 4.2.11
@@ -20221,6 +20744,8 @@ snapshots:
 
   long-press-event@2.5.0: {}
 
+  longest-streak@3.1.0: {}
+
   loose-envify@1.4.0:
     dependencies:
       js-tokens: 4.0.0
@@ -20306,6 +20831,105 @@ snapshots:
 
   mathml-tag-names@2.1.3: {}
 
+  mdast-util-from-markdown@0.8.5:
+    dependencies:
+      '@types/mdast': 3.0.15
+      mdast-util-to-string: 2.0.0
+      micromark: 2.11.4
+      parse-entities: 2.0.0
+      unist-util-stringify-position: 2.0.3
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-from-markdown@2.0.1:
+    dependencies:
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.2
+      decode-named-character-reference: 1.0.2
+      devlop: 1.1.0
+      mdast-util-to-string: 4.0.0
+      micromark: 4.0.0
+      micromark-util-decode-numeric-character-reference: 2.0.1
+      micromark-util-decode-string: 2.0.0
+      micromark-util-normalize-identifier: 2.0.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+      unist-util-stringify-position: 4.0.0
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-mdx-expression@2.0.0:
+    dependencies:
+      '@types/estree-jsx': 1.0.5
+      '@types/hast': 3.0.3
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.1
+      mdast-util-to-markdown: 2.1.0
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-mdx-jsx@3.1.2:
+    dependencies:
+      '@types/estree-jsx': 1.0.5
+      '@types/hast': 3.0.3
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.2
+      ccount: 2.0.1
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.1
+      mdast-util-to-markdown: 2.1.0
+      parse-entities: 4.0.1
+      stringify-entities: 4.0.4
+      unist-util-remove-position: 5.0.0
+      unist-util-stringify-position: 4.0.0
+      vfile-message: 4.0.2
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-mdx@3.0.0:
+    dependencies:
+      mdast-util-from-markdown: 2.0.1
+      mdast-util-mdx-expression: 2.0.0
+      mdast-util-mdx-jsx: 3.1.2
+      mdast-util-mdxjs-esm: 2.0.1
+      mdast-util-to-markdown: 2.1.0
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-mdxjs-esm@2.0.1:
+    dependencies:
+      '@types/estree-jsx': 1.0.5
+      '@types/hast': 3.0.3
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.1
+      mdast-util-to-markdown: 2.1.0
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-phrasing@4.1.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      unist-util-is: 6.0.0
+
+  mdast-util-to-markdown@2.1.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.2
+      longest-streak: 3.1.0
+      mdast-util-phrasing: 4.1.0
+      mdast-util-to-string: 4.0.0
+      micromark-util-decode-string: 2.0.0
+      unist-util-visit: 5.0.0
+      zwitch: 2.0.4
+
+  mdast-util-to-string@2.0.0: {}
+
+  mdast-util-to-string@4.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+
   mdn-data@2.0.14: {}
 
   mdn-data@2.0.28: {}
@@ -20348,6 +20972,219 @@ snapshots:
 
   methods@1.1.2: {}
 
+  micromark-core-commonmark@2.0.1:
+    dependencies:
+      decode-named-character-reference: 1.0.2
+      devlop: 1.1.0
+      micromark-factory-destination: 2.0.0
+      micromark-factory-label: 2.0.0
+      micromark-factory-space: 2.0.0
+      micromark-factory-title: 2.0.0
+      micromark-factory-whitespace: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-chunked: 2.0.0
+      micromark-util-classify-character: 2.0.0
+      micromark-util-html-tag-name: 2.0.0
+      micromark-util-normalize-identifier: 2.0.0
+      micromark-util-resolve-all: 2.0.0
+      micromark-util-subtokenize: 2.0.1
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-extension-mdx-expression@3.0.0:
+    dependencies:
+      '@types/estree': 1.0.5
+      devlop: 1.1.0
+      micromark-factory-mdx-expression: 2.0.1
+      micromark-factory-space: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-events-to-acorn: 2.0.2
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-extension-mdx-jsx@3.0.0:
+    dependencies:
+      '@types/acorn': 4.0.6
+      '@types/estree': 1.0.5
+      devlop: 1.1.0
+      estree-util-is-identifier-name: 3.0.0
+      micromark-factory-mdx-expression: 2.0.1
+      micromark-factory-space: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+      vfile-message: 4.0.2
+
+  micromark-extension-mdx-md@2.0.0:
+    dependencies:
+      micromark-util-types: 2.0.0
+
+  micromark-extension-mdxjs-esm@3.0.0:
+    dependencies:
+      '@types/estree': 1.0.5
+      devlop: 1.1.0
+      micromark-core-commonmark: 2.0.1
+      micromark-util-character: 2.1.0
+      micromark-util-events-to-acorn: 2.0.2
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+      unist-util-position-from-estree: 2.0.0
+      vfile-message: 4.0.2
+
+  micromark-extension-mdxjs@3.0.0:
+    dependencies:
+      acorn: 8.11.3
+      acorn-jsx: 5.3.2(acorn@8.11.3)
+      micromark-extension-mdx-expression: 3.0.0
+      micromark-extension-mdx-jsx: 3.0.0
+      micromark-extension-mdx-md: 2.0.0
+      micromark-extension-mdxjs-esm: 3.0.0
+      micromark-util-combine-extensions: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-destination@2.0.0:
+    dependencies:
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-label@2.0.0:
+    dependencies:
+      devlop: 1.1.0
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-mdx-expression@2.0.1:
+    dependencies:
+      '@types/estree': 1.0.5
+      devlop: 1.1.0
+      micromark-util-character: 2.1.0
+      micromark-util-events-to-acorn: 2.0.2
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+      unist-util-position-from-estree: 2.0.0
+      vfile-message: 4.0.2
+
+  micromark-factory-space@2.0.0:
+    dependencies:
+      micromark-util-character: 2.1.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-title@2.0.0:
+    dependencies:
+      micromark-factory-space: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-whitespace@2.0.0:
+    dependencies:
+      micromark-factory-space: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-character@2.1.0:
+    dependencies:
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-chunked@2.0.0:
+    dependencies:
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-classify-character@2.0.0:
+    dependencies:
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-combine-extensions@2.0.0:
+    dependencies:
+      micromark-util-chunked: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-decode-numeric-character-reference@2.0.1:
+    dependencies:
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-decode-string@2.0.0:
+    dependencies:
+      decode-named-character-reference: 1.0.2
+      micromark-util-character: 2.1.0
+      micromark-util-decode-numeric-character-reference: 2.0.1
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-encode@2.0.0: {}
+
+  micromark-util-events-to-acorn@2.0.2:
+    dependencies:
+      '@types/acorn': 4.0.6
+      '@types/estree': 1.0.5
+      '@types/unist': 3.0.2
+      devlop: 1.1.0
+      estree-util-visit: 2.0.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+      vfile-message: 4.0.2
+
+  micromark-util-html-tag-name@2.0.0: {}
+
+  micromark-util-normalize-identifier@2.0.0:
+    dependencies:
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-resolve-all@2.0.0:
+    dependencies:
+      micromark-util-types: 2.0.0
+
+  micromark-util-sanitize-uri@2.0.0:
+    dependencies:
+      micromark-util-character: 2.1.0
+      micromark-util-encode: 2.0.0
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-subtokenize@2.0.1:
+    dependencies:
+      devlop: 1.1.0
+      micromark-util-chunked: 2.0.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-symbol@2.0.0: {}
+
+  micromark-util-types@2.0.0: {}
+
+  micromark@2.11.4:
+    dependencies:
+      debug: 4.3.4(supports-color@8.1.1)
+      parse-entities: 2.0.0
+    transitivePeerDependencies:
+      - supports-color
+
+  micromark@4.0.0:
+    dependencies:
+      '@types/debug': 4.1.12
+      debug: 4.3.4(supports-color@8.1.1)
+      decode-named-character-reference: 1.0.2
+      devlop: 1.1.0
+      micromark-core-commonmark: 2.0.1
+      micromark-factory-space: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-chunked: 2.0.0
+      micromark-util-combine-extensions: 2.0.0
+      micromark-util-decode-numeric-character-reference: 2.0.1
+      micromark-util-encode: 2.0.0
+      micromark-util-normalize-identifier: 2.0.0
+      micromark-util-resolve-all: 2.0.0
+      micromark-util-sanitize-uri: 2.0.0
+      micromark-util-subtokenize: 2.0.1
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+    transitivePeerDependencies:
+      - supports-color
+
   micromatch@4.0.5:
     dependencies:
       braces: 3.0.2
@@ -20673,6 +21510,10 @@ snapshots:
     dependencies:
       abbrev: 2.0.0
 
+  nopt@7.2.1:
+    dependencies:
+      abbrev: 2.0.0
+
   normalize-package-data@2.5.0:
     dependencies:
       hosted-git-info: 2.8.9
@@ -21020,6 +21861,17 @@ snapshots:
       is-decimal: 1.0.4
       is-hexadecimal: 1.0.4
 
+  parse-entities@4.0.1:
+    dependencies:
+      '@types/unist': 2.0.6
+      character-entities: 2.0.2
+      character-entities-legacy: 3.0.0
+      character-reference-invalid: 2.0.1
+      decode-named-character-reference: 1.0.2
+      is-alphanumerical: 2.0.1
+      is-decimal: 2.0.1
+      is-hexadecimal: 2.0.1
+
   parse-filepath@1.0.2:
     dependencies:
       is-absolute: 1.0.0
@@ -21033,6 +21885,14 @@ snapshots:
       json-parse-even-better-errors: 2.3.1
       lines-and-columns: 1.2.4
 
+  parse-json@7.1.1:
+    dependencies:
+      '@babel/code-frame': 7.24.2
+      error-ex: 1.3.2
+      json-parse-even-better-errors: 3.0.0
+      lines-and-columns: 2.0.3
+      type-fest: 3.13.1
+
   parse-node-version@1.0.1: {}
 
   parse-passwd@1.0.0: {}
@@ -21520,6 +22380,8 @@ snapshots:
 
   proc-log@3.0.0: {}
 
+  proc-log@4.2.0: {}
+
   process-nextick-args@2.0.1: {}
 
   process@0.11.10: {}
@@ -21846,6 +22708,28 @@ snapshots:
       unified: 10.1.2
       unist-util-visit: 4.1.2
 
+  remark-mdx@3.0.1:
+    dependencies:
+      mdast-util-mdx: 3.0.0
+      micromark-extension-mdxjs: 3.0.0
+    transitivePeerDependencies:
+      - supports-color
+
+  remark-parse@11.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-from-markdown: 2.0.1
+      micromark-util-types: 2.0.0
+      unified: 11.0.4
+    transitivePeerDependencies:
+      - supports-color
+
+  remark-stringify@11.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-to-markdown: 2.1.0
+      unified: 11.0.4
+
   remove-trailing-separator@1.1.0: {}
 
   replace-ext@2.0.0: {}
@@ -21862,6 +22746,8 @@ snapshots:
 
   require-main-filename@2.0.0: {}
 
+  requireindex@1.2.0: {}
+
   requires-port@1.0.0: {}
 
   resolve-cwd@3.0.0:
@@ -22015,6 +22901,10 @@ snapshots:
     dependencies:
       tslib: 2.6.2
 
+  sade@1.8.1:
+    dependencies:
+      mri: 1.2.0
+
   safe-array-concat@1.0.0:
     dependencies:
       call-bind: 1.0.7
@@ -22510,6 +23400,12 @@ snapshots:
       emoji-regex: 9.2.2
       strip-ansi: 7.1.0
 
+  string-width@6.1.0:
+    dependencies:
+      eastasianwidth: 0.2.0
+      emoji-regex: 10.3.0
+      strip-ansi: 7.1.0
+
   string.prototype.matchall@4.0.11:
     dependencies:
       call-bind: 1.0.7
@@ -22590,6 +23486,11 @@ snapshots:
     dependencies:
       safe-buffer: 5.2.1
 
+  stringify-entities@4.0.4:
+    dependencies:
+      character-entities-html4: 2.1.0
+      character-entities-legacy: 3.0.0
+
   strip-ansi@6.0.1:
     dependencies:
       ansi-regex: 5.0.1
@@ -22718,6 +23619,8 @@ snapshots:
     dependencies:
       has-flag: 4.0.0
 
+  supports-color@9.4.0: {}
+
   supports-hyperlinks@3.0.0:
     dependencies:
       has-flag: 4.0.0
@@ -22757,6 +23660,11 @@ snapshots:
 
   synchronous-promise@2.0.17: {}
 
+  synckit@0.9.0:
+    dependencies:
+      '@pkgr/core': 0.1.1
+      tslib: 2.6.2
+
   tabbable@6.2.0: {}
 
   table@6.8.2:
@@ -23217,6 +24125,8 @@ snapshots:
 
   type-fest@2.19.0: {}
 
+  type-fest@3.13.1: {}
+
   type-is@1.6.18:
     dependencies:
       media-typer: 0.3.0
@@ -23289,6 +24199,8 @@ snapshots:
 
   typed-assert@1.0.9: {}
 
+  typedarray@0.0.6: {}
+
   typescript@4.9.5: {}
 
   typescript@5.2.2: {}
@@ -23337,6 +24249,32 @@ snapshots:
 
   unicorn-magic@0.1.0: {}
 
+  unified-engine@11.2.1:
+    dependencies:
+      '@types/concat-stream': 2.0.3
+      '@types/debug': 4.1.12
+      '@types/is-empty': 1.2.3
+      '@types/node': 20.12.7
+      '@types/unist': 3.0.2
+      concat-stream: 2.0.0
+      debug: 4.3.4(supports-color@8.1.1)
+      extend: 3.0.2
+      glob: 10.3.15
+      ignore: 5.3.1
+      is-empty: 1.2.0
+      is-plain-obj: 4.1.0
+      load-plugin: 6.0.3
+      parse-json: 7.1.1
+      trough: 2.1.0
+      unist-util-inspect: 8.0.0
+      vfile: 6.0.1
+      vfile-message: 4.0.2
+      vfile-reporter: 8.1.1
+      vfile-statistics: 3.0.0
+      yaml: 2.4.2
+    transitivePeerDependencies:
+      - supports-color
+
   unified@10.1.2:
     dependencies:
       '@types/unist': 2.0.6
@@ -23373,6 +24311,10 @@ snapshots:
     dependencies:
       crypto-random-string: 2.0.0
 
+  unist-util-inspect@8.0.0:
+    dependencies:
+      '@types/unist': 3.0.2
+
   unist-util-is@5.2.1:
     dependencies:
       '@types/unist': 2.0.6
@@ -23381,6 +24323,19 @@ snapshots:
     dependencies:
       '@types/unist': 3.0.2
 
+  unist-util-position-from-estree@2.0.0:
+    dependencies:
+      '@types/unist': 3.0.2
+
+  unist-util-remove-position@5.0.0:
+    dependencies:
+      '@types/unist': 3.0.2
+      unist-util-visit: 5.0.0
+
+  unist-util-stringify-position@2.0.3:
+    dependencies:
+      '@types/unist': 2.0.6
+
   unist-util-stringify-position@3.0.3:
     dependencies:
       '@types/unist': 2.0.6
@@ -23463,6 +24418,13 @@ snapshots:
 
   uuid@9.0.0: {}
 
+  uvu@0.5.6:
+    dependencies:
+      dequal: 2.0.3
+      diff: 5.2.0
+      kleur: 4.1.5
+      sade: 1.8.1
+
   v8-compile-cache-lib@3.0.1: {}
 
   v8-to-istanbul@9.1.0:
@@ -23502,6 +24464,27 @@ snapshots:
       '@types/unist': 3.0.2
       unist-util-stringify-position: 4.0.0
 
+  vfile-reporter@8.1.1:
+    dependencies:
+      '@types/supports-color': 8.1.3
+      string-width: 6.1.0
+      supports-color: 9.4.0
+      unist-util-stringify-position: 4.0.0
+      vfile: 6.0.1
+      vfile-message: 4.0.2
+      vfile-sort: 4.0.0
+      vfile-statistics: 3.0.0
+
+  vfile-sort@4.0.0:
+    dependencies:
+      vfile: 6.0.1
+      vfile-message: 4.0.2
+
+  vfile-statistics@3.0.0:
+    dependencies:
+      vfile: 6.0.1
+      vfile-message: 4.0.2
+
   vfile@5.3.7:
     dependencies:
       '@types/unist': 2.0.6
@@ -23614,6 +24597,8 @@ snapshots:
     transitivePeerDependencies:
       - debug
 
+  walk-up-path@3.0.1: {}
+
   walker@1.0.8:
     dependencies:
       makeerror: 1.0.12
@@ -24018,3 +25003,5 @@ snapshots:
   zone.js@0.14.5:
     dependencies:
       tslib: 2.6.2
+
+  zwitch@2.0.4: {}