ion2-calendar - npm Package Compare versions

Comparing version 2.0.11 to 2.1.0

dist/calendar.controller.d.ts

@@ -16,5 +16,11 @@ import { ModalController } from 'ionic-angular';
     openCalendar(calendarOptions: CalendarModalOptions, modalOptions?: ModalOptions): any;
+    /**
+     * @deprecated
+     */
     setHistory(param: any): void;
+    /**
+     * @deprecated
+     */
     getHistory(id: any): Object;
     removeHistory(id: any): void;
 }

dist/calendar.controller.js

@@ -34,10 +34,14 @@ import { Injectable } from '@angular/core';
     };
+    /**
+     * @deprecated
+     */
     CalendarController.prototype.setHistory = function (param) {
-        localStorage.setItem("ion-calendar-" + param.id, JSON.stringify(param.date));
+        console.warn('setHistory deprecated');
     };
+    /**
+     * @deprecated
+     */
     CalendarController.prototype.getHistory = function (id) {
-        var _history = localStorage.getItem("ion-calendar-" + id);
-        if (_history) {
-            return JSON.parse(_history);
-        }
+        console.warn('getHistory deprecated');
+        return null;
     };
@@ -44,0 +48,0 @@ CalendarController.prototype.removeHistory = function (id) {

dist/calendar.model.d.ts

@@ -38,3 +38,2 @@ export interface CalendarOriginal {
     end: number;
-    isRadio: boolean;
     pickMode: string;
@@ -72,3 +71,3 @@ monthFormat: string;
     } | null;
-    countNextMonths?: number;
+    step?: number;
     /**
@@ -75,0 +74,0 @@ * @deprecated this version notwork

dist/components/calendar-week.component.js

 import { Component, Input } from '@angular/core';
+import { defaults } from "../config";
 var CalendarWeekComponent = /** @class */ (function () {
     function CalendarWeekComponent() {
-        this._weekArray = ['S', 'M', 'T', 'W', 'T', 'F', 'S'];
+        this._weekArray = defaults.WEEKS_FORMAT;
         this._weekStart = 0;
-        this.color = 'primary';
+        this.color = defaults.COLOR;
     }
@@ -8,0 +9,0 @@ Object.defineProperty(CalendarWeekComponent.prototype, "weekArray", {

dist/components/calendar.component.d.ts

@@ -42,5 +42,7 @@ import { OnInit, EventEmitter } from '@angular/core';
     onChanged($event: any[]): void;
+    swipeEvent($event: any): void;
     _writeValue(value: any): void;
     _createCalendarDay(value: any): CalendarDay;
     _handleType(value: number): any;
+    _monthFormat(date: any): string;
 }

dist/components/calendar.component.js

@@ -5,2 +5,3 @@ import { Component, Input, Output, EventEmitter, forwardRef } from '@angular/core';
 import * as moment from 'moment';
+import { defaults, pickModes } from "../config";
 export var ION_CAL_VALUE_ACCESSOR = {
@@ -18,3 +19,3 @@ provide: NG_VALUE_ACCESSOR,
         this._showMonthPicker = true;
-        this.format = 'YYYY-MM-DD';
+        this.format = defaults.DATE_FORMAT;
         this.type = 'string';
@@ -141,3 +142,3 @@ this.readonly = false;
         switch (this._d.pickMode) {
-            case 'single':
+            case pickModes.SINGLE:
                 var date = this._handleType($event[0].time);
@@ -147,3 +148,3 @@ this._onChanged(date);
                 break;
-            case 'range':
+            case pickModes.RANGE:
                 if ($event[0] && $event[1]) {
@@ -158,3 +159,3 @@ var rangeDate = {
                 break;
-            case 'multi':
+            case pickModes.MULTI:
                 var dates = [];
@@ -172,2 +173,13 @@ for (var i = 0; i < $event.length; i++) {
     };
+    CalendarComponent.prototype.swipeEvent = function ($event) {
+        if (this.readonly)
+            return;
+        var isNext = $event.deltaX < 0;
+        if (isNext && this.canNext()) {
+            this.nextMonth();
+        }
+        else if (!isNext && this.canBack()) {
+            this.backMonth();
+        }
+    };
     CalendarComponent.prototype._writeValue = function (value) {
@@ -228,2 +240,5 @@ var _this = this;
     };
+    CalendarComponent.prototype._monthFormat = function (date) {
+        return moment(date).format('MMM YYYY');
+    };
     CalendarComponent.decorators = [
@@ -233,3 +248,3 @@ { type: Component, args: [{
                     providers: [ION_CAL_VALUE_ACCESSOR],
-                    template: "\n    <div class=\"title\">\n      <ng-template [ngIf]=\"_showMonthPicker ? _showMonthPicker || !readonly : false\" [ngIfElse]=\"title\">\n        <button type=\"button\"\n                ion-button\n                clear\n                class=\"switch-btn\"\n                [disabled]=\"readonly\"\n                (click)=\"switchView()\">\n          {{monthOpt.original.time | date: _d.monthFormat}}\n          <ion-icon *ngIf=\"!readonly\"\n                    class=\"arrow-dropdown\"\n                    [name]=\"_view === 'days' ? 'md-arrow-dropdown' : 'md-arrow-dropup'\"></ion-icon>\n        </button>\n      </ng-template>\n      <ng-template #title>\n        <div class=\"switch-btn\">\n          {{monthOpt.original.time | date: _d.monthFormat}}\n        </div>\n      </ng-template>\n      <ng-template [ngIf]=\"_showToggleButtons\">\n        <button type='button' ion-button clear class=\"back\" [disabled]=\"!canBack() || readonly\" (click)=\"prev()\">\n          <ion-icon name=\"ios-arrow-back\"></ion-icon>\n        </button>\n        <button type='button' ion-button clear class=\"forward\" [disabled]=\"!canNext() || readonly\"\n                (click)=\"next()\">\n          <ion-icon name=\"ios-arrow-forward\"></ion-icon>\n        </button>\n      </ng-template>\n    </div>\n    \n    <ng-template [ngIf]=\"_view === 'days'\" [ngIfElse]=\"monthPicker\">\n      <ion-calendar-week color=\"transparent\"\n                         [weekArray]=\"_d.weekdays\"\n                         [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n      <ion-calendar-month [(ngModel)]=\"_calendarMonthValue\"\n                          [month]=\"monthOpt\"\n                          [readonly]=\"readonly\"\n                          (onChange)=\"onChanged($event)\"\n                          [pickMode]=\"_d.pickMode\"\n                          [color]=\"_d.color\">\n      </ion-calendar-month>\n    </ng-template>\n\n    <ng-template #monthPicker>\n      <ion-calendar-month-picker [color]=\"_d.color\" \n                                 [monthFormat]=\"_options?.monthPickerFormat\"\n                                 (onSelect)=\"monthOnSelect($event)\"\n                                 [month]=\"monthOpt\">\n      </ion-calendar-month-picker>\n    </ng-template>\n  ",
+                    template: "\n    <div class=\"title\">\n      <ng-template [ngIf]=\"_showMonthPicker ? _showMonthPicker || !readonly : false\" [ngIfElse]=\"title\">\n        <button type=\"button\"\n                ion-button\n                clear\n                class=\"switch-btn\"\n                [disabled]=\"readonly\"\n                (click)=\"switchView()\">\n          {{_monthFormat(monthOpt.original.time)}}\n          <ion-icon *ngIf=\"!readonly\"\n                    class=\"arrow-dropdown\"\n                    [name]=\"_view === 'days' ? 'md-arrow-dropdown' : 'md-arrow-dropup'\"></ion-icon>\n        </button>\n      </ng-template>\n      <ng-template #title>\n        <div class=\"switch-btn\">\n          {{_monthFormat(monthOpt.original.time)}}\n        </div>\n      </ng-template>\n      <ng-template [ngIf]=\"_showToggleButtons\">\n        <button type='button' ion-button clear class=\"back\" [disabled]=\"!canBack() || readonly\" (click)=\"prev()\">\n          <ion-icon name=\"ios-arrow-back\"></ion-icon>\n        </button>\n        <button type='button' ion-button clear class=\"forward\" [disabled]=\"!canNext() || readonly\"\n                (click)=\"next()\">\n          <ion-icon name=\"ios-arrow-forward\"></ion-icon>\n        </button>\n      </ng-template>\n    </div>\n    \n    <ng-template [ngIf]=\"_view === 'days'\" [ngIfElse]=\"monthPicker\">\n      <ion-calendar-week color=\"transparent\"\n                         [weekArray]=\"_d.weekdays\"\n                         [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n      <ion-calendar-month [(ngModel)]=\"_calendarMonthValue\"\n                          [month]=\"monthOpt\"\n                          [readonly]=\"readonly\"\n                          (onChange)=\"onChanged($event)\"\n                          (swipe)=\"swipeEvent($event)\"\n                          [pickMode]=\"_d.pickMode\"\n                          [color]=\"_d.color\">\n      </ion-calendar-month>\n    </ng-template>\n\n    <ng-template #monthPicker>\n      <ion-calendar-month-picker [color]=\"_d.color\"\n                                 [monthFormat]=\"_options?.monthPickerFormat\"\n                                 (onSelect)=\"monthOnSelect($event)\"\n                                 [month]=\"monthOpt\">\n      </ion-calendar-month-picker>\n    </ng-template>\n  ",
                 },] },
@@ -236,0 +251,0 @@ ];

dist/components/calendar.component.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"ION_CAL_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"CalendarComponent"},"multi":true},"CalendarComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar","providers":[{"__symbolic":"reference","name":"ION_CAL_VALUE_ACCESSOR"}],"template":"\n    <div class=\"title\">\n      <ng-template [ngIf]=\"_showMonthPicker ? _showMonthPicker || !readonly : false\" [ngIfElse]=\"title\">\n        <button type=\"button\"\n                ion-button\n                clear\n                class=\"switch-btn\"\n                [disabled]=\"readonly\"\n                (click)=\"switchView()\">\n          {{monthOpt.original.time | date: _d.monthFormat}}\n          <ion-icon *ngIf=\"!readonly\"\n                    class=\"arrow-dropdown\"\n                    [name]=\"_view === 'days' ? 'md-arrow-dropdown' : 'md-arrow-dropup'\"></ion-icon>\n        </button>\n      </ng-template>\n      <ng-template #title>\n        <div class=\"switch-btn\">\n          {{monthOpt.original.time | date: _d.monthFormat}}\n        </div>\n      </ng-template>\n      <ng-template [ngIf]=\"_showToggleButtons\">\n        <button type='button' ion-button clear class=\"back\" [disabled]=\"!canBack() || readonly\" (click)=\"prev()\">\n          <ion-icon name=\"ios-arrow-back\"></ion-icon>\n        </button>\n        <button type='button' ion-button clear class=\"forward\" [disabled]=\"!canNext() || readonly\"\n                (click)=\"next()\">\n          <ion-icon name=\"ios-arrow-forward\"></ion-icon>\n        </button>\n      </ng-template>\n    </div>\n    \n    <ng-template [ngIf]=\"_view === 'days'\" [ngIfElse]=\"monthPicker\">\n      <ion-calendar-week color=\"transparent\"\n                         [weekArray]=\"_d.weekdays\"\n                         [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n      <ion-calendar-month [(ngModel)]=\"_calendarMonthValue\"\n                          [month]=\"monthOpt\"\n                          [readonly]=\"readonly\"\n                          (onChange)=\"onChanged($event)\"\n                          [pickMode]=\"_d.pickMode\"\n                          [color]=\"_d.color\">\n      </ion-calendar-month>\n    </ng-template>\n\n    <ng-template #monthPicker>\n      <ion-calendar-month-picker [color]=\"_d.color\" \n                                 [monthFormat]=\"_options?.monthPickerFormat\"\n                                 (onSelect)=\"monthOnSelect($event)\"\n                                 [month]=\"monthOpt\">\n      </ion-calendar-month-picker>\n    </ng-template>\n  "}]}],"members":{"format":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"monthChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../services/calendar.service","name":"CalendarService"}]}],"ionViewDidLoad":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"initOpt":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"createMonth":[{"__symbolic":"method"}],"switchView":[{"__symbolic":"method"}],"prev":[{"__symbolic":"method"}],"next":[{"__symbolic":"method"}],"prevYear":[{"__symbolic":"method"}],"nextYear":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}],"canNext":[{"__symbolic":"method"}],"backMonth":[{"__symbolic":"method"}],"canBack":[{"__symbolic":"method"}],"monthOnSelect":[{"__symbolic":"method"}],"onChanged":[{"__symbolic":"method"}],"_writeValue":[{"__symbolic":"method"}],"_createCalendarDay":[{"__symbolic":"method"}],"_handleType":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"ION_CAL_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"CalendarComponent"},"multi":true},"CalendarComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar","providers":[{"__symbolic":"reference","name":"ION_CAL_VALUE_ACCESSOR"}],"template":"\n    <div class=\"title\">\n      <ng-template [ngIf]=\"_showMonthPicker ? _showMonthPicker || !readonly : false\" [ngIfElse]=\"title\">\n        <button type=\"button\"\n                ion-button\n                clear\n                class=\"switch-btn\"\n                [disabled]=\"readonly\"\n                (click)=\"switchView()\">\n          {{monthOpt.original.time | date: _d.monthFormat}}\n          <ion-icon *ngIf=\"!readonly\"\n                    class=\"arrow-dropdown\"\n                    [name]=\"_view === 'days' ? 'md-arrow-dropdown' : 'md-arrow-dropup'\"></ion-icon>\n        </button>\n      </ng-template>\n      <ng-template #title>\n        <div class=\"switch-btn\">\n          {{monthOpt.original.time | date: _d.monthFormat}}\n        </div>\n      </ng-template>\n      <ng-template [ngIf]=\"_showToggleButtons\">\n        <button type='button' ion-button clear class=\"back\" [disabled]=\"!canBack() || readonly\" (click)=\"prev()\">\n          <ion-icon name=\"ios-arrow-back\"></ion-icon>\n        </button>\n        <button type='button' ion-button clear class=\"forward\" [disabled]=\"!canNext() || readonly\"\n                (click)=\"next()\">\n          <ion-icon name=\"ios-arrow-forward\"></ion-icon>\n        </button>\n      </ng-template>\n    </div>\n    \n    <ng-template [ngIf]=\"_view === 'days'\" [ngIfElse]=\"monthPicker\">\n      <ion-calendar-week color=\"transparent\"\n                         [weekArray]=\"_d.weekdays\"\n                         [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n      <ion-calendar-month [(ngModel)]=\"_calendarMonthValue\"\n                          [month]=\"monthOpt\"\n                          [readonly]=\"readonly\"\n                          (onChange)=\"onChanged($event)\"\n                          [pickMode]=\"_d.pickMode\"\n                          [color]=\"_d.color\">\n      </ion-calendar-month>\n    </ng-template>\n\n    <ng-template #monthPicker>\n      <ion-calendar-month-picker [color]=\"_d.color\" \n                                 [monthFormat]=\"_options?.monthPickerFormat\"\n                                 (onSelect)=\"monthOnSelect($event)\"\n                                 [month]=\"monthOpt\">\n      </ion-calendar-month-picker>\n    </ng-template>\n  "}]}],"members":{"format":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"monthChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../services/calendar.service","name":"CalendarService"}]}],"ionViewDidLoad":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"initOpt":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"createMonth":[{"__symbolic":"method"}],"switchView":[{"__symbolic":"method"}],"prev":[{"__symbolic":"method"}],"next":[{"__symbolic":"method"}],"prevYear":[{"__symbolic":"method"}],"nextYear":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}],"canNext":[{"__symbolic":"method"}],"backMonth":[{"__symbolic":"method"}],"canBack":[{"__symbolic":"method"}],"monthOnSelect":[{"__symbolic":"method"}],"onChanged":[{"__symbolic":"method"}],"_writeValue":[{"__symbolic":"method"}],"_createCalendarDay":[{"__symbolic":"method"}],"_handleType":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"ION_CAL_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"CalendarComponent"},"multi":true},"CalendarComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar","providers":[{"__symbolic":"reference","name":"ION_CAL_VALUE_ACCESSOR"}],"template":"\n    <div class=\"title\">\n      <ng-template [ngIf]=\"_showMonthPicker ? _showMonthPicker || !readonly : false\" [ngIfElse]=\"title\">\n        <button type=\"button\"\n                ion-button\n                clear\n                class=\"switch-btn\"\n                [disabled]=\"readonly\"\n                (click)=\"switchView()\">\n          {{_monthFormat(monthOpt.original.time)}}\n          <ion-icon *ngIf=\"!readonly\"\n                    class=\"arrow-dropdown\"\n                    [name]=\"_view === 'days' ? 'md-arrow-dropdown' : 'md-arrow-dropup'\"></ion-icon>\n        </button>\n      </ng-template>\n      <ng-template #title>\n        <div class=\"switch-btn\">\n          {{_monthFormat(monthOpt.original.time)}}\n        </div>\n      </ng-template>\n      <ng-template [ngIf]=\"_showToggleButtons\">\n        <button type='button' ion-button clear class=\"back\" [disabled]=\"!canBack() || readonly\" (click)=\"prev()\">\n          <ion-icon name=\"ios-arrow-back\"></ion-icon>\n        </button>\n        <button type='button' ion-button clear class=\"forward\" [disabled]=\"!canNext() || readonly\"\n                (click)=\"next()\">\n          <ion-icon name=\"ios-arrow-forward\"></ion-icon>\n        </button>\n      </ng-template>\n    </div>\n    \n    <ng-template [ngIf]=\"_view === 'days'\" [ngIfElse]=\"monthPicker\">\n      <ion-calendar-week color=\"transparent\"\n                         [weekArray]=\"_d.weekdays\"\n                         [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n      <ion-calendar-month [(ngModel)]=\"_calendarMonthValue\"\n                          [month]=\"monthOpt\"\n                          [readonly]=\"readonly\"\n                          (onChange)=\"onChanged($event)\"\n                          (swipe)=\"swipeEvent($event)\"\n                          [pickMode]=\"_d.pickMode\"\n                          [color]=\"_d.color\">\n      </ion-calendar-month>\n    </ng-template>\n\n    <ng-template #monthPicker>\n      <ion-calendar-month-picker [color]=\"_d.color\"\n                                 [monthFormat]=\"_options?.monthPickerFormat\"\n                                 (onSelect)=\"monthOnSelect($event)\"\n                                 [month]=\"monthOpt\">\n      </ion-calendar-month-picker>\n    </ng-template>\n  "}]}],"members":{"format":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"monthChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../services/calendar.service","name":"CalendarService"}]}],"ionViewDidLoad":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"initOpt":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"createMonth":[{"__symbolic":"method"}],"switchView":[{"__symbolic":"method"}],"prev":[{"__symbolic":"method"}],"next":[{"__symbolic":"method"}],"prevYear":[{"__symbolic":"method"}],"nextYear":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}],"canNext":[{"__symbolic":"method"}],"backMonth":[{"__symbolic":"method"}],"canBack":[{"__symbolic":"method"}],"monthOnSelect":[{"__symbolic":"method"}],"onChanged":[{"__symbolic":"method"}],"swipeEvent":[{"__symbolic":"method"}],"_writeValue":[{"__symbolic":"method"}],"_createCalendarDay":[{"__symbolic":"method"}],"_handleType":[{"__symbolic":"method"}],"_monthFormat":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"ION_CAL_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"CalendarComponent"},"multi":true},"CalendarComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar","providers":[{"__symbolic":"reference","name":"ION_CAL_VALUE_ACCESSOR"}],"template":"\n    <div class=\"title\">\n      <ng-template [ngIf]=\"_showMonthPicker ? _showMonthPicker || !readonly : false\" [ngIfElse]=\"title\">\n        <button type=\"button\"\n                ion-button\n                clear\n                class=\"switch-btn\"\n                [disabled]=\"readonly\"\n                (click)=\"switchView()\">\n          {{_monthFormat(monthOpt.original.time)}}\n          <ion-icon *ngIf=\"!readonly\"\n                    class=\"arrow-dropdown\"\n                    [name]=\"_view === 'days' ? 'md-arrow-dropdown' : 'md-arrow-dropup'\"></ion-icon>\n        </button>\n      </ng-template>\n      <ng-template #title>\n        <div class=\"switch-btn\">\n          {{_monthFormat(monthOpt.original.time)}}\n        </div>\n      </ng-template>\n      <ng-template [ngIf]=\"_showToggleButtons\">\n        <button type='button' ion-button clear class=\"back\" [disabled]=\"!canBack() || readonly\" (click)=\"prev()\">\n          <ion-icon name=\"ios-arrow-back\"></ion-icon>\n        </button>\n        <button type='button' ion-button clear class=\"forward\" [disabled]=\"!canNext() || readonly\"\n                (click)=\"next()\">\n          <ion-icon name=\"ios-arrow-forward\"></ion-icon>\n        </button>\n      </ng-template>\n    </div>\n    \n    <ng-template [ngIf]=\"_view === 'days'\" [ngIfElse]=\"monthPicker\">\n      <ion-calendar-week color=\"transparent\"\n                         [weekArray]=\"_d.weekdays\"\n                         [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n      <ion-calendar-month [(ngModel)]=\"_calendarMonthValue\"\n                          [month]=\"monthOpt\"\n                          [readonly]=\"readonly\"\n                          (onChange)=\"onChanged($event)\"\n                          (swipe)=\"swipeEvent($event)\"\n                          [pickMode]=\"_d.pickMode\"\n                          [color]=\"_d.color\">\n      </ion-calendar-month>\n    </ng-template>\n\n    <ng-template #monthPicker>\n      <ion-calendar-month-picker [color]=\"_d.color\"\n                                 [monthFormat]=\"_options?.monthPickerFormat\"\n                                 (onSelect)=\"monthOnSelect($event)\"\n                                 [month]=\"monthOpt\">\n      </ion-calendar-month-picker>\n    </ng-template>\n  "}]}],"members":{"format":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"monthChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"../services/calendar.service","name":"CalendarService"}]}],"ionViewDidLoad":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"initOpt":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"createMonth":[{"__symbolic":"method"}],"switchView":[{"__symbolic":"method"}],"prev":[{"__symbolic":"method"}],"next":[{"__symbolic":"method"}],"prevYear":[{"__symbolic":"method"}],"nextYear":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}],"canNext":[{"__symbolic":"method"}],"backMonth":[{"__symbolic":"method"}],"canBack":[{"__symbolic":"method"}],"monthOnSelect":[{"__symbolic":"method"}],"onChanged":[{"__symbolic":"method"}],"swipeEvent":[{"__symbolic":"method"}],"_writeValue":[{"__symbolic":"method"}],"_createCalendarDay":[{"__symbolic":"method"}],"_handleType":[{"__symbolic":"method"}],"_monthFormat":[{"__symbolic":"method"}]}}}}]

dist/components/calendar.modal.d.ts

 import { ElementRef, ChangeDetectorRef, Renderer } from '@angular/core';
 import { NavParams, ViewController, Content, InfiniteScroll } from 'ionic-angular';
-import { CalendarDay, CalendarMonth, PrivateCalendarOptions, CalendarModalOptions } from '../calendar.model';
+import { CalendarDay, CalendarMonth, CalendarModalOptions } from '../calendar.model';
 import { CalendarService } from '../services/calendar.service';
@@ -14,16 +14,5 @@ export declare class CalendarModal {
     monthsEle: ElementRef;
-    title: string;
-    closeLabel: string;
-    closeIcon: boolean;
-    doneLabel: string;
-    doneIcon: boolean;
     datesTemp: Array<CalendarDay | null>;
     calendarMonths: Array<CalendarMonth>;
-    monthFormatFilterStr: string;
-    weekdays: Array<string>;
-    defaultScrollTo: Date;
-    scrollBackwards: boolean;
-    weekStart: number;
-    isSaveHistory: boolean;
-    countNextMonths: number;
+    step: number;
     showYearPicker: boolean;
@@ -33,7 +22,3 @@ year: number;
     infiniteScroll: InfiniteScroll;
-    options: PrivateCalendarOptions;
-    debug: boolean;
     _s: boolean;
-    _id: string;
-    _color: string;
     _d: CalendarModalOptions;
@@ -49,4 +34,2 @@ constructor(_renderer: Renderer, _elementRef: ElementRef, params: NavParams, viewCtrl: ViewController, ref: ChangeDetectorRef, calSvc: CalendarService);
     canDone(): boolean;
-    getHistory(): void;
-    createYearPicker(startTime: number, endTime: number): void;
     nextMonth(infiniteScroll: InfiniteScroll): void;
@@ -57,4 +40,4 @@ backwardsMonth(): void;
     findInitMonthNumber(date: Date): number;
-    changedYearSelection(): void;
     _getDayTime(date: any): number;
+    _monthFormat(date: any): string;
 }

dist/components/calendar.modal.js

@@ -5,2 +5,3 @@ import { Component, ViewChild, ElementRef, ChangeDetectorRef, Renderer } from '@angular/core';
 import * as moment from 'moment';
+import { pickModes } from "../config";
 var CalendarModal = /** @class */ (function () {
@@ -15,10 +16,4 @@ function CalendarModal(_renderer, _elementRef, params, viewCtrl, ref, calSvc) {
         this.datesTemp = [null, null];
-        this.monthFormatFilterStr = '';
-        this.weekdays = [];
-        this.weekStart = 0;
-        this.debug = true;
         this._s = true;
-        this._color = 'primary';
         this.init();
-        this.getHistory();
         this.initDefaultDate();
@@ -31,63 +26,31 @@ }
     CalendarModal.prototype.init = function () {
-        var params = this.params;
-        this._d = this.calSvc.safeOpt(params.get('options'));
-        var startTime = moment(this._d.from).valueOf();
-        var endTime = moment(this._d.to).valueOf();
-        this.options = {
-            start: startTime,
-            end: endTime,
-            isRadio: params.get('isRadio'),
-            pickMode: this._d.pickMode,
-            range_beg: startTime,
-            range_end: endTime,
-            daysConfig: params.get('daysConfig'),
-            disableWeeks: params.get('disableWeeks'),
-            monthFormat: params.get('monthFormat'),
-        };
-        this.defaultScrollTo = this._d.defaultScrollTo;
-        this.scrollBackwards = this._d.canBackwardsSelected;
-        this.weekStart = this._d.weekStart;
-        this._id = this._d.id;
-        this._color = this._d.color;
-        this.monthFormatFilterStr = this._d.monthFormat;
-        this.weekdays = this._d.weekdays;
-        this.title = this._d.title;
-        this.closeLabel = this._d.closeLabel;
-        this.closeIcon = this._d.closeIcon;
-        this.doneLabel = this._d.doneLabel;
-        this.doneIcon = this._d.doneIcon;
-        this.isSaveHistory = this._d.isSaveHistory;
-        this.countNextMonths = this._d.countNextMonths;
-        if (this.countNextMonths < 1) {
-            this.countNextMonths = 1;
+        this._d = this.calSvc.safeOpt(this.params.get('options'));
+        this.step = this._d.step;
+        if (this.step < 1) {
+            this.step = 1;
         }
-        this.showYearPicker = this._d.showYearPicker;
-        if (this.showYearPicker) {
-            this.createYearPicker(startTime, endTime);
-        }
-        else {
-            this.calendarMonths = this.calSvc.createMonthsByPeriod(startTime, this.findInitMonthNumber(this.defaultScrollTo) + this.countNextMonths, this._d);
-        }
+        this.calendarMonths = this.calSvc.createMonthsByPeriod(moment(this._d.from).valueOf(), this.findInitMonthNumber(this._d.defaultScrollTo) + this.step, this._d);
     };
     CalendarModal.prototype.initDefaultDate = function () {
         var _this = this;
-        switch (this._d.pickMode) {
-            case 'single':
-                if (this._d.defaultDate) {
-                    this.datesTemp[0] = this.calSvc.createCalendarDay(this._getDayTime(this._d.defaultDate), this._d);
+        var _a = this._d, pickMode = _a.pickMode, defaultDate = _a.defaultDate, defaultDateRange = _a.defaultDateRange, defaultDates = _a.defaultDates;
+        switch (pickMode) {
+            case pickModes.SINGLE:
+                if (defaultDate) {
+                    this.datesTemp[0] = this.calSvc.createCalendarDay(this._getDayTime(defaultDate), this._d);
                 }
                 break;
-            case 'range':
-                if (this._d.defaultDateRange) {
-                    if (this._d.defaultDateRange.from) {
-                        this.datesTemp[0] = this.calSvc.createCalendarDay(this._getDayTime(this._d.defaultDateRange.from), this._d);
+            case pickModes.RANGE:
+                if (defaultDateRange) {
+                    if (defaultDateRange.from) {
+                        this.datesTemp[0] = this.calSvc.createCalendarDay(this._getDayTime(defaultDateRange.from), this._d);
                     }
-                    if (this._d.defaultDateRange.to) {
-                        this.datesTemp[1] = this.calSvc.createCalendarDay(this._getDayTime(this._d.defaultDateRange.to), this._d);
+                    if (defaultDateRange.to) {
+                        this.datesTemp[1] = this.calSvc.createCalendarDay(this._getDayTime(defaultDateRange.to), this._d);
                     }
                 }
                 break;
-            case 'multi':
-                if (this._d.defaultDates && this._d.defaultDates.length) {
-                    this.datesTemp = this._d.defaultDates.map(function (e) { return _this.calSvc.createCalendarDay(_this._getDayTime(e), _this._d); });
+            case pickModes.MULTI:
+                if (defaultDates && defaultDates.length) {
+                    this.datesTemp = defaultDates.map(function (e) { return _this.calSvc.createCalendarDay(_this._getDayTime(e), _this._d); });
                 }
@@ -110,6 +73,6 @@ break;
     CalendarModal.prototype.onChange = function (data) {
+        var _a = this._d, pickMode = _a.pickMode, autoDone = _a.autoDone;
         this.datesTemp = data;
-        this.calSvc.savedHistory(data, this._id);
         this.ref.detectChanges();
-        if (this._d.pickMode !== 'multi' && this._d.autoDone && this.canDone()) {
+        if (pickMode !== pickModes.MULTI && autoDone && this.canDone()) {
             this.done();
@@ -122,3 +85,4 @@ }
     CalendarModal.prototype.done = function () {
-        this.viewCtrl.dismiss(this.calSvc.wrapResult(this.datesTemp, this._d.pickMode), 'done');
+        var pickMode = this._d.pickMode;
+        this.viewCtrl.dismiss(this.calSvc.wrapResult(this.datesTemp, pickMode), 'done');
     };
@@ -129,8 +93,9 @@ CalendarModal.prototype.canDone = function () {
         }
-        switch (this._d.pickMode) {
-            case 'single':
+        var pickMode = this._d.pickMode;
+        switch (pickMode) {
+            case pickModes.SINGLE:
                 return !!(this.datesTemp[0] && this.datesTemp[0].time);
-            case 'range':
+            case pickModes.RANGE:
                 return !!(this.datesTemp[0] && this.datesTemp[1]) && !!(this.datesTemp[0].time && this.datesTemp[1].time);
-            case 'multi':
+            case pickModes.MULTI:
                 return this.datesTemp.length > 0 && this.datesTemp.every(function (e) { return !!e && !!e.time; });
@@ -141,44 +106,2 @@ default:
     };
-    CalendarModal.prototype.getHistory = function () {
-        if (this.isSaveHistory) {
-            this.datesTemp = this.calSvc.getHistory(this._id);
-        }
-    };
-    CalendarModal.prototype.createYearPicker = function (startTime, endTime) {
-        // init year array
-        this.years = [];
-        // getting max and be sure, it is in future (maybe parameter?)
-        var maxYear = (new Date(endTime)).getFullYear();
-        if (maxYear <= 1970) {
-            maxYear = (new Date(this.defaultScrollTo)).getFullYear() + 10;
-            this.options.end = new Date(maxYear, 12, 0).getTime();
-        }
-        // min year should be okay, either it will be set or something like 1970 at min
-        var minYear = (new Date(startTime)).getFullYear();
-        // calculating the needed years to be added to array
-        var neededYears = (maxYear - minYear);
-        // pushing years to selection array
-        for (var y = 0; y <= neededYears; y++) {
-            this.years.push(maxYear - y);
-        }
-        this.years.reverse();
-        // selection-start-year of defaultScrollTo
-        this.year = this.defaultScrollTo.getFullYear();
-        var firstDayOfYear = new Date(this.year, 0, 1);
-        var lastDayOfYear = new Date(this.year, 12, 0);
-        // don't calc over the start / end
-        if (firstDayOfYear.getTime() < this.options.start) {
-            firstDayOfYear = new Date(this.options.start);
-        }
-        if (lastDayOfYear.getTime() > this.options.end) {
-            lastDayOfYear = new Date(this.options.end);
-        }
-        // calcing the month
-        this.calendarMonths = this.calSvc.createMonthsByPeriod(firstDayOfYear.getTime(), this.findInitMonthNumber(this.defaultScrollTo) + this.countNextMonths, this._d);
-        // sets the range new
-        // checking whether the start is after firstDayOfYear
-        this.options.range_beg = firstDayOfYear.getTime() < startTime ? startTime : firstDayOfYear.getTime();
-        // checking whether the end is before lastDayOfYear
-        this.options.range_end = lastDayOfYear.getTime() > endTime ? endTime : lastDayOfYear.getTime();
-    };
     CalendarModal.prototype.nextMonth = function (infiniteScroll) {
@@ -189,3 +112,3 @@ this.infiniteScroll = infiniteScroll;
         var nextTime = moment(final.original.time).add(1, 'M').valueOf();
-        var rangeEnd = this.options.range_end ? moment(this.options.range_end).subtract(1, 'M') : 0;
+        var rangeEnd = this._d.to ? moment(this._d.to).subtract(1, 'M') : 0;
         if (len <= 0 || (rangeEnd !== 0 && moment(final.original.time).isAfter(rangeEnd))) {
@@ -208,3 +131,3 @@ infiniteScroll.enable(false);
         var _this = this;
-        var defaultDateIndex = this.findInitMonthNumber(this.defaultScrollTo);
+        var defaultDateIndex = this.findInitMonthNumber(this._d.defaultScrollTo);
         var defaultDateMonth = this.monthsEle.nativeElement.children["month-" + defaultDateIndex].offsetTop;
@@ -219,3 +142,3 @@ if (defaultDateIndex === 0 || defaultDateMonth === 0)
         var _this = this;
-        if (!this.scrollBackwards)
+        if (!this._d.canBackwardsSelected)
             return;
@@ -236,3 +159,3 @@ if ($event.scrollTop <= 200 && this._s) {
     CalendarModal.prototype.findInitMonthNumber = function (date) {
-        var startDate = moment(this.options.start);
+        var startDate = moment(this._d.from);
         var defaultScrollTo = moment(date);
@@ -247,38 +170,12 @@ var isAfter = defaultScrollTo.isAfter(startDate);
     };
-    CalendarModal.prototype.changedYearSelection = function () {
-        var _this = this;
-        // re-enabling infinite scroll
-        if (this.infiniteScroll !== undefined) {
-            this.infiniteScroll.enable(true);
-        }
-        // getting first day and last day of the year
-        var firstDayOfYear = new Date(this.year, 0, 1);
-        var lastDayOfYear = new Date(this.year, 12, 0);
-        // don't calc over the start / end
-        if (firstDayOfYear.getTime() < this.options.start) {
-            firstDayOfYear = new Date(this.options.start);
-        }
-        if (lastDayOfYear.getTime() > this.options.end) {
-            lastDayOfYear = new Date(this.options.end);
-        }
-        // sets the range new
-        // checking whether the start is after firstDayOfYear
-        this.options.range_beg = firstDayOfYear.getTime() < this.options.start ? this.options.start : firstDayOfYear.getTime();
-        // checking whether the end is before lastDayOfYear
-        this.options.range_end = lastDayOfYear.getTime() > this.options.end ? this.options.end : lastDayOfYear.getTime();
-        // calcing the months
-        var monthCount = (this.findInitMonthNumber(firstDayOfYear) + this.countNextMonths);
-        this.calendarMonths = this.calSvc.createMonthsByPeriod(firstDayOfYear.getTime(), monthCount <= 1 ? 3 : monthCount, this._d);
-        // scrolling to the top
-        setTimeout(function () {
-            _this.content.scrollTo(0, 0, 128);
-        }, 300);
-    };
     CalendarModal.prototype._getDayTime = function (date) {
         return moment(moment(date).format('YYYY-MM-DD')).valueOf();
     };
+    CalendarModal.prototype._monthFormat = function (date) {
+        return moment(date).format('MMM YYYY');
+    };
     CalendarModal.decorators = [
         { type: Component, args: [{
                     selector: 'ion-calendar-modal',
-                    template: "\n    <ion-header>\n\n      <ion-navbar [color]=\"_color\">\n\n        <!--<ion-buttons start [hidden]=\"!showYearPicker\">-->\n        <!--<ion-select [(ngModel)]=\"year\" (ngModelChange)=\"changedYearSelection()\" interface=\"popover\">-->\n        <!--<ion-option *ngFor=\"let y of years\" value=\"{{y}}\">{{y}}</ion-option>-->\n        <!--</ion-select>-->\n        <!--</ion-buttons>-->\n\n        <ion-buttons start>\n          <button type='button' ion-button icon-only clear (click)=\"onCancel()\">\n            <span *ngIf=\"closeLabel !== '' && !closeIcon\">{{closeLabel}}</span>\n            <ion-icon *ngIf=\"closeIcon\" name=\"close\"></ion-icon>\n          </button>\n        </ion-buttons>\n\n        <ion-title>{{title}}</ion-title>\n\n        <ion-buttons end>\n          <button type='button' ion-button icon-only *ngIf=\"!_d.autoDone\" clear [disabled]=\"!canDone()\" (click)=\"done()\">\n            <span *ngIf=\"doneLabel !== '' && !doneIcon\">{{doneLabel}}</span>\n            <ion-icon *ngIf=\"doneIcon\" name=\"checkmark\"></ion-icon>\n          </button>\n\n        </ion-buttons>\n\n      </ion-navbar>\n\n      <ion-calendar-week\n        [color]=\"_color\"\n        [weekArray]=\"weekdays\"\n        [weekStart]=\"weekStart\">\n      </ion-calendar-week>\n\n    </ion-header>\n\n    <ion-content (ionScroll)=\"onScroll($event)\" class=\"calendar-page\"\n                 [ngClass]=\"{'multi-selection': options.pickMode === 'multi'}\">\n\n      <div #months>\n        <ng-template ngFor let-month [ngForOf]=\"calendarMonths\" [ngForTrackBy]=\"trackByTime\" let-i=\"index\">\n          <div class=\"month-box\" [attr.id]=\"'month-' + i\">\n            <h4 class=\"text-center month-title\">{{month.original.date | date:monthFormatFilterStr}}</h4>\n            <ion-calendar-month [month]=\"month\"\n                                [pickMode]=\"options.pickMode\"\n                                [isSaveHistory]=\"isSaveHistory\"\n                                [id]=\"_id\"\n                                [color]=\"_color\"\n                                (onChange)=\"onChange($event)\"\n                                [(ngModel)]=\"datesTemp\">\n\n            </ion-calendar-month>\n          </div>\n        </ng-template>\n\n      </div>\n\n      <ion-infinite-scroll (ionInfinite)=\"nextMonth($event)\">\n        <ion-infinite-scroll-content></ion-infinite-scroll-content>\n      </ion-infinite-scroll>\n\n    </ion-content>\n  ",
+                    template: "\n    <ion-header>\n      <ion-navbar [color]=\"_d.color\">\n\n        <ion-buttons start>\n          <button type='button' ion-button icon-only clear (click)=\"onCancel()\">\n            <span *ngIf=\"_d.closeLabel !== '' && !_d.closeIcon\">{{_d.closeLabel}}</span>\n            <ion-icon *ngIf=\"_d.closeIcon\" name=\"close\"></ion-icon>\n          </button>\n        </ion-buttons>\n\n        <ion-title>{{_d.title}}</ion-title>\n\n        <ion-buttons end>\n          <button type='button' ion-button icon-only *ngIf=\"!_d.autoDone\" clear [disabled]=\"!canDone()\" (click)=\"done()\">\n            <span *ngIf=\"_d.doneLabel !== '' && !_d.doneIcon\">{{_d.doneLabel}}</span>\n            <ion-icon *ngIf=\"_d.doneIcon\" name=\"checkmark\"></ion-icon>\n          </button>\n\n        </ion-buttons>\n\n      </ion-navbar>\n\n      <ion-calendar-week\n        [color]=\"_d.color\"\n        [weekArray]=\"_d.weekdays\"\n        [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n    </ion-header>\n\n    <ion-content (ionScroll)=\"onScroll($event)\" class=\"calendar-page\"\n                 [ngClass]=\"{'multi-selection': _d.pickMode === 'multi'}\">\n\n      <div #months>\n        <ng-template ngFor let-month [ngForOf]=\"calendarMonths\" [ngForTrackBy]=\"trackByTime\" let-i=\"index\">\n          <div class=\"month-box\" [attr.id]=\"'month-' + i\">\n            <h4 class=\"text-center month-title\">{{_monthFormat(month.original.date)}}</h4>\n            <ion-calendar-month [month]=\"month\"\n                                [pickMode]=\"_d.pickMode\"\n                                [isSaveHistory]=\"_d.isSaveHistory\"\n                                [id]=\"_d.id\"\n                                [color]=\"_d.color\"\n                                (onChange)=\"onChange($event)\"\n                                [(ngModel)]=\"datesTemp\">\n\n            </ion-calendar-month>\n          </div>\n        </ng-template>\n\n      </div>\n\n      <ion-infinite-scroll (ionInfinite)=\"nextMonth($event)\">\n        <ion-infinite-scroll-content></ion-infinite-scroll-content>\n      </ion-infinite-scroll>\n\n    </ion-content>\n  ",
                 },] },
@@ -285,0 +182,0 @@ ];

dist/components/calendar.modal.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"CalendarModal":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar-modal","template":"\n    <ion-header>\n\n      <ion-navbar [color]=\"_color\">\n\n        <!--<ion-buttons start [hidden]=\"!showYearPicker\">-->\n        <!--<ion-select [(ngModel)]=\"year\" (ngModelChange)=\"changedYearSelection()\" interface=\"popover\">-->\n        <!--<ion-option *ngFor=\"let y of years\" value=\"{{y}}\">{{y}}</ion-option>-->\n        <!--</ion-select>-->\n        <!--</ion-buttons>-->\n\n        <ion-buttons start>\n          <button type='button' ion-button icon-only clear (click)=\"onCancel()\">\n            <span *ngIf=\"closeLabel !== '' && !closeIcon\">{{closeLabel}}</span>\n            <ion-icon *ngIf=\"closeIcon\" name=\"close\"></ion-icon>\n          </button>\n        </ion-buttons>\n\n        <ion-title>{{title}}</ion-title>\n\n        <ion-buttons end>\n          <button type='button' ion-button icon-only *ngIf=\"!_d.autoDone\" clear [disabled]=\"!canDone()\" (click)=\"done()\">\n            <span *ngIf=\"doneLabel !== '' && !doneIcon\">{{doneLabel}}</span>\n            <ion-icon *ngIf=\"doneIcon\" name=\"checkmark\"></ion-icon>\n          </button>\n\n        </ion-buttons>\n\n      </ion-navbar>\n\n      <ion-calendar-week\n        [color]=\"_color\"\n        [weekArray]=\"weekdays\"\n        [weekStart]=\"weekStart\">\n      </ion-calendar-week>\n\n    </ion-header>\n\n    <ion-content (ionScroll)=\"onScroll($event)\" class=\"calendar-page\"\n                 [ngClass]=\"{'multi-selection': options.pickMode === 'multi'}\">\n\n      <div #months>\n        <ng-template ngFor let-month [ngForOf]=\"calendarMonths\" [ngForTrackBy]=\"trackByTime\" let-i=\"index\">\n          <div class=\"month-box\" [attr.id]=\"'month-' + i\">\n            <h4 class=\"text-center month-title\">{{month.original.date | date:monthFormatFilterStr}}</h4>\n            <ion-calendar-month [month]=\"month\"\n                                [pickMode]=\"options.pickMode\"\n                                [isSaveHistory]=\"isSaveHistory\"\n                                [id]=\"_id\"\n                                [color]=\"_color\"\n                                (onChange)=\"onChange($event)\"\n                                [(ngModel)]=\"datesTemp\">\n\n            </ion-calendar-month>\n          </div>\n        </ng-template>\n\n      </div>\n\n      <ion-infinite-scroll (ionInfinite)=\"nextMonth($event)\">\n        <ion-infinite-scroll-content></ion-infinite-scroll-content>\n      </ion-infinite-scroll>\n\n    </ion-content>\n  "}]}],"members":{"content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"ionic-angular","name":"Content"}]}]}],"monthsEle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["months"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"ionic-angular","name":"NavParams"},{"__symbolic":"reference","module":"ionic-angular","name":"ViewController"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"},{"__symbolic":"reference","module":"../services/calendar.service","name":"CalendarService"}]}],"ionViewDidLoad":[{"__symbolic":"method"}],"init":[{"__symbolic":"method"}],"initDefaultDate":[{"__symbolic":"method"}],"findCssClass":[{"__symbolic":"method"}],"onChange":[{"__symbolic":"method"}],"onCancel":[{"__symbolic":"method"}],"done":[{"__symbolic":"method"}],"canDone":[{"__symbolic":"method"}],"getHistory":[{"__symbolic":"method"}],"createYearPicker":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}],"backwardsMonth":[{"__symbolic":"method"}],"scrollToDefaultDate":[{"__symbolic":"method"}],"onScroll":[{"__symbolic":"method"}],"findInitMonthNumber":[{"__symbolic":"method"}],"changedYearSelection":[{"__symbolic":"method"}],"_getDayTime":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"CalendarModal":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar-modal","template":"\n    <ion-header>\n\n      <ion-navbar [color]=\"_color\">\n\n        <!--<ion-buttons start [hidden]=\"!showYearPicker\">-->\n        <!--<ion-select [(ngModel)]=\"year\" (ngModelChange)=\"changedYearSelection()\" interface=\"popover\">-->\n        <!--<ion-option *ngFor=\"let y of years\" value=\"{{y}}\">{{y}}</ion-option>-->\n        <!--</ion-select>-->\n        <!--</ion-buttons>-->\n\n        <ion-buttons start>\n          <button type='button' ion-button icon-only clear (click)=\"onCancel()\">\n            <span *ngIf=\"closeLabel !== '' && !closeIcon\">{{closeLabel}}</span>\n            <ion-icon *ngIf=\"closeIcon\" name=\"close\"></ion-icon>\n          </button>\n        </ion-buttons>\n\n        <ion-title>{{title}}</ion-title>\n\n        <ion-buttons end>\n          <button type='button' ion-button icon-only *ngIf=\"!_d.autoDone\" clear [disabled]=\"!canDone()\" (click)=\"done()\">\n            <span *ngIf=\"doneLabel !== '' && !doneIcon\">{{doneLabel}}</span>\n            <ion-icon *ngIf=\"doneIcon\" name=\"checkmark\"></ion-icon>\n          </button>\n\n        </ion-buttons>\n\n      </ion-navbar>\n\n      <ion-calendar-week\n        [color]=\"_color\"\n        [weekArray]=\"weekdays\"\n        [weekStart]=\"weekStart\">\n      </ion-calendar-week>\n\n    </ion-header>\n\n    <ion-content (ionScroll)=\"onScroll($event)\" class=\"calendar-page\"\n                 [ngClass]=\"{'multi-selection': options.pickMode === 'multi'}\">\n\n      <div #months>\n        <ng-template ngFor let-month [ngForOf]=\"calendarMonths\" [ngForTrackBy]=\"trackByTime\" let-i=\"index\">\n          <div class=\"month-box\" [attr.id]=\"'month-' + i\">\n            <h4 class=\"text-center month-title\">{{month.original.date | date:monthFormatFilterStr}}</h4>\n            <ion-calendar-month [month]=\"month\"\n                                [pickMode]=\"options.pickMode\"\n                                [isSaveHistory]=\"isSaveHistory\"\n                                [id]=\"_id\"\n                                [color]=\"_color\"\n                                (onChange)=\"onChange($event)\"\n                                [(ngModel)]=\"datesTemp\">\n\n            </ion-calendar-month>\n          </div>\n        </ng-template>\n\n      </div>\n\n      <ion-infinite-scroll (ionInfinite)=\"nextMonth($event)\">\n        <ion-infinite-scroll-content></ion-infinite-scroll-content>\n      </ion-infinite-scroll>\n\n    </ion-content>\n  "}]}],"members":{"content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"ionic-angular","name":"Content"}]}]}],"monthsEle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["months"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"ionic-angular","name":"NavParams"},{"__symbolic":"reference","module":"ionic-angular","name":"ViewController"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"},{"__symbolic":"reference","module":"../services/calendar.service","name":"CalendarService"}]}],"ionViewDidLoad":[{"__symbolic":"method"}],"init":[{"__symbolic":"method"}],"initDefaultDate":[{"__symbolic":"method"}],"findCssClass":[{"__symbolic":"method"}],"onChange":[{"__symbolic":"method"}],"onCancel":[{"__symbolic":"method"}],"done":[{"__symbolic":"method"}],"canDone":[{"__symbolic":"method"}],"getHistory":[{"__symbolic":"method"}],"createYearPicker":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}],"backwardsMonth":[{"__symbolic":"method"}],"scrollToDefaultDate":[{"__symbolic":"method"}],"onScroll":[{"__symbolic":"method"}],"findInitMonthNumber":[{"__symbolic":"method"}],"changedYearSelection":[{"__symbolic":"method"}],"_getDayTime":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"CalendarModal":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar-modal","template":"\n    <ion-header>\n      <ion-navbar [color]=\"_d.color\">\n\n        <ion-buttons start>\n          <button type='button' ion-button icon-only clear (click)=\"onCancel()\">\n            <span *ngIf=\"_d.closeLabel !== '' && !_d.closeIcon\">{{_d.closeLabel}}</span>\n            <ion-icon *ngIf=\"_d.closeIcon\" name=\"close\"></ion-icon>\n          </button>\n        </ion-buttons>\n\n        <ion-title>{{_d.title}}</ion-title>\n\n        <ion-buttons end>\n          <button type='button' ion-button icon-only *ngIf=\"!_d.autoDone\" clear [disabled]=\"!canDone()\" (click)=\"done()\">\n            <span *ngIf=\"_d.doneLabel !== '' && !_d.doneIcon\">{{_d.doneLabel}}</span>\n            <ion-icon *ngIf=\"_d.doneIcon\" name=\"checkmark\"></ion-icon>\n          </button>\n\n        </ion-buttons>\n\n      </ion-navbar>\n\n      <ion-calendar-week\n        [color]=\"_d.color\"\n        [weekArray]=\"_d.weekdays\"\n        [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n    </ion-header>\n\n    <ion-content (ionScroll)=\"onScroll($event)\" class=\"calendar-page\"\n                 [ngClass]=\"{'multi-selection': _d.pickMode === 'multi'}\">\n\n      <div #months>\n        <ng-template ngFor let-month [ngForOf]=\"calendarMonths\" [ngForTrackBy]=\"trackByTime\" let-i=\"index\">\n          <div class=\"month-box\" [attr.id]=\"'month-' + i\">\n            <h4 class=\"text-center month-title\">{{_monthFormat(month.original.date)}}</h4>\n            <ion-calendar-month [month]=\"month\"\n                                [pickMode]=\"_d.pickMode\"\n                                [isSaveHistory]=\"_d.isSaveHistory\"\n                                [id]=\"_d.id\"\n                                [color]=\"_d.color\"\n                                (onChange)=\"onChange($event)\"\n                                [(ngModel)]=\"datesTemp\">\n\n            </ion-calendar-month>\n          </div>\n        </ng-template>\n\n      </div>\n\n      <ion-infinite-scroll (ionInfinite)=\"nextMonth($event)\">\n        <ion-infinite-scroll-content></ion-infinite-scroll-content>\n      </ion-infinite-scroll>\n\n    </ion-content>\n  "}]}],"members":{"content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"ionic-angular","name":"Content"}]}]}],"monthsEle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["months"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"ionic-angular","name":"NavParams"},{"__symbolic":"reference","module":"ionic-angular","name":"ViewController"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"},{"__symbolic":"reference","module":"../services/calendar.service","name":"CalendarService"}]}],"ionViewDidLoad":[{"__symbolic":"method"}],"init":[{"__symbolic":"method"}],"initDefaultDate":[{"__symbolic":"method"}],"findCssClass":[{"__symbolic":"method"}],"onChange":[{"__symbolic":"method"}],"onCancel":[{"__symbolic":"method"}],"done":[{"__symbolic":"method"}],"canDone":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}],"backwardsMonth":[{"__symbolic":"method"}],"scrollToDefaultDate":[{"__symbolic":"method"}],"onScroll":[{"__symbolic":"method"}],"findInitMonthNumber":[{"__symbolic":"method"}],"_getDayTime":[{"__symbolic":"method"}],"_monthFormat":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"CalendarModal":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar-modal","template":"\n    <ion-header>\n      <ion-navbar [color]=\"_d.color\">\n\n        <ion-buttons start>\n          <button type='button' ion-button icon-only clear (click)=\"onCancel()\">\n            <span *ngIf=\"_d.closeLabel !== '' && !_d.closeIcon\">{{_d.closeLabel}}</span>\n            <ion-icon *ngIf=\"_d.closeIcon\" name=\"close\"></ion-icon>\n          </button>\n        </ion-buttons>\n\n        <ion-title>{{_d.title}}</ion-title>\n\n        <ion-buttons end>\n          <button type='button' ion-button icon-only *ngIf=\"!_d.autoDone\" clear [disabled]=\"!canDone()\" (click)=\"done()\">\n            <span *ngIf=\"_d.doneLabel !== '' && !_d.doneIcon\">{{_d.doneLabel}}</span>\n            <ion-icon *ngIf=\"_d.doneIcon\" name=\"checkmark\"></ion-icon>\n          </button>\n\n        </ion-buttons>\n\n      </ion-navbar>\n\n      <ion-calendar-week\n        [color]=\"_d.color\"\n        [weekArray]=\"_d.weekdays\"\n        [weekStart]=\"_d.weekStart\">\n      </ion-calendar-week>\n\n    </ion-header>\n\n    <ion-content (ionScroll)=\"onScroll($event)\" class=\"calendar-page\"\n                 [ngClass]=\"{'multi-selection': _d.pickMode === 'multi'}\">\n\n      <div #months>\n        <ng-template ngFor let-month [ngForOf]=\"calendarMonths\" [ngForTrackBy]=\"trackByTime\" let-i=\"index\">\n          <div class=\"month-box\" [attr.id]=\"'month-' + i\">\n            <h4 class=\"text-center month-title\">{{_monthFormat(month.original.date)}}</h4>\n            <ion-calendar-month [month]=\"month\"\n                                [pickMode]=\"_d.pickMode\"\n                                [isSaveHistory]=\"_d.isSaveHistory\"\n                                [id]=\"_d.id\"\n                                [color]=\"_d.color\"\n                                (onChange)=\"onChange($event)\"\n                                [(ngModel)]=\"datesTemp\">\n\n            </ion-calendar-month>\n          </div>\n        </ng-template>\n\n      </div>\n\n      <ion-infinite-scroll (ionInfinite)=\"nextMonth($event)\">\n        <ion-infinite-scroll-content></ion-infinite-scroll-content>\n      </ion-infinite-scroll>\n\n    </ion-content>\n  "}]}],"members":{"content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"ionic-angular","name":"Content"}]}]}],"monthsEle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["months"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer"},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"ionic-angular","name":"NavParams"},{"__symbolic":"reference","module":"ionic-angular","name":"ViewController"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"},{"__symbolic":"reference","module":"../services/calendar.service","name":"CalendarService"}]}],"ionViewDidLoad":[{"__symbolic":"method"}],"init":[{"__symbolic":"method"}],"initDefaultDate":[{"__symbolic":"method"}],"findCssClass":[{"__symbolic":"method"}],"onChange":[{"__symbolic":"method"}],"onCancel":[{"__symbolic":"method"}],"done":[{"__symbolic":"method"}],"canDone":[{"__symbolic":"method"}],"nextMonth":[{"__symbolic":"method"}],"backwardsMonth":[{"__symbolic":"method"}],"scrollToDefaultDate":[{"__symbolic":"method"}],"onScroll":[{"__symbolic":"method"}],"findInitMonthNumber":[{"__symbolic":"method"}],"_getDayTime":[{"__symbolic":"method"}],"_monthFormat":[{"__symbolic":"method"}]}}}}]

dist/components/month-picker.component.js

 import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { defaults } from "../config";
 var MonthPickerComponent = /** @class */ (function () {
     function MonthPickerComponent() {
-        this.color = 'primary';
+        this.color = defaults.COLOR;
         this.onSelect = new EventEmitter();
         this._thisMonth = new Date();
-        this._monthFormat = ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'];
+        this._monthFormat = defaults.MONTH_FORMAT;
     }
@@ -9,0 +10,0 @@ Object.defineProperty(MonthPickerComponent.prototype, "monthFormat", {

dist/components/month.component.d.ts

@@ -18,2 +18,3 @@ import { ChangeDetectorRef, EventEmitter, AfterViewInit } from '@angular/core';
     _onTouched: Function;
+    readonly _isRange: boolean;
     constructor(ref: ChangeDetectorRef);
@@ -20,0 +21,0 @@ ngAfterViewInit(): void;

dist/components/month.component.js

 import { Component, ChangeDetectorRef, Input, Output, EventEmitter, forwardRef, } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { defaults, pickModes } from "../config";
 export var MONTH_VALUE_ACCESSOR = {
@@ -12,3 +13,3 @@ provide: NG_VALUE_ACCESSOR,
         this.readonly = false;
-        this.color = 'primary';
+        this.color = defaults.COLOR;
         this.onChange = new EventEmitter();
@@ -18,2 +19,9 @@ this._date = [null, null];
     }
+    Object.defineProperty(MonthComponent.prototype, "_isRange", {
+        get: function () {
+            return this.pickMode === pickModes.RANGE;
+        },
+        enumerable: true,
+        configurable: true
+    });
     MonthComponent.prototype.ngAfterViewInit = function () {
@@ -39,3 +47,3 @@ this._isInit = true;
             return false;
-        if (this.pickMode !== 'range' || !this._isInit || this._date[1] === null) {
+        if (this.pickMode !== pickModes.RANGE || !this._isInit || this._date[1] === null) {
             return false;
@@ -48,3 +56,3 @@ }
             return false;
-        if (this.pickMode !== 'range' || !this._isInit) {
+        if (this.pickMode !== pickModes.RANGE || !this._isInit) {
             return false;
@@ -62,3 +70,3 @@ }
             return false;
-        if (this.pickMode !== 'range' || !this._isInit || this._date[0] === null) {
+        if (this.pickMode !== pickModes.RANGE || !this._isInit || this._date[0] === null) {
             return false;
@@ -70,3 +78,3 @@ }
         if (Array.isArray(this._date)) {
-            if (this.pickMode !== 'multi') {
+            if (this.pickMode !== pickModes.MULTI) {
                 if (this._date[0] !== null) {
@@ -91,3 +99,3 @@ return time === this._date[0].time;
         item.selected = true;
-        if (this.pickMode === 'single') {
+        if (this.pickMode === pickModes.SINGLE) {
             this._date[0] = item;
@@ -97,3 +105,3 @@ this.onChange.emit(this._date);
         }
-        if (this.pickMode === 'range') {
+        if (this.pickMode === pickModes.RANGE) {
             if (this._date[0] === null) {
@@ -118,3 +126,3 @@ this._date[0] = item;
         }
-        if (this.pickMode === 'multi') {
+        if (this.pickMode === pickModes.MULTI) {
             var index = this._date.findIndex(function (e) { return e !== null && e.time === item.time; });
@@ -134,3 +142,3 @@ if (index === -1) {
                     providers: [MONTH_VALUE_ACCESSOR],
-                    template: "\n    <div [class]=\"color\">\n      <ng-template [ngIf]=\"pickMode !== 'range'\" [ngIfElse]=\"rangeBox\">\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n\n      <ng-template #rangeBox>\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\"\n                 [class.startSelection]=\"isStartSelection(day)\"\n                 [class.endSelection]=\"isEndSelection(day)\"\n                 [class.between]=\"isBetween(day)\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n    </div>\n  ",
+                    template: "\n    <div [class]=\"color\">\n      <ng-template [ngIf]=\"!_isRange\" [ngIfElse]=\"rangeBox\">\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n\n      <ng-template #rangeBox>\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\"\n                 [class.startSelection]=\"isStartSelection(day)\"\n                 [class.endSelection]=\"isEndSelection(day)\"\n                 [class.between]=\"isBetween(day)\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n    </div>\n  ",
                 },] },
@@ -137,0 +145,0 @@ ];

dist/components/month.component.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"MONTH_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"MonthComponent"},"multi":true},"MonthComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar-month","providers":[{"__symbolic":"reference","name":"MONTH_VALUE_ACCESSOR"}],"template":"\n    <div [class]=\"color\">\n      <ng-template [ngIf]=\"pickMode !== 'range'\" [ngIfElse]=\"rangeBox\">\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n\n      <ng-template #rangeBox>\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\"\n                 [class.startSelection]=\"isStartSelection(day)\"\n                 [class.endSelection]=\"isEndSelection(day)\"\n                 [class.between]=\"isBetween(day)\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n    </div>\n  "}]}],"members":{"month":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"pickMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"isSaveHistory":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"trackByTime":[{"__symbolic":"method"}],"isEndSelection":[{"__symbolic":"method"}],"isBetween":[{"__symbolic":"method"}],"isStartSelection":[{"__symbolic":"method"}],"isSelected":[{"__symbolic":"method"}],"onSelected":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"MONTH_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"MonthComponent"},"multi":true},"MonthComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar-month","providers":[{"__symbolic":"reference","name":"MONTH_VALUE_ACCESSOR"}],"template":"\n    <div [class]=\"color\">\n      <ng-template [ngIf]=\"pickMode !== 'range'\" [ngIfElse]=\"rangeBox\">\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n\n      <ng-template #rangeBox>\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\"\n                 [class.startSelection]=\"isStartSelection(day)\"\n                 [class.endSelection]=\"isEndSelection(day)\"\n                 [class.between]=\"isBetween(day)\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n    </div>\n  "}]}],"members":{"month":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"pickMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"isSaveHistory":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"trackByTime":[{"__symbolic":"method"}],"isEndSelection":[{"__symbolic":"method"}],"isBetween":[{"__symbolic":"method"}],"isStartSelection":[{"__symbolic":"method"}],"isSelected":[{"__symbolic":"method"}],"onSelected":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"MONTH_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"MonthComponent"},"multi":true},"MonthComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar-month","providers":[{"__symbolic":"reference","name":"MONTH_VALUE_ACCESSOR"}],"template":"\n    <div [class]=\"color\">\n      <ng-template [ngIf]=\"!_isRange\" [ngIfElse]=\"rangeBox\">\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n\n      <ng-template #rangeBox>\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\"\n                 [class.startSelection]=\"isStartSelection(day)\"\n                 [class.endSelection]=\"isEndSelection(day)\"\n                 [class.between]=\"isBetween(day)\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n    </div>\n  "}]}],"members":{"month":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"pickMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"isSaveHistory":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"trackByTime":[{"__symbolic":"method"}],"isEndSelection":[{"__symbolic":"method"}],"isBetween":[{"__symbolic":"method"}],"isStartSelection":[{"__symbolic":"method"}],"isSelected":[{"__symbolic":"method"}],"onSelected":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"MONTH_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR"},"useExisting":{"__symbolic":"reference","name":"MonthComponent"},"multi":true},"MonthComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"ion-calendar-month","providers":[{"__symbolic":"reference","name":"MONTH_VALUE_ACCESSOR"}],"template":"\n    <div [class]=\"color\">\n      <ng-template [ngIf]=\"!_isRange\" [ngIfElse]=\"rangeBox\">\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n\n      <ng-template #rangeBox>\n        <div class=\"days-box\">\n          <ng-template ngFor let-day [ngForOf]=\"month.days\" [ngForTrackBy]=\"trackByTime\">\n            <div class=\"days\"\n                 [class.startSelection]=\"isStartSelection(day)\"\n                 [class.endSelection]=\"isEndSelection(day)\"\n                 [class.between]=\"isBetween(day)\">\n              <ng-container *ngIf=\"day\">\n                <button type='button'\n                        [class]=\"'days-btn ' + day.cssClass\"\n                        [class.today]=\"day.isToday\"\n                        (click)=\"onSelected(day)\"\n                        [class.marked]=\"day.marked\"\n                        [class.on-selected]=\"isSelected(day.time)\"\n                        [disabled]=\"day.disable\">\n                  <p>{{day.title}}</p>\n                  <small *ngIf=\"day.subTitle\">{{day?.subTitle}}</small>\n                </button>\n              </ng-container>\n\n            </div>\n          </ng-template>\n        </div>\n      </ng-template>\n    </div>\n  "}]}],"members":{"month":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"pickMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"isSaveHistory":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef"}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"trackByTime":[{"__symbolic":"method"}],"isEndSelection":[{"__symbolic":"method"}],"isBetween":[{"__symbolic":"method"}],"isStartSelection":[{"__symbolic":"method"}],"isSelected":[{"__symbolic":"method"}],"onSelected":[{"__symbolic":"method"}]}}}}]

dist/services/calendar.service.d.ts

@@ -10,6 +10,4 @@ import { CalendarOriginal, CalendarDay, CalendarMonth, CalendarModalOptions, CalendarResult } from '../calendar.model';
     createMonthsByPeriod(startTime: number, monthsNum: number, opt: CalendarModalOptions): Array<CalendarMonth>;
-    getHistory(id: string | number): Array<CalendarDay | null>;
-    savedHistory(savedDates: Array<CalendarDay | null>, id: string | number): void;
     wrapResult(original: CalendarDay[], pickMode: string): any;
     multiFormat(time: number): CalendarResult;
 }

dist/services/calendar.service.js

 import { Injectable } from '@angular/core';
 import { isBoolean } from "ionic-angular/util/util";
 import * as moment from 'moment';
+import { defaults, pickModes } from "../config";
 var CalendarService = /** @class */ (function () {
@@ -10,12 +11,12 @@ function CalendarService() {
         var _daysConfig = [];
-        var _a = calendarOptions || {}, _b = _a.autoDone, autoDone = _b === void 0 ? false : _b, _c = _a.from, from = _c === void 0 ? new Date() : _c, _d = _a.to, to = _d === void 0 ? 0 : _d, _e = _a.cssClass, cssClass = _e === void 0 ? '' : _e, _f = _a.weekStart, weekStart = _f === void 0 ? 0 : _f, _g = _a.canBackwardsSelected, canBackwardsSelected = _g === void 0 ? false : _g, _h = _a.disableWeeks, disableWeeks = _h === void 0 ? _disableWeeks : _h, _j = _a.closeLabel, closeLabel = _j === void 0 ? 'CANCEL' : _j, _k = _a.closeIcon, closeIcon = _k === void 0 ? false : _k, _l = _a.doneLabel, doneLabel = _l === void 0 ? 'DONE' : _l, _m = _a.doneIcon, doneIcon = _m === void 0 ? false : _m, _o = _a.id, id = _o === void 0 ? '' : _o, _p = _a.pickMode, pickMode = _p === void 0 ? 'single' : _p, _q = _a.color, color = _q === void 0 ? 'primary' : _q, _r = _a.isSaveHistory, isSaveHistory = _r === void 0 ? false : _r, _s = _a.monthFormat, monthFormat = _s === void 0 ? 'MMM yyyy' : _s, _t = _a.title, title = _t === void 0 ? 'CALENDAR' : _t, _u = _a.defaultTitle, defaultTitle = _u === void 0 ? '' : _u, _v = _a.defaultSubtitle, defaultSubtitle = _v === void 0 ? '' : _v, _w = _a.weekdays, weekdays = _w === void 0 ? ['S', 'M', 'T', 'W', 'T', 'F', 'S'] : _w, _x = _a.daysConfig, daysConfig = _x === void 0 ? _daysConfig : _x, _y = _a.countNextMonths, countNextMonths = _y === void 0 ? 3 : _y, _z = _a.showYearPicker, showYearPicker = _z === void 0 ? false : _z;
+        var _a = calendarOptions || {}, _b = _a.from, from = _b === void 0 ? new Date() : _b, _c = _a.to, to = _c === void 0 ? 0 : _c, _d = _a.weekStart, weekStart = _d === void 0 ? 0 : _d, _e = _a.step, step = _e === void 0 ? 3 : _e, _f = _a.id, id = _f === void 0 ? '' : _f, _g = _a.cssClass, cssClass = _g === void 0 ? '' : _g, _h = _a.closeLabel, closeLabel = _h === void 0 ? 'CANCEL' : _h, _j = _a.doneLabel, doneLabel = _j === void 0 ? 'DONE' : _j, _k = _a.monthFormat, monthFormat = _k === void 0 ? 'MMM yyyy' : _k, _l = _a.title, title = _l === void 0 ? 'CALENDAR' : _l, _m = _a.defaultTitle, defaultTitle = _m === void 0 ? '' : _m, _o = _a.defaultSubtitle, defaultSubtitle = _o === void 0 ? '' : _o, _p = _a.autoDone, autoDone = _p === void 0 ? false : _p, _q = _a.canBackwardsSelected, canBackwardsSelected = _q === void 0 ? false : _q, _r = _a.closeIcon, closeIcon = _r === void 0 ? false : _r, _s = _a.doneIcon, doneIcon = _s === void 0 ? false : _s, _t = _a.showYearPicker, showYearPicker = _t === void 0 ? false : _t, _u = _a.isSaveHistory, isSaveHistory = _u === void 0 ? false : _u, _v = _a.pickMode, pickMode = _v === void 0 ? pickModes.SINGLE : _v, _w = _a.color, color = _w === void 0 ? defaults.COLOR : _w, _x = _a.weekdays, weekdays = _x === void 0 ? defaults.WEEKS_FORMAT : _x, _y = _a.daysConfig, daysConfig = _y === void 0 ? _daysConfig : _y, _z = _a.disableWeeks, disableWeeks = _z === void 0 ? _disableWeeks : _z;
         return {
-            defaultTitle: defaultTitle,
-            defaultSubtitle: defaultSubtitle,
-            autoDone: autoDone,
+            id: id,
             from: from,
             to: to,
+            pickMode: pickMode,
+            autoDone: autoDone,
+            color: color,
             cssClass: cssClass,
             weekStart: weekStart,
-            canBackwardsSelected: canBackwardsSelected,
             closeLabel: closeLabel,
@@ -25,10 +26,4 @@ closeIcon: closeIcon,
             doneIcon: doneIcon,
-            id: id,
-            pickMode: pickMode,
-            color: color,
+            canBackwardsSelected: canBackwardsSelected,
             isSaveHistory: isSaveHistory,
-            defaultScrollTo: calendarOptions.defaultScrollTo || from,
-            defaultDate: calendarOptions.defaultDate || null,
-            defaultDates: calendarOptions.defaultDates || null,
-            defaultDateRange: calendarOptions.defaultDateRange || null,
             disableWeeks: disableWeeks,
@@ -39,4 +34,10 @@ monthFormat: monthFormat,
             daysConfig: daysConfig,
-            countNextMonths: countNextMonths,
+            step: step,
             showYearPicker: showYearPicker,
+            defaultTitle: defaultTitle,
+            defaultSubtitle: defaultSubtitle,
+            defaultScrollTo: calendarOptions.defaultScrollTo || from,
+            defaultDate: calendarOptions.defaultDate || null,
+            defaultDates: calendarOptions.defaultDates || null,
+            defaultDateRange: calendarOptions.defaultDateRange || null,
         };
@@ -51,4 +52,2 @@ };
         return {
-            time: time,
-            date: new Date(time),
             year: year,
@@ -58,2 +57,4 @@ month: month,
             howManyDays: howManyDays,
+            time: time,
+            date: new Date(time),
         };
@@ -141,4 +142,4 @@ };
         return {
+            days: days,
             original: original,
-            days: days,
         };
@@ -157,16 +158,2 @@ };
     };
-    CalendarService.prototype.getHistory = function (id) {
-        var _savedDatesCache = localStorage.getItem("ion-calendar-" + id);
-        var _savedDates;
-        if (_savedDatesCache === 'undefined' || _savedDatesCache === 'null' || !_savedDatesCache) {
-            _savedDates = [null, null];
-        }
-        else {
-            _savedDates = JSON.parse(_savedDatesCache);
-        }
-        return _savedDates;
-    };
-    CalendarService.prototype.savedHistory = function (savedDates, id) {
-        localStorage.setItem("ion-calendar-" + id, JSON.stringify(savedDates));
-    };
     CalendarService.prototype.wrapResult = function (original, pickMode) {
@@ -176,6 +163,6 @@ var _this = this;
         switch (pickMode) {
-            case 'single':
+            case pickModes.SINGLE:
                 result = this.multiFormat(original[0].time);
                 break;
-            case 'range':
+            case pickModes.RANGE:
                 result = {
@@ -186,3 +173,3 @@ from: this.multiFormat(original[0].time),
                 break;
-            case 'multi':
+            case pickModes.MULTI:
                 result = original.map(function (e) { return _this.multiFormat(e.time); });
@@ -201,3 +188,3 @@ break;
             dateObj: _moment.toDate(),
-            string: _moment.format('YYYY-MM-DD'),
+            string: _moment.format(defaults.DATE_FORMAT),
             years: _moment.year(),
@@ -204,0 +191,0 @@ months: _moment.month() + 1,

dist/services/calendar.service.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"CalendarService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"safeOpt":[{"__symbolic":"method"}],"createOriginalCalendar":[{"__symbolic":"method"}],"findDayConfig":[{"__symbolic":"method"}],"createCalendarDay":[{"__symbolic":"method"}],"createCalendarMonth":[{"__symbolic":"method"}],"createMonthsByPeriod":[{"__symbolic":"method"}],"getHistory":[{"__symbolic":"method"}],"savedHistory":[{"__symbolic":"method"}],"wrapResult":[{"__symbolic":"method"}],"multiFormat":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"CalendarService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"safeOpt":[{"__symbolic":"method"}],"createOriginalCalendar":[{"__symbolic":"method"}],"findDayConfig":[{"__symbolic":"method"}],"createCalendarDay":[{"__symbolic":"method"}],"createCalendarMonth":[{"__symbolic":"method"}],"createMonthsByPeriod":[{"__symbolic":"method"}],"getHistory":[{"__symbolic":"method"}],"savedHistory":[{"__symbolic":"method"}],"wrapResult":[{"__symbolic":"method"}],"multiFormat":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"CalendarService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"safeOpt":[{"__symbolic":"method"}],"createOriginalCalendar":[{"__symbolic":"method"}],"findDayConfig":[{"__symbolic":"method"}],"createCalendarDay":[{"__symbolic":"method"}],"createCalendarMonth":[{"__symbolic":"method"}],"createMonthsByPeriod":[{"__symbolic":"method"}],"wrapResult":[{"__symbolic":"method"}],"multiFormat":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"CalendarService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"safeOpt":[{"__symbolic":"method"}],"createOriginalCalendar":[{"__symbolic":"method"}],"findDayConfig":[{"__symbolic":"method"}],"createCalendarDay":[{"__symbolic":"method"}],"createCalendarMonth":[{"__symbolic":"method"}],"createMonthsByPeriod":[{"__symbolic":"method"}],"wrapResult":[{"__symbolic":"method"}],"multiFormat":[{"__symbolic":"method"}]}}}}]

package.json

 {
   "name": "ion2-calendar",
-  "version": "2.0.11",
+  "version": "2.1.0",
   "description": "A date picker component for ionic2 ",
@@ -10,6 +10,5 @@ "main": "./dist/index.js",
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "rm -rf aot dist src && gulp dev2src && npm run ngc && gulp copy-scss",
-    "build:demo": "npm run build && gulp dist2nm",
-    "start:s": "cd ./demo && npm run ionic:server",
-    "lint": "./node_modules/.bin/tslint -c tslint.json src/**/*.ts"
+    "clear": "rm -rf aot _temp",
+    "build": "npm run lint && rm -rf dist && npm run clear && gulp src2temp && npm run ngc && gulp copy-scss && npm run clear",
+    "lint": "tslint -c tslint.json src/src/components/**/*.ts"
   },
@@ -16,0 +15,0 @@ "repository": {

README-CN.md

@@ -18,2 +18,6 @@ # 📅 ion2-calendar
 
+# 支持
+
+- ionic-angular `^3.0.0`
+
 # Demo
@@ -20,0 +24,0 @@ live demo [click me](https://hsuanxyz.github.io/demo/ion2-calendar/).

README.md

@@ -22,2 +22,6 @@ # 📅 ion2-calendar
 
+# Support
+
+- ionic-angular `^3.0.0`
+
 # Demo
@@ -24,0 +28,0 @@ live demo [click me](https://hsuanxyz.github.io/demo/ion2-calendar/).

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Number of package files

60

increased by7.14%

Number of lines in readme file

457

increased by0.88%

Worsened metrics

Total package byte prevSize

173686

decreased by-5.07%

Lines of code

1476

decreased by-4.96%

No dependency changes