`scrollbar-width` と `scrollbar-color` をプロパティ順序リストに追加

Tailwind CSS の内部プロパティ順序リストに scrollbar-width と scrollbar-color が追加され、これらのスクロールバー関連ユーティリティのソート順が安定化されました。

背景

#19981 で scrollbar-{auto,thin,none} および scrollbar-thumb-* / scrollbar-track-* といったスクロールバー関連ユーティリティが実験的機能として追加されましたが、対応するCSSプロパティ（scrollbar-width と scrollbar-color）が property-order.ts のリストに含まれていませんでした。プロパティ順序リストは、Tailwind CSS が複数のユーティリティクラスを組み合わせたときに生成CSSの順序を決定論的に保つための仕組みです。このリストへの登録がなければ、scrollbar-width と scrollbar-color を同時に使用した際のプロパティ出力順が不定となる可能性がありました。

プロパティ順序が不安定だと、ビルド結果が実行のたびに異なる可能性があり、テストのスナップショット不一致やCSSのカスケード動作の予測困難につながります。今回の変更はその潜在的な問題を解消するものです。

技術的な変更

packages/tailwindcss/src/property-order.ts に2行が追加され、既存の scrollbar-gutter の直前に scrollbar-width と scrollbar-color が登録されました。

変更前:

  'scroll-padding-bottom',
  'scroll-padding-left',

  'scrollbar-gutter',

変更後:

  'scroll-padding-bottom',
  'scroll-padding-left',

  'scrollbar-width',
  'scrollbar-color',
  'scrollbar-gutter',

この順序変更を受けて、既存のスナップショットテストも更新されています。plugin-api.test.ts では、scrollbar-[2px]（scrollbar-width）が scrollbar-[#08c]（scrollbar-color）よりも前に出力されるよう期待値が修正されました。同様に config.test.ts でも、scrollbar-primary が bg-primary よりも先に出力される順序に更新されています。

設計判断

scrollbar-width → scrollbar-color という順序 は、既存の border-width → border-color の並びと同じパターンを踏襲しています。Tailwind CSS のプロパティ順序リストは「幅（寸法）→色」という一貫したルールで整理されており、スクロールバー関連プロパティもこの規則に従う形で挿入されました。

scrollbar-gutter は scrollbar-width / scrollbar-color とは異なりスクロールバー領域の予約に関するプロパティであるため、今回追加された2つとは別グループとして扱われ、後続に位置しています。この配置はプロパティの意味的なグループを尊重した判断といえます。

まとめ

今回の変更は小規模ながら、#19981 で導入されたスクロールバーユーティリティの実装を完全なものにする重要な補完です。プロパティ順序の一貫性を保つことで、ユーティリティの組み合わせによる出力の再現性が保証され、テストの安定性とCSSカスケードの予測可能性が確保されます。