fix(preset-mini): supplement rule autocomplete (#2902)

packages/preset-mini/src/_rules/position.ts

@@ -3,7 +3,13 @@ import type { Theme } from '../theme'
 import { globalKeywords, h, insetMap, makeGlobalStaticRules } from '../utils'
 
 export const positions: Rule[] = [
-  [/^(?:position-|pos-)?(relative|absolute|fixed|sticky)$/, ([, v]) => ({ position: v })],
+  [/^(?:position-|pos-)?(relative|absolute|fixed|sticky)$/, ([, v]) => ({ position: v }), {
+    autocomplete: [
+      '(position|pos)-<position>',
+      '(position|pos)-<globalKeyword>',
+      '<position>',
+    ],
+  }],
   [/^(?:position-|pos-)([-\w]+)$/, ([, v]) => globalKeywords.includes(v) ? { position: v } : undefined],
   [/^(?:position-|pos-)?(static)$/, ([, v]) => ({ position: v })],
 ]

packages/preset-mini/src/_rules/size.ts

@@ -39,6 +39,8 @@ export const sizes: Rule<Theme>[] = [
       '(block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize',
       '(max|min)-(w|h|block|inline)',
       '(max|min)-(w|h|block|inline)-$width|height|maxWidth|maxHeight|minWidth|minHeight|inlineSize|blockSize|maxInlineSize|maxBlockSize|minInlineSize|minBlockSize',
+      '(w|h)-full',
+      '(max|min)-(w|h)-full',
     ],
   }],
   [/^(?:size-)?(min-|max-)?(h)-screen-(.+)$/, ([, m, w, s], context) => ({ [getPropName(m, w)]: resolveVerticalBreakpoints(context)?.[s] })],

packages/preset-mini/src/index.ts

@@ -5,6 +5,7 @@ import { rules } from './rules'
 import type { Theme, ThemeAnimation } from './theme'
 import { theme } from './theme'
 import { variants } from './variants'
+import { shorthands } from './shorthands'
 
 export { preflights } from './preflights'
 export { theme, colors } from './theme'
@@ -90,6 +91,9 @@ export function presetMini(options: PresetMiniOptions = {}): Preset<Theme> {
     extractorDefault: options.arbitraryVariants === false
       ? undefined
       : extractorArbitraryVariants,
+    autocomplete: {
+      shorthands,
+    },
   }
 }
 

packages/preset-mini/src/shorthands.ts

@@ -0,0 +1,12 @@
+import { globalKeywords } from './utils'
+
+export const shorthands = {
+  position: [
+    'relative',
+    'absolute',
+    'fixed',
+    'sticky',
+    'static',
+  ],
+  globalKeyword: globalKeywords,
+}

test/__snapshots__/autocomplete.test.ts.snap

@@ -48,13 +48,13 @@ exports[`autocomplete > should provide autocomplete 1`] = `
   "leading-": "leading-loose leading-none leading-normal leading-relaxed leading-snug leading-tight",
   "line-clamp-": "line-clamp-0 line-clamp-1 line-clamp-2 line-clamp-3 line-clamp-4 line-clamp-5 line-clamp-6 line-clamp-8 line-clamp-10 line-clamp-12",
   "m-": "m-0 m-1 m-2 m-3 m-4 m-5 m-6 m-8 m-10 m-12",
-  "max-w-": "max-w-2xl max-w-3xl max-w-4xl max-w-5xl max-w-6xl max-w-7xl max-w-auto max-w-lg max-w-md max-w-none",
+  "max-w-": "max-w-2xl max-w-3xl max-w-4xl max-w-5xl max-w-6xl max-w-7xl max-w-auto max-w-full max-w-lg max-w-md",
   "mx-": "mx-0 mx-1 mx-2 mx-3 mx-4 mx-5 mx-6 mx-8 mx-10 mx-12",
   "object-": "object-b object-bc object-bl object-bottom object-bottom-center object-bottom-left object-bottom-right object-br object-c object-cb",
   "origin-": "origin-b origin-bc origin-bl origin-bottom origin-bottom-center origin-bottom-left origin-bottom-right origin-br origin-c origin-cb",
   "outline-": "outline-amber outline-auto outline-black outline-blue outline-bluegray outline-blueGray outline-coolgray outline-coolGray outline-current outline-cyan",
   "outline-offset-": "outline-offset-0 outline-offset-1 outline-offset-2 outline-offset-3 outline-offset-4 outline-offset-5 outline-offset-6 outline-offset-8 outline-offset-10 outline-offset-12",
-  "placeholder-": "placeholder-.dark: placeholder-.light: placeholder-@dark: placeholder-@hover: placeholder-@light: placeholder-active: placeholder-after: placeholder-animate-delay placeholder-animate-direction placeholder-animate-duration",
+  "placeholder-": "placeholder-.dark: placeholder-.light: placeholder-@dark: placeholder-@hover: placeholder-@light: placeholder-absolute placeholder-active: placeholder-after: placeholder-animate-delay placeholder-animate-direction",
   "scroll-": "scroll-auto scroll-block scroll-inherit scroll-initial scroll-inline scroll-m scroll-ma scroll-p scroll-pa scroll-revert",
   "scroll-m-": "scroll-m-2xl scroll-m-3xl scroll-m-4xl scroll-m-5xl scroll-m-6xl scroll-m-7xl scroll-m-8xl scroll-m-9xl scroll-m-b scroll-m-be",
   "shadow-": "shadow-2xl shadow-amber shadow-black shadow-blue shadow-bluegray shadow-blueGray shadow-coolgray shadow-coolGray shadow-current shadow-cyan",
@@ -69,7 +69,7 @@ exports[`autocomplete > should provide autocomplete 1`] = `
   "transform-skew-y-": "transform-skew-y-0 transform-skew-y-10 transform-skew-y-20 transform-skew-y-30 transform-skew-y-40 transform-skew-y-50 transform-skew-y-60 transform-skew-y-70 transform-skew-y-80 transform-skew-y-90",
   "transition-": "transition-all transition-colors transition-inherit transition-initial transition-none transition-opacity transition-revert transition-revert-layer transition-shadow transition-transform",
   "v-": "v-base v-baseline v-bottom v-btm v-end v-inherit v-initial v-mid v-middle v-revert",
-  "w-": "w-2xl w-3xl w-4xl w-5xl w-6xl w-7xl w-auto w-lg w-md w-none",
+  "w-": "w-2xl w-3xl w-4xl w-5xl w-6xl w-7xl w-auto w-full w-lg w-md",
   "z-": "z-0 z-1 z-2 z-3 z-4 z-5 z-6 z-8 z-10 z-12",
 }
 `;

test/autocomplete-fuzzy.test.ts

@@ -1,12 +1,12 @@
 import { createAutocomplete } from '@unocss/autocomplete'
 import { createGenerator } from '@unocss/core'
 import { describe, expect, it } from 'vitest'
-import presetUno from '@unocss/preset-uno'
+import presetMini from '@unocss/preset-mini'
 
 describe('autocomplete-fuzzy', () => {
   const uno = createGenerator({
     presets: [
-      presetUno(),
+      presetMini(),
     ],
     shortcuts: [
       {
@@ -44,6 +44,11 @@ describe('autocomplete-fuzzy', () => {
       .includes('bg-mode-color')
   })
 
+  it('group', async () => {
+    const suggestions = await ac.suggest('ab')
+    expect((suggestions).includes('absolute')).toBe(true)
+  })
+
   it('order', async () => {
     const suggestions = await ac.suggest('ga')
     expect(suggestions.indexOf('gap-0')).toBeLessThan(suggestions.indexOf('gap-1'))

test/autocomplete.test.ts

@@ -39,7 +39,7 @@ describe('autocomplete', () => {
 
     ac.templates.forEach((i) => {
       if (typeof i === 'string')
-        parseAutocomplete(i, uno.config.theme)
+        parseAutocomplete(i, uno.config.theme, uno.config.autocomplete.shorthands)
     })
   })