@acorex/components 7.0.41 → 7.1.0

package/fesm2015/acorex-components-calendar.mjs

@@ -1,531 +0,0 @@
-import { AXConfig } from '@acorex/core/config';
-import * as i0 from '@angular/core';
-import { EventEmitter, Injectable, Output, Input, Component, ViewEncapsulation, ChangeDetectionStrategy, HostBinding, NgModule } from '@angular/core';
-import { AXRangeChangedEvent } from '@acorex/components/common';
-import { AXBaseComponent, _ClickableComponenetMixin, _InteractiveComponenetMixin, _ValueComponenetMixin } from '@acorex/components/mixin';
-import { range } from 'lodash-es';
-import { AXDateTime, AXDateTimeRange, AXDateTimeModule } from '@acorex/core/dateTime';
-import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
-
-/**
-*  Contains native event
-* @category Events
-*/
-class AXCalendarNavigateEvent extends AXRangeChangedEvent {
-}
-class AXCalendarBaseComponent extends AXBaseComponent {
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-        this.onSlotClick = new EventEmitter();
-        this.onNavigate = new EventEmitter();
-        this.activeViewChange = new EventEmitter();
-        this._activeView = 'days';
-        this.typeChange = new EventEmitter();
-        this._type = AXConfig.get(`dateTime.calendar`);
-        this.depthChange = new EventEmitter();
-        this._depth = 'days';
-        this.minChange = new EventEmitter();
-        this.maxChange = new EventEmitter();
-        this.disabledDatesChange = new EventEmitter();
-        this.holidayDatesChange = new EventEmitter();
-    }
-    get activeView() {
-        return this._activeView;
-    }
-    set activeView(v) {
-        this._setOption({ name: 'activeView', value: v });
-    }
-    get type() {
-        return this._type || AXConfig.get(`dateTime.calendar`);
-    }
-    set type(v) {
-        this._setOption({
-            name: 'type',
-            value: v
-        });
-    }
-    get depth() {
-        return this._depth;
-    }
-    set depth(v) {
-        this._setOption({
-            name: 'depth',
-            value: v,
-            beforeCallback: () => {
-                this._activeView = v;
-            }
-        });
-    }
-    get min() {
-        return this._min;
-    }
-    set min(v) {
-        this._setOption({ name: 'min', value: v });
-    }
-    get max() {
-        return this._max;
-    }
-    set max(v) {
-        this._setOption({ name: 'max', value: v });
-    }
-    get disabledDates() {
-        return this._disabledDates;
-    }
-    set disabledDates(v) {
-        this._setOption({ name: 'disabledDates', value: v });
-    }
-    get holidayDates() {
-        return this._holidayDates;
-    }
-    set holidayDates(v) {
-        this._setOption({ name: 'holidayDates', value: v });
-    }
-}
-AXCalendarBaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarBaseComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Injectable });
-AXCalendarBaseComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarBaseComponent });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarBaseComponent, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { onSlotClick: [{
-                type: Output
-            }], onNavigate: [{
-                type: Output
-            }], activeViewChange: [{
-                type: Output
-            }], activeView: [{
-                type: Input
-            }], typeChange: [{
-                type: Output
-            }], type: [{
-                type: Input
-            }], depthChange: [{
-                type: Output
-            }], depth: [{
-                type: Input
-            }], minChange: [{
-                type: Output
-            }], min: [{
-                type: Input
-            }], maxChange: [{
-                type: Output
-            }], max: [{
-                type: Input
-            }], disabledDatesChange: [{
-                type: Output
-            }], disabledDates: [{
-                type: Input
-            }], holidayDatesChange: [{
-                type: Output
-            }], holidayDates: [{
-                type: Input
-            }] } });
-const CALENDAR_INPUTS = [
-    'depth',
-    'activeView',
-    'min',
-    'max',
-    'disabledDates',
-    'type',
-    'holidayDates',
-];
-const CALENDAR_OUTPUTS = ['depthChange', 'typeChange', 'disabledDatesChange', 'holidayDatesChange', 'onNavigate'];
-
-const AXCalendarComponentMixin = _ClickableComponenetMixin(_InteractiveComponenetMixin(_ValueComponenetMixin(AXCalendarBaseComponent)));
-class AXCalendarComponent extends AXCalendarComponentMixin {
-    constructor(elementRef, cdr) {
-        super(elementRef, cdr);
-        this.cdr = cdr;
-        this.interface = 'calendar';
-        this._today = new AXDateTime(new Date(), this.type);
-        this._navText = '';
-        this._todayText = '';
-        this._slots = [];
-        this._dayNames = [];
-        this._isUserInteraction = false;
-        this._pickerDays = [];
-        this._pickerMonths = [];
-        this._pickerYears = [];
-    }
-    get _viewRange() {
-        const current = this._viewStartDate || this._today;
-        switch (this.activeView) {
-            case 'years':
-                let y = current.startOf('year').year;
-                let min = y - (y % 10) - 1;
-                let max = min + 11;
-                return new AXDateTimeRange(AXDateTime.from({
-                    year: min,
-                    month: 1,
-                    date: 1,
-                    calendar: this._viewStartDate.calendar.name(),
-                }), AXDateTime.from({
-                    year: max,
-                    month: 12,
-                    date: 28,
-                    calendar: this._viewStartDate.calendar.name(),
-                }));
-            case 'months':
-                return new AXDateTimeRange(current.startOf('year'), current.endOf('year').add('day', -1));
-            default:
-                return new AXDateTimeRange(current.startOf('month'), current.endOf('month'));
-        }
-    }
-    _initValues() {
-        this._today = new AXDateTime(new Date(), this.type);
-        this._dayNames = this._today.calendar.dayShortNames;
-    }
-    _refresh() {
-        this._initValues();
-        this.navTo(this.value || this._today);
-    }
-    onInit() {
-        this._initValues();
-        if (!this.value)
-            this.goToday();
-    }
-    _genearteSlots() {
-        if (!this._viewStartDate)
-            return;
-        const vr = this._viewRange;
-        // just for tailwind
-        //'ax-col-start-1','ax-col-start-2','ax-col-start-3','ax-col-start-4','ax-col-start-5','ax-col-start-6','ax-col-start-7'
-        // year view
-        if (this.activeView == 'years') {
-            const a = vr.enumurate('year');
-            this._slots = a.map((d, i) => {
-                const r = {};
-                r.date = d.date;
-                r.text = d.format('YYYY');
-                r.disabled =
-                    (this.min && d.compare(this.min, 'year') == -1) ||
-                        (this.max && d.compare(this.max, 'year') == 1);
-                if (r.disabled) {
-                    r.cssClass = {
-                        'ax-state-disabled': r.disabled,
-                    };
-                }
-                else {
-                    r.cssClass = {
-                        'ax-state-today': d.equal(this._today, 'year'),
-                        'ax-state-selected': this.value &&
-                            this.depth == 'years' &&
-                            d.equal(this.value, 'year'),
-                    };
-                }
-                // r.cssClass[`ax-col-start-2`] = i == 0;
-                return r;
-            });
-            this._navText = `${vr.startTime.year} - ${vr.endTime.year}`;
-            this._todayText = this._today.format('YYYY');
-        }
-        // month view
-        else if (this.activeView == 'months') {
-            const a = vr.enumurate('month');
-            this._slots = a.map((d, i) => {
-                const r = {};
-                r.date = d.date;
-                r.text = d.format('MMM');
-                r.tooltip = d.format('MMMM YYYY');
-                r.disabled =
-                    (this.min && d.compare(this.min, 'month') == -1) ||
-                        (this.max && d.compare(this.max, 'month') == 1);
-                if (r.disabled) {
-                    r.cssClass = {
-                        'ax-state-disabled': r.disabled,
-                    };
-                }
-                else {
-                    r.cssClass = {
-                        'ax-state-today': d.equal(this._today, 'month'),
-                        'ax-state-selected': this.value &&
-                            this.depth == 'months' &&
-                            d.equal(this.value, 'month'),
-                        'ax-state-other': d.year != this._viewStartDate.year,
-                    };
-                }
-                return r;
-            });
-            this._navText = this._viewStartDate.format('YYYY');
-            this._todayText = this._today.format('MMMM YYYY');
-        }
-        // day view
-        else {
-            const a = vr.enumurate('day');
-            this._slots = a.map((d, i) => {
-                const r = {};
-                r.date = d.date;
-                r.text = d.dayOfMonth;
-                r.tooltip = d.format();
-                r.disabled =
-                    (this.min && d.compare(this.min, 'day') == -1) ||
-                        (this.max && d.compare(this.max, 'day') == 1) ||
-                        this.isDisabled(d);
-                if (r.disabled) {
-                    r.cssClass = {
-                        'ax-state-disabled': true,
-                    };
-                }
-                else {
-                    r.cssClass = {
-                        'ax-state-today': d.equal(this._today, 'day'),
-                        'ax-state-selected': this.value && d.equal(this.value, 'day'),
-                        'ax-state-holiday': this.isHoliday(d) || this.isWeekend(d),
-                        // 'ax-state-event-danger': d.dayOfMonth == 12,
-                        // 'ax-state-event': d.dayOfMonth == 12,
-                    };
-                }
-                r.cssClass[`ax-col-start-${vr.startTime.dayOfWeek}`] = i == 0;
-                return r;
-            });
-            this._navText = this._viewStartDate.format('MMMM YYYY');
-            this._todayText = this._today.format();
-        }
-    }
-    _handlePrevClick() {
-        this._isUserInteraction = true;
-        this.prev();
-        this._isUserInteraction = false;
-    }
-    _handleNextClick() {
-        this._isUserInteraction = true;
-        this.next();
-        this._isUserInteraction = false;
-    }
-    _handleSlotClick(e, slot) {
-        if (slot.disabled || this.disabled)
-            return;
-        if (this.activeView == 'days') {
-            this._setDate(slot.date);
-        }
-        else if (this.activeView == 'months' && this.depth == 'days') {
-            this.activeView = 'days';
-            this.navTo(slot.date);
-        }
-        else if (this.activeView == 'months' && this.depth == 'months') {
-            this._setDate(slot.date);
-        }
-        else if (this.activeView == 'years' &&
-            (this.depth == 'days' || this.depth == 'months')) {
-            this.activeView = 'months';
-            this.navTo(slot.date);
-        }
-        else if (this.activeView == 'years' && this.depth == 'years') {
-            this._setDate(slot.date);
-        }
-        this.onSlotClick.emit({
-            component: this,
-            item: slot.date,
-            isUserInteraction: true,
-            nativeEvent: e,
-        });
-    }
-    _handleNavClick(e) {
-        this._isUserInteraction = true;
-        if (this.activeView == 'days')
-            this.activeView = 'months';
-        else if (this.activeView == 'months')
-            this.activeView = 'years';
-        this._isUserInteraction = false;
-    }
-    _onOptionChanged(option) {
-        if (option.name == 'depth' ||
-            option.name == 'activeView' ||
-            option.name == 'disabledDates' ||
-            option.name == 'holidayDates') {
-            this._genearteSlots();
-        }
-        if (option.name == 'type') {
-            this._refresh();
-        }
-    }
-    _onValueChanged(oldValue, newValue) {
-        this._viewStartDate = new AXDateTime(newValue, this.type);
-        this._genearteSlots();
-    }
-    _handleGoToday() {
-        this._isUserInteraction = true;
-        this._setDate(this._today.date);
-        this.goToday();
-        this._isUserInteraction = false;
-    }
-    next() {
-        this._navNextPrev(false);
-    }
-    prev() {
-        this._navNextPrev(true);
-    }
-    focus() {
-        const func = (s) => this._getHostElement().querySelector(s);
-        const div = func('.ax-calendar-slots>div.ax-state-selected') ||
-            func('.ax-calendar-slots>div');
-        div === null || div === void 0 ? void 0 : div.focus();
-    }
-    _navNextPrev(prev) {
-        const sign = prev ? -1 : 1;
-        if (this.activeView == 'days')
-            this.navTo(this._viewStartDate.add('month', sign * 1));
-        else if (this.activeView == 'months')
-            this.navTo(this._viewStartDate.add('year', sign * 1));
-        else
-            this.navTo(this._viewStartDate.add('year', sign * 10));
-    }
-    goToday() {
-        this.navTo(this._today);
-    }
-    navTo(date) {
-        var _a, _b;
-        this._viewStartDate = AXDateTime.convert(date, this._today.calendar.name()).startOf();
-        const vr = this._viewRange;
-        this.onNavigate.emit({
-            component: this,
-            isUserInteraction: this._isUserInteraction,
-            start: (_a = vr.startTime) === null || _a === void 0 ? void 0 : _a.date,
-            end: (_b = vr.endTime) === null || _b === void 0 ? void 0 : _b.date,
-            htmlElement: this._getHostElement(),
-        });
-        if (this.interface == 'calendar')
-            this._genearteSlots();
-        else {
-            this._generatePickerItems('year');
-            this._generatePickerItems('month');
-        }
-        setTimeout(() => {
-            this.focus();
-        }, 50);
-    }
-    get __hostClass() {
-        const _classes = {
-            'ax-state-disabled': this.disabled,
-        };
-        return Object.entries(_classes)
-            .filter(c => c[1])
-            .map(c => c[0])
-            .join(' ');
-    }
-    _setDate(value) {
-        this.value = AXDateTime.convert(value, this._today.calendar.name()).startOf().date;
-    }
-    isDisabled(date) {
-        if (Array.isArray(this.disabledDates) && this.disabledDates.length != 0) {
-            return this.disabledDates.some(d => date.equal(d, 'day'));
-        }
-        else if (typeof this.disabledDates == 'function') {
-            return this.disabledDates(date.date);
-        }
-        return false;
-    }
-    isHoliday(date) {
-        if (Array.isArray(this.holidayDates) && this.holidayDates.length != 0) {
-            return this.holidayDates.some(d => date.equal(d, 'day'));
-        }
-        else if (typeof this.holidayDates == 'function') {
-            return this.holidayDates(date.date);
-        }
-        return false;
-    }
-    isWeekend(date) {
-        //return date.dayOfWeek == 7 || date.dayOfWeek == 1;
-        const weekend = AXConfig.get(`dateTime.calendars.${this.type}.weekend`);
-        return weekend.includes(date.dayOfWeek);
-    }
-    _generatePickerItems(view) {
-        switch (view) {
-            case 'year':
-                this._pickerYears = range(2000, 2050, 1);
-                break;
-            case 'month':
-                this._pickerMonths = new AXDateTimeRange(this._viewRange.startTime.startOf('year'), this._viewRange.startTime.endOf('year'))
-                    .enumurate('month')
-                    .map(c => ({
-                    text: c.format('MMM'),
-                    value: c.monthOfYear,
-                }));
-                break;
-            default:
-                this._pickerDays = new AXDateTimeRange(this._viewRange.startTime.startOf('month'), this._viewRange.startTime.endOf('month'))
-                    .enumurate('day')
-                    .map(c => c.dayOfMonth);
-                this.cdr.detectChanges();
-                break;
-        }
-    }
-    _handlePickerChange(item, view) {
-        if (!item)
-            return;
-        const date = this._viewRange.startTime;
-        switch (view) {
-            case 'year':
-                this._setDate(date.set('year', item.value).date);
-                break;
-            case 'month':
-                this._setDate(date.set('month', item.value.value).date);
-                this._generatePickerItems('day');
-                break;
-            default:
-                this._setDate(date.set('day', item.value).date);
-                break;
-        }
-    }
-}
-AXCalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AXCalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: AXCalendarComponent, selector: "ax-calendar", inputs: { rtl: "rtl", readonly: "readonly", allowNull: "allowNull", value: "value", name: "name", checked: "checked", disabled: "disabled", tabIndex: "tabIndex", depth: "depth", activeView: "activeView", min: "min", max: "max", disabledDates: "disabledDates", type: "type", holidayDates: "holidayDates", interface: "interface" }, outputs: { valueChange: "valueChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", depthChange: "depthChange", typeChange: "typeChange", disabledDatesChange: "disabledDatesChange", holidayDatesChange: "holidayDatesChange", onNavigate: "onNavigate" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"interface === 'calendar'; else pickerTemplate\">\r\n  <div class=\"ax-calendar-header\">\r\n    <div class=\"ax-calendar-header-info\">\r\n      <ng-container *ngIf=\"activeView == 'days'; else elseTemplate\">\r\n        <button\r\n          [attr.disabled]=\"disabled ? '' : null\"\r\n          class=\"ax-general-button\"\r\n          (click)=\"_handleNavClick($event)\">\r\n          {{ _navText.split(' ')[1] }}\r\n        </button>\r\n        <button\r\n          [attr.disabled]=\"disabled ? '' : null\"\r\n          class=\"ax-general-button\"\r\n          (click)=\"_handleNavClick($event)\">\r\n          {{ _navText.split(' ')[0] }}\r\n        </button>\r\n      </ng-container>\r\n      <ng-template #elseTemplate>\r\n        <button\r\n          [attr.disabled]=\"disabled ? '' : null\"\r\n          class=\"ax-general-button\"\r\n          (click)=\"_handleNavClick($event)\">\r\n          {{ _navText }}\r\n        </button>\r\n      </ng-template>\r\n    </div>\r\n    <div class=\"ax-calendar-header-buttons\">\r\n      <button\r\n        [attr.disabled]=\"disabled ? '' : null\"\r\n        class=\"ax-general-button ax-button-icon\"\r\n        (click)=\"_handlePrevClick()\">\r\n        <i\r\n          class=\"ax-icon\"\r\n          [ngClass]=\"{\r\n            'ax-icon-chevron-left': !rtl,\r\n            'ax-icon-chevron-right': rtl\r\n          }\"></i>\r\n      </button>\r\n\r\n      <button\r\n        [attr.disabled]=\"disabled ? '' : null\"\r\n        class=\"ax-general-button ax-button-icon\"\r\n        (click)=\"_handleNextClick()\">\r\n        <i\r\n          class=\"ax-icon\"\r\n          [ngClass]=\"{\r\n            'ax-icon-chevron-left': rtl,\r\n            'ax-icon-chevron-right': !rtl\r\n          }\"></i>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"ax-calendar-body\">\r\n    <div [ngSwitch]=\"activeView\">\r\n      <ng-container *ngSwitchCase=\"'years'\">\r\n        <div class=\"ax-calendar-slots ax-calendar-slots-year\">\r\n          <div\r\n            tabindex=\"0\"\r\n            *ngFor=\"let slot of _slots\"\r\n            [ngClass]=\"slot.cssClass\"\r\n            (click)=\"_handleSlotClick($event, slot)\">\r\n            {{ slot.text }}\r\n          </div>\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngSwitchCase=\"'months'\">\r\n        <div class=\"ax-calendar-slots ax-calendar-slots-month\">\r\n          <div\r\n            tabindex=\"0\"\r\n            *ngFor=\"let slot of _slots\"\r\n            [title]=\"slot.tooltip\"\r\n            [ngClass]=\"slot.cssClass\"\r\n            (click)=\"_handleSlotClick($event, slot)\">\r\n            {{ slot.text }}\r\n          </div>\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngSwitchDefault>\r\n        <div class=\"ax-calendar-week\">\r\n          <div *ngFor=\"let d of _dayNames\">{{ d }}</div>\r\n        </div>\r\n        <div class=\"ax-calendar-slots ax-calendar-slots-day\">\r\n          <div\r\n            tabindex=\"0\"\r\n            *ngFor=\"let slot of _slots\"\r\n            [title]=\"slot.tooltip\"\r\n            [ngClass]=\"slot.cssClass\"\r\n            (click)=\"_handleSlotClick($event, slot)\">\r\n            {{ slot.text }}\r\n          </div>\r\n        </div>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"ax-calendar-footer\">\r\n    <button\r\n      class=\"ax-today-button\"\r\n      tabindex=\"-1\"\r\n      [class.ax-state-disabled]=\"disabled\"\r\n      [attr.disabled]=\"(disabled || isDisabled(_today)?true:null)\"\r\n      (click)=\"_handleGoToday()\"\r\n      *ngIf=\"activeView == 'days'\">\r\n      {{ _todayText }}\r\n    </button>\r\n  </div>\r\n</ng-container>\r\n<ng-template #pickerTemplate>\r\n  <div class=\"ax-calendar-picker\">//TODO: picker</div>\r\n</ng-template>\r\n", styles: [".ax-dark ax-calendar{background:rgba(var(--ax-color-on-surface))}ax-calendar{display:block;background:rgba(var(--ax-color-surface));color:rgba(var(--ax-color-text-default));padding:.5rem;width:18rem}@media (max-width: 599px){ax-calendar{width:100%}}@media (min-width: 600px){ax-calendar{width:20rem}}@media (min-width: 1200px){ax-calendar{width:18rem}}ax-calendar.ax-state-disabled .ax-calendar-slots{opacity:.5;cursor:default}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding:.25rem .5rem;margin-bottom:1.125rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{margin:.5rem}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;gap:.25rem}ax-calendar .ax-calendar-body .ax-calendar-slots>div{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.875rem;color:rgba(var(--ax-color-text-default));border-radius:var(--ax-rounded-border-default);cursor:pointer}ax-calendar .ax-calendar-body .ax-calendar-slots>div:before{content:\"\";padding-top:100%;float:left}ax-calendar .ax-calendar-body .ax-calendar-slots>div:after{content:\"\";display:block;clear:both}ax-calendar .ax-calendar-body .ax-calendar-slots>div:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots > div:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots > div:hover.ax-state-selected,ax-calendar .ax-calendar-body .ax-calendar-slots > div:hover.ax-state-today){background-color:rgba(var(--ax-color-surface-08))}ax-calendar .ax-calendar-body .ax-calendar-slots>div:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots > div:focus-visible.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots > div:focus-visible.ax-state-today){outline-width:2px;outline-style:solid;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div:focus-visible.ax-state-disabled{outline-width:2px;outline-style:dashed}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-today{border-width:2px;border-style:solid;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-today:focus-visible{border-style:dashed;outline-color:transparent}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-other{opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event:after{content:\"\";position:absolute;top:80%;left:0;right:0;margin:auto;width:.25rem;height:.25rem;border-radius:99rem}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-primary:after{background-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-secondary:after{background-color:rgba(var(--ax-color-secondary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-success:after{background-color:rgba(var(--ax-color-success-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-warning:after{background-color:rgba(var(--ax-color-warning-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-danger:after{background-color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-info:after{background-color:rgba(var(--ax-color-info-500))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin-top:.5rem;margin-bottom:.5rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{font-size:.875rem;text-align:center;position:relative;display:flex;align-items:center;justify-content:center;cursor:text;margin:.125rem}ax-calendar .ax-calendar-footer{display:flex;justify-content:center;align-items:center;margin-top:1.125rem}ax-calendar .ax-calendar-footer .ax-today-button{width:100%;height:var(--ax-size-default);padding:0 1rem;font-size:.875rem;text-align:center;display:block;background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore));border-radius:var(--ax-rounded-border-default);cursor:pointer}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{opacity:.5;cursor:not-allowed}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-400))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-600))}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ax-calendar', inputs: [
-                        'rtl',
-                        'readonly',
-                        'allowNull',
-                        'value',
-                        'name',
-                        'checked',
-                        'disabled',
-                        'tabIndex',
-                        'depth',
-                        'activeView',
-                        'min',
-                        'max',
-                        'disabledDates',
-                        'type',
-                        'holidayDates',
-                    ], outputs: [
-                        'valueChange',
-                        'onValueChanged',
-                        'onBlur',
-                        'onFocus',
-                        'depthChange',
-                        'typeChange',
-                        'disabledDatesChange',
-                        'holidayDatesChange',
-                        'onNavigate',
-                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"interface === 'calendar'; else pickerTemplate\">\r\n  <div class=\"ax-calendar-header\">\r\n    <div class=\"ax-calendar-header-info\">\r\n      <ng-container *ngIf=\"activeView == 'days'; else elseTemplate\">\r\n        <button\r\n          [attr.disabled]=\"disabled ? '' : null\"\r\n          class=\"ax-general-button\"\r\n          (click)=\"_handleNavClick($event)\">\r\n          {{ _navText.split(' ')[1] }}\r\n        </button>\r\n        <button\r\n          [attr.disabled]=\"disabled ? '' : null\"\r\n          class=\"ax-general-button\"\r\n          (click)=\"_handleNavClick($event)\">\r\n          {{ _navText.split(' ')[0] }}\r\n        </button>\r\n      </ng-container>\r\n      <ng-template #elseTemplate>\r\n        <button\r\n          [attr.disabled]=\"disabled ? '' : null\"\r\n          class=\"ax-general-button\"\r\n          (click)=\"_handleNavClick($event)\">\r\n          {{ _navText }}\r\n        </button>\r\n      </ng-template>\r\n    </div>\r\n    <div class=\"ax-calendar-header-buttons\">\r\n      <button\r\n        [attr.disabled]=\"disabled ? '' : null\"\r\n        class=\"ax-general-button ax-button-icon\"\r\n        (click)=\"_handlePrevClick()\">\r\n        <i\r\n          class=\"ax-icon\"\r\n          [ngClass]=\"{\r\n            'ax-icon-chevron-left': !rtl,\r\n            'ax-icon-chevron-right': rtl\r\n          }\"></i>\r\n      </button>\r\n\r\n      <button\r\n        [attr.disabled]=\"disabled ? '' : null\"\r\n        class=\"ax-general-button ax-button-icon\"\r\n        (click)=\"_handleNextClick()\">\r\n        <i\r\n          class=\"ax-icon\"\r\n          [ngClass]=\"{\r\n            'ax-icon-chevron-left': rtl,\r\n            'ax-icon-chevron-right': !rtl\r\n          }\"></i>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"ax-calendar-body\">\r\n    <div [ngSwitch]=\"activeView\">\r\n      <ng-container *ngSwitchCase=\"'years'\">\r\n        <div class=\"ax-calendar-slots ax-calendar-slots-year\">\r\n          <div\r\n            tabindex=\"0\"\r\n            *ngFor=\"let slot of _slots\"\r\n            [ngClass]=\"slot.cssClass\"\r\n            (click)=\"_handleSlotClick($event, slot)\">\r\n            {{ slot.text }}\r\n          </div>\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngSwitchCase=\"'months'\">\r\n        <div class=\"ax-calendar-slots ax-calendar-slots-month\">\r\n          <div\r\n            tabindex=\"0\"\r\n            *ngFor=\"let slot of _slots\"\r\n            [title]=\"slot.tooltip\"\r\n            [ngClass]=\"slot.cssClass\"\r\n            (click)=\"_handleSlotClick($event, slot)\">\r\n            {{ slot.text }}\r\n          </div>\r\n        </div>\r\n      </ng-container>\r\n      <ng-container *ngSwitchDefault>\r\n        <div class=\"ax-calendar-week\">\r\n          <div *ngFor=\"let d of _dayNames\">{{ d }}</div>\r\n        </div>\r\n        <div class=\"ax-calendar-slots ax-calendar-slots-day\">\r\n          <div\r\n            tabindex=\"0\"\r\n            *ngFor=\"let slot of _slots\"\r\n            [title]=\"slot.tooltip\"\r\n            [ngClass]=\"slot.cssClass\"\r\n            (click)=\"_handleSlotClick($event, slot)\">\r\n            {{ slot.text }}\r\n          </div>\r\n        </div>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"ax-calendar-footer\">\r\n    <button\r\n      class=\"ax-today-button\"\r\n      tabindex=\"-1\"\r\n      [class.ax-state-disabled]=\"disabled\"\r\n      [attr.disabled]=\"(disabled || isDisabled(_today)?true:null)\"\r\n      (click)=\"_handleGoToday()\"\r\n      *ngIf=\"activeView == 'days'\">\r\n      {{ _todayText }}\r\n    </button>\r\n  </div>\r\n</ng-container>\r\n<ng-template #pickerTemplate>\r\n  <div class=\"ax-calendar-picker\">//TODO: picker</div>\r\n</ng-template>\r\n", styles: [".ax-dark ax-calendar{background:rgba(var(--ax-color-on-surface))}ax-calendar{display:block;background:rgba(var(--ax-color-surface));color:rgba(var(--ax-color-text-default));padding:.5rem;width:18rem}@media (max-width: 599px){ax-calendar{width:100%}}@media (min-width: 600px){ax-calendar{width:20rem}}@media (min-width: 1200px){ax-calendar{width:18rem}}ax-calendar.ax-state-disabled .ax-calendar-slots{opacity:.5;cursor:default}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding:.25rem .5rem;margin-bottom:1.125rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{margin:.5rem}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;gap:.25rem}ax-calendar .ax-calendar-body .ax-calendar-slots>div{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.875rem;color:rgba(var(--ax-color-text-default));border-radius:var(--ax-rounded-border-default);cursor:pointer}ax-calendar .ax-calendar-body .ax-calendar-slots>div:before{content:\"\";padding-top:100%;float:left}ax-calendar .ax-calendar-body .ax-calendar-slots>div:after{content:\"\";display:block;clear:both}ax-calendar .ax-calendar-body .ax-calendar-slots>div:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots > div:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots > div:hover.ax-state-selected,ax-calendar .ax-calendar-body .ax-calendar-slots > div:hover.ax-state-today){background-color:rgba(var(--ax-color-surface-08))}ax-calendar .ax-calendar-body .ax-calendar-slots>div:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots > div:focus-visible.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots > div:focus-visible.ax-state-today){outline-width:2px;outline-style:solid;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div:focus-visible.ax-state-disabled{outline-width:2px;outline-style:dashed}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-col-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-today{border-width:2px;border-style:solid;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-today:focus-visible{border-style:dashed;outline-color:transparent}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-other{opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event:after{content:\"\";position:absolute;top:80%;left:0;right:0;margin:auto;width:.25rem;height:.25rem;border-radius:99rem}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-primary:after{background-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-secondary:after{background-color:rgba(var(--ax-color-secondary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-success:after{background-color:rgba(var(--ax-color-success-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-warning:after{background-color:rgba(var(--ax-color-warning-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-danger:after{background-color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots>div.ax-state-event-info:after{background-color:rgba(var(--ax-color-info-500))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin-top:.5rem;margin-bottom:.5rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{font-size:.875rem;text-align:center;position:relative;display:flex;align-items:center;justify-content:center;cursor:text;margin:.125rem}ax-calendar .ax-calendar-footer{display:flex;justify-content:center;align-items:center;margin-top:1.125rem}ax-calendar .ax-calendar-footer .ax-today-button{width:100%;height:var(--ax-size-default);padding:0 1rem;font-size:.875rem;text-align:center;display:block;background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore));border-radius:var(--ax-rounded-border-default);cursor:pointer}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{opacity:.5;cursor:not-allowed}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-400))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-600))}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { interface: [{
-                type: Input
-            }], __hostClass: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-const COMPONENT = [AXCalendarComponent];
-const MODULES = [CommonModule, AXDateTimeModule];
-class AXCalendarModule {
-}
-AXCalendarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AXCalendarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarModule, declarations: [AXCalendarComponent], imports: [CommonModule, AXDateTimeModule], exports: [AXCalendarComponent] });
-AXCalendarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarModule, imports: [MODULES] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: AXCalendarModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [...COMPONENT],
-                    imports: [...MODULES],
-                    exports: [...COMPONENT],
-                    providers: [],
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AXCalendarBaseComponent, AXCalendarComponent, AXCalendarComponentMixin, AXCalendarModule, AXCalendarNavigateEvent, CALENDAR_INPUTS, CALENDAR_OUTPUTS };
-//# sourceMappingURL=acorex-components-calendar.mjs.map
-//# sourceMappingURL=acorex-components-calendar.mjs.map