Manually corrects .docs.json files (#5316)

* manually corrects prop docs

* tweaks

Author: mperrotti

packages/react/src/ActionBar/ActionBar.docs.json

@@ -3,29 +3,45 @@
   "name": "ActionBar",
   "status": "alpha",
   "a11yReviewed": true,
-  "stories": [],
+  "stories": [
+    {
+      "id": "components-actionbar--default"
+    }
+  ],
   "importPath": "@primer/react",
   "props": [
     {
-      "name": "size",
-      "type": "'small' | 'medium' | 'large'",
+      "name": "aria-label",
+      "type": "string",
       "required": false,
-      "description": "Size of the action bar"
+      "description": "When provided, a label is added to the action bar",
+      "defaultValue": ""
     },
     {
-      "name": "aria-label",
+      "name": "aria-labelledby",
       "type": "string",
-      "description": "When provided, a label is added to the action bar"
+      "required": false,
+      "description": "When provided, uses the element with that ID as the accessible name for the ActionBar",
+      "defaultValue": ""
     },
     {
       "name": "children",
-      "type": "React.ReactElement",
-      "required": true
+      "type": "ReactNode",
+      "required": false,
+      "description": "Buttons in the action bar",
+      "defaultValue": ""
+    },
+    {
+      "name": "size",
+      "type": "'small' | 'large' | 'medium'",
+      "required": false,
+      "description": "Size of the action bar",
+      "defaultValue": ""
     }
   ],
   "subcomponents": [
     {
-      "name": "ActionBar.Icon",
+      "name": "ActionBar.IconButton",
       "props": [
         {
           "name": "children",
@@ -38,19 +54,19 @@
           "name": "icon",
           "type": "Component",
           "defaultValue": "",
-          "description": "provide an octicon. It will be placed in the center of the button"
+          "description": "Provide an octicon. It will be placed in the center of the button"
         },
         {
           "name": "aria-label",
           "type": "string",
           "defaultValue": "",
           "description": "Use an aria label to describe the functionality of the button. Please refer to [our guidance on alt text](https://primer.style/guides/accessibility/alternative-text-for-images) for tips on writing good alternative text."
-        },
-        {
-          "name": "sx",
-          "type": "SystemStyleObject"
         }
-      ]
+      ],
+      "passthrough": {
+        "element": "IconButton",
+        "url": "/react/IconButton"
+      }
     },
     {
       "name": "ActionBar.Divider",

packages/react/src/ActionList/ActionList.docs.json

@@ -26,10 +26,10 @@
       "description": "Whether multiple items or a single item can be selected."
     },
     {
-      "name": "showDivider",
+      "name": "showDividers",
       "type": "boolean",
-      "defaultValue": "false",
-      "description": "Display a divider above each item in this list when it does not follow a header or divider."
+      "description": "Display a divider above each `Item` in this `List` when it does not follow a `Header` or `Divider`.",
+      "defaultValue": ""
     },
     {
       "name": "role",
@@ -51,7 +51,7 @@
           "type": "React.ReactNode | ActionList.LeadingVisual | ActionList.Description | ActionList.TrailingVisual",
           "defaultValue": "",
           "required": true,
-          "description": ""
+          "description": "Primary content for an Item"
         },
         {
           "name": "variant",
@@ -100,6 +100,13 @@
           "defaultValue": "",
           "description": "ARIA role describing the function of the item. `option` is a common value."
         },
+        {
+          "name": "id",
+          "type": "string",
+          "required": false,
+          "description": "id to attach to the root element of the Item",
+          "defaultValue": ""
+        },
         {
           "name": "sx",
           "type": "SystemStyleObject"
@@ -123,6 +130,13 @@
           "required": false,
           "description": "The level of the heading"
         },
+        {
+          "name": "visuallyHidden",
+          "type": "boolean",
+          "required": false,
+          "description": "",
+          "defaultValue": ""
+        },
         {
           "name": "sx",
           "type": "SystemStyleObject"
@@ -154,6 +168,13 @@
           "type": "React.ElementType",
           "defaultValue": "\"a\""
         },
+        {
+          "name": "inactiveText",
+          "type": "string",
+          "required": false,
+          "description": "Text describing why the item is inactive. This may be used when an item's usual functionality\nis unavailable due to a system error such as a database outage.",
+          "defaultValue": ""
+        },
         {
           "name": "sx",
           "type": "SystemStyleObject"
@@ -277,6 +298,20 @@
           "defaultValue": "'subtle'",
           "description": "`filled` style has a background color and top and bottom borders. Subtle style has no background or borders."
         },
+        {
+          "name": "auxiliaryText",
+          "type": "string",
+          "required": false,
+          "description": "Secondary text which provides additional information about a `Group`.",
+          "defaultValue": ""
+        },
+        {
+          "name": "visuallyHidden",
+          "type": "boolean",
+          "required": false,
+          "description": "",
+          "defaultValue": ""
+        },
         {
           "name": "as",
           "type": "h1 | h2 | h3 | h4 | h5 | h6",
@@ -336,6 +371,16 @@
           "type": "SystemStyleObject"
         }
       ]
+    },
+    {
+      "filePath": "/Users/mperrotti/work-dir/react/packages/react/src/ActionList/Divider.tsx",
+      "name": "ActionList.Divider",
+      "props": [
+        {
+          "name": "sx",
+          "type": "SystemStyleObject"
+        }
+      ]
     }
   ]
-}
+}

packages/react/src/ActionMenu/ActionMenu.docs.json

@@ -3,7 +3,29 @@
   "name": "ActionMenu",
   "status": "beta",
   "a11yReviewed": false,
-  "stories": [],
+  "stories": [
+    {
+      "id": "components-actionmenu--default"
+    },
+    {
+      "id": "components-actionmenu-features--links-and-actions"
+    },
+    {
+      "id": "components-actionmenu-features--single-select"
+    },
+    {
+      "id": "components-actionmenu-features--multi-select"
+    },
+    {
+      "id": "components-actionmenu-features--inactive-items"
+    },
+    {
+      "id": "components-actionmenu-features--loading-items"
+    },
+    {
+      "id": "components-actionmenu-features--submenus"
+    }
+  ],
   "importPath": "@primer/react",
   "props": [
     {
@@ -58,6 +80,12 @@
           "defaultValue": "",
           "required": true,
           "description": "Accepts a single child element"
+        },
+        {
+          "name": "id",
+          "type": "string",
+          "description": "",
+          "defaultValue": ""
         }
       ]
     },
@@ -82,6 +110,13 @@
           "type": "| 'inside-top' | 'inside-bottom' | 'inside-left' | 'inside-right' | 'inside-center' | 'outside-top' | 'outside-bottom' | 'outside-left' | 'outside-right'",
           "defaultValue": "'outside-bottom'",
           "description": "Controls which side of the anchor the menu will appear"
+        },
+        {
+          "name": "data-test-id",
+          "type": "unknown",
+          "required": false,
+          "description": "ID to use for React testing utilities.",
+          "defaultValue": ""
         }
       ],
       "passthrough": {

packages/react/src/AnchoredOverlay/AnchoredOverlay.docs.json

@@ -3,18 +3,56 @@
   "name": "AnchoredOverlay",
   "status": "alpha",
   "a11yReviewed": false,
-  "stories": [],
+  "stories": [
+    {
+      "id": "components-anchoredoverlay--default"
+    },
+    {
+      "id": "components-anchoredoverlay-features--portal-inside-scrolling-element"
+    },
+    {
+      "id": "components-anchoredoverlay-features--custom-anchor-id"
+    },
+    {
+      "id": "components-anchoredoverlay-features--height"
+    },
+    {
+      "id": "components-anchoredoverlay-features--width"
+    },
+    {
+      "id": "components-anchoredoverlay-features--anchor-alignment"
+    },
+    {
+      "id": "components-anchoredoverlay-features--anchor-side"
+    },
+    {
+      "id": "components-anchoredoverlay-features--offset-position-from-anchor"
+    },
+    {
+      "id": "components-anchoredoverlay-features--offset-alignment-from-anchor"
+    },
+    {
+      "id": "components-anchoredoverlay-features--focus-trap-overrides"
+    },
+    {
+      "id": "components-anchoredoverlay-features--focus-zone-overrides"
+    },
+    {
+      "id": "components-anchoredoverlay-features--overlay-props-overrides"
+    }
+  ],
   "importPath": "@primer/react",
   "props": [
     {
       "name": "open",
       "type": "boolean",
+      "required": true,
       "defaultValue": "false",
       "description": "Determines whether the overlay portion of the component should be shown or not."
     },
     {
       "name": "onOpen",
-      "type": "(gesture: 'anchor-click' | 'anchor-key-press') => unknown",
+      "type": "(gesture: 'anchor-click' | 'anchor-key-press', event?: KeyboardEvent<HTMLElement> | undefined) => unknown",
       "defaultValue": "",
       "description": "A callback that is called whenever the overlay is currently closed and an \"open gesture\" is detected."
     },
@@ -95,6 +133,20 @@
       "type": "boolean",
       "defaultValue": "true",
       "description": "Determines if the Overlay width should be adjusted responsively if there is not enough space to display the Overlay. If `preventOverflow` is set to `false`, the Overlay will be displayed at the maximum width that fits within the viewport."
+    },
+    {
+      "name": "height",
+      "type": "'small' | 'initial' | 'large' | 'medium' | 'auto' | 'fit-content' | 'xsmall' | 'xlarge'",
+      "required": false,
+      "description": "",
+      "defaultValue": ""
+    },
+    {
+      "name": "width",
+      "type": "'small' | 'large' | 'medium' | 'auto' | 'xlarge' | 'xxlarge'",
+      "required": false,
+      "description": "",
+      "defaultValue": ""
     }
   ]
 }

packages/react/src/Autocomplete/Autocomplete.docs.json

@@ -3,12 +3,52 @@
   "name": "Autocomplete",
   "status": "alpha",
   "a11yReviewed": false,
-  "stories": [],
+  "stories": [
+    {
+      "id": "components-autocomplete--default"
+    },
+    {
+      "id": "components-autocomplete-features--with-token-input"
+    },
+    {
+      "id": "components-autocomplete-features--add-new-item"
+    },
+    {
+      "id": "components-autocomplete-features--custom-search-filter-fn"
+    },
+    {
+      "id": "components-autocomplete-features--custom-sort-after-menu-close"
+    },
+    {
+      "id": "components-autocomplete-features--with-callback-when-overlay-open-state-changes"
+    },
+    {
+      "id": "components-autocomplete-features--async-loading-of-items"
+    },
+    {
+      "id": "components-autocomplete-features--rendering-the-menu-outside-an-overlay"
+    },
+    {
+      "id": "components-autocomplete-features--custom-overlay-menu-anchor"
+    },
+    {
+      "id": "components-autocomplete-features--in-overlay-with-custom-scroll-container-ref"
+    },
+    {
+      "id": "components-autocomplete-features--in-a-dialog"
+    }
+  ],
   "importPath": "@primer/react",
   "props": [
     {
       "name": "children",
       "type": "React.ReactNode"
+    },
+    {
+      "name": "id",
+      "type": "string",
+      "description": "May be used to customize how the ID is set on the text input to be used by ARIA attributes on related elements.",
+      "defaultValue": ""
     }
   ],
   "subcomponents": [
@@ -68,7 +108,7 @@
         {
           "name": "selectedItemIds",
           "required": true,
-          "type": "(string | number)[]",
+          "type": "string[]",
           "description": "The IDs of the selected items"
         },
         {