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, { useMemo } from 'react';
import PropTypes from 'prop-types';
// MUI
import { Card, CardContent, useTheme, useMediaQuery, makeStyles, Slide } from '@material-ui/core';
//FLuent library
import { SubHeaderAction } from '../../utilities/utilityBar/SubHeaderAction';
import { FluentDialog } from '../feedback/FluentDialog';
import { LayoutUnit } from '../../layout/LayoutUnit';
import { AmbientGridTemplate } from '../templates/deprecated/AmbientGridTemplate/AmbientGridTemplate';
import { SideSheet } from '../surfaces/SideSheet';
import { HeaderExpander } from '../dataDisplay/HeaderExpander';
import { DraggableSidebarTemplate } from '../templates/DraggableSidebarTemplate';
import { AmbientToast } from '../feedback/AmbientToast';
import { AmbientAlert } from '../feedback/AmbientAlert';
const useStyles = makeStyles((theme) => ({
    root: {},
    cardDisplay: {
        marginBottom: theme.spacing(2)
    },
    padding: {
        padding: (props) => !props.noPadding && theme.spacing(1)
    },
    splitScreen: {
        width: '100%',
        height: '100%'
    }
}), { name: 'CoreLayoutFloorplan' });
export const CoreLayoutFloorplan = (props) => {
    const { PrimaryActionHeader, children, footer, gridData, groupData, columnDefinitions, expandedData, splitScreen, splitScreenContent, splitScreenWidth, setSplitScreenWidth, sideSheetTitle, sideSheetButton, sideSheetDisabled, sideSheetProgress, sideSheetOpen, setSideSheetOpen, setSideSheetClose, sideSheetContent, dialogActionOne, dialogActionTwo, dialogClose, dialogOpen, dialogTitle, dialogMessage, dialogLabelOne, dialogLabelTwo, notice, alertButton, alertMessage, alertType, closeNotice, noticeOpen, noticeAction, noticeType, noticeMessage, noticeButton, alertSeverity, showAlert, closeAlert, DialogLoadingvariant = 'determinate', disableDialogAction, compactHeader, headerExpanded, expanderLeftContainer, gridTemplateTitle, removePadding, removeHeader, hideSidebarButton, defaultAutoSize, hideGrid = false, useSubHeaderAction = true } = props, otherProps = __rest(props, ["PrimaryActionHeader", "children", "footer", "gridData", "groupData", "columnDefinitions", "expandedData", "splitScreen", "splitScreenContent", "splitScreenWidth", "setSplitScreenWidth", "sideSheetTitle", "sideSheetButton", "sideSheetDisabled", "sideSheetProgress", "sideSheetOpen", "setSideSheetOpen", "setSideSheetClose", "sideSheetContent", "dialogActionOne", "dialogActionTwo", "dialogClose", "dialogOpen", "dialogTitle", "dialogMessage", "dialogLabelOne", "dialogLabelTwo", "notice", "alertButton", "alertMessage", "alertType", "closeNotice", "noticeOpen", "noticeAction", "noticeType", "noticeMessage", "noticeButton", "alertSeverity", "showAlert", "closeAlert", "DialogLoadingvariant", "disableDialogAction", "compactHeader", "headerExpanded", "expanderLeftContainer", "gridTemplateTitle", "removePadding", "removeHeader", "hideSidebarButton", "defaultAutoSize", "hideGrid", "useSubHeaderAction"]);
    const theme = useTheme();
    const desktop = useMediaQuery(theme.breakpoints.up('sm'));
    const mobile = useMediaQuery(theme.breakpoints.down('sm'));
    const classes = useStyles(props);
    const actionHeader = useMemo(() => (React.createElement(React.Fragment, null, React.createElement(AmbientAlert, { alertMessage: alertMessage, alertButton: alertButton, alertSeverity: alertSeverity, showAlert: showAlert, closeAlert: closeAlert }), PrimaryActionHeader)), [
        alertMessage,
        alertButton,
        alertSeverity,
        showAlert,
        closeAlert,
        PrimaryActionHeader
    ]);
    return (React.createElement("div", null, React.createElement(DraggableSidebarTemplate, Object.assign({ width: splitScreenWidth, setWidth: setSplitScreenWidth, 
        // @todo: remove padding hack
        removePadding: removePadding, hide: hideSidebarButton }, otherProps, { body: React.createElement("div", null, React.createElement("div", null, !useSubHeaderAction && !!PrimaryActionHeader && (React.createElement(Card, { variant: "outlined" }, actionHeader)), useSubHeaderAction && !!PrimaryActionHeader && (React.createElement(SubHeaderAction, null, actionHeader)), !removeHeader && (React.createElement(HeaderExpander, { toggleLabel: "Data Visualization", sectionOpen: headerExpanded, compact: compactHeader, options: expanderLeftContainer }, React.createElement("div", { className: classes.padding }, " ", expandedData, " "))), !removeHeader && React.createElement(LayoutUnit, { unit: "xxs" }), children, !hideGrid && (React.createElement(AmbientGridTemplate, Object.assign({}, otherProps, { title: gridTemplateTitle, data: gridData, columnDefs: columnDefinitions, groupingData: groupData, defaultAutoSize: defaultAutoSize }))))), sidebar: React.createElement(Slide, { in: splitScreen && splitScreen, direction: "left" }, React.createElement("div", { style: { height: '100%' } }, splitScreen && (React.createElement("div", { className: classes.splitScreen }, React.createElement(Card, { square: true, style: { height: '100%' } }, React.createElement(CardContent, null, splitScreenContent)))))) })), React.createElement(SideSheet, { key: 'sideSheet', title: sideSheetTitle, width: !desktop ? 350 : 500, buttonLabel: sideSheetButton, open: sideSheetOpen, onClose: setSideSheetClose, disabled: sideSheetDisabled, progress: sideSheetProgress, buttonProgress: true, children: sideSheetContent }), React.createElement(FluentDialog, { title: dialogTitle, message: dialogMessage, labelOne: dialogLabelOne, actionOne: dialogActionOne, labelTwo: dialogLabelTwo, actionTwo: dialogActionTwo, open: dialogOpen, handleClose: dialogClose, progress: 20, variant: DialogLoadingvariant, disableTwo: disableDialogAction }), React.createElement(AmbientToast, { noticeType: noticeType, noticeMessage: noticeMessage, noticeButton: noticeButton, closeNotice: closeNotice, noticeOpen: noticeOpen, noticeAction: noticeAction, alertSeverity: alertSeverity }), footer));
};
CoreLayoutFloorplan.propTypes = {
    /**
     * Container to add Primary Action Header to page
     */
    PrimaryActionHeader: PropTypes.node,
    /**
     * Additional open area on page to add content. Adds a space above the grid area.
     */
    children: PropTypes.object,
    /**
     * Content that shows up in the split screen area.
     */
    splitScreenContent: PropTypes.node,
    /**
     * Data for AgGrid.
     */
    gridData: PropTypes.array,
    /**
     * Accepts an array of data to build out the buttons and functions to group data on the grid.
     */
    groupData: PropTypes.array,
    /**
     * Grid definitions to define keys for AgGrid.
     */
    columnDefinitions: PropTypes.arrayOf(PropTypes.object),
    /**
     * Content area for top expanded section.
     */
    expandedData: PropTypes.string,
    /**
     * shows or hides split screen (default: false)
     */
    splitScreen: PropTypes.string,
    /**
     * The width the split screen displays at.
     */
    splitScreenWidth: PropTypes.string,
    /**
     * To connect function to update state for split screen width.
     */
    setSplitScreenWidth: PropTypes.string,
    /**
     * Used to set side sheet title.
     */
    sideSheetTitle: PropTypes.string,
    /**
     * Lable for the side sheet action button.
     */
    sideSheetButton: PropTypes.string,
    /**
     * Disable Toggle for the side sheet button.
     */
    sideSheetDisabled: PropTypes.string,
    /**
     * Allows progress indication for the side sheet.
     */
    sideSheetProgress: PropTypes.number,
    /**
     * When true sets the side sheet open (default: false)
     */
    sideSheetOpen: PropTypes.bool,
    /**
     * State function to set the side sheet state true or false.
     */
    setSideSheetOpen: PropTypes.string,
    /**
     * Function to set the side sheet closed.
     */
    setSideSheetClose: PropTypes.string,
    /**
     * Content that displays in the side sheet.
     */
    setSideSheetContent: PropTypes.string,
    /**
     * Action for the first button in the dialog.
     */
    dialogActionOne: PropTypes.string,
    /**
     * Action for the second button in the dialog.
     */
    dialogActionTwo: PropTypes.string,
    /**
     * Function to canel open dialog.
     */
    dialogClose: PropTypes.string,
    /**
     * If true will cause the dialog to open.
     */
    dialogOpen: PropTypes.string,
    /**
     * Main title of the dialog.
     */
    dialogTitle: PropTypes.string,
    /**
     * Dialog message.
     */
    dialogMessage: PropTypes.string,
    /**
     * Label for first button of dialog.
     */
    dialogLabelOne: PropTypes.string,
    /**
     * Label for second button of dialog.
     */
    dialogLableTwo: PropTypes.string,
    /**
     * If true will display the notice message.
     */
    notice: PropTypes.string,
    /**
     * Label for alert button.
     */
    alertButton: PropTypes.string,
    /**
     * Message that displays in alert.
     */
    alertMessage: PropTypes.string,
    /**
     * Sets the severity of the alert (info, warning, error, success).
     */
    alertType: PropTypes.string,
    /**
     * Function to close notice.
     */
    closeNotice: PropTypes.string,
    /**
     * If true the notice will be displayed.
     */
    noticeOpen: PropTypes.string,
    /**
     * Optional action assigned to notice.
     */
    noticeAction: PropTypes.string,
    /**
     * The type of notice: error, warning, success, info (toast).
     */
    noticeType: PropTypes.string,
    /**
     * The message contained in the notice (toast).
     */
    noticeMessage: PropTypes.string,
    /**
     * The label for the notice button (toast).
     */
    noticeButton: PropTypes.string,
    /**
     * Sets the severity of the alert (info, warning, error, success).
     */
    alertSeverity: PropTypes.string,
    /**
     * If true the alert will display.
     */
    showAlert: PropTypes.string,
    /**
     * Function to close alert.
     */
    closeAlert: PropTypes.string,
    /**
     * Sets the type of the progress indicator for the dialog.
     */
    DialogLoadingvariant: PropTypes.string,
    /**
     * sets the action button on the dialog to disabled.
     */
    disableDialogAction: PropTypes.string,
    /**
     * Allows for a smaller tab version of the expandable drawer.
     */
    compactHeader: PropTypes.string,
    /**
     * If true, the header expander will be open (default: true)
     */
    headerExpanded: PropTypes.string,
    /**
     * Section in expander to allow for additional content within the tab area.
     */
    expanderLeftContainer: PropTypes.string,
    /**
     * Sets the grid default to expaned size if true. The default is 'size to fit'.
     */
    defaultAutoSize: PropTypes.bool,
    /**
     * Sets the teleporter for primary action header if it's true
     */
    useSubHeaderAction: PropTypes.bool
};
//# sourceMappingURL=CoreLayoutFloorplan.js.map