spb/spb-cloud

1"use client";23import { HTMLAttributes } from "react";45interface CardProps extends HTMLAttributes<HTMLDivElement> {6  hover?: boolean;7  padding?: "none" | "sm" | "md" | "lg";8}910const paddings = { none: "", sm: "p-3", md: "p-4 sm:p-5", lg: "p-5 sm:p-6" };1112/** Carte standard du design system (surface + bordure + ombre douce). */13export default function Card({ hover, padding = "md", className = "", children, ...props }: CardProps) {14  return (15    <div className={`card ${hover ? "card-hover" : ""} ${paddings[padding]} ${className}`} {...props}>16      {children}17    </div>18  );19}2021export function CardTitle({ children, className = "", action }: { children: React.ReactNode; className?: string; action?: React.ReactNode }) {22  return (23    <div className={`flex items-center justify-between gap-3 mb-3 ${className}`}>24      <h2 className="text-[13px] font-semibold uppercase tracking-wider text-gray-500 dark:text-gray-400 flex items-center gap-2">{children}</h2>25      {action}26    </div>27  );28}29