@progress/kendo-angular-dateinputs 19.1.2-develop.3 → 19.1.2-develop.5

package/esm2022/datetimepicker/datetimepicker.component.mjs

@@ -67,7 +67,31 @@ const DATE_TAB_BUTTON_SELECTOR = '.k-button.k-group-start';
 const TIME_TAB_BUTTON_SELECTOR = '.k-button.k-group-end';
 const TODAY_BUTTON_SELECTOR = '.k-button.k-calendar-nav-today';
 /**
- * Represents the [Kendo UI DateTimePicker component for Angular]({% slug overview_datetimepicker %}).
+ * Represents the Kendo UI DateTimePicker component for Angular.
+ * Allows users to select both date and time values from an interactive calendar and time selector.
+ *
+ * @example
+ * ```typescript
+ * @Component({
+ *   selector: 'my-app',
+ *   template: `
+ *     <kendo-datetimepicker
+ *       [(value)]="dateTimeValue"
+ *       [format]="'g'"
+ *       [min]="minDate"
+ *       [max]="maxDate">
+ *     </kendo-datetimepicker>
+ *   `
+ * })
+ * export class AppComponent {
+ *   public dateTimeValue: Date = new Date();
+ *   public minDate: Date = new Date(2000, 0, 1);
+ *   public maxDate: Date = new Date(2030, 11, 31);
+ * }
+ * ```
+ *
+ * @remarks
+ * Supported children components are: {@link DateTimePickerCustomMessagesComponent}.
  */
 export class DateTimePickerComponent extends MultiTabStop {
     popupService;
@@ -132,15 +156,16 @@ export class DateTimePickerComponent extends MultiTabStop {
     weekDaysFormat = "short";
     /**
      * Displays the days that fall out of the current month in the Calendar ([see example]({% slug datetimepicker_calendar_options %}#toc-displaying-other-month-days)).
-     * The default values per Calendar type are:
-     * - `infinite` - false
-     * - `classic` - true
+     * You can set this to show or hide days from other months.
+     *
+     * For infinite Calendar the default value is `false`, while for classic Calendar it is `true`.
      */
     showOtherMonthDays;
     /**
-     * Specifies the value of the DateTimePicker component.
+     * Sets the value of the DateTimePicker component.
+     * You can set a specific date and time for the picker to display and use.
      *
-     * > The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance or `null`.
+     * The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance or `null`.
      */
     set value(value) {
         this.verifyValue(value);
@@ -153,13 +178,12 @@ export class DateTimePickerComponent extends MultiTabStop {
     }
     /**
      * Specifies the date format for displaying the input value
-     * ([see example]({% slug formats_datetimepicker %}))
+     * ([see example]({% slug formats_datetimepicker %})).
      *
-     * Format value options:
-     * - `string` - Provide a `string` if a single format is going to be used regardless whether the input is focused or blurred.
-     * - [`FormatSettings`]({% slug api_dateinputs_formatsettings %}) - To display different formats when the component is focused or blurred, provide a settings object with specified `inputFormat` and `displayFormat` values.
+     * When using a string format, the same format is applied regardless of whether the input is focused or blurred.
+     * When using a FormatSettings object, you can specify different inputFormat and displayFormat values for focused and blurred states.
      *
-     * > If a [`FormatSettings`]({% slug api_dateinputs_formatsettings %}) object is provided, the `displayFormat` value will be used for the popup TimePicker.
+     * If a FormatSettings object is provided, the displayFormat value will be used for the popup TimePicker.
      */
     set format(format) {
         this._format = format;
@@ -175,6 +199,7 @@ export class DateTimePickerComponent extends MultiTabStop {
      *
      * The default value is 68, indicating that typing any value less than 69
      * will be assumed to be 20xx, while 69 and larger will be assumed to be 19xx.
+     * @default 68
      */
     twoDigitYearMax = TWO_DIGIT_YEAR_MAX;
     /**
@@ -203,10 +228,9 @@ export class DateTimePickerComponent extends MultiTabStop {
      * Configures the popup settings of the DateTimePicker
      * ([see example]({% slug datetimepicker_popup_options %}#toc-customizing-the-popup)).
      *
-     * The available options are:
-     * - `animate: Boolean`&mdash;Controls the popup animation. By default, the open and close animations are enabled.
-     * - `appendTo: 'root' | 'component' | ViewContainerRef`&mdash;Controls the popup container. By default, the popup will be appended to the root component.
-     * - `popupClass: String`&mdash;Specifies a list of CSS classes that are used to style the popup.
+     * The available options are animate which controls the popup animation and by default, the open and close animations are enabled.
+     * The `appendTo` option controls the popup container and by default, the popup will be appended to the root component.
+     * The `popupClass` option specifies a list of CSS classes that are used to style the popup.
      */
     set popupSettings(settings) {
         this._popupSettings = Object.assign({}, { animate: true }, settings);
@@ -215,39 +239,46 @@ export class DateTimePickerComponent extends MultiTabStop {
         return this._popupSettings;
     }
     /**
-     * Sets the title of the input element of the DateTimePicker and the title text rendered
-     * in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
+     * Specifies the title of the input element of the DateTimePicker and the title text rendered
+     * in the header of the popup (action sheet). Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
+     * @default ''
      */
     adaptiveTitle = '';
     /**
-     * Sets the subtitle text rendered in the header of the popup(action sheet).
+     * Specifies the subtitle text rendered in the header of the popup (action sheet).
      * Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
+     * @default ''
      */
     adaptiveSubtitle = '';
     /**
-     * Sets or gets the `disabled` property of the DateTimePicker and determines whether the component is active
+     * Specifies the `disabled` property of the DateTimePicker and determines whether the component is active
      * ([see example]({% slug disabled_datetimepicker %})).
      * To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_datetimepicker#toc-managing-the-datetimepicker-disabled-state-in-reactive-forms).
+     * @default false
      */
     disabled = false;
     /**
-     * Sets the read-only state of the DateTimePicker
+     * Specifies the read-only state of the DateTimePicker
      * ([see example]({% slug readonly_datetimepicker %}#toc-read-only-datetimepicker)).
+     * @default false
      *
      * @default false
      */
     readonly = false;
     /**
-     * Sets the read-only state of the DateTimePicker input field
+     * Determines whether the input field of the DateTimePicker is read-only
      * ([see example]({% slug readonly_datetimepicker %}#toc-read-only-input)).
      *
-     * > Note that if you set the [`readonly`]({% slug api_dateinputs_datetimepickercomponent %}#toc-readonly) property value to `true`,
+     * If you set the [`readonly`]({% slug api_dateinputs_datetimepickercomponent %}#toc-readonly) property value to `true`,
      * the input will be rendered in a read-only state regardless of the `readOnlyInput` value.
+     *
+     * @default false
      */
     readOnlyInput = false;
     /**
      * Determines whether to display the **Cancel** button in the popup
      * ([see example]({% slug datetimepicker_popup_options %}#toc-toggling-the-cancel-button)).
+     * @default true
      */
     cancelButton = true;
     /**
@@ -273,17 +304,14 @@ export class DateTimePickerComponent extends MultiTabStop {
     /**
      * Specifies the Calendar type.
      *
-     * The possible values are:
-     * - `infinite` (default)
-     * - `classic`
-     *
+     * @default 'infinite'
      */
     calendarType = 'infinite';
     /**
      * Determines whether to enable animation when navigating to previous/next Calendar view.
      * Applies to the [`classic`]({% slug api_dateinputs_datetimepickercomponent %}#toc-calendartype) Calendar only.
      *
-     * > This feature uses the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API). In order to run the animation in browsers that do not support it, you need the `web-animations-js` polyfill.
+     * The feature uses the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API). In order to run the animation in browsers that do not support it, you need the `web-animations-js` polyfill.
      *
      * @default false
      */
@@ -291,6 +319,7 @@ export class DateTimePickerComponent extends MultiTabStop {
     /**
      * Determines whether to display a week number column in the `month` view of the popup Calendar
      * ([see example]({% slug datetimepicker_calendar_options %}#toc-week-number-column)).
+     * @default false
      */
     weekNumber = false;
     /**
@@ -322,24 +351,25 @@ export class DateTimePickerComponent extends MultiTabStop {
         return this._max;
     }
     /**
-     * Determines whether the built-in min or max validators are enforced when validating a form
+     * Determines whether the built-in `min` or `max` validators are enforced when validating a form
      * ([see example](slug:dateranges_datetimepicker)).
      *
      * @default true
      */
     rangeValidation = true;
     /**
-     * Determines whether the built-in validator for disabled
-     * date ranges is enforced when validating a form
+     * Determines whether the built-in validator for disabled date ranges is enforced when validating a form
      * ([see example](slug:disabled_dates_datetimepicker)).
+     * @default true
      */
     disabledDatesValidation = true;
     /**
-     * Determines whether the built-in validation for incomplete dates is to be enforced when a form is being validated.
+     * Determines whether the built-in validation for incomplete dates is enforced when validating a form.
+     * @default false
      */
     incompleteDateValidation = false;
     /**
-     * Determines whether to autocorrect invalid segments automatically.
+     * Determines whether to auto correct invalid segments automatically.
      *
      * @default true
      */
@@ -351,39 +381,40 @@ export class DateTimePickerComponent extends MultiTabStop {
      */
     autoSwitchParts = true;
     /**
-     * A string array representing custom keys, which will move the focus to the next date format segment.
+     * Specifies custom keys that move the focus to the next date format segment.
      */
     autoSwitchKeys = [];
     /**
-     * Indicates whether the mouse scroll can be used to increase/decrease the time segments values.
+     * Determines whether you can use the mouse scroll to increase or decrease the time segment values.
      *
      * @default true
      */
     enableMouseWheel = true;
     /**
-     * Determines if the users should see a blinking caret inside the Date Input when possible.
+     * Determines whether you can see a blinking caret inside the DateInput when possible.
      *
      * @default false
      */
     allowCaretMode = false;
     /**
-     * If set to `true`, renders a clear button after the input text or DateTimePicker value has been changed.
+     * Renders a clear button when set to `true` after the input text or DateTimePicker value has been changed.
      * Clicking this button resets the value of the component to `null` and triggers the `valueChange` event.
      * @default false
      */
     clearButton = false;
     /**
-     * When enabled, the DateTimePicker will autofill the rest of the date to the current date when the component loses focus.
+     * Auto fills the rest of the date to the current date when the component loses focus.
      *
      * @default false
      */
     autoFill = false;
     /**
-     * Enables or disables the adaptive mode. By default the adaptive rendering is disabled.
+     * Enables or disables the adaptive mode. The adaptive rendering is disabled by default.
+     * @default 'none'
      */
     adaptiveMode = 'none';
     /**
-     * Sets the HTML attributes of the inner focusable input element. Attributes which are essential for certain component functionalities cannot be changed.
+     * Specifies the HTML attributes of the inner focusable input element. You cannot change attributes that are essential for certain component functionalities.
      */
     inputAttributes;
     /**
@@ -418,7 +449,7 @@ export class DateTimePickerComponent extends MultiTabStop {
      */
     escape = new EventEmitter();
     /**
-     * Indicates whether the component is currently open. That is when the popup or actionSheet is open.
+     * Indicates whether the component is currently open. This is when the popup or action sheet is open.
      */
     get isOpen() {
         return this.actionSheet?.expanded || isPresent(this.popupRef);
@@ -439,7 +470,7 @@ export class DateTimePickerComponent extends MultiTabStop {
         this._isActive = value;
     }
     /**
-     * Sets the active tab on opening the popup
+     * Specifies the active tab when opening the popup
      * ([see example]({% slug datetimepicker_popup_options %}#toc-setting-the-default-tab)).
      */
     set defaultTab(tab) {
@@ -450,19 +481,13 @@ export class DateTimePickerComponent extends MultiTabStop {
         return this._defaultTab;
     }
     /**
-     * Sets the size of the component.
-     *
-     * The possible values are:
-     * * `small`
-     * * `medium` (Default)
-     * * `large`
-     * * `none`
+     * Specifies the size of the component.
      *
      */
     set size(size) {
         this.renderer.removeClass(this.wrapper.nativeElement, getSizeClass('input', this.size));
         this.renderer.removeClass(this.toggleButton.nativeElement, getSizeClass('button', this.size));
-        const newSize = size ? size : DEFAULT_SIZE;
+        const newSize = size || DEFAULT_SIZE;
         if (newSize !== 'none') {
             this.renderer.addClass(this.wrapper.nativeElement, getSizeClass('input', newSize));
             this.renderer.addClass(this.toggleButton.nativeElement, getSizeClass('button', newSize));
@@ -473,19 +498,12 @@ export class DateTimePickerComponent extends MultiTabStop {
         return this._size;
     }
     /**
-     * Sets the border radius of the component.
-     *
-     * The possible values are:
-     * * `small`
-     * * `medium` (Default)
-     * * `large`
-     * * `full`
-     * * `none`
+     * Specifies the border radius of the component.
      *
      */
     set rounded(rounded) {
         this.renderer.removeClass(this.wrapper.nativeElement, getRoundedClass(this.rounded));
-        const newRounded = rounded ? rounded : DEFAULT_ROUNDED;
+        const newRounded = rounded || DEFAULT_ROUNDED;
         if (newRounded !== 'none') {
             this.renderer.addClass(this.wrapper.nativeElement, getRoundedClass(newRounded));
         }
@@ -495,20 +513,14 @@ export class DateTimePickerComponent extends MultiTabStop {
         return this._rounded;
     }
     /**
-     * Sets the fillMode of the component.
-     *
-     * The possible values are:
-     * * `solid` (Default)
-     * * `flat`
-     * * `outline`
-     * * `none`
+     * Specifies the fill mode of the component.
      *
      */
     set fillMode(fillMode) {
         this.renderer.removeClass(this.wrapper.nativeElement, getFillModeClass('input', this.fillMode));
         this.renderer.removeClass(this.toggleButton.nativeElement, getFillModeClass('button', this.fillMode));
         this.renderer.removeClass(this.toggleButton.nativeElement, `k-button-${this.fillMode}-base`);
-        const newFillMode = fillMode ? fillMode : DEFAULT_FILL_MODE;
+        const newFillMode = fillMode || DEFAULT_FILL_MODE;
         if (newFillMode !== 'none') {
             this.renderer.addClass(this.wrapper.nativeElement, getFillModeClass('input', newFillMode));
             this.renderer.addClass(this.toggleButton.nativeElement, getFillModeClass('button', newFillMode));
@@ -829,8 +841,8 @@ export class DateTimePickerComponent extends MultiTabStop {
         this.subscriptions.unsubscribe();
     }
     /**
-     * * If the popup is closed, focuses the DateTimePicker input.
-     * * If the popup is open, the focus is moved to its content.
+     * Focuses the DateTimePicker input if the popup is closed.
+     * Moves the focus to the popup content if the popup is open.
      */
     focus() {
         if (this.disabled) {
@@ -844,7 +856,7 @@ export class DateTimePickerComponent extends MultiTabStop {
         }
     }
     /**
-     * Blurs the DateTimePicker.
+     * Blurs the DateTimePicker component.
      */
     blur() {
         if (this.isOpen && this.activeTabComponent.isActive) {
@@ -855,8 +867,8 @@ export class DateTimePickerComponent extends MultiTabStop {
         }
     }
     /**
-     * Toggles the visibility of the popup or actionSheet.
-     * If you use the `toggle` method to show or hide the popup or actionSheet,
+     * Toggles the visibility of the popup or action sheet.
+     * If you use the `toggle` method to show or hide the popup or action sheet,
      * the `open` and `close` events do not fire.
      *
      * @param show - The state of the popup.
@@ -1264,10 +1276,10 @@ export class DateTimePickerComponent extends MultiTabStop {
         }
     }
     /**
-     * Extracts the time slots and the literals that are not preceded by date parts
-     * and concatenates the resulting parts into a string.
-     * If the provided format value does not contain any time parts,
-     * returns the designated format of the default popup component of the TimePicker.
+     * Extracts the time slots and literals that are not preceded by date parts
+     * and combines the resulting parts into a string.
+     * If the provided `format` value does not contain any time parts,
+     * returns the designated format of the default popup component of the `TimePicker`.
      */
     getTimeSelectorFormat(format) {
         const timeSelectorFormat = this.intl
@@ -1278,7 +1290,7 @@ export class DateTimePickerComponent extends MultiTabStop {
     }
     /**
      * Extracts the `displayFormat` from the provided `string | FormatSettings` value.
-     * Fallbacks to the default input value, if a falsy value param is passed.
+     * Falls back to the default input value if a falsy value parameter is passed.
      */
     getDisplayFormat(format) {
         if (!format) {
@@ -1294,7 +1306,7 @@ export class DateTimePickerComponent extends MultiTabStop {
     /**
      * The filter expression that filters out all format parts
      * except for `hour`, `minute`, `second`, `dayperiod`, and specific literals.
-     * Literals will be left only if they are not preceded by date parts.
+     * Literals remain only if they are not preceded by date parts.
      */
     timeFormatPartFilter(part, index, parts) {
         const previousPart = index >= 1 && parts[index - 1];
@@ -1404,8 +1416,8 @@ export class DateTimePickerComponent extends MultiTabStop {
         this.valueChange.emit(cloneDate(value));
     }
     /**
-     * Indicates whether the focus target is part of this component,
-     * that is, whether the focus target is inside the component or in the popup.
+     * Indicates whether the focus target is part of this component.
+     * Checks whether the focus target is inside the component or in the popup.
      */
     focusTargetInComponent(event) {
         if (!isPresent(event)) {
@@ -1428,7 +1440,7 @@ export class DateTimePickerComponent extends MultiTabStop {
         this.calendarValue = isInCalendarRange ? getDate(value) : null;
     }
     /**
-     * If the popup is available, runs a popup change detection.
+     * Runs a popup change detection if the popup is available.
      */
     detectPopupChanges() {
         if (!this.isOpen || this.isAdaptive) {
@@ -1437,8 +1449,8 @@ export class DateTimePickerComponent extends MultiTabStop {
         this.popupRef.popup.changeDetectorRef.detectChanges();
     }
     /**
-     * Depending on the predicate `runInZone` value that is passed,
-     * runs the provided function either in the Angular or in the current zone.
+     * Runs the provided function either in the Angular zone or in the current zone.
+     * The execution zone depends on the predicate `runInZone` value that is passed.
      */
     run(runInZone, fn) {
         if (runInZone) {

package/esm2022/datetimepicker/datetimepicker.module.mjs

@@ -36,8 +36,22 @@ import * as i12 from "../calendar/templates/year-cell-template.directive";
 import * as i13 from "@progress/kendo-angular-common";
 // IMPORTANT: NgModule export kept for backwards compatibility
 /**
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
- * definition for the DateTimePicker component.
+ * Required for adding all DateTimePicker features in [NgModule-based](link:site.data.urls.angular['ngmoduleapi']) Angular applications.
+ *
+ * @example
+ * ```typescript
+ * import { NgModule } from '@angular/core';
+ * import { BrowserModule } from '@angular/platform-browser';
+ * import { DateTimePickerModule } from '@progress/kendo-angular-dateinputs';
+ *
+ * @NgModule({
+ *   imports: [
+ *     BrowserModule,
+ *     DateTimePickerModule
+ *   ]
+ * })
+ * export class AppModule { }
+ * ```
  */
 export class DateTimePickerModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DateTimePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });

package/esm2022/datetimepicker/localization/datetimepicker-custom-messages.component.mjs

@@ -8,7 +8,16 @@ import { DateTimePickerMessages } from './messages';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
 /**
- * Custom component messages override default component messages ([see example]({% slug globalization_dateinputs %}#toc-custom-messages)).
+ * Allows you to override the default messages of the DateTimePicker component ([see example]({% slug globalization_dateinputs %}#toc-custom-messages)).
+ *
+ * @example
+ * ```html
+ * <kendo-datetimepicker>
+ *   <kendo-datetimepicker-messages
+ *     toggle="Open calendar">
+ *   </kendo-datetimepicker-messages>
+ * </kendo-datetimepicker>
+ * ```
  */
 export class DateTimePickerCustomMessagesComponent extends DateTimePickerMessages {
     service;

package/esm2022/package-metadata.mjs

@@ -10,7 +10,7 @@ export const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1750152543,
-    version: '19.1.2-develop.3',
+    publishDate: 1750430884,
+    version: '19.1.2-develop.5',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/esm2022/timepicker/localization/messages.mjs

@@ -10,59 +10,59 @@ import * as i0 from "@angular/core";
  */
 export class TimePickerMessages extends ComponentMessages {
     /**
-     * The text of the **Accept** button in the popup footer of the TimeList.
+     * Specifies the text of the **Accept** button in the popup footer of the TimeList.
      */
     accept;
     /**
-     * The label of the **Accept** button in the popup footer of the TimeList.
+     * Specifies the label of the **Accept** button in the popup footer of the TimeList.
      */
     acceptLabel;
     /**
-     * The text of the **Cancel** button in the popup footer of the TimeList.
+     * Specifies the text of the **Cancel** button in the popup footer of the TimeList.
      */
     cancel;
     /**
-     * The label of the **Cancel** button in the popup footer of the TimeList.
+     * Specifies the label of the **Cancel** button in the popup footer of the TimeList.
      */
     cancelLabel;
     /**
-     * The text of the **Now** button in the popup header of the TimeList.
+     * Specifies the text of the **Now** button in the popup header of the TimeList.
      */
     now;
     /**
-     * The label of the **Now** button in the popup header of the TimeList.
+     * Specifies the label of the **Now** button in the popup header of the TimeList.
      */
     nowLabel;
     /**
-     * The title of the **Toggle** button of the TimePicker.
+     * Specifies the title of the **Toggle** button of the TimePicker.
      */
     toggle;
     /**
-     * The label of the **Hour** part in the TimePicker.
+     * Specifies the label of the **Hour** part in the TimePicker.
      */
     hour;
     /**
-     * The label of the **Minute** part in the TimePicker.
+     * Specifies the label of the **Minute** part in the TimePicker.
      */
     minute;
     /**
-     * The label of the **Second** part in the TimePicker.
+     * Specifies the label of the **Second** part in the TimePicker.
      */
     second;
     /**
-     * The label of the **Millisecond** part in the TimePicker.
+     * Specifies the label of the **Millisecond** part in the TimePicker.
      */
     millisecond;
     /**
-     * The label of the **Dayperiod** part in the TimePicker.
+     * Specifies the label of the **Dayperiod** part in the TimePicker.
      */
     dayperiod;
     /**
-     * The title of the **Clear** button of the TimePicker.
+     * Specifies the title of the **Clear** button of the TimePicker.
      */
     clearTitle;
     /**
-     * The title of the Close button of the ActionSheet that is rendered instead of the Popup when using small screen devices in adaptive mode.
+     * Specifies the title of the **Close** button of the ActionSheet that renders instead of the popup when using small screen devices in adaptive mode.
      */
     adaptiveCloseButtonTitle;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TimePickerMessages, deps: null, target: i0.ɵɵFactoryTarget.Directive });

package/esm2022/timepicker/localization/timepicker-custom-messages.component.mjs

@@ -8,7 +8,18 @@ import { TimePickerMessages } from './messages';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
 /**
- * Custom component messages override default component messages ([see example]({% slug globalization_dateinputs %}#toc-custom-messages)).
+ * Represents the Kendo UI TimePicker custom messages component for Angular. Allows you to override default component messages ([see example]({% slug globalization_dateinputs %}#toc-custom-messages)).
+ *
+ * @example
+ * ```html
+ * <kendo-timepicker>
+ *   <kendo-timepicker-messages
+ *     accept="Apply"
+ *     cancel="Close"
+ *     now="Current time">
+ *   </kendo-timepicker-messages>
+ * </kendo-timepicker>
+ * ```
  */
 export class TimePickerCustomMessagesComponent extends TimePickerMessages {
     service;