@unocss/preset-wind 0.50.7 → 0.51.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.cjs +23 -25
  2. package/dist/index.mjs +25 -27
  3. package/package.json +3 -3
package/dist/index.cjs CHANGED
@@ -92,8 +92,8 @@ function bgGradientColorValue(mode, cssColor, color, alpha) {
92
92
  }
93
93
  return utils.colorToString(color, alpha);
94
94
  }
95
- function bgGradientColorResolver(mode) {
96
- return ([, body], { theme }) => {
95
+ function bgGradientColorResolver() {
96
+ return ([, mode, body], { theme }) => {
97
97
  const data = utils.parseColor(body, theme);
98
98
  if (!data)
99
99
  return;
@@ -104,22 +104,32 @@ function bgGradientColorResolver(mode) {
104
104
  switch (mode) {
105
105
  case "from":
106
106
  return {
107
- "--un-gradient-from": colorString,
108
- "--un-gradient-to": bgGradientToValue(cssColor),
107
+ "--un-gradient-from-position": "0%",
108
+ "--un-gradient-from": `${colorString} var(--un-gradient-from-position)`,
109
+ "--un-gradient-to": `${bgGradientToValue(cssColor)} var(--un-gradient-to-position)`,
109
110
  "--un-gradient-stops": "var(--un-gradient-from), var(--un-gradient-to)"
110
111
  };
111
112
  case "via":
112
113
  return {
114
+ "--un-gradient-via-position": "50%",
113
115
  "--un-gradient-to": bgGradientToValue(cssColor),
114
- "--un-gradient-stops": `var(--un-gradient-from), ${colorString}, var(--un-gradient-to)`
116
+ "--un-gradient-stops": `var(--un-gradient-from), ${colorString} var(--un-gradient-via-position), var(--un-gradient-to)`
115
117
  };
116
118
  case "to":
117
119
  return {
118
- "--un-gradient-to": colorString
120
+ "--un-gradient-to-position": "100%",
121
+ "--un-gradient-to": `${colorString} var(--un-gradient-to-position)`
119
122
  };
120
123
  }
121
124
  };
122
125
  }
126
+ function bgGradientPositionResolver() {
127
+ return ([, mode, body]) => {
128
+ return {
129
+ [`--un-gradient-${mode}-position`]: `${Number(utils.handler.bracket.cssvar.percent(body)) * 100}%`
130
+ };
131
+ };
132
+ }
123
133
  const bgUrlRE = /^\[url\(.+\)\]$/;
124
134
  const bgLengthRE = /^\[length:.+\]$/;
125
135
  const bgPositionRE = /^\[position:.+\]$/;
@@ -136,12 +146,9 @@ const backgroundStyles = [
136
146
  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>"]
137
147
  }],
138
148
  [/^(?:bg-gradient-)?stops-(\[.+\])$/, ([, s]) => ({ "--un-gradient-stops": utils.handler.bracket(s) })],
139
- [/^(?:bg-gradient-)?from-(.+)$/, bgGradientColorResolver("from")],
140
- [/^(?:bg-gradient-)?via-(.+)$/, bgGradientColorResolver("via")],
141
- [/^(?:bg-gradient-)?to-(.+)$/, bgGradientColorResolver("to")],
142
- [/^(?:bg-gradient-)?from-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-from-opacity": utils.handler.bracket.percent(opacity) })],
143
- [/^(?:bg-gradient-)?via-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-via-opacity": utils.handler.bracket.percent(opacity) })],
144
- [/^(?:bg-gradient-)?to-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-to-opacity": utils.handler.bracket.percent(opacity) })],
149
+ [/^(?:bg-gradient-)?(from|via|to)-(.+)$/, bgGradientColorResolver()],
150
+ [/^(?:bg-gradient-)?(from|via|to)-op(?:acity)?-?(.+)$/, ([, position, opacity]) => ({ [`--un-${position}-opacity`]: utils.handler.bracket.percent(opacity) })],
151
+ [/^(from|via|to)-([\d\.]+)%$/, bgGradientPositionResolver()],
145
152
  [/^bg-gradient-((?:repeating-)?(?:linear|radial|conic))$/, ([, s]) => ({
146
153
  "background-image": `${s}-gradient(var(--un-gradient, var(--un-gradient-stops, rgba(255, 255, 255, 0))))`
147
154
  }), { autocomplete: ["bg-gradient-repeating", "bg-gradient-(linear|radial|conic)", "bg-gradient-repeating-(linear|radial|conic)"] }],
@@ -696,12 +703,10 @@ function handlerDivide([, d, s], { theme }) {
696
703
  const value = item.endsWith("right") || item.endsWith("bottom") ? `calc(${v} * var(--un-divide-${d}-reverse))` : `calc(${v} * calc(1 - var(--un-divide-${d}-reverse)))`;
697
704
  return [key, value];
698
705
  });
699
- const borderStyle = rules$1.handlerBorderStyle(["", d, "solid"]);
700
- if (results && borderStyle) {
706
+ if (results) {
701
707
  return [
702
708
  [`--un-divide-${d}-reverse`, 0],
703
- ...results,
704
- ...borderStyle
709
+ ...results
705
710
  ];
706
711
  }
707
712
  }
@@ -1195,20 +1200,13 @@ function variants(options) {
1195
1200
  }
1196
1201
 
1197
1202
  function presetWind(options = {}) {
1198
- options.dark = options.dark ?? "class";
1199
- options.attributifyPseudo = options.attributifyPseudo ?? false;
1200
- options.preflight = options.preflight ?? true;
1201
- options.variablePrefix = options.variablePrefix ?? "un-";
1202
1203
  return {
1204
+ ...presetMini.presetMini(options),
1203
1205
  name: "@unocss/preset-wind",
1204
1206
  theme,
1205
1207
  rules,
1206
1208
  shortcuts,
1207
- variants: variants(options),
1208
- options,
1209
- postprocess: presetMini.VarPrefixPostprocessor(options.variablePrefix),
1210
- preflights: options.preflight ? presetMini.normalizePreflights(presetMini.preflights, options.variablePrefix) : [],
1211
- prefix: options.prefix
1209
+ variants: variants(options)
1212
1210
  };
1213
1211
  }
1214
1212
 
package/dist/index.mjs CHANGED
@@ -1,8 +1,8 @@
1
- import { VarPrefixPostprocessor, normalizePreflights, preflights } from '@unocss/preset-mini';
1
+ import { presetMini } from '@unocss/preset-mini';
2
2
  export { colors, preflights } from '@unocss/preset-mini';
3
3
  import { handler, 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
- import { varEmpty, borderStyles, handlerBorderStyle, cssVariables as cssVariables$1, cssProperty, contains, pointerEvents, appearances, positions, insets, zIndexes, orders, grids, floats, margins, boxSizing, displays, aspectRatio, sizes, flex, transforms, cursors, userSelects, resizes, appearance, placements, alignments, justifies, gaps, overflows, textOverflows, whitespaces, breaks, borders, bgColors, svgUtilities, paddings, textAligns, textIndents, verticalAligns, fonts, textTransforms as textTransforms$1, fontStyles, textColors, textDecorations, fontSmoothings, tabSizes, textStrokes, textShadows, opacity, boxShadows, outline, rings, transitions, willChange, contentVisibility, contents, containerParent, questionMark, transformBase, boxShadowsBase, ringBase } from '@unocss/preset-mini/rules';
5
+ import { varEmpty, borderStyles, cssVariables as cssVariables$1, cssProperty, contains, pointerEvents, appearances, positions, insets, zIndexes, orders, grids, floats, margins, boxSizing, displays, aspectRatio, sizes, flex, transforms, cursors, userSelects, resizes, appearance, placements, alignments, justifies, gaps, overflows, textOverflows, whitespaces, breaks, borders, bgColors, svgUtilities, paddings, textAligns, textIndents, verticalAligns, fonts, textTransforms as textTransforms$1, fontStyles, textColors, textDecorations, fontSmoothings, tabSizes, textStrokes, textShadows, opacity, boxShadows, outline, rings, transitions, willChange, contentVisibility, contents, containerParent, questionMark, transformBase, boxShadowsBase, ringBase } from '@unocss/preset-mini/rules';
6
6
  import { theme as theme$1 } from '@unocss/preset-mini/theme';
7
7
  import { variants as variants$1 } from '@unocss/preset-mini/variants';
8
8
 
@@ -89,8 +89,8 @@ function bgGradientColorValue(mode, cssColor, color, alpha) {
89
89
  }
90
90
  return colorToString(color, alpha);
91
91
  }
92
- function bgGradientColorResolver(mode) {
93
- return ([, body], { theme }) => {
92
+ function bgGradientColorResolver() {
93
+ return ([, mode, body], { theme }) => {
94
94
  const data = parseColor(body, theme);
95
95
  if (!data)
96
96
  return;
@@ -101,22 +101,32 @@ function bgGradientColorResolver(mode) {
101
101
  switch (mode) {
102
102
  case "from":
103
103
  return {
104
- "--un-gradient-from": colorString,
105
- "--un-gradient-to": bgGradientToValue(cssColor),
104
+ "--un-gradient-from-position": "0%",
105
+ "--un-gradient-from": `${colorString} var(--un-gradient-from-position)`,
106
+ "--un-gradient-to": `${bgGradientToValue(cssColor)} var(--un-gradient-to-position)`,
106
107
  "--un-gradient-stops": "var(--un-gradient-from), var(--un-gradient-to)"
107
108
  };
108
109
  case "via":
109
110
  return {
111
+ "--un-gradient-via-position": "50%",
110
112
  "--un-gradient-to": bgGradientToValue(cssColor),
111
- "--un-gradient-stops": `var(--un-gradient-from), ${colorString}, var(--un-gradient-to)`
113
+ "--un-gradient-stops": `var(--un-gradient-from), ${colorString} var(--un-gradient-via-position), var(--un-gradient-to)`
112
114
  };
113
115
  case "to":
114
116
  return {
115
- "--un-gradient-to": colorString
117
+ "--un-gradient-to-position": "100%",
118
+ "--un-gradient-to": `${colorString} var(--un-gradient-to-position)`
116
119
  };
117
120
  }
118
121
  };
119
122
  }
123
+ function bgGradientPositionResolver() {
124
+ return ([, mode, body]) => {
125
+ return {
126
+ [`--un-gradient-${mode}-position`]: `${Number(handler.bracket.cssvar.percent(body)) * 100}%`
127
+ };
128
+ };
129
+ }
120
130
  const bgUrlRE = /^\[url\(.+\)\]$/;
121
131
  const bgLengthRE = /^\[length:.+\]$/;
122
132
  const bgPositionRE = /^\[position:.+\]$/;
@@ -133,12 +143,9 @@ const backgroundStyles = [
133
143
  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>"]
134
144
  }],
135
145
  [/^(?:bg-gradient-)?stops-(\[.+\])$/, ([, s]) => ({ "--un-gradient-stops": handler.bracket(s) })],
136
- [/^(?:bg-gradient-)?from-(.+)$/, bgGradientColorResolver("from")],
137
- [/^(?:bg-gradient-)?via-(.+)$/, bgGradientColorResolver("via")],
138
- [/^(?:bg-gradient-)?to-(.+)$/, bgGradientColorResolver("to")],
139
- [/^(?:bg-gradient-)?from-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-from-opacity": handler.bracket.percent(opacity) })],
140
- [/^(?:bg-gradient-)?via-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-via-opacity": handler.bracket.percent(opacity) })],
141
- [/^(?:bg-gradient-)?to-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-to-opacity": handler.bracket.percent(opacity) })],
146
+ [/^(?:bg-gradient-)?(from|via|to)-(.+)$/, bgGradientColorResolver()],
147
+ [/^(?:bg-gradient-)?(from|via|to)-op(?:acity)?-?(.+)$/, ([, position, opacity]) => ({ [`--un-${position}-opacity`]: handler.bracket.percent(opacity) })],
148
+ [/^(from|via|to)-([\d\.]+)%$/, bgGradientPositionResolver()],
142
149
  [/^bg-gradient-((?:repeating-)?(?:linear|radial|conic))$/, ([, s]) => ({
143
150
  "background-image": `${s}-gradient(var(--un-gradient, var(--un-gradient-stops, rgba(255, 255, 255, 0))))`
144
151
  }), { autocomplete: ["bg-gradient-repeating", "bg-gradient-(linear|radial|conic)", "bg-gradient-repeating-(linear|radial|conic)"] }],
@@ -693,12 +700,10 @@ function handlerDivide([, d, s], { theme }) {
693
700
  const value = item.endsWith("right") || item.endsWith("bottom") ? `calc(${v} * var(--un-divide-${d}-reverse))` : `calc(${v} * calc(1 - var(--un-divide-${d}-reverse)))`;
694
701
  return [key, value];
695
702
  });
696
- const borderStyle = handlerBorderStyle(["", d, "solid"]);
697
- if (results && borderStyle) {
703
+ if (results) {
698
704
  return [
699
705
  [`--un-divide-${d}-reverse`, 0],
700
- ...results,
701
- ...borderStyle
706
+ ...results
702
707
  ];
703
708
  }
704
709
  }
@@ -1192,20 +1197,13 @@ function variants(options) {
1192
1197
  }
1193
1198
 
1194
1199
  function presetWind(options = {}) {
1195
- options.dark = options.dark ?? "class";
1196
- options.attributifyPseudo = options.attributifyPseudo ?? false;
1197
- options.preflight = options.preflight ?? true;
1198
- options.variablePrefix = options.variablePrefix ?? "un-";
1199
1200
  return {
1201
+ ...presetMini(options),
1200
1202
  name: "@unocss/preset-wind",
1201
1203
  theme,
1202
1204
  rules,
1203
1205
  shortcuts,
1204
- variants: variants(options),
1205
- options,
1206
- postprocess: VarPrefixPostprocessor(options.variablePrefix),
1207
- preflights: options.preflight ? normalizePreflights(preflights, options.variablePrefix) : [],
1208
- prefix: options.prefix
1206
+ variants: variants(options)
1209
1207
  };
1210
1208
  }
1211
1209
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@unocss/preset-wind",
3
- "version": "0.50.7",
3
+ "version": "0.51.0",
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.50.7",
39
- "@unocss/preset-mini": "0.50.7"
38
+ "@unocss/core": "0.51.0",
39
+ "@unocss/preset-mini": "0.51.0"
40
40
  },
41
41
  "scripts": {
42
42
  "build": "unbuild",