Skip to content

Commit

Permalink
Added a feature to preserve or not the original code (#34)
Browse files Browse the repository at this point in the history
* Added a feature to preserve or not the original code

* Optimization

* Renamed the inverted the preserve param logic, into a onlySelectors param.

* Renamed onlySelectors to removeMedia

* Added test to the removeMedia feature
  • Loading branch information
aletorrado committed Apr 22, 2024
1 parent 66cbbb3 commit d378b04
Show file tree
Hide file tree
Showing 3 changed files with 56 additions and 3 deletions.
1 change: 1 addition & 0 deletions index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ declare const darkClass: PluginCreator<{
lightSelector?: string
rootSelector?: string | string[]
useWhere?: boolean
removeMedia?: boolean
}>

export default darkClass
19 changes: 16 additions & 3 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,8 @@ module.exports = (opts = {}) => {

let useWhere = opts.useWhere ?? true

let removeMedia = opts.removeMedia ?? false

let uniqueRoots = roots
if (uniqueRoots.includes('html')) {
uniqueRoots = uniqueRoots.filter(i => i !== ':root')
Expand Down Expand Up @@ -128,13 +130,17 @@ module.exports = (opts = {}) => {
if (node.type === 'atrule') {
fixed = node.clone()
processNodes(fixed, fixedSelector)
processNodes(node, nodeSelector)
if (!removeMedia) {
processNodes(node, nodeSelector)
}
} else if (node.type === 'rule') {
if (!node.selector.includes(nodeSelector)) {
fixed = node.clone({
selectors: processSelectors(node.selectors, fixedSelector)
})
node.selectors = processSelectors(node.selectors, nodeSelector)
if (!removeMedia) {
node.selectors = processSelectors(node.selectors, nodeSelector)
}
}
} else if (node.type === 'comment') {
fixed = node.clone()
Expand All @@ -144,6 +150,9 @@ module.exports = (opts = {}) => {
last = fixed
}
})
if (removeMedia) {
atrule.remove()
}
} else if (PREFERS_COLOR.test(params) && params.includes(' and ')) {
if (atrule.params.includes(' and ')) {
let fixed = atrule.clone({
Expand All @@ -155,7 +164,11 @@ module.exports = (opts = {}) => {
})
atrule.after(fixed)
processNodes(fixed, fixedSelector)
processNodes(atrule, nodeSelector)
if (!removeMedia) {
processNodes(atrule, nodeSelector)
} else {
atrule.remove()
}
}
}
}
Expand Down
39 changes: 39 additions & 0 deletions index.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -725,3 +725,42 @@ test('transforms complex nested light-dark()', () => {
}`
)
})

test('removes media using transforms complex nested light-dark()', () => {
run(
`.light-dark-function-mix-a {
color: light-dark(color-mix(in oklch, red, light-dark(cyan, rgb(0, 0, 0))), blue);
}`,
`:where(html.is-dark) .light-dark-function-mix-a {
color: blue
}
:where(html.is-light) .light-dark-function-mix-a {
color: color-mix(in oklch, red, cyan)
}`,
{ removeMedia: true }
)
})

test('removes media with combined queries in the middle - dark scheme', () => {
run(
`@media (width > 0) and (prefers-color-scheme: dark) and (width > 0) {
a { color: white }
}`,
`@media (width > 0) and (width > 0) {
:where(html.is-dark) a { color: white }
}`,
{ removeMedia: true }
)
})

test('removes media with combined queries in the middle - light scheme', () => {
run(
`@media (width > 0) and (prefers-color-scheme: light) and (width > 0) {
a { color: white }
}`,
`@media (width > 0) and (width > 0) {
:where(html.is-light) a { color: white }
}`,
{ removeMedia: true }
)
})

0 comments on commit d378b04

Please sign in to comment.