"within" selector

[mikuhl-dev]

Like the native focus-within selector, there should be other within selectors.

Currently you can do this with a plugin:

const plugin = require('tailwindcss/plugin')

/** @type {import('tailwindcss').Config} */
export default {
  plugins: [
    plugin(({ matchVariant }) => {
      matchVariant('within', (value) => `&:is(${value},:has(${value}))`)
    }),
  ],
}

<label class="within-[:disabled]:bg-red-500">
  Style Me!
  <input disabled type="checkbox"></input>
</label>
<br/>
<button class="within-[:disabled]:bg-red-500" disabled>Style Me!</button>    

Would be nice if it matched focus-within like disabled-within.