@menapo/vicss 0.0.0-stage → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +662 -2
- package/dist/cli.d.ts +1 -0
- package/dist/cli.js +1311 -0
- package/dist/config-loader-1kWS0cRU.js +162 -0
- package/dist/config-loader-CG76KA50.js +1 -0
- package/dist/config.d.ts +821 -0
- package/dist/config.js +2690 -0
- package/dist/index.d.ts +1528 -0
- package/dist/index.js +442 -0
- package/dist/lint.d.ts +114 -0
- package/dist/lint.js +0 -0
- package/dist/pool-F3qb30Fy.js +3389 -0
- package/dist/print-B_mn7wBu.js +5127 -0
- package/dist/snapshot-DAJ8FLU4.js +149 -0
- package/dist/theme-zBcr5DHi.js +2460 -0
- package/dist/types-file-D6Iu4kzv.js +2481 -0
- package/dist/vite.d.ts +270 -0
- package/dist/vite.js +2264 -0
- package/dist/worker.d.ts +1 -0
- package/dist/worker.js +113 -0
- package/package.json +66 -3
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,1528 @@
|
|
|
1
|
+
//#region src/runtime/css-properties.d.ts
|
|
2
|
+
/** The token scales. */
|
|
3
|
+
type ScaleName = "colors" | "spacing" | "sizes" | "radii" | "fonts" | "fontSizes" | "fontWeights" | "lineHeights" | "letterSpacings" | "shadows" | "textShadows" | "durations" | "easings" | "zIndices" | "opacities" | "blurs" | "aspectRatios" | "breakpoints" | "containers";
|
|
4
|
+
/** CSS-wide keywords: every property takes them. */
|
|
5
|
+
type WideKeyword = "inherit" | "initial" | "unset" | "revert" | "revert-layer";
|
|
6
|
+
/** Scales whose properties take a percentage. */
|
|
7
|
+
type PercentScale = "spacing" | "sizes" | "radii" | "fontSizes" | "lineHeights" | "opacities";
|
|
8
|
+
/** What a bare number means on the properties of each scale (`none`: nothing). */
|
|
9
|
+
interface ScaleNumberKinds {
|
|
10
|
+
colors: "none";
|
|
11
|
+
spacing: "spacing";
|
|
12
|
+
sizes: "sizes";
|
|
13
|
+
radii: "length";
|
|
14
|
+
fonts: "none";
|
|
15
|
+
fontSizes: "length";
|
|
16
|
+
fontWeights: "unitless";
|
|
17
|
+
lineHeights: "unitless";
|
|
18
|
+
letterSpacings: "length";
|
|
19
|
+
shadows: "none";
|
|
20
|
+
textShadows: "none";
|
|
21
|
+
durations: "time";
|
|
22
|
+
easings: "none";
|
|
23
|
+
zIndices: "unitless";
|
|
24
|
+
opacities: "unitless";
|
|
25
|
+
blurs: "length";
|
|
26
|
+
aspectRatios: "unitless";
|
|
27
|
+
breakpoints: "none";
|
|
28
|
+
containers: "none";
|
|
29
|
+
}
|
|
30
|
+
/** The keywords each scale takes besides its tokens. */
|
|
31
|
+
interface ScaleKeywords {
|
|
32
|
+
colors: "transparent" | "currentColor" | "currentcolor" | "AccentColor" | "AccentColorText" | "ActiveText" | "ButtonBorder" | "ButtonFace" | "ButtonText" | "Canvas" | "CanvasText" | "Field" | "FieldText" | "GrayText" | "Highlight" | "HighlightText" | "LinkText" | "Mark" | "MarkText" | "SelectedItem" | "SelectedItemText" | "VisitedText";
|
|
33
|
+
spacing: "auto";
|
|
34
|
+
sizes: "auto" | "none" | "fit-content" | "min-content" | "max-content" | "stretch" | "-webkit-fill-available" | "content";
|
|
35
|
+
radii: never;
|
|
36
|
+
fonts: "serif" | "sans-serif" | "monospace" | "cursive" | "fantasy" | "system-ui" | "ui-serif" | "ui-sans-serif" | "ui-monospace" | "ui-rounded" | "math" | "emoji" | "fangsong";
|
|
37
|
+
fontSizes: "xx-small" | "x-small" | "small" | "medium" | "large" | "x-large" | "xx-large" | "xxx-large" | "smaller" | "larger" | "math";
|
|
38
|
+
fontWeights: "normal" | "bold" | "bolder" | "lighter";
|
|
39
|
+
lineHeights: "normal";
|
|
40
|
+
letterSpacings: "normal";
|
|
41
|
+
shadows: "none";
|
|
42
|
+
textShadows: "none";
|
|
43
|
+
durations: "auto";
|
|
44
|
+
easings: "linear" | "ease" | "ease-in" | "ease-out" | "ease-in-out" | "step-start" | "step-end";
|
|
45
|
+
zIndices: "auto";
|
|
46
|
+
opacities: never;
|
|
47
|
+
blurs: never;
|
|
48
|
+
aspectRatios: "auto";
|
|
49
|
+
breakpoints: never;
|
|
50
|
+
containers: never;
|
|
51
|
+
}
|
|
52
|
+
/** Every CSS property a style object takes, by its camelCase name. */
|
|
53
|
+
interface CssProperties {
|
|
54
|
+
MozOsxFontSmoothing?: ConditionalValue<Unscaled<"none">>;
|
|
55
|
+
WebkitBoxOrient?: ConditionalValue<Unscaled<"none">>;
|
|
56
|
+
WebkitFontSmoothing?: ConditionalValue<Unscaled<"none">>;
|
|
57
|
+
WebkitLineClamp?: ConditionalValue<Unscaled<"unitless">>;
|
|
58
|
+
WebkitTapHighlightColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
59
|
+
WebkitTextFillColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
60
|
+
accentColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
61
|
+
alignContent?: ConditionalValue<Unscaled<"none">>;
|
|
62
|
+
alignItems?: ConditionalValue<Unscaled<"none">>;
|
|
63
|
+
alignSelf?: ConditionalValue<Unscaled<"none">>;
|
|
64
|
+
anchorName?: ConditionalValue<Unscaled<"none">>;
|
|
65
|
+
anchorScope?: ConditionalValue<Unscaled<"none">>;
|
|
66
|
+
animation?: ConditionalValue<Unscaled<"none">>;
|
|
67
|
+
animationComposition?: ConditionalValue<Unscaled<"none">>;
|
|
68
|
+
animationDelay?: ConditionalValue<ScaleValue<"durations", "time">>;
|
|
69
|
+
animationDirection?: ConditionalValue<Unscaled<"none">>;
|
|
70
|
+
animationDuration?: ConditionalValue<ScaleValue<"durations", "time">>;
|
|
71
|
+
animationFillMode?: ConditionalValue<Unscaled<"none">>;
|
|
72
|
+
animationIterationCount?: ConditionalValue<Unscaled<"unitless">>;
|
|
73
|
+
animationName?: ConditionalValue<Unscaled<"none">>;
|
|
74
|
+
animationPlayState?: ConditionalValue<Unscaled<"none">>;
|
|
75
|
+
animationRange?: ConditionalValue<Unscaled<"length">>;
|
|
76
|
+
animationRangeEnd?: ConditionalValue<Unscaled<"length">>;
|
|
77
|
+
animationRangeStart?: ConditionalValue<Unscaled<"length">>;
|
|
78
|
+
animationTimeline?: ConditionalValue<Unscaled<"none">>;
|
|
79
|
+
animationTimingFunction?: ConditionalValue<ScaleValue<"easings", "none">>;
|
|
80
|
+
appearance?: ConditionalValue<Unscaled<"none">>;
|
|
81
|
+
aspectRatio?: ConditionalValue<ScaleValue<"aspectRatios", "unitless">>;
|
|
82
|
+
backdropFilter?: ConditionalValue<Unscaled<"none">>;
|
|
83
|
+
backfaceVisibility?: ConditionalValue<Unscaled<"none">>;
|
|
84
|
+
background?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
85
|
+
backgroundAttachment?: ConditionalValue<Unscaled<"none">>;
|
|
86
|
+
backgroundBlendMode?: ConditionalValue<Unscaled<"none">>;
|
|
87
|
+
backgroundClip?: ConditionalValue<Unscaled<"none">>;
|
|
88
|
+
backgroundColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
89
|
+
backgroundImage?: ConditionalValue<Unscaled<"none">>;
|
|
90
|
+
backgroundOrigin?: ConditionalValue<Unscaled<"none">>;
|
|
91
|
+
backgroundPosition?: ConditionalValue<Unscaled<"length">>;
|
|
92
|
+
backgroundPositionX?: ConditionalValue<Unscaled<"length">>;
|
|
93
|
+
backgroundPositionY?: ConditionalValue<Unscaled<"length">>;
|
|
94
|
+
backgroundRepeat?: ConditionalValue<Unscaled<"none">>;
|
|
95
|
+
backgroundSize?: ConditionalValue<Unscaled<"length">>;
|
|
96
|
+
blockSize?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
97
|
+
border?: ConditionalValue<Unscaled<"none">>;
|
|
98
|
+
borderBlock?: ConditionalValue<Unscaled<"none">>;
|
|
99
|
+
borderBlockColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
100
|
+
borderBlockEnd?: ConditionalValue<Unscaled<"none">>;
|
|
101
|
+
borderBlockEndColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
102
|
+
borderBlockEndStyle?: ConditionalValue<Unscaled<"none">>;
|
|
103
|
+
borderBlockEndWidth?: ConditionalValue<Unscaled<"length">>;
|
|
104
|
+
borderBlockStart?: ConditionalValue<Unscaled<"none">>;
|
|
105
|
+
borderBlockStartColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
106
|
+
borderBlockStartStyle?: ConditionalValue<Unscaled<"none">>;
|
|
107
|
+
borderBlockStartWidth?: ConditionalValue<Unscaled<"length">>;
|
|
108
|
+
borderBlockStyle?: ConditionalValue<Unscaled<"none">>;
|
|
109
|
+
borderBlockWidth?: ConditionalValue<Unscaled<"length">>;
|
|
110
|
+
borderBottom?: ConditionalValue<Unscaled<"none">>;
|
|
111
|
+
borderBottomColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
112
|
+
borderBottomLeftRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
113
|
+
borderBottomRightRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
114
|
+
borderBottomStyle?: ConditionalValue<Unscaled<"none">>;
|
|
115
|
+
borderBottomWidth?: ConditionalValue<Unscaled<"length">>;
|
|
116
|
+
borderCollapse?: ConditionalValue<Unscaled<"none">>;
|
|
117
|
+
borderColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
118
|
+
borderEndEndRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
119
|
+
borderEndStartRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
120
|
+
borderImage?: ConditionalValue<Unscaled<"none">>;
|
|
121
|
+
borderImageOutset?: ConditionalValue<Unscaled<"unitless">>;
|
|
122
|
+
borderImageRepeat?: ConditionalValue<Unscaled<"none">>;
|
|
123
|
+
borderImageSlice?: ConditionalValue<Unscaled<"unitless">>;
|
|
124
|
+
borderImageSource?: ConditionalValue<Unscaled<"none">>;
|
|
125
|
+
borderImageWidth?: ConditionalValue<Unscaled<"unitless">>;
|
|
126
|
+
borderInline?: ConditionalValue<Unscaled<"none">>;
|
|
127
|
+
borderInlineColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
128
|
+
borderInlineEnd?: ConditionalValue<Unscaled<"none">>;
|
|
129
|
+
borderInlineEndColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
130
|
+
borderInlineEndStyle?: ConditionalValue<Unscaled<"none">>;
|
|
131
|
+
borderInlineEndWidth?: ConditionalValue<Unscaled<"length">>;
|
|
132
|
+
borderInlineStart?: ConditionalValue<Unscaled<"none">>;
|
|
133
|
+
borderInlineStartColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
134
|
+
borderInlineStartStyle?: ConditionalValue<Unscaled<"none">>;
|
|
135
|
+
borderInlineStartWidth?: ConditionalValue<Unscaled<"length">>;
|
|
136
|
+
borderInlineStyle?: ConditionalValue<Unscaled<"none">>;
|
|
137
|
+
borderInlineWidth?: ConditionalValue<Unscaled<"length">>;
|
|
138
|
+
borderLeft?: ConditionalValue<Unscaled<"none">>;
|
|
139
|
+
borderLeftColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
140
|
+
borderLeftStyle?: ConditionalValue<Unscaled<"none">>;
|
|
141
|
+
borderLeftWidth?: ConditionalValue<Unscaled<"length">>;
|
|
142
|
+
borderRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
143
|
+
borderRight?: ConditionalValue<Unscaled<"none">>;
|
|
144
|
+
borderRightColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
145
|
+
borderRightStyle?: ConditionalValue<Unscaled<"none">>;
|
|
146
|
+
borderRightWidth?: ConditionalValue<Unscaled<"length">>;
|
|
147
|
+
borderSpacing?: ConditionalValue<Unscaled<"length">>;
|
|
148
|
+
borderStartEndRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
149
|
+
borderStartStartRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
150
|
+
borderStyle?: ConditionalValue<Unscaled<"none">>;
|
|
151
|
+
borderTop?: ConditionalValue<Unscaled<"none">>;
|
|
152
|
+
borderTopColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
153
|
+
borderTopLeftRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
154
|
+
borderTopRightRadius?: ConditionalValue<ScaleValue<"radii", "length">>;
|
|
155
|
+
borderTopStyle?: ConditionalValue<Unscaled<"none">>;
|
|
156
|
+
borderTopWidth?: ConditionalValue<Unscaled<"length">>;
|
|
157
|
+
borderWidth?: ConditionalValue<Unscaled<"length">>;
|
|
158
|
+
bottom?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
159
|
+
boxDecorationBreak?: ConditionalValue<Unscaled<"none">>;
|
|
160
|
+
boxShadow?: ConditionalValue<ScaleValue<"shadows", "none">>;
|
|
161
|
+
boxSizing?: ConditionalValue<Unscaled<"none">>;
|
|
162
|
+
breakAfter?: ConditionalValue<Unscaled<"none">>;
|
|
163
|
+
breakBefore?: ConditionalValue<Unscaled<"none">>;
|
|
164
|
+
breakInside?: ConditionalValue<Unscaled<"none">>;
|
|
165
|
+
captionSide?: ConditionalValue<Unscaled<"none">>;
|
|
166
|
+
caretColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
167
|
+
clear?: ConditionalValue<Unscaled<"none">>;
|
|
168
|
+
clip?: ConditionalValue<Unscaled<"none">>;
|
|
169
|
+
clipPath?: ConditionalValue<Unscaled<"none">>;
|
|
170
|
+
clipRule?: ConditionalValue<Unscaled<"none">>;
|
|
171
|
+
color?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
172
|
+
colorInterpolation?: ConditionalValue<Unscaled<"none">>;
|
|
173
|
+
colorInterpolationFilters?: ConditionalValue<Unscaled<"none">>;
|
|
174
|
+
colorScheme?: ConditionalValue<Unscaled<"none">>;
|
|
175
|
+
columnCount?: ConditionalValue<Unscaled<"unitless">>;
|
|
176
|
+
columnFill?: ConditionalValue<Unscaled<"none">>;
|
|
177
|
+
columnGap?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
178
|
+
columnRule?: ConditionalValue<Unscaled<"none">>;
|
|
179
|
+
columnRuleColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
180
|
+
columnRuleStyle?: ConditionalValue<Unscaled<"none">>;
|
|
181
|
+
columnRuleWidth?: ConditionalValue<Unscaled<"length">>;
|
|
182
|
+
columnSpan?: ConditionalValue<Unscaled<"none">>;
|
|
183
|
+
columnWidth?: ConditionalValue<Unscaled<"length">>;
|
|
184
|
+
columns?: ConditionalValue<Unscaled<"unitless">>;
|
|
185
|
+
contain?: ConditionalValue<Unscaled<"none">>;
|
|
186
|
+
containIntrinsicSize?: ConditionalValue<Unscaled<"length">>;
|
|
187
|
+
container?: ConditionalValue<Unscaled<"none">>;
|
|
188
|
+
containerName?: ConditionalValue<Unscaled<"none">>;
|
|
189
|
+
containerType?: ConditionalValue<Unscaled<"none">>;
|
|
190
|
+
content?: ConditionalValue<Unscaled<"none">>;
|
|
191
|
+
contentVisibility?: ConditionalValue<Unscaled<"none">>;
|
|
192
|
+
counterIncrement?: ConditionalValue<Unscaled<"none">>;
|
|
193
|
+
counterReset?: ConditionalValue<Unscaled<"none">>;
|
|
194
|
+
counterSet?: ConditionalValue<Unscaled<"none">>;
|
|
195
|
+
cursor?: ConditionalValue<Unscaled<"none">>;
|
|
196
|
+
direction?: ConditionalValue<Unscaled<"none">>;
|
|
197
|
+
display?: ConditionalValue<Unscaled<"none">>;
|
|
198
|
+
dominantBaseline?: ConditionalValue<Unscaled<"none">>;
|
|
199
|
+
emptyCells?: ConditionalValue<Unscaled<"none">>;
|
|
200
|
+
fieldSizing?: ConditionalValue<Unscaled<"none">>;
|
|
201
|
+
fill?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
202
|
+
fillOpacity?: ConditionalValue<Unscaled<"unitless">>;
|
|
203
|
+
fillRule?: ConditionalValue<Unscaled<"none">>;
|
|
204
|
+
filter?: ConditionalValue<Unscaled<"none">>;
|
|
205
|
+
flex?: ConditionalValue<Unscaled<"unitless">>;
|
|
206
|
+
flexBasis?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
207
|
+
flexDirection?: ConditionalValue<Unscaled<"none">>;
|
|
208
|
+
flexFlow?: ConditionalValue<Unscaled<"none">>;
|
|
209
|
+
flexGrow?: ConditionalValue<Unscaled<"unitless">>;
|
|
210
|
+
flexShrink?: ConditionalValue<Unscaled<"unitless">>;
|
|
211
|
+
flexWrap?: ConditionalValue<Unscaled<"none">>;
|
|
212
|
+
float?: ConditionalValue<Unscaled<"none">>;
|
|
213
|
+
floodColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
214
|
+
floodOpacity?: ConditionalValue<Unscaled<"unitless">>;
|
|
215
|
+
fontFamily?: ConditionalValue<ScaleValue<"fonts", "none">>;
|
|
216
|
+
fontFeatureSettings?: ConditionalValue<Unscaled<"none">>;
|
|
217
|
+
fontKerning?: ConditionalValue<Unscaled<"none">>;
|
|
218
|
+
fontOpticalSizing?: ConditionalValue<Unscaled<"none">>;
|
|
219
|
+
fontPalette?: ConditionalValue<Unscaled<"none">>;
|
|
220
|
+
fontSize?: ConditionalValue<ScaleValue<"fontSizes", "length">>;
|
|
221
|
+
fontSizeAdjust?: ConditionalValue<Unscaled<"unitless">>;
|
|
222
|
+
fontStretch?: ConditionalValue<Unscaled<"none">>;
|
|
223
|
+
fontStyle?: ConditionalValue<Unscaled<"none">>;
|
|
224
|
+
fontSynthesis?: ConditionalValue<Unscaled<"none">>;
|
|
225
|
+
fontVariant?: ConditionalValue<Unscaled<"none">>;
|
|
226
|
+
fontVariantAlternates?: ConditionalValue<Unscaled<"none">>;
|
|
227
|
+
fontVariantCaps?: ConditionalValue<Unscaled<"none">>;
|
|
228
|
+
fontVariantEastAsian?: ConditionalValue<Unscaled<"none">>;
|
|
229
|
+
fontVariantLigatures?: ConditionalValue<Unscaled<"none">>;
|
|
230
|
+
fontVariantNumeric?: ConditionalValue<Unscaled<"none">>;
|
|
231
|
+
fontVariantPosition?: ConditionalValue<Unscaled<"none">>;
|
|
232
|
+
fontVariationSettings?: ConditionalValue<Unscaled<"none">>;
|
|
233
|
+
fontWeight?: ConditionalValue<ScaleValue<"fontWeights", "unitless">>;
|
|
234
|
+
forcedColorAdjust?: ConditionalValue<Unscaled<"none">>;
|
|
235
|
+
gap?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
236
|
+
gridArea?: ConditionalValue<Unscaled<"unitless">>;
|
|
237
|
+
gridAutoColumns?: ConditionalValue<Unscaled<"length">>;
|
|
238
|
+
gridAutoFlow?: ConditionalValue<Unscaled<"none">>;
|
|
239
|
+
gridAutoRows?: ConditionalValue<Unscaled<"length">>;
|
|
240
|
+
gridColumn?: ConditionalValue<Unscaled<"unitless">>;
|
|
241
|
+
gridColumnEnd?: ConditionalValue<Unscaled<"unitless">>;
|
|
242
|
+
gridColumnStart?: ConditionalValue<Unscaled<"unitless">>;
|
|
243
|
+
gridRow?: ConditionalValue<Unscaled<"unitless">>;
|
|
244
|
+
gridRowEnd?: ConditionalValue<Unscaled<"unitless">>;
|
|
245
|
+
gridRowStart?: ConditionalValue<Unscaled<"unitless">>;
|
|
246
|
+
gridTemplate?: ConditionalValue<Unscaled<"none">>;
|
|
247
|
+
gridTemplateAreas?: ConditionalValue<Unscaled<"none">>;
|
|
248
|
+
gridTemplateColumns?: ConditionalValue<Unscaled<"length">>;
|
|
249
|
+
gridTemplateRows?: ConditionalValue<Unscaled<"length">>;
|
|
250
|
+
height?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
251
|
+
hyphenateCharacter?: ConditionalValue<Unscaled<"none">>;
|
|
252
|
+
hyphens?: ConditionalValue<Unscaled<"none">>;
|
|
253
|
+
imageOrientation?: ConditionalValue<Unscaled<"none">>;
|
|
254
|
+
imageRendering?: ConditionalValue<Unscaled<"none">>;
|
|
255
|
+
inlineSize?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
256
|
+
inset?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
257
|
+
insetBlock?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
258
|
+
insetBlockEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
259
|
+
insetBlockStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
260
|
+
insetInline?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
261
|
+
insetInlineEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
262
|
+
insetInlineStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
263
|
+
interpolateSize?: ConditionalValue<Unscaled<"none">>;
|
|
264
|
+
isolation?: ConditionalValue<Unscaled<"none">>;
|
|
265
|
+
justifyContent?: ConditionalValue<Unscaled<"none">>;
|
|
266
|
+
justifyItems?: ConditionalValue<Unscaled<"none">>;
|
|
267
|
+
justifySelf?: ConditionalValue<Unscaled<"none">>;
|
|
268
|
+
left?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
269
|
+
letterSpacing?: ConditionalValue<ScaleValue<"letterSpacings", "length">>;
|
|
270
|
+
lightingColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
271
|
+
lineBreak?: ConditionalValue<Unscaled<"none">>;
|
|
272
|
+
lineHeight?: ConditionalValue<ScaleValue<"lineHeights", "unitless">>;
|
|
273
|
+
listStyle?: ConditionalValue<Unscaled<"none">>;
|
|
274
|
+
listStyleImage?: ConditionalValue<Unscaled<"none">>;
|
|
275
|
+
listStylePosition?: ConditionalValue<Unscaled<"none">>;
|
|
276
|
+
listStyleType?: ConditionalValue<Unscaled<"none">>;
|
|
277
|
+
margin?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
278
|
+
marginBlock?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
279
|
+
marginBlockEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
280
|
+
marginBlockStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
281
|
+
marginBottom?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
282
|
+
marginInline?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
283
|
+
marginInlineEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
284
|
+
marginInlineStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
285
|
+
marginLeft?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
286
|
+
marginRight?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
287
|
+
marginTop?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
288
|
+
markerEnd?: ConditionalValue<Unscaled<"none">>;
|
|
289
|
+
markerMid?: ConditionalValue<Unscaled<"none">>;
|
|
290
|
+
markerStart?: ConditionalValue<Unscaled<"none">>;
|
|
291
|
+
mask?: ConditionalValue<Unscaled<"none">>;
|
|
292
|
+
maskClip?: ConditionalValue<Unscaled<"none">>;
|
|
293
|
+
maskComposite?: ConditionalValue<Unscaled<"none">>;
|
|
294
|
+
maskImage?: ConditionalValue<Unscaled<"none">>;
|
|
295
|
+
maskMode?: ConditionalValue<Unscaled<"none">>;
|
|
296
|
+
maskOrigin?: ConditionalValue<Unscaled<"none">>;
|
|
297
|
+
maskPosition?: ConditionalValue<Unscaled<"length">>;
|
|
298
|
+
maskRepeat?: ConditionalValue<Unscaled<"none">>;
|
|
299
|
+
maskSize?: ConditionalValue<Unscaled<"length">>;
|
|
300
|
+
maskType?: ConditionalValue<Unscaled<"none">>;
|
|
301
|
+
maxBlockSize?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
302
|
+
maxHeight?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
303
|
+
maxInlineSize?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
304
|
+
maxWidth?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
305
|
+
minBlockSize?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
306
|
+
minHeight?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
307
|
+
minInlineSize?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
308
|
+
minWidth?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
309
|
+
mixBlendMode?: ConditionalValue<Unscaled<"none">>;
|
|
310
|
+
objectFit?: ConditionalValue<Unscaled<"none">>;
|
|
311
|
+
objectPosition?: ConditionalValue<Unscaled<"length">>;
|
|
312
|
+
opacity?: ConditionalValue<ScaleValue<"opacities", "unitless">>;
|
|
313
|
+
order?: ConditionalValue<Unscaled<"unitless">>;
|
|
314
|
+
orphans?: ConditionalValue<Unscaled<"unitless">>;
|
|
315
|
+
outline?: ConditionalValue<Unscaled<"none">>;
|
|
316
|
+
outlineColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
317
|
+
outlineOffset?: ConditionalValue<Unscaled<"length">>;
|
|
318
|
+
outlineStyle?: ConditionalValue<Unscaled<"none">>;
|
|
319
|
+
outlineWidth?: ConditionalValue<Unscaled<"length">>;
|
|
320
|
+
overflow?: ConditionalValue<Unscaled<"none">>;
|
|
321
|
+
overflowAnchor?: ConditionalValue<Unscaled<"none">>;
|
|
322
|
+
overflowBlock?: ConditionalValue<Unscaled<"none">>;
|
|
323
|
+
overflowClipMargin?: ConditionalValue<Unscaled<"length">>;
|
|
324
|
+
overflowInline?: ConditionalValue<Unscaled<"none">>;
|
|
325
|
+
overflowWrap?: ConditionalValue<Unscaled<"none">>;
|
|
326
|
+
overflowX?: ConditionalValue<Unscaled<"none">>;
|
|
327
|
+
overflowY?: ConditionalValue<Unscaled<"none">>;
|
|
328
|
+
overscrollBehavior?: ConditionalValue<Unscaled<"none">>;
|
|
329
|
+
overscrollBehaviorBlock?: ConditionalValue<Unscaled<"none">>;
|
|
330
|
+
overscrollBehaviorInline?: ConditionalValue<Unscaled<"none">>;
|
|
331
|
+
overscrollBehaviorX?: ConditionalValue<Unscaled<"none">>;
|
|
332
|
+
overscrollBehaviorY?: ConditionalValue<Unscaled<"none">>;
|
|
333
|
+
padding?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
334
|
+
paddingBlock?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
335
|
+
paddingBlockEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
336
|
+
paddingBlockStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
337
|
+
paddingBottom?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
338
|
+
paddingInline?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
339
|
+
paddingInlineEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
340
|
+
paddingInlineStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
341
|
+
paddingLeft?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
342
|
+
paddingRight?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
343
|
+
paddingTop?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
344
|
+
paintOrder?: ConditionalValue<Unscaled<"none">>;
|
|
345
|
+
perspective?: ConditionalValue<Unscaled<"length">>;
|
|
346
|
+
perspectiveOrigin?: ConditionalValue<Unscaled<"length">>;
|
|
347
|
+
placeContent?: ConditionalValue<Unscaled<"none">>;
|
|
348
|
+
placeItems?: ConditionalValue<Unscaled<"none">>;
|
|
349
|
+
placeSelf?: ConditionalValue<Unscaled<"none">>;
|
|
350
|
+
pointerEvents?: ConditionalValue<Unscaled<"none">>;
|
|
351
|
+
position?: ConditionalValue<Unscaled<"none">>;
|
|
352
|
+
positionAnchor?: ConditionalValue<Unscaled<"none">>;
|
|
353
|
+
positionArea?: ConditionalValue<Unscaled<"none">>;
|
|
354
|
+
positionTry?: ConditionalValue<Unscaled<"none">>;
|
|
355
|
+
positionTryFallbacks?: ConditionalValue<Unscaled<"none">>;
|
|
356
|
+
positionTryOrder?: ConditionalValue<Unscaled<"none">>;
|
|
357
|
+
positionVisibility?: ConditionalValue<Unscaled<"none">>;
|
|
358
|
+
printColorAdjust?: ConditionalValue<Unscaled<"none">>;
|
|
359
|
+
quotes?: ConditionalValue<Unscaled<"none">>;
|
|
360
|
+
resize?: ConditionalValue<Unscaled<"none">>;
|
|
361
|
+
right?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
362
|
+
rotate?: ConditionalValue<Unscaled<"angle">>;
|
|
363
|
+
rowGap?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
364
|
+
rubyPosition?: ConditionalValue<Unscaled<"none">>;
|
|
365
|
+
scale?: ConditionalValue<Unscaled<"unitless">>;
|
|
366
|
+
scrollBehavior?: ConditionalValue<Unscaled<"none">>;
|
|
367
|
+
scrollMargin?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
368
|
+
scrollMarginBlock?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
369
|
+
scrollMarginBlockEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
370
|
+
scrollMarginBlockStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
371
|
+
scrollMarginBottom?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
372
|
+
scrollMarginInline?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
373
|
+
scrollMarginInlineEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
374
|
+
scrollMarginInlineStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
375
|
+
scrollMarginLeft?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
376
|
+
scrollMarginRight?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
377
|
+
scrollMarginTop?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
378
|
+
scrollPadding?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
379
|
+
scrollPaddingBlock?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
380
|
+
scrollPaddingBlockEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
381
|
+
scrollPaddingBlockStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
382
|
+
scrollPaddingBottom?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
383
|
+
scrollPaddingInline?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
384
|
+
scrollPaddingInlineEnd?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
385
|
+
scrollPaddingInlineStart?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
386
|
+
scrollPaddingLeft?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
387
|
+
scrollPaddingRight?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
388
|
+
scrollPaddingTop?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
389
|
+
scrollSnapAlign?: ConditionalValue<Unscaled<"none">>;
|
|
390
|
+
scrollSnapStop?: ConditionalValue<Unscaled<"none">>;
|
|
391
|
+
scrollSnapType?: ConditionalValue<Unscaled<"none">>;
|
|
392
|
+
scrollTimeline?: ConditionalValue<Unscaled<"none">>;
|
|
393
|
+
scrollTimelineAxis?: ConditionalValue<Unscaled<"none">>;
|
|
394
|
+
scrollTimelineName?: ConditionalValue<Unscaled<"none">>;
|
|
395
|
+
scrollbarColor?: ConditionalValue<Unscaled<"none">>;
|
|
396
|
+
scrollbarGutter?: ConditionalValue<Unscaled<"none">>;
|
|
397
|
+
scrollbarWidth?: ConditionalValue<Unscaled<"none">>;
|
|
398
|
+
shapeImageThreshold?: ConditionalValue<Unscaled<"unitless">>;
|
|
399
|
+
shapeMargin?: ConditionalValue<Unscaled<"length">>;
|
|
400
|
+
shapeOutside?: ConditionalValue<Unscaled<"none">>;
|
|
401
|
+
shapeRendering?: ConditionalValue<Unscaled<"none">>;
|
|
402
|
+
stopColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
403
|
+
stopOpacity?: ConditionalValue<Unscaled<"unitless">>;
|
|
404
|
+
stroke?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
405
|
+
strokeDasharray?: ConditionalValue<Unscaled<"unitless">>;
|
|
406
|
+
strokeDashoffset?: ConditionalValue<Unscaled<"unitless">>;
|
|
407
|
+
strokeLinecap?: ConditionalValue<Unscaled<"none">>;
|
|
408
|
+
strokeLinejoin?: ConditionalValue<Unscaled<"none">>;
|
|
409
|
+
strokeMiterlimit?: ConditionalValue<Unscaled<"unitless">>;
|
|
410
|
+
strokeOpacity?: ConditionalValue<Unscaled<"unitless">>;
|
|
411
|
+
strokeWidth?: ConditionalValue<Unscaled<"unitless">>;
|
|
412
|
+
tabSize?: ConditionalValue<Unscaled<"unitless">>;
|
|
413
|
+
tableLayout?: ConditionalValue<Unscaled<"none">>;
|
|
414
|
+
textAlign?: ConditionalValue<Unscaled<"none">>;
|
|
415
|
+
textAlignLast?: ConditionalValue<Unscaled<"none">>;
|
|
416
|
+
textAnchor?: ConditionalValue<Unscaled<"none">>;
|
|
417
|
+
textBox?: ConditionalValue<Unscaled<"none">>;
|
|
418
|
+
textBoxEdge?: ConditionalValue<Unscaled<"none">>;
|
|
419
|
+
textBoxTrim?: ConditionalValue<Unscaled<"none">>;
|
|
420
|
+
textCombineUpright?: ConditionalValue<Unscaled<"none">>;
|
|
421
|
+
textDecoration?: ConditionalValue<Unscaled<"none">>;
|
|
422
|
+
textDecorationColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
423
|
+
textDecorationLine?: ConditionalValue<Unscaled<"none">>;
|
|
424
|
+
textDecorationSkipInk?: ConditionalValue<Unscaled<"none">>;
|
|
425
|
+
textDecorationStyle?: ConditionalValue<Unscaled<"none">>;
|
|
426
|
+
textDecorationThickness?: ConditionalValue<Unscaled<"length">>;
|
|
427
|
+
textEmphasis?: ConditionalValue<Unscaled<"none">>;
|
|
428
|
+
textEmphasisColor?: ConditionalValue<ScaleValue<"colors", "none">>;
|
|
429
|
+
textEmphasisPosition?: ConditionalValue<Unscaled<"none">>;
|
|
430
|
+
textEmphasisStyle?: ConditionalValue<Unscaled<"none">>;
|
|
431
|
+
textIndent?: ConditionalValue<Unscaled<"length">>;
|
|
432
|
+
textJustify?: ConditionalValue<Unscaled<"none">>;
|
|
433
|
+
textOrientation?: ConditionalValue<Unscaled<"none">>;
|
|
434
|
+
textOverflow?: ConditionalValue<Unscaled<"none">>;
|
|
435
|
+
textRendering?: ConditionalValue<Unscaled<"none">>;
|
|
436
|
+
textShadow?: ConditionalValue<ScaleValue<"textShadows", "none">>;
|
|
437
|
+
textSizeAdjust?: ConditionalValue<Unscaled<"none">>;
|
|
438
|
+
textTransform?: ConditionalValue<Unscaled<"none">>;
|
|
439
|
+
textUnderlineOffset?: ConditionalValue<Unscaled<"length">>;
|
|
440
|
+
textUnderlinePosition?: ConditionalValue<Unscaled<"none">>;
|
|
441
|
+
textWrap?: ConditionalValue<Unscaled<"none">>;
|
|
442
|
+
timelineScope?: ConditionalValue<Unscaled<"none">>;
|
|
443
|
+
top?: ConditionalValue<ScaleValue<"spacing", "spacing">>;
|
|
444
|
+
touchAction?: ConditionalValue<Unscaled<"none">>;
|
|
445
|
+
transform?: ConditionalValue<Unscaled<"none">>;
|
|
446
|
+
transformBox?: ConditionalValue<Unscaled<"none">>;
|
|
447
|
+
transformOrigin?: ConditionalValue<Unscaled<"length">>;
|
|
448
|
+
transformStyle?: ConditionalValue<Unscaled<"none">>;
|
|
449
|
+
transition?: ConditionalValue<Unscaled<"none">>;
|
|
450
|
+
transitionBehavior?: ConditionalValue<Unscaled<"none">>;
|
|
451
|
+
transitionDelay?: ConditionalValue<ScaleValue<"durations", "time">>;
|
|
452
|
+
transitionDuration?: ConditionalValue<ScaleValue<"durations", "time">>;
|
|
453
|
+
transitionProperty?: ConditionalValue<Unscaled<"none">>;
|
|
454
|
+
transitionTimingFunction?: ConditionalValue<ScaleValue<"easings", "none">>;
|
|
455
|
+
translate?: ConditionalValue<Unscaled<"length">>;
|
|
456
|
+
unicodeBidi?: ConditionalValue<Unscaled<"none">>;
|
|
457
|
+
userSelect?: ConditionalValue<Unscaled<"none">>;
|
|
458
|
+
vectorEffect?: ConditionalValue<Unscaled<"none">>;
|
|
459
|
+
verticalAlign?: ConditionalValue<Unscaled<"length">>;
|
|
460
|
+
viewTimeline?: ConditionalValue<Unscaled<"none">>;
|
|
461
|
+
viewTimelineAxis?: ConditionalValue<Unscaled<"none">>;
|
|
462
|
+
viewTimelineInset?: ConditionalValue<Unscaled<"length">>;
|
|
463
|
+
viewTimelineName?: ConditionalValue<Unscaled<"none">>;
|
|
464
|
+
viewTransitionClass?: ConditionalValue<Unscaled<"none">>;
|
|
465
|
+
viewTransitionName?: ConditionalValue<Unscaled<"none">>;
|
|
466
|
+
visibility?: ConditionalValue<Unscaled<"none">>;
|
|
467
|
+
whiteSpace?: ConditionalValue<Unscaled<"none">>;
|
|
468
|
+
widows?: ConditionalValue<Unscaled<"unitless">>;
|
|
469
|
+
width?: ConditionalValue<ScaleValue<"sizes", "sizes">>;
|
|
470
|
+
willChange?: ConditionalValue<Unscaled<"none">>;
|
|
471
|
+
wordBreak?: ConditionalValue<Unscaled<"none">>;
|
|
472
|
+
wordSpacing?: ConditionalValue<Unscaled<"length">>;
|
|
473
|
+
writingMode?: ConditionalValue<Unscaled<"none">>;
|
|
474
|
+
zIndex?: ConditionalValue<ScaleValue<"zIndices", "unitless">>;
|
|
475
|
+
zoom?: ConditionalValue<Unscaled<"unitless">>;
|
|
476
|
+
}
|
|
477
|
+
//#endregion
|
|
478
|
+
//#region src/runtime/types.d.ts
|
|
479
|
+
/**
|
|
480
|
+
* The project's design system as types, declared by the generated
|
|
481
|
+
* `vicss.d.ts` (the plugin writes it whenever the config loads; `vicss types`
|
|
482
|
+
* writes it in CI):
|
|
483
|
+
*
|
|
484
|
+
* ```ts
|
|
485
|
+
* declare module "@menapo/vicss" {
|
|
486
|
+
* interface Register {
|
|
487
|
+
* tokens: { colors: "accent" | "blue.600"; spacing: number; … };
|
|
488
|
+
* conditions: "_hover" | "_md" | …;
|
|
489
|
+
* textStyles: "heading";
|
|
490
|
+
* utilities: { size: "sizes"; truncate: boolean };
|
|
491
|
+
* sets: { size: "height" | "width"; textStyle: "fontSize" | …; … };
|
|
492
|
+
* strict: { colors: "css"; … };
|
|
493
|
+
* responsive: "_md" | "_lg" | "_containerMd" | …;
|
|
494
|
+
* markerStates: "hover" | "checked" | "current" | …;
|
|
495
|
+
* palettes: "blue" | "gray" | "red" | …;
|
|
496
|
+
* framework: "vue";
|
|
497
|
+
* }
|
|
498
|
+
* }
|
|
499
|
+
* ```
|
|
500
|
+
*/
|
|
501
|
+
interface Register {}
|
|
502
|
+
/** Token paths per scale, a number where it names a token, `number` on a stepped spacing scale. */
|
|
503
|
+
type Tokens = Register extends {
|
|
504
|
+
tokens: infer T;
|
|
505
|
+
} ? T : OpenTokens;
|
|
506
|
+
/** Before generation: any string, and numbers for spacing. */
|
|
507
|
+
type OpenTokens = { [S in ScaleName]: S extends "spacing" ? string | number : string; };
|
|
508
|
+
/** The token paths of one scale: `Token<"colors">` is `"accent" | "blue.600" | …`. */
|
|
509
|
+
type Token<S extends ScaleName> = S extends keyof Tokens ? Tokens[S] : string;
|
|
510
|
+
/**
|
|
511
|
+
* The palettes `colorPalette` names (`palettes` in the config), as a
|
|
512
|
+
* function style's parameter takes one: `(tone: Palette) => ({ colorPalette:
|
|
513
|
+
* tone })`. Any string before generation; none when the design system has
|
|
514
|
+
* no palettes. Private tokens are left out of `Tokens`; palette keys
|
|
515
|
+
* (`palette.600`) are colour tokens like any other.
|
|
516
|
+
*/
|
|
517
|
+
type Palette = Register extends {
|
|
518
|
+
palettes: infer P extends string;
|
|
519
|
+
} ? P : Register extends {
|
|
520
|
+
tokens: unknown;
|
|
521
|
+
} ? never : string;
|
|
522
|
+
/** Condition keys: `"_hover" | "_md" | …`. */
|
|
523
|
+
type Conditions = Register extends {
|
|
524
|
+
conditions: infer C extends string;
|
|
525
|
+
} ? C : `_${string}`;
|
|
526
|
+
/** Text style names (`textStyles` in the config). */
|
|
527
|
+
type TextStyles = Register extends {
|
|
528
|
+
textStyles: infer T extends string;
|
|
529
|
+
} ? T : string;
|
|
530
|
+
/**
|
|
531
|
+
* Strictness per scale (D8). Only `"tokens"` closes a scale to values
|
|
532
|
+
* outside it in the types; under the others any string type-checks, and
|
|
533
|
+
* the build tells a valid CSS value from a mistyped token.
|
|
534
|
+
*/
|
|
535
|
+
type Strict = Register extends {
|
|
536
|
+
strict: infer S;
|
|
537
|
+
} ? S : OpenStrict;
|
|
538
|
+
type OpenStrict = { [S in ScaleName]: "off"; };
|
|
539
|
+
type Strictness<S extends ScaleName> = S extends keyof Strict ? Strict[S] : "off";
|
|
540
|
+
/**
|
|
541
|
+
* Utilities by name, as registered: a scale name for a utility that takes
|
|
542
|
+
* the scale's values, `boolean` for a flag, `unknown` for anything else.
|
|
543
|
+
*/
|
|
544
|
+
type RegisteredUtilities = Register extends {
|
|
545
|
+
utilities: infer U;
|
|
546
|
+
} ? U : OpenUtilities;
|
|
547
|
+
interface OpenUtilities {
|
|
548
|
+
size: "sizes";
|
|
549
|
+
truncate: boolean;
|
|
550
|
+
srOnly: boolean;
|
|
551
|
+
}
|
|
552
|
+
/** The value each utility takes: its scale's values, or `boolean` for a flag. */
|
|
553
|
+
type Utilities = { [K in keyof RegisteredUtilities]: UtilityValue<RegisteredUtilities[K]>; };
|
|
554
|
+
type UtilityValue<U> = U extends ScaleName ? ScaleValue<U> : U extends boolean ? boolean : string | number | boolean;
|
|
555
|
+
/**
|
|
556
|
+
* The style keys each utility and `textStyle` set: a `Style` records those
|
|
557
|
+
* rather than the utility's own name, so `Style<"margin">` takes
|
|
558
|
+
* `css({ m: 4 })`. `string` for a utility whose output the generator could
|
|
559
|
+
* not tell.
|
|
560
|
+
*/
|
|
561
|
+
type Sets = Register extends {
|
|
562
|
+
sets: infer X;
|
|
563
|
+
} ? X : OpenSets;
|
|
564
|
+
/** Before generation: the built-in utilities (core/system.ts), which every project has. */
|
|
565
|
+
interface OpenSets {
|
|
566
|
+
size: "height" | "width";
|
|
567
|
+
srOnly: "borderWidth" | "clip" | "height" | "margin" | "overflow" | "padding" | "position" | "whiteSpace" | "width";
|
|
568
|
+
truncate: "overflow" | "textOverflow" | "whiteSpace";
|
|
569
|
+
}
|
|
570
|
+
/**
|
|
571
|
+
* What a `Style` records for style keys `K`: CSS properties, with utilities
|
|
572
|
+
* replaced by what they set. Most styles use no utility, which the first
|
|
573
|
+
* test answers without distributing over `K` (a third of a css() call's
|
|
574
|
+
* check time otherwise, tests/types/budget.test.ts).
|
|
575
|
+
*/
|
|
576
|
+
type Recorded<K> = [K & keyof Sets] extends [never] ? K : Exclude<K, keyof Sets> | Sets[K & keyof Sets];
|
|
577
|
+
type Vars$1 = Record<string, string>;
|
|
578
|
+
/**
|
|
579
|
+
* What `sx()` returns per framework (PLAN §5.12): the class attribute each
|
|
580
|
+
* one takes, and its `style` as an object or an `a:b;c:d` string.
|
|
581
|
+
*/
|
|
582
|
+
interface SxShapes {
|
|
583
|
+
react: {
|
|
584
|
+
className: string;
|
|
585
|
+
style?: Vars$1;
|
|
586
|
+
};
|
|
587
|
+
preact: {
|
|
588
|
+
className: string;
|
|
589
|
+
style?: Vars$1;
|
|
590
|
+
};
|
|
591
|
+
solid: {
|
|
592
|
+
class: string;
|
|
593
|
+
style?: Vars$1;
|
|
594
|
+
};
|
|
595
|
+
vue: {
|
|
596
|
+
class: string;
|
|
597
|
+
style?: Vars$1;
|
|
598
|
+
};
|
|
599
|
+
svelte: {
|
|
600
|
+
class: string;
|
|
601
|
+
style?: string;
|
|
602
|
+
};
|
|
603
|
+
astro: {
|
|
604
|
+
class: string;
|
|
605
|
+
style?: string;
|
|
606
|
+
};
|
|
607
|
+
vanilla: {
|
|
608
|
+
class: string;
|
|
609
|
+
style?: string;
|
|
610
|
+
};
|
|
611
|
+
}
|
|
612
|
+
/**
|
|
613
|
+
* The project's framework, which `vicss.d.ts` registers as the plugin
|
|
614
|
+
* detected it (the `framework` option, else the root `package.json`'s
|
|
615
|
+
* dependencies, §5.12); React when none is registered, `sx` being React's
|
|
616
|
+
* shape itself.
|
|
617
|
+
*/
|
|
618
|
+
type RegisteredFramework = Register extends {
|
|
619
|
+
framework: infer Framework extends keyof SxShapes;
|
|
620
|
+
} ? Framework : "react";
|
|
621
|
+
/** The attributes `sx()` returns: in this project, or in framework `F`. */
|
|
622
|
+
type SxAttributes<F extends keyof SxShapes = RegisteredFramework> = SxShapes[F];
|
|
623
|
+
/**
|
|
624
|
+
* What a bare number means on a property (core/properties.ts `NumberKind`):
|
|
625
|
+
* a spacing step, a plain number, a length, time or angle in its default
|
|
626
|
+
* unit, or nothing.
|
|
627
|
+
*/
|
|
628
|
+
type NumberKind = "spacing" | "sizes" | "unitless" | "length" | "time" | "angle" | "none";
|
|
629
|
+
/** Any string, without swallowing the literals beside it in completions. */
|
|
630
|
+
type AnyString = string & Record<never, never>;
|
|
631
|
+
/** A string holding a token reference: `"{colors.accent}"`, `"color-mix(in oklab, {colors.accent} 50%, white)"`. */
|
|
632
|
+
type TokenReference = `${string}{${string}}${string}` & Record<never, never>;
|
|
633
|
+
type Percentage = `${number}%` & Record<never, never>;
|
|
634
|
+
/** A number written as a string, which the build reads as the number: `"600"`, `"1.5"`, `"-4"`. */
|
|
635
|
+
type NumericString = `${number}` & Record<never, never>;
|
|
636
|
+
/** Zero as a length written as a string, as most write it; the build reads it as `0`. */
|
|
637
|
+
type ZeroLength = "0" | "0px" | "0rem" | "0em";
|
|
638
|
+
/** Zero as a time written as a string. */
|
|
639
|
+
type ZeroTime = "0" | "0s" | "0ms";
|
|
640
|
+
/**
|
|
641
|
+
* The value of a property on scale `S` whose numbers mean `N` (spec S9, S10):
|
|
642
|
+
* the scale's tokens, the numbers the build gives a meaning, the scale's
|
|
643
|
+
* keywords and token references, listed for completion; and any string,
|
|
644
|
+
* which the build checks, unless the scale takes tokens only.
|
|
645
|
+
*/
|
|
646
|
+
type ScaleValue<S extends ScaleName, N extends NumberKind = ScaleNumberKinds[S]> = Token<S> | ScaleNumber<S, N> | ScaleKeywords[S] | WideKeyword | (S extends PercentScale ? Percentage : never) | TokenReference | (Strictness<S> extends "tokens" ? never : AnyString);
|
|
647
|
+
/**
|
|
648
|
+
* Numbers on a scale, and the strings the build reads as those numbers:
|
|
649
|
+
* spacing steps (or spacing tokens named by numbers), any number where it is
|
|
650
|
+
* plain, and only zero where any other number would be a length outside a
|
|
651
|
+
* strict scale. Tokens named by numbers are in `Token<S>`.
|
|
652
|
+
*/
|
|
653
|
+
type ScaleNumber<S extends ScaleName, N extends NumberKind> = N extends "spacing" | "sizes" ? Extract<Token<"spacing">, number> | 0 | ZeroLength | (number extends Extract<Token<"spacing">, number> ? NumericString : never) : N extends "unitless" ? number | NumericString : N extends "angle" ? number : N extends "length" ? Strictness<S> extends "tokens" ? 0 | ZeroLength : number : N extends "time" ? Strictness<S> extends "tokens" ? 0 | ZeroTime : number : never;
|
|
654
|
+
/** The value of a property without a scale: any CSS string, and numbers where they mean something. */
|
|
655
|
+
type Unscaled<N extends NumberKind> = string | (N extends "none" ? never : number);
|
|
656
|
+
/**
|
|
657
|
+
* A condition key made by a marker: `[row.hover]` (PLAN §4.5). The compiler
|
|
658
|
+
* evaluates it to `__vx:m:<family>:<id>:<state>` (core/conditions.ts).
|
|
659
|
+
*/
|
|
660
|
+
type MarkerKey = `__vx:m:${string}`;
|
|
661
|
+
/** `{ base: 4, _md: 6, _hover: { _md: 8 }, [row.hover]: 2 }`: a value per condition. */
|
|
662
|
+
interface ConditionalObject<V> extends ConditionMap<V> {
|
|
663
|
+
base?: V;
|
|
664
|
+
readonly [marker: MarkerKey]: ConditionalValue<V> | undefined;
|
|
665
|
+
}
|
|
666
|
+
type ConditionMap<V> = { [C in Conditions]?: ConditionalValue<V>; };
|
|
667
|
+
/** A value, or a value per condition. */
|
|
668
|
+
type ConditionalValue<V> = V | ConditionalObject<V>;
|
|
669
|
+
/** Utility names registered for the project; none before generation. */
|
|
670
|
+
type UtilityNames = Register extends {
|
|
671
|
+
utilities: infer U;
|
|
672
|
+
} ? keyof U : never;
|
|
673
|
+
/** CSS properties, less any a utility of the same name replaces (the compiler reads utilities first). */
|
|
674
|
+
type StyleProperties = [Extract<UtilityNames, keyof CssProperties>] extends [never] ? CssProperties : Omit<CssProperties, UtilityNames>;
|
|
675
|
+
/**
|
|
676
|
+
* Utilities as style keys. Before generation the project's own utilities are
|
|
677
|
+
* unknown, so any other key is accepted too.
|
|
678
|
+
*/
|
|
679
|
+
type UtilityProperties = Register extends {
|
|
680
|
+
utilities: infer U;
|
|
681
|
+
} ? { [K in keyof U]?: ConditionalValue<UtilityValue<U[K]>>; } : OpenUtilityProperties;
|
|
682
|
+
interface OpenUtilityProperties {
|
|
683
|
+
size?: ConditionalValue<ScaleValue<"sizes">>;
|
|
684
|
+
truncate?: ConditionalValue<boolean>;
|
|
685
|
+
srOnly?: ConditionalValue<boolean>;
|
|
686
|
+
readonly [utility: string]: unknown;
|
|
687
|
+
}
|
|
688
|
+
/**
|
|
689
|
+
* Blocks under a condition. Before generation the conditions are a pattern,
|
|
690
|
+
* an index signature that a marker's computed key meets too, so it takes
|
|
691
|
+
* any value as `StyleObject`'s marker signature does, and `ExactStyle`
|
|
692
|
+
* checks the blocks.
|
|
693
|
+
*/
|
|
694
|
+
type ConditionBlocks = `_${string}` extends Conditions ? OpenConditionBlocks : { [C in Conditions]?: StyleObject; };
|
|
695
|
+
interface OpenConditionBlocks {
|
|
696
|
+
readonly [condition: `_${string}`]: StyleObject | AnyStyleValue | undefined;
|
|
697
|
+
}
|
|
698
|
+
/**
|
|
699
|
+
* A style object as authors write it (PLAN §4.2): CSS properties typed by
|
|
700
|
+
* their scales, utilities, `textStyle`, and blocks under a condition or a
|
|
701
|
+
* marker.
|
|
702
|
+
*/
|
|
703
|
+
interface StyleObject extends StyleProperties, UtilityProperties, ConditionBlocks {
|
|
704
|
+
/** A composite token from `textStyles` in the config. */
|
|
705
|
+
textStyle?: ConditionalValue<TextStyles>;
|
|
706
|
+
/**
|
|
707
|
+
* The palette `palette.*` colours follow on this element and its subtree
|
|
708
|
+
* (PLAN §4.8): `colorPalette: "red"` makes `palette.600` read `red.600`.
|
|
709
|
+
*/
|
|
710
|
+
colorPalette?: ConditionalValue<Palette>;
|
|
711
|
+
/**
|
|
712
|
+
* A block under a marker. A marker's key is computed, which gives the
|
|
713
|
+
* object literal a `string` index signature over every value in it, the
|
|
714
|
+
* named properties' included, so the signature takes any value a style
|
|
715
|
+
* holds: `ExactStyle` checks what sits under a marker as a block.
|
|
716
|
+
*/
|
|
717
|
+
readonly [marker: MarkerKey]: StyleObject | AnyStyleValue | undefined;
|
|
718
|
+
}
|
|
719
|
+
/** Any value a property takes, as `css()` would before the design system types it. */
|
|
720
|
+
type AnyStyleValue = ConditionalValue<string | number | boolean>;
|
|
721
|
+
/** Keys whose value is a nested block: conditions and markers. */
|
|
722
|
+
type BlockKey = Conditions | MarkerKey;
|
|
723
|
+
/** Named in errors on a key that is no style key. */
|
|
724
|
+
interface UnknownStyleKey {
|
|
725
|
+
readonly "vicss: not a CSS property, a utility, textStyle or a condition": never;
|
|
726
|
+
}
|
|
727
|
+
/** Named in errors on a key of a value per condition that is neither `base` nor a condition. */
|
|
728
|
+
interface UnknownConditionKey {
|
|
729
|
+
readonly "vicss: not base or a condition": never;
|
|
730
|
+
}
|
|
731
|
+
/**
|
|
732
|
+
* Excess-property checks for an inferred style object, which TypeScript
|
|
733
|
+
* skips for a type parameter. `unknown` when every key is known, at every
|
|
734
|
+
* depth; otherwise a path to each unknown key, whose value must be
|
|
735
|
+
* `UnknownStyleKey` (or `UnknownConditionKey`), which no value is. Only the
|
|
736
|
+
* keys at fault are mapped: a mapped type over every key of every style
|
|
737
|
+
* would be checked against each argument (tests/types/budget.test.ts).
|
|
738
|
+
*/
|
|
739
|
+
type ExactStyle<S> = [BadKeys<S>] extends [never] ? unknown : { [K in BadKeys<S>]: K extends MarkerKey ? MarkerCheck<S> : K extends keyof StyleObject ? K extends BlockKey ? OpenBlock & ExactStyle<S[K & keyof S]> : ExactValue<S[K & keyof S]> : UnknownStyleKey; };
|
|
740
|
+
/** What a named block is checked against besides its keys: `StyleObject` before generation (`BadNamedBlock`). */
|
|
741
|
+
type OpenBlock = `_${string}` extends Conditions ? StyleObject : unknown;
|
|
742
|
+
type ExactValue<V> = [BadConditionKeys<V>] extends [never] ? unknown : { [K in BadConditionKeys<V>]: K extends "base" | BlockKey ? ExactValue<V[K & keyof V]> : UnknownConditionKey; };
|
|
743
|
+
/**
|
|
744
|
+
* Keys of `S` that are unknown, or hold a block or a value per condition
|
|
745
|
+
* with an unknown key; `MarkerKey` when a block under a marker is at fault.
|
|
746
|
+
*/
|
|
747
|
+
type BadKeys<S> = Exclude<Known<S>, keyof StyleObject> | { [K in BlockKeys<S>]-?: [BadNamedBlock<S[K & keyof S]>] extends [never] ? never : K; }[BlockKeys<S>] | { [K in ValueKeys<S>]-?: [BadConditionKeys<S[K & keyof S]>] extends [never] ? never : K; }[ValueKeys<S>] | (string extends keyof S ? (true extends BadBlock<Computed<S>> ? MarkerKey : never) : never);
|
|
748
|
+
type BadConditionKeys<V> = Exclude<Known<V>, "base" | BlockKey> | { [K in Known<V>]-?: V[K & keyof V] extends object ? [BadConditionKeys<V[K & keyof V]>] extends [never] ? never : K : never; }[Known<V>];
|
|
749
|
+
/**
|
|
750
|
+
* The keys of `S` written by name. A computed key of a pattern type (a
|
|
751
|
+
* marker's `[row.hover]`) gives the object a `string` index signature,
|
|
752
|
+
* which `keyof` folds every named key into; a remapped type lists them
|
|
753
|
+
* again. Only objects with a marker pay for it.
|
|
754
|
+
*/
|
|
755
|
+
type Known<S> = string extends keyof S ? keyof { [K in keyof S as Named<K>]: 0; } : keyof S;
|
|
756
|
+
/** Keys that name a property: not the `string` and `number` of an index signature. */
|
|
757
|
+
type Named<K> = K extends unknown ? string extends K ? never : number extends K ? never : K : never;
|
|
758
|
+
/**
|
|
759
|
+
* The blocks of `S` under computed keys, its markers'. The index signature
|
|
760
|
+
* covers every value, so those of named keys are taken out: values both
|
|
761
|
+
* ways assignable to one, since dropping what is merely assignable would
|
|
762
|
+
* also drop a block that adds keys to a named one, and leave them
|
|
763
|
+
* unchecked. TypeScript normalizes a union of object literals with
|
|
764
|
+
* `key?: undefined` for the keys of the others, which `Written` drops.
|
|
765
|
+
*/
|
|
766
|
+
type Computed<S> = Written<Unnamed<S[string & keyof S], ValuesAt<S, Known<S>>>>;
|
|
767
|
+
/** An object without the `key?: undefined` that union normalization added. */
|
|
768
|
+
type Written<B> = B extends object ? { [K in keyof B as [B[K]] extends [undefined] ? never : K]: B[K]; } : B;
|
|
769
|
+
/** `S[K]`, distributed: `S[never]` is the index signature's value on an object that has one. */
|
|
770
|
+
type ValuesAt<S, K> = K extends keyof S ? S[K] : never;
|
|
771
|
+
type Unnamed<U, N> = U extends unknown ? (true extends SameAs<U, N> ? never : U) : never;
|
|
772
|
+
type SameAs<A, N> = N extends unknown ? [A] extends [N] ? [N] extends [A] ? true : never : never : never;
|
|
773
|
+
/**
|
|
774
|
+
* `true` for a block under a named condition that `css()` refuses. With a
|
|
775
|
+
* registered design system each condition is a property typing its block,
|
|
776
|
+
* which the argument is checked against; before, the conditions are a
|
|
777
|
+
* pattern whose signature takes any value (`ConditionBlocks`), so the
|
|
778
|
+
* block's values are checked here too. Only then: the check costs as much
|
|
779
|
+
* as the rest of `css()`'s (tests/types/budget.test.ts).
|
|
780
|
+
*/
|
|
781
|
+
type BadNamedBlock<B> = `_${string}` extends Conditions ? BadBlock<B> : [BadKeys<B>] extends [never] ? never : true;
|
|
782
|
+
/** `true` for a block under a marker that `css()` refuses: a value no style takes, or an unknown key. */
|
|
783
|
+
type BadBlock<B> = B extends unknown ? [B] extends [StyleObject] ? [BadKeys<B>] extends [never] ? never : true : true : never;
|
|
784
|
+
/**
|
|
785
|
+
* What the index signature a marker gives `S` must hold where a block is at
|
|
786
|
+
* fault: the values of its named properties, which the signature covers
|
|
787
|
+
* too, or a block that is a style with every block's keys checked. The
|
|
788
|
+
* blocks themselves are intersected in: TypeScript types a value under a
|
|
789
|
+
* marker by this signature alone, and would widen the literals it does not
|
|
790
|
+
* list, then report them before the fault.
|
|
791
|
+
*/
|
|
792
|
+
type MarkerCheck<S> = ValuesAt<S, Exclude<Known<S>, BlockKey>> | (BlocksOf<S> & StyleObject & AllExact<BlocksOf<S>>);
|
|
793
|
+
/** The blocks of `S`, under conditions and markers. */
|
|
794
|
+
type BlocksOf<S> = ValuesAt<S, BlockKeys<S>> | (string extends keyof S ? Computed<S> : never);
|
|
795
|
+
/** `ExactStyle` of each block, intersected: a union would let one block pass another's check. */
|
|
796
|
+
type AllExact<B> = (B extends object ? (check: ExactStyle<B>) => void : never) extends ((check: infer I) => void) ? I : unknown;
|
|
797
|
+
type BlockKeys<S> = Extract<Known<S>, BlockKey>;
|
|
798
|
+
/** Keys of `S` holding a value per condition (an object). */
|
|
799
|
+
type ValueKeys<S> = { [K in Exclude<Known<S>, BlockKey>]-?: S[K & keyof S] extends object ? K : never; }[Exclude<Known<S>, BlockKey>];
|
|
800
|
+
/**
|
|
801
|
+
* The keys a style object sets: properties, utilities and `textStyle`, with
|
|
802
|
+
* those of nested blocks, under conditions and markers. Unrolled to three
|
|
803
|
+
* levels of nesting rather than recursive, which the checker would expand
|
|
804
|
+
* without end on `StyleObject` itself; anything deeper counts as setting
|
|
805
|
+
* any property. Most styles have no block, which the first test answers
|
|
806
|
+
* without looking further.
|
|
807
|
+
*/
|
|
808
|
+
type PropsOf<S> = Recorded<KeysSet<S>>;
|
|
809
|
+
/** `PropsOf` before utilities are replaced by what they set: one `Recorded` serves many styles. */
|
|
810
|
+
type KeysSet<S> = [BlockKeys<S>] extends [never] ? string extends keyof S ? (OwnKeys<S> | Nested1<Computed<S>>) & string : keyof S & string : (OwnKeys<S> | Nested1<BlocksOf<S>>) & string;
|
|
811
|
+
/** The keys a style sets itself, not in its blocks. */
|
|
812
|
+
type OwnKeys<S> = Exclude<Known<S>, BlockKey>;
|
|
813
|
+
type Nested1<B> = B extends object ? OwnKeys<B> | Nested0<BlocksOf<B>> : never;
|
|
814
|
+
type Nested0<B> = B extends object ? OwnKeys<B> | ([BlocksOf<B>] extends [never] ? never : string) : never;
|
|
815
|
+
/** Records the keys a compiled style sets; never present at runtime. */
|
|
816
|
+
declare const PROPERTIES: unique symbol;
|
|
817
|
+
/**
|
|
818
|
+
* A compiled style (PLAN §4.7, §5.6): an object from merge id to class name
|
|
819
|
+
* that records the keys it sets. `Style<"margin" | "width">` accepts
|
|
820
|
+
* `css({ margin: 4 })` and rejects `css({ color: "accent" })`, so a
|
|
821
|
+
* component decides what a caller may override. A utility or `textStyle`
|
|
822
|
+
* counts as the properties it sets.
|
|
823
|
+
*
|
|
824
|
+
* One style is an element's class and its style (PLAN §5.16): its
|
|
825
|
+
* `toString()` is its class attribute, so it goes where a class string
|
|
826
|
+
* goes (`class={card}`, `className={card}`, `${card}`), and the plugin
|
|
827
|
+
* writes it as an inline style where it is `style=`. The type says so: a
|
|
828
|
+
* string that records its keys, which `className` and `class` take, and
|
|
829
|
+
* which React's `style` takes too through one property it shares with
|
|
830
|
+
* React's style object (always `undefined`: the value is no style object).
|
|
831
|
+
* At runtime it is an object, not a string: `String(card)` is its classes,
|
|
832
|
+
* and string methods are not there.
|
|
833
|
+
*/
|
|
834
|
+
type Style<K extends string = string> = string & {
|
|
835
|
+
readonly [PROPERTIES]: K;
|
|
836
|
+
/** Never set: what lets React's `style` prop take a compiled style, which the plugin writes inline. */
|
|
837
|
+
readonly WebkitBoxOrient?: undefined;
|
|
838
|
+
};
|
|
839
|
+
/**
|
|
840
|
+
* A compiled style with runtime values (PLAN §5.8): its constant style and
|
|
841
|
+
* the custom properties its classes read, which `sx()` sets inline.
|
|
842
|
+
*/
|
|
843
|
+
interface DynamicStyle<K extends string = string> {
|
|
844
|
+
readonly $c: Style<K>;
|
|
845
|
+
readonly $s?: Readonly<Record<string, string>>;
|
|
846
|
+
}
|
|
847
|
+
/**
|
|
848
|
+
* What `sx()` takes: compiled styles, the app's own class names (a string,
|
|
849
|
+
* kept as it is, before the styles' classes), falsy values (`cond && style`)
|
|
850
|
+
* and arrays of them.
|
|
851
|
+
*/
|
|
852
|
+
type StyleArg<K extends string = string> = Style<K> | DynamicStyle<K> | string | false | null | undefined | 0 | readonly StyleArg<K>[];
|
|
853
|
+
/** The attributes `sx()` returns in this project: `SxAttributes` of the registered framework. */
|
|
854
|
+
type StyleAttributes = SxAttributes;
|
|
855
|
+
/** A function style (PLAN §4.6): runtime values in, a style object out. */
|
|
856
|
+
type StyleFunction = (...args: never[]) => StyleObject;
|
|
857
|
+
/**
|
|
858
|
+
* `ExactStyle` for a style object, or for the object a function style
|
|
859
|
+
* returns. Nothing while `S` is still the constraint: the checker types the
|
|
860
|
+
* argument's properties against the parameter before it infers `S`, and an
|
|
861
|
+
* intersection there would rebuild each property's token union per call.
|
|
862
|
+
*/
|
|
863
|
+
type Exact<S> = StyleObject extends S ? unknown : S extends ((...args: infer A) => infer R) ? (...args: A) => R & ExactStyle<R> : ExactStyle<S>;
|
|
864
|
+
/** What `css()` compiles `S` to: a style, or a function returning a dynamic style. */
|
|
865
|
+
type CssResult<S> = S extends ((...args: infer A) => infer R) ? (...args: A) => DynamicStyle<PropsOf<R>> : Style<PropsOf<S>>;
|
|
866
|
+
/** What `css()` takes besides the style. */
|
|
867
|
+
interface CssOptions {
|
|
868
|
+
/**
|
|
869
|
+
* A class the style adds as it is (`card`), kept like a class string
|
|
870
|
+
* passed to `sx()`: a stable hook for tests, theming and devtools, which
|
|
871
|
+
* the style's own classes, hashed in builds, are not.
|
|
872
|
+
*/
|
|
873
|
+
readonly name?: string;
|
|
874
|
+
}
|
|
875
|
+
/**
|
|
876
|
+
* `css()`: a style object, or a function style, checked against the design
|
|
877
|
+
* system. One signature rather than overloads, so an error names the
|
|
878
|
+
* property at fault instead of the overload tried last. `const` keeps each
|
|
879
|
+
* literal's type without asking whether its contextual type is a literal
|
|
880
|
+
* type, which on a value per condition of a large scale costs a pass over
|
|
881
|
+
* the scale's union per value (tests/types/budget.test.ts).
|
|
882
|
+
*/
|
|
883
|
+
type Css = <const S extends StyleObject | StyleFunction>(style: S & NoInfer<Exact<S>>, options?: CssOptions) => CssResult<S>;
|
|
884
|
+
/** `sx()`: merges styles into the attributes of an element, in the project's framework's shape. */
|
|
885
|
+
type Sx = (...args: StyleArg[]) => SxAttributes;
|
|
886
|
+
/**
|
|
887
|
+
* States a marker exposes as condition keys (`[row.hover]`): the conditions
|
|
888
|
+
* on the element itself, which `vicss.d.ts` lists from the config, its own
|
|
889
|
+
* (`"&[aria-current=page]"`) included. Before generation, the built-in ones.
|
|
890
|
+
*/
|
|
891
|
+
type MarkerState = Register extends {
|
|
892
|
+
markerStates: infer S extends string;
|
|
893
|
+
} ? S : BuiltInMarkerState;
|
|
894
|
+
/** The built-in conditions a marker takes, structural ones included. */
|
|
895
|
+
type BuiltInMarkerState = "first" | "last" | "only" | "odd" | "even" | "firstOfType" | "lastOfType" | "visited" | "target" | "open" | "checked" | "indeterminate" | "placeholderShown" | "autofill" | "optional" | "required" | "valid" | "invalid" | "readOnly" | "empty" | "focusWithin" | "hover" | "focus" | "focusVisible" | "active" | "enabled" | "disabled";
|
|
896
|
+
/**
|
|
897
|
+
* `group()` / `peer()`: the class that marks an element (`sx(row, …)`), which
|
|
898
|
+
* sets no property, so any `Style` prop takes it. Its states are condition
|
|
899
|
+
* keys in styles compiled with it (PLAN §4.5); they exist at build time only:
|
|
900
|
+
* at runtime a marker is a style that adds its class as it is (`$n`).
|
|
901
|
+
*/
|
|
902
|
+
type Marker = Style<never> & { readonly [State in MarkerState]: MarkerKey; };
|
|
903
|
+
/**
|
|
904
|
+
* Types the definition only, never the runtime: the phantom key ties a
|
|
905
|
+
* `Recipe` to the shape of the definition it came from (`RecipeShape`), so
|
|
906
|
+
* `extends` and `Variants` can read it back. Nothing at runtime carries it.
|
|
907
|
+
*/
|
|
908
|
+
declare const definitionKey: unique symbol;
|
|
909
|
+
/** A variant value as props and compounds name it: `true` names the `"true"` value. */
|
|
910
|
+
type VariantValue = string | number | boolean;
|
|
911
|
+
/** A slot recipe's style per slot: `{ panel: { … }, title: { … } }`. */
|
|
912
|
+
interface SlotStyles {
|
|
913
|
+
readonly [slot: string]: SlotStyle;
|
|
914
|
+
}
|
|
915
|
+
/**
|
|
916
|
+
* A style in a slot. No style has a `base` key; saying so keeps a value per
|
|
917
|
+
* condition (`{ color: { base: "nope" } }`) in a recipe without slots from
|
|
918
|
+
* reading as a style for a slot named `color`, which TypeScript would report
|
|
919
|
+
* as a missing `slots` rather than at the value.
|
|
920
|
+
*/
|
|
921
|
+
interface SlotStyle extends StyleObject {
|
|
922
|
+
readonly base?: undefined;
|
|
923
|
+
}
|
|
924
|
+
/**
|
|
925
|
+
* A compound variant: the values it holds for (a value or a list) and the
|
|
926
|
+
* style it adds, a style per slot in a slot recipe.
|
|
927
|
+
*/
|
|
928
|
+
interface CompoundVariant<S = StyleObject> {
|
|
929
|
+
readonly style: S;
|
|
930
|
+
readonly [variant: string]: VariantValue | readonly VariantValue[] | S;
|
|
931
|
+
}
|
|
932
|
+
/** A compound slot: one style for several slots, when the variants hold. */
|
|
933
|
+
interface CompoundSlot {
|
|
934
|
+
readonly slots: readonly string[];
|
|
935
|
+
readonly style: StyleObject;
|
|
936
|
+
readonly [variant: string]: VariantValue | readonly VariantValue[] | StyleObject;
|
|
937
|
+
}
|
|
938
|
+
/** What `extends` takes: a recipe made by `recipe()`. */
|
|
939
|
+
interface RecipeLike {
|
|
940
|
+
readonly [definitionKey]?: RecipeShape;
|
|
941
|
+
}
|
|
942
|
+
/** A parent with slots: a recipe extends parents of one kind only (the compiler refuses a mix). */
|
|
943
|
+
interface SlotRecipeLike {
|
|
944
|
+
readonly [definitionKey]?: {
|
|
945
|
+
readonly slots: {
|
|
946
|
+
readonly [slot: string]: string;
|
|
947
|
+
};
|
|
948
|
+
};
|
|
949
|
+
}
|
|
950
|
+
interface DefinitionBase {
|
|
951
|
+
readonly defaultVariants?: Readonly<Record<string, VariantValue>>;
|
|
952
|
+
/** Variants whose props may take a value per breakpoint or container; `true` for all. */
|
|
953
|
+
readonly responsive?: readonly string[] | true;
|
|
954
|
+
}
|
|
955
|
+
/**
|
|
956
|
+
* `recipe()`'s argument (PLAN §4.4): every style is a `StyleObject`,
|
|
957
|
+
* checked against the design system like a `css()` style. Boolean variants
|
|
958
|
+
* use the keys `true` and `false`. With slots, of its own or a parent's,
|
|
959
|
+
* base styles live in the slots and every value and compound styles slots
|
|
960
|
+
* (`{ panel: { … } }`). Three members rather than one whose values take a
|
|
961
|
+
* style or a style per slot: a style per slot would also read as a style
|
|
962
|
+
* with an unknown key (`panel`), and its values would escape the check.
|
|
963
|
+
* `DefinitionFor` picks the member a definition is checked against.
|
|
964
|
+
*/
|
|
965
|
+
type RecipeDefinition = SlotDefinition | InheritedSlotsDefinition | PlainDefinition;
|
|
966
|
+
interface SlotsBase extends DefinitionBase {
|
|
967
|
+
readonly base?: undefined;
|
|
968
|
+
/**
|
|
969
|
+
* Slots whose base style compiles to one class (PLAN D22): `true` for
|
|
970
|
+
* every slot, a list for those. Left out, the parents' choice holds.
|
|
971
|
+
*/
|
|
972
|
+
readonly flatten?: boolean | readonly string[];
|
|
973
|
+
/** Variant → value → style per slot. */
|
|
974
|
+
readonly variants?: {
|
|
975
|
+
readonly [variant: string]: {
|
|
976
|
+
readonly [value: string]: SlotStyles;
|
|
977
|
+
};
|
|
978
|
+
};
|
|
979
|
+
readonly compoundVariants?: readonly CompoundVariant<SlotStyles>[];
|
|
980
|
+
readonly compoundSlots?: readonly CompoundSlot[];
|
|
981
|
+
}
|
|
982
|
+
/** A recipe with slots of its own, and parents with slots, if any. */
|
|
983
|
+
interface SlotDefinition extends SlotsBase {
|
|
984
|
+
readonly slots: SlotStyles;
|
|
985
|
+
readonly extends?: SlotRecipeLike | readonly SlotRecipeLike[];
|
|
986
|
+
}
|
|
987
|
+
/** A recipe whose slots come from its parents, perhaps with more of its own. */
|
|
988
|
+
interface InheritedSlotsDefinition extends SlotsBase {
|
|
989
|
+
readonly slots?: SlotStyles;
|
|
990
|
+
readonly extends: SlotRecipeLike | readonly SlotRecipeLike[];
|
|
991
|
+
}
|
|
992
|
+
interface PlainDefinition extends DefinitionBase {
|
|
993
|
+
readonly base?: StyleObject;
|
|
994
|
+
/**
|
|
995
|
+
* The base compiles to one class (PLAN D22), for an element repeated
|
|
996
|
+
* thousands of times: every variant, compound and `sx()` override still
|
|
997
|
+
* wins over it per property and condition, as over atoms. Left out, the
|
|
998
|
+
* parents' choice holds.
|
|
999
|
+
*/
|
|
1000
|
+
readonly flatten?: boolean;
|
|
1001
|
+
readonly slots?: undefined;
|
|
1002
|
+
/** Variant → value → style. */
|
|
1003
|
+
readonly variants?: {
|
|
1004
|
+
readonly [variant: string]: {
|
|
1005
|
+
readonly [value: string]: StyleObject;
|
|
1006
|
+
};
|
|
1007
|
+
};
|
|
1008
|
+
readonly compoundVariants?: readonly CompoundVariant[];
|
|
1009
|
+
readonly compoundSlots?: undefined;
|
|
1010
|
+
/**
|
|
1011
|
+
* Parents merged before this definition: variants per key, compounds
|
|
1012
|
+
* first. Any recipe whose type declares no slots, a bare `Recipe` and a
|
|
1013
|
+
* shape written by hand included: `DefinitionFor` picks this member only
|
|
1014
|
+
* when no parent declares slots.
|
|
1015
|
+
*/
|
|
1016
|
+
readonly extends?: RecipeLike | readonly RecipeLike[];
|
|
1017
|
+
}
|
|
1018
|
+
/**
|
|
1019
|
+
* What `recipe()` infers a definition against: its shape, with any object
|
|
1020
|
+
* for a style. A fault in one style then leaves the definition's type to
|
|
1021
|
+
* the literal, so the recipe keeps its variants, and the fault is reported
|
|
1022
|
+
* where it is, against the member `DefinitionFor` picks; against the union,
|
|
1023
|
+
* TypeScript would report it at every value, against whichever member it
|
|
1024
|
+
* tried last.
|
|
1025
|
+
*/
|
|
1026
|
+
interface DefinitionShape extends DefinitionBase {
|
|
1027
|
+
readonly base?: object;
|
|
1028
|
+
readonly flatten?: boolean | readonly string[];
|
|
1029
|
+
readonly slots?: {
|
|
1030
|
+
readonly [slot: string]: object;
|
|
1031
|
+
};
|
|
1032
|
+
readonly variants?: {
|
|
1033
|
+
readonly [variant: string]: {
|
|
1034
|
+
readonly [value: string]: object;
|
|
1035
|
+
};
|
|
1036
|
+
};
|
|
1037
|
+
readonly compoundVariants?: readonly object[];
|
|
1038
|
+
readonly compoundSlots?: readonly object[];
|
|
1039
|
+
readonly extends?: RecipeLike | readonly RecipeLike[];
|
|
1040
|
+
}
|
|
1041
|
+
/**
|
|
1042
|
+
* `recipe()`'s parameter for definition `D`: `D` itself where it is the
|
|
1043
|
+
* `RecipeDefinition` member `DefinitionFor` picks, that member where a
|
|
1044
|
+
* style is not, which TypeScript then reports at the value at fault; `D`
|
|
1045
|
+
* stays the literal either way. Not the two intersected: TypeScript looks
|
|
1046
|
+
* a property up in `D` alone where the member has an index signature
|
|
1047
|
+
* instead, and reports nothing below it, and a literal value met with a
|
|
1048
|
+
* property's values is `never`, which is all its message would name.
|
|
1049
|
+
*/
|
|
1050
|
+
type DefinitionArg<D> = [D] extends [DefinitionFor<D>] ? D : DefinitionFor<D>;
|
|
1051
|
+
/**
|
|
1052
|
+
* The member of `RecipeDefinition` that definition `D` is checked against:
|
|
1053
|
+
* with slots when it has its own, or its parents declare theirs; without
|
|
1054
|
+
* slots otherwise.
|
|
1055
|
+
*/
|
|
1056
|
+
type DefinitionFor<D> = D extends {
|
|
1057
|
+
readonly slots: object;
|
|
1058
|
+
} ? SlotDefinition : [KeysOfUnion<ParentSlots<ParentsOf<D>>>] extends [never] ? PlainDefinition : InheritedSlotsDefinition;
|
|
1059
|
+
/**
|
|
1060
|
+
* What a recipe's type keeps of its definition: the names of its variants
|
|
1061
|
+
* and values, its slots, `responsive`, its parents, and the properties its
|
|
1062
|
+
* styles set, which `Style<K>` props check; never its values or
|
|
1063
|
+
* conditions. A recipe's type, and the declarations a library ships, grow
|
|
1064
|
+
* with its table.
|
|
1065
|
+
*/
|
|
1066
|
+
interface RecipeShape {
|
|
1067
|
+
readonly variants?: {
|
|
1068
|
+
readonly [variant: string]: {
|
|
1069
|
+
readonly [value: string]: unknown;
|
|
1070
|
+
};
|
|
1071
|
+
} | undefined;
|
|
1072
|
+
/** Slot → the properties its styles set, parents' slots included; `undefined` without slots. */
|
|
1073
|
+
readonly slots?: {
|
|
1074
|
+
readonly [slot: string]: string;
|
|
1075
|
+
} | undefined;
|
|
1076
|
+
/** The properties the styles of a recipe without slots set, parents' included. */
|
|
1077
|
+
readonly props?: string | undefined;
|
|
1078
|
+
readonly responsive?: readonly string[] | true | undefined;
|
|
1079
|
+
readonly extends?: RecipeLike | readonly RecipeLike[] | undefined;
|
|
1080
|
+
}
|
|
1081
|
+
/**
|
|
1082
|
+
* A definition's `RecipeShape`: `1` stands for a value's styles. A
|
|
1083
|
+
* conditional type, so declarations print the shape rather than
|
|
1084
|
+
* `ShapeOf<definition>`.
|
|
1085
|
+
*/
|
|
1086
|
+
type ShapeOf<D> = D extends unknown ? {
|
|
1087
|
+
readonly variants: D extends {
|
|
1088
|
+
readonly variants: infer V;
|
|
1089
|
+
} ? { readonly [K in keyof V]: { readonly [Value in keyof V[K]]: 1; }; } : undefined;
|
|
1090
|
+
readonly slots: [SlotNames<D>] extends [never] ? undefined : { readonly [K in SlotNames<D>]: SlotProps<D, K>; };
|
|
1091
|
+
readonly props: [SlotNames<D>] extends [never] ? PlainProps<D> : undefined;
|
|
1092
|
+
readonly responsive: D extends {
|
|
1093
|
+
readonly responsive: infer R;
|
|
1094
|
+
} ? R : undefined;
|
|
1095
|
+
readonly extends: D extends {
|
|
1096
|
+
readonly extends: infer E;
|
|
1097
|
+
} ? E : undefined;
|
|
1098
|
+
} : never;
|
|
1099
|
+
type DefinitionOf<R> = R extends {
|
|
1100
|
+
readonly [definitionKey]?: infer D;
|
|
1101
|
+
} ? Exclude<D, undefined> : never;
|
|
1102
|
+
type ParentsOf<D> = D extends {
|
|
1103
|
+
readonly extends: infer E;
|
|
1104
|
+
} ? DefinitionOf<E extends readonly unknown[] ? E[number] : E> : never;
|
|
1105
|
+
/** The string keys of an object; none of `undefined`. */
|
|
1106
|
+
type KeysIn<T> = T extends object ? keyof T & string : never;
|
|
1107
|
+
/** Variant names of a shape and its parents; `string` for the bare `RecipeShape`. */
|
|
1108
|
+
type KeysOf<D> = D extends unknown ? (D extends {
|
|
1109
|
+
readonly variants?: infer V;
|
|
1110
|
+
} ? KeysIn<V> : never) | KeysOf<ParentsOf<D>> : never;
|
|
1111
|
+
/** The values of variant `K`, as the definitions key them. */
|
|
1112
|
+
type ValuesOf<D, K> = D extends unknown ? (D extends {
|
|
1113
|
+
readonly variants?: infer V;
|
|
1114
|
+
} ? V extends object ? K extends keyof V ? keyof V[K] : never : never : never) | ValuesOf<ParentsOf<D>, K> : never;
|
|
1115
|
+
/** A list that is not literal (`string[]`) names no variant the types can know. */
|
|
1116
|
+
type ResponsiveOf<D> = D extends unknown ? (D extends {
|
|
1117
|
+
readonly responsive: true;
|
|
1118
|
+
} ? KeysOf<D> : D extends {
|
|
1119
|
+
readonly responsive: readonly (infer R)[];
|
|
1120
|
+
} ? string extends R ? never : R : never) | ResponsiveOf<ParentsOf<D>> : never;
|
|
1121
|
+
/**
|
|
1122
|
+
* The parents' shapes record their slots and properties, their own parents'
|
|
1123
|
+
* included, so a definition reads one level up and never walks further.
|
|
1124
|
+
*/
|
|
1125
|
+
type ParentSlots<P> = P extends {
|
|
1126
|
+
readonly slots: infer S extends object;
|
|
1127
|
+
} ? S : never;
|
|
1128
|
+
type ParentProps<P> = P extends {
|
|
1129
|
+
readonly props: infer X;
|
|
1130
|
+
} ? X : never;
|
|
1131
|
+
/** A definition's slots: its own and its parents'. */
|
|
1132
|
+
type SlotNames<D> = (D extends {
|
|
1133
|
+
readonly slots: infer S;
|
|
1134
|
+
} ? KeysIn<S> : never) | KeysOfUnion<ParentSlots<ParentsOf<D>>>;
|
|
1135
|
+
type KeysOfUnion<T> = T extends unknown ? keyof T & string : never;
|
|
1136
|
+
/** `KeysSet` of each style in a union: `keyof` a union would keep only the shared keys. */
|
|
1137
|
+
type KeysOfStyles<S> = S extends unknown ? KeysSet<S> : never;
|
|
1138
|
+
/** Variant values: each value's style (a style per slot in a slot recipe). */
|
|
1139
|
+
type Cells<D> = D extends {
|
|
1140
|
+
readonly variants: infer V;
|
|
1141
|
+
} ? { [K in keyof V]: V[K][keyof V[K]]; }[keyof V] : never;
|
|
1142
|
+
type Compounds<D> = D extends {
|
|
1143
|
+
readonly compoundVariants: readonly (infer C)[];
|
|
1144
|
+
} ? C : never;
|
|
1145
|
+
type StyleIn<C> = C extends {
|
|
1146
|
+
readonly style: infer S;
|
|
1147
|
+
} ? S : never;
|
|
1148
|
+
/** The style a cell (a style per slot) gives slot `K`. */
|
|
1149
|
+
type SlotCell<C, K> = C extends unknown ? (K extends keyof C ? C[K] : never) : never;
|
|
1150
|
+
/** The style of each compound slot that names slot `K`. */
|
|
1151
|
+
type CompoundSlotStyle<D, K> = D extends {
|
|
1152
|
+
readonly compoundSlots: readonly (infer C)[];
|
|
1153
|
+
} ? C extends {
|
|
1154
|
+
readonly slots: readonly (infer N)[];
|
|
1155
|
+
readonly style: infer S;
|
|
1156
|
+
} ? K extends N ? S : never : never : never;
|
|
1157
|
+
/** What a recipe without slots sets: its base, values and compounds, and its parents'. */
|
|
1158
|
+
type PlainProps<D> = Recorded<KeysOfStyles<(D extends {
|
|
1159
|
+
readonly base: infer B;
|
|
1160
|
+
} ? B : never) | Cells<D> | StyleIn<Compounds<D>>>> | ParentProps<ParentsOf<D>>;
|
|
1161
|
+
/** What slot `K` of a slot recipe sets: in its slot style, values, compounds and compound slots. */
|
|
1162
|
+
type SlotProps<D, K> = Extract<Recorded<KeysOfStyles<(D extends {
|
|
1163
|
+
readonly slots: infer S;
|
|
1164
|
+
} ? SlotCell<S, K> : never) | SlotCell<Cells<D>, K> | SlotCell<StyleIn<Compounds<D>>, K> | CompoundSlotStyle<D, K>>> | SlotCell<ParentSlots<ParentsOf<D>>, K>, string>;
|
|
1165
|
+
/** `"true"`/`"false"` keys take booleans; numeric keys take the number or its string. */
|
|
1166
|
+
type PropValue<T> = T extends "true" | "false" ? boolean : T extends number ? T | `${T}` : T;
|
|
1167
|
+
/**
|
|
1168
|
+
* The conditions a responsive prop takes: min-width breakpoints and
|
|
1169
|
+
* container sizes, which `vicss.d.ts` lists. Before generation, any `_` key.
|
|
1170
|
+
*/
|
|
1171
|
+
type ResponsiveConditions = Register extends {
|
|
1172
|
+
responsive: infer C extends string;
|
|
1173
|
+
} ? C : `_${string}`;
|
|
1174
|
+
/**
|
|
1175
|
+
* A responsive prop: a value, or a value per breakpoint or container
|
|
1176
|
+
* condition, mobile-first (`{ base: "sm", _md: "lg" }`). `null` and
|
|
1177
|
+
* `undefined` leave a value to the default or the condition below.
|
|
1178
|
+
*/
|
|
1179
|
+
type ResponsiveValue<V> = V | { [C in "base" | ResponsiveConditions]?: V | null | undefined; };
|
|
1180
|
+
/**
|
|
1181
|
+
* Whether `D` says nothing about a recipe: the bare `Recipe` type, which every
|
|
1182
|
+
* recipe must be assignable to. Its props are `never` (a caller that does not
|
|
1183
|
+
* know the variants can only call it without props) and its keys `string`.
|
|
1184
|
+
*/
|
|
1185
|
+
type Unknown<D> = string extends KeysOf<D> ? true : false;
|
|
1186
|
+
/**
|
|
1187
|
+
* The props of a recipe with shape `D`: every variant, optional. `null` and
|
|
1188
|
+
* `undefined` take the default, so `button({ size, block })` forwards
|
|
1189
|
+
* optional props as they are.
|
|
1190
|
+
*/
|
|
1191
|
+
type RecipeProps<D> = Unknown<D> extends true ? never : { [K in KeysOf<D>]?: (K extends ResponsiveOf<D> ? ResponsiveValue<PropValue<ValuesOf<D, K>>> : PropValue<ValuesOf<D, K>>) | null | undefined; };
|
|
1192
|
+
/**
|
|
1193
|
+
* A style that records what the recipe's styles can set, or one per slot:
|
|
1194
|
+
* `sx()` takes it, and so does a `Style<K>` prop when every
|
|
1195
|
+
* property the recipe sets is open to the caller.
|
|
1196
|
+
*/
|
|
1197
|
+
type RecipeResult<D> = Unknown<D> extends true ? Style | {
|
|
1198
|
+
readonly [slot: string]: Style;
|
|
1199
|
+
} : D extends {
|
|
1200
|
+
readonly slots: infer S extends {
|
|
1201
|
+
readonly [slot: string]: string;
|
|
1202
|
+
};
|
|
1203
|
+
} ? { readonly [K in keyof S]: Style<S[K]>; } : Style<D extends {
|
|
1204
|
+
readonly props: infer P extends string;
|
|
1205
|
+
} ? P : string>;
|
|
1206
|
+
/**
|
|
1207
|
+
* A compiled recipe: call it with variant props for classes (PLAN §4.4).
|
|
1208
|
+
* `D` is a `RecipeShape`, unconstrained: with a constraint, an app that
|
|
1209
|
+
* checks its libraries' declarations (`skipLibCheck: false`) would prove
|
|
1210
|
+
* `recipe()`'s `Recipe<ShapeOf<D>>` meets it for a generic definition over
|
|
1211
|
+
* its whole design system, about 1.3 M instantiations before a line of its
|
|
1212
|
+
* own. Every reader of `D` is a conditional type, and `extends` takes a
|
|
1213
|
+
* recipe only when its shape is a `RecipeShape` (`RecipeLike`).
|
|
1214
|
+
*/
|
|
1215
|
+
interface Recipe<D = RecipeShape> {
|
|
1216
|
+
(props?: RecipeProps<D>): RecipeResult<D>;
|
|
1217
|
+
/** The variant props, for splitting them from DOM props. */
|
|
1218
|
+
readonly variantKeys: ReadonlyArray<KeysOf<D>>;
|
|
1219
|
+
/** `[variantProps, rest]`. */
|
|
1220
|
+
splitProps<P extends object>(props: P): [Pick<P, Extract<keyof P, KeysOf<D>>>, Omit<P, KeysOf<D>>];
|
|
1221
|
+
/** Every variant's values and the defaults, as strings, for docs and Storybook. */
|
|
1222
|
+
readonly schema: {
|
|
1223
|
+
readonly variants: Readonly<Record<KeysOf<D>, readonly string[]>>;
|
|
1224
|
+
readonly defaults: Readonly<Partial<Record<KeysOf<D>, string>>>;
|
|
1225
|
+
};
|
|
1226
|
+
readonly [definitionKey]?: D;
|
|
1227
|
+
}
|
|
1228
|
+
/** The props a recipe takes: `Variants<typeof button>`. */
|
|
1229
|
+
type Variants<R extends RecipeLike> = RecipeProps<DefinitionOf<R>>;
|
|
1230
|
+
/** What variant `K` of shape `S` takes: a value, or a list of them (`many`); `never` for no variant. */
|
|
1231
|
+
type Allowed<S, K, Many> = K extends KeysOf<S> ? Many extends true ? PropValue<ValuesOf<S, K>> | readonly PropValue<ValuesOf<S, K>>[] : PropValue<ValuesOf<S, K>> : never;
|
|
1232
|
+
/**
|
|
1233
|
+
* `unknown` when `Actual` is allowed, else what is: a check intersected with
|
|
1234
|
+
* the definition costs nothing where it holds, and intersecting arrays (a
|
|
1235
|
+
* compound's value list) would instantiate every array method.
|
|
1236
|
+
*/
|
|
1237
|
+
type Check<Actual, A> = [Actual] extends [A] ? unknown : A;
|
|
1238
|
+
/** Whether every key of compound `E` names a variant of `S` and its values, besides `reserved`. */
|
|
1239
|
+
type CompoundValid<S, E, Reserved> = E extends unknown ? { [P in keyof E]-?: P extends Reserved ? true : [E[P]] extends [Allowed<S, P, true>] ? true : false; }[keyof E] : never;
|
|
1240
|
+
/** A list of compounds checked entry by entry, once one is wrong. */
|
|
1241
|
+
type CompoundsCheck<S, C, Reserved> = C extends readonly unknown[] ? false extends CompoundValid<S, C[number], Reserved> ? { readonly [I in keyof C]: { readonly [P in keyof C[I]]: P extends Reserved ? unknown : Check<C[I][P], Allowed<S, P, true>>; }; } : unknown : unknown;
|
|
1242
|
+
/** Named in errors on a key of a style per slot that is no slot of the recipe. */
|
|
1243
|
+
interface UnknownSlot {
|
|
1244
|
+
readonly "vicss: not a slot of this recipe": never;
|
|
1245
|
+
}
|
|
1246
|
+
/**
|
|
1247
|
+
* Whether a style of the definition has a key `css()` would refuse
|
|
1248
|
+
* (`ExactStyle`), or a style per slot names no slot. Distributes over
|
|
1249
|
+
* every style at once, so a valid definition costs one pass.
|
|
1250
|
+
*/
|
|
1251
|
+
type Faulty<D, Slots> = D extends unknown ? AnyBadKeys<(D extends {
|
|
1252
|
+
readonly base: infer B;
|
|
1253
|
+
} ? B : never) | (D extends {
|
|
1254
|
+
readonly slots: infer S;
|
|
1255
|
+
} ? S[keyof S] : never) | ([Slots] extends [never] ? Cells<D> | StyleIn<Compounds<D>> : SlotValues<Cells<D> | StyleIn<Compounds<D>>>) | StyleIn<D extends {
|
|
1256
|
+
readonly compoundSlots: readonly (infer C)[];
|
|
1257
|
+
} ? C : never>> | ([Slots] extends [never] ? never : AnyBadSlot<Cells<D> | StyleIn<Compounds<D>>, Slots>) : never;
|
|
1258
|
+
type SlotValues<C> = C extends unknown ? C[keyof C] : never;
|
|
1259
|
+
type AnyBadKeys<S> = S extends unknown ? ([BadKeys<S>] extends [never] ? never : true) : never;
|
|
1260
|
+
type AnyBadSlot<C, Slots> = C extends unknown ? [Exclude<keyof C, Slots>] extends [never] ? never : true : never;
|
|
1261
|
+
/** `ExactStyle` of a value's or a compound's style, or of each slot's. */
|
|
1262
|
+
type CellCheck<C, Slots> = [Slots] extends [never] ? ExactStyle<C> : { readonly [K in keyof C]: K extends Slots ? ExactStyle<C[K]> : UnknownSlot; };
|
|
1263
|
+
/** The definition's styles, each checked: built only for a definition that has a fault. */
|
|
1264
|
+
type StylesCheck<D, Slots> = {
|
|
1265
|
+
readonly base?: D extends {
|
|
1266
|
+
readonly base: infer B;
|
|
1267
|
+
} ? ExactStyle<B> : unknown;
|
|
1268
|
+
readonly slots?: D extends {
|
|
1269
|
+
readonly slots: infer S;
|
|
1270
|
+
} ? { readonly [K in keyof S]: ExactStyle<S[K]>; } : unknown;
|
|
1271
|
+
readonly variants?: D extends {
|
|
1272
|
+
readonly variants: infer V;
|
|
1273
|
+
} ? { readonly [K in keyof V]: { readonly [X in keyof V[K]]: CellCheck<V[K][X], Slots>; }; } : unknown;
|
|
1274
|
+
};
|
|
1275
|
+
/** The compounds' styles, checked like the values': built only for a definition that has a fault. */
|
|
1276
|
+
type CompoundStylesCheck<C, Slots> = C extends readonly unknown[] ? { readonly [I in keyof C]: {
|
|
1277
|
+
readonly style: CellCheck<StyleIn<C[I]>, Slots>;
|
|
1278
|
+
}; } : unknown;
|
|
1279
|
+
/**
|
|
1280
|
+
* What `recipe()` checks of a definition beyond its type, against its own
|
|
1281
|
+
* variants and its parents': defaults and compounds name variants and their
|
|
1282
|
+
* values (`never` where they do not), a literal `responsive` list names
|
|
1283
|
+
* variants, and, where some style has a fault, each style's keys, as
|
|
1284
|
+
* `css()` checks them, and the slots a style per slot names. Nothing while
|
|
1285
|
+
* `D` is still the constraint, as for `css()` (`Exact`).
|
|
1286
|
+
*/
|
|
1287
|
+
type RecipeChecks<D> = ShapeOf<D> extends (infer S) ? {
|
|
1288
|
+
readonly defaultVariants?: D extends {
|
|
1289
|
+
readonly defaultVariants: infer V;
|
|
1290
|
+
} ? { readonly [K in keyof V]: Check<V[K], Allowed<S, K, false>>; } : unknown;
|
|
1291
|
+
readonly compoundVariants?: D extends {
|
|
1292
|
+
readonly compoundVariants: infer C;
|
|
1293
|
+
} ? CompoundsCheck<S, C, "style"> : unknown;
|
|
1294
|
+
readonly compoundSlots?: D extends {
|
|
1295
|
+
readonly compoundSlots: infer C;
|
|
1296
|
+
} ? CompoundsCheck<S, C, "style" | "slots"> : unknown;
|
|
1297
|
+
readonly responsive?: D extends {
|
|
1298
|
+
readonly responsive: readonly (infer R)[];
|
|
1299
|
+
} ? string extends R ? unknown : [R] extends [KeysOf<S>] ? unknown : readonly KeysOf<S>[] : unknown;
|
|
1300
|
+
readonly flatten?: D extends {
|
|
1301
|
+
readonly flatten: readonly (infer F)[];
|
|
1302
|
+
} ? string extends F ? unknown : [F] extends [SlotNames<D>] ? unknown : readonly SlotNames<D>[] : unknown;
|
|
1303
|
+
} & (DefinitionShape extends D ? unknown : true extends Faulty<D, SlotNames<D>> ? StylesCheck<D, SlotNames<D>> & {
|
|
1304
|
+
readonly compoundVariants?: D extends {
|
|
1305
|
+
readonly compoundVariants: infer C;
|
|
1306
|
+
} ? CompoundStylesCheck<C, SlotNames<D>> : unknown;
|
|
1307
|
+
readonly compoundSlots?: D extends {
|
|
1308
|
+
readonly compoundSlots: infer C;
|
|
1309
|
+
} ? CompoundStylesCheck<C, never> : unknown;
|
|
1310
|
+
} : unknown) : never;
|
|
1311
|
+
/** M1's names for the authoring types, kept for code written against them. */
|
|
1312
|
+
type StyleInput = StyleObject;
|
|
1313
|
+
type StyleInputValue = ConditionalValue<string | number | boolean> | StyleObject;
|
|
1314
|
+
//#endregion
|
|
1315
|
+
//#region src/runtime/merge.d.ts
|
|
1316
|
+
/**
|
|
1317
|
+
* A compiled style as the runtime sees it: merge id → class, plus `$n`, the
|
|
1318
|
+
* classes kept as they are (`css(style, { name })`, markers). The public
|
|
1319
|
+
* types in `types.ts` add what the style sets.
|
|
1320
|
+
*/
|
|
1321
|
+
interface StyleRecord {
|
|
1322
|
+
readonly [id: string]: string;
|
|
1323
|
+
}
|
|
1324
|
+
/**
|
|
1325
|
+
* A compiled style with runtime values: its constant style, `$c`, which
|
|
1326
|
+
* keys the cache like any compiled style, and the custom properties its
|
|
1327
|
+
* classes read, `$s`, set inline on every call.
|
|
1328
|
+
*/
|
|
1329
|
+
interface DynamicStyle$1 {
|
|
1330
|
+
readonly $c: StyleRecord;
|
|
1331
|
+
readonly $s?: Readonly<Record<string, string>>;
|
|
1332
|
+
}
|
|
1333
|
+
/**
|
|
1334
|
+
* What `sx()` takes: compiled styles, class names of the app's own (a
|
|
1335
|
+
* string, kept as it is), falsy values (`cond && style`) and arrays.
|
|
1336
|
+
*/
|
|
1337
|
+
type StyleArg$1 = string | StyleRecord | DynamicStyle$1 | false | null | undefined | 0 | readonly StyleArg$1[];
|
|
1338
|
+
type Vars = Record<string, string>;
|
|
1339
|
+
/** Attributes for Solid and Vue: `style` as an object. */
|
|
1340
|
+
declare const sxClass: (...args: StyleArg$1[]) => {
|
|
1341
|
+
class: string;
|
|
1342
|
+
style?: Vars;
|
|
1343
|
+
};
|
|
1344
|
+
/** Attributes for Svelte, Astro and vanilla JS: `style` as `a:b;c:d`. */
|
|
1345
|
+
declare const sxString: (...args: StyleArg$1[]) => {
|
|
1346
|
+
class: string;
|
|
1347
|
+
style?: string;
|
|
1348
|
+
};
|
|
1349
|
+
//#endregion
|
|
1350
|
+
//#region src/runtime/uncompiled.d.ts
|
|
1351
|
+
/**
|
|
1352
|
+
* A style object compiled to a style (merge id → class) that records the
|
|
1353
|
+
* keys it sets; a function style compiles to a function returning that
|
|
1354
|
+
* style and the custom properties its classes read. `{ name: "card" }` adds
|
|
1355
|
+
* the class `card` as it is.
|
|
1356
|
+
*/
|
|
1357
|
+
export declare const css: Css;
|
|
1358
|
+
/**
|
|
1359
|
+
* Variants, compound variants, slots and responsive variants compiled to
|
|
1360
|
+
* class tables. `const` keeps the definition's literal keys, which type the
|
|
1361
|
+
* props: `recipe({ variants: { size: { sm: {…} } } })` takes `{ size?: "sm" }`.
|
|
1362
|
+
* Its styles are checked against the design system as `css()` checks them,
|
|
1363
|
+
* and a call returns a style that records the properties they set.
|
|
1364
|
+
*/
|
|
1365
|
+
export declare function recipe<const D extends DefinitionShape>(definition: DefinitionArg<D> & NoInfer<RecipeChecks<D>>): Recipe<ShapeOf<D>>;
|
|
1366
|
+
/**
|
|
1367
|
+
* Token paths of one scale (nested groups or dotted) → a value, or a value per
|
|
1368
|
+
* mode (`{ base: "…", _dark: "…" }`), as the compiler accepts them. The paths
|
|
1369
|
+
* stay strings: typing nested groups would take a grammar over token paths.
|
|
1370
|
+
*/
|
|
1371
|
+
type ThemeTree = {
|
|
1372
|
+
readonly [name: string]: string | number | ThemeTree;
|
|
1373
|
+
};
|
|
1374
|
+
/** Token overrides for a subtree, as a class that sets no property (`theme({ colors: { accent: "{colors.red.600}" } })`). */
|
|
1375
|
+
export declare function theme(overrides: { readonly [S in ScaleName]?: ThemeTree; }): Style<never>;
|
|
1376
|
+
/**
|
|
1377
|
+
* A typed `group` marker: its states are conditions on descendants. `name`
|
|
1378
|
+
* identifies a marker that no `const` names, or replaces the const's name.
|
|
1379
|
+
*/
|
|
1380
|
+
export declare function group(name?: string): Marker;
|
|
1381
|
+
/** A typed `peer` marker: its states are conditions on following siblings. */
|
|
1382
|
+
export declare function peer(name?: string): Marker;
|
|
1383
|
+
/** An `@keyframes` rule; returns the animation name. */
|
|
1384
|
+
export declare function keyframes(frames: {
|
|
1385
|
+
readonly [frame: string]: StyleObject;
|
|
1386
|
+
}): string;
|
|
1387
|
+
/** A token reference as a CSS value: `token("colors.accent")` is `var(--color-accent)`. */
|
|
1388
|
+
export declare function token(path: string): string;
|
|
1389
|
+
//#endregion
|
|
1390
|
+
//#region src/runtime/style.d.ts
|
|
1391
|
+
declare class Styled {
|
|
1392
|
+
/**
|
|
1393
|
+
* The class attribute `sx(style)` sets, by `sx()`'s own merge and cache:
|
|
1394
|
+
* the same string by construction, a cache hit after the first render,
|
|
1395
|
+
* and 31 B less than a merge of its own beside `sx()`, which nearly every
|
|
1396
|
+
* app ships (PLAN §6).
|
|
1397
|
+
*/
|
|
1398
|
+
toString(this: StyleRecord): string;
|
|
1399
|
+
}
|
|
1400
|
+
/** What the compiler wraps a compiled style literal in (`__vxStyled({…})`). */
|
|
1401
|
+
declare const styled: <T extends object>(record: T) => T & Styled;
|
|
1402
|
+
/**
|
|
1403
|
+
* The classes of `sx(...args)`, as a string: what a `style=` value's
|
|
1404
|
+
* conditional properties add to the element's own class (core/attributes.ts).
|
|
1405
|
+
*/
|
|
1406
|
+
declare const classList: (...args: StyleArg$1[]) => string;
|
|
1407
|
+
/**
|
|
1408
|
+
* A framework's class normaliser that reads an object as a map from class
|
|
1409
|
+
* to condition (Vue's `normalizeClass`, Svelte's `clsx`), made to take a
|
|
1410
|
+
* compiled style as its classes: the plugin points the compiled
|
|
1411
|
+
* components' calls at it (vite/attributes.ts).
|
|
1412
|
+
*/
|
|
1413
|
+
declare const classWith: <A extends unknown[], R>(normalize: (value: unknown, ...rest: A) => R) => (value: unknown, ...rest: A) => R;
|
|
1414
|
+
/**
|
|
1415
|
+
* A framework function that normalises the `class` of the props objects
|
|
1416
|
+
* it takes (Vue's `mergeProps`, `normalizeProps` and `ssrRenderAttrs`,
|
|
1417
|
+
* Svelte's server `attributes`), made to take a compiled style there too.
|
|
1418
|
+
*/
|
|
1419
|
+
declare const propsWith: <A extends unknown[], R>(merge: (...args: A) => R) => (...args: A) => R;
|
|
1420
|
+
/** Svelte's `attribute_effect(element, fn, …)`: the props `fn` returns, as `propsWith` takes them. */
|
|
1421
|
+
declare const effectWith: <A extends unknown[], R>(effect: (element: unknown, fn: (...values: never[]) => unknown, ...rest: A) => R) => (element: unknown, fn: (...values: never[]) => unknown, ...rest: A) => R;
|
|
1422
|
+
//#endregion
|
|
1423
|
+
//#region src/runtime/dev.d.ts
|
|
1424
|
+
/** What every dev variant adds. A `data-*` name, which each framework passes through as it is. */
|
|
1425
|
+
interface Source {
|
|
1426
|
+
"data-vx-src": string;
|
|
1427
|
+
}
|
|
1428
|
+
/** A function style's runtime value in dev: as in a build, checked. */
|
|
1429
|
+
declare const devValue: (property: string, value: unknown) => unknown;
|
|
1430
|
+
/**
|
|
1431
|
+
* A Token-typed parameter's value in dev: what core/compile.ts
|
|
1432
|
+
* `tokenExpression` writes in a build, checked.
|
|
1433
|
+
*/
|
|
1434
|
+
declare const devToken: (property: string, prefix: string, value: unknown) => string | undefined;
|
|
1435
|
+
/** React and Preact: `{ className, style, "data-vx-src" }`. */
|
|
1436
|
+
declare const sxDev: (src: string, ...args: StyleArg$1[]) => {
|
|
1437
|
+
className: string;
|
|
1438
|
+
style?: {
|
|
1439
|
+
[x: string]: string;
|
|
1440
|
+
};
|
|
1441
|
+
} & Source;
|
|
1442
|
+
/** Solid and Vue: `{ class, style, "data-vx-src" }`, `style` an object. */
|
|
1443
|
+
declare const sxDevClass: (src: string, ...args: StyleArg$1[]) => {
|
|
1444
|
+
class: string;
|
|
1445
|
+
style?: {
|
|
1446
|
+
[x: string]: string;
|
|
1447
|
+
};
|
|
1448
|
+
} & Source;
|
|
1449
|
+
/** Svelte, Astro and vanilla JS: `{ class, style, "data-vx-src" }`, `style` a string. */
|
|
1450
|
+
declare const sxDevString: (src: string, ...args: StyleArg$1[]) => {
|
|
1451
|
+
class: string;
|
|
1452
|
+
style?: string;
|
|
1453
|
+
} & Source;
|
|
1454
|
+
/**
|
|
1455
|
+
* Dev only (PLAN §5.16): a `style=` value the compiler could not write as
|
|
1456
|
+
* an inline style. A compiled style there would set nothing a browser
|
|
1457
|
+
* reads (its keys are merge ids), so it fails where the element is
|
|
1458
|
+
* rendered, naming the fix; any other value passes through.
|
|
1459
|
+
*/
|
|
1460
|
+
declare const styleCheck: <T>(value: T, src: string) => T;
|
|
1461
|
+
/**
|
|
1462
|
+
* A framework's style setter that checks its value at `at` first: what the
|
|
1463
|
+
* plugin points a compiled component's calls at in dev
|
|
1464
|
+
* (vite/attributes.ts). With `key`, only when the call sets that attribute
|
|
1465
|
+
* (Astro's `addAttribute(value, "style")`).
|
|
1466
|
+
*/
|
|
1467
|
+
declare const styleWith: <A extends unknown[], R>(set: (...args: A) => R, at: number, src: string, key?: string) => (...args: A) => R;
|
|
1468
|
+
//#endregion
|
|
1469
|
+
//#region src/runtime/recipe.d.ts
|
|
1470
|
+
/** One table cell: a style, or a style per slot. */
|
|
1471
|
+
type Classes = StyleRecord | Readonly<Record<string, StyleRecord>>;
|
|
1472
|
+
/** A compound: when it holds, its classes, and for a responsive one its pieces' classes and cut. */
|
|
1473
|
+
type CompoundEntry = readonly [when: Readonly<Record<string, readonly string[]>>, classes: Classes, ranges?: Readonly<Record<string, Classes>>, cut?: readonly string[]];
|
|
1474
|
+
interface RecipeTable {
|
|
1475
|
+
readonly k: readonly string[];
|
|
1476
|
+
readonly s?: readonly string[];
|
|
1477
|
+
readonly b: Classes;
|
|
1478
|
+
readonly v: Readonly<Record<string, Readonly<Record<string, Classes>>>>;
|
|
1479
|
+
readonly c: readonly CompoundEntry[];
|
|
1480
|
+
readonly d: Readonly<Record<string, string>>;
|
|
1481
|
+
readonly q?: readonly [conditions: readonly string[], breakpoints: number];
|
|
1482
|
+
readonly r?: Readonly<Record<string, Readonly<Record<string, Readonly<Record<string, Classes>>>>>>;
|
|
1483
|
+
readonly f?: Readonly<Record<string, StyleRecord>>;
|
|
1484
|
+
}
|
|
1485
|
+
/** What `recipe.schema` describes, for docs and Storybook: every variant's values, and the defaults. */
|
|
1486
|
+
interface RecipeSchema {
|
|
1487
|
+
readonly variants: Readonly<Record<string, readonly string[]>>;
|
|
1488
|
+
readonly defaults: Readonly<Record<string, string>>;
|
|
1489
|
+
}
|
|
1490
|
+
/** The resolver as the runtime sees it; `Recipe<D>` in types.ts is its typed face. */
|
|
1491
|
+
interface CompiledRecipe {
|
|
1492
|
+
(props?: Readonly<Record<string, unknown>>): StyleRecord | Readonly<Record<string, StyleRecord>>;
|
|
1493
|
+
readonly variantKeys: readonly string[];
|
|
1494
|
+
splitProps(props: Readonly<Record<string, unknown>>): [Record<string, unknown>, Record<string, unknown>];
|
|
1495
|
+
readonly schema: RecipeSchema;
|
|
1496
|
+
}
|
|
1497
|
+
/**
|
|
1498
|
+
* A call's responsive part: adds the `r` cells of its props and returns how
|
|
1499
|
+
* to add a compound. `values` holds each variant's value without conditions.
|
|
1500
|
+
*/
|
|
1501
|
+
type Responsive = (table: RecipeTable, props: Readonly<Record<string, unknown>>, values: Readonly<Record<string, string>>, cells: Array<Classes | undefined>) => (compound: CompoundEntry) => unknown;
|
|
1502
|
+
/**
|
|
1503
|
+
* Dev only: the atoms of every flattened base a resolver was made with, by
|
|
1504
|
+
* class, which `sx()`'s dev variant reads (runtime/dev.ts). Production
|
|
1505
|
+
* builds drop it with the branch that fills it.
|
|
1506
|
+
*/
|
|
1507
|
+
declare const flatBases: Record<string, StyleRecord>;
|
|
1508
|
+
export declare const __vxRecipe: (t: RecipeTable, x?: Responsive) => CompiledRecipe;
|
|
1509
|
+
/**
|
|
1510
|
+
* Responsive props (PLAN §4.4): each condition a prop sets adds its value's
|
|
1511
|
+
* `r` cell, in rank order, so values stack mobile-first. A compound that has
|
|
1512
|
+
* ranges is evaluated on each piece of the width axis, cut at the conditions
|
|
1513
|
+
* its `cut` variants' props set, with the values in effect there, and adds
|
|
1514
|
+
* its classes under the range condition of each piece where it holds: that
|
|
1515
|
+
* range outranks every condition that holds anywhere in the piece. `ranges`
|
|
1516
|
+
* keys a piece by its bounds: `",md"` below md, `"md,lg"`, `"lg,"` from lg.
|
|
1517
|
+
*/
|
|
1518
|
+
export declare const __vxResponsive: Responsive;
|
|
1519
|
+
//#endregion
|
|
1520
|
+
//#region src/index.d.ts
|
|
1521
|
+
/**
|
|
1522
|
+
* `sx()` with the public types: compiled styles and class strings in, the
|
|
1523
|
+
* attributes of the project's framework out. The runtime's own signature
|
|
1524
|
+
* returns React's shape.
|
|
1525
|
+
*/
|
|
1526
|
+
export declare const sx: Sx;
|
|
1527
|
+
//#endregion
|
|
1528
|
+
export { type CompoundSlot, type CompoundVariant, type ConditionalObject, type ConditionalValue, type Conditions, type CssOptions, type CssProperties, type CssResult, type DynamicStyle, type Marker, type MarkerKey, type MarkerState, type NumberKind, type Palette, type Recipe, type RecipeDefinition, type RecipeProps, type RecipeResult, type RecipeShape, type Register, type RegisteredFramework, type ResponsiveValue, type ScaleName, type ScaleValue, type Strict, type Style, type StyleArg, type StyleAttributes, type StyleFunction, type StyleInput, type StyleInputValue, type StyleObject, type SxAttributes, type SxShapes, type TextStyles, type Token, type Tokens, type Unscaled, type Utilities, type VariantValue, type Variants, classList as __vxClassList, classWith as __vxClassWith, devToken as __vxDevToken, devValue as __vxDevValue, effectWith as __vxEffectWith, flatBases as __vxFlatBases, propsWith as __vxPropsWith, styleCheck as __vxStyleCheck, styleWith as __vxStyleWith, styled as __vxStyled, sxClass as __vxSxClass, sxDev as __vxSxDev, sxDevClass as __vxSxDevClass, sxDevString as __vxSxDevString, sxString as __vxSxString };
|