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, CircularProgress } from '@material-ui/core';
import { StandardTitle } from './StandardTitle';
import { FluentIconButton } from '../../inputs/buttons/FluentIconButton';
import { FluentButton } from '../../inputs/buttons/FluentButton';
import { ChromeCloseIcon } from '@fluentui/react-icons';
import { FluentIcon } from '../../../utilities/iconLibrary/FluentIcon';
const useStyles = makeStyles((theme) => {
    var _a;
    return ({
        root: {
            display: 'flex',
            flexDirection: 'row',
            padding: theme.spacing(1),
            paddingLeft: 0,
            background: ((_a = theme === null || theme === void 0 ? void 0 : theme.getThemeData()) === null || _a === void 0 ? void 0 : _a.mode) === 'dark'
                ? theme.palette.grey[800]
                : theme.palette.common.white,
            position: ({ isSticky }) => (isSticky ? 'sticky' : 'relative'),
            top: ({ isSticky }) => (isSticky ? 0 : 'auto'),
            zIndex: ({ isSticky }) => (isSticky ? 1200 : 'auto')
        },
        title: {
            display: 'flex',
            flex: 1,
            alignItems: 'center',
            marginLeft: theme.spacing(1.5)
        },
        actionButton: {
            marginRight: theme.spacing(1),
            position: 'relative'
        },
        fabProgress: {
            position: 'absolute',
            top: 4,
            left: '35%',
            zIndex: 1
        }
    });
});
export const SideSheetHeader = (_a) => {
    var { isSticky = false } = _a, props = __rest(_a, ["isSticky"]);
    const classes = useStyles({ isSticky });
    const { title, onClose, buttonLabel, onSubmit, buttonProgress, buttonTwoLabel, buttonTwoIcon, buttonTwoAction, buttonTwoProgress, id, udprecordid = '', buttonOneDisabled, buttonTwoDisabled } = props, otherProps = __rest(props, ["title", "onClose", "buttonLabel", "onSubmit", "buttonProgress", "buttonTwoLabel", "buttonTwoIcon", "buttonTwoAction", "buttonTwoProgress", "id", "udprecordid", "buttonOneDisabled", "buttonTwoDisabled"]);
    return (React.createElement("div", { className: classes.root }, React.createElement("div", { className: classes.title }, React.createElement(FluentIconButton, { id: id + '-Close', udprecordid: udprecordid + '-Close', icon: ChromeCloseIcon, onClick: onClose, "aria-label": "Close Panel" }), React.createElement(StandardTitle, { className: classes.title }, title)), buttonTwoLabel && (React.createElement("div", null, React.createElement(FluentButton
    // variant='contained'
    , Object.assign({ 
        // variant='contained'
        color: "secondary", onClick: buttonTwoAction, disabled: buttonTwoDisabled }, otherProps), buttonTwoProgress && (React.createElement(CircularProgress, { size: 24, color: "secondary", className: classes.fabProgress })), buttonTwoIcon && (React.createElement(FluentIcon, { size: "small", component: buttonTwoIcon, style: { marginRight: 8 } })), buttonTwoLabel))), buttonLabel && (React.createElement("div", { className: classes.actionButton }, React.createElement(FluentButton, Object.assign({ id: id + '-CreateView', udprecordid: udprecordid + '-CreateView', variant: "contained", color: "secondary", onClick: onSubmit, disabled: buttonOneDisabled }, otherProps), buttonProgress && (React.createElement(CircularProgress, { id: id + '-ButtonProgress', udprecordid: udprecordid + '-ButtonProgress', size: 24, color: "secondary", className: classes.fabProgress })), buttonLabel)))));
};
//# sourceMappingURL=SideSheetHeader.js.map