@@ -3,125 +3,125 @@ import type { VariantProps } from 'tailwind-variants';
33
44export const badgeVariants = tv ( {
55 base : 'inline-flex items-center border font-semibold' ,
6+ variants : {
7+ color : {
8+ primary : 'border-primary text-primary' ,
9+ destructive : 'border-destructive text-destructive' ,
10+ success : 'border-success text-success' ,
11+ warning : 'border-warning text-warning' ,
12+ info : 'border-info text-info' ,
13+ carbon : 'border-carbon text-carbon' ,
14+ secondary : 'border-secondary-foreground/50 text-secondary-foreground' ,
15+ accent : 'border-accent-foreground/50 text-accent-foreground'
16+ } ,
17+ variant : {
18+ solid : '' ,
19+ pure : 'bg-background text-foreground border-border' ,
20+ outline : 'bg-background' ,
21+ soft : 'border-0' ,
22+ ghost : '' ,
23+ raw : 'bg-transparent border-0'
24+ } ,
25+ size : {
26+ xs : 'gap-0.5 h-3.5 px-1 text-4xs' ,
27+ sm : 'gap-0.75 h-4 px-1.5 text-3xs' ,
28+ md : 'gap-1 h-4.5 px-2 text-2xs' ,
29+ lg : 'gap-1.25 h-5 px-2.5 text-xs' ,
30+ xl : 'gap-1.5 h-6 px-3 text-sm' ,
31+ '2xl' : 'gap-2 h-7 px-4 text-base'
32+ } ,
33+ shape : {
34+ auto : 'rounded-md' ,
35+ rounded : 'rounded-full'
36+ }
37+ } ,
638 compoundVariants : [
739 {
8- class : `bg-primary text-primary-foreground` ,
940 color : 'primary' ,
10- variant : 'solid'
41+ variant : 'solid' ,
42+ class : `bg-primary text-primary-foreground`
1143 } ,
1244 {
13- class : `bg-destructive text-destructive-foreground` ,
1445 color : 'destructive' ,
15- variant : 'solid'
46+ variant : 'solid' ,
47+ class : `bg-destructive text-destructive-foreground`
1648 } ,
1749 {
18- class : `bg-success text-success-foreground` ,
1950 color : 'success' ,
20- variant : 'solid'
51+ variant : 'solid' ,
52+ class : `bg-success text-success-foreground`
2153 } ,
2254 {
23- class : `bg-warning text-warning-foreground` ,
2455 color : 'warning' ,
25- variant : 'solid'
56+ variant : 'solid' ,
57+ class : `bg-warning text-warning-foreground`
2658 } ,
2759 {
28- class : `bg-info text-info-foreground` ,
2960 color : 'info' ,
30- variant : 'solid'
61+ variant : 'solid' ,
62+ class : `bg-info text-info-foreground`
3163 } ,
3264 {
33- class : `bg-carbon text-carbon-foreground` ,
3465 color : 'carbon' ,
35- variant : 'solid'
66+ variant : 'solid' ,
67+ class : `bg-carbon text-carbon-foreground`
3668 } ,
3769 {
38- class : `bg-secondary text-secondary-foreground` ,
3970 color : 'secondary' ,
40- variant : 'solid'
71+ variant : 'solid' ,
72+ class : `bg-secondary text-secondary-foreground`
4173 } ,
4274 {
43- class : `bg-accent text-accent-foreground` ,
4475 color : 'accent' ,
45- variant : 'solid'
76+ variant : 'solid' ,
77+ class : `bg-accent text-accent-foreground`
4678 } ,
4779 {
48- class : 'bg-primary/10' ,
4980 color : 'primary' ,
50- variant : [ 'soft' , 'ghost' ]
81+ variant : [ 'soft' , 'ghost' ] ,
82+ class : 'bg-primary/10'
5183 } ,
5284 {
53- class : 'bg-destructive/10' ,
5485 color : 'destructive' ,
55- variant : [ 'soft' , 'ghost' ]
86+ variant : [ 'soft' , 'ghost' ] ,
87+ class : 'bg-destructive/10'
5688 } ,
5789 {
58- class : 'bg-success/10' ,
5990 color : 'success' ,
60- variant : [ 'soft' , 'ghost' ]
91+ variant : [ 'soft' , 'ghost' ] ,
92+ class : 'bg-success/10'
6193 } ,
6294 {
63- class : 'bg-warning/10' ,
6495 color : 'warning' ,
65- variant : [ 'soft' , 'ghost' ]
96+ variant : [ 'soft' , 'ghost' ] ,
97+ class : 'bg-warning/10'
6698 } ,
6799 {
68- class : 'bg-info/10' ,
69100 color : 'info' ,
70- variant : [ 'soft' , 'ghost' ]
101+ variant : [ 'soft' , 'ghost' ] ,
102+ class : 'bg-info/10'
71103 } ,
72104 {
73- class : 'bg-carbon/10' ,
74105 color : 'carbon' ,
75- variant : [ 'soft' , 'ghost' ]
106+ variant : [ 'soft' , 'ghost' ] ,
107+ class : 'bg-carbon/10'
76108 } ,
77109 {
78- class : 'bg-secondary-foreground/5' ,
79110 color : 'secondary' ,
80- variant : [ 'soft' , 'ghost' ]
111+ variant : [ 'soft' , 'ghost' ] ,
112+ class : 'bg-secondary-foreground/5'
81113 } ,
82114 {
83- class : 'bg-accent-foreground/5' ,
84115 color : 'accent' ,
85- variant : [ 'soft' , 'ghost' ]
116+ variant : [ 'soft' , 'ghost' ] ,
117+ class : 'bg-accent-foreground/5'
86118 }
87119 ] ,
88120 defaultVariants : {
89121 color : 'primary' ,
90- shape : 'auto ' ,
122+ variant : 'solid ' ,
91123 size : 'md' ,
92- variant : 'solid'
93- } ,
94- variants : {
95- color : {
96- accent : 'border-accent-foreground/50 text-accent-foreground' ,
97- carbon : 'border-carbon text-carbon' ,
98- destructive : 'border-destructive text-destructive' ,
99- info : 'border-info text-info' ,
100- primary : 'border-primary text-primary' ,
101- secondary : 'border-secondary-foreground/50 text-secondary-foreground' ,
102- success : 'border-success text-success' ,
103- warning : 'border-warning text-warning'
104- } ,
105- shape : {
106- auto : 'rounded-md' ,
107- rounded : 'rounded-full'
108- } ,
109- size : {
110- '2xl' : 'gap-2 h-7 px-4 text-base' ,
111- lg : 'gap-1.25 h-5 px-2.5 text-xs' ,
112- md : 'gap-1 h-4.5 px-2 text-2xs' ,
113- sm : 'gap-0.75 h-4 px-1.5 text-3xs' ,
114- xl : 'gap-1.5 h-6 px-3 text-sm' ,
115- xs : 'gap-0.5 h-3.5 px-1 text-4xs'
116- } ,
117- variant : {
118- ghost : '' ,
119- outline : 'bg-background' ,
120- pure : 'bg-background text-foreground border-border' ,
121- raw : 'bg-transparent border-0' ,
122- soft : 'border-0' ,
123- solid : ''
124- }
124+ shape : 'auto'
125125 }
126126} ) ;
127127
0 commit comments