@unocss/preset-mini 0.42.0 → 0.43.1

package/dist/chunks/default2.mjs

@@ -1,4 +1,4 @@
-import { g as globalKeywords, h as handler, c as colorResolver, d as directionMap, a as hasParseableColor, p as parseColor, b as colorToString, e as colorOpacityToString, f as cornerMap, m as makeGlobalStaticRules, i as colorableShadows, j as insetMap, r as resolveVerticalBreakpoints, k as resolveBreakpoints, l as directionSize } from './utilities.mjs';
+import { g as globalKeywords, h as handler, c as colorResolver, d as directionMap, a as hasParseableColor, p as parseColor, b as colorToString, e as colorOpacityToString, f as cornerMap, m as makeGlobalStaticRules, i as colorableShadows, j as insetMap, r as resolveVerticalBreakpoints, k as resolveBreakpoints, l as directionSize } from './colors2.mjs';
 import { toArray } from '@unocss/core';
 import { d as displays, c as contents, a as textOverflows, e as textTransforms, f as fontStyles, g as fontSmoothings, h as boxShadows, i as rings, j as cursors, k as appearances, p as pointerEvents, l as resizes, u as userSelects, w as whitespaces, m as breaks, n as transforms } from './transform.mjs';
 
@@ -372,15 +372,15 @@ const grids = [
       return { [`grid-${rowCol(c)}`]: `span ${v}/span ${v}` };
   }, { autocomplete: ["grid-(row|col)-span-<num>", "(row|col)-span-<num>"] }],
   [/^(?:grid-)?(row|col)-start-(.+)$/, ([, c, v]) => ({ [`grid-${rowCol(c)}-start`]: handler.bracket.cssvar(v) ?? v })],
-  [/^(?:grid-)?(row|col)-end-(.+)$/, ([, c, v]) => ({ [`grid-${rowCol(c)}-end`]: handler.bracket.cssvar(v) ?? v })],
-  [/^(?:grid-)?auto-(rows|cols)-(.+)$/, ([, c, v], { theme }) => ({ [`grid-auto-${rowCol(c)}`]: autoDirection(c, theme, v) })],
+  [/^(?:grid-)?(row|col)-end-(.+)$/, ([, c, v]) => ({ [`grid-${rowCol(c)}-end`]: handler.bracket.cssvar(v) ?? v }), { autocomplete: ["grid-(row|col)-(start|end)-<num>"] }],
+  [/^(?:grid-)?auto-(rows|cols)-(.+)$/, ([, c, v], { theme }) => ({ [`grid-auto-${rowCol(c)}`]: autoDirection(c, theme, v) }), { autocomplete: ["grid-auto-(rows|cols)-<num>"] }],
   [/^(?:grid-auto-flow|auto-flow|grid-flow)-(.+)$/, ([, v]) => ({ "grid-auto-flow": handler.bracket.cssvar(v) })],
-  [/^(?:grid-auto-flow|auto-flow|grid-flow)-(row|col|dense|row-dense|col-dense)$/, ([, v]) => ({ "grid-auto-flow": rowCol(v).replace("-", " ") })],
+  [/^(?:grid-auto-flow|auto-flow|grid-flow)-(row|col|dense|row-dense|col-dense)$/, ([, v]) => ({ "grid-auto-flow": rowCol(v).replace("-", " ") }), { autocomplete: ["(grid-auto-flow|auto-flow|grid-flow)-(row|col|dense|row-dense|col-dense)"] }],
   [/^grid-(rows|cols)-(.+)$/, ([, c, v], { theme }) => ({
     [`grid-template-${rowCol(c)}`]: theme[`gridTemplate${rowColTheme(c)}`]?.[v] ?? handler.bracket.cssvar(v)
   })],
   [/^grid-(rows|cols)-minmax-([\w.-]+)$/, ([, c, d]) => ({ [`grid-template-${rowCol(c)}`]: `repeat(auto-fill,minmax(${d},1fr))` })],
-  [/^grid-(rows|cols)-(\d+)$/, ([, c, d]) => ({ [`grid-template-${rowCol(c)}`]: `repeat(${d},minmax(0,1fr))` })],
+  [/^grid-(rows|cols)-(\d+)$/, ([, c, d]) => ({ [`grid-template-${rowCol(c)}`]: `repeat(${d},minmax(0,1fr))` }), { autocomplete: ["grid-(rows|cols)-<num>", "grid-(rows|cols)-none"] }],
   ["grid-rows-none", { "grid-template-rows": "none" }],
   ["grid-cols-none", { "grid-template-columns": "none" }]
 ];
@@ -543,28 +543,26 @@ function getSizeValue(minmax, hw, theme, prop) {
   return handler.bracket.cssvar.global.auto.fraction.rem(prop);
 }
 const sizes = [
-  [
-    /^(min-|max-)?([wh])-?(.+)$/,
-    ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) }),
-    {
-      autocomplete: [
-        "(w|h)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
-        "(max|min)-(w|h)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize"
-      ]
-    }
-  ],
-  [
-    /^(min-|max-)?(block|inline)-(.+)$/,
-    ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) }),
-    {
-      autocomplete: [
-        "(w|h)-(block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
-        "(max|min)-(w|h)-(block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize"
-      ]
-    }
-  ],
-  [/^(min-|max-)?(h)-screen-(.+)$/, ([, m, w, s], context) => ({ [getPropName(m, w)]: resolveVerticalBreakpoints(context)?.[s] }), { autocomplete: ["h-screen-$verticalBreakpoints", "(min|max)-h-screen-$verticalBreakpoints"] }],
-  [/^(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], context) => ({ [getPropName(m, w)]: resolveBreakpoints(context)?.[s] }), { autocomplete: ["w-screen-$breakpoints", "(min|max)-w-screen-$breakpoints"] }]
+  [/^(min-|max-)?([wh])-?(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) })],
+  [/^(min-|max-)?(block|inline)-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: getSizeValue(m, w, theme, s) }), {
+    autocomplete: [
+      "(w|h)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
+      "(block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize",
+      "(max|min)-(w|h|block|inline)",
+      "(max|min)-(w|h|block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize"
+    ]
+  }],
+  [/^(min-|max-)?(h)-screen-(.+)$/, ([, m, w, s], context) => ({ [getPropName(m, w)]: resolveVerticalBreakpoints(context)?.[s] })],
+  [/^(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], context) => ({ [getPropName(m, w)]: resolveBreakpoints(context)?.[s] }), {
+    autocomplete: [
+      "(w|h)-screen",
+      "(min|max)-(w|h)-screen",
+      "h-screen-$verticalBreakpoints",
+      "(min|max)-h-screen-$verticalBreakpoints",
+      "w-screen-$breakpoints",
+      "(min|max)-w-screen-$breakpoints"
+    ]
+  }]
 ];
 function getAspectRatio(prop) {
   if (/^\d+\/\d+$/.test(prop))
@@ -578,7 +576,7 @@ function getAspectRatio(prop) {
   return handler.bracket.cssvar.global.auto.number(prop);
 }
 const aspectRatio = [
-  [/^aspect-(?:ratio-)?(.+)$/, ([, d]) => ({ "aspect-ratio": getAspectRatio(d) }), { autocomplete: ["aspect-(square|video)", "aspect-ratio-(square|video)"] }]
+  [/^aspect-(?:ratio-)?(.+)$/, ([, d]) => ({ "aspect-ratio": getAspectRatio(d) }), { autocomplete: ["aspect-(square|video|ratio)", "aspect-ratio-(square|video)"] }]
 ];
 
 const paddings = [

package/dist/chunks/default3.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-const utilities = require('./utilities.cjs');
+const colors = require('./colors2.cjs');
 const variants$1 = require('./variants.cjs');
 const core = require('@unocss/core');
 
@@ -14,7 +14,7 @@ const calcMaxWidthBySize = (size) => {
 const variantBreakpoints = {
   name: "breakpoints",
   match(matcher, context) {
-    const variantEntries = Object.entries(utilities.resolveBreakpoints(context) ?? {}).map(([point, size], idx) => [point, size, idx]);
+    const variantEntries = Object.entries(colors.resolveBreakpoints(context) ?? {}).map(([point, size], idx) => [point, size, idx]);
     for (const [point, size, idx] of variantEntries) {
       if (!regexCache[point])
         regexCache[point] = new RegExp(`^((?:[al]t-)?${point}[:-])`);
@@ -183,24 +183,28 @@ const variantScope = {
 const variantVariables = {
   name: "variables",
   match(matcher) {
-    const match = matcher.match(/^(\[.+?\]):/);
-    if (match) {
-      const variant = utilities.handler.bracket(match[1]) ?? "";
-      return {
-        matcher: matcher.slice(match[0].length),
-        handle(input, next) {
-          const updates = variant.startsWith("@") ? {
-            parent: `${input.parent ? `${input.parent} $$ ` : ""}${variant}`
-          } : {
-            selector: variant.replace(/&/g, input.selector)
-          };
-          return next({
-            ...input,
-            ...updates
-          });
-        }
-      };
-    }
+    if (!matcher.startsWith("["))
+      return;
+    const [match, rest] = colors.getComponent(matcher, "[", "]", ":") ?? [];
+    if (!(match && rest && rest !== ""))
+      return;
+    const variant = colors.handler.bracket(match) ?? "";
+    if (!(variant.startsWith("@") || variant.includes("&")))
+      return;
+    return {
+      matcher: rest,
+      handle(input, next) {
+        const updates = variant.startsWith("@") ? {
+          parent: `${input.parent ? `${input.parent} $$ ` : ""}${variant}`
+        } : {
+          selector: variant.replace(/&/g, input.selector)
+        };
+        return next({
+          ...input,
+          ...updates
+        });
+      }
+    };
   },
   multiPass: true
 };
@@ -217,7 +221,7 @@ const variantNegative = {
     return {
       matcher: matcher.slice(1),
       body: (body) => {
-        if (body.find((v) => v[0] === utilities.CONTROL_MINI_NO_NEGATIVE))
+        if (body.find((v) => v[0] === colors.CONTROL_MINI_NO_NEGATIVE))
           return;
         let changed = false;
         body.forEach((v) => {

package/dist/chunks/default3.mjs

@@ -1,4 +1,4 @@
-import { k as resolveBreakpoints, h as handler, C as CONTROL_MINI_NO_NEGATIVE } from './utilities.mjs';
+import { k as resolveBreakpoints, n as getComponent, h as handler, C as CONTROL_MINI_NO_NEGATIVE } from './colors2.mjs';
 import { v as variantParentMatcher, a as variantMatcher } from './variants.mjs';
 import { escapeRegExp } from '@unocss/core';
 
@@ -181,24 +181,28 @@ const variantScope = {
 const variantVariables = {
   name: "variables",
   match(matcher) {
-    const match = matcher.match(/^(\[.+?\]):/);
-    if (match) {
-      const variant = handler.bracket(match[1]) ?? "";
-      return {
-        matcher: matcher.slice(match[0].length),
-        handle(input, next) {
-          const updates = variant.startsWith("@") ? {
-            parent: `${input.parent ? `${input.parent} $$ ` : ""}${variant}`
-          } : {
-            selector: variant.replace(/&/g, input.selector)
-          };
-          return next({
-            ...input,
-            ...updates
-          });
-        }
-      };
-    }
+    if (!matcher.startsWith("["))
+      return;
+    const [match, rest] = getComponent(matcher, "[", "]", ":") ?? [];
+    if (!(match && rest && rest !== ""))
+      return;
+    const variant = handler.bracket(match) ?? "";
+    if (!(variant.startsWith("@") || variant.includes("&")))
+      return;
+    return {
+      matcher: rest,
+      handle(input, next) {
+        const updates = variant.startsWith("@") ? {
+          parent: `${input.parent ? `${input.parent} $$ ` : ""}${variant}`
+        } : {
+          selector: variant.replace(/&/g, input.selector)
+        };
+        return next({
+          ...input,
+          ...updates
+        });
+      }
+    };
   },
   multiPass: true
 };

package/dist/chunks/transform.cjs

@@ -1,8 +1,9 @@
 'use strict';
 
-const utilities = require('./utilities.cjs');
+const colors = require('./colors2.cjs');
 
-const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
+const cursorValues = ["auto", "default", "none", "context-menu", "help", "pointer", "progress", "wait", "cell", "crosshair", "text", "vertical-text", "alias", "copy", "move", "no-drop", "not-allowed", "grab", "grabbing", "all-scroll", "col-resize", "row-resize", "n-resize", "e-resize", "s-resize", "w-resize", "ne-resize", "nw-resize", "se-resize", "sw-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "zoom-in", "zoom-out"];
+const varEmpty = " ";
 const displays = [
   ["inline", { display: "inline" }],
   ["block", { display: "block" }],
@@ -11,47 +12,48 @@ const displays = [
   ["flow-root", { display: "flow-root" }],
   ["list-item", { display: "list-item" }],
   ["hidden", { display: "none" }],
-  [/^display-(.+)$/, ([, c]) => ({ display: utilities.handler.bracket.cssvar.global(c) || c })]
+  [/^display-(.+)$/, ([, c]) => ({ display: colors.handler.bracket.cssvar.global(c) || c })]
 ];
 const appearances = [
   ["visible", { visibility: "visible" }],
   ["invisible", { visibility: "hidden" }],
   ["backface-visible", { "backface-visibility": "visible" }],
   ["backface-hidden", { "backface-visibility": "hidden" }],
-  ...utilities.makeGlobalStaticRules("backface", "backface-visibility")
+  ...colors.makeGlobalStaticRules("backface", "backface-visibility")
 ];
 const cursors = [
-  [/^cursor-(.+)$/, ([, c]) => ({ cursor: utilities.handler.bracket.cssvar.global(c) || c })]
+  [/^cursor-(.+)$/, ([, c]) => ({ cursor: colors.handler.bracket.cssvar.global(c) })],
+  ...cursorValues.map((v) => [`cursor-${v}`, { cursor: v }])
 ];
 const pointerEvents = [
   ["pointer-events-auto", { "pointer-events": "auto" }],
   ["pointer-events-none", { "pointer-events": "none" }],
-  ...utilities.makeGlobalStaticRules("pointer-events")
+  ...colors.makeGlobalStaticRules("pointer-events")
 ];
 const resizes = [
   ["resize-x", { resize: "horizontal" }],
   ["resize-y", { resize: "vertical" }],
   ["resize", { resize: "both" }],
   ["resize-none", { resize: "none" }],
-  ...utilities.makeGlobalStaticRules("resize")
+  ...colors.makeGlobalStaticRules("resize")
 ];
 const userSelects = [
   ["select-auto", { "user-select": "auto" }],
   ["select-all", { "user-select": "all" }],
   ["select-text", { "user-select": "text" }],
   ["select-none", { "user-select": "none" }],
-  ...utilities.makeGlobalStaticRules("select", "user-select")
+  ...colors.makeGlobalStaticRules("select", "user-select")
 ];
 const whitespaces = [
   [
     /^(?:whitespace-|ws-)([-\w]+)$/,
-    ([, v]) => ["normal", "nowrap", "pre", "pre-line", "pre-wrap", "break-spaces", ...utilities.globalKeywords].includes(v) ? { "white-space": v } : void 0,
+    ([, v]) => ["normal", "nowrap", "pre", "pre-line", "pre-wrap", "break-spaces", ...colors.globalKeywords].includes(v) ? { "white-space": v } : void 0,
     { autocomplete: "(whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap|break-spaces)" }
   ]
 ];
 const contents = [
   [/^content-\[(.+)\]$/, ([, v]) => ({ content: `"${v}"` })],
-  [/^content-(\$.+)]$/, ([, v]) => ({ content: utilities.handler.cssvar(v) })],
+  [/^content-(\$.+)]$/, ([, v]) => ({ content: colors.handler.cssvar(v) })],
   ["content-empty", { content: '""' }],
   ["content-none", { content: '""' }]
 ];
@@ -70,7 +72,7 @@ const textTransforms = [
   ["case-lower", { "text-transform": "lowercase" }],
   ["case-capital", { "text-transform": "capitalize" }],
   ["case-normal", { "text-transform": "none" }],
-  ...utilities.makeGlobalStaticRules("case", "text-transform")
+  ...colors.makeGlobalStaticRules("case", "text-transform")
 ];
 const fontStyles = [
   ["italic", { "font-style": "italic" }],
@@ -101,51 +103,56 @@ const ringBase = {
   "--un-ring-offset-color": "#fff",
   "--un-ring-width": "0px",
   "--un-ring-color": "rgba(147,197,253,0.5)",
-  "--un-shadow": "0 0 #0000"
+  "--un-shadow": "0 0 rgba(0,0,0,0)"
 };
 const rings = [
   [/^ring(?:-(.+))?$/, ([, d], { theme }) => {
-    const value = theme.ringWidth?.[d || "DEFAULT"] ?? utilities.handler.px(d || "1");
+    const value = theme.ringWidth?.[d || "DEFAULT"] ?? colors.handler.px(d || "1");
     if (value) {
       return {
         "--un-ring-width": value,
         "--un-ring-offset-shadow": "var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)",
         "--un-ring-shadow": "var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color)",
-        "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)"
+        "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
       };
     }
   }, { autocomplete: "ring-$ringWidth" }],
-  [/^ring-(?:width-|size-)(.+)$/, ([, d], { theme }) => ({ "--un-ring-width": theme.lineWidth?.[d] ?? utilities.handler.bracket.cssvar.px(d) }), { autocomplete: "ring-(width|size)-$lineWidth" }],
+  [/^ring-(?:width-|size-)(.+)$/, ([, d], { theme }) => ({ "--un-ring-width": theme.lineWidth?.[d] ?? colors.handler.bracket.cssvar.px(d) }), { autocomplete: "ring-(width|size)-$lineWidth" }],
   ["ring-offset", { "--un-ring-offset-width": "1px" }],
-  [/^ring-offset-(?:width-|size-)?(.+)$/, ([, d], { theme }) => ({ "--un-ring-offset-width": theme.lineWidth?.[d] ?? utilities.handler.bracket.cssvar.px(d) }), { autocomplete: "ring-offset-(width|size)-$lineWidth" }],
-  [/^ring-(.+)$/, utilities.colorResolver("--un-ring-color", "ring"), { autocomplete: "ring-$colors" }],
-  [/^ring-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-opacity": utilities.handler.bracket.percent(opacity) }), { autocomplete: "ring-(op|opacity)-<percent>" }],
-  [/^ring-offset-(.+)$/, utilities.colorResolver("--un-ring-offset-color", "ring-offset"), { autocomplete: "ring-offset-$colors" }],
-  [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-offset-opacity": utilities.handler.bracket.percent(opacity) }), { autocomplete: "ring-offset-(op|opacity)-<percent>" }],
+  [/^ring-offset-(?:width-|size-)?(.+)$/, ([, d], { theme }) => ({ "--un-ring-offset-width": theme.lineWidth?.[d] ?? colors.handler.bracket.cssvar.px(d) }), { autocomplete: "ring-offset-(width|size)-$lineWidth" }],
+  [/^ring-(.+)$/, colors.colorResolver("--un-ring-color", "ring"), { autocomplete: "ring-$colors" }],
+  [/^ring-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-opacity": colors.handler.bracket.percent(opacity) }), { autocomplete: "ring-(op|opacity)-<percent>" }],
+  [/^ring-offset-(.+)$/, colors.colorResolver("--un-ring-offset-color", "ring-offset"), { autocomplete: "ring-offset-$colors" }],
+  [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-offset-opacity": colors.handler.bracket.percent(opacity) }), { autocomplete: "ring-offset-(op|opacity)-<percent>" }],
   ["ring-inset", { "--un-ring-inset": "inset" }]
 ];
 
 const boxShadowsBase = {
-  "--un-ring-offset-shadow": "0 0 #0000",
-  "--un-ring-shadow": "0 0 #0000",
+  "--un-ring-offset-shadow": "0 0 rgba(0,0,0,0)",
+  "--un-ring-shadow": "0 0 rgba(0,0,0,0)",
   "--un-shadow-inset": varEmpty,
-  "--un-shadow": "0 0 #0000"
+  "--un-shadow": "0 0 rgba(0,0,0,0)"
 };
 const boxShadows = [
   [/^shadow(?:-(.+))?$/, ([, d], { theme }) => {
     const v = theme.boxShadow?.[d || "DEFAULT"];
     if (v) {
       return {
-        "--un-shadow": utilities.colorableShadows(v, "--un-shadow-color").join(","),
-        "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
+        "--un-shadow": colors.colorableShadows(v, "--un-shadow-color").join(","),
+        "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
       };
     }
   }, { autocomplete: "shadow-$boxShadow" }],
-  [/^shadow-(.+)$/, utilities.colorResolver("--un-shadow-color", "shadow"), { autocomplete: "shadow-$colors" }],
-  [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": utilities.handler.bracket.percent(opacity) }), { autocomplete: "shadow-(op|opacity)-<percent>" }],
+  [/^shadow-(.+)$/, colors.colorResolver("--un-shadow-color", "shadow"), { autocomplete: "shadow-$colors" }],
+  [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": colors.handler.bracket.percent(opacity) }), { autocomplete: "shadow-(op|opacity)-<percent>" }],
   ["shadow-inset", { "--un-shadow-inset": "inset" }]
 ];
 
+const transformValues = [
+  "translate",
+  "rotate",
+  "scale"
+];
 const transformCpu = [
   "translateX(var(--un-translate-x))",
   "translateY(var(--un-translate-y))",
@@ -187,9 +194,9 @@ const transformBase = {
   "--un-translate-z": 0
 };
 const transforms = [
-  [/^(?:transform-)?origin-(.+)$/, ([, s]) => ({ "transform-origin": utilities.positionMap[s] ?? utilities.handler.bracket.cssvar(s) }), { autocomplete: [`transform-origin-(${Object.keys(utilities.positionMap).join("|")})`, `origin-(${Object.keys(utilities.positionMap).join("|")})`] }],
+  [/^(?:transform-)?origin-(.+)$/, ([, s]) => ({ "transform-origin": colors.positionMap[s] ?? colors.handler.bracket.cssvar(s) }), { autocomplete: [`transform-origin-(${Object.keys(colors.positionMap).join("|")})`, `origin-(${Object.keys(colors.positionMap).join("|")})`] }],
   [/^(?:transform-)?perspect(?:ive)?-(.+)$/, ([, s]) => {
-    const v = utilities.handler.bracket.cssvar.px.numberWithUnit(s);
+    const v = colors.handler.bracket.cssvar.px.numberWithUnit(s);
     if (v != null) {
       return {
         "-webkit-perspective": v,
@@ -198,7 +205,7 @@ const transforms = [
     }
   }],
   [/^(?:transform-)?perspect(?:ive)?-origin-(.+)$/, ([, s]) => {
-    const v = utilities.handler.bracket.cssvar(s) ?? (s.length >= 3 ? utilities.positionMap[s] : void 0);
+    const v = colors.handler.bracket.cssvar(s) ?? (s.length >= 3 ? colors.positionMap[s] : void 0);
     if (v != null) {
       return {
         "-webkit-perspective-origin": v,
@@ -210,37 +217,37 @@ const transforms = [
   [/^(?:transform-)?translate-([xyz])-(.+)$/, handleTranslate],
   [/^(?:transform-)?rotate-()(.+)$/, handleRotate],
   [/^(?:transform-)?rotate-([xyz])-(.+)$/, handleRotate],
-  [/^(?:transform-)?skew-([xy])-(.+)$/, handleSkew],
+  [/^(?:transform-)?skew-([xy])-(.+)$/, handleSkew, { autocomplete: ["transform-skew-(x|y)-<percent>"] }],
   [/^(?:transform-)?scale-()(.+)$/, handleScale],
-  [/^(?:transform-)?scale-([xyz])-(.+)$/, handleScale],
+  [/^(?:transform-)?scale-([xyz])-(.+)$/, handleScale, { autocomplete: [`transform-(${transformValues.join("|")})-<percent>`, `transform-(${transformValues.join("|")})-(x|y|z)-<percent>`] }],
   [/^(?:transform-)?preserve-3d$/, () => ({ "transform-style": "preserve-3d" })],
   [/^(?:transform-)?preserve-flat$/, () => ({ "transform-style": "flat" })],
   ["transform", { transform: transformCpu }],
   ["transform-cpu", { transform: transformCpu }],
   ["transform-gpu", { transform: transformGpu }],
   ["transform-none", { transform: "none" }],
-  ...utilities.makeGlobalStaticRules("transform")
+  ...colors.makeGlobalStaticRules("transform")
 ];
 function handleTranslate([, d, b], { theme }) {
-  const v = theme.spacing?.[b] ?? utilities.handler.bracket.cssvar.fraction.rem(b);
+  const v = theme.spacing?.[b] ?? colors.handler.bracket.cssvar.fraction.rem(b);
   if (v != null) {
     return [
-      ...utilities.xyzMap[d].map((i) => [`--un-translate${i}`, v]),
+      ...colors.xyzMap[d].map((i) => [`--un-translate${i}`, v]),
       ["transform", transformCpu]
     ];
   }
 }
 function handleScale([, d, b]) {
-  const v = utilities.handler.bracket.cssvar.fraction.percent(b);
+  const v = colors.handler.bracket.cssvar.fraction.percent(b);
   if (v != null) {
     return [
-      ...utilities.xyzMap[d].map((i) => [`--un-scale${i}`, v]),
+      ...colors.xyzMap[d].map((i) => [`--un-scale${i}`, v]),
       ["transform", transformCpu]
     ];
   }
 }
 function handleRotate([, d = "", b]) {
-  const v = utilities.handler.bracket.cssvar.degree(b);
+  const v = colors.handler.bracket.cssvar.degree(b);
   if (v != null) {
     if (d) {
       return {
@@ -260,7 +267,7 @@ function handleRotate([, d = "", b]) {
   }
 }
 function handleSkew([, d, b]) {
-  const v = utilities.handler.bracket.cssvar.degree(b);
+  const v = colors.handler.bracket.cssvar.degree(b);
   if (v != null) {
     return {
       [`--un-skew-${d}`]: v,

package/dist/chunks/transform.mjs

@@ -1,6 +1,7 @@
-import { h as handler, m as makeGlobalStaticRules, g as globalKeywords, c as colorResolver, i as colorableShadows, n as positionMap, x as xyzMap } from './utilities.mjs';
+import { h as handler, m as makeGlobalStaticRules, g as globalKeywords, c as colorResolver, i as colorableShadows, o as positionMap, x as xyzMap } from './colors2.mjs';
 
-const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
+const cursorValues = ["auto", "default", "none", "context-menu", "help", "pointer", "progress", "wait", "cell", "crosshair", "text", "vertical-text", "alias", "copy", "move", "no-drop", "not-allowed", "grab", "grabbing", "all-scroll", "col-resize", "row-resize", "n-resize", "e-resize", "s-resize", "w-resize", "ne-resize", "nw-resize", "se-resize", "sw-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "zoom-in", "zoom-out"];
+const varEmpty = " ";
 const displays = [
   ["inline", { display: "inline" }],
   ["block", { display: "block" }],
@@ -19,7 +20,8 @@ const appearances = [
   ...makeGlobalStaticRules("backface", "backface-visibility")
 ];
 const cursors = [
-  [/^cursor-(.+)$/, ([, c]) => ({ cursor: handler.bracket.cssvar.global(c) || c })]
+  [/^cursor-(.+)$/, ([, c]) => ({ cursor: handler.bracket.cssvar.global(c) })],
+  ...cursorValues.map((v) => [`cursor-${v}`, { cursor: v }])
 ];
 const pointerEvents = [
   ["pointer-events-auto", { "pointer-events": "auto" }],
@@ -99,7 +101,7 @@ const ringBase = {
   "--un-ring-offset-color": "#fff",
   "--un-ring-width": "0px",
   "--un-ring-color": "rgba(147,197,253,0.5)",
-  "--un-shadow": "0 0 #0000"
+  "--un-shadow": "0 0 rgba(0,0,0,0)"
 };
 const rings = [
   [/^ring(?:-(.+))?$/, ([, d], { theme }) => {
@@ -109,7 +111,7 @@ const rings = [
         "--un-ring-width": value,
         "--un-ring-offset-shadow": "var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)",
         "--un-ring-shadow": "var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color)",
-        "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow, 0 0 #0000)"
+        "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
       };
     }
   }, { autocomplete: "ring-$ringWidth" }],
@@ -124,10 +126,10 @@ const rings = [
 ];
 
 const boxShadowsBase = {
-  "--un-ring-offset-shadow": "0 0 #0000",
-  "--un-ring-shadow": "0 0 #0000",
+  "--un-ring-offset-shadow": "0 0 rgba(0,0,0,0)",
+  "--un-ring-shadow": "0 0 rgba(0,0,0,0)",
   "--un-shadow-inset": varEmpty,
-  "--un-shadow": "0 0 #0000"
+  "--un-shadow": "0 0 rgba(0,0,0,0)"
 };
 const boxShadows = [
   [/^shadow(?:-(.+))?$/, ([, d], { theme }) => {
@@ -135,7 +137,7 @@ const boxShadows = [
     if (v) {
       return {
         "--un-shadow": colorableShadows(v, "--un-shadow-color").join(","),
-        "box-shadow": "var(--un-ring-offset-shadow, 0 0 #0000), var(--un-ring-shadow, 0 0 #0000), var(--un-shadow)"
+        "box-shadow": "var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
       };
     }
   }, { autocomplete: "shadow-$boxShadow" }],
@@ -144,6 +146,11 @@ const boxShadows = [
   ["shadow-inset", { "--un-shadow-inset": "inset" }]
 ];
 
+const transformValues = [
+  "translate",
+  "rotate",
+  "scale"
+];
 const transformCpu = [
   "translateX(var(--un-translate-x))",
   "translateY(var(--un-translate-y))",
@@ -208,9 +215,9 @@ const transforms = [
   [/^(?:transform-)?translate-([xyz])-(.+)$/, handleTranslate],
   [/^(?:transform-)?rotate-()(.+)$/, handleRotate],
   [/^(?:transform-)?rotate-([xyz])-(.+)$/, handleRotate],
-  [/^(?:transform-)?skew-([xy])-(.+)$/, handleSkew],
+  [/^(?:transform-)?skew-([xy])-(.+)$/, handleSkew, { autocomplete: ["transform-skew-(x|y)-<percent>"] }],
   [/^(?:transform-)?scale-()(.+)$/, handleScale],
-  [/^(?:transform-)?scale-([xyz])-(.+)$/, handleScale],
+  [/^(?:transform-)?scale-([xyz])-(.+)$/, handleScale, { autocomplete: [`transform-(${transformValues.join("|")})-<percent>`, `transform-(${transformValues.join("|")})-(x|y|z)-<percent>`] }],
   [/^(?:transform-)?preserve-3d$/, () => ({ "transform-style": "preserve-3d" })],
   [/^(?:transform-)?preserve-flat$/, () => ({ "transform-style": "flat" })],
   ["transform", { transform: transformCpu }],

package/dist/index.cjs

@@ -7,7 +7,7 @@ const _default = require('./chunks/default.cjs');
 const _default$1 = require('./chunks/default2.cjs');
 const _default$2 = require('./chunks/default3.cjs');
 const colors = require('./chunks/colors.cjs');
-const utilities = require('./chunks/utilities.cjs');
+const colors$1 = require('./chunks/colors2.cjs');
 require('./chunks/transform.cjs');
 require('./chunks/variants.cjs');
 
@@ -33,7 +33,8 @@ const presetMini = (options = {}) => {
     variants: _default$2.variants(options),
     options,
     postprocess: options.variablePrefix && options.variablePrefix !== "un-" ? VarPrefixPostprocessor(options.variablePrefix) : void 0,
-    preflights
+    preflights,
+    prefix: options.prefix
   };
 };
 function VarPrefixPostprocessor(prefix) {
@@ -48,7 +49,7 @@ function VarPrefixPostprocessor(prefix) {
 
 exports.theme = _default.theme;
 exports.colors = colors.colors;
-exports.parseColor = utilities.parseColor;
+exports.parseColor = colors$1.parseColor;
 exports["default"] = presetMini;
 exports.preflights = preflights;
 exports.presetMini = presetMini;

package/dist/index.d.ts

@@ -3,7 +3,7 @@ import { T as Theme } from './types-9e30040a.js';
 export { T as Theme, a as ThemeAnimation } from './types-9e30040a.js';
 export { t as theme } from './default-0fe8c7f8.js';
 export { c as colors } from './colors-f2b5968c.js';
-export { p as parseColor } from './utilities-654ad3bd.js';
+export { p as parseColor } from './utilities-b44b330d.js';
 
 declare const preflights: Preflight[];
 
@@ -20,6 +20,12 @@ interface PresetMiniOptions extends PresetOptions {
      * @default 'un-'
      */
     variablePrefix?: string;
+    /**
+     * Utils prefix
+     *
+     * @default undefined
+     */
+    prefix?: string;
 }
 declare const presetMini: (options?: PresetMiniOptions) => Preset<Theme>;
 

package/dist/index.mjs

@@ -4,7 +4,7 @@ export { t as theme } from './chunks/default.mjs';
 import { r as rules } from './chunks/default2.mjs';
 import { v as variants } from './chunks/default3.mjs';
 export { c as colors } from './chunks/colors.mjs';
-export { p as parseColor } from './chunks/utilities.mjs';
+export { p as parseColor } from './chunks/colors2.mjs';
 import './chunks/transform.mjs';
 import './chunks/variants.mjs';
 
@@ -30,7 +30,8 @@ const presetMini = (options = {}) => {
     variants: variants(options),
     options,
     postprocess: options.variablePrefix && options.variablePrefix !== "un-" ? VarPrefixPostprocessor(options.variablePrefix) : void 0,
-    preflights
+    preflights,
+    prefix: options.prefix
   };
 };
 function VarPrefixPostprocessor(prefix) {

package/dist/rules.cjs

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const _default = require('./chunks/default2.cjs');
 const transform = require('./chunks/transform.cjs');
-require('./chunks/utilities.cjs');
+require('./chunks/colors2.cjs');
 require('@unocss/core');
 
 

package/dist/rules.d.ts

@@ -72,7 +72,7 @@ declare const aspectRatio: Rule[];
 declare const paddings: Rule[];
 declare const margins: Rule[];
 
-declare const varEmpty = "var(--un-empty,/*!*/ /*!*/)";
+declare const varEmpty = " ";
 declare const displays: Rule[];
 declare const appearances: Rule[];
 declare const cursors: Rule[];

package/dist/rules.mjs

@@ -1,4 +1,4 @@
 export { m as alignments, a as appearance, A as aspectRatio, f as bgColors, b as borderStyles, c as borders, u as boxSizing, L as cssProperty, K as cssVariables, g as flex, s as floats, F as fonts, h as gaps, i as grids, q as insets, k as justifies, C as margins, d as opacity, l as orders, o as outline, j as overflows, B as paddings, n as placements, p as positions, x as questionMark, r as rules, y as sizes, D as svgUtilities, G as tabSizes, t as textAligns, e as textColors, M as textDecorations, H as textIndents, J as textShadows, I as textStrokes, E as transitions, v as verticalAligns, w as willChange, z as zIndexes } from './chunks/default2.mjs';
 export { k as appearances, h as boxShadows, b as boxShadowsBase, m as breaks, c as contents, j as cursors, d as displays, g as fontSmoothings, f as fontStyles, p as pointerEvents, l as resizes, r as ringBase, i as rings, a as textOverflows, e as textTransforms, t as transformBase, n as transforms, u as userSelects, v as varEmpty, w as whitespaces } from './chunks/transform.mjs';
-import './chunks/utilities.mjs';
+import './chunks/colors2.mjs';
 import '@unocss/core';

package/dist/theme.cjs

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const colors = require('./chunks/colors.cjs');
 const _default = require('./chunks/default.cjs');
 require('./chunks/transform.cjs');
-require('./chunks/utilities.cjs');
+require('./chunks/colors2.cjs');
 require('@unocss/core');