@unocss/preset-mini 0.17.2 → 0.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
- import { c as colorResolver$1, h as handler, d as directionMap, a as cornerMap, p as parseColor, b as capitalize, e as directionSize, x as xyzMap } from './utilities.mjs';
2
- import { toArray } from '@unocss/core';
1
+ import { h as handler, c as colorResolver$1, d as directionMap, p as parseColor, a as cornerMap, b as capitalize, e as directionSize, x as xyzMap } from './utilities.mjs';
2
+ import { toArray, cacheFunction } from '@unocss/core';
3
3
  import { C as CONTROL_BYPASS_PSEUDO_CLASS } from './pseudo.mjs';
4
4
 
5
5
  const verticalAlignAlias = {
@@ -17,38 +17,12 @@ const textAligns = [
17
17
  ["text-justify", { "text-align": "justify" }]
18
18
  ];
19
19
 
20
- const outlineStyle = ["auto", "dotted", "dashed", "solid", "double", "groove", "ridge", "inset", "outset", "inherit", "initial", "revert", "unset"];
21
- const parseOutlineSize = (s) => {
22
- const propName = ["width", "offset"].find((item) => s.startsWith(item)) || "width";
23
- const size = handler.bracket.fraction.auto.rem(s.replace(/^(offset\-|width\-|size\-)/, ""));
24
- if (size) {
25
- return {
26
- [`outline-${propName}`]: size
27
- };
28
- }
29
- };
30
20
  const outline = [
21
+ [/^outline-(?:width-|size-)?(.+)$/, ([, d]) => ({ "outline-width": handler.bracket.fraction.auto.rem(d) })],
22
+ [/^outline-(?:color-)?(.+)$/, colorResolver$1("outline-color", "outline-color")],
23
+ [/^outline-offset-(.+)$/, ([, d]) => ({ "outline-offset": handler.bracket.fraction.auto.rem(d) })],
31
24
  ["outline", { "outline-style": "solid" }],
32
- [
33
- /^outline-(.+)$/,
34
- (match, config) => {
35
- const [, d] = match;
36
- if (outlineStyle.includes(d)) {
37
- return {
38
- "outline-style": d
39
- };
40
- }
41
- const colorSheet = colorResolver$1("outline-color", "outline-color")([
42
- match[0],
43
- match[1].replace(/^color-/, "")
44
- ], config);
45
- if (colorSheet)
46
- return colorSheet;
47
- const sizeSheet = parseOutlineSize(d);
48
- if (sizeSheet)
49
- return sizeSheet;
50
- }
51
- ],
25
+ [/^outline-(auto|dotted|dashed|solid|double|groove|ridge|inset|outset|inherit|initial|revert|unset)$/, ([, c]) => ({ "outline-style": c })],
52
26
  ["outline-none", { "outline": "2px solid transparent", "outline-offset": "2px" }]
53
27
  ];
54
28
  const appearance = [
@@ -57,21 +31,6 @@ const appearance = [
57
31
  "-webkit-appearance": "none"
58
32
  }]
59
33
  ];
60
- const placeholder = [
61
- [
62
- /^placeholder-opacity-(\d+)$/,
63
- ([, d]) => ({
64
- "placeholder-opacity": handler.bracket.percent(d)
65
- })
66
- ],
67
- [
68
- /^placeholder-(?!opacity)(.+)$/,
69
- (match, config) => {
70
- match[1] = match[1].replace(/^color-/, "");
71
- return colorResolver$1("placeholder-color", "placeholder-color")(match, config);
72
- }
73
- ]
74
- ];
75
34
  const willChange = [
76
35
  [/^will-change-(.+)/, ([, p]) => ({ "will-change": handler.properties.global(p) })]
77
36
  ];
@@ -84,16 +43,59 @@ const borders = [
84
43
  [/^(?:border|b)-([^-]+)-size-(.+)$/, handlerBorderSize],
85
44
  [/^(?:border|b)()-(.+)$/, handlerBorderColor],
86
45
  [/^(?:border|b)-([^-]+)(?:-(.+))?$/, handlerBorderColor],
87
- [/^(?:border|b)-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-border-opacity": handler.bracket.percent(opacity) })],
46
+ [/^(?:border|b)-op(?:acity)?-?(.+)$/, ([, opacity], { options: { variablePrefix: p } }) => ({ [`--${p}border-opacity`]: handler.bracket.percent(opacity) })],
47
+ [/^(?:border|b)-([^-]+)-op(?:acity)?-?(.+)$/, ([, a, opacity], { options: { variablePrefix: p } }) => {
48
+ const v = handler.bracket.percent(opacity);
49
+ const d = directionMap[a];
50
+ if (v !== void 0 && d)
51
+ return d.map((i) => [`--${p}border${i}-opacity`, v]);
52
+ }],
53
+ [/^(?:border-)?(?:rounded|rd)$/, handlerRounded],
54
+ [/^(?:border-)?(?:rounded|rd)(?:-(.+))?$/, handlerRounded],
55
+ [/^(?:border-)?(?:rounded|rd)(?:-([^-]+))?(?:-(.+))?$/, handlerRounded],
88
56
  ["border-solid", { "border-style": "solid" }],
89
57
  ["border-dashed", { "border-style": "dashed" }],
90
58
  ["border-dotted", { "border-style": "dotted" }],
91
59
  ["border-double", { "border-style": "double" }],
92
- ["border-none", { "border-style": "none" }],
93
- [/^(?:border-)?(?:rounded|rd)$/, handlerRounded],
94
- [/^(?:border-)?(?:rounded|rd)(?:-(.+))?$/, handlerRounded],
95
- [/^(?:border-)?(?:rounded|rd)(?:-([^-]+))?(?:-(.+))?$/, handlerRounded]
60
+ ["border-none", { "border-style": "none" }]
96
61
  ];
62
+ const borderHasColor = (color, { theme }) => {
63
+ return color !== void 0 && !!parseColor(color, theme)?.color;
64
+ };
65
+ const borderColorResolver = (direction) => ([, body], { theme, options: { variablePrefix: p } }) => {
66
+ const data = parseColor(body, theme);
67
+ if (!data)
68
+ return;
69
+ const { opacity, color, rgba } = data;
70
+ if (!color)
71
+ return;
72
+ const a = opacity ? opacity[0] === "[" ? handler.bracket.percent(opacity) : parseFloat(opacity) / 100 : rgba?.[3];
73
+ if (rgba) {
74
+ if (a != null && !Number.isNaN(a)) {
75
+ rgba[3] = typeof a === "string" && !a.includes("%") ? parseFloat(a) : a;
76
+ return {
77
+ [`border${direction}-color`]: `rgba(${rgba.join(",")})`
78
+ };
79
+ } else {
80
+ if (direction === "") {
81
+ return {
82
+ [`--${p}border-opacity`]: 1,
83
+ [`border${direction}-color`]: `rgba(${rgba.slice(0, 3).join(",")},var(--${p}border${direction}-opacity))`
84
+ };
85
+ } else {
86
+ return {
87
+ [`--${p}border-opacity`]: 1,
88
+ [`--${p}border${direction}-opacity`]: `var(--${p}border-opacity)`,
89
+ [`border${direction}-color`]: `rgba(${rgba.slice(0, 3).join(",")},var(--${p}border${direction}-opacity))`
90
+ };
91
+ }
92
+ }
93
+ } else {
94
+ return {
95
+ [`border${direction}-color`]: color.replace("%alpha", `${a || 1}`)
96
+ };
97
+ }
98
+ };
97
99
  function handlerBorder(m) {
98
100
  const borderSizes = handlerBorderSize(m);
99
101
  if (borderSizes) {
@@ -110,8 +112,8 @@ function handlerBorderSize([, a, b]) {
110
112
  return directionMap[d].map((i) => [`border${i}-width`, v]);
111
113
  }
112
114
  function handlerBorderColor([, a, c], ctx) {
113
- if (c !== void 0 && colorResolver$1("border-color", "border")(["", c], ctx)) {
114
- return Object.assign({}, ...directionMap[directionMap[a] ? a : ""].map((i) => colorResolver$1(`border${i}-color`, "border")(["", c], ctx)));
115
+ if (borderHasColor(c, ctx)) {
116
+ return Object.assign({}, ...directionMap[directionMap[a] ? a : ""].map((i) => borderColorResolver(i)(["", c], ctx)));
115
117
  }
116
118
  }
117
119
  function handlerRounded([, a, b], { theme }) {
@@ -132,18 +134,6 @@ const bgColors = [
132
134
  [/^bg-(.+)$/, colorResolver$1("background-color", "bg")],
133
135
  [/^bg-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-bg-opacity": handler.bracket.percent(opacity2) })]
134
136
  ];
135
- const borderColors = [
136
- [/^(?:border|b)-(.+)$/, colorResolver$1("border-color", "border")],
137
- [/^(?:border|b)-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-border-opacity": handler.bracket.percent(opacity2) })]
138
- ];
139
- const ringColors = [
140
- [/^ring-(.+)$/, colorResolver$1("--un-ring-color", "ring")],
141
- [/^ring-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-ring-opacity": handler.bracket.percent(opacity2) })]
142
- ];
143
- const ringOffsetColors = [
144
- [/^ring-offset-(.+)$/, colorResolver$1("--un-ring-offset-color", "ring-offset")],
145
- [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-ring-offset-opacity": handler.bracket.percent(opacity2) })]
146
- ];
147
137
 
148
138
  const transitionProperty = (prop) => {
149
139
  return handler.properties(prop) || (prop === "all" ? prop : void 0);
@@ -181,7 +171,7 @@ const flex = [
181
171
  ["flex-auto", { flex: "1 1 auto" }],
182
172
  ["flex-initial", { flex: "0 1 auto" }],
183
173
  ["flex-none", { flex: "none" }],
184
- [/^flex-\[(.+)\]$/, ([, d]) => ({ flex: d })],
174
+ [/^flex-(\[.+\])$/, ([, d]) => ({ flex: handler.bracket(d).replace(/\d+\/\d+/, ($1) => handler.fraction($1)) })],
185
175
  ["flex-shrink", { "flex-shrink": 1 }],
186
176
  ["flex-shrink-0", { "flex-shrink": 0 }],
187
177
  ["flex-grow", { "flex-grow": 1 }],
@@ -292,30 +282,17 @@ const textShadows = [
292
282
  ];
293
283
 
294
284
  const gaps = [
295
- [/^(?:flex-|grid-)?gap-([^-]+)$/, ([, s]) => {
296
- const v = handler.bracket.auto.rem(s);
297
- if (v != null) {
298
- return {
299
- "grid-gap": v,
300
- "gap": v
301
- };
302
- }
303
- }],
304
- [/^(?:flex-|grid-)?gap-x-([^-]+)$/, ([, s]) => {
285
+ [/^(?:flex-|grid-)?gap-(x-|y-)?([^-]+)$/, ([, d = "", s]) => {
305
286
  const v = handler.bracket.auto.rem(s);
306
287
  if (v != null) {
288
+ const direction = {
289
+ "": "",
290
+ "x-": "column-",
291
+ "y-": "row-"
292
+ }[d];
307
293
  return {
308
- "grid-column-gap": v,
309
- "column-gap": v
310
- };
311
- }
312
- }],
313
- [/^(?:flex-|grid-)?gap-y-([^-]+)$/, ([, s]) => {
314
- const v = handler.bracket.auto.rem(s);
315
- if (v != null) {
316
- return {
317
- "grid-row-gap": v,
318
- "row-gap": v
294
+ [`grid-${direction}gap`]: v,
295
+ [`${direction}gap`]: v
319
296
  };
320
297
  }
321
298
  }]
@@ -349,7 +326,7 @@ const grids = [
349
326
  if (parts[0] === "span") {
350
327
  if (parts[1] === "full")
351
328
  return { [key]: "1/-1" };
352
- raw = handler.number.bracket(parts[1])?.toString().replace(/_/g, " ");
329
+ raw = handler.number.bracket(parts[1]);
353
330
  if (raw)
354
331
  return { [key]: `span ${raw}/span ${raw}` };
355
332
  }
@@ -357,12 +334,12 @@ const grids = [
357
334
  [/^(?:grid-)?auto-cols-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-columns": autoDirection(v, theme) })],
358
335
  [/^(?:grid-)?auto-flow-([\w.-]+)$/, ([, v]) => ({ "grid-auto-flow": v.replace("col", "column").split("-").join(" ") })],
359
336
  [/^(?:grid-)?auto-rows-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-rows": autoDirection(v, theme) })],
337
+ [/^grid-cols-(.+)$/, ([, v]) => ({ "grid-template-columns": handler.bracket(v) })],
338
+ [/^grid-rows-(.+)$/, ([, v]) => ({ "grid-template-rows": handler.bracket(v) })],
360
339
  [/^grid-cols-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-columns": `repeat(auto-fill,minmax(${d},1fr))` })],
361
340
  [/^grid-rows-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-rows": `repeat(auto-fill,minmax(${d},1fr))` })],
362
341
  [/^grid-cols-(\d+)$/, ([, d]) => ({ "grid-template-columns": `repeat(${d},minmax(0,1fr))` })],
363
- [/^grid-rows-(\d+)$/, ([, d]) => ({ "grid-template-rows": `repeat(${d},minmax(0,1fr))` })],
364
- [/^grid-cols-\[(.+)\]$/, ([, v]) => ({ "grid-template-columns": v.replace(/,/g, " ") })],
365
- [/^grid-rows-\[(.+)\]$/, ([, v]) => ({ "grid-template-rows": v.replace(/,/g, " ") })]
342
+ [/^grid-rows-(\d+)$/, ([, d]) => ({ "grid-template-rows": `repeat(${d},minmax(0,1fr))` })]
366
343
  ];
367
344
 
368
345
  const overflowValues = [
@@ -378,11 +355,8 @@ const overflows = [
378
355
 
379
356
  const basicSet = ["auto", "start", "end", "center", "stretch"];
380
357
  const positions = [
381
- ["relative", { position: "relative" }],
382
- ["absolute", { position: "absolute" }],
383
- ["fixed", { position: "fixed" }],
384
- ["sticky", { position: "sticky" }],
385
- ["static", { position: "static" }]
358
+ [/^(?:position-|pos-)?(relative|absolute|fixed|sticky)$/, ([, v]) => ({ position: v })],
359
+ [/^(?:position-|pos-)?(static)$/, ([, v]) => ({ position: v })]
386
360
  ];
387
361
  const justifies = [
388
362
  ["justify-start", { "justify-content": "flex-start" }],
@@ -395,7 +369,9 @@ const justifies = [
395
369
  ...basicSet.map((i) => [`justify-self-${i}`, { "justify-self": i }])
396
370
  ];
397
371
  const orders = [
398
- [/^order-(.+)$/, ([, v]) => ({ order: { first: "-9999", last: "9999" }[v] || handler.bracket.number(v) })],
372
+ [/^order-(.+)$/, ([, v]) => ({ order: handler.bracket.number(v) })],
373
+ ["order-first", { order: "-9999" }],
374
+ ["order-last", { order: "9999" }],
399
375
  ["order-none", { order: "0" }]
400
376
  ];
401
377
  const alignments = [
@@ -431,17 +407,20 @@ function handleInsetValue(v) {
431
407
  return { auto: "auto", full: "100%" }[v] ?? handler.bracket.fraction.cssvar.auto.rem(v);
432
408
  }
433
409
  const insets = [
434
- [/^(top|left|right|bottom|inset)-(.+)$/, ([, d, v]) => ({ [d]: handleInsetValue(v) })],
435
- [/^inset-([xy])-(.+)$/, ([, d, v]) => {
410
+ [/^(?:position-|pos-)?(top|left|right|bottom|inset)-(.+)$/, ([, d, v]) => ({ [d]: handleInsetValue(v) })],
411
+ [/^(?:position-|pos-)?inset-([xy])-(.+)$/, ([, d, v]) => {
436
412
  const r = handleInsetValue(v);
437
413
  if (r != null && d in directionMap)
438
414
  return directionMap[d].map((i) => [i.slice(1), r]);
439
415
  }]
440
416
  ];
441
417
  const floats = [
442
- [/^float-(left|right)$/, ([, value]) => ({ float: value })],
418
+ ["float-left", { float: "left" }],
419
+ ["float-right", { float: "right" }],
443
420
  ["float-none", { float: "none" }],
444
- [/^clear-(left|right|both)$/, ([, value]) => ({ clear: value })],
421
+ ["clear-left", { clear: "left" }],
422
+ ["clear-right", { clear: "right" }],
423
+ ["clear-both", { clear: "both" }],
445
424
  ["clear-none", { clear: "none" }]
446
425
  ];
447
426
  const zIndexes = [
@@ -449,14 +428,11 @@ const zIndexes = [
449
428
  [/^z-([^-]+)$/, ([, v]) => ({ "z-index": handler.number(v) })]
450
429
  ];
451
430
  const boxSizing = [
452
- [
453
- /^box-(border|content)$/,
454
- ([, value]) => ({
455
- "box-sizing": `${value}-box`
456
- })
457
- ]
431
+ ["box-border", { "box-sizing": "border-box" }],
432
+ ["box-content", { "box-sizing": "content-box" }]
458
433
  ];
459
434
 
435
+ const varEmptyFn = cacheFunction((prefix) => `var(--${prefix}empty,/*!*/ /*!*/)`);
460
436
  const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
461
437
  const displays = [
462
438
  ["inline", { display: "inline" }],
@@ -487,7 +463,9 @@ const resizes = [
487
463
  ["resize-none", { resize: "none" }]
488
464
  ];
489
465
  const userSelects = [
490
- [/^select-(text|all|auto)$/, ([, v]) => ({ "user-select": v })],
466
+ ["select-auto", { "user-select": "auto" }],
467
+ ["select-all", { "user-select": "all" }],
468
+ ["select-text", { "user-select": "text" }],
491
469
  ["select-none", { "user-select": "none" }]
492
470
  ];
493
471
  const whitespaces = [
@@ -530,30 +508,28 @@ const fontSmoothings = [
530
508
  ];
531
509
 
532
510
  const rings = [
533
- [/^ring-?(.*)$/, ([, d]) => {
511
+ [/^ring-?(.*)$/, ([, d], { options: { variablePrefix: p } }) => {
534
512
  const value = handler.px(d || "1");
535
513
  if (value) {
536
514
  return {
537
- "--un-ring-inset": varEmpty,
538
- "--un-ring-offset-width": "0px",
539
- "--un-ring-offset-color": "#fff",
540
- "--un-ring-color": "rgba(59, 130, 246, .5)",
541
- "--un-ring-offset-shadow": "var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)",
542
- "--un-ring-shadow": `var(--un-ring-inset) 0 0 0 calc(${value} + var(--un-ring-offset-width)) var(--un-ring-color)`,
543
- "-webkit-box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)",
544
- "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)"
515
+ [`--${p}ring-inset`]: varEmptyFn(p),
516
+ [`--${p}ring-offset-width`]: "0px",
517
+ [`--${p}ring-offset-color`]: "#fff",
518
+ [`--${p}ring-color`]: "rgba(59, 130, 246, .5)",
519
+ [`--${p}ring-offset-shadow`]: `var(--${p}ring-inset) 0 0 0 var(--${p}ring-offset-width) var(--${p}ring-offset-color)`,
520
+ [`--${p}ring-shadow`]: `var(--${p}ring-inset) 0 0 0 calc(${value} + var(--${p}ring-offset-width)) var(--${p}ring-color)`,
521
+ "-webkit-box-shadow": `var(--${p}ring-offset-shadow), var(--${p}ring-shadow), var(--${p}shadow, 0 0 #0000)`,
522
+ "box-shadow": `var(--${p}ring-offset-shadow), var(--${p}ring-shadow), var(--${p}shadow, 0 0 #0000)`
545
523
  };
546
524
  }
547
525
  }],
548
- ["ring-offset", { "--un-ring-offset-width": "1px" }],
549
- [/^ring-offset-(.+)$/, ([, d]) => {
550
- const value = handler.px(d || "1");
551
- if (value)
552
- return { "--un-ring-offset-width": value };
553
- }],
554
- ["ring-inset", { "--un-ring-inset": "inset" }],
555
- ...ringColors,
556
- ...ringOffsetColors
526
+ [/^ring-offset$/, (_, { options: { variablePrefix: p } }) => ({ [`--${p}ring-offset-width`]: "1px" })],
527
+ [/^ring-offset-(.+)$/, ([, d], { options: { variablePrefix: p } }) => ({ [`--${p}ring-offset-width`]: handler.px(d || "1") })],
528
+ [/^ring-(.+)$/, (m, ctx) => colorResolver$1(`--${ctx.options.variablePrefix}ring-color`, "ring")(m, ctx)],
529
+ [/^ring-op(?:acity)?-?(.+)$/, ([, opacity], { options: { variablePrefix: p } }) => ({ [`--${p}ring-opacity`]: handler.bracket.percent(opacity) })],
530
+ [/^ring-offset-(.+)$/, (m, ctx) => colorResolver$1(`--${ctx.options.variablePrefix}ring-offset-color`, "ring-offset")(m, ctx)],
531
+ [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity], { options: { variablePrefix: p } }) => ({ [`--${p}ring-offset-opacity`]: handler.bracket.percent(opacity) })],
532
+ [/^ring-inset$/, (_, { options: { variablePrefix: p } }) => ({ [`--${p}ring-inset`]: "inset" })]
557
533
  ];
558
534
 
559
535
  const colorResolver = (body, theme) => {
@@ -583,10 +559,8 @@ const boxShadows = [
583
559
  "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
584
560
  };
585
561
  }
586
- const color = colorResolver(d, theme);
587
- if (color)
588
- return color;
589
- }]
562
+ }],
563
+ [/^shadow-(.+)$/, ([, d], { theme }) => colorResolver(d, theme)]
590
564
  ];
591
565
 
592
566
  function getPropName(minmax, hw) {
@@ -659,6 +633,8 @@ const transforms = [
659
633
  [/^scale-([xyz])-(.+)$/, handleScale],
660
634
  [/^rotate-(.+)$/, handleRotate],
661
635
  [/^rotate-((?!\[)[^-]+?)(?:deg)?$/, handleRotateWithUnit],
636
+ [/^skew-([xy])-(.+)$/, handleSkew],
637
+ [/^skew-([xy])-((?!\[)[^-]+?)(?:deg)?$/, handleSkewWithUnit],
662
638
  ["transform-gpu", transformGpu],
663
639
  ["transform-cpu", transformCpu],
664
640
  ["transform-none", { transform: "none" }],
@@ -712,6 +688,24 @@ function handleRotate([, b]) {
712
688
  ];
713
689
  }
714
690
  }
691
+ function handleSkewWithUnit([, d, b]) {
692
+ const v = handler.bracket.number(b);
693
+ if (v != null) {
694
+ return [
695
+ transformBase,
696
+ { [`--un-skew-${d}`]: `${v}deg` }
697
+ ];
698
+ }
699
+ }
700
+ function handleSkew([, d, b]) {
701
+ const v = handler.bracket(b);
702
+ if (v != null) {
703
+ return [
704
+ transformBase,
705
+ { [`--un-skew-${d}`]: v }
706
+ ];
707
+ }
708
+ }
715
709
 
716
710
  const variablesAbbrMap = {
717
711
  "visible": "visibility",
@@ -773,14 +767,8 @@ const textDecorations = [
773
767
  ["line-through", { "text-decoration": "line-through" }],
774
768
  ["decoration-underline", { "text-decoration": "underline" }],
775
769
  ["decoration-line-through", { "text-decoration": "line-through" }],
776
- [/^(?:underline|decoration)-(solid|double|dotted|dashed|wavy)$/, ([, d]) => ({ "text-decoration-style": d })],
777
- [/^(?:underline|decoration)-([^-]+)$/, ([, s]) => ({ "text-decoration-thickness": ["auto", "from-font"].includes(s) ? s : handler.bracket.px(s) })],
778
- [/^decoration-(.+)$/, ([, d]) => ({ "text-decoration-thickness": handler.bracket.px(d) })],
779
- [/^underline-offset-([^-]+)$/, ([, s]) => {
780
- const v = s === "auto" ? s : handler.bracket.px(s);
781
- if (v != null)
782
- return { "text-underline-offset": v };
783
- }],
770
+ [/^(?:underline|decoration)-(?:size-)?(.+)$/, ([, s]) => ({ "text-decoration-thickness": handler.bracket.px(s) })],
771
+ [/^(?:underline|decoration)-(auto|from-font)$/, ([, s]) => ({ "text-decoration-thickness": s })],
784
772
  [/^(?:underline|decoration)-(.+)$/, (match, ctx) => {
785
773
  const result = colorResolver$1("text-decoration-color", "line")(match, ctx);
786
774
  if (result) {
@@ -791,6 +779,8 @@ const textDecorations = [
791
779
  }
792
780
  }],
793
781
  [/^(?:underline|decoration)-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-line-opacity": handler.bracket.percent(opacity) })],
782
+ [/^underline-offset-(.+)$/, ([, s]) => ({ "text-underline-offset": handler.auto.bracket.px(s) })],
783
+ [/^(?:underline|decoration)-(solid|double|dotted|dashed|wavy|inherit|initial|revert|unset)$/, ([, d]) => ({ "text-decoration-style": d })],
794
784
  ["no-underline", { "text-decoration": "none" }],
795
785
  ["decoration-none", { "text-decoration": "none" }]
796
786
  ];
@@ -850,7 +840,6 @@ const rules = [
850
840
  overflows,
851
841
  outline,
852
842
  appearance,
853
- placeholder,
854
843
  positions,
855
844
  orders,
856
845
  justifies,
@@ -866,4 +855,4 @@ const rules = [
866
855
  questionMark
867
856
  ].flat(1);
868
857
 
869
- export { textIndents as $, boxSizing as A, questionMark as B, rings as C, boxShadows as D, sizes as E, aspectRatio as F, paddings as G, margins as H, varEmpty as I, displays as J, appearances as K, cursors as L, pointerEvents as M, resizes as N, userSelects as O, whitespaces as P, contents as Q, breaks as R, textOverflows as S, textTransforms as T, fontStyles as U, fontSmoothings as V, svgUtilities as W, transforms as X, transitions as Y, fonts as Z, tabSizes as _, appearance as a, textStrokes as a0, textShadows as a1, cssVariables as a2, textDecorations as a3, borders as b, opacity as c, textColors as d, bgColors as e, borderColors as f, ringColors as g, ringOffsetColors as h, flex as i, gaps as j, grids as k, overflows as l, positions as m, justifies as n, outline as o, placeholder as p, orders as q, rules as r, alignments as s, textAligns as t, placements as u, verticalAligns as v, willChange as w, insets as x, floats as y, zIndexes as z };
858
+ export { cssVariables as $, sizes as A, aspectRatio as B, paddings as C, margins as D, varEmptyFn as E, varEmpty as F, displays as G, appearances as H, cursors as I, pointerEvents as J, resizes as K, userSelects as L, whitespaces as M, contents as N, breaks as O, textOverflows as P, textTransforms as Q, fontStyles as R, fontSmoothings as S, svgUtilities as T, transforms as U, transitions as V, fonts as W, tabSizes as X, textIndents as Y, textStrokes as Z, textShadows as _, appearance as a, textDecorations as a0, borders as b, opacity as c, textColors as d, bgColors as e, flex as f, gaps as g, grids as h, overflows as i, justifies as j, orders as k, alignments as l, placements as m, insets as n, outline as o, positions as p, floats as q, rules as r, boxSizing as s, textAligns as t, questionMark as u, verticalAligns as v, willChange as w, rings as x, boxShadows as y, zIndexes as z };
@@ -4,7 +4,7 @@ const variants$1 = require('./variants.cjs');
4
4
  const pseudo = require('./pseudo.cjs');
5
5
 
6
6
  const regexCache = {};
7
- const variantBreakpoints = (matcher, _, theme) => {
7
+ const variantBreakpoints = (matcher, { theme }) => {
8
8
  const variantEntries = Object.entries(theme.breakpoints || {}).map(([point, size], idx) => [point, size, idx]);
9
9
  for (const [point, size, idx] of variantEntries) {
10
10
  if (!regexCache[point])
@@ -46,25 +46,41 @@ const variantCombinators = [
46
46
  variants$1.variantMatcher("svg", (input) => `${input} svg *`)
47
47
  ];
48
48
 
49
- const variantColorsClass = [
50
- variants$1.variantMatcher("dark", (input) => `.dark $$ ${input}`),
51
- variants$1.variantMatcher("light", (input) => `.light $$ ${input}`)
52
- ];
53
- const variantColorsMedia = [
54
- (v) => {
55
- const dark = variants$1.variantMatcher("dark")(v);
56
- if (dark) {
57
- return {
58
- ...dark,
59
- parent: "@media (prefers-color-scheme: dark)"
60
- };
49
+ const variantColorsMediaOrClass = [
50
+ (v, { options: { dark } }) => {
51
+ if (dark === "class") {
52
+ const match = variants$1.variantMatcher("dark", (input) => `.dark $$ ${input}`)(v);
53
+ if (match)
54
+ return match;
61
55
  }
62
- const light = variants$1.variantMatcher("light")(v);
63
- if (light) {
64
- return {
65
- ...light,
66
- parent: "@media (prefers-color-scheme: light)"
67
- };
56
+ },
57
+ (v, { options: { dark } }) => {
58
+ if (dark === "class") {
59
+ const match = variants$1.variantMatcher("light", (input) => `.light $$ ${input}`)(v);
60
+ if (match)
61
+ return match;
62
+ }
63
+ },
64
+ (v, { options: { dark } }) => {
65
+ if (dark === "media") {
66
+ const match = variants$1.variantMatcher("dark")(v);
67
+ if (match) {
68
+ return {
69
+ ...match,
70
+ parent: "@media (prefers-color-scheme: dark)"
71
+ };
72
+ }
73
+ }
74
+ },
75
+ (v, { options: { dark } }) => {
76
+ if (dark === "media") {
77
+ const match = variants$1.variantMatcher("light")(v);
78
+ if (match) {
79
+ return {
80
+ ...match,
81
+ parent: "@media (prefers-color-scheme: light)"
82
+ };
83
+ }
68
84
  }
69
85
  }
70
86
  ];
@@ -120,13 +136,15 @@ const variants = [
120
136
  variantBreakpoints,
121
137
  ...variantCombinators,
122
138
  pseudo.variantPseudoClasses,
139
+ pseudo.variantPseudoClassFunctions,
140
+ pseudo.variantTaggedPseudoClasses,
123
141
  pseudo.variantPseudoElements,
124
- pseudo.partClasses
142
+ pseudo.partClasses,
143
+ ...variantColorsMediaOrClass
125
144
  ];
126
145
 
127
146
  exports.variantBreakpoints = variantBreakpoints;
128
- exports.variantColorsClass = variantColorsClass;
129
- exports.variantColorsMedia = variantColorsMedia;
147
+ exports.variantColorsMediaOrClass = variantColorsMediaOrClass;
130
148
  exports.variantCombinators = variantCombinators;
131
149
  exports.variantImportant = variantImportant;
132
150
  exports.variantNegative = variantNegative;
@@ -1,8 +1,8 @@
1
1
  import { v as variantMatcher } from './variants.mjs';
2
- import { v as variantPseudoClasses, a as variantPseudoElements, p as partClasses } from './pseudo.mjs';
2
+ import { v as variantPseudoClasses, a as variantPseudoClassFunctions, b as variantTaggedPseudoClasses, c as variantPseudoElements, p as partClasses } from './pseudo.mjs';
3
3
 
4
4
  const regexCache = {};
5
- const variantBreakpoints = (matcher, _, theme) => {
5
+ const variantBreakpoints = (matcher, { theme }) => {
6
6
  const variantEntries = Object.entries(theme.breakpoints || {}).map(([point, size], idx) => [point, size, idx]);
7
7
  for (const [point, size, idx] of variantEntries) {
8
8
  if (!regexCache[point])
@@ -44,25 +44,41 @@ const variantCombinators = [
44
44
  variantMatcher("svg", (input) => `${input} svg *`)
45
45
  ];
46
46
 
47
- const variantColorsClass = [
48
- variantMatcher("dark", (input) => `.dark $$ ${input}`),
49
- variantMatcher("light", (input) => `.light $$ ${input}`)
50
- ];
51
- const variantColorsMedia = [
52
- (v) => {
53
- const dark = variantMatcher("dark")(v);
54
- if (dark) {
55
- return {
56
- ...dark,
57
- parent: "@media (prefers-color-scheme: dark)"
58
- };
47
+ const variantColorsMediaOrClass = [
48
+ (v, { options: { dark } }) => {
49
+ if (dark === "class") {
50
+ const match = variantMatcher("dark", (input) => `.dark $$ ${input}`)(v);
51
+ if (match)
52
+ return match;
59
53
  }
60
- const light = variantMatcher("light")(v);
61
- if (light) {
62
- return {
63
- ...light,
64
- parent: "@media (prefers-color-scheme: light)"
65
- };
54
+ },
55
+ (v, { options: { dark } }) => {
56
+ if (dark === "class") {
57
+ const match = variantMatcher("light", (input) => `.light $$ ${input}`)(v);
58
+ if (match)
59
+ return match;
60
+ }
61
+ },
62
+ (v, { options: { dark } }) => {
63
+ if (dark === "media") {
64
+ const match = variantMatcher("dark")(v);
65
+ if (match) {
66
+ return {
67
+ ...match,
68
+ parent: "@media (prefers-color-scheme: dark)"
69
+ };
70
+ }
71
+ }
72
+ },
73
+ (v, { options: { dark } }) => {
74
+ if (dark === "media") {
75
+ const match = variantMatcher("light")(v);
76
+ if (match) {
77
+ return {
78
+ ...match,
79
+ parent: "@media (prefers-color-scheme: light)"
80
+ };
81
+ }
66
82
  }
67
83
  }
68
84
  ];
@@ -118,8 +134,11 @@ const variants = [
118
134
  variantBreakpoints,
119
135
  ...variantCombinators,
120
136
  variantPseudoClasses,
137
+ variantPseudoClassFunctions,
138
+ variantTaggedPseudoClasses,
121
139
  variantPseudoElements,
122
- partClasses
140
+ partClasses,
141
+ ...variantColorsMediaOrClass
123
142
  ];
124
143
 
125
- export { variantColorsMedia as a, variantColorsClass as b, variantBreakpoints as c, variantCombinators as d, variantImportant as e, variantNegative as f, variantSpace as g, variants as v };
144
+ export { variantBreakpoints as a, variantCombinators as b, variantColorsMediaOrClass as c, variantImportant as d, variantNegative as e, variantSpace as f, variants as v };