Skip to content
Vy logo
  • Identitet
  • Spor
  • Resources
Components

TimePicker

A Timepicker is a component that allows the user to select a time in a user-friendly way.

FigmaGitHubReact Native

Code examples

<TimePicker />

Guidelines

Time pickers are used when you want the user to specify a time.

Pressing the left and right buttons will adjust the time by a predefined interval (5 minutes unless otherwise specified).

If the user should not be able to change the time, a time picker should not be used.

Code

<TimePicker />

import { TimePicker } from "@vygruppen/spor-react";

Lets the user pick a time

Props

Name
Type
Required?
Description
defaultValueTime
disabledboolean
errorTextstring[]This prop give a feedback about the reason of the error to user in case there are any error. It works combined with the prop invalid set to true
invalidboolean
labelstring
minuteIntervalnumberNumber of minutes to round up or down when triggering the back and forward buttons. Default 30 (minutes)
onValueChange(newTime: Time) => void
valueTime
variant "core" | "floating" | "ghost";Defaults to core