@unocss/preset-mini 66.5.10 → 66.5.11

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.
Files changed (44) hide show
  1. package/dist/chunk-gol_9zmq.mjs +36 -0
  2. package/dist/colors-CdGFctaC.d.mts +1377 -0
  3. package/dist/colors-Cxq9P2g9.mjs +362 -0
  4. package/dist/colors.d.mts +2 -354
  5. package/dist/colors.mjs +2 -360
  6. package/dist/index-RNt7vgvR.d.mts +69 -0
  7. package/dist/index.d.mts +5 -76
  8. package/dist/index.mjs +67 -70
  9. package/dist/rules-CuP-xMI2.mjs +1683 -0
  10. package/dist/rules.d.mts +70 -48
  11. package/dist/rules.mjs +4 -5
  12. package/dist/theme-B_nKnyti.d.mts +1084 -0
  13. package/dist/theme-DeYMqZAV.mjs +347 -0
  14. package/dist/theme.d.mts +3 -338
  15. package/dist/theme.mjs +5 -6
  16. package/dist/utils-BIIzJZek.d.mts +234 -0
  17. package/dist/utils-DLpYZ57Q.mjs +638 -0
  18. package/dist/utils.d.mts +2 -77
  19. package/dist/utils.mjs +5 -3
  20. package/dist/variants.d.mts +35 -24
  21. package/dist/variants.mjs +661 -4
  22. package/package.json +7 -8
  23. package/colors.d.ts +0 -1
  24. package/dist/colors.d.ts +0 -354
  25. package/dist/index.d.ts +0 -76
  26. package/dist/rules.d.ts +0 -130
  27. package/dist/shared/preset-mini.BSnAbT9I.d.mts +0 -748
  28. package/dist/shared/preset-mini.B_2UJsV2.mjs +0 -693
  29. package/dist/shared/preset-mini.BjJC-NnU.d.mts +0 -79
  30. package/dist/shared/preset-mini.BjJC-NnU.d.ts +0 -79
  31. package/dist/shared/preset-mini.CRliz1QB.d.ts +0 -76
  32. package/dist/shared/preset-mini.CVEK1uAa.mjs +0 -355
  33. package/dist/shared/preset-mini.CoOfBKs_.d.ts +0 -748
  34. package/dist/shared/preset-mini.DBTjVFxS.mjs +0 -580
  35. package/dist/shared/preset-mini.QLusboLD.mjs +0 -1064
  36. package/dist/shared/preset-mini.kmtdc_h1.mjs +0 -324
  37. package/dist/shared/preset-mini.oF7XTPi1.d.mts +0 -76
  38. package/dist/theme.d.ts +0 -338
  39. package/dist/utils.d.ts +0 -77
  40. package/dist/variants.d.ts +0 -52
  41. package/rules.d.ts +0 -1
  42. package/theme.d.ts +0 -1
  43. package/utils.d.ts +0 -1
  44. package/variants.d.ts +0 -1
@@ -1,1064 +0,0 @@
1
- import { g as globalKeywords, a as h, t as isCSSMathFn, l as colorResolver, d as directionMap, n as hasParseableColor, c as cornerMap, k as parseColor, u as isSize, q as makeGlobalStaticRules, i as insetMap, r as resolveBreakpoints, j as directionSize, s as splitShorthand, m as colorableShadows } from './preset-mini.DBTjVFxS.mjs';
2
- import { colorToString, colorOpacityToString } from '@unocss/rule-utils';
3
- import { g as contains, p as pointerEvents, e as appearances, d as displays, x as transforms, f as cursors, u as userSelects, h as resizes, l as textOverflows, w as whitespaces, k as breaks, t as textWraps, m as textTransforms, n as fontStyles, o as fontSmoothings, c as boxShadows, a as rings, i as contentVisibility, j as contents, q as fieldSizing } from './preset-mini.CVEK1uAa.mjs';
4
- import { toArray } from '@unocss/core';
5
-
6
- const verticalAlignAlias = {
7
- "mid": "middle",
8
- "base": "baseline",
9
- "btm": "bottom",
10
- "baseline": "baseline",
11
- "top": "top",
12
- "start": "top",
13
- "middle": "middle",
14
- "bottom": "bottom",
15
- "end": "bottom",
16
- "text-top": "text-top",
17
- "text-bottom": "text-bottom",
18
- "sub": "sub",
19
- "super": "super",
20
- ...Object.fromEntries(globalKeywords.map((x) => [x, x]))
21
- };
22
- const verticalAligns = [
23
- [
24
- /^(?:vertical|align|v)-(.+)$/,
25
- ([, v]) => ({ "vertical-align": verticalAlignAlias[v] ?? h.bracket.cssvar.numberWithUnit(v) }),
26
- {
27
- autocomplete: [
28
- `(vertical|align|v)-(${Object.keys(verticalAlignAlias).join("|")})`,
29
- "(vertical|align|v)-<percentage>"
30
- ]
31
- }
32
- ]
33
- ];
34
- const textAlignValues = ["center", "left", "right", "justify", "start", "end"];
35
- const textAligns = [
36
- ...textAlignValues.map((v) => [`text-${v}`, { "text-align": v }]),
37
- ...[
38
- ...globalKeywords,
39
- ...textAlignValues
40
- ].map((v) => [`text-align-${v}`, { "text-align": v }])
41
- ];
42
-
43
- const outline = [
44
- // size
45
- [/^outline-(?:width-|size-)?(.+)$/, handleWidth$2, { autocomplete: "outline-(width|size)-<num>" }],
46
- // color
47
- [/^outline-(?:color-)?(.+)$/, handleColorOrWidth$2, { autocomplete: "outline-$colors" }],
48
- // offset
49
- [/^outline-offset-(.+)$/, ([, d], { theme }) => ({ "outline-offset": theme.lineWidth?.[d] ?? h.bracket.cssvar.global.px(d) }), { autocomplete: "outline-(offset)-<num>" }],
50
- // style
51
- ["outline", { "outline-style": "solid" }],
52
- ...["auto", "dashed", "dotted", "double", "hidden", "solid", "groove", "ridge", "inset", "outset", ...globalKeywords].map((v) => [`outline-${v}`, { "outline-style": v }]),
53
- ["outline-none", { "outline": "2px solid transparent", "outline-offset": "2px" }]
54
- ];
55
- function handleWidth$2([, b], { theme }) {
56
- return { "outline-width": theme.lineWidth?.[b] ?? h.bracket.cssvar.global.px(b) };
57
- }
58
- function handleColorOrWidth$2(match, ctx) {
59
- if (isCSSMathFn(h.bracket(match[1])))
60
- return handleWidth$2(match, ctx);
61
- return colorResolver("outline-color", "outline-color", "borderColor")(match, ctx);
62
- }
63
- const appearance = [
64
- ["appearance-auto", { "-webkit-appearance": "auto", "appearance": "auto" }],
65
- ["appearance-none", { "-webkit-appearance": "none", "appearance": "none" }]
66
- ];
67
- function willChangeProperty(prop) {
68
- return h.properties.auto.global(prop) ?? {
69
- contents: "contents",
70
- scroll: "scroll-position"
71
- }[prop];
72
- }
73
- const willChange = [
74
- [/^will-change-(.+)/, ([, p]) => ({ "will-change": willChangeProperty(p) })]
75
- ];
76
-
77
- const borderStyles = ["solid", "dashed", "dotted", "double", "hidden", "none", "groove", "ridge", "inset", "outset", ...globalKeywords];
78
- const borders = [
79
- // compound
80
- [/^(?:border|b)()(?:-(.+))?$/, handlerBorderSize, { autocomplete: "(border|b)-<directions>" }],
81
- [/^(?:border|b)-([xy])(?:-(.+))?$/, handlerBorderSize],
82
- [/^(?:border|b)-([rltbse])(?:-(.+))?$/, handlerBorderSize],
83
- [/^(?:border|b)-(block|inline)(?:-(.+))?$/, handlerBorderSize],
84
- [/^(?:border|b)-([bi][se])(?:-(.+))?$/, handlerBorderSize],
85
- // size
86
- [/^(?:border|b)-()(?:width|size)-(.+)$/, handlerBorderSize, { autocomplete: ["(border|b)-<num>", "(border|b)-<directions>-<num>"] }],
87
- [/^(?:border|b)-([xy])-(?:width|size)-(.+)$/, handlerBorderSize],
88
- [/^(?:border|b)-([rltbse])-(?:width|size)-(.+)$/, handlerBorderSize],
89
- [/^(?:border|b)-(block|inline)-(?:width|size)-(.+)$/, handlerBorderSize],
90
- [/^(?:border|b)-([bi][se])-(?:width|size)-(.+)$/, handlerBorderSize],
91
- // colors
92
- [/^(?:border|b)-()(?:color-)?(.+)$/, handlerBorderColorOrSize, { autocomplete: ["(border|b)-$colors", "(border|b)-<directions>-$colors"] }],
93
- [/^(?:border|b)-([xy])-(?:color-)?(.+)$/, handlerBorderColorOrSize],
94
- [/^(?:border|b)-([rltbse])-(?:color-)?(.+)$/, handlerBorderColorOrSize],
95
- [/^(?:border|b)-(block|inline)-(?:color-)?(.+)$/, handlerBorderColorOrSize],
96
- [/^(?:border|b)-([bi][se])-(?:color-)?(.+)$/, handlerBorderColorOrSize],
97
- // opacity
98
- [/^(?:border|b)-()op(?:acity)?-?(.+)$/, handlerBorderOpacity, { autocomplete: "(border|b)-(op|opacity)-<percent>" }],
99
- [/^(?:border|b)-([xy])-op(?:acity)?-?(.+)$/, handlerBorderOpacity],
100
- [/^(?:border|b)-([rltbse])-op(?:acity)?-?(.+)$/, handlerBorderOpacity],
101
- [/^(?:border|b)-(block|inline)-op(?:acity)?-?(.+)$/, handlerBorderOpacity],
102
- [/^(?:border|b)-([bi][se])-op(?:acity)?-?(.+)$/, handlerBorderOpacity],
103
- // radius
104
- [/^(?:border-|b-)?(?:rounded|rd)()(?:-(.+))?$/, handlerRounded, { autocomplete: ["(border|b)-(rounded|rd)", "(border|b)-(rounded|rd)-$borderRadius", "(rounded|rd)", "(rounded|rd)-$borderRadius"] }],
105
- [/^(?:border-|b-)?(?:rounded|rd)-([rltbse])(?:-(.+))?$/, handlerRounded],
106
- [/^(?:border-|b-)?(?:rounded|rd)-([rltb]{2})(?:-(.+))?$/, handlerRounded],
107
- [/^(?:border-|b-)?(?:rounded|rd)-([bise][se])(?:-(.+))?$/, handlerRounded],
108
- [/^(?:border-|b-)?(?:rounded|rd)-([bi][se]-[bi][se])(?:-(.+))?$/, handlerRounded],
109
- // style
110
- [/^(?:border|b)-(?:style-)?()(.+)$/, handlerBorderStyle, { autocomplete: ["(border|b)-style", `(border|b)-(${borderStyles.join("|")})`, "(border|b)-<directions>-style", `(border|b)-<directions>-(${borderStyles.join("|")})`, `(border|b)-<directions>-style-(${borderStyles.join("|")})`, `(border|b)-style-(${borderStyles.join("|")})`] }],
111
- [/^(?:border|b)-([xy])-(?:style-)?(.+)$/, handlerBorderStyle],
112
- [/^(?:border|b)-([rltbse])-(?:style-)?(.+)$/, handlerBorderStyle],
113
- [/^(?:border|b)-(block|inline)-(?:style-)?(.+)$/, handlerBorderStyle],
114
- [/^(?:border|b)-([bi][se])-(?:style-)?(.+)$/, handlerBorderStyle]
115
- ];
116
- function transformBorderColor(color, alpha, direction) {
117
- if (alpha != null) {
118
- return {
119
- [`border${direction}-color`]: colorToString(color, alpha)
120
- };
121
- }
122
- if (direction === "") {
123
- const object = {};
124
- const opacityVar = `--un-border-opacity`;
125
- const result = colorToString(color, `var(${opacityVar})`);
126
- if (result.includes(opacityVar))
127
- object[opacityVar] = typeof color === "string" ? 1 : colorOpacityToString(color);
128
- object["border-color"] = result;
129
- return object;
130
- } else {
131
- const object = {};
132
- const opacityVar = "--un-border-opacity";
133
- const opacityDirectionVar = `--un-border${direction}-opacity`;
134
- const result = colorToString(color, `var(${opacityDirectionVar})`);
135
- if (result.includes(opacityDirectionVar)) {
136
- object[opacityVar] = typeof color === "string" ? 1 : colorOpacityToString(color);
137
- object[opacityDirectionVar] = `var(${opacityVar})`;
138
- }
139
- object[`border${direction}-color`] = result;
140
- return object;
141
- }
142
- }
143
- function borderColorResolver(direction) {
144
- return ([, body], theme) => {
145
- const data = parseColor(body, theme, "borderColor");
146
- if (!data)
147
- return;
148
- const { alpha, color, cssColor } = data;
149
- if (cssColor)
150
- return transformBorderColor(cssColor, alpha, direction);
151
- else if (color)
152
- return transformBorderColor(color, alpha, direction);
153
- };
154
- }
155
- function handlerBorderSize([, a = "", b], { theme }) {
156
- const v = theme.lineWidth?.[b || "DEFAULT"] ?? h.bracket.cssvar.global.px(b || "1");
157
- if (a in directionMap && v != null)
158
- return directionMap[a].map((i) => [`border${i}-width`, v]);
159
- }
160
- function handlerBorderColorOrSize([, a = "", b], ctx) {
161
- if (a in directionMap) {
162
- if (isCSSMathFn(h.bracket(b)))
163
- return handlerBorderSize(["", a, b], ctx);
164
- if (hasParseableColor(b, ctx.theme, "borderColor")) {
165
- return Object.assign(
166
- {},
167
- ...directionMap[a].map((i) => borderColorResolver(i)(["", b], ctx.theme))
168
- );
169
- }
170
- }
171
- }
172
- function handlerBorderOpacity([, a = "", opacity]) {
173
- const v = h.bracket.percent.cssvar(opacity);
174
- if (a in directionMap && v != null)
175
- return directionMap[a].map((i) => [`--un-border${i}-opacity`, v]);
176
- }
177
- function handlerRounded([, a = "", s], { theme }) {
178
- const v = theme.borderRadius?.[s || "DEFAULT"] || h.bracket.cssvar.global.fraction.rem(s || "1");
179
- if (a in cornerMap && v != null)
180
- return cornerMap[a].map((i) => [`border${i}-radius`, v]);
181
- }
182
- function handlerBorderStyle([, a = "", s]) {
183
- if (borderStyles.includes(s) && a in directionMap)
184
- return directionMap[a].map((i) => [`border${i}-style`, s]);
185
- }
186
-
187
- const opacity = [
188
- [/^op(?:acity)?-?(.+)$/, ([, d]) => ({ opacity: h.bracket.percent.cssvar(d) })]
189
- ];
190
- const bgUrlRE = /^\[url\(.+\)\]$/;
191
- const bgLengthRE = /^\[(?:length|size):.+\]$/;
192
- const bgPositionRE = /^\[position:.+\]$/;
193
- const bgGradientRE = /^\[(?:linear|conic|radial)-gradient\(.+\)\]$/;
194
- const bgImageRE = /^\[image:.+\]$/;
195
- const bgColors = [
196
- [/^bg-(.+)$/, (...args) => {
197
- const d = args[0][1];
198
- if (bgUrlRE.test(d))
199
- return { "--un-url": h.bracket(d), "background-image": "var(--un-url)" };
200
- if (bgLengthRE.test(d) && h.bracketOfLength(d) != null)
201
- return { "background-size": h.bracketOfLength(d).split(" ").map((e) => h.fraction.auto.px.cssvar(e) ?? e).join(" ") };
202
- if ((isSize(d) || bgPositionRE.test(d)) && h.bracketOfPosition(d) != null)
203
- return { "background-position": h.bracketOfPosition(d).split(" ").map((e) => h.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
204
- if (bgGradientRE.test(d) || bgImageRE.test(d)) {
205
- const s = h.bracket(d);
206
- if (s) {
207
- const url = s.startsWith("http") ? `url(${s})` : h.cssvar(s);
208
- return { "background-image": url ?? s };
209
- }
210
- }
211
- return colorResolver("background-color", "bg", "backgroundColor")(...args);
212
- }, { autocomplete: "bg-$colors" }],
213
- [/^bg-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-bg-opacity": h.bracket.percent.cssvar(opacity2) }), { autocomplete: "bg-(op|opacity)-<percent>" }]
214
- ];
215
- const colorScheme = [
216
- [/^color-scheme-(\w+)$/, ([, v]) => ({ "color-scheme": v })]
217
- ];
218
-
219
- const containerParent = [
220
- [/^@container(?:\/(\w+))?(?:-(normal|inline-size|size))?$/, ([, l, v]) => {
221
- return {
222
- "container-type": v ?? "inline-size",
223
- "container-name": l
224
- };
225
- }]
226
- ];
227
-
228
- const decorationStyles = ["solid", "double", "dotted", "dashed", "wavy", ...globalKeywords];
229
- const textDecorations = [
230
- [/^(?:decoration-)?(underline|overline|line-through)$/, ([, s]) => ({ "text-decoration-line": s }), { autocomplete: "decoration-(underline|overline|line-through)" }],
231
- // size
232
- [/^(?:underline|decoration)-(?:size-)?(.+)$/, handleWidth$1, { autocomplete: "(underline|decoration)-<num>" }],
233
- [/^(?:underline|decoration)-(auto|from-font)$/, ([, s]) => ({ "text-decoration-thickness": s }), { autocomplete: "(underline|decoration)-(auto|from-font)" }],
234
- // colors
235
- [/^(?:underline|decoration)-(.+)$/, handleColorOrWidth$1, { autocomplete: "(underline|decoration)-$colors" }],
236
- [/^(?:underline|decoration)-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-line-opacity": h.bracket.percent.cssvar(opacity) }), { autocomplete: "(underline|decoration)-(op|opacity)-<percent>" }],
237
- // offset
238
- [/^(?:underline|decoration)-offset-(.+)$/, ([, s], { theme }) => ({ "text-underline-offset": theme.lineWidth?.[s] ?? h.auto.bracket.cssvar.global.px(s) }), { autocomplete: "(underline|decoration)-(offset)-<num>" }],
239
- // style
240
- ...decorationStyles.map((v) => [`underline-${v}`, { "text-decoration-style": v }]),
241
- ...decorationStyles.map((v) => [`decoration-${v}`, { "text-decoration-style": v }]),
242
- ["no-underline", { "text-decoration": "none" }],
243
- ["decoration-none", { "text-decoration": "none" }]
244
- ];
245
- function handleWidth$1([, b], { theme }) {
246
- return { "text-decoration-thickness": theme.lineWidth?.[b] ?? h.bracket.cssvar.global.px(b) };
247
- }
248
- function handleColorOrWidth$1(match, ctx) {
249
- if (isCSSMathFn(h.bracket(match[1])))
250
- return handleWidth$1(match, ctx);
251
- const result = colorResolver("text-decoration-color", "line", "borderColor")(match, ctx);
252
- if (result) {
253
- return {
254
- "-webkit-text-decoration-color": result["text-decoration-color"],
255
- ...result
256
- };
257
- }
258
- }
259
-
260
- const flex = [
261
- // display
262
- ["flex", { display: "flex" }],
263
- ["inline-flex", { display: "inline-flex" }],
264
- ["flex-inline", { display: "inline-flex" }],
265
- // flex
266
- [/^flex-(.*)$/, ([, d]) => ({ flex: h.bracket(d) != null ? h.bracket(d).split(" ").map((e) => h.cssvar.fraction(e) ?? e).join(" ") : h.cssvar.fraction(d) })],
267
- ["flex-1", { flex: "1 1 0%" }],
268
- ["flex-auto", { flex: "1 1 auto" }],
269
- ["flex-initial", { flex: "0 1 auto" }],
270
- ["flex-none", { flex: "none" }],
271
- // shrink/grow/basis
272
- [/^(?:flex-)?shrink(?:-(.*))?$/, ([, d = ""]) => ({ "flex-shrink": h.bracket.cssvar.number(d) ?? 1 }), { autocomplete: ["flex-shrink-<num>", "shrink-<num>"] }],
273
- [/^(?:flex-)?grow(?:-(.*))?$/, ([, d = ""]) => ({ "flex-grow": h.bracket.cssvar.number(d) ?? 1 }), { autocomplete: ["flex-grow-<num>", "grow-<num>"] }],
274
- [/^(?:flex-)?basis-(.+)$/, ([, d], { theme }) => ({ "flex-basis": theme.spacing?.[d] ?? h.bracket.cssvar.auto.fraction.rem(d) }), { autocomplete: ["flex-basis-$spacing", "basis-$spacing"] }],
275
- // directions
276
- ["flex-row", { "flex-direction": "row" }],
277
- ["flex-row-reverse", { "flex-direction": "row-reverse" }],
278
- ["flex-col", { "flex-direction": "column" }],
279
- ["flex-col-reverse", { "flex-direction": "column-reverse" }],
280
- // wraps
281
- ["flex-wrap", { "flex-wrap": "wrap" }],
282
- ["flex-wrap-reverse", { "flex-wrap": "wrap-reverse" }],
283
- ["flex-nowrap", { "flex-wrap": "nowrap" }]
284
- ];
285
-
286
- const directions = {
287
- "": "",
288
- "x": "column-",
289
- "y": "row-",
290
- "col": "column-",
291
- "row": "row-"
292
- };
293
- function handleGap([, d = "", s], { theme }) {
294
- const v = theme.spacing?.[s] ?? h.bracket.cssvar.global.rem(s);
295
- if (v != null) {
296
- return {
297
- [`${directions[d]}gap`]: v
298
- };
299
- }
300
- }
301
- const gaps = [
302
- [/^(?:flex-|grid-)?gap-?()(.+)$/, handleGap, { autocomplete: ["gap-$spacing", "gap-<num>"] }],
303
- [/^(?:flex-|grid-)?gap-([xy])-?(.+)$/, handleGap, { autocomplete: ["gap-(x|y)-$spacing", "gap-(x|y)-<num>"] }],
304
- [/^(?:flex-|grid-)?gap-(col|row)-?(.+)$/, handleGap, { autocomplete: ["gap-(col|row)-$spacing", "gap-(col|row)-<num>"] }]
305
- ];
306
-
307
- function rowCol(s) {
308
- return s.replace("col", "column");
309
- }
310
- function rowColTheme(s) {
311
- return s[0] === "r" ? "Row" : "Column";
312
- }
313
- function autoDirection(c, theme, prop) {
314
- const v = theme[`gridAuto${rowColTheme(c)}`]?.[prop];
315
- if (v != null)
316
- return v;
317
- switch (prop) {
318
- case "min":
319
- return "min-content";
320
- case "max":
321
- return "max-content";
322
- case "fr":
323
- return "minmax(0,1fr)";
324
- }
325
- return h.bracket.cssvar.auto.rem(prop);
326
- }
327
- const grids = [
328
- // displays
329
- ["grid", { display: "grid" }],
330
- ["inline-grid", { display: "inline-grid" }],
331
- // global
332
- [/^(?:grid-)?(row|col)-(.+)$/, ([, c, v], { theme }) => ({
333
- [`grid-${rowCol(c)}`]: theme[`grid${rowColTheme(c)}`]?.[v] ?? h.bracket.cssvar.auto(v)
334
- })],
335
- // span
336
- [/^(?:grid-)?(row|col)-span-(.+)$/, ([, c, s]) => {
337
- if (s === "full")
338
- return { [`grid-${rowCol(c)}`]: "1/-1" };
339
- const v = h.bracket.number(s);
340
- if (v != null)
341
- return { [`grid-${rowCol(c)}`]: `span ${v}/span ${v}` };
342
- }, { autocomplete: "(grid-row|grid-col|row|col)-span-<num>" }],
343
- // starts & ends
344
- [/^(?:grid-)?(row|col)-start-(.+)$/, ([, c, v]) => ({ [`grid-${rowCol(c)}-start`]: h.bracket.cssvar(v) ?? v })],
345
- [/^(?:grid-)?(row|col)-end-(.+)$/, ([, c, v]) => ({ [`grid-${rowCol(c)}-end`]: h.bracket.cssvar(v) ?? v }), { autocomplete: "(grid-row|grid-col|row|col)-(start|end)-<num>" }],
346
- // auto flows
347
- [/^(?:grid-)?auto-(rows|cols)-(.+)$/, ([, c, v], { theme }) => ({ [`grid-auto-${rowCol(c)}`]: autoDirection(c, theme, v) }), { autocomplete: "(grid-auto|auto)-(rows|cols)-<num>" }],
348
- // grid-auto-flow, auto-flow: uno
349
- // grid-flow: wind
350
- [/^(?:grid-auto-flow|auto-flow|grid-flow)-(.+)$/, ([, v]) => ({ "grid-auto-flow": h.bracket.cssvar(v) })],
351
- [/^(?:grid-auto-flow|auto-flow|grid-flow)-(row|col|dense|row-dense|col-dense)$/, ([, v]) => ({ "grid-auto-flow": rowCol(v).replace("-", " ") }), { autocomplete: ["(grid-auto-flow|auto-flow|grid-flow)-(row|col|dense|row-dense|col-dense)"] }],
352
- // templates
353
- [/^(?:grid-)?(rows|cols)-(.+)$/, ([, c, v], { theme }) => ({
354
- [`grid-template-${rowCol(c)}`]: theme[`gridTemplate${rowColTheme(c)}`]?.[v] ?? h.bracket.cssvar(v)
355
- })],
356
- [/^(?:grid-)?(rows|cols)-minmax-([\w.-]+)$/, ([, c, d]) => ({ [`grid-template-${rowCol(c)}`]: `repeat(auto-fill,minmax(${d},1fr))` })],
357
- [/^(?:grid-)?(rows|cols)-(\d+)$/, ([, c, d]) => ({ [`grid-template-${rowCol(c)}`]: `repeat(${d},minmax(0,1fr))` }), { autocomplete: "(grid-rows|grid-cols|rows|cols)-<num>" }],
358
- // areas
359
- [/^grid-area(s)?-(.+)$/, ([, s, v]) => {
360
- if (s != null)
361
- return { "grid-template-areas": h.cssvar(v) ?? v.split("-").map((s2) => `"${h.bracket(s2)}"`).join(" ") };
362
- return { "grid-area": h.bracket.cssvar(v) };
363
- }],
364
- // template none
365
- ["grid-rows-none", { "grid-template-rows": "none" }],
366
- ["grid-cols-none", { "grid-template-columns": "none" }],
367
- // template subgrid
368
- ["grid-rows-subgrid", { "grid-template-rows": "subgrid" }],
369
- ["grid-cols-subgrid", { "grid-template-columns": "subgrid" }]
370
- ];
371
-
372
- const overflowValues = [
373
- "auto",
374
- "hidden",
375
- "clip",
376
- "visible",
377
- "scroll",
378
- "overlay",
379
- ...globalKeywords
380
- ];
381
- const overflows = [
382
- [/^(?:overflow|of)-(.+)$/, ([, v]) => overflowValues.includes(v) ? { overflow: v } : void 0, { autocomplete: [`(overflow|of)-(${overflowValues.join("|")})`, `(overflow|of)-(x|y)-(${overflowValues.join("|")})`] }],
383
- [/^(?:overflow|of)-([xy])-(.+)$/, ([, d, v]) => overflowValues.includes(v) ? { [`overflow-${d}`]: v } : void 0]
384
- ];
385
-
386
- const positions = [
387
- [/^(?:position-|pos-)?(relative|absolute|fixed|sticky)$/, ([, v]) => ({ position: v }), {
388
- autocomplete: [
389
- "(position|pos)-<position>",
390
- "(position|pos)-<globalKeyword>",
391
- "<position>"
392
- ]
393
- }],
394
- [/^(?:position-|pos-)([-\w]+)$/, ([, v]) => globalKeywords.includes(v) ? { position: v } : void 0],
395
- [/^(?:position-|pos-)?(static)$/, ([, v]) => ({ position: v })]
396
- ];
397
- const justifies = [
398
- // contents
399
- ["justify-start", { "justify-content": "flex-start" }],
400
- ["justify-end", { "justify-content": "flex-end" }],
401
- ["justify-center", { "justify-content": "center" }],
402
- ["justify-between", { "justify-content": "space-between" }],
403
- ["justify-around", { "justify-content": "space-around" }],
404
- ["justify-evenly", { "justify-content": "space-evenly" }],
405
- ["justify-stretch", { "justify-content": "stretch" }],
406
- ["justify-left", { "justify-content": "left" }],
407
- ["justify-right", { "justify-content": "right" }],
408
- ["justify-center-safe", { "justify-content": "safe center" }],
409
- ["justify-end-safe", { "justify-content": "safe flex-end" }],
410
- ["justify-normal", { "justify-content": "normal" }],
411
- ...makeGlobalStaticRules("justify", "justify-content"),
412
- // items
413
- ["justify-items-start", { "justify-items": "start" }],
414
- ["justify-items-end", { "justify-items": "end" }],
415
- ["justify-items-center", { "justify-items": "center" }],
416
- ["justify-items-stretch", { "justify-items": "stretch" }],
417
- ["justify-items-center-safe", { "justify-items": "safe center" }],
418
- ["justify-items-end-safe", { "justify-items": "safe flex-end" }],
419
- ...makeGlobalStaticRules("justify-items"),
420
- // selfs
421
- ["justify-self-auto", { "justify-self": "auto" }],
422
- ["justify-self-start", { "justify-self": "start" }],
423
- ["justify-self-end", { "justify-self": "end" }],
424
- ["justify-self-center", { "justify-self": "center" }],
425
- ["justify-self-stretch", { "justify-self": "stretch" }],
426
- ["justify-self-baseline", { "justify-self": "baseline" }],
427
- ["justify-self-center-safe", { "justify-self": "safe center" }],
428
- ["justify-self-end-safe", { "justify-self": "safe flex-end" }],
429
- ...makeGlobalStaticRules("justify-self")
430
- ];
431
- const orders = [
432
- [/^order-(.+)$/, ([, v]) => ({ order: h.bracket.cssvar.number(v) })],
433
- ["order-first", { order: "-9999" }],
434
- ["order-last", { order: "9999" }],
435
- ["order-none", { order: "0" }]
436
- ];
437
- const alignments = [
438
- // contents
439
- ["content-center", { "align-content": "center" }],
440
- ["content-start", { "align-content": "flex-start" }],
441
- ["content-end", { "align-content": "flex-end" }],
442
- ["content-between", { "align-content": "space-between" }],
443
- ["content-around", { "align-content": "space-around" }],
444
- ["content-evenly", { "align-content": "space-evenly" }],
445
- ["content-baseline", { "align-content": "baseline" }],
446
- ["content-center-safe", { "align-content": "safe center" }],
447
- ["content-end-safe", { "align-content": "safe flex-end" }],
448
- ["content-stretch", { "align-content": "stretch" }],
449
- ["content-normal", { "align-content": "normal" }],
450
- ...makeGlobalStaticRules("content", "align-content"),
451
- // items
452
- ["items-start", { "align-items": "flex-start" }],
453
- ["items-end", { "align-items": "flex-end" }],
454
- ["items-center", { "align-items": "center" }],
455
- ["items-baseline", { "align-items": "baseline" }],
456
- ["items-stretch", { "align-items": "stretch" }],
457
- ["items-baseline-last", { "align-items": "last baseline" }],
458
- ["items-center-safe", { "align-items": "safe center" }],
459
- ["items-end-safe", { "align-items": "safe flex-end" }],
460
- ...makeGlobalStaticRules("items", "align-items"),
461
- // selfs
462
- ["self-auto", { "align-self": "auto" }],
463
- ["self-start", { "align-self": "flex-start" }],
464
- ["self-end", { "align-self": "flex-end" }],
465
- ["self-center", { "align-self": "center" }],
466
- ["self-stretch", { "align-self": "stretch" }],
467
- ["self-baseline", { "align-self": "baseline" }],
468
- ["self-baseline-last", { "align-self": "last baseline" }],
469
- ["self-center-safe", { "align-self": "safe center" }],
470
- ["self-end-safe", { "align-self": "safe flex-end" }],
471
- ...makeGlobalStaticRules("self", "align-self")
472
- ];
473
- const placements = [
474
- // contents
475
- ["place-content-center", { "place-content": "center" }],
476
- ["place-content-start", { "place-content": "start" }],
477
- ["place-content-end", { "place-content": "end" }],
478
- ["place-content-between", { "place-content": "space-between" }],
479
- ["place-content-around", { "place-content": "space-around" }],
480
- ["place-content-evenly", { "place-content": "space-evenly" }],
481
- ["place-content-stretch", { "place-content": "stretch" }],
482
- ["place-content-baseline", { "place-content": "baseline" }],
483
- ["place-content-center-safe", { "place-content": "safe center" }],
484
- ["place-content-end-safe", { "place-content": "safe flex-end" }],
485
- ...makeGlobalStaticRules("place-content"),
486
- // items
487
- ["place-items-start", { "place-items": "start" }],
488
- ["place-items-end", { "place-items": "end" }],
489
- ["place-items-center", { "place-items": "center" }],
490
- ["place-items-stretch", { "place-items": "stretch" }],
491
- ["place-items-baseline", { "place-items": "baseline" }],
492
- ["place-items-center-safe", { "place-items": "safe center" }],
493
- ["place-items-end-safe", { "place-items": "safe flex-end" }],
494
- ...makeGlobalStaticRules("place-items"),
495
- // selfs
496
- ["place-self-auto", { "place-self": "auto" }],
497
- ["place-self-start", { "place-self": "start" }],
498
- ["place-self-end", { "place-self": "end" }],
499
- ["place-self-center", { "place-self": "center" }],
500
- ["place-self-stretch", { "place-self": "stretch" }],
501
- ["place-self-center-safe", { "place-self": "safe center" }],
502
- ["place-self-end-safe", { "place-self": "safe flex-end" }],
503
- ...makeGlobalStaticRules("place-self")
504
- ];
505
- const flexGridJustifiesAlignments = [...justifies, ...alignments, ...placements].flatMap(([k, v]) => [
506
- [`flex-${k}`, v],
507
- [`grid-${k}`, v]
508
- ]);
509
- function handleInsetValue(v, { theme }) {
510
- return theme.spacing?.[v] ?? h.bracket.cssvar.global.auto.fraction.rem(v);
511
- }
512
- function handleInsetValues([, d, v], ctx) {
513
- const r = handleInsetValue(v, ctx);
514
- if (r != null && d in insetMap)
515
- return insetMap[d].map((i) => [i.slice(1), r]);
516
- }
517
- const insets = [
518
- [
519
- /^(?:position-|pos-)?inset-(.+)$/,
520
- ([, v], ctx) => ({ inset: handleInsetValue(v, ctx) }),
521
- {
522
- autocomplete: [
523
- "(position|pos)-inset-<directions>-$spacing",
524
- "(position|pos)-inset-(block|inline)-$spacing",
525
- "(position|pos)-inset-(bs|be|is|ie)-$spacing",
526
- "(position|pos)-(top|left|right|bottom)-$spacing"
527
- ]
528
- }
529
- ],
530
- [/^(?:position-|pos-)?(start|end)-(.+)$/, handleInsetValues],
531
- [/^(?:position-|pos-)?inset-([xy])-(.+)$/, handleInsetValues],
532
- [/^(?:position-|pos-)?inset-([rltbse])-(.+)$/, handleInsetValues],
533
- [/^(?:position-|pos-)?inset-(block|inline)-(.+)$/, handleInsetValues],
534
- [/^(?:position-|pos-)?inset-([bi][se])-(.+)$/, handleInsetValues],
535
- [/^(?:position-|pos-)?(top|left|right|bottom)-(.+)$/, ([, d, v], ctx) => ({ [d]: handleInsetValue(v, ctx) })]
536
- ];
537
- const floats = [
538
- // floats
539
- ["float-left", { float: "left" }],
540
- ["float-right", { float: "right" }],
541
- ["float-start", { float: "inline-start" }],
542
- ["float-end", { float: "inline-end" }],
543
- ["float-none", { float: "none" }],
544
- ...makeGlobalStaticRules("float"),
545
- // clears
546
- ["clear-left", { clear: "left" }],
547
- ["clear-right", { clear: "right" }],
548
- ["clear-both", { clear: "both" }],
549
- ["clear-start", { clear: "inline-start" }],
550
- ["clear-end", { clear: "inline-end" }],
551
- ["clear-none", { clear: "none" }],
552
- ...makeGlobalStaticRules("clear")
553
- ];
554
- const zIndexes = [
555
- [/^(?:position-|pos-)?z([\d.]+)$/, ([, v]) => ({ "z-index": h.number(v) })],
556
- [/^(?:position-|pos-)?z-(.+)$/, ([, v], { theme }) => ({ "z-index": theme.zIndex?.[v] ?? h.bracket.cssvar.global.auto.number(v) }), { autocomplete: "z-<num>" }]
557
- ];
558
- const boxSizing = [
559
- ["box-border", { "box-sizing": "border-box" }],
560
- ["box-content", { "box-sizing": "content-box" }],
561
- ...makeGlobalStaticRules("box", "box-sizing")
562
- ];
563
-
564
- const questionMark = [
565
- [
566
- /^(where|\?)$/,
567
- (_, { constructCSS, generator }) => {
568
- if (generator.userConfig.envMode === "dev")
569
- return `@keyframes __un_qm{0%{box-shadow:inset 4px 4px #ff1e90, inset -4px -4px #ff1e90}100%{box-shadow:inset 8px 8px #3399ff, inset -8px -8px #3399ff}} ${constructCSS({ animation: "__un_qm 0.5s ease-in-out alternate infinite" })}`;
570
- }
571
- ]
572
- ];
573
-
574
- const sizeMapping = {
575
- h: "height",
576
- w: "width",
577
- inline: "inline-size",
578
- block: "block-size"
579
- };
580
- function getPropName(minmax, hw) {
581
- return `${minmax || ""}${sizeMapping[hw]}`;
582
- }
583
- function getSizeValue(minmax, hw, theme, prop) {
584
- const key = getPropName(minmax, hw).replace(/-(\w)/g, (_, p) => p.toUpperCase());
585
- const v = theme[key]?.[prop];
586
- if (v != null)
587
- return v;
588
- switch (prop) {
589
- case "fit":
590
- case "max":
591
- case "min":
592
- return `${prop}-content`;
593
- }
594
- return h.bracket.cssvar.global.auto.fraction.rem(prop);
595
- }
596
- const sizes = [
597
- [/^size-(min-|max-)?(.+)$/, ([, m, s], { theme }) => ({ [getPropName(m, "w")]: getSizeValue(m, "w", theme, s), [getPropName(m, "h")]: getSizeValue(m, "h", theme, s) })],
598
- [/^(?:size-)?(min-|max-)?([wh])-?(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) })],
599
- [/^(?:size-)?(min-|max-)?(block|inline)-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) }), {
600
- autocomplete: [
601
- "(w|h)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
602
- "(block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
603
- "(max|min)-(w|h|block|inline)",
604
- "(max|min)-(w|h|block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
605
- "(w|h)-full",
606
- "(max|min)-(w|h)-full"
607
- ]
608
- }],
609
- [/^(?:size-)?(min-|max-)?(h)-screen-(.+)$/, ([, m, h2, p], context) => ({ [getPropName(m, h2)]: handleBreakpoint(context, p, "verticalBreakpoints") })],
610
- [/^(?:size-)?(min-|max-)?(w)-screen-(.+)$/, ([, m, w, p], context) => ({ [getPropName(m, w)]: handleBreakpoint(context, p) }), {
611
- autocomplete: [
612
- "(w|h)-screen",
613
- "(min|max)-(w|h)-screen",
614
- "h-screen-$verticalBreakpoints",
615
- "(min|max)-h-screen-$verticalBreakpoints",
616
- "w-screen-$breakpoints",
617
- "(min|max)-w-screen-$breakpoints"
618
- ]
619
- }]
620
- ];
621
- function handleBreakpoint(context, point, key = "breakpoints") {
622
- const bp = resolveBreakpoints(context, key);
623
- if (bp)
624
- return bp.find((i) => i.point === point)?.size;
625
- }
626
- function getAspectRatio(prop) {
627
- if (/^\d+\/\d+$/.test(prop))
628
- return prop;
629
- switch (prop) {
630
- case "square":
631
- return "1/1";
632
- case "video":
633
- return "16/9";
634
- }
635
- return h.bracket.cssvar.global.auto.number(prop);
636
- }
637
- const aspectRatio = [
638
- [/^(?:size-)?aspect-(?:ratio-)?(.+)$/, ([, d]) => ({ "aspect-ratio": getAspectRatio(d) }), { autocomplete: ["aspect-(square|video|ratio)", "aspect-ratio-(square|video)"] }]
639
- ];
640
-
641
- const paddings = [
642
- [/^pa?()-?(.+)$/, directionSize("padding"), { autocomplete: ["(m|p)<num>", "(m|p)-<num>"] }],
643
- [/^p-?xy()()$/, directionSize("padding"), { autocomplete: "(m|p)-(xy)" }],
644
- [/^p-?([xy])(?:-?(.+))?$/, directionSize("padding")],
645
- [/^p-?([rltbse])(?:-?(.+))?$/, directionSize("padding"), { autocomplete: "(m|p)<directions>-<num>" }],
646
- [/^p-(block|inline)(?:-(.+))?$/, directionSize("padding"), { autocomplete: "(m|p)-(block|inline)-<num>" }],
647
- [/^p-?([bi][se])(?:-?(.+))?$/, directionSize("padding"), { autocomplete: "(m|p)-(bs|be|is|ie)-<num>" }]
648
- ];
649
- const margins = [
650
- [/^ma?()-?(.+)$/, directionSize("margin")],
651
- [/^m-?xy()()$/, directionSize("margin")],
652
- [/^m-?([xy])(?:-?(.+))?$/, directionSize("margin")],
653
- [/^m-?([rltbse])(?:-?(.+))?$/, directionSize("margin")],
654
- [/^m-(block|inline)(?:-(.+))?$/, directionSize("margin")],
655
- [/^m-?([bi][se])(?:-?(.+))?$/, directionSize("margin")]
656
- ];
657
-
658
- const svgUtilities = [
659
- // fills
660
- [/^fill-(.+)$/, colorResolver("fill", "fill", "backgroundColor"), { autocomplete: "fill-$colors" }],
661
- [/^fill-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-fill-opacity": h.bracket.percent.cssvar(opacity) }), { autocomplete: "fill-(op|opacity)-<percent>" }],
662
- ["fill-none", { fill: "none" }],
663
- // stroke size
664
- [/^stroke-(?:width-|size-)?(.+)$/, handleWidth, { autocomplete: ["stroke-width-$lineWidth", "stroke-size-$lineWidth"] }],
665
- // stroke dash
666
- [/^stroke-dash-(.+)$/, ([, s]) => ({ "stroke-dasharray": h.bracket.cssvar.number(s) }), { autocomplete: "stroke-dash-<num>" }],
667
- [/^stroke-offset-(.+)$/, ([, s], { theme }) => ({ "stroke-dashoffset": theme.lineWidth?.[s] ?? h.bracket.cssvar.px.numberWithUnit(s) }), { autocomplete: "stroke-offset-$lineWidth" }],
668
- // stroke colors
669
- [/^stroke-(.+)$/, handleColorOrWidth, { autocomplete: "stroke-$colors" }],
670
- [/^stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-stroke-opacity": h.bracket.percent.cssvar(opacity) }), { autocomplete: "stroke-(op|opacity)-<percent>" }],
671
- // line cap
672
- ["stroke-cap-square", { "stroke-linecap": "square" }],
673
- ["stroke-cap-round", { "stroke-linecap": "round" }],
674
- ["stroke-cap-auto", { "stroke-linecap": "butt" }],
675
- // line join
676
- ["stroke-join-arcs", { "stroke-linejoin": "arcs" }],
677
- ["stroke-join-bevel", { "stroke-linejoin": "bevel" }],
678
- ["stroke-join-clip", { "stroke-linejoin": "miter-clip" }],
679
- ["stroke-join-round", { "stroke-linejoin": "round" }],
680
- ["stroke-join-auto", { "stroke-linejoin": "miter" }],
681
- // none
682
- ["stroke-none", { stroke: "none" }]
683
- ];
684
- function handleWidth([, b], { theme }) {
685
- return { "stroke-width": theme.lineWidth?.[b] ?? h.bracket.cssvar.fraction.px.number(b) };
686
- }
687
- function handleColorOrWidth(match, ctx) {
688
- if (isCSSMathFn(h.bracket(match[1])))
689
- return handleWidth(match, ctx);
690
- return colorResolver("stroke", "stroke", "borderColor")(match, ctx);
691
- }
692
-
693
- function resolveTransitionProperty(prop, theme) {
694
- let p;
695
- if (h.cssvar(prop) != null) {
696
- p = h.cssvar(prop);
697
- } else {
698
- if (prop.startsWith("[") && prop.endsWith("]")) {
699
- prop = prop.slice(1, -1);
700
- }
701
- const props = prop.split(",").map((p2) => theme.transitionProperty?.[p2] ?? h.properties(p2));
702
- if (props.every(Boolean)) {
703
- p = props.join(",");
704
- }
705
- }
706
- return p;
707
- }
708
- const transitions = [
709
- // transition
710
- [
711
- /^transition(?:-(\D+?))?(?:-(\d+))?$/,
712
- ([, prop, d], { theme }) => {
713
- if (!prop && !d) {
714
- return {
715
- "transition-property": theme.transitionProperty?.DEFAULT,
716
- "transition-timing-function": theme.easing?.DEFAULT,
717
- "transition-duration": theme.duration?.DEFAULT ?? h.time("150")
718
- };
719
- } else if (prop != null) {
720
- const p = resolveTransitionProperty(prop, theme);
721
- const duration = theme.duration?.[d || "DEFAULT"] ?? h.time(d || "150");
722
- if (p) {
723
- return {
724
- "transition-property": p,
725
- "transition-timing-function": theme.easing?.DEFAULT,
726
- "transition-duration": duration
727
- };
728
- }
729
- } else if (d != null) {
730
- return {
731
- "transition-property": theme.transitionProperty?.DEFAULT,
732
- "transition-timing-function": theme.easing?.DEFAULT,
733
- "transition-duration": theme.duration?.[d] ?? h.time(d)
734
- };
735
- }
736
- },
737
- {
738
- autocomplete: "transition-$transitionProperty-$duration"
739
- }
740
- ],
741
- // timings
742
- [
743
- /^(?:transition-)?duration-(.+)$/,
744
- ([, d], { theme }) => ({ "transition-duration": theme.duration?.[d || "DEFAULT"] ?? h.bracket.cssvar.time(d) }),
745
- { autocomplete: ["transition-duration-$duration", "duration-$duration"] }
746
- ],
747
- [
748
- /^(?:transition-)?delay-(.+)$/,
749
- ([, d], { theme }) => ({ "transition-delay": theme.duration?.[d || "DEFAULT"] ?? h.bracket.cssvar.time(d) }),
750
- { autocomplete: ["transition-delay-$duration", "delay-$duration"] }
751
- ],
752
- [
753
- /^(?:transition-)?ease(?:-(.+))?$/,
754
- ([, d], { theme }) => ({ "transition-timing-function": theme.easing?.[d || "DEFAULT"] ?? h.bracket.cssvar(d) }),
755
- { autocomplete: ["transition-ease-(linear|in|out|in-out|DEFAULT)", "ease-(linear|in|out|in-out|DEFAULT)"] }
756
- ],
757
- // props
758
- [
759
- /^(?:transition-)?property-(.+)$/,
760
- ([, v], { theme }) => {
761
- const p = h.global(v) || resolveTransitionProperty(v, theme);
762
- if (p)
763
- return { "transition-property": p };
764
- },
765
- { autocomplete: [
766
- `transition-property-(${[...globalKeywords].join("|")})`,
767
- "transition-property-$transitionProperty",
768
- "property-$transitionProperty"
769
- ] }
770
- ],
771
- // none
772
- ["transition-none", { transition: "none" }],
773
- ...makeGlobalStaticRules("transition"),
774
- // behavior
775
- ["transition-discrete", { "transition-behavior": "allow-discrete" }],
776
- ["transition-normal", { "transition-behavior": "normal" }]
777
- ];
778
-
779
- const fonts = [
780
- // text
781
- [/^text-(.+)$/, handleText, { autocomplete: "text-$fontSize" }],
782
- // text size
783
- [/^(?:text|font)-size-(.+)$/, handleSize, { autocomplete: "text-size-$fontSize" }],
784
- // text colors
785
- [/^text-(?:color-)?(.+)$/, handlerColorOrSize, { autocomplete: "text-$colors" }],
786
- // colors
787
- [/^(?:color|c)-(.+)$/, colorResolver("color", "text", "textColor"), { autocomplete: "(color|c)-$colors" }],
788
- // style
789
- [/^(?:text|color|c)-(.+)$/, ([, v]) => globalKeywords.includes(v) ? { color: v } : void 0, { autocomplete: `(text|color|c)-(${globalKeywords.join("|")})` }],
790
- // opacity
791
- [/^(?:text|color|c)-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-opacity": h.bracket.percent.cssvar(opacity) }), { autocomplete: "(text|color|c)-(op|opacity)-<percent>" }],
792
- // weights
793
- [
794
- /^(?:font|fw)-?([^-]+)$/,
795
- ([, s], { theme }) => ({ "font-weight": theme.fontWeight?.[s] || h.bracket.global.number(s) }),
796
- {
797
- autocomplete: [
798
- "(font|fw)-(100|200|300|400|500|600|700|800|900)",
799
- "(font|fw)-$fontWeight"
800
- ]
801
- }
802
- ],
803
- // leadings
804
- [
805
- /^(?:font-)?(?:leading|lh|line-height)-(.+)$/,
806
- ([, s], { theme }) => ({ "line-height": handleThemeByKey(s, theme, "lineHeight") }),
807
- { autocomplete: "(leading|lh|line-height)-$lineHeight" }
808
- ],
809
- // synthesis
810
- ["font-synthesis-weight", { "font-synthesis": "weight" }],
811
- ["font-synthesis-style", { "font-synthesis": "style" }],
812
- ["font-synthesis-small-caps", { "font-synthesis": "small-caps" }],
813
- ["font-synthesis-none", { "font-synthesis": "none" }],
814
- [/^font-synthesis-(.+)$/, ([, s]) => ({ "font-synthesis": h.bracket.cssvar.global(s) })],
815
- // tracking
816
- [
817
- /^(?:font-)?tracking-(.+)$/,
818
- ([, s], { theme }) => ({ "letter-spacing": theme.letterSpacing?.[s] || h.bracket.cssvar.global.rem(s) }),
819
- { autocomplete: "tracking-$letterSpacing" }
820
- ],
821
- // word-spacing
822
- [
823
- /^(?:font-)?word-spacing-(.+)$/,
824
- ([, s], { theme }) => ({ "word-spacing": theme.wordSpacing?.[s] || h.bracket.cssvar.global.rem(s) }),
825
- { autocomplete: "word-spacing-$wordSpacing" }
826
- ],
827
- // stretch
828
- ["font-stretch-normal", { "font-stretch": "normal" }],
829
- ["font-stretch-ultra-condensed", { "font-stretch": "ultra-condensed" }],
830
- ["font-stretch-extra-condensed", { "font-stretch": "extra-condensed" }],
831
- ["font-stretch-condensed", { "font-stretch": "condensed" }],
832
- ["font-stretch-semi-condensed", { "font-stretch": "semi-condensed" }],
833
- ["font-stretch-semi-expanded", { "font-stretch": "semi-expanded" }],
834
- ["font-stretch-expanded", { "font-stretch": "expanded" }],
835
- ["font-stretch-extra-expanded", { "font-stretch": "extra-expanded" }],
836
- ["font-stretch-ultra-expanded", { "font-stretch": "ultra-expanded" }],
837
- [
838
- /^font-stretch-(.+)$/,
839
- ([, s]) => ({ "font-stretch": h.bracket.cssvar.fraction.global(s) }),
840
- { autocomplete: "font-stretch-<percentage>" }
841
- ],
842
- // family
843
- [
844
- /^font-(.+)$/,
845
- ([, d], { theme }) => ({ "font-family": theme.fontFamily?.[d] || h.bracket.cssvar.global(d) }),
846
- { autocomplete: "font-$fontFamily" }
847
- ]
848
- ];
849
- const tabSizes = [
850
- [/^tab(?:-(.+))?$/, ([, s]) => {
851
- const v = h.bracket.cssvar.global.number(s || "4");
852
- if (v != null) {
853
- return {
854
- "-moz-tab-size": v,
855
- "-o-tab-size": v,
856
- "tab-size": v
857
- };
858
- }
859
- }]
860
- ];
861
- const textIndents = [
862
- [/^indent(?:-(.+))?$/, ([, s], { theme }) => ({ "text-indent": theme.textIndent?.[s || "DEFAULT"] || h.bracket.cssvar.global.fraction.rem(s) }), { autocomplete: "indent-$textIndent" }]
863
- ];
864
- const textStrokes = [
865
- // widths
866
- [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => ({ "-webkit-text-stroke-width": theme.textStrokeWidth?.[s || "DEFAULT"] || h.bracket.cssvar.px(s) }), { autocomplete: "text-stroke-$textStrokeWidth" }],
867
- // colors
868
- [/^text-stroke-(.+)$/, colorResolver("-webkit-text-stroke-color", "text-stroke", "borderColor"), { autocomplete: "text-stroke-$colors" }],
869
- [/^text-stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-stroke-opacity": h.bracket.percent.cssvar(opacity) }), { autocomplete: "text-stroke-(op|opacity)-<percent>" }]
870
- ];
871
- const textShadows = [
872
- [/^text-shadow(?:-(.+))?$/, ([, s], { theme }) => {
873
- const v = theme.textShadow?.[s || "DEFAULT"];
874
- if (v != null) {
875
- return {
876
- "--un-text-shadow": colorableShadows(v, "--un-text-shadow-color").join(","),
877
- "text-shadow": "var(--un-text-shadow)"
878
- };
879
- }
880
- return { "text-shadow": h.bracket.cssvar.global(s) };
881
- }, { autocomplete: "text-shadow-$textShadow" }],
882
- // colors
883
- [/^text-shadow-color-(.+)$/, colorResolver("--un-text-shadow-color", "text-shadow", "shadowColor"), { autocomplete: "text-shadow-color-$colors" }],
884
- [/^text-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-shadow-opacity": h.bracket.percent.cssvar(opacity) }), { autocomplete: "text-shadow-color-(op|opacity)-<percent>" }]
885
- ];
886
- function handleThemeByKey(s, theme, key) {
887
- return theme[key]?.[s] || h.bracket.cssvar.global.rem(s);
888
- }
889
- function handleSize([, s], { theme }) {
890
- const themed = toArray(theme.fontSize?.[s]);
891
- const size = themed?.[0] ?? h.bracket.cssvar.global.rem(s);
892
- if (size != null)
893
- return { "font-size": size };
894
- }
895
- function handlerColorOrSize(match, ctx) {
896
- if (isCSSMathFn(h.bracket(match[1])))
897
- return handleSize(match, ctx);
898
- return colorResolver("color", "text", "textColor")(match, ctx);
899
- }
900
- function handleText([, s = "base"], { theme }) {
901
- const split = splitShorthand(s, "length");
902
- if (!split)
903
- return;
904
- const [size, leading] = split;
905
- const sizePairs = toArray(theme.fontSize?.[size]);
906
- const lineHeight = leading ? handleThemeByKey(leading, theme, "lineHeight") : void 0;
907
- if (sizePairs?.[0]) {
908
- const [fontSize2, height, letterSpacing] = sizePairs;
909
- if (typeof height === "object") {
910
- return {
911
- "font-size": fontSize2,
912
- ...height
913
- };
914
- }
915
- return {
916
- "font-size": fontSize2,
917
- "line-height": lineHeight ?? height ?? "1",
918
- "letter-spacing": letterSpacing ? handleThemeByKey(letterSpacing, theme, "letterSpacing") : void 0
919
- };
920
- }
921
- const fontSize = h.bracketOfLength.rem(size);
922
- if (lineHeight && fontSize) {
923
- return {
924
- "font-size": fontSize,
925
- "line-height": lineHeight
926
- };
927
- }
928
- return { "font-size": h.bracketOfLength.rem(s) };
929
- }
930
-
931
- const variablesAbbrMap = {
932
- backface: "backface-visibility",
933
- break: "word-break",
934
- case: "text-transform",
935
- content: "align-content",
936
- fw: "font-weight",
937
- items: "align-items",
938
- justify: "justify-content",
939
- select: "user-select",
940
- self: "align-self",
941
- vertical: "vertical-align",
942
- visible: "visibility",
943
- whitespace: "white-space",
944
- ws: "white-space"
945
- };
946
- const cssVariables = [
947
- [/^(.+?)-(\$.+)$/, ([, name, varname]) => {
948
- const prop = variablesAbbrMap[name];
949
- if (prop)
950
- return { [prop]: h.cssvar(varname) };
951
- }]
952
- ];
953
- const cssProperty = [
954
- [/^\[(.*)\]$/, ([_, body]) => {
955
- if (!body.includes(":"))
956
- return;
957
- const [prop, ...rest] = body.split(":");
958
- const value = rest.join(":");
959
- if (!isURI(body) && /^[\w-]+$/.test(prop) && isValidCSSBody(value)) {
960
- const parsed = h.bracket(`[${value}]`);
961
- if (parsed)
962
- return { [prop]: parsed };
963
- }
964
- }]
965
- ];
966
- function isValidCSSBody(body) {
967
- let i = 0;
968
- function findUntil(c) {
969
- while (i < body.length) {
970
- i += 1;
971
- const char = body[i];
972
- if (char === c)
973
- return true;
974
- }
975
- return false;
976
- }
977
- for (i = 0; i < body.length; i++) {
978
- const c = body[i];
979
- if ("\"`'".includes(c)) {
980
- if (!findUntil(c))
981
- return false;
982
- } else if (c === "(") {
983
- if (!findUntil(")"))
984
- return false;
985
- } else if ("[]{}:".includes(c)) {
986
- return false;
987
- }
988
- }
989
- return true;
990
- }
991
- function isURI(declaration) {
992
- if (!declaration.includes("://"))
993
- return false;
994
- try {
995
- return new URL(declaration).host !== "";
996
- } catch {
997
- return false;
998
- }
999
- }
1000
-
1001
- const rules = [
1002
- cssVariables,
1003
- cssProperty,
1004
- contains,
1005
- pointerEvents,
1006
- appearances,
1007
- positions,
1008
- insets,
1009
- zIndexes,
1010
- orders,
1011
- grids,
1012
- floats,
1013
- margins,
1014
- boxSizing,
1015
- displays,
1016
- aspectRatio,
1017
- sizes,
1018
- flex,
1019
- transforms,
1020
- cursors,
1021
- userSelects,
1022
- resizes,
1023
- appearance,
1024
- placements,
1025
- alignments,
1026
- justifies,
1027
- gaps,
1028
- flexGridJustifiesAlignments,
1029
- overflows,
1030
- textOverflows,
1031
- whitespaces,
1032
- breaks,
1033
- borders,
1034
- bgColors,
1035
- colorScheme,
1036
- svgUtilities,
1037
- paddings,
1038
- textAligns,
1039
- textIndents,
1040
- textWraps,
1041
- verticalAligns,
1042
- fonts,
1043
- textTransforms,
1044
- fontStyles,
1045
- textDecorations,
1046
- fontSmoothings,
1047
- tabSizes,
1048
- textStrokes,
1049
- textShadows,
1050
- opacity,
1051
- boxShadows,
1052
- outline,
1053
- rings,
1054
- transitions,
1055
- willChange,
1056
- contentVisibility,
1057
- contents,
1058
- containerParent,
1059
- fieldSizing,
1060
- // should be the last
1061
- questionMark
1062
- ].flat(1);
1063
-
1064
- export { zIndexes as A, boxSizing as B, questionMark as C, sizes as D, aspectRatio as E, paddings as F, margins as G, svgUtilities as H, transitions as I, fonts as J, tabSizes as K, textIndents as L, textStrokes as M, textShadows as N, cssVariables as O, cssProperty as P, appearance as a, borderStyles as b, borders as c, opacity as d, bgColors as e, colorScheme as f, containerParent as g, handlerBorderStyle as h, textDecorations as i, flex as j, gaps as k, grids as l, overflows as m, justifies as n, outline as o, positions as p, orders as q, rules as r, alignments as s, textAligns as t, placements as u, verticalAligns as v, willChange as w, flexGridJustifiesAlignments as x, insets as y, floats as z };