WUI logo

TimePicker

The Time Picker component is an interactive UI element that allows users to select a specific time from a predefined format. It typically includes options for hours, minutes, and sometimes seconds, often presented in a dropdown or clock interface. This component is essential for applications requiring precise time input, such as scheduling events, setting alarms, or booking appointments, providing a user-friendly and accurate way to select times.

import * as React from 'react'
import { TimePicker } from '@welcome-ui/time-picker'
const Example = () => {
return <TimePicker name="welcome" value={new Date()} />
}
export default Example

Installation

1

Run the following command:

yarn add @welcome-ui/time-picker
2

Import component:

import { TimePicker } from '@welcome-ui/time-picker'

react-datepicker

It is based on the react-datepicker library.

Note: Pass a value of null if you don't want the default value of Date.now().

Give an Icon

Add an icon with the icon property