@unocss/preset-wind 0.35.4 → 0.36.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 (4) hide show
  1. package/dist/index.cjs +38 -61
  2. package/dist/index.d.ts +1 -1
  3. package/dist/index.mjs +38 -61
  4. package/package.json +3 -3
package/dist/index.cjs CHANGED
@@ -2,11 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
+ const presetMini = require('@unocss/preset-mini');
5
6
  const core = require('@unocss/core');
6
7
  const utils = require('@unocss/preset-mini/utils');
7
- const theme$1 = require('@unocss/preset-mini/theme');
8
- const presetMini = require('@unocss/preset-mini');
9
8
  const rules$1 = require('@unocss/preset-mini/rules');
9
+ const theme$1 = require('@unocss/preset-mini/theme');
10
10
  const variants$1 = require('@unocss/preset-mini/variants');
11
11
 
12
12
  const animations = [
@@ -297,8 +297,7 @@ const filterBase = {
297
297
  "--un-invert": rules$1.varEmpty,
298
298
  "--un-saturate": rules$1.varEmpty,
299
299
  "--un-sepia": rules$1.varEmpty,
300
- "--un-filter": "var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)",
301
- [core.CONTROL_SHORTCUT_NO_MERGE]: ""
300
+ "--un-filter": "var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)"
302
301
  };
303
302
  const backdropFilterBase = {
304
303
  "--un-backdrop-blur": rules$1.varEmpty,
@@ -310,8 +309,7 @@ const backdropFilterBase = {
310
309
  "--un-backdrop-opacity": rules$1.varEmpty,
311
310
  "--un-backdrop-saturate": rules$1.varEmpty,
312
311
  "--un-backdrop-sepia": rules$1.varEmpty,
313
- "--un-backdrop-filter": "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)",
314
- [core.CONTROL_SHORTCUT_NO_MERGE]: ""
312
+ "--un-backdrop-filter": "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)"
315
313
  };
316
314
  const percentWithDefault = (str) => {
317
315
  let v = utils.handler.bracket.cssvar(str || "");
@@ -325,22 +323,16 @@ const toFilter = (varName, resolver) => ([, b, s], { theme }) => {
325
323
  const value = resolver(s, theme) ?? (s === "none" ? "0" : "");
326
324
  if (value !== "") {
327
325
  if (b) {
328
- return [
329
- backdropFilterBase,
330
- {
331
- [`--un-${b}${varName}`]: `${varName}(${value})`,
332
- "-webkit-backdrop-filter": "var(--un-backdrop-filter)",
333
- "backdrop-filter": "var(--un-backdrop-filter)"
334
- }
335
- ];
326
+ return {
327
+ [`--un-${b}${varName}`]: `${varName}(${value})`,
328
+ "-webkit-backdrop-filter": "var(--un-backdrop-filter)",
329
+ "backdrop-filter": "var(--un-backdrop-filter)"
330
+ };
336
331
  } else {
337
- return [
338
- filterBase,
339
- {
340
- [`--un-${varName}`]: `${varName}(${value})`,
341
- filter: "var(--un-filter)"
342
- }
343
- ];
332
+ return {
333
+ [`--un-${varName}`]: `${varName}(${value})`,
334
+ filter: "var(--un-filter)"
335
+ };
344
336
  }
345
337
  }
346
338
  };
@@ -348,23 +340,17 @@ const dropShadowResolver = ([, s], { theme }) => {
348
340
  let v = theme.dropShadow?.[s || "DEFAULT"];
349
341
  if (v != null) {
350
342
  const shadows = utils.colorableShadows(v, "--un-drop-shadow-color");
351
- return [
352
- filterBase,
353
- {
354
- "--un-drop-shadow": `drop-shadow(${shadows.join(") drop-shadow(")})`,
355
- "filter": "var(--un-filter)"
356
- }
357
- ];
343
+ return {
344
+ "--un-drop-shadow": `drop-shadow(${shadows.join(") drop-shadow(")})`,
345
+ "filter": "var(--un-filter)"
346
+ };
358
347
  }
359
348
  v = utils.handler.bracket.cssvar(s);
360
349
  if (v != null) {
361
- return [
362
- filterBase,
363
- {
364
- "--un-drop-shadow": `drop-shadow(${v})`,
365
- "filter": "var(--un-filter)"
366
- }
367
- ];
350
+ return {
351
+ "--un-drop-shadow": `drop-shadow(${v})`,
352
+ "filter": "var(--un-filter)"
353
+ };
368
354
  }
369
355
  };
370
356
  const filters = [
@@ -390,33 +376,17 @@ const filters = [
390
376
  }],
391
377
  [/^(?:filter-)?drop-shadow-color-(.+)$/, utils.colorResolver("--un-drop-shadow-color", "drop-shadow")],
392
378
  [/^(?:filter-)?drop-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-drop-shadow-opacity": utils.handler.bracket.percent(opacity) })],
393
- [/^(?:(backdrop-)|filter-)?grayscale(?:-(.+))?$/, toFilter("grayscale", percentWithDefault), {
394
- autocomplete: ["(backdrop|filter)-grayscale", "(backdrop|filter)-grayscale-<percent>", "grayscale-<percent>"]
395
- }],
379
+ [/^(?:(backdrop-)|filter-)?grayscale(?:-(.+))?$/, toFilter("grayscale", percentWithDefault), { autocomplete: ["(backdrop|filter)-grayscale", "(backdrop|filter)-grayscale-<percent>", "grayscale-<percent>"] }],
396
380
  [/^(?:(backdrop-)|filter-)?hue-rotate-(.+)$/, toFilter("hue-rotate", (s) => utils.handler.bracket.cssvar.degree(s))],
397
- [/^(?:(backdrop-)|filter-)?invert(?:-(.+))?$/, toFilter("invert", percentWithDefault), {
398
- autocomplete: ["(backdrop|filter)-invert", "(backdrop|filter)-invert-<percent>", "invert-<percent>"]
381
+ [/^(?:(backdrop-)|filter-)?invert(?:-(.+))?$/, toFilter("invert", percentWithDefault), { autocomplete: ["(backdrop|filter)-invert", "(backdrop|filter)-invert-<percent>", "invert-<percent>"] }],
382
+ [/^(backdrop-)op(?:acity)-(.+)$/, toFilter("opacity", (s) => utils.handler.bracket.cssvar.percent(s)), { autocomplete: ["backdrop-(op|opacity)", "backdrop-(op|opacity)-<percent>"] }],
383
+ [/^(?:(backdrop-)|filter-)?saturate-(.+)$/, toFilter("saturate", (s) => utils.handler.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-saturate", "(backdrop|filter)-saturate-<percent>", "saturate-<percent>"] }],
384
+ [/^(?:(backdrop-)|filter-)?sepia(?:-(.+))?$/, toFilter("sepia", percentWithDefault), { autocomplete: ["(backdrop|filter)-sepia", "(backdrop|filter)-sepia-<percent>", "sepia-<percent>"] }],
385
+ ["filter", { filter: "var(--un-filter)" }],
386
+ ["backdrop-filter", {
387
+ "-webkit-backdrop-filter": "var(--un-backdrop-filter)",
388
+ "backdrop-filter": "var(--un-backdrop-filter)"
399
389
  }],
400
- [/^(backdrop-)op(?:acity)-(.+)$/, toFilter("opacity", (s) => utils.handler.bracket.cssvar.percent(s)), {
401
- autocomplete: ["backdrop-(op|opacity)", "backdrop-(op|opacity)-<percent>"]
402
- }],
403
- [/^(?:(backdrop-)|filter-)?saturate-(.+)$/, toFilter("saturate", (s) => utils.handler.bracket.cssvar.percent(s)), {
404
- autocomplete: ["(backdrop|filter)-saturate", "(backdrop|filter)-saturate-<percent>", "saturate-<percent>"]
405
- }],
406
- [/^(?:(backdrop-)|filter-)?sepia(?:-(.+))?$/, toFilter("sepia", percentWithDefault), {
407
- autocomplete: ["(backdrop|filter)-sepia", "(backdrop|filter)-sepia-<percent>", "sepia-<percent>"]
408
- }],
409
- [/^filter$/, () => [
410
- filterBase,
411
- { filter: "var(--un-filter)" }
412
- ]],
413
- [/^backdrop-filter$/, () => [
414
- backdropFilterBase,
415
- {
416
- "-webkit-backdrop-filter": "var(--un-backdrop-filter)",
417
- "backdrop-filter": "var(--un-backdrop-filter)"
418
- }
419
- ], { autocomplete: "backdrop-filter" }],
420
390
  ["filter-none", { filter: "none" }],
421
391
  ["backdrop-filter-none", {
422
392
  "-webkit-backdrop-filter": "none",
@@ -1015,6 +985,11 @@ const theme = {
1015
985
  pointer: "(hover) and (pointer: coarse)",
1016
986
  mouse: "(hover) and (pointer: fine)",
1017
987
  hd_color: "(dynamic-range: high)"
988
+ },
989
+ preflightBase: {
990
+ ...rules$1.transformBase,
991
+ ...filterBase,
992
+ ...backdropFilterBase
1018
993
  }
1019
994
  };
1020
995
 
@@ -1091,11 +1066,13 @@ const presetWind = (options = {}) => {
1091
1066
  rules,
1092
1067
  shortcuts,
1093
1068
  variants: variants(options),
1094
- options
1069
+ options,
1070
+ preflights: presetMini.preflights
1095
1071
  };
1096
1072
  };
1097
1073
 
1098
1074
  exports.colors = presetMini.colors;
1075
+ exports.preflights = presetMini.preflights;
1099
1076
  exports["default"] = presetWind;
1100
1077
  exports.presetWind = presetWind;
1101
1078
  exports.rules = rules;
package/dist/index.d.ts CHANGED
@@ -2,7 +2,7 @@ import * as _unocss_core from '@unocss/core';
2
2
  import { Rule, Variant, Preset } from '@unocss/core';
3
3
  import * as _unocss_preset_mini from '@unocss/preset-mini';
4
4
  import { Theme, PresetMiniOptions } from '@unocss/preset-mini';
5
- export { Theme, colors } from '@unocss/preset-mini';
5
+ export { Theme, colors, preflights } from '@unocss/preset-mini';
6
6
 
7
7
  declare const rules: Rule[];
8
8
 
package/dist/index.mjs CHANGED
@@ -1,8 +1,9 @@
1
+ import { preflights } from '@unocss/preset-mini';
2
+ export { colors, preflights } from '@unocss/preset-mini';
1
3
  import { toArray, CONTROL_SHORTCUT_NO_MERGE } from '@unocss/core';
2
4
  import { handler, positionMap, parseColor, colorToString, colorResolver, resolveBreakpoints, colorableShadows, directionMap, directionSize, variantMatcher, variantParentMatcher, hasParseableColor } from '@unocss/preset-mini/utils';
5
+ import { varEmpty, cssVariables as cssVariables$1, cssProperty, 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, contents, questionMark, transformBase } from '@unocss/preset-mini/rules';
3
6
  import { theme as theme$1 } from '@unocss/preset-mini/theme';
4
- export { colors } from '@unocss/preset-mini';
5
- import { varEmpty, cssVariables as cssVariables$1, cssProperty, 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, contents, questionMark } from '@unocss/preset-mini/rules';
6
7
  import { variants as variants$1 } from '@unocss/preset-mini/variants';
7
8
 
8
9
  const animations = [
@@ -293,8 +294,7 @@ const filterBase = {
293
294
  "--un-invert": varEmpty,
294
295
  "--un-saturate": varEmpty,
295
296
  "--un-sepia": varEmpty,
296
- "--un-filter": "var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)",
297
- [CONTROL_SHORTCUT_NO_MERGE]: ""
297
+ "--un-filter": "var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)"
298
298
  };
299
299
  const backdropFilterBase = {
300
300
  "--un-backdrop-blur": varEmpty,
@@ -306,8 +306,7 @@ const backdropFilterBase = {
306
306
  "--un-backdrop-opacity": varEmpty,
307
307
  "--un-backdrop-saturate": varEmpty,
308
308
  "--un-backdrop-sepia": varEmpty,
309
- "--un-backdrop-filter": "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)",
310
- [CONTROL_SHORTCUT_NO_MERGE]: ""
309
+ "--un-backdrop-filter": "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)"
311
310
  };
312
311
  const percentWithDefault = (str) => {
313
312
  let v = handler.bracket.cssvar(str || "");
@@ -321,22 +320,16 @@ const toFilter = (varName, resolver) => ([, b, s], { theme }) => {
321
320
  const value = resolver(s, theme) ?? (s === "none" ? "0" : "");
322
321
  if (value !== "") {
323
322
  if (b) {
324
- return [
325
- backdropFilterBase,
326
- {
327
- [`--un-${b}${varName}`]: `${varName}(${value})`,
328
- "-webkit-backdrop-filter": "var(--un-backdrop-filter)",
329
- "backdrop-filter": "var(--un-backdrop-filter)"
330
- }
331
- ];
323
+ return {
324
+ [`--un-${b}${varName}`]: `${varName}(${value})`,
325
+ "-webkit-backdrop-filter": "var(--un-backdrop-filter)",
326
+ "backdrop-filter": "var(--un-backdrop-filter)"
327
+ };
332
328
  } else {
333
- return [
334
- filterBase,
335
- {
336
- [`--un-${varName}`]: `${varName}(${value})`,
337
- filter: "var(--un-filter)"
338
- }
339
- ];
329
+ return {
330
+ [`--un-${varName}`]: `${varName}(${value})`,
331
+ filter: "var(--un-filter)"
332
+ };
340
333
  }
341
334
  }
342
335
  };
@@ -344,23 +337,17 @@ const dropShadowResolver = ([, s], { theme }) => {
344
337
  let v = theme.dropShadow?.[s || "DEFAULT"];
345
338
  if (v != null) {
346
339
  const shadows = colorableShadows(v, "--un-drop-shadow-color");
347
- return [
348
- filterBase,
349
- {
350
- "--un-drop-shadow": `drop-shadow(${shadows.join(") drop-shadow(")})`,
351
- "filter": "var(--un-filter)"
352
- }
353
- ];
340
+ return {
341
+ "--un-drop-shadow": `drop-shadow(${shadows.join(") drop-shadow(")})`,
342
+ "filter": "var(--un-filter)"
343
+ };
354
344
  }
355
345
  v = handler.bracket.cssvar(s);
356
346
  if (v != null) {
357
- return [
358
- filterBase,
359
- {
360
- "--un-drop-shadow": `drop-shadow(${v})`,
361
- "filter": "var(--un-filter)"
362
- }
363
- ];
347
+ return {
348
+ "--un-drop-shadow": `drop-shadow(${v})`,
349
+ "filter": "var(--un-filter)"
350
+ };
364
351
  }
365
352
  };
366
353
  const filters = [
@@ -386,33 +373,17 @@ const filters = [
386
373
  }],
387
374
  [/^(?:filter-)?drop-shadow-color-(.+)$/, colorResolver("--un-drop-shadow-color", "drop-shadow")],
388
375
  [/^(?:filter-)?drop-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-drop-shadow-opacity": handler.bracket.percent(opacity) })],
389
- [/^(?:(backdrop-)|filter-)?grayscale(?:-(.+))?$/, toFilter("grayscale", percentWithDefault), {
390
- autocomplete: ["(backdrop|filter)-grayscale", "(backdrop|filter)-grayscale-<percent>", "grayscale-<percent>"]
391
- }],
376
+ [/^(?:(backdrop-)|filter-)?grayscale(?:-(.+))?$/, toFilter("grayscale", percentWithDefault), { autocomplete: ["(backdrop|filter)-grayscale", "(backdrop|filter)-grayscale-<percent>", "grayscale-<percent>"] }],
392
377
  [/^(?:(backdrop-)|filter-)?hue-rotate-(.+)$/, toFilter("hue-rotate", (s) => handler.bracket.cssvar.degree(s))],
393
- [/^(?:(backdrop-)|filter-)?invert(?:-(.+))?$/, toFilter("invert", percentWithDefault), {
394
- autocomplete: ["(backdrop|filter)-invert", "(backdrop|filter)-invert-<percent>", "invert-<percent>"]
395
- }],
396
- [/^(backdrop-)op(?:acity)-(.+)$/, toFilter("opacity", (s) => handler.bracket.cssvar.percent(s)), {
397
- autocomplete: ["backdrop-(op|opacity)", "backdrop-(op|opacity)-<percent>"]
378
+ [/^(?:(backdrop-)|filter-)?invert(?:-(.+))?$/, toFilter("invert", percentWithDefault), { autocomplete: ["(backdrop|filter)-invert", "(backdrop|filter)-invert-<percent>", "invert-<percent>"] }],
379
+ [/^(backdrop-)op(?:acity)-(.+)$/, toFilter("opacity", (s) => handler.bracket.cssvar.percent(s)), { autocomplete: ["backdrop-(op|opacity)", "backdrop-(op|opacity)-<percent>"] }],
380
+ [/^(?:(backdrop-)|filter-)?saturate-(.+)$/, toFilter("saturate", (s) => handler.bracket.cssvar.percent(s)), { autocomplete: ["(backdrop|filter)-saturate", "(backdrop|filter)-saturate-<percent>", "saturate-<percent>"] }],
381
+ [/^(?:(backdrop-)|filter-)?sepia(?:-(.+))?$/, toFilter("sepia", percentWithDefault), { autocomplete: ["(backdrop|filter)-sepia", "(backdrop|filter)-sepia-<percent>", "sepia-<percent>"] }],
382
+ ["filter", { filter: "var(--un-filter)" }],
383
+ ["backdrop-filter", {
384
+ "-webkit-backdrop-filter": "var(--un-backdrop-filter)",
385
+ "backdrop-filter": "var(--un-backdrop-filter)"
398
386
  }],
399
- [/^(?:(backdrop-)|filter-)?saturate-(.+)$/, toFilter("saturate", (s) => handler.bracket.cssvar.percent(s)), {
400
- autocomplete: ["(backdrop|filter)-saturate", "(backdrop|filter)-saturate-<percent>", "saturate-<percent>"]
401
- }],
402
- [/^(?:(backdrop-)|filter-)?sepia(?:-(.+))?$/, toFilter("sepia", percentWithDefault), {
403
- autocomplete: ["(backdrop|filter)-sepia", "(backdrop|filter)-sepia-<percent>", "sepia-<percent>"]
404
- }],
405
- [/^filter$/, () => [
406
- filterBase,
407
- { filter: "var(--un-filter)" }
408
- ]],
409
- [/^backdrop-filter$/, () => [
410
- backdropFilterBase,
411
- {
412
- "-webkit-backdrop-filter": "var(--un-backdrop-filter)",
413
- "backdrop-filter": "var(--un-backdrop-filter)"
414
- }
415
- ], { autocomplete: "backdrop-filter" }],
416
387
  ["filter-none", { filter: "none" }],
417
388
  ["backdrop-filter-none", {
418
389
  "-webkit-backdrop-filter": "none",
@@ -1011,6 +982,11 @@ const theme = {
1011
982
  pointer: "(hover) and (pointer: coarse)",
1012
983
  mouse: "(hover) and (pointer: fine)",
1013
984
  hd_color: "(dynamic-range: high)"
985
+ },
986
+ preflightBase: {
987
+ ...transformBase,
988
+ ...filterBase,
989
+ ...backdropFilterBase
1014
990
  }
1015
991
  };
1016
992
 
@@ -1087,7 +1063,8 @@ const presetWind = (options = {}) => {
1087
1063
  rules,
1088
1064
  shortcuts,
1089
1065
  variants: variants(options),
1090
- options
1066
+ options,
1067
+ preflights
1091
1068
  };
1092
1069
  };
1093
1070
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@unocss/preset-wind",
3
- "version": "0.35.4",
3
+ "version": "0.36.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.35.4",
39
- "@unocss/preset-mini": "0.35.4"
38
+ "@unocss/core": "0.36.0",
39
+ "@unocss/preset-mini": "0.36.0"
40
40
  },
41
41
  "scripts": {
42
42
  "build": "unbuild",