@unocss/preset-mini 0.55.0 → 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.
- package/dist/colors.cjs +360 -6
- package/dist/{colors-dabdd21f.d.ts → colors.d.cts} +3 -2
- package/dist/colors.d.mts +354 -0
- package/dist/colors.d.ts +353 -2
- package/dist/colors.mjs +361 -1
- package/dist/index.cjs +12 -12
- package/dist/index.d.cts +69 -0
- package/dist/index.d.mts +69 -0
- package/dist/index.d.ts +6 -6
- package/dist/index.mjs +9 -10
- package/dist/rules.cjs +928 -48
- package/dist/rules.d.cts +133 -0
- package/dist/rules.d.mts +133 -0
- package/dist/rules.d.ts +1 -1
- package/dist/rules.mjs +891 -4
- package/dist/{default-1f25a0ae.d.ts → shared/preset-mini.024bdcea.d.ts} +1 -1
- package/dist/shared/preset-mini.0a9763df.d.mts +721 -0
- package/dist/shared/preset-mini.0fac4963.mjs +320 -0
- package/dist/shared/preset-mini.5bfee53b.cjs +344 -0
- package/dist/shared/preset-mini.5f54784f.d.mts +71 -0
- package/dist/shared/preset-mini.5f54784f.d.ts +71 -0
- package/dist/shared/preset-mini.aa3a264b.d.cts +67 -0
- package/dist/shared/{preset-mini.a21c5071.cjs → preset-mini.b4ad509c.cjs} +12 -8
- package/dist/shared/preset-mini.d69a12a5.d.cts +721 -0
- package/dist/{utilities-d496540e.d.ts → shared/preset-mini.e93c20db.d.ts} +1 -1
- package/dist/shared/{preset-mini.6c1c8016.mjs → preset-mini.f1fe435e.mjs} +13 -9
- package/dist/shared/preset-mini.fc26b619.d.mts +67 -0
- package/dist/theme.cjs +308 -34
- package/dist/theme.d.cts +264 -0
- package/dist/theme.d.mts +264 -0
- package/dist/theme.d.ts +5 -5
- package/dist/theme.mjs +284 -4
- package/dist/utils.cjs +81 -10
- package/dist/utils.d.cts +83 -0
- package/dist/utils.d.mts +83 -0
- package/dist/utils.d.ts +18 -18
- package/dist/utils.mjs +81 -3
- package/dist/variants.cjs +737 -33
- package/dist/variants.d.cts +46 -0
- package/dist/variants.d.mts +46 -0
- package/dist/variants.d.ts +4 -4
- package/dist/variants.mjs +714 -4
- package/package.json +3 -3
- package/dist/shared/preset-mini.0131b915.mjs +0 -704
- package/dist/shared/preset-mini.1c66bf79.mjs +0 -361
- package/dist/shared/preset-mini.74f9d55e.mjs +0 -80
- package/dist/shared/preset-mini.811eb23d.mjs +0 -681
- package/dist/shared/preset-mini.8dd73081.mjs +0 -452
- package/dist/shared/preset-mini.9d93761b.cjs +0 -729
- package/dist/shared/preset-mini.b8d9397e.cjs +0 -471
- package/dist/shared/preset-mini.ce5169f2.cjs +0 -730
- package/dist/shared/preset-mini.d778b487.cjs +0 -85
- package/dist/shared/preset-mini.de3bd9f7.mjs +0 -284
- package/dist/shared/preset-mini.e078d7da.cjs +0 -313
- package/dist/shared/preset-mini.f3fc54d2.cjs +0 -363
- /package/dist/{types-d991ba46.d.ts → shared/preset-mini.5f54784f.d.cts} +0 -0
|
@@ -1,471 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
const transform = require('./preset-mini.ce5169f2.cjs');
|
|
4
|
-
const colors = require('./preset-mini.a21c5071.cjs');
|
|
5
|
-
const core = require('@unocss/core');
|
|
6
|
-
|
|
7
|
-
const containerParent = [
|
|
8
|
-
[/^@container(?:\/(\w+))?(?:-(normal))?$/, ([, l, v]) => {
|
|
9
|
-
core.warnOnce("The container query rule is experimental and may not follow semver.");
|
|
10
|
-
return {
|
|
11
|
-
"container-type": v ?? "inline-size",
|
|
12
|
-
"container-name": l
|
|
13
|
-
};
|
|
14
|
-
}]
|
|
15
|
-
];
|
|
16
|
-
|
|
17
|
-
const flex = [
|
|
18
|
-
["flex", { display: "flex" }],
|
|
19
|
-
["inline-flex", { display: "inline-flex" }],
|
|
20
|
-
["flex-inline", { display: "inline-flex" }],
|
|
21
|
-
[/^flex-(.*)$/, ([, d]) => ({ flex: colors.h.bracket(d) != null ? colors.h.bracket(d).split(" ").map((e) => colors.h.cssvar.fraction(e) ?? e).join(" ") : colors.h.cssvar.fraction(d) })],
|
|
22
|
-
["flex-1", { flex: "1 1 0%" }],
|
|
23
|
-
["flex-auto", { flex: "1 1 auto" }],
|
|
24
|
-
["flex-initial", { flex: "0 1 auto" }],
|
|
25
|
-
["flex-none", { flex: "none" }],
|
|
26
|
-
[/^(?:flex-)?shrink(?:-(.*))?$/, ([, d = ""]) => ({ "flex-shrink": colors.h.bracket.cssvar.number(d) ?? 1 }), { autocomplete: ["flex-shrink-<num>", "shrink-<num>"] }],
|
|
27
|
-
[/^(?:flex-)?grow(?:-(.*))?$/, ([, d = ""]) => ({ "flex-grow": colors.h.bracket.cssvar.number(d) ?? 1 }), { autocomplete: ["flex-grow-<num>", "grow-<num>"] }],
|
|
28
|
-
[/^(?:flex-)?basis-(.+)$/, ([, d], { theme }) => ({ "flex-basis": theme.spacing?.[d] ?? colors.h.bracket.cssvar.auto.fraction.rem(d) }), { autocomplete: ["flex-basis-$spacing", "basis-$spacing"] }],
|
|
29
|
-
["flex-row", { "flex-direction": "row" }],
|
|
30
|
-
["flex-row-reverse", { "flex-direction": "row-reverse" }],
|
|
31
|
-
["flex-col", { "flex-direction": "column" }],
|
|
32
|
-
["flex-col-reverse", { "flex-direction": "column-reverse" }],
|
|
33
|
-
["flex-wrap", { "flex-wrap": "wrap" }],
|
|
34
|
-
["flex-wrap-reverse", { "flex-wrap": "wrap-reverse" }],
|
|
35
|
-
["flex-nowrap", { "flex-wrap": "nowrap" }]
|
|
36
|
-
];
|
|
37
|
-
|
|
38
|
-
function handleLineHeight(s, theme) {
|
|
39
|
-
return theme.lineHeight?.[s] || colors.h.bracket.cssvar.global.rem(s);
|
|
40
|
-
}
|
|
41
|
-
const fonts = [
|
|
42
|
-
[
|
|
43
|
-
/^text-(.+)$/,
|
|
44
|
-
([, s = "base"], { theme }) => {
|
|
45
|
-
const [size, leading] = colors.splitShorthand(s, "length");
|
|
46
|
-
const sizePairs = core.toArray(theme.fontSize?.[size]);
|
|
47
|
-
const lineHeight = leading ? handleLineHeight(leading, theme) : void 0;
|
|
48
|
-
if (sizePairs?.[0]) {
|
|
49
|
-
const [fontSize2, height] = sizePairs;
|
|
50
|
-
return {
|
|
51
|
-
"font-size": fontSize2,
|
|
52
|
-
"line-height": lineHeight ?? height ?? "1"
|
|
53
|
-
};
|
|
54
|
-
}
|
|
55
|
-
const fontSize = colors.h.bracketOfLength.rem(size);
|
|
56
|
-
if (lineHeight && fontSize) {
|
|
57
|
-
return {
|
|
58
|
-
"font-size": fontSize,
|
|
59
|
-
"line-height": lineHeight
|
|
60
|
-
};
|
|
61
|
-
}
|
|
62
|
-
return { "font-size": colors.h.bracketOfLength.rem(s) };
|
|
63
|
-
},
|
|
64
|
-
{ autocomplete: "text-$fontSize" }
|
|
65
|
-
],
|
|
66
|
-
[/^(?:text|font)-size-(.+)$/, ([, s], { theme }) => {
|
|
67
|
-
const themed = core.toArray(theme.fontSize?.[s]);
|
|
68
|
-
const size = themed?.[0] ?? colors.h.bracket.cssvar.global.rem(s);
|
|
69
|
-
if (size != null)
|
|
70
|
-
return { "font-size": size };
|
|
71
|
-
}, { autocomplete: "text-size-$fontSize" }],
|
|
72
|
-
[
|
|
73
|
-
/^(?:font|fw)-?([^-]+)$/,
|
|
74
|
-
([, s], { theme }) => ({ "font-weight": theme.fontWeight?.[s] || colors.h.bracket.global.number(s) }),
|
|
75
|
-
{
|
|
76
|
-
autocomplete: [
|
|
77
|
-
"(font|fw)-(100|200|300|400|500|600|700|800|900)",
|
|
78
|
-
"(font|fw)-$fontWeight"
|
|
79
|
-
]
|
|
80
|
-
}
|
|
81
|
-
],
|
|
82
|
-
[
|
|
83
|
-
/^(?:font-)?(?:leading|lh|line-height)-(.+)$/,
|
|
84
|
-
([, s], { theme }) => ({ "line-height": handleLineHeight(s, theme) }),
|
|
85
|
-
{ autocomplete: "(leading|lh|line-height)-$lineHeight" }
|
|
86
|
-
],
|
|
87
|
-
["font-synthesis-weight", { "font-synthesis": "weight" }],
|
|
88
|
-
["font-synthesis-style", { "font-synthesis": "style" }],
|
|
89
|
-
["font-synthesis-small-caps", { "font-synthesis": "small-caps" }],
|
|
90
|
-
["font-synthesis-none", { "font-synthesis": "none" }],
|
|
91
|
-
[/^font-synthesis-(.+)$/, ([, s]) => ({ "font-synthesis": colors.h.bracket.cssvar.global(s) })],
|
|
92
|
-
[
|
|
93
|
-
/^(?:font-)?tracking-(.+)$/,
|
|
94
|
-
([, s], { theme }) => ({ "letter-spacing": theme.letterSpacing?.[s] || colors.h.bracket.cssvar.global.rem(s) }),
|
|
95
|
-
{ autocomplete: "tracking-$letterSpacing" }
|
|
96
|
-
],
|
|
97
|
-
[
|
|
98
|
-
/^(?:font-)?word-spacing-(.+)$/,
|
|
99
|
-
([, s], { theme }) => ({ "word-spacing": theme.wordSpacing?.[s] || colors.h.bracket.cssvar.global.rem(s) }),
|
|
100
|
-
{ autocomplete: "word-spacing-$wordSpacing" }
|
|
101
|
-
],
|
|
102
|
-
[
|
|
103
|
-
/^font-(.+)$/,
|
|
104
|
-
([, d], { theme }) => ({ "font-family": theme.fontFamily?.[d] || colors.h.bracket.cssvar.global(d) }),
|
|
105
|
-
{ autocomplete: "font-$fontFamily" }
|
|
106
|
-
]
|
|
107
|
-
];
|
|
108
|
-
const tabSizes = [
|
|
109
|
-
[/^tab(?:-(.+))?$/, ([, s]) => {
|
|
110
|
-
const v = colors.h.bracket.cssvar.global.number(s || "4");
|
|
111
|
-
if (v != null) {
|
|
112
|
-
return {
|
|
113
|
-
"-moz-tab-size": v,
|
|
114
|
-
"-o-tab-size": v,
|
|
115
|
-
"tab-size": v
|
|
116
|
-
};
|
|
117
|
-
}
|
|
118
|
-
}]
|
|
119
|
-
];
|
|
120
|
-
const textIndents = [
|
|
121
|
-
[/^indent(?:-(.+))?$/, ([, s], { theme }) => ({ "text-indent": theme.textIndent?.[s || "DEFAULT"] || colors.h.bracket.cssvar.global.fraction.rem(s) }), { autocomplete: "indent-$textIndent" }]
|
|
122
|
-
];
|
|
123
|
-
const textStrokes = [
|
|
124
|
-
[/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => ({ "-webkit-text-stroke-width": theme.textStrokeWidth?.[s || "DEFAULT"] || colors.h.bracket.cssvar.px(s) }), { autocomplete: "text-stroke-$textStrokeWidth" }],
|
|
125
|
-
[/^text-stroke-(.+)$/, colors.colorResolver("-webkit-text-stroke-color", "text-stroke"), { autocomplete: "text-stroke-$colors" }],
|
|
126
|
-
[/^text-stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-stroke-opacity": colors.h.bracket.percent.cssvar(opacity) }), { autocomplete: "text-stroke-(op|opacity)-<percent>" }]
|
|
127
|
-
];
|
|
128
|
-
const textShadows = [
|
|
129
|
-
[/^text-shadow(?:-(.+))?$/, ([, s], { theme }) => {
|
|
130
|
-
const v = theme.textShadow?.[s || "DEFAULT"];
|
|
131
|
-
if (v != null) {
|
|
132
|
-
return {
|
|
133
|
-
"--un-text-shadow": colors.colorableShadows(v, "--un-text-shadow-color").join(","),
|
|
134
|
-
"text-shadow": "var(--un-text-shadow)"
|
|
135
|
-
};
|
|
136
|
-
}
|
|
137
|
-
return { "text-shadow": colors.h.bracket.cssvar.global(s) };
|
|
138
|
-
}, { autocomplete: "text-shadow-$textShadow" }],
|
|
139
|
-
[/^text-shadow-color-(.+)$/, colors.colorResolver("--un-text-shadow-color", "text-shadow"), { autocomplete: "text-shadow-color-$colors" }],
|
|
140
|
-
[/^text-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-shadow-opacity": colors.h.bracket.percent.cssvar(opacity) }), { autocomplete: "text-shadow-color-(op|opacity)-<percent>" }]
|
|
141
|
-
];
|
|
142
|
-
|
|
143
|
-
const directions = {
|
|
144
|
-
"": "",
|
|
145
|
-
"x": "column-",
|
|
146
|
-
"y": "row-"
|
|
147
|
-
};
|
|
148
|
-
function handleGap([, d = "", s], { theme }) {
|
|
149
|
-
const v = theme.spacing?.[s] ?? colors.h.bracket.cssvar.global.rem(s);
|
|
150
|
-
if (v != null) {
|
|
151
|
-
return {
|
|
152
|
-
[`${directions[d]}gap`]: v
|
|
153
|
-
};
|
|
154
|
-
}
|
|
155
|
-
}
|
|
156
|
-
const gaps = [
|
|
157
|
-
[/^(?:flex-|grid-)?gap-?()(.+)$/, handleGap, { autocomplete: ["gap-$spacing", "gap-<num>"] }],
|
|
158
|
-
[/^(?:flex-|grid-)?gap-([xy])-?(.+)$/, handleGap, { autocomplete: ["gap-(x|y)-$spacing", "gap-(x|y)-<num>"] }]
|
|
159
|
-
];
|
|
160
|
-
|
|
161
|
-
function rowCol(s) {
|
|
162
|
-
return s.replace("col", "column");
|
|
163
|
-
}
|
|
164
|
-
function rowColTheme(s) {
|
|
165
|
-
return s[0] === "r" ? "Row" : "Column";
|
|
166
|
-
}
|
|
167
|
-
function autoDirection(c, theme, prop) {
|
|
168
|
-
const v = theme[`gridAuto${rowColTheme(c)}`]?.[prop];
|
|
169
|
-
if (v != null)
|
|
170
|
-
return v;
|
|
171
|
-
switch (prop) {
|
|
172
|
-
case "min":
|
|
173
|
-
return "min-content";
|
|
174
|
-
case "max":
|
|
175
|
-
return "max-content";
|
|
176
|
-
case "fr":
|
|
177
|
-
return "minmax(0,1fr)";
|
|
178
|
-
}
|
|
179
|
-
return colors.h.bracket.cssvar.auto.rem(prop);
|
|
180
|
-
}
|
|
181
|
-
const grids = [
|
|
182
|
-
["grid", { display: "grid" }],
|
|
183
|
-
["inline-grid", { display: "inline-grid" }],
|
|
184
|
-
[/^(?:grid-)?(row|col)-(.+)$/, ([, c, v], { theme }) => ({
|
|
185
|
-
[`grid-${rowCol(c)}`]: theme[`grid${rowColTheme(c)}`]?.[v] ?? colors.h.bracket.cssvar.auto(v)
|
|
186
|
-
})],
|
|
187
|
-
[/^(?:grid-)?(row|col)-span-(.+)$/, ([, c, s]) => {
|
|
188
|
-
if (s === "full")
|
|
189
|
-
return { [`grid-${rowCol(c)}`]: "1/-1" };
|
|
190
|
-
const v = colors.h.bracket.number(s);
|
|
191
|
-
if (v != null)
|
|
192
|
-
return { [`grid-${rowCol(c)}`]: `span ${v}/span ${v}` };
|
|
193
|
-
}, { autocomplete: ["grid-(row|col)-span-<num>", "(row|col)-span-<num>"] }],
|
|
194
|
-
[/^(?:grid-)?(row|col)-start-(.+)$/, ([, c, v]) => ({ [`grid-${rowCol(c)}-start`]: colors.h.bracket.cssvar(v) ?? v })],
|
|
195
|
-
[/^(?:grid-)?(row|col)-end-(.+)$/, ([, c, v]) => ({ [`grid-${rowCol(c)}-end`]: colors.h.bracket.cssvar(v) ?? v }), { autocomplete: ["grid-(row|col)-(start|end)-<num>"] }],
|
|
196
|
-
[/^(?:grid-)?auto-(rows|cols)-(.+)$/, ([, c, v], { theme }) => ({ [`grid-auto-${rowCol(c)}`]: autoDirection(c, theme, v) }), { autocomplete: ["grid-auto-(rows|cols)-<num>"] }],
|
|
197
|
-
[/^(?:grid-auto-flow|auto-flow|grid-flow)-(.+)$/, ([, v]) => ({ "grid-auto-flow": colors.h.bracket.cssvar(v) })],
|
|
198
|
-
[/^(?: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)"] }],
|
|
199
|
-
[/^grid-(rows|cols)-(.+)$/, ([, c, v], { theme }) => ({
|
|
200
|
-
[`grid-template-${rowCol(c)}`]: theme[`gridTemplate${rowColTheme(c)}`]?.[v] ?? colors.h.bracket.cssvar(v)
|
|
201
|
-
})],
|
|
202
|
-
[/^grid-(rows|cols)-minmax-([\w.-]+)$/, ([, c, d]) => ({ [`grid-template-${rowCol(c)}`]: `repeat(auto-fill,minmax(${d},1fr))` })],
|
|
203
|
-
[/^grid-(rows|cols)-(\d+)$/, ([, c, d]) => ({ [`grid-template-${rowCol(c)}`]: `repeat(${d},minmax(0,1fr))` }), { autocomplete: ["grid-(rows|cols)-<num>", "grid-(rows|cols)-none"] }],
|
|
204
|
-
[/^grid-area(s)?-(.+)$/, ([, s, v]) => {
|
|
205
|
-
if (s != null)
|
|
206
|
-
return { "grid-template-areas": colors.h.cssvar(v) ?? v.split("-").map((s2) => `"${colors.h.bracket(s2)}"`).join(" ") };
|
|
207
|
-
return { "grid-area": colors.h.bracket.cssvar(v) };
|
|
208
|
-
}],
|
|
209
|
-
["grid-rows-none", { "grid-template-rows": "none" }],
|
|
210
|
-
["grid-cols-none", { "grid-template-columns": "none" }]
|
|
211
|
-
];
|
|
212
|
-
|
|
213
|
-
const sizeMapping = {
|
|
214
|
-
h: "height",
|
|
215
|
-
w: "width",
|
|
216
|
-
inline: "inline-size",
|
|
217
|
-
block: "block-size"
|
|
218
|
-
};
|
|
219
|
-
function getPropName(minmax, hw) {
|
|
220
|
-
return `${minmax || ""}${sizeMapping[hw]}`;
|
|
221
|
-
}
|
|
222
|
-
function getSizeValue(minmax, hw, theme, prop) {
|
|
223
|
-
const str = getPropName(minmax, hw).replace(/-(\w)/g, (_, p) => p.toUpperCase());
|
|
224
|
-
const v = theme[str]?.[prop];
|
|
225
|
-
if (v != null)
|
|
226
|
-
return v;
|
|
227
|
-
switch (prop) {
|
|
228
|
-
case "fit":
|
|
229
|
-
case "max":
|
|
230
|
-
case "min":
|
|
231
|
-
return `${prop}-content`;
|
|
232
|
-
}
|
|
233
|
-
return colors.h.bracket.cssvar.global.auto.fraction.rem(prop);
|
|
234
|
-
}
|
|
235
|
-
const sizes = [
|
|
236
|
-
[/^(?:size-)?(min-|max-)?([wh])-?(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) })],
|
|
237
|
-
[/^(?:size-)?(min-|max-)?(block|inline)-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) }), {
|
|
238
|
-
autocomplete: [
|
|
239
|
-
"(w|h)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
|
|
240
|
-
"(block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
|
|
241
|
-
"(max|min)-(w|h|block|inline)",
|
|
242
|
-
"(max|min)-(w|h|block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
|
|
243
|
-
"(w|h)-full",
|
|
244
|
-
"(max|min)-(w|h)-full"
|
|
245
|
-
]
|
|
246
|
-
}],
|
|
247
|
-
[/^(?:size-)?(min-|max-)?(h)-screen-(.+)$/, ([, m, w, s], context) => ({ [getPropName(m, w)]: colors.resolveVerticalBreakpoints(context)?.[s] })],
|
|
248
|
-
[/^(?:size-)?(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], context) => ({ [getPropName(m, w)]: colors.resolveBreakpoints(context)?.[s] }), {
|
|
249
|
-
autocomplete: [
|
|
250
|
-
"(w|h)-screen",
|
|
251
|
-
"(min|max)-(w|h)-screen",
|
|
252
|
-
"h-screen-$verticalBreakpoints",
|
|
253
|
-
"(min|max)-h-screen-$verticalBreakpoints",
|
|
254
|
-
"w-screen-$breakpoints",
|
|
255
|
-
"(min|max)-w-screen-$breakpoints"
|
|
256
|
-
]
|
|
257
|
-
}]
|
|
258
|
-
];
|
|
259
|
-
function getAspectRatio(prop) {
|
|
260
|
-
if (/^\d+\/\d+$/.test(prop))
|
|
261
|
-
return prop;
|
|
262
|
-
switch (prop) {
|
|
263
|
-
case "square":
|
|
264
|
-
return "1/1";
|
|
265
|
-
case "video":
|
|
266
|
-
return "16/9";
|
|
267
|
-
}
|
|
268
|
-
return colors.h.bracket.cssvar.global.auto.number(prop);
|
|
269
|
-
}
|
|
270
|
-
const aspectRatio = [
|
|
271
|
-
[/^(?:size-)?aspect-(?:ratio-)?(.+)$/, ([, d]) => ({ "aspect-ratio": getAspectRatio(d) }), { autocomplete: ["aspect-(square|video|ratio)", "aspect-ratio-(square|video)"] }]
|
|
272
|
-
];
|
|
273
|
-
|
|
274
|
-
const paddings = [
|
|
275
|
-
[/^pa?()-?(-?.+)$/, colors.directionSize("padding"), { autocomplete: ["(m|p)<num>", "(m|p)-<num>"] }],
|
|
276
|
-
[/^p-?xy()()$/, colors.directionSize("padding"), { autocomplete: "(m|p)-(xy)" }],
|
|
277
|
-
[/^p-?([xy])(?:-?(-?.+))?$/, colors.directionSize("padding")],
|
|
278
|
-
[/^p-?([rltbse])(?:-?(-?.+))?$/, colors.directionSize("padding"), { autocomplete: "(m|p)<directions>-<num>" }],
|
|
279
|
-
[/^p-(block|inline)(?:-(-?.+))?$/, colors.directionSize("padding"), { autocomplete: "(m|p)-(block|inline)-<num>" }],
|
|
280
|
-
[/^p-?([bi][se])(?:-?(-?.+))?$/, colors.directionSize("padding"), { autocomplete: "(m|p)-(bs|be|is|ie)-<num>" }]
|
|
281
|
-
];
|
|
282
|
-
const margins = [
|
|
283
|
-
[/^ma?()-?(-?.+)$/, colors.directionSize("margin")],
|
|
284
|
-
[/^m-?xy()()$/, colors.directionSize("margin")],
|
|
285
|
-
[/^m-?([xy])(?:-?(-?.+))?$/, colors.directionSize("margin")],
|
|
286
|
-
[/^m-?([rltbse])(?:-?(-?.+))?$/, colors.directionSize("margin")],
|
|
287
|
-
[/^m-(block|inline)(?:-(-?.+))?$/, colors.directionSize("margin")],
|
|
288
|
-
[/^m-?([bi][se])(?:-?(-?.+))?$/, colors.directionSize("margin")]
|
|
289
|
-
];
|
|
290
|
-
|
|
291
|
-
const variablesAbbrMap = {
|
|
292
|
-
backface: "backface-visibility",
|
|
293
|
-
break: "word-break",
|
|
294
|
-
case: "text-transform",
|
|
295
|
-
content: "align-content",
|
|
296
|
-
fw: "font-weight",
|
|
297
|
-
items: "align-items",
|
|
298
|
-
justify: "justify-content",
|
|
299
|
-
select: "user-select",
|
|
300
|
-
self: "align-self",
|
|
301
|
-
vertical: "vertical-align",
|
|
302
|
-
visible: "visibility",
|
|
303
|
-
whitespace: "white-space",
|
|
304
|
-
ws: "white-space"
|
|
305
|
-
};
|
|
306
|
-
const cssVariables = [
|
|
307
|
-
[/^(.+?)-(\$.+)$/, ([, name, varname]) => {
|
|
308
|
-
const prop = variablesAbbrMap[name];
|
|
309
|
-
if (prop)
|
|
310
|
-
return { [prop]: colors.h.cssvar(varname) };
|
|
311
|
-
}]
|
|
312
|
-
];
|
|
313
|
-
const cssProperty = [
|
|
314
|
-
[/^\[(.*)\]$/, ([_, body]) => {
|
|
315
|
-
if (!body.includes(":"))
|
|
316
|
-
return;
|
|
317
|
-
const [prop, ...rest] = body.split(":");
|
|
318
|
-
const value = rest.join(":");
|
|
319
|
-
if (!isURI(body) && prop.match(/^[a-z-]+$/) && isValidCSSBody(value)) {
|
|
320
|
-
const parsed = colors.h.bracket(`[${value}]`);
|
|
321
|
-
if (parsed)
|
|
322
|
-
return { [prop]: parsed };
|
|
323
|
-
}
|
|
324
|
-
}]
|
|
325
|
-
];
|
|
326
|
-
function isValidCSSBody(body) {
|
|
327
|
-
let i = 0;
|
|
328
|
-
function findUntil(c) {
|
|
329
|
-
while (i < body.length) {
|
|
330
|
-
i += 1;
|
|
331
|
-
const char = body[i];
|
|
332
|
-
if (char === c)
|
|
333
|
-
return true;
|
|
334
|
-
}
|
|
335
|
-
return false;
|
|
336
|
-
}
|
|
337
|
-
for (i = 0; i < body.length; i++) {
|
|
338
|
-
const c = body[i];
|
|
339
|
-
if ("\"`'".includes(c)) {
|
|
340
|
-
if (!findUntil(c))
|
|
341
|
-
return false;
|
|
342
|
-
} else if (c === "(") {
|
|
343
|
-
if (!findUntil(")"))
|
|
344
|
-
return false;
|
|
345
|
-
} else if ("[]{}:".includes(c)) {
|
|
346
|
-
return false;
|
|
347
|
-
}
|
|
348
|
-
}
|
|
349
|
-
return true;
|
|
350
|
-
}
|
|
351
|
-
function isURI(declaration) {
|
|
352
|
-
if (!declaration.includes("://"))
|
|
353
|
-
return false;
|
|
354
|
-
try {
|
|
355
|
-
return new URL(declaration).host !== "";
|
|
356
|
-
} catch (err) {
|
|
357
|
-
return false;
|
|
358
|
-
}
|
|
359
|
-
}
|
|
360
|
-
|
|
361
|
-
const questionMark = [
|
|
362
|
-
[
|
|
363
|
-
/^(where|\?)$/,
|
|
364
|
-
(_, { constructCSS, generator }) => {
|
|
365
|
-
if (generator.userConfig.envMode === "dev")
|
|
366
|
-
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}}
|
|
367
|
-
${constructCSS({ animation: "__un_qm 0.5s ease-in-out alternate infinite" })}`;
|
|
368
|
-
}
|
|
369
|
-
]
|
|
370
|
-
];
|
|
371
|
-
|
|
372
|
-
const svgUtilities = [
|
|
373
|
-
[/^fill-(.+)$/, colors.colorResolver("fill", "fill"), { autocomplete: "fill-$colors" }],
|
|
374
|
-
[/^fill-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-fill-opacity": colors.h.bracket.percent.cssvar(opacity) }), { autocomplete: "fill-(op|opacity)-<percent>" }],
|
|
375
|
-
["fill-none", { fill: "none" }],
|
|
376
|
-
[/^stroke-(?:width-|size-)?(.+)$/, ([, s], { theme }) => ({ "stroke-width": theme.lineWidth?.[s] ?? colors.h.bracket.cssvar.fraction.px.number(s) }), { autocomplete: ["stroke-width-$lineWidth", "stroke-size-$lineWidth"] }],
|
|
377
|
-
[/^stroke-dash-(.+)$/, ([, s]) => ({ "stroke-dasharray": colors.h.bracket.cssvar.number(s) }), { autocomplete: "stroke-dash-<num>" }],
|
|
378
|
-
[/^stroke-offset-(.+)$/, ([, s], { theme }) => ({ "stroke-dashoffset": theme.lineWidth?.[s] ?? colors.h.bracket.cssvar.px.numberWithUnit(s) }), { autocomplete: "stroke-offset-$lineWidth" }],
|
|
379
|
-
[/^stroke-(.+)$/, colors.colorResolver("stroke", "stroke"), { autocomplete: "stroke-$colors" }],
|
|
380
|
-
[/^stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-stroke-opacity": colors.h.bracket.percent.cssvar(opacity) }), { autocomplete: "stroke-(op|opacity)-<percent>" }],
|
|
381
|
-
["stroke-cap-square", { "stroke-linecap": "square" }],
|
|
382
|
-
["stroke-cap-round", { "stroke-linecap": "round" }],
|
|
383
|
-
["stroke-cap-auto", { "stroke-linecap": "butt" }],
|
|
384
|
-
["stroke-join-arcs", { "stroke-linejoin": "arcs" }],
|
|
385
|
-
["stroke-join-bevel", { "stroke-linejoin": "bevel" }],
|
|
386
|
-
["stroke-join-clip", { "stroke-linejoin": "miter-clip" }],
|
|
387
|
-
["stroke-join-round", { "stroke-linejoin": "round" }],
|
|
388
|
-
["stroke-join-auto", { "stroke-linejoin": "miter" }],
|
|
389
|
-
["stroke-none", { stroke: "none" }]
|
|
390
|
-
];
|
|
391
|
-
|
|
392
|
-
const rules = [
|
|
393
|
-
cssVariables,
|
|
394
|
-
cssProperty,
|
|
395
|
-
paddings,
|
|
396
|
-
margins,
|
|
397
|
-
transform.displays,
|
|
398
|
-
transform.opacity,
|
|
399
|
-
transform.bgColors,
|
|
400
|
-
transform.colorScheme,
|
|
401
|
-
svgUtilities,
|
|
402
|
-
transform.borders,
|
|
403
|
-
transform.contentVisibility,
|
|
404
|
-
transform.contents,
|
|
405
|
-
fonts,
|
|
406
|
-
tabSizes,
|
|
407
|
-
textIndents,
|
|
408
|
-
transform.textOverflows,
|
|
409
|
-
transform.textDecorations,
|
|
410
|
-
textStrokes,
|
|
411
|
-
textShadows,
|
|
412
|
-
transform.textTransforms,
|
|
413
|
-
transform.textAligns,
|
|
414
|
-
transform.textColors,
|
|
415
|
-
transform.fontStyles,
|
|
416
|
-
transform.fontSmoothings,
|
|
417
|
-
transform.boxShadows,
|
|
418
|
-
transform.rings,
|
|
419
|
-
flex,
|
|
420
|
-
grids,
|
|
421
|
-
gaps,
|
|
422
|
-
transform.positions,
|
|
423
|
-
sizes,
|
|
424
|
-
aspectRatio,
|
|
425
|
-
transform.cursors,
|
|
426
|
-
transform.appearances,
|
|
427
|
-
transform.pointerEvents,
|
|
428
|
-
transform.resizes,
|
|
429
|
-
transform.verticalAligns,
|
|
430
|
-
transform.userSelects,
|
|
431
|
-
transform.whitespaces,
|
|
432
|
-
transform.breaks,
|
|
433
|
-
transform.overflows,
|
|
434
|
-
transform.outline,
|
|
435
|
-
transform.appearance,
|
|
436
|
-
transform.orders,
|
|
437
|
-
transform.justifies,
|
|
438
|
-
transform.alignments,
|
|
439
|
-
transform.placements,
|
|
440
|
-
transform.flexGridJustifiesAlignments,
|
|
441
|
-
transform.insets,
|
|
442
|
-
transform.floats,
|
|
443
|
-
transform.zIndexes,
|
|
444
|
-
transform.boxSizing,
|
|
445
|
-
transform.transitions,
|
|
446
|
-
transform.transforms,
|
|
447
|
-
transform.willChange,
|
|
448
|
-
containerParent,
|
|
449
|
-
transform.contains,
|
|
450
|
-
transform.textWraps,
|
|
451
|
-
questionMark
|
|
452
|
-
].flat(1);
|
|
453
|
-
|
|
454
|
-
exports.aspectRatio = aspectRatio;
|
|
455
|
-
exports.containerParent = containerParent;
|
|
456
|
-
exports.cssProperty = cssProperty;
|
|
457
|
-
exports.cssVariables = cssVariables;
|
|
458
|
-
exports.flex = flex;
|
|
459
|
-
exports.fonts = fonts;
|
|
460
|
-
exports.gaps = gaps;
|
|
461
|
-
exports.grids = grids;
|
|
462
|
-
exports.margins = margins;
|
|
463
|
-
exports.paddings = paddings;
|
|
464
|
-
exports.questionMark = questionMark;
|
|
465
|
-
exports.rules = rules;
|
|
466
|
-
exports.sizes = sizes;
|
|
467
|
-
exports.svgUtilities = svgUtilities;
|
|
468
|
-
exports.tabSizes = tabSizes;
|
|
469
|
-
exports.textIndents = textIndents;
|
|
470
|
-
exports.textShadows = textShadows;
|
|
471
|
-
exports.textStrokes = textStrokes;
|