* @class * * ### Overview * The `ui5-time-picker` component provides an input field with assigned clocks which are opened on user action. * The `ui5-time-picker` allows users to select a localized time using touch, mouse, or keyboard input. * It consists of two parts: the time input field and t
| 146 | * @csspart input - Used to style the input element. This part is forwarded to the underlying ui5-input element. |
| 147 | */ |
| 148 | @customElement({ |
| 149 | tag: "ui5-time-picker", |
| 150 | languageAware: true, |
| 151 | cldr: true, |
| 152 | formAssociated: true, |
| 153 | renderer: jsxRenderer, |
| 154 | template: TimePickerTemplate, |
| 155 | styles: [ |
| 156 | TimePickerCss, |
| 157 | ResponsivePopoverCommonCss, |
| 158 | TimePickerPopoverCss, |
| 159 | ValueStateMessageCss, |
| 160 | ], |
| 161 | }) |
| 162 | /** |
| 163 | * Fired when the input operation has finished by clicking the "OK" button or |
| 164 | * when the text in the input field has changed and the focus leaves the input field. |
| 165 | * @public |
| 166 | * @param {string} value The submitted value. |
| 167 | * @param {boolean} valid Indicator if the value is in correct format pattern and in valid range. |
| 168 | */ |
| 169 | @event("change", { |
| 170 | bubbles: true, |
| 171 | }) |
| 172 | |
| 173 | /** |
| 174 | * Fired when the value of the `ui5-time-picker` is changed at each key stroke. |
| 175 | * @public |
| 176 | * @param {string} value The current value. |
| 177 | * @param {boolean} valid Indicator if the value is in correct format pattern and in valid range. |
| 178 | */ |
| 179 | @event("input", { |
| 180 | bubbles: true, |
| 181 | }) |
| 182 | /** |
| 183 | * Fired after the value-help dialog of the component is opened. |
| 184 | * @since 2.0.0 |
| 185 | * @public |
| 186 | */ |
| 187 | @event("open", { |
| 188 | bubbles: true, |
| 189 | }) |
| 190 | /** |
| 191 | * Fired after the value-help dialog of the component is closed. |
| 192 | * @since 2.0.0 |
| 193 | * @public |
| 194 | */ |
| 195 | @event("close", { |
| 196 | bubbles: true, |
| 197 | }) |
| 198 | class TimePicker extends UI5Element implements IFormInputElement { |
| 199 | eventDetails!: { |
| 200 | change: TimePickerChangeEventDetail; |
| 201 | "value-changed": TimePickerChangeEventDetail; |
| 202 | input: TimePickerInputEventDetail; |
| 203 | open: void; |
| 204 | close: void; |
| 205 | } |