@almadar/ui 2.25.4 → 2.27.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@almadar/ui",
3
- "version": "2.25.4",
3
+ "version": "2.27.0",
4
4
  "description": "React UI components, hooks, and providers for Almadar",
5
5
  "type": "module",
6
6
  "main": "./dist/components/index.js",
@@ -28,211 +28,53 @@ module.exports = {
28
28
  'grid-cols-1', 'grid-cols-2', 'grid-cols-3', 'grid-cols-4',
29
29
  'sm:grid-cols-2', 'md:grid-cols-2', 'md:grid-cols-3', 'lg:grid-cols-3', 'lg:grid-cols-4',
30
30
  'text-center', 'text-left', 'text-right',
31
- // CSS variable-based classes from @almadar/ui components
32
- 'accent-[var(--color-foreground)]',
33
- 'accent-[var(--color-primary)]',
34
- 'active:bg-[var(--color-muted)]',
35
- 'active:bg-[var(--color-primary)]',
31
+ // Non-theme CSS variable classes (no semantic equivalent in theme config)
36
32
  'active:scale-[var(--active-scale)]',
37
- 'active:shadow-[var(--shadow-active)]',
38
- 'active:text-[var(--color-primary-foreground)]',
39
- 'bg-[var(--color-accent)]',
40
- 'bg-[var(--color-background)]',
41
- 'bg-[var(--color-border)]',
42
- 'bg-[var(--color-card)]',
43
- 'bg-[var(--color-error)]',
44
- 'bg-[var(--color-foreground)]',
45
- 'bg-[var(--color-info)]',
46
- 'bg-[var(--color-muted)]',
47
- 'bg-[var(--color-muted-foreground)]',
48
- ':bg-[var(--color-primary)]',
49
- 'bg-[var(--color-primary)]',
50
- 'bg-[var(--color-primary-foreground)]',
51
- 'bg-[var(--color-secondary)]',
52
- 'bg-[var(--color-success)]',
53
- 'bg-[var(--color-surface)]',
54
- 'bg-[var(--color-table-header)]',
55
- 'bg-[var(--color-warning)]',
56
33
  'border-b-[length:var(--border-width)]',
57
- 'border-b-[var(--color-foreground)]',
58
- 'border-b-[var(--color-primary)]',
59
34
  'border-[length:var(--border-width)]',
60
35
  'border-[length:var(--border-width-thin)]',
61
36
  'border-l-[length:var(--border-width)]',
62
- 'border-l-[var(--color-foreground)]',
63
- 'border-l-[var(--color-primary)]',
64
37
  'border-r-[length:var(--border-width)]',
65
- 'border-r-[var(--color-foreground)]',
66
- 'border-r-[var(--color-primary)]',
67
38
  'border-t-[length:var(--border-width)]',
68
- 'border-t-[var(--color-foreground)]',
69
- 'border-t-[var(--color-primary)]',
70
- 'border-[var(--color-accent)]',
71
- ':border-[var(--color-border)]',
72
- 'border-[var(--color-border)]',
73
- 'border-[var(--color-card)]',
74
- 'border-[var(--color-error)]',
75
- 'border-[var(--color-foreground)]',
76
- 'border-[var(--color-info)]',
77
- ':border-[var(--color-primary)]',
78
- 'border-[var(--color-primary)]',
79
- 'border-[var(--color-success)]',
80
- 'border-[var(--color-table-border)]',
81
- 'border-[var(--color-warning)]',
82
39
  'border-x-[length:var(--border-width)]',
83
- 'checked:bg-[var(--color-primary)]',
84
- 'dark:bg-[var(--color-background)]',
85
- 'dark:bg-[var(--color-card)]',
86
- 'dark:bg-[var(--color-foreground)]',
87
- 'dark:bg-[var(--color-muted)]',
88
- 'dark:border-[var(--color-border)]',
89
- 'dark:hover:bg-[var(--color-error)]',
90
- 'dark:hover:bg-[var(--color-muted)]',
91
- 'dark:text-[var(--color-error)]',
92
- 'dark:text-[var(--color-foreground)]',
93
- 'dark:text-[var(--color-muted-foreground)]',
94
- 'disabled:bg-[var(--color-muted)]',
95
- 'disabled:text-[var(--color-muted-foreground)]',
96
40
  'duration-[var(--transition-fast)]',
97
41
  'duration-[var(--transition-normal)]',
98
- 'fill-[var(--color-warning)]',
99
- 'focus:bg-[var(--color-card)]',
100
- 'focus:bg-[var(--color-muted)]',
101
- 'focus:border-[var(--color-error)]',
102
- 'focus:border-[var(--color-primary)]',
103
- 'focus:border-[var(--color-ring)]',
104
42
  'focus:ring-[length:var(--focus-ring-width)]',
105
43
  'focus:ring-offset-[length:var(--focus-ring-offset)]',
106
- 'focus:ring-[var(--color-error)]',
107
- 'focus:ring-[var(--color-ring)]',
108
44
  'font-[var(--font-weight-bold)]',
109
45
  'font-[var(--font-weight-medium)]',
110
- 'from-[var(--color-muted)]',
111
- 'group-hover:bg-[var(--color-foreground)]',
112
- 'group-hover:text-[var(--color-foreground)]',
113
- 'group-hover:text-[var(--color-muted-foreground)]',
114
- 'hover:bg-[var(--color-accent)]',
115
- 'hover:border-[var(--color-accent)]',
116
- 'hover:text-[var(--color-accent)]',
117
- 'hover:bg-[var(--color-error)]',
118
- 'hover:bg-[var(--color-muted)]',
119
- 'hover:bg-[var(--color-muted-foreground)]',
120
- 'hover:bg-[var(--color-primary)]',
121
- 'hover:bg-[var(--color-primary-hover)]',
122
- 'hover:bg-[var(--color-secondary-hover)]',
123
- 'hover:bg-[var(--color-success)]',
124
- 'hover:bg-[var(--color-surface)]',
125
- 'hover:bg-[var(--color-surface-hover)]',
46
+ 'text-[var(--icon-color,currentColor)]',
47
+ 'placeholder:text-[var(--color-placeholder)]',
48
+ // Table-specific tokens
49
+ 'bg-[var(--color-table-header)]',
50
+ 'border-[var(--color-table-border)]',
126
51
  'hover:bg-[var(--color-table-row-hover)]',
127
- 'hover:bg-[var(--color-warning)]',
128
- 'hover:border-[var(--color-border)]',
52
+ 'hover:bg-[var(--color-surface-hover)]',
129
53
  'hover:border-[var(--color-border-hover)]',
130
- 'hover:border-[var(--color-muted-foreground)]',
131
- 'hover:border-[var(--color-primary)]',
132
- 'hover:ring-[var(--color-ring)]',
133
- 'hover:shadow-[var(--shadow-hover)]',
134
- 'hover:shadow-[var(--shadow-sm)]',
135
- 'hover:text-[var(--color-error)]',
136
- 'hover:text-[var(--color-error-foreground)]',
137
- 'hover:text-[var(--color-foreground)]',
138
- 'hover:text-[var(--color-primary)]',
139
- 'hover:text-[var(--color-success-foreground)]',
140
- 'hover:text-[var(--color-warning-foreground)]',
141
- 'peer-focus:ring-[var(--color-error)]',
142
- 'peer-focus:ring-[var(--color-ring)]',
143
- 'placeholder:text-[var(--color-muted-foreground)]',
144
- 'placeholder:text-[var(--color-placeholder)]',
145
- 'ring-[var(--color-accent)]',
146
- 'ring-[var(--color-error)]',
147
- 'ring-[var(--color-info)]',
148
- 'ring-[var(--color-muted-foreground)]',
149
- 'ring-[var(--color-primary)]',
150
- 'ring-[var(--color-success)]',
151
- 'ring-[var(--color-warning)]',
152
- 'rounded-l-[var(--radius-sm)]',
153
- 'rounded-r-[var(--radius-sm)]',
154
- 'rounded-t-[var(--radius-lg)]',
155
- 'rounded-t-[var(--radius-sm)]',
156
- 'rounded-[var(--radius-full)]',
157
- 'rounded-[var(--radius-lg)]',
158
- 'rounded-[var(--radius-md)]',
159
- 'rounded-[var(--radius-sm)]',
160
- 'rounded-[var(--radius-xl)]',
161
- 'shadow-[var(--shadow-lg)]',
162
- 'shadow-[var(--shadow-main)]',
163
- 'shadow-[var(--shadow-sm)]',
164
- 'text-[var(--color-accent)]',
165
- 'text-[var(--color-accent-foreground)]',
166
- 'text-[var(--color-background)]',
167
- 'text-[var(--color-card-foreground)]',
168
- 'text-[var(--color-error)]',
169
- 'text-[var(--color-error-foreground)]',
170
- 'text-[var(--color-foreground)]',
171
- 'text-[var(--color-info)]',
172
- 'text-[var(--color-info-foreground)]',
173
- 'text-[var(--color-muted)]',
174
- 'text-[var(--color-muted-foreground)]',
175
- 'text-[var(--color-primary)]',
176
- ':text-[var(--color-primary-foreground)]',
177
- 'text-[var(--color-primary-foreground)]',
178
- 'text-[var(--color-secondary-foreground)]',
179
- 'text-[var(--color-success)]',
180
- 'text-[var(--color-warning)]',
181
- 'text-[var(--color-warning-foreground)]',
182
- 'to-[var(--color-accent)]',
183
- // Opacity variants
184
- 'bg-[var(--color-accent)]/10',
185
- 'bg-[var(--color-background)]/10',
186
- 'bg-[var(--color-background)]/80',
187
- 'bg-[var(--color-card)]/80',
188
- 'bg-[var(--color-error)]/10',
189
- 'bg-[var(--color-foreground)]/0',
190
- 'bg-[var(--color-foreground)]/50',
191
- 'bg-[var(--color-info)]/10',
192
- 'bg-[var(--color-muted)]/20',
193
- 'bg-[var(--color-muted)]/30',
194
- 'bg-[var(--color-muted)]/60',
195
- 'bg-[var(--color-primary)]/10',
196
- 'bg-[var(--color-primary)]/8',
197
- 'bg-[var(--color-success)]/10',
198
- 'bg-[var(--color-surface)]/60',
199
- 'bg-[var(--color-surface)]/80',
200
- 'bg-[var(--color-warning)]/10',
201
- 'border-[var(--color-accent)]/30',
202
- 'border-[var(--color-border)]/40',
203
- 'border-[var(--color-error)]/30',
204
- 'border-[var(--color-error)]/50',
205
- 'border-[var(--color-info)]/30',
206
- 'border-[var(--color-success)]/30',
207
- 'border-[var(--color-warning)]/30',
208
- 'dark:bg-[var(--color-foreground)]/70',
209
- 'dark:hover:bg-[var(--color-error)]/20',
210
- 'from-[var(--color-primary)]/5',
211
- 'group-hover:bg-[var(--color-foreground)]/20',
212
- 'group-hover:text-[var(--color-primary)]',
213
- 'hover:bg-[var(--color-error)]/10',
214
- 'hover:bg-[var(--color-muted)]/50',
215
- 'hover:bg-[var(--color-muted)]/80',
216
- 'hover:bg-[var(--color-muted-foreground)]/15',
217
- 'hover:bg-[var(--color-primary)]/10',
218
54
  'hover:border-l-[var(--color-muted)]',
219
- 'hover:text-[var(--color-background)]',
220
- 'peer-focus:ring-[var(--color-error)]/20',
221
- 'peer-focus:ring-[var(--color-ring)]/20',
222
- 'ring-[var(--color-accent)]/20',
223
- 'ring-[var(--color-error)]/20',
224
- 'ring-[var(--color-info)]/20',
225
- 'ring-[var(--color-muted-foreground)]/20',
226
- 'ring-[var(--color-primary)]/30',
227
- 'ring-[var(--color-success)]/20',
228
- 'ring-[var(--color-warning)]/20',
229
- 'rounded-t-[var(--radius-md)]',
230
- 'text-[var(--color-accent,#06b6d4)]',
231
- 'text-[var(--color-foreground)]/30',
232
- 'text-[var(--color-foreground)]/60',
233
- 'text-[var(--color-muted-foreground)]/50',
234
- 'text-[var(--icon-color,currentColor)]',
55
+ // Gradient partials with opacity
56
+ 'from-[var(--color-primary)]/5',
235
57
  'to-[var(--color-secondary)]/5',
58
+ // Opacity variants on semantic colors (used in components)
59
+ 'bg-primary/10', 'bg-primary/8', 'bg-accent/10',
60
+ 'bg-muted/20', 'bg-muted/30', 'bg-muted/50', 'bg-muted/60',
61
+ 'bg-surface/60', 'bg-surface/80',
62
+ 'bg-background/10', 'bg-background/80',
63
+ 'bg-card/80', 'bg-foreground/0', 'bg-foreground/50',
64
+ 'bg-error/10', 'bg-info/10', 'bg-success/10', 'bg-warning/10',
65
+ 'border-accent/30', 'border-border/40',
66
+ 'border-error/30', 'border-error/50',
67
+ 'border-info/30', 'border-success/30', 'border-warning/30',
68
+ 'ring-accent/20', 'ring-error/20', 'ring-info/20',
69
+ 'ring-muted-foreground/20', 'ring-primary/30',
70
+ 'ring-success/20', 'ring-warning/20',
71
+ 'text-foreground/30', 'text-foreground/60',
72
+ 'text-muted-foreground/50',
73
+ 'hover:bg-error/10', 'hover:bg-muted/50', 'hover:bg-muted/80',
74
+ 'hover:bg-muted-foreground/15', 'hover:bg-primary/10',
75
+ 'dark:bg-foreground/70', 'dark:hover:bg-error/20',
76
+ 'group-hover:bg-foreground/20', 'group-hover:text-primary',
77
+ 'peer-focus:ring-error/20', 'peer-focus:ring-ring/20',
236
78
  // Hover elevation & micro-interactions
237
79
  'hover:-translate-y-0.5',
238
80
  'hover:-translate-y-1',
@@ -241,7 +83,7 @@ module.exports = {
241
83
  'transition-all',
242
84
  'duration-200',
243
85
  'ring-2',
244
- 'ring-[var(--color-primary)]',
86
+ 'ring-primary',
245
87
  ],
246
88
  theme: {
247
89
  fontFamily: {