24 lines
718 B
TypeScript
24 lines
718 B
TypeScript
import React from "react";
|
|
import clsx from "clsx";
|
|
|
|
export type ChipColor = "default" | "primary" | "success" | "danger";
|
|
|
|
export interface ChipProps {
|
|
children: React.ReactNode;
|
|
color?: ChipColor;
|
|
className?: string;
|
|
size?: string;
|
|
variant?: string;
|
|
}
|
|
|
|
const colorMap: Record<ChipColor, string> = {
|
|
default: "bg-gray-200 text-gray-800",
|
|
primary: "bg-blue-100 text-blue-800",
|
|
success: "bg-green-100 text-green-800",
|
|
danger: "bg-red-100 text-red-800",
|
|
};
|
|
|
|
export const Chip: React.FC<ChipProps> = ({ children, color = "default", className }) => {
|
|
return <span className={clsx("inline-flex items-center px-3 py-1 rounded-full text-sm font-medium", colorMap[color], className)}>{children}</span>;
|
|
};
|