ReactのProps設計を改善。TypeScriptの型を活かす「Compound Components」実践ガイド「このボタンコンポーネントにどこまでのPropsを持たせるべきか？」 日々のコンポーネント開発で、このような判断に迷ったことはありませんか。onClick、disabled、loading、icon、variant、size…どこまで汎用化すべきか、どこで線引きすべきかという問題です。 前回まででコンポーネントの「構造」（分割と命名）と「配置」（フォルダ設計）を学んできました。今回から2回にわたって、コンポーネント間の「連携」、つまりPropsを通じたデータフローとインターフェース設計に焦点を当てます。 Propsはコンポーネント間の「契約」です。良いインターフェースは使いやすく、間違いを防ぎ、拡張可能である必要があります。 本稿では、複雑なUIを柔軟に構築するCompound Componentsパターンと、TypeScriptによる型安全なProps設計について解説します。これらの手法
