@czi-sds/mcp 0.16.0 → 0.18.0

package/data/component-props/MenuItem.json

@@ -2,41 +2,60 @@
   "MenuItem": {
     "props": {
       "column": {
-        "type": "ReactNode",
-        "isRequired": false
+        "description": "The column prop determines the content displayed in the right column of the menu item. This content can be customized to provide additional information or context for the menu item.",
+        "isRequired": false,
+        "type": "ReactNode"
       },
       "disabled": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false,
+        "defaultValue": false,
         "description": "If `true`, the component is disabled.",
-        "defaultValue": false
+        "isRequired": false,
+        "type": "boolean"
       },
       "icon": {
-        "type": "any",
-        "isRequired": false
+        "description": "The icon shown at the start of the item, either the name of an SDS icon or an element of your own. Only icons that come in a small size can be named here.",
+        "isRequired": false,
+        "type": "IconName | ReactElement"
       },
       "isMultiSelect": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false
+        "defaultValue": false,
+        "description": "When true, designates that the menu item supports multi-select functionality.",
+        "isRequired": false,
+        "type": "boolean"
       },
       "sdsIconProps": {
-        "type": "IconProps<IconName>",
-        "isRequired": false
+        "description": "Enables you to pass additional props to customize the SDS icon within the menu item.",
+        "isRequired": false,
+        "type": "function"
       },
       "sdsStyle": {
-        "type": "\"determinate\" | \"indeterminate\"",
-        "isRequired": false
+        "defaultValue": "determinate",
+        "description": "Determines the style of the menu item, whether it is determinate or indeterminate.",
+        "isRequired": false,
+        "type": "\"indeterminate\" | \"determinate\""
       },
       "sdsType": {
-        "type": "\"action\" | \"default\"",
-        "isRequired": false
+        "defaultValue": "default",
+        "description": "An \"action\" item leaves out the selection mark at its start, for a menu whose items run a command rather than choose a value.",
+        "isRequired": false,
+        "type": "\"action\" | \"default\""
       },
       "selected": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false,
+        "defaultValue": false,
         "description": "If `true`, the component is selected.",
-        "defaultValue": false
+        "isRequired": false,
+        "type": "boolean"
+      },
+      "children": {
+        "description": "The content of the component.",
+        "isRequired": false,
+        "type": "ReactNode"
+      },
+      "sdsIcon": {
+        "description": "@deprecated Use `icon` instead.\n(masoudmanson): This prop is deprecated and will be removed in the next major version.\nPlease replace instances of `sdsIcon` with `icon`.",
+        "isRequired": false,
+        "type": "IconName | ReactElement"
       }
     }
   }
-}
+}

package/data/component-props/MenuSelect.json

@@ -2,19 +2,19 @@
   "MenuSelect": {
     "props": {
       "keepSearchOnSelect": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false
+        "isRequired": false,
+        "type": "boolean"
       },
       "multiple": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false,
+        "defaultValue": false,
         "description": "If `true`, `value` must be an array and the menu will support multiple selections.",
-        "defaultValue": false
+        "isRequired": false,
+        "type": "boolean"
       },
       "search": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false
+        "isRequired": false,
+        "type": "boolean"
       }
     }
   }
-}
+}

package/data/component-props/NavigationFooter.json

@@ -2,42 +2,72 @@
   "NavigationFooter": {
     "props": {
       "backgroundAppearance": {
-        "type": "\"matchBackground\" | \"dark\"",
+        "defaultValue": "matchBackground",
+        "description": "\"dark\" puts the footer on a dark surface and inverts its text and dividers, in light mode only.",
         "isRequired": false,
-        "defaultValue": "matchBackground"
+        "type": "\"matchBackground\" | \"dark\""
       },
       "images": {
-        "type": "FooterImage[]",
-        "isRequired": false
+        "description": "An array of images displayed in the footer. Each item includes an image, optional link URL, and component.",
+        "isRequired": false,
+        "type": "FooterImage[]"
       },
       "logo": {
-        "type": "ReactNode",
-        "isRequired": false
+        "description": "The logo displayed in the footer. Can be any valid React node such as an image, icon, or SVG.",
+        "isRequired": false,
+        "type": "ReactNode"
       },
       "logoUrl": {
-        "type": "string",
-        "isRequired": false
+        "description": "If provided, clicking the logo will navigate to this URL.",
+        "isRequired": false,
+        "type": "string"
       },
       "navItems": {
-        "type": "NavigationFooterNavItem[]",
-        "isRequired": false
+        "description": "The prominent links on the top row, next to the logo. They are headings, not body text, and get no dividers.",
+        "isRequired": false,
+        "type": "NavigationFooterNavItem[]"
       },
       "navLinks": {
-        "type": "NavigationFooterNavItem[]",
-        "isRequired": false
+        "description": "The smaller links on the bottom row, drawn in one line with dividers between them.",
+        "isRequired": false,
+        "type": "NavigationFooterNavItem[]"
       },
       "tag": {
-        "type": "string",
-        "isRequired": false
+        "description": "A small label displayed next to the title.",
+        "isRequired": false,
+        "type": "string"
       },
       "tagColor": {
-        "type": "\"info\" | \"positive\" | \"notice\" | \"negative\" | \"neutral\" | \"beta\" | \"[string, string]\" | \"[string, string, string]\"",
-        "isRequired": false
+        "description": "The Tag's color. A tuple sets the label, background, and icon colors by hand.",
+        "isRequired": false,
+        "type": "\"info\" | \"negative\" | \"notice\" | \"positive\" | \"neutral\" | \"beta\" | [string, string] | [string, string, string]"
       },
       "title": {
-        "type": "string",
-        "isRequired": false
+        "description": "The main title displayed in the footer.",
+        "isRequired": false,
+        "type": "string"
+      },
+      "logoComponent": {
+        "defaultValue": "a",
+        "description": "Specifies the component to use for the logo link. Defaults to an anchor tag.",
+        "isRequired": false,
+        "type": "\"symbol\" | \"object\" | \"style\" | \"button\" | \"div\" | \"a\" | \"abbr\" | \"address\" | \"area\" | \"article\" | \"aside\" | \"audio\" | \"b\" | \"base\" | \"bdi\" | \"bdo\" | \"big\" | \"blockquote\" | \"body\" | \"br\" | \"canvas\" | \"caption\" | \"center\" | \"cite\" | \"code\" | \"col\" | \"colgroup\" | \"data\" | \"datalist\" | \"dd\" | \"del\" | \"details\" | \"dfn\" | \"dialog\" | \"dl\" | \"dt\" | \"em\" | \"embed\" | \"fieldset\" | \"figcaption\" | \"figure\" | \"footer\" | \"form\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"head\" | \"header\" | \"hgroup\" | \"hr\" | \"html\" | \"i\" | \"iframe\" | \"img\" | \"input\" | \"ins\" | \"kbd\" | \"keygen\" | \"label\" | \"legend\" | \"li\" | \"link\" | \"main\" | \"map\" | \"mark\" | \"menu\" | \"menuitem\" | \"meta\" | \"meter\" | \"nav\" | \"noindex\" | \"noscript\" | \"ol\" | \"optgroup\" | \"option\" | \"output\" | \"p\" | \"param\" | \"picture\" | \"pre\" | \"progress\" | \"q\" | \"rp\" | \"rt\" | \"ruby\" | \"s\" | \"samp\" | \"search\" | \"slot\" | \"script\" | \"section\" | \"select\" | \"small\" | \"source\" | \"span\" | \"strong\" | \"sub\" | \"summary\" | \"sup\" | \"table\" | \"template\" | \"tbody\" | \"td\" | \"textarea\" | \"tfoot\" | \"th\" | \"thead\" | \"time\" | \"title\" | \"tr\" | \"track\" | \"u\" | \"ul\" | \"var\" | \"video\" | \"wbr\" | \"webview\" | \"svg\" | \"animate\" | \"animateMotion\" | \"animateTransform\" | \"circle\" | \"clipPath\" | \"defs\" | \"desc\" | \"ellipse\" | \"feBlend\" | \"feColorMatrix\" | \"feComponentTransfer\" | \"feComposite\" | \"feConvolveMatrix\" | \"feDiffuseLighting\" | \"feDisplacementMap\" | \"feDistantLight\" | \"feDropShadow\" | \"feFlood\" | \"feFuncA\" | \"feFuncB\" | \"feFuncG\" | \"feFuncR\" | \"feGaussianBlur\" | \"feImage\" | \"feMerge\" | \"feMergeNode\" | \"feMorphology\" | \"feOffset\" | \"fePointLight\" | \"feSpecularLighting\" | \"feSpotLight\" | \"feTile\" | \"feTurbulence\" | \"filter\" | \"foreignObject\" | \"g\" | \"image\" | \"line\" | \"linearGradient\" | \"marker\" | \"mask\" | \"metadata\" | \"mpath\" | \"path\" | \"pattern\" | \"polygon\" | \"polyline\" | \"radialGradient\" | \"rect\" | \"set\" | \"stop\" | \"switch\" | \"text\" | \"textPath\" | \"tspan\" | \"use\" | \"view\" | ComponentClass<any, any> | FunctionComponent<any>"
+      },
+      "logoLinkProps": {
+        "description": "Additional props passed to the logo link component.",
+        "isRequired": false,
+        "type": "Record<string, unknown>"
+      },
+      "image": {
+        "description": "The image element to be displayed. Can be an icon, image, SVG, or any ReactNode.",
+        "isRequired": false,
+        "type": "ReactNode"
+      },
+      "label": {
+        "description": "The text label displayed for the navigation item.",
+        "isRequired": false,
+        "type": "string"
       }
     }
   }
-}
+}

package/data/component-props/NavigationHeader.json

@@ -2,77 +2,190 @@
   "NavigationHeader": {
     "props": {
       "buttons": {
-        "type": "ReactNode",
-        "isRequired": false
+        "description": "Actions at the right end of the bar. Prop objects render as SDS Buttons; elements are cloned with the header's appearance applied. An icon-only button gets an aria-label from its child, and in the narrow layout every button goes full width and closes the drawer when clicked.",
+        "isRequired": false,
+        "type": "ReactNode"
       },
       "menuProps": {
-        "type": "Partial<MenuProps>",
-        "isRequired": false
+        "defaultValue": "{ disableScrollLock: true, disablePortal: true }",
+        "description": "Props for the dropdown menus. Passing this replaces the default object rather than merging with it.",
+        "isRequired": false,
+        "type": "Partial<MenuProps>"
       },
       "backgroundAppearance": {
-        "type": "\"matchBackground\" | \"dark\"",
-        "isRequired": false
+        "defaultValue": "matchBackground",
+        "description": "\"dark\" puts the header on a dark surface and inverts its contents. It only changes anything in light mode.",
+        "isRequired": false,
+        "type": "\"matchBackground\" | \"dark\""
       },
       "logo": {
-        "type": "ReactNode",
-        "isRequired": false
+        "description": "The logo displayed in the header. Can be an image, icon, svg or any ReactNode.",
+        "isRequired": false,
+        "type": "ReactNode"
       },
       "logoLinkComponent": {
-        "type": "\"symbol\" | \"object\" | \"style\" | \"div\" | \"clipPath\" | \"filter\" | \"marker\" | \"mask\" | \"p\" | \"header\" | \"a\" | \"abbr\" | \"address\" | \"area\" | \"article\" | \"aside\" | \"audio\" | \"b\" | \"base\" | \"bdi\" | \"bdo\" | \"big\" | \"blockquote\" | \"body\" | \"br\" | \"button\" | \"canvas\" | \"caption\" | \"center\" | \"cite\" | \"code\" | \"col\" | \"colgroup\" | \"data\" | \"datalist\" | \"dd\" | \"del\" | \"details\" | \"dfn\" | \"dialog\" | \"dl\" | \"dt\" | \"em\" | \"embed\" | \"fieldset\" | \"figcaption\" | \"figure\" | \"footer\" | \"form\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"head\" | \"hgroup\" | \"hr\" | \"html\" | \"i\" | \"iframe\" | \"img\" | \"input\" | \"ins\" | \"kbd\" | \"keygen\" | \"label\" | \"legend\" | \"li\" | \"link\" | \"main\" | \"map\" | \"mark\" | \"menu\" | \"menuitem\" | \"meta\" | \"meter\" | \"nav\" | \"noindex\" | \"noscript\" | \"ol\" | \"optgroup\" | \"option\" | \"output\" | \"param\" | \"picture\" | \"pre\" | \"progress\" | \"q\" | \"rp\" | \"rt\" | \"ruby\" | \"s\" | \"samp\" | \"search\" | \"slot\" | \"script\" | \"section\" | \"select\" | \"small\" | \"source\" | \"span\" | \"strong\" | \"sub\" | \"summary\" | \"sup\" | \"table\" | \"template\" | \"tbody\" | \"td\" | \"textarea\" | \"tfoot\" | \"th\" | \"thead\" | \"time\" | \"title\" | \"tr\" | \"track\" | \"u\" | \"ul\" | \"var\" | \"video\" | \"wbr\" | \"webview\" | \"svg\" | \"animate\" | \"animateMotion\" | \"animateTransform\" | \"circle\" | \"defs\" | \"desc\" | \"ellipse\" | \"feBlend\" | \"feColorMatrix\" | \"feComponentTransfer\" | \"feComposite\" | \"feConvolveMatrix\" | \"feDiffuseLighting\" | \"feDisplacementMap\" | \"feDistantLight\" | \"feDropShadow\" | \"feFlood\" | \"feFuncA\" | \"feFuncB\" | \"feFuncG\" | \"feFuncR\" | \"feGaussianBlur\" | \"feImage\" | \"feMerge\" | \"feMergeNode\" | \"feMorphology\" | \"feOffset\" | \"fePointLight\" | \"feSpecularLighting\" | \"feSpotLight\" | \"feTile\" | \"feTurbulence\" | \"foreignObject\" | \"g\" | \"image\" | \"line\" | \"linearGradient\" | \"metadata\" | \"mpath\" | \"path\" | \"pattern\" | \"polygon\" | \"polyline\" | \"radialGradient\" | \"rect\" | \"set\" | \"stop\" | \"switch\" | \"text\" | \"textPath\" | \"tspan\" | \"use\" | \"view\" | \"ComponentClass",
-        "isRequired": false
+        "defaultValue": "a",
+        "description": "Specifies the component to use for the logo link.",
+        "isRequired": false,
+        "type": "\"symbol\" | \"object\" | \"style\" | \"button\" | \"div\" | \"a\" | \"abbr\" | \"address\" | \"area\" | \"article\" | \"aside\" | \"audio\" | \"b\" | \"base\" | \"bdi\" | \"bdo\" | \"big\" | \"blockquote\" | \"body\" | \"br\" | \"canvas\" | \"caption\" | \"center\" | \"cite\" | \"code\" | \"col\" | \"colgroup\" | \"data\" | \"datalist\" | \"dd\" | \"del\" | \"details\" | \"dfn\" | \"dialog\" | \"dl\" | \"dt\" | \"em\" | \"embed\" | \"fieldset\" | \"figcaption\" | \"figure\" | \"footer\" | \"form\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"head\" | \"header\" | \"hgroup\" | \"hr\" | \"html\" | \"i\" | \"iframe\" | \"img\" | \"input\" | \"ins\" | \"kbd\" | \"keygen\" | \"label\" | \"legend\" | \"li\" | \"link\" | \"main\" | \"map\" | \"mark\" | \"menu\" | \"menuitem\" | \"meta\" | \"meter\" | \"nav\" | \"noindex\" | \"noscript\" | \"ol\" | \"optgroup\" | \"option\" | \"output\" | \"p\" | \"param\" | \"picture\" | \"pre\" | \"progress\" | \"q\" | \"rp\" | \"rt\" | \"ruby\" | \"s\" | \"samp\" | \"search\" | \"slot\" | \"script\" | \"section\" | \"select\" | \"small\" | \"source\" | \"span\" | \"strong\" | \"sub\" | \"summary\" | \"sup\" | \"table\" | \"template\" | \"tbody\" | \"td\" | \"textarea\" | \"tfoot\" | \"th\" | \"thead\" | \"time\" | \"title\" | \"tr\" | \"track\" | \"u\" | \"ul\" | \"var\" | \"video\" | \"wbr\" | \"webview\" | \"svg\" | \"animate\" | \"animateMotion\" | \"animateTransform\" | \"circle\" | \"clipPath\" | \"defs\" | \"desc\" | \"ellipse\" | \"feBlend\" | \"feColorMatrix\" | \"feComponentTransfer\" | \"feComposite\" | \"feConvolveMatrix\" | \"feDiffuseLighting\" | \"feDisplacementMap\" | \"feDistantLight\" | \"feDropShadow\" | \"feFlood\" | \"feFuncA\" | \"feFuncB\" | \"feFuncG\" | \"feFuncR\" | \"feGaussianBlur\" | \"feImage\" | \"feMerge\" | \"feMergeNode\" | \"feMorphology\" | \"feOffset\" | \"fePointLight\" | \"feSpecularLighting\" | \"feSpotLight\" | \"feTile\" | \"feTurbulence\" | \"filter\" | \"foreignObject\" | \"g\" | \"image\" | \"line\" | \"linearGradient\" | \"marker\" | \"mask\" | \"metadata\" | \"mpath\" | \"path\" | \"pattern\" | \"polygon\" | \"polyline\" | \"radialGradient\" | \"rect\" | \"set\" | \"stop\" | \"switch\" | \"text\" | \"textPath\" | \"tspan\" | \"use\" | \"view\" | ComponentClass<any, any> | FunctionComponent<any>"
       },
       "logoUrl": {
-        "type": "string",
-        "isRequired": false
+        "description": "URL for the logo link. If provided, clicking the logo navigates to this URL.",
+        "isRequired": false,
+        "type": "string"
       },
       "isSticky": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false
+        "defaultValue": true,
+        "description": "Whether the header sticks to the top on scroll. Ignored when sdsStyle is \"drawer\", which is always sticky, and best left alone alongside topComponentSlot.",
+        "isRequired": false,
+        "type": "boolean"
       },
       "topComponentSlot": {
-        "type": "ReactNode",
-        "isRequired": false
+        "description": "Content rendered above the header, such as a Banner. The header measures it and offsets its own sticky top to match.",
+        "isRequired": false,
+        "type": "ReactNode"
       },
       "primaryNavItems": {
-        "type": "NavigationHeaderPrimaryNavItem<string>[]",
-        "isRequired": false
+        "description": "List of items for the primary navigation section.",
+        "isRequired": false,
+        "type": "NavigationHeaderPrimaryNavItem<string>[]"
       },
       "primaryNavPosition": {
-        "type": "\"left\" | \"right\"",
-        "isRequired": false
+        "defaultValue": "left",
+        "description": "Position of the primaryNavItems list. If set to \"left\", the items appear to the left of the search bar. If set to \"right\", they are positioned next to the secondaryNavItems on the right.",
+        "isRequired": false,
+        "type": "\"left\" | \"right\""
       },
       "sdsStyle": {
-        "type": "\"dropdown\" | \"drawer\"",
-        "isRequired": false
+        "defaultValue": "dropdown",
+        "description": "How dropdown nav items open, and which parts of their data are used. See the comparison above.",
+        "isRequired": false,
+        "type": "\"dropdown\" | \"drawer\""
       },
       "scrollElevation": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false
+        "defaultValue": true,
+        "description": "Controls whether a shadow is shown under the Nav when scrolling.",
+        "isRequired": false,
+        "type": "boolean"
       },
       "searchProps": {
-        "type": "\"Partial<FilledTextFieldProps & AccessibleInputSearchProps & InputSearchExtraProps>\" | \"Partial<OutlinedTextFieldProps & AccessibleInputSearchProps & InputSearchExtraProps>\" | \"Partial<StandardTextFieldProps & AccessibleInputSearchProps & InputSearchExtraProps>\"",
-        "isRequired": false
+        "description": "Props passed to the search input component.",
+        "isRequired": false,
+        "type": "Partial<OutlinedTextFieldProps & AccessibleInputSearchProps & InputSearchExtraProps> | Partial<StandardTextFieldProps & AccessibleInputSearchProps & InputSearchExtraProps> | Partial<FilledTextFieldProps & AccessibleInputSearchProps & InputSearchExtraProps>"
       },
       "secondaryNavItems": {
-        "type": "NavigationHeaderSecondaryNavItem<string>[]",
-        "isRequired": false
+        "description": "List of items for the secondary navigation section.",
+        "isRequired": false,
+        "type": "NavigationHeaderSecondaryNavItem<string>[]"
       },
       "showSearch": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false
+        "defaultValue": true,
+        "description": "Whether to display the search input in the header.",
+        "isRequired": false,
+        "type": "boolean"
       },
       "tag": {
-        "type": "string",
-        "isRequired": false
+        "description": "A small label displayed next to the title.",
+        "isRequired": false,
+        "type": "string"
       },
       "tagColor": {
-        "type": "\"info\" | \"positive\" | \"notice\" | \"negative\" | \"neutral\" | \"beta\" | \"[string, string]\" | \"[string, string, string]\"",
-        "isRequired": false
+        "defaultValue": "neutral",
+        "description": "The color of the tag label.",
+        "isRequired": false,
+        "type": "\"info\" | \"negative\" | \"notice\" | \"positive\" | \"neutral\" | \"beta\" | [string, string] | [string, string, string]"
       },
       "title": {
-        "type": "string",
-        "isRequired": false
+        "description": "The main title displayed in the header.",
+        "isRequired": false,
+        "type": "string"
+      },
+      "activePrimaryNavKey": {
+        "description": "The key of the active primary item. Optional, since the header tracks this itself; when given, it overrides the internal value.",
+        "isRequired": false,
+        "type": "string"
+      },
+      "setActivePrimaryNavKey": {
+        "description": "Called when a primary item becomes active. The header updates its internal key as well, so this is a notification rather than the only way the value changes.",
+        "isRequired": false,
+        "type": "(key: string) => void"
+      },
+      "drawerOpen": {
+        "description": "Controls the narrow layout's drawer. Leave both this and setDrawerOpen out to let the hamburger manage it.",
+        "isRequired": false,
+        "type": "boolean"
+      },
+      "setDrawerOpen": {
+        "description": "Replaces the drawer's internal state update, so it has to be paired with drawerOpen or the drawer stops opening.",
+        "isRequired": false,
+        "type": "(open: boolean) => void"
+      },
+      "onDrawerStyleNavItemHover": {
+        "description": "(item: NavigationHeaderPrimaryNavItem<T> | NavigationHeaderSecondaryNavItem) => void. Called with the hovered primary or secondary item while sdsStyle is \"drawer\". Useful for prefetching what the panel will show.",
+        "isRequired": false,
+        "type": "(item: NavigationHeaderPrimaryNavItem<string> | NavigationHeaderSecondaryNavItem<string>) => void"
+      },
+      "logoLinkProps": {
+        "description": "Props to pass to the logo link component.",
+        "isRequired": false,
+        "type": "LinkProps"
+      },
+      "label": {
+        "description": "The row's text.",
+        "isRequired": false,
+        "type": "ReactNode"
+      },
+      "details": {
+        "description": "A caption under the label, drawn only when sdsStyle is \"drawer\". In dropdown style it lands on the element as an attribute and shows nothing.",
+        "isRequired": false,
+        "type": "string"
+      },
+      "icon": {
+        "description": "An icon for the row, drawn only when sdsStyle is \"drawer\". A named icon renders at 24px when the row has details and 16px when it does not, so the name has to offer that size.",
+        "isRequired": false,
+        "type": "keyof IconNameToSizes | ReactElement"
+      },
+      "section": {
+        "description": "Groups rows under a heading. Rows are grouped by this value in the order the sections first appear.",
+        "isRequired": false,
+        "type": "string"
+      },
+      "onClick": {
+        "description": "Runs on click, then the menu closes.",
+        "isRequired": false,
+        "type": "function"
+      },
+      "href": {
+        "description": "Turns the row into a link to this URL.",
+        "isRequired": false,
+        "type": "string"
+      },
+      "component": {
+        "description": "What the link renders as, for routing through something other than an anchor.",
+        "isRequired": false,
+        "type": "\"symbol\" | \"object\" | \"style\" | \"button\" | \"div\" | \"a\" | \"abbr\" | \"address\" | \"area\" | \"article\" | \"aside\" | \"audio\" | \"b\" | \"base\" | \"bdi\" | \"bdo\" | \"big\" | \"blockquote\" | \"body\" | \"br\" | \"canvas\" | \"caption\" | \"center\" | \"cite\" | \"code\" | \"col\" | \"colgroup\" | \"data\" | \"datalist\" | \"dd\" | \"del\" | \"details\" | \"dfn\" | \"dialog\" | \"dl\" | \"dt\" | \"em\" | \"embed\" | \"fieldset\" | \"figcaption\" | \"figure\" | \"footer\" | \"form\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"head\" | \"header\" | \"hgroup\" | \"hr\" | \"html\" | \"i\" | \"iframe\" | \"img\" | \"input\" | \"ins\" | \"kbd\" | \"keygen\" | \"label\" | \"legend\" | \"li\" | \"link\" | \"main\" | \"map\" | \"mark\" | \"menu\" | \"menuitem\" | \"meta\" | \"meter\" | \"nav\" | \"noindex\" | \"noscript\" | \"ol\" | \"optgroup\" | \"option\" | \"output\" | \"p\" | \"param\" | \"picture\" | \"pre\" | \"progress\" | \"q\" | \"rp\" | \"rt\" | \"ruby\" | \"s\" | \"samp\" | \"search\" | \"slot\" | \"script\" | \"section\" | \"select\" | \"small\" | \"source\" | \"span\" | \"strong\" | \"sub\" | \"summary\" | \"sup\" | \"table\" | \"template\" | \"tbody\" | \"td\" | \"textarea\" | \"tfoot\" | \"th\" | \"thead\" | \"time\" | \"title\" | \"tr\" | \"track\" | \"u\" | \"ul\" | \"var\" | \"video\" | \"wbr\" | \"webview\" | \"svg\" | \"animate\" | \"animateMotion\" | \"animateTransform\" | \"circle\" | \"clipPath\" | \"defs\" | \"desc\" | \"ellipse\" | \"feBlend\" | \"feColorMatrix\" | \"feComponentTransfer\" | \"feComposite\" | \"feConvolveMatrix\" | \"feDiffuseLighting\" | \"feDisplacementMap\" | \"feDistantLight\" | \"feDropShadow\" | \"feFlood\" | \"feFuncA\" | \"feFuncB\" | \"feFuncG\" | \"feFuncR\" | \"feGaussianBlur\" | \"feImage\" | \"feMerge\" | \"feMergeNode\" | \"feMorphology\" | \"feOffset\" | \"fePointLight\" | \"feSpecularLighting\" | \"feSpotLight\" | \"feTile\" | \"feTurbulence\" | \"filter\" | \"foreignObject\" | \"g\" | \"image\" | \"line\" | \"linearGradient\" | \"marker\" | \"mask\" | \"metadata\" | \"mpath\" | \"path\" | \"pattern\" | \"polygon\" | \"polyline\" | \"radialGradient\" | \"rect\" | \"set\" | \"stop\" | \"switch\" | \"text\" | \"textPath\" | \"tspan\" | \"use\" | \"view\" | ComponentClass<any, any> | FunctionComponent<any>"
+      },
+      "target": {
+        "description": "Where the link opens, for example \"_blank\".",
+        "isRequired": false,
+        "type": "string"
+      },
+      "rel": {
+        "description": "The link's relationship to the target, for example \"noreferrer\".",
+        "isRequired": false,
+        "type": "string"
+      },
+      "actions": {
+        "description": "Links rendered under the section, for example a \"Browse all\". Each takes label plus href, onClick, component, target, and rel.",
+        "isRequired": false,
+        "type": "ActionItem[]"
+      },
+      "colSpan": {
+        "defaultValue": 1,
+        "description": "How many columns of the panel this section occupies.",
+        "isRequired": false,
+        "type": "number"
       }
     }
   }
-}
+}

package/data/component-props/NavigationJumpTo.json

@@ -2,17 +2,43 @@
   "NavigationJumpTo": {
     "props": {
       "items": {
-        "type": "Item[]",
-        "isRequired": true
+        "defaultValue": "- (required)",
+        "description": "The sections to list. See the shape below.",
+        "isRequired": true,
+        "type": "Item[]"
       },
       "offsetTop": {
-        "type": "number",
-        "isRequired": false
+        "defaultValue": 0,
+        "description": "How many pixels above a section the highlight should switch to it, which is what you want when a sticky header covers the top of the page. Any non-zero value also switches clicks to window scrolling by element id.",
+        "isRequired": false,
+        "type": "number"
       },
       "width": {
-        "type": "\"string\" | \"number\" | \"string & {}\"",
-        "isRequired": false
+        "defaultValue": "100%",
+        "description": "The width of the strip and of every item in it. Long titles wrap rather than truncate.",
+        "isRequired": false,
+        "type": "string | number | string & {}"
+      },
+      "onChange": {
+        "description": "(value: number, event?: React.SyntheticEvent, type?: \"click\" | \"scroll\") => void. Called when the highlighted item changes, with its index and what caused the change. For a scroll the event is synthesized, not a real DOM event.",
+        "isRequired": false,
+        "type": "(value: number, event?: SyntheticEvent<Element, Event> | undefined, type?: \"scroll\" | \"click\" | undefined) => void"
+      },
+      "title": {
+        "description": "The item's label. It is also kebab-cased into the tab's id, so keep titles distinct.",
+        "isRequired": false,
+        "type": "string"
+      },
+      "elementRef": {
+        "description": "A ref on the section this item points at. The component observes and scrolls whatever the ref holds.",
+        "isRequired": false,
+        "type": "MutableRefObject<HTMLElement | null>"
+      },
+      "subItems": {
+        "description": "Indented children, one level only. Sub-items cannot nest sub-items of their own.",
+        "isRequired": false,
+        "type": "{ title, elementRef }[]"
       }
     }
   }
-}
+}

package/data/component-props/Notification.json

@@ -2,44 +2,62 @@
   "Notification": {
     "props": {
       "autoDismiss": {
-        "type": "\"number\" | \"false\" | \"true\"",
-        "isRequired": false
+        "description": "Dismisses the Notification on a timer. A number sets the delay in milliseconds, and true uses 8000. Leave it unset to keep the Notification visible until it is dismissed another way.",
+        "isRequired": false,
+        "type": "number | false | true"
       },
       "buttonOnClick": {
-        "type": "(event: SyntheticEvent<Element, Event>) => void",
-        "isRequired": false
+        "description": "Callback fired when the action button is clicked. Passing it is what renders the button, and the Notification does nothing else in response, so dismissing it is up to this handler.",
+        "isRequired": false,
+        "type": "(event: SyntheticEvent<Element, Event>) => void"
       },
       "buttonPosition": {
-        "type": "\"left\" | \"right\"",
-        "isRequired": false
-      },
-      "extraContent": {
-        "type": "\"false\" | \"true\"",
-        "isRequired": false
+        "defaultValue": "right",
+        "description": "Which side of the Notification the action button sits on.",
+        "isRequired": false,
+        "type": "\"left\" | \"right\""
       },
       "icon": {
-        "type": "ReactNode",
+        "description": "Override the icon displayed before the children.\nUnless provided, the icon is mapped to the value of the `severity` prop.\nSet to `false` to remove the `icon`.",
         "isRequired": false,
-        "description": "Override the icon displayed before the children.\nUnless provided, the icon is mapped to the value of the `severity` prop.\nSet to `false` to remove the `icon`."
+        "type": "ReactNode"
       },
       "intent": {
-        "type": "\"accent\" | \"info\" | \"negative\" | \"positive\" | \"notice\"",
-        "isRequired": true
+        "description": "Required. Sets both the color of the component and the icon it defaults to.",
+        "isRequired": true,
+        "type": "\"info\" | \"accent\" | \"negative\" | \"notice\" | \"positive\""
       },
       "onClose": {
-        "type": "(event: SyntheticEvent<Element, Event>) => void",
+        "description": "Callback fired when the component requests to be closed.\nWhen provided and no `action` prop is set, a close icon button is displayed that triggers the callback when clicked.\n@param event The event source of the callback.",
         "isRequired": false,
-        "description": "Callback fired when the component requests to be closed.\nWhen provided and no `action` prop is set, a close icon button is displayed that triggers the callback when clicked.\n@param event The event source of the callback."
+        "type": "(event: SyntheticEvent<Element, Event>) => void"
       },
       "sdsIconProps": {
-        "type": "IconProps<string | number | symbol>",
-        "isRequired": false
+        "description": "Props forwarded to the Icon component when icon is given as a name.",
+        "isRequired": false,
+        "type": "Partial<IconProps>"
       },
       "slideDirection": {
-        "type": "\"left\" | \"right\"",
+        "defaultValue": "left",
+        "description": "Required. The side the Notification slides in from and back out towards. The component falls back to \"left\", but the prop is not optional, so pass it explicitly.",
+        "isRequired": false,
+        "type": "\"left\" | \"right\""
+      },
+      "children": {
+        "description": "The content of the component.",
+        "isRequired": false,
+        "type": "ReactNode"
+      },
+      "dismissed": {
+        "description": "Hides the Notification when set to true. Changing it back to false brings the Notification back, which is how a dismissed Notification is restored.",
+        "isRequired": false,
+        "type": "boolean"
+      },
+      "buttonText": {
+        "description": "The label of the action button shown beneath the content. It only renders alongside buttonOnClick.",
         "isRequired": false,
-        "defaultValue": "left"
+        "type": "string"
       }
     }
   }
-}
+}