docs(Dialog): add explicit stories for dialog (#5172)

* docs(Dialog): add explicit stories for dialog * chore: update generation logic --------- Co-authored-by: Josh Black <joshblack@users.noreply.github.com>
primer · Nov 6, 2024 · 9ec5bb6 · 9ec5bb6
1 parent 2e5c601
commit 9ec5bb6
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 6 deletions.
diff --git a/packages/react/script/components-json/build.ts b/packages/react/script/components-json/build.ts
@@ -77,8 +77,16 @@ const components = docsFiles.map(docsFilepath => {
   // if stories are not defined in *.docs.json, fill feature stories as default
   const stories = (docs.stories.length > 0 ? docs.stories : getStoryIds(docs, Object.keys(featureStorySourceCode)))
     // Filter out the default story
-    .filter(({id}) => id !== defaultStoryId)
+    .filter(({id}) => {
+      return id !== defaultStoryId
+    })
     .map(({id}) => {
+      if (id.endsWith('--default')) {
+        return {
+          id,
+          code: defaultStoryCode,
+        }
+      }
       const storyName = getStoryName(id)
       const code = id.includes('-features--') ? featureStorySourceCode[storyName] : exampleStorySourceCode[storyName]
 
@@ -96,10 +104,13 @@ const components = docsFiles.map(docsFilepath => {
 
   // Add default story to the beginning of the array
   if (defaultStoryCode) {
-    docs.stories.unshift({
-      id: defaultStoryId,
-      code: defaultStoryCode,
-    })
+    const hasDefaultStory = docs.stories.find(story => story.code === defaultStoryCode)
+    if (!hasDefaultStory) {
+      docs.stories.unshift({
+        id: defaultStoryId,
+        code: defaultStoryCode,
+      })
+    }
   }
 
   // TODO: Provide default type and description for sx and ref props

diff --git a/packages/react/src/Dialog/Dialog.docs.json b/packages/react/src/Dialog/Dialog.docs.json
@@ -4,7 +4,23 @@
   "name": "Dialog",
   "status": "draft",
   "a11yReviewed": false,
-  "stories": [],
+  "stories": [
+    {
+      "id": "components-dialog--default"
+    },
+    {
+      "id": "components-dialog-features--bottom-sheet-narrow"
+    },
+    {
+      "id": "components-dialog-features--full-screen-narrow"
+    },
+    {
+      "id": "components-dialog-features--side-sheet"
+    },
+    {
+      "id": "components-dialog-features--return-focus-ref"
+    }
+  ],
   "importPath": "@primer/react/experimental",
   "props": [
     {