Repository: tailwindlabs/tailwindcss
File: packages/tailwindcss/src/variants.ts (TypeScript)

Code before:
                rule(
                  variant.modifier
                    ? `@container ${variant.modifier.value} (width >= ${value})`
                    : `@container (width >= ${value})`,
                  ruleNode.nodes,
                ),
              ]
            },
            { compounds: false },
          )
        },
        (a, z) => compareBreakpoints(a, z, 'asc', resolvedWidths),
      )

      variants.suggest(
        '@min',
        () => Array.from(widths.keys()).filter((key) => key !== null) as string[],
      )
    }
  }

  staticVariant('portrait', ['@media (orientation: portrait)'], { compounds: false })
  staticVariant('landscape', ['@media (orientation: landscape)'], { compounds: false })

  staticVariant('ltr', ['&:where(:dir(ltr), :dir(ltr) *, [dir="ltr"], [dir="ltr"] *)'])
  staticVariant('rtl', ['&:where(:dir(rtl), :dir(rtl) *, [dir="rtl"], [dir="rtl"] *)'])

  staticVariant('dark', ['@media (prefers-color-scheme: dark)'], { compounds: false })

  staticVariant('starting', ['@starting-style'], { compounds: false })

  staticVariant('print', ['@media print'], { compounds: false })

  staticVariant('forced-colors', ['@media (forced-colors: active)'], { compounds: false })

  return variants
}

function quoteAttributeValue(value: string) {
  if (value.includes('=')) {
    value = value.replace(/(=.*)/g, (_fullMatch, match) => {
      // If the value is already quoted, skip.
      if (match[1] === "'" || match[1] === '"') {
        return match
      }

      // Handle regex flags on unescaped values
      if (match.length > 2) {
        let trailingCharacter = match[match.length - 1]
        if (
          match[match.length - 2] === ' ' &&

Review comment (suggestion):
Don't need `:dir(rtl) *` here actually because the pseudo-class inherits already in the browser 🙌🏻

```suggestion
  staticVariant('ltr', ['&:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *)'])
  staticVariant('rtl', ['&:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *)'])
```

Code after:

              ruleNode.nodes = [
                rule(
                  variant.modifier
                    ? `@container ${variant.modifier.value} (width >= ${value})`
                    : `@container (width >= ${value})`,
                  ruleNode.nodes,
                ),
              ]
            },
            { compounds: false },
          )
        },
        (a, z) => compareBreakpoints(a, z, 'asc', resolvedWidths),
      )

      variants.suggest(
        '@min',
        () => Array.from(widths.keys()).filter((key) => key !== null) as string[],
      )
    }
  }

  staticVariant('portrait', ['@media (orientation: portrait)'], { compounds: false })
  staticVariant('landscape', ['@media (orientation: landscape)'], { compounds: false })

  staticVariant('ltr', ['&:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *)'])
  staticVariant('rtl', ['&:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *)'])

  staticVariant('dark', ['@media (prefers-color-scheme: dark)'], { compounds: false })

  staticVariant('starting', ['@starting-style'], { compounds: false })

  staticVariant('print', ['@media print'], { compounds: false })

  staticVariant('forced-colors', ['@media (forced-colors: active)'], { compounds: false })

  return variants
}

function quoteAttributeValue(value: string) {
  if (value.includes('=')) {
    value = value.replace(/(=.*)/g, (_fullMatch, match) => {
      // If the value is already quoted, skip.
      if (match[1] === "'" || match[1] === '"') {
        return match
      }

      // Handle regex flags on unescaped values
      if (match.length > 2) {
        let trailingCharacter = match[match.length - 1]