Toggle Group

複数のトグルボタンを1つのグループにまとめ、排他的な単一選択(multiple なし)または複数選択(multiple)を切り替えられるコンポーネントです。ジョブアンテナでは検索結果のカード/リスト/地図の表示切替、検索条件での雇用形態の複数選択、求人フォームの給与種別の選択に使います。value / defaultValue は配列で扱い、spacing={0} で角丸を共有したセグメント表示になります。

基本

単一選択(default)、複数選択(multiple・outline)、アイコンのみの表示切替(spacing 0・sm)という3構成です。defaultValue に配列を渡して非制御で初期選択を決めます。

表示切替

検索結果の表示形式を切り替えるツールバーです。spacing={0} でボタンを連結したセグメント表示にし、単一選択で常にどれか1つが選ばれた状態を保ちます。

雇用形態

検索条件で雇用形態を絞り込むフィルタです。multiple で複数選択にし、flex-wrap で項目が増えても折り返して並びます。

給与種別

求人フォームで給与種別を1つ選ぶセグメントです。排他的な単一選択なので multiple を付けず、spacing={0} でまとまりを表します。