nuclo 0.1.57 → 0.1.58

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.
@@ -1,5 +1,105 @@
1
1
  // Style utility functions type definitions
2
2
 
3
+ import type {
4
+ DisplayValue,
5
+ PositionValue,
6
+ TextAlignValue,
7
+ FontWeightValue,
8
+ FontStyleValue,
9
+ TextTransformValue,
10
+ TextDecorationValue,
11
+ TextDecorationStyleValue,
12
+ TextDecorationLineValue,
13
+ WhiteSpaceValue,
14
+ OverflowValue,
15
+ VisibilityValue,
16
+ FlexDirectionValue,
17
+ FlexWrapValue,
18
+ AlignItemsValue,
19
+ JustifyContentValue,
20
+ AlignSelfValue,
21
+ AlignContentValue,
22
+ JustifySelfValue,
23
+ JustifyItemsValue,
24
+ GridAutoFlowValue,
25
+ BorderStyleValue,
26
+ OutlineStyleValue,
27
+ BoxSizingValue,
28
+ ObjectFitValue,
29
+ VerticalAlignValue,
30
+ TextAlignLastValue,
31
+ TextJustifyValue,
32
+ TextOverflowValue,
33
+ WordWrapValue,
34
+ OverflowWrapValue,
35
+ BackgroundRepeatValue,
36
+ BackgroundAttachmentValue,
37
+ BackgroundClipValue,
38
+ BackgroundOriginValue,
39
+ TransformStyleValue,
40
+ BackfaceVisibilityValue,
41
+ AnimationDirectionValue,
42
+ AnimationFillModeValue,
43
+ AnimationPlayStateValue,
44
+ ListStyleTypeValue,
45
+ ListStylePositionValue,
46
+ BorderCollapseValue,
47
+ CaptionSideValue,
48
+ EmptyCellsValue,
49
+ TableLayoutValue,
50
+ AppearanceValue,
51
+ UserSelectValue,
52
+ PointerEventsValue,
53
+ ResizeValue,
54
+ ScrollBehaviorValue,
55
+ IsolationValue,
56
+ MixBlendModeValue,
57
+ ContainValue,
58
+ PageBreakValue,
59
+ BreakValue,
60
+ ColumnFillValue,
61
+ ColumnRuleStyleValue,
62
+ ColumnSpanValue,
63
+ CursorValue,
64
+ CSSLengthValue,
65
+ CSSColorValue,
66
+ CSSFontFamilyValue,
67
+ CSSTimingFunctionValue,
68
+ CSSTransformValue,
69
+ CSSFilterValue,
70
+ CSSBackgroundImageValue,
71
+ CSSAnimationNameValue,
72
+ CSSContentValue,
73
+ CSSAspectRatioValue,
74
+ FloatValue,
75
+ ClearValue,
76
+ WritingModeValue,
77
+ DirectionValue,
78
+ UnicodeBidiValue,
79
+ TextOrientationValue,
80
+ HyphensValue,
81
+ LineBreakValue,
82
+ WordBreakValue,
83
+ TouchActionValue,
84
+ OverscrollBehaviorValue,
85
+ ImageRenderingValue,
86
+ ColorSchemeValue,
87
+ CaretColorValue,
88
+ CaretShapeValue,
89
+ BackgroundBlendModeValue,
90
+ ContentVisibilityValue,
91
+ ContainerTypeValue,
92
+ FontKerningValue,
93
+ FontSynthesisValue,
94
+ FontOpticalSizingValue,
95
+ FontDisplayValue,
96
+ FontVariantCapsValue,
97
+ TextRenderingValue,
98
+ TextCombineUprightValue,
99
+ MaskCompositeValue,
100
+ ClipRuleValue,
101
+ } from "../../src/style/cssPropertyTypes";
102
+
3
103
  /**
4
104
  * Creates a CSS class with the given styles and injects it into the document
5
105
  */
@@ -46,85 +146,85 @@ declare global {
46
146
  add(property: string, value: string): this;
47
147
 
48
148
  // Display
49
- display(value: string): this;
50
- flex(value?: string): this;
149
+ display(value: DisplayValue): this;
150
+ flex(value?: CSSLengthValue | "auto" | "initial" | "none" | "1" | "0"): this;
51
151
  grid(): this;
52
152
 
53
153
  // Colors
54
- bg(color: string): this;
55
- color(color: string): this;
56
- accentColor(value: string): this;
154
+ bg(color: CSSColorValue): this;
155
+ color(color: CSSColorValue): this;
156
+ accentColor(value: CSSColorValue): this;
57
157
 
58
158
  // Typography
59
- fontSize(size: string): this;
60
- fontWeight(value: string): this;
61
- fontFamily(value: string): this;
62
- lineHeight(value: string): this;
63
- letterSpacing(value: string): this;
64
- textAlign(value: string): this;
65
- textDecoration(value: string): this;
159
+ fontSize(size: CSSLengthValue): this;
160
+ fontWeight(value: FontWeightValue): this;
161
+ fontFamily(value: CSSFontFamilyValue): this;
162
+ lineHeight(value: CSSLengthValue | "normal" | number): this;
163
+ letterSpacing(value: CSSLengthValue | "normal"): this;
164
+ textAlign(value: TextAlignValue): this;
165
+ textDecoration(value: TextDecorationValue): this;
66
166
  bold(): this;
67
- fontStyle(value: string): this;
167
+ fontStyle(value: FontStyleValue): this;
68
168
  fontVariant(value: string): this;
69
169
  fontStretch(value: string): this;
70
- textTransform(value: string): this;
71
- textIndent(value: string): this;
72
- textOverflow(value: string): this;
170
+ textTransform(value: TextTransformValue): this;
171
+ textIndent(value: CSSLengthValue): this;
172
+ textOverflow(value: TextOverflowValue): this;
73
173
  textShadow(value: string): this;
74
- whiteSpace(value: string): this;
75
- wordSpacing(value: string): this;
76
- wordWrap(value: string): this;
77
- overflowWrap(value: string): this;
78
- textAlignLast(value: string): this;
79
- textJustify(value: string): this;
80
- textDecorationLine(value: string): this;
81
- textDecorationColor(value: string): this;
82
- textDecorationStyle(value: string): this;
83
- textDecorationThickness(value: string): this;
84
- textUnderlineOffset(value: string): this;
85
- verticalAlign(value: string): this;
174
+ whiteSpace(value: WhiteSpaceValue): this;
175
+ wordSpacing(value: CSSLengthValue | "normal"): this;
176
+ wordWrap(value: WordWrapValue): this;
177
+ overflowWrap(value: OverflowWrapValue): this;
178
+ textAlignLast(value: TextAlignLastValue): this;
179
+ textJustify(value: TextJustifyValue): this;
180
+ textDecorationLine(value: TextDecorationLineValue): this;
181
+ textDecorationColor(value: CSSColorValue): this;
182
+ textDecorationStyle(value: TextDecorationStyleValue): this;
183
+ textDecorationThickness(value: CSSLengthValue | "auto" | "from-font"): this;
184
+ textUnderlineOffset(value: CSSLengthValue | "auto"): this;
185
+ verticalAlign(value: VerticalAlignValue): this;
86
186
 
87
187
  // Layout
88
- position(value: string): this;
89
- padding(value: string): this;
90
- paddingTop(value: string): this;
91
- paddingRight(value: string): this;
92
- paddingBottom(value: string): this;
93
- paddingLeft(value: string): this;
94
- margin(value: string): this;
95
- marginTop(value: string): this;
96
- marginRight(value: string): this;
97
- marginBottom(value: string): this;
98
- marginLeft(value: string): this;
99
- width(value: string): this;
100
- height(value: string): this;
101
- minWidth(value: string): this;
102
- maxWidth(value: string): this;
103
- minHeight(value: string): this;
104
- maxHeight(value: string): this;
105
- boxSizing(value: string): this;
188
+ position(value: PositionValue): this;
189
+ padding(value: CSSLengthValue): this;
190
+ paddingTop(value: CSSLengthValue): this;
191
+ paddingRight(value: CSSLengthValue): this;
192
+ paddingBottom(value: CSSLengthValue): this;
193
+ paddingLeft(value: CSSLengthValue): this;
194
+ margin(value: CSSLengthValue | "auto"): this;
195
+ marginTop(value: CSSLengthValue | "auto"): this;
196
+ marginRight(value: CSSLengthValue | "auto"): this;
197
+ marginBottom(value: CSSLengthValue | "auto"): this;
198
+ marginLeft(value: CSSLengthValue | "auto"): this;
199
+ width(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
200
+ height(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
201
+ minWidth(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
202
+ maxWidth(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): this;
203
+ minHeight(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
204
+ maxHeight(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): this;
205
+ boxSizing(value: BoxSizingValue): this;
106
206
 
107
207
  // Positioning
108
- top(value: string): this;
109
- right(value: string): this;
110
- bottom(value: string): this;
111
- left(value: string): this;
112
- zIndex(value: string): this;
208
+ top(value: CSSLengthValue | "auto"): this;
209
+ right(value: CSSLengthValue | "auto"): this;
210
+ bottom(value: CSSLengthValue | "auto"): this;
211
+ left(value: CSSLengthValue | "auto"): this;
212
+ zIndex(value: number | "auto"): this;
113
213
 
114
214
  // Flexbox
115
- flexDirection(value: string): this;
116
- alignItems(value: string): this;
117
- justifyContent(value: string): this;
215
+ flexDirection(value: FlexDirectionValue): this;
216
+ alignItems(value: AlignItemsValue): this;
217
+ justifyContent(value: JustifyContentValue): this;
118
218
  center(): this;
119
- gap(value: string): this;
120
- flexWrap(value: string): this;
121
- flexGrow(value: string): this;
122
- flexShrink(value: string): this;
123
- flexBasis(value: string): this;
124
- alignSelf(value: string): this;
125
- alignContent(value: string): this;
126
- justifySelf(value: string): this;
127
- justifyItems(value: string): this;
219
+ gap(value: CSSLengthValue): this;
220
+ flexWrap(value: FlexWrapValue): this;
221
+ flexGrow(value: number | string): this;
222
+ flexShrink(value: number | string): this;
223
+ flexBasis(value: CSSLengthValue | "auto" | "content" | "fit-content"): this;
224
+ alignSelf(value: AlignSelfValue): this;
225
+ alignContent(value: AlignContentValue): this;
226
+ justifySelf(value: JustifySelfValue): this;
227
+ justifyItems(value: JustifyItemsValue): this;
128
228
 
129
229
  // Grid
130
230
  gridTemplateColumns(value: string): this;
@@ -132,14 +232,14 @@ declare global {
132
232
  gridTemplateAreas(value: string): this;
133
233
  gridColumn(value: string): this;
134
234
  gridRow(value: string): this;
135
- gridColumnStart(value: string): this;
136
- gridColumnEnd(value: string): this;
137
- gridRowStart(value: string): this;
138
- gridRowEnd(value: string): this;
235
+ gridColumnStart(value: string | number | "auto"): this;
236
+ gridColumnEnd(value: string | number | "auto"): this;
237
+ gridRowStart(value: string | number | "auto"): this;
238
+ gridRowEnd(value: string | number | "auto"): this;
139
239
  gridArea(value: string): this;
140
- gridAutoColumns(value: string): this;
141
- gridAutoRows(value: string): this;
142
- gridAutoFlow(value: string): this;
240
+ gridAutoColumns(value: CSSLengthValue): this;
241
+ gridAutoRows(value: CSSLengthValue): this;
242
+ gridAutoFlow(value: GridAutoFlowValue): this;
143
243
 
144
244
  // Borders
145
245
  border(value: string): this;
@@ -147,241 +247,407 @@ declare global {
147
247
  borderRight(value: string): this;
148
248
  borderBottom(value: string): this;
149
249
  borderLeft(value: string): this;
150
- borderWidth(value: string): this;
151
- borderStyle(value: string): this;
152
- borderColor(value: string): this;
153
- borderTopWidth(value: string): this;
154
- borderRightWidth(value: string): this;
155
- borderBottomWidth(value: string): this;
156
- borderLeftWidth(value: string): this;
157
- borderTopStyle(value: string): this;
158
- borderRightStyle(value: string): this;
159
- borderBottomStyle(value: string): this;
160
- borderLeftStyle(value: string): this;
161
- borderTopColor(value: string): this;
162
- borderRightColor(value: string): this;
163
- borderBottomColor(value: string): this;
164
- borderLeftColor(value: string): this;
165
- borderRadius(value: string): this;
166
- borderTopLeftRadius(value: string): this;
167
- borderTopRightRadius(value: string): this;
168
- borderBottomLeftRadius(value: string): this;
169
- borderBottomRightRadius(value: string): this;
250
+ borderWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
251
+ borderStyle(value: BorderStyleValue): this;
252
+ borderColor(value: CSSColorValue): this;
253
+ borderTopWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
254
+ borderRightWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
255
+ borderBottomWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
256
+ borderLeftWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
257
+ borderTopStyle(value: BorderStyleValue): this;
258
+ borderRightStyle(value: BorderStyleValue): this;
259
+ borderBottomStyle(value: BorderStyleValue): this;
260
+ borderLeftStyle(value: BorderStyleValue): this;
261
+ borderTopColor(value: CSSColorValue): this;
262
+ borderRightColor(value: CSSColorValue): this;
263
+ borderBottomColor(value: CSSColorValue): this;
264
+ borderLeftColor(value: CSSColorValue): this;
265
+ borderRadius(value: CSSLengthValue): this;
266
+ borderTopLeftRadius(value: CSSLengthValue): this;
267
+ borderTopRightRadius(value: CSSLengthValue): this;
268
+ borderBottomLeftRadius(value: CSSLengthValue): this;
269
+ borderBottomRightRadius(value: CSSLengthValue): this;
170
270
 
171
271
  // Outline
172
272
  outline(value: string): this;
173
- outlineWidth(value: string): this;
174
- outlineStyle(value: string): this;
175
- outlineColor(value: string): this;
176
- outlineOffset(value: string): this;
273
+ outlineWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
274
+ outlineStyle(value: OutlineStyleValue): this;
275
+ outlineColor(value: CSSColorValue): this;
276
+ outlineOffset(value: CSSLengthValue): this;
177
277
 
178
278
  // Background
179
- backgroundColor(value: string): this;
180
- backgroundImage(value: string): this;
181
- backgroundRepeat(value: string): this;
279
+ backgroundColor(value: CSSColorValue): this;
280
+ backgroundImage(value: CSSBackgroundImageValue | "none"): this;
281
+ backgroundRepeat(value: BackgroundRepeatValue): this;
182
282
  backgroundPosition(value: string): this;
183
- backgroundSize(value: string): this;
184
- backgroundAttachment(value: string): this;
185
- backgroundClip(value: string): this;
186
- backgroundOrigin(value: string): this;
283
+ backgroundSize(value: CSSLengthValue | "auto" | "cover" | "contain"): this;
284
+ backgroundAttachment(value: BackgroundAttachmentValue): this;
285
+ backgroundClip(value: BackgroundClipValue): this;
286
+ backgroundOrigin(value: BackgroundOriginValue): this;
187
287
 
188
288
  // Effects
189
- boxShadow(value: string): this;
190
- opacity(value: string): this;
289
+ boxShadow(value: string | "none"): this;
290
+ opacity(value: number | string): this;
191
291
  transition(value: string): this;
192
- transitionProperty(value: string): this;
193
- transitionDuration(value: string): this;
194
- transitionTimingFunction(value: string): this;
195
- transitionDelay(value: string): this;
292
+ transitionProperty(value: string | "none" | "all"): this;
293
+ transitionDuration(value: string | number): this;
294
+ transitionTimingFunction(value: CSSTimingFunctionValue): this;
295
+ transitionDelay(value: string | number): this;
196
296
 
197
297
  // Transform
198
- transform(value: string): this;
298
+ transform(value: CSSTransformValue | "none"): this;
199
299
  transformOrigin(value: string): this;
200
- transformStyle(value: string): this;
201
- perspective(value: string): this;
300
+ transformStyle(value: TransformStyleValue): this;
301
+ perspective(value: CSSLengthValue | "none"): this;
202
302
  perspectiveOrigin(value: string): this;
203
- backfaceVisibility(value: string): this;
303
+ backfaceVisibility(value: BackfaceVisibilityValue): this;
204
304
 
205
305
  // Animation
206
306
  animation(value: string): this;
207
- animationName(value: string): this;
208
- animationDuration(value: string): this;
209
- animationTimingFunction(value: string): this;
210
- animationDelay(value: string): this;
211
- animationIterationCount(value: string): this;
212
- animationDirection(value: string): this;
213
- animationFillMode(value: string): this;
214
- animationPlayState(value: string): this;
307
+ animationName(value: CSSAnimationNameValue): this;
308
+ animationDuration(value: string | number): this;
309
+ animationTimingFunction(value: CSSTimingFunctionValue): this;
310
+ animationDelay(value: string | number): this;
311
+ animationIterationCount(value: number | "infinite" | string): this;
312
+ animationDirection(value: AnimationDirectionValue): this;
313
+ animationFillMode(value: AnimationFillModeValue): this;
314
+ animationPlayState(value: AnimationPlayStateValue): this;
215
315
 
216
316
  // Filter
217
- filter(value: string): this;
218
- backdropFilter(value: string): this;
317
+ filter(value: CSSFilterValue | "none"): this;
318
+ backdropFilter(value: CSSFilterValue | "none"): this;
219
319
 
220
320
  // Overflow
221
- overflow(value: string): this;
222
- overflowX(value: string): this;
223
- overflowY(value: string): this;
321
+ overflow(value: OverflowValue): this;
322
+ overflowX(value: OverflowValue): this;
323
+ overflowY(value: OverflowValue): this;
224
324
 
225
325
  // Visibility
226
- visibility(value: string): this;
326
+ visibility(value: VisibilityValue): this;
227
327
 
228
328
  // Object fit/position
229
- objectFit(value: string): this;
329
+ objectFit(value: ObjectFitValue): this;
230
330
  objectPosition(value: string): this;
231
331
 
232
332
  // List
233
333
  listStyle(value: string): this;
234
- listStyleType(value: string): this;
235
- listStylePosition(value: string): this;
236
- listStyleImage(value: string): this;
334
+ listStyleType(value: ListStyleTypeValue): this;
335
+ listStylePosition(value: ListStylePositionValue): this;
336
+ listStyleImage(value: CSSBackgroundImageValue | "none"): this;
237
337
 
238
338
  // Table
239
- borderCollapse(value: string): this;
240
- borderSpacing(value: string): this;
241
- captionSide(value: string): this;
242
- emptyCells(value: string): this;
243
- tableLayout(value: string): this;
339
+ borderCollapse(value: BorderCollapseValue): this;
340
+ borderSpacing(value: CSSLengthValue): this;
341
+ captionSide(value: CaptionSideValue): this;
342
+ emptyCells(value: EmptyCellsValue): this;
343
+ tableLayout(value: TableLayoutValue): this;
244
344
 
245
345
  // Content
246
- content(value: string): this;
247
- quotes(value: string): this;
248
- counterReset(value: string): this;
249
- counterIncrement(value: string): this;
346
+ content(value: CSSContentValue | "normal" | "none"): this;
347
+ quotes(value: string | "none"): this;
348
+ counterReset(value: string | "none"): this;
349
+ counterIncrement(value: string | "none"): this;
250
350
 
251
351
  // User interface
252
- appearance(value: string): this;
253
- userSelect(value: string): this;
254
- pointerEvents(value: string): this;
255
- resize(value: string): this;
256
- scrollBehavior(value: string): this;
352
+ appearance(value: AppearanceValue): this;
353
+ userSelect(value: UserSelectValue): this;
354
+ pointerEvents(value: PointerEventsValue): this;
355
+ resize(value: ResizeValue): this;
356
+ scrollBehavior(value: ScrollBehaviorValue): this;
257
357
 
258
358
  // Clip
259
- clip(value: string): this;
260
- clipPath(value: string): this;
359
+ clip(value: string | "auto"): this;
360
+ clipPath(value: string | "none"): this;
261
361
 
262
362
  // Isolation
263
- isolation(value: string): this;
363
+ isolation(value: IsolationValue): this;
264
364
 
265
365
  // Mix blend mode
266
- mixBlendMode(value: string): this;
366
+ mixBlendMode(value: MixBlendModeValue): this;
267
367
 
268
368
  // Will change
269
- willChange(value: string): this;
369
+ willChange(value: string | "auto"): this;
270
370
 
271
371
  // Contain
272
- contain(value: string): this;
372
+ contain(value: ContainValue): this;
273
373
 
274
374
  // Page break
275
- pageBreakBefore(value: string): this;
276
- pageBreakAfter(value: string): this;
277
- pageBreakInside(value: string): this;
375
+ pageBreakBefore(value: PageBreakValue): this;
376
+ pageBreakAfter(value: PageBreakValue): this;
377
+ pageBreakInside(value: PageBreakValue): this;
278
378
 
279
379
  // Break
280
- breakBefore(value: string): this;
281
- breakAfter(value: string): this;
282
- breakInside(value: string): this;
380
+ breakBefore(value: BreakValue): this;
381
+ breakAfter(value: BreakValue): this;
382
+ breakInside(value: BreakValue): this;
283
383
 
284
384
  // Orphans and widows
285
- orphans(value: string): this;
286
- widows(value: string): this;
385
+ orphans(value: number | string): this;
386
+ widows(value: number | string): this;
287
387
 
288
388
  // Column
289
- columnCount(value: string): this;
290
- columnFill(value: string): this;
291
- columnGap(value: string): this;
389
+ columnCount(value: number | "auto" | string): this;
390
+ columnFill(value: ColumnFillValue): this;
391
+ columnGap(value: CSSLengthValue | "normal"): this;
292
392
  columnRule(value: string): this;
293
- columnRuleColor(value: string): this;
294
- columnRuleStyle(value: string): this;
295
- columnRuleWidth(value: string): this;
296
- columnSpan(value: string): this;
297
- columnWidth(value: string): this;
393
+ columnRuleColor(value: CSSColorValue): this;
394
+ columnRuleStyle(value: ColumnRuleStyleValue): this;
395
+ columnRuleWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
396
+ columnSpan(value: ColumnSpanValue): this;
397
+ columnWidth(value: CSSLengthValue | "auto"): this;
298
398
  columns(value: string): this;
299
399
 
300
400
  // Interaction
301
- cursor(value: string): this;
401
+ cursor(value: CursorValue): this;
402
+
403
+ // Layout - Additional
404
+ aspectRatio(value: CSSAspectRatioValue): this;
405
+ clear(value: ClearValue): this;
406
+ float(value: FloatValue): this;
407
+ order(value: number | string): this;
408
+
409
+ // Flexbox - Place properties
410
+ placeContent(value: string): this;
411
+ placeItems(value: string): this;
412
+ placeSelf(value: string): this;
413
+
414
+ // Text - Additional
415
+ hyphens(value: HyphensValue): this;
416
+ lineBreak(value: LineBreakValue): this;
417
+ wordBreak(value: WordBreakValue): this;
418
+ textOrientation(value: TextOrientationValue): this;
419
+ writingMode(value: WritingModeValue): this;
420
+ direction(value: DirectionValue): this;
421
+ unicodeBidi(value: UnicodeBidiValue): this;
422
+
423
+ // Background - Additional
424
+ backgroundBlendMode(value: BackgroundBlendModeValue): this;
425
+ backgroundPositionX(value: string): this;
426
+ backgroundPositionY(value: string): this;
427
+
428
+ // Border Image
429
+ borderImage(value: string): this;
430
+ borderImageSource(value: CSSBackgroundImageValue | "none"): this;
431
+ borderImageSlice(value: string | number): this;
432
+ borderImageWidth(value: CSSLengthValue | number): this;
433
+ borderImageOutset(value: CSSLengthValue | number): this;
434
+ borderImageRepeat(value: BackgroundRepeatValue): this;
435
+
436
+ // Logical Properties - Inset
437
+ inset(value: CSSLengthValue | "auto"): this;
438
+ insetBlock(value: CSSLengthValue): this;
439
+ insetBlockStart(value: CSSLengthValue | "auto"): this;
440
+ insetBlockEnd(value: CSSLengthValue | "auto"): this;
441
+ insetInline(value: CSSLengthValue): this;
442
+ insetInlineStart(value: CSSLengthValue | "auto"): this;
443
+ insetInlineEnd(value: CSSLengthValue | "auto"): this;
444
+
445
+ // Logical Properties - Margin
446
+ marginBlock(value: CSSLengthValue | "auto"): this;
447
+ marginBlockStart(value: CSSLengthValue | "auto"): this;
448
+ marginBlockEnd(value: CSSLengthValue | "auto"): this;
449
+ marginInline(value: CSSLengthValue | "auto"): this;
450
+ marginInlineStart(value: CSSLengthValue | "auto"): this;
451
+ marginInlineEnd(value: CSSLengthValue | "auto"): this;
452
+
453
+ // Logical Properties - Padding
454
+ paddingBlock(value: CSSLengthValue): this;
455
+ paddingBlockStart(value: CSSLengthValue): this;
456
+ paddingBlockEnd(value: CSSLengthValue): this;
457
+ paddingInline(value: CSSLengthValue): this;
458
+ paddingInlineStart(value: CSSLengthValue): this;
459
+ paddingInlineEnd(value: CSSLengthValue): this;
460
+
461
+ // Logical Properties - Size
462
+ inlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
463
+ blockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
464
+ minInlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
465
+ minBlockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
466
+ maxInlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): this;
467
+ maxBlockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): this;
468
+
469
+ // Logical Properties - Border
470
+ borderBlock(value: string): this;
471
+ borderBlockStart(value: string): this;
472
+ borderBlockEnd(value: string): this;
473
+ borderInline(value: string): this;
474
+ borderInlineStart(value: string): this;
475
+ borderInlineEnd(value: string): this;
476
+ borderBlockWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
477
+ borderBlockStartWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
478
+ borderBlockEndWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
479
+ borderInlineWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
480
+ borderInlineStartWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
481
+ borderInlineEndWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
482
+ borderBlockStyle(value: BorderStyleValue): this;
483
+ borderBlockStartStyle(value: BorderStyleValue): this;
484
+ borderBlockEndStyle(value: BorderStyleValue): this;
485
+ borderInlineStyle(value: BorderStyleValue): this;
486
+ borderInlineStartStyle(value: BorderStyleValue): this;
487
+ borderInlineEndStyle(value: BorderStyleValue): this;
488
+ borderBlockColor(value: CSSColorValue): this;
489
+ borderBlockStartColor(value: CSSColorValue): this;
490
+ borderBlockEndColor(value: CSSColorValue): this;
491
+ borderInlineColor(value: CSSColorValue): this;
492
+ borderInlineStartColor(value: CSSColorValue): this;
493
+ borderInlineEndColor(value: CSSColorValue): this;
494
+
495
+ // Logical Properties - Border Radius
496
+ borderStartStartRadius(value: CSSLengthValue): this;
497
+ borderStartEndRadius(value: CSSLengthValue): this;
498
+ borderEndStartRadius(value: CSSLengthValue): this;
499
+ borderEndEndRadius(value: CSSLengthValue): this;
500
+
501
+ // Scroll
502
+ scrollMargin(value: CSSLengthValue): this;
503
+ scrollMarginTop(value: CSSLengthValue): this;
504
+ scrollMarginRight(value: CSSLengthValue): this;
505
+ scrollMarginBottom(value: CSSLengthValue): this;
506
+ scrollMarginLeft(value: CSSLengthValue): this;
507
+ scrollPadding(value: CSSLengthValue): this;
508
+ scrollPaddingTop(value: CSSLengthValue): this;
509
+ scrollPaddingRight(value: CSSLengthValue): this;
510
+ scrollPaddingBottom(value: CSSLengthValue): this;
511
+ scrollPaddingLeft(value: CSSLengthValue): this;
512
+ overscrollBehavior(value: OverscrollBehaviorValue): this;
513
+ overscrollBehaviorX(value: OverscrollBehaviorValue): this;
514
+ overscrollBehaviorY(value: OverscrollBehaviorValue): this;
515
+
516
+ // Caret
517
+ caretColor(value: CaretColorValue): this;
518
+ caretShape(value: CaretShapeValue): this;
519
+ caretAnimation(value: string): this;
520
+
521
+ // Other
522
+ imageRendering(value: ImageRenderingValue): this;
523
+ colorScheme(value: ColorSchemeValue): this;
524
+ contentVisibility(value: ContentVisibilityValue): this;
525
+ touchAction(value: TouchActionValue): this;
526
+
527
+ // Container Queries
528
+ containerType(value: ContainerTypeValue): this;
529
+ containerName(value: string): this;
530
+ container(value: string): this;
531
+
532
+ // Font - Additional
533
+ fontFeatureSettings(value: string): this;
534
+ fontKerning(value: FontKerningValue): this;
535
+ fontSynthesis(value: FontSynthesisValue): this;
536
+ fontOpticalSizing(value: FontOpticalSizingValue): this;
537
+ fontDisplay(value: FontDisplayValue): this;
538
+ fontVariantCaps(value: FontVariantCapsValue): this;
539
+ fontVariantNumeric(value: string): this;
540
+ fontVariantLigatures(value: string): this;
541
+ fontVariantEastAsian(value: string): this;
542
+ fontVariantAlternates(value: string): this;
543
+ fontVariantPosition(value: string): this;
544
+
545
+ // Text - Additional
546
+ textRendering(value: TextRenderingValue): this;
547
+ textCombineUpright(value: TextCombineUprightValue): this;
548
+ textSizeAdjust(value: string | "auto" | "none" | `${number}%`): this;
549
+
550
+ // Mask
551
+ mask(value: string): this;
552
+ maskImage(value: CSSBackgroundImageValue | "none"): this;
553
+ maskMode(value: string): this;
554
+ maskRepeat(value: BackgroundRepeatValue): this;
555
+ maskPosition(value: string): this;
556
+ maskSize(value: CSSLengthValue | "auto" | "cover" | "contain"): this;
557
+ maskOrigin(value: BackgroundOriginValue): this;
558
+ maskClip(value: BackgroundClipValue): this;
559
+ maskComposite(value: MaskCompositeValue): this;
560
+
561
+ // Clip
562
+ clipRule(value: ClipRuleValue): this;
563
+
564
+ // Grid - Additional
565
+ gridColumnGap(value: CSSLengthValue): this;
566
+ gridRowGap(value: CSSLengthValue): this;
567
+ gridGap(value: CSSLengthValue): this;
302
568
  }
303
569
 
304
570
  // Utility functions available globally (like HTML tags)
305
571
  // Display
306
- function display(value: string): StyleBuilder;
307
- function flex(value?: string): StyleBuilder;
572
+ function display(value: DisplayValue): StyleBuilder;
573
+ function flex(value?: CSSLengthValue | "auto" | "initial" | "none" | "1" | "0"): StyleBuilder;
308
574
  function grid(): StyleBuilder;
309
575
 
310
576
  // Colors
311
- function bg(color: string): StyleBuilder;
312
- function color(colorValue: string): StyleBuilder;
313
- function accentColor(value: string): StyleBuilder;
577
+ function bg(color: CSSColorValue): StyleBuilder;
578
+ function color(colorValue: CSSColorValue): StyleBuilder;
579
+ function accentColor(value: CSSColorValue): StyleBuilder;
314
580
 
315
581
  // Typography
316
- function fontSize(size: string): StyleBuilder;
317
- function fontWeight(value: string): StyleBuilder;
318
- function fontFamily(value: string): StyleBuilder;
319
- function lineHeight(value: string): StyleBuilder;
320
- function letterSpacing(value: string): StyleBuilder;
321
- function textAlign(value: string): StyleBuilder;
322
- function textDecoration(value: string): StyleBuilder;
582
+ function fontSize(size: CSSLengthValue): StyleBuilder;
583
+ function fontWeight(value: FontWeightValue): StyleBuilder;
584
+ function fontFamily(value: CSSFontFamilyValue): StyleBuilder;
585
+ function lineHeight(value: CSSLengthValue | "normal" | number): StyleBuilder;
586
+ function letterSpacing(value: CSSLengthValue | "normal"): StyleBuilder;
587
+ function textAlign(value: TextAlignValue): StyleBuilder;
588
+ function textDecoration(value: TextDecorationValue): StyleBuilder;
323
589
  function bold(): StyleBuilder;
324
- function fontStyle(value: string): StyleBuilder;
590
+ function fontStyle(value: FontStyleValue): StyleBuilder;
325
591
  function fontVariant(value: string): StyleBuilder;
326
592
  function fontStretch(value: string): StyleBuilder;
327
- function textTransform(value: string): StyleBuilder;
328
- function textIndent(value: string): StyleBuilder;
329
- function textOverflow(value: string): StyleBuilder;
593
+ function textTransform(value: TextTransformValue): StyleBuilder;
594
+ function textIndent(value: CSSLengthValue): StyleBuilder;
595
+ function textOverflow(value: TextOverflowValue): StyleBuilder;
330
596
  function textShadow(value: string): StyleBuilder;
331
- function whiteSpace(value: string): StyleBuilder;
332
- function wordSpacing(value: string): StyleBuilder;
333
- function wordWrap(value: string): StyleBuilder;
334
- function overflowWrap(value: string): StyleBuilder;
335
- function textAlignLast(value: string): StyleBuilder;
336
- function textJustify(value: string): StyleBuilder;
337
- function textDecorationLine(value: string): StyleBuilder;
338
- function textDecorationColor(value: string): StyleBuilder;
339
- function textDecorationStyle(value: string): StyleBuilder;
340
- function textDecorationThickness(value: string): StyleBuilder;
341
- function textUnderlineOffset(value: string): StyleBuilder;
342
- function verticalAlign(value: string): StyleBuilder;
597
+ function whiteSpace(value: WhiteSpaceValue): StyleBuilder;
598
+ function wordSpacing(value: CSSLengthValue | "normal"): StyleBuilder;
599
+ function wordWrap(value: WordWrapValue): StyleBuilder;
600
+ function overflowWrap(value: OverflowWrapValue): StyleBuilder;
601
+ function textAlignLast(value: TextAlignLastValue): StyleBuilder;
602
+ function textJustify(value: TextJustifyValue): StyleBuilder;
603
+ function textDecorationLine(value: TextDecorationLineValue): StyleBuilder;
604
+ function textDecorationColor(value: CSSColorValue): StyleBuilder;
605
+ function textDecorationStyle(value: TextDecorationStyleValue): StyleBuilder;
606
+ function textDecorationThickness(value: CSSLengthValue | "auto" | "from-font"): StyleBuilder;
607
+ function textUnderlineOffset(value: CSSLengthValue | "auto"): StyleBuilder;
608
+ function verticalAlign(value: VerticalAlignValue): StyleBuilder;
343
609
 
344
610
  // Layout
345
- function position(value: string): StyleBuilder;
346
- function padding(value: string): StyleBuilder;
347
- function paddingTop(value: string): StyleBuilder;
348
- function paddingRight(value: string): StyleBuilder;
349
- function paddingBottom(value: string): StyleBuilder;
350
- function paddingLeft(value: string): StyleBuilder;
351
- function margin(value: string): StyleBuilder;
352
- function marginTop(value: string): StyleBuilder;
353
- function marginRight(value: string): StyleBuilder;
354
- function marginBottom(value: string): StyleBuilder;
355
- function marginLeft(value: string): StyleBuilder;
356
- function width(value: string): StyleBuilder;
357
- function height(value: string): StyleBuilder;
358
- function minWidth(value: string): StyleBuilder;
359
- function maxWidth(value: string): StyleBuilder;
360
- function minHeight(value: string): StyleBuilder;
361
- function maxHeight(value: string): StyleBuilder;
362
- function boxSizing(value: string): StyleBuilder;
611
+ function position(value: PositionValue): StyleBuilder;
612
+ function padding(value: CSSLengthValue): StyleBuilder;
613
+ function paddingTop(value: CSSLengthValue): StyleBuilder;
614
+ function paddingRight(value: CSSLengthValue): StyleBuilder;
615
+ function paddingBottom(value: CSSLengthValue): StyleBuilder;
616
+ function paddingLeft(value: CSSLengthValue): StyleBuilder;
617
+ function margin(value: CSSLengthValue | "auto"): StyleBuilder;
618
+ function marginTop(value: CSSLengthValue | "auto"): StyleBuilder;
619
+ function marginRight(value: CSSLengthValue | "auto"): StyleBuilder;
620
+ function marginBottom(value: CSSLengthValue | "auto"): StyleBuilder;
621
+ function marginLeft(value: CSSLengthValue | "auto"): StyleBuilder;
622
+ function width(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
623
+ function height(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
624
+ function minWidth(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
625
+ function maxWidth(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): StyleBuilder;
626
+ function minHeight(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
627
+ function maxHeight(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): StyleBuilder;
628
+ function boxSizing(value: BoxSizingValue): StyleBuilder;
363
629
 
364
630
  // Positioning (Note: top conflicts with window.top and is skipped at runtime)
365
- // function top(value: string): StyleBuilder; // Use module import: import { top } from "nuclo"
366
- function right(value: string): StyleBuilder;
367
- function bottom(value: string): StyleBuilder;
368
- function left(value: string): StyleBuilder;
369
- function zIndex(value: string): StyleBuilder;
631
+ // function top(value: CSSLengthValue | "auto"): StyleBuilder; // Use module import: import { top } from "nuclo"
632
+ function right(value: CSSLengthValue | "auto"): StyleBuilder;
633
+ function bottom(value: CSSLengthValue | "auto"): StyleBuilder;
634
+ function left(value: CSSLengthValue | "auto"): StyleBuilder;
635
+ function zIndex(value: number | "auto"): StyleBuilder;
370
636
 
371
637
  // Flexbox
372
- function flexDirection(value: string): StyleBuilder;
373
- function alignItems(value: string): StyleBuilder;
374
- function justifyContent(value: string): StyleBuilder;
638
+ function flexDirection(value: FlexDirectionValue): StyleBuilder;
639
+ function alignItems(value: AlignItemsValue): StyleBuilder;
640
+ function justifyContent(value: JustifyContentValue): StyleBuilder;
375
641
  function center(): StyleBuilder;
376
- function gap(value: string): StyleBuilder;
377
- function flexWrap(value: string): StyleBuilder;
378
- function flexGrow(value: string): StyleBuilder;
379
- function flexShrink(value: string): StyleBuilder;
380
- function flexBasis(value: string): StyleBuilder;
381
- function alignSelf(value: string): StyleBuilder;
382
- function alignContent(value: string): StyleBuilder;
383
- function justifySelf(value: string): StyleBuilder;
384
- function justifyItems(value: string): StyleBuilder;
642
+ function gap(value: CSSLengthValue): StyleBuilder;
643
+ function flexWrap(value: FlexWrapValue): StyleBuilder;
644
+ function flexGrow(value: number | string): StyleBuilder;
645
+ function flexShrink(value: number | string): StyleBuilder;
646
+ function flexBasis(value: CSSLengthValue | "auto" | "content" | "fit-content"): StyleBuilder;
647
+ function alignSelf(value: AlignSelfValue): StyleBuilder;
648
+ function alignContent(value: AlignContentValue): StyleBuilder;
649
+ function justifySelf(value: JustifySelfValue): StyleBuilder;
650
+ function justifyItems(value: JustifyItemsValue): StyleBuilder;
385
651
 
386
652
  // Grid
387
653
  function gridTemplateColumns(value: string): StyleBuilder;
@@ -389,14 +655,14 @@ declare global {
389
655
  function gridTemplateAreas(value: string): StyleBuilder;
390
656
  function gridColumn(value: string): StyleBuilder;
391
657
  function gridRow(value: string): StyleBuilder;
392
- function gridColumnStart(value: string): StyleBuilder;
393
- function gridColumnEnd(value: string): StyleBuilder;
394
- function gridRowStart(value: string): StyleBuilder;
395
- function gridRowEnd(value: string): StyleBuilder;
658
+ function gridColumnStart(value: string | number | "auto"): StyleBuilder;
659
+ function gridColumnEnd(value: string | number | "auto"): StyleBuilder;
660
+ function gridRowStart(value: string | number | "auto"): StyleBuilder;
661
+ function gridRowEnd(value: string | number | "auto"): StyleBuilder;
396
662
  function gridArea(value: string): StyleBuilder;
397
- function gridAutoColumns(value: string): StyleBuilder;
398
- function gridAutoRows(value: string): StyleBuilder;
399
- function gridAutoFlow(value: string): StyleBuilder;
663
+ function gridAutoColumns(value: CSSLengthValue): StyleBuilder;
664
+ function gridAutoRows(value: CSSLengthValue): StyleBuilder;
665
+ function gridAutoFlow(value: GridAutoFlowValue): StyleBuilder;
400
666
 
401
667
  // Borders
402
668
  function border(value: string): StyleBuilder;
@@ -404,158 +670,324 @@ declare global {
404
670
  function borderRight(value: string): StyleBuilder;
405
671
  function borderBottom(value: string): StyleBuilder;
406
672
  function borderLeft(value: string): StyleBuilder;
407
- function borderWidth(value: string): StyleBuilder;
408
- function borderStyle(value: string): StyleBuilder;
409
- function borderColor(value: string): StyleBuilder;
410
- function borderTopWidth(value: string): StyleBuilder;
411
- function borderRightWidth(value: string): StyleBuilder;
412
- function borderBottomWidth(value: string): StyleBuilder;
413
- function borderLeftWidth(value: string): StyleBuilder;
414
- function borderTopStyle(value: string): StyleBuilder;
415
- function borderRightStyle(value: string): StyleBuilder;
416
- function borderBottomStyle(value: string): StyleBuilder;
417
- function borderLeftStyle(value: string): StyleBuilder;
418
- function borderTopColor(value: string): StyleBuilder;
419
- function borderRightColor(value: string): StyleBuilder;
420
- function borderBottomColor(value: string): StyleBuilder;
421
- function borderLeftColor(value: string): StyleBuilder;
422
- function borderRadius(value: string): StyleBuilder;
423
- function borderTopLeftRadius(value: string): StyleBuilder;
424
- function borderTopRightRadius(value: string): StyleBuilder;
425
- function borderBottomLeftRadius(value: string): StyleBuilder;
426
- function borderBottomRightRadius(value: string): StyleBuilder;
673
+ function borderWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
674
+ function borderStyle(value: BorderStyleValue): StyleBuilder;
675
+ function borderColor(value: CSSColorValue): StyleBuilder;
676
+ function borderTopWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
677
+ function borderRightWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
678
+ function borderBottomWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
679
+ function borderLeftWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
680
+ function borderTopStyle(value: BorderStyleValue): StyleBuilder;
681
+ function borderRightStyle(value: BorderStyleValue): StyleBuilder;
682
+ function borderBottomStyle(value: BorderStyleValue): StyleBuilder;
683
+ function borderLeftStyle(value: BorderStyleValue): StyleBuilder;
684
+ function borderTopColor(value: CSSColorValue): StyleBuilder;
685
+ function borderRightColor(value: CSSColorValue): StyleBuilder;
686
+ function borderBottomColor(value: CSSColorValue): StyleBuilder;
687
+ function borderLeftColor(value: CSSColorValue): StyleBuilder;
688
+ function borderRadius(value: CSSLengthValue): StyleBuilder;
689
+ function borderTopLeftRadius(value: CSSLengthValue): StyleBuilder;
690
+ function borderTopRightRadius(value: CSSLengthValue): StyleBuilder;
691
+ function borderBottomLeftRadius(value: CSSLengthValue): StyleBuilder;
692
+ function borderBottomRightRadius(value: CSSLengthValue): StyleBuilder;
427
693
 
428
694
  // Outline
429
695
  function outline(value: string): StyleBuilder;
430
- function outlineWidth(value: string): StyleBuilder;
431
- function outlineStyle(value: string): StyleBuilder;
432
- function outlineColor(value: string): StyleBuilder;
433
- function outlineOffset(value: string): StyleBuilder;
696
+ function outlineWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
697
+ function outlineStyle(value: OutlineStyleValue): StyleBuilder;
698
+ function outlineColor(value: CSSColorValue): StyleBuilder;
699
+ function outlineOffset(value: CSSLengthValue): StyleBuilder;
434
700
 
435
701
  // Background
436
- function backgroundColor(value: string): StyleBuilder;
437
- function backgroundImage(value: string): StyleBuilder;
438
- function backgroundRepeat(value: string): StyleBuilder;
702
+ function backgroundColor(value: CSSColorValue): StyleBuilder;
703
+ function backgroundImage(value: CSSBackgroundImageValue | "none"): StyleBuilder;
704
+ function backgroundRepeat(value: BackgroundRepeatValue): StyleBuilder;
439
705
  function backgroundPosition(value: string): StyleBuilder;
440
- function backgroundSize(value: string): StyleBuilder;
441
- function backgroundAttachment(value: string): StyleBuilder;
442
- function backgroundClip(value: string): StyleBuilder;
443
- function backgroundOrigin(value: string): StyleBuilder;
706
+ function backgroundSize(value: CSSLengthValue | "auto" | "cover" | "contain"): StyleBuilder;
707
+ function backgroundAttachment(value: BackgroundAttachmentValue): StyleBuilder;
708
+ function backgroundClip(value: BackgroundClipValue): StyleBuilder;
709
+ function backgroundOrigin(value: BackgroundOriginValue): StyleBuilder;
444
710
 
445
711
  // Effects
446
- function boxShadow(value: string): StyleBuilder;
447
- function opacity(value: string): StyleBuilder;
712
+ function boxShadow(value: string | "none"): StyleBuilder;
713
+ function opacity(value: number | string): StyleBuilder;
448
714
  function transition(value: string): StyleBuilder;
449
- function transitionProperty(value: string): StyleBuilder;
450
- function transitionDuration(value: string): StyleBuilder;
451
- function transitionTimingFunction(value: string): StyleBuilder;
452
- function transitionDelay(value: string): StyleBuilder;
715
+ function transitionProperty(value: string | "none" | "all"): StyleBuilder;
716
+ function transitionDuration(value: string | number): StyleBuilder;
717
+ function transitionTimingFunction(value: CSSTimingFunctionValue): StyleBuilder;
718
+ function transitionDelay(value: string | number): StyleBuilder;
453
719
 
454
720
  // Transform
455
- function transform(value: string): StyleBuilder;
721
+ function transform(value: CSSTransformValue | "none"): StyleBuilder;
456
722
  function transformOrigin(value: string): StyleBuilder;
457
- function transformStyle(value: string): StyleBuilder;
458
- function perspective(value: string): StyleBuilder;
723
+ function transformStyle(value: TransformStyleValue): StyleBuilder;
724
+ function perspective(value: CSSLengthValue | "none"): StyleBuilder;
459
725
  function perspectiveOrigin(value: string): StyleBuilder;
460
- function backfaceVisibility(value: string): StyleBuilder;
726
+ function backfaceVisibility(value: BackfaceVisibilityValue): StyleBuilder;
461
727
 
462
728
  // Animation
463
729
  function animation(value: string): StyleBuilder;
464
- function animationName(value: string): StyleBuilder;
465
- function animationDuration(value: string): StyleBuilder;
466
- function animationTimingFunction(value: string): StyleBuilder;
467
- function animationDelay(value: string): StyleBuilder;
468
- function animationIterationCount(value: string): StyleBuilder;
469
- function animationDirection(value: string): StyleBuilder;
470
- function animationFillMode(value: string): StyleBuilder;
471
- function animationPlayState(value: string): StyleBuilder;
730
+ function animationName(value: CSSAnimationNameValue): StyleBuilder;
731
+ function animationDuration(value: string | number): StyleBuilder;
732
+ function animationTimingFunction(value: CSSTimingFunctionValue): StyleBuilder;
733
+ function animationDelay(value: string | number): StyleBuilder;
734
+ function animationIterationCount(value: number | "infinite" | string): StyleBuilder;
735
+ function animationDirection(value: AnimationDirectionValue): StyleBuilder;
736
+ function animationFillMode(value: AnimationFillModeValue): StyleBuilder;
737
+ function animationPlayState(value: AnimationPlayStateValue): StyleBuilder;
472
738
 
473
739
  // Filter (Note: conflicts with SVG filter element, use module import if needed)
474
- // function filter(value: string): StyleBuilder; // Use: import { filter } from "nuclo"
475
- function backdropFilter(value: string): StyleBuilder;
740
+ // function filter(value: CSSFilterValue | "none"): StyleBuilder; // Use: import { filter } from "nuclo"
741
+ function backdropFilter(value: CSSFilterValue | "none"): StyleBuilder;
476
742
 
477
743
  // Overflow
478
- function overflow(value: string): StyleBuilder;
479
- function overflowX(value: string): StyleBuilder;
480
- function overflowY(value: string): StyleBuilder;
744
+ function overflow(value: OverflowValue): StyleBuilder;
745
+ function overflowX(value: OverflowValue): StyleBuilder;
746
+ function overflowY(value: OverflowValue): StyleBuilder;
481
747
 
482
748
  // Visibility
483
- function visibility(value: string): StyleBuilder;
749
+ function visibility(value: VisibilityValue): StyleBuilder;
484
750
 
485
751
  // Object fit/position
486
- function objectFit(value: string): StyleBuilder;
752
+ function objectFit(value: ObjectFitValue): StyleBuilder;
487
753
  function objectPosition(value: string): StyleBuilder;
488
754
 
489
755
  // List
490
756
  function listStyle(value: string): StyleBuilder;
491
- function listStyleType(value: string): StyleBuilder;
492
- function listStylePosition(value: string): StyleBuilder;
493
- function listStyleImage(value: string): StyleBuilder;
757
+ function listStyleType(value: ListStyleTypeValue): StyleBuilder;
758
+ function listStylePosition(value: ListStylePositionValue): StyleBuilder;
759
+ function listStyleImage(value: CSSBackgroundImageValue | "none"): StyleBuilder;
494
760
 
495
761
  // Table
496
- function borderCollapse(value: string): StyleBuilder;
497
- function borderSpacing(value: string): StyleBuilder;
498
- function captionSide(value: string): StyleBuilder;
499
- function emptyCells(value: string): StyleBuilder;
500
- function tableLayout(value: string): StyleBuilder;
762
+ function borderCollapse(value: BorderCollapseValue): StyleBuilder;
763
+ function borderSpacing(value: CSSLengthValue): StyleBuilder;
764
+ function captionSide(value: CaptionSideValue): StyleBuilder;
765
+ function emptyCells(value: EmptyCellsValue): StyleBuilder;
766
+ function tableLayout(value: TableLayoutValue): StyleBuilder;
501
767
 
502
768
  // Content
503
- function content(value: string): StyleBuilder;
504
- function quotes(value: string): StyleBuilder;
505
- function counterReset(value: string): StyleBuilder;
506
- function counterIncrement(value: string): StyleBuilder;
769
+ function content(value: CSSContentValue | "normal" | "none"): StyleBuilder;
770
+ function quotes(value: string | "none"): StyleBuilder;
771
+ function counterReset(value: string | "none"): StyleBuilder;
772
+ function counterIncrement(value: string | "none"): StyleBuilder;
507
773
 
508
774
  // User interface
509
- function appearance(value: string): StyleBuilder;
510
- function userSelect(value: string): StyleBuilder;
511
- function pointerEvents(value: string): StyleBuilder;
512
- function resize(value: string): StyleBuilder;
513
- function scrollBehavior(value: string): StyleBuilder;
775
+ function appearance(value: AppearanceValue): StyleBuilder;
776
+ function userSelect(value: UserSelectValue): StyleBuilder;
777
+ function pointerEvents(value: PointerEventsValue): StyleBuilder;
778
+ function resize(value: ResizeValue): StyleBuilder;
779
+ function scrollBehavior(value: ScrollBehaviorValue): StyleBuilder;
514
780
 
515
781
  // Clip (Note: clipPath conflicts with SVG clipPath element, use module import if needed)
516
- function clip(value: string): StyleBuilder;
517
- // function clipPath(value: string): StyleBuilder; // Use: import { clipPath } from "nuclo"
782
+ function clip(value: string | "auto"): StyleBuilder;
783
+ // function clipPath(value: string | "none"): StyleBuilder; // Use: import { clipPath } from "nuclo"
518
784
 
519
785
  // Isolation
520
- function isolation(value: string): StyleBuilder;
786
+ function isolation(value: IsolationValue): StyleBuilder;
521
787
 
522
788
  // Mix blend mode
523
- function mixBlendMode(value: string): StyleBuilder;
789
+ function mixBlendMode(value: MixBlendModeValue): StyleBuilder;
524
790
 
525
791
  // Will change
526
- function willChange(value: string): StyleBuilder;
792
+ function willChange(value: string | "auto"): StyleBuilder;
527
793
 
528
794
  // Contain
529
- function contain(value: string): StyleBuilder;
795
+ function contain(value: ContainValue): StyleBuilder;
530
796
 
531
797
  // Page break
532
- function pageBreakBefore(value: string): StyleBuilder;
533
- function pageBreakAfter(value: string): StyleBuilder;
534
- function pageBreakInside(value: string): StyleBuilder;
798
+ function pageBreakBefore(value: PageBreakValue): StyleBuilder;
799
+ function pageBreakAfter(value: PageBreakValue): StyleBuilder;
800
+ function pageBreakInside(value: PageBreakValue): StyleBuilder;
535
801
 
536
802
  // Break
537
- function breakBefore(value: string): StyleBuilder;
538
- function breakAfter(value: string): StyleBuilder;
539
- function breakInside(value: string): StyleBuilder;
803
+ function breakBefore(value: BreakValue): StyleBuilder;
804
+ function breakAfter(value: BreakValue): StyleBuilder;
805
+ function breakInside(value: BreakValue): StyleBuilder;
540
806
 
541
807
  // Orphans and widows
542
- function orphans(value: string): StyleBuilder;
543
- function widows(value: string): StyleBuilder;
808
+ function orphans(value: number | string): StyleBuilder;
809
+ function widows(value: number | string): StyleBuilder;
544
810
 
545
811
  // Column
546
- function columnCount(value: string): StyleBuilder;
547
- function columnFill(value: string): StyleBuilder;
548
- function columnGap(value: string): StyleBuilder;
812
+ function columnCount(value: number | "auto" | string): StyleBuilder;
813
+ function columnFill(value: ColumnFillValue): StyleBuilder;
814
+ function columnGap(value: CSSLengthValue | "normal"): StyleBuilder;
549
815
  function columnRule(value: string): StyleBuilder;
550
- function columnRuleColor(value: string): StyleBuilder;
551
- function columnRuleStyle(value: string): StyleBuilder;
552
- function columnRuleWidth(value: string): StyleBuilder;
553
- function columnSpan(value: string): StyleBuilder;
554
- function columnWidth(value: string): StyleBuilder;
816
+ function columnRuleColor(value: CSSColorValue): StyleBuilder;
817
+ function columnRuleStyle(value: ColumnRuleStyleValue): StyleBuilder;
818
+ function columnRuleWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
819
+ function columnSpan(value: ColumnSpanValue): StyleBuilder;
820
+ function columnWidth(value: CSSLengthValue | "auto"): StyleBuilder;
555
821
  function columns(value: string): StyleBuilder;
556
822
 
557
823
  // Interaction
558
- function cursor(value: string): StyleBuilder;
824
+ function cursor(value: CursorValue): StyleBuilder;
825
+
826
+ // Layout - Additional
827
+ function aspectRatio(value: CSSAspectRatioValue): StyleBuilder;
828
+ function clear(value: ClearValue): StyleBuilder;
829
+ function float(value: FloatValue): StyleBuilder;
830
+ function order(value: number | string): StyleBuilder;
831
+
832
+ // Flexbox - Place properties
833
+ function placeContent(value: string): StyleBuilder;
834
+ function placeItems(value: string): StyleBuilder;
835
+ function placeSelf(value: string): StyleBuilder;
836
+
837
+ // Text - Additional
838
+ function hyphens(value: HyphensValue): StyleBuilder;
839
+ function lineBreak(value: LineBreakValue): StyleBuilder;
840
+ function wordBreak(value: WordBreakValue): StyleBuilder;
841
+ function textOrientation(value: TextOrientationValue): StyleBuilder;
842
+ function writingMode(value: WritingModeValue): StyleBuilder;
843
+ function direction(value: DirectionValue): StyleBuilder;
844
+ function unicodeBidi(value: UnicodeBidiValue): StyleBuilder;
845
+
846
+ // Background - Additional
847
+ function backgroundBlendMode(value: BackgroundBlendModeValue): StyleBuilder;
848
+ function backgroundPositionX(value: string): StyleBuilder;
849
+ function backgroundPositionY(value: string): StyleBuilder;
850
+
851
+ // Border Image
852
+ function borderImage(value: string): StyleBuilder;
853
+ function borderImageSource(value: CSSBackgroundImageValue | "none"): StyleBuilder;
854
+ function borderImageSlice(value: string | number): StyleBuilder;
855
+ function borderImageWidth(value: CSSLengthValue | number): StyleBuilder;
856
+ function borderImageOutset(value: CSSLengthValue | number): StyleBuilder;
857
+ function borderImageRepeat(value: BackgroundRepeatValue): StyleBuilder;
858
+
859
+ // Logical Properties - Inset
860
+ function inset(value: CSSLengthValue | "auto"): StyleBuilder;
861
+ function insetBlock(value: CSSLengthValue): StyleBuilder;
862
+ function insetBlockStart(value: CSSLengthValue | "auto"): StyleBuilder;
863
+ function insetBlockEnd(value: CSSLengthValue | "auto"): StyleBuilder;
864
+ function insetInline(value: CSSLengthValue): StyleBuilder;
865
+ function insetInlineStart(value: CSSLengthValue | "auto"): StyleBuilder;
866
+ function insetInlineEnd(value: CSSLengthValue | "auto"): StyleBuilder;
867
+
868
+ // Logical Properties - Margin
869
+ function marginBlock(value: CSSLengthValue | "auto"): StyleBuilder;
870
+ function marginBlockStart(value: CSSLengthValue | "auto"): StyleBuilder;
871
+ function marginBlockEnd(value: CSSLengthValue | "auto"): StyleBuilder;
872
+ function marginInline(value: CSSLengthValue | "auto"): StyleBuilder;
873
+ function marginInlineStart(value: CSSLengthValue | "auto"): StyleBuilder;
874
+ function marginInlineEnd(value: CSSLengthValue | "auto"): StyleBuilder;
875
+
876
+ // Logical Properties - Padding
877
+ function paddingBlock(value: CSSLengthValue): StyleBuilder;
878
+ function paddingBlockStart(value: CSSLengthValue): StyleBuilder;
879
+ function paddingBlockEnd(value: CSSLengthValue): StyleBuilder;
880
+ function paddingInline(value: CSSLengthValue): StyleBuilder;
881
+ function paddingInlineStart(value: CSSLengthValue): StyleBuilder;
882
+ function paddingInlineEnd(value: CSSLengthValue): StyleBuilder;
883
+
884
+ // Logical Properties - Size
885
+ function inlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
886
+ function blockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
887
+ function minInlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
888
+ function minBlockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
889
+ function maxInlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): StyleBuilder;
890
+ function maxBlockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): StyleBuilder;
891
+
892
+ // Logical Properties - Border
893
+ function borderBlock(value: string): StyleBuilder;
894
+ function borderBlockStart(value: string): StyleBuilder;
895
+ function borderBlockEnd(value: string): StyleBuilder;
896
+ function borderInline(value: string): StyleBuilder;
897
+ function borderInlineStart(value: string): StyleBuilder;
898
+ function borderInlineEnd(value: string): StyleBuilder;
899
+ function borderBlockWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
900
+ function borderBlockStartWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
901
+ function borderBlockEndWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
902
+ function borderInlineWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
903
+ function borderInlineStartWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
904
+ function borderInlineEndWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
905
+ function borderBlockStyle(value: BorderStyleValue): StyleBuilder;
906
+ function borderBlockStartStyle(value: BorderStyleValue): StyleBuilder;
907
+ function borderBlockEndStyle(value: BorderStyleValue): StyleBuilder;
908
+ function borderInlineStyle(value: BorderStyleValue): StyleBuilder;
909
+ function borderInlineStartStyle(value: BorderStyleValue): StyleBuilder;
910
+ function borderInlineEndStyle(value: BorderStyleValue): StyleBuilder;
911
+ function borderBlockColor(value: CSSColorValue): StyleBuilder;
912
+ function borderBlockStartColor(value: CSSColorValue): StyleBuilder;
913
+ function borderBlockEndColor(value: CSSColorValue): StyleBuilder;
914
+ function borderInlineColor(value: CSSColorValue): StyleBuilder;
915
+ function borderInlineStartColor(value: CSSColorValue): StyleBuilder;
916
+ function borderInlineEndColor(value: CSSColorValue): StyleBuilder;
917
+
918
+ // Logical Properties - Border Radius
919
+ function borderStartStartRadius(value: CSSLengthValue): StyleBuilder;
920
+ function borderStartEndRadius(value: CSSLengthValue): StyleBuilder;
921
+ function borderEndStartRadius(value: CSSLengthValue): StyleBuilder;
922
+ function borderEndEndRadius(value: CSSLengthValue): StyleBuilder;
923
+
924
+ // Scroll
925
+ function scrollMargin(value: CSSLengthValue): StyleBuilder;
926
+ function scrollMarginTop(value: CSSLengthValue): StyleBuilder;
927
+ function scrollMarginRight(value: CSSLengthValue): StyleBuilder;
928
+ function scrollMarginBottom(value: CSSLengthValue): StyleBuilder;
929
+ function scrollMarginLeft(value: CSSLengthValue): StyleBuilder;
930
+ function scrollPadding(value: CSSLengthValue): StyleBuilder;
931
+ function scrollPaddingTop(value: CSSLengthValue): StyleBuilder;
932
+ function scrollPaddingRight(value: CSSLengthValue): StyleBuilder;
933
+ function scrollPaddingBottom(value: CSSLengthValue): StyleBuilder;
934
+ function scrollPaddingLeft(value: CSSLengthValue): StyleBuilder;
935
+ function overscrollBehavior(value: OverscrollBehaviorValue): StyleBuilder;
936
+ function overscrollBehaviorX(value: OverscrollBehaviorValue): StyleBuilder;
937
+ function overscrollBehaviorY(value: OverscrollBehaviorValue): StyleBuilder;
938
+
939
+ // Caret
940
+ function caretColor(value: CaretColorValue): StyleBuilder;
941
+ function caretShape(value: CaretShapeValue): StyleBuilder;
942
+ function caretAnimation(value: string): StyleBuilder;
943
+
944
+ // Other
945
+ function imageRendering(value: ImageRenderingValue): StyleBuilder;
946
+ function colorScheme(value: ColorSchemeValue): StyleBuilder;
947
+ function contentVisibility(value: ContentVisibilityValue): StyleBuilder;
948
+ function touchAction(value: TouchActionValue): StyleBuilder;
949
+
950
+ // Container Queries
951
+ function containerType(value: ContainerTypeValue): StyleBuilder;
952
+ function containerName(value: string): StyleBuilder;
953
+ function container(value: string): StyleBuilder;
954
+
955
+ // Font - Additional
956
+ function fontFeatureSettings(value: string): StyleBuilder;
957
+ function fontKerning(value: FontKerningValue): StyleBuilder;
958
+ function fontSynthesis(value: FontSynthesisValue): StyleBuilder;
959
+ function fontOpticalSizing(value: FontOpticalSizingValue): StyleBuilder;
960
+ function fontDisplay(value: FontDisplayValue): StyleBuilder;
961
+ function fontVariantCaps(value: FontVariantCapsValue): StyleBuilder;
962
+ function fontVariantNumeric(value: string): StyleBuilder;
963
+ function fontVariantLigatures(value: string): StyleBuilder;
964
+ function fontVariantEastAsian(value: string): StyleBuilder;
965
+ function fontVariantAlternates(value: string): StyleBuilder;
966
+ function fontVariantPosition(value: string): StyleBuilder;
967
+
968
+ // Text - Additional
969
+ function textRendering(value: TextRenderingValue): StyleBuilder;
970
+ function textCombineUpright(value: TextCombineUprightValue): StyleBuilder;
971
+ function textSizeAdjust(value: string | "auto" | "none" | `${number}%`): StyleBuilder;
972
+
973
+ // Mask (Note: mask conflicts with SVG mask element, use module import if needed)
974
+ // function mask(value: string): StyleBuilder; // Use: import { mask } from "nuclo"
975
+ function maskImage(value: CSSBackgroundImageValue | "none"): StyleBuilder;
976
+ function maskMode(value: string): StyleBuilder;
977
+ function maskRepeat(value: BackgroundRepeatValue): StyleBuilder;
978
+ function maskPosition(value: string): StyleBuilder;
979
+ function maskSize(value: CSSLengthValue | "auto" | "cover" | "contain"): StyleBuilder;
980
+ function maskOrigin(value: BackgroundOriginValue): StyleBuilder;
981
+ function maskClip(value: BackgroundClipValue): StyleBuilder;
982
+ function maskComposite(value: MaskCompositeValue): StyleBuilder;
983
+
984
+ // Clip
985
+ function clipRule(value: ClipRuleValue): StyleBuilder;
986
+
987
+ // Grid - Additional
988
+ function gridColumnGap(value: CSSLengthValue): StyleBuilder;
989
+ function gridRowGap(value: CSSLengthValue): StyleBuilder;
990
+ function gridGap(value: CSSLengthValue): StyleBuilder;
559
991
  }
560
992
 
561
993
  // Export StyleBuilder class with all its methods (for module imports)
@@ -564,85 +996,85 @@ export class StyleBuilder {
564
996
  add(property: string, value: string): this;
565
997
 
566
998
  // Display
567
- display(value: string): this;
568
- flex(value?: string): this;
999
+ display(value: DisplayValue): this;
1000
+ flex(value?: CSSLengthValue | "auto" | "initial" | "none" | "1" | "0"): this;
569
1001
  grid(): this;
570
1002
 
571
1003
  // Colors
572
- bg(color: string): this;
573
- color(color: string): this;
574
- accentColor(value: string): this;
1004
+ bg(color: CSSColorValue): this;
1005
+ color(color: CSSColorValue): this;
1006
+ accentColor(value: CSSColorValue): this;
575
1007
 
576
1008
  // Typography
577
- fontSize(size: string): this;
578
- fontWeight(value: string): this;
579
- fontFamily(value: string): this;
580
- lineHeight(value: string): this;
581
- letterSpacing(value: string): this;
582
- textAlign(value: string): this;
583
- textDecoration(value: string): this;
1009
+ fontSize(size: CSSLengthValue): this;
1010
+ fontWeight(value: FontWeightValue): this;
1011
+ fontFamily(value: CSSFontFamilyValue): this;
1012
+ lineHeight(value: CSSLengthValue | "normal" | number): this;
1013
+ letterSpacing(value: CSSLengthValue | "normal"): this;
1014
+ textAlign(value: TextAlignValue): this;
1015
+ textDecoration(value: TextDecorationValue): this;
584
1016
  bold(): this;
585
- fontStyle(value: string): this;
1017
+ fontStyle(value: FontStyleValue): this;
586
1018
  fontVariant(value: string): this;
587
1019
  fontStretch(value: string): this;
588
- textTransform(value: string): this;
589
- textIndent(value: string): this;
590
- textOverflow(value: string): this;
1020
+ textTransform(value: TextTransformValue): this;
1021
+ textIndent(value: CSSLengthValue): this;
1022
+ textOverflow(value: TextOverflowValue): this;
591
1023
  textShadow(value: string): this;
592
- whiteSpace(value: string): this;
593
- wordSpacing(value: string): this;
594
- wordWrap(value: string): this;
595
- overflowWrap(value: string): this;
596
- textAlignLast(value: string): this;
597
- textJustify(value: string): this;
598
- textDecorationLine(value: string): this;
599
- textDecorationColor(value: string): this;
600
- textDecorationStyle(value: string): this;
601
- textDecorationThickness(value: string): this;
602
- textUnderlineOffset(value: string): this;
603
- verticalAlign(value: string): this;
1024
+ whiteSpace(value: WhiteSpaceValue): this;
1025
+ wordSpacing(value: CSSLengthValue | "normal"): this;
1026
+ wordWrap(value: WordWrapValue): this;
1027
+ overflowWrap(value: OverflowWrapValue): this;
1028
+ textAlignLast(value: TextAlignLastValue): this;
1029
+ textJustify(value: TextJustifyValue): this;
1030
+ textDecorationLine(value: TextDecorationLineValue): this;
1031
+ textDecorationColor(value: CSSColorValue): this;
1032
+ textDecorationStyle(value: TextDecorationStyleValue): this;
1033
+ textDecorationThickness(value: CSSLengthValue | "auto" | "from-font"): this;
1034
+ textUnderlineOffset(value: CSSLengthValue | "auto"): this;
1035
+ verticalAlign(value: VerticalAlignValue): this;
604
1036
 
605
1037
  // Layout
606
- position(value: string): this;
607
- padding(value: string): this;
608
- paddingTop(value: string): this;
609
- paddingRight(value: string): this;
610
- paddingBottom(value: string): this;
611
- paddingLeft(value: string): this;
612
- margin(value: string): this;
613
- marginTop(value: string): this;
614
- marginRight(value: string): this;
615
- marginBottom(value: string): this;
616
- marginLeft(value: string): this;
617
- width(value: string): this;
618
- height(value: string): this;
619
- minWidth(value: string): this;
620
- maxWidth(value: string): this;
621
- minHeight(value: string): this;
622
- maxHeight(value: string): this;
623
- boxSizing(value: string): this;
1038
+ position(value: PositionValue): this;
1039
+ padding(value: CSSLengthValue): this;
1040
+ paddingTop(value: CSSLengthValue): this;
1041
+ paddingRight(value: CSSLengthValue): this;
1042
+ paddingBottom(value: CSSLengthValue): this;
1043
+ paddingLeft(value: CSSLengthValue): this;
1044
+ margin(value: CSSLengthValue | "auto"): this;
1045
+ marginTop(value: CSSLengthValue | "auto"): this;
1046
+ marginRight(value: CSSLengthValue | "auto"): this;
1047
+ marginBottom(value: CSSLengthValue | "auto"): this;
1048
+ marginLeft(value: CSSLengthValue | "auto"): this;
1049
+ width(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
1050
+ height(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
1051
+ minWidth(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
1052
+ maxWidth(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): this;
1053
+ minHeight(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
1054
+ maxHeight(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): this;
1055
+ boxSizing(value: BoxSizingValue): this;
624
1056
 
625
1057
  // Positioning
626
- top(value: string): this;
627
- right(value: string): this;
628
- bottom(value: string): this;
629
- left(value: string): this;
630
- zIndex(value: string): this;
1058
+ top(value: CSSLengthValue | "auto"): this;
1059
+ right(value: CSSLengthValue | "auto"): this;
1060
+ bottom(value: CSSLengthValue | "auto"): this;
1061
+ left(value: CSSLengthValue | "auto"): this;
1062
+ zIndex(value: number | "auto"): this;
631
1063
 
632
1064
  // Flexbox
633
- flexDirection(value: string): this;
634
- alignItems(value: string): this;
635
- justifyContent(value: string): this;
1065
+ flexDirection(value: FlexDirectionValue): this;
1066
+ alignItems(value: AlignItemsValue): this;
1067
+ justifyContent(value: JustifyContentValue): this;
636
1068
  center(): this;
637
- gap(value: string): this;
638
- flexWrap(value: string): this;
639
- flexGrow(value: string): this;
640
- flexShrink(value: string): this;
641
- flexBasis(value: string): this;
642
- alignSelf(value: string): this;
643
- alignContent(value: string): this;
644
- justifySelf(value: string): this;
645
- justifyItems(value: string): this;
1069
+ gap(value: CSSLengthValue): this;
1070
+ flexWrap(value: FlexWrapValue): this;
1071
+ flexGrow(value: number | string): this;
1072
+ flexShrink(value: number | string): this;
1073
+ flexBasis(value: CSSLengthValue | "auto" | "content" | "fit-content"): this;
1074
+ alignSelf(value: AlignSelfValue): this;
1075
+ alignContent(value: AlignContentValue): this;
1076
+ justifySelf(value: JustifySelfValue): this;
1077
+ justifyItems(value: JustifyItemsValue): this;
646
1078
 
647
1079
  // Grid
648
1080
  gridTemplateColumns(value: string): this;
@@ -650,14 +1082,14 @@ export class StyleBuilder {
650
1082
  gridTemplateAreas(value: string): this;
651
1083
  gridColumn(value: string): this;
652
1084
  gridRow(value: string): this;
653
- gridColumnStart(value: string): this;
654
- gridColumnEnd(value: string): this;
655
- gridRowStart(value: string): this;
656
- gridRowEnd(value: string): this;
1085
+ gridColumnStart(value: string | number | "auto"): this;
1086
+ gridColumnEnd(value: string | number | "auto"): this;
1087
+ gridRowStart(value: string | number | "auto"): this;
1088
+ gridRowEnd(value: string | number | "auto"): this;
657
1089
  gridArea(value: string): this;
658
- gridAutoColumns(value: string): this;
659
- gridAutoRows(value: string): this;
660
- gridAutoFlow(value: string): this;
1090
+ gridAutoColumns(value: CSSLengthValue): this;
1091
+ gridAutoRows(value: CSSLengthValue): this;
1092
+ gridAutoFlow(value: GridAutoFlowValue): this;
661
1093
 
662
1094
  // Borders
663
1095
  border(value: string): this;
@@ -665,241 +1097,407 @@ export class StyleBuilder {
665
1097
  borderRight(value: string): this;
666
1098
  borderBottom(value: string): this;
667
1099
  borderLeft(value: string): this;
668
- borderWidth(value: string): this;
669
- borderStyle(value: string): this;
670
- borderColor(value: string): this;
671
- borderTopWidth(value: string): this;
672
- borderRightWidth(value: string): this;
673
- borderBottomWidth(value: string): this;
674
- borderLeftWidth(value: string): this;
675
- borderTopStyle(value: string): this;
676
- borderRightStyle(value: string): this;
677
- borderBottomStyle(value: string): this;
678
- borderLeftStyle(value: string): this;
679
- borderTopColor(value: string): this;
680
- borderRightColor(value: string): this;
681
- borderBottomColor(value: string): this;
682
- borderLeftColor(value: string): this;
683
- borderRadius(value: string): this;
684
- borderTopLeftRadius(value: string): this;
685
- borderTopRightRadius(value: string): this;
686
- borderBottomLeftRadius(value: string): this;
687
- borderBottomRightRadius(value: string): this;
1100
+ borderWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1101
+ borderStyle(value: BorderStyleValue): this;
1102
+ borderColor(value: CSSColorValue): this;
1103
+ borderTopWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1104
+ borderRightWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1105
+ borderBottomWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1106
+ borderLeftWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1107
+ borderTopStyle(value: BorderStyleValue): this;
1108
+ borderRightStyle(value: BorderStyleValue): this;
1109
+ borderBottomStyle(value: BorderStyleValue): this;
1110
+ borderLeftStyle(value: BorderStyleValue): this;
1111
+ borderTopColor(value: CSSColorValue): this;
1112
+ borderRightColor(value: CSSColorValue): this;
1113
+ borderBottomColor(value: CSSColorValue): this;
1114
+ borderLeftColor(value: CSSColorValue): this;
1115
+ borderRadius(value: CSSLengthValue): this;
1116
+ borderTopLeftRadius(value: CSSLengthValue): this;
1117
+ borderTopRightRadius(value: CSSLengthValue): this;
1118
+ borderBottomLeftRadius(value: CSSLengthValue): this;
1119
+ borderBottomRightRadius(value: CSSLengthValue): this;
688
1120
 
689
1121
  // Outline
690
1122
  outline(value: string): this;
691
- outlineWidth(value: string): this;
692
- outlineStyle(value: string): this;
693
- outlineColor(value: string): this;
694
- outlineOffset(value: string): this;
1123
+ outlineWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1124
+ outlineStyle(value: OutlineStyleValue): this;
1125
+ outlineColor(value: CSSColorValue): this;
1126
+ outlineOffset(value: CSSLengthValue): this;
695
1127
 
696
1128
  // Background
697
- backgroundColor(value: string): this;
698
- backgroundImage(value: string): this;
699
- backgroundRepeat(value: string): this;
1129
+ backgroundColor(value: CSSColorValue): this;
1130
+ backgroundImage(value: CSSBackgroundImageValue | "none"): this;
1131
+ backgroundRepeat(value: BackgroundRepeatValue): this;
700
1132
  backgroundPosition(value: string): this;
701
- backgroundSize(value: string): this;
702
- backgroundAttachment(value: string): this;
703
- backgroundClip(value: string): this;
704
- backgroundOrigin(value: string): this;
1133
+ backgroundSize(value: CSSLengthValue | "auto" | "cover" | "contain"): this;
1134
+ backgroundAttachment(value: BackgroundAttachmentValue): this;
1135
+ backgroundClip(value: BackgroundClipValue): this;
1136
+ backgroundOrigin(value: BackgroundOriginValue): this;
705
1137
 
706
1138
  // Effects
707
- boxShadow(value: string): this;
708
- opacity(value: string): this;
1139
+ boxShadow(value: string | "none"): this;
1140
+ opacity(value: number | string): this;
709
1141
  transition(value: string): this;
710
- transitionProperty(value: string): this;
711
- transitionDuration(value: string): this;
712
- transitionTimingFunction(value: string): this;
713
- transitionDelay(value: string): this;
1142
+ transitionProperty(value: string | "none" | "all"): this;
1143
+ transitionDuration(value: string | number): this;
1144
+ transitionTimingFunction(value: CSSTimingFunctionValue): this;
1145
+ transitionDelay(value: string | number): this;
714
1146
 
715
1147
  // Transform
716
- transform(value: string): this;
1148
+ transform(value: CSSTransformValue | "none"): this;
717
1149
  transformOrigin(value: string): this;
718
- transformStyle(value: string): this;
719
- perspective(value: string): this;
1150
+ transformStyle(value: TransformStyleValue): this;
1151
+ perspective(value: CSSLengthValue | "none"): this;
720
1152
  perspectiveOrigin(value: string): this;
721
- backfaceVisibility(value: string): this;
1153
+ backfaceVisibility(value: BackfaceVisibilityValue): this;
722
1154
 
723
1155
  // Animation
724
1156
  animation(value: string): this;
725
- animationName(value: string): this;
726
- animationDuration(value: string): this;
727
- animationTimingFunction(value: string): this;
728
- animationDelay(value: string): this;
729
- animationIterationCount(value: string): this;
730
- animationDirection(value: string): this;
731
- animationFillMode(value: string): this;
732
- animationPlayState(value: string): this;
1157
+ animationName(value: CSSAnimationNameValue): this;
1158
+ animationDuration(value: string | number): this;
1159
+ animationTimingFunction(value: CSSTimingFunctionValue): this;
1160
+ animationDelay(value: string | number): this;
1161
+ animationIterationCount(value: number | "infinite" | string): this;
1162
+ animationDirection(value: AnimationDirectionValue): this;
1163
+ animationFillMode(value: AnimationFillModeValue): this;
1164
+ animationPlayState(value: AnimationPlayStateValue): this;
733
1165
 
734
1166
  // Filter
735
- filter(value: string): this;
736
- backdropFilter(value: string): this;
1167
+ filter(value: CSSFilterValue | "none"): this;
1168
+ backdropFilter(value: CSSFilterValue | "none"): this;
737
1169
 
738
1170
  // Overflow
739
- overflow(value: string): this;
740
- overflowX(value: string): this;
741
- overflowY(value: string): this;
1171
+ overflow(value: OverflowValue): this;
1172
+ overflowX(value: OverflowValue): this;
1173
+ overflowY(value: OverflowValue): this;
742
1174
 
743
1175
  // Visibility
744
- visibility(value: string): this;
1176
+ visibility(value: VisibilityValue): this;
745
1177
 
746
1178
  // Object fit/position
747
- objectFit(value: string): this;
1179
+ objectFit(value: ObjectFitValue): this;
748
1180
  objectPosition(value: string): this;
749
1181
 
750
1182
  // List
751
1183
  listStyle(value: string): this;
752
- listStyleType(value: string): this;
753
- listStylePosition(value: string): this;
754
- listStyleImage(value: string): this;
1184
+ listStyleType(value: ListStyleTypeValue): this;
1185
+ listStylePosition(value: ListStylePositionValue): this;
1186
+ listStyleImage(value: CSSBackgroundImageValue | "none"): this;
755
1187
 
756
1188
  // Table
757
- borderCollapse(value: string): this;
758
- borderSpacing(value: string): this;
759
- captionSide(value: string): this;
760
- emptyCells(value: string): this;
761
- tableLayout(value: string): this;
1189
+ borderCollapse(value: BorderCollapseValue): this;
1190
+ borderSpacing(value: CSSLengthValue): this;
1191
+ captionSide(value: CaptionSideValue): this;
1192
+ emptyCells(value: EmptyCellsValue): this;
1193
+ tableLayout(value: TableLayoutValue): this;
762
1194
 
763
1195
  // Content
764
- content(value: string): this;
765
- quotes(value: string): this;
766
- counterReset(value: string): this;
767
- counterIncrement(value: string): this;
1196
+ content(value: CSSContentValue | "normal" | "none"): this;
1197
+ quotes(value: string | "none"): this;
1198
+ counterReset(value: string | "none"): this;
1199
+ counterIncrement(value: string | "none"): this;
768
1200
 
769
1201
  // User interface
770
- appearance(value: string): this;
771
- userSelect(value: string): this;
772
- pointerEvents(value: string): this;
773
- resize(value: string): this;
774
- scrollBehavior(value: string): this;
1202
+ appearance(value: AppearanceValue): this;
1203
+ userSelect(value: UserSelectValue): this;
1204
+ pointerEvents(value: PointerEventsValue): this;
1205
+ resize(value: ResizeValue): this;
1206
+ scrollBehavior(value: ScrollBehaviorValue): this;
775
1207
 
776
1208
  // Clip
777
- clip(value: string): this;
778
- clipPath(value: string): this;
1209
+ clip(value: string | "auto"): this;
1210
+ clipPath(value: string | "none"): this;
779
1211
 
780
1212
  // Isolation
781
- isolation(value: string): this;
1213
+ isolation(value: IsolationValue): this;
782
1214
 
783
1215
  // Mix blend mode
784
- mixBlendMode(value: string): this;
1216
+ mixBlendMode(value: MixBlendModeValue): this;
785
1217
 
786
1218
  // Will change
787
- willChange(value: string): this;
1219
+ willChange(value: string | "auto"): this;
788
1220
 
789
1221
  // Contain
790
- contain(value: string): this;
1222
+ contain(value: ContainValue): this;
791
1223
 
792
1224
  // Page break
793
- pageBreakBefore(value: string): this;
794
- pageBreakAfter(value: string): this;
795
- pageBreakInside(value: string): this;
1225
+ pageBreakBefore(value: PageBreakValue): this;
1226
+ pageBreakAfter(value: PageBreakValue): this;
1227
+ pageBreakInside(value: PageBreakValue): this;
796
1228
 
797
1229
  // Break
798
- breakBefore(value: string): this;
799
- breakAfter(value: string): this;
800
- breakInside(value: string): this;
1230
+ breakBefore(value: BreakValue): this;
1231
+ breakAfter(value: BreakValue): this;
1232
+ breakInside(value: BreakValue): this;
801
1233
 
802
1234
  // Orphans and widows
803
- orphans(value: string): this;
804
- widows(value: string): this;
1235
+ orphans(value: number | string): this;
1236
+ widows(value: number | string): this;
805
1237
 
806
1238
  // Column
807
- columnCount(value: string): this;
808
- columnFill(value: string): this;
809
- columnGap(value: string): this;
1239
+ columnCount(value: number | "auto" | string): this;
1240
+ columnFill(value: ColumnFillValue): this;
1241
+ columnGap(value: CSSLengthValue | "normal"): this;
810
1242
  columnRule(value: string): this;
811
- columnRuleColor(value: string): this;
812
- columnRuleStyle(value: string): this;
813
- columnRuleWidth(value: string): this;
814
- columnSpan(value: string): this;
815
- columnWidth(value: string): this;
1243
+ columnRuleColor(value: CSSColorValue): this;
1244
+ columnRuleStyle(value: ColumnRuleStyleValue): this;
1245
+ columnRuleWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1246
+ columnSpan(value: ColumnSpanValue): this;
1247
+ columnWidth(value: CSSLengthValue | "auto"): this;
816
1248
  columns(value: string): this;
817
1249
 
818
1250
  // Interaction
819
- cursor(value: string): this;
1251
+ cursor(value: CursorValue): this;
1252
+
1253
+ // Layout - Additional
1254
+ aspectRatio(value: CSSAspectRatioValue): this;
1255
+ clear(value: ClearValue): this;
1256
+ float(value: FloatValue): this;
1257
+ order(value: number | string): this;
1258
+
1259
+ // Flexbox - Place properties
1260
+ placeContent(value: string): this;
1261
+ placeItems(value: string): this;
1262
+ placeSelf(value: string): this;
1263
+
1264
+ // Text - Additional
1265
+ hyphens(value: HyphensValue): this;
1266
+ lineBreak(value: LineBreakValue): this;
1267
+ wordBreak(value: WordBreakValue): this;
1268
+ textOrientation(value: TextOrientationValue): this;
1269
+ writingMode(value: WritingModeValue): this;
1270
+ direction(value: DirectionValue): this;
1271
+ unicodeBidi(value: UnicodeBidiValue): this;
1272
+
1273
+ // Background - Additional
1274
+ backgroundBlendMode(value: BackgroundBlendModeValue): this;
1275
+ backgroundPositionX(value: string): this;
1276
+ backgroundPositionY(value: string): this;
1277
+
1278
+ // Border Image
1279
+ borderImage(value: string): this;
1280
+ borderImageSource(value: CSSBackgroundImageValue | "none"): this;
1281
+ borderImageSlice(value: string | number): this;
1282
+ borderImageWidth(value: CSSLengthValue | number): this;
1283
+ borderImageOutset(value: CSSLengthValue | number): this;
1284
+ borderImageRepeat(value: BackgroundRepeatValue): this;
1285
+
1286
+ // Logical Properties - Inset
1287
+ inset(value: CSSLengthValue | "auto"): this;
1288
+ insetBlock(value: CSSLengthValue): this;
1289
+ insetBlockStart(value: CSSLengthValue | "auto"): this;
1290
+ insetBlockEnd(value: CSSLengthValue | "auto"): this;
1291
+ insetInline(value: CSSLengthValue): this;
1292
+ insetInlineStart(value: CSSLengthValue | "auto"): this;
1293
+ insetInlineEnd(value: CSSLengthValue | "auto"): this;
1294
+
1295
+ // Logical Properties - Margin
1296
+ marginBlock(value: CSSLengthValue | "auto"): this;
1297
+ marginBlockStart(value: CSSLengthValue | "auto"): this;
1298
+ marginBlockEnd(value: CSSLengthValue | "auto"): this;
1299
+ marginInline(value: CSSLengthValue | "auto"): this;
1300
+ marginInlineStart(value: CSSLengthValue | "auto"): this;
1301
+ marginInlineEnd(value: CSSLengthValue | "auto"): this;
1302
+
1303
+ // Logical Properties - Padding
1304
+ paddingBlock(value: CSSLengthValue): this;
1305
+ paddingBlockStart(value: CSSLengthValue): this;
1306
+ paddingBlockEnd(value: CSSLengthValue): this;
1307
+ paddingInline(value: CSSLengthValue): this;
1308
+ paddingInlineStart(value: CSSLengthValue): this;
1309
+ paddingInlineEnd(value: CSSLengthValue): this;
1310
+
1311
+ // Logical Properties - Size
1312
+ inlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
1313
+ blockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
1314
+ minInlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
1315
+ minBlockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): this;
1316
+ maxInlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): this;
1317
+ maxBlockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): this;
1318
+
1319
+ // Logical Properties - Border
1320
+ borderBlock(value: string): this;
1321
+ borderBlockStart(value: string): this;
1322
+ borderBlockEnd(value: string): this;
1323
+ borderInline(value: string): this;
1324
+ borderInlineStart(value: string): this;
1325
+ borderInlineEnd(value: string): this;
1326
+ borderBlockWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1327
+ borderBlockStartWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1328
+ borderBlockEndWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1329
+ borderInlineWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1330
+ borderInlineStartWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1331
+ borderInlineEndWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): this;
1332
+ borderBlockStyle(value: BorderStyleValue): this;
1333
+ borderBlockStartStyle(value: BorderStyleValue): this;
1334
+ borderBlockEndStyle(value: BorderStyleValue): this;
1335
+ borderInlineStyle(value: BorderStyleValue): this;
1336
+ borderInlineStartStyle(value: BorderStyleValue): this;
1337
+ borderInlineEndStyle(value: BorderStyleValue): this;
1338
+ borderBlockColor(value: CSSColorValue): this;
1339
+ borderBlockStartColor(value: CSSColorValue): this;
1340
+ borderBlockEndColor(value: CSSColorValue): this;
1341
+ borderInlineColor(value: CSSColorValue): this;
1342
+ borderInlineStartColor(value: CSSColorValue): this;
1343
+ borderInlineEndColor(value: CSSColorValue): this;
1344
+
1345
+ // Logical Properties - Border Radius
1346
+ borderStartStartRadius(value: CSSLengthValue): this;
1347
+ borderStartEndRadius(value: CSSLengthValue): this;
1348
+ borderEndStartRadius(value: CSSLengthValue): this;
1349
+ borderEndEndRadius(value: CSSLengthValue): this;
1350
+
1351
+ // Scroll
1352
+ scrollMargin(value: CSSLengthValue): this;
1353
+ scrollMarginTop(value: CSSLengthValue): this;
1354
+ scrollMarginRight(value: CSSLengthValue): this;
1355
+ scrollMarginBottom(value: CSSLengthValue): this;
1356
+ scrollMarginLeft(value: CSSLengthValue): this;
1357
+ scrollPadding(value: CSSLengthValue): this;
1358
+ scrollPaddingTop(value: CSSLengthValue): this;
1359
+ scrollPaddingRight(value: CSSLengthValue): this;
1360
+ scrollPaddingBottom(value: CSSLengthValue): this;
1361
+ scrollPaddingLeft(value: CSSLengthValue): this;
1362
+ overscrollBehavior(value: OverscrollBehaviorValue): this;
1363
+ overscrollBehaviorX(value: OverscrollBehaviorValue): this;
1364
+ overscrollBehaviorY(value: OverscrollBehaviorValue): this;
1365
+
1366
+ // Caret
1367
+ caretColor(value: CaretColorValue): this;
1368
+ caretShape(value: CaretShapeValue): this;
1369
+ caretAnimation(value: string): this;
1370
+
1371
+ // Other
1372
+ imageRendering(value: ImageRenderingValue): this;
1373
+ colorScheme(value: ColorSchemeValue): this;
1374
+ contentVisibility(value: ContentVisibilityValue): this;
1375
+ touchAction(value: TouchActionValue): this;
1376
+
1377
+ // Container Queries
1378
+ containerType(value: ContainerTypeValue): this;
1379
+ containerName(value: string): this;
1380
+ container(value: string): this;
1381
+
1382
+ // Font - Additional
1383
+ fontFeatureSettings(value: string): this;
1384
+ fontKerning(value: FontKerningValue): this;
1385
+ fontSynthesis(value: FontSynthesisValue): this;
1386
+ fontOpticalSizing(value: FontOpticalSizingValue): this;
1387
+ fontDisplay(value: FontDisplayValue): this;
1388
+ fontVariantCaps(value: FontVariantCapsValue): this;
1389
+ fontVariantNumeric(value: string): this;
1390
+ fontVariantLigatures(value: string): this;
1391
+ fontVariantEastAsian(value: string): this;
1392
+ fontVariantAlternates(value: string): this;
1393
+ fontVariantPosition(value: string): this;
1394
+
1395
+ // Text - Additional
1396
+ textRendering(value: TextRenderingValue): this;
1397
+ textCombineUpright(value: TextCombineUprightValue): this;
1398
+ textSizeAdjust(value: string | "auto" | "none" | `${number}%`): this;
1399
+
1400
+ // Mask (Note: mask conflicts with SVG mask element, use module import if needed)
1401
+ // mask(value: string): this; // Use: import { mask } from "nuclo"
1402
+ maskImage(value: CSSBackgroundImageValue | "none"): this;
1403
+ maskMode(value: string): this;
1404
+ maskRepeat(value: BackgroundRepeatValue): this;
1405
+ maskPosition(value: string): this;
1406
+ maskSize(value: CSSLengthValue | "auto" | "cover" | "contain"): this;
1407
+ maskOrigin(value: BackgroundOriginValue): this;
1408
+ maskClip(value: BackgroundClipValue): this;
1409
+ maskComposite(value: MaskCompositeValue): this;
1410
+
1411
+ // Clip
1412
+ clipRule(value: ClipRuleValue): this;
1413
+
1414
+ // Grid - Additional
1415
+ gridColumnGap(value: CSSLengthValue): this;
1416
+ gridRowGap(value: CSSLengthValue): this;
1417
+ gridGap(value: CSSLengthValue): this;
820
1418
  }
821
1419
 
822
1420
  // Utility functions that return StyleBuilders - exported at module level
823
1421
  // Display
824
- export function display(value: string): StyleBuilder;
825
- export function flex(value?: string): StyleBuilder;
1422
+ export function display(value: DisplayValue): StyleBuilder;
1423
+ export function flex(value?: CSSLengthValue | "auto" | "initial" | "none" | "1" | "0"): StyleBuilder;
826
1424
  export function grid(): StyleBuilder;
827
1425
 
828
1426
  // Colors
829
- export function bg(color: string): StyleBuilder;
830
- export function color(colorValue: string): StyleBuilder;
831
- export function accentColor(value: string): StyleBuilder;
1427
+ export function bg(color: CSSColorValue): StyleBuilder;
1428
+ export function color(colorValue: CSSColorValue): StyleBuilder;
1429
+ export function accentColor(value: CSSColorValue): StyleBuilder;
832
1430
 
833
1431
  // Typography
834
- export function fontSize(size: string): StyleBuilder;
835
- export function fontWeight(value: string): StyleBuilder;
836
- export function fontFamily(value: string): StyleBuilder;
837
- export function lineHeight(value: string): StyleBuilder;
838
- export function letterSpacing(value: string): StyleBuilder;
839
- export function textAlign(value: string): StyleBuilder;
840
- export function textDecoration(value: string): StyleBuilder;
1432
+ export function fontSize(size: CSSLengthValue): StyleBuilder;
1433
+ export function fontWeight(value: FontWeightValue): StyleBuilder;
1434
+ export function fontFamily(value: CSSFontFamilyValue): StyleBuilder;
1435
+ export function lineHeight(value: CSSLengthValue | "normal" | number): StyleBuilder;
1436
+ export function letterSpacing(value: CSSLengthValue | "normal"): StyleBuilder;
1437
+ export function textAlign(value: TextAlignValue): StyleBuilder;
1438
+ export function textDecoration(value: TextDecorationValue): StyleBuilder;
841
1439
  export function bold(): StyleBuilder;
842
- export function fontStyle(value: string): StyleBuilder;
1440
+ export function fontStyle(value: FontStyleValue): StyleBuilder;
843
1441
  export function fontVariant(value: string): StyleBuilder;
844
1442
  export function fontStretch(value: string): StyleBuilder;
845
- export function textTransform(value: string): StyleBuilder;
846
- export function textIndent(value: string): StyleBuilder;
847
- export function textOverflow(value: string): StyleBuilder;
1443
+ export function textTransform(value: TextTransformValue): StyleBuilder;
1444
+ export function textIndent(value: CSSLengthValue): StyleBuilder;
1445
+ export function textOverflow(value: TextOverflowValue): StyleBuilder;
848
1446
  export function textShadow(value: string): StyleBuilder;
849
- export function whiteSpace(value: string): StyleBuilder;
850
- export function wordSpacing(value: string): StyleBuilder;
851
- export function wordWrap(value: string): StyleBuilder;
852
- export function overflowWrap(value: string): StyleBuilder;
853
- export function textAlignLast(value: string): StyleBuilder;
854
- export function textJustify(value: string): StyleBuilder;
855
- export function textDecorationLine(value: string): StyleBuilder;
856
- export function textDecorationColor(value: string): StyleBuilder;
857
- export function textDecorationStyle(value: string): StyleBuilder;
858
- export function textDecorationThickness(value: string): StyleBuilder;
859
- export function textUnderlineOffset(value: string): StyleBuilder;
860
- export function verticalAlign(value: string): StyleBuilder;
1447
+ export function whiteSpace(value: WhiteSpaceValue): StyleBuilder;
1448
+ export function wordSpacing(value: CSSLengthValue | "normal"): StyleBuilder;
1449
+ export function wordWrap(value: WordWrapValue): StyleBuilder;
1450
+ export function overflowWrap(value: OverflowWrapValue): StyleBuilder;
1451
+ export function textAlignLast(value: TextAlignLastValue): StyleBuilder;
1452
+ export function textJustify(value: TextJustifyValue): StyleBuilder;
1453
+ export function textDecorationLine(value: TextDecorationLineValue): StyleBuilder;
1454
+ export function textDecorationColor(value: CSSColorValue): StyleBuilder;
1455
+ export function textDecorationStyle(value: TextDecorationStyleValue): StyleBuilder;
1456
+ export function textDecorationThickness(value: CSSLengthValue | "auto" | "from-font"): StyleBuilder;
1457
+ export function textUnderlineOffset(value: CSSLengthValue | "auto"): StyleBuilder;
1458
+ export function verticalAlign(value: VerticalAlignValue): StyleBuilder;
861
1459
 
862
1460
  // Layout
863
- export function position(value: string): StyleBuilder;
864
- export function padding(value: string): StyleBuilder;
865
- export function paddingTop(value: string): StyleBuilder;
866
- export function paddingRight(value: string): StyleBuilder;
867
- export function paddingBottom(value: string): StyleBuilder;
868
- export function paddingLeft(value: string): StyleBuilder;
869
- export function margin(value: string): StyleBuilder;
870
- export function marginTop(value: string): StyleBuilder;
871
- export function marginRight(value: string): StyleBuilder;
872
- export function marginBottom(value: string): StyleBuilder;
873
- export function marginLeft(value: string): StyleBuilder;
874
- export function width(value: string): StyleBuilder;
875
- export function height(value: string): StyleBuilder;
876
- export function minWidth(value: string): StyleBuilder;
877
- export function maxWidth(value: string): StyleBuilder;
878
- export function minHeight(value: string): StyleBuilder;
879
- export function maxHeight(value: string): StyleBuilder;
880
- export function boxSizing(value: string): StyleBuilder;
1461
+ export function position(value: PositionValue): StyleBuilder;
1462
+ export function padding(value: CSSLengthValue): StyleBuilder;
1463
+ export function paddingTop(value: CSSLengthValue): StyleBuilder;
1464
+ export function paddingRight(value: CSSLengthValue): StyleBuilder;
1465
+ export function paddingBottom(value: CSSLengthValue): StyleBuilder;
1466
+ export function paddingLeft(value: CSSLengthValue): StyleBuilder;
1467
+ export function margin(value: CSSLengthValue | "auto"): StyleBuilder;
1468
+ export function marginTop(value: CSSLengthValue | "auto"): StyleBuilder;
1469
+ export function marginRight(value: CSSLengthValue | "auto"): StyleBuilder;
1470
+ export function marginBottom(value: CSSLengthValue | "auto"): StyleBuilder;
1471
+ export function marginLeft(value: CSSLengthValue | "auto"): StyleBuilder;
1472
+ export function width(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
1473
+ export function height(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
1474
+ export function minWidth(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
1475
+ export function maxWidth(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): StyleBuilder;
1476
+ export function minHeight(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
1477
+ export function maxHeight(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): StyleBuilder;
1478
+ export function boxSizing(value: BoxSizingValue): StyleBuilder;
881
1479
 
882
1480
  // Positioning
883
- export function top(value: string): StyleBuilder;
884
- export function right(value: string): StyleBuilder;
885
- export function bottom(value: string): StyleBuilder;
886
- export function left(value: string): StyleBuilder;
887
- export function zIndex(value: string): StyleBuilder;
1481
+ export function top(value: CSSLengthValue | "auto"): StyleBuilder;
1482
+ export function right(value: CSSLengthValue | "auto"): StyleBuilder;
1483
+ export function bottom(value: CSSLengthValue | "auto"): StyleBuilder;
1484
+ export function left(value: CSSLengthValue | "auto"): StyleBuilder;
1485
+ export function zIndex(value: number | "auto"): StyleBuilder;
888
1486
 
889
1487
  // Flexbox
890
- export function flexDirection(value: string): StyleBuilder;
891
- export function alignItems(value: string): StyleBuilder;
892
- export function justifyContent(value: string): StyleBuilder;
1488
+ export function flexDirection(value: FlexDirectionValue): StyleBuilder;
1489
+ export function alignItems(value: AlignItemsValue): StyleBuilder;
1490
+ export function justifyContent(value: JustifyContentValue): StyleBuilder;
893
1491
  export function center(): StyleBuilder;
894
- export function gap(value: string): StyleBuilder;
895
- export function flexWrap(value: string): StyleBuilder;
896
- export function flexGrow(value: string): StyleBuilder;
897
- export function flexShrink(value: string): StyleBuilder;
898
- export function flexBasis(value: string): StyleBuilder;
899
- export function alignSelf(value: string): StyleBuilder;
900
- export function alignContent(value: string): StyleBuilder;
901
- export function justifySelf(value: string): StyleBuilder;
902
- export function justifyItems(value: string): StyleBuilder;
1492
+ export function gap(value: CSSLengthValue): StyleBuilder;
1493
+ export function flexWrap(value: FlexWrapValue): StyleBuilder;
1494
+ export function flexGrow(value: number | string): StyleBuilder;
1495
+ export function flexShrink(value: number | string): StyleBuilder;
1496
+ export function flexBasis(value: CSSLengthValue | "auto" | "content" | "fit-content"): StyleBuilder;
1497
+ export function alignSelf(value: AlignSelfValue): StyleBuilder;
1498
+ export function alignContent(value: AlignContentValue): StyleBuilder;
1499
+ export function justifySelf(value: JustifySelfValue): StyleBuilder;
1500
+ export function justifyItems(value: JustifyItemsValue): StyleBuilder;
903
1501
 
904
1502
  // Grid
905
1503
  export function gridTemplateColumns(value: string): StyleBuilder;
@@ -907,14 +1505,14 @@ export function gridTemplateRows(value: string): StyleBuilder;
907
1505
  export function gridTemplateAreas(value: string): StyleBuilder;
908
1506
  export function gridColumn(value: string): StyleBuilder;
909
1507
  export function gridRow(value: string): StyleBuilder;
910
- export function gridColumnStart(value: string): StyleBuilder;
911
- export function gridColumnEnd(value: string): StyleBuilder;
912
- export function gridRowStart(value: string): StyleBuilder;
913
- export function gridRowEnd(value: string): StyleBuilder;
1508
+ export function gridColumnStart(value: string | number | "auto"): StyleBuilder;
1509
+ export function gridColumnEnd(value: string | number | "auto"): StyleBuilder;
1510
+ export function gridRowStart(value: string | number | "auto"): StyleBuilder;
1511
+ export function gridRowEnd(value: string | number | "auto"): StyleBuilder;
914
1512
  export function gridArea(value: string): StyleBuilder;
915
- export function gridAutoColumns(value: string): StyleBuilder;
916
- export function gridAutoRows(value: string): StyleBuilder;
917
- export function gridAutoFlow(value: string): StyleBuilder;
1513
+ export function gridAutoColumns(value: CSSLengthValue): StyleBuilder;
1514
+ export function gridAutoRows(value: CSSLengthValue): StyleBuilder;
1515
+ export function gridAutoFlow(value: GridAutoFlowValue): StyleBuilder;
918
1516
 
919
1517
  // Borders
920
1518
  export function border(value: string): StyleBuilder;
@@ -922,158 +1520,324 @@ export function borderTop(value: string): StyleBuilder;
922
1520
  export function borderRight(value: string): StyleBuilder;
923
1521
  export function borderBottom(value: string): StyleBuilder;
924
1522
  export function borderLeft(value: string): StyleBuilder;
925
- export function borderWidth(value: string): StyleBuilder;
926
- export function borderStyle(value: string): StyleBuilder;
927
- export function borderColor(value: string): StyleBuilder;
928
- export function borderTopWidth(value: string): StyleBuilder;
929
- export function borderRightWidth(value: string): StyleBuilder;
930
- export function borderBottomWidth(value: string): StyleBuilder;
931
- export function borderLeftWidth(value: string): StyleBuilder;
932
- export function borderTopStyle(value: string): StyleBuilder;
933
- export function borderRightStyle(value: string): StyleBuilder;
934
- export function borderBottomStyle(value: string): StyleBuilder;
935
- export function borderLeftStyle(value: string): StyleBuilder;
936
- export function borderTopColor(value: string): StyleBuilder;
937
- export function borderRightColor(value: string): StyleBuilder;
938
- export function borderBottomColor(value: string): StyleBuilder;
939
- export function borderLeftColor(value: string): StyleBuilder;
940
- export function borderRadius(value: string): StyleBuilder;
941
- export function borderTopLeftRadius(value: string): StyleBuilder;
942
- export function borderTopRightRadius(value: string): StyleBuilder;
943
- export function borderBottomLeftRadius(value: string): StyleBuilder;
944
- export function borderBottomRightRadius(value: string): StyleBuilder;
1523
+ export function borderWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1524
+ export function borderStyle(value: BorderStyleValue): StyleBuilder;
1525
+ export function borderColor(value: CSSColorValue): StyleBuilder;
1526
+ export function borderTopWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1527
+ export function borderRightWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1528
+ export function borderBottomWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1529
+ export function borderLeftWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1530
+ export function borderTopStyle(value: BorderStyleValue): StyleBuilder;
1531
+ export function borderRightStyle(value: BorderStyleValue): StyleBuilder;
1532
+ export function borderBottomStyle(value: BorderStyleValue): StyleBuilder;
1533
+ export function borderLeftStyle(value: BorderStyleValue): StyleBuilder;
1534
+ export function borderTopColor(value: CSSColorValue): StyleBuilder;
1535
+ export function borderRightColor(value: CSSColorValue): StyleBuilder;
1536
+ export function borderBottomColor(value: CSSColorValue): StyleBuilder;
1537
+ export function borderLeftColor(value: CSSColorValue): StyleBuilder;
1538
+ export function borderRadius(value: CSSLengthValue): StyleBuilder;
1539
+ export function borderTopLeftRadius(value: CSSLengthValue): StyleBuilder;
1540
+ export function borderTopRightRadius(value: CSSLengthValue): StyleBuilder;
1541
+ export function borderBottomLeftRadius(value: CSSLengthValue): StyleBuilder;
1542
+ export function borderBottomRightRadius(value: CSSLengthValue): StyleBuilder;
945
1543
 
946
1544
  // Outline
947
1545
  export function outline(value: string): StyleBuilder;
948
- export function outlineWidth(value: string): StyleBuilder;
949
- export function outlineStyle(value: string): StyleBuilder;
950
- export function outlineColor(value: string): StyleBuilder;
951
- export function outlineOffset(value: string): StyleBuilder;
1546
+ export function outlineWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1547
+ export function outlineStyle(value: OutlineStyleValue): StyleBuilder;
1548
+ export function outlineColor(value: CSSColorValue): StyleBuilder;
1549
+ export function outlineOffset(value: CSSLengthValue): StyleBuilder;
952
1550
 
953
1551
  // Background
954
- export function backgroundColor(value: string): StyleBuilder;
955
- export function backgroundImage(value: string): StyleBuilder;
956
- export function backgroundRepeat(value: string): StyleBuilder;
1552
+ export function backgroundColor(value: CSSColorValue): StyleBuilder;
1553
+ export function backgroundImage(value: CSSBackgroundImageValue | "none"): StyleBuilder;
1554
+ export function backgroundRepeat(value: BackgroundRepeatValue): StyleBuilder;
957
1555
  export function backgroundPosition(value: string): StyleBuilder;
958
- export function backgroundSize(value: string): StyleBuilder;
959
- export function backgroundAttachment(value: string): StyleBuilder;
960
- export function backgroundClip(value: string): StyleBuilder;
961
- export function backgroundOrigin(value: string): StyleBuilder;
1556
+ export function backgroundSize(value: CSSLengthValue | "auto" | "cover" | "contain"): StyleBuilder;
1557
+ export function backgroundAttachment(value: BackgroundAttachmentValue): StyleBuilder;
1558
+ export function backgroundClip(value: BackgroundClipValue): StyleBuilder;
1559
+ export function backgroundOrigin(value: BackgroundOriginValue): StyleBuilder;
962
1560
 
963
1561
  // Effects
964
- export function boxShadow(value: string): StyleBuilder;
965
- export function opacity(value: string): StyleBuilder;
1562
+ export function boxShadow(value: string | "none"): StyleBuilder;
1563
+ export function opacity(value: number | string): StyleBuilder;
966
1564
  export function transition(value: string): StyleBuilder;
967
- export function transitionProperty(value: string): StyleBuilder;
968
- export function transitionDuration(value: string): StyleBuilder;
969
- export function transitionTimingFunction(value: string): StyleBuilder;
970
- export function transitionDelay(value: string): StyleBuilder;
1565
+ export function transitionProperty(value: string | "none" | "all"): StyleBuilder;
1566
+ export function transitionDuration(value: string | number): StyleBuilder;
1567
+ export function transitionTimingFunction(value: CSSTimingFunctionValue): StyleBuilder;
1568
+ export function transitionDelay(value: string | number): StyleBuilder;
971
1569
 
972
1570
  // Transform
973
- export function transform(value: string): StyleBuilder;
1571
+ export function transform(value: CSSTransformValue | "none"): StyleBuilder;
974
1572
  export function transformOrigin(value: string): StyleBuilder;
975
- export function transformStyle(value: string): StyleBuilder;
976
- export function perspective(value: string): StyleBuilder;
1573
+ export function transformStyle(value: TransformStyleValue): StyleBuilder;
1574
+ export function perspective(value: CSSLengthValue | "none"): StyleBuilder;
977
1575
  export function perspectiveOrigin(value: string): StyleBuilder;
978
- export function backfaceVisibility(value: string): StyleBuilder;
1576
+ export function backfaceVisibility(value: BackfaceVisibilityValue): StyleBuilder;
979
1577
 
980
1578
  // Animation
981
1579
  export function animation(value: string): StyleBuilder;
982
- export function animationName(value: string): StyleBuilder;
983
- export function animationDuration(value: string): StyleBuilder;
984
- export function animationTimingFunction(value: string): StyleBuilder;
985
- export function animationDelay(value: string): StyleBuilder;
986
- export function animationIterationCount(value: string): StyleBuilder;
987
- export function animationDirection(value: string): StyleBuilder;
988
- export function animationFillMode(value: string): StyleBuilder;
989
- export function animationPlayState(value: string): StyleBuilder;
1580
+ export function animationName(value: CSSAnimationNameValue): StyleBuilder;
1581
+ export function animationDuration(value: string | number): StyleBuilder;
1582
+ export function animationTimingFunction(value: CSSTimingFunctionValue): StyleBuilder;
1583
+ export function animationDelay(value: string | number): StyleBuilder;
1584
+ export function animationIterationCount(value: number | "infinite" | string): StyleBuilder;
1585
+ export function animationDirection(value: AnimationDirectionValue): StyleBuilder;
1586
+ export function animationFillMode(value: AnimationFillModeValue): StyleBuilder;
1587
+ export function animationPlayState(value: AnimationPlayStateValue): StyleBuilder;
990
1588
 
991
1589
  // Filter
992
- export function filter(value: string): StyleBuilder;
993
- export function backdropFilter(value: string): StyleBuilder;
1590
+ export function filter(value: CSSFilterValue | "none"): StyleBuilder;
1591
+ export function backdropFilter(value: CSSFilterValue | "none"): StyleBuilder;
994
1592
 
995
1593
  // Overflow
996
- export function overflow(value: string): StyleBuilder;
997
- export function overflowX(value: string): StyleBuilder;
998
- export function overflowY(value: string): StyleBuilder;
1594
+ export function overflow(value: OverflowValue): StyleBuilder;
1595
+ export function overflowX(value: OverflowValue): StyleBuilder;
1596
+ export function overflowY(value: OverflowValue): StyleBuilder;
999
1597
 
1000
1598
  // Visibility
1001
- export function visibility(value: string): StyleBuilder;
1599
+ export function visibility(value: VisibilityValue): StyleBuilder;
1002
1600
 
1003
1601
  // Object fit/position
1004
- export function objectFit(value: string): StyleBuilder;
1602
+ export function objectFit(value: ObjectFitValue): StyleBuilder;
1005
1603
  export function objectPosition(value: string): StyleBuilder;
1006
1604
 
1007
1605
  // List
1008
1606
  export function listStyle(value: string): StyleBuilder;
1009
- export function listStyleType(value: string): StyleBuilder;
1010
- export function listStylePosition(value: string): StyleBuilder;
1011
- export function listStyleImage(value: string): StyleBuilder;
1607
+ export function listStyleType(value: ListStyleTypeValue): StyleBuilder;
1608
+ export function listStylePosition(value: ListStylePositionValue): StyleBuilder;
1609
+ export function listStyleImage(value: CSSBackgroundImageValue | "none"): StyleBuilder;
1012
1610
 
1013
1611
  // Table
1014
- export function borderCollapse(value: string): StyleBuilder;
1015
- export function borderSpacing(value: string): StyleBuilder;
1016
- export function captionSide(value: string): StyleBuilder;
1017
- export function emptyCells(value: string): StyleBuilder;
1018
- export function tableLayout(value: string): StyleBuilder;
1612
+ export function borderCollapse(value: BorderCollapseValue): StyleBuilder;
1613
+ export function borderSpacing(value: CSSLengthValue): StyleBuilder;
1614
+ export function captionSide(value: CaptionSideValue): StyleBuilder;
1615
+ export function emptyCells(value: EmptyCellsValue): StyleBuilder;
1616
+ export function tableLayout(value: TableLayoutValue): StyleBuilder;
1019
1617
 
1020
1618
  // Content
1021
- export function content(value: string): StyleBuilder;
1022
- export function quotes(value: string): StyleBuilder;
1023
- export function counterReset(value: string): StyleBuilder;
1024
- export function counterIncrement(value: string): StyleBuilder;
1619
+ export function content(value: CSSContentValue | "normal" | "none"): StyleBuilder;
1620
+ export function quotes(value: string | "none"): StyleBuilder;
1621
+ export function counterReset(value: string | "none"): StyleBuilder;
1622
+ export function counterIncrement(value: string | "none"): StyleBuilder;
1025
1623
 
1026
1624
  // User interface
1027
- export function appearance(value: string): StyleBuilder;
1028
- export function userSelect(value: string): StyleBuilder;
1029
- export function pointerEvents(value: string): StyleBuilder;
1030
- export function resize(value: string): StyleBuilder;
1031
- export function scrollBehavior(value: string): StyleBuilder;
1625
+ export function appearance(value: AppearanceValue): StyleBuilder;
1626
+ export function userSelect(value: UserSelectValue): StyleBuilder;
1627
+ export function pointerEvents(value: PointerEventsValue): StyleBuilder;
1628
+ export function resize(value: ResizeValue): StyleBuilder;
1629
+ export function scrollBehavior(value: ScrollBehaviorValue): StyleBuilder;
1032
1630
 
1033
1631
  // Clip
1034
- export function clip(value: string): StyleBuilder;
1035
- export function clipPath(value: string): StyleBuilder;
1632
+ export function clip(value: string | "auto"): StyleBuilder;
1633
+ export function clipPath(value: string | "none"): StyleBuilder;
1036
1634
 
1037
1635
  // Isolation
1038
- export function isolation(value: string): StyleBuilder;
1636
+ export function isolation(value: IsolationValue): StyleBuilder;
1039
1637
 
1040
1638
  // Mix blend mode
1041
- export function mixBlendMode(value: string): StyleBuilder;
1639
+ export function mixBlendMode(value: MixBlendModeValue): StyleBuilder;
1042
1640
 
1043
1641
  // Will change
1044
- export function willChange(value: string): StyleBuilder;
1642
+ export function willChange(value: string | "auto"): StyleBuilder;
1045
1643
 
1046
1644
  // Contain
1047
- export function contain(value: string): StyleBuilder;
1645
+ export function contain(value: ContainValue): StyleBuilder;
1048
1646
 
1049
1647
  // Page break
1050
- export function pageBreakBefore(value: string): StyleBuilder;
1051
- export function pageBreakAfter(value: string): StyleBuilder;
1052
- export function pageBreakInside(value: string): StyleBuilder;
1648
+ export function pageBreakBefore(value: PageBreakValue): StyleBuilder;
1649
+ export function pageBreakAfter(value: PageBreakValue): StyleBuilder;
1650
+ export function pageBreakInside(value: PageBreakValue): StyleBuilder;
1053
1651
 
1054
1652
  // Break
1055
- export function breakBefore(value: string): StyleBuilder;
1056
- export function breakAfter(value: string): StyleBuilder;
1057
- export function breakInside(value: string): StyleBuilder;
1653
+ export function breakBefore(value: BreakValue): StyleBuilder;
1654
+ export function breakAfter(value: BreakValue): StyleBuilder;
1655
+ export function breakInside(value: BreakValue): StyleBuilder;
1058
1656
 
1059
1657
  // Orphans and widows
1060
- export function orphans(value: string): StyleBuilder;
1061
- export function widows(value: string): StyleBuilder;
1658
+ export function orphans(value: number | string): StyleBuilder;
1659
+ export function widows(value: number | string): StyleBuilder;
1062
1660
 
1063
1661
  // Column
1064
- export function columnCount(value: string): StyleBuilder;
1065
- export function columnFill(value: string): StyleBuilder;
1066
- export function columnGap(value: string): StyleBuilder;
1662
+ export function columnCount(value: number | "auto" | string): StyleBuilder;
1663
+ export function columnFill(value: ColumnFillValue): StyleBuilder;
1664
+ export function columnGap(value: CSSLengthValue | "normal"): StyleBuilder;
1067
1665
  export function columnRule(value: string): StyleBuilder;
1068
- export function columnRuleColor(value: string): StyleBuilder;
1069
- export function columnRuleStyle(value: string): StyleBuilder;
1070
- export function columnRuleWidth(value: string): StyleBuilder;
1071
- export function columnSpan(value: string): StyleBuilder;
1072
- export function columnWidth(value: string): StyleBuilder;
1666
+ export function columnRuleColor(value: CSSColorValue): StyleBuilder;
1667
+ export function columnRuleStyle(value: ColumnRuleStyleValue): StyleBuilder;
1668
+ export function columnRuleWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1669
+ export function columnSpan(value: ColumnSpanValue): StyleBuilder;
1670
+ export function columnWidth(value: CSSLengthValue | "auto"): StyleBuilder;
1073
1671
  export function columns(value: string): StyleBuilder;
1074
1672
 
1075
1673
  // Interaction
1076
- export function cursor(value: string): StyleBuilder;
1674
+ export function cursor(value: CursorValue): StyleBuilder;
1675
+
1676
+ // Layout - Additional
1677
+ export function aspectRatio(value: CSSAspectRatioValue): StyleBuilder;
1678
+ export function clear(value: ClearValue): StyleBuilder;
1679
+ export function float(value: FloatValue): StyleBuilder;
1680
+ export function order(value: number | string): StyleBuilder;
1681
+
1682
+ // Flexbox - Place properties
1683
+ export function placeContent(value: string): StyleBuilder;
1684
+ export function placeItems(value: string): StyleBuilder;
1685
+ export function placeSelf(value: string): StyleBuilder;
1686
+
1687
+ // Text - Additional
1688
+ export function hyphens(value: HyphensValue): StyleBuilder;
1689
+ export function lineBreak(value: LineBreakValue): StyleBuilder;
1690
+ export function wordBreak(value: WordBreakValue): StyleBuilder;
1691
+ export function textOrientation(value: TextOrientationValue): StyleBuilder;
1692
+ export function writingMode(value: WritingModeValue): StyleBuilder;
1693
+ export function direction(value: DirectionValue): StyleBuilder;
1694
+ export function unicodeBidi(value: UnicodeBidiValue): StyleBuilder;
1695
+
1696
+ // Background - Additional
1697
+ export function backgroundBlendMode(value: BackgroundBlendModeValue): StyleBuilder;
1698
+ export function backgroundPositionX(value: string): StyleBuilder;
1699
+ export function backgroundPositionY(value: string): StyleBuilder;
1700
+
1701
+ // Border Image
1702
+ export function borderImage(value: string): StyleBuilder;
1703
+ export function borderImageSource(value: CSSBackgroundImageValue | "none"): StyleBuilder;
1704
+ export function borderImageSlice(value: string | number): StyleBuilder;
1705
+ export function borderImageWidth(value: CSSLengthValue | number): StyleBuilder;
1706
+ export function borderImageOutset(value: CSSLengthValue | number): StyleBuilder;
1707
+ export function borderImageRepeat(value: BackgroundRepeatValue): StyleBuilder;
1708
+
1709
+ // Logical Properties - Inset
1710
+ export function inset(value: CSSLengthValue | "auto"): StyleBuilder;
1711
+ export function insetBlock(value: CSSLengthValue): StyleBuilder;
1712
+ export function insetBlockStart(value: CSSLengthValue | "auto"): StyleBuilder;
1713
+ export function insetBlockEnd(value: CSSLengthValue | "auto"): StyleBuilder;
1714
+ export function insetInline(value: CSSLengthValue): StyleBuilder;
1715
+ export function insetInlineStart(value: CSSLengthValue | "auto"): StyleBuilder;
1716
+ export function insetInlineEnd(value: CSSLengthValue | "auto"): StyleBuilder;
1717
+
1718
+ // Logical Properties - Margin
1719
+ export function marginBlock(value: CSSLengthValue | "auto"): StyleBuilder;
1720
+ export function marginBlockStart(value: CSSLengthValue | "auto"): StyleBuilder;
1721
+ export function marginBlockEnd(value: CSSLengthValue | "auto"): StyleBuilder;
1722
+ export function marginInline(value: CSSLengthValue | "auto"): StyleBuilder;
1723
+ export function marginInlineStart(value: CSSLengthValue | "auto"): StyleBuilder;
1724
+ export function marginInlineEnd(value: CSSLengthValue | "auto"): StyleBuilder;
1725
+
1726
+ // Logical Properties - Padding
1727
+ export function paddingBlock(value: CSSLengthValue): StyleBuilder;
1728
+ export function paddingBlockStart(value: CSSLengthValue): StyleBuilder;
1729
+ export function paddingBlockEnd(value: CSSLengthValue): StyleBuilder;
1730
+ export function paddingInline(value: CSSLengthValue): StyleBuilder;
1731
+ export function paddingInlineStart(value: CSSLengthValue): StyleBuilder;
1732
+ export function paddingInlineEnd(value: CSSLengthValue): StyleBuilder;
1733
+
1734
+ // Logical Properties - Size
1735
+ export function inlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
1736
+ export function blockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
1737
+ export function minInlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
1738
+ export function minBlockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content"): StyleBuilder;
1739
+ export function maxInlineSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): StyleBuilder;
1740
+ export function maxBlockSize(value: CSSLengthValue | "auto" | "fit-content" | "max-content" | "min-content" | "none"): StyleBuilder;
1741
+
1742
+ // Logical Properties - Border
1743
+ export function borderBlock(value: string): StyleBuilder;
1744
+ export function borderBlockStart(value: string): StyleBuilder;
1745
+ export function borderBlockEnd(value: string): StyleBuilder;
1746
+ export function borderInline(value: string): StyleBuilder;
1747
+ export function borderInlineStart(value: string): StyleBuilder;
1748
+ export function borderInlineEnd(value: string): StyleBuilder;
1749
+ export function borderBlockWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1750
+ export function borderBlockStartWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1751
+ export function borderBlockEndWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1752
+ export function borderInlineWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1753
+ export function borderInlineStartWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1754
+ export function borderInlineEndWidth(value: CSSLengthValue | "thin" | "medium" | "thick"): StyleBuilder;
1755
+ export function borderBlockStyle(value: BorderStyleValue): StyleBuilder;
1756
+ export function borderBlockStartStyle(value: BorderStyleValue): StyleBuilder;
1757
+ export function borderBlockEndStyle(value: BorderStyleValue): StyleBuilder;
1758
+ export function borderInlineStyle(value: BorderStyleValue): StyleBuilder;
1759
+ export function borderInlineStartStyle(value: BorderStyleValue): StyleBuilder;
1760
+ export function borderInlineEndStyle(value: BorderStyleValue): StyleBuilder;
1761
+ export function borderBlockColor(value: CSSColorValue): StyleBuilder;
1762
+ export function borderBlockStartColor(value: CSSColorValue): StyleBuilder;
1763
+ export function borderBlockEndColor(value: CSSColorValue): StyleBuilder;
1764
+ export function borderInlineColor(value: CSSColorValue): StyleBuilder;
1765
+ export function borderInlineStartColor(value: CSSColorValue): StyleBuilder;
1766
+ export function borderInlineEndColor(value: CSSColorValue): StyleBuilder;
1767
+
1768
+ // Logical Properties - Border Radius
1769
+ export function borderStartStartRadius(value: CSSLengthValue): StyleBuilder;
1770
+ export function borderStartEndRadius(value: CSSLengthValue): StyleBuilder;
1771
+ export function borderEndStartRadius(value: CSSLengthValue): StyleBuilder;
1772
+ export function borderEndEndRadius(value: CSSLengthValue): StyleBuilder;
1773
+
1774
+ // Scroll
1775
+ export function scrollMargin(value: CSSLengthValue): StyleBuilder;
1776
+ export function scrollMarginTop(value: CSSLengthValue): StyleBuilder;
1777
+ export function scrollMarginRight(value: CSSLengthValue): StyleBuilder;
1778
+ export function scrollMarginBottom(value: CSSLengthValue): StyleBuilder;
1779
+ export function scrollMarginLeft(value: CSSLengthValue): StyleBuilder;
1780
+ export function scrollPadding(value: CSSLengthValue): StyleBuilder;
1781
+ export function scrollPaddingTop(value: CSSLengthValue): StyleBuilder;
1782
+ export function scrollPaddingRight(value: CSSLengthValue): StyleBuilder;
1783
+ export function scrollPaddingBottom(value: CSSLengthValue): StyleBuilder;
1784
+ export function scrollPaddingLeft(value: CSSLengthValue): StyleBuilder;
1785
+ export function overscrollBehavior(value: OverscrollBehaviorValue): StyleBuilder;
1786
+ export function overscrollBehaviorX(value: OverscrollBehaviorValue): StyleBuilder;
1787
+ export function overscrollBehaviorY(value: OverscrollBehaviorValue): StyleBuilder;
1788
+
1789
+ // Caret
1790
+ export function caretColor(value: CaretColorValue): StyleBuilder;
1791
+ export function caretShape(value: CaretShapeValue): StyleBuilder;
1792
+ export function caretAnimation(value: string): StyleBuilder;
1793
+
1794
+ // Other
1795
+ export function imageRendering(value: ImageRenderingValue): StyleBuilder;
1796
+ export function colorScheme(value: ColorSchemeValue): StyleBuilder;
1797
+ export function contentVisibility(value: ContentVisibilityValue): StyleBuilder;
1798
+ export function touchAction(value: TouchActionValue): StyleBuilder;
1799
+
1800
+ // Container Queries
1801
+ export function containerType(value: ContainerTypeValue): StyleBuilder;
1802
+ export function containerName(value: string): StyleBuilder;
1803
+ export function container(value: string): StyleBuilder;
1804
+
1805
+ // Font - Additional
1806
+ export function fontFeatureSettings(value: string): StyleBuilder;
1807
+ export function fontKerning(value: FontKerningValue): StyleBuilder;
1808
+ export function fontSynthesis(value: FontSynthesisValue): StyleBuilder;
1809
+ export function fontOpticalSizing(value: FontOpticalSizingValue): StyleBuilder;
1810
+ export function fontDisplay(value: FontDisplayValue): StyleBuilder;
1811
+ export function fontVariantCaps(value: FontVariantCapsValue): StyleBuilder;
1812
+ export function fontVariantNumeric(value: string): StyleBuilder;
1813
+ export function fontVariantLigatures(value: string): StyleBuilder;
1814
+ export function fontVariantEastAsian(value: string): StyleBuilder;
1815
+ export function fontVariantAlternates(value: string): StyleBuilder;
1816
+ export function fontVariantPosition(value: string): StyleBuilder;
1817
+
1818
+ // Text - Additional
1819
+ export function textRendering(value: TextRenderingValue): StyleBuilder;
1820
+ export function textCombineUpright(value: TextCombineUprightValue): StyleBuilder;
1821
+ export function textSizeAdjust(value: string | "auto" | "none" | `${number}%`): StyleBuilder;
1822
+
1823
+ // Mask
1824
+ export function mask(value: string): StyleBuilder;
1825
+ export function maskImage(value: CSSBackgroundImageValue | "none"): StyleBuilder;
1826
+ export function maskMode(value: string): StyleBuilder;
1827
+ export function maskRepeat(value: BackgroundRepeatValue): StyleBuilder;
1828
+ export function maskPosition(value: string): StyleBuilder;
1829
+ export function maskSize(value: CSSLengthValue | "auto" | "cover" | "contain"): StyleBuilder;
1830
+ export function maskOrigin(value: BackgroundOriginValue): StyleBuilder;
1831
+ export function maskClip(value: BackgroundClipValue): StyleBuilder;
1832
+ export function maskComposite(value: MaskCompositeValue): StyleBuilder;
1833
+
1834
+ // Clip
1835
+ export function clipRule(value: ClipRuleValue): StyleBuilder;
1836
+
1837
+ // Grid - Additional
1838
+ export function gridColumnGap(value: CSSLengthValue): StyleBuilder;
1839
+ export function gridRowGap(value: CSSLengthValue): StyleBuilder;
1840
+ export function gridGap(value: CSSLengthValue): StyleBuilder;
1077
1841
 
1078
1842
  // Style queries / breakpoints
1079
1843
  export function createStyleQueries<T extends string>(