first commit

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.base.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import type { IBreadcrumbProps, IBreadcrumbData } from './Breadcrumb.types';
+import type { JSXElement } from '@fluentui/utilities';
+/** @deprecated Use IBreadcrumbData */
+export type IBreadCrumbData = IBreadcrumbData;
+/**
+ * {@docCategory Breadcrumb}
+ */
+export declare class BreadcrumbBase extends React.Component<IBreadcrumbProps, any> {
+    static defaultProps: IBreadcrumbProps;
+    private _classNames;
+    private _focusZone;
+    constructor(props: IBreadcrumbProps);
+    /**
+     * Sets focus to the first breadcrumb link.
+     */
+    focus(): void;
+    render(): JSXElement;
+    /**
+     * Remove the first rendered item past the overlow point and put it and the end the overflow set.
+     */
+    private _onReduceData;
+    /**
+     * Remove the last item of the overflow set and insert the item as the start of the rendered set past the overflow
+     * point.
+     */
+    private _onGrowData;
+    private _onRenderBreadcrumb;
+    private _onRenderItem;
+    private _onBreadcrumbClicked;
+    /**
+     * Validate incoming props
+     * @param props - Props to validate
+     */
+    private _validateProps;
+}

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.base.js

@@ -0,0 +1,197 @@
+import { __assign, __extends, __rest, __spreadArray } from "tslib";
+import * as React from 'react';
+import { initializeComponentRef, getRTL, classNamesFunction, getNativeProps, htmlElementProperties, } from '../../Utilities';
+import { FocusZone, FocusZoneDirection } from '../../FocusZone';
+import { Link } from '../../Link';
+import { Icon } from '../../Icon';
+import { IconButton } from '../../Button';
+import { DirectionalHint } from '../../common/DirectionalHint';
+import { ResizeGroup } from '../../ResizeGroup';
+import { TooltipHost, TooltipOverflowMode } from '../../Tooltip';
+import { composeRenderFunction } from '../../Utilities';
+var getClassNames = classNamesFunction();
+var OVERFLOW_KEY = 'overflow';
+var nullFunction = function () { return null; };
+var nonActionableItemProps = {
+    styles: function (props) {
+        var theme = props.theme;
+        return {
+            root: {
+                selectors: {
+                    '&.is-disabled': {
+                        color: theme.semanticColors.bodyText,
+                    },
+                },
+            },
+        };
+    },
+};
+/**
+ * {@docCategory Breadcrumb}
+ */
+var BreadcrumbBase = /** @class */ (function (_super) {
+    __extends(BreadcrumbBase, _super);
+    function BreadcrumbBase(props) {
+        var _this = _super.call(this, props) || this;
+        _this._focusZone = React.createRef();
+        /**
+         * Remove the first rendered item past the overlow point and put it and the end the overflow set.
+         */
+        _this._onReduceData = function (data) {
+            var renderedItems = data.renderedItems, renderedOverflowItems = data.renderedOverflowItems;
+            var overflowIndex = data.props.overflowIndex;
+            var movedItem = renderedItems[overflowIndex];
+            if (!movedItem) {
+                return undefined;
+            }
+            renderedItems = __spreadArray([], renderedItems, true);
+            renderedItems.splice(overflowIndex, 1);
+            renderedOverflowItems = __spreadArray(__spreadArray([], renderedOverflowItems, true), [movedItem], false);
+            return __assign(__assign({}, data), { renderedItems: renderedItems, renderedOverflowItems: renderedOverflowItems });
+        };
+        /**
+         * Remove the last item of the overflow set and insert the item as the start of the rendered set past the overflow
+         * point.
+         */
+        _this._onGrowData = function (data) {
+            var renderedItems = data.renderedItems, renderedOverflowItems = data.renderedOverflowItems;
+            var _a = data.props, overflowIndex = _a.overflowIndex, maxDisplayedItems = _a.maxDisplayedItems;
+            renderedOverflowItems = __spreadArray([], renderedOverflowItems, true);
+            var movedItem = renderedOverflowItems.pop();
+            if (!movedItem || renderedItems.length >= maxDisplayedItems) {
+                return undefined;
+            }
+            renderedItems = __spreadArray([], renderedItems, true);
+            renderedItems.splice(overflowIndex, 0, movedItem);
+            return __assign(__assign({}, data), { renderedItems: renderedItems, renderedOverflowItems: renderedOverflowItems });
+        };
+        _this._onRenderBreadcrumb = function (data) {
+            var _a = data.props, ariaLabel = _a.ariaLabel, _b = _a.dividerAs, DividerType = _b === void 0 ? Icon : _b, onRenderItem = _a.onRenderItem, overflowAriaLabel = _a.overflowAriaLabel, overflowIndex = _a.overflowIndex, onRenderOverflowIcon = _a.onRenderOverflowIcon, overflowButtonAs = _a.overflowButtonAs;
+            var renderedOverflowItems = data.renderedOverflowItems, renderedItems = data.renderedItems;
+            var contextualItems = renderedOverflowItems.map(function (item) {
+                var isActionable = !!(item.onClick || item.href);
+                return {
+                    text: item.text,
+                    name: item.text,
+                    key: item.key,
+                    onClick: item.onClick ? _this._onBreadcrumbClicked.bind(_this, item) : null,
+                    href: item.href,
+                    disabled: !isActionable,
+                    itemProps: isActionable ? undefined : nonActionableItemProps,
+                };
+            });
+            // Find index of last rendered item so the divider icon
+            // knows not to render on that item
+            var lastItemIndex = renderedItems.length - 1;
+            var hasOverflowItems = renderedOverflowItems && renderedOverflowItems.length !== 0;
+            var itemElements = renderedItems.map(function (item, index) {
+                var finalOnRenderItem = _this._onRenderItem;
+                if (item.onRender) {
+                    finalOnRenderItem = composeRenderFunction(item.onRender, finalOnRenderItem);
+                }
+                if (onRenderItem) {
+                    finalOnRenderItem = composeRenderFunction(onRenderItem, finalOnRenderItem);
+                }
+                return (React.createElement("li", { className: _this._classNames.listItem, key: item.key || String(index) },
+                    finalOnRenderItem(item),
+                    (index !== lastItemIndex || (hasOverflowItems && index === overflowIndex - 1)) && (React.createElement(DividerType, { className: _this._classNames.chevron, iconName: getRTL(_this.props.theme) ? 'ChevronLeft' : 'ChevronRight', item: item }))));
+            });
+            if (hasOverflowItems) {
+                var iconProps = !onRenderOverflowIcon ? { iconName: 'More' } : {};
+                var onRenderMenuIcon = onRenderOverflowIcon ? onRenderOverflowIcon : nullFunction;
+                var OverflowButton = overflowButtonAs ? overflowButtonAs : IconButton;
+                itemElements.splice(overflowIndex, 0, React.createElement("li", { className: _this._classNames.overflow, key: OVERFLOW_KEY },
+                    React.createElement(OverflowButton, { className: _this._classNames.overflowButton, iconProps: iconProps, role: "button", "aria-haspopup": "true", ariaLabel: overflowAriaLabel, onRenderMenuIcon: onRenderMenuIcon, menuProps: {
+                            items: contextualItems,
+                            directionalHint: DirectionalHint.bottomLeftEdge,
+                        } }),
+                    overflowIndex !== lastItemIndex + 1 && (React.createElement(DividerType, { className: _this._classNames.chevron, iconName: getRTL(_this.props.theme) ? 'ChevronLeft' : 'ChevronRight', item: renderedOverflowItems[renderedOverflowItems.length - 1] }))));
+            }
+            var nativeProps = getNativeProps(_this.props, htmlElementProperties, [
+                'className',
+            ]);
+            return (React.createElement("div", __assign({ className: _this._classNames.root, role: "navigation", "aria-label": ariaLabel }, nativeProps),
+                React.createElement(FocusZone, __assign({ componentRef: _this._focusZone, direction: FocusZoneDirection.horizontal }, _this.props.focusZoneProps),
+                    React.createElement("ol", { className: _this._classNames.list }, itemElements))));
+        };
+        _this._onRenderItem = function (item) {
+            if (!item) {
+                return null;
+            }
+            var as = item.as, href = item.href, onClick = item.onClick, isCurrentItem = item.isCurrentItem, text = item.text, onRenderContent = item.onRenderContent, additionalProps = __rest(item, ["as", "href", "onClick", "isCurrentItem", "text", "onRenderContent"]);
+            var finalOnRenderContent = defaultOnRenderCrumbContent;
+            if (onRenderContent) {
+                finalOnRenderContent = composeRenderFunction(onRenderContent, finalOnRenderContent);
+            }
+            if (_this.props.onRenderItemContent) {
+                finalOnRenderContent = composeRenderFunction(_this.props.onRenderItemContent, finalOnRenderContent);
+            }
+            if (onClick || href) {
+                return (React.createElement(Link, __assign({}, additionalProps, { as: as, className: _this._classNames.itemLink, href: href, "aria-current": isCurrentItem ? 'page' : undefined, 
+                    // eslint-disable-next-line react/jsx-no-bind
+                    onClick: _this._onBreadcrumbClicked.bind(_this, item) }),
+                    React.createElement(TooltipHost, __assign({ content: text, overflowMode: TooltipOverflowMode.Parent }, _this.props.tooltipHostProps), finalOnRenderContent(item))));
+            }
+            else {
+                var Tag = as || 'span';
+                return (React.createElement(Tag, __assign({}, additionalProps, { className: _this._classNames.item }),
+                    React.createElement(TooltipHost, __assign({ content: text, overflowMode: TooltipOverflowMode.Parent }, _this.props.tooltipHostProps), finalOnRenderContent(item))));
+            }
+        };
+        _this._onBreadcrumbClicked = function (item, ev) {
+            if (item.onClick) {
+                item.onClick(ev, item);
+            }
+        };
+        initializeComponentRef(_this);
+        _this._validateProps(props);
+        return _this;
+    }
+    /**
+     * Sets focus to the first breadcrumb link.
+     */
+    BreadcrumbBase.prototype.focus = function () {
+        if (this._focusZone.current) {
+            this._focusZone.current.focus();
+        }
+    };
+    BreadcrumbBase.prototype.render = function () {
+        this._validateProps(this.props);
+        var _a = this.props, _b = _a.onReduceData, onReduceData = _b === void 0 ? this._onReduceData : _b, _c = _a.onGrowData, onGrowData = _c === void 0 ? this._onGrowData : _c, overflowIndex = _a.overflowIndex, maxDisplayedItems = _a.maxDisplayedItems, items = _a.items, className = _a.className, theme = _a.theme, styles = _a.styles;
+        var renderedItems = __spreadArray([], items, true);
+        var renderedOverflowItems = renderedItems.splice(overflowIndex, renderedItems.length - maxDisplayedItems);
+        var breadcrumbData = {
+            props: this.props,
+            renderedItems: renderedItems,
+            renderedOverflowItems: renderedOverflowItems,
+        };
+        this._classNames = getClassNames(styles, {
+            className: className,
+            theme: theme,
+        });
+        return (React.createElement(ResizeGroup, { onRenderData: this._onRenderBreadcrumb, onReduceData: onReduceData, onGrowData: onGrowData, data: breadcrumbData }));
+    };
+    /**
+     * Validate incoming props
+     * @param props - Props to validate
+     */
+    BreadcrumbBase.prototype._validateProps = function (props) {
+        var maxDisplayedItems = props.maxDisplayedItems, overflowIndex = props.overflowIndex, items = props.items;
+        if (overflowIndex < 0 ||
+            (maxDisplayedItems > 1 && overflowIndex > maxDisplayedItems - 1) ||
+            (items.length > 0 && overflowIndex > items.length - 1)) {
+            throw new Error('Breadcrumb: overflowIndex out of range');
+        }
+    };
+    BreadcrumbBase.defaultProps = {
+        items: [],
+        maxDisplayedItems: 999,
+        overflowIndex: 0,
+    };
+    return BreadcrumbBase;
+}(React.Component));
+export { BreadcrumbBase };
+function defaultOnRenderCrumbContent(item) {
+    return item ? React.createElement(React.Fragment, null, item.text) : null;
+}
+//# sourceMappingURL=Breadcrumb.base.js.map

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import type { IBreadcrumbProps } from './Breadcrumb.types';
+export declare const Breadcrumb: React.FunctionComponent<IBreadcrumbProps>;

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.js

@@ -0,0 +1,5 @@
+import { styled } from '../../Utilities';
+import { BreadcrumbBase } from './Breadcrumb.base';
+import { getStyles } from './Breadcrumb.styles';
+export var Breadcrumb = styled(BreadcrumbBase, getStyles, undefined, { scope: 'Breadcrumb' });
+//# sourceMappingURL=Breadcrumb.js.map

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.js","sourceRoot":"../src/","sources":["components/Breadcrumb/Breadcrumb.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAGhD,MAAM,CAAC,IAAM,UAAU,GAA8C,MAAM,CAIzE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { styled } from '../../Utilities';\nimport { BreadcrumbBase } from './Breadcrumb.base';\nimport { getStyles } from './Breadcrumb.styles';\nimport type { IBreadcrumbProps, IBreadcrumbStyleProps, IBreadcrumbStyles } from './Breadcrumb.types';\n\nexport const Breadcrumb: React.FunctionComponent<IBreadcrumbProps> = styled<\n  IBreadcrumbProps,\n  IBreadcrumbStyleProps,\n  IBreadcrumbStyles\n>(BreadcrumbBase, getStyles, undefined, { scope: 'Breadcrumb' });\n"]}

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.styles.d.ts

@@ -0,0 +1,2 @@
+import type { IBreadcrumbStyleProps, IBreadcrumbStyles } from './Breadcrumb.types';
+export declare const getStyles: (props: IBreadcrumbStyleProps) => IBreadcrumbStyles;

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.styles.js

@@ -0,0 +1,178 @@
+import { __assign } from "tslib";
+import { HighContrastSelector, ScreenWidthMaxMedium, ScreenWidthMaxSmall, ScreenWidthMinMedium, getFocusStyle, getScreenSelector, getGlobalClassNames, FontWeights, getHighContrastNoAdjustStyle, } from '../../Styling';
+import { IsFocusVisibleClassName } from '../../Utilities';
+var GlobalClassNames = {
+    root: 'ms-Breadcrumb',
+    list: 'ms-Breadcrumb-list',
+    listItem: 'ms-Breadcrumb-listItem',
+    chevron: 'ms-Breadcrumb-chevron',
+    overflow: 'ms-Breadcrumb-overflow',
+    overflowButton: 'ms-Breadcrumb-overflowButton',
+    itemLink: 'ms-Breadcrumb-itemLink',
+    item: 'ms-Breadcrumb-item',
+};
+var SingleLineTextStyle = {
+    whiteSpace: 'nowrap',
+    textOverflow: 'ellipsis',
+    overflow: 'hidden',
+};
+var overflowButtonFontSize = 16;
+var chevronSmallFontSize = 8;
+var itemLineHeight = 36;
+var itemFontSize = 18;
+var MinimumScreenSelector = getScreenSelector(0, ScreenWidthMaxSmall);
+var MediumScreenSelector = getScreenSelector(ScreenWidthMinMedium, ScreenWidthMaxMedium);
+export var getStyles = function (props) {
+    var _a, _b, _c, _d, _e;
+    var className = props.className, theme = props.theme;
+    var palette = theme.palette, semanticColors = theme.semanticColors, fonts = theme.fonts;
+    var classNames = getGlobalClassNames(GlobalClassNames, theme);
+    // Tokens
+    var itemBackgroundHoveredColor = semanticColors.menuItemBackgroundHovered;
+    var itemBackgroundPressedColor = semanticColors.menuItemBackgroundPressed;
+    var itemTextColor = palette.neutralSecondary;
+    var itemTextFontWeight = FontWeights.regular;
+    var itemTextHoveredOrPressedColor = palette.neutralPrimary;
+    var itemLastChildTextColor = palette.neutralPrimary;
+    var itemLastChildTextFontWeight = FontWeights.semibold;
+    var chevronButtonColor = palette.neutralSecondary;
+    var overflowButtonColor = palette.neutralSecondary;
+    var lastChildItemStyles = {
+        fontWeight: itemLastChildTextFontWeight,
+        color: itemLastChildTextColor,
+    };
+    var itemStateSelectors = {
+        ':hover': {
+            color: itemTextHoveredOrPressedColor,
+            backgroundColor: itemBackgroundHoveredColor,
+            cursor: 'pointer',
+            selectors: (_a = {},
+                _a[HighContrastSelector] = {
+                    color: 'Highlight',
+                    backgroundColor: 'transparent',
+                },
+                _a),
+        },
+        ':active': {
+            backgroundColor: itemBackgroundPressedColor,
+            color: itemTextHoveredOrPressedColor,
+        },
+        '&:active:hover': {
+            color: itemTextHoveredOrPressedColor,
+            backgroundColor: itemBackgroundPressedColor,
+        },
+        '&:active, &:hover, &:active:hover': {
+            textDecoration: 'none',
+        },
+    };
+    var commonItemStyles = {
+        color: itemTextColor,
+        padding: '0 8px',
+        lineHeight: itemLineHeight,
+        fontSize: itemFontSize,
+        fontWeight: itemTextFontWeight,
+    };
+    var overflowButtonHighContrastFocus = {
+        left: 1,
+        right: 1,
+        top: 1,
+        bottom: 1,
+    };
+    return {
+        root: [
+            classNames.root,
+            fonts.medium,
+            {
+                margin: '11px 0 1px',
+            },
+            className,
+        ],
+        list: [
+            classNames.list,
+            {
+                whiteSpace: 'nowrap',
+                padding: 0,
+                margin: 0,
+                display: 'flex',
+                alignItems: 'stretch',
+            },
+        ],
+        listItem: [
+            classNames.listItem,
+            {
+                listStyleType: 'none',
+                margin: '0',
+                padding: '0',
+                display: 'flex',
+                position: 'relative',
+                alignItems: 'center',
+                selectors: {
+                    '&:last-child .ms-Breadcrumb-itemLink': __assign(__assign({}, lastChildItemStyles), (_b = {}, _b[HighContrastSelector] = {
+                        MsHighContrastAdjust: 'auto',
+                        forcedColorAdjust: 'auto',
+                    }, _b)),
+                    '&:last-child .ms-Breadcrumb-item': lastChildItemStyles,
+                },
+            },
+        ],
+        chevron: [
+            classNames.chevron,
+            {
+                color: chevronButtonColor,
+                fontSize: fonts.small.fontSize,
+                selectors: (_c = {},
+                    _c[HighContrastSelector] = __assign({ color: 'WindowText' }, getHighContrastNoAdjustStyle()),
+                    _c[MediumScreenSelector] = {
+                        fontSize: chevronSmallFontSize,
+                    },
+                    _c[MinimumScreenSelector] = {
+                        fontSize: chevronSmallFontSize,
+                    },
+                    _c),
+            },
+        ],
+        overflow: [
+            classNames.overflow,
+            {
+                position: 'relative',
+                display: 'flex',
+                alignItems: 'center',
+            },
+        ],
+        overflowButton: [
+            classNames.overflowButton,
+            getFocusStyle(theme, { highContrastStyle: overflowButtonHighContrastFocus }),
+            SingleLineTextStyle,
+            {
+                fontSize: overflowButtonFontSize,
+                color: overflowButtonColor,
+                height: '100%',
+                cursor: 'pointer',
+                selectors: __assign(__assign({}, itemStateSelectors), (_d = {}, _d[MinimumScreenSelector] = {
+                    padding: '4px 6px',
+                }, _d[MediumScreenSelector] = {
+                    fontSize: fonts.mediumPlus.fontSize,
+                }, _d)),
+            },
+        ],
+        itemLink: [
+            classNames.itemLink,
+            getFocusStyle(theme),
+            SingleLineTextStyle,
+            __assign(__assign({}, commonItemStyles), { selectors: __assign((_e = { ':focus': {
+                            color: palette.neutralDark,
+                        } }, _e[".".concat(IsFocusVisibleClassName, " &:focus, :host(.").concat(IsFocusVisibleClassName, ") &:focus")] = {
+                    outline: "none",
+                }, _e), itemStateSelectors) }),
+        ],
+        item: [
+            classNames.item,
+            __assign(__assign({}, commonItemStyles), { selectors: {
+                    ':hover': {
+                        cursor: 'default',
+                    },
+                } }),
+        ],
+    };
+};
+//# sourceMappingURL=Breadcrumb.styles.js.map

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.types.d.ts

@@ -0,0 +1,175 @@
+import * as React from 'react';
+import type { IIconProps } from '../../Icon';
+import type { IRefObject, IRenderFunction, IComponentAs, IStyleFunctionOrObject } from '../../Utilities';
+import type { ITheme, IStyle } from '../../Styling';
+import type { IFocusZoneProps } from '../../FocusZone';
+import type { ITooltipHostProps } from '../../Tooltip';
+import type { IButtonProps } from '../../Button';
+/**
+ * {@docCategory Breadcrumb}
+ */
+export interface IBreadcrumbData {
+    props: IBreadcrumbProps;
+    renderedItems: IBreadcrumbItem[];
+    renderedOverflowItems: IBreadcrumbItem[];
+}
+/**
+ * {@docCategory Breadcrumb}
+ */
+export interface IBreadcrumb {
+    /**
+     * Sets focus to the first breadcrumb link.
+     */
+    focus(): void;
+}
+/**
+ * {@docCategory Breadcrumb}
+ */
+export interface IBreadcrumbProps extends React.HTMLAttributes<HTMLElement> {
+    /**
+     * Optional callback to access the `IBreadcrumb` interface. Use this instead of `ref` for accessing
+     * the public methods and properties of the component.
+     */
+    componentRef?: IRefObject<IBreadcrumb>;
+    /**
+     * Collection of breadcrumbs to render
+     */
+    items: IBreadcrumbItem[];
+    /**
+     * Optional class for the root breadcrumb element.
+     */
+    className?: string;
+    /**
+     * Render a custom divider in place of the default chevron `>`
+     */
+    dividerAs?: IComponentAs<IDividerAsProps>;
+    /**
+     * Render a custom overflow icon in place of the default icon `...`
+     */
+    onRenderOverflowIcon?: IRenderFunction<IButtonProps>;
+    /**
+     * Custom component for the overflow button.
+     */
+    overflowButtonAs?: IComponentAs<IButtonProps>;
+    /**
+     * The maximum number of breadcrumbs to display before coalescing.
+     * If not specified, all breadcrumbs will be rendered.
+     */
+    maxDisplayedItems?: number;
+    /** Custom render function to render each crumb. Default renders as a link. */
+    onRenderItem?: IRenderFunction<IBreadcrumbItem>;
+    /**
+     * Custom render function to render the content within a crumb. Default renders the text.
+     */
+    onRenderItemContent?: IRenderFunction<IBreadcrumbItem>;
+    /**
+     * Method that determines how to reduce the length of the breadcrumb.
+     * Return undefined to never reduce breadcrumb length.
+     */
+    onReduceData?: (data: IBreadcrumbData) => IBreadcrumbData | undefined;
+    /**
+     * Method that determines how to group the length of the breadcrumb.
+     * Return undefined to never increase breadcrumb length.
+     */
+    onGrowData?: (data: IBreadcrumbData) => IBreadcrumbData | undefined;
+    /**
+     * Aria label for the root element of the breadcrumb (which is a navigation landmark).
+     */
+    ariaLabel?: string;
+    /**
+     * Aria label for the overflow button.
+     */
+    overflowAriaLabel?: string;
+    /**
+     * Optional index where overflow items will be collapsed.
+     * @default 0
+     */
+    overflowIndex?: number;
+    styles?: IStyleFunctionOrObject<IBreadcrumbStyleProps, IBreadcrumbStyles>;
+    theme?: ITheme;
+    /**
+     * Extra props for the root FocusZone.
+     */
+    focusZoneProps?: IFocusZoneProps;
+    /**
+     * Extra props for the TooltipHost which wraps each breadcrumb item.
+     */
+    tooltipHostProps?: ITooltipHostProps;
+}
+/**
+ * {@docCategory Breadcrumb}
+ */
+export interface IBreadcrumbItem extends React.AllHTMLAttributes<HTMLElement> {
+    /**
+     * Text to display in the breadcrumb item.
+     */
+    text: string;
+    /**
+     * Arbitrary unique string associated with the breadcrumb item.
+     */
+    key: string;
+    /**
+     * Callback for when the breadcrumb item is selected.
+     */
+    onClick?: (ev?: React.MouseEvent<HTMLElement>, item?: IBreadcrumbItem) => void;
+    /**
+     * URL to navigate to when this breadcrumb item is clicked.
+     * If provided, the breadcrumb will be rendered as a link.
+     */
+    href?: string;
+    /**
+     * Whether this is the breadcrumb item the user is currently navigated to.
+     * If true, `aria-current="page"` will be applied to this breadcrumb item.
+     */
+    isCurrentItem?: boolean;
+    /**
+     * A function to render the outer content of the crumb (the link).
+     */
+    onRender?: IRenderFunction<IBreadcrumbItem>;
+    /**
+     * A function to render the inner content of the crumb (the text inside the link).
+     */
+    onRenderContent?: IRenderFunction<IBreadcrumbItem>;
+    /**
+     * Optional prop to render the item as a heading of your choice.
+     *
+     * You can also use this to force items to render as links instead of buttons (by default,
+     * any item with a `href` renders as a link, and any item without a `href` renders as a button).
+     * This is not generally recommended because it may prevent activating the link using the keyboard.
+     */
+    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'a';
+    /**
+     * Optional role for the breadcrumb item (which renders as a button by default)
+     */
+    role?: string;
+}
+/**
+ * {@docCategory Breadcrumb}
+ */
+export interface IDividerAsProps extends IIconProps {
+    /**
+     * Breadcrumb item to left of the divider to be passed for custom rendering.
+     * For overflowed items, it will be last item in the list.
+     */
+    item?: IBreadcrumbItem;
+}
+/**
+ * {@docCategory Breadcrumb}
+ */
+export interface IBreadcrumbStyleProps {
+    className?: string;
+    theme: ITheme;
+}
+/**
+ * {@docCategory Breadcrumb}
+ */
+export interface IBreadcrumbStyles {
+    root: IStyle;
+    list: IStyle;
+    listItem: IStyle;
+    chevron: IStyle;
+    overflow: IStyle;
+    overflowButton: IStyle;
+    itemLink: IStyle;
+    item: IStyle;
+}

node_modules/@fluentui/react/lib/components/Breadcrumb/Breadcrumb.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Breadcrumb.types.js.map

node_modules/@fluentui/react/lib/components/Breadcrumb/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Breadcrumb';
+export * from './Breadcrumb.base';
+export * from './Breadcrumb.types';

node_modules/@fluentui/react/lib/components/Breadcrumb/index.js

@@ -0,0 +1,4 @@
+export * from './Breadcrumb';
+export * from './Breadcrumb.base';
+export * from './Breadcrumb.types';
+//# sourceMappingURL=index.js.map

node_modules/@fluentui/react/lib/components/Breadcrumb/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Breadcrumb/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './Breadcrumb';\nexport * from './Breadcrumb.base';\nexport * from './Breadcrumb.types';\n"]}