[docs-infra] Tweak buildReference script (#1062)

docs/reference/generated/menu-checkbox-item.json

@@ -30,7 +30,7 @@
       "description": "A text representation of the menu item's content.\nUsed for keyboard text navigation matching."
     },
     "onCheckedChange": {
-      "type": "function",
+      "type": "(checked, event) => void",
       "description": "Event handler called when the checkbox item is ticked or unticked."
     },
     "onClick": {

docs/reference/generated/menu-radio-item.json

@@ -2,11 +2,6 @@
   "name": "MenuRadioItem",
   "description": "A menu item that works like a radio button in a given group.\nRenders a `<div>` element.",
   "props": {
-    "value": {
-      "type": "any",
-      "required": true,
-      "description": "Value of the radio item.\nThis is the value that will be set in the MenuRadioGroup when the item is selected."
-    },
     "closeOnClick": {
       "type": "boolean",
       "default": "true",
@@ -28,6 +23,11 @@
     "onClick": {
       "type": "(event) => void",
       "description": "The click handler for the menu item."
+    },
+    "value": {
+      "type": "any",
+      "required": true,
+      "description": "Value of the radio item.\nThis is the value that will be set in the MenuRadioGroup when the item is selected."
     }
   },
   "dataAttributes": {

docs/reference/generated/radio-root.json

@@ -2,11 +2,6 @@
   "name": "RadioRoot",
   "description": "Represents the radio button itself.\nRenders a `<button>` element and a hidden `<input>` beside.",
   "props": {
-    "value": {
-      "type": "any",
-      "required": true,
-      "description": "The unique identifying value of the radio in a group."
-    },
     "className": {
       "type": "string | (state) => string",
       "description": "CSS class applied to the element, or a function that\nreturns a class based on the component’s state."
@@ -29,6 +24,11 @@
       "type": "boolean",
       "default": "false",
       "description": "Whether the user must choose a value before submitting a form."
+    },
+    "value": {
+      "type": "any",
+      "required": true,
+      "description": "The unique identifying value of the radio in a group."
     }
   }
 }

docs/reference/generated/select-root.json

@@ -27,11 +27,11 @@
       "description": "Identifies the field when a form is submitted."
     },
     "onOpenChange": {
-      "type": "function",
+      "type": "(open, event) => void",
       "description": "Event handler called when the select menu is opened or closed."
     },
     "onValueChange": {
-      "type": "function",
+      "type": "(value, event) => void",
       "description": "Callback fired when the value of the select changes. Use when controlled."
     },
     "open": {

docs/reference/generated/select-value.json

@@ -2,6 +2,10 @@
   "name": "SelectValue",
   "description": "A text label of the currently selected item.\nRenders a `<span>` element.",
   "props": {
+    "children": {
+      "type": "React.ReactNode | (value) => React.ReactNode",
+      "description": "Override children if you need to customize how the value is displayed.\nBy default, renders the current value as is.\n\nAccepts a `ReactNode` or a function that returns the node to render."
+    },
     "className": {
       "type": "string | (state) => string",
       "description": "CSS class applied to the element, or a function that\nreturns a class based on the component’s state."

docs/reference/generated/slider-value.json

@@ -2,6 +2,10 @@
   "name": "SliderValue",
   "description": "Displays the current value of the slider as text.\nRenders an `<output>` element.",
   "props": {
+    "children": {
+      "type": "React.ReactNode | (formattedValue, value) => React.ReactNode",
+      "description": "Override children if you need to customize how the value is displayed.\nBy default, renders the current value as is.\n\nAccepts a `ReactNode` or a function that returns the node to render."
+    },
     "className": {
       "type": "string | (state) => string",
       "description": "CSS class applied to the element, or a function that\nreturns a class based on the component’s state."

docs/reference/overrides/menu-checkbox-item.json

@@ -0,0 +1,8 @@
+{
+  "name": "MenuCheckboxItem",
+  "props": {
+    "onCheckedChange": {
+      "type": "(checked, event) => void"
+    }
+  }
+}

docs/reference/overrides/select-root.json

@@ -0,0 +1,11 @@
+{
+  "name": "SelectRoot",
+  "props": {
+    "onOpenChange": {
+      "type": "(open, event) => void"
+    },
+    "onValueChange": {
+      "type": "(value, event) => void"
+    }
+  }
+}

docs/reference/overrides/select-value.json

@@ -0,0 +1,9 @@
+{
+  "name": "SelectValue",
+  "props": {
+    "children": {
+      "type": "React.ReactNode | (value) => React.ReactNode",
+      "description": "Override children if you need to customize how the value is displayed.\nBy default, renders the current value as is.\n\nAccepts a `ReactNode` or a function that returns the node to render."
+    }
+  }
+}

docs/reference/overrides/slider-value.json

@@ -0,0 +1,9 @@
+{
+  "name": "SliderValue",
+  "props": {
+    "children": {
+      "type": "React.ReactNode | (formattedValue, value) => React.ReactNode",
+      "description": "Override children if you need to customize how the value is displayed.\nBy default, renders the current value as is.\n\nAccepts a `ReactNode` or a function that returns the node to render."
+    }
+  }
+}

scripts/buildApiDocs/buildReference.ts

@@ -70,7 +70,7 @@ export async function buildReference() {
     const descriptionData: PropsTranslations = JSON.parse(descriptionJsonContents);
 
     for (const prop in props) {
-      props[prop].description = descriptionData.propDescriptions[prop]?.description;
+      props[prop].description ??= descriptionData.propDescriptions[prop]?.description;
 
       if (!descriptionData.propDescriptions[prop]?.description) {
         console.warn(`Missing prop description: ${componentData.name} / ${prop}`);
@@ -93,7 +93,8 @@ export async function buildReference() {
     const json: ComponentDef = {
       name: componentData.name,
       description: descriptionData.componentDescription,
-      props,
+      // manually sort since overrides may interrupt alphabetical order
+      props: Object.fromEntries(Object.entries(props).sort()),
       dataAttributes,
       cssVariables,
     };