From 4c2e35c025d90b7469d6568a179543f0838937de Mon Sep 17 00:00:00 2001 From: Frozen FIsh <976499226@qq.com> Date: Thu, 1 Sep 2022 16:44:03 +0800 Subject: [PATCH 1/3] feat: add align intuitive alias --- packages/preset-mini/src/_rules/align.ts | 2 ++ test/__snapshots__/autocomplete.test.ts.snap | 4 ++-- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/preset-mini/src/_rules/align.ts b/packages/preset-mini/src/_rules/align.ts index b90a758d7c..d404cc8564 100644 --- a/packages/preset-mini/src/_rules/align.ts +++ b/packages/preset-mini/src/_rules/align.ts @@ -7,8 +7,10 @@ const verticalAlignAlias: Record = { 'btm': 'bottom', 'baseline': 'baseline', 'top': 'top', + 'start': 'top', 'middle': 'middle', 'bottom': 'bottom', + 'end': 'bottom', 'text-top': 'text-top', 'text-bottom': 'text-bottom', 'sub': 'sub', diff --git a/test/__snapshots__/autocomplete.test.ts.snap b/test/__snapshots__/autocomplete.test.ts.snap index 594e08d9f6..0ae2e03b42 100644 --- a/test/__snapshots__/autocomplete.test.ts.snap +++ b/test/__snapshots__/autocomplete.test.ts.snap @@ -20,7 +20,7 @@ exports[`autocomplete > should accept variants 1`] = ` exports[`autocomplete > should provide autocomplete 1`] = ` { - "align-": "align-base align-baseline align-bottom align-btm align-inherit align-initial align-mid align-middle align-revert align-revert-layer", + "align-": "align-base align-baseline align-bottom align-btm align-end align-inherit align-initial align-mid align-middle align-revert", "aspect-": "aspect-ratio aspect-square aspect-video", "auto-flow-": "auto-flow-col auto-flow-col-dense auto-flow-dense auto-flow-row auto-flow-row-dense", "bg-": "bg-amber bg-auto bg-black bg-blend-color bg-blend-color-burn bg-blend-color-dodge bg-blend-darken bg-blend-difference bg-blend-exclusion bg-blend-hard-light", @@ -68,7 +68,7 @@ exports[`autocomplete > should provide autocomplete 1`] = ` "transform-skew-x-": "transform-skew-x-0 transform-skew-x-10 transform-skew-x-20 transform-skew-x-30 transform-skew-x-40 transform-skew-x-50 transform-skew-x-60 transform-skew-x-70 transform-skew-x-80 transform-skew-x-90", "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-inherit v-initial v-mid v-middle v-revert v-revert-layer", + "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", "z-": "z-0 z-1 z-2 z-3 z-4 z-5 z-6 z-8 z-10 z-12", } From d9d8281705ed52b7b03f116dded621c10949e825 Mon Sep 17 00:00:00 2001 From: Frozen FIsh <976499226@qq.com> Date: Fri, 2 Sep 2022 10:34:49 +0800 Subject: [PATCH 2/3] chore: add align alias test case --- test/__snapshots__/preset-uno.test.ts.snap | 10 ++++++++++ test/preset-uno.test.ts | 15 +++++++++++++++ 2 files changed, 25 insertions(+) diff --git a/test/__snapshots__/preset-uno.test.ts.snap b/test/__snapshots__/preset-uno.test.ts.snap index 60429a0b67..a6f9f86a13 100644 --- a/test/__snapshots__/preset-uno.test.ts.snap +++ b/test/__snapshots__/preset-uno.test.ts.snap @@ -1,5 +1,15 @@ // Vitest Snapshot v1 +exports[`alias start/end to top/bottom align 1`] = ` +"/* layer: default */ +.align-start{vertical-align:top;}" +`; + +exports[`alias start/end to top/bottom align 2`] = ` +"/* layer: default */ +.align-end{vertical-align:bottom;}" +`; + exports[`targets 1`] = ` "/* layer: default */ .border-custom-b{border-color:rgba(var(--custom), 1);} diff --git a/test/preset-uno.test.ts b/test/preset-uno.test.ts index 1fada48a6d..3fea65a56f 100644 --- a/test/preset-uno.test.ts +++ b/test/preset-uno.test.ts @@ -167,3 +167,18 @@ test('non-targets', async () => { expect(Array.from(matched)).toEqual([]) expect(css).toBe('') }) + +test('alias start/end to top/bottom align', async () => { + const { css: css_1 } = await uno.generate('align-top', { preflights: false }) + const { css: css1 } = await uno.generate('align-start', { preflights: false }) + const { css: css_2 } = await uno.generate('align-bottom', { preflights: false }) + const { css: css2 } = await uno.generate('align-end', { preflights: false }) + const result1 = css_1.match(/\{[\s\S]*\}/)?.[0] + const result2 = css1.match(/\{[\s\S]*\}/)?.[0] + expect(result1).toEqual(result2) + const result3 = css_2.match(/\{[\s\S]*\}/)?.[0] + const result4 = css2.match(/\{[\s\S]*\}/)?.[0] + expect(result3).toEqual(result4) + expect(css1).toMatchSnapshot() + expect(css2).toMatchSnapshot() +}) From b1afb8777aea4bfd40494aedbfb921f6317c3524 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Fri, 2 Sep 2022 12:21:46 +0800 Subject: [PATCH 3/3] chore: update --- test/__snapshots__/preset-mini.test.ts.snap | 4 +++- test/__snapshots__/preset-uno.test.ts.snap | 10 ---------- test/assets/preset-mini-targets.ts | 8 +++++--- test/preset-uno.test.ts | 15 --------------- 4 files changed, 8 insertions(+), 29 deletions(-) diff --git a/test/__snapshots__/preset-mini.test.ts.snap b/test/__snapshots__/preset-mini.test.ts.snap index 01f9a26c1f..03283fac81 100644 --- a/test/__snapshots__/preset-mini.test.ts.snap +++ b/test/__snapshots__/preset-mini.test.ts.snap @@ -689,9 +689,11 @@ div:hover .group-\\\\[div\\\\:hover\\\\]-\\\\[combinator\\\\:test-4\\\\]{combina .resize-none{resize:none;} .resize-inherit{resize:inherit;} .align-revert{vertical-align:revert;} +.align-start, +.v-top{vertical-align:top;} .align-text-bottom{vertical-align:text-bottom;} +.v-end{vertical-align:bottom;} .v-mid{vertical-align:middle;} -.v-top{vertical-align:top;} .v-unset{vertical-align:unset;} .vertical-baseline{vertical-align:baseline;} .vertical-inherit{vertical-align:inherit;} diff --git a/test/__snapshots__/preset-uno.test.ts.snap b/test/__snapshots__/preset-uno.test.ts.snap index a6f9f86a13..60429a0b67 100644 --- a/test/__snapshots__/preset-uno.test.ts.snap +++ b/test/__snapshots__/preset-uno.test.ts.snap @@ -1,15 +1,5 @@ // Vitest Snapshot v1 -exports[`alias start/end to top/bottom align 1`] = ` -"/* layer: default */ -.align-start{vertical-align:top;}" -`; - -exports[`alias start/end to top/bottom align 2`] = ` -"/* layer: default */ -.align-end{vertical-align:bottom;}" -`; - exports[`targets 1`] = ` "/* layer: default */ .border-custom-b{border-color:rgba(var(--custom), 1);} diff --git a/test/assets/preset-mini-targets.ts b/test/assets/preset-mini-targets.ts index 87ac3b36ec..a92c906191 100644 --- a/test/assets/preset-mini-targets.ts +++ b/test/assets/preset-mini-targets.ts @@ -1,14 +1,16 @@ export const presetMiniTargets: string[] = [ // align + 'text-left', 'vertical-baseline', 'vertical-super', + 'vertical-inherit', 'align-text-bottom', + 'align-revert', + 'align-start', 'v-top', 'v-mid', - 'vertical-inherit', - 'align-revert', 'v-unset', - 'text-left', + 'v-end', // behaviors 'outline-none', diff --git a/test/preset-uno.test.ts b/test/preset-uno.test.ts index 3fea65a56f..1fada48a6d 100644 --- a/test/preset-uno.test.ts +++ b/test/preset-uno.test.ts @@ -167,18 +167,3 @@ test('non-targets', async () => { expect(Array.from(matched)).toEqual([]) expect(css).toBe('') }) - -test('alias start/end to top/bottom align', async () => { - const { css: css_1 } = await uno.generate('align-top', { preflights: false }) - const { css: css1 } = await uno.generate('align-start', { preflights: false }) - const { css: css_2 } = await uno.generate('align-bottom', { preflights: false }) - const { css: css2 } = await uno.generate('align-end', { preflights: false }) - const result1 = css_1.match(/\{[\s\S]*\}/)?.[0] - const result2 = css1.match(/\{[\s\S]*\}/)?.[0] - expect(result1).toEqual(result2) - const result3 = css_2.match(/\{[\s\S]*\}/)?.[0] - const result4 = css2.match(/\{[\s\S]*\}/)?.[0] - expect(result3).toEqual(result4) - expect(css1).toMatchSnapshot() - expect(css2).toMatchSnapshot() -})