@unocss/preset-mini 0.55.1 → 0.55.2

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 (56) hide show
  1. package/dist/colors.cjs +360 -6
  2. package/dist/{colors-dabdd21f.d.ts → colors.d.cts} +3 -2
  3. package/dist/colors.d.mts +354 -0
  4. package/dist/colors.d.ts +353 -2
  5. package/dist/colors.mjs +361 -1
  6. package/dist/index.cjs +12 -12
  7. package/dist/index.d.cts +69 -0
  8. package/dist/index.d.mts +69 -0
  9. package/dist/index.d.ts +6 -6
  10. package/dist/index.mjs +9 -10
  11. package/dist/rules.cjs +928 -48
  12. package/dist/rules.d.cts +133 -0
  13. package/dist/rules.d.mts +133 -0
  14. package/dist/rules.d.ts +1 -1
  15. package/dist/rules.mjs +891 -4
  16. package/dist/{default-1f25a0ae.d.ts → shared/preset-mini.024bdcea.d.ts} +1 -1
  17. package/dist/shared/preset-mini.0a9763df.d.mts +721 -0
  18. package/dist/shared/preset-mini.0fac4963.mjs +320 -0
  19. package/dist/shared/preset-mini.5bfee53b.cjs +344 -0
  20. package/dist/shared/preset-mini.5f54784f.d.mts +71 -0
  21. package/dist/shared/preset-mini.5f54784f.d.ts +71 -0
  22. package/dist/shared/preset-mini.aa3a264b.d.cts +67 -0
  23. package/dist/shared/{preset-mini.a21c5071.cjs → preset-mini.b4ad509c.cjs} +12 -8
  24. package/dist/shared/preset-mini.d69a12a5.d.cts +721 -0
  25. package/dist/{utilities-d496540e.d.ts → shared/preset-mini.e93c20db.d.ts} +1 -1
  26. package/dist/shared/{preset-mini.6c1c8016.mjs → preset-mini.f1fe435e.mjs} +13 -9
  27. package/dist/shared/preset-mini.fc26b619.d.mts +67 -0
  28. package/dist/theme.cjs +308 -34
  29. package/dist/theme.d.cts +264 -0
  30. package/dist/theme.d.mts +264 -0
  31. package/dist/theme.d.ts +5 -5
  32. package/dist/theme.mjs +284 -4
  33. package/dist/utils.cjs +81 -10
  34. package/dist/utils.d.cts +83 -0
  35. package/dist/utils.d.mts +83 -0
  36. package/dist/utils.d.ts +20 -20
  37. package/dist/utils.mjs +81 -3
  38. package/dist/variants.cjs +737 -33
  39. package/dist/variants.d.cts +46 -0
  40. package/dist/variants.d.mts +46 -0
  41. package/dist/variants.d.ts +4 -4
  42. package/dist/variants.mjs +714 -4
  43. package/package.json +3 -3
  44. package/dist/shared/preset-mini.0131b915.mjs +0 -704
  45. package/dist/shared/preset-mini.1c66bf79.mjs +0 -361
  46. package/dist/shared/preset-mini.74f9d55e.mjs +0 -80
  47. package/dist/shared/preset-mini.811eb23d.mjs +0 -681
  48. package/dist/shared/preset-mini.8dd73081.mjs +0 -452
  49. package/dist/shared/preset-mini.9d93761b.cjs +0 -729
  50. package/dist/shared/preset-mini.b8d9397e.cjs +0 -471
  51. package/dist/shared/preset-mini.ce5169f2.cjs +0 -730
  52. package/dist/shared/preset-mini.d778b487.cjs +0 -85
  53. package/dist/shared/preset-mini.de3bd9f7.mjs +0 -284
  54. package/dist/shared/preset-mini.e078d7da.cjs +0 -313
  55. package/dist/shared/preset-mini.f3fc54d2.cjs +0 -363
  56. /package/dist/{types-d991ba46.d.ts → shared/preset-mini.5f54784f.d.cts} +0 -0
@@ -1,730 +0,0 @@
1
- 'use strict';
2
-
3
- const colors = require('./preset-mini.a21c5071.cjs');
4
- require('@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(colors.globalKeywords.map((x) => [x, x]))
21
- };
22
- const verticalAligns = [
23
- [/^(?:vertical|align|v)-([-\w]+)$/, ([, v]) => ({ "vertical-align": verticalAlignAlias[v] }), { autocomplete: `(vertical|align|v)-(${Object.keys(verticalAlignAlias).join("|")})` }]
24
- ];
25
- const textAligns = ["center", "left", "right", "justify", "start", "end"].map((v) => [`text-${v}`, { "text-align": v }]);
26
-
27
- const outline = [
28
- [/^outline-(?:width-|size-)?(.+)$/, ([, d], { theme }) => ({ "outline-width": theme.lineWidth?.[d] ?? colors.h.bracket.cssvar.global.px(d) }), { autocomplete: "outline-(width|size)-<num>" }],
29
- [/^outline-(?:color-)?(.+)$/, colors.colorResolver("outline-color", "outline-color"), { autocomplete: "outline-$colors" }],
30
- [/^outline-offset-(.+)$/, ([, d], { theme }) => ({ "outline-offset": theme.lineWidth?.[d] ?? colors.h.bracket.cssvar.global.px(d) }), { autocomplete: "outline-(offset)-<num>" }],
31
- ["outline", { "outline-style": "solid" }],
32
- ...["auto", "dashed", "dotted", "double", "hidden", "solid", "groove", "ridge", "inset", "outset", ...colors.globalKeywords].map((v) => [`outline-${v}`, { "outline-style": v }]),
33
- ["outline-none", { "outline": "2px solid transparent", "outline-offset": "2px" }]
34
- ];
35
- const appearance = [
36
- ["appearance-none", {
37
- "-webkit-appearance": "none",
38
- "appearance": "none"
39
- }]
40
- ];
41
- function willChangeProperty(prop) {
42
- return colors.h.properties.auto.global(prop) ?? {
43
- contents: "contents",
44
- scroll: "scroll-position"
45
- }[prop];
46
- }
47
- const willChange = [
48
- [/^will-change-(.+)/, ([, p]) => ({ "will-change": willChangeProperty(p) })]
49
- ];
50
-
51
- const borderStyles = ["solid", "dashed", "dotted", "double", "hidden", "none", "groove", "ridge", "inset", "outset", ...colors.globalKeywords];
52
- const borders = [
53
- [/^(?:border|b)()(?:-(.+))?$/, handlerBorder, { autocomplete: "(border|b)-<directions>" }],
54
- [/^(?:border|b)-([xy])(?:-(.+))?$/, handlerBorder],
55
- [/^(?:border|b)-([rltbse])(?:-(.+))?$/, handlerBorder],
56
- [/^(?:border|b)-(block|inline)(?:-(.+))?$/, handlerBorder],
57
- [/^(?:border|b)-([bi][se])(?:-(.+))?$/, handlerBorder],
58
- [/^(?:border|b)-()(?:width|size)-(.+)$/, handlerBorderSize, { autocomplete: ["(border|b)-<num>", "(border|b)-<directions>-<num>"] }],
59
- [/^(?:border|b)-([xy])-(?:width|size)-(.+)$/, handlerBorderSize],
60
- [/^(?:border|b)-([rltbse])-(?:width|size)-(.+)$/, handlerBorderSize],
61
- [/^(?:border|b)-(block|inline)-(?:width|size)-(.+)$/, handlerBorderSize],
62
- [/^(?:border|b)-([bi][se])-(?:width|size)-(.+)$/, handlerBorderSize],
63
- [/^(?:border|b)-()(?:color-)?(.+)$/, handlerBorderColor, { autocomplete: ["(border|b)-$colors", "(border|b)-<directions>-$colors"] }],
64
- [/^(?:border|b)-([xy])-(?:color-)?(.+)$/, handlerBorderColor],
65
- [/^(?:border|b)-([rltbse])-(?:color-)?(.+)$/, handlerBorderColor],
66
- [/^(?:border|b)-(block|inline)-(?:color-)?(.+)$/, handlerBorderColor],
67
- [/^(?:border|b)-([bi][se])-(?:color-)?(.+)$/, handlerBorderColor],
68
- [/^(?:border|b)-()op(?:acity)?-?(.+)$/, handlerBorderOpacity, { autocomplete: "(border|b)-(op|opacity)-<percent>" }],
69
- [/^(?:border|b)-([xy])-op(?:acity)?-?(.+)$/, handlerBorderOpacity],
70
- [/^(?:border|b)-([rltbse])-op(?:acity)?-?(.+)$/, handlerBorderOpacity],
71
- [/^(?:border|b)-(block|inline)-op(?:acity)?-?(.+)$/, handlerBorderOpacity],
72
- [/^(?:border|b)-([bi][se])-op(?:acity)?-?(.+)$/, handlerBorderOpacity],
73
- [/^(?:border-|b-)?(?:rounded|rd)()(?:-(.+))?$/, handlerRounded, { autocomplete: ["(border|b)-(rounded|rd)", "(border|b)-(rounded|rd)-<num>", "(rounded|rd)", "(rounded|rd)-<num>"] }],
74
- [/^(?:border-|b-)?(?:rounded|rd)-([rltbse])(?:-(.+))?$/, handlerRounded],
75
- [/^(?:border-|b-)?(?:rounded|rd)-([rltb]{2})(?:-(.+))?$/, handlerRounded],
76
- [/^(?:border-|b-)?(?:rounded|rd)-([bise][se])(?:-(.+))?$/, handlerRounded],
77
- [/^(?:border-|b-)?(?:rounded|rd)-([bi][se]-[bi][se])(?:-(.+))?$/, handlerRounded],
78
- [/^(?: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("|")})`] }],
79
- [/^(?:border|b)-([xy])-(?:style-)?(.+)$/, handlerBorderStyle],
80
- [/^(?:border|b)-([rltbse])-(?:style-)?(.+)$/, handlerBorderStyle],
81
- [/^(?:border|b)-(block|inline)-(?:style-)?(.+)$/, handlerBorderStyle],
82
- [/^(?:border|b)-([bi][se])-(?:style-)?(.+)$/, handlerBorderStyle]
83
- ];
84
- function borderColorResolver(direction) {
85
- return ([, body], theme) => {
86
- const data = colors.parseColor(body, theme);
87
- if (!data)
88
- return;
89
- const { alpha, color, cssColor } = data;
90
- if (cssColor) {
91
- if (alpha != null) {
92
- return {
93
- [`border${direction}-color`]: colors.colorToString(cssColor, alpha)
94
- };
95
- }
96
- if (direction === "") {
97
- return {
98
- "--un-border-opacity": colors.colorOpacityToString(cssColor),
99
- "border-color": colors.colorToString(cssColor, "var(--un-border-opacity)")
100
- };
101
- } else {
102
- return {
103
- "--un-border-opacity": colors.colorOpacityToString(cssColor),
104
- [`--un-border${direction}-opacity`]: "var(--un-border-opacity)",
105
- [`border${direction}-color`]: colors.colorToString(cssColor, `var(--un-border${direction}-opacity)`)
106
- };
107
- }
108
- } else if (color) {
109
- return {
110
- [`border${direction}-color`]: colors.colorToString(color, alpha)
111
- };
112
- }
113
- };
114
- }
115
- function handlerBorder(m, ctx) {
116
- return handlerBorderSize(m, ctx);
117
- }
118
- function handlerBorderSize([, a = "", b], { theme }) {
119
- const v = theme.lineWidth?.[b || "DEFAULT"] ?? colors.h.bracket.cssvar.global.px(b || "1");
120
- if (a in colors.directionMap && v != null)
121
- return colors.directionMap[a].map((i) => [`border${i}-width`, v]);
122
- }
123
- function handlerBorderColor([, a = "", c], { theme }) {
124
- if (a in colors.directionMap && colors.hasParseableColor(c, theme)) {
125
- return Object.assign(
126
- {},
127
- ...colors.directionMap[a].map((i) => borderColorResolver(i)(["", c], theme))
128
- );
129
- }
130
- }
131
- function handlerBorderOpacity([, a = "", opacity]) {
132
- const v = colors.h.bracket.percent.cssvar(opacity);
133
- if (a in colors.directionMap && v != null)
134
- return colors.directionMap[a].map((i) => [`--un-border${i}-opacity`, v]);
135
- }
136
- function handlerRounded([, a = "", s], { theme }) {
137
- const v = theme.borderRadius?.[s || "DEFAULT"] || colors.h.bracket.cssvar.global.fraction.rem(s || "1");
138
- if (a in colors.cornerMap && v != null)
139
- return colors.cornerMap[a].map((i) => [`border${i}-radius`, v]);
140
- }
141
- function handlerBorderStyle([, a = "", s]) {
142
- if (borderStyles.includes(s) && a in colors.directionMap)
143
- return colors.directionMap[a].map((i) => [`border${i}-style`, s]);
144
- }
145
-
146
- const opacity = [
147
- [/^op(?:acity)?-?(.+)$/, ([, d]) => ({ opacity: colors.h.bracket.percent.cssvar(d) })]
148
- ];
149
- const textColors = [
150
- [/^(?:color|c)-(.+)$/, colors.colorResolver("color", "text"), { autocomplete: "(color|c)-$colors" }],
151
- [/^text-(.+)$/, colors.colorResolver("color", "text", (css) => !css.color?.toString().match(colors.numberWithUnitRE)), { autocomplete: "text-$colors" }],
152
- [/^(?:text|color|c)-(.+)$/, ([, v]) => colors.globalKeywords.includes(v) ? { color: v } : void 0, { autocomplete: `(text|color|c)-(${colors.globalKeywords.join("|")})` }],
153
- [/^(?:text|color|c)-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-text-opacity": colors.h.bracket.percent.cssvar(opacity2) }), { autocomplete: "(text|color|c)-(op|opacity)-<percent>" }]
154
- ];
155
- const bgColors = [
156
- [/^bg-(.+)$/, colors.colorResolver("background-color", "bg"), { autocomplete: "bg-$colors" }],
157
- [/^bg-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-bg-opacity": colors.h.bracket.percent.cssvar(opacity2) }), { autocomplete: "bg-(op|opacity)-<percent>" }]
158
- ];
159
- const colorScheme = [
160
- [/^color-scheme-(\w+)$/, ([, v]) => ({ "color-scheme": v })]
161
- ];
162
-
163
- const decorationStyles = ["solid", "double", "dotted", "dashed", "wavy", ...colors.globalKeywords];
164
- const textDecorations = [
165
- [/^(?:decoration-)?(underline|overline|line-through)$/, ([, s]) => ({ "text-decoration-line": s }), { autocomplete: "decoration-(underline|overline|line-through)" }],
166
- [/^(?:underline|decoration)-(?:size-)?(.+)$/, ([, s], { theme }) => ({ "text-decoration-thickness": theme.lineWidth?.[s] ?? colors.h.bracket.cssvar.global.px(s) }), { autocomplete: "(underline|decoration)-<num>" }],
167
- [/^(?:underline|decoration)-(auto|from-font)$/, ([, s]) => ({ "text-decoration-thickness": s }), { autocomplete: "(underline|decoration)-(auto|from-font)" }],
168
- [/^(?:underline|decoration)-(.+)$/, (match, ctx) => {
169
- const result = colors.colorResolver("text-decoration-color", "line")(match, ctx);
170
- if (result) {
171
- return {
172
- "-webkit-text-decoration-color": result["text-decoration-color"],
173
- ...result
174
- };
175
- }
176
- }, { autocomplete: "(underline|decoration)-$colors" }],
177
- [/^(?:underline|decoration)-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-line-opacity": colors.h.bracket.percent.cssvar(opacity) }), { autocomplete: "(underline|decoration)-(op|opacity)-<percent>" }],
178
- [/^(?:underline|decoration)-offset-(.+)$/, ([, s], { theme }) => ({ "text-underline-offset": theme.lineWidth?.[s] ?? colors.h.auto.bracket.cssvar.global.px(s) }), { autocomplete: "(underline|decoration)-(offset)-<num>" }],
179
- ...decorationStyles.map((v) => [`underline-${v}`, { "text-decoration-style": v }]),
180
- ...decorationStyles.map((v) => [`decoration-${v}`, { "text-decoration-style": v }]),
181
- ["no-underline", { "text-decoration": "none" }],
182
- ["decoration-none", { "text-decoration": "none" }]
183
- ];
184
-
185
- const transitionPropertyGroup = {
186
- all: "all",
187
- colors: ["color", "background-color", "border-color", "outline-color", "text-decoration-color", "fill", "stroke"].join(","),
188
- none: "none",
189
- opacity: "opacity",
190
- shadow: "box-shadow",
191
- transform: "transform"
192
- };
193
- function transitionProperty(prop) {
194
- return colors.h.properties(prop) ?? transitionPropertyGroup[prop];
195
- }
196
- const transitions = [
197
- [/^transition(?:-([a-z-]+(?:,[a-z-]+)*))?(?:-(\d+))?$/, ([, prop, d], { theme }) => {
198
- const p = prop != null ? transitionProperty(prop) : [transitionPropertyGroup.colors, "opacity", "box-shadow", "transform", "filter", "backdrop-filter"].join(",");
199
- if (p) {
200
- const duration = theme.duration?.[d || "DEFAULT"] ?? colors.h.time(d || "150");
201
- return {
202
- "transition-property": p,
203
- "transition-timing-function": "cubic-bezier(0.4, 0, 0.2, 1)",
204
- "transition-duration": duration
205
- };
206
- }
207
- }, { autocomplete: `transition-(${Object.keys(transitionPropertyGroup).join("|")})` }],
208
- [
209
- /^(?:transition-)?duration-(.+)$/,
210
- ([, d], { theme }) => ({ "transition-duration": theme.duration?.[d || "DEFAULT"] ?? colors.h.bracket.cssvar.time(d) }),
211
- { autocomplete: ["transition-duration-$duration", "duration-$duration"] }
212
- ],
213
- [
214
- /^(?:transition-)?delay-(.+)$/,
215
- ([, d], { theme }) => ({ "transition-delay": theme.duration?.[d || "DEFAULT"] ?? colors.h.bracket.cssvar.time(d) }),
216
- { autocomplete: ["transition-delay-$duration", "delay-$duration"] }
217
- ],
218
- [
219
- /^(?:transition-)?ease(?:-(.+))?$/,
220
- ([, d], { theme }) => ({ "transition-timing-function": theme.easing?.[d || "DEFAULT"] ?? colors.h.bracket.cssvar(d) }),
221
- { autocomplete: ["transition-ease-(linear|in|out|in-out|DEFAULT)", "ease-(linear|in|out|in-out|DEFAULT)"] }
222
- ],
223
- [
224
- /^(?:transition-)?property-(.+)$/,
225
- ([, v]) => ({ "transition-property": colors.h.bracket.global(v) || transitionProperty(v) }),
226
- { autocomplete: [`transition-property-(${[...colors.globalKeywords, ...Object.keys(transitionPropertyGroup)].join("|")})`] }
227
- ],
228
- ["transition-none", { transition: "none" }],
229
- ...colors.makeGlobalStaticRules("transition")
230
- ];
231
-
232
- const overflowValues = [
233
- "auto",
234
- "hidden",
235
- "clip",
236
- "visible",
237
- "scroll",
238
- "overlay",
239
- ...colors.globalKeywords
240
- ];
241
- const overflows = [
242
- [/^(?:overflow|of)-(.+)$/, ([, v]) => overflowValues.includes(v) ? { overflow: v } : void 0, { autocomplete: [`(overflow|of)-(${overflowValues.join("|")})`, `(overflow|of)-(x|y)-(${overflowValues.join("|")})`] }],
243
- [/^(?:overflow|of)-([xy])-(.+)$/, ([, d, v]) => overflowValues.includes(v) ? { [`overflow-${d}`]: v } : void 0]
244
- ];
245
-
246
- const positions = [
247
- [/^(?:position-|pos-)?(relative|absolute|fixed|sticky)$/, ([, v]) => ({ position: v }), {
248
- autocomplete: [
249
- "(position|pos)-<position>",
250
- "(position|pos)-<globalKeyword>",
251
- "<position>"
252
- ]
253
- }],
254
- [/^(?:position-|pos-)([-\w]+)$/, ([, v]) => colors.globalKeywords.includes(v) ? { position: v } : void 0],
255
- [/^(?:position-|pos-)?(static)$/, ([, v]) => ({ position: v })]
256
- ];
257
- const justifies = [
258
- ["justify-start", { "justify-content": "flex-start" }],
259
- ["justify-end", { "justify-content": "flex-end" }],
260
- ["justify-center", { "justify-content": "center" }],
261
- ["justify-between", { "justify-content": "space-between" }],
262
- ["justify-around", { "justify-content": "space-around" }],
263
- ["justify-evenly", { "justify-content": "space-evenly" }],
264
- ["justify-stretch", { "justify-content": "stretch" }],
265
- ...colors.makeGlobalStaticRules("justify", "justify-content"),
266
- ["justify-items-start", { "justify-items": "start" }],
267
- ["justify-items-end", { "justify-items": "end" }],
268
- ["justify-items-center", { "justify-items": "center" }],
269
- ["justify-items-stretch", { "justify-items": "stretch" }],
270
- ...colors.makeGlobalStaticRules("justify-items"),
271
- ["justify-self-auto", { "justify-self": "auto" }],
272
- ["justify-self-start", { "justify-self": "start" }],
273
- ["justify-self-end", { "justify-self": "end" }],
274
- ["justify-self-center", { "justify-self": "center" }],
275
- ["justify-self-stretch", { "justify-self": "stretch" }],
276
- ...colors.makeGlobalStaticRules("justify-self")
277
- ];
278
- const orders = [
279
- [/^order-(.+)$/, ([, v]) => ({ order: colors.h.bracket.cssvar.number(v) })],
280
- ["order-first", { order: "-9999" }],
281
- ["order-last", { order: "9999" }],
282
- ["order-none", { order: "0" }]
283
- ];
284
- const alignments = [
285
- ["content-center", { "align-content": "center" }],
286
- ["content-start", { "align-content": "flex-start" }],
287
- ["content-end", { "align-content": "flex-end" }],
288
- ["content-between", { "align-content": "space-between" }],
289
- ["content-around", { "align-content": "space-around" }],
290
- ["content-evenly", { "align-content": "space-evenly" }],
291
- ...colors.makeGlobalStaticRules("content", "align-content"),
292
- ["items-start", { "align-items": "flex-start" }],
293
- ["items-end", { "align-items": "flex-end" }],
294
- ["items-center", { "align-items": "center" }],
295
- ["items-baseline", { "align-items": "baseline" }],
296
- ["items-stretch", { "align-items": "stretch" }],
297
- ...colors.makeGlobalStaticRules("items", "align-items"),
298
- ["self-auto", { "align-self": "auto" }],
299
- ["self-start", { "align-self": "flex-start" }],
300
- ["self-end", { "align-self": "flex-end" }],
301
- ["self-center", { "align-self": "center" }],
302
- ["self-stretch", { "align-self": "stretch" }],
303
- ["self-baseline", { "align-self": "baseline" }],
304
- ...colors.makeGlobalStaticRules("self", "align-self")
305
- ];
306
- const placements = [
307
- ["place-content-center", { "place-content": "center" }],
308
- ["place-content-start", { "place-content": "start" }],
309
- ["place-content-end", { "place-content": "end" }],
310
- ["place-content-between", { "place-content": "space-between" }],
311
- ["place-content-around", { "place-content": "space-around" }],
312
- ["place-content-evenly", { "place-content": "space-evenly" }],
313
- ["place-content-stretch", { "place-content": "stretch" }],
314
- ...colors.makeGlobalStaticRules("place-content"),
315
- ["place-items-start", { "place-items": "start" }],
316
- ["place-items-end", { "place-items": "end" }],
317
- ["place-items-center", { "place-items": "center" }],
318
- ["place-items-stretch", { "place-items": "stretch" }],
319
- ...colors.makeGlobalStaticRules("place-items"),
320
- ["place-self-auto", { "place-self": "auto" }],
321
- ["place-self-start", { "place-self": "start" }],
322
- ["place-self-end", { "place-self": "end" }],
323
- ["place-self-center", { "place-self": "center" }],
324
- ["place-self-stretch", { "place-self": "stretch" }],
325
- ...colors.makeGlobalStaticRules("place-self")
326
- ];
327
- const flexGridJustifiesAlignments = [...justifies, ...alignments].flatMap(([k, v]) => [
328
- [`flex-${k}`, v],
329
- [`grid-${k}`, v]
330
- ]);
331
- function handleInsetValue(v, { theme }) {
332
- return theme.spacing?.[v] ?? colors.h.bracket.cssvar.global.auto.fraction.rem(v);
333
- }
334
- function handleInsetValues([, d, v], ctx) {
335
- const r = handleInsetValue(v, ctx);
336
- if (r != null && d in colors.insetMap)
337
- return colors.insetMap[d].map((i) => [i.slice(1), r]);
338
- }
339
- const insets = [
340
- [
341
- /^(?:position-|pos-)?inset-(.+)$/,
342
- ([, v], ctx) => ({ inset: handleInsetValue(v, ctx) }),
343
- {
344
- autocomplete: [
345
- "(position|pos)-inset-<directions>-$spacing",
346
- "(position|pos)-inset-(block|inline)-$spacing",
347
- "(position|pos)-inset-(bs|be|is|ie)-$spacing",
348
- "(position|pos)-(top|left|right|bottom)-$spacing"
349
- ]
350
- }
351
- ],
352
- [/^(?:position-|pos-)?(start|end)-(.+)$/, handleInsetValues],
353
- [/^(?:position-|pos-)?inset-([xy])-(.+)$/, handleInsetValues],
354
- [/^(?:position-|pos-)?inset-([rltbse])-(.+)$/, handleInsetValues],
355
- [/^(?:position-|pos-)?inset-(block|inline)-(.+)$/, handleInsetValues],
356
- [/^(?:position-|pos-)?inset-([bi][se])-(.+)$/, handleInsetValues],
357
- [/^(?:position-|pos-)?(top|left|right|bottom)-(.+)$/, ([, d, v], ctx) => ({ [d]: handleInsetValue(v, ctx) })]
358
- ];
359
- const floats = [
360
- ["float-left", { float: "left" }],
361
- ["float-right", { float: "right" }],
362
- ["float-none", { float: "none" }],
363
- ...colors.makeGlobalStaticRules("float"),
364
- ["clear-left", { clear: "left" }],
365
- ["clear-right", { clear: "right" }],
366
- ["clear-both", { clear: "both" }],
367
- ["clear-none", { clear: "none" }],
368
- ...colors.makeGlobalStaticRules("clear")
369
- ];
370
- const zIndexes = [
371
- [/^(?:position-|pos-)?z([\d.]+)$/, ([, v]) => ({ "z-index": colors.h.number(v) })],
372
- [/^(?:position-|pos-)?z-(.+)$/, ([, v]) => ({ "z-index": colors.h.bracket.cssvar.global.auto.number(v) }), { autocomplete: "z-<num>" }]
373
- ];
374
- const boxSizing = [
375
- ["box-border", { "box-sizing": "border-box" }],
376
- ["box-content", { "box-sizing": "content-box" }],
377
- ...colors.makeGlobalStaticRules("box", "box-sizing")
378
- ];
379
-
380
- const cursorValues = ["auto", "default", "none", "context-menu", "help", "pointer", "progress", "wait", "cell", "crosshair", "text", "vertical-text", "alias", "copy", "move", "no-drop", "not-allowed", "grab", "grabbing", "all-scroll", "col-resize", "row-resize", "n-resize", "e-resize", "s-resize", "w-resize", "ne-resize", "nw-resize", "se-resize", "sw-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "zoom-in", "zoom-out"];
381
- const containValues = ["none", "strict", "content", "size", "inline-size", "layout", "style", "paint"];
382
- const varEmpty = " ";
383
- const displays = [
384
- ["inline", { display: "inline" }],
385
- ["block", { display: "block" }],
386
- ["inline-block", { display: "inline-block" }],
387
- ["contents", { display: "contents" }],
388
- ["flow-root", { display: "flow-root" }],
389
- ["list-item", { display: "list-item" }],
390
- ["hidden", { display: "none" }],
391
- [/^display-(.+)$/, ([, c]) => ({ display: colors.h.bracket.cssvar.global(c) || c })]
392
- ];
393
- const appearances = [
394
- ["visible", { visibility: "visible" }],
395
- ["invisible", { visibility: "hidden" }],
396
- ["backface-visible", { "backface-visibility": "visible" }],
397
- ["backface-hidden", { "backface-visibility": "hidden" }],
398
- ...colors.makeGlobalStaticRules("backface", "backface-visibility")
399
- ];
400
- const cursors = [
401
- [/^cursor-(.+)$/, ([, c]) => ({ cursor: colors.h.bracket.cssvar.global(c) })],
402
- ...cursorValues.map((v) => [`cursor-${v}`, { cursor: v }])
403
- ];
404
- const contains = [
405
- [/^contain-(.*)$/, ([, d]) => {
406
- if (colors.h.bracket(d) != null) {
407
- return {
408
- contain: colors.h.bracket(d).split(" ").map((e) => colors.h.cssvar.fraction(e) ?? e).join(" ")
409
- };
410
- }
411
- return containValues.includes(d) ? { contain: d } : void 0;
412
- }]
413
- ];
414
- const pointerEvents = [
415
- ["pointer-events-auto", { "pointer-events": "auto" }],
416
- ["pointer-events-none", { "pointer-events": "none" }],
417
- ...colors.makeGlobalStaticRules("pointer-events")
418
- ];
419
- const resizes = [
420
- ["resize-x", { resize: "horizontal" }],
421
- ["resize-y", { resize: "vertical" }],
422
- ["resize", { resize: "both" }],
423
- ["resize-none", { resize: "none" }],
424
- ...colors.makeGlobalStaticRules("resize")
425
- ];
426
- const userSelects = [
427
- ["select-auto", { "-webkit-user-select": "auto", "user-select": "auto" }],
428
- ["select-all", { "-webkit-user-select": "all", "user-select": "all" }],
429
- ["select-text", { "-webkit-user-select": "text", "user-select": "text" }],
430
- ["select-none", { "-webkit-user-select": "none", "user-select": "none" }],
431
- ...colors.makeGlobalStaticRules("select", "user-select")
432
- ];
433
- const whitespaces = [
434
- [
435
- /^(?:whitespace-|ws-)([-\w]+)$/,
436
- ([, v]) => ["normal", "nowrap", "pre", "pre-line", "pre-wrap", "break-spaces", ...colors.globalKeywords].includes(v) ? { "white-space": v } : void 0,
437
- { autocomplete: "(whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap|break-spaces)" }
438
- ]
439
- ];
440
- const contentVisibility = [
441
- [/^intrinsic-size-(.+)$/, ([, d]) => ({ "contain-intrinsic-size": colors.h.bracket.cssvar.global.fraction.rem(d) }), { autocomplete: "intrinsic-size-<num>" }],
442
- ["content-visibility-visible", { "content-visibility": "visible" }],
443
- ["content-visibility-hidden", { "content-visibility": "hidden" }],
444
- ["content-visibility-auto", { "content-visibility": "auto" }],
445
- ...colors.makeGlobalStaticRules("content-visibility")
446
- ];
447
- const contents = [
448
- [/^content-(.+)$/, ([, v]) => ({ content: colors.h.bracket.cssvar(v) })],
449
- ["content-empty", { content: '""' }],
450
- ["content-none", { content: "none" }]
451
- ];
452
- const breaks = [
453
- ["break-normal", { "overflow-wrap": "normal", "word-break": "normal" }],
454
- ["break-words", { "overflow-wrap": "break-word" }],
455
- ["break-all", { "word-break": "break-all" }],
456
- ["break-keep", { "word-break": "keep-all" }],
457
- ["break-anywhere", { "overflow-wrap": "anywhere" }]
458
- ];
459
- const textWraps = [
460
- ["text-wrap", { "text-wrap": "wrap" }],
461
- ["text-nowrap", { "text-wrap": "nowrap" }],
462
- ["text-balance", { "text-wrap": "balance" }]
463
- ];
464
- const textOverflows = [
465
- ["truncate", { "overflow": "hidden", "text-overflow": "ellipsis", "white-space": "nowrap" }],
466
- ["text-truncate", { "overflow": "hidden", "text-overflow": "ellipsis", "white-space": "nowrap" }],
467
- ["text-ellipsis", { "text-overflow": "ellipsis" }],
468
- ["text-clip", { "text-overflow": "clip" }]
469
- ];
470
- const textTransforms = [
471
- ["case-upper", { "text-transform": "uppercase" }],
472
- ["case-lower", { "text-transform": "lowercase" }],
473
- ["case-capital", { "text-transform": "capitalize" }],
474
- ["case-normal", { "text-transform": "none" }],
475
- ...colors.makeGlobalStaticRules("case", "text-transform")
476
- ];
477
- const fontStyles = [
478
- ["italic", { "font-style": "italic" }],
479
- ["not-italic", { "font-style": "normal" }],
480
- ["font-italic", { "font-style": "italic" }],
481
- ["font-not-italic", { "font-style": "normal" }],
482
- ["oblique", { "font-style": "oblique" }],
483
- ["not-oblique", { "font-style": "normal" }],
484
- ["font-oblique", { "font-style": "oblique" }],
485
- ["font-not-oblique", { "font-style": "normal" }]
486
- ];
487
- const fontSmoothings = [
488
- ["antialiased", {
489
- "-webkit-font-smoothing": "antialiased",
490
- "-moz-osx-font-smoothing": "grayscale",
491
- "font-smoothing": "grayscale"
492
- }],
493
- ["subpixel-antialiased", {
494
- "-webkit-font-smoothing": "auto",
495
- "-moz-osx-font-smoothing": "auto",
496
- "font-smoothing": "auto"
497
- }]
498
- ];
499
-
500
- const ringBase = {
501
- "--un-ring-inset": varEmpty,
502
- "--un-ring-offset-width": "0px",
503
- "--un-ring-offset-color": "#fff",
504
- "--un-ring-width": "0px",
505
- "--un-ring-color": "rgba(147,197,253,0.5)",
506
- "--un-shadow": "0 0 rgba(0,0,0,0)"
507
- };
508
- const rings = [
509
- [/^ring(?:-(.+))?$/, ([, d], { theme }) => {
510
- const value = theme.ringWidth?.[d || "DEFAULT"] ?? colors.h.px(d || "1");
511
- if (value) {
512
- return {
513
- "--un-ring-width": value,
514
- "--un-ring-offset-shadow": "var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)",
515
- "--un-ring-shadow": "var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color)",
516
- "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
517
- };
518
- }
519
- }, { autocomplete: "ring-$ringWidth" }],
520
- [/^ring-(?:width-|size-)(.+)$/, ([, d], { theme }) => ({ "--un-ring-width": theme.lineWidth?.[d] ?? colors.h.bracket.cssvar.px(d) }), { autocomplete: "ring-(width|size)-$lineWidth" }],
521
- ["ring-offset", { "--un-ring-offset-width": "1px" }],
522
- [/^ring-offset-(?:width-|size-)?(.+)$/, ([, d], { theme }) => ({ "--un-ring-offset-width": theme.lineWidth?.[d] ?? colors.h.bracket.cssvar.px(d) }), { autocomplete: "ring-offset-(width|size)-$lineWidth" }],
523
- [/^ring-(.+)$/, colors.colorResolver("--un-ring-color", "ring"), { autocomplete: "ring-$colors" }],
524
- [/^ring-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-opacity": colors.h.bracket.percent.cssvar(opacity) }), { autocomplete: "ring-(op|opacity)-<percent>" }],
525
- [/^ring-offset-(.+)$/, colors.colorResolver("--un-ring-offset-color", "ring-offset"), { autocomplete: "ring-offset-$colors" }],
526
- [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-offset-opacity": colors.h.bracket.percent.cssvar(opacity) }), { autocomplete: "ring-offset-(op|opacity)-<percent>" }],
527
- ["ring-inset", { "--un-ring-inset": "inset" }]
528
- ];
529
-
530
- const boxShadowsBase = {
531
- "--un-ring-offset-shadow": "0 0 rgba(0,0,0,0)",
532
- "--un-ring-shadow": "0 0 rgba(0,0,0,0)",
533
- "--un-shadow-inset": varEmpty,
534
- "--un-shadow": "0 0 rgba(0,0,0,0)"
535
- };
536
- const boxShadows = [
537
- [/^shadow(?:-(.+))?$/, (match, context) => {
538
- const [, d] = match;
539
- const { theme } = context;
540
- const v = theme.boxShadow?.[d || "DEFAULT"];
541
- const c = d ? colors.h.bracket.cssvar(d) : void 0;
542
- if ((v != null || c != null) && !colors.hasParseableColor(c, theme)) {
543
- return {
544
- "--un-shadow": colors.colorableShadows(v || c, "--un-shadow-color").join(","),
545
- "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
546
- };
547
- }
548
- return colors.colorResolver("--un-shadow-color", "shadow")(match, context);
549
- }, { autocomplete: ["shadow-$colors", "shadow-$boxShadow"] }],
550
- [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": colors.h.bracket.percent.cssvar(opacity) }), { autocomplete: "shadow-(op|opacity)-<percent>" }],
551
- ["shadow-inset", { "--un-shadow-inset": "inset" }]
552
- ];
553
-
554
- const transformValues = [
555
- "translate",
556
- "rotate",
557
- "scale"
558
- ];
559
- const transformCpu = [
560
- "translateX(var(--un-translate-x))",
561
- "translateY(var(--un-translate-y))",
562
- "translateZ(var(--un-translate-z))",
563
- "rotate(var(--un-rotate))",
564
- "rotateX(var(--un-rotate-x))",
565
- "rotateY(var(--un-rotate-y))",
566
- "rotateZ(var(--un-rotate-z))",
567
- "skewX(var(--un-skew-x))",
568
- "skewY(var(--un-skew-y))",
569
- "scaleX(var(--un-scale-x))",
570
- "scaleY(var(--un-scale-y))",
571
- "scaleZ(var(--un-scale-z))"
572
- ].join(" ");
573
- const transformGpu = [
574
- "translate3d(var(--un-translate-x), var(--un-translate-y), var(--un-translate-z))",
575
- "rotate(var(--un-rotate))",
576
- "rotateX(var(--un-rotate-x))",
577
- "rotateY(var(--un-rotate-y))",
578
- "rotateZ(var(--un-rotate-z))",
579
- "skewX(var(--un-skew-x))",
580
- "skewY(var(--un-skew-y))",
581
- "scaleX(var(--un-scale-x))",
582
- "scaleY(var(--un-scale-y))",
583
- "scaleZ(var(--un-scale-z))"
584
- ].join(" ");
585
- const transformBase = {
586
- "--un-rotate": 0,
587
- "--un-rotate-x": 0,
588
- "--un-rotate-y": 0,
589
- "--un-rotate-z": 0,
590
- "--un-scale-x": 1,
591
- "--un-scale-y": 1,
592
- "--un-scale-z": 1,
593
- "--un-skew-x": 0,
594
- "--un-skew-y": 0,
595
- "--un-translate-x": 0,
596
- "--un-translate-y": 0,
597
- "--un-translate-z": 0
598
- };
599
- const transforms = [
600
- [/^(?:transform-)?origin-(.+)$/, ([, s]) => ({ "transform-origin": colors.positionMap[s] ?? colors.h.bracket.cssvar(s) }), { autocomplete: [`transform-origin-(${Object.keys(colors.positionMap).join("|")})`, `origin-(${Object.keys(colors.positionMap).join("|")})`] }],
601
- [/^(?:transform-)?perspect(?:ive)?-(.+)$/, ([, s]) => {
602
- const v = colors.h.bracket.cssvar.px.numberWithUnit(s);
603
- if (v != null) {
604
- return {
605
- "-webkit-perspective": v,
606
- "perspective": v
607
- };
608
- }
609
- }],
610
- [/^(?:transform-)?perspect(?:ive)?-origin-(.+)$/, ([, s]) => {
611
- const v = colors.h.bracket.cssvar(s) ?? (s.length >= 3 ? colors.positionMap[s] : void 0);
612
- if (v != null) {
613
- return {
614
- "-webkit-perspective-origin": v,
615
- "perspective-origin": v
616
- };
617
- }
618
- }],
619
- [/^(?:transform-)?translate-()(.+)$/, handleTranslate],
620
- [/^(?:transform-)?translate-([xyz])-(.+)$/, handleTranslate],
621
- [/^(?:transform-)?rotate-()(.+)$/, handleRotate],
622
- [/^(?:transform-)?rotate-([xyz])-(.+)$/, handleRotate],
623
- [/^(?:transform-)?skew-()(.+)$/, handleSkew],
624
- [/^(?:transform-)?skew-([xy])-(.+)$/, handleSkew, { autocomplete: ["transform-skew-(x|y)-<percent>"] }],
625
- [/^(?:transform-)?scale-()(.+)$/, handleScale],
626
- [/^(?:transform-)?scale-([xyz])-(.+)$/, handleScale, { autocomplete: [`transform-(${transformValues.join("|")})-<percent>`, `transform-(${transformValues.join("|")})-(x|y|z)-<percent>`] }],
627
- [/^(?:transform-)?preserve-3d$/, () => ({ "transform-style": "preserve-3d" })],
628
- [/^(?:transform-)?preserve-flat$/, () => ({ "transform-style": "flat" })],
629
- ["transform", { transform: transformCpu }],
630
- ["transform-cpu", { transform: transformCpu }],
631
- ["transform-gpu", { transform: transformGpu }],
632
- ["transform-none", { transform: "none" }],
633
- ...colors.makeGlobalStaticRules("transform")
634
- ];
635
- function handleTranslate([, d, b], { theme }) {
636
- const v = theme.spacing?.[b] ?? colors.h.bracket.cssvar.fraction.rem(b);
637
- if (v != null) {
638
- return [
639
- ...colors.xyzMap[d].map((i) => [`--un-translate${i}`, v]),
640
- ["transform", transformCpu]
641
- ];
642
- }
643
- }
644
- function handleScale([, d, b]) {
645
- const v = colors.h.bracket.cssvar.fraction.percent(b);
646
- if (v != null) {
647
- return [
648
- ...colors.xyzMap[d].map((i) => [`--un-scale${i}`, v]),
649
- ["transform", transformCpu]
650
- ];
651
- }
652
- }
653
- function handleRotate([, d = "", b]) {
654
- const v = colors.h.bracket.cssvar.degree(b);
655
- if (v != null) {
656
- if (d) {
657
- return {
658
- "--un-rotate": 0,
659
- [`--un-rotate-${d}`]: v,
660
- "transform": transformCpu
661
- };
662
- } else {
663
- return {
664
- "--un-rotate-x": 0,
665
- "--un-rotate-y": 0,
666
- "--un-rotate-z": 0,
667
- "--un-rotate": v,
668
- "transform": transformCpu
669
- };
670
- }
671
- }
672
- }
673
- function handleSkew([, d, b]) {
674
- const v = colors.h.bracket.cssvar.degree(b);
675
- if (v != null) {
676
- return [
677
- ...colors.xyzMap[d].map((i) => [`--un-skew${i}`, v]),
678
- ["transform", transformCpu]
679
- ];
680
- }
681
- }
682
-
683
- exports.alignments = alignments;
684
- exports.appearance = appearance;
685
- exports.appearances = appearances;
686
- exports.bgColors = bgColors;
687
- exports.borderStyles = borderStyles;
688
- exports.borders = borders;
689
- exports.boxShadows = boxShadows;
690
- exports.boxShadowsBase = boxShadowsBase;
691
- exports.boxSizing = boxSizing;
692
- exports.breaks = breaks;
693
- exports.colorScheme = colorScheme;
694
- exports.contains = contains;
695
- exports.contentVisibility = contentVisibility;
696
- exports.contents = contents;
697
- exports.cursors = cursors;
698
- exports.displays = displays;
699
- exports.flexGridJustifiesAlignments = flexGridJustifiesAlignments;
700
- exports.floats = floats;
701
- exports.fontSmoothings = fontSmoothings;
702
- exports.fontStyles = fontStyles;
703
- exports.handlerBorderStyle = handlerBorderStyle;
704
- exports.insets = insets;
705
- exports.justifies = justifies;
706
- exports.opacity = opacity;
707
- exports.orders = orders;
708
- exports.outline = outline;
709
- exports.overflows = overflows;
710
- exports.placements = placements;
711
- exports.pointerEvents = pointerEvents;
712
- exports.positions = positions;
713
- exports.resizes = resizes;
714
- exports.ringBase = ringBase;
715
- exports.rings = rings;
716
- exports.textAligns = textAligns;
717
- exports.textColors = textColors;
718
- exports.textDecorations = textDecorations;
719
- exports.textOverflows = textOverflows;
720
- exports.textTransforms = textTransforms;
721
- exports.textWraps = textWraps;
722
- exports.transformBase = transformBase;
723
- exports.transforms = transforms;
724
- exports.transitions = transitions;
725
- exports.userSelects = userSelects;
726
- exports.varEmpty = varEmpty;
727
- exports.verticalAligns = verticalAligns;
728
- exports.whitespaces = whitespaces;
729
- exports.willChange = willChange;
730
- exports.zIndexes = zIndexes;