🐛 asChild で無効化したとき、Button / IconButton の無効時の配色が適用されない

[touyou]

事象

Button / IconButton の無効状態のスタイルは disabled: プレフィックスで出力されているため、asChild で <a> や Link を差し込んだ場合に一切適用されません（:disabled 疑似クラスは form control にしかマッチしないため）。

<IconButton asChild icon="edit" aria-label="編集" isDisabled>
  <a href="/foo" />
</IconButton>

• aria-disabled="true" / data-disabled="true" は付き、click / Enter・Space の抑止も効く（🐛 fix: IconButton の asChild と native disabled の不具合を修正 #307 で対応済み）
• しかし CVA は無効時に有効時の配色クラスを出力しないため、配色が一切当たっていない状態でレンダリングされる

つまり「操作はできないが、見た目は無効に見えない（むしろ配色が抜けている）」という状態になります。

対応案

disabled: の compoundVariant に aria-disabled: 系のユーティリティを併記する。

-  "disabled:bg-surface-primary-high-disabled disabled:text-object-inverse"
+  "disabled:bg-surface-primary-high-disabled disabled:text-object-inverse"
+  + " aria-disabled:bg-surface-primary-high-disabled aria-disabled:text-object-inverse"

確認が必要な点:

• sparkle-design-cli が生成する CSS と Tailwind 4 のスキャンで aria-disabled: バリアントが期待どおり出力されるか（今回この確認が要るため 🐛 fix: IconButton の asChild と native disabled の不具合を修正 #307 のスコープ外にしました）
• Button / IconButton の両方を同時に対応すること
• data-disabled を利用側スタイルフックとして残すか、aria-disabled: 対応後は不要とするか

出所

#307（#304 / #305 対応）のレビューで検出。#307 では既知の制約として JSDoc のアクセシビリティ節と dev 警告で利用者に伝える形にしています。