🐛 IconButton に native の disabled prop を渡すと無効状態のスタイルが当たらない

[touyou]

事象

IconButton に native の disabled prop を渡した場合、disabled 属性は付くが CVA の無効状態クラスが付かないため、通常状態の色のまま表示される。

src/components/ui/icon-button/index.tsx:

const isIconButtonDisabled = isLoading || isDisabled || disabled;   // ← disabled を含む
// ...
className={cn(
  iconButtonVariants({
    variant, size, theme,
    isLoading,
    isDisabled,          // ← ここには isDisabled しか渡っていない
    className,
  })
)}
disabled={isIconButtonDisabled}

無効状態のスタイル（disabled:bg-surface-*-disabled 等）は isDisabled: true の compoundVariant からしか出力されないため、isDisabled を使わず disabled だけを渡すとクラスそのものが生成されない。

再現

<IconButton icon="edit" aria-label="編集" disabled />

→ disabled 属性は付きクリックも無効になるが、背景・アイコン色は enabled のまま。

修正案

   iconButtonVariants({
     variant, size, theme,
     isLoading,
-    isDisabled,
+    isDisabled: Boolean(isDisabled || disabled),
     className,
   })

native disabled prop でも無効状態スタイルが当たることを確認するテストも追加する。

補足

• Button は isDisabled variant を持たず disabled: プレフィックス付きクラスを常に出力しているため、この問題は起きない
• 🎨 refactor: Button / Icon Button を Figma 準拠の新トークンへ移行（beta / #298 フェーズ2-4） #303（トークン移行）のレビューで CodeRabbit が指摘し、実コードで再現を確認した。🎨 refactor: Button / Icon Button を Figma 準拠の新トークンへ移行（beta / #298 フェーズ2-4） #303 以前から存在する挙動でトークン移行とは独立なので、スタイル移行 PR に混ぜず別 issue として切り出した

[touyou]

関連: outline primary / neutral の compound に isDisabled: false が無い

#303 のレビューで Copilot が指摘した件。この issue と同じ「IconButton の disabled 状態の CVA 条件が不揃い」問題なので、ここに追記しておく。

iconButtonVariants の compoundVariants で、outline の primary と neutral だけ isDisabled: false が指定されていない（solid 3 テーマ・ghost 3 テーマ・outline negative には付いている）。

outline primary : variant / theme / isLoading: false          ← isDisabled 条件なし
outline neutral : variant / theme / isLoading: false          ← isDisabled 条件なし
outline negative: variant / theme / isLoading: false / isDisabled: false

このため isDisabled: true のとき、有効時のクラス（text-object-primary-enabled / hover:* / active:*）が disabled 用クラスと同時に出力される。

• 背景・文字色そのものは disabled:*（:disabled 疑似クラス付きで詳細度が高い）が勝つので通常表示は問題ない
• ただし hover:* も :hover 付きで詳細度が同じため、無効状態のボタンにマウスを乗せると背景が変わりうる

状態

• main の時点から同じ構造（🎨 refactor: Button / Icon Button を Figma 準拠の新トークンへ移行（beta / #298 フェーズ2-4） #303 で持ち込んだものではない）
• 修正は該当 2 箇所に isDisabled: false を足すだけ。この issue の Boolean(isDisabled || disabled) 対応と同じ PR でまとめて直すのが自然
• 無効状態でも hover スタイルが当たらないことを確認するテストも併せて追加したい