feat(preset-mini): update units

packages/preset-mini/src/_utils/handlers/regex.ts

@@ -1,3 +1,3 @@
-export const numberWithUnitRE = /^(-?[0-9.]+)(px|pt|pc|rem|em|%|vh|vw|in|cm|mm|ex|ch|vmin|vmax|cqw|cqh|cqi|cqb|cqmin|cqmax|rpx)?$/i
+export const numberWithUnitRE = /^(-?[0-9.]+)(px|pt|pc|%|r?em|ex|ch|ic|(?:[sld]?v|cq)(?:[whib]|min|max)|in|cm|mm|rpx)?$/i
 export const numberRE = /^(-?[0-9.]+)$/i
 export const unitOnlyRE = /^(px)$/i

test/__snapshots__/preset-mini.test.ts.snap

@@ -641,7 +641,7 @@ unocss .scope-\\\\[unocss\\\\]\\\\:block{display:block;}
 .w-\\\\[calc\\\\(calc\\\\(100px\\\\*10\\\\)-4rem\\\\)\\\\]{width:calc(calc(100px * 10) - 4rem);}
 .w-1{width:0.25rem;}
 .w-1\\\\/4{width:25%;}
-.w-1cqw{width:1cqw;}
+.w-1in{width:1in;}
 .w-21{width:5.25rem;}
 .w-auto{width:auto;}
 .w-lg{width:32rem;}

test/assets/preset-mini-targets.ts

@@ -449,7 +449,7 @@ export const presetMiniTargets: string[] = [
   'w-21',
   'w-1/4',
   'w-lg',
-  'w-1cqw',
+  'w-1in',
   'h-screen-sm',
   'h-screen-lg',
   'max-h-[1px]',

test/handler.test.ts

@@ -1,8 +1,8 @@
-import { describe, expect, it } from 'vitest'
+import { describe, expect, test } from 'vitest'
 import { handler as h } from '@unocss/preset-mini/utils'
 
 describe('value handler', () => {
-  it('bracket math function', () => {
+  test('bracket math function', () => {
     expect(h.bracket('[calc(1-2)]')).eql('calc(1 - 2)')
     expect(h.bracket('[min(1-2)]')).eql('min(1 - 2)')
     expect(h.bracket('[max(1-2)]')).eql('max(1 - 2)')
@@ -13,15 +13,15 @@ describe('value handler', () => {
     expect(h.bracket('[calc(1*2)]')).eql('calc(1 * 2)')
   })
 
-  it('bracket curly', () => {
+  test('bracket curly', () => {
     expect(h.bracket('[foo][bar]')).eql(undefined)
     expect(h.bracket('[[]]')).eql('[]')
     expect(h.bracket('[]]')).eql(undefined)
     expect(h.bracket('[]][[]]]]')).eql(undefined)
     expect(h.bracket('[[][[[]]]]')).eql('[][[[]]]')
   })
 
-  it('bracket underscore', () => {
+  test('bracket underscore', () => {
     expect(h.bracket('[a_b]')).eql('a b')
     expect(h.bracket('[a\\_b]')).eql('a_b')
     expect(h.bracket('[_b_only]')).eql(' b only')
@@ -32,15 +32,50 @@ describe('value handler', () => {
     expect(h.bracket('[var(--A\\_B)]')).eql('var(--A_B)')
   })
 
-  it('bracket string-type', () => {
+  test('bracket string-type', () => {
     expect(h.bracket('[string:a_b]')).eql('a b')
     expect(h.bracket('[string:a\\_b]')).eql('a\_b')
     expect(h.bracket('[string:attr(data-label)_":_"]')).eql('attr(data-label) ": "')
   })
 
-  it('bracket quoted-type', () => {
+  test('bracket quoted-type', () => {
     expect(h.bracket('[quoted:a_b]')).eql('"a b"')
     expect(h.bracket('[quoted:a\\_b]')).eql('"a_b"')
     expect(h.bracket('[quoted:\'with-\\,-\'-and-"]')).toMatchInlineSnapshot('"\\"\'with-\\\\\\\\,-\'-and-\\\\\\"\\""')
   })
+
+  test('handler resolves numbers using numberWithUnit', () => {
+    // normalizations
+    expect(h.numberWithUnit('10')).eql(undefined)
+    expect(h.numberWithUnit('10unknown')).eql(undefined)
+    expect(h.numberWithUnit('10 unknown')).eql(undefined)
+    expect(h.numberWithUnit('10 px')).eql(undefined)
+    expect(h.numberWithUnit('10px')).eql('10px')
+    expect(h.numberWithUnit('10.0px')).eql('10px')
+    expect(h.numberWithUnit('0px')).eql('0px')
+    expect(h.numberWithUnit('.1px')).eql('0.1px')
+    expect(h.numberWithUnit('.20px')).eql('0.2px')
+    expect(h.numberWithUnit('00.30px')).eql('0.3px')
+    expect(h.numberWithUnit('01.40px')).eql('1.4px')
+
+    // units
+    const units = [
+      'pt',
+      'pc',
+      '%',
+      'rem', 'em',
+      'ex', 'ch', 'ic',
+
+      'vw', 'vh', 'vi', 'vb', 'vmin', 'vmax',
+      'svw', 'svh', 'svi', 'svb', 'svmin', 'svmax',
+      'lvw', 'lvh', 'lvi', 'lvb', 'lvmin', 'lvmax',
+      'dvw', 'dvh', 'dvi', 'dvb', 'dvmin', 'dvmax',
+      'cqw', 'cqh', 'cqi', 'cqb', 'cqmin', 'cqmax',
+
+      'in', 'cm', 'mm',
+      'rpx',
+    ]
+
+    expect(units.map(y => h.numberWithUnit(`12.34${y}`))).eql(units.map(y => `12.34${y}`))
+  })
 })