"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Styling_1 = require("../../../Styling");
var PersonaConsts_1 = require("../PersonaConsts");
var GlobalClassNames = {
    coin: 'ms-Persona-coin',
    imageArea: 'ms-Persona-imageArea',
    image: 'ms-Persona-image',
    initials: 'ms-Persona-initials',
    size8: 'ms-Persona--size8',
    size10: 'ms-Persona--size10',
    size16: 'ms-Persona--size16',
    size24: 'ms-Persona--size24',
    size28: 'ms-Persona--size28',
    size32: 'ms-Persona--size32',
    size40: 'ms-Persona--size40',
    size48: 'ms-Persona--size48',
    size56: 'ms-Persona--size56',
    size72: 'ms-Persona--size72',
    size100: 'ms-Persona--size100',
    size120: 'ms-Persona--size120'
};
exports.getStyles = function (props) {
    var _a;
    var className = props.className, theme = props.theme, coinSize = props.coinSize;
    var palette = theme.palette, fonts = theme.fonts;
    var size = PersonaConsts_1.sizeBoolean(props.size);
    var classNames = Styling_1.getGlobalClassNames(GlobalClassNames, theme);
    // Static colors used when displaying 'unknown persona' coin
    var unknownPersonaBackgroundColor = 'rgb(234, 234, 234)';
    var unknownPersonaFontColor = 'rgb(168, 0, 0)';
    var dimension = coinSize || (props.size && PersonaConsts_1.sizeToPixels[props.size]) || 48;
    return {
        coin: [
            classNames.coin,
            fonts.medium,
            size.isSize8 && classNames.size8,
            size.isSize10 && classNames.size10,
            size.isSize16 && classNames.size16,
            size.isSize24 && classNames.size24,
            size.isSize28 && classNames.size28,
            size.isSize32 && classNames.size32,
            size.isSize40 && classNames.size40,
            size.isSize48 && classNames.size48,
            size.isSize56 && classNames.size56,
            size.isSize72 && classNames.size72,
            size.isSize100 && classNames.size100,
            size.isSize120 && classNames.size120,
            className
        ],
        size10WithoutPresenceIcon: {
            fontSize: fonts.xSmall.fontSize,
            position: 'absolute',
            top: '5px',
            right: 'auto',
            left: 0
        },
        imageArea: [
            classNames.imageArea,
            {
                position: 'relative',
                textAlign: 'center',
                flex: '0 0 auto',
                height: dimension,
                width: dimension
            },
            dimension <= 10 && {
                overflow: 'visible',
                background: 'transparent',
                height: 0,
                width: 0
            }
        ],
        image: [
            classNames.image,
            {
                marginRight: '10px',
                position: 'absolute',
                top: 0,
                left: 0,
                width: '100%',
                height: '100%',
                border: 0,
                borderRadius: '50%',
                perspective: '1px'
            },
            dimension <= 10 && {
                overflow: 'visible',
                background: 'transparent',
                height: 0,
                width: 0
            },
            dimension > 10 && {
                height: dimension,
                width: dimension
            }
        ],
        initials: [
            classNames.initials,
            {
                borderRadius: '50%',
                color: props.showUnknownPersonaCoin ? unknownPersonaFontColor : palette.white,
                fontSize: fonts.large.fontSize,
                fontWeight: Styling_1.FontWeights.semibold,
                lineHeight: dimension === 48 ? 46 : dimension,
                height: dimension,
                selectors: (_a = {},
                    _a[Styling_1.HighContrastSelector] = {
                        border: '1px solid WindowText',
                        MsHighContrastAdjust: 'none',
                        color: 'WindowText',
                        boxSizing: 'border-box',
                        backgroundColor: 'Window !important'
                    },
                    _a.i = {
                        fontWeight: Styling_1.FontWeights.semibold
                    },
                    _a)
            },
            props.showUnknownPersonaCoin && {
                backgroundColor: unknownPersonaBackgroundColor
            },
            dimension < 32 && {
                fontSize: fonts.xSmall.fontSize
            },
            dimension >= 32 &&
                dimension < 40 && {
                fontSize: fonts.medium.fontSize
            },
            dimension >= 40 &&
                dimension < 56 && {
                fontSize: fonts.mediumPlus.fontSize
            },
            dimension >= 56 &&
                dimension < 72 && {
                fontSize: fonts.xLarge.fontSize
            },
            dimension >= 72 &&
                dimension < 100 && {
                fontSize: fonts.xxLarge.fontSize
            },
            dimension >= 100 && {
                fontSize: fonts.superLarge.fontSize
            }
        ]
    };
};
//# sourceMappingURL=PersonaCoin.styles.js.map