import React from 'react';
import { makeStyles, Typography } from '@material-ui/core';
import { FluentIconButton } from '../inputs/buttons/FluentIconButton';
import { ChromeCloseIcon } from '@fluentui/react-icons';
const useStyles = makeStyles((theme) => ({
    root: {
        display: 'flex',
        flexDirection: 'row',
        padding: theme.spacing(2)
    },
    title: {
        flex: 1
    }
}));
const ExtendedHeader = (props) => {
    const classes = useStyles();
    const { toggle, title } = props;
    return (React.createElement("div", { className: classes.root }, React.createElement(Typography, { variant: "h6", className: classes.title }, title), React.createElement(FluentIconButton, { className: classes.extendedButton, onClick: toggle, color: "primary", icon: ChromeCloseIcon })));
};
export default ExtendedHeader;
//# sourceMappingURL=ExtendedHeader.js.map