## Installation [#installation]
npm
pnpm
yarn
bun
```bash
npx shadcn@latest add @dotui/time-picker
```
```bash
pnpm dlx shadcn@latest add @dotui/time-picker
```
```bash
yarn dlx shadcn@latest add @dotui/time-picker
```
```bash
bun x shadcn@latest add @dotui/time-picker
```
## Usage [#usage]
Use time pickers to allow users to select a time using a field and a scrollable column popover.
```tsx
import { ClockIcon } from 'lucide-react'
import { Button } from '@/components/ui/button'
import { DialogContent } from '@/components/ui/dialog'
import { Label } from '@/components/ui/field'
import { DateInput, InputGroup, InputGroupAddon } from '@/components/ui/input'
import { Popover } from '@/components/ui/popover'
import { TimePicker, TimePickerColumns } from '@/components/ui/time-picker'
```
```tsx
```
## Examples [#examples]
## API Reference [#api-reference]
### TimePicker [#timepicker]