Capture time from the user
TimeInput component supports Input and Input.Wrapper component features and all input element props. The TimeInput documentation does not include all features supported by the component – see the Input documentation to learn about all available features.
The TimeInput component is based on the native input[type="time"] element and does not support most advanced features like choosing time format or custom dropdown with time select. If you need more features, use the TimePicker component instead.
TimeInput features/limitations:
You can show the browser picker by calling the showPicker method of the input element. Note that some browsers (desktop Safari) do not support this feature and the method will do nothing.
If TimeInput is used without the label prop, it will not be announced properly by screen readers:
Set aria-label to make the input accessible. In this case the label will not be visible, but screen readers will announce it:
If the label prop is set, the input will be accessible and it is not required to set aria-label :