Merge pull request #29693 from storybookjs/maintenance_fix_docs_scripts

Docs: Maintenance - Fix prettier docs script

docs/_snippets/angular-add-framework.md

@@ -15,4 +15,3 @@ const config: StorybookConfig = {
 
 export default config;
 ```
-

docs/_snippets/angular-project-compodoc-config.md

@@ -21,10 +21,10 @@
               "-e",
               "json",
               "-d",
-              "." // Add this line to introspect the relevant files starting from the root directory of your project.
+              ".", // Add this line to introspect the relevant files starting from the root directory of your project.
             ],
-            "port": 6006
-          }
+            "port": 6006,
+          },
         },
         "build-storybook": {
           "builder": "@storybook/angular:build-storybook",
@@ -36,13 +36,13 @@
               "-e",
               "json",
               "-d",
-              "." // Add this line to introspect the relevant files starting from the root directory of your project.
+              ".", // Add this line to introspect the relevant files starting from the root directory of your project.
             ],
-            "outputDir": "storybook-static"
-          }
-        }
-      }
-    }
-  }
+            "outputDir": "storybook-static",
+          },
+        },
+      },
+    },
+  },
 }
 ```

docs/_snippets/before-each-in-meta-mock-date.md

@@ -173,4 +173,3 @@ export const Default: Story = {
   },
 };
 ```
-

docs/_snippets/button-story-argtypes-with-subcategories.md

@@ -275,4 +275,3 @@ const meta: Meta = {
 
 export default meta;
 ```
-

docs/_snippets/checkbox-story-grouped.md

@@ -81,4 +81,3 @@ const meta: Meta = {
 
 export default meta;
 ```
-

docs/_snippets/checkbox-story.md

@@ -1,3 +1,4 @@
+<!-- prettier-ignore -->
 ```mdx filename="Checkbox.mdx" renderer="common" language="mdx"
 import { Canvas, Meta } from '@storybook/blocks';
 
@@ -14,6 +15,7 @@ Use checkboxes to select one or more options from a list of choices.
 <Canvas of={CheckboxStories.Unchecked} />
 ```
 
+<!-- prettier-ignore -->
 ```mdx filename="Checkbox.mdx" renderer="svelte" language="mdx" tabTitle="Svelte CSF"
 import { Canvas, Meta } from '@storybook/blocks';
 
@@ -30,6 +32,7 @@ Use checkboxes to select one or more options from a list of choices.
 <Canvas of={CheckboxStories.Unchecked} />
 ```
 
+<!-- prettier-ignore -->
 ```mdx filename="Checkbox.mdx" renderer="svelte" language="mdx" tabTitle="CSF"
 import { Canvas, Meta } from '@storybook/blocks';
 

docs/_snippets/chromatic-install.md

@@ -9,4 +9,3 @@ pnpm add --save-dev chromatic
 ```shell renderer="common" language="js" packageManager="yarn"
 yarn add --dev chromatic
 ```
-

docs/_snippets/component-story-custom-args-icons.md

@@ -34,4 +34,3 @@ const Template: Story = (args) => {
   };
 };
 ```
-

docs/_snippets/csf-3-example-title.md

@@ -1,3 +1,4 @@
+<!-- prettier-ignore -->
 ```mdx filename="src/components/Button/Button.mdx" renderer="common" language="mdx"
 import { Meta, Story } from '@storybook/blocks';
 

docs/_snippets/custom-docs-page.md

@@ -14,9 +14,8 @@ export function CustomDocumentationComponent() {
 }
 ```
 
-```md renderer="common" language="mdx"
-{/* Custom-MDX-Documentation.mdx */}
-
+<!-- prettier-ignore -->
+```mdx filename="Custom-MDX-Documentation.mdx" renderer="common" language="mdx"
 # Replacing DocsPage with custom `MDX` content
 
 This file is a documentation-only `MDX`file to customize Storybook's [DocsPage](https://storybook.js.org/docs/writing-docs/docs-page#replacing-docspage).
@@ -76,6 +75,7 @@ If you didn't include the title in the story's default export, use this approach
 
 <Story id="your-directory-button--small" />
 ```
+
 ```ts filename="CustomDocumentationComponent.ts|tsx" renderer="common" language="ts" tabTitle="ts-component"
 export const CustomDocumentationComponent: React.FC = () => {
   return (
@@ -89,4 +89,3 @@ export const CustomDocumentationComponent: React.FC = () => {
   );
 };
 ```
-

docs/_snippets/decorator-parameterized-in-preview.md

@@ -38,11 +38,15 @@ export default {
         case 'page':
           return (
             // Your page layout is probably a little more complex than this ;)
-            <div className="page-layout"><Story /></div>
+            <div className="page-layout">
+              <Story />
+            </div>
           );
         case 'page-mobile':
           return (
-            <div className="page-mobile-layout"><Story /></div>
+            <div className="page-mobile-layout">
+              <Story />
+            </div>
           );
         default:
           // In the default case, don't apply a layout
@@ -68,11 +72,15 @@ const preview: Preview = {
         case 'page':
           return (
             // Your page layout is probably a little more complex than this ;)
-            <div className="page-layout"><Story /></div>
+            <div className="page-layout">
+              <Story />
+            </div>
           );
         case 'page-mobile':
           return (
-            <div className="page-mobile-layout"><Story /></div>
+            <div className="page-mobile-layout">
+              <Story />
+            </div>
           );
         default:
           // In the default case, don't apply a layout
@@ -96,11 +104,15 @@ export default {
         case 'page':
           return (
             // Your page layout is probably a little more complex than this ;)
-            <div className="page-layout"><Story /></div>
+            <div className="page-layout">
+              <Story />
+            </div>
           );
         case 'page-mobile':
           return (
-            <div className="page-mobile-layout"><Story /></div>
+            <div className="page-mobile-layout">
+              <Story />
+            </div>
           );
         default:
           // In the default case, don't apply a layout
@@ -124,11 +136,15 @@ const preview: Preview = {
         case 'page':
           return (
             // Your page layout is probably a little more complex than this ;)
-            <div className="page-layout"><Story /></div>
+            <div className="page-layout">
+              <Story />
+            </div>
           );
         case 'page-mobile':
           return (
-            <div className="page-mobile-layout"><Story /></div>
+            <div className="page-mobile-layout">
+              <Story />
+            </div>
           );
         default:
           // In the default case, don't apply a layout
@@ -188,4 +204,3 @@ const preview: Preview = {
 
 export default preview;
 ```
-

docs/_snippets/individual-snapshot-tests-portable-stories.md

@@ -15,15 +15,15 @@ const compose = (entry) => {
     return composeStories(entry);
   } catch (e) {
     throw new Error(
-      `There was an issue composing stories for the module: ${JSON.stringify(entry)}, ${e}`
+      `There was an issue composing stories for the module: ${JSON.stringify(entry)}, ${e}`,
     );
   }
 };
 
 function getAllStoryFiles() {
   // Place the glob you want to match your stories files
   const storyFiles = glob.sync(
-    path.join(__dirname, 'stories/**/*.{stories,story}.{js,jsx,mjs,ts,tsx}')
+    path.join(__dirname, 'stories/**/*.{stories,story}.{js,jsx,mjs,ts,tsx}'),
   );
 
   return storyFiles.map((filePath) => {
@@ -45,7 +45,7 @@ describe('Stories Snapshots', () => {
 
       if (stories.length <= 0) {
         throw new Error(
-          `No stories found for this module: ${title}. Make sure there is at least one valid story for this module.`
+          `No stories found for this module: ${title}. Make sure there is at least one valid story for this module.`,
         );
       }
 
@@ -157,7 +157,7 @@ const compose = (entry) => {
     return composeStories(entry);
   } catch (error) {
     throw new Error(
-      `There was an issue composing stories for the module: ${JSON.stringify(entry)}, ${error}`
+      `There was an issue composing stories for the module: ${JSON.stringify(entry)}, ${error}`,
     );
   }
 };
@@ -166,7 +166,7 @@ function getAllStoryFiles() {
   const storyFiles = Object.entries(
     import.meta.glob('./stories/**/*.(stories|story).@(js|jsx|mjs|ts|tsx)', {
       eager: true,
-    })
+    }),
   );
 
   return storyFiles.map(([filePath, storyFile]) => {
@@ -185,7 +185,7 @@ describe('Stories Snapshots', () => {
 
       if (stories.length <= 0) {
         throw new Error(
-          `No stories found for this module: ${title}. Make sure there is at least one valid story for this module.`
+          `No stories found for this module: ${title}. Make sure there is at least one valid story for this module.`,
         );
       }
 
@@ -226,7 +226,7 @@ const compose = (entry: StoryFile): ReturnType<typeof composeStories<StoryFile>>
     return composeStories(entry);
   } catch (e) {
     throw new Error(
-      `There was an issue composing stories for the module: ${JSON.stringify(entry)}, ${e}`
+      `There was an issue composing stories for the module: ${JSON.stringify(entry)}, ${e}`,
     );
   }
 };
@@ -236,7 +236,7 @@ function getAllStoryFiles() {
   const storyFiles = Object.entries(
     import.meta.glob<StoryFile>('./stories/**/*.(stories|story).@(js|jsx|mjs|ts|tsx)', {
       eager: true,
-    })
+    }),
   );
 
   return storyFiles.map(([filePath, storyFile]) => {
@@ -256,7 +256,7 @@ describe('Stories Snapshots', () => {
 
       if (stories.length <= 0) {
         throw new Error(
-          `No stories found for this module: ${title}. Make sure there is at least one valid story for this module.`
+          `No stories found for this module: ${title}. Make sure there is at least one valid story for this module.`,
         );
       }