// #region Imports
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { HTMLElementEventEmitter } from '@breadstone/mosaik-elements';
import { Emit } from '../../../../events/Decorators/EmitDecorator';
import { getDateOnly } from '../../../../Extensions/DateExtensions';
import { IntlController } from '../../../../Intl/IntlController';
import { Appearanceable } from '../../../Behaviors/Appearanceable';
import { Disableable } from '../../../Behaviors/Disableable';
import { Fitable } from '../../../Behaviors/Fitable';
import { Invalidable } from '../../../Behaviors/Invalidable';
import { Localeable } from '../../../Behaviors/Localeable';
import { Orientable } from '../../../Behaviors/Orientable';
import { Slottable } from '../../../Behaviors/Slottable';
import { Themeable } from '../../../Behaviors/Themeable';
import { Valueable } from '../../../Behaviors/Valueable';
import { Variantable } from '../../../Behaviors/Variantable';
import { Attribute } from '../../../Decorators/AttributeDecorator';
import { Component } from '../../../Decorators/ComponentDecorator';
import { Property } from '../../../Decorators/PropertyDecorator';
import { Watch } from '../../../Decorators/WatchDecorator';
import { CalendarView } from '../../../Types/CalendarView';
import { DayOfWeek } from '../../../Types/DayOfWeek';
import { RangeSelectionMode } from '../../../Types/RangeSelectionMode';
import { SelectionMode } from '../../../Types/SelectionMode';
import { CustomElement } from '../../Abstracts/CustomElement';
import { ButtonElement } from '../../Buttons/Button/ButtonElement';
import { ButtonGroupElement } from '../../Buttons/Button/ButtonGroupElement';
import { StackElement } from '../../Layouts/Stack/StackElement';
import { TextElement } from '../../Primitives/Text/TextElement';
import { calendarElementTemplate } from './CalendarElementTemplate';
import { CalendarHeaderElement } from './CalendarHeaderElement';
import { CalendarItemElement } from './CalendarItemElement';
import { CalendarSubHeaderElement } from './CalendarSubHeaderElement';
import { CalendarElementIntl } from './Intl/CalendarElementIntl';
import { calendarElementCosmopolitanStyle } from './Themes/CalendarElement.Cosmopolitan';
import { calendarElementJoyStyle } from './Themes/CalendarElement.Joy';
import { calendarElementMemphisStyle } from './Themes/CalendarElement.Memphis';
import { CalendarDaysViewElement } from './Views/CalendarDaysViewElement';
import { CalendarMonthsViewElement } from './Views/CalendarMonthsViewElement';
import { CalendarYearsViewElement } from './Views/CalendarYearsViewElement';
// #endregion
/**
 * Calendar - A user interface component for displaying dates and events in a chronological order.
 *
 * @description
 * The Calendar component provides a visual representation of dates and events in a structured grid layout,
 * typically organized by months and days. It allows users to view and interact with events, appointments,
 * and other time-based information. Calendar components often support features like navigation between months,
 * week or day views, event creation, and event details.
 *
 * @name Calendar
 * @element mosaik-calendar
 * @category User Interface
 *
 * @slot footer - The footer slot.
 * @slot header - The header slot.
 *
 * @csspart content - The content part.
 * @csspart daysView - The daysView part.
 * @csspart footer - The footer part.
 * @csspart header - The header part.
 * @csspart monthView - The month view part.
 * @csspart navigation - The navigation part.
 * @csspart next - The navigation next button part.
 * @csspart previous - The navigation previous button part.
 * @csspart sheet - Individual calendar sheet.
 * @csspart sheets - The container for multiple calendar sheets.
 * @csspart today - The navigation today button part.
 * @csspart yearsView - The years view part.
 *
 * @cssprop {String} --calendar-background-color - The background color CSS custom property.
 * @cssprop {String} --calendar-border-color - The border color CSS custom property.
 * @cssprop {String} --calendar-border-radius - The border radius CSS custom property.
 * @cssprop {String} --calendar-border-style - The border style CSS custom property.
 * @cssprop {String} --calendar-border-width - The border width CSS custom property.
 * @cssprop {String} --calendar-divider-height - The divider height CSS custom property.
 * @cssprop {String} --calendar-font-family - The font family CSS custom property.
 * @cssprop {String} --calendar-font-letter-spacing - The font letter spacing CSS custom property.
 * @cssprop {String} --calendar-font-line-height - The font line height CSS custom property.
 * @cssprop {String} --calendar-font-size - The font size CSS custom property.
 * @cssprop {String} --calendar-font-text-decoration - The font text decoration CSS custom property.
 * @cssprop {String} --calendar-font-text-transform - The font text transform CSS custom property.
 * @cssprop {String} --calendar-font-weight - The font weight CSS custom property.
 * @cssprop {String} --calendar-foreground-color - The foreground color CSS custom property.
 * @cssprop {String} --calendar-gap - The gap CSS custom property.
 * @cssprop {String} --calendar-padding-bottom - The padding bottom CSS custom property.
 * @cssprop {String} --calendar-padding-left - The padding left CSS custom property.
 * @cssprop {String} --calendar-padding-right - The padding right CSS custom property.
 * @cssprop {String} --calendar-padding-top - The padding top CSS custom property.
 * @cssprop {String} --calendar-shadow - The shadow CSS custom property.
 * @cssprop {String} --calendar-shadow-blur - The shadow blur CSS custom property.
 * @cssprop {String} --calendar-shadow-color - The shadow color CSS custom property.
 * @cssprop {String} --calendar-shadow-offset-x - The shadow offset x CSS custom property.
 * @cssprop {String} --calendar-shadow-offset-y - The shadow offset y CSS custom property.
 * @cssprop {String} --calendar-shadow-spread - The shadow spread CSS custom property.
 * @cssprop {String} --calendar-transition-duration - The transition duration CSS custom property.
 * @cssprop {String} --calendar-transition-mode - The transition mode CSS custom property.
 * @cssprop {String} --calendar-transition-property - The transition property CSS custom property.
 * @cssprop {String} --calendar-translate - The translate CSS custom property.
 *
 * @fires dateChanged {DateChangedEvent} - Fired when the date has changed.
 *
 * @dependency mosaik-button - The Button element.
 * @dependency mosaik-button-group - The Button Group element.
 * @dependency mosaik-calendar-days-view - The Calendar Days View element.
 * @dependency mosaik-calendar-months-view - The Calendar Months View element.
 * @dependency mosaik-calendar-years-view - The Calendar Years View element.
 * @dependency mosaik-stack - The Stack element.
 *
 * @example
 * Basic calendar:
 * ```html
 * <mosaik-calendar></mosaik-calendar>
 * ```
 *
 * @example
 * Calendar with variant and appearance:
 * ```html
 * <mosaik-calendar variant="primary" appearance="outline"></mosaik-calendar>
 * ```
 *
 * @example
 * Horizontal multi-sheet calendar:
 * ```html
 * <mosaik-calendar orientation="horizontal"></mosaik-calendar>
 * ```
 *
 * @public
 */
let CalendarElement = class CalendarElement extends Themeable(Localeable(Appearanceable(Disableable(Invalidable(Valueable(Orientable(Variantable(Fitable(Slottable(CustomElement)))))))))) {
    // #region Fields
    _dateChanged;
    _intl;
    _displayDate;
    _displayDateStart;
    _displayDateEnd;
    _value;
    _values;
    _view;
    _selectionMode;
    _blackoutDates;
    _specialDates;
    _minDate;
    _maxDate;
    _firstDayOfWeek;
    _isTodayHighlighted;
    _isWeekendHighlighted;
    _showWeekNumbers;
    _markerHandler;
    _showAdjacent;
    _sheets;
    _allowedViews;
    _showNavigation;
    // #endregion
    // #region Ctor
    /**
     * @public
     */
    constructor() {
        super();
        this._intl = new IntlController(this, {
            factory: () => new CalendarElementIntl(this.locale)
        });
        this._displayDate = null;
        this._displayDateStart = null;
        this._displayDateEnd = null;
        this._value = null;
        this._values = new Array();
        this._view = CalendarView.Day;
        this._selectionMode = RangeSelectionMode.Single;
        this._blackoutDates = new Array();
        this._specialDates = new Array();
        this._minDate = null;
        this._maxDate = null;
        this._firstDayOfWeek = DayOfWeek.Sunday;
        this._isTodayHighlighted = false;
        this._isWeekendHighlighted = false;
        this._showWeekNumbers = false;
        this._markerHandler = (_item) => [];
        this._showAdjacent = false;
        this._sheets = 1;
        this._allowedViews = [CalendarView.Day, CalendarView.Month, CalendarView.Year];
        this._showNavigation = true;
        this._dateChanged = new HTMLElementEventEmitter(this, 'dateChanged');
    }
    // #endregion
    // #region Properties
    /**
     * Returns the `is` property.
     * The `is` property represents natural name of this element.
     *
     * @public
     * @static
     * @readonly
     */
    static get is() {
        return 'mosaik-calendar';
    }
    /**
     * Returns the `displayDate` property.
     * The `displayDate` property represents the initial date to display in the calendar.
     *
     * @public
     * @attr
     */
    get displayDate() {
        return this._displayDate;
    }
    set displayDate(value) {
        if (this._displayDate !== value) {
            this._displayDate = value;
            this.requestUpdate('displayDate');
        }
    }
    /**
     * Returns the `displayDateStart` property.
     * The `displayDateStart` property represents the start date to display in the calendar.
     *
     * @public
     * @attr
     */
    get displayDateStart() {
        return this._displayDateStart;
    }
    set displayDateStart(value) {
        if (this._displayDateStart !== value) {
            this._displayDateStart = value;
            this.requestUpdate('displayDateStart');
        }
    }
    /**
     * Returns the `displayDateEnd` property.
     * The `displayDateEnd` property represents the end date to display in the calendar.
     *
     * @public
     * @attr
     */
    get displayDateEnd() {
        return this._displayDateEnd;
    }
    set displayDateEnd(value) {
        if (this._displayDateEnd !== value) {
            this._displayDateEnd = value;
            this.requestUpdate('displayDateEnd');
        }
    }
    /**
     * Gets or sets the `value` property.
     *
     * @public
     * @override
     * @attr
     */
    get value() {
        return this._value;
    }
    set value(value) {
        if (this._value !== value) {
            this._value = value;
            this.requestUpdate('value');
        }
    }
    /**
     * Gets or sets the `values` property.
     *
     * @public
     * @attr
     */
    get values() {
        return this._values;
    }
    set values(value) {
        if (this._values !== value) {
            this._values = value;
            this.requestUpdate('values');
        }
    }
    /**
     * Gets or sets the `view` property.
     *
     * @public
     * @attr
     */
    get view() {
        return this._view;
    }
    set view(value) {
        if (this._view !== value) {
            this._view = value;
            this.requestUpdate('view');
        }
    }
    /**
     * Gets or sets the `selectionMode` property.
     *
     * @public
     * @attr
     */
    get selectionMode() {
        return this._selectionMode;
    }
    set selectionMode(value) {
        if (this._selectionMode !== value) {
            this._selectionMode = value;
            this.requestUpdate('selectionMode');
        }
    }
    /**
     * Gets or sets the `blackoutDates` property.
     *
     * @public
     * @attr
     */
    get blackoutDates() {
        return this._blackoutDates;
    }
    set blackoutDates(value) {
        if (this._blackoutDates !== value) {
            this._blackoutDates = value;
            this.requestUpdate('blackoutDates');
        }
    }
    /**
     * Gets or sets the `specialDates` property.
     *
     * @public
     * @attr
     */
    get specialDates() {
        return this._specialDates;
    }
    set specialDates(value) {
        if (this._specialDates !== value) {
            this._specialDates = value;
            this.requestUpdate('specialDates');
        }
    }
    /**
     * Gets or sets the `minDate` property.
     *
     * @public
     * @attr
     */
    get minDate() {
        return this._minDate;
    }
    set minDate(value) {
        if (this._minDate !== value) {
            this._minDate = value;
            this.requestUpdate('minDate');
        }
    }
    /**
     * Gets or sets the `maxDate` property.
     *
     * @public
     * @attr
     */
    get maxDate() {
        return this._maxDate;
    }
    set maxDate(value) {
        if (this._maxDate !== value) {
            this._maxDate = value;
            this.requestUpdate('maxDate');
        }
    }
    /**
     * Gets or sets the `firstDayOfWeek` property.
     *
     * @public
     * @attr
     */
    get firstDayOfWeek() {
        return this._firstDayOfWeek;
    }
    set firstDayOfWeek(value) {
        if (this._firstDayOfWeek !== value) {
            this._firstDayOfWeek = value;
            this.requestUpdate('firstDayOfWeek');
        }
    }
    /**
     * Gets or sets the `isTodayHighlighted` property.
     *
     * @public
     * @attr
     */
    get isTodayHighlighted() {
        return this._isTodayHighlighted;
    }
    set isTodayHighlighted(value) {
        if (this._isTodayHighlighted !== value) {
            this._isTodayHighlighted = value;
            this.requestUpdate('isTodayHighlighted');
        }
    }
    /**
     * Gets or sets the `isWeekendHighlighted` property.
     *
     * @public
     * @attr
     */
    get isWeekendHighlighted() {
        return this._isWeekendHighlighted;
    }
    set isWeekendHighlighted(value) {
        if (this._isWeekendHighlighted !== value) {
            this._isWeekendHighlighted = value;
            this.requestUpdate('isWeekendHighlighted');
        }
    }
    /**
     * Gets or sets the `showWeekNumbers` property.
     *
     * @public
     * @attr
     */
    get showWeekNumbers() {
        return this._showWeekNumbers;
    }
    set showWeekNumbers(value) {
        if (this._showWeekNumbers !== value) {
            this._showWeekNumbers = value;
            this.requestUpdate('showWeekNumbers');
        }
    }
    /**
     * A handler that gets date and returns null or a tuple with circled marker data. See `CalendarMarkerData`.
     *
     * @public
     * @attr
     */
    get markerHandler() {
        return this._markerHandler;
    }
    set markerHandler(value) {
        if (this._markerHandler !== value) {
            this._markerHandler = value;
            this.requestUpdate('markerHandler');
        }
    }
    /**
     * Gets or sets the `showAdjacent` property.
     *
     * @public
     * @attr
     */
    get showAdjacent() {
        return this._showAdjacent;
    }
    set showAdjacent(value) {
        if (this._showAdjacent !== value) {
            this._showAdjacent = value;
            this.requestUpdate('showAdjacent');
        }
    }
    /**
     * Gets or sets the `sheets` property.
     * The `sheets` property represents the number of calendar sheets to display simultaneously.
     *
     * @public
     * @attr
     */
    get sheets() {
        return this._sheets;
    }
    set sheets(value) {
        if (this._sheets !== value && value >= 1) {
            this._sheets = Math.max(1, Math.min(12, value)); // Limit between 1 and 12
            this.requestUpdate('sheets');
        }
    }
    /**
     * Gets or sets the `allowedViews` property.
     * Defines which views the user is allowed to navigate to.
     * Accepts a single `CalendarView` value or an array of values.
     *
     * @public
     * @attr
     */
    get allowedViews() {
        return this._allowedViews;
    }
    set allowedViews(value) {
        if (this._allowedViews !== value) {
            this._allowedViews = value;
            this.requestUpdate('allowedViews');
        }
    }
    /**
     * Gets or sets the `showNavigation` property.
     * Controls whether the navigation buttons (previous, today, next) are displayed.
     *
     * @public
     * @attr
     */
    get showNavigation() {
        return this._showNavigation;
    }
    set showNavigation(value) {
        if (this._showNavigation !== value) {
            this._showNavigation = value;
            this.requestUpdate('showNavigation');
        }
    }
    /**
     * Gets or sets the `intl` property.
     *
     * @public
     */
    get intl() {
        return this._intl.intl;
    }
    set intl(value) {
        this._intl.provide(value);
    }
    /**
     * Called when the date is changed.
     * Provides reference to `IEventDetail` as event detail.
     *
     * @public
     * @readonly
     * @eventProperty
     */
    get dateChanged() {
        return this._dateChanged;
    }
    // #endregion
    // #region Methods
    /**
     * Resets the value, all kinds of validation and errors.
     *
     * @public
     */
    reset() {
        this.value = null;
        this.invalid = false;
    }
    /**
     * Checks the validity of the element and returns `true` if it is valid; otherwise, `false`.
     *
     * @public
     * @override
     */
    checkValidity() {
        // TODO: Implement validation
        // Is required is necessary?
        // Or check if the value in null?
        return true;
    }
    /**
     * @public
     */
    navigatePrevious() {
        if (this.displayDate) {
            const clone = new Date(this.displayDate);
            let stepSize = 1;
            // When using multiple sheets, navigate by the number of sheets for more intuitive navigation
            if (this.sheets > 1) {
                stepSize = this.sheets;
            }
            if (this.view === CalendarView.Year) {
                const previous = clone.getFullYear() - (13 * stepSize);
                clone.setFullYear(previous);
            }
            else if (this.view === CalendarView.Month) {
                const previous = clone.getFullYear() - stepSize;
                clone.setFullYear(previous);
            }
            else {
                const previous = clone.getMonth() - stepSize;
                clone.setMonth(previous);
            }
            this.displayDate = clone;
        }
    }
    /**
     * @public
     */
    navigateNext() {
        if (this.displayDate) {
            const clone = new Date(this.displayDate);
            let stepSize = 1;
            // When using multiple sheets, navigate by the number of sheets for more intuitive navigation
            if (this.sheets > 1) {
                stepSize = this.sheets;
            }
            if (this.view === CalendarView.Year) {
                const next = clone.getFullYear() + (13 * stepSize);
                clone.setFullYear(next);
            }
            else if (this.view === CalendarView.Month) {
                const next = clone.getFullYear() + stepSize;
                clone.setFullYear(next);
            }
            else {
                const next = clone.getMonth() + stepSize;
                clone.setMonth(next);
            }
            this.displayDate = clone;
        }
    }
    /**
     * @public
     */
    navigateToday() {
        this.view = CalendarView.Day;
        this.displayDate = getDateOnly(new Date());
    }
    /**
     * @protected
     */
    onLocalePropertyChanged(prev, next) {
        this._intl.setLocale(next);
    }
    onValuePropertyChanged(prev, next) {
        if (next) {
            // Check if value in values
            if (this.values.length > 0 && !this.values.some((v) => v.getTime() === next.getTime())) {
                this.values.push(next);
            }
        }
    }
    /**
     * @protected
     * @template
     */
    onValueChanged(detail) {
        // Switch (detail.view) {
        //     Case 'years':
        //         This.view = CalendarView.Month;
        //         Break;
        //     Case 'months':
        //         This.view = CalendarView.Day;
        //         Break;
        //     Case 'days':
        //         Break;
        // }
        this.value = detail.value?.date ?? null;
        this.values = detail.values?.map((x) => x.date) ?? [];
        this.onDateChanged(detail);
    }
    /**
     * @protected
     * @template
     */
    onViewChanged(detail) {
        if (!(Array.isArray(this.allowedViews) ? this.allowedViews : [this.allowedViews]).includes(detail.view)) {
            return;
        }
        this.view = detail.view;
    }
    /**
     * Emits the `dateChanged` event.
     *
     * @protected
     */
    onDateChanged(args) {
        this._dateChanged.emit(args);
    }
};
__decorate([
    Attribute({
        type: Date,
        converter: {
            fromAttribute: (value) => value ? new Date(value) : new Date(),
            toAttribute: (value) => value ? value.toISOString() : ''
        }
    }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [Object])
], CalendarElement.prototype, "displayDate", null);
__decorate([
    Attribute({
        type: Date,
        converter: {
            fromAttribute: (value) => value ? new Date(value) : new Date(),
            toAttribute: (value) => value ? value.toISOString() : ''
        }
    }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [Object])
], CalendarElement.prototype, "displayDateStart", null);
__decorate([
    Attribute({
        type: Date,
        converter: {
            fromAttribute: (value) => value ? new Date(value) : new Date(),
            toAttribute: (value) => value ? value.toISOString() : ''
        }
    }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [Object])
], CalendarElement.prototype, "displayDateEnd", null);
__decorate([
    Attribute({
        type: Date,
        converter: {
            fromAttribute: (value) => value ? new Date(value) : undefined,
            toAttribute: (value) => value?.toISOString()
        }
    }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [Object])
], CalendarElement.prototype, "value", null);
__decorate([
    Attribute({
        type: (Array),
        converter: {
            fromAttribute: (value) => !value
                ? undefined
                : value
                    .split(' ')
                    .map((v) => v.trim())
                    .filter((v) => v)
                    .map((v) => new Date(v)),
            toAttribute: (value) => value.map((v) => v.toISOString()).join(' ')
        }
    }),
    __metadata("design:type", Array),
    __metadata("design:paramtypes", [Array])
], CalendarElement.prototype, "values", null);
__decorate([
    Attribute({ type: CalendarView }),
    __metadata("design:type", String),
    __metadata("design:paramtypes", [String])
], CalendarElement.prototype, "view", null);
__decorate([
    Attribute({ type: SelectionMode }),
    __metadata("design:type", String),
    __metadata("design:paramtypes", [String])
], CalendarElement.prototype, "selectionMode", null);
__decorate([
    Attribute({ type: (Array) }),
    __metadata("design:type", Array),
    __metadata("design:paramtypes", [Array])
], CalendarElement.prototype, "blackoutDates", null);
__decorate([
    Attribute({ type: (Array) }),
    __metadata("design:type", Array),
    __metadata("design:paramtypes", [Array])
], CalendarElement.prototype, "specialDates", null);
__decorate([
    Attribute({
        type: Date,
        converter: {
            fromAttribute: (value) => value ? new Date(value) : new Date(),
            toAttribute: (value) => value ? value.toISOString() : ''
        }
    }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [Object])
], CalendarElement.prototype, "minDate", null);
__decorate([
    Attribute({
        type: Date,
        converter: {
            fromAttribute: (value) => value ? new Date(value) : new Date(),
            toAttribute: (value) => value ? value.toISOString() : ''
        }
    }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [Object])
], CalendarElement.prototype, "maxDate", null);
__decorate([
    Attribute({ type: DayOfWeek }),
    __metadata("design:type", Number),
    __metadata("design:paramtypes", [Number])
], CalendarElement.prototype, "firstDayOfWeek", null);
__decorate([
    Attribute({
        type: Boolean,
        useDefault: true
    }),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [Boolean])
], CalendarElement.prototype, "isTodayHighlighted", null);
__decorate([
    Attribute({
        type: Boolean,
        useDefault: true
    }),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [Boolean])
], CalendarElement.prototype, "isWeekendHighlighted", null);
__decorate([
    Attribute({
        type: Boolean,
        useDefault: true
    }),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [Boolean])
], CalendarElement.prototype, "showWeekNumbers", null);
__decorate([
    Property({ type: Function }),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [Function])
], CalendarElement.prototype, "markerHandler", null);
__decorate([
    Attribute({
        type: Boolean,
        useDefault: true
    }),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [Boolean])
], CalendarElement.prototype, "showAdjacent", null);
__decorate([
    Attribute({
        type: Number,
        useDefault: true
    }),
    __metadata("design:type", Number),
    __metadata("design:paramtypes", [Number])
], CalendarElement.prototype, "sheets", null);
__decorate([
    Property({ type: Array }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [Object])
], CalendarElement.prototype, "allowedViews", null);
__decorate([
    Attribute({
        type: Boolean,
        useDefault: true
    }),
    __metadata("design:type", Boolean),
    __metadata("design:paramtypes", [Boolean])
], CalendarElement.prototype, "showNavigation", null);
__decorate([
    Property({ type: Object }),
    __metadata("design:type", CalendarElementIntl),
    __metadata("design:paramtypes", [CalendarElementIntl])
], CalendarElement.prototype, "intl", null);
__decorate([
    Emit({ eventName: 'dateChanged' }),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [])
], CalendarElement.prototype, "dateChanged", null);
__decorate([
    Watch('locale'),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [String, String]),
    __metadata("design:returntype", void 0)
], CalendarElement.prototype, "onLocalePropertyChanged", null);
__decorate([
    Watch('value'),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [Date, Date]),
    __metadata("design:returntype", void 0)
], CalendarElement.prototype, "onValuePropertyChanged", null);
CalendarElement = __decorate([
    Component({
        selector: 'mosaik-calendar',
        template: calendarElementTemplate,
        themes: {
            joy: calendarElementJoyStyle,
            memphis: calendarElementMemphisStyle,
            cosmopolitan: calendarElementCosmopolitanStyle
        },
        imports: [
            CalendarHeaderElement,
            CalendarSubHeaderElement,
            CalendarItemElement,
            CalendarYearsViewElement,
            CalendarMonthsViewElement,
            CalendarDaysViewElement,
            ButtonElement,
            ButtonGroupElement,
            StackElement,
            TextElement
        ]
    }),
    __metadata("design:paramtypes", [])
], CalendarElement);
export { CalendarElement };
//# sourceMappingURL=CalendarElement.js.map