@unocss/preset-mini 0.15.4 → 0.16.1

package/dist/chunks/default2.mjs

@@ -23,11 +23,13 @@ const parseColorUtil = (body, theme) => {
   if (!name)
     return;
   let color;
-  const bracket = handler.bracket(main) || main;
-  if (bracket.startsWith("#"))
-    color = bracket.slice(1);
-  if (bracket.startsWith("hex-"))
-    color = bracket.slice(4);
+  const bracket = handler.bracket(main);
+  const bracketOrMain = bracket || main;
+  if (bracketOrMain.startsWith("#"))
+    color = bracketOrMain.slice(1);
+  if (bracketOrMain.startsWith("hex-"))
+    color = bracketOrMain.slice(4);
+  color = color || bracket;
   if (!color) {
     const colorData = theme.colors?.[name];
     if (typeof colorData === "string")
@@ -76,22 +78,6 @@ const textColors = [
   [/^(?:text|color|c)-(.+)$/, colorResolver$1("color", "text")],
   [/^(?:text|color|c)-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-text-opacity": handler.bracket.percent.cssvar(opacity2) })]
 ];
-const textDecorationColors = [
-  [/^underline-(.+)$/, (match, ctx) => {
-    const result = colorResolver$1("text-decoration-color", "line")(match, ctx);
-    if (result) {
-      return {
-        "-webkit-text-decoration-color": result["text-decoration-color"],
-        ...result
-      };
-    }
-  }],
-  [/^underline-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-line-opacity": handler.bracket.percent(opacity2) })]
-];
-const textStrokeColors = [
-  [/^text-stroke-(.+)$/, colorResolver$1("-webkit-text-stroke-color", "text-stroke")],
-  [/^text-stroke-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-text-stroke-opacity": handler.bracket.percent(opacity2) })]
-];
 const bgColors = [
   [/^bg-(.+)$/, colorResolver$1("background-color", "bg")],
   [/^bg-op(?:acity)?-?(.+)$/m, ([, opacity2]) => ({ "--un-bg-opacity": handler.bracket.percent(opacity2) })]
@@ -176,39 +162,51 @@ const placeholder = [
   ]
 ];
 
-const borderSizes = [
+const borders = [
   [/^border$/, handlerBorder],
-  [/^(?:border|b)(?:-([^-]+))?$/, handlerBorder],
-  [/^(?:border|b)(?:-([^-]+))?(?:-([^-]+))?$/, handlerBorder]
-];
-const borderRadius = [
-  [/^(?:border-)?(?:rounded|rd)$/, handlerRounded],
-  [/^(?:border-)?(?:rounded|rd)(?:-([^-]+))?$/, handlerRounded],
-  [/^(?:border-)?(?:rounded|rd)(?:-([^-]+))?(?:-([^-]+))?$/, handlerRounded]
-];
-const borderStyles = [
+  [/^(?:border|b)()-(.+)$/, handlerBorder],
+  [/^(?:border|b)-([^-]+)-(.+)$/, handlerBorder],
+  [/^(?:border|b)()-size-(.+)$/, handlerBorderSize],
+  [/^(?:border|b)-([^-]+)-size-(.+)$/, handlerBorderSize],
+  [/^(?:border|b)()-(.+)$/, handlerBorderColor],
+  [/^(?:border|b)-([^-]+)-(.+)$/, handlerBorderColor],
+  [/^(?:border|b)-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-border-opacity": handler.bracket.percent(opacity) })],
   ["border-solid", { "border-style": "solid" }],
   ["border-dashed", { "border-style": "dashed" }],
   ["border-dotted", { "border-style": "dotted" }],
   ["border-double", { "border-style": "double" }],
-  ["border-none", { "border-style": "none" }]
+  ["border-none", { "border-style": "none" }],
+  [/^(?:border-)?(?:rounded|rd)$/, handlerRounded],
+  [/^(?:border-)?(?:rounded|rd)(?:-([^-]+))?$/, handlerRounded],
+  [/^(?:border-)?(?:rounded|rd)(?:-([^-]+))?(?:-([^-]+))?$/, handlerRounded]
 ];
-const borders = [
-  borderSizes,
-  borderColors,
-  borderStyles,
-  borderRadius
-].flat(1);
-function handlerBorder([, a, b]) {
+function handlerBorder(m) {
+  const borderSizes = handlerBorderSize(m);
+  if (borderSizes) {
+    return [
+      ...borderSizes,
+      ["border-style", "solid"]
+    ];
+  }
+}
+function handlerBorderSize([, a, b]) {
   const [d, s = "1"] = directionMap[a] ? [a, b] : ["", a];
   const v = handler.bracket.px(s);
   if (v != null) {
     return [
-      ...directionMap[d].map((i) => [`border${i}-width`, v]),
-      ["border-style", "solid"]
+      ...directionMap[d].map((i) => [`border${i}-width`, v])
     ];
   }
 }
+function handlerBorderColor([, a, c], ctx) {
+  const ofColor = colorResolver$1("border-color", "border")(["", c], ctx);
+  if (ofColor) {
+    const borders2 = directionMap[directionMap[a] ? a : ""].map((i) => colorResolver$1(`border${i}-color`, "border")(["", c], ctx));
+    const borderObject = {};
+    Object.assign(borderObject, ...borders2);
+    return borderObject;
+  }
+}
 function handlerRounded([, a, b], { theme }) {
   const [d, s = "DEFAULT"] = cornerMap[a] ? [a, b] : ["", a];
   const v = theme.borderRadius?.[s] || handler.bracket.fraction.rem(s);
@@ -307,37 +305,27 @@ const transitions = [
 ];
 
 const flex = [
-  ["flex-col", { "flex-direction": "column" }],
-  ["flex-col-reverse", { "flex-direction": "column-reverse" }],
-  ["flex-row", { "flex-direction": "row" }],
-  ["flex-row-reverse", { "flex-direction": "row-reverse" }],
-  ["flex-wrap", { "flex-wrap": "wrap" }],
-  ["flex-wrap-reverse", { "flex-wrap": "wrap-reverse" }],
-  ["flex-nowrap", { "flex-wrap": "nowrap" }],
+  ["flex", { display: "flex" }],
+  ["inline-flex", { display: "inline-flex" }],
+  ["flex-inline", { display: "inline-flex" }],
   ["flex-1", { flex: "1 1 0%" }],
   ["flex-auto", { flex: "1 1 auto" }],
   ["flex-initial", { flex: "0 1 auto" }],
   ["flex-none", { flex: "none" }],
   [/^flex-\[(.+)\]$/, ([, d]) => ({ flex: d })],
-  ["flex-grow", { "flex-grow": 1 }],
-  ["flex-grow-0", { "flex-grow": 0 }],
   ["flex-shrink", { "flex-shrink": 1 }],
   ["flex-shrink-0", { "flex-shrink": 0 }],
-  ["flex", { display: "flex" }],
-  ["inline-flex", { display: "inline-flex" }],
-  ["flex-inline", { display: "inline-flex" }]
+  ["flex-grow", { "flex-grow": 1 }],
+  ["flex-grow-0", { "flex-grow": 0 }],
+  ["flex-row", { "flex-direction": "row" }],
+  ["flex-row-reverse", { "flex-direction": "row-reverse" }],
+  ["flex-col", { "flex-direction": "column" }],
+  ["flex-col-reverse", { "flex-direction": "column-reverse" }],
+  ["flex-wrap", { "flex-wrap": "wrap" }],
+  ["flex-wrap-reverse", { "flex-wrap": "wrap-reverse" }],
+  ["flex-nowrap", { "flex-wrap": "nowrap" }]
 ];
 
-const fontsFamilies = [
-  [/^font-(\w+)$/, ([, d], { theme }) => {
-    const font = theme.fontFamily?.[d];
-    if (font) {
-      return {
-        "font-family": font
-      };
-    }
-  }]
-];
 const weightMap = {
   thin: "100",
   extralight: "200",
@@ -349,40 +337,48 @@ const weightMap = {
   extrabold: "800",
   black: "900"
 };
-const fontSizes = [
-  [/^text-([^-]+)$/, ([, s = "base"], { theme }) => {
-    const result = toArray(theme.fontSize?.[s] || handler.bracket.rem(s));
-    if (result?.[0]) {
-      const [size, height = "1"] = result;
+const fonts = [
+  [/^font-(\w+)$/, ([, d], { theme }) => {
+    const font = theme.fontFamily?.[d];
+    if (font) {
+      return {
+        "font-family": font
+      };
+    }
+  }],
+  [/^text-(.+)$/, ([, s = "base"], { theme }) => {
+    const size = handler.bracket.rem(s);
+    if (size)
+      return { "font-size": size };
+    const themed = toArray(theme.fontSize?.[s]);
+    if (themed?.[0]) {
+      const [size2, height] = themed;
       return {
-        "font-size": size,
+        "font-size": size2,
         "line-height": height
       };
     }
-  }]
-];
-const fontWeights = [
+  }],
+  [/^text-size-(.+)$/, ([, s]) => {
+    const raw = handler.bracket.rem(s);
+    if (raw)
+      return { "font-size": raw };
+  }],
   [/^(?:font|fw)-?([^-]+)$/, ([, s]) => {
     const v = weightMap[s] || handler.number(s);
     if (v)
       return { "font-weight": v };
-  }]
-];
-const leadings = [
+  }],
   [/^(?:leading|lh)-([^-]+)$/, ([, s], { theme }) => {
     const v = theme.lineHeight?.[s] || handler.bracket.rem(s);
     if (v !== null)
       return { "line-height": v };
-  }]
-];
-const trackings = [
+  }],
   [/^tracking-([^-]+)$/, ([, s], { theme }) => {
     const v = theme.letterSpacing?.[s] || handler.bracket.rem(s);
     if (v !== null)
       return { "letter-spacing": v };
-  }]
-];
-const wordSpacings = [
+  }],
   [/^word-spacing-([^-]+)$/, ([, s], { theme }) => {
     const v = theme.wordSpacing?.[s] || handler.bracket.rem(s);
     if (v !== null)
@@ -402,20 +398,6 @@ const tabSizes = [
     }
   }]
 ];
-const textDecorationLengths = [
-  [/^underline-([^-]+)$/, ([, s]) => {
-    const v = s === "auto" ? s : handler.bracket.px(s);
-    if (v != null)
-      return { "text-decoration-thickness": v };
-  }]
-];
-const textDecorationOffsets = [
-  [/^underline-offset-([^-]+)$/, ([, s]) => {
-    const v = s === "auto" ? s : handler.bracket.px(s);
-    if (v != null)
-      return { "text-underline-offset": v };
-  }]
-];
 const textIndents = [
   [/^indent(?:-(.+))?$/, ([, s], { theme }) => {
     const v = theme.textIndent?.[s || "DEFAULT"] || handler.bracket.cssvar.fraction.rem(s);
@@ -423,12 +405,14 @@ const textIndents = [
       return { "text-indent": v };
   }]
 ];
-const textStrokeWidths = [
+const textStrokes = [
   [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => {
     const v = theme.textStrokeWidth?.[s || "DEFAULT"] || handler.bracket.cssvar.px(s);
     if (v != null)
       return { "-webkit-text-stroke-width": v };
-  }]
+  }],
+  [/^text-stroke-(.+)$/, colorResolver$1("-webkit-text-stroke-color", "text-stroke")],
+  [/^text-stroke-op(?:acity)?-?(.+)$/m, ([, opacity]) => ({ "--un-text-stroke-opacity": handler.bracket.percent(opacity) })]
 ];
 const textShadows = [
   [/^text-shadow(?:-(.+))?$/, ([, s], { theme }) => {
@@ -437,11 +421,6 @@ const textShadows = [
       return { "text-shadow": v };
   }]
 ];
-const fonts = [
-  fontsFamilies,
-  fontSizes,
-  fontWeights
-].flat(1);
 
 const gaps = [
   [/^(?:flex-|grid-)?gap-([^-]+)$/, ([, s]) => {
@@ -486,12 +465,10 @@ const autoDirection = (selector, theme) => {
 const grids = [
   ["grid", { display: "grid" }],
   ["inline-grid", { display: "inline-grid" }],
-  [/^grid-cols-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-columns": `repeat(auto-fill, minmax(${d}, 1fr))` })],
-  [/^grid-rows-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-rows": `repeat(auto-fill, minmax(${d}, 1fr))` })],
-  [/^grid-cols-(\d+)$/, ([, d]) => ({ "grid-template-columns": `repeat(${d},minmax(0,1fr))` })],
-  [/^grid-rows-(\d+)$/, ([, d]) => ({ "grid-template-rows": `repeat(${d},minmax(0,1fr))` })],
-  [/^grid-cols-\[(.+)\]$/, ([, v]) => ({ "grid-template-columns": v.replace(/,/g, " ") })],
-  [/^grid-rows-\[(.+)\]$/, ([, v]) => ({ "grid-template-rows": v.replace(/,/g, " ") })],
+  [/^(?:grid-)?col-start-([\w.-]+)$/, ([, v]) => ({ "grid-column-start": `${v}` })],
+  [/^(?:grid-)?col-end-([\w.]+)$/, ([, v]) => ({ "grid-column-end": `${v}` })],
+  [/^(?:grid-)?row-start-([\w.-]+)$/, ([, v]) => ({ "grid-row-start": `${v}` })],
+  [/^(?:grid-)?row-end-([\w.-]+)$/, ([, v]) => ({ "grid-row-end": `${v}` })],
   [/^(?:grid-)?(row|col)-(.+)$/, ([, d, v]) => {
     const key = d === "row" ? "grid-row" : "grid-column";
     let raw = handler.bracket(v);
@@ -508,13 +485,15 @@ const grids = [
         return { [key]: `span ${raw}/span ${raw}` };
     }
   }],
+  [/^(?:grid-)?auto-cols-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-columns": `${autoDirection(v, theme)}` })],
   [/^(?:grid-)?auto-flow-([\w.-]+)$/, ([, v]) => ({ "grid-auto-flow": `${v.replace("col", "column").split("-").join(" ")}` })],
-  [/^(?:grid-)?row-start-([\w.-]+)$/, ([, v]) => ({ "grid-row-start": `${v}` })],
-  [/^(?:grid-)?row-end-([\w.-]+)$/, ([, v]) => ({ "grid-row-end": `${v}` })],
-  [/^(?:grid-)?col-start-([\w.-]+)$/, ([, v]) => ({ "grid-column-start": `${v}` })],
-  [/^(?:grid-)?col-end-([\w.]+)$/, ([, v]) => ({ "grid-column-end": `${v}` })],
   [/^(?:grid-)?auto-rows-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-rows": `${autoDirection(v, theme)}` })],
-  [/^(?:grid-)?auto-cols-([\w.-]+)$/, ([, v], { theme }) => ({ "grid-auto-columns": `${autoDirection(v, theme)}` })]
+  [/^grid-cols-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-columns": `repeat(auto-fill, minmax(${d}, 1fr))` })],
+  [/^grid-rows-minmax-([\w.-]+)$/, ([, d]) => ({ "grid-template-rows": `repeat(auto-fill, minmax(${d}, 1fr))` })],
+  [/^grid-cols-(\d+)$/, ([, d]) => ({ "grid-template-columns": `repeat(${d},minmax(0,1fr))` })],
+  [/^grid-rows-(\d+)$/, ([, d]) => ({ "grid-template-rows": `repeat(${d},minmax(0,1fr))` })],
+  [/^grid-cols-\[(.+)\]$/, ([, v]) => ({ "grid-template-columns": v.replace(/,/g, " ") })],
+  [/^grid-rows-\[(.+)\]$/, ([, v]) => ({ "grid-template-rows": v.replace(/,/g, " ") })]
 ];
 
 const overflowValues = [
@@ -528,6 +507,7 @@ const overflows = [
   [/^(?:overflow|of)-([xy])-(.+)$/, ([, d, v]) => overflowValues.includes(v) ? { [`overflow-${d}`]: v } : void 0]
 ];
 
+const basicSet = ["auto", "start", "end", "center", "stretch"];
 const positions = [
   ["relative", { position: "relative" }],
   ["absolute", { position: "absolute" }],
@@ -541,47 +521,42 @@ const justifies = [
   ["justify-center", { "justify-content": "center" }],
   ["justify-between", { "justify-content": "space-between" }],
   ["justify-around", { "justify-content": "space-around" }],
-  ["justify-evenly", { "justify-content": "space-evenly" }]
+  ["justify-evenly", { "justify-content": "space-evenly" }],
+  ...basicSet.map((i) => [`justify-items-${i}`, { "justify-items": i }]),
+  ...basicSet.map((i) => [`justify-self-${i}`, { "justify-self": i }])
 ];
 const orders = [
   [/^order-(.+)$/, ([, v]) => ({ order: { first: "-9999", last: "9999", none: "0" }[v] || handler.bracket.number(v) })]
 ];
-const basicSet = ["auto", "start", "end", "center", "stretch"];
-const justifyItems = basicSet.map((i) => [`justify-items-${i}`, { "justify-items": i }]);
-const justifySelfs = basicSet.map((i) => [`justify-self-${i}`, { "justify-self": i }]);
-const alignContents = [
+const alignments = [
   ["content-start", { "align-content": "flex-start" }],
   ["content-end", { "align-content": "flex-end" }],
   ["content-center", { "align-content": "center" }],
   ["content-between", { "align-content": "space-between" }],
   ["content-around", { "align-content": "space-around" }],
-  ["content-evenly", { "align-content": "space-evenly" }]
-];
-const alignItems = [
+  ["content-evenly", { "align-content": "space-evenly" }],
   ["items-start", { "align-items": "flex-start" }],
   ["items-end", { "align-items": "flex-end" }],
   ["items-center", { "align-items": "center" }],
   ["items-baseline", { "align-items": "baseline" }],
-  ["items-stretch", { "align-items": "stretch" }]
-];
-const alignSelfs = [
+  ["items-stretch", { "align-items": "stretch" }],
   ["self-auto", { "align-self": "auto" }],
   ["self-start", { "align-self": "flex-start" }],
   ["self-end", { "align-self": "flex-end" }],
   ["self-center", { "align-self": "center" }],
   ["self-stretch", { "align-items": "stretch" }]
 ];
-const placeContents = [
+const placements = [
   ["place-content-start", { "place-content": "start" }],
   ["place-content-end", { "place-content": "end" }],
   ["place-content-center", { "place-content": "center" }],
   ["place-content-between", { "place-content": "space-between" }],
   ["place-content-around", { "place-content": "space-around" }],
   ["place-content-evenly", { "place-content": "space-evenly" }],
-  ["place-content-stretch", { "place-content": "stretch" }]
+  ["place-content-stretch", { "place-content": "stretch" }],
+  ...basicSet.map((i) => [`place-items-${i}`, { "place-items": i }]),
+  ...basicSet.map((i) => [`place-self-${i}`, { "place-self": i }])
 ];
-const placeItems = basicSet.map((i) => [`place-items-${i}`, { "place-items": i }]);
-const placeSelfs = basicSet.map((i) => [`place-self-${i}`, { "place-self": i }]);
 function handleInsetValue(v) {
   return { auto: "auto", full: "100%" }[v] ?? handler.bracket.fraction.cssvar.rem(v);
 }
@@ -772,17 +747,6 @@ const textTransforms = [
   ["case-capital", { "text-transform": "capitalize" }],
   ["case-normal", { "text-transform": "none" }]
 ];
-const textDecorations = [
-  ["underline", { "text-decoration": "underline" }],
-  ["line-through", { "text-decoration": "line-through" }],
-  ["no-underline", { "text-decoration": "none" }]
-];
-const textDecorationStyles = [
-  ["underline-solid", { "text-decoration-style": "solid" }],
-  ["underline-double", { "text-decoration-style": "double" }],
-  ["underline-dotted", { "text-decoration-style": "dotted" }],
-  ["underline-dashed", { "text-decoration-style": "dashed" }]
-];
 const fontStyles = [
   ["italic", { "font-style": "italic" }],
   ["not-italic", { "font-style": "normal" }]
@@ -800,6 +764,14 @@ const fontSmoothings = [
   }]
 ];
 
+const transformGpu = {
+  transform: "rotate(var(--un-rotate)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) translate3d(var(--un-translate-x), var(--un-translate-y), var(--un-translate-z))",
+  [CONTROL_BYPASS_PSEUDO]: ""
+};
+const transformCpu = {
+  transform: "rotate(var(--un-rotate)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z))",
+  [CONTROL_BYPASS_PSEUDO]: ""
+};
 const transformBase = {
   "--un-rotate": 0,
   "--un-scale-x": 1,
@@ -810,12 +782,7 @@ const transformBase = {
   "--un-translate-x": 0,
   "--un-translate-y": 0,
   "--un-translate-z": 0,
-  "transform": "rotate(var(--un-rotate)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z))",
-  [CONTROL_BYPASS_PSEUDO]: ""
-};
-const transformGpu = {
-  transform: "rotate(var(--un-rotate)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) translate3d(var(--un-translate-x), var(--un-translate-y), var(--un-translate-z))",
-  [CONTROL_BYPASS_PSEUDO]: ""
+  ...transformCpu
 };
 const transforms = [
   ["transform", transformBase],
@@ -826,6 +793,8 @@ const transforms = [
   [/^scale-([xyz])-([^-]+)$/, handleScale],
   [/^rotate-([^-]+)(?:deg)?$/, handleRotate],
   ["transform-gpu", transformGpu],
+  ["transform-cpu", transformCpu],
+  ["transform-none", { transform: "none" }],
   ["origin-center", { "transform-origin": "center" }],
   ["origin-top", { "transform-origin": "top" }],
   ["origin-top-right", { "transform-origin": "top right" }],
@@ -875,19 +844,12 @@ const variablesAbbrMap = {
   "backface": "backface-visibility",
   "whitespace": "white-space",
   "break": "word-break",
+  "b": "border-color",
+  "border": "border-color",
   "color": "color",
   "case": "text-transform",
-  "write": "writing-mode",
-  "write-orient": "text-orientation",
   "origin": "transform-origin",
   "bg": "background-color",
-  "bg-blend": "background-blend-mode",
-  "bg-clip": "-webkit-background-clip",
-  "bg-gradient": "linear-gradient",
-  "bg-origin-border": "background-origin",
-  "bg-position": "background-position",
-  "bg-repeat": "background-repeat",
-  "bg-size": "background-size",
   "bg-opacity": "background-opacity",
   "tab": "tab-size",
   "underline": "text-decoration-thickness",
@@ -902,21 +864,22 @@ const variablesAbbrMap = {
   "content": "align-content",
   "items": "align-items",
   "self": "align-self",
-  "object": "object-fit",
-  "mix-blend": "mix-blend-mode",
-  "animate-speed": "animation-speed"
+  "object": "object-fit"
 };
-const cssVariables = [[
-  /^(.+)-\$(.+)$/,
-  ([, name, varname]) => {
+const cssVariables = [
+  [/^(.+)-\$(.+)$/, ([, name, varname]) => {
     const prop = variablesAbbrMap[name];
     if (prop) {
       return {
         [prop]: `var(--${varname})`
       };
     }
-  }
-]];
+  }],
+  [/^(?:border|b)-([^-]+)-\$(.+)$/, ([, a, v]) => {
+    if (a in directionMap)
+      return directionMap[a].map((i) => [`border${i}-color`, `var(--${v})`]);
+  }]
+];
 
 const questionMark = [
   [
@@ -929,6 +892,33 @@ ${constructCSS({ animation: "__un_qm 0.5s ease-in-out alternate infinite" })}`;
   ]
 ];
 
+const textDecorations = [
+  ["underline", { "text-decoration": "underline" }],
+  ["line-through", { "text-decoration": "line-through" }],
+  ["no-underline", { "text-decoration": "none" }],
+  ["decoration-underline", { "text-decoration": "underline" }],
+  ["decoration-line-through", { "text-decoration": "line-through" }],
+  ["decoration-none", { "text-decoration": "none" }],
+  [/^(?:underline|decoration)-(solid|double|dotted|dashed|wavy)$/, ([, d]) => ({ "text-decoration-style": d })],
+  [/^(?:underline|decoration)-([^-]+)$/, ([, s]) => ({ "text-decoration-thickness": ["auto", "from-font"].includes(s) ? s : handler.bracket.px(s) })],
+  [/^decoration-(.*)$/, ([, d]) => ({ "text-decoration-thickness": handler.bracket.px(d) })],
+  [/^underline-offset-([^-]+)$/, ([, s]) => {
+    const v = s === "auto" ? s : handler.bracket.px(s);
+    if (v != null)
+      return { "text-underline-offset": v };
+  }],
+  [/^(?:underline|decoration)-(.+)$/, (match, ctx) => {
+    const result = colorResolver$1("text-decoration-color", "line")(match, ctx);
+    if (result) {
+      return {
+        "-webkit-text-decoration-color": result["text-decoration-color"],
+        ...result
+      };
+    }
+  }],
+  [/^(?:underline|decoration)-op(?:acity)?-?(.+)$/m, ([, opacity]) => ({ "--un-line-opacity": handler.bracket.percent(opacity) })]
+];
+
 const rules = [
   cssVariables,
   paddings,
@@ -944,12 +934,7 @@ const rules = [
   textIndents,
   textOverflows,
   textDecorations,
-  textDecorationStyles,
-  textDecorationColors,
-  textDecorationLengths,
-  textDecorationOffsets,
-  textStrokeWidths,
-  textStrokeColors,
+  textStrokes,
   textShadows,
   textTransforms,
   textAligns,
@@ -972,9 +957,6 @@ const rules = [
   userSelects,
   whitespaces,
   breaks,
-  trackings,
-  wordSpacings,
-  leadings,
   overflows,
   outline,
   appearance,
@@ -982,14 +964,8 @@ const rules = [
   positions,
   orders,
   justifies,
-  justifyItems,
-  justifySelfs,
-  alignContents,
-  alignItems,
-  alignSelfs,
-  placeContents,
-  placeItems,
-  placeSelfs,
+  alignments,
+  placements,
   insets,
   floats,
   zIndexes,
@@ -999,4 +975,4 @@ const rules = [
   questionMark
 ].flat(1);
 
-export { userSelects as $, justifies as A, orders as B, justifyItems as C, justifySelfs as D, alignContents as E, alignItems as F, alignSelfs as G, placeContents as H, placeItems as I, placeSelfs as J, insets as K, floats as L, zIndexes as M, boxSizing as N, questionMark as O, rings as P, boxShadows as Q, sizes as R, aspectRatio as S, paddings as T, margins as U, varEmpty as V, displays as W, appearances as X, cursors as Y, pointerEvents as Z, resizes as _, appearance as a, whitespaces as a0, contents as a1, breaks as a2, textOverflows as a3, textTransforms as a4, textDecorations as a5, textDecorationStyles as a6, fontStyles as a7, fontSmoothings as a8, transforms as a9, transitions as aa, fontsFamilies as ab, fontSizes as ac, fontWeights as ad, leadings as ae, trackings as af, wordSpacings as ag, tabSizes as ah, textDecorationLengths as ai, textDecorationOffsets as aj, textIndents as ak, textStrokeWidths as al, textShadows as am, fonts as an, cssVariables as ao, borderSizes as b, borderRadius as c, borderStyles as d, borders as e, parseColorUtil as f, colorResolver$1 as g, opacity as h, textColors as i, textDecorationColors as j, textStrokeColors as k, bgColors as l, borderColors as m, ringColors as n, outline as o, placeholder as p, ringOffsetColors as q, rules as r, fillColors as s, textAligns as t, flex as u, verticalAligns as v, gaps as w, grids as x, overflows as y, positions as z };
+export { tabSizes as $, floats as A, zIndexes as B, boxSizing as C, questionMark as D, rings as E, boxShadows as F, sizes as G, aspectRatio as H, paddings as I, margins as J, varEmpty as K, displays as L, appearances as M, cursors as N, pointerEvents as O, resizes as P, userSelects as Q, whitespaces as R, contents as S, breaks as T, textOverflows as U, textTransforms as V, fontStyles as W, fontSmoothings as X, transforms as Y, transitions as Z, fonts as _, appearance as a, textIndents as a0, textStrokes as a1, textShadows as a2, cssVariables as a3, textDecorations as a4, borders as b, parseColorUtil as c, colorResolver$1 as d, opacity as e, textColors as f, bgColors as g, borderColors as h, ringColors as i, ringOffsetColors as j, fillColors as k, flex as l, gaps as m, grids as n, outline as o, placeholder as p, overflows as q, rules as r, positions as s, textAligns as t, justifies as u, verticalAligns as v, orders as w, alignments as x, placements as y, insets as z };

package/dist/chunks/index.cjs

@@ -1,5 +1,7 @@
 'use strict';
 
+const core = require('@unocss/core');
+
 const directionMap = {
   "l": ["-left"],
   "r": ["-right"],
@@ -111,7 +113,7 @@ function global(str) {
     return str;
 }
 
-const handlers = {
+const valueHandlers = {
   __proto__: null,
   rem: rem,
   px: px,
@@ -124,51 +126,17 @@ const handlers = {
   global: global
 };
 
-const handlersNames = Object.keys(handlers);
-const handler = function(str) {
-  const s = this.__options?.sequence || [];
-  this.__options.sequence = [];
-  for (const n of s) {
-    const res = handlers[n](str);
-    if (res != null)
-      return res;
-  }
-  return void 0;
-};
-function addProcessor(that, name) {
-  if (!that.__options) {
-    that.__options = {
-      sequence: []
-    };
-  }
-  that.__options.sequence.push(name);
-  return that;
-}
-handlersNames.forEach((i) => {
-  Object.defineProperty(handler, i, {
-    enumerable: true,
-    get() {
-      return addProcessor(this, i);
-    }
-  });
-});
+const handler = core.createValueHandler(valueHandlers);
+const h = handler;
 
 function capitalize(str) {
   return str.charAt(0).toUpperCase() + str.slice(1);
 }
 
-exports.bracket = bracket;
 exports.capitalize = capitalize;
 exports.cornerMap = cornerMap;
-exports.cssvar = cssvar;
 exports.directionMap = directionMap;
-exports.fraction = fraction;
-exports.global = global;
+exports.h = h;
 exports.handler = handler;
-exports.handlersNames = handlersNames;
-exports.number = number;
-exports.percent = percent;
-exports.px = px;
-exports.rem = rem;
-exports.time = time;
+exports.valueHandlers = valueHandlers;
 exports.xyzMap = xyzMap;