@unocss/preset-wind 0.45.29 → 0.45.30

package/README.md

@@ -39,6 +39,28 @@ This preset uses `_` instead of `,` for respecting space in bracket syntax.
 
 since some CSS rules require `,` as parts of the value, e.g. `grid-cols-[repeat(3,auto)]`
 
+## Experimental Features
+
+This preset includes experimental feature that may be changed in breaking ways at any time.
+
+### Media Hover
+
+Media hover addresses the [sticky hover](https://css-tricks.com/solving-sticky-hover-states-with-media-hover-hover/) problem where tapping target that includes hover style on mobile will persist that hover style until tapping elsewhere.
+
+Since the regular `:hover` style most probably used so widely, the variant uses `@hover` syntax to distinguish it from the regular `hover` pseudo.
+
+Example: `@hover-text-red`
+
+Output:
+```css
+@media (hover: hover) and (pointer: fine) {
+  .\@hover-text-red:hover {
+    --un-text-opacity: 1;
+    color: rgba(248, 113, 113, var(--un-text-opacity));
+  }
+}
+```
+
 ## License
 
 MIT License © 2021-PRESENT [Anthony Fu](https://github.com/antfu)

package/dist/index.cjs

@@ -7,6 +7,7 @@ const utils = require('@unocss/preset-mini/utils');
 const rules$1 = require('@unocss/preset-mini/rules');
 const theme$1 = require('@unocss/preset-mini/theme');
 const variants$1 = require('@unocss/preset-mini/variants');
+const core = require('@unocss/core');
 
 const animations = [
   [/^(?:animate-)?keyframes-(.+)$/, ([, name], { theme }) => {
@@ -1077,6 +1078,16 @@ const variantColorsScheme = [
   utils.variantParentMatcher("@light", "@media (prefers-color-scheme: light)")
 ];
 
+const variantStickyHover = [
+  utils.variantMatcher("@hover", (input) => {
+    core.warnOnce("The @hover variant is experimental and may not follow semver.");
+    return {
+      parent: `${input.parent ? `${input.parent} $$ ` : ""}@media (hover: hover) and (pointer: fine)`,
+      selector: `${input.selector || ""}:hover`
+    };
+  })
+];
+
 const variantContrasts = [
   utils.variantParentMatcher("contrast-more", "@media (prefers-contrast: more)"),
   utils.variantParentMatcher("contrast-less", "@media (prefers-contrast: less)")
@@ -1127,7 +1138,8 @@ const variants = (options) => [
   ...variantOrientations,
   ...variantMotions,
   ...variantCombinators,
-  ...variantColorsScheme
+  ...variantColorsScheme,
+  ...variantStickyHover
 ];
 
 const presetWind = (options = {}) => {

package/dist/index.mjs

@@ -4,6 +4,7 @@ import { handler, globalKeywords, makeGlobalStaticRules, positionMap, parseColor
 import { varEmpty, borderStyles, handlerBorderStyle, 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, contentVisibility, contents, questionMark, transformBase, boxShadowsBase, ringBase } from '@unocss/preset-mini/rules';
 import { theme as theme$1 } from '@unocss/preset-mini/theme';
 import { variants as variants$1 } from '@unocss/preset-mini/variants';
+import { warnOnce } from '@unocss/core';
 
 const animations = [
   [/^(?:animate-)?keyframes-(.+)$/, ([, name], { theme }) => {
@@ -1074,6 +1075,16 @@ const variantColorsScheme = [
   variantParentMatcher("@light", "@media (prefers-color-scheme: light)")
 ];
 
+const variantStickyHover = [
+  variantMatcher("@hover", (input) => {
+    warnOnce("The @hover variant is experimental and may not follow semver.");
+    return {
+      parent: `${input.parent ? `${input.parent} $$ ` : ""}@media (hover: hover) and (pointer: fine)`,
+      selector: `${input.selector || ""}:hover`
+    };
+  })
+];
+
 const variantContrasts = [
   variantParentMatcher("contrast-more", "@media (prefers-contrast: more)"),
   variantParentMatcher("contrast-less", "@media (prefers-contrast: less)")
@@ -1124,7 +1135,8 @@ const variants = (options) => [
   ...variantOrientations,
   ...variantMotions,
   ...variantCombinators,
-  ...variantColorsScheme
+  ...variantColorsScheme,
+  ...variantStickyHover
 ];
 
 const presetWind = (options = {}) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unocss/preset-wind",
-  "version": "0.45.29",
+  "version": "0.45.30",
   "description": "Tailwind / Windi CSS compact preset for UnoCSS",
   "author": "Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -35,8 +35,8 @@
     "*.css"
   ],
   "dependencies": {
-    "@unocss/core": "0.45.29",
-    "@unocss/preset-mini": "0.45.29"
+    "@unocss/core": "0.45.30",
+    "@unocss/preset-mini": "0.45.30"
   },
   "scripts": {
     "build": "unbuild",