28 lines
665 B
React
28 lines
665 B
React
|
export function WidgetCard({
|
||
|
|
title,
|
||
|
|
subtitle,
|
||
|
|
actions,
|
||
|
|
variant,
|
||
|
|
children,
|
||
|
|
className = '',
|
||
|
|
footer,
|
||
|
|
}) {
|
||
|
|
return (
|
||
|
|
<section
|
||
|
|
className={`card widget-card${variant ? ` card--${variant}` : ''} ${className}`.trim()}
|
||
|
|
>
|
||
|
|
{(title || actions) && (
|
||
|
|
<header className="card-header">
|
||
|
|
<div>
|
||
|
|
{title && <h3 className="card-title">{title}</h3>}
|
||
|
|
{subtitle && <p className="card-subtitle">{subtitle}</p>}
|
||
|
|
</div>
|
||
|
|
{actions}
|
||
|
|
</header>
|
||
|
|
)}
|
||
|
|
<div className="card-body">{children}</div>
|
||
|
|
{footer && <footer className="card-footer">{footer}</footer>}
|
||
|
|
</section>
|
||
|
|
)
|
||
|
|
}
|