Input Time Picker

Overview

Sample

Show code snippetCopy code snippet
Edit sample on Codepen
v1.0.0-beta.83
Toggle preview themeToggle preview direction

API reference

calcite-input-time-picker
v1.0.0-beta.83

Properties

PropertyAttributeDescriptionTypeValues
activeactive

The active state of the time input

booleanA boolean property should be present, or not
truefalse
disableddisabled

The disabled state of the time input

booleanA boolean property should be present, or not
truefalse
intlHourintl-hour

aria-label for the hour input

optional
stringA custom string
undefined
intlHourDownintl-hour-down

aria-label for the hour down button

optional
stringA custom string
undefined
intlHourUpintl-hour-up

aria-label for the hour up button

optional
stringA custom string
undefined
intlMeridiemintl-meridiem

aria-label for the meridiem (am/pm) input

optional
stringA custom string
undefined
intlMeridiemDownintl-meridiem-down

aria-label for the meridiem (am/pm) down button

optional
stringA custom string
undefined
intlMeridiemUpintl-meridiem-up

aria-label for the meridiem (am/pm) up button

optional
stringA custom string
undefined
intlMinuteintl-minute

aria-label for the minute input

optional
stringA custom string
undefined
intlMinuteDownintl-minute-down

aria-label for the minute down button

optional
stringA custom string
undefined
intlMinuteUpintl-minute-up

aria-label for the minute up button

optional
stringA custom string
undefined
intlSecondintl-second

aria-label for the second input

optional
stringA custom string
undefined
intlSecondDownintl-second-down

aria-label for the second down button

optional
stringA custom string
undefined
intlSecondUpintl-second-up

aria-label for the second up button

optional
stringA custom string
undefined
namename

The name of the time input

stringA custom string
undefined
placementplacement

Determines where the popover will be positioned relative to the input.

typedChoose from a set of typed values
View documentation
scalescale

The scale (size) of the time input

typedChoose from a set of typed values
lm (default)s
stepstep

number (seconds) that specifies the granularity that the value must adhere to

numberA number
60 (default)
valuevalue

The selected time in UTC (always 24-hour format)

stringA custom string

Events

NameDescriptionDetail
calciteInputTimePickerChange

Fires when the time value is changed as a result of user input.

bubblescomposedcancelable
string

Methods

NameDescriptionSignatureReturns
reposition

Updates the position of the component.

reposition() => Promise<void>Promise<void>
setFocus

Sets focus on the component.

setFocus() => Promise<void>Promise<void>

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.