@unocss/preset-wind 0.62.3 → 0.62.4

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.
Files changed (2) hide show
  1. package/dist/index.mjs +175 -175
  2. package/package.json +4 -4
package/dist/index.mjs CHANGED
@@ -1,13 +1,43 @@
1
- import { isString, toArray, definePreset } from '@unocss/core';
1
+ import { toArray, isString, definePreset } from '@unocss/core';
2
2
  import presetMini, { presetMini as presetMini$1 } from '@unocss/preset-mini';
3
3
  export { colors, preflights } from '@unocss/preset-mini';
4
- import { h, globalKeywords, makeGlobalStaticRules, positionMap, parseColor, colorResolver, resolveBreakpoints, colorableShadows, directionMap, directionSize, variantMatcher, variantParentMatcher, hasParseableColor } from '@unocss/preset-mini/utils';
4
+ import { h, globalKeywords, makeGlobalStaticRules, positionMap, parseColor, colorResolver, resolveBreakpoints, directionMap, colorableShadows, directionSize, variantMatcher, variantParentMatcher, hasParseableColor } from '@unocss/preset-mini/utils';
5
5
  import * as _ from '@unocss/preset-mini/rules';
6
- import { varEmpty, borderStyles, transformBase, boxShadowsBase, ringBase } from '@unocss/preset-mini/rules';
6
+ import { borderStyles, varEmpty, transformBase, boxShadowsBase, ringBase } from '@unocss/preset-mini/rules';
7
7
  import { theme as theme$1 } from '@unocss/preset-mini/theme';
8
8
  import { colorToString, colorOpacityToString, variantMatcher as variantMatcher$1 } from '@unocss/rule-utils';
9
9
  import { variants as variants$1 } from '@unocss/preset-mini/variants';
10
10
 
11
+ function important(option) {
12
+ if (option == null || option === false)
13
+ return [];
14
+ const wrapWithIs = (selector) => {
15
+ if (selector.startsWith(":is(") && selector.endsWith(")"))
16
+ return selector;
17
+ if (selector.includes("::"))
18
+ return selector.replace(/(.*?)(\s*::.*)/, ":is($1)$2");
19
+ return `:is(${selector})`;
20
+ };
21
+ return [
22
+ option === true ? (util) => {
23
+ util.entries.forEach((i) => {
24
+ if (i[1] != null && !String(i[1]).endsWith("!important"))
25
+ i[1] += " !important";
26
+ });
27
+ } : (util) => {
28
+ if (!util.selector.startsWith(option))
29
+ util.selector = `${option} ${wrapWithIs(util.selector)}`;
30
+ }
31
+ ];
32
+ }
33
+
34
+ function postprocessors(options) {
35
+ return [
36
+ ...toArray(presetMini(options).postprocess),
37
+ ...important(options.important)
38
+ ];
39
+ }
40
+
11
41
  const animations = [
12
42
  [/^(?:animate-)?keyframes-(.+)$/, ([, name], { theme }) => {
13
43
  const kf = theme.animation?.keyframes?.[name];
@@ -367,6 +397,39 @@ const containerShortcuts = [
367
397
  }]
368
398
  ];
369
399
 
400
+ const divides = [
401
+ // divides
402
+ [/^divide-?([xy])$/, handlerDivide, { autocomplete: ["divide-(x|y|block|inline)", "divide-(x|y|block|inline)-reverse", "divide-(x|y|block|inline)-$lineWidth"] }],
403
+ [/^divide-?([xy])-?(.+)$/, handlerDivide],
404
+ [/^divide-?([xy])-reverse$/, ([, d]) => ({ [`--un-divide-${d}-reverse`]: 1 })],
405
+ [/^divide-(block|inline)$/, handlerDivide],
406
+ [/^divide-(block|inline)-(.+)$/, handlerDivide],
407
+ [/^divide-(block|inline)-reverse$/, ([, d]) => ({ [`--un-divide-${d}-reverse`]: 1 })],
408
+ // color & opacity
409
+ [/^divide-(.+)$/, colorResolver("border-color", "divide", "borderColor"), { autocomplete: "divide-$colors" }],
410
+ [/^divide-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-divide-opacity": h.bracket.percent(opacity) }), { autocomplete: ["divide-(op|opacity)", "divide-(op|opacity)-<percent>"] }],
411
+ // styles
412
+ ...borderStyles.map((style) => [`divide-${style}`, { "border-style": style }])
413
+ ];
414
+ function handlerDivide([, d, s], { theme }) {
415
+ let v = theme.lineWidth?.[s || "DEFAULT"] ?? h.bracket.cssvar.px(s || "1");
416
+ if (v != null) {
417
+ if (v === "0")
418
+ v = "0px";
419
+ const results = directionMap[d].map((item) => {
420
+ const key = `border${item}-width`;
421
+ const value = item.endsWith("right") || item.endsWith("bottom") ? `calc(${v} * var(--un-divide-${d}-reverse))` : `calc(${v} * calc(1 - var(--un-divide-${d}-reverse)))`;
422
+ return [key, value];
423
+ });
424
+ if (results) {
425
+ return [
426
+ [`--un-divide-${d}-reverse`, 0],
427
+ ...results
428
+ ];
429
+ }
430
+ }
431
+ }
432
+
370
433
  const filterBase = {
371
434
  "--un-blur": varEmpty,
372
435
  "--un-brightness": varEmpty,
@@ -486,6 +549,73 @@ const filters = [
486
549
  }])
487
550
  ];
488
551
 
552
+ const lineClamps = [
553
+ [/^line-clamp-(\d+)$/, ([, v]) => ({
554
+ "overflow": "hidden",
555
+ "display": "-webkit-box",
556
+ "-webkit-box-orient": "vertical",
557
+ "-webkit-line-clamp": v,
558
+ "line-clamp": v
559
+ }), { autocomplete: ["line-clamp", "line-clamp-<num>"] }],
560
+ ...["none", ...globalKeywords].map((keyword) => [`line-clamp-${keyword}`, {
561
+ "overflow": "visible",
562
+ "display": "block",
563
+ "-webkit-box-orient": "horizontal",
564
+ "-webkit-line-clamp": keyword,
565
+ "line-clamp": keyword
566
+ }])
567
+ ];
568
+
569
+ const placeholders = [
570
+ // The prefix `$ ` is intentional. This rule is not to be matched directly from user-generated token.
571
+ // See variants/placeholder.
572
+ [/^\$ placeholder-(.+)$/, colorResolver("color", "placeholder", "accentColor"), { autocomplete: "placeholder-$colors" }],
573
+ [/^\$ placeholder-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-placeholder-opacity": h.bracket.percent(opacity) }), { autocomplete: ["placeholder-(op|opacity)", "placeholder-(op|opacity)-<percent>"] }]
574
+ ];
575
+
576
+ const scrollSnapTypeBase = {
577
+ "--un-scroll-snap-strictness": "proximity"
578
+ };
579
+ const scrolls = [
580
+ // snap type
581
+ [/^snap-(x|y)$/, ([, d]) => ({
582
+ "scroll-snap-type": `${d} var(--un-scroll-snap-strictness)`
583
+ }), { autocomplete: "snap-(x|y|both)" }],
584
+ [/^snap-both$/, () => ({
585
+ "scroll-snap-type": "both var(--un-scroll-snap-strictness)"
586
+ })],
587
+ ["snap-mandatory", { "--un-scroll-snap-strictness": "mandatory" }],
588
+ ["snap-proximity", { "--un-scroll-snap-strictness": "proximity" }],
589
+ ["snap-none", { "scroll-snap-type": "none" }],
590
+ // snap align
591
+ ["snap-start", { "scroll-snap-align": "start" }],
592
+ ["snap-end", { "scroll-snap-align": "end" }],
593
+ ["snap-center", { "scroll-snap-align": "center" }],
594
+ ["snap-align-none", { "scroll-snap-align": "none" }],
595
+ // snap stop
596
+ ["snap-normal", { "scroll-snap-stop": "normal" }],
597
+ ["snap-always", { "scroll-snap-stop": "always" }],
598
+ // scroll margin
599
+ [/^scroll-ma?()-?(.+)$/, directionSize("scroll-margin"), {
600
+ autocomplete: [
601
+ "scroll-(m|p|ma|pa|block|inline)",
602
+ "scroll-(m|p|ma|pa|block|inline)-$spacing",
603
+ "scroll-(m|p|ma|pa|block|inline)-(x|y|r|l|t|b|bs|be|is|ie)",
604
+ "scroll-(m|p|ma|pa|block|inline)-(x|y|r|l|t|b|bs|be|is|ie)-$spacing"
605
+ ]
606
+ }],
607
+ [/^scroll-m-?([xy])-?(.+)$/, directionSize("scroll-margin")],
608
+ [/^scroll-m-?([rltb])-?(.+)$/, directionSize("scroll-margin")],
609
+ [/^scroll-m-(block|inline)-(.+)$/, directionSize("scroll-margin")],
610
+ [/^scroll-m-?([bi][se])-?(.+)$/, directionSize("scroll-margin")],
611
+ // scroll padding
612
+ [/^scroll-pa?()-?(.+)$/, directionSize("scroll-padding")],
613
+ [/^scroll-p-?([xy])-?(.+)$/, directionSize("scroll-padding")],
614
+ [/^scroll-p-?([rltb])-?(.+)$/, directionSize("scroll-padding")],
615
+ [/^scroll-p-(block|inline)-(.+)$/, directionSize("scroll-padding")],
616
+ [/^scroll-p-?([bi][se])-?(.+)$/, directionSize("scroll-padding")]
617
+ ];
618
+
489
619
  const spaces = [
490
620
  [/^space-([xy])-(.+)$/, handlerSpace, { autocomplete: ["space-(x|y|block|inline)", "space-(x|y|block|inline)-reverse", "space-(x|y|block|inline)-$spacing"] }],
491
621
  [/^space-([xy])-reverse$/, ([, d]) => ({ [`--un-space-${d}-reverse`]: 1 })],
@@ -684,77 +814,29 @@ const tables = [
684
814
  ["table-empty-cells-hidden", { "empty-cells": "hide" }]
685
815
  ];
686
816
 
687
- const variablesAbbrMap = {
688
- "bg-blend": "background-blend-mode",
689
- "bg-clip": "-webkit-background-clip",
690
- "bg-gradient": "linear-gradient",
691
- "bg-image": "background-image",
692
- "bg-origin": "background-origin",
693
- "bg-position": "background-position",
694
- "bg-repeat": "background-repeat",
695
- "bg-size": "background-size",
696
- "mix-blend": "mix-blend-mode",
697
- "object": "object-fit",
698
- "object-position": "object-position",
699
- "write": "writing-mode",
700
- "write-orient": "text-orientation"
817
+ const touchActionBase = {
818
+ "--un-pan-x": varEmpty,
819
+ "--un-pan-y": varEmpty,
820
+ "--un-pinch-zoom": varEmpty
701
821
  };
702
- const cssVariables = [
703
- [/^(.+?)-(\$.+)$/, ([, name, varname]) => {
704
- const prop = variablesAbbrMap[name];
705
- if (prop)
706
- return { [prop]: h.cssvar(varname) };
707
- }]
708
- ];
709
-
710
- const divides = [
711
- // divides
712
- [/^divide-?([xy])$/, handlerDivide, { autocomplete: ["divide-(x|y|block|inline)", "divide-(x|y|block|inline)-reverse", "divide-(x|y|block|inline)-$lineWidth"] }],
713
- [/^divide-?([xy])-?(.+)$/, handlerDivide],
714
- [/^divide-?([xy])-reverse$/, ([, d]) => ({ [`--un-divide-${d}-reverse`]: 1 })],
715
- [/^divide-(block|inline)$/, handlerDivide],
716
- [/^divide-(block|inline)-(.+)$/, handlerDivide],
717
- [/^divide-(block|inline)-reverse$/, ([, d]) => ({ [`--un-divide-${d}-reverse`]: 1 })],
718
- // color & opacity
719
- [/^divide-(.+)$/, colorResolver("border-color", "divide", "borderColor"), { autocomplete: "divide-$colors" }],
720
- [/^divide-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-divide-opacity": h.bracket.percent(opacity) }), { autocomplete: ["divide-(op|opacity)", "divide-(op|opacity)-<percent>"] }],
721
- // styles
722
- ...borderStyles.map((style) => [`divide-${style}`, { "border-style": style }])
723
- ];
724
- function handlerDivide([, d, s], { theme }) {
725
- let v = theme.lineWidth?.[s || "DEFAULT"] ?? h.bracket.cssvar.px(s || "1");
726
- if (v != null) {
727
- if (v === "0")
728
- v = "0px";
729
- const results = directionMap[d].map((item) => {
730
- const key = `border${item}-width`;
731
- const value = item.endsWith("right") || item.endsWith("bottom") ? `calc(${v} * var(--un-divide-${d}-reverse))` : `calc(${v} * calc(1 - var(--un-divide-${d}-reverse)))`;
732
- return [key, value];
733
- });
734
- if (results) {
735
- return [
736
- [`--un-divide-${d}-reverse`, 0],
737
- ...results
738
- ];
739
- }
740
- }
741
- }
742
-
743
- const lineClamps = [
744
- [/^line-clamp-(\d+)$/, ([, v]) => ({
745
- "overflow": "hidden",
746
- "display": "-webkit-box",
747
- "-webkit-box-orient": "vertical",
748
- "-webkit-line-clamp": v,
749
- "line-clamp": v
750
- }), { autocomplete: ["line-clamp", "line-clamp-<num>"] }],
751
- ...["none", ...globalKeywords].map((keyword) => [`line-clamp-${keyword}`, {
752
- "overflow": "visible",
753
- "display": "block",
754
- "-webkit-box-orient": "horizontal",
755
- "-webkit-line-clamp": keyword,
756
- "line-clamp": keyword
757
- }])
822
+ const touchActionProperty = "var(--un-pan-x) var(--un-pan-y) var(--un-pinch-zoom)";
823
+ const touchActions = [
824
+ [/^touch-pan-(x|left|right)$/, ([, d]) => ({
825
+ "--un-pan-x": `pan-${d}`,
826
+ "touch-action": touchActionProperty
827
+ }), { autocomplete: ["touch-pan", "touch-pan-(x|left|right|y|up|down)"] }],
828
+ [/^touch-pan-(y|up|down)$/, ([, d]) => ({
829
+ "--un-pan-y": `pan-${d}`,
830
+ "touch-action": touchActionProperty
831
+ })],
832
+ ["touch-pinch-zoom", {
833
+ "--un-pinch-zoom": "pinch-zoom",
834
+ "touch-action": touchActionProperty
835
+ }],
836
+ ["touch-auto", { "touch-action": "auto" }],
837
+ ["touch-manipulation", { "touch-action": "manipulation" }],
838
+ ["touch-none", { "touch-action": "none" }],
839
+ ...makeGlobalStaticRules("touch", "touch-action")
758
840
  ];
759
841
 
760
842
  const fontVariantNumericBase = {
@@ -782,79 +864,27 @@ const fontVariantNumeric = [
782
864
  ["normal-nums", { "font-variant-numeric": "normal" }]
783
865
  ];
784
866
 
785
- const touchActionBase = {
786
- "--un-pan-x": varEmpty,
787
- "--un-pan-y": varEmpty,
788
- "--un-pinch-zoom": varEmpty
789
- };
790
- const touchActionProperty = "var(--un-pan-x) var(--un-pan-y) var(--un-pinch-zoom)";
791
- const touchActions = [
792
- [/^touch-pan-(x|left|right)$/, ([, d]) => ({
793
- "--un-pan-x": `pan-${d}`,
794
- "touch-action": touchActionProperty
795
- }), { autocomplete: ["touch-pan", "touch-pan-(x|left|right|y|up|down)"] }],
796
- [/^touch-pan-(y|up|down)$/, ([, d]) => ({
797
- "--un-pan-y": `pan-${d}`,
798
- "touch-action": touchActionProperty
799
- })],
800
- ["touch-pinch-zoom", {
801
- "--un-pinch-zoom": "pinch-zoom",
802
- "touch-action": touchActionProperty
803
- }],
804
- ["touch-auto", { "touch-action": "auto" }],
805
- ["touch-manipulation", { "touch-action": "manipulation" }],
806
- ["touch-none", { "touch-action": "none" }],
807
- ...makeGlobalStaticRules("touch", "touch-action")
808
- ];
809
-
810
- const scrollSnapTypeBase = {
811
- "--un-scroll-snap-strictness": "proximity"
867
+ const variablesAbbrMap = {
868
+ "bg-blend": "background-blend-mode",
869
+ "bg-clip": "-webkit-background-clip",
870
+ "bg-gradient": "linear-gradient",
871
+ "bg-image": "background-image",
872
+ "bg-origin": "background-origin",
873
+ "bg-position": "background-position",
874
+ "bg-repeat": "background-repeat",
875
+ "bg-size": "background-size",
876
+ "mix-blend": "mix-blend-mode",
877
+ "object": "object-fit",
878
+ "object-position": "object-position",
879
+ "write": "writing-mode",
880
+ "write-orient": "text-orientation"
812
881
  };
813
- const scrolls = [
814
- // snap type
815
- [/^snap-(x|y)$/, ([, d]) => ({
816
- "scroll-snap-type": `${d} var(--un-scroll-snap-strictness)`
817
- }), { autocomplete: "snap-(x|y|both)" }],
818
- [/^snap-both$/, () => ({
819
- "scroll-snap-type": "both var(--un-scroll-snap-strictness)"
820
- })],
821
- ["snap-mandatory", { "--un-scroll-snap-strictness": "mandatory" }],
822
- ["snap-proximity", { "--un-scroll-snap-strictness": "proximity" }],
823
- ["snap-none", { "scroll-snap-type": "none" }],
824
- // snap align
825
- ["snap-start", { "scroll-snap-align": "start" }],
826
- ["snap-end", { "scroll-snap-align": "end" }],
827
- ["snap-center", { "scroll-snap-align": "center" }],
828
- ["snap-align-none", { "scroll-snap-align": "none" }],
829
- // snap stop
830
- ["snap-normal", { "scroll-snap-stop": "normal" }],
831
- ["snap-always", { "scroll-snap-stop": "always" }],
832
- // scroll margin
833
- [/^scroll-ma?()-?(.+)$/, directionSize("scroll-margin"), {
834
- autocomplete: [
835
- "scroll-(m|p|ma|pa|block|inline)",
836
- "scroll-(m|p|ma|pa|block|inline)-$spacing",
837
- "scroll-(m|p|ma|pa|block|inline)-(x|y|r|l|t|b|bs|be|is|ie)",
838
- "scroll-(m|p|ma|pa|block|inline)-(x|y|r|l|t|b|bs|be|is|ie)-$spacing"
839
- ]
840
- }],
841
- [/^scroll-m-?([xy])-?(.+)$/, directionSize("scroll-margin")],
842
- [/^scroll-m-?([rltb])-?(.+)$/, directionSize("scroll-margin")],
843
- [/^scroll-m-(block|inline)-(.+)$/, directionSize("scroll-margin")],
844
- [/^scroll-m-?([bi][se])-?(.+)$/, directionSize("scroll-margin")],
845
- // scroll padding
846
- [/^scroll-pa?()-?(.+)$/, directionSize("scroll-padding")],
847
- [/^scroll-p-?([xy])-?(.+)$/, directionSize("scroll-padding")],
848
- [/^scroll-p-?([rltb])-?(.+)$/, directionSize("scroll-padding")],
849
- [/^scroll-p-(block|inline)-(.+)$/, directionSize("scroll-padding")],
850
- [/^scroll-p-?([bi][se])-?(.+)$/, directionSize("scroll-padding")]
851
- ];
852
-
853
- const placeholders = [
854
- // The prefix `$ ` is intentional. This rule is not to be matched directly from user-generated token.
855
- // See variants/placeholder.
856
- [/^\$ placeholder-(.+)$/, colorResolver("color", "placeholder", "accentColor"), { autocomplete: "placeholder-$colors" }],
857
- [/^\$ placeholder-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-placeholder-opacity": h.bracket.percent(opacity) }), { autocomplete: ["placeholder-(op|opacity)", "placeholder-(op|opacity)-<percent>"] }]
882
+ const cssVariables = [
883
+ [/^(.+?)-(\$.+)$/, ([, name, varname]) => {
884
+ const prop = variablesAbbrMap[name];
885
+ if (prop)
886
+ return { [prop]: h.cssvar(varname) };
887
+ }]
858
888
  ];
859
889
 
860
890
  const viewTransition = [
@@ -1246,36 +1276,6 @@ function variants(options) {
1246
1276
  ];
1247
1277
  }
1248
1278
 
1249
- function important(option) {
1250
- if (option == null || option === false)
1251
- return [];
1252
- const wrapWithIs = (selector) => {
1253
- if (selector.startsWith(":is(") && selector.endsWith(")"))
1254
- return selector;
1255
- if (selector.includes("::"))
1256
- return selector.replace(/(.*?)(\s*::.*)/, ":is($1)$2");
1257
- return `:is(${selector})`;
1258
- };
1259
- return [
1260
- option === true ? (util) => {
1261
- util.entries.forEach((i) => {
1262
- if (i[1] != null && !String(i[1]).endsWith("!important"))
1263
- i[1] += " !important";
1264
- });
1265
- } : (util) => {
1266
- if (!util.selector.startsWith(option))
1267
- util.selector = `${option} ${wrapWithIs(util.selector)}`;
1268
- }
1269
- ];
1270
- }
1271
-
1272
- function postprocessors(options) {
1273
- return [
1274
- ...toArray(presetMini(options).postprocess),
1275
- ...important(options.important)
1276
- ];
1277
- }
1278
-
1279
1279
  const presetWind = definePreset((options = {}) => {
1280
1280
  options.important = options.important ?? false;
1281
1281
  return {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@unocss/preset-wind",
3
3
  "type": "module",
4
- "version": "0.62.3",
4
+ "version": "0.62.4",
5
5
  "description": "Tailwind / Windi CSS compact preset for UnoCSS",
6
6
  "author": "Anthony Fu <anthonyfu117@hotmail.com>",
7
7
  "license": "MIT",
@@ -35,9 +35,9 @@
35
35
  "dist"
36
36
  ],
37
37
  "dependencies": {
38
- "@unocss/preset-mini": "0.62.3",
39
- "@unocss/rule-utils": "0.62.3",
40
- "@unocss/core": "0.62.3"
38
+ "@unocss/core": "0.62.4",
39
+ "@unocss/preset-mini": "0.62.4",
40
+ "@unocss/rule-utils": "0.62.4"
41
41
  },
42
42
  "scripts": {
43
43
  "build": "unbuild",