@@ -60,6 +60,9 @@ type VariantOptions<V> = {
60
60
} ;
61
61
} ;
62
62
63
+ // BooleanVariantKey type for 'true' and 'false' string literals
64
+ type BooleanVariantKey = 'true' | 'false' ;
65
+
63
66
type CompoundVariant < V > = {
64
67
variants : Partial < {
65
68
[ P in keyof V ] : keyof V [ P ] | boolean ;
@@ -88,7 +91,7 @@ export type OmitUndefined<T> = T extends undefined ? never : T;
88
91
type OptionalIfHasDefault < Props , Defaults > = Omit < Props , keyof Defaults > &
89
92
Partial < Pick < Props , Extract < keyof Defaults , keyof Props > > > ;
90
93
91
- export type VariantProps < Component extends ( ... args : any ) => any > = Omit <
94
+ export type VariantProps < Component extends < T > ( arg : T ) => ReturnType < Component > > = Omit <
92
95
OmitUndefined < Parameters < Component > [ 0 ] > ,
93
96
'style'
94
97
> ;
@@ -114,12 +117,12 @@ function styles<V extends VariantOptions<V>>(config: VariantStyleConfig<V>) {
114
117
} as VariantProps ;
115
118
116
119
// Apply variant styles
117
- for ( const [ propName , value ] of Object . entries ( mergedProps ) as [ keyof V , any ] [ ] ) {
120
+ for ( const [ propName , value ] of Object . entries ( mergedProps ) as [ keyof V , keyof VariantProps [ keyof V ] | boolean ] [ ] ) {
118
121
const variantGroup = config . variants [ propName ] ;
119
122
if ( variantGroup ) {
120
123
// Handle boolean variants
121
124
if ( typeof value === 'boolean' ) {
122
- const booleanValue = value ? 'true' : 'false' ;
125
+ const booleanValue : BooleanVariantKey = value ? 'true' : 'false' ;
123
126
if ( variantGroup [ booleanValue as keyof typeof variantGroup ] ) {
124
127
styles = {
125
128
...styles ,
@@ -144,7 +147,7 @@ function styles<V extends VariantOptions<V>>(config: VariantStyleConfig<V>) {
144
147
for ( const compound of config . compoundVariants ) {
145
148
if (
146
149
Object . entries ( compound . variants ) . every (
147
- ( [ propName , value ] : [ string , unknown ] ) => {
150
+ ( [ propName , value ] ) => {
148
151
// Handle boolean values in compound variants
149
152
if ( typeof value === 'boolean' ) {
150
153
return mergedProps [ propName as keyof V ] === value ;
@@ -188,7 +191,7 @@ interface CreateTokensReturn {
188
191
189
192
// Helper to resolve token references in style objects
190
193
function resolveTokens ( style : StyleObject , tokens : TokenConfig ) : StyleObject {
191
- return Object . entries ( style ) . reduce < Record < string , any > > ( ( acc , [ key , value ] ) => {
194
+ return Object . entries ( style ) . reduce < Record < string , ResolvedStyle [ keyof ResolvedStyle ] > > ( ( acc , [ key , value ] ) => {
192
195
if ( typeof value !== 'string' || ! value . startsWith ( '$' ) ) {
193
196
acc [ key ] = value ;
194
197
return acc ;
@@ -225,22 +228,28 @@ export function defineTokens<T extends TokenConfig>(tokenConfig: T): CreateToken
225
228
226
229
// Resolve tokens in variants
227
230
const resolvedVariants = config . variants
228
- ? Object . entries ( config . variants ) . reduce ( ( acc , [ key , variantGroup ] : [ string , any ] ) => {
229
- const resolvedGroup = Object . entries ( variantGroup ) . reduce (
230
- ( groupAcc , [ variantKey , styles ] : [ string , any ] ) => {
231
+ ? Object . entries ( config . variants ) . reduce < Partial < V > > ( ( acc , [ key , variantGroup ] ) => {
232
+ type VariantGroupType = Record < string , StyleObject > ;
233
+
234
+ const resolvedGroup = Object . entries ( variantGroup as VariantGroupType ) . reduce < Record < string , StyleObject > > (
235
+ ( groupAcc , [ variantKey , variantStyles ] ) => {
231
236
return {
232
237
...groupAcc ,
233
- [ variantKey ] : resolveTokens ( styles , tokens ) ,
238
+ [ variantKey ] : resolveTokens ( variantStyles , tokens ) ,
234
239
} ;
235
240
} ,
236
- { } ,
241
+ { }
237
242
) ;
238
- return { ...acc , [ key ] : resolvedGroup } ;
243
+
244
+ return {
245
+ ...acc ,
246
+ [ key as keyof V ] : resolvedGroup as V [ keyof V ]
247
+ } ;
239
248
} , { } ) as V
240
249
: { } as V ;
241
250
242
251
// Resolve tokens in compound variants
243
- const resolvedCompoundVariants = config . compoundVariants ?. map ( ( compound : any ) => ( {
252
+ const resolvedCompoundVariants = config . compoundVariants ?. map ( ( compound ) => ( {
244
253
...compound ,
245
254
style : resolveTokens ( compound . style , tokens ) ,
246
255
} ) ) ;
0 commit comments