From d775dd53b0336d9e47ceeaeeccbbcf0ae8272169 Mon Sep 17 00:00:00 2001 From: Saya Date: Wed, 1 Jun 2022 11:17:59 +0800 Subject: [PATCH 1/7] feat(preset-tagify): add excludeTags option --- packages/preset-tagify/src/extractor.ts | 3 ++- packages/preset-tagify/src/types.ts | 6 ++++++ test/preset-tagify.test.ts | 2 ++ 3 files changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/preset-tagify/src/extractor.ts b/packages/preset-tagify/src/extractor.ts index ce8e97eaf4..2bea696cce 100644 --- a/packages/preset-tagify/src/extractor.ts +++ b/packages/preset-tagify/src/extractor.ts @@ -7,6 +7,7 @@ export const htmlTagRE = /<([\w\d-:]+)/g export const extractorTagify = (options: TagifyOptions): Extractor => { const { prefix = '', + excludedTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] } = options return { @@ -14,7 +15,7 @@ export const extractorTagify = (options: TagifyOptions): Extractor => { extract({ code }) { return new Set( Array.from(code.matchAll(htmlTagRE)) - .filter(({ 1: match }) => match.startsWith(prefix)) + .filter(({ 1: match }) => match.startsWith(prefix) && !excludedTags.includes(match)) .map(([, matched]) => `${MARKER}${matched}`), ) }, diff --git a/packages/preset-tagify/src/types.ts b/packages/preset-tagify/src/types.ts index d28f5658e1..774242aa06 100644 --- a/packages/preset-tagify/src/types.ts +++ b/packages/preset-tagify/src/types.ts @@ -5,6 +5,12 @@ export interface TagifyOptions { prefix?: string /** + * Tags excluded from processing. + * @default ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] + */ + excludedTags: string[] + + /** * Extra CSS properties to apply to matched rules */ extraProperties?: diff --git a/test/preset-tagify.test.ts b/test/preset-tagify.test.ts index e428e12fc7..e35f686d76 100644 --- a/test/preset-tagify.test.ts +++ b/test/preset-tagify.test.ts @@ -40,6 +40,7 @@ describe('tagify', () => { const code = ` +

excluded heading

red text margin @@ -61,6 +62,7 @@ describe('tagify', () => { text-red{--un-text-opacity:1;color:rgba(248,113,113,var(--un-text-opacity));} text-green5\\\\:10{color:rgba(34,197,94,0.1);} flex{display:flex;} + .h2{height:0.5rem;} custom-rule{background-color:pink;}" `) }) From e602e348c439cd6ad53da32b64eb209f975270ba Mon Sep 17 00:00:00 2001 From: Saya Date: Wed, 1 Jun 2022 11:30:48 +0800 Subject: [PATCH 2/7] add more default exclusions --- packages/preset-tagify/src/extractor.ts | 2 +- packages/preset-tagify/src/types.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/preset-tagify/src/extractor.ts b/packages/preset-tagify/src/extractor.ts index 2bea696cce..67f44ea46a 100644 --- a/packages/preset-tagify/src/extractor.ts +++ b/packages/preset-tagify/src/extractor.ts @@ -7,7 +7,7 @@ export const htmlTagRE = /<([\w\d-:]+)/g export const extractorTagify = (options: TagifyOptions): Extractor => { const { prefix = '', - excludedTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] + excludedTags = ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table'] } = options return { diff --git a/packages/preset-tagify/src/types.ts b/packages/preset-tagify/src/types.ts index 774242aa06..f577118d8a 100644 --- a/packages/preset-tagify/src/types.ts +++ b/packages/preset-tagify/src/types.ts @@ -6,7 +6,7 @@ export interface TagifyOptions { /** * Tags excluded from processing. - * @default ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] + * @default ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table'] */ excludedTags: string[] From bd9de66ed86854e09b11721c2cd6e0371b7b4874 Mon Sep 17 00:00:00 2001 From: Saya Date: Wed, 1 Jun 2022 11:33:33 +0800 Subject: [PATCH 3/7] lint --- packages/preset-tagify/src/extractor.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/preset-tagify/src/extractor.ts b/packages/preset-tagify/src/extractor.ts index 67f44ea46a..7a0d9a866e 100644 --- a/packages/preset-tagify/src/extractor.ts +++ b/packages/preset-tagify/src/extractor.ts @@ -7,7 +7,7 @@ export const htmlTagRE = /<([\w\d-:]+)/g export const extractorTagify = (options: TagifyOptions): Extractor => { const { prefix = '', - excludedTags = ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table'] + excludedTags = ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table'], } = options return { From a17b6ad6fcb1e4b46d641a80c3b16d99b7b1494d Mon Sep 17 00:00:00 2001 From: Saya Date: Wed, 1 Jun 2022 11:34:02 +0800 Subject: [PATCH 4/7] lint --- packages/preset-tagify/src/types.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/preset-tagify/src/types.ts b/packages/preset-tagify/src/types.ts index f577118d8a..dcc31cdce5 100644 --- a/packages/preset-tagify/src/types.ts +++ b/packages/preset-tagify/src/types.ts @@ -10,7 +10,7 @@ export interface TagifyOptions { */ excludedTags: string[] - /** + /** * Extra CSS properties to apply to matched rules */ extraProperties?: From e651d8787fffe773f8720190a37d0a37424be9aa Mon Sep 17 00:00:00 2001 From: Saya Date: Wed, 1 Jun 2022 11:39:20 +0800 Subject: [PATCH 5/7] fix type --- packages/preset-tagify/src/types.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/preset-tagify/src/types.ts b/packages/preset-tagify/src/types.ts index dcc31cdce5..a8800aab34 100644 --- a/packages/preset-tagify/src/types.ts +++ b/packages/preset-tagify/src/types.ts @@ -8,7 +8,7 @@ export interface TagifyOptions { * Tags excluded from processing. * @default ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table'] */ - excludedTags: string[] + excludedTags?: string[] /** * Extra CSS properties to apply to matched rules From 692e04fcb38fa75853a7297e4208a8bb7eef746d Mon Sep 17 00:00:00 2001 From: Saya Date: Wed, 1 Jun 2022 20:58:51 +0800 Subject: [PATCH 6/7] regex support --- packages/preset-tagify/src/extractor.ts | 16 ++++++++++++++- packages/preset-tagify/src/types.ts | 2 +- test/preset-tagify.test.ts | 27 +++++++++++++++++++++++++ 3 files changed, 43 insertions(+), 2 deletions(-) diff --git a/packages/preset-tagify/src/extractor.ts b/packages/preset-tagify/src/extractor.ts index 7a0d9a866e..7d9f887299 100644 --- a/packages/preset-tagify/src/extractor.ts +++ b/packages/preset-tagify/src/extractor.ts @@ -15,7 +15,21 @@ export const extractorTagify = (options: TagifyOptions): Extractor => { extract({ code }) { return new Set( Array.from(code.matchAll(htmlTagRE)) - .filter(({ 1: match }) => match.startsWith(prefix) && !excludedTags.includes(match)) + .filter(({ 1: match }) => { + for (const exclude of excludedTags) { + if (typeof exclude === 'string') { + if (match === exclude) + return false + } + else { + if (exclude.test(match)) + return false + } + } + + return true + }) + .filter(({ 1: match }) => match.startsWith(prefix)) .map(([, matched]) => `${MARKER}${matched}`), ) }, diff --git a/packages/preset-tagify/src/types.ts b/packages/preset-tagify/src/types.ts index a8800aab34..cccb51fca0 100644 --- a/packages/preset-tagify/src/types.ts +++ b/packages/preset-tagify/src/types.ts @@ -8,7 +8,7 @@ export interface TagifyOptions { * Tags excluded from processing. * @default ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table'] */ - excludedTags?: string[] + excludedTags?: (string | RegExp)[] /** * Extra CSS properties to apply to matched rules diff --git a/test/preset-tagify.test.ts b/test/preset-tagify.test.ts index e35f686d76..ed9c33145a 100644 --- a/test/preset-tagify.test.ts +++ b/test/preset-tagify.test.ts @@ -67,6 +67,33 @@ describe('tagify', () => { `) }) + test('exclude tags', async () => { + const uno = createGenerator({ + presets: [ + presetMini(), + presetTagify({ + excludedTags: [ + /h[1-5]/, + 'table', + ] + }), + ], + }) + + const code = ` + +

excluded heading

+
tagified heading
+ bordered + ` + + expect((await uno.generate(code, { preflights: false })).css).toMatchInlineSnapshot(` + "/* layer: default */ + b{border-width:1px;border-style:solid;} + h6{height:1.5rem;}" + `) + }) + test('extraProperties', async () => { const uno = createGenerator({ presets: [ From 41e507d17381cdc3baeee712b837d274c14e1f41 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Wed, 1 Jun 2022 22:34:24 +0800 Subject: [PATCH 7/7] chore: update --- packages/preset-tagify/src/extractor.ts | 6 ++---- test/preset-tagify.test.ts | 4 ++-- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/packages/preset-tagify/src/extractor.ts b/packages/preset-tagify/src/extractor.ts index 7d9f887299..56b7c3dc2e 100644 --- a/packages/preset-tagify/src/extractor.ts +++ b/packages/preset-tagify/src/extractor.ts @@ -7,7 +7,7 @@ export const htmlTagRE = /<([\w\d-:]+)/g export const extractorTagify = (options: TagifyOptions): Extractor => { const { prefix = '', - excludedTags = ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table'], + excludedTags = ['b', /^h\d+$/, 'table'], } = options return { @@ -26,10 +26,8 @@ export const extractorTagify = (options: TagifyOptions): Extractor => { return false } } - - return true + return match.startsWith(prefix) }) - .filter(({ 1: match }) => match.startsWith(prefix)) .map(([, matched]) => `${MARKER}${matched}`), ) }, diff --git a/test/preset-tagify.test.ts b/test/preset-tagify.test.ts index ed9c33145a..45df0c1902 100644 --- a/test/preset-tagify.test.ts +++ b/test/preset-tagify.test.ts @@ -73,9 +73,9 @@ describe('tagify', () => { presetMini(), presetTagify({ excludedTags: [ - /h[1-5]/, + /^h[1-5]$/, 'table', - ] + ], }), ], })