@pagamio/frontend-commons-lib
Version:
Pagamio library for Frontend reusable components like the form engine and table container
7 lines (6 loc) • 1.19 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import Button from './Button';
const Card = ({ title, description, children, className = '', showButton, buttonText, buttonVariant = 'primary', handleButtonClick, headerElement, }) => {
return (_jsxs("div", { className: `bg-white border rounded-[10px] shadow-sm ${className}`, children: [(title || description || showButton || headerElement) && (_jsx("div", { className: "p-6", children: _jsxs("div", { className: "flex flex-col sm:flex-row sm:justify-between sm:items-start gap-4", children: [_jsxs("div", { children: [title && (_jsx("h2", { className: "text-[1.5rem] font-semibold leading-[1] tracking-[-0.025em] text-gray-900", children: title })), description && _jsx("p", { className: "mt-2 text-[0.875rem] leading-[1.25rem] text-gray-600", children: description })] }), headerElement && _jsx("div", { children: headerElement }), showButton && (_jsx("div", { children: _jsx(Button, { onClick: handleButtonClick, variant: buttonVariant, className: buttonVariant, style: { height: 39 }, children: buttonText ?? 'Add' }) }))] }) })), _jsx("div", { className: "p-6 pt-0", children: children })] }));
};
export default Card;