define(["require", "exports", "../../Styling", "../../Utilities"], function (require, exports, Styling_1, Utilities_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var SingleLineTextStyle = {
        whiteSpace: 'nowrap',
        textOverflow: 'ellipsis',
        overflow: 'hidden'
    };
    var MinimumScreenSelector = Styling_1.getScreenSelector(0, Styling_1.ScreenWidthMaxSmall);
    var MediumScreenSelector = Styling_1.getScreenSelector(Styling_1.ScreenWidthMinMedium, Styling_1.ScreenWidthMaxMedium);
    exports.getStyles = function (props) {
        var className = props.className, theme = props.theme;
        var overflowButtonFontSize = 16;
        var itemMaxWidth = 160;
        var itemMaxWidthSmall = 116;
        var chevronSmallFontSize = 8;
        return {
            root: [
                'ms-Breadcrumb',
                theme.fonts.medium,
                {
                    margin: '23px 0 1px'
                },
                className
            ],
            list: [
                'ms-Breadcrumb-list',
                {
                    whiteSpace: 'nowrap',
                    padding: 0,
                    margin: 0,
                    display: 'flex',
                    alignItems: 'stretch'
                }
            ],
            listItem: [
                'ms-Breadcrumb-listItem',
                {
                    listStyleType: 'none',
                    margin: '0',
                    padding: '0',
                    display: 'flex',
                    position: 'relative',
                    alignItems: 'center'
                }
            ],
            chevron: [
                'ms-Breadcrumb-chevron',
                {
                    color: theme.palette.neutralSecondary,
                    fontSize: theme.fonts.small.fontSize,
                    selectors: (_a = {},
                        _a[Styling_1.HighContrastSelector] = {
                            color: 'WindowText',
                            MsHighContrastAdjust: 'none'
                        },
                        _a[MediumScreenSelector] = {
                            fontSize: chevronSmallFontSize
                        },
                        _a[MinimumScreenSelector] = {
                            fontSize: chevronSmallFontSize
                        },
                        _a)
                }
            ],
            overflow: [
                'ms-Breadcrumb-overflow',
                {
                    position: 'relative',
                    display: 'flex',
                    alignItems: 'center'
                }
            ],
            overflowButton: [
                'ms-Breadcrumb-overflowButton',
                Styling_1.getFocusStyle(theme),
                SingleLineTextStyle,
                {
                    fontSize: overflowButtonFontSize,
                    height: '100%',
                    cursor: 'pointer',
                    selectors: (_b = {
                            ':hover': {
                                backgroundColor: theme.palette.neutralLighter
                            },
                            ':active': {
                                backgroundColor: theme.palette.neutralTertiaryAlt,
                                color: theme.semanticColors.bodyText
                            },
                            ':hover:active': {
                                // This seems unnecessary.
                                backgroundColor: theme.palette.neutralQuaternary
                            }
                        },
                        _b[MinimumScreenSelector] = {
                            padding: '4px 6px'
                        },
                        _b[MediumScreenSelector] = {
                            fontSize: theme.fonts.mediumPlus.fontSize
                        },
                        _b)
                }
            ],
            itemLink: [
                'ms-Breadcrumb-itemLink',
                Styling_1.getFocusStyle(theme),
                SingleLineTextStyle,
                theme.fonts.xLarge,
                {
                    textDecoration: 'none',
                    color: theme.semanticColors.bodyText,
                    padding: '0 8px',
                    maxWidth: itemMaxWidth,
                    selectors: (_c = {
                            ':hover': {
                                backgroundColor: theme.semanticColors.menuItemBackgroundHovered,
                                color: 'initial',
                                cursor: 'pointer',
                                selectors: (_d = {},
                                    _d[Styling_1.HighContrastSelector] = {
                                        color: 'Highlight'
                                    },
                                    _d)
                            },
                            ':focus': {
                                color: theme.palette.neutralDark
                            },
                            ':active': {
                                backgroundColor: theme.palette.neutralTertiaryAlt,
                                color: theme.palette.neutralPrimary
                            }
                        },
                        _c[MediumScreenSelector] = theme.fonts.large,
                        _c[MinimumScreenSelector] = [
                            theme.fonts.medium,
                            {
                                maxWidth: itemMaxWidthSmall
                            }
                        ],
                        _c["." + Utilities_1.IsFocusVisibleClassName + " &:focus"] = {
                            outline: "none"
                        },
                        _c)
                }
            ],
            item: [
                'ms-Breadcrumb-item',
                theme.fonts.xLarge,
                {
                    color: theme.semanticColors.bodyText,
                    padding: '0 8px',
                    maxWidth: itemMaxWidth,
                    selectors: {
                        ':hover': {
                            cursor: 'default'
                        }
                    }
                }
            ]
        };
        var _a, _b, _c, _d;
    };
});
//# sourceMappingURL=Breadcrumb.styles.js.map