"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ActionDialog = exports.useStyles = exports.DialogActions = exports.DialogTitle = exports.Dialog = void 0;
var react_1 = __importDefault(require("react"));
var material_1 = require("@mui/material");
var styles_1 = require("@mui/styles");
var react_fontawesome_1 = require("@fortawesome/react-fontawesome");
var pro_regular_svg_icons_1 = require("@fortawesome/pro-regular-svg-icons");
var DialogTitle_1 = __importDefault(require("@mui/material/DialogTitle"));
var DialogActions_1 = __importDefault(require("@mui/material/DialogActions"));
var Dialog_1 = __importDefault(require("@mui/material/Dialog"));
var Button_1 = require("../Button/Button");
var Flex_1 = require("../Flex");
var colors_1 = require("../../base/colors");
var text_1 = require("../../base/text");
exports.Dialog = styles_1.withStyles(function (theme) { return ({
    root: {
        padding: theme.spacing(2),
    },
}); })(Dialog_1.default);
exports.DialogTitle = styles_1.withStyles(function (theme) { return ({
    root: {
        "& h4": {
            fontWeight: 700,
            fontSize: "1.125rem",
            margin: 0,
            marginTop: theme.spacing(1),
            color: colors_1.text.primary,
        },
        "& p": {
            marginTop: theme.spacing(1),
            marginBottom: theme.spacing(1),
            color: colors_1.text.secondary,
            fontFamily: text_1.fontFamily.text,
            fontSize: "0.875rem",
            lineHeight: "144%",
            fontWeight: 400,
        },
    },
}); })(DialogTitle_1.default);
exports.DialogActions = styles_1.withStyles(function (theme) { return ({
    root: {
        margin: theme.spacing(3),
        marginTop: theme.spacing(1),
        padding: theme.spacing(0),
        paddingTop: theme.spacing(2.5),
        borderTop: "1px solid " + colors_1.grey.light,
    },
}); })(DialogActions_1.default);
exports.useStyles = styles_1.makeStyles(function () {
    return styles_1.createStyles({
        close: {
            backgroundColor: "#fff",
            color: colors_1.green.standard,
            width: 36,
            height: 36,
            fontSize: 16,
            borderRadius: 4,
            border: "1px solid " + colors_1.green.standard,
            boxSizing: "border-box",
            "&:hover": {
                backgroundColor: colors_1.grey.subtle,
                border: "1px solid " + colors_1.grey.light,
            },
        },
        header: {
            color: "white",
            fontSize: "1rem",
            lineHeight: "1rem",
            fontWeight: 700,
            marginBottom: 10,
        },
    });
});
function ActionDialog(_a) {
    var open = _a.open, onClose = _a.onClose, _b = _a.maxWidth, maxWidth = _b === void 0 ? "md" : _b, header = _a.header, _c = _a.subHeader, subHeader = _c === void 0 ? "" : _c, _d = _a.submitText, submitText = _d === void 0 ? "Save" : _d, _e = _a.buttonColor, buttonColor = _e === void 0 ? "primary" : _e, _f = _a.buttonIcon, buttonIcon = _f === void 0 ? null : _f, _g = _a.banner, banner = _g === void 0 ? null : _g, handleSubmit = _a.handleSubmit, _h = _a.submitWarning, submitWarning = _h === void 0 ? false : _h, _j = _a.isSubmitting, isSubmitting = _j === void 0 ? false : _j, _k = _a.submitDisabled, submitDisabled = _k === void 0 ? false : _k, _l = _a.dialogActionsBanner, dialogActionsBanner = _l === void 0 ? null : _l, children = _a.children;
    var classes = exports.useStyles();
    return (react_1.default.createElement(exports.Dialog, { open: open, onClose: onClose, maxWidth: maxWidth, fullWidth: true },
        react_1.default.createElement(Flex_1.Flex, { column: true, p: 2 },
            react_1.default.createElement(Flex_1.Flex, { justifyContent: "space-between" },
                react_1.default.createElement(Flex_1.Flex, { column: true },
                    react_1.default.createElement(exports.DialogTitle, null,
                        react_1.default.createElement("h4", null, header),
                        react_1.default.createElement("p", null, subHeader)),
                    banner),
                react_1.default.createElement(material_1.Box, null,
                    react_1.default.createElement(material_1.IconButton, { "aria-label": "close", className: classes.close, onClick: onClose, size: "large" },
                        react_1.default.createElement(react_fontawesome_1.FontAwesomeIcon, { icon: pro_regular_svg_icons_1.faTimes })))),
            react_1.default.createElement(material_1.DialogContent, null, children),
            react_1.default.createElement(exports.DialogActions, { className: "spec-dialog-actions" },
                react_1.default.createElement(Flex_1.Flex, { flexGrow: 2 }, dialogActionsBanner),
                react_1.default.createElement(Button_1.SaveOrCancelButtons, { variant: submitWarning ? "warning" : "standard", saveLabel: submitText, saveColor: buttonColor, saveIcon: buttonIcon, size: "medium", onCancel: function () {
                        onClose === null || onClose === void 0 ? void 0 : onClose();
                    }, onSave: function () { return handleSubmit === null || handleSubmit === void 0 ? void 0 : handleSubmit(); }, saveDisabled: submitDisabled, isSaving: isSubmitting })))));
}
exports.ActionDialog = ActionDialog;
//# sourceMappingURL=ActionDialog.js.map