var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import React from 'react';
import { makeStyles, lighten, Badge } from '@material-ui/core';
import Tab from '@material-ui/core/Tab';
const useStyles = makeStyles((theme) => ({
    root: {
        textTransform: 'none',
        minWidth: 52,
        padding: 0,
        paddingLeft: props => !props.left ? theme.spacing(4) : theme.spacing(2),
        paddingRight: props => !props.left ? theme.spacing(4) : theme.spacing(8),
        fontWeight: theme.typography.fontWeightRegular,
        background: (props) => props.block && lighten(theme.palette.primary.main, 0.7),
        zIndex: 9,
        borderRight: (props) => props.block && '1px solid rgb(138 135 135)',
        marginRight: (props) => (props.block ? 0 : theme.spacing(2)),
        '&:hover': {
            background: (props) => props.block && lighten(theme.palette.primary.main, 0.6)
            // opacity: 1,
        },
        '&$selected': {},
        '&:focus': {}
    },
    wrapper: {
        flexDirection: 'row',
        zIndex: theme.zIndex.appBar
    },
    labelIcon: {
        minHeight: 45
    }
    // selected: {
    //   color: "white",
    //   display: "none",
    // },
}));
export const FluentSimpleTab = (props) => {
    const { value, onChange, label, icon, className, badgeContent } = props, otherProps = __rest(props, ["value", "onChange", "label", "icon", "className", "badgeContent"]);
    const classes = useStyles(props);
    return (React.createElement(Tab, Object.assign({ id: 'udpRecord-FluentSimpleTab-' + label + '-' + value, udprecordid: 'udpRecord-FluentSimpleTab-' + label + '-' + value, icon: icon && React.createElement("div", { style: { paddingRight: 10 } }, icon), value: value, onChange: onChange }, otherProps, { label: badgeContent ? React.createElement(Badge, Object.assign({}, otherProps), label) : label, className: className, classes: {
            root: classes.root,
            wrapper: classes.wrapper,
            labelIcon: classes.labelIcon,
            selected: classes.selected
        } })));
};
//# sourceMappingURL=FluentSimpleTab.js.map