Label
入力欄やチェックボックスなどのフォーム部品に名前を付け、htmlFor で紐付けるためのコンポーネント。紐付けるとラベルのクリックで対象へフォーカスや切り替えができ、disabled な部品に合わせて自動で減光する。ジョブアンテナでは検索条件やWeb履歴書、管理画面の求人フォームの項目名として使う。
基本
htmlFor と id で Input や Checkbox に紐付ける基本形。disabled な Checkbox の直後に置くと peer-disabled でラベルも薄くなる。
必須マーク
Web履歴書フォームで必須・任意を示す例。Label は flex レイアウトなので、テキストの横に Badge を置くだけで揃う。
求人フォーム
管理画面の求人フォーム「給与・待遇」セクション。セレクトや数値入力にラベルを紐付け、表示イメージの補足テキストを添える。
通知設定
ラベルと説明文を左、Switch を右に置く設定画面のレイアウト。ラベルのクリックでもオン・オフが切り替わる。