Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(preset-tagify): add excludeTags option #1047

Merged
merged 7 commits into from Jun 1, 2022
Merged

feat(preset-tagify): add excludeTags option #1047

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
d775dd5
feat(preset-tagify): add excludeTags option
chu121su12 Jun 1, 2022
e602e34
add more default exclusions
chu121su12 Jun 1, 2022
bd9de66
lint
chu121su12 Jun 1, 2022
a17b6ad
lint
chu121su12 Jun 1, 2022
e651d87
fix type
chu121su12 Jun 1, 2022
692e04f
regex support
chu121su12 Jun 1, 2022
41e507d
chore: update
antfu Jun 1, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
3 changes: 2 additions & 1 deletion packages/preset-tagify/src/extractor.ts
View file
Open in desktop
Expand Up @@ -7,14 +7,15 @@ export const htmlTagRE = /<([\w\d-:]+)/g
export const extractorTagify = (options: TagifyOptions): Extractor => {
const {
prefix = '',
excludedTags = ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table'],
} = options

return {
name: 'tagify',
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}`),
)
},
Expand Down
6 changes: 6 additions & 0 deletions packages/preset-tagify/src/types.ts
View file
Open in desktop
Expand Up @@ -4,6 +4,12 @@ export interface TagifyOptions {
*/
prefix?: string

/**
* Tags excluded from processing.
* @default ['b', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table']
*/
excludedTags?: string[]
Copy link
Member

@antfu antfu Jun 1, 2022 •
edited

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should also be possible to accept regexes


/**
* Extra CSS properties to apply to matched rules
*/
Expand Down
2 changes: 2 additions & 0 deletions test/preset-tagify.test.ts
View file
Open in desktop
Expand Up @@ -40,6 +40,7 @@ describe('tagify', () => {

const code = `
<flex>
<h1 class="h2"> excluded heading </h1>
<text-red> red text </text-red>
<text-green5:10 />
<m-1> margin </m-1>
Expand All @@ -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;}"
`)
})
Expand Down