Adding :is

[equinusocio]

Does :is plugin will be added to preset-env?

[jonathantneal]

@equinusocio, yes, but not until that plugin is able to do a few things correctly.

For example, the following rules are equivalent:

:is(a, button):is(:hover, :focus) { order: 1; }
:is(:hover, :focus):is(a, button) { order: 2; }

They should both become something like this:

a:hover, button:hover, a:focus, button:focus { order: 1; }
a:hover, button:hover, a:focus, button:focus { order: 2; }

But instead, currently, they become this:

a:hover:focus, button:hover:focus { order: 1; }
a:hover, button:hover, a:focus, button:focus { order: 2; }

Until I can fix that bug, I do not want to integrate that plugin.

[pyrsmk]

Hi!

I wanted to know, what is the status of this feature?

edit: typo

[jellevandevelde]

Do you have any update on the status of this feature?

It's gaining decent browser support with recent versions.
https://caniuse.com/?search=%3Ais

[romainmenke]

Notes :

• postcss-nesting has a good implementation of the logic behind :is
• css-has-pseudo has a good implementation of selector specificity matching

Extracting and combining those two bits should give a good :is transform.

[romainmenke]

@equinusocio We now have a plugin ready that we feel comfortable adding to preset-env

https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-is-pseudo-class#readme

This is planned for the next minor version 7.3

[equinusocio]

@romainmenke lovely

[romainmenke]

@equinusocio This has shipped in the latest version.
At the moment it is mainly good at splitting lists and handling specificity and less so with complex selectors.

Please let us know if you have any issues with or general feedback :)