diff --git a/docs/_snippets/arg-types-in-story.md b/docs/_snippets/arg-types-in-story.md
index 41508f9a65df..43ce951c112c 100644
--- a/docs/_snippets/arg-types-in-story.md
+++ b/docs/_snippets/arg-types-in-story.md
@@ -52,7 +52,7 @@ const meta = {
 
 export default meta;
 
-type Story = StoryObj<typeof Meta>;
+type Story = StoryObj<typeof meta>;
 
 export const Basic = {
   argTypes: {
@@ -126,4 +126,3 @@ export const Basic: Story = {
   },
 };
 ```
-
diff --git a/docs/_snippets/button-group-story.md b/docs/_snippets/button-group-story.md
index 14a3021bbabd..146034a60d12 100644
--- a/docs/_snippets/button-group-story.md
+++ b/docs/_snippets/button-group-story.md
@@ -175,28 +175,12 @@ export const Pair: Story = {
 </script>
 
 <Story
-  name="Primary"
+  name="Pair"
   args={{
     buttons: [{ ...ButtonStories.Primary.args }, { ...ButtonStories.Secondary.args }],
     orientation: 'horizontal',
   }}
 />
-
-<Story
-  name="Secondary"
-  args={{
-    backgroundColor: '#ff0',
-    label: '😄👍😍💯',
-   }}
-/>
-
-<Story
-  name="Tertiary"
-  args={{
-    backgroundColor:'#ff0',
-    label: '📚📕📈🤓',
-  }}
-/>
 ```
 
 ```js filename="ButtonGroup.stories.js" renderer="svelte" language="js" tabTitle="CSF"
@@ -232,28 +216,12 @@ export const Pair = {
 </script>
 
 <Story
-  name="Primary"
+  name="Pair"
   args={{
     buttons: [{ ...ButtonStories.Primary.args }, { ...ButtonStories.Secondary.args }],
     orientation: 'horizontal',
   }}
 />
-
-<Story
-  name="Secondary"
-  args={{
-    backgroundColor: '#ff0',
-    label: '😄👍😍💯',
-   }}
-/>
-
-<Story
-  name="Tertiary"
-  args={{
-    backgroundColor:'#ff0',
-    label: '📚📕📈🤓',
-  }}
-/>
 ```
 
 ```ts filename="ButtonGroup.stories.ts" renderer="svelte" language="ts-4-9" tabTitle="CSF"
@@ -294,28 +262,12 @@ export const Pair: Story = {
 </script>
 
 <Story
-  name="Primary"
+  name="Pair"
   args={{
     buttons: [{ ...ButtonStories.Primary.args }, { ...ButtonStories.Secondary.args }],
     orientation: 'horizontal',
   }}
 />
-
-<Story
-  name="Secondary"
-  args={{
-    backgroundColor: '#ff0',
-    label: '😄👍😍💯',
-   }}
-/>
-
-<Story
-  name="Tertiary"
-  args={{
-    backgroundColor:'#ff0',
-    label: '📚📕📈🤓',
-  }}
-/>
 ```
 
 ```ts filename="ButtonGroup.stories.ts" renderer="svelte" language="ts" tabTitle="CSF"
diff --git a/docs/_snippets/button-story-component-decorator.md b/docs/_snippets/button-story-component-decorator.md
index 7ff333389d57..85ef46ff097f 100644
--- a/docs/_snippets/button-story-component-decorator.md
+++ b/docs/_snippets/button-story-component-decorator.md
@@ -199,7 +199,7 @@ export default meta;
 
   const { Story } = defineMeta({
     component: Button,
-    decorators: [() => MarginDecorators],
+    decorators: [() => MarginDecorator],
   });
 </script>
 ```
@@ -223,7 +223,7 @@ export default {
 
   const { Story } = defineMeta({
     component: Button,
-    decorators: [() => MarginDecorators],
+    decorators: [() => MarginDecorator],
   });
 </script>
 ```
@@ -251,9 +251,7 @@ export default meta;
 
   const { Story } = defineMeta({
     component: Button,
-    decorators: [() => ({
-      Component: MarginDecorator,
-    })],
+    decorators: [() => MarginDecorator],
   });
 </script>
 ```
diff --git a/docs/_snippets/button-story-using-args.md b/docs/_snippets/button-story-using-args.md
index 5973b4acd0f0..97f33121e090 100644
--- a/docs/_snippets/button-story-using-args.md
+++ b/docs/_snippets/button-story-using-args.md
@@ -336,7 +336,7 @@ export const Tertiary: Story = {
   args={{
     backgroundColor: '#ff0',
     label: '😄👍😍💯',
-   }}
+  }}
 />
 
 <Story
@@ -401,7 +401,7 @@ export const Tertiary = {
   args={{
     backgroundColor: '#ff0',
     label: '😄👍😍💯',
-   }}
+  }}
 />
 
 <Story
@@ -471,7 +471,7 @@ export const Tertiary: Story = {
   args={{
     backgroundColor: '#ff0',
     label: '😄👍😍💯',
-   }}
+  }}
 />
 
 <Story
diff --git a/docs/_snippets/button-story-with-emojis.md b/docs/_snippets/button-story-with-emojis.md
index 6f227f68c2fe..0588748d9039 100644
--- a/docs/_snippets/button-story-with-emojis.md
+++ b/docs/_snippets/button-story-with-emojis.md
@@ -277,7 +277,7 @@ export const Tertiary: Story = {
 
 ```svelte filename="Button.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import Button from './Button.svelte';
 
@@ -344,7 +344,7 @@ export const Tertiary = {
 
 ```svelte filename="Button.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import Button from './Button.svelte';
 
@@ -416,7 +416,7 @@ export const Tertiary: Story = {
 
 ```svelte filename="Button.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import Button from './Button.svelte';
 
diff --git a/docs/_snippets/button-story.md b/docs/_snippets/button-story.md
index 96e7982e516a..fef764603915 100644
--- a/docs/_snippets/button-story.md
+++ b/docs/_snippets/button-story.md
@@ -451,7 +451,7 @@ export const Primary: Story = {
 
 ```svelte filename="Button.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import Button from './Button.svelte';
 
@@ -465,7 +465,7 @@ export const Primary: Story = {
 
 ```svelte filename="Button.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import Button from './Button.svelte';
 
@@ -507,7 +507,7 @@ export const Primary: Story = {
 
 ```svelte filename="Button.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import Button from './Button.svelte';
 
diff --git a/docs/_snippets/component-story-custom-args-mapping.md b/docs/_snippets/component-story-custom-args-mapping.md
index 79008639bda6..f6df7d66211b 100644
--- a/docs/_snippets/component-story-custom-args-mapping.md
+++ b/docs/_snippets/component-story-custom-args-mapping.md
@@ -34,7 +34,7 @@ export default meta;
 <script module>
   import { defineMeta } from '@storybook/addon-svelte-csf';
 
-  import Button from './components/Button.svelte';
+  import Button from './Button.svelte';
 
   import { ArrowUp, ArrowDown, ArrowLeft, ArrowRight } from './icons';
 
@@ -122,7 +122,7 @@ export default {
 <script module>
   import { defineMeta } from '@storybook/addon-svelte-csf';
 
-  import Button from './components/Button.svelte';
+  import Button from './Button.svelte';
 
   import { ArrowUp, ArrowDown, ArrowLeft, ArrowRight } from './icons';
 
@@ -219,7 +219,7 @@ export default meta;
 <script module>
   import { defineMeta } from '@storybook/addon-svelte-csf';
 
-  import Button from './components/Button.svelte';
+  import Button from './Button.svelte';
 
   import { ArrowUp, ArrowDown, ArrowLeft, ArrowRight } from './icons';
 
diff --git a/docs/_snippets/component-story-static-asset-cdn.md b/docs/_snippets/component-story-static-asset-cdn.md
index 01c884bcbe2d..b75ef7a9187e 100644
--- a/docs/_snippets/component-story-static-asset-cdn.md
+++ b/docs/_snippets/component-story-static-asset-cdn.md
@@ -126,7 +126,7 @@ export const WithAnImage: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -163,7 +163,7 @@ export const WithAnImage = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -205,7 +205,7 @@ export const WithAnImage: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
diff --git a/docs/_snippets/component-story-static-asset-with-import.md b/docs/_snippets/component-story-static-asset-with-import.md
index 9469177d2d81..ae48423539e0 100644
--- a/docs/_snippets/component-story-static-asset-with-import.md
+++ b/docs/_snippets/component-story-static-asset-with-import.md
@@ -164,7 +164,7 @@ export const WithAnImage: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -209,7 +209,7 @@ export const WithAnImage = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -259,7 +259,7 @@ export const WithAnImage: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
diff --git a/docs/_snippets/component-story-static-asset-without-import.md b/docs/_snippets/component-story-static-asset-without-import.md
index 9305fffa4afe..99b0e2d32734 100644
--- a/docs/_snippets/component-story-static-asset-without-import.md
+++ b/docs/_snippets/component-story-static-asset-without-import.md
@@ -121,7 +121,7 @@ export const WithAnImage: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -156,7 +156,7 @@ export const WithAnImage = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -196,7 +196,7 @@ export const WithAnImage: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
diff --git a/docs/_snippets/list-story-starter.md b/docs/_snippets/list-story-starter.md
index d91ed7daaa41..09215a1d1dea 100644
--- a/docs/_snippets/list-story-starter.md
+++ b/docs/_snippets/list-story-starter.md
@@ -118,7 +118,7 @@ export default {
   component: List,
 };
 
-//Always an empty list, not super interesting
+// Always an empty list, not super interesting
 export const Empty = {};
 ```
 
diff --git a/docs/_snippets/my-component-play-function-alt-queries.md b/docs/_snippets/my-component-play-function-alt-queries.md
index c8d90beaf745..4145c3cd2acc 100644
--- a/docs/_snippets/my-component-play-function-alt-queries.md
+++ b/docs/_snippets/my-component-play-function-alt-queries.md
@@ -32,7 +32,7 @@ export const ExampleWithRole: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -103,7 +103,7 @@ export const ExampleWithRole = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -185,7 +185,7 @@ export const ExampleWithRole: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -211,7 +211,7 @@ import type { Meta, StoryObj } from '@storybook/svelte';
 
 import { userEvent, within } from '@storybook/test';
 
-import { MyComponent } from './MyComponent';
+import MyComponent from './MyComponent.svelte';
 
 const meta: Meta<typeof MyComponent> = {
   component: MyComponent,
diff --git a/docs/_snippets/my-component-play-function-query-findby.md b/docs/_snippets/my-component-play-function-query-findby.md
index da507231077f..b3835f17926e 100644
--- a/docs/_snippets/my-component-play-function-query-findby.md
+++ b/docs/_snippets/my-component-play-function-query-findby.md
@@ -34,7 +34,7 @@ export const AsyncExample: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -60,7 +60,7 @@ export const AsyncExample: Story = {
 ```js filename="MyComponent.stories.js" renderer="svelte" language="js" tabTitle="CSF"
 import { userEvent, within } from '@storybook/test';
 
-import MyComponent  from './MyComponent.svelte';
+import MyComponent from './MyComponent.svelte';
 
 export default {
   component: MyComponent,
@@ -76,7 +76,7 @@ export const AsyncExample = {
     // Other steps
 
     // Waits for the component to be rendered before querying the element
-    await canvas.findByRole('button', { name: / button label/i }));
+    await canvas.findByRole('button', { name: / button label/i });
   },
 };
 ```
@@ -100,7 +100,7 @@ export const AsyncExample = {
     // Other steps
 
     // Waits for the component to be rendered before querying the element
-    await canvas.findByRole('button', { name: / button label/i }));
+    await canvas.findByRole('button', { name: / button label/i });
   },
 };
 ```
@@ -111,7 +111,7 @@ export const AsyncExample = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -199,7 +199,7 @@ export const AsyncExample: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -298,7 +298,7 @@ export const AsyncExample = {
     // Other steps
 
     // Waits for the component to be rendered before querying the element
-    await canvas.findByRole('button', { name: / button label/i }));
+    await canvas.findByRole('button', { name: / button label/i });
   },
 };
 ```
diff --git a/docs/_snippets/my-component-play-function-waitfor.md b/docs/_snippets/my-component-play-function-waitfor.md
index d963cae3beae..195096524fba 100644
--- a/docs/_snippets/my-component-play-function-waitfor.md
+++ b/docs/_snippets/my-component-play-function-waitfor.md
@@ -45,7 +45,7 @@ export const ExampleAsyncStory: Story = {
 
   import { userEvent, waitFor, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -155,7 +155,7 @@ export const ExampleAsyncStory = {
 
   import { userEvent, waitFor, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -276,7 +276,7 @@ export const ExampleAsyncStory: Story = {
 
   import { userEvent, waitFor, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
diff --git a/docs/_snippets/my-component-play-function-with-canvas.md b/docs/_snippets/my-component-play-function-with-canvas.md
index 00979b5b9980..7d44ad477a74 100644
--- a/docs/_snippets/my-component-play-function-with-canvas.md
+++ b/docs/_snippets/my-component-play-function-with-canvas.md
@@ -30,7 +30,7 @@ export const ExampleStory: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -101,7 +101,7 @@ export const ExampleStory = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -178,7 +178,7 @@ export const ExampleStory: Story = {
   import { defineMeta } from '@storybook/addon-svelte-csf';
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
diff --git a/docs/_snippets/my-component-play-function-with-clickevent.md b/docs/_snippets/my-component-play-function-with-clickevent.md
index 6da48d0d567a..bf4b5b8c47fa 100644
--- a/docs/_snippets/my-component-play-function-with-clickevent.md
+++ b/docs/_snippets/my-component-play-function-with-clickevent.md
@@ -41,7 +41,7 @@ export const FireEventExample: Story = {
 
   import { fireEvent, userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -141,7 +141,7 @@ export const FireEventExample = {
 
   import { fireEvent, userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -252,7 +252,7 @@ export const FireEventExample: Story = {
 
   import { fireEvent, userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
diff --git a/docs/_snippets/my-component-play-function-with-delay.md b/docs/_snippets/my-component-play-function-with-delay.md
index 60acb5e218aa..e4fd3ac06338 100644
--- a/docs/_snippets/my-component-play-function-with-delay.md
+++ b/docs/_snippets/my-component-play-function-with-delay.md
@@ -41,7 +41,7 @@ export const DelayedStory: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -140,7 +140,7 @@ export const DelayedStory = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -250,7 +250,7 @@ export const DelayedStory: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
diff --git a/docs/_snippets/my-component-play-function-with-selectevent.md b/docs/_snippets/my-component-play-function-with-selectevent.md
index 4f29e6795f47..1892f1790d47 100644
--- a/docs/_snippets/my-component-play-function-with-selectevent.md
+++ b/docs/_snippets/my-component-play-function-with-selectevent.md
@@ -44,7 +44,7 @@ export const ExampleChangeEvent: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -151,7 +151,7 @@ export const ExampleChangeEvent = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
@@ -269,7 +269,7 @@ export const ExampleChangeEvent: Story = {
 
   import { userEvent, within } from '@storybook/test';
 
-  import MyComponent  from './MyComponent.svelte';
+  import MyComponent from './MyComponent.svelte';
 
   const { Story } = defineMeta({
     component: MyComponent,
diff --git a/docs/_snippets/my-component-story-basic-and-props.md b/docs/_snippets/my-component-story-basic-and-props.md
index 46e372499122..c4ad00503ea3 100644
--- a/docs/_snippets/my-component-story-basic-and-props.md
+++ b/docs/_snippets/my-component-story-basic-and-props.md
@@ -127,7 +127,7 @@ export const WithProp: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -171,7 +171,7 @@ export const WithProp = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -220,7 +220,7 @@ export const WithProp: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
diff --git a/docs/_snippets/my-component-vite-env-variables.md b/docs/_snippets/my-component-vite-env-variables.md
index 325e1fe266a7..d3b873cdac1d 100644
--- a/docs/_snippets/my-component-vite-env-variables.md
+++ b/docs/_snippets/my-component-vite-env-variables.md
@@ -1,6 +1,6 @@
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -50,7 +50,7 @@ export const ExampleStory = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -111,7 +111,7 @@ export const ExampleStory: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
diff --git a/docs/_snippets/my-component-with-env-variables.md b/docs/_snippets/my-component-with-env-variables.md
index ae87f8dc476f..81f0ad36f505 100644
--- a/docs/_snippets/my-component-with-env-variables.md
+++ b/docs/_snippets/my-component-with-env-variables.md
@@ -19,7 +19,7 @@ export const ExampleStory: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -66,7 +66,7 @@ export const ExampleStory = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts-4-9" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
@@ -124,7 +124,7 @@ export const ExampleStory: Story = {
 
 ```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
 <script module>
-	import { defineMeta } from '@storybook/addon-svelte-csf';
+  import { defineMeta } from '@storybook/addon-svelte-csf';
 
   import MyComponent from './MyComponent.svelte';
 
diff --git a/docs/_snippets/nextjs-navigation-override-in-story.md b/docs/_snippets/nextjs-navigation-override-in-story.md
index 417f5c104c7c..a2afcfbfdd36 100644
--- a/docs/_snippets/nextjs-navigation-override-in-story.md
+++ b/docs/_snippets/nextjs-navigation-override-in-story.md
@@ -41,7 +41,7 @@ const meta = {
 } satisfies Meta<typeof NavigationBasedComponent>;
 export default meta;
 
-type Story = StoryObj<typeof Meta>;
+type Story = StoryObj<typeof meta>;
 
 // If you have the actions addon,
 // you can interact with the links and see the route change events there
@@ -91,4 +91,3 @@ export const Example: Story = {
   },
 };
 ```
-
diff --git a/docs/_snippets/nextjs-router-override-in-story.md b/docs/_snippets/nextjs-router-override-in-story.md
index bdf1d0718209..cac0babd2688 100644
--- a/docs/_snippets/nextjs-router-override-in-story.md
+++ b/docs/_snippets/nextjs-router-override-in-story.md
@@ -32,7 +32,7 @@ const meta = {
 } satisfies Meta<typeof RouterBasedComponent>;
 export default meta;
 
-type Story = StoryObj<typeof Meta>;
+type Story = StoryObj<typeof meta>;
 
 // If you have the actions addon,
 // you can interact with the links and see the route change events there
@@ -79,4 +79,3 @@ export const Example: Story = {
   },
 };
 ```
-
diff --git a/docs/_snippets/parameters-in-story.md b/docs/_snippets/parameters-in-story.md
index 91f2009131a9..77dfdf57459c 100644
--- a/docs/_snippets/parameters-in-story.md
+++ b/docs/_snippets/parameters-in-story.md
@@ -107,7 +107,7 @@ const meta = {
 } satisfies Meta<typeof Button>;
 
 export default meta;
-type Story = StoryObj<typeof Meta>;
+type Story = StoryObj<typeof meta>;
 
 export const OnDark: Story = {
   // 👇 Story-level parameters
@@ -130,7 +130,7 @@ const meta = {
 } satisfies Meta<typeof Button>;
 
 export default meta;
-type Story = StoryObj<typeof Meta>;
+type Story = StoryObj<typeof meta>;
 
 export const OnDark: Story = {
   // 👇 Story-level parameters
diff --git a/docs/_snippets/register-component-with-play-function.md b/docs/_snippets/register-component-with-play-function.md
index 59c310fd542d..177564a6205a 100644
--- a/docs/_snippets/register-component-with-play-function.md
+++ b/docs/_snippets/register-component-with-play-function.md
@@ -182,7 +182,6 @@ export const FilledForm = {
   });
 </script>
 
-
 <!--
   See https://storybook.js.org/docs/writing-stories/play-function#working-with-the-canvas
   to learn more about using the canvasElement to query the DOM
diff --git a/docs/_snippets/tags-autodocs-remove-component.md b/docs/_snippets/tags-autodocs-remove-component.md
index 1b73a5f81677..60014c991265 100644
--- a/docs/_snippets/tags-autodocs-remove-component.md
+++ b/docs/_snippets/tags-autodocs-remove-component.md
@@ -1,5 +1,5 @@
 ```ts filename="Page.stories.ts" renderer="angular" language="ts"
-import type { Meta, StoryObj } from '@storybook/angular';
+import type { Meta } from '@storybook/angular';
 
 import { Page } from './Page';
 
@@ -60,7 +60,7 @@ export default {
 ```
 
 ```ts filename="Page.stories.ts" renderer="svelte" language="ts-4-9" tabTitle="CSF"
-import type { Meta, StoryObj } from '@storybook/svelte';
+import type { Meta } from '@storybook/svelte';
 
 import Page from './Page.svelte';
 
@@ -74,7 +74,7 @@ export default meta;
 
 ```ts filename="Page.stories.ts" renderer="common" language="ts-4-9"
 // Replace your-framework with the framework you are using (e.g., nextjs, vue3-vite)
-import type { Meta, StoryObj } from '@storybook/your-framework';
+import type { Meta } from '@storybook/your-framework';
 
 import { Page } from './Page';
 
@@ -101,7 +101,7 @@ export default meta;
 ```
 
 ```ts filename="Page.stories.ts" renderer="svelte" language="ts" tabTitle="CSF"
-import type { Meta, StoryObj } from '@storybook/svelte';
+import type { Meta } from '@storybook/svelte';
 
 import Page from './Page.svelte';
 
@@ -115,7 +115,7 @@ export default meta;
 
 ```ts filename="Page.stories.ts" renderer="common" language="ts"
 // Replace your-framework with the framework you are using (e.g., nextjs, vue3-vite)
-import type { Meta, StoryObj } from '@storybook/your-framework';
+import type { Meta } from '@storybook/your-framework';
 
 import { Page } from './Page';
 
@@ -137,7 +137,7 @@ export default {
 ```
 
 ```ts filename="Page.stories.ts" renderer="web-components" language="ts"
-import type { Meta, StoryObj } from '@storybook/web-components';
+import type { Meta } from '@storybook/web-components';
 
 const meta: Meta = {
   title: 'Page',
diff --git a/docs/_snippets/tags-combo-example.md b/docs/_snippets/tags-combo-example.md
index 558eac1a700c..46086937d727 100644
--- a/docs/_snippets/tags-combo-example.md
+++ b/docs/_snippets/tags-combo-example.md
@@ -261,13 +261,13 @@ export const Combo: Story = {
 
 <!-- 👇 This story will not appear in Storybook's sidebar or docs page -->
 <Story
-  name="Variant1"
+  name="Variant2"
   tags={['!dev', '!autodocs']}
   args={{ variant: 2 }}
 />
 
 <!-- 👇 This story should not be tested, but will appear in the sidebar and docs page -->
-<Story name="Variant1" tags={['!dev', '!autodocs']}>
+<Story name="Combo" tags={['!test']}>
   <Button variant={1}>
   <Button variant={2}>
 </Story>
@@ -292,13 +292,13 @@ export const Combo: Story = {
 
 <!-- 👇 This story will not appear in Storybook's sidebar or docs page -->
 <Story
-  name="Variant1"
+  name="Variant2"
   tags={['!dev', '!autodocs']}
   args={{ variant: 2 }}
 />
 
 <!-- 👇 This story should not be tested, but will appear in the sidebar and docs page -->
-<Story name="Variant1" tags={['!dev', '!autodocs']}>
+<Story name="Combo" tags={['!test']}>
   <Button variant={1}>
   <Button variant={2}>
 </Story>
@@ -323,13 +323,13 @@ export const Combo: Story = {
 
 <!-- 👇 This story will not appear in Storybook's sidebar or docs page -->
 <Story
-  name="Variant1"
+  name="Variant2"
   tags={['!dev', '!autodocs']}
   args={{ variant: 2 }}
 />
 
 <!-- 👇 This story should not be tested, but will appear in the sidebar and docs page -->
-<Story name="Variant1" tags={['!dev', '!autodocs']}>
+<Story name="Combo" tags={['!test']}>
   <Button variant={1}>
   <Button variant={2}>
 </Story>
diff --git a/docs/_snippets/tags-in-meta-and-story.md b/docs/_snippets/tags-in-meta-and-story.md
index 5dbf645840ee..d0f262f2d6f7 100644
--- a/docs/_snippets/tags-in-meta-and-story.md
+++ b/docs/_snippets/tags-in-meta-and-story.md
@@ -249,7 +249,7 @@ type Story = StoryObj<typeof Button>;
 
 export const ExperimentalFeatureStory: Story = {
   /*
-   *This particular story will have these tags applied:
+   * This particular story will have these tags applied:
    * - experimental
    * - autodocs (inherited from meta)
    * - dev (inherited from meta)
@@ -281,7 +281,7 @@ type Story = StoryObj<typeof Button>;
 
 export const ExperimentalFeatureStory: Story = {
   /*
-   *This particular story will have these tags applied:
+   * This particular story will have these tags applied:
    * - experimental
    * - autodocs (inherited from meta)
    * - dev (inherited from meta)
diff --git a/docs/_snippets/tags-remove-in-story.md b/docs/_snippets/tags-remove-in-story.md
index b124a3f8342f..b48beba734f8 100644
--- a/docs/_snippets/tags-remove-in-story.md
+++ b/docs/_snippets/tags-remove-in-story.md
@@ -31,7 +31,7 @@ export const ExperimentalFeatureStory: Story = {
   });
 </script>
 
-<!-- 👇 For this particular story, remove the inherited stable` tag and apply the `experimental` tag -->
+<!-- 👇 For this particular story, remove the inherited `stable` tag and apply the `experimental` tag -->
 <Story name="ExperimentalFeatureStory" tags={['!stable', 'experimental']} />
 ```
 
@@ -78,7 +78,7 @@ export const ExperimentalFeatureStory = {
   });
 </script>
 
-<!-- 👇 For this particular story, remove the inherited stable` tag and apply the `experimental` tag -->
+<!-- 👇 For this particular story, remove the inherited `stable` tag and apply the `experimental` tag -->
 <Story name="ExperimentalFeatureStory" tags={['!stable', 'experimental']} />
 ```
 
@@ -136,7 +136,7 @@ export const ExperimentalFeatureStory: Story = {
   });
 </script>
 
-<!-- 👇 For this particular story, remove the inherited stable` tag and apply the `experimental` tag -->
+<!-- 👇 For this particular story, remove the inherited `stable` tag and apply the `experimental` tag -->
 <Story name="ExperimentalFeatureStory" tags={['!stable', 'experimental']} />
 ```
 
diff --git a/docs/_snippets/your-component-with-decorator.md b/docs/_snippets/your-component-with-decorator.md
index a3b8111e5837..c06d43496724 100644
--- a/docs/_snippets/your-component-with-decorator.md
+++ b/docs/_snippets/your-component-with-decorator.md
@@ -157,9 +157,7 @@ export default meta;
 
   const { Story } = defineMeta({
     component: YourComponent,
-    decorators: [() => ({
-      Component: MarginDecorator,
-    })],
+    decorators: [() => MarginDecorator],
   });
 </script>
 ```
@@ -195,18 +193,18 @@ import YourComponent from './YourComponent.svelte';
 import MarginDecorator from './MarginDecorator.svelte';
 
 const meta = {
-  component: Button,
+  component: YourComponent,
   decorators: [() => MarginDecorator],
 } satisfies Meta<typeof YourComponent>;
 
 export default meta;
 ```
 
-```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
+```svelte filename="YourComponent.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
 <script module>
   import { defineMeta } from '@storybook/addon-svelte-csf';
 
-  import MyComponent from './MyComponent.svelte';
+  import YourComponent from './YourComponent.svelte';
   import MarginDecorator from './MarginDecorator.svelte';
 
   const { Story } = defineMeta({
diff --git a/docs/_snippets/your-component.md b/docs/_snippets/your-component.md
index 26795169434a..34d5c4f5a7d2 100644
--- a/docs/_snippets/your-component.md
+++ b/docs/_snippets/your-component.md
@@ -230,7 +230,7 @@ export const FirstStory: Story = {
 ```js filename="YourComponent.stories.js" renderer="svelte" language="js" tabTitle="CSF"
 import YourComponent from './YourComponent.svelte';
 
-//👇This default export determines where your story goes in the story list
+//👇 This default export determines where your story goes in the story list
 export default {
   component: YourComponent,
 };
diff --git a/docs/get-started/frameworks/svelte-vite.mdx b/docs/get-started/frameworks/svelte-vite.mdx
index 16871558f60b..64b7e6a2c440 100644
--- a/docs/get-started/frameworks/svelte-vite.mdx
+++ b/docs/get-started/frameworks/svelte-vite.mdx
@@ -75,7 +75,7 @@ Storybook for Svelte & Vite is a [framework](../../contribute/framework.mdx) tha
   Storybook provides a Svelte [addon](https://storybook.js.org/addons/@storybook/addon-svelte-csf) maintained by the community, enabling you to write stories for your Svelte components using the template syntax. 
   
   <Callout variant="info">
-    The community actively maintains the Svelte CSF addon but still lacks some features currently available in the official Storybook Svelte framework support. For more information, see [addon's documentation](https://github.com/storybookjs/addon-svelte-csf).
+    The community actively maintains the Svelte CSF addon but still lacks some features currently available in the official Storybook Svelte framework support. For more information, see the [addon's documentation](https://github.com/storybookjs/addon-svelte-csf).
   </Callout>
 
   ### Setup
@@ -150,13 +150,13 @@ Storybook for Svelte & Vite is a [framework](../../contribute/framework.mdx) tha
 
   <Callout variant="info">
 
-    If you need support for the `Template` component, the addon provides a feature flag for backward compatibility. For more information, see the [configration options](#configure).
+    If you need support for the `Template` component, the addon provides a feature flag for backward compatibility. For more information, see the [configuration options](#configure).
   
   </Callout>
 
   #### Story slots to snippets
   
-  With Svelte's slot deprecation and the introduction of reusable [`snippets`](https://svelte.dev/docs/svelte/v5-migration-guide#Snippets-instead-of-slots), the addon also introduced support for this feature allowing extend the `Story` component and provide a custom snippet to provide dynamic content to your stories. This feature extends the built-in `children` support in the `Story` component, allowing you to create dynamic stories without losing reactivity.
+  With Svelte's slot deprecation and the introduction of reusable [`snippets`](https://svelte.dev/docs/svelte/v5-migration-guide#Snippets-instead-of-slots), the addon also introduced support for this feature allowing you to extend the `Story` component and provide a custom snippet to provide dynamic content to your stories. This feature extends the built-in `children` support in the `Story` component, allowing you to create dynamic stories without losing reactivity.
 
   ```svelte title="MyComponent.stories.svelte"
   <script>
diff --git a/docs/get-started/frameworks/sveltekit.mdx b/docs/get-started/frameworks/sveltekit.mdx
index 1e182e282086..eda3f2473a9f 100644
--- a/docs/get-started/frameworks/sveltekit.mdx
+++ b/docs/get-started/frameworks/sveltekit.mdx
@@ -160,7 +160,7 @@ Storybook for SvelteKit is a [framework](../../contribute/framework.mdx) that ma
   Storybook provides a Svelte [addon](https://storybook.js.org/addons/@storybook/addon-svelte-csf) maintained by the community, enabling you to write stories for your Svelte components using the template syntax. 
   
   <Callout variant="info">
-    The community actively maintains the Svelte CSF addon but still lacks some features currently available in the official Storybook Svelte framework support. For more information, see [addon's documentation](https://github.com/storybookjs/addon-svelte-csf).
+      The community actively maintains the Svelte CSF addon but still lacks some features currently available in the official Storybook Svelte framework support. For more information, see the [addon's documentation](https://github.com/storybookjs/addon-svelte-csf).
   </Callout>
 
   ### Setup
@@ -235,13 +235,13 @@ Storybook for SvelteKit is a [framework](../../contribute/framework.mdx) that ma
 
   <Callout variant="info">
 
-    If you need support for the `Template` component, the addon provides a feature flag for backward compatibility. For more information, see the [configration options](#configure).
+    If you need support for the `Template` component, the addon provides a feature flag for backward compatibility. For more information, see the [configuration options](#configure).
   
   </Callout>
 
   #### Story slots to snippets
   
-  With Svelte's slot deprecation and the introduction of reusable [`snippets`](https://svelte.dev/docs/svelte/v5-migration-guide#Snippets-instead-of-slots), the addon also introduced support for this feature allowing extend the `Story` component and provide a custom snippet to provide dynamic content to your stories. This feature extends the built-in `children` support in the `Story` component, allowing you to create dynamic stories without losing reactivity.
+  With Svelte's slot deprecation and the introduction of reusable [`snippets`](https://svelte.dev/docs/svelte/v5-migration-guide#Snippets-instead-of-slots), the addon also introduced support for this feature allowing you to extend the `Story` component and provide a custom snippet to provide dynamic content to your stories. This feature extends the built-in `children` support in the `Story` component, allowing you to create dynamic stories without losing reactivity.
 
   ```svelte title="MyComponent.stories.svelte"
   <script>
diff --git a/docs/get-started/install.mdx b/docs/get-started/install.mdx
index 5f2ee161e13f..ff1d301b1441 100644
--- a/docs/get-started/install.mdx
+++ b/docs/get-started/install.mdx
@@ -196,7 +196,7 @@ There are some noteworthy items here:
     {/* prettier-ignore-end */}
 
     <Callout variant="info" style={{ marginBottom: "2rem" }}>
-      The community actively maintains the Svelte CSF addon but still lacks some features currently available in the official Storybook Svelte framework support. For more information, see [addon's documentation](https://github.com/storybookjs/addon-svelte-csf).
+      The community actively maintains the Svelte CSF addon but still lacks some features currently available in the official Storybook Svelte framework support. For more information, see the [addon's documentation](https://github.com/storybookjs/addon-svelte-csf).
     </Callout>
   </IfRenderer>
 
diff --git a/docs/writing-stories/decorators.mdx b/docs/writing-stories/decorators.mdx
index c8d86cff5a54..a86e2ca8738e 100644
--- a/docs/writing-stories/decorators.mdx
+++ b/docs/writing-stories/decorators.mdx
@@ -51,8 +51,6 @@ When writing stories, decorators are typically used to wrap stories with extra m
 
 </If>
 
-
-
 ![Story with padding](../_assets/writing-stories/decorators-padding.png)
 
 ## “Context” for mocking
diff --git a/docs/writing-stories/index.mdx b/docs/writing-stories/index.mdx
index 05338e3de1ed..6cf05e520c43 100644
--- a/docs/writing-stories/index.mdx
+++ b/docs/writing-stories/index.mdx
@@ -92,7 +92,7 @@ components/
 
 <If renderer="svelte">
  
-    If you're using Svelte CSF, define your stories with the `Story` component, otherwise use the named exports of a standard CSF file. We recommend you use UpperCamelCase for your story exports. Here’s how to render `Button` in the “primary” state and export a story called `Primary` using both methods.
+  If you're using Svelte CSF, define your stories with the `Story` component, otherwise use the named exports of a standard CSF file. We recommend you use UpperCamelCase for your story exports. Here’s how to render `Button` in the “primary” state and export a story called `Primary` using both methods.
 
 </If>