@unocss/preset-uno 0.4.15 → 0.6.0

package/dist/{chunk-EI7OPLC7.mjs → chunk-K5WMT3AD.mjs}

@@ -50,7 +50,7 @@ var transitionSizeProps = [
   "letter-spacing",
   "word-spacing"
 ];
-var transitionSwtichProps = ["all", "none"];
+var transitionSwitchProps = ["all", "none"];
 var transitionEnhanceProps = ["stroke", "filter", "backdrop-filter", "fill", "mask", "mask-size", "mask-border", "clip-path", "clip"];
 var transitionProps = [
   ...transitionBasicProps,
@@ -60,7 +60,7 @@ var transitionProps = [
 ];
 var transitionPropsStr = transitionProps.join(", ");
 var validateProperty = (prop) => {
-  if (prop && ![...transitionProps, ...transitionSwtichProps].includes(prop))
+  if (prop && ![...transitionProps, ...transitionSwitchProps].includes(prop))
     return;
   return prop || transitionPropsStr;
 };
@@ -132,6 +132,7 @@ var xyzMap = {
 var handlers_exports = {};
 __export(handlers_exports, {
   bracket: () => bracket,
+  cssvar: () => cssvar,
   fraction: () => fraction,
   number: () => number,
   percent: () => percent,
@@ -188,6 +189,10 @@ function bracket(str) {
   if (str[0] === "[" && str[str.length - 1] === "]")
     return str.slice(1, -1);
 }
+function cssvar(str) {
+  if (str.startsWith("$"))
+    return `var(--${str.slice(1)})`;
+}
 
 // src/utils/handlers/shorthand.ts
 var handlersNames = Object.keys(handlers_exports);
@@ -276,11 +281,11 @@ var colorResolver = (attribute, varName) => ([, body], { theme }) => {
   }
 };
 var opacity = [
-  [/^op(?:acity)?-?(.+)$/, ([, d]) => ({ opacity: handler.bracket.percent(d) })]
+  [/^op(?:acity)?-?(.+)$/, ([, d]) => ({ opacity: handler.bracket.percent.cssvar(d) })]
 ];
 var textColors = [
   [/^(?:text|color|c)-(.+)$/, colorResolver("color", "text")],
-  [/^(?:text|color|c)-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-text-opacity": handler.bracket.percent(opacity2) })]
+  [/^(?:text|color|c)-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-text-opacity": handler.bracket.percent.cssvar(opacity2) })]
 ];
 var textDecorationColors = [
   [/^underline-(.+)$/, (match, ctx) => {
@@ -786,7 +791,7 @@ var placeItems = basicSet.map((i) => [`place-items-${i}`, { "place-items": i }])
 var placeSelfs = basicSet.map((i) => [`place-self-${i}`, { "place-self": i }]);
 function handleInsetValue(v) {
   var _a;
-  return (_a = { auto: "auto", full: "100%" }[v]) != null ? _a : handler.bracket.fraction.rem(v);
+  return (_a = { auto: "auto", full: "100%" }[v]) != null ? _a : handler.bracket.fraction.cssvar.rem(v);
 }
 var insets = [
   [/^(top|left|right|bottom|inset)-(.+)$/, ([, d, v]) => ({ [d]: handleInsetValue(v) })],
@@ -918,17 +923,28 @@ var sizes = [
   ["h-full", { height: "100%" }],
   ["w-screen", { width: "100vw" }],
   ["h-screen", { height: "100vh" }],
-  [/^w-([^-]+)$/, ([, s]) => ({ width: handler.bracket.fraction.rem(s) })],
-  [/^h-([^-]+)$/, ([, s]) => ({ height: handler.bracket.fraction.rem(s) })],
-  [/^max-w-([^-]+)$/, ([, s]) => ({ "max-width": handler.bracket.fraction.rem(s) })],
-  [/^max-h-([^-]+)$/, ([, s]) => ({ "max-height": handler.bracket.fraction.rem(s) })],
-  [/^max-w-screen-([a-z]+)$/, ([, s], { theme }) => {
+  ["max-w-full", { "max-height": "100%" }],
+  ["min-h-full", { "min-height": "100%" }],
+  ["max-w-screnn", { "max-height": "100vw" }],
+  ["min-h-screen", { "min-height": "100vh" }],
+  [/^(((min|max)-)?(w|h))-([^-]+)$/, ([, , , m, w, s]) => ({ [getPropName(m, w)]: handler.bracket.fraction.rem(s) })],
+  [/^(((min|max)-)?(w))-screen-([a-z]+)$/, ([, , , m, w, s], { theme }) => {
     var _a;
     const v = (_a = theme.breakpoints) == null ? void 0 : _a[s];
     if (v != null)
-      return { "max-width": v };
+      return { [getPropName(m, w)]: v };
   }]
 ];
+function getPropName(minmax, hw) {
+  var _a;
+  const minMaxMap = {
+    w: "width",
+    h: "height",
+    min: "min-",
+    max: "max-"
+  };
+  return `${(_a = minMaxMap[minmax]) != null ? _a : ""}${minMaxMap[hw]}`;
+}
 
 // src/rules/spacing.ts
 var directionSize = (prefix) => ([_, direction, size]) => {
@@ -1170,6 +1186,60 @@ function handleRotate([, b]) {
 }
 
 // src/rules/behaviors.ts
+var outlineStyle = [
+  "none",
+  "auto",
+  "dotted",
+  "dashed",
+  "solid",
+  "double",
+  "groove",
+  "ridge",
+  "inset",
+  "outset",
+  "inherit",
+  "initial",
+  "revert",
+  "unset"
+];
+var parseOutlineSize = (s) => {
+  const propName = ["width", "offset"].find((item) => s.startsWith(item)) || "width";
+  const size = handler.bracket.fraction.rem(s.replace(/^(offset\-|width\-)/, ""));
+  if (size) {
+    return {
+      [`outline-${propName}`]: size
+    };
+  }
+};
+var outline = [
+  ["outline", { "outline-style": "solid" }],
+  [
+    /^outline-(.+)$/,
+    (match, config) => {
+      const [, d] = match;
+      if (d === "none") {
+        return {
+          "outline": "2px solid transparent",
+          "outline-offset": "2px"
+        };
+      }
+      if (outlineStyle.includes(d)) {
+        return {
+          "outline-style": d
+        };
+      }
+      const sizeSheet = parseOutlineSize(d);
+      if (sizeSheet)
+        return sizeSheet;
+      const colorSheet = colorResolver("outline-color", "outline-color")([
+        match[0],
+        match[1].replace(/^color-/, "")
+      ], config);
+      if (colorSheet)
+        return colorSheet;
+    }
+  ]
+];
 var listStyleProps = [
   "none",
   "disc",
@@ -1275,7 +1345,7 @@ ${constructCSS({ animation: `${name} 1s linear infinite` })}`;
 
 // src/rules/variables.ts
 var variablesAbbrMap = {
-  "w": "with",
+  "w": "width",
   "h": "height",
   "max-w": "max-width",
   "max-h": "max-height",
@@ -1300,7 +1370,7 @@ var variablesAbbrMap = {
   "bg-position": "background-position",
   "bg-repeat": "background-repeat",
   "bg-size": "background-size",
-  "border-opacity": "background-opacity",
+  "bg-opacity": "background-opacity",
   "tab": "tab-size",
   "underline": "text-decoration-thickness",
   "underline-offset": "text-underline-offset",
@@ -1330,6 +1400,18 @@ var cssVariables = [[
   }
 ]];
 
+// src/rules/question-mark.ts
+var questionMark = [
+  [
+    /^(\?)$/,
+    (_, { constructCSS, generator }) => {
+      if (generator.config.envMode === "dev")
+        return `@keyframes __un_qm {0% {box-shadow: inset 4px 4px #ff1e90, inset -4px -4px #ff1e90;} 100% {box-shadow: inset 8px 8px #3399ff, inset -8px -8px #3399ff;}}
+${constructCSS({ animation: "__un_qm 0.5s ease-in-out alternate infinite" })}`;
+    }
+  ]
+];
+
 // src/rules/index.ts
 var rules = [
   cssVariables,
@@ -1388,6 +1470,7 @@ var rules = [
   caretOpacity,
   imageRenderings,
   appearance,
+  outline,
   placeholder,
   overscrolls,
   breaks,
@@ -1414,7 +1497,8 @@ var rules = [
   transitions,
   filters,
   tables,
-  transforms
+  transforms,
+  questionMark
 ].flat(1);
 
 export {

package/dist/{chunk-XMP675O2.js → chunk-KHFQBJ3G.js}

@@ -50,7 +50,7 @@ var transitionSizeProps = [
   "letter-spacing",
   "word-spacing"
 ];
-var transitionSwtichProps = ["all", "none"];
+var transitionSwitchProps = ["all", "none"];
 var transitionEnhanceProps = ["stroke", "filter", "backdrop-filter", "fill", "mask", "mask-size", "mask-border", "clip-path", "clip"];
 var transitionProps = [
   ...transitionBasicProps,
@@ -60,7 +60,7 @@ var transitionProps = [
 ];
 var transitionPropsStr = transitionProps.join(", ");
 var validateProperty = (prop) => {
-  if (prop && ![...transitionProps, ...transitionSwtichProps].includes(prop))
+  if (prop && ![...transitionProps, ...transitionSwitchProps].includes(prop))
     return;
   return prop || transitionPropsStr;
 };
@@ -132,6 +132,7 @@ var xyzMap = {
 var handlers_exports = {};
 _chunkOFR2H3GIjs.__export.call(void 0, handlers_exports, {
   bracket: () => bracket,
+  cssvar: () => cssvar,
   fraction: () => fraction,
   number: () => number,
   percent: () => percent,
@@ -188,6 +189,10 @@ function bracket(str) {
   if (str[0] === "[" && str[str.length - 1] === "]")
     return str.slice(1, -1);
 }
+function cssvar(str) {
+  if (str.startsWith("$"))
+    return `var(--${str.slice(1)})`;
+}
 
 // src/utils/handlers/shorthand.ts
 var handlersNames = Object.keys(handlers_exports);
@@ -276,11 +281,11 @@ var colorResolver = (attribute, varName) => ([, body], { theme }) => {
   }
 };
 var opacity = [
-  [/^op(?:acity)?-?(.+)$/, ([, d]) => ({ opacity: handler.bracket.percent(d) })]
+  [/^op(?:acity)?-?(.+)$/, ([, d]) => ({ opacity: handler.bracket.percent.cssvar(d) })]
 ];
 var textColors = [
   [/^(?:text|color|c)-(.+)$/, colorResolver("color", "text")],
-  [/^(?:text|color|c)-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-text-opacity": handler.bracket.percent(opacity2) })]
+  [/^(?:text|color|c)-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-text-opacity": handler.bracket.percent.cssvar(opacity2) })]
 ];
 var textDecorationColors = [
   [/^underline-(.+)$/, (match, ctx) => {
@@ -786,7 +791,7 @@ var placeItems = basicSet.map((i) => [`place-items-${i}`, { "place-items": i }])
 var placeSelfs = basicSet.map((i) => [`place-self-${i}`, { "place-self": i }]);
 function handleInsetValue(v) {
   var _a;
-  return (_a = { auto: "auto", full: "100%" }[v]) != null ? _a : handler.bracket.fraction.rem(v);
+  return (_a = { auto: "auto", full: "100%" }[v]) != null ? _a : handler.bracket.fraction.cssvar.rem(v);
 }
 var insets = [
   [/^(top|left|right|bottom|inset)-(.+)$/, ([, d, v]) => ({ [d]: handleInsetValue(v) })],
@@ -918,17 +923,28 @@ var sizes = [
   ["h-full", { height: "100%" }],
   ["w-screen", { width: "100vw" }],
   ["h-screen", { height: "100vh" }],
-  [/^w-([^-]+)$/, ([, s]) => ({ width: handler.bracket.fraction.rem(s) })],
-  [/^h-([^-]+)$/, ([, s]) => ({ height: handler.bracket.fraction.rem(s) })],
-  [/^max-w-([^-]+)$/, ([, s]) => ({ "max-width": handler.bracket.fraction.rem(s) })],
-  [/^max-h-([^-]+)$/, ([, s]) => ({ "max-height": handler.bracket.fraction.rem(s) })],
-  [/^max-w-screen-([a-z]+)$/, ([, s], { theme }) => {
+  ["max-w-full", { "max-height": "100%" }],
+  ["min-h-full", { "min-height": "100%" }],
+  ["max-w-screnn", { "max-height": "100vw" }],
+  ["min-h-screen", { "min-height": "100vh" }],
+  [/^(((min|max)-)?(w|h))-([^-]+)$/, ([, , , m, w, s]) => ({ [getPropName(m, w)]: handler.bracket.fraction.rem(s) })],
+  [/^(((min|max)-)?(w))-screen-([a-z]+)$/, ([, , , m, w, s], { theme }) => {
     var _a;
     const v = (_a = theme.breakpoints) == null ? void 0 : _a[s];
     if (v != null)
-      return { "max-width": v };
+      return { [getPropName(m, w)]: v };
   }]
 ];
+function getPropName(minmax, hw) {
+  var _a;
+  const minMaxMap = {
+    w: "width",
+    h: "height",
+    min: "min-",
+    max: "max-"
+  };
+  return `${(_a = minMaxMap[minmax]) != null ? _a : ""}${minMaxMap[hw]}`;
+}
 
 // src/rules/spacing.ts
 var directionSize = (prefix) => ([_, direction, size]) => {
@@ -1170,6 +1186,60 @@ function handleRotate([, b]) {
 }
 
 // src/rules/behaviors.ts
+var outlineStyle = [
+  "none",
+  "auto",
+  "dotted",
+  "dashed",
+  "solid",
+  "double",
+  "groove",
+  "ridge",
+  "inset",
+  "outset",
+  "inherit",
+  "initial",
+  "revert",
+  "unset"
+];
+var parseOutlineSize = (s) => {
+  const propName = ["width", "offset"].find((item) => s.startsWith(item)) || "width";
+  const size = handler.bracket.fraction.rem(s.replace(/^(offset\-|width\-)/, ""));
+  if (size) {
+    return {
+      [`outline-${propName}`]: size
+    };
+  }
+};
+var outline = [
+  ["outline", { "outline-style": "solid" }],
+  [
+    /^outline-(.+)$/,
+    (match, config) => {
+      const [, d] = match;
+      if (d === "none") {
+        return {
+          "outline": "2px solid transparent",
+          "outline-offset": "2px"
+        };
+      }
+      if (outlineStyle.includes(d)) {
+        return {
+          "outline-style": d
+        };
+      }
+      const sizeSheet = parseOutlineSize(d);
+      if (sizeSheet)
+        return sizeSheet;
+      const colorSheet = colorResolver("outline-color", "outline-color")([
+        match[0],
+        match[1].replace(/^color-/, "")
+      ], config);
+      if (colorSheet)
+        return colorSheet;
+    }
+  ]
+];
 var listStyleProps = [
   "none",
   "disc",
@@ -1275,7 +1345,7 @@ ${constructCSS({ animation: `${name} 1s linear infinite` })}`;
 
 // src/rules/variables.ts
 var variablesAbbrMap = {
-  "w": "with",
+  "w": "width",
   "h": "height",
   "max-w": "max-width",
   "max-h": "max-height",
@@ -1300,7 +1370,7 @@ var variablesAbbrMap = {
   "bg-position": "background-position",
   "bg-repeat": "background-repeat",
   "bg-size": "background-size",
-  "border-opacity": "background-opacity",
+  "bg-opacity": "background-opacity",
   "tab": "tab-size",
   "underline": "text-decoration-thickness",
   "underline-offset": "text-underline-offset",
@@ -1330,6 +1400,18 @@ var cssVariables = [[
   }
 ]];
 
+// src/rules/question-mark.ts
+var questionMark = [
+  [
+    /^(\?)$/,
+    (_, { constructCSS, generator }) => {
+      if (generator.config.envMode === "dev")
+        return `@keyframes __un_qm {0% {box-shadow: inset 4px 4px #ff1e90, inset -4px -4px #ff1e90;} 100% {box-shadow: inset 8px 8px #3399ff, inset -8px -8px #3399ff;}}
+${constructCSS({ animation: "__un_qm 0.5s ease-in-out alternate infinite" })}`;
+    }
+  ]
+];
+
 // src/rules/index.ts
 var rules = [
   cssVariables,
@@ -1388,6 +1470,7 @@ var rules = [
   caretOpacity,
   imageRenderings,
   appearance,
+  outline,
   placeholder,
   overscrolls,
   breaks,
@@ -1414,7 +1497,8 @@ var rules = [
   transitions,
   filters,
   tables,
-  transforms
+  transforms,
+  questionMark
 ].flat(1);
 
 

package/dist/index.js

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkXMP675O2js = require('./chunk-XMP675O2.js');
+var _chunkKHFQBJ3Gjs = require('./chunk-KHFQBJ3G.js');
 
 
 
@@ -13,7 +13,7 @@ require('./chunk-OFR2H3GI.js');
 // src/index.ts
 var preset = () => ({
   theme: _chunk262SCYXBjs.theme,
-  rules: _chunkXMP675O2js.rules,
+  rules: _chunkKHFQBJ3Gjs.rules,
   variants: _chunkY3JRCRGSjs.variants
 });
 var src_default = preset;

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import {
   rules
-} from "./chunk-EI7OPLC7.mjs";
+} from "./chunk-K5WMT3AD.mjs";
 import {
   colors,
   theme

package/dist/rules.js

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkXMP675O2js = require('./chunk-XMP675O2.js');
+var _chunkKHFQBJ3Gjs = require('./chunk-KHFQBJ3G.js');
 require('./chunk-OFR2H3GI.js');
 
 
-exports.rules = _chunkXMP675O2js.rules;
+exports.rules = _chunkKHFQBJ3Gjs.rules;

package/dist/rules.mjs

@@ -1,6 +1,6 @@
 import {
   rules
-} from "./chunk-EI7OPLC7.mjs";
+} from "./chunk-K5WMT3AD.mjs";
 import "./chunk-YI4MPAID.mjs";
 export {
   rules

package/package.json

@@ -1,15 +1,19 @@
 {
   "name": "@unocss/preset-uno",
-  "version": "0.4.15",
-  "description": "",
-  "keywords": [],
-  "homepage": "https://github.com/antfu/unocss#readme",
+  "version": "0.6.0",
+  "description": "The default preset for UnoCSS",
+  "keywords": [
+    "unocss",
+    "unocss-preset"
+  ],
+  "homepage": "https://github.com/antfu/unocss/tree/main/packages/preset-uno#readme",
   "bugs": {
     "url": "https://github.com/antfu/unocss/issues"
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/antfu/unocss.git"
+    "url": "git+https://github.com/antfu/unocss.git",
+    "directory": "packages/preset-uno"
   },
   "funding": "https://github.com/sponsors/antfu",
   "license": "MIT",
@@ -41,7 +45,7 @@
     "*.css"
   ],
   "dependencies": {
-    "@unocss/core": "0.4.15"
+    "@unocss/core": "0.6.0"
   },
   "scripts": {
     "build": "tsup",