transform-to-unocss-core 0.0.48 → 0.0.49

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/index.d.cts CHANGED
@@ -8,8 +8,8 @@ declare function toUnocssClass(css: string, isRem?: boolean): [string, string[]]
8
8
  //#endregion
9
9
  //#region src/transformer.d.ts
10
10
  declare function transformStyleToUnocssPre(styles: string): {
11
- transformedResult: string;
12
- newStyle: string;
11
+ transformedResult: string;
12
+ newStyle: string;
13
13
  };
14
14
 
15
15
  //#endregion
@@ -37,6 +37,7 @@ declare function joinWithLine(s: string): string;
37
37
  declare function joinWithUnderLine(s: string): string;
38
38
  declare const positionMap: string[];
39
39
  type TrimType = 'all' | 'pre' | 'around' | 'post';
40
+
40
41
  /**
41
42
  * 删除空格
42
43
  * @param { string } s 字符串
package/dist/index.d.ts CHANGED
@@ -8,8 +8,8 @@ declare function toUnocssClass(css: string, isRem?: boolean): [string, string[]]
8
8
  //#endregion
9
9
  //#region src/transformer.d.ts
10
10
  declare function transformStyleToUnocssPre(styles: string): {
11
- transformedResult: string;
12
- newStyle: string;
11
+ transformedResult: string;
12
+ newStyle: string;
13
13
  };
14
14
 
15
15
  //#endregion
@@ -37,6 +37,7 @@ declare function joinWithLine(s: string): string;
37
37
  declare function joinWithUnderLine(s: string): string;
38
38
  declare const positionMap: string[];
39
39
  type TrimType = 'all' | 'pre' | 'around' | 'post';
40
+
40
41
  /**
41
42
  * 删除空格
42
43
  * @param { string } s 字符串
@@ -0,0 +1,1151 @@
1
+ var TransformToUnoCSSCore = (function(exports) {
2
+
3
+ "use strict";
4
+
5
+ //#region src/utils.ts
6
+ const flag = ".__unocss_transfer__";
7
+ const cssMathFnRE = /^(?:calc|clamp|min|max)\s*\(.*\)/;
8
+ const numberWithUnitRE = /^-?[0-9.]+(px|rem|em|%|vw|vh|vmin|vmax|deg)$/;
9
+ function isNot(s) {
10
+ return /\[&:not\(/.test(s);
11
+ }
12
+ function isCalc(s) {
13
+ return cssMathFnRE.test(s);
14
+ }
15
+ function getFirstName(s) {
16
+ return s.split("-")[0];
17
+ }
18
+ function getLastName(s) {
19
+ const all = s.split("-");
20
+ return all[all.length - 1];
21
+ }
22
+ function isUrl(s) {
23
+ return s.startsWith("url(");
24
+ }
25
+ function isPercent(s) {
26
+ return s.endsWith("%") && !s.includes(" ");
27
+ }
28
+ function isHex(hex) {
29
+ return /^#[0-9A-F]{2,}$/i.test(hex);
30
+ }
31
+ function isRgb(s) {
32
+ return s.startsWith("rgb");
33
+ }
34
+ function isHsl(s) {
35
+ return s.startsWith("hsl");
36
+ }
37
+ function isCubicBezier(s) {
38
+ return s.startsWith("cubic-bezier");
39
+ }
40
+ function getVal(val, transform$1, inClass, prefix = "") {
41
+ if (isCalc(val) || isUrl(val) || isHex(val) || isRgb(val) || isHsl(val) || isPercent(val) || isVar(val) || isCubicBezier(val)) return inClass ? `-[${prefix}${trim(val, "all").replace(/['"]/g, "")}]` : `="[${prefix}${trim(val, "all").replace(/['"]/g, "")}]"`;
42
+ return prefix ? `-[${prefix}${transform$1 ? transform$1(val) : val}]` : `-${transform$1 ? transform$1(val) : val}`;
43
+ }
44
+ function getHundred(n) {
45
+ if (typeof n === "string" && n.endsWith("%")) return n.slice(0, -1);
46
+ return +n * 100;
47
+ }
48
+ function joinWithLine(s) {
49
+ return s.replace(/\s+/, " ").split(" ").join("-");
50
+ }
51
+ function joinWithUnderLine(s) {
52
+ return s.replace(/\s+/, " ").split(" ").join("_");
53
+ }
54
+ const positionMap = [
55
+ "top",
56
+ "right",
57
+ "bottom",
58
+ "left",
59
+ "center"
60
+ ];
61
+ /**
62
+ * 删除空格
63
+ * @param { string } s 字符串
64
+ * @param { TrimType } type 所有 | 前置 | 前后 | 后置 'all' | 'pre' | 'around' | 'post'
65
+ * @returns string
66
+ */
67
+ function trim(s, type = "around") {
68
+ if (type === "pre") return s.replace(/(^\s*)/g, "");
69
+ if (type === "post") return s.replace(/(\s*$)/g, "");
70
+ if (type === "all") return s.replace(/\s+/g, "");
71
+ if (type === "around") return s.replace(/(^\s*)|(\s*$)/g, "");
72
+ return s;
73
+ }
74
+ function transformImportant(v) {
75
+ v = v.replace(/\s+/, " ").replace(/\s*,\s*/g, ",").replace(/\s*\/\s*/, "/");
76
+ if (/rgb/.test(v)) v = v.replace(/rgba?\(([^)]+)\)/g, (all, k) => {
77
+ const _k = k.trim().split(" ");
78
+ return all.replace(k, _k.map((i, index) => i.endsWith(",") ? i : i + (_k.length - 1 === index ? "" : ",")).join(""));
79
+ });
80
+ if (/hsl/.test(v)) v = v.replace(/hsla?\(([^)]+)\)/g, (all, k) => {
81
+ const _k = k.trim().split(" ");
82
+ return all.replace(k, _k.map((i, index) => i.endsWith(",") ? i : i + (_k.length - 1 === index ? "" : ",")).join(""));
83
+ });
84
+ if (/var\([^)]+\)/.test(v)) v = v.replace(/var\(([^)]+)\)/g, (all, k) => {
85
+ const _k = k.trim().split(" ");
86
+ return all.replace(k, _k.map((i, index) => i.endsWith(",") ? i : i + (_k.length - 1 === index ? "" : ",")).join(""));
87
+ });
88
+ if (v.endsWith("!important")) return [v.replace(/\s*!important/, "").trim(), "!"];
89
+ return [v.trim(), ""];
90
+ }
91
+ function diffTemplateStyle(before, after) {
92
+ const s1 = before.match(/<style scoped>.*<\/style>/s);
93
+ const s2 = after.match(/<style scoped>.*<\/style>/s);
94
+ return s1[0] === s2[0];
95
+ }
96
+ function isEmptyStyle(code) {
97
+ return /<style scoped>\s*<\/style>/.test(code);
98
+ }
99
+ function getStyleScoped(code) {
100
+ const match = code.match(/<style scoped>(.*)<\/style>/s);
101
+ if (!match) return "";
102
+ return match[1];
103
+ }
104
+ function joinEmpty(str) {
105
+ return str.replace(/\(\s*/g, "(").replace(/\s*\)/g, ")").replace(/\s*,\s*/g, ",");
106
+ }
107
+ function isVar(s) {
108
+ return s.startsWith("var(--");
109
+ }
110
+ function isSize(s) {
111
+ return cssMathFnRE.test(s) || numberWithUnitRE.test(s) || positionMap.includes(s);
112
+ }
113
+ function isColor(s) {
114
+ return isHex(s) || isRgb(s) || isHsl(s);
115
+ }
116
+ const browserReg = /-webkit-|-moz-|-ms-|-o-/g;
117
+ const linearGradientReg = /linear-gradient\(\s*to([\w\s]+),?([\-\w()#%\s.]+)?,([\-\w()#%\s.]+)?,?([\-\w#%\s.]+)?\)$/;
118
+ const linearGradientReg1 = /linear-gradient\(\s*([^,]*),?([\-\w()#%\s.]+)?,([\-\w()#%\s.]+)?,?([\-\w#%\s.]+)?\)$/;
119
+ const otherGradientReg = /(radial|conic)-gradient\(([\-\w()#%\s.]+)?,([\-\w()#%\s.]+)?,?([\-\w#%\s.]+)?\)$/;
120
+ const commaReplacer = "__comma__";
121
+ function getGradient(s) {
122
+ return s.startsWith("linear-gradient") ? "linear" : s.startsWith("radial-gradient") ? "radial" : s.startsWith("conic-gradient") ? "conic" : "";
123
+ }
124
+
125
+ //#endregion
126
+ //#region src/align.ts
127
+ function align(key, val) {
128
+ const [value, important] = transformImportant(val);
129
+ return `${getLastName(key)}-${getLastName(value)}${important}`;
130
+ }
131
+
132
+ //#endregion
133
+ //#region src/animation.ts
134
+ function animation(key, val) {
135
+ const [value, important] = transformImportant(val);
136
+ if (key === "animation-delay") return `animate-delay${getVal(value)}${important}`;
137
+ if (key === "animation-duration") return `animate-duration${getVal(value)}${important}`;
138
+ if (key === "animation-name") return `animate-[${value}]${important}`;
139
+ if (key === "animation-timing-function") return `animate-ease-[${value}]${important}`;
140
+ if (key === "animation-iteration-count") return `animate-count${getVal(value)}${important}`;
141
+ if (key === "animation-direction") return `animate-direction-${value}${important}`;
142
+ if (key === "animation-fill-mode") return `animate-fill-${value}${important}`;
143
+ const playStates = {
144
+ running: "running",
145
+ paused: "paused"
146
+ };
147
+ if (key === "animation-play-state") {
148
+ if (value in playStates) return `animate-${playStates[value]}${important}`;
149
+ return `animate-[${value}]${important}`;
150
+ }
151
+ if (key === "animation") {
152
+ const parts = value.split(" ");
153
+ const result = [];
154
+ let timeValuesFound = 0;
155
+ for (let i = 0; i < parts.length; i++) {
156
+ const part = parts[i];
157
+ if (/^\d+(?:\.\d+)?s?$/.test(part)) {
158
+ if (timeValuesFound === 0) result.push(`animate-duration${getVal(part)}`);
159
+ else if (timeValuesFound === 1) result.push(`animate-delay${getVal(part)}`);
160
+ else result.push(`animate-[${part}]`);
161
+ timeValuesFound++;
162
+ } else if (/^(?:linear|ease|ease-in|ease-out|ease-in-out|step-start|step-end)$/.test(part)) result.push(`animate-ease-[${part}]`);
163
+ else if (part.startsWith("cubic-bezier") || part.startsWith("steps")) result.push(`animate-ease-[${part}]`);
164
+ else if ([
165
+ "alternate",
166
+ "alternate-reverse",
167
+ "normal",
168
+ "reverse"
169
+ ].includes(part)) result.push(`animate-direction-${part}`);
170
+ else if ([
171
+ "forwards",
172
+ "backwards",
173
+ "both",
174
+ "none"
175
+ ].includes(part)) result.push(`animate-fill-${part}`);
176
+ else if (playStates[part]) result.push(`animate-${playStates[part]}`);
177
+ else if (part === "infinite" || /^\d+$/.test(part)) result.push(`animate-count${getVal(part)}`);
178
+ else if (part !== "normal") result.push(`animate-[${part}]`);
179
+ else result.push(`animate-[${part}]`);
180
+ }
181
+ return result.length > 0 ? result.join(" ") + important : "";
182
+ }
183
+ return `animate-[${value}]${important}`;
184
+ }
185
+
186
+ //#endregion
187
+ //#region src/aspect.ts
188
+ function aspect(key, val) {
189
+ const [value, important] = transformImportant(val);
190
+ if (value === "auto") return `${getFirstName(key)}-${value}${important}`;
191
+ return `${getFirstName(key)}="[${value}]${important}"`;
192
+ }
193
+
194
+ //#endregion
195
+ //#region src/box.ts
196
+ const validKey = ["box-shadow", "drop-shadow"];
197
+ function box(key, val) {
198
+ let [value, important] = transformImportant(val);
199
+ if (key.startsWith("box-decoration")) return `box-decoration-${value}${important}`;
200
+ if (key === "box-sizing") return `box-${getFirstName(value)}${important}`;
201
+ if (validKey.includes(key)) return `shadow="[${value.split(" ").join("_")}]${important}"`;
202
+ }
203
+
204
+ //#endregion
205
+ //#region src/filter.ts
206
+ const hundred = [
207
+ "contrast",
208
+ "brightness",
209
+ "saturate"
210
+ ];
211
+ const percent = [
212
+ "grayscale",
213
+ "invert",
214
+ "sepia"
215
+ ];
216
+ function filter(key, val) {
217
+ const [v, important] = transformImportant(val);
218
+ const [_, name, value] = v.match(/([\w-]+)\((.*)\)/);
219
+ if (hundred.includes(name)) return `${name}-${getHundred(value)}${important}`;
220
+ if (name === "drop-shadow") return `drop-${box(name, value)}${important}`;
221
+ if (percent.includes(name)) return `${name}-${value.endsWith("%") ? value.slice(0, -1) : getHundred(value)}${important}`;
222
+ if (name === "hue-rotate") return `${name}-${value.slice(0, -3)}${important}`;
223
+ return `${name}-${value}${important}`;
224
+ }
225
+
226
+ //#endregion
227
+ //#region src/backdrop.ts
228
+ function backdrop(key, val) {
229
+ const [value, important] = transformImportant(val);
230
+ return `backdrop-${filter(key, value)}${important}`;
231
+ }
232
+
233
+ //#endregion
234
+ //#region src/background.ts
235
+ const backgroundMap = [
236
+ "background-color",
237
+ "background-attachment",
238
+ "background-position"
239
+ ];
240
+ function background(key, val) {
241
+ const [value, important] = transformImportant(val);
242
+ if (key === "background-size") return `bg${getVal(value, /\d/.test(value) ? transformSpaceToUnderLine : transformSpaceToLine, false, "length:")}${important}`;
243
+ if (backgroundMap.includes(key)) return `bg${getVal(value, transformSpaceToLine)}${important}`;
244
+ if (["background", "background-image"].includes(key)) {
245
+ if (isSize(value)) return `bg${getVal(value, transformSpaceToLine, false, "position:")}${important}`;
246
+ const temp = value.replace(/rgba?\([^)]+\)/g, "temp");
247
+ if (/\)\s*,/.test(temp)) return `bg="[${matchMultipleBgAttrs(value)}]"`;
248
+ if (value.startsWith("linear-gradient")) {
249
+ const newValue = value.replace(/rgba?\(([^)]+)\)/g, (all, v) => all.replace(v, v.replace(/\s*,\s*/g, commaReplacer)));
250
+ const matcher = newValue.match(linearGradientReg);
251
+ if (matcher) {
252
+ let [direction, from, via, to] = matcher.slice(1);
253
+ direction = direction.split(" ").map((item) => item[0]).join("");
254
+ return direction ? `bg-gradient-to-${direction}${getLinearGradientPosition$1(from, via, to)}` : getLinearGradientPosition$1(from, via, to);
255
+ }
256
+ const matcher1 = newValue.match(linearGradientReg1);
257
+ if (!matcher1) return;
258
+ return `bg-gradient-linear bg-gradient-[${matcher1[1]},${matcher1[2].replace(/\s+/, "_").replaceAll(commaReplacer, ",")},${matcher1[3].replace(/\s+/, "_").replaceAll(commaReplacer, ",")}]`;
259
+ } else if (/^(?:radial|conic)-gradient/.test(value)) {
260
+ const newValue = value.replace(/rgba?\(([^)]+)\)/g, (all, v) => all.replace(v, v.replace(/\s*,\s*/g, commaReplacer)));
261
+ const matcher = newValue.match(otherGradientReg);
262
+ if (!matcher) return;
263
+ const name = matcher[1];
264
+ const [from, via, to] = matcher.slice(2);
265
+ return `bg-gradient-${name}${getLinearGradientPosition$1(from, via, to)}`;
266
+ }
267
+ const match = value.match(/^rgba?\([^)]+\)$/);
268
+ if (match) {
269
+ const rgb = match[0];
270
+ return `bg="${value.replace(rgb, `[${rgb}]`)}${important}"`;
271
+ }
272
+ const urlMatch = value.match(/^url\(["'\s.\-\w/@]*\)$/);
273
+ if (urlMatch) return `bg="${value.replace(urlMatch[0], `[${urlMatch[0].replace(/['"]/g, "")}]${important}`)}"`;
274
+ if (value.includes(" ")) {
275
+ let r = value.split(" ").map((v) => background(key, `${v}${important ? " !important" : ""}`)).join(" ");
276
+ const bgPositionReg = /bg-\[position:([^\]]*)\]/g;
277
+ const bgPosition = r.match(bgPositionReg);
278
+ if (bgPosition && bgPosition.length > 1) {
279
+ const t = `bg-[position:${bgPosition.map((item) => item.replace(bgPositionReg, "$1")).join("_")}]`;
280
+ r = `${r.replace(bgPositionReg, "").replace(/\s+/g, " ").split(" ").filter(Boolean).concat([t]).join(" ")}`;
281
+ }
282
+ return r;
283
+ }
284
+ return `bg${getVal(value, transformSpaceToLine)}${important}`;
285
+ }
286
+ if (key === "background-blend-mode") return `bg-blend-${value}${important}`;
287
+ return `${replaceBackground(key, value)}-${transformBox(value)}${important}`;
288
+ }
289
+ function replaceBackground(s, val) {
290
+ if (val.endsWith("repeat")) return "bg";
291
+ return s.replace("background", "bg");
292
+ }
293
+ function transformBox(s) {
294
+ const reg = /border|content|padding-box/;
295
+ if (reg.test(s)) return s.replace("-box", "");
296
+ if (s.startsWith("repeat-")) return s.replace("repeat-", "");
297
+ return transformSpaceToLine(s);
298
+ }
299
+ function transformSpaceToLine(s) {
300
+ return s.replace(/\s+/, " ").replace(" ", "-");
301
+ }
302
+ function transformSpaceToUnderLine(s) {
303
+ return s.replace(/\s+/, " ").replace(" ", "_");
304
+ }
305
+ function getLinearGradientPosition$1(from, via, to) {
306
+ let result = "";
307
+ if (via && !to) {
308
+ to = via;
309
+ via = "";
310
+ }
311
+ if (from) {
312
+ from = from.replaceAll(commaReplacer, ",");
313
+ const [fromColor, fromPosition] = from.split(" ");
314
+ if (fromPosition) result += ` from="${isRgb(fromColor) ? `[${fromColor}]` : fromColor} ${fromPosition}"`;
315
+ else if (fromColor) result += ` from="${isRgb(fromColor) ? `[${fromColor}]` : fromColor}"`;
316
+ }
317
+ if (via) {
318
+ via = via.replaceAll(commaReplacer, ",");
319
+ const [viaColor, viaPosition] = via.split(" ");
320
+ if (viaPosition) result += ` via="${isRgb(viaColor) ? `[${viaColor}]` : viaColor} ${viaPosition}"`;
321
+ else if (viaColor) result += ` via="${isRgb(viaColor) ? `[${viaColor}]` : viaColor}"`;
322
+ }
323
+ if (to) {
324
+ to = to.replaceAll(commaReplacer, ",");
325
+ const [toColor, toPosition] = to.split(" ");
326
+ if (toPosition) result += ` to="${isRgb(toColor) ? `[${toColor}]` : toColor} ${toPosition}"`;
327
+ else if (toColor) result += ` to="${isRgb(toColor) ? `[${toColor}]` : toColor}"`;
328
+ }
329
+ return result;
330
+ }
331
+ const CONSTANTFLAG = "__transform_to_unocss__";
332
+ function matchMultipleBgAttrs(value) {
333
+ const map$2 = {};
334
+ let i = 0;
335
+ value = value.replace(/(rgba?|hsla?|lab|lch|hwb|color)\(\)*\)/, (_) => {
336
+ map$2[i++] = _;
337
+ return `${CONSTANTFLAG}${i}}`;
338
+ });
339
+ value = value.split(/\)\s*,/).map((item) => `${item.replace(/\s*,\s*/g, ",").replace(/\s+/g, "_")}`).join("),");
340
+ Object.keys(map$2).forEach((key) => {
341
+ value = value.replace(`${CONSTANTFLAG}${key}}`, map$2[key]);
342
+ });
343
+ return value;
344
+ }
345
+
346
+ //#endregion
347
+ //#region src/border.ts
348
+ const borderSize = [
349
+ "border-top",
350
+ "border-right",
351
+ "border-bottom",
352
+ "border-left"
353
+ ];
354
+ function border(key, val) {
355
+ let [value, important] = transformImportant(val);
356
+ if (key === "border-spacing") return `${key}="[${joinWithUnderLine(value)}]${important}"`;
357
+ if (key === "border-color") {
358
+ if (value.includes(" ")) {
359
+ const len = value.split(" ").length;
360
+ const vs = value.split(" ").map((s) => isHex(s) || isRgb(s) || isHsl(s) ? `-[${s}]` : `-${s}`);
361
+ const [top$1, right, bottom, left] = vs;
362
+ switch (len) {
363
+ case 2: return `border-y${top$1}${important} border-x${right}${important}`;
364
+ case 3: return `border-t${top$1}${important} border-b${bottom}${important} border-x${right}${important}`;
365
+ case 4: return `border-t${top$1}${important} border-b${bottom}${important} border-r${right}${important} border-l${left}${important}`;
366
+ }
367
+ }
368
+ return `border${getVal(value)}${important}`;
369
+ }
370
+ if (key === "border-radius") return isCalc(value) || !value.includes(" ") ? `border-rd${getVal(value)}${important}` : `border-rd="[${joinWithUnderLine(value)}]${important}"`;
371
+ if (borderSize.some((b) => key.startsWith(b))) return value.split(" ").map((v) => `border-${key.split("-")[1][0]}${getVal(v)}${important}`).join(" ");
372
+ if (key === "border-inline-end-width") return `border-e${getVal(value)}${important}`;
373
+ if (key === "border-inline-start-width") return `border-s${getVal(value)}${important}`;
374
+ if (key.startsWith("border-image")) return "";
375
+ if (key === "border-width" && value.includes(" ")) return value.split(" ").map((v, i) => `border-${borderSize[i].split("-")[1][0]}${getVal(v)}${important}`).join(" ");
376
+ if (/^\d[%|(px)rem]$/.test(value) || key === "border-collapse") return `border-${value}${important}`;
377
+ if (key === "border-width" || key === "border-style") return `border${getVal(value)}${important}`;
378
+ if (key === "border-color") {
379
+ if (value === "currentColor") return `border-current${important}`;
380
+ return `border${getVal(value)}${important}`;
381
+ }
382
+ return value.split(" ").map((v) => {
383
+ if (value === "currentColor") return `border-current${important}`;
384
+ return `border${getVal(v)}${important}`;
385
+ }).join(" ");
386
+ }
387
+
388
+ //#endregion
389
+ //#region src/color.ts
390
+ function color(key, val) {
391
+ const [value, important] = transformImportant(val);
392
+ return `text${getVal(value)}${important}`;
393
+ }
394
+
395
+ //#endregion
396
+ //#region src/column.ts
397
+ function column(key, val) {
398
+ const [value, important] = transformImportant(val);
399
+ if (key === "column-gap") return `gap-x-${value}${important}`;
400
+ return `${key}-${value}${important}`;
401
+ }
402
+
403
+ //#endregion
404
+ //#region src/content.ts
405
+ function content(key, val) {
406
+ const [value, important] = transformImportant(val);
407
+ return value === "\" \"" || value === "' '" ? `content-['_']${important}` : `content-[${value.replace(/"/g, "'")}]${important}`;
408
+ }
409
+
410
+ //#endregion
411
+ //#region src/cursor.ts
412
+ function cursor(key, val) {
413
+ const [value, important] = transformImportant(val);
414
+ return `${key}${getVal(value)}${important}`;
415
+ }
416
+
417
+ //#endregion
418
+ //#region src/display.ts
419
+ function display(key, val) {
420
+ const [value, important] = transformImportant(val);
421
+ if (value === "none") return `hidden${important}`;
422
+ if (value === "hidden") return `invisible${important}`;
423
+ return `${value}${important}`;
424
+ }
425
+
426
+ //#endregion
427
+ //#region src/empty.ts
428
+ const emptyMap = {
429
+ show: "visible",
430
+ hide: "hidden"
431
+ };
432
+ function empty(key, val) {
433
+ const [value, important] = transformImportant(val);
434
+ return `table-empty-cells-${emptyMap[value] ?? value}${important}`;
435
+ }
436
+
437
+ //#endregion
438
+ //#region src/flex.ts
439
+ const lastMaps = [
440
+ "flex-basis",
441
+ "flex-grow",
442
+ "flex-shrink"
443
+ ];
444
+ function flex(key, val) {
445
+ const [value, important] = transformImportant(val);
446
+ if (lastMaps.includes(key)) return `${getLastName(key)}${getVal(value)}${important}`;
447
+ if (value === "1") return `flex-1${important}`;
448
+ const firstVal = value[0];
449
+ if (key === "flex" && (firstVal === "0" || firstVal === "1")) return `flex="[${joinWithUnderLine(value)}]${important}"`;
450
+ return `${getFirstName(key)}-${value.replace("column", "col")}${important}`;
451
+ }
452
+
453
+ //#endregion
454
+ //#region src/float.ts
455
+ function float(key, val) {
456
+ const [value, important] = transformImportant(val);
457
+ return `${key}-${value}${important}`;
458
+ }
459
+
460
+ //#endregion
461
+ //#region src/font.ts
462
+ function font(key, val) {
463
+ const [value, important] = transformImportant(val);
464
+ if (key === "font-size") return `text-${value}${important}`;
465
+ if (key === "font-weight") return `font-${value}${important}`;
466
+ if (key === "font-family") {
467
+ const match = value.match(/ui-(\w{0,4})/);
468
+ if (!match) return `font-[${joinWithUnderLine(val)}]${important}`;
469
+ const [_, family] = match;
470
+ return `font-${family}${important}`;
471
+ }
472
+ if (key === "font-style") {
473
+ if (value === "normal") return `font-not-italic${important}`;
474
+ return `font-${value}${important}`;
475
+ }
476
+ if (key === "font-variant-numeric") {
477
+ if (value === "normal") return `normal-nums${important}`;
478
+ return `${value}${important}`;
479
+ }
480
+ return `font="${transformFont(value)}${important}"`;
481
+ }
482
+ function transformFont(v) {
483
+ return v.split(" ").map((item) => /^\d/.test(item) ? `text-${item}` : item).join(" ");
484
+ }
485
+
486
+ //#endregion
487
+ //#region src/grid.ts
488
+ function grid(key, val) {
489
+ const [value, important] = transformImportant(val);
490
+ if (key.startsWith("grid-template")) {
491
+ const matcher$1 = value.match(/repeat\s*\(\s*(\d+)/);
492
+ if (matcher$1) return `grid-${getLastName(key) === "rows" ? "rows" : "cols"}-${matcher$1[1]}${important}`;
493
+ return `grid-${getLastName(key) === "rows" ? "rows" : "cols"}-${value.includes(" ") ? `[${joinWithUnderLine(value)}]` : value}${important}`;
494
+ }
495
+ if (key === "grid-auto-flow") return `grid-flow-${joinWithLine(value).replace("column", "col")}${important}`;
496
+ if (key.startsWith("grid-auto")) {
497
+ const matcher$1 = value.match(/minmax\s*\(\s*0\s*,\s*1fr/);
498
+ return `auto-${getLastName(key) === "rows" ? "rows" : "cols"}-${matcher$1 ? "fr" : getFirstName(value)}${important}`;
499
+ }
500
+ const matcher = value.match(/span\s+(\d)/);
501
+ if (matcher) return `${key.slice(5).replace("column", "col")}-span-${matcher[1]}${important}`;
502
+ if (value === "1/-1") return `${key.slice(5).replace("column", "col")}-span-full${important}`;
503
+ return `${key.slice(5).replace("column", "col")}-${value}${important}`;
504
+ }
505
+
506
+ //#endregion
507
+ //#region src/inset.ts
508
+ function inset(key, val) {
509
+ const [value, important] = transformImportant(val);
510
+ if (key === "inset-inline-start") return `start${getVal(value)}${important}`;
511
+ if (key === "inset-inline-end") return `end${getVal(value)}${important}`;
512
+ return void 0;
513
+ }
514
+
515
+ //#endregion
516
+ //#region src/isolation.ts
517
+ function isolation(key, val) {
518
+ const [value, important] = transformImportant(val);
519
+ if (val === "isolate") return `${value}${important}`;
520
+ return `${key}-${value}${important}`;
521
+ }
522
+
523
+ //#endregion
524
+ //#region src/justify.ts
525
+ function justify(key, val) {
526
+ const [value, important] = transformImportant(val);
527
+ if (key === "justify-content") return `justify-${getLastName(value)}${important}`;
528
+ return `${key}-${getLastName(value)}${important}`;
529
+ }
530
+
531
+ //#endregion
532
+ //#region src/letter.ts
533
+ function letter(key, val) {
534
+ const [value, important] = transformImportant(val);
535
+ return `tracking-${value}${important}`;
536
+ }
537
+
538
+ //#endregion
539
+ //#region src/line.ts
540
+ const lineMap = {
541
+ 1: "none",
542
+ 1.25: "tight",
543
+ 1.375: "snug",
544
+ 1.5: "normal",
545
+ 1.625: "relaxed",
546
+ 2: "loose"
547
+ };
548
+ function line(key, val) {
549
+ const [value, important] = transformImportant(val);
550
+ if (value in lineMap) return `lh-${lineMap[value]}${important}`;
551
+ return `lh${getVal(value, (v) => /\d$/.test(v) ? `[${v}]` : v)}${important}`;
552
+ }
553
+
554
+ //#endregion
555
+ //#region src/list.ts
556
+ function list(key, val) {
557
+ const [value, important] = transformImportant(val);
558
+ return `${getFirstName(key)}${getVal(value)}${important}`;
559
+ }
560
+
561
+ //#endregion
562
+ //#region src/margin.ts
563
+ const map$1 = {
564
+ "margin-left": "ml",
565
+ "margin-right": "mr",
566
+ "margin-top": "mt",
567
+ "margin-bottom": "mb",
568
+ "margin-inline-start": "ms",
569
+ "margin-inline-end": "me",
570
+ "padding-left": "pl",
571
+ "padding-right": "pr",
572
+ "padding-top": "pt",
573
+ "padding-bottom": "pb",
574
+ "padding-inline-start": "ps",
575
+ "padding-inline-end": "pe"
576
+ };
577
+ function transformMargin(key, val) {
578
+ const [value, important] = transformImportant(val);
579
+ const specail = map$1[key];
580
+ if (specail) return `${specail}${getVal(value)}${important}`;
581
+ const values = value.split(" ");
582
+ const len = values.length;
583
+ if (len === 1) return `${key[0]}${getVal(values[0])}${important}`;
584
+ if (len === 2) return `${key[0]}x${getVal(values[1])}${important} ${key[0]}y${getVal(values[0])}${important}`;
585
+ if (len === 3) return `${key[0]}x${getVal(values[1])}${important} ${key[0]}t${getVal(values[0])}${important} ${key[0]}b${getVal(values[2])}${important}`;
586
+ return `${key[0]}t${getVal(values[0])}${important} ${key[0]}b${getVal(values[2])}${important} ${key[0]}l${getVal(values[3])}${important} ${key[0]}r${getVal(values[1])}${important}`;
587
+ }
588
+
589
+ //#endregion
590
+ //#region src/mask.ts
591
+ function mask(key, val) {
592
+ const [value, important] = transformImportant(val);
593
+ if ([
594
+ "mask-clip",
595
+ "mask-origin",
596
+ "mask-type"
597
+ ].includes(key)) return `${important}${key}-${getFirstName(value)}`;
598
+ if (["mask-mode", "mask-composite"].includes(key)) return `${important}${getFirstName(key)}-${getFirstName(value)}`;
599
+ if (["mask-position", "mask-size"].includes(key)) {
600
+ if (isCalc(value) || isUrl(value) || isHex(value) || isRgb(value) || isHsl(value) || isPercent(value) || isVar(value) || isCubicBezier(value)) return `${important}${key}${getVal(value)}`;
601
+ return `${important}${getFirstName(key)}-${joinWithLine(value)}`;
602
+ }
603
+ if (key === "mask-repeat") return `${important}${key}-${value}`;
604
+ if (key === "mask-image") {
605
+ const type = getGradient(value);
606
+ if (type) {
607
+ const newValue = value.replace(/rgba?\(([^)]+)\)/g, (all, v) => all.replace(v, v.replace(/\s*,\s*/g, commaReplacer)));
608
+ const matcher = newValue.match(linearGradientReg);
609
+ if (!matcher) return;
610
+ let [direction, from, via, to] = matcher.slice(1);
611
+ direction = direction.split(" ").map((item) => item[0]).join("");
612
+ return direction ? `${getLinearGradientPosition(`mask-${direction}`, from, via, to).trim()}` : getLinearGradientPosition(`mask-${type}`, from, via, to).trim();
613
+ }
614
+ return `${important}mask${getVal(value)}`;
615
+ }
616
+ return `${important}${key}${getVal(value)}`;
617
+ }
618
+ function getLinearGradientPosition(prefix, from, via, to) {
619
+ let result = "";
620
+ if (via && !to) {
621
+ to = via;
622
+ via = "";
623
+ }
624
+ if (from) {
625
+ from = from.replaceAll(commaReplacer, ",");
626
+ const [fromColor, fromPosition] = from.split(" ");
627
+ if (fromPosition) result += ` ${prefix}-from="${isRgb(fromColor) ? `[${fromColor}]` : fromColor} ${fromPosition}"`;
628
+ else if (fromColor) result += ` ${prefix}-from-${isRgb(fromColor) ? `[${fromColor}]` : fromColor}`;
629
+ }
630
+ if (via) {
631
+ via = via.replaceAll(commaReplacer, ",");
632
+ const [viaColor, viaPosition] = via.split(" ");
633
+ if (viaPosition) result += ` ${prefix}-via="${isRgb(viaColor) ? `[${viaColor}]` : viaColor} ${viaPosition}"`;
634
+ else if (viaColor) result += ` ${prefix}-via${isRgb(viaColor) ? `[${viaColor}]` : viaColor}`;
635
+ }
636
+ if (to) {
637
+ to = to.replaceAll(commaReplacer, ",");
638
+ const [toColor, toPosition] = to.split(" ");
639
+ if (toPosition) result += ` ${prefix}-to="${isRgb(toColor) ? `[${toColor}]` : toColor} ${toPosition}"`;
640
+ else if (toColor) result += ` ${prefix}-to-${isRgb(toColor) ? `[${toColor}]` : toColor}`;
641
+ }
642
+ return result;
643
+ }
644
+
645
+ //#endregion
646
+ //#region src/max.ts
647
+ function max(key, val) {
648
+ const [value, important] = transformImportant(val);
649
+ const all = key.split("-");
650
+ const attributeValue = isCalc(value) || isVar(value) ? getVal(value) : getVal(getFirstName(value));
651
+ return `${all[0]}-${all[1][0]}${attributeValue}${important}`;
652
+ }
653
+
654
+ //#endregion
655
+ //#region src/mix.ts
656
+ function mix(key, val) {
657
+ const [value, important] = transformImportant(val);
658
+ return `mix-blend-${value}${important}`;
659
+ }
660
+
661
+ //#endregion
662
+ //#region src/object.ts
663
+ function object(key, val) {
664
+ const [value, important] = transformImportant(val);
665
+ if (key === "object-position") return `${getFirstName(key)}-${joinWithLine(value)}${important}`;
666
+ return `${getFirstName(key)}-${value}${important}`;
667
+ }
668
+
669
+ //#endregion
670
+ //#region src/opacity.ts
671
+ function opacity(key, val) {
672
+ const [value, important] = transformImportant(val);
673
+ if (isPercent(val)) return `op-${value.replace("%", "")}${important}`;
674
+ return `op-${+value * 100}${important}`;
675
+ }
676
+
677
+ //#endregion
678
+ //#region src/outline.ts
679
+ function outline(key, val) {
680
+ const [value, important] = transformImportant(val);
681
+ if (key === "outline-offset") return `${key}-${value}${important}`;
682
+ return `${getFirstName(key)}-${value}${important}`;
683
+ }
684
+
685
+ //#endregion
686
+ //#region src/word.ts
687
+ function word(key, val) {
688
+ const [value, important] = transformImportant(val);
689
+ if (key.startsWith("word-spacing")) return `word-spacing${getVal(val)}${important}`;
690
+ if (value === "keep-all") return `break-keep${important}`;
691
+ if (value === "break-word") return `break-words${important}`;
692
+ return `break-${getLastName(value)}${important}`;
693
+ }
694
+
695
+ //#endregion
696
+ //#region src/overflow.ts.ts
697
+ function overflow(key, val) {
698
+ const [value, important] = transformImportant(val);
699
+ if (key === "overflow-wrap") return word(key, val);
700
+ return `${key}-${value}${important}`;
701
+ }
702
+
703
+ //#endregion
704
+ //#region src/overscroll.ts
705
+ function overscroll(key, val) {
706
+ const [value, important] = transformImportant(val);
707
+ const [prefix, _, suffix] = key.split("-");
708
+ if (suffix) return `${prefix}-${suffix}-${value}${important}`;
709
+ return `${prefix}-${value}${important}`;
710
+ }
711
+
712
+ //#endregion
713
+ //#region src/place.ts
714
+ function place(key, val) {
715
+ const [value, important] = transformImportant(val);
716
+ return `${key}-${getLastName(value)}${important}`;
717
+ }
718
+
719
+ //#endregion
720
+ //#region src/resize.ts
721
+ const map = {
722
+ vertical: "y",
723
+ horizontal: "x"
724
+ };
725
+ function resize(key, val) {
726
+ const [value, important] = transformImportant(val);
727
+ if (value === "both") return `${key}${important}`;
728
+ return `${key}-${map[value] || value}${important}`;
729
+ }
730
+
731
+ //#endregion
732
+ //#region src/rotate.ts
733
+ function rotate(key, val) {
734
+ const [value, important] = transformImportant(val);
735
+ if (value.includes(" ")) return `rotate-[${joinWithUnderLine(value)}]${important}`;
736
+ return `rotate${getVal(value)}${important}`;
737
+ }
738
+
739
+ //#endregion
740
+ //#region src/row.ts
741
+ function row(key, val) {
742
+ const [value, important] = transformImportant(val);
743
+ return `gap-y-${value}${important}`;
744
+ }
745
+
746
+ //#endregion
747
+ //#region src/scroll.ts
748
+ function scroll(key, val) {
749
+ const [value, important] = transformImportant(val);
750
+ if (key.startsWith("scroll-snap")) return `snap-${value}${important}`;
751
+ if (key === "scroll-behavior") return `scroll-${value}${important}`;
752
+ const [_, prefix, suffix, way] = key.match(/scroll-(margin|padding)-?(\w+)?-?(\w+)?/);
753
+ if (suffix === "inline" && way) return `scroll-${prefix[0]}${way[0]}${getVal(value)}${important}`;
754
+ if (suffix) return `scroll-${prefix[0]}${suffix[0]}${getVal(value)}${important}`;
755
+ return `scroll-${prefix[0]}-${value}${important}`;
756
+ }
757
+
758
+ //#endregion
759
+ //#region src/size.ts
760
+ function size(key, val) {
761
+ const [value, important] = transformImportant(val);
762
+ if (value.startsWith("-")) return `-${key[0]}${getVal(value.slice(1), getFirstName)}${important}`;
763
+ return `${key[0]}${getVal(value, getFirstName)}${important}`;
764
+ }
765
+
766
+ //#endregion
767
+ //#region src/text.ts
768
+ function text(key, val) {
769
+ const [value, important] = transformImportant(val);
770
+ if (key === "text-decoration-line") {
771
+ if (value === "none") return `no-underline${important}`;
772
+ return `${value}${important}`;
773
+ }
774
+ if (key === "text-transform") {
775
+ if (value === "none") return `normal-case${important}`;
776
+ return `${value}${important}`;
777
+ }
778
+ if (key.startsWith("text-decoration") || key === "text-indent") return `${key.split("-")[1]}${getVal(value)}${important}`;
779
+ if (key === "text-underline-offset") return `underline-offset-${value}${important}`;
780
+ return `text-${value}${important}`;
781
+ }
782
+
783
+ //#endregion
784
+ //#region src/top.ts
785
+ function top(key, val) {
786
+ const [value, important] = transformImportant(val);
787
+ return `${key}${getVal(value)}${important}`;
788
+ }
789
+
790
+ //#endregion
791
+ //#region src/transform.ts
792
+ function transform(key, val) {
793
+ const [v, important] = transformImportant(val);
794
+ if (key === "transform-origin") return `origin-${/\d/.test(v) && v.includes(" ") ? `[${joinWithUnderLine(v)}]` : joinWithLine(v)}${important}`;
795
+ if (key === "transform-style") return `transform-${v}${important}`;
796
+ if (val === "none") return `${key}-none${important}`;
797
+ return joinEmpty(v).split(" ").map((v$1) => {
798
+ const matcher = v$1.match(/([a-z]+)(3d)?([A-Z])?\((.*)\)/);
799
+ if (!matcher) return void 0;
800
+ const [_, namePrefix, is3d, nameSuffix, value] = matcher;
801
+ if (nameSuffix) {
802
+ const values = value.replace(/,(?![^()]*\))/g, " ").split(" ");
803
+ if (values.length > 1) return `${namePrefix}-${nameSuffix.toLowerCase()}="${values.map((v$2) => isVar(v$2) ? `[${v$2}]` : namePrefix === "scale" ? getHundred(v$2) : transformVal(v$2)).join(" ")}${important}"`;
804
+ return `${namePrefix}="${nameSuffix.toLowerCase()}-${isVar(values[0]) ? `[${values[0]}]` : namePrefix === "scale" ? getHundred(values[0]) : transformVal(values[0])}${important}"`;
805
+ } else {
806
+ const values = value.replace(/,(?![^()]*\))/g, " ").split(" ");
807
+ if (values.length > 1) {
808
+ if (namePrefix === "translate") return `${namePrefix}="[${values.join(",")}]"`;
809
+ return `${namePrefix}="${values.map((v$2) => isVar(v$2) ? `[${v$2}]` : namePrefix === "scale" ? getHundred(v$2) : transformVal(v$2)).join(" ")}${important}"`;
810
+ }
811
+ return `${namePrefix}="${isVar(values[0]) ? `[${values[0]}]` : namePrefix === "scale" ? getHundred(values[0]) : transformVal(values[0])}${important}"`;
812
+ }
813
+ }).filter(Boolean).join(" ");
814
+ }
815
+ function transformVal(val) {
816
+ if (val.endsWith("deg")) return val.slice(0, -3);
817
+ return val;
818
+ }
819
+
820
+ //#endregion
821
+ //#region src/transition.ts
822
+ const times = ["transition-delay", "transition-duration"];
823
+ function transition(key, val) {
824
+ const [value, important] = transformImportant(val);
825
+ if (key === "transition-timing-function") {
826
+ if (value === "linear") return `ease-${value}${important}`;
827
+ return `ease="[${value}]${important}"`;
828
+ }
829
+ if (key === "transition") return `transition="${transformTransition(value, important)}"`;
830
+ if (key === "transition-property") {
831
+ if (value.includes("color")) return `transition-color${important}`;
832
+ if (value === "box-shadow") return `transition-shadow${important}`;
833
+ return `transition-${value}${important}`;
834
+ }
835
+ if (times.includes(key)) return `${key.split("-")[1]}-${value.slice(0, -2)}${important}`;
836
+ }
837
+ function transformTransition(v, important) {
838
+ let hasDuration = false;
839
+ return v.split(" ").map((item) => {
840
+ if (/^\d/.test(item) || /^\.\d/.test(item)) {
841
+ if (hasDuration) return `delay${getVal(item, void 0, true)}${important}`;
842
+ hasDuration = true;
843
+ return `duration${getVal(item, void 0, true)}${important}`;
844
+ }
845
+ if (item === "background-color") return "colors";
846
+ return item;
847
+ }).join(" ");
848
+ }
849
+
850
+ //#endregion
851
+ //#region src/user.ts
852
+ function user(key, val) {
853
+ const [value, important] = transformImportant(val);
854
+ return `${getLastName(key)}-${value}${important}`;
855
+ }
856
+
857
+ //#endregion
858
+ //#region src/vertical.ts
859
+ function vertical(key, val) {
860
+ const [value, important] = transformImportant(val);
861
+ return `v-${value}${important}`;
862
+ }
863
+
864
+ //#endregion
865
+ //#region src/white.ts
866
+ function white(key, val) {
867
+ const [value, important] = transformImportant(val);
868
+ return `whitespace-${value}${important}`;
869
+ }
870
+
871
+ //#endregion
872
+ //#region src/will.ts
873
+ function will(key, val) {
874
+ const [value, important] = transformImportant(val);
875
+ return `${key}-${getFirstName(value)}${important}`;
876
+ }
877
+
878
+ //#endregion
879
+ //#region src/writing.ts
880
+ function writing(key, val) {
881
+ const [value, important] = transformImportant(val);
882
+ if (val === "horizontal-tb") return `write-normal${important}`;
883
+ return `write-${value.replace("-rl", "-right").replace("-lr", "-left")}${important}`;
884
+ }
885
+
886
+ //#endregion
887
+ //#region src/toUnocss.ts
888
+ const typeMap = {
889
+ animation,
890
+ aspect,
891
+ backface: list,
892
+ caption: list,
893
+ column,
894
+ columns: float,
895
+ break: float,
896
+ empty,
897
+ box,
898
+ writing,
899
+ display,
900
+ float,
901
+ clear: float,
902
+ isolation,
903
+ object,
904
+ overflow,
905
+ overscroll,
906
+ position: display,
907
+ top,
908
+ left: top,
909
+ right: top,
910
+ bottom: top,
911
+ visibility: display,
912
+ z: size,
913
+ flex,
914
+ order: float,
915
+ grid,
916
+ gap: top,
917
+ justify,
918
+ align,
919
+ place,
920
+ padding: transformMargin,
921
+ perspective: float,
922
+ margin: transformMargin,
923
+ width: size,
924
+ min: max,
925
+ max,
926
+ height: size,
927
+ font,
928
+ letter,
929
+ line,
930
+ list,
931
+ text,
932
+ mask,
933
+ hyphens: top,
934
+ vertical,
935
+ white,
936
+ word,
937
+ content,
938
+ background,
939
+ rotate,
940
+ border,
941
+ outline,
942
+ opacity,
943
+ mix,
944
+ filter,
945
+ backdrop,
946
+ table: list,
947
+ transition,
948
+ transform,
949
+ accent: list,
950
+ appearance: list,
951
+ cursor,
952
+ caret: list,
953
+ pointer: float,
954
+ resize,
955
+ scroll,
956
+ inset,
957
+ touch: list,
958
+ user,
959
+ will,
960
+ fill: float,
961
+ stroke: list,
962
+ color,
963
+ row
964
+ };
965
+ const splitReg = /([\w-]+)\s*:\s*([^;]+)/;
966
+ function toUnocss(css, isRem = false) {
967
+ var _typeMap$first;
968
+ css = css.replace(browserReg, "");
969
+ const match = css.match(splitReg);
970
+ if (!match) return;
971
+ const [_, key, val] = match;
972
+ const first = getFirstName(key);
973
+ const result = (_typeMap$first = typeMap[first]) === null || _typeMap$first === void 0 ? void 0 : _typeMap$first.call(typeMap, key, val);
974
+ if (result && isRem) return result.replace(/-([0-9.]+)px/, (_$1, v) => `-${+v / 4}`).replace(/\[[^\]]+\]/g, (match$1) => match$1.replace(/([0-9.]+)px/g, (_$1, v) => `${+v / 16}rem`));
975
+ return result;
976
+ }
977
+
978
+ //#endregion
979
+ //#region src/transformer.ts
980
+ function createRuleProcessor(config) {
981
+ return (v) => {
982
+ const anyMatch = config.anyMatch || [];
983
+ const priority = config.priority || [];
984
+ let matchedAnyRule = null;
985
+ if (anyMatch.length > 0) {
986
+ matchedAnyRule = anyMatch.find((rule) => v[rule.key] && (rule.pattern instanceof RegExp ? rule.pattern.test(v[rule.key]) : v[rule.key] === rule.pattern));
987
+ if (!matchedAnyRule) return {
988
+ transformedResult: "",
989
+ deleteKeys: []
990
+ };
991
+ }
992
+ let valueToUse = "";
993
+ if (anyMatch.length > 0 && priority.length > 0) for (const key of priority) {
994
+ const rule = anyMatch.find((r) => r.key === key);
995
+ if (rule && v[key] && (rule.pattern instanceof RegExp ? rule.pattern.test(v[key]) : v[key] === rule.pattern)) {
996
+ valueToUse = v[key];
997
+ break;
998
+ }
999
+ }
1000
+ const allMatchRules = { ...config.allMatch };
1001
+ const allMatchKeys = Object.keys(allMatchRules);
1002
+ for (const key of allMatchKeys) {
1003
+ const expectedValue = allMatchRules[key];
1004
+ if (!(expectedValue instanceof RegExp ? expectedValue.test(v[key]) : v[key] === expectedValue)) return {
1005
+ transformedResult: "",
1006
+ deleteKeys: []
1007
+ };
1008
+ }
1009
+ const deleteKeys = [...allMatchKeys, ...anyMatch.map((rule) => rule.key)];
1010
+ const transformedResult = typeof config.outputTemplate === "function" ? config.outputTemplate(valueToUse) : config.outputTemplate.replace("${value}", valueToUse);
1011
+ return {
1012
+ transformedResult,
1013
+ deleteKeys
1014
+ };
1015
+ };
1016
+ }
1017
+ const transformer = {
1018
+ "line-clamp-${number}": createRuleProcessor({
1019
+ allMatch: {
1020
+ "overflow": "hidden",
1021
+ "display": "-webkit-box",
1022
+ "-webkit-box-orient": "vertical"
1023
+ },
1024
+ anyMatch: [{
1025
+ key: "-webkit-line-clamp",
1026
+ pattern: /\d/
1027
+ }, {
1028
+ key: "line-clamp",
1029
+ pattern: /\d/
1030
+ }],
1031
+ priority: ["line-clamp", "-webkit-line-clamp"],
1032
+ outputTemplate: (value) => `line-clamp-${value}`
1033
+ }),
1034
+ "line-clamp-${prop}": createRuleProcessor({
1035
+ allMatch: {
1036
+ "overflow": "visible",
1037
+ "display": "block",
1038
+ "-webkit-box-orient": "horizontal"
1039
+ },
1040
+ anyMatch: [{
1041
+ key: "-webkit-line-clamp",
1042
+ pattern: /inherit|initial|revert|unset/
1043
+ }, {
1044
+ key: "line-clamp",
1045
+ pattern: /inherit|initial|revert|unset/
1046
+ }],
1047
+ priority: ["line-clamp", "-webkit-line-clamp"],
1048
+ outputTemplate: (value) => `line-clamp-${value}`
1049
+ }),
1050
+ "truncate": createRuleProcessor({
1051
+ allMatch: {
1052
+ "overflow": "hidden",
1053
+ "text-overflow": "ellipsis",
1054
+ "white-space": "nowrap"
1055
+ },
1056
+ outputTemplate: () => "truncate"
1057
+ })
1058
+ };
1059
+ function transformStyleToUnocssPre(styles) {
1060
+ const preTransformedList = [];
1061
+ const styleToObj = styles.split(";").reduce((r, item) => {
1062
+ const [key, value] = item.split(":");
1063
+ if (key.trim() && value.trim()) r[key.trim()] = value.trim();
1064
+ return r;
1065
+ }, {});
1066
+ for (const key in transformer) {
1067
+ const { transformedResult, deleteKeys } = transformer[key](styleToObj);
1068
+ if (transformedResult && deleteKeys.length) {
1069
+ preTransformedList.push(transformedResult);
1070
+ deleteKeys.forEach((deleteKey) => {
1071
+ delete styleToObj[deleteKey];
1072
+ });
1073
+ }
1074
+ }
1075
+ return {
1076
+ transformedResult: preTransformedList.join(" "),
1077
+ newStyle: Object.entries(styleToObj).map(([key, value]) => `${key}: ${value}`).join("; ")
1078
+ };
1079
+ }
1080
+
1081
+ //#endregion
1082
+ //#region src/transformStyleToUnocss.ts
1083
+ function transformStyleToUnocss(styles, isRem) {
1084
+ const noTransfer = [];
1085
+ const cache = new Set();
1086
+ const { newStyle, transformedResult } = transformStyleToUnocssPre(styles);
1087
+ if (transformedResult) return [[transformedResult, newStyle.split(";").filter(Boolean).reduce((result, cur) => {
1088
+ const key = cur.replaceAll(browserReg, "").trim();
1089
+ if (cache.has(key)) return result;
1090
+ cache.add(key);
1091
+ const val = toUnocss(cur, isRem) || "";
1092
+ if (!val) noTransfer.push(cur);
1093
+ return result += `${val} `;
1094
+ }, "").trim().replace(/\s+/g, " ")].filter(Boolean).join(" "), noTransfer];
1095
+ return [styles.split(";").filter(Boolean).reduce((result, cur) => {
1096
+ const key = cur.replaceAll(browserReg, "").trim();
1097
+ if (cache.has(key)) return result;
1098
+ cache.add(key);
1099
+ const val = toUnocss(cur, isRem) || "";
1100
+ if (!val) noTransfer.push(cur);
1101
+ return result += `${val} `;
1102
+ }, "").trim().replace(/\s+/g, " "), noTransfer];
1103
+ }
1104
+
1105
+ //#endregion
1106
+ //#region src/toUnocssClass.ts
1107
+ function toUnocssClass(css, isRem = false) {
1108
+ const [transferred, noTransferred] = transformStyleToUnocss(css, isRem);
1109
+ return [transferred ? transferred.replace(/([^\s=]+)="([^"]+)"/g, (_, v1, v2) => v2.split(" ").map((v) => `${v1}-${v}`).join(" ")) : "", noTransferred];
1110
+ }
1111
+
1112
+ //#endregion
1113
+ exports.browserReg = browserReg
1114
+ exports.commaReplacer = commaReplacer
1115
+ exports.cssMathFnRE = cssMathFnRE
1116
+ exports.diffTemplateStyle = diffTemplateStyle
1117
+ exports.flag = flag
1118
+ exports.getFirstName = getFirstName
1119
+ exports.getGradient = getGradient
1120
+ exports.getHundred = getHundred
1121
+ exports.getLastName = getLastName
1122
+ exports.getStyleScoped = getStyleScoped
1123
+ exports.getVal = getVal
1124
+ exports.isCalc = isCalc
1125
+ exports.isColor = isColor
1126
+ exports.isCubicBezier = isCubicBezier
1127
+ exports.isEmptyStyle = isEmptyStyle
1128
+ exports.isHex = isHex
1129
+ exports.isHsl = isHsl
1130
+ exports.isNot = isNot
1131
+ exports.isPercent = isPercent
1132
+ exports.isRgb = isRgb
1133
+ exports.isSize = isSize
1134
+ exports.isUrl = isUrl
1135
+ exports.isVar = isVar
1136
+ exports.joinEmpty = joinEmpty
1137
+ exports.joinWithLine = joinWithLine
1138
+ exports.joinWithUnderLine = joinWithUnderLine
1139
+ exports.linearGradientReg = linearGradientReg
1140
+ exports.linearGradientReg1 = linearGradientReg1
1141
+ exports.numberWithUnitRE = numberWithUnitRE
1142
+ exports.otherGradientReg = otherGradientReg
1143
+ exports.positionMap = positionMap
1144
+ exports.toUnocss = toUnocss
1145
+ exports.toUnocssClass = toUnocssClass
1146
+ exports.transformImportant = transformImportant
1147
+ exports.transformStyleToUnocss = transformStyleToUnocss
1148
+ exports.transformStyleToUnocssPre = transformStyleToUnocssPre
1149
+ exports.trim = trim
1150
+ return exports;
1151
+ })({});
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "transform-to-unocss-core",
3
3
  "type": "module",
4
- "version": "0.0.48",
5
- "description": "",
4
+ "version": "0.0.49",
5
+ "description": "A utility to transform CSS to UnoCSS syntax. Supports various CSS properties and custom parsing.",
6
6
  "author": "Simon He",
7
7
  "license": "MIT",
8
8
  "funding": "https://github.com/sponsors/Simon-He95",
@@ -12,7 +12,18 @@
12
12
  "url": "git+https://github.com/Simon-He95/transform-to-unocss-core.git"
13
13
  },
14
14
  "bugs": "https://github.com/Simon-He95/transform-to-unocss-core/issues",
15
- "keywords": [],
15
+ "keywords": [
16
+ "unocss",
17
+ "css",
18
+ "transform",
19
+ "converter",
20
+ "utility",
21
+ "postcss",
22
+ "css-in-js",
23
+ "tailwind",
24
+ "style",
25
+ "parser"
26
+ ],
16
27
  "sideEffects": false,
17
28
  "exports": {
18
29
  ".": {
@@ -38,7 +49,7 @@
38
49
  "dist"
39
50
  ],
40
51
  "scripts": {
41
- "build": "tsdown ./src/index.ts --clean",
52
+ "build": "tsdown ./src/index.ts",
42
53
  "dev": "npm run build -- --watch src",
43
54
  "format": "prettier --write --cache .",
44
55
  "lint": "eslint . --cache",
@@ -51,14 +62,14 @@
51
62
  },
52
63
  "devDependencies": {
53
64
  "@antfu/eslint-config": "^4.12.0",
54
- "@types/node": "^18.19.86",
65
+ "@types/node": "^18.19.87",
55
66
  "bumpp": "^8.2.1",
56
67
  "eslint": "^9.25.1",
57
68
  "esno": "^0.16.3",
58
69
  "picocolors": "^1.1.1",
59
70
  "prettier": "^2.8.8",
60
71
  "rimraf": "^3.0.2",
61
- "tsdown": "^0.9.5",
72
+ "tsdown": "^0.10.1",
62
73
  "tsx": "^3.14.0",
63
74
  "typescript": "^4.9.5",
64
75
  "vitest": "^0.15.2"