office-ui-fabric-react/lib/components/Nav/Nav.Props.d.ts

Reusable React components for building experiences for Office 365.

import * as React from 'react';
export interface INav {
    /**
     * The meta 'key' property of the currently selected NavItem of the Nav. Can return
     * undefined if the currently selected nav item has no populated key property. Be aware
     * that in order for Nav to properly understand which key is selected all NavItems in
     * all groups of the Nav must have populated key properties.
     */
    selectedKey: string;
}
export interface INavProps {
    /**
     * A collection of link groups to display in the navigation bar
     */
    groups: INavLinkGroup[];
    /**
     * Used to customize how content inside the link tag is rendered
     * @defaultvalue Default link rendering
     */
    onRenderLink?: Function;
    /**
     * Function callback invoked when a link in the navigation is clicked
     */
    onLinkClick?: (ev?: React.MouseEvent<HTMLElement>, item?: INavLink) => void;
    /**
     * Indicates whether the navigation component renders on top of other content in the UI
     */
    isOnTop?: boolean;
    /**
     * (Optional) The key of the nav item initially selected.
     */
    initialSelectedKey?: string;
    /**
     * (Optional) The nav container aria label.
     */
    ariaLabel?: string;
    /**
     * (Optional) The alt text for the expanded state
     **/
    expandedStateText?: string;
    /**
     * (Optional) The alt text for the collapsed state text
     **/
    collapsedStateText?: string;
}
export interface INavLinkGroup {
    /**
     * Text to render as the header of a group
     */
    name?: string;
    /**
     * Links to render within this group
     */
    links: INavLink[];
    /**
     * The name to use for functional automation tests
     */
    automationId?: string;
}
export interface INavLink {
    /**
     * Text to render for this link
     */
    name: string;
    /**
     * URL to navigate to for this link
     */
    url: string;
    /**
     * Child links to this link, if any
     */
    links?: INavLink[];
    /**
     * Function callback invoked when a link in the navigation is clicked
     */
    onClick?: (ev?: React.MouseEvent<HTMLElement>, item?: INavLink) => void;
    /**
     * button icon name if applied
     */
    icon?: string;
    /**
     * Classname to apply to the icon link.
     */
    iconClassName?: string;
    /**
     * The name of the item to be used in logging engagement data
     */
    engagementName?: string;
    /**
     * The alt text for the item
     */
    altText?: string;
    /**
     * The name to use for functional automation tests
     */
    automationId?: string;
    /**
     * Whether or not the link is in an expanded state
     */
    isExpanded?: boolean;
    /**
     * Aria label for nav link
     */
    ariaLabel?: string;
    /**
     * Meta info for the link, does not involving rendering.
     */
    key?: string;
    /**
     * title for tooltip or description
     */
    title?: string;
    /**
     * Link <a> target.
     */
    target?: string;
    /**
     * Point to the parent node key.  This is used in EditNav when move node from sublink to
     *   parent lin vs vers.
     */
    parentId?: string;
    /**
     * Any additional properties to apply to the rendered links.
     */
    [propertyName: string]: any;
}