@unocss/preset-wind 0.53.0 → 0.53.3

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.cjs CHANGED
@@ -48,12 +48,12 @@ const animations = [
48
48
  }
49
49
  ];
50
50
  }
51
- return { animation: utils.handler.bracket.cssvar(name) };
51
+ return { animation: utils.h.bracket.cssvar(name) };
52
52
  }, { autocomplete: "animate-$animation.keyframes" }],
53
- [/^animate-name-(.+)/, ([, d]) => ({ "animation-name": utils.handler.bracket.cssvar(d) ?? d })],
54
- [/^animate-duration-(.+)$/, ([, d], { theme }) => ({ "animation-duration": theme.duration?.[d || "DEFAULT"] ?? utils.handler.bracket.cssvar.time(d) }), { autocomplete: ["animate-duration", "animate-duration-$duration"] }],
55
- [/^animate-delay-(.+)$/, ([, d], { theme }) => ({ "animation-delay": theme.duration?.[d || "DEFAULT"] ?? utils.handler.bracket.cssvar.time(d) }), { autocomplete: ["animate-delay", "animate-delay-$duration"] }],
56
- [/^animate-ease(?:-(.+))?$/, ([, d], { theme }) => ({ "animation-timing-function": theme.easing?.[d || "DEFAULT"] ?? utils.handler.bracket.cssvar(d) }), { autocomplete: ["animate-ease", "animate-ease-$easing"] }],
53
+ [/^animate-name-(.+)/, ([, d]) => ({ "animation-name": utils.h.bracket.cssvar(d) ?? d })],
54
+ [/^animate-duration-(.+)$/, ([, d], { theme }) => ({ "animation-duration": theme.duration?.[d || "DEFAULT"] ?? utils.h.bracket.cssvar.time(d) }), { autocomplete: ["animate-duration", "animate-duration-$duration"] }],
55
+ [/^animate-delay-(.+)$/, ([, d], { theme }) => ({ "animation-delay": theme.duration?.[d || "DEFAULT"] ?? utils.h.bracket.cssvar.time(d) }), { autocomplete: ["animate-delay", "animate-delay-$duration"] }],
56
+ [/^animate-ease(?:-(.+))?$/, ([, d], { theme }) => ({ "animation-timing-function": theme.easing?.[d || "DEFAULT"] ?? utils.h.bracket.cssvar(d) }), { autocomplete: ["animate-ease", "animate-ease-$easing"] }],
57
57
  [
58
58
  /^animate-(fill-mode-|fill-|mode-)?(.+)$/,
59
59
  ([, t, d]) => ["none", "forwards", "backwards", "both", ...[t ? utils.globalKeywords : []]].includes(d) ? { "animation-fill-mode": d } : void 0,
@@ -76,7 +76,7 @@ const animations = [
76
76
  ]
77
77
  }
78
78
  ],
79
- [/^animate-(?:iteration-|count-|iteration-count-)(.+)$/, ([, d]) => ({ "animation-iteration-count": utils.handler.bracket.cssvar(d) ?? d.replace(/\-/g, ",") }), { autocomplete: ["animate-(iteration|count|iteration-count)", "animate-(iteration|count|iteration-count)-<num>"] }],
79
+ [/^animate-(?:iteration-count-|iteration-|count-)(.+)$/, ([, d]) => ({ "animation-iteration-count": utils.h.bracket.cssvar(d) ?? d.replace(/\-/g, ",") }), { autocomplete: ["animate-(iteration|count|iteration-count)", "animate-(iteration|count|iteration-count)-<num>"] }],
80
80
  [
81
81
  /^animate-(play-state-|play-|state-)?(.+)$/,
82
82
  ([, t, d]) => ["paused", "running", ...[t ? utils.globalKeywords : []]].includes(d) ? { "animation-play-state": d } : void 0,
@@ -141,7 +141,7 @@ function bgGradientColorResolver() {
141
141
  function bgGradientPositionResolver() {
142
142
  return ([, mode, body]) => {
143
143
  return {
144
- [`--un-gradient-${mode}-position`]: `${Number(utils.handler.bracket.cssvar.percent(body)) * 100}%`
144
+ [`--un-gradient-${mode}-position`]: `${Number(utils.h.bracket.cssvar.percent(body)) * 100}%`
145
145
  };
146
146
  };
147
147
  }
@@ -151,20 +151,20 @@ const bgPositionRE = /^\[position:.+\]$/;
151
151
  const backgroundStyles = [
152
152
  [/^bg-(.+)$/, ([, d]) => {
153
153
  if (bgUrlRE.test(d))
154
- return { "--un-url": utils.handler.bracket(d), "background-image": "var(--un-url)" };
155
- if (bgLengthRE.test(d) && utils.handler.bracketOfLength(d) != null)
156
- return { "background-size": utils.handler.bracketOfLength(d).split(" ").map((e) => utils.handler.fraction.auto.px.cssvar(e) ?? e).join(" ") };
157
- if (bgPositionRE.test(d) && utils.handler.bracketOfPosition(d) != null)
158
- return { "background-position": utils.handler.bracketOfPosition(d).split(" ").map((e) => utils.handler.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
154
+ return { "--un-url": utils.h.bracket(d), "background-image": "var(--un-url)" };
155
+ if (bgLengthRE.test(d) && utils.h.bracketOfLength(d) != null)
156
+ return { "background-size": utils.h.bracketOfLength(d).split(" ").map((e) => utils.h.fraction.auto.px.cssvar(e) ?? e).join(" ") };
157
+ if (bgPositionRE.test(d) && utils.h.bracketOfPosition(d) != null)
158
+ return { "background-position": utils.h.bracketOfPosition(d).split(" ").map((e) => utils.h.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
159
159
  }],
160
- [/^bg-gradient-(.+)$/, ([, d]) => ({ "--un-gradient": utils.handler.bracket(d) }), {
160
+ [/^bg-gradient-(.+)$/, ([, d]) => ({ "--un-gradient": utils.h.bracket(d) }), {
161
161
  autocomplete: ["bg-gradient", "bg-gradient-(from|to|via)", "bg-gradient-(from|to|via)-$colors", "bg-gradient-(from|to|via)-(op|opacity)", "bg-gradient-(from|to|via)-(op|opacity)-<percent>"]
162
162
  }],
163
- [/^(?:bg-gradient-)?stops-(\[.+\])$/, ([, s]) => ({ "--un-gradient-stops": utils.handler.bracket(s) })],
163
+ [/^(?:bg-gradient-)?stops-(\[.+\])$/, ([, s]) => ({ "--un-gradient-stops": utils.h.bracket(s) })],
164
164
  [/^(?:bg-gradient-)?(from)-(.+)$/, bgGradientColorResolver()],
165
165
  [/^(?:bg-gradient-)?(via)-(.+)$/, bgGradientColorResolver()],
166
166
  [/^(?:bg-gradient-)?(to)-(.+)$/, bgGradientColorResolver()],
167
- [/^(?:bg-gradient-)?(from|via|to)-op(?:acity)?-?(.+)$/, ([, position, opacity]) => ({ [`--un-${position}-opacity`]: utils.handler.bracket.percent(opacity) })],
167
+ [/^(?:bg-gradient-)?(from|via|to)-op(?:acity)?-?(.+)$/, ([, position, opacity]) => ({ [`--un-${position}-opacity`]: utils.h.bracket.percent(opacity) })],
168
168
  [/^(from|via|to)-([\d\.]+)%$/, bgGradientPositionResolver()],
169
169
  [/^bg-gradient-((?:repeating-)?(?:linear|radial|conic))$/, ([, s]) => ({
170
170
  "background-image": `${s}-gradient(var(--un-gradient, var(--un-gradient-stops, rgba(255, 255, 255, 0))))`
@@ -179,7 +179,7 @@ const backgroundStyles = [
179
179
  }
180
180
  }, { autocomplete: `bg-gradient-to-(${Object.keys(utils.positionMap).filter((k) => k.length <= 2 && Array.from(k).every((c) => "rltb".includes(c))).join("|")})` }],
181
181
  [/^(?:bg-gradient-)?shape-(.+)$/, ([, d]) => {
182
- const v = d in utils.positionMap ? `to ${utils.positionMap[d]}` : utils.handler.bracket(d);
182
+ const v = d in utils.positionMap ? `to ${utils.positionMap[d]}` : utils.h.bracket(d);
183
183
  if (v != null) {
184
184
  return {
185
185
  "--un-gradient-shape": v,
@@ -251,18 +251,18 @@ const listStyle = [
251
251
  ["list-none", { "list-style-type": "none" }],
252
252
  [/^list-image-(.+)$/, ([, d]) => {
253
253
  if (/^\[url\(.+\)\]$/.test(d))
254
- return { "list-style-image": utils.handler.bracket(d) };
254
+ return { "list-style-image": utils.h.bracket(d) };
255
255
  }],
256
256
  ["list-image-none", { "list-style-image": "none" }],
257
257
  ...utils.makeGlobalStaticRules("list", "list-style-type")
258
258
  ];
259
259
  const accents = [
260
260
  [/^accent-(.+)$/, utils.colorResolver("accent-color", "accent"), { autocomplete: "accent-$colors" }],
261
- [/^accent-op(?:acity)?-?(.+)$/, ([, d]) => ({ "--un-accent-opacity": utils.handler.bracket.percent(d) }), { autocomplete: ["accent-(op|opacity)", "accent-(op|opacity)-<percent>"] }]
261
+ [/^accent-op(?:acity)?-?(.+)$/, ([, d]) => ({ "--un-accent-opacity": utils.h.bracket.percent(d) }), { autocomplete: ["accent-(op|opacity)", "accent-(op|opacity)-<percent>"] }]
262
262
  ];
263
263
  const carets = [
264
264
  [/^caret-(.+)$/, utils.colorResolver("caret-color", "caret"), { autocomplete: "caret-$colors" }],
265
- [/^caret-op(?:acity)?-?(.+)$/, ([, d]) => ({ "--un-caret-opacity": utils.handler.bracket.percent(d) }), { autocomplete: ["caret-(op|opacity)", "caret-(op|opacity)-<percent>"] }]
265
+ [/^caret-op(?:acity)?-?(.+)$/, ([, d]) => ({ "--un-caret-opacity": utils.h.bracket.percent(d) }), { autocomplete: ["caret-(op|opacity)", "caret-(op|opacity)-<percent>"] }]
266
266
  ];
267
267
  const imageRenderings = [
268
268
  ["image-render-auto", { "image-rendering": "auto" }],
@@ -296,7 +296,7 @@ const scrollBehaviors = [
296
296
  ];
297
297
 
298
298
  const columns = [
299
- [/^columns-(.+)$/, ([, v]) => ({ columns: utils.handler.bracket.global.number.auto.numberWithUnit(v) }), { autocomplete: "columns-<num>" }],
299
+ [/^columns-(.+)$/, ([, v]) => ({ columns: utils.h.bracket.global.number.auto.numberWithUnit(v) }), { autocomplete: "columns-<num>" }],
300
300
  ["break-before-auto", { "break-before": "auto" }],
301
301
  ["break-before-avoid", { "break-before": "avoid" }],
302
302
  ["break-before-all", { "break-before": "all" }],
@@ -410,10 +410,10 @@ const backdropFilterBase = {
410
410
  };
411
411
  const backdropFilterProperty = "var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia)";
412
412
  function percentWithDefault(str) {
413
- let v = utils.handler.bracket.cssvar(str || "");
413
+ let v = utils.h.bracket.cssvar(str || "");
414
414
  if (v != null)
415
415
  return v;
416
- v = str ? utils.handler.percent(str) : "1";
416
+ v = str ? utils.h.percent(str) : "1";
417
417
  if (v != null && Number.parseFloat(v) <= 1)
418
418
  return v;
419
419
  }
@@ -445,7 +445,7 @@ function dropShadowResolver([, s], { theme }) {
445
445
  "filter": filterProperty
446
446
  };
447
447
  }
448
- v = utils.handler.bracket.cssvar(s);
448
+ v = utils.h.bracket.cssvar(s);
449
449
  if (v != null) {
450
450
  return {
451
451
  "--un-drop-shadow": `drop-shadow(${v})`,
@@ -454,9 +454,9 @@ function dropShadowResolver([, s], { theme }) {
454
454
  }
455
455
  }
456
456
  const filters = [
457
- [/^(?:(backdrop-)|filter-)?blur(?:-(.+))?$/, toFilter("blur", (s, theme) => theme.blur?.[s || "DEFAULT"] || utils.handler.bracket.cssvar.px(s)), { autocomplete: ["(backdrop|filter)-blur-$blur", "blur-$blur", "filter-blur"] }],
458
- [/^(?:(backdrop-)|filter-)?brightness-(.+)$/, toFilter("brightness", (s) => utils.handler.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-brightness-<percent>", "brightness-<percent>"] }],
459
- [/^(?:(backdrop-)|filter-)?contrast-(.+)$/, toFilter("contrast", (s) => utils.handler.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-contrast-<percent>", "contrast-<percent>"] }],
457
+ [/^(?:(backdrop-)|filter-)?blur(?:-(.+))?$/, toFilter("blur", (s, theme) => theme.blur?.[s || "DEFAULT"] || utils.h.bracket.cssvar.px(s)), { autocomplete: ["(backdrop|filter)-blur-$blur", "blur-$blur", "filter-blur"] }],
458
+ [/^(?:(backdrop-)|filter-)?brightness-(.+)$/, toFilter("brightness", (s) => utils.h.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-brightness-<percent>", "brightness-<percent>"] }],
459
+ [/^(?:(backdrop-)|filter-)?contrast-(.+)$/, toFilter("contrast", (s) => utils.h.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-contrast-<percent>", "contrast-<percent>"] }],
460
460
  [/^(?:filter-)?drop-shadow(?:-(.+))?$/, dropShadowResolver, {
461
461
  autocomplete: [
462
462
  "filter-drop",
@@ -475,12 +475,12 @@ const filters = [
475
475
  ]
476
476
  }],
477
477
  [/^(?:filter-)?drop-shadow-color-(.+)$/, utils.colorResolver("--un-drop-shadow-color", "drop-shadow")],
478
- [/^(?:filter-)?drop-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-drop-shadow-opacity": utils.handler.bracket.percent(opacity) })],
478
+ [/^(?:filter-)?drop-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-drop-shadow-opacity": utils.h.bracket.percent(opacity) })],
479
479
  [/^(?:(backdrop-)|filter-)?grayscale(?:-(.+))?$/, toFilter("grayscale", percentWithDefault), { autocomplete: ["(backdrop|filter)-grayscale", "(backdrop|filter)-grayscale-<percent>", "grayscale-<percent>"] }],
480
- [/^(?:(backdrop-)|filter-)?hue-rotate-(.+)$/, toFilter("hue-rotate", (s) => utils.handler.bracket.cssvar.degree(s))],
480
+ [/^(?:(backdrop-)|filter-)?hue-rotate-(.+)$/, toFilter("hue-rotate", (s) => utils.h.bracket.cssvar.degree(s))],
481
481
  [/^(?:(backdrop-)|filter-)?invert(?:-(.+))?$/, toFilter("invert", percentWithDefault), { autocomplete: ["(backdrop|filter)-invert", "(backdrop|filter)-invert-<percent>", "invert-<percent>"] }],
482
- [/^(backdrop-)op(?:acity)-(.+)$/, toFilter("opacity", (s) => utils.handler.bracket.cssvar.percent(s)), { autocomplete: ["backdrop-(op|opacity)", "backdrop-(op|opacity)-<percent>"] }],
483
- [/^(?:(backdrop-)|filter-)?saturate-(.+)$/, toFilter("saturate", (s) => utils.handler.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-saturate", "(backdrop|filter)-saturate-<percent>", "saturate-<percent>"] }],
482
+ [/^(backdrop-)op(?:acity)-(.+)$/, toFilter("opacity", (s) => utils.h.bracket.cssvar.percent(s)), { autocomplete: ["backdrop-(op|opacity)", "backdrop-(op|opacity)-<percent>"] }],
483
+ [/^(?:(backdrop-)|filter-)?saturate-(.+)$/, toFilter("saturate", (s) => utils.h.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-saturate", "(backdrop|filter)-saturate-<percent>", "saturate-<percent>"] }],
484
484
  [/^(?:(backdrop-)|filter-)?sepia(?:-(.+))?$/, toFilter("sepia", percentWithDefault), { autocomplete: ["(backdrop|filter)-sepia", "(backdrop|filter)-sepia-<percent>", "sepia-<percent>"] }],
485
485
  ["filter", { filter: filterProperty }],
486
486
  ["backdrop-filter", {
@@ -506,7 +506,7 @@ const spaces = [
506
506
  [/^space-(block|inline)-reverse$/, ([, d]) => ({ [`--un-space-${d}-reverse`]: 1 })]
507
507
  ];
508
508
  function handlerSpace([, d, s], { theme }) {
509
- let v = theme.spacing?.[s || "DEFAULT"] ?? utils.handler.bracket.cssvar.auto.fraction.rem(s || "1");
509
+ let v = theme.spacing?.[s || "DEFAULT"] ?? utils.h.bracket.cssvar.auto.fraction.rem(s || "1");
510
510
  if (v != null) {
511
511
  if (v === "0")
512
512
  v = "0px";
@@ -592,8 +592,8 @@ const objectPositions = [
592
592
  [/^object-(.+)$/, ([, d]) => {
593
593
  if (utils.positionMap[d])
594
594
  return { "object-position": utils.positionMap[d] };
595
- if (utils.handler.bracketOfPosition(d) != null)
596
- return { "object-position": utils.handler.bracketOfPosition(d).split(" ").map((e) => utils.handler.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
595
+ if (utils.h.bracketOfPosition(d) != null)
596
+ return { "object-position": utils.h.bracketOfPosition(d).split(" ").map((e) => utils.h.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
597
597
  }, { autocomplete: `object-(${Object.keys(utils.positionMap).join("|")})` }]
598
598
  ];
599
599
  const backgroundBlendModes = [
@@ -655,7 +655,7 @@ const tables = [
655
655
  ["border-collapse", { "border-collapse": "collapse" }],
656
656
  ["border-separate", { "border-collapse": "separate" }],
657
657
  [/^border-spacing-(.+)$/, ([, s], { theme }) => {
658
- const v = theme.spacing?.[s] ?? utils.handler.bracket.cssvar.global.auto.fraction.rem(s);
658
+ const v = theme.spacing?.[s] ?? utils.h.bracket.cssvar.global.auto.fraction.rem(s);
659
659
  if (v != null) {
660
660
  return {
661
661
  "--un-border-spacing-x": v,
@@ -665,7 +665,7 @@ const tables = [
665
665
  }
666
666
  }, { autocomplete: ["border-spacing", "border-spacing-$spacing"] }],
667
667
  [/^border-spacing-([xy])-(.+)$/, ([, d, s], { theme }) => {
668
- const v = theme.spacing?.[s] ?? utils.handler.bracket.cssvar.global.auto.fraction.rem(s);
668
+ const v = theme.spacing?.[s] ?? utils.h.bracket.cssvar.global.auto.fraction.rem(s);
669
669
  if (v != null) {
670
670
  return {
671
671
  [`--un-border-spacing-${d}`]: v,
@@ -700,7 +700,7 @@ const cssVariables = [
700
700
  [/^(.+?)-(\$.+)$/, ([, name, varname]) => {
701
701
  const prop = variablesAbbrMap[name];
702
702
  if (prop)
703
- return { [prop]: utils.handler.cssvar(varname) };
703
+ return { [prop]: utils.h.cssvar(varname) };
704
704
  }]
705
705
  ];
706
706
 
@@ -712,11 +712,11 @@ const divides = [
712
712
  [/^divide-(block|inline)-(-?.+)$/, handlerDivide],
713
713
  [/^divide-(block|inline)-reverse$/, ([, d]) => ({ [`--un-divide-${d}-reverse`]: 1 })],
714
714
  [/^divide-(.+)$/, utils.colorResolver("border-color", "divide"), { autocomplete: "divide-$colors" }],
715
- [/^divide-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-divide-opacity": utils.handler.bracket.percent(opacity) }), { autocomplete: ["divide-(op|opacity)", "divide-(op|opacity)-<percent>"] }],
715
+ [/^divide-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-divide-opacity": utils.h.bracket.percent(opacity) }), { autocomplete: ["divide-(op|opacity)", "divide-(op|opacity)-<percent>"] }],
716
716
  ..._.borderStyles.map((style) => [`divide-${style}`, { "border-style": style }])
717
717
  ];
718
718
  function handlerDivide([, d, s], { theme }) {
719
- let v = theme.lineWidth?.[s || "DEFAULT"] ?? utils.handler.bracket.cssvar.px(s || "1");
719
+ let v = theme.lineWidth?.[s || "DEFAULT"] ?? utils.h.bracket.cssvar.px(s || "1");
720
720
  if (v != null) {
721
721
  if (v === "0")
722
722
  v = "0px";
@@ -841,7 +841,7 @@ const scrolls = [
841
841
 
842
842
  const placeholders = [
843
843
  [/^\$ placeholder-(.+)$/, utils.colorResolver("color", "placeholder"), { autocomplete: "placeholder-$colors" }],
844
- [/^\$ placeholder-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-placeholder-opacity": utils.handler.bracket.percent(opacity) }), { autocomplete: ["placeholder-(op|opacity)", "placeholder-(op|opacity)-<percent>"] }]
844
+ [/^\$ placeholder-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-placeholder-opacity": utils.h.bracket.percent(opacity) }), { autocomplete: ["placeholder-(op|opacity)", "placeholder-(op|opacity)-<percent>"] }]
845
845
  ];
846
846
 
847
847
  const rules = [
@@ -1206,7 +1206,7 @@ const placeholderModifier = (input, { theme }) => {
1206
1206
  function hasOpacityValue(body) {
1207
1207
  const match = body.match(/^op(?:acity)?-?(.+)$/);
1208
1208
  if (match && match[1] != null)
1209
- return utils.handler.bracket.percent(match[1]) != null;
1209
+ return utils.h.bracket.percent(match[1]) != null;
1210
1210
  return false;
1211
1211
  }
1212
1212
 
package/dist/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import { presetMini } from '@unocss/preset-mini';
2
2
  export { colors, preflights } from '@unocss/preset-mini';
3
- import { handler, globalKeywords, makeGlobalStaticRules, positionMap, parseColor, colorToString, colorOpacityToString, colorResolver, resolveBreakpoints, colorableShadows, directionMap, directionSize, variantMatcher, variantParentMatcher, hasParseableColor } from '@unocss/preset-mini/utils';
3
+ import { h, globalKeywords, makeGlobalStaticRules, positionMap, parseColor, colorToString, colorOpacityToString, colorResolver, resolveBreakpoints, colorableShadows, directionMap, directionSize, variantMatcher, variantParentMatcher, hasParseableColor } from '@unocss/preset-mini/utils';
4
4
  import { isString, warnOnce } from '@unocss/core';
5
5
  import * as _ from '@unocss/preset-mini/rules';
6
6
  import { varEmpty, borderStyles, transformBase, boxShadowsBase, ringBase } from '@unocss/preset-mini/rules';
@@ -32,12 +32,12 @@ const animations = [
32
32
  }
33
33
  ];
34
34
  }
35
- return { animation: handler.bracket.cssvar(name) };
35
+ return { animation: h.bracket.cssvar(name) };
36
36
  }, { autocomplete: "animate-$animation.keyframes" }],
37
- [/^animate-name-(.+)/, ([, d]) => ({ "animation-name": handler.bracket.cssvar(d) ?? d })],
38
- [/^animate-duration-(.+)$/, ([, d], { theme }) => ({ "animation-duration": theme.duration?.[d || "DEFAULT"] ?? handler.bracket.cssvar.time(d) }), { autocomplete: ["animate-duration", "animate-duration-$duration"] }],
39
- [/^animate-delay-(.+)$/, ([, d], { theme }) => ({ "animation-delay": theme.duration?.[d || "DEFAULT"] ?? handler.bracket.cssvar.time(d) }), { autocomplete: ["animate-delay", "animate-delay-$duration"] }],
40
- [/^animate-ease(?:-(.+))?$/, ([, d], { theme }) => ({ "animation-timing-function": theme.easing?.[d || "DEFAULT"] ?? handler.bracket.cssvar(d) }), { autocomplete: ["animate-ease", "animate-ease-$easing"] }],
37
+ [/^animate-name-(.+)/, ([, d]) => ({ "animation-name": h.bracket.cssvar(d) ?? d })],
38
+ [/^animate-duration-(.+)$/, ([, d], { theme }) => ({ "animation-duration": theme.duration?.[d || "DEFAULT"] ?? h.bracket.cssvar.time(d) }), { autocomplete: ["animate-duration", "animate-duration-$duration"] }],
39
+ [/^animate-delay-(.+)$/, ([, d], { theme }) => ({ "animation-delay": theme.duration?.[d || "DEFAULT"] ?? h.bracket.cssvar.time(d) }), { autocomplete: ["animate-delay", "animate-delay-$duration"] }],
40
+ [/^animate-ease(?:-(.+))?$/, ([, d], { theme }) => ({ "animation-timing-function": theme.easing?.[d || "DEFAULT"] ?? h.bracket.cssvar(d) }), { autocomplete: ["animate-ease", "animate-ease-$easing"] }],
41
41
  [
42
42
  /^animate-(fill-mode-|fill-|mode-)?(.+)$/,
43
43
  ([, t, d]) => ["none", "forwards", "backwards", "both", ...[t ? globalKeywords : []]].includes(d) ? { "animation-fill-mode": d } : void 0,
@@ -60,7 +60,7 @@ const animations = [
60
60
  ]
61
61
  }
62
62
  ],
63
- [/^animate-(?:iteration-|count-|iteration-count-)(.+)$/, ([, d]) => ({ "animation-iteration-count": handler.bracket.cssvar(d) ?? d.replace(/\-/g, ",") }), { autocomplete: ["animate-(iteration|count|iteration-count)", "animate-(iteration|count|iteration-count)-<num>"] }],
63
+ [/^animate-(?:iteration-count-|iteration-|count-)(.+)$/, ([, d]) => ({ "animation-iteration-count": h.bracket.cssvar(d) ?? d.replace(/\-/g, ",") }), { autocomplete: ["animate-(iteration|count|iteration-count)", "animate-(iteration|count|iteration-count)-<num>"] }],
64
64
  [
65
65
  /^animate-(play-state-|play-|state-)?(.+)$/,
66
66
  ([, t, d]) => ["paused", "running", ...[t ? globalKeywords : []]].includes(d) ? { "animation-play-state": d } : void 0,
@@ -125,7 +125,7 @@ function bgGradientColorResolver() {
125
125
  function bgGradientPositionResolver() {
126
126
  return ([, mode, body]) => {
127
127
  return {
128
- [`--un-gradient-${mode}-position`]: `${Number(handler.bracket.cssvar.percent(body)) * 100}%`
128
+ [`--un-gradient-${mode}-position`]: `${Number(h.bracket.cssvar.percent(body)) * 100}%`
129
129
  };
130
130
  };
131
131
  }
@@ -135,20 +135,20 @@ const bgPositionRE = /^\[position:.+\]$/;
135
135
  const backgroundStyles = [
136
136
  [/^bg-(.+)$/, ([, d]) => {
137
137
  if (bgUrlRE.test(d))
138
- return { "--un-url": handler.bracket(d), "background-image": "var(--un-url)" };
139
- if (bgLengthRE.test(d) && handler.bracketOfLength(d) != null)
140
- return { "background-size": handler.bracketOfLength(d).split(" ").map((e) => handler.fraction.auto.px.cssvar(e) ?? e).join(" ") };
141
- if (bgPositionRE.test(d) && handler.bracketOfPosition(d) != null)
142
- return { "background-position": handler.bracketOfPosition(d).split(" ").map((e) => handler.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
138
+ return { "--un-url": h.bracket(d), "background-image": "var(--un-url)" };
139
+ if (bgLengthRE.test(d) && h.bracketOfLength(d) != null)
140
+ return { "background-size": h.bracketOfLength(d).split(" ").map((e) => h.fraction.auto.px.cssvar(e) ?? e).join(" ") };
141
+ if (bgPositionRE.test(d) && h.bracketOfPosition(d) != null)
142
+ return { "background-position": h.bracketOfPosition(d).split(" ").map((e) => h.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
143
143
  }],
144
- [/^bg-gradient-(.+)$/, ([, d]) => ({ "--un-gradient": handler.bracket(d) }), {
144
+ [/^bg-gradient-(.+)$/, ([, d]) => ({ "--un-gradient": h.bracket(d) }), {
145
145
  autocomplete: ["bg-gradient", "bg-gradient-(from|to|via)", "bg-gradient-(from|to|via)-$colors", "bg-gradient-(from|to|via)-(op|opacity)", "bg-gradient-(from|to|via)-(op|opacity)-<percent>"]
146
146
  }],
147
- [/^(?:bg-gradient-)?stops-(\[.+\])$/, ([, s]) => ({ "--un-gradient-stops": handler.bracket(s) })],
147
+ [/^(?:bg-gradient-)?stops-(\[.+\])$/, ([, s]) => ({ "--un-gradient-stops": h.bracket(s) })],
148
148
  [/^(?:bg-gradient-)?(from)-(.+)$/, bgGradientColorResolver()],
149
149
  [/^(?:bg-gradient-)?(via)-(.+)$/, bgGradientColorResolver()],
150
150
  [/^(?:bg-gradient-)?(to)-(.+)$/, bgGradientColorResolver()],
151
- [/^(?:bg-gradient-)?(from|via|to)-op(?:acity)?-?(.+)$/, ([, position, opacity]) => ({ [`--un-${position}-opacity`]: handler.bracket.percent(opacity) })],
151
+ [/^(?:bg-gradient-)?(from|via|to)-op(?:acity)?-?(.+)$/, ([, position, opacity]) => ({ [`--un-${position}-opacity`]: h.bracket.percent(opacity) })],
152
152
  [/^(from|via|to)-([\d\.]+)%$/, bgGradientPositionResolver()],
153
153
  [/^bg-gradient-((?:repeating-)?(?:linear|radial|conic))$/, ([, s]) => ({
154
154
  "background-image": `${s}-gradient(var(--un-gradient, var(--un-gradient-stops, rgba(255, 255, 255, 0))))`
@@ -163,7 +163,7 @@ const backgroundStyles = [
163
163
  }
164
164
  }, { autocomplete: `bg-gradient-to-(${Object.keys(positionMap).filter((k) => k.length <= 2 && Array.from(k).every((c) => "rltb".includes(c))).join("|")})` }],
165
165
  [/^(?:bg-gradient-)?shape-(.+)$/, ([, d]) => {
166
- const v = d in positionMap ? `to ${positionMap[d]}` : handler.bracket(d);
166
+ const v = d in positionMap ? `to ${positionMap[d]}` : h.bracket(d);
167
167
  if (v != null) {
168
168
  return {
169
169
  "--un-gradient-shape": v,
@@ -235,18 +235,18 @@ const listStyle = [
235
235
  ["list-none", { "list-style-type": "none" }],
236
236
  [/^list-image-(.+)$/, ([, d]) => {
237
237
  if (/^\[url\(.+\)\]$/.test(d))
238
- return { "list-style-image": handler.bracket(d) };
238
+ return { "list-style-image": h.bracket(d) };
239
239
  }],
240
240
  ["list-image-none", { "list-style-image": "none" }],
241
241
  ...makeGlobalStaticRules("list", "list-style-type")
242
242
  ];
243
243
  const accents = [
244
244
  [/^accent-(.+)$/, colorResolver("accent-color", "accent"), { autocomplete: "accent-$colors" }],
245
- [/^accent-op(?:acity)?-?(.+)$/, ([, d]) => ({ "--un-accent-opacity": handler.bracket.percent(d) }), { autocomplete: ["accent-(op|opacity)", "accent-(op|opacity)-<percent>"] }]
245
+ [/^accent-op(?:acity)?-?(.+)$/, ([, d]) => ({ "--un-accent-opacity": h.bracket.percent(d) }), { autocomplete: ["accent-(op|opacity)", "accent-(op|opacity)-<percent>"] }]
246
246
  ];
247
247
  const carets = [
248
248
  [/^caret-(.+)$/, colorResolver("caret-color", "caret"), { autocomplete: "caret-$colors" }],
249
- [/^caret-op(?:acity)?-?(.+)$/, ([, d]) => ({ "--un-caret-opacity": handler.bracket.percent(d) }), { autocomplete: ["caret-(op|opacity)", "caret-(op|opacity)-<percent>"] }]
249
+ [/^caret-op(?:acity)?-?(.+)$/, ([, d]) => ({ "--un-caret-opacity": h.bracket.percent(d) }), { autocomplete: ["caret-(op|opacity)", "caret-(op|opacity)-<percent>"] }]
250
250
  ];
251
251
  const imageRenderings = [
252
252
  ["image-render-auto", { "image-rendering": "auto" }],
@@ -280,7 +280,7 @@ const scrollBehaviors = [
280
280
  ];
281
281
 
282
282
  const columns = [
283
- [/^columns-(.+)$/, ([, v]) => ({ columns: handler.bracket.global.number.auto.numberWithUnit(v) }), { autocomplete: "columns-<num>" }],
283
+ [/^columns-(.+)$/, ([, v]) => ({ columns: h.bracket.global.number.auto.numberWithUnit(v) }), { autocomplete: "columns-<num>" }],
284
284
  ["break-before-auto", { "break-before": "auto" }],
285
285
  ["break-before-avoid", { "break-before": "avoid" }],
286
286
  ["break-before-all", { "break-before": "all" }],
@@ -394,10 +394,10 @@ const backdropFilterBase = {
394
394
  };
395
395
  const backdropFilterProperty = "var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia)";
396
396
  function percentWithDefault(str) {
397
- let v = handler.bracket.cssvar(str || "");
397
+ let v = h.bracket.cssvar(str || "");
398
398
  if (v != null)
399
399
  return v;
400
- v = str ? handler.percent(str) : "1";
400
+ v = str ? h.percent(str) : "1";
401
401
  if (v != null && Number.parseFloat(v) <= 1)
402
402
  return v;
403
403
  }
@@ -429,7 +429,7 @@ function dropShadowResolver([, s], { theme }) {
429
429
  "filter": filterProperty
430
430
  };
431
431
  }
432
- v = handler.bracket.cssvar(s);
432
+ v = h.bracket.cssvar(s);
433
433
  if (v != null) {
434
434
  return {
435
435
  "--un-drop-shadow": `drop-shadow(${v})`,
@@ -438,9 +438,9 @@ function dropShadowResolver([, s], { theme }) {
438
438
  }
439
439
  }
440
440
  const filters = [
441
- [/^(?:(backdrop-)|filter-)?blur(?:-(.+))?$/, toFilter("blur", (s, theme) => theme.blur?.[s || "DEFAULT"] || handler.bracket.cssvar.px(s)), { autocomplete: ["(backdrop|filter)-blur-$blur", "blur-$blur", "filter-blur"] }],
442
- [/^(?:(backdrop-)|filter-)?brightness-(.+)$/, toFilter("brightness", (s) => handler.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-brightness-<percent>", "brightness-<percent>"] }],
443
- [/^(?:(backdrop-)|filter-)?contrast-(.+)$/, toFilter("contrast", (s) => handler.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-contrast-<percent>", "contrast-<percent>"] }],
441
+ [/^(?:(backdrop-)|filter-)?blur(?:-(.+))?$/, toFilter("blur", (s, theme) => theme.blur?.[s || "DEFAULT"] || h.bracket.cssvar.px(s)), { autocomplete: ["(backdrop|filter)-blur-$blur", "blur-$blur", "filter-blur"] }],
442
+ [/^(?:(backdrop-)|filter-)?brightness-(.+)$/, toFilter("brightness", (s) => h.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-brightness-<percent>", "brightness-<percent>"] }],
443
+ [/^(?:(backdrop-)|filter-)?contrast-(.+)$/, toFilter("contrast", (s) => h.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-contrast-<percent>", "contrast-<percent>"] }],
444
444
  [/^(?:filter-)?drop-shadow(?:-(.+))?$/, dropShadowResolver, {
445
445
  autocomplete: [
446
446
  "filter-drop",
@@ -459,12 +459,12 @@ const filters = [
459
459
  ]
460
460
  }],
461
461
  [/^(?:filter-)?drop-shadow-color-(.+)$/, colorResolver("--un-drop-shadow-color", "drop-shadow")],
462
- [/^(?:filter-)?drop-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-drop-shadow-opacity": handler.bracket.percent(opacity) })],
462
+ [/^(?:filter-)?drop-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-drop-shadow-opacity": h.bracket.percent(opacity) })],
463
463
  [/^(?:(backdrop-)|filter-)?grayscale(?:-(.+))?$/, toFilter("grayscale", percentWithDefault), { autocomplete: ["(backdrop|filter)-grayscale", "(backdrop|filter)-grayscale-<percent>", "grayscale-<percent>"] }],
464
- [/^(?:(backdrop-)|filter-)?hue-rotate-(.+)$/, toFilter("hue-rotate", (s) => handler.bracket.cssvar.degree(s))],
464
+ [/^(?:(backdrop-)|filter-)?hue-rotate-(.+)$/, toFilter("hue-rotate", (s) => h.bracket.cssvar.degree(s))],
465
465
  [/^(?:(backdrop-)|filter-)?invert(?:-(.+))?$/, toFilter("invert", percentWithDefault), { autocomplete: ["(backdrop|filter)-invert", "(backdrop|filter)-invert-<percent>", "invert-<percent>"] }],
466
- [/^(backdrop-)op(?:acity)-(.+)$/, toFilter("opacity", (s) => handler.bracket.cssvar.percent(s)), { autocomplete: ["backdrop-(op|opacity)", "backdrop-(op|opacity)-<percent>"] }],
467
- [/^(?:(backdrop-)|filter-)?saturate-(.+)$/, toFilter("saturate", (s) => handler.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-saturate", "(backdrop|filter)-saturate-<percent>", "saturate-<percent>"] }],
466
+ [/^(backdrop-)op(?:acity)-(.+)$/, toFilter("opacity", (s) => h.bracket.cssvar.percent(s)), { autocomplete: ["backdrop-(op|opacity)", "backdrop-(op|opacity)-<percent>"] }],
467
+ [/^(?:(backdrop-)|filter-)?saturate-(.+)$/, toFilter("saturate", (s) => h.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-saturate", "(backdrop|filter)-saturate-<percent>", "saturate-<percent>"] }],
468
468
  [/^(?:(backdrop-)|filter-)?sepia(?:-(.+))?$/, toFilter("sepia", percentWithDefault), { autocomplete: ["(backdrop|filter)-sepia", "(backdrop|filter)-sepia-<percent>", "sepia-<percent>"] }],
469
469
  ["filter", { filter: filterProperty }],
470
470
  ["backdrop-filter", {
@@ -490,7 +490,7 @@ const spaces = [
490
490
  [/^space-(block|inline)-reverse$/, ([, d]) => ({ [`--un-space-${d}-reverse`]: 1 })]
491
491
  ];
492
492
  function handlerSpace([, d, s], { theme }) {
493
- let v = theme.spacing?.[s || "DEFAULT"] ?? handler.bracket.cssvar.auto.fraction.rem(s || "1");
493
+ let v = theme.spacing?.[s || "DEFAULT"] ?? h.bracket.cssvar.auto.fraction.rem(s || "1");
494
494
  if (v != null) {
495
495
  if (v === "0")
496
496
  v = "0px";
@@ -576,8 +576,8 @@ const objectPositions = [
576
576
  [/^object-(.+)$/, ([, d]) => {
577
577
  if (positionMap[d])
578
578
  return { "object-position": positionMap[d] };
579
- if (handler.bracketOfPosition(d) != null)
580
- return { "object-position": handler.bracketOfPosition(d).split(" ").map((e) => handler.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
579
+ if (h.bracketOfPosition(d) != null)
580
+ return { "object-position": h.bracketOfPosition(d).split(" ").map((e) => h.position.fraction.auto.px.cssvar(e) ?? e).join(" ") };
581
581
  }, { autocomplete: `object-(${Object.keys(positionMap).join("|")})` }]
582
582
  ];
583
583
  const backgroundBlendModes = [
@@ -639,7 +639,7 @@ const tables = [
639
639
  ["border-collapse", { "border-collapse": "collapse" }],
640
640
  ["border-separate", { "border-collapse": "separate" }],
641
641
  [/^border-spacing-(.+)$/, ([, s], { theme }) => {
642
- const v = theme.spacing?.[s] ?? handler.bracket.cssvar.global.auto.fraction.rem(s);
642
+ const v = theme.spacing?.[s] ?? h.bracket.cssvar.global.auto.fraction.rem(s);
643
643
  if (v != null) {
644
644
  return {
645
645
  "--un-border-spacing-x": v,
@@ -649,7 +649,7 @@ const tables = [
649
649
  }
650
650
  }, { autocomplete: ["border-spacing", "border-spacing-$spacing"] }],
651
651
  [/^border-spacing-([xy])-(.+)$/, ([, d, s], { theme }) => {
652
- const v = theme.spacing?.[s] ?? handler.bracket.cssvar.global.auto.fraction.rem(s);
652
+ const v = theme.spacing?.[s] ?? h.bracket.cssvar.global.auto.fraction.rem(s);
653
653
  if (v != null) {
654
654
  return {
655
655
  [`--un-border-spacing-${d}`]: v,
@@ -684,7 +684,7 @@ const cssVariables = [
684
684
  [/^(.+?)-(\$.+)$/, ([, name, varname]) => {
685
685
  const prop = variablesAbbrMap[name];
686
686
  if (prop)
687
- return { [prop]: handler.cssvar(varname) };
687
+ return { [prop]: h.cssvar(varname) };
688
688
  }]
689
689
  ];
690
690
 
@@ -696,11 +696,11 @@ const divides = [
696
696
  [/^divide-(block|inline)-(-?.+)$/, handlerDivide],
697
697
  [/^divide-(block|inline)-reverse$/, ([, d]) => ({ [`--un-divide-${d}-reverse`]: 1 })],
698
698
  [/^divide-(.+)$/, colorResolver("border-color", "divide"), { autocomplete: "divide-$colors" }],
699
- [/^divide-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-divide-opacity": handler.bracket.percent(opacity) }), { autocomplete: ["divide-(op|opacity)", "divide-(op|opacity)-<percent>"] }],
699
+ [/^divide-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-divide-opacity": h.bracket.percent(opacity) }), { autocomplete: ["divide-(op|opacity)", "divide-(op|opacity)-<percent>"] }],
700
700
  ...borderStyles.map((style) => [`divide-${style}`, { "border-style": style }])
701
701
  ];
702
702
  function handlerDivide([, d, s], { theme }) {
703
- let v = theme.lineWidth?.[s || "DEFAULT"] ?? handler.bracket.cssvar.px(s || "1");
703
+ let v = theme.lineWidth?.[s || "DEFAULT"] ?? h.bracket.cssvar.px(s || "1");
704
704
  if (v != null) {
705
705
  if (v === "0")
706
706
  v = "0px";
@@ -825,7 +825,7 @@ const scrolls = [
825
825
 
826
826
  const placeholders = [
827
827
  [/^\$ placeholder-(.+)$/, colorResolver("color", "placeholder"), { autocomplete: "placeholder-$colors" }],
828
- [/^\$ placeholder-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-placeholder-opacity": handler.bracket.percent(opacity) }), { autocomplete: ["placeholder-(op|opacity)", "placeholder-(op|opacity)-<percent>"] }]
828
+ [/^\$ placeholder-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-placeholder-opacity": h.bracket.percent(opacity) }), { autocomplete: ["placeholder-(op|opacity)", "placeholder-(op|opacity)-<percent>"] }]
829
829
  ];
830
830
 
831
831
  const rules = [
@@ -1190,7 +1190,7 @@ const placeholderModifier = (input, { theme }) => {
1190
1190
  function hasOpacityValue(body) {
1191
1191
  const match = body.match(/^op(?:acity)?-?(.+)$/);
1192
1192
  if (match && match[1] != null)
1193
- return handler.bracket.percent(match[1]) != null;
1193
+ return h.bracket.percent(match[1]) != null;
1194
1194
  return false;
1195
1195
  }
1196
1196
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@unocss/preset-wind",
3
- "version": "0.53.0",
3
+ "version": "0.53.3",
4
4
  "description": "Tailwind / Windi CSS compact preset for UnoCSS",
5
5
  "author": "Anthony Fu <anthonyfu117@hotmail.com>",
6
6
  "license": "MIT",
@@ -35,8 +35,8 @@
35
35
  "*.css"
36
36
  ],
37
37
  "dependencies": {
38
- "@unocss/core": "0.53.0",
39
- "@unocss/preset-mini": "0.53.0"
38
+ "@unocss/core": "0.53.3",
39
+ "@unocss/preset-mini": "0.53.3"
40
40
  },
41
41
  "scripts": {
42
42
  "build": "unbuild",