@gravionlabs/helix-core 22.0.0

package/types/gravionlabs-helix-core-datepicker.d.ts

@@ -0,0 +1,969 @@
+import { DatePickerPassThrough, DatePickerResponsiveOptions, DatePickerTypeView, DatePickerMonthChangeEvent, DatePickerYearChangeEvent, Month, DatePickerDateTemplateContext, DatePickerDisabledDateTemplateContext, DatePickerDecadeTemplateContext, DatePickerInputIconTemplateContext, DatePickerButtonBarTemplateContext, NavigationState, LocaleSettings } from '@gravionlabs/helix-core/types/datepicker';
+export * from '@gravionlabs/helix-core/types/datepicker';
+import * as _angular_core from '@angular/core';
+import { ElementRef, TemplateRef, NgZone } from '@angular/core';
+import { MotionOptions, MotionEvent } from '@gravionlabs/helix-core/uix/motion';
+import * as i2 from '@gravionlabs/helix-core/api';
+import { OverlayService, HelixTemplate } from '@gravionlabs/helix-core/api';
+import { BaseInput } from '@gravionlabs/helix-core/baseinput';
+import * as i1 from '@gravionlabs/helix-core/bind';
+import { Bind } from '@gravionlabs/helix-core/bind';
+import { ConnectedOverlayScrollHandler } from '@gravionlabs/helix-core/dom';
+import { Nullable, VoidListener } from '@gravionlabs/helix-core/ts-helpers';
+import { Subscription } from 'rxjs';
+import { BaseStyle } from '@gravionlabs/helix-core/base';
+
+/**
+ *
+ * DatePicker is a form component to work with dates.
+ *
+ * [Live Demo](https://www.primeng.org/datepicker/)
+ *
+ * @module datepickerstyle
+ *
+ */
+declare enum DatePickerClasses {
+    /**
+     * Class name of the root element
+     */
+    root = "h-datepicker",
+    /**
+     * Class name of the input element
+     */
+    pcInputText = "h-datepicker-input",
+    /**
+     * Class name of the dropdown element
+     */
+    dropdown = "h-datepicker-dropdown",
+    /**
+     * Class name of the input icon container element
+     */
+    inputIconContainer = "h-datepicker-input-icon-container",
+    /**
+     * Class name of the input icon element
+     */
+    inputIcon = "h-datepicker-input-icon",
+    /**
+     * Class name of the panel element
+     */
+    panel = "h-datepicker-panel",
+    /**
+     * Class name of the calendar container element
+     */
+    calendarContainer = "h-datepicker-calendar-container",
+    /**
+     * Class name of the calendar element
+     */
+    calendar = "h-datepicker-calendar",
+    /**
+     * Class name of the header element
+     */
+    header = "h-datepicker-header",
+    /**
+     * Class name of the previous button element
+     */
+    pcPrevButton = "h-datepicker-prev-button",
+    /**
+     * Class name of the title element
+     */
+    title = "h-datepicker-title",
+    /**
+     * Class name of the select month element
+     */
+    selectMonth = "h-datepicker-select-month",
+    /**
+     * Class name of the select year element
+     */
+    selectYear = "h-datepicker-select-year",
+    /**
+     * Class name of the decade element
+     */
+    decade = "h-datepicker-decade",
+    /**
+     * Class name of the next button element
+     */
+    pcNextButton = "h-datepicker-next-button",
+    /**
+     * Class name of the day view element
+     */
+    dayView = "h-datepicker-day-view",
+    /**
+     * Class name of the week header element
+     */
+    weekHeader = "h-datepicker-weekheader",
+    /**
+     * Class name of the week number element
+     */
+    weekNumber = "h-datepicker-weeknumber",
+    /**
+     * Class name of the week label container element
+     */
+    weekLabelContainer = "h-datepicker-weeklabel-container",
+    /**
+     * Class name of the week day cell element
+     */
+    weekDayCell = "h-datepicker-weekday-cell",
+    /**
+     * Class name of the week day element
+     */
+    weekDay = "h-datepicker-weekday",
+    /**
+     * Class name of the day cell element
+     */
+    dayCell = "h-datepicker-day-cell",
+    /**
+     * Class name of the day element
+     */
+    day = "h-datepicker-day",
+    /**
+     * Class name of the month view element
+     */
+    monthView = "h-datepicker-month-view",
+    /**
+     * Class name of the month element
+     */
+    month = "h-datepicker-month",
+    /**
+     * Class name of the year view element
+     */
+    yearView = "h-datepicker-year-view",
+    /**
+     * Class name of the year element
+     */
+    year = "h-datepicker-year",
+    /**
+     * Class name of the time picker element
+     */
+    timePicker = "h-datepicker-time-picker",
+    /**
+     * Class name of the hour picker element
+     */
+    hourPicker = "h-datepicker-hour-picker",
+    /**
+     * Class name of the increment button element
+     */
+    pcIncrementButton = "h-datepicker-increment-button",
+    /**
+     * Class name of the decrement button element
+     */
+    pcDecrementButton = "h-datepicker-decrement-button",
+    /**
+     * Class name of the separator element
+     */
+    separator = "h-datepicker-separator",
+    /**
+     * Class name of the minute picker element
+     */
+    minutePicker = "h-datepicker-minute-picker",
+    /**
+     * Class name of the second picker element
+     */
+    secondPicker = "h-datepicker-second-picker",
+    /**
+     * Class name of the ampm picker element
+     */
+    ampmPicker = "h-datepicker-ampm-picker",
+    /**
+     * Class name of the buttonbar element
+     */
+    buttonbar = "h-datepicker-buttonbar",
+    /**
+     * Class name of the today button element
+     */
+    pcTodayButton = "h-datepicker-today-button",
+    /**
+     * Class name of the clear button element
+     */
+    pcClearButton = "h-datepicker-clear-button",
+    /**
+     * Class name of the clear icon
+     */
+    clearIcon = "h-datepicker-clear-icon"
+}
+declare class DatePickerStyle extends BaseStyle {
+    name: string;
+    style: string;
+    classes: {
+        root: ({ instance }: {
+            instance: any;
+        }) => (string | {
+            'h-invalid': any;
+            'h-datepicker-fluid': any;
+            'h-inputwrapper-filled': any;
+            'h-variant-filled': boolean;
+            'h-inputwrapper-focus': any;
+            'h-focus': any;
+        })[];
+        pcInputText: string;
+        dropdown: string;
+        inputIconContainer: string;
+        inputIcon: string;
+        panel: ({ instance }: {
+            instance: any;
+        }) => (string | {
+            'h-datepicker-panel h-component': boolean;
+            'h-datepicker-panel-inline': any;
+            'h-disabled': any;
+            'h-datepicker-timeonly': any;
+        })[];
+        calendarContainer: string;
+        calendar: string;
+        header: string;
+        pcPrevButton: string;
+        title: string;
+        selectMonth: string;
+        selectYear: string;
+        decade: string;
+        pcNextButton: string;
+        dayView: string;
+        weekHeader: string;
+        weekNumber: string;
+        weekLabelContainer: string;
+        weekDayCell: string;
+        weekDay: string;
+        dayCell: ({ date }: {
+            date: any;
+        }) => (string | {
+            'h-datepicker-other-month': any;
+            'h-datepicker-today': any;
+        })[];
+        day: ({ instance, date }: {
+            instance: any;
+            date: any;
+        }) => {
+            [x: string]: any;
+            'h-datepicker-day': boolean;
+            'h-datepicker-day-selected': any;
+            'h-disabled': any;
+        };
+        monthView: string;
+        month: ({ instance, index }: {
+            instance: any;
+            index: any;
+        }) => (string | {
+            'h-datepicker-month-selected': any;
+            'h-disabled': any;
+        })[];
+        yearView: string;
+        year: ({ instance, year }: {
+            instance: any;
+            year: any;
+        }) => (string | {
+            'h-datepicker-year-selected': any;
+            'h-disabled': any;
+        })[];
+        timePicker: string;
+        hourPicker: string;
+        pcIncrementButton: string;
+        pcDecrementButton: string;
+        separator: string;
+        minutePicker: string;
+        secondPicker: string;
+        ampmPicker: string;
+        buttonbar: string;
+        pcTodayButton: string;
+        pcClearButton: string;
+        clearIcon: string;
+    };
+    inlineStyles: {
+        root: () => {
+            position: string;
+        };
+    };
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatePickerStyle, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<any>;
+}
+interface DatePickerStyle extends BaseStyle {
+}
+
+declare const DATEPICKER_VALUE_ACCESSOR: any;
+/**
+ * DatePicker is a form component to work with dates.
+ * @group Components
+ */
+declare class DatePicker extends BaseInput<DatePickerPassThrough> {
+    private zone;
+    overlayService: OverlayService;
+    componentName: string;
+    bindDirectiveInstance: Bind;
+    $pcDatePicker: DatePicker | undefined;
+    readonly iconDisplay: _angular_core.InputSignal<"input" | "button">;
+    /**
+     * Style class of the component.
+     * @deprecated since v20.0.0, use `class` instead.
+     * @group Props
+     */
+    readonly styleClass: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Inline style of the input field.
+     * @group Props
+     */
+    readonly inputStyle: _angular_core.InputSignal<{
+        [klass: string]: any;
+    } | null | undefined>;
+    /**
+     * Identifier of the focus input to match a label defined for the component.
+     * @group Props
+     */
+    readonly inputId: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Style class of the input field.
+     * @group Props
+     */
+    readonly inputStyleClass: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Placeholder text for the input.
+     * @group Props
+     */
+    readonly placeholder: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
+     * @group Props
+     */
+    readonly ariaLabelledBy: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Defines a string that labels the input for accessibility.
+     * @group Props
+     */
+    readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Defines a string that labels the icon button for accessibility.
+     * @group Props
+     */
+    readonly iconAriaLabel: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Format of the date which can also be defined at locale settings.
+     * @group Props
+     */
+    readonly dateFormat: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Separator for multiple selection mode.
+     * @group Props
+     */
+    readonly multipleSeparator: _angular_core.InputSignal<string>;
+    /**
+     * Separator for joining start and end dates on range selection mode.
+     * @group Props
+     */
+    readonly rangeSeparator: _angular_core.InputSignal<string>;
+    /**
+     * When enabled, displays the datepicker as inline. Default is false for popup mode.
+     * @group Props
+     */
+    readonly inline: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether to display dates in other months (non-selectable) at the start or end of the current month. To make these days selectable use the selectOtherMonths option.
+     * @group Props
+     */
+    readonly showOtherMonths: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether days in other months shown before or after the current month are selectable. This only applies if the showOtherMonths option is set to true.
+     * @group Props
+     */
+    readonly selectOtherMonths: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * When enabled, displays a button with icon next to input.
+     * @group Props
+     */
+    readonly showIcon: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * Icon of the datepicker button.
+     * @group Props
+     */
+    readonly icon: _angular_core.InputSignal<string | undefined>;
+    /**
+     * When specified, prevents entering the date manually with keyboard.
+     * @group Props
+     */
+    readonly readonlyInput: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * The cutoff year for determining the century for a date.
+     * @group Props
+     */
+    readonly shortYearCutoff: _angular_core.InputSignal<any>;
+    /**
+     * Specifies 12 or 24 hour format.
+     * @group Props
+     */
+    readonly hourFormat: _angular_core.InputSignal<string>;
+    /**
+     * Whether to display timepicker only.
+     * @group Props
+     */
+    readonly timeOnly: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * Hours to change per step.
+     * @group Props
+     */
+    readonly stepHour: _angular_core.InputSignalWithTransform<number, unknown>;
+    /**
+     * Minutes to change per step.
+     * @group Props
+     */
+    readonly stepMinute: _angular_core.InputSignalWithTransform<number, unknown>;
+    /**
+     * Seconds to change per step.
+     * @group Props
+     */
+    readonly stepSecond: _angular_core.InputSignalWithTransform<number, unknown>;
+    /**
+     * Whether to show the seconds in time picker.
+     * @group Props
+     */
+    readonly showSeconds: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * When disabled, datepicker will not be visible with input focus.
+     * @group Props
+     */
+    readonly showOnFocus: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * When enabled, datepicker will show week numbers.
+     * @group Props
+     */
+    readonly showWeek: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * When enabled, datepicker will start week numbers from first day of the year.
+     * @group Props
+     */
+    readonly startWeekFromFirstDayOfYear: _angular_core.InputSignal<boolean>;
+    /**
+     * When enabled, a clear icon is displayed to clear the value.
+     * @group Props
+     */
+    readonly showClear: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Type of the value to write back to ngModel, default is date and alternative is string.
+     * @group Props
+     */
+    readonly dataType: _angular_core.InputSignal<string>;
+    /**
+     * Defines the quantity of the selection, valid values are "single", "multiple" and "range".
+     * @group Props
+     */
+    readonly selectionMode: _angular_core.InputSignal<"single" | "multiple" | "range" | undefined>;
+    /**
+     * Maximum number of selectable dates in multiple mode.
+     * @group Props
+     */
+    readonly maxDateCount: _angular_core.InputSignalWithTransform<number | undefined, unknown>;
+    /**
+     * Whether to display today and clear buttons at the footer
+     * @group Props
+     */
+    readonly showButtonBar: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * Style class of the today button.
+     * @group Props
+     */
+    readonly todayButtonStyleClass: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Style class of the clear button.
+     * @group Props
+     */
+    readonly clearButtonStyleClass: _angular_core.InputSignal<string | undefined>;
+    /**
+     * When present, it specifies that the component should automatically get focus on load.
+     * @group Props
+     */
+    readonly autofocus: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * Whether to automatically manage layering.
+     * @group Props
+     */
+    readonly autoZIndex: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Base zIndex value to use in layering.
+     * @group Props
+     */
+    readonly baseZIndex: _angular_core.InputSignalWithTransform<number, unknown>;
+    /**
+     * Style class of the datetimepicker container element.
+     * @group Props
+     */
+    readonly panelStyleClass: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Inline style of the datetimepicker container element.
+     * @group Props
+     */
+    readonly panelStyle: _angular_core.InputSignal<any>;
+    /**
+     * Keep invalid value when input blur.
+     * @group Props
+     */
+    readonly keepInvalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether to hide the overlay on date selection.
+     * @group Props
+     */
+    readonly hideOnDateTimeSelect: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * When enabled, datepicker overlay is displayed as optimized for touch devices.
+     * @group Props
+     */
+    readonly touchUI: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * Separator of time selector.
+     * @group Props
+     */
+    readonly timeSeparator: _angular_core.InputSignal<string>;
+    /**
+     * When enabled, can only focus on elements inside the datepicker.
+     * @group Props
+     */
+    readonly focusTrap: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Transition options of the show animation.
+     * @group Props
+     * @deprecated since v21.0.0, use `motionOptions` instead.
+     */
+    readonly showTransitionOptions: _angular_core.InputSignal<string>;
+    /**
+     * Transition options of the hide animation.
+     * @group Props
+     * @deprecated since v21.0.0, use `motionOptions` instead.
+     */
+    readonly hideTransitionOptions: _angular_core.InputSignal<string>;
+    /**
+     * Index of the element in tabbing order.
+     * @group Props
+     */
+    readonly tabindex: _angular_core.InputSignalWithTransform<number | undefined, unknown>;
+    /**
+     * The minimum selectable date.
+     * @group Props
+     */
+    readonly minDate: _angular_core.InputSignal<Date | null | undefined>;
+    /**
+     * The maximum selectable date.
+     * @group Props
+     */
+    readonly maxDate: _angular_core.InputSignal<Date | null | undefined>;
+    /**
+     * Array with dates that should be disabled (not selectable).
+     * @group Props
+     */
+    readonly disabledDates: _angular_core.InputSignal<Date[] | undefined>;
+    /**
+     * Array with weekday numbers that should be disabled (not selectable).
+     * @group Props
+     */
+    readonly disabledDays: _angular_core.InputSignal<number[] | undefined>;
+    /**
+     * Whether to display timepicker.
+     * @group Props
+     */
+    readonly showTime: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    /**
+     * An array of options for responsive design.
+     * @group Props
+     */
+    readonly responsiveOptions: _angular_core.InputSignal<DatePickerResponsiveOptions[] | undefined>;
+    /**
+     * Number of months to display.
+     * @group Props
+     */
+    readonly numberOfMonths: _angular_core.InputSignal<number>;
+    /**
+     * Defines the first of the week for various date calculations.
+     * @group Props
+     */
+    readonly firstDayOfWeek: _angular_core.InputSignal<number | undefined>;
+    /**
+     * Type of view to display, valid values are "date" for datepicker and "month" for month picker.
+     * @group Props
+     */
+    readonly view: _angular_core.InputSignal<DatePickerTypeView>;
+    /**
+     * Set the date to highlight on first opening if the field is blank.
+     * @group Props
+     */
+    readonly defaultDate: _angular_core.InputSignal<Date | null | undefined>;
+    /**
+     * Target element to attach the overlay, valid values are "body" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name).
+     * @defaultValue 'self'
+     * @group Props
+     */
+    appendTo: _angular_core.InputSignal<any>;
+    /**
+     * The motion options.
+     * @group Props
+     */
+    motionOptions: _angular_core.InputSignal<MotionOptions | undefined>;
+    computedMotionOptions: _angular_core.Signal<MotionOptions>;
+    /**
+     * Callback to invoke on focus of input field.
+     * @param {Event} event - browser event.
+     * @group Emits
+     */
+    readonly onFocus: _angular_core.OutputEmitterRef<Event>;
+    /**
+     * Callback to invoke on blur of input field.
+     * @param {Event} event - browser event.
+     * @group Emits
+     */
+    readonly onBlur: _angular_core.OutputEmitterRef<Event>;
+    /**
+     * Callback to invoke when date panel closed.
+     * @param {HTMLDivElement} element - The element being transitioned/animated.
+     * @group Emits
+     */
+    readonly onClose: _angular_core.OutputEmitterRef<HTMLElement>;
+    /**
+     * Callback to invoke on date select.
+     * @param {Date} date - date value.
+     * @group Emits
+     */
+    readonly onSelect: _angular_core.OutputEmitterRef<Date>;
+    /**
+     * Callback to invoke when input field cleared.
+     * @group Emits
+     */
+    readonly onClear: _angular_core.OutputEmitterRef<void>;
+    /**
+     * Callback to invoke when input field is being typed.
+     * @param {Event} event - browser event
+     * @group Emits
+     */
+    readonly onInput: _angular_core.OutputEmitterRef<any>;
+    /**
+     * Callback to invoke when today button is clicked.
+     * @param {Date} date - today as a date instance.
+     * @group Emits
+     */
+    readonly onTodayClick: _angular_core.OutputEmitterRef<Date>;
+    /**
+     * Callback to invoke when clear button is clicked.
+     * @param {Event} event - browser event.
+     * @group Emits
+     */
+    readonly onClearClick: _angular_core.OutputEmitterRef<any>;
+    /**
+     * Callback to invoke when a month is changed using the navigators.
+     * @param {DatePickerMonthChangeEvent} event - custom month change event.
+     * @group Emits
+     */
+    readonly onMonthChange: _angular_core.OutputEmitterRef<DatePickerMonthChangeEvent>;
+    /**
+     * Callback to invoke when a year is changed using the navigators.
+     * @param {DatePickerYearChangeEvent} event - custom year change event.
+     * @group Emits
+     */
+    readonly onYearChange: _angular_core.OutputEmitterRef<DatePickerYearChangeEvent>;
+    /**
+     * Callback to invoke when clicked outside of the date panel.
+     * @group Emits
+     */
+    readonly onClickOutside: _angular_core.OutputEmitterRef<any>;
+    /**
+     * Callback to invoke when datepicker panel is shown.
+     * @param {HTMLDivElement} element - The element being transitioned/animated.
+     * @group Emits
+     */
+    readonly onShow: _angular_core.OutputEmitterRef<HTMLElement>;
+    readonly inputfieldViewChild: _angular_core.Signal<ElementRef<any> | undefined>;
+    readonly contentViewChild: _angular_core.Signal<ElementRef<any> | undefined>;
+    _componentStyle: DatePickerStyle;
+    value: any;
+    dates: Nullable<Date[]>;
+    months: Month[];
+    weekDays: Nullable<string[]>;
+    currentMonth: number;
+    currentYear: number;
+    currentHour: Nullable<number>;
+    currentMinute: Nullable<number>;
+    currentSecond: Nullable<number>;
+    p: any;
+    pm: Nullable<boolean>;
+    mask: Nullable<HTMLDivElement>;
+    maskClickListener: VoidListener;
+    overlay: Nullable<HTMLElement>;
+    responsiveStyleElement: HTMLStyleElement | undefined | null;
+    overlayVisible: Nullable<boolean>;
+    overlayMinWidth: Nullable<number>;
+    $appendTo: _angular_core.Signal<any>;
+    calendarElement: Nullable<HTMLElement | ElementRef>;
+    timePickerTimer: any;
+    documentClickListener: VoidListener;
+    animationEndListener: VoidListener;
+    ticksTo1970: Nullable<number>;
+    yearOptions: Nullable<number[]>;
+    focus: Nullable<boolean>;
+    isKeydown: Nullable<boolean>;
+    _yearRange: string;
+    preventDocumentListener: Nullable<boolean>;
+    dayClass(date: any): {
+        [x: string]: any;
+        'h-datepicker-day': boolean;
+        'h-datepicker-day-selected': any;
+        'h-disabled': any;
+    };
+    /**
+     * Custom template for date cells.
+     * @param {DatePickerDateTemplateContext} context - date template context.
+     * @group Templates
+     */
+    readonly dateTemplate: _angular_core.Signal<TemplateRef<DatePickerDateTemplateContext> | undefined>;
+    /**
+     * Custom template for header section.
+     * @group Templates
+     */
+    readonly headerTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
+    /**
+     * Custom template for footer section.
+     * @group Templates
+     */
+    readonly footerTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
+    /**
+     * Custom template for disabled date cells.
+     * @param {DatePickerDisabledDateTemplateContext} context - disabled date template context.
+     * @group Templates
+     */
+    readonly disabledDateTemplate: _angular_core.Signal<TemplateRef<DatePickerDisabledDateTemplateContext> | undefined>;
+    /**
+     * Custom template for decade view.
+     * @param {DatePickerDecadeTemplateContext} context - decade template context.
+     * @group Templates
+     */
+    readonly decadeTemplate: _angular_core.Signal<TemplateRef<DatePickerDecadeTemplateContext> | undefined>;
+    /**
+     * Custom template for previous month icon.
+     * @group Templates
+     */
+    readonly previousIconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
+    /**
+     * Custom template for next month icon.
+     * @group Templates
+     */
+    readonly nextIconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
+    /**
+     * Custom template for trigger icon.
+     * @group Templates
+     */
+    readonly triggerIconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
+    /**
+     * Custom template for clear icon.
+     * @group Templates
+     */
+    readonly clearIconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
+    /**
+     * Custom template for decrement icon.
+     * @group Templates
+     */
+    readonly decrementIconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
+    /**
+     * Custom template for increment icon.
+     * @group Templates
+     */
+    readonly incrementIconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
+    /**
+     * Custom template for input icon.
+     * @param {DatePickerInputIconTemplateContext} context - input icon template context.
+     * @group Templates
+     */
+    readonly inputIconTemplate: _angular_core.Signal<TemplateRef<DatePickerInputIconTemplateContext> | undefined>;
+    /**
+     * Custom template for button bar.
+     * @param {DatePickerButtonBarTemplateContext} context - button bar template context.
+     * @group Templates
+     */
+    readonly buttonBarTemplate: _angular_core.Signal<TemplateRef<DatePickerButtonBarTemplateContext> | undefined>;
+    _dateTemplate: TemplateRef<DatePickerDateTemplateContext> | undefined;
+    _headerTemplate: TemplateRef<void> | undefined;
+    _footerTemplate: TemplateRef<void> | undefined;
+    _disabledDateTemplate: TemplateRef<DatePickerDisabledDateTemplateContext> | undefined;
+    _decadeTemplate: TemplateRef<DatePickerDecadeTemplateContext> | undefined;
+    _previousIconTemplate: TemplateRef<void> | undefined;
+    _nextIconTemplate: TemplateRef<void> | undefined;
+    _triggerIconTemplate: TemplateRef<void> | undefined;
+    _clearIconTemplate: TemplateRef<void> | undefined;
+    _decrementIconTemplate: TemplateRef<void> | undefined;
+    _incrementIconTemplate: TemplateRef<void> | undefined;
+    _inputIconTemplate: TemplateRef<DatePickerInputIconTemplateContext> | undefined;
+    _buttonBarTemplate: TemplateRef<DatePickerButtonBarTemplateContext> | undefined;
+    selectElement: Nullable;
+    todayElement: Nullable;
+    focusElement: Nullable;
+    scrollHandler: Nullable<ConnectedOverlayScrollHandler>;
+    documentResizeListener: VoidListener;
+    navigationState: Nullable<NavigationState>;
+    isMonthNavigate: Nullable<boolean>;
+    initialized: Nullable<boolean>;
+    translationSubscription: Nullable<Subscription>;
+    _locale: LocaleSettings;
+    currentView: Nullable<string>;
+    attributeSelector: Nullable<string>;
+    panelId: Nullable<string>;
+    preventFocus: Nullable<boolean>;
+    _focusKey: Nullable<string>;
+    private window;
+    get locale(): LocaleSettings;
+    get iconButtonAriaLabel(): any;
+    get prevIconAriaLabel(): any;
+    get nextIconAriaLabel(): any;
+    constructor(zone: NgZone, overlayService: OverlayService);
+    onInit(): void;
+    onAfterViewInit(): void;
+    onAfterViewChecked(): void;
+    readonly templates: _angular_core.Signal<readonly HelixTemplate[]>;
+    onAfterContentInit(): void;
+    getTranslation(option: string): any;
+    populateYearOptions(start: number, end: number): void;
+    createWeekDays(): void;
+    monthPickerValues(): any[];
+    yearPickerValues(): any[];
+    createMonths(month: number, year: number): void;
+    getWeekNumber(date: Date): number;
+    createMonth(month: number, year: number): Month;
+    initTime(date: Date): void;
+    navBackward(event: any): void;
+    navForward(event: any): void;
+    decrementYear(): void;
+    decrementDecade(): void;
+    incrementDecade(): void;
+    incrementYear(): void;
+    switchToMonthView(event: Event): void;
+    switchToYearView(event: Event): void;
+    onDateSelect(event: Event, dateMeta: any): void;
+    shouldSelectDate(dateMeta: any): boolean;
+    onMonthSelect(event: Event, index: number): void;
+    onYearSelect(event: Event, year: number): void;
+    updateInputfield(): void;
+    inputFieldValue: Nullable<string>;
+    formatDateTime(date: any): any;
+    formatDateMetaToDate(dateMeta: any): Date;
+    formatDateKey(date: Date): string;
+    setCurrentHourPM(hours: number): void;
+    setCurrentView(currentView: DatePickerTypeView): void;
+    selectDate(dateMeta: any): void;
+    updateModel(value: any): void;
+    getFirstDayOfMonthIndex(month: number, year: number): number;
+    getDaysCountInMonth(month: number, year: number): number;
+    getDaysCountInPrevMonth(month: number, year: number): number;
+    getPreviousMonthAndYear(month: number, year: number): {
+        month: any;
+        year: any;
+    };
+    getNextMonthAndYear(month: number, year: number): {
+        month: any;
+        year: any;
+    };
+    getSundayIndex(): number;
+    isSelected(dateMeta: any): boolean | undefined;
+    isComparable(): boolean;
+    isMonthSelected(month: any): any;
+    isMonthDisabled(month: number, year?: number): boolean;
+    isYearDisabled(year: number): boolean;
+    isYearSelected(year: number): boolean;
+    isDateEquals(value: any, dateMeta: any): boolean;
+    isDateBetween(start: Date, end: Date, dateMeta: any): boolean;
+    isSingleSelection(): boolean;
+    isRangeSelection(): boolean;
+    isMultipleSelection(): boolean;
+    isToday(today: Date, day: number, month: number, year: number): boolean;
+    isSelectable(day: any, month: any, year: any, otherMonth: any): boolean;
+    isDateDisabled(day: number, month: number, year: number): boolean;
+    isDayDisabled(day: number, month: number, year: number): boolean;
+    onInputFocus(event: Event): void;
+    onInputClick(): void;
+    onInputBlur(event: Event): void;
+    onButtonClick(event: Event, inputfield?: any): void;
+    clear(): void;
+    onOverlayClick(event: Event): void;
+    getMonthName(index: number): any;
+    getYear(month: any): any;
+    switchViewButtonDisabled(): boolean;
+    onPrevButtonClick(event: Event): void;
+    onNextButtonClick(event: Event): void;
+    onContainerButtonKeydown(event: KeyboardEvent): void;
+    onInputKeydown(event: any): void;
+    onDateCellKeydown(event: any, dateMeta: any, groupIndex: number): void;
+    onMonthCellKeydown(event: any, index: number): void;
+    onYearCellKeydown(event: any, index: number): void;
+    navigateToMonth(prev: boolean, groupIndex: number, focusKey?: string): void;
+    updateFocus(): void;
+    initFocusableCell(): void;
+    trapFocus(event: any): void;
+    onMonthDropdownChange(m: string): void;
+    onYearDropdownChange(y: string): void;
+    convertTo24Hour(hours: number, pm: boolean): number;
+    constrainTime(hour: number, minute: number, second: number, pm: boolean): number[];
+    incrementHour(event: any): void;
+    toggleAMPMIfNotMinDate(newPM: boolean): void;
+    onTimePickerElementMouseDown(event: Event, type: number, direction: number): void;
+    onTimePickerElementMouseUp(event: Event): void;
+    onTimePickerElementMouseLeave(): void;
+    repeat(event: Event | null, interval: number | null, type: number | null, direction: number | null): void;
+    clearTimePickerTimer(): void;
+    decrementHour(event: any): void;
+    incrementMinute(event: any): void;
+    decrementMinute(event: any): void;
+    incrementSecond(event: any): void;
+    decrementSecond(event: any): void;
+    updateTime(): void;
+    toggleAMPM(event: any): void;
+    onUserInput(event: KeyboardEvent | any): void;
+    isValidSelection(value: any): boolean;
+    parseValueFromString(text: string): Date | Date[] | null;
+    parseDateTime(text: any): Date;
+    populateTime(value: any, timeString: any, ampm: any): void;
+    isValidDate(date: any): boolean;
+    updateUI(): void;
+    showOverlay(): void;
+    hideOverlay(): void;
+    toggle(): void;
+    onOverlayBeforeEnter(event: MotionEvent): void;
+    onOverlayAfterLeave(event: MotionEvent): void;
+    appendOverlay(): void;
+    restoreOverlayAppend(): void;
+    alignOverlay(): void;
+    bindListeners(): void;
+    setZIndex(): void;
+    enableModality(element: any): void;
+    disableModality(): void;
+    destroyMask(): void;
+    unbindMaskClickListener(): void;
+    unbindAnimationEndListener(): void;
+    getDateFormat(): any;
+    getFirstDateOfWeek(): any;
+    formatDate(date: any, format: any): string;
+    formatTime(date: any): string;
+    parseTime(value: any): {
+        hour: number;
+        minute: number;
+        second: number | null;
+    };
+    parseDate(value: any, format: any): any;
+    daylightSavingAdjust(date: any): any;
+    isValidDateForTimeConstraints(selectedDate: Date): boolean;
+    onTodayButtonClick(event: any): void;
+    onClearButtonClick(event: any): void;
+    createResponsiveStyle(): void;
+    destroyResponsiveStyleElement(): void;
+    bindDocumentClickListener(): void;
+    unbindDocumentClickListener(): void;
+    bindDocumentResizeListener(): void;
+    unbindDocumentResizeListener(): void;
+    bindScrollListener(): void;
+    unbindScrollListener(): void;
+    isOutsideClicked(event: Event): boolean;
+    isNavIconClicked(event: any): boolean;
+    onWindowResize(): void;
+    onOverlayHide(): void;
+    /**
+     * @override
+     *
+     * @see {@link BaseEditableHolder.writeControlValue}
+     * Writes the value to the control.
+     */
+    writeControlValue(value: any): void;
+    onDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatePicker, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatePicker, "h-datePicker, h-datepicker, h-date-picker", never, { "iconDisplay": { "alias": "iconDisplay"; "required": false; "isSignal": true; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "inputStyle": { "alias": "inputStyle"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "inputStyleClass": { "alias": "inputStyleClass"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "iconAriaLabel": { "alias": "iconAriaLabel"; "required": false; "isSignal": true; }; "dateFormat": { "alias": "dateFormat"; "required": false; "isSignal": true; }; "multipleSeparator": { "alias": "multipleSeparator"; "required": false; "isSignal": true; }; "rangeSeparator": { "alias": "rangeSeparator"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; "showOtherMonths": { "alias": "showOtherMonths"; "required": false; "isSignal": true; }; "selectOtherMonths": { "alias": "selectOtherMonths"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "readonlyInput": { "alias": "readonlyInput"; "required": false; "isSignal": true; }; "shortYearCutoff": { "alias": "shortYearCutoff"; "required": false; "isSignal": true; }; "hourFormat": { "alias": "hourFormat"; "required": false; "isSignal": true; }; "timeOnly": { "alias": "timeOnly"; "required": false; "isSignal": true; }; "stepHour": { "alias": "stepHour"; "required": false; "isSignal": true; }; "stepMinute": { "alias": "stepMinute"; "required": false; "isSignal": true; }; "stepSecond": { "alias": "stepSecond"; "required": false; "isSignal": true; }; "showSeconds": { "alias": "showSeconds"; "required": false; "isSignal": true; }; "showOnFocus": { "alias": "showOnFocus"; "required": false; "isSignal": true; }; "showWeek": { "alias": "showWeek"; "required": false; "isSignal": true; }; "startWeekFromFirstDayOfYear": { "alias": "startWeekFromFirstDayOfYear"; "required": false; "isSignal": true; }; "showClear": { "alias": "showClear"; "required": false; "isSignal": true; }; "dataType": { "alias": "dataType"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "maxDateCount": { "alias": "maxDateCount"; "required": false; "isSignal": true; }; "showButtonBar": { "alias": "showButtonBar"; "required": false; "isSignal": true; }; "todayButtonStyleClass": { "alias": "todayButtonStyleClass"; "required": false; "isSignal": true; }; "clearButtonStyleClass": { "alias": "clearButtonStyleClass"; "required": false; "isSignal": true; }; "autofocus": { "alias": "autofocus"; "required": false; "isSignal": true; }; "autoZIndex": { "alias": "autoZIndex"; "required": false; "isSignal": true; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; "isSignal": true; }; "panelStyleClass": { "alias": "panelStyleClass"; "required": false; "isSignal": true; }; "panelStyle": { "alias": "panelStyle"; "required": false; "isSignal": true; }; "keepInvalid": { "alias": "keepInvalid"; "required": false; "isSignal": true; }; "hideOnDateTimeSelect": { "alias": "hideOnDateTimeSelect"; "required": false; "isSignal": true; }; "touchUI": { "alias": "touchUI"; "required": false; "isSignal": true; }; "timeSeparator": { "alias": "timeSeparator"; "required": false; "isSignal": true; }; "focusTrap": { "alias": "focusTrap"; "required": false; "isSignal": true; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; "isSignal": true; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; "isSignal": true; }; "tabindex": { "alias": "tabindex"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "disabledDates": { "alias": "disabledDates"; "required": false; "isSignal": true; }; "disabledDays": { "alias": "disabledDays"; "required": false; "isSignal": true; }; "showTime": { "alias": "showTime"; "required": false; "isSignal": true; }; "responsiveOptions": { "alias": "responsiveOptions"; "required": false; "isSignal": true; }; "numberOfMonths": { "alias": "numberOfMonths"; "required": false; "isSignal": true; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; "isSignal": true; }; "view": { "alias": "view"; "required": false; "isSignal": true; }; "defaultDate": { "alias": "defaultDate"; "required": false; "isSignal": true; }; "appendTo": { "alias": "appendTo"; "required": false; "isSignal": true; }; "motionOptions": { "alias": "motionOptions"; "required": false; "isSignal": true; }; }, { "onFocus": "onFocus"; "onBlur": "onBlur"; "onClose": "onClose"; "onSelect": "onSelect"; "onClear": "onClear"; "onInput": "onInput"; "onTodayClick": "onTodayClick"; "onClearClick": "onClearClick"; "onMonthChange": "onMonthChange"; "onYearChange": "onYearChange"; "onClickOutside": "onClickOutside"; "onShow": "onShow"; }, ["dateTemplate", "headerTemplate", "footerTemplate", "disabledDateTemplate", "decadeTemplate", "previousIconTemplate", "nextIconTemplate", "triggerIconTemplate", "clearIconTemplate", "decrementIconTemplate", "incrementIconTemplate", "inputIconTemplate", "buttonBarTemplate", "templates"], ["h-header", "h-footer"], true, [{ directive: typeof i1.Bind; inputs: {}; outputs: {}; }]>;
+}
+declare class DatePickerModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatePickerModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<DatePickerModule, never, [typeof DatePicker, typeof i2.SharedModule], [typeof DatePicker, typeof i2.SharedModule]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<DatePickerModule>;
+}
+
+export { DATEPICKER_VALUE_ACCESSOR, DatePicker, DatePickerClasses, DatePickerModule, DatePickerStyle };