Murasaki
コンポーネント

Label

コントロールに関連付けられた、アクセシブルなラベルをレンダリングします。

import { Input, Label } from "@murasakijs/ui";export function LabelDemo() {return (  <div className="grid w-full max-w-sm items-center gap-1.5">    <Label htmlFor="email">Email</Label>    <Input type="email" id="email" placeholder="Email" />  </div>);}

使い方

import { Label } from "@murasakijs/ui";
<Label htmlFor="email">Email</Label>

API リファレンス

Props

Label は Radix UI の Label.Root をレンダリングし、ネイティブの <label> 属性をすべてそのまま渡します。htmlFor と 対象コントロールの id を一致させておくと、ラベルをクリックしたときにそのコントロー ルにフォーカスが移ります。

GitHub でこのページを改善

On this page