@@ -27,6 +27,7 @@ const badgeVariants = cva(
2727 amber : `${ STATUS_BASE } bg-[#fde68a] text-[#a16207] dark:bg-[rgba(245,158,11,0.2)] dark:text-[#fcd34d]` ,
2828 teal : `${ STATUS_BASE } bg-[#99f6e4] text-[#0f766e] dark:bg-[rgba(20,184,166,0.2)] dark:text-[#5eead4]` ,
2929 cyan : `${ STATUS_BASE } bg-[var(--surface-4)] text-[#0891b2] dark:bg-[rgba(14,165,233,0.2)] dark:text-[#7dd3fc]` ,
30+ pink : `${ STATUS_BASE } bg-[#fbcfe8] text-[#be185d] dark:bg-[rgba(236,72,153,0.2)] dark:text-[#f9a8d4]` ,
3031 'gray-secondary' : `${ STATUS_BASE } bg-[var(--surface-4)] text-[var(--text-secondary)]` ,
3132 } ,
3233 size : {
@@ -54,6 +55,7 @@ const STATUS_VARIANTS = [
5455 'amber' ,
5556 'teal' ,
5657 'cyan' ,
58+ 'pink' ,
5759 'gray-secondary' ,
5860] as const
5961
@@ -87,7 +89,7 @@ export interface BadgeProps
8789 * Supports two categories of variants:
8890 * - **Bordered**: `default`, `outline`, `type` - traditional badges with borders
8991 * - **Status colors**: `green`, `red`, `gray`, `blue`, `blue-secondary`, `purple`,
90- * `orange`, `amber`, `teal`, `cyan`, `gray-secondary` - borderless colored badges
92+ * `orange`, `amber`, `teal`, `cyan`, `pink`, ` gray-secondary` - borderless colored badges
9193 *
9294 * Status color variants can display a dot indicator via the `dot` prop.
9395 * All variants support an optional `icon` prop for leading icons.
0 commit comments