@unocss/preset-mini 0.18.1 → 0.20.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -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 })],
@@ -66,33 +66,31 @@ const borderColorResolver = (direction) => ([, body], { theme }) => {
66
66
  const data = parseColor(body, theme);
67
67
  if (!data)
68
68
  return;
69
- const { opacity, color, rgba } = data;
69
+ const { alpha, opacity, color, rgba } = data;
70
70
  if (!color)
71
71
  return;
72
- const a = opacity ? opacity[0] === "[" ? handler.bracket.percent(opacity) : parseFloat(opacity) / 100 : rgba?.[3];
73
72
  if (rgba) {
74
- if (a != null && !Number.isNaN(a)) {
75
- rgba[3] = typeof a === "string" && !a.includes("%") ? parseFloat(a) : a;
73
+ if (alpha != null) {
76
74
  return {
77
75
  [`border${direction}-color`]: `rgba(${rgba.join(",")})`
78
76
  };
79
77
  } else {
80
78
  if (direction === "") {
81
79
  return {
82
- "--un-border-opacity": 1,
83
- [`border${direction}-color`]: `rgba(${rgba.slice(0, 3).join(",")},var(--un-border${direction}-opacity))`
80
+ "--un-border-opacity": (opacity && handler.cssvar(opacity)) ?? 1,
81
+ [`border${direction}-color`]: `rgba(${rgba.join(",")},var(--un-border${direction}-opacity))`
84
82
  };
85
83
  } else {
86
84
  return {
87
- "--un-border-opacity": 1,
85
+ "--un-border-opacity": (opacity && handler.cssvar(opacity)) ?? 1,
88
86
  [`--un-border${direction}-opacity`]: "var(--un-border-opacity)",
89
- [`border${direction}-color`]: `rgba(${rgba.slice(0, 3).join(",")},var(--un-border${direction}-opacity))`
87
+ [`border${direction}-color`]: `rgba(${rgba.join(",")},var(--un-border${direction}-opacity))`
90
88
  };
91
89
  }
92
90
  }
93
91
  } else {
94
92
  return {
95
- [`border${direction}-color`]: color.replace("%alpha", `${a || 1}`)
93
+ [`border${direction}-color`]: color.replace("%alpha", `${alpha || 1}`)
96
94
  };
97
95
  }
98
96
  };
@@ -127,11 +125,11 @@ const opacity = [
127
125
  [/^op(?:acity)?-?(.+)$/, ([, d]) => ({ opacity: handler.bracket.percent.cssvar(d) })]
128
126
  ];
129
127
  const textColors = [
130
- [/^(?:text|color|c)-(.+)$/, colorResolver$1("color", "text")],
128
+ [/^(?:text|color|c)-(.+)$/, colorResolver("color", "text")],
131
129
  [/^(?:text|color|c)-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-text-opacity": handler.bracket.percent.cssvar(opacity2) })]
132
130
  ];
133
131
  const bgColors = [
134
- [/^bg-(.+)$/, colorResolver$1("background-color", "bg")],
132
+ [/^bg-(.+)$/, colorResolver("background-color", "bg")],
135
133
  [/^bg-op(?:acity)?-?(.+)$/, ([, opacity2]) => ({ "--un-bg-opacity": handler.bracket.percent(opacity2) })]
136
134
  ];
137
135
 
@@ -197,14 +195,7 @@ const weightMap = {
197
195
  black: "900"
198
196
  };
199
197
  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
- }],
198
+ [/^font-(\w+)$/, ([, d], { theme }) => ({ "font-family": theme.fontFamily?.[d] })],
208
199
  [/^text-(.+)$/, ([, s = "base"], { theme }) => {
209
200
  const size = handler.bracket.auto.rem(s);
210
201
  if (size)
@@ -218,37 +209,16 @@ const fonts = [
218
209
  };
219
210
  }
220
211
  }],
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
- }]
212
+ [/^text-size-(.+)$/, ([, s]) => ({ "font-size": handler.bracket.auto.rem(s) })],
213
+ [/^(?:font|fw)-?([^-]+)$/, ([, s]) => ({ "font-weight": weightMap[s] || handler.number(s) })],
214
+ [/^(?:leading|lh)-([^-]+)$/, ([, s], { theme }) => ({ "line-height": theme.lineHeight?.[s] || handler.bracket.auto.rem(s) })],
215
+ [/^tracking-([^-]+)$/, ([, s], { theme }) => ({ "letter-spacing": theme.letterSpacing?.[s] || handler.bracket.auto.rem(s) })],
216
+ [/^word-spacing-([^-]+)$/, ([, s], { theme }) => ({ "word-spacing": theme.wordSpacing?.[s] || handler.bracket.auto.rem(s) })]
246
217
  ];
247
218
  const tabSizes = [
248
219
  [/^tab-?([^-]*)$/, ([, s]) => {
249
- s = s || "4";
250
- const v = handler.bracket.global.number(s);
251
- if (v !== null) {
220
+ const v = handler.bracket.global.number(s || "4");
221
+ if (v != null) {
252
222
  return {
253
223
  "-moz-tab-size": v,
254
224
  "-o-tab-size": v,
@@ -258,41 +228,29 @@ const tabSizes = [
258
228
  }]
259
229
  ];
260
230
  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
- }]
231
+ [/^indent(?:-(.+))?$/, ([, s], { theme }) => ({ "text-indent": theme.textIndent?.[s || "DEFAULT"] || handler.bracket.cssvar.fraction.auto.rem(s) })]
266
232
  ];
267
233
  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")],
234
+ [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => ({ "-webkit-text-stroke-width": theme.textStrokeWidth?.[s || "DEFAULT"] || handler.bracket.cssvar.px(s) })],
235
+ [/^text-stroke-(.+)$/, colorResolver("-webkit-text-stroke-color", "text-stroke")],
274
236
  [/^text-stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-stroke-opacity": handler.bracket.percent(opacity) })]
275
237
  ];
276
238
  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
- }]
239
+ [/^text-shadow(?:-(.+))?$/, ([, s], { theme }) => ({ "text-shadow": theme.textShadow?.[s || "DEFAULT"] || handler.bracket.cssvar(s) })]
282
240
  ];
283
241
 
242
+ const directions = {
243
+ "": "",
244
+ "x-": "column-",
245
+ "y-": "row-"
246
+ };
284
247
  const gaps = [
285
248
  [/^(?:flex-|grid-)?gap-(x-|y-)?([^-]+)$/, ([, d = "", s]) => {
286
249
  const v = handler.bracket.auto.rem(s);
287
250
  if (v != null) {
288
- const direction = {
289
- "": "",
290
- "x-": "column-",
291
- "y-": "row-"
292
- }[d];
293
251
  return {
294
- [`grid-${direction}gap`]: v,
295
- [`${direction}gap`]: v
252
+ [`grid-${directions[d]}gap`]: v,
253
+ [`${directions[d]}gap`]: v
296
254
  };
297
255
  }
298
256
  }]
@@ -334,12 +292,12 @@ const grids = [
334
292
  [/^(?:grid-)?auto-cols-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-columns": autoDirection(v, theme) })],
335
293
  [/^(?:grid-)?auto-flow-([\w.-]+)$/, ([, v]) => ({ "grid-auto-flow": v.replace("col", "column").split("-").join(" ") })],
336
294
  [/^(?:grid-)?auto-rows-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-rows": autoDirection(v, theme) })],
295
+ [/^grid-cols-(.+)$/, ([, v]) => ({ "grid-template-columns": handler.bracket(v) })],
296
+ [/^grid-rows-(.+)$/, ([, v]) => ({ "grid-template-rows": handler.bracket(v) })],
337
297
  [/^grid-cols-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-columns": `repeat(auto-fill,minmax(${d},1fr))` })],
338
298
  [/^grid-rows-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-rows": `repeat(auto-fill,minmax(${d},1fr))` })],
339
299
  [/^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, " ") })]
300
+ [/^grid-rows-(\d+)$/, ([, d]) => ({ "grid-template-rows": `repeat(${d},minmax(0,1fr))` })]
343
301
  ];
344
302
 
345
303
  const overflowValues = [
@@ -355,11 +313,8 @@ const overflows = [
355
313
 
356
314
  const basicSet = ["auto", "start", "end", "center", "stretch"];
357
315
  const positions = [
358
- ["relative", { position: "relative" }],
359
- ["absolute", { position: "absolute" }],
360
- ["fixed", { position: "fixed" }],
361
- ["sticky", { position: "sticky" }],
362
- ["static", { position: "static" }]
316
+ [/^(?:position-|pos-)?(relative|absolute|fixed|sticky)$/, ([, v]) => ({ position: v })],
317
+ [/^(?:position-|pos-)?(static)$/, ([, v]) => ({ position: v })]
363
318
  ];
364
319
  const justifies = [
365
320
  ["justify-start", { "justify-content": "flex-start" }],
@@ -410,8 +365,8 @@ function handleInsetValue(v) {
410
365
  return { auto: "auto", full: "100%" }[v] ?? handler.bracket.fraction.cssvar.auto.rem(v);
411
366
  }
412
367
  const insets = [
413
- [/^(top|left|right|bottom|inset)-(.+)$/, ([, d, v]) => ({ [d]: handleInsetValue(v) })],
414
- [/^inset-([xy])-(.+)$/, ([, d, v]) => {
368
+ [/^(?:position-|pos-)?(top|left|right|bottom|inset)-(.+)$/, ([, d, v]) => ({ [d]: handleInsetValue(v) })],
369
+ [/^(?:position-|pos-)?inset-([xy])-(.+)$/, ([, d, v]) => {
415
370
  const r = handleInsetValue(v);
416
371
  if (r != null && d in directionMap)
417
372
  return directionMap[d].map((i) => [i.slice(1), r]);
@@ -520,25 +475,20 @@ const rings = [
520
475
  "--un-ring-color": "rgba(59, 130, 246, .5)",
521
476
  "--un-ring-offset-shadow": "var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)",
522
477
  "--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
478
  "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)"
525
479
  };
526
480
  }
527
481
  }],
528
482
  ["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")],
483
+ [/^ring-offset-(.+)$/, ([, d]) => ({ "--un-ring-offset-width": handler.px(d || "1") })],
484
+ [/^ring-(.+)$/, colorResolver("--un-ring-color", "ring")],
535
485
  [/^ring-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-opacity": handler.bracket.percent(opacity) })],
536
- [/^ring-offset-(.+)$/, colorResolver$1("--un-ring-offset-color", "ring-offset")],
486
+ [/^ring-offset-(.+)$/, colorResolver("--un-ring-offset-color", "ring-offset")],
537
487
  [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-offset-opacity": handler.bracket.percent(opacity) })],
538
488
  ["ring-inset", { "--un-ring-inset": "inset" }]
539
489
  ];
540
490
 
541
- const colorResolver = (body, theme) => {
491
+ const shadowColorResolver = (body, theme) => {
542
492
  const data = parseColor(body, theme);
543
493
  if (!data)
544
494
  return;
@@ -560,13 +510,15 @@ const boxShadows = [
560
510
  const value = theme.boxShadow?.[d || "DEFAULT"];
561
511
  if (value) {
562
512
  return {
513
+ "--un-shadow-inset": varEmpty,
563
514
  "--un-shadow-color": "0,0,0",
564
515
  "--un-shadow": value,
565
516
  "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
566
517
  };
567
518
  }
568
519
  }],
569
- [/^shadow-(.+)$/, ([, d], { theme }) => colorResolver(d, theme)]
520
+ [/^shadow-(.+)$/, ([, d], { theme }) => shadowColorResolver(d, theme)],
521
+ ["shadow-inset", { "--un-shadow-inset": "inset" }]
570
522
  ];
571
523
 
572
524
  function getPropName(minmax, hw) {
@@ -592,11 +544,7 @@ const sizes = [
592
544
  ];
593
545
  const aspectRatio = [
594
546
  ["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
- }]
547
+ [/^aspect-ratio-(.+)$/, ([, d]) => ({ "aspect-ratio": (/^\d+\/\d+$/.test(d) ? d : null) || handler.bracket.cssvar.number(d) })]
600
548
  ];
601
549
 
602
550
  const paddings = [
@@ -659,9 +607,7 @@ function handleTranslate([, d, b]) {
659
607
  if (v != null) {
660
608
  return [
661
609
  transformBase,
662
- [
663
- ...xyzMap[d].map((i) => [`--un-translate${i}`, v])
664
- ]
610
+ xyzMap[d].map((i) => [`--un-translate${i}`, v])
665
611
  ];
666
612
  }
667
613
  }
@@ -670,9 +616,7 @@ function handleScale([, d, b]) {
670
616
  if (v != null) {
671
617
  return [
672
618
  transformBase,
673
- [
674
- ...xyzMap[d].map((i) => [`--un-scale${i}`, v])
675
- ]
619
+ xyzMap[d].map((i) => [`--un-scale${i}`, v])
676
620
  ];
677
621
  }
678
622
  }
@@ -720,17 +664,12 @@ const variablesAbbrMap = {
720
664
  "backface": "backface-visibility",
721
665
  "whitespace": "white-space",
722
666
  "break": "word-break",
723
- "b": "border-color",
724
- "border": "border-color",
725
- "color": "color",
726
667
  "case": "text-transform",
727
668
  "origin": "transform-origin",
728
- "bg": "background-color",
729
669
  "bg-opacity": "background-opacity",
730
670
  "tab": "tab-size",
731
671
  "underline": "text-decoration-thickness",
732
672
  "underline-offset": "text-underline-offset",
733
- "text": "color",
734
673
  "grid-cols": "grid-template-columns",
735
674
  "grid-rows": "grid-template-rows",
736
675
  "auto-flow": "grid-auto-flow",
@@ -745,15 +684,8 @@ const variablesAbbrMap = {
745
684
  const cssVariables = [
746
685
  [/^(.+)-\$(.+)$/, ([, name, varname]) => {
747
686
  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})`]);
687
+ if (prop)
688
+ return { [prop]: `var(--${varname})` };
757
689
  }]
758
690
  ];
759
691
 
@@ -776,7 +708,7 @@ const textDecorations = [
776
708
  [/^(?:underline|decoration)-(?:size-)?(.+)$/, ([, s]) => ({ "text-decoration-thickness": handler.bracket.px(s) })],
777
709
  [/^(?:underline|decoration)-(auto|from-font)$/, ([, s]) => ({ "text-decoration-thickness": s })],
778
710
  [/^(?:underline|decoration)-(.+)$/, (match, ctx) => {
779
- const result = colorResolver$1("text-decoration-color", "line")(match, ctx);
711
+ const result = colorResolver("text-decoration-color", "line")(match, ctx);
780
712
  if (result) {
781
713
  return {
782
714
  "-webkit-text-decoration-color": result["text-decoration-color"],
@@ -792,15 +724,11 @@ const textDecorations = [
792
724
  ];
793
725
 
794
726
  const svgUtilities = [
795
- [/^fill-(.+)$/, colorResolver$1("fill", "fill")],
727
+ [/^fill-(.+)$/, colorResolver("fill", "fill")],
796
728
  [/^fill-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-fill-opacity": handler.bracket.percent(opacity) })],
797
729
  ["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")],
730
+ [/^stroke-(?:size-|width-)?(.+)$/, ([, s]) => ({ "stroke-width": handler.bracket.fraction.px.number(s) })],
731
+ [/^stroke-(.+)$/, colorResolver("stroke", "stroke")],
804
732
  [/^stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-stroke-opacity": handler.bracket.percent(opacity) })],
805
733
  ["stroke-none", { stroke: "none" }]
806
734
  ];
@@ -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,29 +46,30 @@ 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
 
68
+ const variantLanguageDirections = [
69
+ variants$1.variantMatcher("rtl", (input) => `[dir="rtl"] $$ ${input}`),
70
+ variants$1.variantMatcher("ltr", (input) => `[dir="ltr"] $$ ${input}`)
71
+ ];
72
+
72
73
  const variantImportant = {
73
74
  match(matcher) {
74
75
  if (matcher.startsWith("!")) {
@@ -113,25 +114,44 @@ const variantSpace = (matcher) => {
113
114
  }
114
115
  };
115
116
 
116
- const variants = (options) => [
117
+ const variantMotions = [
118
+ variants$1.variantParentMatcher("motion-reduce", "@media (prefers-reduced-motion: reduce)"),
119
+ variants$1.variantParentMatcher("motion-safe", "@media (prefers-reduced-motion: no-preference)")
120
+ ];
121
+
122
+ const variantOrientations = [
123
+ variants$1.variantParentMatcher("landscape", "@media (orientation: landscape)"),
124
+ variants$1.variantParentMatcher("portrait", "@media (orientation: portrait)")
125
+ ];
126
+
127
+ const variantPrint = variants$1.variantParentMatcher("print", "@media print");
128
+
129
+ const variants = [
117
130
  variantSpace,
118
131
  variantNegative,
119
132
  variantImportant,
133
+ variantPrint,
134
+ ...variantOrientations,
135
+ ...variantMotions,
120
136
  variantBreakpoints,
121
137
  ...variantCombinators,
122
138
  pseudo.variantPseudoClasses,
123
139
  pseudo.variantPseudoClassFunctions,
124
- pseudo.variantTaggedPseudoClasses(options),
140
+ pseudo.variantTaggedPseudoClasses,
125
141
  pseudo.variantPseudoElements,
126
142
  pseudo.partClasses,
127
- ...options.dark === "media" ? variantColorsMedia : variantColorsClass
143
+ ...variantColorsMediaOrClass,
144
+ ...variantLanguageDirections
128
145
  ];
129
146
 
130
147
  exports.variantBreakpoints = variantBreakpoints;
131
- exports.variantColorsClass = variantColorsClass;
132
- exports.variantColorsMedia = variantColorsMedia;
148
+ exports.variantColorsMediaOrClass = variantColorsMediaOrClass;
133
149
  exports.variantCombinators = variantCombinators;
134
150
  exports.variantImportant = variantImportant;
151
+ exports.variantLanguageDirections = variantLanguageDirections;
152
+ exports.variantMotions = variantMotions;
135
153
  exports.variantNegative = variantNegative;
154
+ exports.variantOrientations = variantOrientations;
155
+ exports.variantPrint = variantPrint;
136
156
  exports.variantSpace = variantSpace;
137
157
  exports.variants = variants;
@@ -1,8 +1,8 @@
1
- import { v as variantMatcher } from './variants.mjs';
1
+ import { v as variantMatcher, a as variantParentMatcher } from './variants.mjs';
2
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,29 +44,30 @@ 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
 
66
+ const variantLanguageDirections = [
67
+ variantMatcher("rtl", (input) => `[dir="rtl"] $$ ${input}`),
68
+ variantMatcher("ltr", (input) => `[dir="ltr"] $$ ${input}`)
69
+ ];
70
+
70
71
  const variantImportant = {
71
72
  match(matcher) {
72
73
  if (matcher.startsWith("!")) {
@@ -111,18 +112,34 @@ const variantSpace = (matcher) => {
111
112
  }
112
113
  };
113
114
 
114
- const variants = (options) => [
115
+ const variantMotions = [
116
+ variantParentMatcher("motion-reduce", "@media (prefers-reduced-motion: reduce)"),
117
+ variantParentMatcher("motion-safe", "@media (prefers-reduced-motion: no-preference)")
118
+ ];
119
+
120
+ const variantOrientations = [
121
+ variantParentMatcher("landscape", "@media (orientation: landscape)"),
122
+ variantParentMatcher("portrait", "@media (orientation: portrait)")
123
+ ];
124
+
125
+ const variantPrint = variantParentMatcher("print", "@media print");
126
+
127
+ const variants = [
115
128
  variantSpace,
116
129
  variantNegative,
117
130
  variantImportant,
131
+ variantPrint,
132
+ ...variantOrientations,
133
+ ...variantMotions,
118
134
  variantBreakpoints,
119
135
  ...variantCombinators,
120
136
  variantPseudoClasses,
121
137
  variantPseudoClassFunctions,
122
- variantTaggedPseudoClasses(options),
138
+ variantTaggedPseudoClasses,
123
139
  variantPseudoElements,
124
140
  partClasses,
125
- ...options.dark === "media" ? variantColorsMedia : variantColorsClass
141
+ ...variantColorsMediaOrClass,
142
+ ...variantLanguageDirections
126
143
  ];
127
144
 
128
- 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 };
145
+ export { variantBreakpoints as a, variantCombinators as b, variantColorsMediaOrClass as c, variantLanguageDirections as d, variantImportant as e, variantNegative as f, variantSpace as g, variantMotions as h, variantOrientations as i, variantPrint as j, variants as v };