Docs
カレンダー
カレンダー
ユーザーが日付を入力および編集できる日付フィールドコンポーネント。
September 2025
| Su | Mo | Tu | We | Th | Fr | Sa |
|---|---|---|---|---|---|---|
概要
Calendar コンポーネントは React DayPicker 上に構築されています。
インストール
npx shadcn-ui@latest add calendar使用法
import { Calendar } from "@/components/ui/calendar"const [date, setDate] = React.useState<Date | undefined>(new Date())
return (
<Calendar
mode="single"
selected={date}
onSelect={setDate}
className="rounded-md border"
/>
)詳細については React DayPicker ドキュメントを参照してください。
DayPicker
<Calendar> コンポーネントを使用して日付選択機能を構築できます。詳細については DayPicker ページを参照してください。