@unocss/preset-wind4 66.1.0-beta.7 → 66.1.0-beta.9

package/dist/index.d.mts

@@ -1,8 +1,8 @@
 import * as _unocss_core from '@unocss/core';
-import { Postprocessor, Preflight, Variant, PresetOptions, PreflightContext } from '@unocss/core';
+import { Postprocessor, Preflight, Variant, PresetOptions, Arrayable, CSSEntry, BaseContext } from '@unocss/core';
+export { shortcuts } from './shortcuts.mjs';
 import { T as Theme } from './shared/preset-wind4.BXbWGSRz.mjs';
 export { r as rules } from './shared/preset-wind4.D71xGC6i.mjs';
-export { shortcuts } from './shortcuts.mjs';
 export { t as theme } from './shared/preset-wind4.BOe5kxIw.mjs';
 
 declare function postprocessors(options: PresetWind4Options): Postprocessor[];
@@ -92,13 +92,14 @@ interface PresetWind4Options extends PresetOptions {
      */
     themePreflight?: boolean | 'on-demand';
     /**
-     * Process theme variables before generating CSS variables.
+     * Resolve the layer utilits with custom logic.
      *
-     * @param vars [key, value][]
-     * @param ctx {@link PreflightContext}
+     * @param utility [key, value] {@link CSSEntry}
+     * @param layer Layer name
+     * @param ctx base generator context {@link BaseContext<Theme>}
      * @returns
      */
-    processThemeVars?: (vars: [string, string][], ctx: PreflightContext) => void | [string, string][];
+    utilityResolver?: Arrayable<(utility: CSSEntry, layer: string, ctx: BaseContext<Theme>) => void>;
 }
 declare const presetWind4: _unocss_core.PresetFactory<Theme, PresetWind4Options>;
 

package/dist/index.d.ts

@@ -1,8 +1,8 @@
 import * as _unocss_core from '@unocss/core';
-import { Postprocessor, Preflight, Variant, PresetOptions, PreflightContext } from '@unocss/core';
+import { Postprocessor, Preflight, Variant, PresetOptions, Arrayable, CSSEntry, BaseContext } from '@unocss/core';
+export { shortcuts } from './shortcuts.js';
 import { T as Theme } from './shared/preset-wind4.BXbWGSRz.js';
 export { r as rules } from './shared/preset-wind4.Ca5oWgxX.js';
-export { shortcuts } from './shortcuts.js';
 export { t as theme } from './shared/preset-wind4.BOe5kxIw.js';
 
 declare function postprocessors(options: PresetWind4Options): Postprocessor[];
@@ -92,13 +92,14 @@ interface PresetWind4Options extends PresetOptions {
      */
     themePreflight?: boolean | 'on-demand';
     /**
-     * Process theme variables before generating CSS variables.
+     * Resolve the layer utilits with custom logic.
      *
-     * @param vars [key, value][]
-     * @param ctx {@link PreflightContext}
+     * @param utility [key, value] {@link CSSEntry}
+     * @param layer Layer name
+     * @param ctx base generator context {@link BaseContext<Theme>}
      * @returns
      */
-    processThemeVars?: (vars: [string, string][], ctx: PreflightContext) => void | [string, string][];
+    utilityResolver?: Arrayable<(utility: CSSEntry, layer: string, ctx: BaseContext<Theme>) => void>;
 }
 declare const presetWind4: _unocss_core.PresetFactory<Theme, PresetWind4Options>;
 

package/dist/index.mjs

@@ -1,14 +1,14 @@
-import { LAYER_PREFLIGHTS, definePreset } from '@unocss/core';
+import { LAYER_PREFLIGHTS, toArray, definePreset } from '@unocss/core';
 import { extractorArbitraryVariants } from '@unocss/extractor-arbitrary-variants';
-import { a as themeTracking, J as compressCSS, P as PRESET_NAME, w as getThemeByKey, I as hyphenate, p as passThemeKey, g as globalKeywords, t as trackedTheme } from './shared/preset-wind4.CkxnR6p3.mjs';
+import { b as themeTracking, K as compressCSS, P as PRESET_NAME, z as getThemeByKey, J as hyphenate, p as passThemeKey, j as globalKeywords, t as trackedTheme } from './shared/preset-wind4.CbSMpnSp.mjs';
 import { alphaPlaceholdersRE } from '@unocss/rule-utils';
-import { postprocessors } from './postprocess.mjs';
-import { l as variants } from './shared/preset-wind4.DXr6hHdY.mjs';
+import { p as postprocessors } from './shared/preset-wind4.Pg33yPuf.mjs';
+import { l as variants } from './shared/preset-wind4.BgYY8vln.mjs';
 import { theme as theme$1 } from './theme.mjs';
-import { s as shortcuts } from './shared/preset-wind4.BwU-POWl.mjs';
-import { r as rules } from './shared/preset-wind4.CJ98Gjkm.mjs';
+import { s as shortcuts } from './shared/preset-wind4.BLH55jNO.mjs';
+import { r as rules } from './shared/preset-wind4.BNxtnClY.mjs';
 import './colors.mjs';
-import './shared/preset-wind4.DhDf1e1c.mjs';
+import './shared/preset-wind4.Ch1Z_NI2.mjs';
 
 const resetCSS = `
 /*
@@ -465,12 +465,19 @@ function theme(options) {
       }
       let deps;
       const generateCSS = (deps2) => {
-        if (options.processThemeVars) {
-          deps2 = options.processThemeVars(deps2, ctx) ?? deps2;
+        if (options.utilityResolver) {
+          const resolver = toArray(options.utilityResolver);
+          for (const utility of deps2) {
+            for (const r of resolver) {
+              r(utility, "theme", ctx);
+            }
+          }
         }
-        if (deps2.length === 0)
+        const resolvedDeps = deps2.map(([key, value]) => key && value ? `${key}: ${value};` : void 0).filter(Boolean);
+        if (resolvedDeps.length === 0) {
           return void 0;
-        const depCSS = deps2.map(([key, value]) => `${key}: ${value};`).join("\n");
+        }
+        const depCSS = resolvedDeps.join("\n");
         return compressCSS(`
 :root, :host {
 ${depCSS}
@@ -530,7 +537,8 @@ const presetWind4 = definePreset((options = {}) => {
     shortcuts,
     theme: theme$1,
     layers: {
-      theme: -150
+      "cssvar-property": -200,
+      "theme": -150
     },
     preflights: preflights(options),
     variants: variants(options),

package/dist/postprocess.d.mts

@@ -1,13 +1,15 @@
 import { PresetWind4Options } from './index.mjs';
 export { postprocessors } from './index.mjs';
 import { Postprocessor } from '@unocss/core';
+import './shortcuts.mjs';
 import './shared/preset-wind4.BXbWGSRz.mjs';
 import './shared/preset-wind4.D71xGC6i.mjs';
-import './shortcuts.mjs';
 import './shared/preset-wind4.BOe5kxIw.mjs';
 
-declare function important(option: PresetWind4Options['important']): Postprocessor[];
+declare function important({ important: option }: PresetWind4Options): Postprocessor[];
+
+declare function utility({ utilityResolver }: PresetWind4Options): Postprocessor[];
 
-declare function varPrefix(prefix: PresetWind4Options['variablePrefix']): Postprocessor[];
+declare function varPrefix({ variablePrefix: prefix }: PresetWind4Options): Postprocessor[];
 
-export { important, varPrefix };
+export { important, utility, varPrefix };

package/dist/postprocess.d.ts

@@ -1,13 +1,15 @@
 import { PresetWind4Options } from './index.js';
 export { postprocessors } from './index.js';
 import { Postprocessor } from '@unocss/core';
+import './shortcuts.js';
 import './shared/preset-wind4.BXbWGSRz.js';
 import './shared/preset-wind4.Ca5oWgxX.js';
-import './shortcuts.js';
 import './shared/preset-wind4.BOe5kxIw.js';
 
-declare function important(option: PresetWind4Options['important']): Postprocessor[];
+declare function important({ important: option }: PresetWind4Options): Postprocessor[];
+
+declare function utility({ utilityResolver }: PresetWind4Options): Postprocessor[];
 
-declare function varPrefix(prefix: PresetWind4Options['variablePrefix']): Postprocessor[];
+declare function varPrefix({ variablePrefix: prefix }: PresetWind4Options): Postprocessor[];
 
-export { important, varPrefix };
+export { important, utility, varPrefix };

package/dist/postprocess.mjs

@@ -1,42 +1,2 @@
-function important(option) {
-  if (option == null || option === false)
-    return [];
-  const wrapWithIs = (selector) => {
-    if (selector.startsWith(":is(") && selector.endsWith(")"))
-      return selector;
-    if (selector.includes("::"))
-      return selector.replace(/(.*?)((?:\s\*)?::.*)/, ":is($1)$2");
-    return `:is(${selector})`;
-  };
-  return [
-    option === true ? (util) => {
-      util.entries.forEach((i) => {
-        if (i[1] != null && !String(i[1]).endsWith("!important"))
-          i[1] += " !important";
-      });
-    } : (util) => {
-      if (!util.selector.startsWith(option))
-        util.selector = `${option} ${wrapWithIs(util.selector)}`;
-    }
-  ];
-}
-
-function varPrefix(prefix) {
-  const processor = (obj) => {
-    obj.entries.forEach((i) => {
-      i[0] = i[0].replace(/^--un-/, `--${prefix}`);
-      if (typeof i[1] === "string")
-        i[1] = i[1].replace(/var\(--un-/g, `var(--${prefix}`);
-    });
-  };
-  return prefix !== "un-" ? [processor] : [];
-}
-
-function postprocessors(options) {
-  return [
-    ...important(options.important),
-    ...varPrefix(options.variablePrefix)
-  ];
-}
-
-export { important, postprocessors, varPrefix };
+export { i as important, p as postprocessors, u as utility, v as varPrefix } from './shared/preset-wind4.Pg33yPuf.mjs';
+import '@unocss/core';

package/dist/rules.d.mts

@@ -1,4 +1,4 @@
-import { Rule, CSSEntries, Shortcut, StaticRule } from '@unocss/core';
+import { Rule, CSSEntries, Shortcut, StaticRule, CSSValueInput } from '@unocss/core';
 import { T as Theme } from './shared/preset-wind4.BXbWGSRz.mjs';
 export { r as rules } from './shared/preset-wind4.D71xGC6i.mjs';
 
@@ -81,18 +81,18 @@ declare const rings: Rule<Theme>[];
 declare const scrolls: Rule<Theme>[];
 
 declare const shadowProperties: {
-    shadow: string;
-    shadowColor: string;
-    insetShadow: string;
-    insetShadowColor: string;
-    ringColor: string;
-    ringShadow: string;
-    insetRingColor: string;
-    insetRingShadow: string;
-    ringInset: string;
-    ringOffsetWidth: string;
-    ringOffsetColor: string;
-    ringOffsetShadow: string;
+    shadow: CSSValueInput;
+    shadowColor: CSSValueInput;
+    insetShadow: CSSValueInput;
+    insetShadowColor: CSSValueInput;
+    ringColor: CSSValueInput;
+    ringShadow: CSSValueInput;
+    insetRingColor: CSSValueInput;
+    insetRingShadow: CSSValueInput;
+    ringInset: CSSValueInput;
+    ringOffsetWidth: CSSValueInput;
+    ringOffsetColor: CSSValueInput;
+    ringOffsetShadow: CSSValueInput;
 };
 declare const boxShadows: Rule<Theme>[];
 

package/dist/rules.d.ts

@@ -1,4 +1,4 @@
-import { Rule, CSSEntries, Shortcut, StaticRule } from '@unocss/core';
+import { Rule, CSSEntries, Shortcut, StaticRule, CSSValueInput } from '@unocss/core';
 import { T as Theme } from './shared/preset-wind4.BXbWGSRz.js';
 export { r as rules } from './shared/preset-wind4.Ca5oWgxX.js';
 
@@ -81,18 +81,18 @@ declare const rings: Rule<Theme>[];
 declare const scrolls: Rule<Theme>[];
 
 declare const shadowProperties: {
-    shadow: string;
-    shadowColor: string;
-    insetShadow: string;
-    insetShadowColor: string;
-    ringColor: string;
-    ringShadow: string;
-    insetRingColor: string;
-    insetRingShadow: string;
-    ringInset: string;
-    ringOffsetWidth: string;
-    ringOffsetColor: string;
-    ringOffsetShadow: string;
+    shadow: CSSValueInput;
+    shadowColor: CSSValueInput;
+    insetShadow: CSSValueInput;
+    insetShadowColor: CSSValueInput;
+    ringColor: CSSValueInput;
+    ringShadow: CSSValueInput;
+    insetRingColor: CSSValueInput;
+    insetRingShadow: CSSValueInput;
+    ringInset: CSSValueInput;
+    ringOffsetWidth: CSSValueInput;
+    ringOffsetColor: CSSValueInput;
+    ringOffsetShadow: CSSValueInput;
 };
 declare const boxShadows: Rule<Theme>[];
 

package/dist/rules.mjs

@@ -1,5 +1,5 @@
-export { d as accents, am as accessibility, H as alignments, a as animations, c as appearance, _ as appearances, U as aspectRatio, aj as backgroundBlendModes, b as backgroundStyles, m as bgColors, g as borderStyles, h as borders, S as boxShadows, N as boxSizing, a7 as breaks, e as carets, n as colorScheme, p as columns, a0 as contains, a5 as contentVisibility, a6 as contents, aB as cssProperty, aA as cssVariables, $ as cursors, Z as displays, u as divides, al as dynamicViewportHeight, x as filters, y as flex, J as flexGridJustifiesAlignments, L as floats, ac as fontSmoothings, ab as fontStyles, ay as fontVariantNumeric, at as fonts, z as gaps, A as grids, j as handlerBorderStyle, ad as hyphens, i as imageRenderings, K as insets, ah as isolations, F as justifies, C as lineClamps, l as listStyle, W as margins, ak as mixBlendModes, Y as notLastChildSelector, ai as objectPositions, k as opacity, G as orders, o as outline, B as overflows, f as overscrolls, V as paddings, D as placeholders, I as placements, a1 as pointerEvents, E as positions, O as questionMark, a2 as resizes, P as rings, r as rules, ag as screenReadersAccess, s as scrollBehaviors, Q as scrolls, R as shadowProperties, T as sizes, X as spaces, az as splitShorthand, an as svgUtilities, au as tabSizes, ao as tables, t as textAligns, q as textDecorations, av as textIndents, a9 as textOverflows, ax as textShadows, aw as textStrokes, aa as textTransforms, a8 as textWraps, ap as touchActions, aq as transformBase, ar as transforms, as as transitions, a3 as userSelects, v as verticalAligns, aC as viewTransition, a4 as whitespaces, w as willChange, ae as writingModes, af as writingOrientations, M as zIndexes } from './shared/preset-wind4.CJ98Gjkm.mjs';
-export { a as container, c as containerParent, b as containerShortcuts } from './shared/preset-wind4.DhDf1e1c.mjs';
-import './shared/preset-wind4.CkxnR6p3.mjs';
+export { d as accents, am as accessibility, H as alignments, a as animations, c as appearance, _ as appearances, U as aspectRatio, aj as backgroundBlendModes, b as backgroundStyles, m as bgColors, g as borderStyles, h as borders, S as boxShadows, N as boxSizing, a7 as breaks, e as carets, n as colorScheme, p as columns, a0 as contains, a5 as contentVisibility, a6 as contents, aB as cssProperty, aA as cssVariables, $ as cursors, Z as displays, u as divides, al as dynamicViewportHeight, x as filters, y as flex, J as flexGridJustifiesAlignments, L as floats, ac as fontSmoothings, ab as fontStyles, ay as fontVariantNumeric, at as fonts, z as gaps, A as grids, j as handlerBorderStyle, ad as hyphens, i as imageRenderings, K as insets, ah as isolations, F as justifies, C as lineClamps, l as listStyle, W as margins, ak as mixBlendModes, Y as notLastChildSelector, ai as objectPositions, k as opacity, G as orders, o as outline, B as overflows, f as overscrolls, V as paddings, D as placeholders, I as placements, a1 as pointerEvents, E as positions, O as questionMark, a2 as resizes, P as rings, r as rules, ag as screenReadersAccess, s as scrollBehaviors, Q as scrolls, R as shadowProperties, T as sizes, X as spaces, az as splitShorthand, an as svgUtilities, au as tabSizes, ao as tables, t as textAligns, q as textDecorations, av as textIndents, a9 as textOverflows, ax as textShadows, aw as textStrokes, aa as textTransforms, a8 as textWraps, ap as touchActions, aq as transformBase, ar as transforms, as as transitions, a3 as userSelects, v as verticalAligns, aC as viewTransition, a4 as whitespaces, w as willChange, ae as writingModes, af as writingOrientations, M as zIndexes } from './shared/preset-wind4.BNxtnClY.mjs';
+export { a as container, c as containerParent, b as containerShortcuts } from './shared/preset-wind4.Ch1Z_NI2.mjs';
+import './shared/preset-wind4.CbSMpnSp.mjs';
 import '@unocss/core';
 import '@unocss/rule-utils';

package/dist/shared/{preset-wind4.BwU-POWl.mjs → preset-wind4.BLH55jNO.mjs}

@@ -1,4 +1,4 @@
-import { b as containerShortcuts } from './preset-wind4.DhDf1e1c.mjs';
+import { b as containerShortcuts } from './preset-wind4.Ch1Z_NI2.mjs';
 
 const shortcuts = [
   ...containerShortcuts

package/dist/shared/{preset-wind4.CJ98Gjkm.mjs → preset-wind4.BNxtnClY.mjs}

@@ -1,6 +1,6 @@
-import { g as globalKeywords, b as h, D as makeGlobalStaticRules, f as positionMap, r as parseColor, S as SpecialColorKey, K as defineProperty, a as themeTracking, L as detectThemeValue, q as colorResolver, E as isCSSMathFn, d as directionMap, z as hasParseableColor, c as cornerMap, p as passThemeKey, o as colorCSSGenerator, F as isSize, l as directionSize, n as numberResolver, m as colorableShadows, i as insetMap, I as hyphenate, A as resolveBreakpoints, G as transformXYZ, x as xyzMap, M as bracketTypeRe } from './preset-wind4.CkxnR6p3.mjs';
-import { notNull, uniq } from '@unocss/core';
-import { a as container, c as containerParent } from './preset-wind4.DhDf1e1c.mjs';
+import { j as globalKeywords, c as h, E as makeGlobalStaticRules, g as positionMap, w as parseColor, S as SpecialColorKey, L as defineProperty, b as themeTracking, M as detectThemeValue, u as colorResolver, F as isCSSMathFn, d as directionMap, B as hasParseableColor, e as cornerMap, p as passThemeKey, q as colorCSSGenerator, G as isSize, m as directionSize, n as numberResolver, o as colorableShadows, i as insetMap, J as hyphenate, r as resolveBreakpoints, H as transformXYZ, x as xyzMap, N as bracketTypeRe } from './preset-wind4.CbSMpnSp.mjs';
+import { notNull } from '@unocss/core';
+import { a as container, c as containerParent } from './preset-wind4.Ch1Z_NI2.mjs';
 import { getStringComponent } from '@unocss/rule-utils';
 
 const verticalAlignAlias = {
@@ -184,7 +184,8 @@ function bgGradientColorResolver() {
           };
           break;
       }
-      yield Object.values(properties).join("\n");
+      for (const p of Object.values(properties))
+        yield p;
     }
   };
 }
@@ -193,7 +194,8 @@ function bgGradientPositionResolver() {
     yield {
       [`--un-gradient-${mode}-position`]: `${h.bracket.cssvar.percent(body)}`
     };
-    yield Object.values(properties).join("\n");
+    for (const p of Object.values(properties))
+      yield p;
   };
 }
 const backgroundStyles = [
@@ -436,9 +438,9 @@ const borders = [
   [/^(?:border|b)-([bi][se])-(?:style-)?(.+)$/, handlerBorderStyle]
 ];
 function borderColorResolver(direction) {
-  return ([, body], theme) => {
-    const data = parseColor(body, theme);
-    const result = colorCSSGenerator(data, `border${direction}-color`, "border");
+  return ([, body], ctx) => {
+    const data = parseColor(body, ctx.theme);
+    const result = colorCSSGenerator(data, `border${direction}-color`, "border", ctx);
     if (result) {
       const css = result[0];
       if (data?.color && !Object.values(SpecialColorKey).includes(data.color) && direction && direction !== "") {
@@ -458,11 +460,14 @@ function handlerBorderColorOrSize([, a = "", b], ctx) {
     if (isCSSMathFn(h.bracket(b)))
       return handlerBorderSize(["", a, b]);
     if (hasParseableColor(b, ctx.theme)) {
-      return directionMap[a].map((i) => borderColorResolver(i)(["", b], ctx.theme)).filter(notNull).reduce((acc, item) => {
-        Object.assign(acc[0], item[0]);
-        acc[1] = uniq([acc[1], item[1]]).join("");
-        return acc.filter(Boolean);
-      }, [{}]);
+      const direcetions = directionMap[a].map((i) => borderColorResolver(i)(["", b], ctx)).filter(notNull);
+      return [
+        direcetions.map((d) => d[0]).reduce((acc, item) => {
+          Object.assign(acc, item);
+          return acc;
+        }, {}),
+        ...direcetions.flatMap((d) => d.slice(1))
+      ];
     }
   }
 }
@@ -722,7 +727,7 @@ const filterBaseKeys = [
   "sepia",
   "drop-shadow"
 ];
-const filterProperties = filterBaseKeys.map((i) => defineProperty(`--un-${i}`)).join("\n");
+const filterProperties = filterBaseKeys.map((i) => defineProperty(`--un-${i}`));
 const filterCSS = filterBaseKeys.map((i) => `var(--un-${i},)`).join(" ");
 const backdropBaseKeys = [
   "backdrop-blur",
@@ -735,7 +740,7 @@ const backdropBaseKeys = [
   "backdrop-saturate",
   "backdrop-sepia"
 ];
-const backdropProperties = backdropBaseKeys.map((i) => defineProperty(`--un-${i}`)).join("\n");
+const backdropProperties = backdropBaseKeys.map((i) => defineProperty(`--un-${i}`));
 const backdropCSS = backdropBaseKeys.map((i) => `var(--un-${i},)`).join(" ");
 function percentWithDefault(str) {
   let v = h.bracket.cssvar(str || "");
@@ -756,7 +761,7 @@ function toFilter(varName, resolver) {
             "-webkit-backdrop-filter": backdropCSS,
             "backdrop-filter": backdropCSS
           },
-          backdropProperties
+          ...backdropProperties
         ];
       } else {
         return [
@@ -764,7 +769,7 @@ function toFilter(varName, resolver) {
             [`--un-${varName}`]: `${varName}(${value})`,
             filter: filterCSS
           },
-          filterProperties
+          ...filterProperties
         ];
       }
     }
@@ -779,7 +784,7 @@ function dropShadowResolver([, s], { theme }) {
         "--un-drop-shadow": `drop-shadow(${shadows.join(") drop-shadow(")})`,
         "filter": filterCSS
       },
-      filterProperties
+      ...filterProperties
     ];
   }
   v = h.bracket.cssvar(s) ?? (s === "none" ? "" : void 0);
@@ -789,7 +794,7 @@ function dropShadowResolver([, s], { theme }) {
         "--un-drop-shadow": v ? `drop-shadow(${v})` : v,
         "filter": filterCSS
       },
-      filterProperties
+      ...filterProperties
     ];
   }
 }
@@ -1171,19 +1176,19 @@ const shadowProperties = {
   insetRingColor: defineProperty("--un-inset-ring-color"),
   insetRingShadow: defineProperty("--un-inset-ring-shadow", { initialValue: "0 0 #0000" }),
   ringInset: defineProperty("--un-ring-inset"),
-  ringOffsetWidth: defineProperty("--un-ring-offset-width", { syntax: '"<length>"', initialValue: "0px" }),
+  ringOffsetWidth: defineProperty("--un-ring-offset-width", { syntax: "<length>", initialValue: "0px" }),
   ringOffsetColor: defineProperty("--un-ring-offset-color"),
   ringOffsetShadow: defineProperty("--un-ring-offset-shadow", { initialValue: "0 0 #0000" })
 };
 const boxShadows = [
   // shadow
-  [/^shadow(?:-(.+))?$/, hanldeShadow("shadow"), { autocomplete: ["shadow-$colors", "shadow-$shadow"] }],
+  [/^shadow(?:-(.+))?$/, handleShadow("shadow"), { autocomplete: ["shadow-$colors", "shadow-$shadow"] }],
   [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": h.bracket.percent.cssvar(opacity) }), { autocomplete: "shadow-(op|opacity)-<percent>" }],
   // inset shadow
-  [/^inset-shadow(?:-(.+))?$/, hanldeShadow("insetShadow"), { autocomplete: ["inset-shadow-$colors", "inset-shadow-$insetShadow"] }],
+  [/^inset-shadow(?:-(.+))?$/, handleShadow("insetShadow"), { autocomplete: ["inset-shadow-$colors", "inset-shadow-$insetShadow"] }],
   [/^inset-shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-inset-shadow-opacity": h.bracket.percent.cssvar(opacity) }), { autocomplete: "shadow-(op|opacity)-<percent>" }]
 ];
-function hanldeShadow(themeKey) {
+function handleShadow(themeKey) {
   return (match, ctx) => {
     const [, d] = match;
     const { theme } = ctx;
@@ -1196,7 +1201,7 @@ function hanldeShadow(themeKey) {
           "--un-shadow": colorableShadows(v || c, `--un-${colorVar}-color`).join(","),
           "box-shadow": "var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
         },
-        Object.values(shadowProperties).join("\n")
+        ...Object.values(shadowProperties)
       ];
     }
     return colorResolver(`--un-${colorVar}-color`, colorVar)(match, ctx);
@@ -1210,10 +1215,10 @@ const rings = [
     if (v != null) {
       return [
         {
-          "--un-ring-shadow": `var(--un-ring-inset) 0 0 0 calc(${v} + var(--un-ring-offset-width)) var(--un-ring-color, currentColor)`,
+          "--un-ring-shadow": `var(--un-ring-inset,) 0 0 0 calc(${v} + var(--un-ring-offset-width)) var(--un-ring-color, currentColor)`,
           "box-shadow": "var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
         },
-        Object.values(shadowProperties).join("\n")
+        ...Object.values(shadowProperties)
       ];
     }
   }],
@@ -1228,7 +1233,7 @@ const rings = [
           "--un-inset-ring-shadow": `inset 0 0 0 ${v} var(--un-inset-ring-color, currentColor)`,
           "box-shadow": "var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)"
         },
-        Object.values(shadowProperties).join("\n")
+        ...Object.values(shadowProperties)
       ];
     }
   }],
@@ -1412,7 +1417,7 @@ const contains = [
         "--un-contain-size": d,
         "contain": containValues.map((i) => `var(--un-contain-${i})`).join(" ")
       },
-      containValues.map((i) => defineProperty(`--un-contain-${i}`)).join("\n")
+      ...containValues.map((i) => defineProperty(`--un-contain-${i}`))
     ] : void 0;
   }],
   ["contain-strict", { contain: "strict" }],
@@ -1694,7 +1699,8 @@ const tables = [
         "--un-border-spacing-y": v,
         "border-spacing": "var(--un-border-spacing-x) var(--un-border-spacing-y)"
       };
-      yield ["x", "y"].map((d) => defineProperty(`--un-border-spacing-${d}`, { syntax: "<length>", initialValue: "0" })).join("\n");
+      for (const d of ["x", "y"])
+        yield defineProperty(`--un-border-spacing-${d}`, { syntax: "<length>", initialValue: "0" });
     }
   }, { autocomplete: ["border-spacing", "border-spacing-$spacing"] }],
   [/^border-spacing-([xy])-(.+)$/, function* ([, d, s], { theme }) {
@@ -1704,7 +1710,8 @@ const tables = [
         [`--un-border-spacing-${d}`]: v,
         "border-spacing": "var(--un-border-spacing-x) var(--un-border-spacing-y)"
       };
-      yield ["x", "y"].map((d2) => defineProperty(`--un-border-spacing-${d2}`, { syntax: "<length>", initialValue: "0" })).join("\n");
+      for (const d2 of ["x", "y"])
+        yield defineProperty(`--un-border-spacing-${d2}`, { syntax: "<length>", initialValue: "0" });
     }
   }, { autocomplete: ["border-spacing-(x|y)", "border-spacing-(x|y)-$spacing"] }],
   ["caption-top", { "caption-side": "top" }],
@@ -1729,28 +1736,31 @@ function resolveValue(s, theme) {
 }
 
 const touchActionValue = "var(--un-pan-x) var(--un-pan-y) var(--un-pinch-zoom)";
-const touchActionProperty = ["pan-x", "pan-y", "pinch-zoom"].map((d) => defineProperty(`--un-${d}`)).join("\n");
+const touchActionProperties = ["pan-x", "pan-y", "pinch-zoom"].map((d) => defineProperty(`--un-${d}`));
 const touchActions = [
   [/^touch-pan-(x|left|right)$/, function* ([, d]) {
     yield {
       "--un-pan-x": `pan-${d}`,
       "touch-action": touchActionValue
     };
-    yield touchActionProperty;
+    for (const p of touchActionProperties)
+      yield p;
   }, { autocomplete: ["touch-pan", "touch-pan-(x|left|right|y|up|down)"] }],
   [/^touch-pan-(y|up|down)$/, function* ([, d]) {
     yield {
       "--un-pan-y": `pan-${d}`,
       "touch-action": touchActionValue
     };
-    yield touchActionProperty;
+    for (const p of touchActionProperties)
+      yield p;
   }],
   [/^touch-pinch-zoom$/, function* () {
     yield {
       "--un-pinch-zoom": "pinch-zoom",
       "touch-action": touchActionValue
     };
-    yield touchActionProperty;
+    for (const p of touchActionProperties)
+      yield p;
   }],
   ["touch-auto", { "touch-action": "auto" }],
   ["touch-manipulation", { "touch-action": "manipulation" }],
@@ -1852,7 +1862,7 @@ function handleTranslate([, d, b]) {
         ...transformXYZ(d, typeof v === "number" ? `calc(var(--spacing) * ${v})` : v, "translate"),
         ["translate", `var(--un-translate-x) var(--un-translate-y)${d === "z" ? " var(--un-translate-z)" : ""}`]
       ],
-      ["x", "y", "z"].map((d2) => defineProperty(`--un-translate-${d2}`, { initialValue: 0 })).join("\n")
+      ...["x", "y", "z"].map((d2) => defineProperty(`--un-translate-${d2}`, { initialValue: 0 }))
     ];
   }
 }
@@ -1869,7 +1879,7 @@ function handleScale([, d, b]) {
         ...transformXYZ(d, v, "scale"),
         ["scale", `var(--un-scale-x) var(--un-scale-y)${d === "z" ? " var(--un-scale-z)" : ""}`]
       ],
-      ["x", "y", "z"].map((d2) => defineProperty(`--un-scale-${d2}`, { initialValue: 1 })).join("\n")
+      ...["x", "y", "z"].map((d2) => defineProperty(`--un-scale-${d2}`, { initialValue: 1 }))
     ];
   }
 }
@@ -1887,8 +1897,8 @@ function handleRotate([, d = "", b]) {
           ...transformXYZ(d, v.endsWith("deg") ? `rotate${d.toUpperCase()}(${v})` : v, "rotate"),
           ["transform", transform]
         ],
-        ["x", "y", "z"].map((d2) => defineProperty(`--un-rotate-${d2}`, { initialValue: `rotate${d2.toUpperCase()}(0)` })).join("\n"),
-        ["x", "y"].map((d2) => defineProperty(`--un-skew-${d2}`, { initialValue: `skew${d2.toUpperCase()}(0)` })).join("\n")
+        ...["x", "y", "z"].map((d2) => defineProperty(`--un-rotate-${d2}`, { initialValue: `rotate${d2.toUpperCase()}(0)` })),
+        ...["x", "y"].map((d2) => defineProperty(`--un-skew-${d2}`, { initialValue: `skew${d2.toUpperCase()}(0)` }))
       ];
     } else {
       return {
@@ -1906,8 +1916,8 @@ function handleSkew([, d, b]) {
         ...ds.map((_d) => [`--un-skew${_d}`, v.endsWith("deg") ? `skew${_d.slice(1).toUpperCase()}(${v})` : v]),
         ["transform", transform]
       ],
-      ["x", "y", "z"].map((d2) => defineProperty(`--un-rotate-${d2}`, { initialValue: `rotate${d2.toUpperCase()}(0)` })).join("\n"),
-      ["x", "y"].map((d2) => defineProperty(`--un-skew-${d2}`, { initialValue: `skew${d2.toUpperCase()}(0)` })).join("\n")
+      ...["x", "y", "z"].map((d2) => defineProperty(`--un-rotate-${d2}`, { initialValue: `rotate${d2.toUpperCase()}(0)` })),
+      ...["x", "y"].map((d2) => defineProperty(`--un-skew-${d2}`, { initialValue: `skew${d2.toUpperCase()}(0)` }))
     ];
   }
 }
@@ -2203,19 +2213,19 @@ const fontVariantNumericProperties = [
   defineProperty("--un-numeric-figure"),
   defineProperty("--un-numeric-spacing"),
   defineProperty("--un-numeric-fraction")
-].join("\n");
+];
 const baseFontVariantNumeric = {
   "font-variant-numeric": "var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction)"
 };
 const fontVariantNumeric = [
-  ["ordinal", [{ "--un-ordinal": "ordinal", ...baseFontVariantNumeric }, fontVariantNumericProperties]],
-  ["slashed-zero", [{ "--un-slashed-zero": "slashed-zero", ...baseFontVariantNumeric }, fontVariantNumericProperties]],
-  ["lining-nums", [{ "--un-numeric-figure": "lining-nums", ...baseFontVariantNumeric }, fontVariantNumericProperties]],
-  ["oldstyle-nums", [{ "--un-numeric-figure": "oldstyle-nums", ...baseFontVariantNumeric }, fontVariantNumericProperties]],
-  ["proportional-nums", [{ "--un-numeric-spacing": "proportional-nums", ...baseFontVariantNumeric }, fontVariantNumericProperties]],
-  ["tabular-nums", [{ "--un-numeric-spacing": "tabular-nums", ...baseFontVariantNumeric }, fontVariantNumericProperties]],
-  ["diagonal-fractions", [{ "--un-numeric-fraction": "diagonal-fractions", ...baseFontVariantNumeric }, fontVariantNumericProperties]],
-  ["stacked-fractions", [{ "--un-numeric-fraction": "stacked-fractions", ...baseFontVariantNumeric }, fontVariantNumericProperties]],
+  ["ordinal", [{ "--un-ordinal": "ordinal", ...baseFontVariantNumeric }, ...fontVariantNumericProperties]],
+  ["slashed-zero", [{ "--un-slashed-zero": "slashed-zero", ...baseFontVariantNumeric }, ...fontVariantNumericProperties]],
+  ["lining-nums", [{ "--un-numeric-figure": "lining-nums", ...baseFontVariantNumeric }, ...fontVariantNumericProperties]],
+  ["oldstyle-nums", [{ "--un-numeric-figure": "oldstyle-nums", ...baseFontVariantNumeric }, ...fontVariantNumericProperties]],
+  ["proportional-nums", [{ "--un-numeric-spacing": "proportional-nums", ...baseFontVariantNumeric }, ...fontVariantNumericProperties]],
+  ["tabular-nums", [{ "--un-numeric-spacing": "tabular-nums", ...baseFontVariantNumeric }, ...fontVariantNumericProperties]],
+  ["diagonal-fractions", [{ "--un-numeric-fraction": "diagonal-fractions", ...baseFontVariantNumeric }, ...fontVariantNumericProperties]],
+  ["stacked-fractions", [{ "--un-numeric-fraction": "stacked-fractions", ...baseFontVariantNumeric }, ...fontVariantNumericProperties]],
   ["normal-nums", [{ "font-variant-numeric": "normal" }]]
 ];
 function handleText([, s = "base"], { theme }) {

package/dist/shared/{preset-wind4.DXr6hHdY.mjs → preset-wind4.BgYY8vln.mjs}

@@ -1,5 +1,5 @@
 import { variantGetParameter, variantMatcher, variantGetBracket, variantParentMatcher, getBracket, hasThemeFn, transformThemeFn, getStringComponent } from '@unocss/rule-utils';
-import { b as h, A as resolveBreakpoints, C as CONTROL_MINI_NO_NEGATIVE, j as cssMathFnRE, k as cssVarFnRE, z as hasParseableColor } from './preset-wind4.CkxnR6p3.mjs';
+import { c as h, r as resolveBreakpoints, C as CONTROL_MINI_NO_NEGATIVE, k as cssMathFnRE, l as cssVarFnRE, B as hasParseableColor } from './preset-wind4.CbSMpnSp.mjs';
 import { escapeRegExp, escapeSelector } from '@unocss/core';
 
 const variantAria = {

package/dist/shared/{preset-wind4.CkxnR6p3.mjs → preset-wind4.CbSMpnSp.mjs}

@@ -1,4 +1,4 @@
-import { toArray, escapeSelector } from '@unocss/core';
+import { toArray, escapeSelector, symbols } from '@unocss/core';
 import { createValueHandler, parseCssColor, getStringComponents, colorToString, getStringComponent } from '@unocss/rule-utils';
 
 const PRESET_NAME = "@unocss/preset-wind4";
@@ -140,6 +140,7 @@ const unitOnlyMap = {
 };
 const bracketTypeRe = /^\[(color|image|length|size|position|quoted|string):/i;
 const splitComma = /,(?![^()]*\))/g;
+const remRE = /(-?[.\d]+)rem/g;
 
 const cssProps = [
   // basic props
@@ -673,7 +674,22 @@ function defineProperty(property, options = {}) {
     inherits = false,
     initialValue
   } = options;
-  return `@property ${property} {syntax: "${syntax}";inherits: ${inherits};${initialValue != null ? `initial-value: ${initialValue};` : ""}}`;
+  const value = {
+    [symbols.shortcutsNoMerge]: true,
+    [symbols.noMerge]: true,
+    [symbols.variants]: () => [
+      {
+        parent: "",
+        layer: "cssvar-property",
+        selector: () => `@property ${property}`
+      }
+    ],
+    syntax: JSON.stringify(syntax),
+    inherits: inherits ? "true" : "false"
+  };
+  if (initialValue != null)
+    value["initial-value"] = JSON.stringify(initialValue);
+  return value;
 }
 function detectThemeValue(value, theme) {
   if (value.startsWith("var(")) {
@@ -689,4 +705,4 @@ function detectThemeValue(value, theme) {
   }
 }
 
-export { resolveBreakpoints as A, resolveVerticalBreakpoints as B, CONTROL_MINI_NO_NEGATIVE as C, makeGlobalStaticRules as D, isCSSMathFn as E, isSize as F, transformXYZ as G, camelize as H, hyphenate as I, compressCSS as J, defineProperty as K, detectThemeValue as L, bracketTypeRe as M, PRESET_NAME as P, SpecialColorKey as S, themeTracking as a, h as b, cornerMap as c, directionMap as d, xyzArray as e, positionMap as f, globalKeywords as g, handler as h, insetMap as i, cssMathFnRE as j, cssVarFnRE as k, directionSize as l, colorableShadows as m, numberResolver as n, colorCSSGenerator as o, passThemeKey as p, colorResolver as q, parseColor as r, splitShorthand as s, trackedTheme as t, parseThemeColor as u, valueHandlers as v, getThemeByKey as w, xyzMap as x, colorVariable as y, hasParseableColor as z };
+export { colorVariable as A, hasParseableColor as B, CONTROL_MINI_NO_NEGATIVE as C, resolveVerticalBreakpoints as D, makeGlobalStaticRules as E, isCSSMathFn as F, isSize as G, transformXYZ as H, camelize as I, hyphenate as J, compressCSS as K, defineProperty as L, detectThemeValue as M, bracketTypeRe as N, PRESET_NAME as P, SpecialColorKey as S, remRE as a, themeTracking as b, h as c, directionMap as d, cornerMap as e, xyzArray as f, positionMap as g, handler as h, insetMap as i, globalKeywords as j, cssMathFnRE as k, cssVarFnRE as l, directionSize as m, numberResolver as n, colorableShadows as o, passThemeKey as p, colorCSSGenerator as q, resolveBreakpoints as r, splitShorthand as s, trackedTheme as t, colorResolver as u, valueHandlers as v, parseColor as w, xyzMap as x, parseThemeColor as y, getThemeByKey as z };

package/dist/shared/{preset-wind4.DhDf1e1c.mjs → preset-wind4.Ch1Z_NI2.mjs}

@@ -1,5 +1,5 @@
 import { isString } from '@unocss/core';
-import { A as resolveBreakpoints } from './preset-wind4.CkxnR6p3.mjs';
+import { r as resolveBreakpoints } from './preset-wind4.CbSMpnSp.mjs';
 
 const containerParent = [
   [/^@container(?:\/(\w+))?(?:-(normal))?$/, ([, l, v]) => {

package/dist/shared/preset-wind4.Pg33yPuf.mjs

@@ -0,0 +1,57 @@
+import { toArray } from '@unocss/core';
+
+function important({ important: option }) {
+  if (option == null || option === false)
+    return [];
+  const wrapWithIs = (selector) => {
+    if (selector.startsWith(":is(") && selector.endsWith(")"))
+      return selector;
+    if (selector.includes("::"))
+      return selector.replace(/(.*?)((?:\s\*)?::.*)/, ":is($1)$2");
+    return `:is(${selector})`;
+  };
+  return [
+    option === true ? (util) => {
+      util.entries.forEach((i) => {
+        if (i[1] != null && !String(i[1]).endsWith("!important"))
+          i[1] += " !important";
+      });
+    } : (util) => {
+      if (!util.selector.startsWith(option))
+        util.selector = `${option} ${wrapWithIs(util.selector)}`;
+    }
+  ];
+}
+
+function utility({ utilityResolver }) {
+  const processor = (util) => {
+    const resolvers = toArray(utilityResolver);
+    util.entries.forEach((i) => {
+      for (const resolver of resolvers) {
+        resolver(i, "default", {});
+      }
+    });
+  };
+  return utilityResolver ? [processor] : [];
+}
+
+function varPrefix({ variablePrefix: prefix }) {
+  const processor = (obj) => {
+    obj.entries.forEach((i) => {
+      i[0] = i[0].replace(/^--un-/, `--${prefix}`);
+      if (typeof i[1] === "string")
+        i[1] = i[1].replace(/var\(--un-/g, `var(--${prefix}`);
+    });
+  };
+  return prefix !== "un-" ? [processor] : [];
+}
+
+function postprocessors(options) {
+  return [
+    important,
+    varPrefix,
+    utility
+  ].flatMap((i) => i(options));
+}
+
+export { important as i, postprocessors as p, utility as u, varPrefix as v };

package/dist/shortcuts.mjs

@@ -1,5 +1,5 @@
-export { s as shortcuts } from './shared/preset-wind4.BwU-POWl.mjs';
-import './shared/preset-wind4.DhDf1e1c.mjs';
+export { s as shortcuts } from './shared/preset-wind4.BLH55jNO.mjs';
+import './shared/preset-wind4.Ch1Z_NI2.mjs';
 import '@unocss/core';
-import './shared/preset-wind4.CkxnR6p3.mjs';
+import './shared/preset-wind4.CbSMpnSp.mjs';
 import '@unocss/rule-utils';

package/dist/utils.d.mts

@@ -1,4 +1,4 @@
-import { Arrayable, DynamicMatcher, RuleContext, CSSObject, CSSValueInput, VariantContext, StaticRule } from '@unocss/core';
+import { Arrayable, CSSEntry, DynamicMatcher, RuleContext, CSSObject, CSSValueInput, VariantContext, StaticRule } from '@unocss/core';
 import * as _unocss_rule_utils from '@unocss/rule-utils';
 export * from '@unocss/rule-utils';
 import { T as Theme } from './shared/preset-wind4.BXbWGSRz.mjs';
@@ -70,6 +70,8 @@ declare const globalKeywords: string[];
 declare const cssMathFnRE: RegExp;
 declare const cssVarFnRE: RegExp;
 
+declare function createRemToPxResolver(base?: number): (utility: CSSEntry) => void;
+
 declare const CONTROL_MINI_NO_NEGATIVE = "$$mini-no-negative";
 declare const SpecialColorKey: {
     transparent: string;
@@ -88,7 +90,7 @@ declare function directionSize(propertyPrefix: string): DynamicMatcher<Theme>;
  */
 declare function splitShorthand(body: string, type: string): string[] | undefined;
 declare function colorableShadows(shadows: string | string[], colorVar: string): string[];
-declare function colorCSSGenerator(data: ReturnType<typeof parseColor>, property: string, varName: string, ctx?: RuleContext<Theme>): [CSSObject, string?] | undefined;
+declare function colorCSSGenerator(data: ReturnType<typeof parseColor>, property: string, varName: string, ctx?: RuleContext<Theme>): [CSSObject, ...CSSValueInput[]] | undefined;
 declare function colorResolver(property: string, varName: string): ([, body]: string[], ctx: RuleContext<Theme>) => (CSSValueInput | string)[] | undefined;
 /**
  * Parse color string into {@link ParsedColorValue} (if possible). Color value will first be matched to theme object before parsing.
@@ -143,7 +145,7 @@ declare function defineProperty(property: string, options?: {
     syntax?: string;
     inherits?: boolean;
     initialValue?: unknown;
-}): string;
+}): CSSValueInput;
 declare function detectThemeValue(value: string, theme: Theme): void;
 
-export { CONTROL_MINI_NO_NEGATIVE, PRESET_NAME, SpecialColorKey, camelize, colorCSSGenerator, colorResolver, colorVariable, colorableShadows, compressCSS, cornerMap, cssMathFnRE, cssVarFnRE, defineProperty, detectThemeValue, directionMap, directionSize, getThemeByKey, globalKeywords, h, handler, hasParseableColor, hyphenate, insetMap, isCSSMathFn, isSize, makeGlobalStaticRules, numberResolver, parseColor, parseThemeColor, passThemeKey, positionMap, resolveBreakpoints, resolveVerticalBreakpoints, splitShorthand, themeTracking, trackedTheme, transformXYZ, handlers as valueHandlers, xyzArray, xyzMap };
+export { CONTROL_MINI_NO_NEGATIVE, PRESET_NAME, SpecialColorKey, camelize, colorCSSGenerator, colorResolver, colorVariable, colorableShadows, compressCSS, cornerMap, createRemToPxResolver, cssMathFnRE, cssVarFnRE, defineProperty, detectThemeValue, directionMap, directionSize, getThemeByKey, globalKeywords, h, handler, hasParseableColor, hyphenate, insetMap, isCSSMathFn, isSize, makeGlobalStaticRules, numberResolver, parseColor, parseThemeColor, passThemeKey, positionMap, resolveBreakpoints, resolveVerticalBreakpoints, splitShorthand, themeTracking, trackedTheme, transformXYZ, handlers as valueHandlers, xyzArray, xyzMap };

package/dist/utils.d.ts

@@ -1,4 +1,4 @@
-import { Arrayable, DynamicMatcher, RuleContext, CSSObject, CSSValueInput, VariantContext, StaticRule } from '@unocss/core';
+import { Arrayable, CSSEntry, DynamicMatcher, RuleContext, CSSObject, CSSValueInput, VariantContext, StaticRule } from '@unocss/core';
 import * as _unocss_rule_utils from '@unocss/rule-utils';
 export * from '@unocss/rule-utils';
 import { T as Theme } from './shared/preset-wind4.BXbWGSRz.js';
@@ -70,6 +70,8 @@ declare const globalKeywords: string[];
 declare const cssMathFnRE: RegExp;
 declare const cssVarFnRE: RegExp;
 
+declare function createRemToPxResolver(base?: number): (utility: CSSEntry) => void;
+
 declare const CONTROL_MINI_NO_NEGATIVE = "$$mini-no-negative";
 declare const SpecialColorKey: {
     transparent: string;
@@ -88,7 +90,7 @@ declare function directionSize(propertyPrefix: string): DynamicMatcher<Theme>;
  */
 declare function splitShorthand(body: string, type: string): string[] | undefined;
 declare function colorableShadows(shadows: string | string[], colorVar: string): string[];
-declare function colorCSSGenerator(data: ReturnType<typeof parseColor>, property: string, varName: string, ctx?: RuleContext<Theme>): [CSSObject, string?] | undefined;
+declare function colorCSSGenerator(data: ReturnType<typeof parseColor>, property: string, varName: string, ctx?: RuleContext<Theme>): [CSSObject, ...CSSValueInput[]] | undefined;
 declare function colorResolver(property: string, varName: string): ([, body]: string[], ctx: RuleContext<Theme>) => (CSSValueInput | string)[] | undefined;
 /**
  * Parse color string into {@link ParsedColorValue} (if possible). Color value will first be matched to theme object before parsing.
@@ -143,7 +145,7 @@ declare function defineProperty(property: string, options?: {
     syntax?: string;
     inherits?: boolean;
     initialValue?: unknown;
-}): string;
+}): CSSValueInput;
 declare function detectThemeValue(value: string, theme: Theme): void;
 
-export { CONTROL_MINI_NO_NEGATIVE, PRESET_NAME, SpecialColorKey, camelize, colorCSSGenerator, colorResolver, colorVariable, colorableShadows, compressCSS, cornerMap, cssMathFnRE, cssVarFnRE, defineProperty, detectThemeValue, directionMap, directionSize, getThemeByKey, globalKeywords, h, handler, hasParseableColor, hyphenate, insetMap, isCSSMathFn, isSize, makeGlobalStaticRules, numberResolver, parseColor, parseThemeColor, passThemeKey, positionMap, resolveBreakpoints, resolveVerticalBreakpoints, splitShorthand, themeTracking, trackedTheme, transformXYZ, handlers as valueHandlers, xyzArray, xyzMap };
+export { CONTROL_MINI_NO_NEGATIVE, PRESET_NAME, SpecialColorKey, camelize, colorCSSGenerator, colorResolver, colorVariable, colorableShadows, compressCSS, cornerMap, createRemToPxResolver, cssMathFnRE, cssVarFnRE, defineProperty, detectThemeValue, directionMap, directionSize, getThemeByKey, globalKeywords, h, handler, hasParseableColor, hyphenate, insetMap, isCSSMathFn, isSize, makeGlobalStaticRules, numberResolver, parseColor, parseThemeColor, passThemeKey, positionMap, resolveBreakpoints, resolveVerticalBreakpoints, splitShorthand, themeTracking, trackedTheme, transformXYZ, handlers as valueHandlers, xyzArray, xyzMap };

package/dist/utils.mjs

@@ -1,3 +1,13 @@
-export { C as CONTROL_MINI_NO_NEGATIVE, P as PRESET_NAME, S as SpecialColorKey, H as camelize, o as colorCSSGenerator, q as colorResolver, y as colorVariable, m as colorableShadows, J as compressCSS, c as cornerMap, j as cssMathFnRE, k as cssVarFnRE, K as defineProperty, L as detectThemeValue, d as directionMap, l as directionSize, w as getThemeByKey, g as globalKeywords, b as h, h as handler, z as hasParseableColor, I as hyphenate, i as insetMap, E as isCSSMathFn, F as isSize, D as makeGlobalStaticRules, n as numberResolver, r as parseColor, u as parseThemeColor, p as passThemeKey, f as positionMap, A as resolveBreakpoints, B as resolveVerticalBreakpoints, s as splitShorthand, a as themeTracking, t as trackedTheme, G as transformXYZ, v as valueHandlers, e as xyzArray, x as xyzMap } from './shared/preset-wind4.CkxnR6p3.mjs';
+import { a as remRE } from './shared/preset-wind4.CbSMpnSp.mjs';
+export { C as CONTROL_MINI_NO_NEGATIVE, P as PRESET_NAME, S as SpecialColorKey, I as camelize, q as colorCSSGenerator, u as colorResolver, A as colorVariable, o as colorableShadows, K as compressCSS, e as cornerMap, k as cssMathFnRE, l as cssVarFnRE, L as defineProperty, M as detectThemeValue, d as directionMap, m as directionSize, z as getThemeByKey, j as globalKeywords, c as h, h as handler, B as hasParseableColor, J as hyphenate, i as insetMap, F as isCSSMathFn, G as isSize, E as makeGlobalStaticRules, n as numberResolver, w as parseColor, y as parseThemeColor, p as passThemeKey, g as positionMap, r as resolveBreakpoints, D as resolveVerticalBreakpoints, s as splitShorthand, b as themeTracking, t as trackedTheme, H as transformXYZ, v as valueHandlers, f as xyzArray, x as xyzMap } from './shared/preset-wind4.CbSMpnSp.mjs';
 export * from '@unocss/rule-utils';
 import '@unocss/core';
+
+function createRemToPxResolver(base = 16) {
+  return (utility) => {
+    if (typeof utility[1] === "string" && remRE.test(utility[1]))
+      utility[1] = utility[1].replace(remRE, (_, p1) => `${p1 * base}px`);
+  };
+}
+
+export { createRemToPxResolver };

package/dist/variants.d.mts

@@ -2,8 +2,8 @@ import { VariantObject, Variant, VariantFunction } from '@unocss/core';
 import { T as Theme } from './shared/preset-wind4.BXbWGSRz.mjs';
 import { PresetWind4Options } from './index.mjs';
 export { variants } from './index.mjs';
-import './shared/preset-wind4.D71xGC6i.mjs';
 import './shortcuts.mjs';
+import './shared/preset-wind4.D71xGC6i.mjs';
 import './shared/preset-wind4.BOe5kxIw.mjs';
 
 declare const variantAria: VariantObject<Theme>;

package/dist/variants.d.ts

@@ -2,8 +2,8 @@ import { VariantObject, Variant, VariantFunction } from '@unocss/core';
 import { T as Theme } from './shared/preset-wind4.BXbWGSRz.js';
 import { PresetWind4Options } from './index.js';
 export { variants } from './index.js';
-import './shared/preset-wind4.Ca5oWgxX.js';
 import './shortcuts.js';
+import './shared/preset-wind4.Ca5oWgxX.js';
 import './shared/preset-wind4.BOe5kxIw.js';
 
 declare const variantAria: VariantObject<Theme>;

package/dist/variants.mjs

@@ -1,4 +1,4 @@
-export { c as calcMaxWidthBySize, D as placeholderModifier, v as variantAria, b as variantBreakpoints, d as variantChildren, h as variantColorsMediaOrClass, i as variantColorsScheme, e as variantCombinators, g as variantContainerQuery, q as variantContrasts, w as variantCssLayer, p as variantCustomMedia, j as variantDataAttribute, t as variantForcedColors, n as variantImportant, x as variantInternalLayer, m as variantLanguageDirections, r as variantMotions, C as variantNegative, s as variantOrientations, H as variantPartClasses, o as variantPrint, F as variantPseudoClassFunctions, E as variantPseudoClassesAndElements, y as variantScope, u as variantSelector, I as variantStartingStyle, B as variantStickyHover, J as variantSupports, f as variantSvgCombinators, a as variantTaggedAriaAttributes, k as variantTaggedDataAttributes, G as variantTaggedPseudoClasses, A as variantTheme, z as variantVariables, l as variants } from './shared/preset-wind4.DXr6hHdY.mjs';
+export { c as calcMaxWidthBySize, D as placeholderModifier, v as variantAria, b as variantBreakpoints, d as variantChildren, h as variantColorsMediaOrClass, i as variantColorsScheme, e as variantCombinators, g as variantContainerQuery, q as variantContrasts, w as variantCssLayer, p as variantCustomMedia, j as variantDataAttribute, t as variantForcedColors, n as variantImportant, x as variantInternalLayer, m as variantLanguageDirections, r as variantMotions, C as variantNegative, s as variantOrientations, H as variantPartClasses, o as variantPrint, F as variantPseudoClassFunctions, E as variantPseudoClassesAndElements, y as variantScope, u as variantSelector, I as variantStartingStyle, B as variantStickyHover, J as variantSupports, f as variantSvgCombinators, a as variantTaggedAriaAttributes, k as variantTaggedDataAttributes, G as variantTaggedPseudoClasses, A as variantTheme, z as variantVariables, l as variants } from './shared/preset-wind4.BgYY8vln.mjs';
 import '@unocss/rule-utils';
-import './shared/preset-wind4.CkxnR6p3.mjs';
+import './shared/preset-wind4.CbSMpnSp.mjs';
 import '@unocss/core';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@unocss/preset-wind4",
   "type": "module",
-  "version": "66.1.0-beta.7",
+  "version": "66.1.0-beta.9",
   "description": "Tailwind 4 compact preset for UnoCSS",
   "author": "Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -65,9 +65,9 @@
     "dist"
   ],
   "dependencies": {
-    "@unocss/core": "66.1.0-beta.7",
-    "@unocss/extractor-arbitrary-variants": "66.1.0-beta.7",
-    "@unocss/rule-utils": "66.1.0-beta.7"
+    "@unocss/core": "66.1.0-beta.9",
+    "@unocss/rule-utils": "66.1.0-beta.9",
+    "@unocss/extractor-arbitrary-variants": "66.1.0-beta.9"
   },
   "scripts": {
     "build": "unbuild",