@unocss/preset-mini 0.29.3 → 0.29.6

package/dist/chunks/default.cjs

@@ -126,7 +126,15 @@ const spacing = {
 };
 const duration = {
   DEFAULT: "150ms",
-  none: "0ms"
+  none: "0ms",
+  75: "75ms",
+  100: "100ms",
+  150: "150ms",
+  200: "200ms",
+  300: "300ms",
+  500: "500ms",
+  700: "700ms",
+  1e3: "1000ms"
 };
 const borderRadius = {
   "DEFAULT": "0.25rem",

package/dist/chunks/default.mjs

@@ -124,7 +124,15 @@ const spacing = {
 };
 const duration = {
   DEFAULT: "150ms",
-  none: "0ms"
+  none: "0ms",
+  75: "75ms",
+  100: "100ms",
+  150: "150ms",
+  200: "200ms",
+  300: "300ms",
+  500: "500ms",
+  700: "700ms",
+  1e3: "1000ms"
 };
 const borderRadius = {
   "DEFAULT": "0.25rem",

package/dist/chunks/default2.cjs

@@ -168,11 +168,27 @@ const transitions = [
         "transition-duration": duration
       };
     }
-  }],
-  [/^(?:transition-)?duration-(.+)$/, ([, d], { theme }) => ({ "transition-duration": theme.duration?.[d || "DEFAULT"] ?? utilities.handler.bracket.cssvar.time(d) })],
-  [/^(?:transition-)?delay-(.+)$/, ([, d], { theme }) => ({ "transition-delay": theme.duration?.[d || "DEFAULT"] ?? utilities.handler.bracket.cssvar.time(d) })],
-  [/^(?:transition-)?ease(?:-(.+))?$/, ([, d], { theme }) => ({ "transition-timing-function": theme.easing?.[d || "DEFAULT"] ?? utilities.handler.bracket.cssvar(d) })],
-  [/^(?:transition-)?property-(.+)$/, ([, v]) => ({ "transition-property": utilities.handler.global(v) || transitionProperty(v) })],
+  }, { autocomplete: `transition-(${Object.keys(transitionPropertyGroup).join("|")})` }],
+  [
+    /^(?:transition-)?duration-(.+)$/,
+    ([, d], { theme }) => ({ "transition-duration": theme.duration?.[d || "DEFAULT"] ?? utilities.handler.bracket.cssvar.time(d) }),
+    { autocomplete: ["transition-duration-$duration", "duration-$duration"] }
+  ],
+  [
+    /^(?:transition-)?delay-(.+)$/,
+    ([, d], { theme }) => ({ "transition-delay": theme.duration?.[d || "DEFAULT"] ?? utilities.handler.bracket.cssvar.time(d) }),
+    { autocomplete: ["transition-delay-$duration", "delay-$duration"] }
+  ],
+  [
+    /^(?:transition-)?ease(?:-(.+))?$/,
+    ([, d], { theme }) => ({ "transition-timing-function": theme.easing?.[d || "DEFAULT"] ?? utilities.handler.bracket.cssvar(d) }),
+    { autocomplete: ["transition-ease-(linear|in|out|in-out|DEFAULT)", "ease-(linear|in|out|in-out|DEFAULT)"] }
+  ],
+  [
+    /^(?:transition-)?property-(.+)$/,
+    ([, v]) => ({ "transition-property": utilities.handler.global(v) || transitionProperty(v) }),
+    { autocomplete: [`transition-property-(${["inherit", "initial", "revert", "unset", ...Object.keys(transitionPropertyGroup)].join("|")})`] }
+  ],
   ["transition-none", { transition: "none" }]
 ];
 
@@ -236,11 +252,11 @@ const fonts = [
     const size = themed?.[0] ?? utilities.handler.bracket.cssvar.rem(s);
     if (size != null)
       return { "font-size": size };
-  }],
+  }, { autocomplete: "text-size-$fontSize" }],
   [
     /^(?:font|fw)-?([^-]+)$/,
     ([, s]) => ({ "font-weight": weightMap[s] || utilities.handler.global.number(s) }),
-    { autocomplete: "font-(100|200|300|400|500|600|700)" }
+    { autocomplete: `(font|fw)-(100|200|300|400|500|600|700|800|900|${Object.keys(weightMap).join("|")})` }
   ],
   [
     /^(?:leading|lh)-(.+)$/,
@@ -271,12 +287,12 @@ const tabSizes = [
   }]
 ];
 const textIndents = [
-  [/^indent(?:-(.+))?$/, ([, s], { theme }) => ({ "text-indent": theme.textIndent?.[s || "DEFAULT"] || utilities.handler.bracket.cssvar.global.fraction.rem(s) })]
+  [/^indent(?:-(.+))?$/, ([, s], { theme }) => ({ "text-indent": theme.textIndent?.[s || "DEFAULT"] || utilities.handler.bracket.cssvar.global.fraction.rem(s) }), { autocomplete: "indent-$textIndent" }]
 ];
 const textStrokes = [
-  [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => ({ "-webkit-text-stroke-width": theme.textStrokeWidth?.[s || "DEFAULT"] || utilities.handler.bracket.cssvar.px(s) })],
-  [/^text-stroke-(.+)$/, utilities.colorResolver("-webkit-text-stroke-color", "text-stroke")],
-  [/^text-stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-stroke-opacity": utilities.handler.bracket.percent(opacity) })]
+  [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => ({ "-webkit-text-stroke-width": theme.textStrokeWidth?.[s || "DEFAULT"] || utilities.handler.bracket.cssvar.px(s) }), { autocomplete: "text-stroke-$textStrokeWidth" }],
+  [/^text-stroke-(.+)$/, utilities.colorResolver("-webkit-text-stroke-color", "text-stroke"), { autocomplete: "text-stroke-$colors" }],
+  [/^text-stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-stroke-opacity": utilities.handler.bracket.percent(opacity) }), { autocomplete: "text-stroke-(op|opacity)-<percent>" }]
 ];
 const textShadows = [
   [/^text-shadow(?:-(.+))?$/, ([, s], { theme }) => {
@@ -288,9 +304,9 @@ const textShadows = [
       };
     }
     return { "text-shadow": utilities.handler.bracket.cssvar(s) };
-  }],
-  [/^text-shadow-color-(.+)$/, utilities.colorResolver("--un-text-shadow-color", "text-shadow")],
-  [/^text-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-shadow-opacity": utilities.handler.bracket.percent(opacity) })]
+  }, { autocomplete: "text-shadow-$textShadow" }],
+  [/^text-shadow-color-(.+)$/, utilities.colorResolver("--un-text-shadow-color", "text-shadow"), { autocomplete: "text-shadow-color-$colors" }],
+  [/^text-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-shadow-opacity": utilities.handler.bracket.percent(opacity) }), { autocomplete: "text-shadow-color-(op|opacity)-<percent>" }]
 ];
 
 const directions = {
@@ -308,8 +324,8 @@ const handleGap = ([, d = "", s], { theme }) => {
   }
 };
 const gaps = [
-  [/^(?:flex-|grid-)?gap-?()(.+)$/, handleGap, { autocomplete: "gap-<num>" }],
-  [/^(?:flex-|grid-)?gap-([xy])-?(.+)$/, handleGap, { autocomplete: "gap-(x|y)-<num>" }]
+  [/^(?:flex-|grid-)?gap-?()(.+)$/, handleGap, { autocomplete: ["gap-$spacing", "gap-<num>"] }],
+  [/^(?:flex-|grid-)?gap-([xy])-?(.+)$/, handleGap, { autocomplete: ["gap-(x|y)-$spacing", "gap-(x|y)-<num>"] }]
 ];
 
 const rowCol = (s) => s.replace("col", "column");
@@ -340,7 +356,7 @@ const grids = [
     const v = utilities.handler.bracket.number(s);
     if (v != null)
       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`]: utilities.handler.bracket.cssvar(v) ?? v })],
   [/^(?:grid-)?(row|col)-end-(.+)$/, ([, c, v]) => ({ [`grid-${rowCol(c)}-end`]: utilities.handler.bracket.cssvar(v) ?? v })],
   [/^(?:grid-)?auto-(rows|cols)-(.+)$/, ([, c, v], { theme }) => ({ [`grid-auto-${rowCol(c)}`]: autoDirection(c, theme, v) })],
@@ -363,7 +379,7 @@ const overflowValues = [
   "scroll"
 ];
 const overflows = [
-  [/^(?:overflow|of)-(.+)$/, ([, v]) => overflowValues.includes(v) ? { overflow: v } : void 0],
+  [/^(?:overflow|of)-(.+)$/, ([, v]) => overflowValues.includes(v) ? { overflow: v } : void 0, { autocomplete: [`(overflow|of)-${overflowValues.join("|")}`, `(overflow|of)-(x|y)-${overflowValues.join("|")}`] }],
   [/^(?:overflow|of)-([xy])-(.+)$/, ([, d, v]) => overflowValues.includes(v) ? { [`overflow-${d}`]: v } : void 0]
 ];
 
@@ -440,7 +456,18 @@ function handleInsetValues([, d, v], ctx) {
     return utilities.insetMap[d].map((i) => [i.slice(1), r]);
 }
 const insets = [
-  [/^(?:position-|pos-)?inset-(.+)$/, ([, v], ctx) => ({ inset: handleInsetValue(v, ctx) })],
+  [
+    /^(?:position-|pos-)?inset-(.+)$/,
+    ([, v], ctx) => ({ inset: handleInsetValue(v, ctx) }),
+    {
+      autocomplete: [
+        "(position|pos)-inset-<directions>-$spacing",
+        "(position|pos)-inset-(block|inline)-$spacing",
+        "(position|pos)-inset-(bs|be|is|ie)-$spacing",
+        "(position|pos)-(top|left|right|bottom)-$spacing"
+      ]
+    }
+  ],
   [/^(?:position-|pos-)?inset-([xy])-(.+)$/, handleInsetValues],
   [/^(?:position-|pos-)?inset-([rltbse])-(.+)$/, handleInsetValues],
   [/^(?:position-|pos-)?inset-(block|inline)-(.+)$/, handleInsetValues],
@@ -458,7 +485,7 @@ const floats = [
 ];
 const zIndexes = [
   [/^z([\d.]+)$/, ([, v]) => ({ "z-index": utilities.handler.number(v) })],
-  [/^z-(.+)$/, ([, v]) => ({ "z-index": utilities.handler.bracket.cssvar.auto.number(v) })]
+  [/^z-(.+)$/, ([, v]) => ({ "z-index": utilities.handler.bracket.cssvar.auto.number(v) }), { autocomplete: "z-<num>" }]
 ];
 const boxSizing = [
   ["box-border", { "box-sizing": "border-box" }],
@@ -502,7 +529,7 @@ const userSelects = [
   ["select-none", { "user-select": "none" }]
 ];
 const whitespaces = [
-  [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v })]
+  [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v }), { autocomplete: "(whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)" }]
 ];
 const contents = [
   [/^content-\[(.+)\]$/, ([, v]) => ({ content: `"${v}"` })],
@@ -563,14 +590,14 @@ const rings = [
         }
       ];
     }
-  }],
-  [/^ring-(?:width-|size-)(.+)$/, ([, d], { theme }) => ({ "--un-ring-width": theme.lineWidth?.[d] ?? utilities.handler.bracket.cssvar.px(d) })],
+  }, { 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-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) })],
+  [/^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")],
-  [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-offset-opacity": utilities.handler.bracket.percent(opacity) })],
+  [/^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-inset", { "--un-ring-inset": "inset" }]
 ];
 
@@ -590,9 +617,9 @@ const boxShadows = [
         }
       ];
     }
-  }],
-  [/^shadow-(.+)$/, utilities.colorResolver("--un-shadow-color", "shadow")],
-  [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": utilities.handler.bracket.percent(opacity) })],
+  }, { 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-inset", { "--un-shadow-inset": "inset" }]
 ];
 
@@ -619,10 +646,28 @@ function getSizeValue(minmax, hw, theme, prop) {
   return utilities.handler.bracket.cssvar.auto.fraction.rem(prop);
 }
 const sizes = [
-  [/^(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) })],
-  [/^(min-|max-)?(h)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.verticalBreakpoints?.[s] })],
-  [/^(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.breakpoints?.[s] })]
+  [
+    /^(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], { theme }) => ({ [getPropName(m, w)]: theme.verticalBreakpoints?.[s] }), { autocomplete: ["h-screen-$verticalBreakpoints", "(min|max)-h-screen-$verticalBreakpoints"] }],
+  [/^(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.breakpoints?.[s] }), { autocomplete: ["w-screen-$breakpoints", "(min|max)-w-screen-$breakpoints"] }]
 ];
 function getAspectRatio(prop) {
   if (/^\d+\/\d+$/.test(prop))
@@ -636,15 +681,15 @@ function getAspectRatio(prop) {
   return utilities.handler.bracket.cssvar.auto.number(prop);
 }
 const aspectRatio = [
-  [/^aspect-(?:ratio-)?(.+)$/, ([, d]) => ({ "aspect-ratio": getAspectRatio(d) })]
+  [/^aspect-(?:ratio-)?(.+)$/, ([, d]) => ({ "aspect-ratio": getAspectRatio(d) }), { autocomplete: ["aspect-(square|video)", "aspect-ratio-(square|video)"] }]
 ];
 
 const paddings = [
   [/^pa?()-?(-?.+)$/, utilities.directionSize("padding"), { autocomplete: ["(m|p)<num>", "(m|p)-<num>"] }],
   [/^p-?([xy])-?(-?.+)$/, utilities.directionSize("padding")],
   [/^p-?([rltbse])-?(-?.+)$/, utilities.directionSize("padding"), { autocomplete: "(m|p)<directions>-<num>" }],
-  [/^p-(block|inline)-(-?.+)$/, utilities.directionSize("padding")],
-  [/^p-?([bi][se])-?(-?.+)$/, utilities.directionSize("padding")]
+  [/^p-(block|inline)-(-?.+)$/, utilities.directionSize("padding"), { autocomplete: "(m|p)-(block|inline)-<num>" }],
+  [/^p-?([bi][se])-?(-?.+)$/, utilities.directionSize("padding"), { autocomplete: "(m|p)-(bs|be|is|ie)-<num>" }]
 ];
 const margins = [
   [/^ma?()-?(-?.+)$/, utilities.directionSize("margin")],
@@ -701,7 +746,7 @@ const transformBase = {
   [core.CONTROL_SHORTCUT_NO_MERGE]: ""
 };
 const transforms = [
-  [/^(?:transform-)?origin-(.+)$/, ([, s]) => ({ "transform-origin": utilities.positionMap[s] ?? utilities.handler.bracket.cssvar(s) })],
+  [/^(?: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-)?perspect(?:ive)?-(.+)$/, ([, s]) => {
     const v = utilities.handler.bracket.cssvar.px.numberWithUnit(s);
     if (v != null) {
@@ -858,14 +903,14 @@ const textDecorations = [
 ];
 
 const svgUtilities = [
-  [/^fill-(.+)$/, utilities.colorResolver("fill", "fill")],
-  [/^fill-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-fill-opacity": utilities.handler.bracket.percent(opacity) })],
+  [/^fill-(.+)$/, utilities.colorResolver("fill", "fill"), { autocomplete: "fill-$colors" }],
+  [/^fill-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-fill-opacity": utilities.handler.bracket.percent(opacity) }), { autocomplete: "fill-(op|opacity)-<percent>" }],
   ["fill-none", { fill: "none" }],
-  [/^stroke-(?:width-|size-)?(.+)$/, ([, s], { theme }) => ({ "stroke-width": theme.lineWidth?.[s] ?? utilities.handler.bracket.cssvar.fraction.px.number(s) })],
-  [/^stroke-dash-(.+)$/, ([, s]) => ({ "stroke-dasharray": utilities.handler.bracket.cssvar.number(s) })],
-  [/^stroke-offset-(.+)$/, ([, s], { theme }) => ({ "stroke-dashoffset": theme.lineWidth?.[s] ?? utilities.handler.bracket.cssvar.px.numberWithUnit(s) })],
-  [/^stroke-(.+)$/, utilities.colorResolver("stroke", "stroke")],
-  [/^stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-stroke-opacity": utilities.handler.bracket.percent(opacity) })],
+  [/^stroke-(?:width-|size-)?(.+)$/, ([, s], { theme }) => ({ "stroke-width": theme.lineWidth?.[s] ?? utilities.handler.bracket.cssvar.fraction.px.number(s) }), { autocomplete: ["stroke-width-$lineWidth", "stroke-size-$lineWidth"] }],
+  [/^stroke-dash-(.+)$/, ([, s]) => ({ "stroke-dasharray": utilities.handler.bracket.cssvar.number(s) }), { autocomplete: "stroke-dash-<num>" }],
+  [/^stroke-offset-(.+)$/, ([, s], { theme }) => ({ "stroke-dashoffset": theme.lineWidth?.[s] ?? utilities.handler.bracket.cssvar.px.numberWithUnit(s) }), { autocomplete: "stroke-offset-$lineWidth" }],
+  [/^stroke-(.+)$/, utilities.colorResolver("stroke", "stroke"), { autocomplete: "stroke-$colors" }],
+  [/^stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-stroke-opacity": utilities.handler.bracket.percent(opacity) }), { autocomplete: "stroke-(op|opacity)-<percent>" }],
   ["stroke-cap-square", { "stroke-linecap": "square" }],
   ["stroke-cap-round", { "stroke-linecap": "round" }],
   ["stroke-cap-auto", { "stroke-linecap": "butt" }],

package/dist/chunks/default2.mjs

@@ -166,11 +166,27 @@ const transitions = [
         "transition-duration": duration
       };
     }
-  }],
-  [/^(?:transition-)?duration-(.+)$/, ([, d], { theme }) => ({ "transition-duration": theme.duration?.[d || "DEFAULT"] ?? handler.bracket.cssvar.time(d) })],
-  [/^(?:transition-)?delay-(.+)$/, ([, d], { theme }) => ({ "transition-delay": theme.duration?.[d || "DEFAULT"] ?? handler.bracket.cssvar.time(d) })],
-  [/^(?:transition-)?ease(?:-(.+))?$/, ([, d], { theme }) => ({ "transition-timing-function": theme.easing?.[d || "DEFAULT"] ?? handler.bracket.cssvar(d) })],
-  [/^(?:transition-)?property-(.+)$/, ([, v]) => ({ "transition-property": handler.global(v) || transitionProperty(v) })],
+  }, { autocomplete: `transition-(${Object.keys(transitionPropertyGroup).join("|")})` }],
+  [
+    /^(?:transition-)?duration-(.+)$/,
+    ([, d], { theme }) => ({ "transition-duration": theme.duration?.[d || "DEFAULT"] ?? handler.bracket.cssvar.time(d) }),
+    { autocomplete: ["transition-duration-$duration", "duration-$duration"] }
+  ],
+  [
+    /^(?:transition-)?delay-(.+)$/,
+    ([, d], { theme }) => ({ "transition-delay": theme.duration?.[d || "DEFAULT"] ?? handler.bracket.cssvar.time(d) }),
+    { autocomplete: ["transition-delay-$duration", "delay-$duration"] }
+  ],
+  [
+    /^(?:transition-)?ease(?:-(.+))?$/,
+    ([, d], { theme }) => ({ "transition-timing-function": theme.easing?.[d || "DEFAULT"] ?? handler.bracket.cssvar(d) }),
+    { autocomplete: ["transition-ease-(linear|in|out|in-out|DEFAULT)", "ease-(linear|in|out|in-out|DEFAULT)"] }
+  ],
+  [
+    /^(?:transition-)?property-(.+)$/,
+    ([, v]) => ({ "transition-property": handler.global(v) || transitionProperty(v) }),
+    { autocomplete: [`transition-property-(${["inherit", "initial", "revert", "unset", ...Object.keys(transitionPropertyGroup)].join("|")})`] }
+  ],
   ["transition-none", { transition: "none" }]
 ];
 
@@ -234,11 +250,11 @@ const fonts = [
     const size = themed?.[0] ?? handler.bracket.cssvar.rem(s);
     if (size != null)
       return { "font-size": size };
-  }],
+  }, { autocomplete: "text-size-$fontSize" }],
   [
     /^(?:font|fw)-?([^-]+)$/,
     ([, s]) => ({ "font-weight": weightMap[s] || handler.global.number(s) }),
-    { autocomplete: "font-(100|200|300|400|500|600|700)" }
+    { autocomplete: `(font|fw)-(100|200|300|400|500|600|700|800|900|${Object.keys(weightMap).join("|")})` }
   ],
   [
     /^(?:leading|lh)-(.+)$/,
@@ -269,12 +285,12 @@ const tabSizes = [
   }]
 ];
 const textIndents = [
-  [/^indent(?:-(.+))?$/, ([, s], { theme }) => ({ "text-indent": theme.textIndent?.[s || "DEFAULT"] || handler.bracket.cssvar.global.fraction.rem(s) })]
+  [/^indent(?:-(.+))?$/, ([, s], { theme }) => ({ "text-indent": theme.textIndent?.[s || "DEFAULT"] || handler.bracket.cssvar.global.fraction.rem(s) }), { autocomplete: "indent-$textIndent" }]
 ];
 const textStrokes = [
-  [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => ({ "-webkit-text-stroke-width": theme.textStrokeWidth?.[s || "DEFAULT"] || handler.bracket.cssvar.px(s) })],
-  [/^text-stroke-(.+)$/, colorResolver("-webkit-text-stroke-color", "text-stroke")],
-  [/^text-stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-stroke-opacity": handler.bracket.percent(opacity) })]
+  [/^text-stroke(?:-(.+))?$/, ([, s], { theme }) => ({ "-webkit-text-stroke-width": theme.textStrokeWidth?.[s || "DEFAULT"] || handler.bracket.cssvar.px(s) }), { autocomplete: "text-stroke-$textStrokeWidth" }],
+  [/^text-stroke-(.+)$/, colorResolver("-webkit-text-stroke-color", "text-stroke"), { autocomplete: "text-stroke-$colors" }],
+  [/^text-stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-stroke-opacity": handler.bracket.percent(opacity) }), { autocomplete: "text-stroke-(op|opacity)-<percent>" }]
 ];
 const textShadows = [
   [/^text-shadow(?:-(.+))?$/, ([, s], { theme }) => {
@@ -286,9 +302,9 @@ const textShadows = [
       };
     }
     return { "text-shadow": handler.bracket.cssvar(s) };
-  }],
-  [/^text-shadow-color-(.+)$/, colorResolver("--un-text-shadow-color", "text-shadow")],
-  [/^text-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-shadow-opacity": handler.bracket.percent(opacity) })]
+  }, { autocomplete: "text-shadow-$textShadow" }],
+  [/^text-shadow-color-(.+)$/, colorResolver("--un-text-shadow-color", "text-shadow"), { autocomplete: "text-shadow-color-$colors" }],
+  [/^text-shadow-color-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-text-shadow-opacity": handler.bracket.percent(opacity) }), { autocomplete: "text-shadow-color-(op|opacity)-<percent>" }]
 ];
 
 const directions = {
@@ -306,8 +322,8 @@ const handleGap = ([, d = "", s], { theme }) => {
   }
 };
 const gaps = [
-  [/^(?:flex-|grid-)?gap-?()(.+)$/, handleGap, { autocomplete: "gap-<num>" }],
-  [/^(?:flex-|grid-)?gap-([xy])-?(.+)$/, handleGap, { autocomplete: "gap-(x|y)-<num>" }]
+  [/^(?:flex-|grid-)?gap-?()(.+)$/, handleGap, { autocomplete: ["gap-$spacing", "gap-<num>"] }],
+  [/^(?:flex-|grid-)?gap-([xy])-?(.+)$/, handleGap, { autocomplete: ["gap-(x|y)-$spacing", "gap-(x|y)-<num>"] }]
 ];
 
 const rowCol = (s) => s.replace("col", "column");
@@ -338,7 +354,7 @@ const grids = [
     const v = handler.bracket.number(s);
     if (v != null)
       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) })],
@@ -361,7 +377,7 @@ const overflowValues = [
   "scroll"
 ];
 const overflows = [
-  [/^(?:overflow|of)-(.+)$/, ([, v]) => overflowValues.includes(v) ? { overflow: v } : void 0],
+  [/^(?:overflow|of)-(.+)$/, ([, v]) => overflowValues.includes(v) ? { overflow: v } : void 0, { autocomplete: [`(overflow|of)-${overflowValues.join("|")}`, `(overflow|of)-(x|y)-${overflowValues.join("|")}`] }],
   [/^(?:overflow|of)-([xy])-(.+)$/, ([, d, v]) => overflowValues.includes(v) ? { [`overflow-${d}`]: v } : void 0]
 ];
 
@@ -438,7 +454,18 @@ function handleInsetValues([, d, v], ctx) {
     return insetMap[d].map((i) => [i.slice(1), r]);
 }
 const insets = [
-  [/^(?:position-|pos-)?inset-(.+)$/, ([, v], ctx) => ({ inset: handleInsetValue(v, ctx) })],
+  [
+    /^(?:position-|pos-)?inset-(.+)$/,
+    ([, v], ctx) => ({ inset: handleInsetValue(v, ctx) }),
+    {
+      autocomplete: [
+        "(position|pos)-inset-<directions>-$spacing",
+        "(position|pos)-inset-(block|inline)-$spacing",
+        "(position|pos)-inset-(bs|be|is|ie)-$spacing",
+        "(position|pos)-(top|left|right|bottom)-$spacing"
+      ]
+    }
+  ],
   [/^(?:position-|pos-)?inset-([xy])-(.+)$/, handleInsetValues],
   [/^(?:position-|pos-)?inset-([rltbse])-(.+)$/, handleInsetValues],
   [/^(?:position-|pos-)?inset-(block|inline)-(.+)$/, handleInsetValues],
@@ -456,7 +483,7 @@ const floats = [
 ];
 const zIndexes = [
   [/^z([\d.]+)$/, ([, v]) => ({ "z-index": handler.number(v) })],
-  [/^z-(.+)$/, ([, v]) => ({ "z-index": handler.bracket.cssvar.auto.number(v) })]
+  [/^z-(.+)$/, ([, v]) => ({ "z-index": handler.bracket.cssvar.auto.number(v) }), { autocomplete: "z-<num>" }]
 ];
 const boxSizing = [
   ["box-border", { "box-sizing": "border-box" }],
@@ -500,7 +527,7 @@ const userSelects = [
   ["select-none", { "user-select": "none" }]
 ];
 const whitespaces = [
-  [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v })]
+  [/^(?:whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)$/, ([, v]) => ({ "white-space": v }), { autocomplete: "(whitespace|ws)-(normal|nowrap|pre|pre-line|pre-wrap)" }]
 ];
 const contents = [
   [/^content-\[(.+)\]$/, ([, v]) => ({ content: `"${v}"` })],
@@ -561,14 +588,14 @@ const rings = [
         }
       ];
     }
-  }],
-  [/^ring-(?:width-|size-)(.+)$/, ([, d], { theme }) => ({ "--un-ring-width": theme.lineWidth?.[d] ?? handler.bracket.cssvar.px(d) })],
+  }, { autocomplete: "ring-$ringWidth" }],
+  [/^ring-(?:width-|size-)(.+)$/, ([, d], { theme }) => ({ "--un-ring-width": theme.lineWidth?.[d] ?? 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] ?? handler.bracket.cssvar.px(d) })],
+  [/^ring-offset-(?:width-|size-)?(.+)$/, ([, d], { theme }) => ({ "--un-ring-offset-width": theme.lineWidth?.[d] ?? handler.bracket.cssvar.px(d) }), { autocomplete: "ring-offset-(width|size)-$lineWidth" }],
   [/^ring-(.+)$/, colorResolver("--un-ring-color", "ring"), { autocomplete: "ring-$colors" }],
   [/^ring-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-opacity": handler.bracket.percent(opacity) }), { autocomplete: "ring-(op|opacity)-<percent>" }],
-  [/^ring-offset-(.+)$/, colorResolver("--un-ring-offset-color", "ring-offset")],
-  [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-offset-opacity": handler.bracket.percent(opacity) })],
+  [/^ring-offset-(.+)$/, colorResolver("--un-ring-offset-color", "ring-offset"), { autocomplete: "ring-offset-$colors" }],
+  [/^ring-offset-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-ring-offset-opacity": handler.bracket.percent(opacity) }), { autocomplete: "ring-offset-(op|opacity)-<percent>" }],
   ["ring-inset", { "--un-ring-inset": "inset" }]
 ];
 
@@ -588,9 +615,9 @@ const boxShadows = [
         }
       ];
     }
-  }],
-  [/^shadow-(.+)$/, colorResolver("--un-shadow-color", "shadow")],
-  [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": handler.bracket.percent(opacity) })],
+  }, { autocomplete: "shadow-$boxShadow" }],
+  [/^shadow-(.+)$/, colorResolver("--un-shadow-color", "shadow"), { autocomplete: "shadow-$colors" }],
+  [/^shadow-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-shadow-opacity": handler.bracket.percent(opacity) }), { autocomplete: "shadow-(op|opacity)-<percent>" }],
   ["shadow-inset", { "--un-shadow-inset": "inset" }]
 ];
 
@@ -617,10 +644,28 @@ function getSizeValue(minmax, hw, theme, prop) {
   return handler.bracket.cssvar.auto.fraction.rem(prop);
 }
 const sizes = [
-  [/^(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) })],
-  [/^(min-|max-)?(h)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.verticalBreakpoints?.[s] })],
-  [/^(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.breakpoints?.[s] })]
+  [
+    /^(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], { theme }) => ({ [getPropName(m, w)]: theme.verticalBreakpoints?.[s] }), { autocomplete: ["h-screen-$verticalBreakpoints", "(min|max)-h-screen-$verticalBreakpoints"] }],
+  [/^(min-|max-)?(w)-screen-(.+)$/, ([, m, w, s], { theme }) => ({ [getPropName(m, w)]: theme.breakpoints?.[s] }), { autocomplete: ["w-screen-$breakpoints", "(min|max)-w-screen-$breakpoints"] }]
 ];
 function getAspectRatio(prop) {
   if (/^\d+\/\d+$/.test(prop))
@@ -634,15 +679,15 @@ function getAspectRatio(prop) {
   return handler.bracket.cssvar.auto.number(prop);
 }
 const aspectRatio = [
-  [/^aspect-(?:ratio-)?(.+)$/, ([, d]) => ({ "aspect-ratio": getAspectRatio(d) })]
+  [/^aspect-(?:ratio-)?(.+)$/, ([, d]) => ({ "aspect-ratio": getAspectRatio(d) }), { autocomplete: ["aspect-(square|video)", "aspect-ratio-(square|video)"] }]
 ];
 
 const paddings = [
   [/^pa?()-?(-?.+)$/, directionSize("padding"), { autocomplete: ["(m|p)<num>", "(m|p)-<num>"] }],
   [/^p-?([xy])-?(-?.+)$/, directionSize("padding")],
   [/^p-?([rltbse])-?(-?.+)$/, directionSize("padding"), { autocomplete: "(m|p)<directions>-<num>" }],
-  [/^p-(block|inline)-(-?.+)$/, directionSize("padding")],
-  [/^p-?([bi][se])-?(-?.+)$/, directionSize("padding")]
+  [/^p-(block|inline)-(-?.+)$/, directionSize("padding"), { autocomplete: "(m|p)-(block|inline)-<num>" }],
+  [/^p-?([bi][se])-?(-?.+)$/, directionSize("padding"), { autocomplete: "(m|p)-(bs|be|is|ie)-<num>" }]
 ];
 const margins = [
   [/^ma?()-?(-?.+)$/, directionSize("margin")],
@@ -699,7 +744,7 @@ const transformBase = {
   [CONTROL_SHORTCUT_NO_MERGE]: ""
 };
 const transforms = [
-  [/^(?:transform-)?origin-(.+)$/, ([, s]) => ({ "transform-origin": positionMap[s] ?? handler.bracket.cssvar(s) })],
+  [/^(?:transform-)?origin-(.+)$/, ([, s]) => ({ "transform-origin": positionMap[s] ?? handler.bracket.cssvar(s) }), { autocomplete: [`transform-origin-(${Object.keys(positionMap).join("|")})`, `origin-(${Object.keys(positionMap).join("|")})`] }],
   [/^(?:transform-)?perspect(?:ive)?-(.+)$/, ([, s]) => {
     const v = handler.bracket.cssvar.px.numberWithUnit(s);
     if (v != null) {
@@ -856,14 +901,14 @@ const textDecorations = [
 ];
 
 const svgUtilities = [
-  [/^fill-(.+)$/, colorResolver("fill", "fill")],
-  [/^fill-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-fill-opacity": handler.bracket.percent(opacity) })],
+  [/^fill-(.+)$/, colorResolver("fill", "fill"), { autocomplete: "fill-$colors" }],
+  [/^fill-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-fill-opacity": handler.bracket.percent(opacity) }), { autocomplete: "fill-(op|opacity)-<percent>" }],
   ["fill-none", { fill: "none" }],
-  [/^stroke-(?:width-|size-)?(.+)$/, ([, s], { theme }) => ({ "stroke-width": theme.lineWidth?.[s] ?? handler.bracket.cssvar.fraction.px.number(s) })],
-  [/^stroke-dash-(.+)$/, ([, s]) => ({ "stroke-dasharray": handler.bracket.cssvar.number(s) })],
-  [/^stroke-offset-(.+)$/, ([, s], { theme }) => ({ "stroke-dashoffset": theme.lineWidth?.[s] ?? handler.bracket.cssvar.px.numberWithUnit(s) })],
-  [/^stroke-(.+)$/, colorResolver("stroke", "stroke")],
-  [/^stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-stroke-opacity": handler.bracket.percent(opacity) })],
+  [/^stroke-(?:width-|size-)?(.+)$/, ([, s], { theme }) => ({ "stroke-width": theme.lineWidth?.[s] ?? handler.bracket.cssvar.fraction.px.number(s) }), { autocomplete: ["stroke-width-$lineWidth", "stroke-size-$lineWidth"] }],
+  [/^stroke-dash-(.+)$/, ([, s]) => ({ "stroke-dasharray": handler.bracket.cssvar.number(s) }), { autocomplete: "stroke-dash-<num>" }],
+  [/^stroke-offset-(.+)$/, ([, s], { theme }) => ({ "stroke-dashoffset": theme.lineWidth?.[s] ?? handler.bracket.cssvar.px.numberWithUnit(s) }), { autocomplete: "stroke-offset-$lineWidth" }],
+  [/^stroke-(.+)$/, colorResolver("stroke", "stroke"), { autocomplete: "stroke-$colors" }],
+  [/^stroke-op(?:acity)?-?(.+)$/, ([, opacity]) => ({ "--un-stroke-opacity": handler.bracket.percent(opacity) }), { autocomplete: "stroke-(op|opacity)-<percent>" }],
   ["stroke-cap-square", { "stroke-linecap": "square" }],
   ["stroke-cap-round", { "stroke-linecap": "round" }],
   ["stroke-cap-auto", { "stroke-linecap": "butt" }],

package/dist/theme.d.ts

@@ -73,6 +73,14 @@ declare const spacing: {
 declare const duration: {
     DEFAULT: string;
     none: string;
+    75: string;
+    100: string;
+    150: string;
+    200: string;
+    300: string;
+    500: string;
+    700: string;
+    1000: string;
 };
 declare const borderRadius: {
     DEFAULT: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unocss/preset-mini",
-  "version": "0.29.3",
+  "version": "0.29.6",
   "description": "The minimal preset for UnoCSS",
   "keywords": [
     "unocss",
@@ -61,7 +61,7 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@unocss/core": "0.29.3"
+    "@unocss/core": "0.29.6"
   },
   "scripts": {
     "build": "unbuild",