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 { MoreIcon } from '@fluentui/react-icons';
import { Button, makeStyles, Menu } from '@material-ui/core';
import clsx from 'clsx';
import React, { forwardRef } from 'react';
import { FluentIcon } from '../../../../utilities/iconLibrary/FluentIcon';
import FUICardHeader from './FUICardHeader';
import FUISquareIconButton from '../../../inputs/buttons/FUISquareIconButton';
import { FluentCard } from './FluentCard';
import { FluentCardContent } from './FluentCardContent';
import { FluentCardActions } from './FluentCardActions';
import useId from '../../../widgets/utils/useId';
const useStyles = makeStyles((theme) => ({
    root: {
        display: 'flex',
        flexDirection: 'column'
    },
    raised: {
        zIndex: 1
    },
    contentArea: {
        flex: '1 1 auto',
        minHeight: 0,
        display: 'flex',
        flexDirection: 'column'
    },
    cardActions: {
        display: 'flex',
        flexDirection: 'row',
        justifyContent: 'flex-start',
        paddingTop: theme.spacing(1),
        padding: theme.spacing(2)
    }
}), { name: 'FUICard' });
export let FUICardAction = (props, ref) => {
    const { children } = props, other = __rest(props, ["children"]);
    return (React.createElement(Button, Object.assign({ ref: ref, size: "small", variant: "contained", disableElevation: true }, other), children));
};
FUICardAction = forwardRef(FUICardAction);
export let FUICardHeaderMenu = (props, ref) => {
    const { children } = props;
    return (React.createElement("div", { button: React.createElement(FUISquareIconButton, null, React.createElement(FluentIcon, { component: MoreIcon, size: "small" })), menu: React.createElement(Menu, null, children) }));
};
FUICardHeaderMenu = forwardRef(FUICardHeaderMenu);
const FUICard = (props, ref) => {
    const classes = useStyles();
    const { className, children, actions, title, headerActions, CardHeaderProps, CardProps, raised, name } = props, cardProps = __rest(props, ["className", "children", "actions", "title", "headerActions", "CardHeaderProps", "CardProps", "raised", "name"]);
    const id = useId(name, cardProps.id);
    const titleId = `${id}-title`;
    return (React.createElement(FluentCard, Object.assign({ ref: ref, component: "section", "aria-labelledby": titleId }, cardProps, { raised: raised, className: clsx(className, raised && classes.raised) }, CardProps, { classes: { root: classes.root } }), React.createElement(FUICardHeader, Object.assign({ titleId: titleId, headerActions: headerActions }, CardHeaderProps), title), React.createElement(FluentCardContent, { className: classes.contentArea }, children), actions && (React.createElement(FluentCardActions, { className: classes.cardActions }, actions))));
};
export default forwardRef(FUICard);
//# sourceMappingURL=FUICard.js.map