"use strict";
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)
            t[p[i]] = s[p[i]];
    return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
    result["default"] = mod;
    return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
// TODO @grsmto: might be worth migrating to react-pose once https://github.com/reach/reach-ui/issues/126 is fixed
const renderprops_1 = require("react-spring/renderprops");
const ModalBase_1 = require("../ModalBase");
const Header_1 = require("./Header");
const Body_1 = require("./Body");
const Footer_1 = require("./Footer");
const sc = __importStar(require("./styles"));
const icons_1 = require("../../assets/images/icons");
exports.ModalComponent = (_a) => {
    var { children, isOpen: isOpenProps, onClose, isCloseable, isCentered, status, maxWidth, scroll } = _a, otherProps = __rest(_a, ["children", "isOpen", "onClose", "isCloseable", "isCentered", "status", "maxWidth", "scroll"]);
    const handleCloseRequest = () => {
        if (!isCloseable) {
            return;
        }
        if (onClose) {
            onClose();
        }
    };
    return (react_1.default.createElement(ModalBase_1.ModalBase, { isOpen: isOpenProps, onClose: onClose, isCentered: isCentered },
        react_1.default.createElement(renderprops_1.Transition, { native: true, items: isOpenProps, from: { opacity: 0 }, enter: { opacity: 1 }, leave: { opacity: 0 } }, isOpen => isOpen &&
            (styles => (react_1.default.createElement(sc.Container, { style: styles },
                react_1.default.createElement(sc.Dialog, Object.assign({ scroll: scroll, status: status, maxWidth: maxWidth, boxShadow: 3, p: 0 }, otherProps),
                    !!status && react_1.default.createElement(sc.StatusBar, { status: status }),
                    isCloseable && (react_1.default.createElement(sc.CloseButton, { Asset: icons_1.SvgClose, onClick: handleCloseRequest, height: 44, width: 44, color: "gray.2", scale: 0.62 })),
                    children)))))));
};
exports.ModalComponent.defaultProps = Object.assign({}, ModalBase_1.ModalBase.defaultProps, { maxWidth: 'm', scroll: 'body' });
exports.Modal = Object.assign(exports.ModalComponent, {
    defaultProps: exports.ModalComponent.defaultProps,
    Header: Header_1.Header,
    Body: Body_1.Body,
    Footer: Footer_1.Footer,
});
//# sourceMappingURL=Modal.js.map