[ { "tags": {}, "description": "", "methods": [], "displayName": "CollapsedSideNavItem", "props": { "CollapsedSideNavItemProps": { "children": { "name": "children", "defaultValue": null, "description": "React Node rendered when the navigation is collapsed.", "required": true, "type": { "name": "enum", "raw": "ReactNode", "value": [ { "value": "string" }, { "value": "number" }, { "value": "false" }, { "value": "true" }, { "value": "ReactElement>", "description": "", "fullComment": "", "tags": {} }, { "value": "Iterable", "description": "", "fullComment": "", "tags": {} }, { "value": "ReactPortal", "description": "", "fullComment": "", "tags": {} } ] }, "tags": {} }, "active": { "name": "active", "defaultValue": { "value": false }, "description": "Displays the collapsed item with an active state.", "required": false, "type": { "name": "enum", "raw": "boolean", "value": [ { "value": "false" }, { "value": "true" } ] }, "tags": {} }, "className": { "name": "className", "defaultValue": null, "description": "className applied to the root element rendered.", "required": false, "type": { "name": "string" }, "tags": {} } } } }, { "tags": { "param": "props.className Class name that will be applied to the root-level element.\nprops.children Content that will be rendered inside the root-level element.\nprops.baseFontSize Determines the base font size for the menu items.\nprops.widthOverride Provides an override for the SideNav width.\nprops.collapsed Allows consuming applications to control the collapsed state of the navigation.\nprops.setCollapsed Consuming application's collapsed-state management controller" }, "description": "The SideNav component should be used for any area of our product that has a navigational structure.\n\n```\n\n\n \n Back to Home\n \n\n\n```", "methods": [], "displayName": "SideNav", "props": { "SideNavProps": { "children": { "name": "children", "defaultValue": null, "description": "Content that will be rendered inside the root-level element.", "required": false, "type": { "name": "`` | ``" }, "tags": { "type": "`` | ``" } }, "id": { "name": "id", "defaultValue": null, "description": "", "required": false, "type": { "name": "string" }, "tags": {} }, "baseFontSize": { "name": "baseFontSize", "defaultValue": null, "description": "Determines the base font size (in pixels) of the Side Nav", "required": false, "type": { "name": "enum", "raw": "14 | 16", "value": [ { "value": "14" }, { "value": "16" } ] }, "tags": {} }, "widthOverride": { "name": "widthOverride", "defaultValue": null, "description": "Provides an override for the SideNav width (in pixels).", "required": false, "type": { "name": "number" }, "tags": {} }, "collapsed": { "name": "collapsed", "defaultValue": null, "description": "Allows consuming applications to control the collapsed state of the navigation.", "required": false, "type": { "name": "enum", "raw": "boolean", "value": [ { "value": "false" }, { "value": "true" } ] }, "tags": {} }, "setCollapsed": { "name": "setCollapsed", "defaultValue": null, "description": "Consuming application's collapsed-state management controller", "required": false, "type": { "name": "Dispatch>" }, "tags": {} } }, "HTMLAttributes": "https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes", "AriaAttributes": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes", "DOMAttributes": "https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes", "DarkModeProps": { "darkMode": { "name": "darkMode", "defaultValue": { "value": "false" }, "description": "Renders the component with dark mode styles.", "required": false, "type": { "name": "enum", "raw": "boolean", "value": [ { "value": "false" }, { "value": "true" } ] }, "tags": { "default": "false" } } } } }, { "tags": { "param": "props.className Class name that will be applied to the root-level element.\nprops.header Content that will be rendered as the component's header\nIf a string is provided, it will be rendered with default styling as a header tag.\nprops.children Class name that will be applied to the component's header.\nprops.collapsible Determines whether or not the Group can be collapsed.\nprops.initialCollapsed Determines whether or not the Group is open by default.", "defaultValue": "false\ntrue" }, "description": "# SideNavGroup\n\n```\n\n\n Back to Home\n\n\n```", "methods": [], "displayName": "SideNavGroup", "props": { "SideNavGroupProps": { "collapsible": { "name": "collapsible", "defaultValue": { "value": false }, "description": "Determines whether or not the Group can be collapsed.", "required": false, "type": { "name": "enum", "raw": "boolean", "value": [ { "value": "false" }, { "value": "true" } ] }, "tags": { "defaultValue": "`false`" } }, "initialCollapsed": { "name": "initialCollapsed", "defaultValue": { "value": true }, "description": "If collapsible, determines whether or not the group should be expanded or collapsed by default.", "required": false, "type": { "name": "enum", "raw": "boolean", "value": [ { "value": "false" }, { "value": "true" } ] }, "tags": { "defaultValue": "`true`" } } }, "SideNavGroupBaseProps": { "header": { "name": "header", "defaultValue": null, "description": "Content that will be rendered as the component's header. If a string is provided,\nit will be rendered with default styling as a header tag.", "required": false, "type": { "name": "enum", "raw": "ReactNode", "value": [ { "value": "string" }, { "value": "number" }, { "value": "false" }, { "value": "true" }, { "value": "ReactElement>", "description": "", "fullComment": "", "tags": {} }, { "value": "Iterable", "description": "", "fullComment": "", "tags": {} }, { "value": "ReactPortal", "description": "", "fullComment": "", "tags": {} } ] }, "tags": {} }, "children": { "name": "children", "defaultValue": null, "description": "Content that will be rendered inside the root-level element.", "required": false, "type": { "name": "``" }, "tags": { "type": "``" } }, "glyph": { "name": "glyph", "defaultValue": null, "description": "Icon that's rendered in the group label.", "required": false, "type": { "name": "``" }, "tags": { "type": "``" } }, "hasActiveItem": { "name": "hasActiveItem", "defaultValue": null, "description": "Manually overrides automatic detection of whether a group contains an active item.\nThis is useful for cases when an active item might be wrapped with another component like a Tooltip or routing component.", "required": false, "type": { "name": "enum", "raw": "boolean", "value": [ { "value": "false" }, { "value": "true" } ] }, "tags": {} }, "indentLevel": { "name": "indentLevel", "defaultValue": { "value": 0 }, "description": "Change the indentation. Will not work if `` is a child of ``.", "required": false, "type": { "name": "number" }, "tags": { "default": "1" } } }, "HTMLAttributes": "https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes", "LiHTMLAttributes": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li", "AriaAttributes": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes", "DOMAttributes": "https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes" } }, { "tags": { "param": "props.active Whether or not the component should be rendered in an active state.\nprops.disabled Whether or not the component should be rendered in a disabled state.\nprops.ariaCurrentValue The aria-current attribute value set when the component is active.\nprops.className Class name that will be applied to the root-level element.\nprops.children Content that will be rendered inside the root-level element.\nprops.indentLevel Change the indentation. Will not work if `` is a child of ``\n\n### Optional Polymorphic Props\nprops.href When provided, the component will be rendered as an anchor element. This and\nother additional props will be spread on the anchor element.\nprops.as When provided, the component will be rendered as the component or html tag indicated\nby this prop. Other additional props will be spread on the anchor element." }, "description": "TODO: TSDoc\n\n```\n\n Back to Home\n\n```\n\n### Component Props", "methods": [], "displayName": "SideNavItem", "props": { "SideNavItemProps": { "as": { "name": "as", "defaultValue": null, "description": "The element or component to render as", "required": false, "type": { "name": "enum", "raw": "PolymorphicAs", "value": [ { "value": "\"symbol\"" }, { "value": "\"object\"" }, { "value": "\"button\"" }, { "value": "\"a\"" }, { "value": "\"abbr\"" }, { "value": "\"address\"" }, { "value": "\"area\"" }, { "value": "\"article\"" }, { "value": "\"aside\"" }, { "value": "\"audio\"" }, { "value": "\"b\"" }, { "value": "\"base\"" }, { "value": "\"bdi\"" }, { "value": "\"bdo\"" }, { "value": "\"big\"" }, { "value": "\"blockquote\"" }, { "value": "\"body\"" }, { "value": "\"br\"" }, { "value": "\"canvas\"" }, { "value": "\"caption\"" }, { "value": "\"center\"" }, { "value": "\"cite\"" }, { "value": "\"code\"" }, { "value": "\"col\"" }, { "value": "\"colgroup\"" }, { "value": "\"data\"" }, { "value": "\"datalist\"" }, { "value": "\"dd\"" }, { "value": "\"del\"" }, { "value": "\"details\"" }, { "value": "\"dfn\"" }, { "value": "\"dialog\"" }, { "value": "\"div\"" }, { "value": "\"dl\"" }, { "value": "\"dt\"" }, { "value": "\"em\"" }, { "value": "\"embed\"" }, { "value": "\"fieldset\"" }, { "value": "\"figcaption\"" }, { "value": "\"figure\"" }, { "value": "\"footer\"" }, { "value": "\"form\"" }, { "value": "\"h1\"" }, { "value": "\"h2\"" }, { "value": "\"h3\"" }, { "value": "\"h4\"" }, { "value": "\"h5\"" }, { "value": "\"h6\"" }, { "value": "\"head\"" }, { "value": "\"header\"" }, { "value": "\"hgroup\"" }, { "value": "\"hr\"" }, { "value": "\"html\"" }, { "value": "\"i\"" }, { "value": "\"iframe\"" }, { "value": "\"img\"" }, { "value": "\"input\"" }, { "value": "\"ins\"" }, { "value": "\"kbd\"" }, { "value": "\"keygen\"" }, { "value": "\"label\"" }, { "value": "\"legend\"" }, { "value": "\"li\"" }, { "value": "\"link\"" }, { "value": "\"main\"" }, { "value": "\"map\"" }, { "value": "\"mark\"" }, { "value": "\"menu\"" }, { "value": "\"menuitem\"" }, { "value": "\"meta\"" }, { "value": "\"meter\"" }, { "value": "\"nav\"" }, { "value": "\"noindex\"" }, { "value": "\"noscript\"" }, { "value": "\"ol\"" }, { "value": "\"optgroup\"" }, { "value": "\"option\"" }, { "value": "\"output\"" }, { "value": "\"p\"" }, { "value": "\"param\"" }, { "value": "\"picture\"" }, { "value": "\"pre\"" }, { "value": "\"progress\"" }, { "value": "\"q\"" }, { "value": "\"rp\"" }, { "value": "\"rt\"" }, { "value": "\"ruby\"" }, { "value": "\"s\"" }, { "value": "\"samp\"" }, { "value": "\"search\"" }, { "value": "\"slot\"" }, { "value": "\"script\"" }, { "value": "\"section\"" }, { "value": "\"select\"" }, { "value": "\"small\"" }, { "value": "\"source\"" }, { "value": "\"span\"" }, { "value": "\"strong\"" }, { "value": "\"style\"" }, { "value": "\"sub\"" }, { "value": "\"summary\"" }, { "value": "\"sup\"" }, { "value": "\"table\"" }, { "value": "\"template\"" }, { "value": "\"tbody\"" }, { "value": "\"td\"" }, { "value": "\"textarea\"" }, { "value": "\"tfoot\"" }, { "value": "\"th\"" }, { "value": "\"thead\"" }, { "value": "\"time\"" }, { "value": "\"title\"" }, { "value": "\"tr\"" }, { "value": "\"track\"" }, { "value": "\"u\"" }, { "value": "\"ul\"" }, { "value": "\"var\"" }, { "value": "\"video\"" }, { "value": "\"wbr\"" }, { "value": "\"webview\"" }, { "value": "\"svg\"" }, { "value": "\"animate\"" }, { "value": "\"animateMotion\"" }, { "value": "\"animateTransform\"" }, { "value": "\"circle\"" }, { "value": "\"clipPath\"" }, { "value": "\"defs\"" }, { "value": "\"desc\"" }, { "value": "\"ellipse\"" }, { "value": "\"feBlend\"" }, { "value": "\"feColorMatrix\"" }, { "value": "\"feComponentTransfer\"" }, { "value": "\"feComposite\"" }, { "value": "\"feConvolveMatrix\"" }, { "value": "\"feDiffuseLighting\"" }, { "value": "\"feDisplacementMap\"" }, { "value": "\"feDistantLight\"" }, { "value": "\"feDropShadow\"" }, { "value": "\"feFlood\"" }, { "value": "\"feFuncA\"" }, { "value": "\"feFuncB\"" }, { "value": "\"feFuncG\"" }, { "value": "\"feFuncR\"" }, { "value": "\"feGaussianBlur\"" }, { "value": "\"feImage\"" }, { "value": "\"feMerge\"" }, { "value": "\"feMergeNode\"" }, { "value": "\"feMorphology\"" }, { "value": "\"feOffset\"" }, { "value": "\"fePointLight\"" }, { "value": "\"feSpecularLighting\"" }, { "value": "\"feSpotLight\"" }, { "value": "\"feTile\"" }, { "value": "\"feTurbulence\"" }, { "value": "\"filter\"" }, { "value": "\"foreignObject\"" }, { "value": "\"g\"" }, { "value": "\"image\"" }, { "value": "\"line\"" }, { "value": "\"linearGradient\"" }, { "value": "\"marker\"" }, { "value": "\"mask\"" }, { "value": "\"metadata\"" }, { "value": "\"mpath\"" }, { "value": "\"path\"" }, { "value": "\"pattern\"" }, { "value": "\"polygon\"" }, { "value": "\"polyline\"" }, { "value": "\"radialGradient\"" }, { "value": "\"rect\"" }, { "value": "\"stop\"" }, { "value": "\"switch\"" }, { "value": "\"text\"" }, { "value": "\"textPath\"" }, { "value": "\"tspan\"" }, { "value": "\"use\"" }, { "value": "\"view\"" }, { "value": "ComponentClass", "description": "", "fullComment": "", "tags": {} }, { "value": "FunctionComponent", "description": "", "fullComment": "", "tags": {} } ] }, "tags": {} } }, "HTMLAttributes": "https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes", "AriaAttributes": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes", "DOMAttributes": "https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes", "BaseSideNavItemProps": { "disabled": { "name": "disabled", "defaultValue": null, "description": "Whether or not the component should be rendered in a disabled state.\n\ndefault: `false`", "required": false, "type": { "name": "enum", "raw": "boolean", "value": [ { "value": "false" }, { "value": "true" } ] }, "tags": {} }, "active": { "name": "active", "defaultValue": null, "description": "Whether or not the component should be rendered in an active state.\n\ndefault: `false`", "required": false, "type": { "name": "enum", "raw": "boolean", "value": [ { "value": "false" }, { "value": "true" } ] }, "tags": {} }, "ariaCurrentValue": { "name": "ariaCurrentValue", "defaultValue": null, "description": "The aria-current attribute value set when the component is active.\n\ndefault: `\"page\"`", "required": false, "type": { "name": "enum", "raw": "AriaCurrentValue", "value": [ { "value": "\"time\"" }, { "value": "\"true\"" }, { "value": "\"false\"" }, { "value": "\"page\"" }, { "value": "\"step\"" }, { "value": "\"location\"" }, { "value": "\"date\"" } ] }, "tags": {} }, "glyph": { "name": "glyph", "defaultValue": null, "description": "Icon that's rendered in the item.", "required": false, "type": { "name": "``" }, "tags": { "type": "``" } }, "indentLevel": { "name": "indentLevel", "defaultValue": { "value": "1" }, "description": "Changes the indentation. Will not work if `` is a child of ``.", "required": false, "type": { "name": "number" }, "tags": { "default": "1" } } } } } ]