fix: FormControl内のInputFileのアクセシブルネームに可視ラベルを含める

[daiHash]

関連URL

https://smarthr.atlassian.net/browse/SHRUI-1069

概要

InputFile コンポーネントを <label> 要素などで紐づけた場合(FormControlで利用する時に)にアクセシブルネームに <label> 内のテキストが反映されないため、 <label> 内のテキストもInputFileのアクセシブルネームに含める

reference: https://github.com/kufu/wcag-guide/wiki/SmartHR-UI#inputfile%E3%81%AEaccessible-name%E3%81%AF%E3%81%A9%E3%82%93%E3%81%AA%E5%86%85%E5%AE%B9%E3%81%8C%E9%81%A9%E5%88%87%E3%81%8B

変更内容

FormControl内でInputFile利用する際には<label> 要素で可視ラベルとして紐づけるため、<label> 要素の可視ラベルをInputFileのアクセシブルネームに含める

メリット https://smarthr.design/accessibility/check-list/accessible-name/#h2-2

確認方法

Storybook や Chromatic で確認してください。

[pkg-pr-new[bot]]

Open in Stackblitz

pnpm add https://pkg.pr.new/kufu/smarthr-ui@5056

commit: 09d818f