@unocss/preset-mini 0.18.0 → 0.20.1

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,4 +1,4 @@
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';
1
+ import { h as handler, c as colorResolver, d as directionMap, p as parseColor, a as cornerMap, b as capitalize, e as directionSize, x as xyzMap } from './utilities.mjs';
2
2
  import { toArray } from '@unocss/core';
3
3
  import { C as CONTROL_BYPASS_PSEUDO_CLASS } from './pseudo.mjs';
4
4
 
@@ -19,7 +19,7 @@ const textAligns = [
19
19
 
20
20
  const outline = [
21
21
  [/^outline-(?:width-|size-)?(.+)$/, ([, d]) => ({ "outline-width": handler.bracket.fraction.auto.rem(d) })],
22
- [/^outline-(?:color-)?(.+)$/, colorResolver$1("outline-color", "outline-color")],
22
+ [/^outline-(?:color-)?(.+)$/, colorResolver("outline-color", "outline-color")],
23
23
  [/^outline-offset-(.+)$/, ([, d]) => ({ "outline-offset": handler.bracket.fraction.auto.rem(d) })],
24
24
  ["outline", { "outline-style": "solid" }],
25
25
  [/^outline-(auto|dotted|dashed|solid|double|groove|ridge|inset|outset|inherit|initial|revert|unset)$/, ([, c]) => ({ "outline-style": c })],
@@ -79,12 +79,12 @@ const borderColorResolver = (direction) => ([, body], { theme }) => {
79
79
  } else {
80
80
  if (direction === "") {
81
81
  return {
82
- "--un-border-opacity": 1,
82
+ "--un-border-opacity": (opacity && handler.cssvar(opacity)) ?? 1,
83
83
  [`border${direction}-color`]: `rgba(${rgba.slice(0, 3).join(",")},var(--un-border${direction}-opacity))`
84
84
  };
85
85
  } else {
86
86
  return {
87
- "--un-border-opacity": 1,
87
+ "--un-border-opacity": (opacity && handler.cssvar(opacity)) ?? 1,
88
88
  [`--un-border${direction}-opacity`]: "var(--un-border-opacity)",
89
89
  [`border${direction}-color`]: `rgba(${rgba.slice(0, 3).join(",")},var(--un-border${direction}-opacity))`
90
90
  };
@@ -127,11 +127,11 @@ const opacity = [
127
127
  [/^op(?:acity)?-?(.+)$/, ([, d]) => ({ opacity: handler.bracket.percent.cssvar(d) })]
128
128
  ];
129
129
  const textColors = [
130
- [/^(?:text|color|c)-(.+)$/, colorResolver$1("color", "text")],
130
+ [/^(?:text|color|c)-(.+)$/, colorResolver("color", "text")],
131
131
  [/^(?:text|color|c)-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-text-opacity": handler.bracket.percent.cssvar(opacity2) })]
132
132
  ];
133
133
  const bgColors = [
134
- [/^bg-(.+)$/, colorResolver$1("background-color", "bg")],
134
+ [/^bg-(.+)$/, colorResolver("background-color", "bg")],
135
135
  [/^bg-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-bg-opacity": handler.bracket.percent(opacity2) })]
136
136
  ];
137
137
 
@@ -171,7 +171,7 @@ const flex = [
171
171
  ["flex-auto", { flex: "1 1 auto" }],
172
172
  ["flex-initial", { flex: "0 1 auto" }],
173
173
  ["flex-none", { flex: "none" }],
174
- [/^flex-\[(.+)\]$/, ([, d]) => ({ flex: d })],
174
+ [/^flex-(\[.+\])$/, ([, d]) => ({ flex: handler.bracket(d).replace(/\d+\/\d+/, ($1) => handler.fraction($1)) })],
175
175
  ["flex-shrink", { "flex-shrink": 1 }],
176
176
  ["flex-shrink-0", { "flex-shrink": 0 }],
177
177
  ["flex-grow", { "flex-grow": 1 }],
@@ -197,14 +197,7 @@ const weightMap = {
197
197
  black: "900"
198
198
  };
199
199
  const fonts = [
200
- [/^font-(\w+)$/, ([, d], { theme }) => {
201
- const font = theme.fontFamily?.[d];
202
- if (font) {
203
- return {
204
- "font-family": font
205
- };
206
- }
207
- }],
200
+ [/^font-(\w+)$/, ([, d], { theme }) => ({ "font-family": theme.fontFamily?.[d] })],
208
201
  [/^text-(.+)$/, ([, s = "base"], { theme }) => {
209
202
  const size = handler.bracket.auto.rem(s);
210
203
  if (size)
@@ -218,37 +211,16 @@ const fonts = [
218
211
  };
219
212
  }
220
213
  }],
221
- [/^text-size-(.+)$/, ([, s]) => {
222
- const raw = handler.bracket.auto.rem(s);
223
- if (raw)
224
- return { "font-size": raw };
225
- }],
226
- [/^(?:font|fw)-?([^-]+)$/, ([, s]) => {
227
- const v = weightMap[s] || handler.number(s);
228
- if (v)
229
- return { "font-weight": v };
230
- }],
231
- [/^(?:leading|lh)-([^-]+)$/, ([, s], { theme }) => {
232
- const v = theme.lineHeight?.[s] || handler.bracket.auto.rem(s);
233
- if (v !== null)
234
- return { "line-height": v };
235
- }],
236
- [/^tracking-([^-]+)$/, ([, s], { theme }) => {
237
- const v = theme.letterSpacing?.[s] || handler.bracket.auto.rem(s);
238
- if (v !== null)
239
- return { "letter-spacing": v };
240
- }],
241
- [/^word-spacing-([^-]+)$/, ([, s], { theme }) => {
242
- const v = theme.wordSpacing?.[s] || handler.bracket.auto.rem(s);
243
- if (v !== null)
244
- return { "word-spacing": v };
245
- }]
214
+ [/^text-size-(.+)$/, ([, s]) => ({ "font-size": handler.bracket.auto.rem(s) })],
215
+ [/^(?:font|fw)-?([^-]+)$/, ([, s]) => ({ "font-weight": weightMap[s] || handler.number(s) })],
216
+ [/^(?:leading|lh)-([^-]+)$/, ([, s], { theme }) => ({ "line-height": theme.lineHeight?.[s] || handler.bracket.auto.rem(s) })],
217
+ [/^tracking-([^-]+)$/, ([, s], { theme }) => ({ "letter-spacing": theme.letterSpacing?.[s] || handler.bracket.auto.rem(s) })],
218
+ [/^word-spacing-([^-]+)$/, ([, s], { theme }) => ({ "word-spacing": theme.wordSpacing?.[s] || handler.bracket.auto.rem(s) })]
246
219
  ];
247
220
  const tabSizes = [
248
221
  [/^tab-?([^-]*)$/, ([, s]) => {
249
- s = s || "4";
250
- const v = handler.bracket.global.number(s);
251
- if (v !== null) {
222
+ const v = handler.bracket.global.number(s || "4");
223
+ if (v != null) {
252
224
  return {
253
225
  "-moz-tab-size": v,
254
226
  "-o-tab-size": v,
@@ -258,41 +230,29 @@ const tabSizes = [
258
230
  }]
259
231
  ];
260
232
  const textIndents = [
261
- [/^indent(?:-(.+))?$/, ([, s], { theme }) => {
262
- const v = theme.textIndent?.[s || "DEFAULT"] || handler.bracket.cssvar.fraction.auto.rem(s);
263
- if (v != null)
264
- return { "text-indent": v };
265
- }]
233
+ [/^indent(?:-(.+))?$/, ([, s], { theme }) => ({ "text-indent": theme.textIndent?.[s || "DEFAULT"] || handler.bracket.cssvar.fraction.auto.rem(s) })]
266
234
  ];
267
235
  const textStrokes = [
268
- [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => {
269
- const v = theme.textStrokeWidth?.[s || "DEFAULT"] || handler.bracket.cssvar.px(s);
270
- if (v != null)
271
- return { "-webkit-text-stroke-width": v };
272
- }],
273
- [/^text-stroke-(.+)$/, colorResolver$1("-webkit-text-stroke-color", "text-stroke")],
236
+ [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => ({ "-webkit-text-stroke-width": theme.textStrokeWidth?.[s || "DEFAULT"] || handler.bracket.cssvar.px(s) })],
237
+ [/^text-stroke-(.+)$/, colorResolver("-webkit-text-stroke-color", "text-stroke")],
274
238
  [/^text-stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-stroke-opacity": handler.bracket.percent(opacity) })]
275
239
  ];
276
240
  const textShadows = [
277
- [/^text-shadow(?:-(.+))?$/, ([, s], { theme }) => {
278
- const v = theme.textShadow?.[s || "DEFAULT"] || handler.bracket.cssvar(s);
279
- if (v != null)
280
- return { "text-shadow": v };
281
- }]
241
+ [/^text-shadow(?:-(.+))?$/, ([, s], { theme }) => ({ "text-shadow": theme.textShadow?.[s || "DEFAULT"] || handler.bracket.cssvar(s) })]
282
242
  ];
283
243
 
244
+ const directions = {
245
+ "": "",
246
+ "x-": "column-",
247
+ "y-": "row-"
248
+ };
284
249
  const gaps = [
285
250
  [/^(?:flex-|grid-)?gap-(x-|y-)?([^-]+)$/, ([, d = "", s]) => {
286
251
  const v = handler.bracket.auto.rem(s);
287
252
  if (v != null) {
288
- const direction = {
289
- "": "",
290
- "x-": "column-",
291
- "y-": "row-"
292
- }[d];
293
253
  return {
294
- [`grid-${direction}gap`]: v,
295
- [`${direction}gap`]: v
254
+ [`grid-${directions[d]}gap`]: v,
255
+ [`${directions[d]}gap`]: v
296
256
  };
297
257
  }
298
258
  }]
@@ -334,12 +294,12 @@ const grids = [
334
294
  [/^(?:grid-)?auto-cols-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-columns": autoDirection(v, theme) })],
335
295
  [/^(?:grid-)?auto-flow-([\w.-]+)$/, ([, v]) => ({ "grid-auto-flow": v.replace("col", "column").split("-").join(" ") })],
336
296
  [/^(?:grid-)?auto-rows-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-rows": autoDirection(v, theme) })],
297
+ [/^grid-cols-(.+)$/, ([, v]) => ({ "grid-template-columns": handler.bracket(v) })],
298
+ [/^grid-rows-(.+)$/, ([, v]) => ({ "grid-template-rows": handler.bracket(v) })],
337
299
  [/^grid-cols-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-columns": `repeat(auto-fill,minmax(${d},1fr))` })],
338
300
  [/^grid-rows-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-rows": `repeat(auto-fill,minmax(${d},1fr))` })],
339
301
  [/^grid-cols-(\d+)$/, ([, d]) => ({ "grid-template-columns": `repeat(${d},minmax(0,1fr))` })],
340
- [/^grid-rows-(\d+)$/, ([, d]) => ({ "grid-template-rows": `repeat(${d},minmax(0,1fr))` })],
341
- [/^grid-cols-\[(.+)\]$/, ([, v]) => ({ "grid-template-columns": v.replace(/,/g, " ") })],
342
- [/^grid-rows-\[(.+)\]$/, ([, v]) => ({ "grid-template-rows": v.replace(/,/g, " ") })]
302
+ [/^grid-rows-(\d+)$/, ([, d]) => ({ "grid-template-rows": `repeat(${d},minmax(0,1fr))` })]
343
303
  ];
344
304
 
345
305
  const overflowValues = [
@@ -355,11 +315,8 @@ const overflows = [
355
315
 
356
316
  const basicSet = ["auto", "start", "end", "center", "stretch"];
357
317
  const positions = [
358
- ["relative", { position: "relative" }],
359
- ["absolute", { position: "absolute" }],
360
- ["fixed", { position: "fixed" }],
361
- ["sticky", { position: "sticky" }],
362
- ["static", { position: "static" }]
318
+ [/^(?:position-|pos-)?(relative|absolute|fixed|sticky)$/, ([, v]) => ({ position: v })],
319
+ [/^(?:position-|pos-)?(static)$/, ([, v]) => ({ position: v })]
363
320
  ];
364
321
  const justifies = [
365
322
  ["justify-start", { "justify-content": "flex-start" }],
@@ -410,8 +367,8 @@ function handleInsetValue(v) {
410
367
  return { auto: "auto", full: "100%" }[v] ?? handler.bracket.fraction.cssvar.auto.rem(v);
411
368
  }
412
369
  const insets = [
413
- [/^(top|left|right|bottom|inset)-(.+)$/, ([, d, v]) => ({ [d]: handleInsetValue(v) })],
414
- [/^inset-([xy])-(.+)$/, ([, d, v]) => {
370
+ [/^(?:position-|pos-)?(top|left|right|bottom|inset)-(.+)$/, ([, d, v]) => ({ [d]: handleInsetValue(v) })],
371
+ [/^(?:position-|pos-)?inset-([xy])-(.+)$/, ([, d, v]) => {
415
372
  const r = handleInsetValue(v);
416
373
  if (r != null && d in directionMap)
417
374
  return directionMap[d].map((i) => [i.slice(1), r]);
@@ -520,25 +477,20 @@ const rings = [
520
477
  "--un-ring-color": "rgba(59, 130, 246, .5)",
521
478
  "--un-ring-offset-shadow": "var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)",
522
479
  "--un-ring-shadow": `var(--un-ring-inset) 0 0 0 calc(${value} + var(--un-ring-offset-width)) var(--un-ring-color)`,
523
- "-webkit-box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)",
524
480
  "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)"
525
481
  };
526
482
  }
527
483
  }],
528
484
  ["ring-offset", { "--un-ring-offset-width": "1px" }],
529
- [/^ring-offset-(.+)$/, ([, d]) => {
530
- const value = handler.px(d || "1");
531
- if (value)
532
- return { "--un-ring-offset-width": value };
533
- }],
534
- [/^ring-(.+)$/, colorResolver$1("--un-ring-color", "ring")],
485
+ [/^ring-offset-(.+)$/, ([, d]) => ({ "--un-ring-offset-width": handler.px(d || "1") })],
486
+ [/^ring-(.+)$/, colorResolver("--un-ring-color", "ring")],
535
487
  [/^ring-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-opacity": handler.bracket.percent(opacity) })],
536
- [/^ring-offset-(.+)$/, colorResolver$1("--un-ring-offset-color", "ring-offset")],
488
+ [/^ring-offset-(.+)$/, colorResolver("--un-ring-offset-color", "ring-offset")],
537
489
  [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-offset-opacity": handler.bracket.percent(opacity) })],
538
490
  ["ring-inset", { "--un-ring-inset": "inset" }]
539
491
  ];
540
492
 
541
- const colorResolver = (body, theme) => {
493
+ const shadowColorResolver = (body, theme) => {
542
494
  const data = parseColor(body, theme);
543
495
  if (!data)
544
496
  return;
@@ -560,13 +512,15 @@ const boxShadows = [
560
512
  const value = theme.boxShadow?.[d || "DEFAULT"];
561
513
  if (value) {
562
514
  return {
515
+ "--un-shadow-inset": varEmpty,
563
516
  "--un-shadow-color": "0,0,0",
564
517
  "--un-shadow": value,
565
518
  "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
566
519
  };
567
520
  }
568
521
  }],
569
- [/^shadow-(.+)$/, ([, d], { theme }) => colorResolver(d, theme)]
522
+ [/^shadow-(.+)$/, ([, d], { theme }) => shadowColorResolver(d, theme)],
523
+ ["shadow-inset", { "--un-shadow-inset": "inset" }]
570
524
  ];
571
525
 
572
526
  function getPropName(minmax, hw) {
@@ -592,11 +546,7 @@ const sizes = [
592
546
  ];
593
547
  const aspectRatio = [
594
548
  ["aspect-ratio-auto", { "aspect-ratio": "auto" }],
595
- [/^aspect-ratio-(.+)$/, ([, d]) => {
596
- const v = (/^\d+\/\d+$/.test(d) ? d : null) || handler.bracket.cssvar.number(d);
597
- if (v != null)
598
- return { "aspect-ratio": v };
599
- }]
549
+ [/^aspect-ratio-(.+)$/, ([, d]) => ({ "aspect-ratio": (/^\d+\/\d+$/.test(d) ? d : null) || handler.bracket.cssvar.number(d) })]
600
550
  ];
601
551
 
602
552
  const paddings = [
@@ -659,9 +609,7 @@ function handleTranslate([, d, b]) {
659
609
  if (v != null) {
660
610
  return [
661
611
  transformBase,
662
- [
663
- ...xyzMap[d].map((i) => [`--un-translate${i}`, v])
664
- ]
612
+ xyzMap[d].map((i) => [`--un-translate${i}`, v])
665
613
  ];
666
614
  }
667
615
  }
@@ -670,9 +618,7 @@ function handleScale([, d, b]) {
670
618
  if (v != null) {
671
619
  return [
672
620
  transformBase,
673
- [
674
- ...xyzMap[d].map((i) => [`--un-scale${i}`, v])
675
- ]
621
+ xyzMap[d].map((i) => [`--un-scale${i}`, v])
676
622
  ];
677
623
  }
678
624
  }
@@ -720,17 +666,12 @@ const variablesAbbrMap = {
720
666
  "backface": "backface-visibility",
721
667
  "whitespace": "white-space",
722
668
  "break": "word-break",
723
- "b": "border-color",
724
- "border": "border-color",
725
- "color": "color",
726
669
  "case": "text-transform",
727
670
  "origin": "transform-origin",
728
- "bg": "background-color",
729
671
  "bg-opacity": "background-opacity",
730
672
  "tab": "tab-size",
731
673
  "underline": "text-decoration-thickness",
732
674
  "underline-offset": "text-underline-offset",
733
- "text": "color",
734
675
  "grid-cols": "grid-template-columns",
735
676
  "grid-rows": "grid-template-rows",
736
677
  "auto-flow": "grid-auto-flow",
@@ -745,15 +686,8 @@ const variablesAbbrMap = {
745
686
  const cssVariables = [
746
687
  [/^(.+)-\$(.+)$/, ([, name, varname]) => {
747
688
  const prop = variablesAbbrMap[name];
748
- if (prop) {
749
- return {
750
- [prop]: `var(--${varname})`
751
- };
752
- }
753
- }],
754
- [/^(?:border|b)-([^-]+)-\$(.+)$/, ([, a, v]) => {
755
- if (a in directionMap)
756
- return directionMap[a].map((i) => [`border${i}-color`, `var(--${v})`]);
689
+ if (prop)
690
+ return { [prop]: `var(--${varname})` };
757
691
  }]
758
692
  ];
759
693
 
@@ -776,7 +710,7 @@ const textDecorations = [
776
710
  [/^(?:underline|decoration)-(?:size-)?(.+)$/, ([, s]) => ({ "text-decoration-thickness": handler.bracket.px(s) })],
777
711
  [/^(?:underline|decoration)-(auto|from-font)$/, ([, s]) => ({ "text-decoration-thickness": s })],
778
712
  [/^(?:underline|decoration)-(.+)$/, (match, ctx) => {
779
- const result = colorResolver$1("text-decoration-color", "line")(match, ctx);
713
+ const result = colorResolver("text-decoration-color", "line")(match, ctx);
780
714
  if (result) {
781
715
  return {
782
716
  "-webkit-text-decoration-color": result["text-decoration-color"],
@@ -792,15 +726,11 @@ const textDecorations = [
792
726
  ];
793
727
 
794
728
  const svgUtilities = [
795
- [/^fill-(.+)$/, colorResolver$1("fill", "fill")],
729
+ [/^fill-(.+)$/, colorResolver("fill", "fill")],
796
730
  [/^fill-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-fill-opacity": handler.bracket.percent(opacity) })],
797
731
  ["fill-none", { fill: "none" }],
798
- [/^stroke-(?:size-|width-)?(.+)$/, ([, s]) => {
799
- const v = handler.bracket.fraction.px.number(s);
800
- if (v)
801
- return { "stroke-width": v };
802
- }],
803
- [/^stroke-(.+)$/, colorResolver$1("stroke", "stroke")],
732
+ [/^stroke-(?:size-|width-)?(.+)$/, ([, s]) => ({ "stroke-width": handler.bracket.fraction.px.number(s) })],
733
+ [/^stroke-(.+)$/, colorResolver("stroke", "stroke")],
804
734
  [/^stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-stroke-opacity": handler.bracket.percent(opacity) })],
805
735
  ["stroke-none", { stroke: "none" }]
806
736
  ];
@@ -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,26 +46,22 @@ 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
- };
61
- }
62
- const light = variants$1.variantMatcher("light")(v);
63
- if (light) {
64
- return {
65
- ...light,
66
- parent: "@media (prefers-color-scheme: light)"
67
- };
68
- }
49
+ const variantColorsMediaOrClass = [
50
+ (v, { options: { dark } }) => {
51
+ if (dark === "class")
52
+ return variants$1.variantMatcher("dark", (input) => `.dark $$ ${input}`)(v);
53
+ },
54
+ (v, { options: { dark } }) => {
55
+ if (dark === "class")
56
+ return variants$1.variantMatcher("light", (input) => `.light $$ ${input}`)(v);
57
+ },
58
+ (v, { options: { dark } }) => {
59
+ if (dark === "media")
60
+ return variants$1.variantParentMatcher("dark", "@media (prefers-color-scheme: dark)")(v);
61
+ },
62
+ (v, { options: { dark } }) => {
63
+ if (dark === "media")
64
+ return variants$1.variantParentMatcher("light", "@media (prefers-color-scheme: light)")(v);
69
65
  }
70
66
  ];
71
67
 
@@ -113,24 +109,28 @@ const variantSpace = (matcher) => {
113
109
  }
114
110
  };
115
111
 
116
- const variants = (options) => [
112
+ const variantPrint = variants$1.variantParentMatcher("print", "@media print");
113
+
114
+ const variants = [
117
115
  variantSpace,
118
116
  variantNegative,
119
117
  variantImportant,
118
+ variantPrint,
120
119
  variantBreakpoints,
121
120
  ...variantCombinators,
122
121
  pseudo.variantPseudoClasses,
123
- pseudo.variantTaggedPseudoClasses(options),
122
+ pseudo.variantPseudoClassFunctions,
123
+ pseudo.variantTaggedPseudoClasses,
124
124
  pseudo.variantPseudoElements,
125
125
  pseudo.partClasses,
126
- ...options.dark === "media" ? variantColorsMedia : variantColorsClass
126
+ ...variantColorsMediaOrClass
127
127
  ];
128
128
 
129
129
  exports.variantBreakpoints = variantBreakpoints;
130
- exports.variantColorsClass = variantColorsClass;
131
- exports.variantColorsMedia = variantColorsMedia;
130
+ exports.variantColorsMediaOrClass = variantColorsMediaOrClass;
132
131
  exports.variantCombinators = variantCombinators;
133
132
  exports.variantImportant = variantImportant;
134
133
  exports.variantNegative = variantNegative;
134
+ exports.variantPrint = variantPrint;
135
135
  exports.variantSpace = variantSpace;
136
136
  exports.variants = variants;
@@ -1,8 +1,8 @@
1
- import { v as variantMatcher } from './variants.mjs';
2
- import { v as variantPseudoClasses, a as variantTaggedPseudoClasses, b as variantPseudoElements, p as partClasses } from './pseudo.mjs';
1
+ import { v as variantMatcher, a as variantParentMatcher } from './variants.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,26 +44,22 @@ 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
- };
59
- }
60
- const light = variantMatcher("light")(v);
61
- if (light) {
62
- return {
63
- ...light,
64
- parent: "@media (prefers-color-scheme: light)"
65
- };
66
- }
47
+ const variantColorsMediaOrClass = [
48
+ (v, { options: { dark } }) => {
49
+ if (dark === "class")
50
+ return variantMatcher("dark", (input) => `.dark $$ ${input}`)(v);
51
+ },
52
+ (v, { options: { dark } }) => {
53
+ if (dark === "class")
54
+ return variantMatcher("light", (input) => `.light $$ ${input}`)(v);
55
+ },
56
+ (v, { options: { dark } }) => {
57
+ if (dark === "media")
58
+ return variantParentMatcher("dark", "@media (prefers-color-scheme: dark)")(v);
59
+ },
60
+ (v, { options: { dark } }) => {
61
+ if (dark === "media")
62
+ return variantParentMatcher("light", "@media (prefers-color-scheme: light)")(v);
67
63
  }
68
64
  ];
69
65
 
@@ -111,17 +107,21 @@ const variantSpace = (matcher) => {
111
107
  }
112
108
  };
113
109
 
114
- const variants = (options) => [
110
+ const variantPrint = variantParentMatcher("print", "@media print");
111
+
112
+ const variants = [
115
113
  variantSpace,
116
114
  variantNegative,
117
115
  variantImportant,
116
+ variantPrint,
118
117
  variantBreakpoints,
119
118
  ...variantCombinators,
120
119
  variantPseudoClasses,
121
- variantTaggedPseudoClasses(options),
120
+ variantPseudoClassFunctions,
121
+ variantTaggedPseudoClasses,
122
122
  variantPseudoElements,
123
123
  partClasses,
124
- ...options.dark === "media" ? variantColorsMedia : variantColorsClass
124
+ ...variantColorsMediaOrClass
125
125
  ];
126
126
 
127
- export { variantBreakpoints as a, variantCombinators as b, variantColorsClass as c, variantColorsMedia as d, variantImportant as e, variantNegative as f, variantSpace as g, variants as v };
127
+ export { variantBreakpoints as a, variantCombinators as b, variantColorsMediaOrClass as c, variantImportant as d, variantNegative as e, variantSpace as f, variantPrint as g, variants as v };
@@ -47,23 +47,30 @@ const PseudoElements = [
47
47
  "first-line",
48
48
  "selection"
49
49
  ];
50
+ const PseudoClassFunctions = [
51
+ "not",
52
+ "is",
53
+ "where",
54
+ "has"
55
+ ];
50
56
  const PartClassesRE = /(part-\[(.+)]:)(.+)/;
51
57
  const PseudoElementsRE = new RegExp(`^(${PseudoElements.join("|")})[:-]`);
52
58
  const PseudoClassesStr = Object.keys(PseudoClasses).join("|");
59
+ const PseudoClassFunctionsStr = PseudoClassFunctions.join("|");
53
60
  const PseudoClassesRE = new RegExp(`^(${PseudoClassesStr})[:-]`);
54
- const PseudoClassesNotRE = new RegExp(`^not-(${PseudoClassesStr})[:-]`);
61
+ const PseudoClassFunctionsRE = new RegExp(`^(${PseudoClassFunctionsStr})-(${PseudoClassesStr})[:-]`);
55
62
  function shouldAdd(entires) {
56
63
  return !entires.find((i) => i[0] === CONTROL_BYPASS_PSEUDO_CLASS) || void 0;
57
64
  }
58
- function taggedPseudoClassMatcher(tag, parent, combinator) {
59
- const re = new RegExp(`^${tag}-((not-)?(${PseudoClassesStr}))[:-]`);
65
+ const taggedPseudoClassMatcher = (tag, parent, combinator) => {
66
+ const re = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesStr}))[:-]`);
60
67
  const rawRe = new RegExp(`^${core.escapeRegExp(parent)}:`);
61
68
  return (input) => {
62
69
  const match = input.match(re);
63
70
  if (match) {
64
71
  let pseudo = PseudoClasses[match[3]] || match[3];
65
72
  if (match[2])
66
- pseudo = `not(:${pseudo})`;
73
+ pseudo = `${match[2]}(:${pseudo})`;
67
74
  return {
68
75
  matcher: input.slice(match[1].length + tag.length + 2),
69
76
  selector: (s, body) => {
@@ -72,7 +79,7 @@ function taggedPseudoClassMatcher(tag, parent, combinator) {
72
79
  };
73
80
  }
74
81
  };
75
- }
82
+ };
76
83
  const variantPseudoElements = (input) => {
77
84
  const match = input.match(PseudoElementsRE);
78
85
  if (match) {
@@ -84,7 +91,7 @@ const variantPseudoElements = (input) => {
84
91
  };
85
92
  const variantPseudoClasses = {
86
93
  match: (input) => {
87
- let match = input.match(PseudoClassesRE);
94
+ const match = input.match(PseudoClassesRE);
88
95
  if (match) {
89
96
  const pseudo = PseudoClasses[match[1]] || match[1];
90
97
  return {
@@ -92,29 +99,34 @@ const variantPseudoClasses = {
92
99
  selector: (s, body) => shouldAdd(body) && `${s}:${pseudo}`
93
100
  };
94
101
  }
95
- match = input.match(PseudoClassesNotRE);
102
+ },
103
+ multiPass: true
104
+ };
105
+ const variantPseudoClassFunctions = {
106
+ match: (input) => {
107
+ const match = input.match(PseudoClassFunctionsRE);
96
108
  if (match) {
97
- const pseudo = PseudoClasses[match[1]] || match[1];
109
+ const fn = match[1];
110
+ const pseudo = PseudoClasses[match[2]] || match[2];
98
111
  return {
99
- matcher: input.slice(match[1].length + 5),
100
- selector: (s, body) => shouldAdd(body) && `${s}:not(:${pseudo})`
112
+ matcher: input.slice(match[1].length + match[2].length + 2),
113
+ selector: (s, body) => shouldAdd(body) && `${s}:${fn}(:${pseudo})`
101
114
  };
102
115
  }
103
116
  },
104
117
  multiPass: true
105
118
  };
106
- const variantTaggedPseudoClasses = (options = {}) => ({
107
- match: (input) => {
108
- const attributify = !!options?.attributifyPseudo;
109
- const g = taggedPseudoClassMatcher("group", attributify ? '[group=""]' : ".group", " ")(input);
119
+ const variantTaggedPseudoClasses = {
120
+ match: (input, { options: { attributifyPseudo } }) => {
121
+ const g = taggedPseudoClassMatcher("group", attributifyPseudo ? '[group=""]' : ".group", " ")(input);
110
122
  if (g)
111
123
  return g;
112
- const p = taggedPseudoClassMatcher("peer", attributify ? '[peer=""]' : ".peer", "~")(input);
124
+ const p = taggedPseudoClassMatcher("peer", attributifyPseudo ? '[peer=""]' : ".peer", "~")(input);
113
125
  if (p)
114
126
  return p;
115
127
  },
116
128
  multiPass: true
117
- });
129
+ };
118
130
  const partClasses = {
119
131
  match: (input) => {
120
132
  const match = input.match(PartClassesRE);
@@ -132,8 +144,8 @@ const partClasses = {
132
144
  };
133
145
 
134
146
  exports.CONTROL_BYPASS_PSEUDO_CLASS = CONTROL_BYPASS_PSEUDO_CLASS;
135
- exports.PseudoClasses = PseudoClasses;
136
147
  exports.partClasses = partClasses;
148
+ exports.variantPseudoClassFunctions = variantPseudoClassFunctions;
137
149
  exports.variantPseudoClasses = variantPseudoClasses;
138
150
  exports.variantPseudoElements = variantPseudoElements;
139
151
  exports.variantTaggedPseudoClasses = variantTaggedPseudoClasses;