igniteui-webcomponents 7.3.2 → 7.4.1

package/components/combo/controllers/data.d.ts

@@ -59,20 +59,17 @@ export declare class DataState<T extends object> implements ReactiveController {
      * Called during the update lifecycle to batch changes.
      */
     private _runPipelineIfDirty;
-    /**
-     * Initial indexing of the data - converts raw data items into ComboRecord format with metadata.
-     */
+    /** Converts the raw data items into {@link ComboRecord} objects. */
     private _index;
     /**
-     * Applies the data pipeline: filtering and grouping over the indexed source,
-     * then renumbers the visible options so that the `aria-posinset`/`aria-setsize`
-     * pair reported by the list skips group headers.
+     * Filters and groups the indexed source, then numbers the visible options
+     * again, so that the `aria-posinset` and `aria-setsize` pair of the list
+     * skips the group headers.
      *
      * @remarks
-     * `position` is derived view state and is deliberately renumbered in place.
-     * The records belong solely to this controller, and every run recomputes the
-     * field before anything reads it, so copying them per run would only add an
-     * allocation to each keystroke.
+     * `position` is derived view state, and the records belong only to this
+     * controller. Each run computes the field before a read, so it is numbered in
+     * place. A copy per run would add one allocation to each keystroke.
      */
     private _apply;
     /**

package/components/combo/controllers/data.js.map

@@ -1 +1 @@
-{"version":3,"file":"data.js","sourceRoot":"","sources":["../../../../src/components/combo/controllers/data.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\n\nimport FilterDataOperation from '../operations/filter.js';\nimport GroupDataOperation from '../operations/group.js';\nimport type {\n  ComboHost,\n  ComboRecord,\n  FilteringOptions,\n  GroupingOptions,\n  Keys,\n} from '../types.js';\n\n/* blazorSuppress */\nexport class DataState<T extends object> implements ReactiveController {\n  //#region Internal state\n  private readonly _host: ComboHost<T>;\n  private readonly _filtering = new FilterDataOperation<T>();\n  private readonly _grouping = new GroupDataOperation<T>();\n  private _compareCollator: Intl.Collator;\n\n  /** The data source, indexed into records. See {@link _isSourceOutdated}. */\n  private _indexed: ComboRecord<T>[] = [];\n  private _source?: T[];\n\n  private _dataState: ComboRecord<T>[] = [];\n  private _itemCount = 0;\n  private _searchTerm = '';\n  private _dirty = true;\n\n  //#endregion\n\n  //#region Public state accessors\n\n  /**\n   * The current state of the data in the combo component.\n   *\n   * @remarks\n   * The collection is shared with the virtualized list and may be the cached\n   * indexed source itself, so it is handed out as read-only.\n   */\n  public get dataState(): readonly ComboRecord<T>[] {\n    return this._dataState;\n  }\n\n  /** The number of selectable options in {@link dataState}, excluding group headers. */\n  public get itemCount(): number {\n    return this._itemCount;\n  }\n\n  /**\n   * The index in {@link dataState} of the first selectable option,\n   * or `-1` when there are none.\n   */\n  public get firstItemIndex(): number {\n    return this._dataState.findIndex((record) => !record.header);\n  }\n\n  /**\n   * Sets the current search term used for filtering the data.\n   * Triggers a data pipeline run if the value changes.\n   */\n  public set searchTerm(value: string) {\n    if (this._searchTerm !== value) {\n      this._searchTerm = value;\n      this.invalidate();\n    }\n  }\n\n  /** The current search term used for filtering the data. */\n  public get searchTerm(): string {\n    return this._searchTerm;\n  }\n\n  /** The current filtering options for the combo component. */\n  public get filteringOptions(): FilteringOptions<T> {\n    return this._host.filteringOptions;\n  }\n\n  /** The current grouping options for the combo component. */\n  public get groupingOptions(): GroupingOptions<T> {\n    return {\n      valueKey: this._host.valueKey,\n      displayKey: this._host.displayKey,\n      groupKey: this._host.groupKey as Keys<T>,\n      direction: this._host.groupSorting,\n    };\n  }\n\n  /** The current collator used for comparing values. */\n  public get compareCollator(): Intl.Collator {\n    return this._compareCollator;\n  }\n\n  //#endregion\n\n  //#region Lifecycle and pipeline management\n\n  constructor(host: ComboHost<T>) {\n    this._host = host;\n    this._host.addController(this);\n    this._compareCollator = new Intl.Collator(this._host.locale);\n  }\n\n  /**\n   * Lit lifecycle hook - runs before rendering.\n   * Executes pipeline if any changes were batched.\n   * @internal\n   */\n  public hostUpdate(): void {\n    // Mutating the data array in place notifies neither Lit nor `invalidate()`,\n    // so a changed length is detected here to mark the pipeline dirty on its\n    // own. Replacing elements without changing the length stays undetectable\n    // and still requires reassigning `data`.\n    if (this._isSourceOutdated()) {\n      this._dirty = true;\n    }\n\n    this._runPipelineIfDirty();\n  }\n\n  /** Whether the indexed source no longer matches the host's data array. */\n  private _isSourceOutdated(): boolean {\n    const data = this._host.data;\n    return this._source !== data || this._indexed.length !== data.length;\n  }\n\n  /**\n   * Marks the data state as dirty, triggering a pipeline run before next render.\n   * This batches multiple changes into a single pipeline execution.\n   */\n  private _markDirty(): void {\n    if (!this._dirty) {\n      this._dirty = true;\n      this._host.requestUpdate();\n    }\n  }\n\n  /**\n   * Executes the data pipeline if marked dirty.\n   * Called during the update lifecycle to batch changes.\n   */\n  private _runPipelineIfDirty(): void {\n    if (!this._dirty) {\n      return;\n    }\n\n    // A record's `value` and `header` are fixed for a given data item, so the\n    // indexed source only needs rebuilding when it no longer matches the host's\n    // data. Filter-only runs (every keystroke in the search input) reuse it\n    // instead of re-allocating a record per item. The derived `position` is the\n    // one field that does change per run - see `_apply`.\n    if (this._isSourceOutdated()) {\n      this._source = this._host.data;\n      this._indexed = this._index(this._source);\n    }\n\n    this._dataState = this._apply(this._indexed);\n    this._dirty = false;\n  }\n\n  //#endregion\n\n  //#region Internal pipeline operations\n\n  /**\n   * Initial indexing of the data - converts raw data items into ComboRecord format with metadata.\n   */\n  private _index(data: T[]): ComboRecord<T>[] {\n    return data.map((item, index) => ({\n      value: item,\n      header: false,\n      position: index + 1,\n    }));\n  }\n\n  /**\n   * Applies the data pipeline: filtering and grouping over the indexed source,\n   * then renumbers the visible options so that the `aria-posinset`/`aria-setsize`\n   * pair reported by the list skips group headers.\n   *\n   * @remarks\n   * `position` is derived view state and is deliberately renumbered in place.\n   * The records belong solely to this controller, and every run recomputes the\n   * field before anything reads it, so copying them per run would only add an\n   * allocation to each keystroke.\n   */\n  private _apply(records: ComboRecord<T>[]): ComboRecord<T>[] {\n    const result = this._grouping.apply(\n      this._filtering.apply(records, this),\n      this\n    );\n\n    let position = 0;\n\n    for (const record of result) {\n      if (!record.header) {\n        record.position = ++position;\n      }\n    }\n\n    this._itemCount = position;\n\n    return result;\n  }\n\n  //#endregion\n\n  //#region Public API for host component\n\n  /**\n   * Updates the collator when locale changes.\n   */\n  public updateLocale(locale: string): void {\n    this._compareCollator = new Intl.Collator(locale);\n    this._markDirty();\n  }\n\n  /**\n   * Marks data as dirty when host properties that affect data change.\n   */\n  public invalidate(): void {\n    this._markDirty();\n  }\n\n  //#endregion\n}\n"]}
+{"version":3,"file":"data.js","sourceRoot":"","sources":["../../../../src/components/combo/controllers/data.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\n\nimport FilterDataOperation from '../operations/filter.js';\nimport GroupDataOperation from '../operations/group.js';\nimport type {\n  ComboHost,\n  ComboRecord,\n  FilteringOptions,\n  GroupingOptions,\n  Keys,\n} from '../types.js';\n\n/* blazorSuppress */\nexport class DataState<T extends object> implements ReactiveController {\n  //#region Internal state\n  private readonly _host: ComboHost<T>;\n  private readonly _filtering = new FilterDataOperation<T>();\n  private readonly _grouping = new GroupDataOperation<T>();\n  private _compareCollator: Intl.Collator;\n\n  /** The data source, indexed into records. See {@link _isSourceOutdated}. */\n  private _indexed: ComboRecord<T>[] = [];\n  private _source?: T[];\n\n  private _dataState: ComboRecord<T>[] = [];\n  private _itemCount = 0;\n  private _searchTerm = '';\n  private _dirty = true;\n\n  //#endregion\n\n  //#region Public state accessors\n\n  /**\n   * The current state of the data in the combo component.\n   *\n   * @remarks\n   * The collection is shared with the virtualized list and may be the cached\n   * indexed source itself, so it is handed out as read-only.\n   */\n  public get dataState(): readonly ComboRecord<T>[] {\n    return this._dataState;\n  }\n\n  /** The number of selectable options in {@link dataState}, excluding group headers. */\n  public get itemCount(): number {\n    return this._itemCount;\n  }\n\n  /**\n   * The index in {@link dataState} of the first selectable option,\n   * or `-1` when there are none.\n   */\n  public get firstItemIndex(): number {\n    return this._dataState.findIndex((record) => !record.header);\n  }\n\n  /**\n   * Sets the current search term used for filtering the data.\n   * Triggers a data pipeline run if the value changes.\n   */\n  public set searchTerm(value: string) {\n    if (this._searchTerm !== value) {\n      this._searchTerm = value;\n      this.invalidate();\n    }\n  }\n\n  /** The current search term used for filtering the data. */\n  public get searchTerm(): string {\n    return this._searchTerm;\n  }\n\n  /** The current filtering options for the combo component. */\n  public get filteringOptions(): FilteringOptions<T> {\n    return this._host.filteringOptions;\n  }\n\n  /** The current grouping options for the combo component. */\n  public get groupingOptions(): GroupingOptions<T> {\n    return {\n      valueKey: this._host.valueKey,\n      displayKey: this._host.displayKey,\n      groupKey: this._host.groupKey as Keys<T>,\n      direction: this._host.groupSorting,\n    };\n  }\n\n  /** The current collator used for comparing values. */\n  public get compareCollator(): Intl.Collator {\n    return this._compareCollator;\n  }\n\n  //#endregion\n\n  //#region Lifecycle and pipeline management\n\n  constructor(host: ComboHost<T>) {\n    this._host = host;\n    this._host.addController(this);\n    this._compareCollator = new Intl.Collator(this._host.locale);\n  }\n\n  /**\n   * Lit lifecycle hook - runs before rendering.\n   * Executes pipeline if any changes were batched.\n   * @internal\n   */\n  public hostUpdate(): void {\n    // A change to the data array in place notifies neither Lit nor\n    // `invalidate()`, so a changed length is found here and marks the pipeline\n    // dirty. A replaced element of the same length stays unknown and needs a\n    // new `data` array.\n    if (this._isSourceOutdated()) {\n      this._dirty = true;\n    }\n\n    this._runPipelineIfDirty();\n  }\n\n  /** Whether the indexed source no longer matches the host's data array. */\n  private _isSourceOutdated(): boolean {\n    const data = this._host.data;\n    return this._source !== data || this._indexed.length !== data.length;\n  }\n\n  /**\n   * Marks the data state as dirty, triggering a pipeline run before next render.\n   * This batches multiple changes into a single pipeline execution.\n   */\n  private _markDirty(): void {\n    if (!this._dirty) {\n      this._dirty = true;\n      this._host.requestUpdate();\n    }\n  }\n\n  /**\n   * Executes the data pipeline if marked dirty.\n   * Called during the update lifecycle to batch changes.\n   */\n  private _runPipelineIfDirty(): void {\n    if (!this._dirty) {\n      return;\n    }\n\n    // The `value` and `header` of a record are fixed for a data item, so the\n    // indexed source is built again only if it no longer agrees with the data of\n    // the host. A filter-only run, which each keystroke starts, uses it again\n    // and allocates no records. Only the derived `position` changes per run.\n    // See `_apply`.\n    if (this._isSourceOutdated()) {\n      this._source = this._host.data;\n      this._indexed = this._index(this._source);\n    }\n\n    this._dataState = this._apply(this._indexed);\n    this._dirty = false;\n  }\n\n  //#endregion\n\n  //#region Internal pipeline operations\n\n  /** Converts the raw data items into {@link ComboRecord} objects. */\n  private _index(data: T[]): ComboRecord<T>[] {\n    return data.map((item, index) => ({\n      value: item,\n      header: false,\n      position: index + 1,\n    }));\n  }\n\n  /**\n   * Filters and groups the indexed source, then numbers the visible options\n   * again, so that the `aria-posinset` and `aria-setsize` pair of the list\n   * skips the group headers.\n   *\n   * @remarks\n   * `position` is derived view state, and the records belong only to this\n   * controller. Each run computes the field before a read, so it is numbered in\n   * place. A copy per run would add one allocation to each keystroke.\n   */\n  private _apply(records: ComboRecord<T>[]): ComboRecord<T>[] {\n    const result = this._grouping.apply(\n      this._filtering.apply(records, this),\n      this\n    );\n\n    let position = 0;\n\n    for (const record of result) {\n      if (!record.header) {\n        record.position = ++position;\n      }\n    }\n\n    this._itemCount = position;\n\n    return result;\n  }\n\n  //#endregion\n\n  //#region Public API for host component\n\n  /**\n   * Updates the collator when locale changes.\n   */\n  public updateLocale(locale: string): void {\n    this._compareCollator = new Intl.Collator(locale);\n    this._markDirty();\n  }\n\n  /**\n   * Marks data as dirty when host properties that affect data change.\n   */\n  public invalidate(): void {\n    this._markDirty();\n  }\n\n  //#endregion\n}\n"]}

package/components/date-picker/date-picker.base.d.ts

@@ -25,7 +25,7 @@ export interface IgcPickerBaseEventMap<T> {
 /** The parts of the calendar which the pickers re-export to their own consumers. */
 export declare const calendarExportParts: "header, header-title, header-date, content: calendar-content, navigation, months-navigation,\n  years-navigation, years-range, navigation-buttons, navigation-button, days-view-container,\n  days-view, months-view, years-view, days-row, months-row, years-row, label: calendar-label,\n  label-inner: calendar-label-inner, week-number, week-number-inner, date,\n  date-inner, first, last, inactive, hidden, weekend, range, special, disabled, single, preview,\n  month, month-inner, year, year-inner, selected, current";
 /** The components rendered by the picker chrome of every picker. */
-export declare const pickerDependencies: (typeof IgcIconComponent | typeof IgcValidationContainerComponent | typeof IgcPopoverComponent | typeof IgcCalendarComponent | typeof IgcFocusTrapComponent | typeof IgcDialogComponent)[];
+export declare const pickerDependencies: (typeof IgcIconComponent | typeof IgcPopoverComponent | typeof IgcValidationContainerComponent | typeof IgcCalendarComponent | typeof IgcFocusTrapComponent | typeof IgcDialogComponent)[];
 /**
  * The subset of the slot controller which the base picker queries.
  * Kept structural so that each picker can declare its own set of slot names.
@@ -66,17 +66,15 @@ export declare abstract class IgcDatePickerBaseComponent<T extends Date | DateRa
     /** The theming controller of the concrete picker. */
     protected abstract readonly _themes: ThemingController;
     /**
-     * The localization controller of the concrete picker.
-     * Only the locale is shared - the resource strings differ per picker.
+     * The localization controller of the picker. Only the locale is shared,
+     * because the resource strings differ between the pickers.
      */
     protected abstract readonly _i18nController: {
         locale: string;
     };
     /**
-     * The current value of the picker.
-     *
-     * The public `value` is declared by the concrete pickers, since its type,
-     * converter and form state differ between them.
+     * The current value of the picker. Each picker declares its own public
+     * `value`, because the type, the converter and the form state differ.
      */
     protected abstract get _value(): T | null;
     protected abstract set _value(value: T | null);
@@ -89,28 +87,25 @@ export declare abstract class IgcDatePickerBaseComponent<T extends Date | DateRa
     /** The localized label of the calendar picker. */
     protected abstract get _selectDateLabel(): string | undefined;
     /**
-     * The editor the host's ARIA state is projected onto - its associated
-     * labels and the `aria-haspopup="dialog"` semantics of the picker, both of
-     * which must land on the native input assistive technology reports.
+     * The editor that gets the ARIA state of the host: the name of the host and
+     * `aria-haspopup="dialog"`. Both must reach the native input that assistive
+     * technology reads.
      */
     protected abstract get _projectionTarget(): Element | null;
     /** Moves focus to the editor of the picker. */
     protected abstract _focusInput(): void;
     /** Restores focus to the editor after a value has been selected in the calendar. */
     protected abstract _focusAndSelectInput(): void;
-    /**
-     * Resolves the value of the picker from the dates selected in the calendar, which come
-     * in ascending order.
-     */
+    /** The value of the picker for `dates`, which the calendar gives in ascending order. */
     protected abstract _valueFromCalendarSelection(dates: Date[]): T | null;
     /** The value reflected in the calendar when it is in single selection mode. */
     protected get _calendarValue(): Date | null;
     /** The values reflected in the calendar when it is in range selection mode. */
     protected get _calendarValues(): Date[] | null;
     /**
-     * Seeds the active date of the calendar on the initial render, when the picker holds
-     * a value but no explicit active date. From then on the calendar owns its active date
-     * and `activeDate` reads it back, so this is consulted once.
+     * The active date for the first render, if the picker holds a value but no
+     * active date. The calendar then owns its active date and `activeDate` reads
+     * it back, so this is read one time.
      */
     protected get _defaultActiveDate(): Date | null;
     /** The title of the calendar icon, if the picker provides one. */
@@ -263,13 +258,14 @@ export declare abstract class IgcDatePickerBaseComponent<T extends Date | DateRa
     protected _setDateConstraints(): void;
     protected _shouldCloseCalendarDropdown(): Promise<void>;
     /**
-     * Points the calendar at the first defined of `dates`, keeping its current
-     * active date when none is. A no-op until the calendar is rendered.
+     * Points the calendar at the first defined date of `dates`, and keeps the
+     * current active date if there is none. Does nothing before the calendar
+     * renders.
      */
     protected _setCalendarActiveDate(...dates: (Date | null | undefined)[]): void;
     /**
-     * Pushes the value of the picker back onto the calendar, which a read-only picker has
-     * to do directly - the binding is left with nothing to re-commit.
+     * Writes the value of the picker back onto the calendar. A read-only picker
+     * must do this itself, because the binding has nothing to commit again.
      */
     protected _restoreCalendarSelection(): Promise<void>;
     /** Emits `igcChange` if the value has moved away from the last committed one. */
@@ -285,16 +281,15 @@ export declare abstract class IgcDatePickerBaseComponent<T extends Date | DateRa
     protected _handleCalendarChangeEvent(event: CustomEvent<Date | Date[]>): Promise<void>;
     protected _handleDialogClosing(event: Event): void;
     protected _handleDialogClosed(event: Event): void;
-    protected _renderClearIcon(part?: string): typeof nothing | TemplateResult<1>;
+    protected _renderClearIcon(part?: string): TemplateResult<1> | typeof nothing;
     protected _renderCalendarIcon(suffix?: string): TemplateResult<1>;
     /**
-     * The content projected into an editor of the picker - its icons and prefix/suffix slots.
-     *
-     * The suffix distinguishes the editors of a picker which renders more than one,
-     * e.g. `-start` and `-end`.
+     * The content for an editor of the picker: its icons and its prefix and
+     * suffix slots. The suffix identifies the editor if the picker renders more
+     * than one, for example `-start` and `-end`.
      */
     protected _renderEditorSlots(suffix?: string): TemplateResult<1>;
-    protected _renderCalendarSlots(): typeof nothing | TemplateResult<1>;
+    protected _renderCalendarSlots(): TemplateResult<1> | typeof nothing;
     protected _renderCalendar(id: string): TemplateResult<1>;
     protected _renderActions(): TemplateResult<1>;
     /** The content rendered inside the popover/dialog of the picker. */

package/components/date-picker/date-picker.base.js

@@ -159,9 +159,9 @@ export class IgcDatePickerBaseComponent extends FormAssociatedRequiredMixin(Even
             target: () => this._projectionTarget,
             state: () => ({
                 hasPopup: 'dialog',
-                labelledBy: this._internals.labels,
                 describedBy: this._helperText ? [this._helperText] : null,
             }),
+            hasOwnLabel: () => Boolean(this.label),
         });
         addSafeEventListener(this, 'focusout', this._handleFocusOut);
         addKeybindings(this, {
@@ -328,7 +328,7 @@ export class IgcDatePickerBaseComponent extends FormAssociatedRequiredMixin(Even
     `;
     }
     _renderCalendar(id) {
-        const hideHeader = this._isDropDown ? true : this.hideHeader;
+        const hideHeader = this._isDropDown || this.hideHeader;
         const isInert = !this.open || this.disabled;
         return html `
       <igc-calendar
@@ -378,7 +378,13 @@ export class IgcDatePickerBaseComponent extends FormAssociatedRequiredMixin(Even
         const isDisabled = !this.open || this.disabled;
         return this._isDropDown
             ? html `
-          <igc-popover ?open=${this.open} anchor=${id} flip shift>
+          <igc-popover
+            ?open=${this.open}
+            anchor=${id}
+            flip
+            .scrollStrategy=${this.scrollStrategy}
+            @igcPopoverScrollClose=${this._handleClosing}
+          >
             <igc-focus-trap ?disabled=${isDisabled}>
               ${this._renderPickerContent(id)}
             </igc-focus-trap>

package/components/date-picker/date-picker.base.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.base.js","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker.base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing, type PropertyValues, type TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { addAriaProjector } from '#internals/controllers/aria-projection.js';\nimport {\n  addKeybindings,\n  altKey,\n  arrowDown,\n  arrowUp,\n  escapeKey,\n} from '#internals/controllers/key-bindings.js';\nimport { addRootClickController } from '#internals/controllers/root-click.js';\nimport { convertToDate } from '#internals/date/converters.js';\nimport { coercedProperty } from '#internals/decorators/coerced-property.js';\nimport { IgcComboBoxBaseLikeComponent } from '#internals/mixins/combo-box.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormAssociatedRequiredMixin } from '#internals/mixins/forms/associated-required.js';\nimport { renderSlottedIcon } from '#internals/templates/slotted-icon.js';\nimport { asArray } from '#internals/utils/arrays.js';\nimport {\n  addSafeEventListener,\n  focusLeftHost,\n  getElementFromPath,\n} from '#internals/utils/events.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { equal } from '#internals/utils/objects.js';\nimport type { ThemingController } from '#theming/theming-controller.js';\nimport IgcCalendarComponent, { focusActiveDate } from '../calendar/calendar.js';\nimport {\n  createDateConstraints,\n  getLocaleWeekStart,\n} from '../calendar/helpers.js';\nimport type {\n  CalendarHeaderOrientation,\n  CalendarSelection,\n  DateRangeDescriptor,\n  WeekDays,\n} from '../calendar/types.js';\nimport IgcDialogComponent from '../dialog/dialog.js';\nimport IgcFocusTrapComponent from '../focus-trap/focus-trap.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport IgcPopoverComponent from '../popover/popover.js';\nimport type {\n  ContentOrientation,\n  DateRangeValue,\n  PickerMode,\n} from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\n\n/**\n * The events emitted by a picker driven by a calendar.\n * `T` is the value type of the picker - a single date or a date range.\n */\nexport interface IgcPickerBaseEventMap<T> {\n  igcOpening: CustomEvent<void>;\n  igcOpened: CustomEvent<void>;\n  igcClosing: CustomEvent<void>;\n  igcClosed: CustomEvent<void>;\n  igcChange: CustomEvent<T | null>;\n  igcInput: CustomEvent<T | null>;\n}\n\n/** The parts of the calendar which the pickers re-export to their own consumers. */\nexport const calendarExportParts =\n  `header, header-title, header-date, content: calendar-content, navigation, months-navigation,\n  years-navigation, years-range, navigation-buttons, navigation-button, days-view-container,\n  days-view, months-view, years-view, days-row, months-row, years-row, label: calendar-label,\n  label-inner: calendar-label-inner, week-number, week-number-inner, date,\n  date-inner, first, last, inactive, hidden, weekend, range, special, disabled, single, preview,\n  month, month-inner, year, year-inner, selected, current` as const;\n\n/** Stable identity for \"no range\", so that the calendar binding is committed only once. */\nconst emptyValues: Date[] = [];\n\n/** The components rendered by the picker chrome of every picker. */\nexport const pickerDependencies = [\n  IgcCalendarComponent,\n  IgcDialogComponent,\n  IgcFocusTrapComponent,\n  IgcIconComponent,\n  IgcPopoverComponent,\n  IgcValidationContainerComponent,\n];\n\n/**\n * The subset of the slot controller which the base picker queries.\n * Kept structural so that each picker can declare its own set of slot names.\n */\ntype PickerSlots = {\n  hasAssignedElements(slot: string): boolean;\n};\n\n/* blazorIndirectRender */\n/* omitModule */\n/**\n * Common behavior for the pickers which drive an `igc-calendar` from an editor -\n * {@link IgcDatePickerComponent} and {@link IgcDateRangePickerComponent}.\n *\n * It owns the calendar and editor facing properties, the open/close plumbing and the\n * picker chrome - calendar, popover/dialog, icons and actions. The value itself, its\n * form state and the editors are left to the concrete pickers.\n */\nexport abstract class IgcDatePickerBaseComponent<\n  T extends Date | DateRangeValue,\n> extends FormAssociatedRequiredMixin(\n  EventEmitterMixin<\n    IgcPickerBaseEventMap<Date | DateRangeValue>,\n    AbstractConstructor<IgcComboBoxBaseLikeComponent>\n  >(IgcComboBoxBaseLikeComponent)\n) {\n  //#region Internal state and properties\n\n  protected _oldValue: T | null = null;\n\n  protected _activeDate: Date | null = null;\n  protected _min: Date | null = null;\n  protected _max: Date | null = null;\n  protected _dateConstraints: DateRangeDescriptor[] = [];\n  protected _displayFormat?: string;\n  protected _inputFormat?: string;\n  protected _visibleMonths = 1;\n  private _weekStart?: WeekDays;\n\n  protected override readonly _rootClickController = addRootClickController(\n    this,\n    { onHide: this._handleClosing }\n  );\n\n  @query(IgcCalendarComponent.tagName)\n  protected readonly _calendar!: IgcCalendarComponent;\n\n  @query('#helper-text')\n  protected readonly _helperText!: IgcValidationContainerComponent | null;\n\n  protected get _isDropDown(): boolean {\n    return this.mode === 'dropdown';\n  }\n\n  protected get _isMaterial(): boolean {\n    return this._themes.theme === 'material';\n  }\n\n  /** Dialog mode is always read-only, the rest depends on the configuration. */\n  protected get _isEditorReadOnly(): boolean {\n    return !this._isDropDown || this.readOnly || this.nonEditable;\n  }\n\n  //#endregion\n\n  //#region Abstract members\n\n  /** The id of the editor the picker is anchored to. */\n  protected abstract readonly _inputId: string;\n\n  /** The slots of the concrete picker. */\n  protected abstract readonly _slots: PickerSlots;\n\n  /** The theming controller of the concrete picker. */\n  protected abstract readonly _themes: ThemingController;\n\n  /**\n   * The localization controller of the concrete picker.\n   * Only the locale is shared - the resource strings differ per picker.\n   */\n  protected abstract readonly _i18nController: { locale: string };\n\n  /**\n   * The current value of the picker.\n   *\n   * The public `value` is declared by the concrete pickers, since its type,\n   * converter and form state differ between them.\n   */\n  protected abstract get _value(): T | null;\n  protected abstract set _value(value: T | null);\n\n  /** Clears any user input left in the editor(s) of the picker. */\n  protected abstract _clearEditors(): void;\n\n  /** Whether the picker holds a value. */\n  protected abstract get _hasValue(): boolean;\n\n  /** The selection mode of the underlying calendar. */\n  protected abstract get _calendarSelection(): CalendarSelection;\n\n  /** The localized label of the calendar picker. */\n  protected abstract get _selectDateLabel(): string | undefined;\n\n  /**\n   * The editor the host's ARIA state is projected onto - its associated\n   * labels and the `aria-haspopup=\"dialog\"` semantics of the picker, both of\n   * which must land on the native input assistive technology reports.\n   */\n  protected abstract get _projectionTarget(): Element | null;\n\n  /** Moves focus to the editor of the picker. */\n  protected abstract _focusInput(): void;\n\n  /** Restores focus to the editor after a value has been selected in the calendar. */\n  protected abstract _focusAndSelectInput(): void;\n\n  /**\n   * Resolves the value of the picker from the dates selected in the calendar, which come\n   * in ascending order.\n   */\n  protected abstract _valueFromCalendarSelection(dates: Date[]): T | null;\n\n  //#endregion\n\n  //#region Overridable hooks\n\n  /** The value reflected in the calendar when it is in single selection mode. */\n  protected get _calendarValue(): Date | null {\n    return null;\n  }\n\n  /** The values reflected in the calendar when it is in range selection mode. */\n  protected get _calendarValues(): Date[] | null {\n    return null;\n  }\n\n  /**\n   * Seeds the active date of the calendar on the initial render, when the picker holds\n   * a value but no explicit active date. From then on the calendar owns its active date\n   * and `activeDate` reads it back, so this is consulted once.\n   */\n  protected get _defaultActiveDate(): Date | null {\n    return this._calendarValue;\n  }\n\n  /** The title of the calendar icon, if the picker provides one. */\n  protected get _calendarIconTitle(): string | undefined {\n    return undefined;\n  }\n\n  /** The accessible name of the picker in dialog mode. */\n  protected get _dialogLabel(): string | undefined {\n    return this._selectDateLabel;\n  }\n\n  /** The format the editor(s) fall back to when no display format is set. */\n  protected get _defaultDisplayFormat(): string | undefined {\n    return undefined;\n  }\n\n  /** The format the editor(s) fall back to when no input format is set. */\n  protected get _defaultInputFormat(): string | undefined {\n    return undefined;\n  }\n\n  /** Whether the current calendar selection is complete enough to close the picker. */\n  protected _canCloseOnSelect(): boolean {\n    return true;\n  }\n\n  /** Invoked when the picker is dismissed through the Escape key. */\n  protected _handleDismiss(): void {}\n\n  /** Invoked when focus has left the picker for good. */\n  protected _onBlur(): void {}\n\n  /** Invoked when the dialog of the picker is closing, before the picker is hidden. */\n  protected _onDialogClosing(): void {}\n\n  /** Invoked when the picker is toggled, before the update is awaited. */\n  protected _syncCalendarOnToggle(): void {}\n\n  /** Whether a selection made in the calendar commits the value of the picker right away. */\n  protected _commitsCalendarSelection(): boolean {\n    return true;\n  }\n\n  //#endregion\n\n  //#region Public properties and attributes\n\n  /**\n   * Determines whether the calendar is opened in a dropdown or a modal dialog.\n   * @attr mode\n   * @default dropdown\n   */\n  @property()\n  public mode: PickerMode = 'dropdown';\n\n  /**\n   * Makes the control a readonly field.\n   * @attr readonly\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'readonly' })\n  public readOnly = false;\n\n  /**\n   * Whether to allow typing in the input.\n   * @attr non-editable\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'non-editable' })\n  public nonEditable = false;\n\n  /**\n   * Whether the control will have outlined appearance.\n   * @attr\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public outlined = false;\n\n  /**\n   * The label of the picker.\n   * @attr label\n   */\n  @property()\n  public label!: string;\n\n  /**\n   * The prompt symbol to use for unfilled parts of the mask.\n   * @attr\n   * @default _\n   */\n  @property()\n  public prompt = '_';\n\n  /**\n   * Format to display the value in when not editing.\n   * Defaults to the locale format if not set.\n   * @attr display-format\n   */\n  @property({ attribute: 'display-format' })\n  public set displayFormat(value: string) {\n    this._displayFormat = value;\n  }\n\n  public get displayFormat(): string {\n    return (this._displayFormat ?? this._defaultDisplayFormat)!;\n  }\n\n  /**\n   * The date format to apply on the input.\n   * Defaults to the current locale Intl.DateTimeFormat\n   * @attr input-format\n   */\n  @property({ attribute: 'input-format' })\n  public set inputFormat(value: string) {\n    this._inputFormat = value;\n  }\n\n  public get inputFormat(): string {\n    return (this._inputFormat ?? this._defaultInputFormat)!;\n  }\n\n  /**\n   * The locale used to format the display value and to resolve the\n   * component's resource strings. Falls back to the global locale when not set.\n   * @attr locale\n   */\n  @property()\n  public set locale(value: string) {\n    this._i18nController.locale = value;\n  }\n\n  public get locale(): string {\n    return this._i18nController.locale;\n  }\n\n  /**\n   * The minimum value required for the picker to remain valid.\n   * @attr\n   */\n  @property({ converter: convertToDate })\n  public set min(value: Date | string | null | undefined) {\n    this._min = convertToDate(value);\n    this._setDateConstraints();\n    this._validate();\n  }\n\n  public get min(): Date | null {\n    return this._min;\n  }\n\n  /**\n   * The maximum value required for the picker to remain valid.\n   * @attr\n   */\n  @property({ converter: convertToDate })\n  public set max(value: Date | string | null | undefined) {\n    this._max = convertToDate(value);\n    this._setDateConstraints();\n    this._validate();\n  }\n\n  public get max(): Date | null {\n    return this._max;\n  }\n\n  /** Gets/sets disabled dates. */\n  @property({ attribute: false })\n  @coercedProperty<DateRangeDescriptor[], IgcDatePickerBaseComponent<T>>({\n    onChange: ({ host }) => {\n      host._setDateConstraints();\n      host._validate();\n    },\n  })\n  public disabledDates: DateRangeDescriptor[] = [];\n\n  /** Gets/sets special dates. */\n  @property({ attribute: false })\n  public specialDates!: DateRangeDescriptor[];\n\n  /**\n   * Gets/Sets the date which is shown in the calendar picker and is highlighted.\n   * By default it is the current date.\n   */\n  @property({ attribute: 'active-date', converter: convertToDate })\n  public set activeDate(value: Date | string | null | undefined) {\n    this._activeDate = convertToDate(value);\n  }\n\n  public get activeDate(): Date {\n    return this._activeDate ?? this._calendar?.activeDate;\n  }\n\n  /**\n   * The number of months displayed in the calendar.\n   * @attr visible-months\n   * @default 1\n   */\n  @property({ type: Number, attribute: 'visible-months' })\n  public set visibleMonths(value: number) {\n    this._visibleMonths = value;\n  }\n\n  public get visibleMonths(): number {\n    return this._visibleMonths;\n  }\n\n  /**\n   * The orientation of the calendar header.\n   * @attr header-orientation\n   * @default horizontal\n   */\n  @property({ attribute: 'header-orientation', reflect: true })\n  public headerOrientation: CalendarHeaderOrientation = 'horizontal';\n\n  /**\n   * The orientation of the multiple months displayed in the calendar's days view.\n   * @attr\n   * @default horizontal\n   */\n  @property()\n  public orientation: ContentOrientation = 'horizontal';\n\n  /**\n   * Determines whether the calendar hides its header.\n   * @attr hide-header\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-header' })\n  public hideHeader = false;\n\n  /**\n   * Controls the visibility of the dates that do not belong to the current month.\n   * @attr hide-outside-days\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-outside-days' })\n  public hideOutsideDays = false;\n\n  /**\n   * Whether to show the number of the week in the calendar.\n   * @attr show-week-numbers\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'show-week-numbers' })\n  public showWeekNumbers = false;\n\n  /**\n   * Sets the start day of the week for the calendar.\n   *\n   * @remarks\n   * When not set, the week starts on the first day of the week of the current {@link locale}.\n   * Setting `undefined` returns to the locale value.\n   * @attr week-start\n   */\n  @property({ attribute: 'week-start' })\n  public set weekStart(value: WeekDays | undefined) {\n    this._weekStart = value ?? undefined;\n  }\n\n  public get weekStart(): WeekDays {\n    return this._weekStart ?? getLocaleWeekStart(this.locale);\n  }\n\n  //#endregion\n\n  //#region Life-cycle hooks\n\n  constructor() {\n    super();\n\n    // Projects the host's labels and popup semantics onto the native input\n    // inside the editor (see ProjectedARIA for why the host cannot publish\n    // these itself).\n    addAriaProjector(this, {\n      target: () => this._projectionTarget,\n      state: () => ({\n        hasPopup: 'dialog',\n        labelledBy: this._internals.labels,\n        describedBy: this._helperText ? [this._helperText] : null,\n      }),\n    });\n\n    addSafeEventListener(this, 'focusout', this._handleFocusOut);\n\n    addKeybindings(this, {\n      skip: () => this.disabled || this.readOnly,\n    })\n      .set([altKey, arrowDown], this._handleAnchorClick)\n      .set([altKey, arrowUp], this._onEscapeKey)\n      .set(escapeKey, this._onEscapeKey);\n  }\n\n  protected override willUpdate(changedProperties: PropertyValues<this>): void {\n    super.willUpdate(changedProperties);\n\n    if (changedProperties.has('open')) {\n      this._rootClickController.update();\n\n      if (this.open) {\n        this._oldValue = this._value;\n      }\n    }\n  }\n\n  //#endregion\n\n  //#region Internal API\n\n  protected _setDateConstraints(): void {\n    this._dateConstraints =\n      createDateConstraints(this._min, this._max, this.disabledDates) ?? [];\n  }\n\n  protected async _shouldCloseCalendarDropdown(): Promise<void> {\n    if (this.keepOpenOnSelect || !this._canCloseOnSelect()) {\n      return;\n    }\n\n    if (await this._hide(true)) {\n      this._focusAndSelectInput();\n    }\n  }\n\n  /**\n   * Points the calendar at the first defined of `dates`, keeping its current\n   * active date when none is. A no-op until the calendar is rendered.\n   */\n  protected _setCalendarActiveDate(\n    ...dates: (Date | null | undefined)[]\n  ): void {\n    if (this._calendar) {\n      this._calendar.activeDate =\n        dates.find(Boolean) ?? this._calendar.activeDate;\n    }\n  }\n\n  /**\n   * Pushes the value of the picker back onto the calendar, which a read-only picker has\n   * to do directly - the binding is left with nothing to re-commit.\n   */\n  protected async _restoreCalendarSelection(): Promise<void> {\n    await this._calendar.updateComplete;\n\n    if (this._calendarSelection === 'single') {\n      this._calendar.value = this._calendarValue;\n    } else {\n      this._calendar.values = this._calendarValues ?? emptyValues;\n    }\n  }\n\n  /** Emits `igcChange` if the value has moved away from the last committed one. */\n  protected _emitChangeIfDirty(): void {\n    if (!equal(this._value, this._oldValue)) {\n      this.emitEvent('igcChange', { detail: this._value });\n      this._oldValue = this._value;\n    }\n  }\n\n  //#endregion\n\n  //#region Public methods\n\n  /** Clears the editor(s) of the picker of any user input. */\n  public clear(): void {\n    this._oldValue = this._value;\n    this._value = null;\n    this._clearEditors();\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  protected async _onEscapeKey(): Promise<void> {\n    if (await this._hide(true)) {\n      this._handleDismiss();\n      this._focusInput();\n    }\n  }\n\n  protected override async _handleAnchorClick(): Promise<void> {\n    super._handleAnchorClick();\n    this._syncCalendarOnToggle();\n    await this.updateComplete;\n    this._calendar[focusActiveDate]({ preventScroll: true });\n  }\n\n  protected _handleInputClick(event: Event): void {\n    if (getElementFromPath('input', event)) {\n      // Open only if the click originates from the underlying input\n      this._handleAnchorClick();\n    }\n  }\n\n  protected _handleCalendarIconSlotPointerDown(event: PointerEvent): void {\n    // Keeps the `delegatesFocus` of the host from focusing the editor, which would enter\n    // an invalid state on blur as focus moves on to the calendar.\n    event.preventDefault();\n  }\n\n  protected _handleFocusOut(event: FocusEvent): void {\n    if (focusLeftHost(this, event)) {\n      this._handleBlur();\n      this._onBlur();\n    }\n  }\n\n  protected _handleClosing(): void {\n    this._hide(true);\n  }\n\n  protected async _handleCalendarChangeEvent(\n    event: CustomEvent<Date | Date[]>\n  ): Promise<void> {\n    event.stopPropagation();\n    this._setTouchedState();\n\n    if (this.readOnly) {\n      await this._restoreCalendarSelection();\n      return;\n    }\n\n    this._value = this._valueFromCalendarSelection(asArray(event.detail));\n\n    if (this._commitsCalendarSelection()) {\n      this.emitEvent('igcChange', { detail: this._value });\n    }\n\n    this._shouldCloseCalendarDropdown();\n  }\n\n  protected _handleDialogClosing(event: Event): void {\n    event.stopPropagation();\n    this._onDialogClosing();\n    this._hide(true);\n  }\n\n  protected _handleDialogClosed(event: Event): void {\n    event.stopPropagation();\n  }\n\n  //#endregion\n\n  //#region Rendering\n\n  protected _renderClearIcon(part = 'clear-icon') {\n    return this._hasValue\n      ? html`\n          <span\n            slot=\"suffix\"\n            part=${part}\n            @click=${bindIf(!this.readOnly, this.clear)}\n          >\n            ${renderSlottedIcon({ slot: part, icon: 'input_clear' })}\n          </span>\n        `\n      : nothing;\n  }\n\n  protected _renderCalendarIcon(suffix = '') {\n    const part = `${this.open ? 'calendar-icon-open' : 'calendar-icon'}${suffix}`;\n\n    return html`\n      <span\n        slot=\"prefix\"\n        part=${part}\n        @pointerdown=${this._handleCalendarIconSlotPointerDown}\n        @click=${bindIf(!this.readOnly, this._handleAnchorClick)}\n      >\n        ${renderSlottedIcon({\n          slot: part,\n          icon: 'today',\n          title: this._calendarIconTitle,\n        })}\n      </span>\n    `;\n  }\n\n  /**\n   * The content projected into an editor of the picker - its icons and prefix/suffix slots.\n   *\n   * The suffix distinguishes the editors of a picker which renders more than one,\n   * e.g. `-start` and `-end`.\n   */\n  protected _renderEditorSlots(suffix = '') {\n    const prefixSlot = `prefix${suffix}`;\n    const suffixSlot = `suffix${suffix}`;\n\n    return html`\n      ${this._renderCalendarIcon(suffix)}\n      <slot\n        name=${prefixSlot}\n        slot=${bindIf(this._slots.hasAssignedElements(prefixSlot), 'prefix')}\n      ></slot>\n      ${this._renderClearIcon(`clear-icon${suffix}`)}\n      <slot\n        name=${suffixSlot}\n        slot=${bindIf(this._slots.hasAssignedElements(suffixSlot), 'suffix')}\n      ></slot>\n    `;\n  }\n\n  protected _renderCalendarSlots() {\n    if (this._isDropDown) {\n      return nothing;\n    }\n\n    const hasHeaderDate = this._slots.hasAssignedElements('header-date');\n\n    return html`\n      <slot name=\"title\" slot=\"title\">${this._selectDateLabel}</slot>\n      <slot\n        name=\"header-date\"\n        slot=${bindIf(hasHeaderDate, 'header-date')}\n      ></slot>\n    `;\n  }\n\n  protected _renderCalendar(id: string) {\n    const hideHeader = this._isDropDown ? true : this.hideHeader;\n    const isInert = !this.open || this.disabled;\n\n    return html`\n      <igc-calendar\n        aria-labelledby=${id}\n        role=\"dialog\"\n        selection=${this._calendarSelection}\n        .inert=${isInert}\n        ?show-week-numbers=${this.showWeekNumbers}\n        ?hide-outside-days=${this.hideOutsideDays}\n        ?hide-header=${hideHeader}\n        .activeDate=${this.activeDate ?? this._defaultActiveDate}\n        .value=${this._calendarValue}\n        .values=${this._calendarValues ?? emptyValues}\n        .headerOrientation=${this.headerOrientation}\n        .orientation=${this.orientation}\n        .visibleMonths=${this._visibleMonths}\n        .locale=${this.locale}\n        .disabledDates=${this._dateConstraints}\n        .specialDates=${this.specialDates}\n        .weekStart=${this.weekStart}\n        @igcChange=${this._handleCalendarChangeEvent}\n        exportparts=${calendarExportParts}\n      >\n        ${this._renderCalendarSlots()}\n      </igc-calendar>\n    `;\n  }\n\n  protected _renderActions() {\n    const hasActions = this._slots.hasAssignedElements('actions');\n\n    // If in dialog mode use the dialog footer slot\n    return html`\n      <div\n        part=\"actions\"\n        ?hidden=${!hasActions}\n        slot=${bindIf(!this._isDropDown && hasActions, 'footer')}\n      >\n        <slot name=\"actions\"></slot>\n      </div>\n    `;\n  }\n\n  /** The content rendered inside the popover/dialog of the picker. */\n  protected _renderPickerContent(id: string) {\n    return html`${this._renderCalendar(id)}${this._renderActions()}`;\n  }\n\n  /** Additional content rendered in the dialog of the picker. */\n  protected _renderDialogFooter(): TemplateResult | typeof nothing {\n    return nothing;\n  }\n\n  protected _renderPicker(id: string) {\n    const isDisabled = !this.open || this.disabled;\n\n    return this._isDropDown\n      ? html`\n          <igc-popover ?open=${this.open} anchor=${id} flip shift>\n            <igc-focus-trap ?disabled=${isDisabled}>\n              ${this._renderPickerContent(id)}\n            </igc-focus-trap>\n          </igc-popover>\n        `\n      : html`\n          <igc-dialog\n            aria-label=${ifDefined(this._dialogLabel)}\n            role=\"dialog\"\n            ?open=${this.open}\n            ?close-on-outside-click=${!this.keepOpenOnOutsideClick}\n            hide-default-action\n            @igcClosing=${this._handleDialogClosing}\n            @igcClosed=${this._handleDialogClosed}\n            exportparts=\"base: dialog-base, title, footer, overlay\"\n          >\n            ${this._renderPickerContent(id)}${this._renderDialogFooter()}\n          </igc-dialog>\n        `;\n  }\n\n  //#endregion\n}\n"]}
+{"version":3,"file":"date-picker.base.js","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker.base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing, type PropertyValues, type TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { addAriaProjector } from '#internals/controllers/aria-projection.js';\nimport {\n  addKeybindings,\n  altKey,\n  arrowDown,\n  arrowUp,\n  escapeKey,\n} from '#internals/controllers/key-bindings.js';\nimport { addRootClickController } from '#internals/controllers/root-click.js';\nimport { convertToDate } from '#internals/date/converters.js';\nimport { coercedProperty } from '#internals/decorators/coerced-property.js';\nimport { IgcComboBoxBaseLikeComponent } from '#internals/mixins/combo-box.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormAssociatedRequiredMixin } from '#internals/mixins/forms/associated-required.js';\nimport { renderSlottedIcon } from '#internals/templates/slotted-icon.js';\nimport { asArray } from '#internals/utils/arrays.js';\nimport {\n  addSafeEventListener,\n  focusLeftHost,\n  getElementFromPath,\n} from '#internals/utils/events.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { equal } from '#internals/utils/objects.js';\nimport type { ThemingController } from '#theming/theming-controller.js';\nimport IgcCalendarComponent, { focusActiveDate } from '../calendar/calendar.js';\nimport {\n  createDateConstraints,\n  getLocaleWeekStart,\n} from '../calendar/helpers.js';\nimport type {\n  CalendarHeaderOrientation,\n  CalendarSelection,\n  DateRangeDescriptor,\n  WeekDays,\n} from '../calendar/types.js';\nimport IgcDialogComponent from '../dialog/dialog.js';\nimport IgcFocusTrapComponent from '../focus-trap/focus-trap.js';\nimport IgcIconComponent from '../icon/icon.js';\nimport IgcPopoverComponent from '../popover/popover.js';\nimport type {\n  ContentOrientation,\n  DateRangeValue,\n  PickerMode,\n} from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\n\n/**\n * The events emitted by a picker driven by a calendar.\n * `T` is the value type of the picker - a single date or a date range.\n */\nexport interface IgcPickerBaseEventMap<T> {\n  igcOpening: CustomEvent<void>;\n  igcOpened: CustomEvent<void>;\n  igcClosing: CustomEvent<void>;\n  igcClosed: CustomEvent<void>;\n  igcChange: CustomEvent<T | null>;\n  igcInput: CustomEvent<T | null>;\n}\n\n/** The parts of the calendar which the pickers re-export to their own consumers. */\nexport const calendarExportParts =\n  `header, header-title, header-date, content: calendar-content, navigation, months-navigation,\n  years-navigation, years-range, navigation-buttons, navigation-button, days-view-container,\n  days-view, months-view, years-view, days-row, months-row, years-row, label: calendar-label,\n  label-inner: calendar-label-inner, week-number, week-number-inner, date,\n  date-inner, first, last, inactive, hidden, weekend, range, special, disabled, single, preview,\n  month, month-inner, year, year-inner, selected, current` as const;\n\n/** Stable identity for \"no range\", so that the calendar binding is committed only once. */\nconst emptyValues: Date[] = [];\n\n/** The components rendered by the picker chrome of every picker. */\nexport const pickerDependencies = [\n  IgcCalendarComponent,\n  IgcDialogComponent,\n  IgcFocusTrapComponent,\n  IgcIconComponent,\n  IgcPopoverComponent,\n  IgcValidationContainerComponent,\n];\n\n/**\n * The subset of the slot controller which the base picker queries.\n * Kept structural so that each picker can declare its own set of slot names.\n */\ntype PickerSlots = {\n  hasAssignedElements(slot: string): boolean;\n};\n\n/* blazorIndirectRender */\n/* omitModule */\n/**\n * Common behavior for the pickers which drive an `igc-calendar` from an editor -\n * {@link IgcDatePickerComponent} and {@link IgcDateRangePickerComponent}.\n *\n * It owns the calendar and editor facing properties, the open/close plumbing and the\n * picker chrome - calendar, popover/dialog, icons and actions. The value itself, its\n * form state and the editors are left to the concrete pickers.\n */\nexport abstract class IgcDatePickerBaseComponent<\n  T extends Date | DateRangeValue,\n> extends FormAssociatedRequiredMixin(\n  EventEmitterMixin<\n    IgcPickerBaseEventMap<Date | DateRangeValue>,\n    AbstractConstructor<IgcComboBoxBaseLikeComponent>\n  >(IgcComboBoxBaseLikeComponent)\n) {\n  //#region Internal state and properties\n\n  protected _oldValue: T | null = null;\n\n  protected _activeDate: Date | null = null;\n  protected _min: Date | null = null;\n  protected _max: Date | null = null;\n  protected _dateConstraints: DateRangeDescriptor[] = [];\n  protected _displayFormat?: string;\n  protected _inputFormat?: string;\n  protected _visibleMonths = 1;\n  private _weekStart?: WeekDays;\n\n  protected override readonly _rootClickController = addRootClickController(\n    this,\n    { onHide: this._handleClosing }\n  );\n\n  @query(IgcCalendarComponent.tagName)\n  protected readonly _calendar!: IgcCalendarComponent;\n\n  @query('#helper-text')\n  protected readonly _helperText!: IgcValidationContainerComponent | null;\n\n  protected get _isDropDown(): boolean {\n    return this.mode === 'dropdown';\n  }\n\n  protected get _isMaterial(): boolean {\n    return this._themes.theme === 'material';\n  }\n\n  /** Dialog mode is always read-only, the rest depends on the configuration. */\n  protected get _isEditorReadOnly(): boolean {\n    return !this._isDropDown || this.readOnly || this.nonEditable;\n  }\n\n  //#endregion\n\n  //#region Abstract members\n\n  /** The id of the editor the picker is anchored to. */\n  protected abstract readonly _inputId: string;\n\n  /** The slots of the concrete picker. */\n  protected abstract readonly _slots: PickerSlots;\n\n  /** The theming controller of the concrete picker. */\n  protected abstract readonly _themes: ThemingController;\n\n  /**\n   * The localization controller of the picker. Only the locale is shared,\n   * because the resource strings differ between the pickers.\n   */\n  protected abstract readonly _i18nController: { locale: string };\n\n  /**\n   * The current value of the picker. Each picker declares its own public\n   * `value`, because the type, the converter and the form state differ.\n   */\n  protected abstract get _value(): T | null;\n  protected abstract set _value(value: T | null);\n\n  /** Clears any user input left in the editor(s) of the picker. */\n  protected abstract _clearEditors(): void;\n\n  /** Whether the picker holds a value. */\n  protected abstract get _hasValue(): boolean;\n\n  /** The selection mode of the underlying calendar. */\n  protected abstract get _calendarSelection(): CalendarSelection;\n\n  /** The localized label of the calendar picker. */\n  protected abstract get _selectDateLabel(): string | undefined;\n\n  /**\n   * The editor that gets the ARIA state of the host: the name of the host and\n   * `aria-haspopup=\"dialog\"`. Both must reach the native input that assistive\n   * technology reads.\n   */\n  protected abstract get _projectionTarget(): Element | null;\n\n  /** Moves focus to the editor of the picker. */\n  protected abstract _focusInput(): void;\n\n  /** Restores focus to the editor after a value has been selected in the calendar. */\n  protected abstract _focusAndSelectInput(): void;\n\n  /** The value of the picker for `dates`, which the calendar gives in ascending order. */\n  protected abstract _valueFromCalendarSelection(dates: Date[]): T | null;\n\n  //#endregion\n\n  //#region Overridable hooks\n\n  /** The value reflected in the calendar when it is in single selection mode. */\n  protected get _calendarValue(): Date | null {\n    return null;\n  }\n\n  /** The values reflected in the calendar when it is in range selection mode. */\n  protected get _calendarValues(): Date[] | null {\n    return null;\n  }\n\n  /**\n   * The active date for the first render, if the picker holds a value but no\n   * active date. The calendar then owns its active date and `activeDate` reads\n   * it back, so this is read one time.\n   */\n  protected get _defaultActiveDate(): Date | null {\n    return this._calendarValue;\n  }\n\n  /** The title of the calendar icon, if the picker provides one. */\n  protected get _calendarIconTitle(): string | undefined {\n    return undefined;\n  }\n\n  /** The accessible name of the picker in dialog mode. */\n  protected get _dialogLabel(): string | undefined {\n    return this._selectDateLabel;\n  }\n\n  /** The format the editor(s) fall back to when no display format is set. */\n  protected get _defaultDisplayFormat(): string | undefined {\n    return undefined;\n  }\n\n  /** The format the editor(s) fall back to when no input format is set. */\n  protected get _defaultInputFormat(): string | undefined {\n    return undefined;\n  }\n\n  /** Whether the current calendar selection is complete enough to close the picker. */\n  protected _canCloseOnSelect(): boolean {\n    return true;\n  }\n\n  /** Invoked when the picker is dismissed through the Escape key. */\n  protected _handleDismiss(): void {}\n\n  /** Invoked when focus has left the picker for good. */\n  protected _onBlur(): void {}\n\n  /** Invoked when the dialog of the picker is closing, before the picker is hidden. */\n  protected _onDialogClosing(): void {}\n\n  /** Invoked when the picker is toggled, before the update is awaited. */\n  protected _syncCalendarOnToggle(): void {}\n\n  /** Whether a selection made in the calendar commits the value of the picker right away. */\n  protected _commitsCalendarSelection(): boolean {\n    return true;\n  }\n\n  //#endregion\n\n  //#region Public properties and attributes\n\n  /**\n   * Determines whether the calendar is opened in a dropdown or a modal dialog.\n   * @attr mode\n   * @default dropdown\n   */\n  @property()\n  public mode: PickerMode = 'dropdown';\n\n  /**\n   * Makes the control a readonly field.\n   * @attr readonly\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'readonly' })\n  public readOnly = false;\n\n  /**\n   * Whether to allow typing in the input.\n   * @attr non-editable\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'non-editable' })\n  public nonEditable = false;\n\n  /**\n   * Whether the control will have outlined appearance.\n   * @attr\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  public outlined = false;\n\n  /**\n   * The label of the picker.\n   * @attr label\n   */\n  @property()\n  public label!: string;\n\n  /**\n   * The prompt symbol to use for unfilled parts of the mask.\n   * @attr\n   * @default _\n   */\n  @property()\n  public prompt = '_';\n\n  /**\n   * Format to display the value in when not editing.\n   * Defaults to the locale format if not set.\n   * @attr display-format\n   */\n  @property({ attribute: 'display-format' })\n  public set displayFormat(value: string) {\n    this._displayFormat = value;\n  }\n\n  public get displayFormat(): string {\n    return (this._displayFormat ?? this._defaultDisplayFormat)!;\n  }\n\n  /**\n   * The date format to apply on the input.\n   * Defaults to the current locale Intl.DateTimeFormat\n   * @attr input-format\n   */\n  @property({ attribute: 'input-format' })\n  public set inputFormat(value: string) {\n    this._inputFormat = value;\n  }\n\n  public get inputFormat(): string {\n    return (this._inputFormat ?? this._defaultInputFormat)!;\n  }\n\n  /**\n   * The locale used to format the display value and to resolve the\n   * component's resource strings. Falls back to the global locale when not set.\n   * @attr locale\n   */\n  @property()\n  public set locale(value: string) {\n    this._i18nController.locale = value;\n  }\n\n  public get locale(): string {\n    return this._i18nController.locale;\n  }\n\n  /**\n   * The minimum value required for the picker to remain valid.\n   * @attr\n   */\n  @property({ converter: convertToDate })\n  public set min(value: Date | string | null | undefined) {\n    this._min = convertToDate(value);\n    this._setDateConstraints();\n    this._validate();\n  }\n\n  public get min(): Date | null {\n    return this._min;\n  }\n\n  /**\n   * The maximum value required for the picker to remain valid.\n   * @attr\n   */\n  @property({ converter: convertToDate })\n  public set max(value: Date | string | null | undefined) {\n    this._max = convertToDate(value);\n    this._setDateConstraints();\n    this._validate();\n  }\n\n  public get max(): Date | null {\n    return this._max;\n  }\n\n  /** Gets/sets disabled dates. */\n  @property({ attribute: false })\n  @coercedProperty<DateRangeDescriptor[], IgcDatePickerBaseComponent<T>>({\n    onChange: ({ host }) => {\n      host._setDateConstraints();\n      host._validate();\n    },\n  })\n  public disabledDates: DateRangeDescriptor[] = [];\n\n  /** Gets/sets special dates. */\n  @property({ attribute: false })\n  public specialDates!: DateRangeDescriptor[];\n\n  /**\n   * Gets/Sets the date which is shown in the calendar picker and is highlighted.\n   * By default it is the current date.\n   */\n  @property({ attribute: 'active-date', converter: convertToDate })\n  public set activeDate(value: Date | string | null | undefined) {\n    this._activeDate = convertToDate(value);\n  }\n\n  public get activeDate(): Date {\n    return this._activeDate ?? this._calendar?.activeDate;\n  }\n\n  /**\n   * The number of months displayed in the calendar.\n   * @attr visible-months\n   * @default 1\n   */\n  @property({ type: Number, attribute: 'visible-months' })\n  public set visibleMonths(value: number) {\n    this._visibleMonths = value;\n  }\n\n  public get visibleMonths(): number {\n    return this._visibleMonths;\n  }\n\n  /**\n   * The orientation of the calendar header.\n   * @attr header-orientation\n   * @default horizontal\n   */\n  @property({ attribute: 'header-orientation', reflect: true })\n  public headerOrientation: CalendarHeaderOrientation = 'horizontal';\n\n  /**\n   * The orientation of the multiple months displayed in the calendar's days view.\n   * @attr\n   * @default horizontal\n   */\n  @property()\n  public orientation: ContentOrientation = 'horizontal';\n\n  /**\n   * Determines whether the calendar hides its header.\n   * @attr hide-header\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-header' })\n  public hideHeader = false;\n\n  /**\n   * Controls the visibility of the dates that do not belong to the current month.\n   * @attr hide-outside-days\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-outside-days' })\n  public hideOutsideDays = false;\n\n  /**\n   * Whether to show the number of the week in the calendar.\n   * @attr show-week-numbers\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'show-week-numbers' })\n  public showWeekNumbers = false;\n\n  /**\n   * Sets the start day of the week for the calendar.\n   *\n   * @remarks\n   * When not set, the week starts on the first day of the week of the current {@link locale}.\n   * Setting `undefined` returns to the locale value.\n   * @attr week-start\n   */\n  @property({ attribute: 'week-start' })\n  public set weekStart(value: WeekDays | undefined) {\n    this._weekStart = value ?? undefined;\n  }\n\n  public get weekStart(): WeekDays {\n    return this._weekStart ?? getLocaleWeekStart(this.locale);\n  }\n\n  //#endregion\n\n  //#region Life-cycle hooks\n\n  constructor() {\n    super();\n\n    // Projects the name and the popup semantics of the host onto the native\n    // input of the editor. See ProjectedARIA.\n    addAriaProjector(this, {\n      target: () => this._projectionTarget,\n      state: () => ({\n        hasPopup: 'dialog',\n        describedBy: this._helperText ? [this._helperText] : null,\n      }),\n      hasOwnLabel: () => Boolean(this.label),\n    });\n\n    addSafeEventListener(this, 'focusout', this._handleFocusOut);\n\n    addKeybindings(this, {\n      skip: () => this.disabled || this.readOnly,\n    })\n      .set([altKey, arrowDown], this._handleAnchorClick)\n      .set([altKey, arrowUp], this._onEscapeKey)\n      .set(escapeKey, this._onEscapeKey);\n  }\n\n  protected override willUpdate(changedProperties: PropertyValues<this>): void {\n    super.willUpdate(changedProperties);\n\n    if (changedProperties.has('open')) {\n      this._rootClickController.update();\n\n      if (this.open) {\n        this._oldValue = this._value;\n      }\n    }\n  }\n\n  //#endregion\n\n  //#region Internal API\n\n  protected _setDateConstraints(): void {\n    this._dateConstraints =\n      createDateConstraints(this._min, this._max, this.disabledDates) ?? [];\n  }\n\n  protected async _shouldCloseCalendarDropdown(): Promise<void> {\n    if (this.keepOpenOnSelect || !this._canCloseOnSelect()) {\n      return;\n    }\n\n    if (await this._hide(true)) {\n      this._focusAndSelectInput();\n    }\n  }\n\n  /**\n   * Points the calendar at the first defined date of `dates`, and keeps the\n   * current active date if there is none. Does nothing before the calendar\n   * renders.\n   */\n  protected _setCalendarActiveDate(\n    ...dates: (Date | null | undefined)[]\n  ): void {\n    if (this._calendar) {\n      this._calendar.activeDate =\n        dates.find(Boolean) ?? this._calendar.activeDate;\n    }\n  }\n\n  /**\n   * Writes the value of the picker back onto the calendar. A read-only picker\n   * must do this itself, because the binding has nothing to commit again.\n   */\n  protected async _restoreCalendarSelection(): Promise<void> {\n    await this._calendar.updateComplete;\n\n    if (this._calendarSelection === 'single') {\n      this._calendar.value = this._calendarValue;\n    } else {\n      this._calendar.values = this._calendarValues ?? emptyValues;\n    }\n  }\n\n  /** Emits `igcChange` if the value has moved away from the last committed one. */\n  protected _emitChangeIfDirty(): void {\n    if (!equal(this._value, this._oldValue)) {\n      this.emitEvent('igcChange', { detail: this._value });\n      this._oldValue = this._value;\n    }\n  }\n\n  //#endregion\n\n  //#region Public methods\n\n  /** Clears the editor(s) of the picker of any user input. */\n  public clear(): void {\n    this._oldValue = this._value;\n    this._value = null;\n    this._clearEditors();\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  protected async _onEscapeKey(): Promise<void> {\n    if (await this._hide(true)) {\n      this._handleDismiss();\n      this._focusInput();\n    }\n  }\n\n  protected override async _handleAnchorClick(): Promise<void> {\n    super._handleAnchorClick();\n    this._syncCalendarOnToggle();\n    await this.updateComplete;\n    this._calendar[focusActiveDate]({ preventScroll: true });\n  }\n\n  protected _handleInputClick(event: Event): void {\n    if (getElementFromPath('input', event)) {\n      // Open only if the click originates from the underlying input\n      this._handleAnchorClick();\n    }\n  }\n\n  protected _handleCalendarIconSlotPointerDown(event: PointerEvent): void {\n    // Keeps the `delegatesFocus` of the host from focusing the editor, which would enter\n    // an invalid state on blur as focus moves on to the calendar.\n    event.preventDefault();\n  }\n\n  protected _handleFocusOut(event: FocusEvent): void {\n    if (focusLeftHost(this, event)) {\n      this._handleBlur();\n      this._onBlur();\n    }\n  }\n\n  protected _handleClosing(): void {\n    this._hide(true);\n  }\n\n  protected async _handleCalendarChangeEvent(\n    event: CustomEvent<Date | Date[]>\n  ): Promise<void> {\n    event.stopPropagation();\n    this._setTouchedState();\n\n    if (this.readOnly) {\n      await this._restoreCalendarSelection();\n      return;\n    }\n\n    this._value = this._valueFromCalendarSelection(asArray(event.detail));\n\n    if (this._commitsCalendarSelection()) {\n      this.emitEvent('igcChange', { detail: this._value });\n    }\n\n    this._shouldCloseCalendarDropdown();\n  }\n\n  protected _handleDialogClosing(event: Event): void {\n    event.stopPropagation();\n    this._onDialogClosing();\n    this._hide(true);\n  }\n\n  protected _handleDialogClosed(event: Event): void {\n    event.stopPropagation();\n  }\n\n  //#endregion\n\n  //#region Rendering\n\n  protected _renderClearIcon(part = 'clear-icon') {\n    return this._hasValue\n      ? html`\n          <span\n            slot=\"suffix\"\n            part=${part}\n            @click=${bindIf(!this.readOnly, this.clear)}\n          >\n            ${renderSlottedIcon({ slot: part, icon: 'input_clear' })}\n          </span>\n        `\n      : nothing;\n  }\n\n  protected _renderCalendarIcon(suffix = '') {\n    const part = `${this.open ? 'calendar-icon-open' : 'calendar-icon'}${suffix}`;\n\n    return html`\n      <span\n        slot=\"prefix\"\n        part=${part}\n        @pointerdown=${this._handleCalendarIconSlotPointerDown}\n        @click=${bindIf(!this.readOnly, this._handleAnchorClick)}\n      >\n        ${renderSlottedIcon({\n          slot: part,\n          icon: 'today',\n          title: this._calendarIconTitle,\n        })}\n      </span>\n    `;\n  }\n\n  /**\n   * The content for an editor of the picker: its icons and its prefix and\n   * suffix slots. The suffix identifies the editor if the picker renders more\n   * than one, for example `-start` and `-end`.\n   */\n  protected _renderEditorSlots(suffix = '') {\n    const prefixSlot = `prefix${suffix}`;\n    const suffixSlot = `suffix${suffix}`;\n\n    return html`\n      ${this._renderCalendarIcon(suffix)}\n      <slot\n        name=${prefixSlot}\n        slot=${bindIf(this._slots.hasAssignedElements(prefixSlot), 'prefix')}\n      ></slot>\n      ${this._renderClearIcon(`clear-icon${suffix}`)}\n      <slot\n        name=${suffixSlot}\n        slot=${bindIf(this._slots.hasAssignedElements(suffixSlot), 'suffix')}\n      ></slot>\n    `;\n  }\n\n  protected _renderCalendarSlots() {\n    if (this._isDropDown) {\n      return nothing;\n    }\n\n    const hasHeaderDate = this._slots.hasAssignedElements('header-date');\n\n    return html`\n      <slot name=\"title\" slot=\"title\">${this._selectDateLabel}</slot>\n      <slot\n        name=\"header-date\"\n        slot=${bindIf(hasHeaderDate, 'header-date')}\n      ></slot>\n    `;\n  }\n\n  protected _renderCalendar(id: string) {\n    const hideHeader = this._isDropDown || this.hideHeader;\n    const isInert = !this.open || this.disabled;\n\n    return html`\n      <igc-calendar\n        aria-labelledby=${id}\n        role=\"dialog\"\n        selection=${this._calendarSelection}\n        .inert=${isInert}\n        ?show-week-numbers=${this.showWeekNumbers}\n        ?hide-outside-days=${this.hideOutsideDays}\n        ?hide-header=${hideHeader}\n        .activeDate=${this.activeDate ?? this._defaultActiveDate}\n        .value=${this._calendarValue}\n        .values=${this._calendarValues ?? emptyValues}\n        .headerOrientation=${this.headerOrientation}\n        .orientation=${this.orientation}\n        .visibleMonths=${this._visibleMonths}\n        .locale=${this.locale}\n        .disabledDates=${this._dateConstraints}\n        .specialDates=${this.specialDates}\n        .weekStart=${this.weekStart}\n        @igcChange=${this._handleCalendarChangeEvent}\n        exportparts=${calendarExportParts}\n      >\n        ${this._renderCalendarSlots()}\n      </igc-calendar>\n    `;\n  }\n\n  protected _renderActions() {\n    const hasActions = this._slots.hasAssignedElements('actions');\n\n    // If in dialog mode use the dialog footer slot\n    return html`\n      <div\n        part=\"actions\"\n        ?hidden=${!hasActions}\n        slot=${bindIf(!this._isDropDown && hasActions, 'footer')}\n      >\n        <slot name=\"actions\"></slot>\n      </div>\n    `;\n  }\n\n  /** The content rendered inside the popover/dialog of the picker. */\n  protected _renderPickerContent(id: string) {\n    return html`${this._renderCalendar(id)}${this._renderActions()}`;\n  }\n\n  /** Additional content rendered in the dialog of the picker. */\n  protected _renderDialogFooter(): TemplateResult | typeof nothing {\n    return nothing;\n  }\n\n  protected _renderPicker(id: string) {\n    const isDisabled = !this.open || this.disabled;\n\n    return this._isDropDown\n      ? html`\n          <igc-popover\n            ?open=${this.open}\n            anchor=${id}\n            flip\n            .scrollStrategy=${this.scrollStrategy}\n            @igcPopoverScrollClose=${this._handleClosing}\n          >\n            <igc-focus-trap ?disabled=${isDisabled}>\n              ${this._renderPickerContent(id)}\n            </igc-focus-trap>\n          </igc-popover>\n        `\n      : html`\n          <igc-dialog\n            aria-label=${ifDefined(this._dialogLabel)}\n            role=\"dialog\"\n            ?open=${this.open}\n            ?close-on-outside-click=${!this.keepOpenOnOutsideClick}\n            hide-default-action\n            @igcClosing=${this._handleDialogClosing}\n            @igcClosed=${this._handleDialogClosed}\n            exportparts=\"base: dialog-base, title, footer, overlay\"\n          >\n            ${this._renderPickerContent(id)}${this._renderDialogFooter()}\n          </igc-dialog>\n        `;\n  }\n\n  //#endregion\n}\n"]}

package/components/date-picker/date-picker.d.ts

@@ -93,7 +93,7 @@ export default class IgcDatePickerComponent extends IgcDatePickerComponent_base
     protected get __validators(): import("../../internals/validators.js").Validator<IgcDatePickerComponent>[];
     protected readonly _inputId: string;
     protected readonly _themes: import("#theming/theming-controller.js").ThemingController;
-    protected readonly _slots: import("#internals/controllers/slot.js").SlotController<"invalid" | "title" | "prefix" | "helper-text" | "[default]" | "actions" | "suffix" | "value-missing" | "custom-error" | "range-overflow" | "range-underflow" | "clear-icon" | "calendar-icon-open" | "calendar-icon" | "header-date" | "bad-input">;
+    protected readonly _slots: import("#internals/controllers/slot.js").SlotController<"invalid" | "title" | "prefix" | "[default]" | "actions" | "suffix" | "helper-text" | "value-missing" | "range-overflow" | "range-underflow" | "custom-error" | "clear-icon" | "calendar-icon-open" | "calendar-icon" | "header-date" | "bad-input">;
     /**
      * For now we use the core validation strings internally only, to avoid mixing with old resources by users.
      * To Do: Update resourceStrings type when the IgcCalendarResourceStrings is changed to ICalendarResourceStrings

package/components/date-picker/date-picker.js

@@ -15,6 +15,7 @@ import { blazorAdditionalDependencies } from '#internals/decorators/blazorAdditi
 import { shadowOptions } from '#internals/decorators/shadow-options.js';
 import { registerComponent } from '#internals/definitions/register.js';
 import { addI18nController, getDateTimeFormat, } from '#internals/i18n/i18n-controller.js';
+import { datePickerResourcesMap } from '#internals/i18n/utils.js';
 import { EventEmitterMixin } from '#internals/mixins/event-emitter.js';
 import { FormValueDateTimeTransformers } from '#internals/mixins/forms/form-transformers.js';
 import { createFormValueState } from '#internals/mixins/forms/form-value.js';
@@ -23,6 +24,7 @@ import { bindIf } from '#internals/utils/lit.js';
 import { createIdGenerator } from '#internals/utils/strings.js';
 import { addThemingController } from '#theming/theming-controller.js';
 import IgcDateTimeInputComponent from '../date-time-input/date-time-input.js';
+import IgcValidationContainerComponent from '../validation-container/validation-container.js';
 import { IgcDatePickerBaseComponent, pickerDependencies, } from './date-picker.base.js';
 import { styles } from './themes/date-picker.base.css.js';
 import { styles as shared } from './themes/shared/date-picker.common.css.js';
@@ -40,7 +42,7 @@ let IgcDatePickerComponent = class IgcDatePickerComponent extends EventEmitterMi
         });
         this._i18nController = addI18nController(this, {
             defaultEN: Object.assign({}, DatePickerResourceStringsEN, CalendarResourceStringsEN),
-            resourceMapName: 'date-picker',
+            resourceMap: datePickerResourcesMap,
         });
         this._formValue = createFormValueState(this, {
             initialValue: null,
@@ -200,7 +202,7 @@ let IgcDatePickerComponent = class IgcDatePickerComponent extends EventEmitterMi
         @igcInput=${this._handleInputEvent}
         @keydown=${this._handleEnterKeydown}
         @click=${bindIf(hasClickHandler, this._handleInputClick)}
-        exportparts="input, label, prefix, suffix"
+        exportparts="container, input, label, prefix, suffix"
       >
         ${this._renderEditorSlots()}
       </igc-date-time-input>
@@ -211,7 +213,7 @@ let IgcDatePickerComponent = class IgcDatePickerComponent extends EventEmitterMi
         return html `
       ${this._isMaterial ? nothing : this._renderLabel(id)}
       ${this._renderInput(id)} ${this._renderPicker(id)}
-      ${this._renderValidationContainer()}
+      ${IgcValidationContainerComponent.create(this)}
     `;
     }
 };

package/components/date-picker/date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.js","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  CalendarResourceStringsEN,\n  DatePickerResourceStringsEN,\n  type ICalendarResourceStrings,\n  type IDatePickerResourceStrings,\n} from 'igniteui-i18n-core';\nimport { html, nothing, type TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { convertToDate } from '#internals/date/converters.js';\nimport { blazorAdditionalDependencies } from '#internals/decorators/blazorAdditionalDependencies.js';\nimport { shadowOptions } from '#internals/decorators/shadow-options.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { IgcCalendarResourceStrings } from '#internals/i18n/EN/calendar.resources.js';\nimport {\n  addI18nController,\n  getDateTimeFormat,\n} from '#internals/i18n/i18n-controller.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormValueDateTimeTransformers } from '#internals/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { firstOf } from '#internals/utils/arrays.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { createIdGenerator } from '#internals/utils/strings.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport type { CalendarSelection } from '../calendar/types.js';\nimport type { DatePart } from '../date-time-input/date-part.js';\nimport IgcDateTimeInputComponent from '../date-time-input/date-time-input.js';\nimport type { RangeTextSelectMode, SelectionRangeDirection } from '../types.js';\nimport {\n  IgcDatePickerBaseComponent,\n  type IgcPickerBaseEventMap,\n  pickerDependencies,\n} from './date-picker.base.js';\nimport { styles } from './themes/date-picker.base.css.js';\nimport { styles as shared } from './themes/shared/date-picker.common.css.js';\nimport { all } from './themes/themes.js';\nimport { datePickerValidators } from './validators.js';\n\nexport type IgcDatePickerComponentEventMap = IgcPickerBaseEventMap<Date>;\n\nconst nextId = createIdGenerator('date-picker');\nconst Slots = setSlots(\n  'prefix',\n  'suffix',\n  'helper-text',\n  'bad-input',\n  'value-missing',\n  'range-overflow',\n  'range-underflow',\n  'custom-error',\n  'invalid',\n  'title',\n  'header-date',\n  'clear-icon',\n  'calendar-icon',\n  'calendar-icon-open',\n  'actions'\n);\ntype DatePickerResourceStringsType = IDatePickerResourceStrings &\n  ICalendarResourceStrings;\n\n/* blazorIndirectRender */\n/* blazorSupportsVisualChildren */\n/**\n * The date picker is a feature rich component used for entering a date through manual text input or\n * choosing date values from a calendar dialog that pops up.\n *\n * @element igc-date-picker\n *\n * @slot prefix - Renders content before the input.\n * @slot suffix - Renders content after the input.\n * @slot helper-text - Renders content below the input.\n * @slot bad-input - Renders content when the value is in the disabledDates ranges.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot range-overflow - Renders content when the max validation fails.\n * @slot range-underflow - Renders content when the min validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n * @slot title - Renders content in the calendar title.\n * @slot header-date - Renders content instead of the current date/range in the calendar header.\n * @slot clear-icon - Renders a clear icon template.\n * @slot calendar-icon - Renders the icon/content for the calendar picker.\n * @slot calendar-icon-open - Renders the icon/content for the picker in open state.\n * @slot actions - Renders content in the action part of the picker in open state.\n *\n * @fires igcOpening - Emitted just before the calendar popover is shown.\n * @fires igcOpened - Emitted after the calendar popover is shown.\n * @fires igcClosing - Emitted just before the calendar popover is hidden.\n * @fires igcClosed - Emitted after the calendar popover is hidden.\n * @fires igcChange - Emitted when the user modifies and commits the elements's value.\n * @fires igcInput - Emitted when when the user types in the element.\n *\n * @csspart label - The label wrapper that renders content above the target input.\n * @csspart container - The main wrapper that holds all main input elements.\n * @csspart input - The native input element.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n * @csspart calendar-icon - The calendar icon wrapper for closed state.\n * @csspart calendar-icon-open - The calendar icon wrapper for opened state.\n * @csspart clear-icon - The clear icon wrapper.\n * @csspart actions - The actions wrapper.\n * @csspart helper-text - The helper-text wrapper that renders content below the target input.\n * @csspart header - The calendar header element.\n * @csspart header-title - The calendar header title element.\n * @csspart header-date - The calendar header date element.\n * @csspart calendar-content - The calendar content element which contains the views and navigation elements.\n * @csspart navigation - The calendar navigation container element.\n * @csspart months-navigation - The calendar months navigation button element.\n * @csspart years-navigation - The calendar years navigation button element.\n * @csspart years-range - The calendar years range element.\n * @csspart navigation-buttons - The calendar navigation buttons container.\n * @csspart navigation-button - The calendar previous/next navigation button.\n * @csspart days-view-container - The calendar days view container element.\n * @csspart days-view - The calendar days view element.\n * @csspart months-view - The calendar months view element.\n * @csspart years-view - The calendar years view element.\n * @csspart days-row - The calendar days row element.\n * @csspart calendar-label - The calendar week header label element.\n * @csspart week-number - The calendar week number element.\n * @csspart week-number-inner - The calendar week number inner element.\n * @csspart date - The calendar date element.\n * @csspart date-inner - The calendar date inner element.\n * @csspart first - The calendar first selected date element in range selection.\n * @csspart last - The calendar last selected date element in range selection.\n * @csspart inactive - The calendar inactive date element.\n * @csspart hidden - The calendar hidden date element.\n * @csspart weekend - The calendar weekend date element.\n * @csspart range - The calendar range selected element.\n * @csspart special - The calendar special date element.\n * @csspart disabled - The calendar disabled date element.\n * @csspart single - The calendar single selected date element.\n * @csspart preview - The calendar range selection preview date element.\n * @csspart month - The calendar month element.\n * @csspart month-inner - The calendar month inner element.\n * @csspart year - The calendar year element.\n * @csspart year-inner - The calendar year inner element.\n * @csspart selected - The calendar selected state for element(s). Applies to date, month and year elements.\n * @csspart current - The calendar current state for element(s). Applies to date, month and year elements.\n */\n@blazorAdditionalDependencies(\n  'IgcCalendarComponent, IgcDateTimeInputComponent, IgcDialogComponent, IgcIconComponent'\n)\n@shadowOptions({ delegatesFocus: true })\nexport default class IgcDatePickerComponent extends EventEmitterMixin<\n  IgcDatePickerComponentEventMap,\n  AbstractConstructor<IgcDatePickerBaseComponent<Date>>\n>(IgcDatePickerBaseComponent) {\n  public static readonly tagName = 'igc-date-picker';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcDatePickerComponent,\n      IgcDateTimeInputComponent,\n      ...pickerDependencies\n    );\n  }\n\n  //#region Private properties and state\n\n  protected override get __validators() {\n    return datePickerValidators;\n  }\n\n  protected override readonly _inputId = nextId();\n  protected override readonly _themes = addThemingController(this, all);\n  protected override readonly _slots = addSlotController(this, {\n    slots: Slots,\n  });\n\n  /**\n   * For now we use the core validation strings internally only, to avoid mixing with old resources by users.\n   * To Do: Update resourceStrings type when the IgcCalendarResourceStrings is changed to ICalendarResourceStrings\n   */\n  protected override readonly _i18nController = addI18nController<\n    IgcCalendarResourceStrings | DatePickerResourceStringsType\n  >(this, {\n    defaultEN: Object.assign(\n      {},\n      DatePickerResourceStringsEN,\n      CalendarResourceStringsEN\n    ),\n    resourceMapName: 'date-picker',\n  });\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: null,\n    transformers: FormValueDateTimeTransformers,\n  });\n\n  @query(IgcDateTimeInputComponent.tagName)\n  private readonly _input!: IgcDateTimeInputComponent;\n\n  //#endregion\n\n  //#region Base class hooks\n\n  protected override get _value(): Date | null {\n    return this.value;\n  }\n\n  protected override set _value(value: Date | null) {\n    this.value = value;\n  }\n\n  protected override get _hasValue(): boolean {\n    return this.value !== null;\n  }\n\n  protected override get _calendarSelection(): CalendarSelection {\n    return 'single';\n  }\n\n  protected override get _calendarValue(): Date | null {\n    return this.value;\n  }\n\n  protected override get _selectDateLabel(): string | undefined {\n    return this.resourceStrings.calendar_select_date;\n  }\n\n  protected override get _calendarIconTitle(): string | undefined {\n    return this.value\n      ? this.resourceStrings.date_picker_change_date\n      : this.resourceStrings.date_picker_choose_date;\n  }\n\n  protected override get _dialogLabel(): string | undefined {\n    return this._calendarIconTitle;\n  }\n\n  protected override get _defaultDisplayFormat(): string | undefined {\n    return this._input?.displayFormat;\n  }\n\n  protected override get _defaultInputFormat(): string | undefined {\n    return this._input?.inputFormat;\n  }\n\n  protected override get _projectionTarget() {\n    return this._input ?? null;\n  }\n\n  protected override _focusInput(): void {\n    this._input.focus();\n  }\n\n  protected override _focusAndSelectInput(): void {\n    this._input.focus();\n    this._input.select();\n  }\n\n  protected override _syncCalendarOnToggle(): void {\n    this._setCalendarActiveDate(this.value);\n  }\n\n  protected override _clearEditors(): void {\n    this._input?.clear();\n  }\n\n  protected override _valueFromCalendarSelection(dates: Date[]): Date | null {\n    return firstOf(dates) ?? null;\n  }\n\n  /**\n   * A committed edit in the input already emits `igcChange` on its own, so only a\n   * value which the picker itself has changed is left to notify about here.\n   */\n  protected override _onBlur(): void {\n    if (this._isEditorReadOnly) {\n      this._emitChangeIfDirty();\n    }\n  }\n\n  protected override _onDialogClosing(): void {\n    this._oldValue = this.value;\n  }\n\n  //#endregion\n\n  //#region Public properties and attributes\n\n  /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n  /**\n   * The value of the picker.\n   *\n   * Only ever holds a committed value. While the user is typing in the input, the\n   * intermediate state stays in the editor and is committed - together with an\n   * `igcChange` event - when the edit is committed on blur. Use the `igcInput` event\n   * to observe the value as it is being typed.\n   *\n   * @attr\n   */\n  @property({ converter: convertToDate })\n  public set value(value: Date | string | null | undefined) {\n    this._formValue.setValueAndFormState(value as Date | null);\n  }\n\n  public get value(): Date | null {\n    return this._formValue.value;\n  }\n\n  /**\n   * The placeholder text of the control.\n   * @attr\n   */\n  @property()\n  public placeholder!: string;\n\n  /**\n   * The resource strings for localization.\n   */\n  @property({ attribute: false })\n  public set resourceStrings(\n    value: IgcCalendarResourceStrings | DatePickerResourceStringsType\n  ) {\n    this._i18nController.resourceStrings = value;\n  }\n\n  public get resourceStrings(): IgcCalendarResourceStrings &\n    DatePickerResourceStringsType {\n    return this._i18nController.resourceStrings;\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  protected _handleInputChangeEvent(event: CustomEvent<Date>): void {\n    event.stopPropagation();\n\n    this._commitValue(\n      (event.target as IgcDateTimeInputComponent).value,\n      'igcChange'\n    );\n  }\n\n  protected _handleInputEvent(event: CustomEvent<Date>): void {\n    event.stopPropagation();\n\n    this._setTouchedState();\n\n    if (this.nonEditable) {\n      event.preventDefault();\n      return;\n    }\n\n    const draft = (event.target as IgcDateTimeInputComponent)._uncommittedValue;\n\n    this._calendar.activeDate = draft ?? this._calendar.activeDate;\n    this.emitEvent('igcInput', { detail: draft });\n  }\n\n  //#endregion\n\n  //#region Form associated overrides\n\n  protected override formResetCallback(): void {\n    super.formResetCallback();\n\n    // The inner editor is not associated with the outer form (shadow\n    // boundary), so the browser never resets it. Since it runs its own\n    // constraint validation against the forwarded `required`/`min`/`max`,\n    // a touched editor would otherwise keep its invalid styles after the\n    // form reset.\n    this._input?.['formResetCallback']();\n  }\n\n  //#endregion\n\n  //#region Public methods\n\n  /** Increments the passed in date part */\n  public stepUp(datePart?: DatePart, delta?: number): void {\n    this._input.stepUp(datePart, delta);\n  }\n\n  /** Decrements the passed in date part */\n  public stepDown(datePart?: DatePart, delta?: number): void {\n    this._input.stepDown(datePart, delta);\n  }\n\n  /** Selects the text in the input of the component */\n  public select(): void {\n    this._input.select();\n  }\n\n  /* blazorSuppress */\n  /** Sets the text selection range in the input of the component */\n  public setSelectionRange(\n    start: number,\n    end: number,\n    direction?: SelectionRangeDirection\n  ): void {\n    this._input.setSelectionRange(start, end, direction);\n  }\n\n  /* blazorSuppress */\n  /* Replaces the selected text in the input and re-applies the mask */\n  public setRangeText(\n    replacement: string,\n    start: number,\n    end: number,\n    mode?: RangeTextSelectMode\n  ): void {\n    this._input.setRangeText(replacement, start, end, mode);\n    this.value = this._input.value;\n  }\n\n  //#endregion\n\n  //#region Render methods\n\n  private _renderLabel(id: string) {\n    const isDisabled = this._isDropDown || this.readOnly;\n\n    return this.label\n      ? html`\n          <label\n            part=\"label\"\n            for=${id}\n            @click=${bindIf(!isDisabled, this._handleAnchorClick)}\n          >\n            ${this.label}\n          </label>\n        `\n      : nothing;\n  }\n\n  protected _renderInput(id: string) {\n    const format = getDateTimeFormat(this._displayFormat);\n    const hasClickHandler = !(this._isDropDown || this.readOnly);\n\n    return html`\n      <igc-date-time-input\n        id=${id}\n        label=${bindIf(this._isMaterial, this.label)}\n        input-format=${ifDefined(this._inputFormat)}\n        display-format=${ifDefined(format)}\n        ?disabled=${this.disabled}\n        ?readonly=${this._isEditorReadOnly}\n        ?required=${this.required}\n        .value=${this.value}\n        .locale=${this.locale}\n        .prompt=${this.prompt}\n        .outlined=${this.outlined}\n        .placeholder=${this.placeholder}\n        .min=${this.min}\n        .max=${this.max}\n        .invalid=${this.invalid}\n        @igcChange=${this._handleInputChangeEvent}\n        @igcInput=${this._handleInputEvent}\n        @keydown=${this._handleEnterKeydown}\n        @click=${bindIf(hasClickHandler, this._handleInputClick)}\n        exportparts=\"input, label, prefix, suffix\"\n      >\n        ${this._renderEditorSlots()}\n      </igc-date-time-input>\n    `;\n  }\n\n  protected override render(): TemplateResult {\n    const id = this.id || this._inputId;\n\n    return html`\n      ${this._isMaterial ? nothing : this._renderLabel(id)}\n      ${this._renderInput(id)} ${this._renderPicker(id)}\n      ${this._renderValidationContainer()}\n    `;\n  }\n\n  //#endregion\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-date-picker': IgcDatePickerComponent;\n  }\n}\n"]}
+{"version":3,"file":"date-picker.js","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  CalendarResourceStringsEN,\n  DatePickerResourceStringsEN,\n  type ICalendarResourceStrings,\n  type IDatePickerResourceStrings,\n} from 'igniteui-i18n-core';\nimport { html, nothing, type TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { convertToDate } from '#internals/date/converters.js';\nimport { blazorAdditionalDependencies } from '#internals/decorators/blazorAdditionalDependencies.js';\nimport { shadowOptions } from '#internals/decorators/shadow-options.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { IgcCalendarResourceStrings } from '#internals/i18n/EN/calendar.resources.js';\nimport {\n  addI18nController,\n  getDateTimeFormat,\n} from '#internals/i18n/i18n-controller.js';\nimport { datePickerResourcesMap } from '#internals/i18n/utils.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormValueDateTimeTransformers } from '#internals/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { firstOf } from '#internals/utils/arrays.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { createIdGenerator } from '#internals/utils/strings.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport type { CalendarSelection } from '../calendar/types.js';\nimport type { DatePart } from '../date-time-input/date-part.js';\nimport IgcDateTimeInputComponent from '../date-time-input/date-time-input.js';\nimport type { RangeTextSelectMode, SelectionRangeDirection } from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport {\n  IgcDatePickerBaseComponent,\n  type IgcPickerBaseEventMap,\n  pickerDependencies,\n} from './date-picker.base.js';\nimport { styles } from './themes/date-picker.base.css.js';\nimport { styles as shared } from './themes/shared/date-picker.common.css.js';\nimport { all } from './themes/themes.js';\nimport { datePickerValidators } from './validators.js';\n\nexport type IgcDatePickerComponentEventMap = IgcPickerBaseEventMap<Date>;\n\nconst nextId = createIdGenerator('date-picker');\nconst Slots = setSlots(\n  'prefix',\n  'suffix',\n  'helper-text',\n  'bad-input',\n  'value-missing',\n  'range-overflow',\n  'range-underflow',\n  'custom-error',\n  'invalid',\n  'title',\n  'header-date',\n  'clear-icon',\n  'calendar-icon',\n  'calendar-icon-open',\n  'actions'\n);\ntype DatePickerResourceStringsType = IDatePickerResourceStrings &\n  ICalendarResourceStrings;\n\n/* blazorIndirectRender */\n/* blazorSupportsVisualChildren */\n/**\n * The date picker is a feature rich component used for entering a date through manual text input or\n * choosing date values from a calendar dialog that pops up.\n *\n * @element igc-date-picker\n *\n * @slot prefix - Renders content before the input.\n * @slot suffix - Renders content after the input.\n * @slot helper-text - Renders content below the input.\n * @slot bad-input - Renders content when the value is in the disabledDates ranges.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot range-overflow - Renders content when the max validation fails.\n * @slot range-underflow - Renders content when the min validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n * @slot title - Renders content in the calendar title.\n * @slot header-date - Renders content instead of the current date/range in the calendar header.\n * @slot clear-icon - Renders a clear icon template.\n * @slot calendar-icon - Renders the icon/content for the calendar picker.\n * @slot calendar-icon-open - Renders the icon/content for the picker in open state.\n * @slot actions - Renders content in the action part of the picker in open state.\n *\n * @fires igcOpening - Emitted just before the calendar popover is shown.\n * @fires igcOpened - Emitted after the calendar popover is shown.\n * @fires igcClosing - Emitted just before the calendar popover is hidden.\n * @fires igcClosed - Emitted after the calendar popover is hidden.\n * @fires igcChange - Emitted when the user modifies and commits the elements's value.\n * @fires igcInput - Emitted when when the user types in the element.\n *\n * @csspart label - The label wrapper that renders content above the target input.\n * @csspart container - The main wrapper that holds all main input elements.\n * @csspart input - The native input element.\n * @csspart prefix - The prefix wrapper.\n * @csspart suffix - The suffix wrapper.\n * @csspart calendar-icon - The calendar icon wrapper for closed state.\n * @csspart calendar-icon-open - The calendar icon wrapper for opened state.\n * @csspart clear-icon - The clear icon wrapper.\n * @csspart actions - The actions wrapper.\n * @csspart helper-text - The helper-text wrapper that renders content below the target input.\n * @csspart header - The calendar header element.\n * @csspart header-title - The calendar header title element.\n * @csspart header-date - The calendar header date element.\n * @csspart calendar-content - The calendar content element which contains the views and navigation elements.\n * @csspart navigation - The calendar navigation container element.\n * @csspart months-navigation - The calendar months navigation button element.\n * @csspart years-navigation - The calendar years navigation button element.\n * @csspart years-range - The calendar years range element.\n * @csspart navigation-buttons - The calendar navigation buttons container.\n * @csspart navigation-button - The calendar previous/next navigation button.\n * @csspart days-view-container - The calendar days view container element.\n * @csspart days-view - The calendar days view element.\n * @csspart months-view - The calendar months view element.\n * @csspart years-view - The calendar years view element.\n * @csspart days-row - The calendar days row element.\n * @csspart calendar-label - The calendar week header label element.\n * @csspart week-number - The calendar week number element.\n * @csspart week-number-inner - The calendar week number inner element.\n * @csspart date - The calendar date element.\n * @csspart date-inner - The calendar date inner element.\n * @csspart first - The calendar first selected date element in range selection.\n * @csspart last - The calendar last selected date element in range selection.\n * @csspart inactive - The calendar inactive date element.\n * @csspart hidden - The calendar hidden date element.\n * @csspart weekend - The calendar weekend date element.\n * @csspart range - The calendar range selected element.\n * @csspart special - The calendar special date element.\n * @csspart disabled - The calendar disabled date element.\n * @csspart single - The calendar single selected date element.\n * @csspart preview - The calendar range selection preview date element.\n * @csspart month - The calendar month element.\n * @csspart month-inner - The calendar month inner element.\n * @csspart year - The calendar year element.\n * @csspart year-inner - The calendar year inner element.\n * @csspart selected - The calendar selected state for element(s). Applies to date, month and year elements.\n * @csspart current - The calendar current state for element(s). Applies to date, month and year elements.\n */\n@blazorAdditionalDependencies(\n  'IgcCalendarComponent, IgcDateTimeInputComponent, IgcDialogComponent, IgcIconComponent'\n)\n@shadowOptions({ delegatesFocus: true })\nexport default class IgcDatePickerComponent extends EventEmitterMixin<\n  IgcDatePickerComponentEventMap,\n  AbstractConstructor<IgcDatePickerBaseComponent<Date>>\n>(IgcDatePickerBaseComponent) {\n  public static readonly tagName = 'igc-date-picker';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcDatePickerComponent,\n      IgcDateTimeInputComponent,\n      ...pickerDependencies\n    );\n  }\n\n  //#region Private properties and state\n\n  protected override get __validators() {\n    return datePickerValidators;\n  }\n\n  protected override readonly _inputId = nextId();\n  protected override readonly _themes = addThemingController(this, all);\n  protected override readonly _slots = addSlotController(this, {\n    slots: Slots,\n  });\n\n  /**\n   * For now we use the core validation strings internally only, to avoid mixing with old resources by users.\n   * To Do: Update resourceStrings type when the IgcCalendarResourceStrings is changed to ICalendarResourceStrings\n   */\n  protected override readonly _i18nController = addI18nController<\n    IgcCalendarResourceStrings | DatePickerResourceStringsType\n  >(this, {\n    defaultEN: Object.assign(\n      {},\n      DatePickerResourceStringsEN,\n      CalendarResourceStringsEN\n    ),\n    resourceMap: datePickerResourcesMap,\n  });\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: null,\n    transformers: FormValueDateTimeTransformers,\n  });\n\n  @query(IgcDateTimeInputComponent.tagName)\n  private readonly _input!: IgcDateTimeInputComponent;\n\n  //#endregion\n\n  //#region Base class hooks\n\n  protected override get _value(): Date | null {\n    return this.value;\n  }\n\n  protected override set _value(value: Date | null) {\n    this.value = value;\n  }\n\n  protected override get _hasValue(): boolean {\n    return this.value !== null;\n  }\n\n  protected override get _calendarSelection(): CalendarSelection {\n    return 'single';\n  }\n\n  protected override get _calendarValue(): Date | null {\n    return this.value;\n  }\n\n  protected override get _selectDateLabel(): string | undefined {\n    return this.resourceStrings.calendar_select_date;\n  }\n\n  protected override get _calendarIconTitle(): string | undefined {\n    return this.value\n      ? this.resourceStrings.date_picker_change_date\n      : this.resourceStrings.date_picker_choose_date;\n  }\n\n  protected override get _dialogLabel(): string | undefined {\n    return this._calendarIconTitle;\n  }\n\n  protected override get _defaultDisplayFormat(): string | undefined {\n    return this._input?.displayFormat;\n  }\n\n  protected override get _defaultInputFormat(): string | undefined {\n    return this._input?.inputFormat;\n  }\n\n  protected override get _projectionTarget() {\n    return this._input ?? null;\n  }\n\n  protected override _focusInput(): void {\n    this._input.focus();\n  }\n\n  protected override _focusAndSelectInput(): void {\n    this._input.focus();\n    this._input.select();\n  }\n\n  protected override _syncCalendarOnToggle(): void {\n    this._setCalendarActiveDate(this.value);\n  }\n\n  protected override _clearEditors(): void {\n    this._input?.clear();\n  }\n\n  protected override _valueFromCalendarSelection(dates: Date[]): Date | null {\n    return firstOf(dates) ?? null;\n  }\n\n  /**\n   * A committed edit in the input already emits `igcChange` on its own, so only a\n   * value which the picker itself has changed is left to notify about here.\n   */\n  protected override _onBlur(): void {\n    if (this._isEditorReadOnly) {\n      this._emitChangeIfDirty();\n    }\n  }\n\n  protected override _onDialogClosing(): void {\n    this._oldValue = this.value;\n  }\n\n  //#endregion\n\n  //#region Public properties and attributes\n\n  /* @tsTwoWayProperty(true, \"igcChange\", \"detail\", false) */\n  /**\n   * The value of the picker.\n   *\n   * Only ever holds a committed value. While the user is typing in the input, the\n   * intermediate state stays in the editor and is committed - together with an\n   * `igcChange` event - when the edit is committed on blur. Use the `igcInput` event\n   * to observe the value as it is being typed.\n   *\n   * @attr\n   */\n  @property({ converter: convertToDate })\n  public set value(value: Date | string | null | undefined) {\n    this._formValue.setValueAndFormState(value as Date | null);\n  }\n\n  public get value(): Date | null {\n    return this._formValue.value;\n  }\n\n  /**\n   * The placeholder text of the control.\n   * @attr\n   */\n  @property()\n  public placeholder!: string;\n\n  /**\n   * The resource strings for localization.\n   */\n  @property({ attribute: false })\n  public set resourceStrings(\n    value: IgcCalendarResourceStrings | DatePickerResourceStringsType\n  ) {\n    this._i18nController.resourceStrings = value;\n  }\n\n  public get resourceStrings(): IgcCalendarResourceStrings &\n    DatePickerResourceStringsType {\n    return this._i18nController.resourceStrings;\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  protected _handleInputChangeEvent(event: CustomEvent<Date>): void {\n    event.stopPropagation();\n\n    this._commitValue(\n      (event.target as IgcDateTimeInputComponent).value,\n      'igcChange'\n    );\n  }\n\n  protected _handleInputEvent(event: CustomEvent<Date>): void {\n    event.stopPropagation();\n\n    this._setTouchedState();\n\n    if (this.nonEditable) {\n      event.preventDefault();\n      return;\n    }\n\n    const draft = (event.target as IgcDateTimeInputComponent)._uncommittedValue;\n\n    this._calendar.activeDate = draft ?? this._calendar.activeDate;\n    this.emitEvent('igcInput', { detail: draft });\n  }\n\n  //#endregion\n\n  //#region Form associated overrides\n\n  protected override formResetCallback(): void {\n    super.formResetCallback();\n\n    // The shadow boundary keeps the inner editor out of the outer form, so the\n    // browser never resets it. It runs its own constraint validation against the\n    // forwarded `required`, `min` and `max`, so a touched editor would keep its\n    // invalid styles after a form reset.\n    this._input?.['formResetCallback']();\n  }\n\n  //#endregion\n\n  //#region Public methods\n\n  /** Increments the passed in date part */\n  public stepUp(datePart?: DatePart, delta?: number): void {\n    this._input.stepUp(datePart, delta);\n  }\n\n  /** Decrements the passed in date part */\n  public stepDown(datePart?: DatePart, delta?: number): void {\n    this._input.stepDown(datePart, delta);\n  }\n\n  /** Selects the text in the input of the component */\n  public select(): void {\n    this._input.select();\n  }\n\n  /* blazorSuppress */\n  /** Sets the text selection range in the input of the component */\n  public setSelectionRange(\n    start: number,\n    end: number,\n    direction?: SelectionRangeDirection\n  ): void {\n    this._input.setSelectionRange(start, end, direction);\n  }\n\n  /* blazorSuppress */\n  /* Replaces the selected text in the input and re-applies the mask */\n  public setRangeText(\n    replacement: string,\n    start: number,\n    end: number,\n    mode?: RangeTextSelectMode\n  ): void {\n    this._input.setRangeText(replacement, start, end, mode);\n    this.value = this._input.value;\n  }\n\n  //#endregion\n\n  //#region Render methods\n\n  private _renderLabel(id: string) {\n    const isDisabled = this._isDropDown || this.readOnly;\n\n    return this.label\n      ? html`\n          <label\n            part=\"label\"\n            for=${id}\n            @click=${bindIf(!isDisabled, this._handleAnchorClick)}\n          >\n            ${this.label}\n          </label>\n        `\n      : nothing;\n  }\n\n  protected _renderInput(id: string) {\n    const format = getDateTimeFormat(this._displayFormat);\n    const hasClickHandler = !(this._isDropDown || this.readOnly);\n\n    return html`\n      <igc-date-time-input\n        id=${id}\n        label=${bindIf(this._isMaterial, this.label)}\n        input-format=${ifDefined(this._inputFormat)}\n        display-format=${ifDefined(format)}\n        ?disabled=${this.disabled}\n        ?readonly=${this._isEditorReadOnly}\n        ?required=${this.required}\n        .value=${this.value}\n        .locale=${this.locale}\n        .prompt=${this.prompt}\n        .outlined=${this.outlined}\n        .placeholder=${this.placeholder}\n        .min=${this.min}\n        .max=${this.max}\n        .invalid=${this.invalid}\n        @igcChange=${this._handleInputChangeEvent}\n        @igcInput=${this._handleInputEvent}\n        @keydown=${this._handleEnterKeydown}\n        @click=${bindIf(hasClickHandler, this._handleInputClick)}\n        exportparts=\"container, input, label, prefix, suffix\"\n      >\n        ${this._renderEditorSlots()}\n      </igc-date-time-input>\n    `;\n  }\n\n  protected override render(): TemplateResult {\n    const id = this.id || this._inputId;\n\n    return html`\n      ${this._isMaterial ? nothing : this._renderLabel(id)}\n      ${this._renderInput(id)} ${this._renderPicker(id)}\n      ${IgcValidationContainerComponent.create(this)}\n    `;\n  }\n\n  //#endregion\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-date-picker': IgcDatePickerComponent;\n  }\n}\n"]}

package/components/date-range-picker/date-range-input.d.ts

@@ -51,8 +51,6 @@ export default class IgcDateRangeInputComponent extends IgcDateRangeInputCompone
     stepUp(datePart?: DateRangePart, delta?: number): void;
     /** Decrements a date/time portion. */
     stepDown(datePart?: DateRangePart, delta?: number): void;
-    hasDateParts(): boolean;
-    hasTimeParts(): boolean;
 }
 declare global {
     interface HTMLElementTagNameMap {