type CardProps = {
  title?: React.ReactNode;
  children: React.ReactNode;
  actions?: React.ReactNode;
};

export default function Card({ title, children, actions }: CardProps) {
  return (
    <section className="card">
      {(title || actions) && (
        <header className="card-header">
          {title && (typeof title === "string" ? <h2>{title}</h2> : <div className="card-title-node">{title}</div>)}
          {actions && <div className="card-actions">{actions}</div>}
        </header>
      )}
      <div className="card-body">{children}</div>
    </section>
  );
}