igniteui-webcomponents 6.4.0 → 6.5.1

package/CHANGELOG.md

@@ -4,6 +4,81 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
+## [6.5.1] - 2026-02-04
+### Fixed
+- #### Calendar
+  - aria-hidden state for weeks outside of the current month [#2079](https://github.com/IgniteUI/igniteui-webcomponents/pull/2079)
+- #### Date picker
+  - CSS border for slotted actions in dialog mode [#2078](https://github.com/IgniteUI/igniteui-webcomponents/pull/2078)
+- #### Input
+  - Placeholder color on focus [#2068](https://github.com/IgniteUI/igniteui-webcomponents/pull/2068)
+  - CSS border when suffix slot content is present [#2073](https://github.com/IgniteUI/igniteui-webcomponents/pull/2073)
+- #### Textarea
+  - Algin bottom padding to the design system [#2069](https://github.com/IgniteUI/igniteui-webcomponents/pull/2069)
+- #### Validation
+  - Slotted validation text follows the current theme [#2063](https://github.com/IgniteUI/igniteui-webcomponents/pull/2063)
+
+## [6.5.0] - 2026-01-20
+### Added
+- Added theming scoping container [#2056](https://github.com/IgniteUI/igniteui-webcomponents/pull/2056)
+  - The `igc-theme-provider` component allows you to scope themes to specific parts of your page using Lit's context API. This enables having multiple different themes on the same page.
+  - Works both in Shadow and Light DOM.
+  - **Shadow DOM Usage**: When building custom web components with Shadow DOM, you can apply scoped themes by importing the theme CSS and wrapping your content with `igc-theme-provider`:
+    ```typescript
+    import { LitElement, html } from 'lit';
+    import { styles as materialDark } from 'igniteui-webcomponents/themes/dark/material.css.js';
+
+    class MyComponent extends LitElement {
+      static styles = [materialDark];
+
+      render() {
+        return html`
+          <style>
+            /* Additional component-specific styles */
+          </style>
+          <igc-theme-provider theme="material" variant="dark">
+            <igc-button>Scoped Material Dark Button</igc-button>
+            <igc-input label="Scoped Input"></igc-input>
+          </igc-theme-provider>
+        `;
+      }
+    }
+    ```
+  - **Light DOM with @scope**: For Light DOM usage, you can leverage CSS `@scope` to apply themes to specific page sections:
+    ```html
+    <style>
+      @scope (#fluent-section) {
+        @import 'node_modules/igniteui-webcomponents/themes/light/fluent.css';
+      }
+
+      @scope (#material-section) {
+        @import 'node_modules/igniteui-webcomponents/themes/dark/material.css';
+      }
+    </style>
+
+    <div id="fluent-section">
+      <igc-theme-provider theme="fluent" variant="light">
+        <igc-button>Fluent Light Button</igc-button>
+        <igc-card>
+          <igc-card-header>Fluent Theme Card</igc-card-header>
+        </igc-card>
+      </igc-theme-provider>
+    </div>
+
+    <div id="material-section">
+      <igc-theme-provider theme="material" variant="dark">
+        <igc-button>Material Dark Button</igc-button>
+        <igc-input label="Material Input"></igc-input>
+      </igc-theme-provider>
+    </div>
+    ```
+
+### Fixed
+- #### Tile manager
+  - Header is hidden only when there is no content and maximize/fullscreen are disabled [#2059](https://github.com/IgniteUI/igniteui-webcomponents/pull/2059)
+- #### Theming
+  - Resolve initial theme based on document computed styles rather than stylesheets [#2061](https://github.com/IgniteUI/igniteui-webcomponents/pull/2061)
+
 ## [6.4.0] - 2025-12-15
 ### Added
 - #### Localization
@@ -1140,6 +1215,8 @@ Initial release of Ignite UI Web Components
 - Ripple component
 - Switch component
 
+[6.5.1]: https://github.com/IgniteUI/igniteui-webcomponents/compare/6.5.0...6.5.1
+[6.5.0]: https://github.com/IgniteUI/igniteui-webcomponents/compare/6.4.0...6.5.0
 [6.4.0]: https://github.com/IgniteUI/igniteui-webcomponents/compare/6.3.6...6.4.0
 [6.3.6]: https://github.com/IgniteUI/igniteui-webcomponents/compare/6.3.5...6.3.6
 [6.3.5]: https://github.com/IgniteUI/igniteui-webcomponents/compare/6.3.4...6.3.5

package/components/calendar/base.d.ts

@@ -1,4 +1,4 @@
-import { LitElement } from 'lit';
+import { LitElement, type PropertyValues } from 'lit';
 import { type IgcCalendarResourceStrings } from '../common/i18n/EN/calendar.resources.js';
 import { CalendarDay } from './model.js';
 import type { CalendarSelection, DateRangeDescriptor, WeekDays } from './types.js';
@@ -38,16 +38,19 @@ export declare class IgcCalendarBaseComponent extends LitElement {
     /**
      * Sets the type of selection in the component.
      * @attr selection
+     * @default single
      */
     selection: CalendarSelection;
     /**
      * Whether to show the week numbers.
      * @attr show-week-numbers
+     * @default false
      */
     showWeekNumbers: boolean;
     /**
      * Gets/Sets the first day of the week.
      * @attr week-start
+     * @default sunday
      */
     weekStart: WeekDays;
     /**
@@ -67,7 +70,8 @@ export declare class IgcCalendarBaseComponent extends LitElement {
     /** Gets/Sets the disabled dates for the component. */
     set disabledDates(value: DateRangeDescriptor[]);
     get disabledDates(): DateRangeDescriptor[] | undefined;
-    protected weekStartChanged(): void;
-    protected selectionChanged(): void;
+    /** @internal */
+    protected update(props: PropertyValues<this>): void;
+    /** @internal */
     protected firstUpdated(): void;
 }

package/components/calendar/base.js

@@ -8,7 +8,6 @@ import { LitElement } from 'lit';
 import { property, state } from 'lit/decorators.js';
 import { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';
 import { blazorIndirectRender } from '../common/decorators/blazorIndirectRender.js';
-import { watch } from '../common/decorators/watch.js';
 import { IgcCalendarResourceStringEN, } from '../common/i18n/EN/calendar.resources.js';
 import { addI18nController } from '../common/i18n/i18n-controller.js';
 import { first } from '../common/util.js';
@@ -91,13 +90,16 @@ let IgcCalendarBaseComponent = class IgcCalendarBaseComponent extends LitElement
     get disabledDates() {
         return this._disabledDates.length ? this._disabledDates : undefined;
     }
-    weekStartChanged() {
-        this._firstDayOfWeek = getWeekDayNumber(this.weekStart);
-    }
-    selectionChanged() {
-        this._rangePreviewDate = undefined;
-        this._value = null;
-        this._values = [];
+    update(props) {
+        if (props.has('weekStart')) {
+            this._firstDayOfWeek = getWeekDayNumber(this.weekStart);
+        }
+        if (props.has('selection') && this.hasUpdated) {
+            this._rangePreviewDate = undefined;
+            this._value = null;
+            this._values = [];
+        }
+        super.update(props);
     }
     firstUpdated() {
         if (this._initialActiveDateSet) {
@@ -162,12 +164,6 @@ __decorate([
 __decorate([
     property({ attribute: false })
 ], IgcCalendarBaseComponent.prototype, "disabledDates", null);
-__decorate([
-    watch('weekStart')
-], IgcCalendarBaseComponent.prototype, "weekStartChanged", null);
-__decorate([
-    watch('selection', { waitUntilFirstUpdate: true })
-], IgcCalendarBaseComponent.prototype, "selectionChanged", null);
 IgcCalendarBaseComponent = __decorate([
     blazorIndirectRender,
     blazorDeepImport

package/components/calendar/base.js.map

@@ -1 +1 @@
-{"version":3,"file":"base.js","sourceRoot":"","sources":["../../../src/components/calendar/base.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\n\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { blazorIndirectRender } from '../common/decorators/blazorIndirectRender.js';\nimport { watch } from '../common/decorators/watch.js';\nimport {\n  IgcCalendarResourceStringEN,\n  type IgcCalendarResourceStrings,\n} from '../common/i18n/EN/calendar.resources.js';\nimport { addI18nController } from '../common/i18n/i18n-controller.js';\nimport { first } from '../common/util.js';\nimport { convertToDate, convertToDates, getWeekDayNumber } from './helpers.js';\nimport { CalendarDay } from './model.js';\nimport type {\n  CalendarSelection,\n  DateRangeDescriptor,\n  WeekDays,\n} from './types.js';\n\n@blazorIndirectRender\n@blazorDeepImport\nexport class IgcCalendarBaseComponent extends LitElement {\n  protected readonly _i18nController =\n    addI18nController<IgcCalendarResourceStrings>(this, {\n      defaultEN: IgcCalendarResourceStringEN,\n    });\n  private _initialActiveDateSet = false;\n\n  protected get _hasValues() {\n    return this._values && this._values.length > 0;\n  }\n\n  protected get _isSingle() {\n    return this.selection === 'single';\n  }\n\n  protected get _isMultiple() {\n    return this.selection === 'multiple';\n  }\n\n  protected get _isRange() {\n    return this.selection === 'range';\n  }\n\n  @state()\n  protected _rangePreviewDate?: CalendarDay;\n\n  @state()\n  protected _firstDayOfWeek = 0;\n\n  @state()\n  protected _activeDate = CalendarDay.today;\n\n  @state()\n  protected _value: CalendarDay | null = null;\n\n  @state()\n  protected _values: CalendarDay[] = [];\n\n  @state()\n  protected _specialDates: DateRangeDescriptor[] = [];\n\n  @state()\n  protected _disabledDates: DateRangeDescriptor[] = [];\n\n  /* blazorSuppress */\n  /**\n   * The current value of the calendar.\n   * Used when selection is set to single\n   *\n   * @attr value\n   */\n  @property({ converter: convertToDate })\n  public set value(value: Date | string | null | undefined) {\n    const converted = convertToDate(value);\n    this._value = converted ? CalendarDay.from(converted) : null;\n  }\n\n  public get value(): Date | null {\n    return this._value ? this._value.native : null;\n  }\n\n  /* blazorSuppress */\n  /**\n   * The current values of the calendar.\n   * Used when selection is set to multiple of range.\n   *\n   * @attr values\n   */\n  @property({ converter: convertToDates })\n  public set values(values: (Date | string)[] | string | null | undefined) {\n    const converted = convertToDates(values);\n    this._values = converted ? converted.map((v) => CalendarDay.from(v)) : [];\n  }\n\n  public get values(): Date[] {\n    return this._values ? this._values.map((v) => v.native) : [];\n  }\n\n  /* blazorSuppress */\n  /** Get/Set the date which is shown in view and is highlighted. By default it is the current date. */\n  @property({ attribute: 'active-date', converter: convertToDate })\n  public set activeDate(value: Date | string | null | undefined) {\n    this._initialActiveDateSet = true;\n    const converted = convertToDate(value);\n    this._activeDate = converted\n      ? CalendarDay.from(converted)\n      : CalendarDay.today;\n  }\n\n  public get activeDate(): Date {\n    return this._activeDate.native;\n  }\n\n  /**\n   * Sets the type of selection in the component.\n   * @attr selection\n   */\n  @property()\n  public selection: CalendarSelection = 'single';\n\n  /**\n   * Whether to show the week numbers.\n   * @attr show-week-numbers\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'show-week-numbers' })\n  public showWeekNumbers = false;\n\n  /**\n   * Gets/Sets the first day of the week.\n   * @attr week-start\n   */\n  @property({ attribute: 'week-start' })\n  public weekStart: WeekDays = 'sunday';\n\n  /**\n   * Gets/Sets the locale used for formatting and displaying the dates in the component.\n   * @attr locale\n   */\n  @property()\n  public set locale(value: string) {\n    this._i18nController.locale = value;\n  }\n\n  public get locale() {\n    return this._i18nController.locale;\n  }\n\n  /**\n   * The resource strings for localization.\n   */\n  @property({ attribute: false })\n  public set resourceStrings(value: IgcCalendarResourceStrings) {\n    this._i18nController.resourceStrings = value;\n  }\n\n  public get resourceStrings(): IgcCalendarResourceStrings {\n    return this._i18nController.resourceStrings;\n  }\n\n  /** Gets/Sets the special dates for the component. */\n  @property({ attribute: false })\n  public set specialDates(value: DateRangeDescriptor[]) {\n    this._specialDates = value ?? [];\n  }\n\n  public get specialDates(): DateRangeDescriptor[] | undefined {\n    return this._specialDates.length ? this._specialDates : undefined;\n  }\n\n  /** Gets/Sets the disabled dates for the component. */\n  @property({ attribute: false })\n  public set disabledDates(value: DateRangeDescriptor[]) {\n    this._disabledDates = value ?? [];\n  }\n\n  public get disabledDates(): DateRangeDescriptor[] | undefined {\n    return this._disabledDates.length ? this._disabledDates : undefined;\n  }\n\n  @watch('weekStart')\n  protected weekStartChanged() {\n    this._firstDayOfWeek = getWeekDayNumber(this.weekStart);\n  }\n\n  @watch('selection', { waitUntilFirstUpdate: true })\n  protected selectionChanged() {\n    this._rangePreviewDate = undefined;\n    this._value = null;\n    this._values = [];\n  }\n\n  protected override firstUpdated() {\n    if (this._initialActiveDateSet) {\n      return;\n    }\n\n    if (this._isSingle) {\n      this.activeDate = this.value ?? this.activeDate;\n    } else {\n      this.activeDate = first(this.values) ?? this.activeDate;\n    }\n  }\n}\n"]}
+{"version":3,"file":"base.js","sourceRoot":"","sources":["../../../src/components/calendar/base.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, type PropertyValues } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { blazorIndirectRender } from '../common/decorators/blazorIndirectRender.js';\nimport {\n  IgcCalendarResourceStringEN,\n  type IgcCalendarResourceStrings,\n} from '../common/i18n/EN/calendar.resources.js';\nimport { addI18nController } from '../common/i18n/i18n-controller.js';\nimport { first } from '../common/util.js';\nimport { convertToDate, convertToDates, getWeekDayNumber } from './helpers.js';\nimport { CalendarDay } from './model.js';\nimport type {\n  CalendarSelection,\n  DateRangeDescriptor,\n  WeekDays,\n} from './types.js';\n\n@blazorIndirectRender\n@blazorDeepImport\nexport class IgcCalendarBaseComponent extends LitElement {\n  protected readonly _i18nController =\n    addI18nController<IgcCalendarResourceStrings>(this, {\n      defaultEN: IgcCalendarResourceStringEN,\n    });\n\n  private _initialActiveDateSet = false;\n\n  protected get _hasValues(): boolean {\n    return this._values && this._values.length > 0;\n  }\n\n  protected get _isSingle(): boolean {\n    return this.selection === 'single';\n  }\n\n  protected get _isMultiple(): boolean {\n    return this.selection === 'multiple';\n  }\n\n  protected get _isRange(): boolean {\n    return this.selection === 'range';\n  }\n\n  @state()\n  protected _rangePreviewDate?: CalendarDay;\n\n  @state()\n  protected _firstDayOfWeek = 0;\n\n  @state()\n  protected _activeDate = CalendarDay.today;\n\n  @state()\n  protected _value: CalendarDay | null = null;\n\n  @state()\n  protected _values: CalendarDay[] = [];\n\n  @state()\n  protected _specialDates: DateRangeDescriptor[] = [];\n\n  @state()\n  protected _disabledDates: DateRangeDescriptor[] = [];\n\n  /* blazorSuppress */\n  /**\n   * The current value of the calendar.\n   * Used when selection is set to single\n   *\n   * @attr value\n   */\n  @property({ converter: convertToDate })\n  public set value(value: Date | string | null | undefined) {\n    const converted = convertToDate(value);\n    this._value = converted ? CalendarDay.from(converted) : null;\n  }\n\n  public get value(): Date | null {\n    return this._value ? this._value.native : null;\n  }\n\n  /* blazorSuppress */\n  /**\n   * The current values of the calendar.\n   * Used when selection is set to multiple of range.\n   *\n   * @attr values\n   */\n  @property({ converter: convertToDates })\n  public set values(values: (Date | string)[] | string | null | undefined) {\n    const converted = convertToDates(values);\n    this._values = converted ? converted.map((v) => CalendarDay.from(v)) : [];\n  }\n\n  public get values(): Date[] {\n    return this._values ? this._values.map((v) => v.native) : [];\n  }\n\n  /* blazorSuppress */\n  /** Get/Set the date which is shown in view and is highlighted. By default it is the current date. */\n  @property({ attribute: 'active-date', converter: convertToDate })\n  public set activeDate(value: Date | string | null | undefined) {\n    this._initialActiveDateSet = true;\n    const converted = convertToDate(value);\n    this._activeDate = converted\n      ? CalendarDay.from(converted)\n      : CalendarDay.today;\n  }\n\n  public get activeDate(): Date {\n    return this._activeDate.native;\n  }\n\n  /**\n   * Sets the type of selection in the component.\n   * @attr selection\n   * @default single\n   */\n  @property()\n  public selection: CalendarSelection = 'single';\n\n  /**\n   * Whether to show the week numbers.\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   * Gets/Sets the first day of the week.\n   * @attr week-start\n   * @default sunday\n   */\n  @property({ attribute: 'week-start' })\n  public weekStart: WeekDays = 'sunday';\n\n  /**\n   * Gets/Sets the locale used for formatting and displaying the dates in the component.\n   * @attr locale\n   */\n  @property()\n  public set locale(value: string) {\n    this._i18nController.locale = value;\n  }\n\n  public get locale() {\n    return this._i18nController.locale;\n  }\n\n  /**\n   * The resource strings for localization.\n   */\n  @property({ attribute: false })\n  public set resourceStrings(value: IgcCalendarResourceStrings) {\n    this._i18nController.resourceStrings = value;\n  }\n\n  public get resourceStrings(): IgcCalendarResourceStrings {\n    return this._i18nController.resourceStrings;\n  }\n\n  /** Gets/Sets the special dates for the component. */\n  @property({ attribute: false })\n  public set specialDates(value: DateRangeDescriptor[]) {\n    this._specialDates = value ?? [];\n  }\n\n  public get specialDates(): DateRangeDescriptor[] | undefined {\n    return this._specialDates.length ? this._specialDates : undefined;\n  }\n\n  /** Gets/Sets the disabled dates for the component. */\n  @property({ attribute: false })\n  public set disabledDates(value: DateRangeDescriptor[]) {\n    this._disabledDates = value ?? [];\n  }\n\n  public get disabledDates(): DateRangeDescriptor[] | undefined {\n    return this._disabledDates.length ? this._disabledDates : undefined;\n  }\n\n  /** @internal */\n  protected override update(props: PropertyValues<this>): void {\n    if (props.has('weekStart')) {\n      this._firstDayOfWeek = getWeekDayNumber(this.weekStart);\n    }\n\n    if (props.has('selection') && this.hasUpdated) {\n      this._rangePreviewDate = undefined;\n      this._value = null;\n      this._values = [];\n    }\n\n    super.update(props);\n  }\n\n  /** @internal */\n  protected override firstUpdated(): void {\n    if (this._initialActiveDateSet) {\n      return;\n    }\n\n    if (this._isSingle) {\n      this.activeDate = this.value ?? this.activeDate;\n    } else {\n      this.activeDate = first(this.values) ?? this.activeDate;\n    }\n  }\n}\n"]}

package/components/calendar/calendar.d.ts

@@ -1,4 +1,4 @@
-import { nothing } from 'lit';
+import { nothing, type TemplateResult } from 'lit';
 import type { Constructor } from '../common/mixins/constructor.js';
 import type { ContentOrientation } from '../types.js';
 import { IgcCalendarBaseComponent } from './base.js';
@@ -60,19 +60,20 @@ export default class IgcCalendarComponent extends IgcCalendarComponent_base {
     static readonly tagName = "igc-calendar";
     static styles: import("lit").CSSResult;
     static register(): void;
+    private readonly _contentRef;
     private get _isDayView();
     private get _isMonthView();
     private get _isYearView();
-    private get previousButtonLabel();
-    private get nextButtonLabel();
-    private contentRef;
-    private activeDaysViewIndex;
-    private daysViews;
-    private monthsView;
-    private yearsView;
+    private get _previousButtonLabel();
+    private get _nextButtonLabel();
+    private _activeDaysViewIndex;
+    private readonly _daysViews;
+    private readonly _monthsView;
+    private readonly _yearsView;
     /**
      * Whether to show the dates that do not belong to the current active month.
      * @attr hide-outside-days
+     * @default false
      */
     hideOutsideDays: boolean;
     /**
@@ -80,71 +81,72 @@ export default class IgcCalendarComponent extends IgcCalendarComponent_base {
      * When the calendar selection is set to `multiple` the header is always hidden.
      *
      * @attr hide-header
+     * @default false
      */
     hideHeader: boolean;
     /**
      * The orientation of the calendar header.
      * @attr header-orientation
+     * @default "horizontal"
      */
     headerOrientation: CalendarHeaderOrientation;
     /**
      * The orientation of the calendar months when more than one month
      * is being shown.
      * @attr orientation
+     * @default "horizontal"
      */
     orientation: ContentOrientation;
     /**
      * The number of months displayed in the days view.
      * @attr visible-months
+     * @default 1
      */
     visibleMonths: number;
     /**
      * The current active view of the component.
      * @attr active-view
+     * @default "days"
      */
     activeView: CalendarActiveView;
     /** The options used to format the months and the weekdays in the calendar views. */
     formatOptions: Pick<Intl.DateTimeFormatOptions, 'month' | 'weekday'>;
-    private get _monthOptions();
-    private _monthLabelOptions;
-    private _weekdayOptions;
-    private _monthDayOptions;
-    private _yearLabelOptions;
+    constructor();
+    private _shouldSkipKeyboardEvent;
+    private _handleArrowKey;
+    private _handlePageKeys;
+    private _handleShiftPageKeys;
+    private _handleHomeKey;
+    private _handleEndKey;
+    private _handleMonthChange;
+    private _handleYearChange;
+    private _handleValueChange;
+    private _handleActiveDateChange;
+    private _handleRangePreviewChange;
+    private _setActiveDaysView;
+    private _navigate;
+    private _navigatePrevious;
+    private _navigateNext;
+    private _navigateToMonthView;
+    private _navigateToYearView;
     /** @private @hidden @internal */
     [focusActiveDate](options?: FocusOptions): Promise<void>;
-    private updateViewIndex;
-    private getSubsequentActiveDate;
-    private handleArrowKey;
-    private onPageKeys;
-    private onShiftPageKeys;
-    private onHomeKey;
-    private onEndKey;
-    private isNotFromCalendarView;
-    constructor();
-    protected renderNavigationButtons(): import("lit-html").TemplateResult<1>;
-    protected renderMonthButtonNavigation(active: CalendarDay, viewIndex: number): import("lit-html").TemplateResult<1>;
-    protected renderYearButtonNavigation(active: CalendarDay, viewIndex: number): import("lit-html").TemplateResult<1>;
-    protected renderYearRangeNavigation(active: CalendarDay): import("lit-html").TemplateResult<1>;
-    protected renderNavigation(date?: CalendarDay, showButtons?: boolean, viewIndex?: number): import("lit-html").TemplateResult<1>;
-    protected renderHeader(): typeof nothing | import("lit-html").TemplateResult<1>;
-    protected renderHeaderDateSingle(): import("lit-html").TemplateResult<1>;
-    protected renderHeaderDateRange(): import("lit-html").TemplateResult<1>;
-    protected renderHeaderDate(): import("lit-html").TemplateResult<1>;
-    protected renderDaysView(): import("lit-html").TemplateResult<1>;
-    protected renderMonthView(): import("lit-html").TemplateResult<1>;
-    protected renderYearView(): import("lit-html").TemplateResult<1>;
-    protected render(): import("lit-html").TemplateResult<1>;
-    protected changeMonth(event: CustomEvent<Date>): void;
-    protected changeYear(event: CustomEvent<Date>): void;
-    protected changeValue(event: CustomEvent<Date>): void;
-    protected activeDateChanged(event: CustomEvent<Date>): void;
-    protected rangePreviewDateChanged(event: CustomEvent<Date>): void;
-    private getActiveDates;
-    private activateDaysView;
-    private navigatePrevious;
-    private navigateNext;
-    private switchToMonths;
-    private switchToYears;
+    private _updateViewIndex;
+    private _getActiveDates;
+    private _getNextEnabledDate;
+    protected _renderNavigationButtons(): TemplateResult<1>;
+    protected _renderMonthButtonNavigation(active: CalendarDay, viewIndex: number): TemplateResult;
+    protected _renderYearButtonNavigation(active: CalendarDay, viewIndex: number): TemplateResult;
+    protected _renderYearRangeNavigation(active: CalendarDay): TemplateResult;
+    protected _renderNavigation(date?: CalendarDay, showButtons?: boolean, viewIndex?: number): TemplateResult;
+    protected _renderHeader(): typeof nothing | TemplateResult<1>;
+    protected _renderHeaderDateSingle(): TemplateResult;
+    protected _renderHeaderDateRange(): TemplateResult;
+    protected _renderHeaderDate(): TemplateResult;
+    protected _renderDaysView(): TemplateResult;
+    protected _renderMonthView(): TemplateResult;
+    protected _renderYearView(): TemplateResult;
+    protected render(): TemplateResult<1>;
 }
 declare global {
     interface HTMLElementTagNameMap {