24 lines
686 B
TypeScript
24 lines
686 B
TypeScript
import type { PropsWithChildren, ReactNode } from 'react'
|
|
|
|
type Props = PropsWithChildren<{
|
|
className?: string
|
|
title?: string
|
|
action?: ReactNode
|
|
}>
|
|
|
|
export function Card({ children, className = '', title, action }: Props) {
|
|
return (
|
|
<section
|
|
className={`rounded-2xl border border-line bg-panel p-5 shadow-[0_1px_2px_rgb(23_32_51/0.04)] transition hover:border-line-strong ${className}`}
|
|
>
|
|
{(title || action) && (
|
|
<div className="mb-4 flex items-center justify-between gap-3">
|
|
{title ? <h2 className="text-base font-semibold text-ink">{title}</h2> : <span />}
|
|
{action}
|
|
</div>
|
|
)}
|
|
{children}
|
|
</section>
|
|
)
|
|
}
|