| 1 | {"version":3,"file":"Nav.types.js","sourceRoot":"../src/","sources":["components/Nav/Nav.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { IStyle, ITheme } from '../../Styling';\nimport type { IRefObject, IRenderFunction, IStyleFunctionOrObject, IComponentAs } from '../../Utilities';\nimport type { IIconProps } from '../Icon/Icon.types';\nimport type { IButtonProps } from '../../Button';\n\n/**\n * {@doccategory Nav}\n */\nexport interface IRenderGroupHeaderProps extends INavLinkGroup {\n /**\n * Whether or not the group is presently expanded.\n */\n isExpanded?: boolean;\n}\n\n/**\n * {@docCategory Nav}\n */\nexport interface INav {\n /**\n * The meta 'key' property of the currently selected NavItem of the Nav. Can return\n * undefined if the currently selected nav item has no populated key property. Be aware\n * that in order for Nav to properly understand which key is selected all NavItems in\n * all groups of the Nav must have populated key properties.\n */\n selectedKey: string | undefined;\n /**\n * Sets focus to the first tabbable item in the zone.\n * @param forceIntoFirstElement - If true, focus will be forced into the first element, even\n * if focus is already in the focus zone.\n * @returns True if focus could be set to an active element, false if no operation was taken.\n */\n focus(forceIntoFirstElement?: boolean): boolean;\n}\n\n/**\n * {@docCategory Nav}\n */\nexport interface INavProps {\n /**\n * Optional callback to access the INav interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: IRefObject<INav>;\n\n /**\n * Call to provide customized styling that will layer on top of the variant rules\n */\n styles?: IStyleFunctionOrObject<INavStyleProps, INavStyles>;\n\n /**\n * Theme provided by HOC.\n */\n theme?: ITheme;\n\n /**\n * Additional css class to apply to the Nav\n * @defaultvalue undefined\n */\n className?: string;\n\n /**\n * A collection of link groups to display in the navigation bar\n */\n groups: INavLinkGroup[] | null;\n\n /**\n * Used to customize how content inside the group header is rendered\n */\n onRenderGroupHeader?: IRenderFunction<IRenderGroupHeaderProps>;\n\n /**\n * Render a custom link in place of the normal one.\n * This replaces the entire button rather than simply button content\n */\n linkAs?: IComponentAs<INavButtonProps>;\n\n /**\n * Used to customize how content inside the link tag is rendered\n */\n onRenderLink?: IRenderFunction<INavLink>;\n\n /**\n * Function callback invoked when a link in the navigation is clicked\n */\n onLinkClick?: (ev?: React.MouseEvent<HTMLElement>, item?: INavLink) => void;\n\n /**\n * Function callback invoked when the chevron on a link is clicked\n */\n onLinkExpandClick?: (ev?: React.MouseEvent<HTMLElement>, item?: INavLink) => void;\n\n /**\n * Indicates whether the navigation component renders on top of other content in the UI\n */\n isOnTop?: boolean;\n\n /**\n * (Optional) The key of the nav item initially selected.\n */\n initialSelectedKey?: string;\n\n /**\n * (Optional) The key of the nav item selected by caller.\n */\n selectedKey?: string;\n\n /**\n * (Optional) The nav container aria label.\n */\n ariaLabel?: string;\n\n /**\n * (Optional) The nav container aria label. The link name is prepended to this label.\n * If not provided, the aria label will default to the link name.\n *\n * @deprecated Use `expandAriaLabel` and `collapseAriaLabel` on groups instead\n */\n expandButtonAriaLabel?: string;\n /**\n * (Deprecated) Use ariaCurrent on links instead\n * @deprecated Use ariaCurrent on links instead\n */\n selectedAriaLabel?: string;\n}\n\n/**\n * {@docCategory Nav}\n */\nexport interface INavLinkGroup {\n /**\n * Text to render as the header of a group\n */\n name?: string;\n\n /**\n * Links to render within this group\n */\n links: INavLink[];\n\n /**\n * The name to use for functional automation tests\n */\n automationId?: string;\n\n /**\n * If true, the group should render collapsed by default\n */\n collapseByDefault?: boolean;\n\n /**\n * Callback invoked when a group header is clicked\n */\n onHeaderClick?: (ev?: React.MouseEvent<HTMLElement>, isCollapsing?: boolean) => void;\n\n /**\n * ARIA label when group is collapsed and can be expanded.\n */\n expandAriaLabel?: string;\n\n /**\n * ARIA label when group is collapsed and can be expanded.\n */\n collapseAriaLabel?: string;\n\n /**\n * (Optional) Any additional properties to apply to a group.\n */\n groupData?: any;\n /**\n * Provides consumer control to update the collapsed/expanded state of the group.\n */\n isExpanded?: boolean;\n}\n\n/**\n * {@docCategory Nav}\n */\nexport interface INavLink {\n /**\n * Text to render for this link\n */\n name: string;\n\n /**\n * URL to navigate to for this link\n */\n url: string;\n\n /**\n * Unique, stable key for the link, used when rendering the list of links and for tracking\n * the currently selected link.\n */\n key?: string;\n\n /**\n * Child links to this link, if any\n */\n links?: INavLink[];\n\n /**\n * Callback invoked when this link is clicked. Providing this callback will cause the link\n * to render as a button (rather than an anchor) unless forceAnchor is set to true.\n */\n onClick?: (ev?: React.MouseEvent<HTMLElement>, item?: INavLink) => void;\n\n /**\n * Name of an icon to render next to the link button.\n */\n icon?: string;\n\n /**\n * @deprecated Use `iconProps.className` instead.\n */\n iconClassName?: string;\n\n /**\n * Props for an icon to render next to the link button.\n */\n iconProps?: IIconProps;\n\n /**\n * The name to use for functional automation tests\n */\n automationId?: string;\n\n /**\n * Whether or not the link is in an expanded state\n */\n isExpanded?: boolean;\n\n /**\n * Aria-current token for active nav links. Must be a valid token value, and defaults to 'page'.\n */\n ariaCurrent?: 'page' | 'step' | 'location' | 'date' | 'time' | 'true';\n\n /**\n * Aria label for nav link. Ignored if `collapseAriaLabel` or `expandAriaLabel` is provided.\n */\n ariaLabel?: string;\n\n /**\n * Text for title tooltip and ARIA description.\n */\n title?: string;\n\n /**\n * Link <a> target.\n */\n target?: string;\n\n /**\n * Whether or not the link is disabled.\n */\n disabled?: boolean;\n\n /**\n * (Optional) By default, any link with onClick defined will render as a button.\n * Set this property to true to override that behavior. (Links without onClick defined\n * will render as anchors by default.)\n */\n forceAnchor?: boolean;\n\n /**\n * ARIA label when group is collapsed and can be expanded.\n */\n expandAriaLabel?: string;\n\n /**\n * ARIA label when group is collapsed and can be expanded.\n */\n collapseAriaLabel?: string;\n\n /**\n * (Optional) Any additional properties to apply to the rendered links.\n */\n [propertyName: string]: any;\n}\n\n/**\n * {@docCategory Nav}\n */\nexport interface INavStyleProps {\n /**\n * Accept theme prop.\n */\n theme: ITheme;\n\n /**\n * Accept custom classNames\n */\n className?: string;\n\n /**\n * is element on top boolean\n */\n isOnTop?: boolean;\n\n /**\n * is element a link boolean\n */\n isLink?: boolean;\n\n /**\n * is element disabled\n */\n isDisabled?: boolean;\n\n /**\n * is element a group boolean\n */\n isGroup?: boolean;\n\n /**\n * is element expanded boolean\n */\n isExpanded?: boolean;\n\n /**\n * is element selected boolean\n */\n isSelected?: boolean;\n\n /**\n * is button\n */\n isButtonEntry?: boolean;\n\n /**\n * Nav height value\n */\n navHeight?: number;\n\n /**\n * left padding value\n */\n leftPadding?: number;\n\n /**\n * left padding when expanded value\n */\n leftPaddingExpanded?: number;\n\n /**\n * right padding value\n */\n rightPadding?: number;\n\n /**\n * position value\n */\n position?: number;\n\n /**\n * Inherited from INavProps\n * A collection of link groups to display in the navigation bar\n */\n groups: INavLinkGroup[] | null;\n}\n\n/**\n * {@docCategory Nav}\n */\nexport interface INavStyles {\n /**\n * Style set for the root element.\n */\n root: IStyle;\n\n /**\n * Style set for the link text container div element.\n */\n linkText: IStyle;\n\n /**\n * Style set for the link element extending the\n * root style set for ActionButton component.\n */\n link: IStyle;\n\n /**\n * Style set for the composite link container div element\n */\n compositeLink: IStyle;\n\n /**\n * Style set for the chevron button inside the composite\n * link and group elements.\n */\n chevronButton: IStyle;\n\n /**\n * Style set for the chevron icon inside the composite\n * link and group elements.\n */\n chevronIcon: IStyle;\n\n /**\n * Style set for the nav links ul element.\n */\n navItems: IStyle;\n\n /**\n * Style set for the nav links li element.\n */\n navItem: IStyle;\n\n /**\n * Style set for the group root div.\n */\n group: IStyle;\n\n /**\n * Style set for the group content div inside group.\n */\n groupContent: IStyle;\n}\n\n/**\n * {@docCategory Nav}\n */\nexport interface INavButtonProps extends IButtonProps {\n /**\n * (Optional) Link to be rendered.\n */\n link?: INavLink;\n}\n"]} |