@pnp/spfx-controls-react/lib-commonjs/controls/shareDialog/renderDialog/RenderDialog.js

Reusable React controls for SharePoint Framework solutions

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.RenderDialog = void 0;
var tslib_1 = require("tslib");
/* eslint-disable @typescript-eslint/explicit-function-return-type */
var React = tslib_1.__importStar(require("react"));
var css_1 = require("@emotion/css");
var react_components_1 = require("@fluentui/react-components");
var DEFAULT_MIN_WIDTH = 200;
var DEFAULT_MIN_HEIGHT = 200;
var useStyles = function (props) {
    var styles = {
        dialog: (0, css_1.css)({
            width: "100%",
            height: "100%",
            overflow: "hidden",
            maxHeight: "600px",
            padding: 0,
        }),
        dialogBody: (0, css_1.css)({
            height: "calc(100% - 200px)",
        }),
    };
    return { styles: styles };
};
var RenderDialog = function (props) {
    var isOpen = props.isOpen, dialogTitle = props.dialogTitle, dialogActions = props.dialogActions, children = props.children, maxWidth = props.maxWidth, className = props.className, minHeight = props.minHeight, minWidth = props.minWidth, maxHeight = props.maxHeight;
    var styles = useStyles(props).styles;
    if (!isOpen)
        return React.createElement(React.Fragment, null);
    return (React.createElement(react_components_1.Dialog, { open: isOpen, modalType: "modal" },
        React.createElement(react_components_1.DialogSurface, { className: (0, css_1.css)(styles.dialog, className), style: {
                maxWidth: maxWidth,
                minWidth: minWidth !== null && minWidth !== void 0 ? minWidth : DEFAULT_MIN_WIDTH,
                minHeight: minHeight !== null && minHeight !== void 0 ? minHeight : DEFAULT_MIN_HEIGHT,
                height: "fit-content",
                maxHeight: maxHeight !== null && maxHeight !== void 0 ? maxHeight : "",
            } },
            React.createElement(react_components_1.DialogTitle, null, dialogTitle),
            React.createElement(react_components_1.DialogBody, { className: styles.dialogBody },
                React.createElement(react_components_1.DialogContent, null, children)),
            React.createElement(react_components_1.DialogActions, { fluid: true, position: "end" }, dialogActions))));
};
exports.RenderDialog = RenderDialog;
//# sourceMappingURL=RenderDialog.js.map