import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import './Box.scss';
const Card = ({ cardProperties = {
    width: '200px',
    height: '200px',
    background: 'white',
    borderRadius: '16px',
    boxShadow: '1px 4px 8px var(--plugins-header-bg-color)',
    padding: '16px',
    margin: '0',
    border: 'none',
    className: '',
    style: {},
    onClick: () => { },
}, headerContent, midContent, footerContent, }) => {
    const { width, height, background, borderRadius, boxShadow, padding, margin, border, className = '', style = {}, } = cardProperties;
    return (_jsxs("section", { className: `ff-card ${className}`, style: {
            width,
            height,
            background,
            borderRadius,
            boxShadow,
            padding,
            margin,
            border,
            ...style,
        }, onClick: cardProperties.onClick, children: [headerContent?.isHeader && (_jsx("div", { className: "ff-card-header", children: headerContent.content })), midContent?.isMidContent && (_jsx("div", { className: "ff-card-content", children: midContent.content })), footerContent?.isFooter && (_jsx("div", { className: "ff-card-footer", children: footerContent.content }))] }));
};
export default Card;
//# sourceMappingURL=Box.js.map