Verwendung
Der Date Picker wird geöffnet, indem das Datumsfeld ausgewählt wird.
Er kann
beispielsweise in der Command Bar platziert werden. Je nach Kontext kann der Date Picker auf einen Zeitpunkt
oder eine Zeitraum beschränkt werden.
Um einen Zeitraum auszuwählen, wird zuerst der erste Tag des Zeitraumes ausgewählt. Per Dropdown kann bei
Bedarf in ein anderen Monat oder anderes Jahr gesprungen werden. Mit der Auswahl eines zweiten Tages wird
das Ende des Zeitraumes beschrieben.
Die Eingabe von Zeiten ist unabhängig von der
Datumsauswahl.
Der Datepicker kann in folgenden Komponenten eingesetzt werden.
Das Datumsfeld baut auf der Core Komponente Textfield
auf.
Eigenschaften
| Name | Type | Default Value | Description |
|---|---|---|---|
id | undefined | nanoid() | |
label | string | undefined | undefined | Input Field Label |
isRange | boolean | undefined | Daterange |
value | Moment | { start: Moment, end: Moment } | undefined | Datefield value or start end date if input is range |
isDateMandatory | boolean | false | Will add an asterisk '*' to the dateRange label |
disabled | boolean | false | Datepicker is disabled |
readonly | boolean | false | Datepicker is readonly |
isLoading | boolean | false | Shows Skeleton if true |
title | string | undefined | Appears on hover |
hasTimeModificator | boolean | false | Shows TimeModificator |
hasSeconds | boolean | true | Shows seconds in TimeModificator |
hasCW | boolean | false | Shows Calendar Week in Day view |