Update: I'm working on this! Follow the updates in this Twitter thread: https://twitter.com/daniguardio_la/status/1739715412131238122

PRs

• #1362

Description

Port the TailwindCSS Prettier plugin that sorts Tailwind CSS utility classes. In Biome, it is being implemented as a lint rule that formats classes in JavaScript files though auto-fixes (ref).

Feature support / tasks checklist

Features with an asterisk are not likely to be implemented as part of this task. They are listed for exhaustiveness, and considered in architectural decisions so that future support is possible, but they are not high priority.

Features with a question mark are ideas that I'm not sure about, or I don't know enough about to determine if they make sense or how they could be implemented.

• Visitor:
  • Custom functions (clsx, etc).
  • Custom functions: tagged template support
  • JSX attributes (class and className)
  • Custom JSX attributes
  • Object properties (e.g. in objects passed to clsx)
• Sorting:
  • Utility classes
  • Utility classes: arbitrary values
  • Static variants
  • Dynamic variants
  • Arbitrary variants
  • Arbitrary CSS
  • Parasite utilities
  • Screens e.g. md:, max-md: (simple config, px-only)
  • Screens (advanced config)
  • Negative values
  • With prefix
  • With important prefix (!class)
  • With custom separator
• Preset/config generation:
  • Tailwind CSS v3 (WIP)
  • Tailwind CSS v4
  • UnoCSS*
• Presets:
  • Tailwind CSS preset
  • UnoCSS presets?*
• Config:
  • Custom functions
  • Custom JSX attributes
  • Class order
  • Exclude classes?*
  • Utilities/layers
  • Variants
  • Screens
  • Preset (Tailwind CSS or no preset)
  • Extend utilities
  • Extend variants
  • Extend screens? (replace might be the only sane option)
  • Prefix
  • Separator
• Other features:
  • Automatic migration/sync tailwind.config.js -> biome.json
  • Resiliency to UnoCSS variant groups (naive sorting could mangle these) docs?*
  • UnoCSS variant groups sorting?*
  • UnoCSS attributify mode sorting?*
• Other tasks
  • Lint rule documentation
  • Config documentation
  • Migration documentation
• Polish:
  • PartialOrd / improved check perf
  • Single sort pass / lexicographical sort as last compare sort?
  • Better name for the rule (useSortedUtilityClasses?)
  • Avoid string allocations whenever possible.