card.tsx 569 B

12345678910111213141516171819202122
  1. import { type ComponentProps, splitProps } from "solid-js"
  2. export interface CardProps extends ComponentProps<"div"> {
  3. variant?: "normal" | "error" | "warning" | "success" | "info"
  4. }
  5. export function Card(props: CardProps) {
  6. const [split, rest] = splitProps(props, ["variant", "class", "classList"])
  7. return (
  8. <div
  9. {...rest}
  10. data-component="card"
  11. data-variant={split.variant || "normal"}
  12. classList={{
  13. ...(split.classList ?? {}),
  14. [split.class ?? ""]: !!split.class,
  15. }}
  16. >
  17. {props.children}
  18. </div>
  19. )
  20. }