npm - @anglr/datetime - Versions diffs - 5.0.0-beta.20221020045240 → 5.0.0-beta.20221020100553 - Mend

@anglr/datetime 5.0.0-beta.20221020045240 → 5.0.0-beta.20221020100553

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (57) hide show

package/es2020/src/legacy/picker/components/dayPicker/dayPicker.component.js CHANGED Viewed

@@ -148,7 +148,8 @@ export class DateTimeDayPickerComponent extends PickerBaseComponent {
                     otherMonth: otherMonth,
                     today: this.displayDate.isSameDay(today),
                     weekend: this.displayDate.isWeekend(),
-                    day: day
+                    day: day,
+                    dateObj: this.displayDate.clone(),
                 };
                 this.periodData.push(data);
                 if (!otherMonth) {

package/es2020/src/legacy/picker/components/dayPicker/dayPicker.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dayPicker.component.js","sourceRoot":"","sources":["../../../../../../src/legacy/picker/components/dayPicker/dayPicker.component.ts","../../../../../../src/legacy/picker/components/dayPicker/dayPicker.component.html"],"names":[],"mappings":"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","sourcesContent":["import {Component, ChangeDetectionStrategy, Inject, ChangeDetectorRef} from '@angular/core';\nimport {extend} from '@jscrpt/common';\n\nimport {DateTimeValue} from '../../../../interfaces/dateTime/datetime.interface';\nimport {DATE_API} from '../../../../misc/tokens';\nimport {DateApi, DateApiObject} from '../../../../services/dateApi/dateApi.interface';\nimport {DateTimeLegacyPicker, DayData, PeriodData} from '../../misc/datetimePicker.interface';\nimport {PickerBaseComponent} from '../pickerBase.component';\nimport {DayPickerCssClasses} from './dayPicker.interfaces';\n\n/*\n Default styles for picker\n /\nconst defaultStyles: DayPickerCssClasses =\n{\n periodSelection: 'period',\n previousPeriod: 'fas fa-angle-left clickable',\n nextPeriod: 'fas fa-angle-right clickable',\n periodValue: 'period-value',\n periodData: 'period-data',\n periodDatum: 'period-datum clickable',\n weekdayName: 'weekday',\n clickable: 'clickable'\n};\n\n/\n Component used for displaying day picker\n /\n@Component(\n{\n selector: 'date-time-day-picker',\n templateUrl: 'dayPicker.component.html',\n styleUrls: ['dayPicker.component.css'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class DateTimeDayPickerComponent<TDate = any> extends PickerBaseComponent<TDate, DayData<TDate>, DayPickerCssClasses> implements DateTimeLegacyPicker<TDate, DayPickerCssClasses>\n{\n //######################### protected fields #########################\n\n /\n Stored this picker month data\n /\n protected _thisMonthData: DayData<TDate>[] = [];\n\n //######################### public properties - template bindings #########################\n\n /\n Names of days\n * @internal\n /\n public weekdays: string[] = [];\n\n /\n Value used for displaying time\n /\n public get timeValue(): DateTimeValue<TDate> \| null\n {\n return this._value;\n }\n\n //######################### constructor #########################\n constructor(@Inject(DATE_API) dateApi: DateApi<TDate>,\n changeDetector: ChangeDetectorRef)\n {\n super(dateApi, changeDetector);\n\n this.cssClasses = extend(true, {}, defaultStyles);\n this.weekdays = this._dateApi.weekdaysShort();\n }\n\n //######################### public methods - template bindings #########################\n\n /\n Changes displayed period to \"lower\" period\n * @param event - Event that occured\n * @internal\n /\n public goDown(event: Event): void\n {\n event.preventDefault();\n\n if(!this.canGoDown)\n {\n return;\n }\n\n if(this.displayDate)\n {\n this._scaleDown.next(this.displayDate.value);\n }\n }\n\n /\n Changes displayed month to next month\n * @param event - Event that occured\n * @internal\n /\n public nextMonth(event: Event): void\n {\n event.preventDefault();\n this.displayDate!.addMonths(1);\n\n this.display(this.displayDate!);\n }\n\n /\n Changes displayed month to previous month\n * @param event - Event that occured\n * @internal\n /\n public previousMonth(event: Event): void\n {\n event.preventDefault();\n this.displayDate!.subtractMonths(1);\n\n this.display(this.displayDate!);\n }\n\n /\n Selects day\n * @param event - Event that occured\n * @param day - Selects day \n * @internal\n /\n public override select(event: Event, day: DayData<TDate>): void\n {\n event.preventDefault();\n\n if(day.disabled)\n {\n return;\n }\n\n this._setPeriod(day);\n\n //when time picker is enabled\n if(this.canGoDown)\n {\n const from = this._dateApi\n .getValue(day.date)\n .hour(this._originalHour)\n .minute(this._originalMinute);\n\n const to = this._dateApi\n .getValue(this._endOfPeriod(day))\n .hour(this._originalHour)\n .minute(this._originalMinute);\n\n this._value =\n {\n from: from.value,\n to: to.value\n };\n }\n //no time picker\n else\n {\n this._value =\n {\n from: day.date,\n to: this._endOfPeriod(day)\n };\n }\n \n this._valueChange.next();\n\n if(day.otherMonth)\n {\n this.display(this._dateApi.getValue(day.date));\n }\n }\n\n //######################### public methods - implementation of DateTimePicker #########################\n\n /\n Set displays date to be displayed\n * @param value - Value that identifies period that is going to be displayed\n /\n public display(value: DateApiObject<TDate>): void\n {\n this.displayDate = value;\n this.periodData = [];\n this._thisMonthData = [];\n const currentMonthDate = this.displayDate.value;\n const today = this._dateApi.now().value;\n\n this.displayDate\n .startOfMonth()\n .updateOriginal()\n .startOfWeek();\n\n do\n {\n for(let x = 0; x < 7; x++)\n {\n const day = this.displayDate.dayOfMonth();\n const otherMonth = !this.displayDate.isSameMonth(currentMonthDate);\n const data = \n {\n active: false,\n disabled: false,\n date: this.displayDate.value,\n otherMonth: otherMonth,\n today: this.displayDate.isSameDay(today),\n weekend: this.displayDate.isWeekend(),\n day: day\n };\n\n this.periodData.push(data);\n\n if(!otherMonth)\n {\n this._thisMonthData.push(data);\n }\n\n this.displayDate.addDays(1);\n }\n }\n while(this.displayDate.isSameMonth(currentMonthDate));\n\n this.displayDate.resetOriginal();\n\n //can go down set minutes and hours\n if(this.canGoDown)\n {\n this.displayDate\n .minute(this._originalMinute)\n .hour(this._originalHour);\n }\n\n this._updateMinMax();\n\n //set value if exists\n if(this._value && (this.displayDate.isSameMonth(this._value.from!) \|\| this.displayDate.isSameMonth(this._value.to!)))\n {\n this.setValue(this._value);\n }\n }\n\n //######################### protected methods #########################\n\n /\n Obtains end of period\n * @param period - Period for which should be end obtained\n /\n protected _endOfPeriod(period: PeriodData<TDate>): TDate\n {\n return this._dateApi.getValue(period.date).endOfDay().value;\n }\n\n /\n Tests whether provided value is in same period as displayed picker\n * @param val - Tested value for same period as displayed picker\n /\n protected _isSamePeriodAsDisplayed(val: DateApiObject<TDate>): boolean\n {\n return val.isSameMonth(this.displayDate!.value);\n }\n\n /\n Tests whether provided value is in same period target value\n * @param val - Tested value\n * @param target - Target value to be tested against\n /\n protected _isSamePeriod(val: DateApiObject<TDate>, target: TDate): boolean\n {\n return val.isSameDay(target);\n }\n\n /\n Gets period data for specified value\n * @param val - Value for which is period data obtained\n /\n protected _getPeriodData(val: DateApiObject<TDate>): PeriodData<TDate>\n {\n return this._thisMonthData[val.dayOfMonth() - 1];\n }\n}","<div [ngClass]=\"cssClasses.periodSelection \| asRequired\">\r\n <div [ngClass]=\"cssClasses.previousPeriod \| asRequired\" (mousedown)=\"previousMonth($event)\"></div>\r\n <div [ngClass]=\"cssClasses.periodValue \| asRequired \| mergeCssClasses: [{'clickable': canGoUp}]\" (mousedown)=\"goUp($event)\">{{displayDate?.format('MMMM yyyy')}}</div>\r\n <div [ngClass]=\"cssClasses.nextPeriod \| asRequired\" (mousedown)=\"nextMonth($event)\"></div>\r\n</div>\r\n\r\n<div [ngClass]=\"cssClasses.periodData \| asRequired\">\r\n <div [ngClass]=\"cssClasses.weekdayName \| asRequired\" ngFor=\"let weekday of weekdays\">{{weekday}}</div>\r\n <div ngFor=\"let day of periodData\"\r\n [ngClass]=\"cssClasses.periodDatum \| asRequired\"\r\n [class.other-month]=\"day.otherMonth\"\r\n [class.today]=\"day.today\"\r\n [class.weekend]=\"day.weekend\"\r\n [class.active]=\"day.active\"\r\n [class.disabled]=\"day.disabled\"\r\n (mousedown)=\"select($event, day)\">{{day.day}}</div>\r\n</div>\r\n\r\n<div class=\"flex-row\" style=\"justify-content: center; border-top: 1px solid #FFF;\" ngIf=\"canGoDown\">\r\n <div [class.clickable]=\"canGoDown\" (mousedown)=\"goDown($event)\">{{timeValue?.from \| dateFormat: 'time'}}</div>\r\n</div>"]}
1	+ {"version":3,"file":"dayPicker.component.js","sourceRoot":"","sources":["../../../../../../src/legacy/picker/components/dayPicker/dayPicker.component.ts","../../../../../../src/legacy/picker/components/dayPicker/dayPicker.component.html"],"names":[],"mappings":"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","sourcesContent":["import {Component, ChangeDetectionStrategy, Inject, ChangeDetectorRef} from '@angular/core';\nimport {extend} from '@jscrpt/common';\n\nimport {DateTimeValue} from '../../../../interfaces/dateTime/datetime.interface';\nimport {DATE_API} from '../../../../misc/tokens';\nimport {DateApi, DateApiObject} from '../../../../services/dateApi/dateApi.interface';\nimport {DateTimeLegacyPicker, DayData, PeriodData} from '../../misc/datetimePicker.interface';\nimport {PickerBaseComponent} from '../pickerBase.component';\nimport {DayPickerCssClasses} from './dayPicker.interfaces';\n\n/*\n Default styles for picker\n /\nconst defaultStyles: DayPickerCssClasses =\n{\n periodSelection: 'period',\n previousPeriod: 'fas fa-angle-left clickable',\n nextPeriod: 'fas fa-angle-right clickable',\n periodValue: 'period-value',\n periodData: 'period-data',\n periodDatum: 'period-datum clickable',\n weekdayName: 'weekday',\n clickable: 'clickable'\n};\n\n/\n Component used for displaying day picker\n /\n@Component(\n{\n selector: 'date-time-day-picker',\n templateUrl: 'dayPicker.component.html',\n styleUrls: ['dayPicker.component.css'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class DateTimeDayPickerComponent<TDate = any> extends PickerBaseComponent<TDate, DayData<TDate>, DayPickerCssClasses> implements DateTimeLegacyPicker<TDate, DayPickerCssClasses>\n{\n //######################### protected fields #########################\n\n /\n Stored this picker month data\n /\n protected _thisMonthData: DayData<TDate>[] = [];\n\n //######################### public properties - template bindings #########################\n\n /\n Names of days\n * @internal\n /\n public weekdays: string[] = [];\n\n /\n Value used for displaying time\n /\n public get timeValue(): DateTimeValue<TDate> \| null\n {\n return this._value;\n }\n\n //######################### constructor #########################\n constructor(@Inject(DATE_API) dateApi: DateApi<TDate>,\n changeDetector: ChangeDetectorRef)\n {\n super(dateApi, changeDetector);\n\n this.cssClasses = extend(true, {}, defaultStyles);\n this.weekdays = this._dateApi.weekdaysShort();\n }\n\n //######################### public methods - template bindings #########################\n\n /\n Changes displayed period to \"lower\" period\n * @param event - Event that occured\n * @internal\n /\n public goDown(event: Event): void\n {\n event.preventDefault();\n\n if(!this.canGoDown)\n {\n return;\n }\n\n if(this.displayDate)\n {\n this._scaleDown.next(this.displayDate.value);\n }\n }\n\n /\n Changes displayed month to next month\n * @param event - Event that occured\n * @internal\n /\n public nextMonth(event: Event): void\n {\n event.preventDefault();\n this.displayDate!.addMonths(1);\n\n this.display(this.displayDate!);\n }\n\n /\n Changes displayed month to previous month\n * @param event - Event that occured\n * @internal\n /\n public previousMonth(event: Event): void\n {\n event.preventDefault();\n this.displayDate!.subtractMonths(1);\n\n this.display(this.displayDate!);\n }\n\n /\n Selects day\n * @param event - Event that occured\n * @param day - Selects day \n * @internal\n /\n public override select(event: Event, day: DayData<TDate>): void\n {\n event.preventDefault();\n\n if(day.disabled)\n {\n return;\n }\n\n this._setPeriod(day);\n\n //when time picker is enabled\n if(this.canGoDown)\n {\n const from = this._dateApi\n .getValue(day.date)\n .hour(this._originalHour)\n .minute(this._originalMinute);\n\n const to = this._dateApi\n .getValue(this._endOfPeriod(day))\n .hour(this._originalHour)\n .minute(this._originalMinute);\n\n this._value =\n {\n from: from.value,\n to: to.value\n };\n }\n //no time picker\n else\n {\n this._value =\n {\n from: day.date,\n to: this._endOfPeriod(day)\n };\n }\n \n this._valueChange.next();\n\n if(day.otherMonth)\n {\n this.display(this._dateApi.getValue(day.date));\n }\n }\n\n //######################### public methods - implementation of DateTimePicker #########################\n\n /\n Set displays date to be displayed\n * @param value - Value that identifies period that is going to be displayed\n /\n public display(value: DateApiObject<TDate>): void\n {\n this.displayDate = value;\n this.periodData = [];\n this._thisMonthData = [];\n const currentMonthDate = this.displayDate.value;\n const today = this._dateApi.now().value;\n\n this.displayDate\n .startOfMonth()\n .updateOriginal()\n .startOfWeek();\n\n do\n {\n for(let x = 0; x < 7; x++)\n {\n const day = this.displayDate.dayOfMonth();\n const otherMonth = !this.displayDate.isSameMonth(currentMonthDate);\n const data = \n {\n active: false,\n disabled: false,\n date: this.displayDate.value,\n otherMonth: otherMonth,\n today: this.displayDate.isSameDay(today),\n weekend: this.displayDate.isWeekend(),\n day: day,\n dateObj: this.displayDate.clone(),\n };\n\n this.periodData.push(data);\n\n if(!otherMonth)\n {\n this._thisMonthData.push(data);\n }\n\n this.displayDate.addDays(1);\n }\n }\n while(this.displayDate.isSameMonth(currentMonthDate));\n\n this.displayDate.resetOriginal();\n\n //can go down set minutes and hours\n if(this.canGoDown)\n {\n this.displayDate\n .minute(this._originalMinute)\n .hour(this._originalHour);\n }\n\n this._updateMinMax();\n\n //set value if exists\n if(this._value && (this.displayDate.isSameMonth(this._value.from!) \|\| this.displayDate.isSameMonth(this._value.to!)))\n {\n this.setValue(this._value);\n }\n }\n\n //######################### protected methods #########################\n\n /\n Obtains end of period\n * @param period - Period for which should be end obtained\n /\n protected _endOfPeriod(period: PeriodData<TDate>): TDate\n {\n return this._dateApi.getValue(period.date).endOfDay().value;\n }\n\n /\n Tests whether provided value is in same period as displayed picker\n * @param val - Tested value for same period as displayed picker\n /\n protected _isSamePeriodAsDisplayed(val: DateApiObject<TDate>): boolean\n {\n return val.isSameMonth(this.displayDate!.value);\n }\n\n /\n Tests whether provided value is in same period target value\n * @param val - Tested value\n * @param target - Target value to be tested against\n /\n protected _isSamePeriod(val: DateApiObject<TDate>, target: TDate): boolean\n {\n return val.isSameDay(target);\n }\n\n /\n Gets period data for specified value\n * @param val - Value for which is period data obtained\n /\n protected _getPeriodData(val: DateApiObject<TDate>): PeriodData<TDate>\n {\n return this._thisMonthData[val.dayOfMonth() - 1];\n }\n}","<div [ngClass]=\"cssClasses.periodSelection \| asRequired\">\r\n <div [ngClass]=\"cssClasses.previousPeriod \| asRequired\" (mousedown)=\"previousMonth($event)\"></div>\r\n <div [ngClass]=\"cssClasses.periodValue \| asRequired \| mergeCssClasses: [{'clickable': canGoUp}]\" (mousedown)=\"goUp($event)\">{{displayDate?.format('MMMM yyyy')}}</div>\r\n <div [ngClass]=\"cssClasses.nextPeriod \| asRequired\" (mousedown)=\"nextMonth($event)\"></div>\r\n</div>\r\n\r\n<div [ngClass]=\"cssClasses.periodData \| asRequired\">\r\n <div [ngClass]=\"cssClasses.weekdayName \| asRequired\" ngFor=\"let weekday of weekdays\">{{weekday}}</div>\r\n <div ngFor=\"let day of periodData\"\r\n [ngClass]=\"cssClasses.periodDatum \| asRequired\"\r\n [class.other-month]=\"day.otherMonth\"\r\n [class.today]=\"day.today\"\r\n [class.weekend]=\"day.weekend\"\r\n [class.active]=\"day.active\"\r\n [class.disabled]=\"day.disabled\"\r\n (mousedown)=\"select($event, day)\">{{day.day}}</div>\r\n</div>\r\n\r\n<div class=\"flex-row\" style=\"justify-content: center; border-top: 1px solid #FFF;\" ngIf=\"canGoDown\">\r\n <div [class.clickable]=\"canGoDown\" (mousedown)=\"goDown($event)\">{{timeValue?.from \| dateFormat: 'time'}}</div>\r\n</div>"]}

package/es2020/src/legacy/picker/components/monthPicker/monthPicker.component.js CHANGED Viewed

@@ -61,7 +61,8 @@ export class DateTimeMonthPickerComponent extends PickerBaseComponent {
                 active: false,
                 disabled: false,
                 date: monthOfYear.value,
-                name: monthOfYear.format('MMM')
+                name: monthOfYear.format('MMM'),
+                dateObj: monthOfYear.clone(),
             });
             monthOfYear.addMonths(1);
         }

package/es2020/src/legacy/picker/components/monthPicker/monthPicker.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"monthPicker.component.js","sourceRoot":"","sources":["../../../../../../src/legacy/picker/components/monthPicker/monthPicker.component.ts","../../../../../../src/legacy/picker/components/monthPicker/monthPicker.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,uBAAuB,EAAE,MAAM,EAAE,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAC5F,OAAO,EAAC,MAAM,EAAC,MAAM,gBAAgB,CAAC;AAEtC,OAAO,EAAC,QAAQ,EAAC,MAAM,yBAAyB,CAAC;AAGjD,OAAO,EAAC,mBAAmB,EAAC,MAAM,yBAAyB,CAAC;;;;AAG5D;;GAEG;AACH,MAAM,aAAa,GACnB;IACI,eAAe,EAAE,QAAQ;IACzB,cAAc,EAAE,6BAA6B;IAC7C,UAAU,EAAE,8BAA8B;IAC1C,WAAW,EAAE,cAAc;IAC3B,UAAU,EAAE,aAAa;IACzB,WAAW,EAAE,wBAAwB;IACrC,SAAS,EAAE,WAAW;CACzB,CAAC;AAEF;;GAEG;AAQH,MAAM,OAAO,4BAA0C,SAAQ,mBAAmE;IAE9H,iEAAiE;IACjE,YAA8B,OAAuB,EACzC,cAAiC;QAEzC,KAAK,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QAE/B,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,IAAI,EAAE,EAAE,EAAE,aAAa,CAAC,CAAC;IACtD,CAAC;IAED,wFAAwF;IAExF;;;;OAIG;IACI,QAAQ,CAAC,KAAY;QAExB,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,WAAY,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;QAE9B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,WAAY,CAAC,CAAC;IACpC,CAAC;IAED;;;;OAIG;IACI,YAAY,CAAC,KAAY;QAE5B,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,WAAY,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;QAEnC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,WAAY,CAAC,CAAC;IACpC,CAAC;IAED,uGAAuG;IAEvG;;;OAGG;IACI,OAAO,CAAC,KAA2B;QAEtC,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAEzB,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,cAAc,EAAE,CAAC;QACpE,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QAErB,KAAI,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,EAAE,EAC1B;YACI,IAAI,CAAC,UAAU,CAAC,IAAI,CACpB;gBACI,MAAM,EAAE,KAAK;gBACb,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,WAAW,CAAC,KAAK;gBACvB,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC;~~aAClC~~,CAAC,CAAC;YAEH,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;SAC5B;QAED,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE,CAAC;QACjC,IAAI,CAAC,aAAa,EAAE,CAAC;QAErB,qBAAqB;QACrB,IAAG,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,IAAK,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,EAAG,CAAC,CAAC,EAClH;YACI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SAC9B;IACL,CAAC;IAED,uEAAuE;IAEvE;;;OAGG;IACO,YAAY,CAAC,MAAyB;QAE5C,OAAO,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,UAAU,EAAE,CAAC,KAAK,CAAC;IAClE,CAAC;IAED;;;OAGG;IACO,wBAAwB,CAAC,GAAyB;QAExD,OAAO,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,WAAY,CAAC,KAAK,CAAC,CAAC;IACnD,CAAC;IAED;;;;OAIG;IACO,aAAa,CAAC,GAAyB,EAAE,MAAa;QAE5D,OAAO,GAAG,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,CAAC;IAED;;;OAGG;IACO,cAAc,CAAC,GAAyB;QAE9C,OAAO,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC;IACxC,CAAC;;~~yHAhHQ~~,4BAA4B,kBAGjB,QAAQ;6GAHnB,4BAA4B,qFCjCzC,gxBAYM;2FDqBO,4BAA4B;kBAPxC,SAAS;+BAEI,wBAAwB,mBAGjB,uBAAuB,CAAC,MAAM;;0BAKlC,MAAM;2BAAC,QAAQ","sourcesContent":["import {Component, ChangeDetectionStrategy, Inject, ChangeDetectorRef} from '@angular/core';\nimport {extend} from '@jscrpt/common';\n\nimport {DATE_API} from '../../../../misc/tokens';\nimport {DateApi, DateApiObject} from '../../../../services/dateApi/dateApi.interface';\nimport {DateTimeLegacyPicker, MonthData, PeriodData} from '../../misc/datetimePicker.interface';\nimport {PickerBaseComponent} from '../pickerBase.component';\nimport {MonthPickerCssClasses} from './monthPicker.interfaces';\n\n/*\n Default styles for picker\n /\nconst defaultStyles: MonthPickerCssClasses =\n{\n periodSelection: 'period',\n previousPeriod: 'fas fa-angle-left clickable',\n nextPeriod: 'fas fa-angle-right clickable',\n periodValue: 'period-value',\n periodData: 'period-data',\n periodDatum: 'period-datum clickable',\n clickable: 'clickable'\n};\n\n/\n Component used for displaying month picker\n /\n@Component(\n{\n selector: 'date-time-month-picker',\n templateUrl: 'monthPicker.component.html',\n styleUrls: ['monthPicker.component.css'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class DateTimeMonthPickerComponent<TDate = any> extends PickerBaseComponent<TDate, MonthData<TDate>, MonthPickerCssClasses> implements DateTimeLegacyPicker<TDate, MonthPickerCssClasses>\n{\n //######################### constructor #########################\n constructor(@Inject(DATE_API) dateApi: DateApi<TDate>,\n changeDetector: ChangeDetectorRef)\n {\n super(dateApi, changeDetector);\n\n this.cssClasses = extend(true, {}, defaultStyles);\n }\n\n //######################### public methods - template bindings #########################\n\n /\n Changes displayed year to next year\n * @param event - Event that occured\n * @internal\n /\n public nextYear(event: Event)\n {\n event.preventDefault();\n this.displayDate!.addYears(1);\n\n this.display(this.displayDate!);\n }\n\n /\n Changes displayed year to previous year\n * @param event - Event that occured\n * @internal\n /\n public previousYear(event: Event)\n {\n event.preventDefault();\n this.displayDate!.subtractYears(1);\n\n this.display(this.displayDate!);\n }\n\n //######################### public methods - implementation of DateTimePicker #########################\n\n /\n Set displays date to be displayed\n * @param value - Value that identifies period that is going to be displayed\n /\n public display(value: DateApiObject<TDate>): void\n {\n this.displayDate = value;\n\n const monthOfYear = this.displayDate.startOfYear().updateOriginal();\n this.periodData = [];\n\n for(let x = 0; x < 12; x++)\n {\n this.periodData.push(\n {\n active: false,\n disabled: false,\n date: monthOfYear.value,\n name: monthOfYear.format('MMM')\n });\n\n monthOfYear.addMonths(1);\n }\n\n this.displayDate.resetOriginal();\n this._updateMinMax();\n\n //set value if exists\n if(this._value && (this.displayDate.isSameYear(this._value.from!) \|\| this.displayDate.isSameYear(this._value.to!)))\n {\n this.setValue(this._value);\n }\n }\n\n //######################### protected methods #########################\n\n /\n Obtains end of period\n * @param period - Period for which should be end obtained\n /\n protected _endOfPeriod(period: PeriodData<TDate>): TDate\n {\n return this._dateApi.getValue(period.date).endOfMonth().value;\n }\n\n /\n Tests whether provided value is in same period as displayed picker\n * @param val - Tested value for same period as displayed picker\n /\n protected _isSamePeriodAsDisplayed(val: DateApiObject<TDate>): boolean\n {\n return val.isSameYear(this.displayDate!.value);\n }\n\n /\n Tests whether provided value is in same period target value\n * @param val - Tested value\n * @param target - Target value to be tested against\n /\n protected _isSamePeriod(val: DateApiObject<TDate>, target: TDate): boolean\n {\n return val.isSameMonth(target);\n }\n\n /\n Gets period data for specified value\n * @param val - Value for which is period data obtained\n /\n protected _getPeriodData(val: DateApiObject<TDate>): PeriodData<TDate>\n {\n return this.periodData[val.month()];\n }\n}","<div [ngClass]=\"cssClasses.periodSelection \| asRequired\">\r\n <div [ngClass]=\"cssClasses.previousPeriod \| asRequired\" (mousedown)=\"previousYear($event)\"></div>\r\n <div [ngClass]=\"cssClasses.periodValue \| asRequired\" [class.clickable]=\"canGoUp\" (mousedown)=\"goUp($event)\">{{displayDate?.format('yyyy')}}</div>\r\n <div [ngClass]=\"cssClasses.nextPeriod \| asRequired\" (mousedown)=\"nextYear($event)\"></div>\r\n</div>\r\n\r\n<div [ngClass]=\"cssClasses.periodData \| asRequired\">\r\n <div ngFor=\"let month of periodData\"\r\n [ngClass]=\"cssClasses.periodDatum \| asRequired\"\r\n [class.active]=\"month.active\"\r\n [class.disabled]=\"month.disabled\"\r\n (mousedown)=\"select($event, month)\">{{month.name}}</div>\r\n</div>"]}
1	+ {"version":3,"file":"monthPicker.component.js","sourceRoot":"","sources":["../../../../../../src/legacy/picker/components/monthPicker/monthPicker.component.ts","../../../../../../src/legacy/picker/components/monthPicker/monthPicker.component.html"],"names":[],"mappings":"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","sourcesContent":["import {Component, ChangeDetectionStrategy, Inject, ChangeDetectorRef} from '@angular/core';\nimport {extend} from '@jscrpt/common';\n\nimport {DATE_API} from '../../../../misc/tokens';\nimport {DateApi, DateApiObject} from '../../../../services/dateApi/dateApi.interface';\nimport {DateTimeLegacyPicker, MonthData, PeriodData} from '../../misc/datetimePicker.interface';\nimport {PickerBaseComponent} from '../pickerBase.component';\nimport {MonthPickerCssClasses} from './monthPicker.interfaces';\n\n/*\n Default styles for picker\n /\nconst defaultStyles: MonthPickerCssClasses =\n{\n periodSelection: 'period',\n previousPeriod: 'fas fa-angle-left clickable',\n nextPeriod: 'fas fa-angle-right clickable',\n periodValue: 'period-value',\n periodData: 'period-data',\n periodDatum: 'period-datum clickable',\n clickable: 'clickable'\n};\n\n/\n Component used for displaying month picker\n /\n@Component(\n{\n selector: 'date-time-month-picker',\n templateUrl: 'monthPicker.component.html',\n styleUrls: ['monthPicker.component.css'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class DateTimeMonthPickerComponent<TDate = any> extends PickerBaseComponent<TDate, MonthData<TDate>, MonthPickerCssClasses> implements DateTimeLegacyPicker<TDate, MonthPickerCssClasses>\n{\n //######################### constructor #########################\n constructor(@Inject(DATE_API) dateApi: DateApi<TDate>,\n changeDetector: ChangeDetectorRef)\n {\n super(dateApi, changeDetector);\n\n this.cssClasses = extend(true, {}, defaultStyles);\n }\n\n //######################### public methods - template bindings #########################\n\n /\n Changes displayed year to next year\n * @param event - Event that occured\n * @internal\n /\n public nextYear(event: Event)\n {\n event.preventDefault();\n this.displayDate!.addYears(1);\n\n this.display(this.displayDate!);\n }\n\n /\n Changes displayed year to previous year\n * @param event - Event that occured\n * @internal\n /\n public previousYear(event: Event)\n {\n event.preventDefault();\n this.displayDate!.subtractYears(1);\n\n this.display(this.displayDate!);\n }\n\n //######################### public methods - implementation of DateTimePicker #########################\n\n /\n Set displays date to be displayed\n * @param value - Value that identifies period that is going to be displayed\n /\n public display(value: DateApiObject<TDate>): void\n {\n this.displayDate = value;\n\n const monthOfYear = this.displayDate.startOfYear().updateOriginal();\n this.periodData = [];\n\n for(let x = 0; x < 12; x++)\n {\n this.periodData.push(\n {\n active: false,\n disabled: false,\n date: monthOfYear.value,\n name: monthOfYear.format('MMM'),\n dateObj: monthOfYear.clone(),\n });\n\n monthOfYear.addMonths(1);\n }\n\n this.displayDate.resetOriginal();\n this._updateMinMax();\n\n //set value if exists\n if(this._value && (this.displayDate.isSameYear(this._value.from!) \|\| this.displayDate.isSameYear(this._value.to!)))\n {\n this.setValue(this._value);\n }\n }\n\n //######################### protected methods #########################\n\n /\n Obtains end of period\n * @param period - Period for which should be end obtained\n /\n protected _endOfPeriod(period: PeriodData<TDate>): TDate\n {\n return this._dateApi.getValue(period.date).endOfMonth().value;\n }\n\n /\n Tests whether provided value is in same period as displayed picker\n * @param val - Tested value for same period as displayed picker\n /\n protected _isSamePeriodAsDisplayed(val: DateApiObject<TDate>): boolean\n {\n return val.isSameYear(this.displayDate!.value);\n }\n\n /\n Tests whether provided value is in same period target value\n * @param val - Tested value\n * @param target - Target value to be tested against\n /\n protected _isSamePeriod(val: DateApiObject<TDate>, target: TDate): boolean\n {\n return val.isSameMonth(target);\n }\n\n /\n Gets period data for specified value\n * @param val - Value for which is period data obtained\n /\n protected _getPeriodData(val: DateApiObject<TDate>): PeriodData<TDate>\n {\n return this.periodData[val.month()];\n }\n}","<div [ngClass]=\"cssClasses.periodSelection \| asRequired\">\r\n <div [ngClass]=\"cssClasses.previousPeriod \| asRequired\" (mousedown)=\"previousYear($event)\"></div>\r\n <div [ngClass]=\"cssClasses.periodValue \| asRequired\" [class.clickable]=\"canGoUp\" (mousedown)=\"goUp($event)\">{{displayDate?.format('yyyy')}}</div>\r\n <div [ngClass]=\"cssClasses.nextPeriod \| asRequired\" (mousedown)=\"nextYear($event)\"></div>\r\n</div>\r\n\r\n<div [ngClass]=\"cssClasses.periodData \| asRequired\">\r\n <div ngFor=\"let month of periodData\"\r\n [ngClass]=\"cssClasses.periodDatum \| asRequired\"\r\n [class.active]=\"month.active\"\r\n [class.disabled]=\"month.disabled\"\r\n (mousedown)=\"select($event, month)\">{{month.name}}</div>\r\n</div>"]}

package/es2020/src/legacy/picker/components/yearPicker/yearPicker.component.js CHANGED Viewed

@@ -71,7 +71,8 @@ export class DateTimeYearPickerComponent extends PickerBaseComponent {
                 active: false,
                 disabled: false,
                 date: this.displayDate.value,
-                value: year
+                value: year,
+                dateObj: this.displayDate.clone(),
             });
             year++;
             this.displayDate.addYears(1);

package/es2020/src/legacy/picker/components/yearPicker/yearPicker.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"yearPicker.component.js","sourceRoot":"","sources":["../../../../../../src/legacy/picker/components/yearPicker/yearPicker.component.ts","../../../../../../src/legacy/picker/components/yearPicker/yearPicker.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,uBAAuB,EAAE,MAAM,EAAE,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAC5F,OAAO,EAAC,MAAM,EAAC,MAAM,gBAAgB,CAAC;AAEtC,OAAO,EAAC,QAAQ,EAAC,MAAM,yBAAyB,CAAC;AAGjD,OAAO,EAAC,mBAAmB,EAAC,MAAM,yBAAyB,CAAC;;;;AAG5D;;GAEG;AACH,MAAM,aAAa,GACnB;IACI,eAAe,EAAE,QAAQ;IACzB,cAAc,EAAE,6BAA6B;IAC7C,UAAU,EAAE,8BAA8B;IAC1C,WAAW,EAAE,cAAc;IAC3B,UAAU,EAAE,aAAa;IACzB,WAAW,EAAE,wBAAwB;IACrC,SAAS,EAAE,WAAW;CACzB,CAAC;AAEF;;GAEG;AAQH,MAAM,OAAO,2BAAyC,SAAQ,mBAAiE;IAU3H,iEAAiE;IACjE,YAA8B,OAAuB,EACzC,cAAiC;QAEzC,KAAK,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QAZnC,2FAA2F;QAE3F;;;WAGG;QACI,WAAM,GAAW,EAAE,CAAC;QAQvB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,IAAI,EAAE,EAAE,EAAE,aAAa,CAAC,CAAC;IACtD,CAAC;IAED,wFAAwF;IAExF;;;;OAIG;IACI,UAAU,CAAC,KAAY;QAE1B,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,WAAY,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAE/B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,WAAY,CAAC,CAAC;IACpC,CAAC;IAED;;;;OAIG;IACI,cAAc,CAAC,KAAY;QAE9B,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,WAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;QAEpC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,WAAY,CAAC,CAAC;IACpC,CAAC;IAED,uGAAuG;IAEvG;;;OAGG;IACI,OAAO,CAAC,KAA2B;QAEtC,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAEzB,IAAI,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC;QAEjD,OAAM,IAAI,GAAG,EAAE,KAAK,CAAC,EACrB;YACI,IAAI,EAAE,CAAC;SACV;QAED,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,cAAc,EAAE,CAAC;QAE7C,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QAErB,KAAI,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,EAAE,EAC1B;YACI,IAAI,CAAC,UAAU,CAAC,IAAI,CACpB;gBACI,MAAM,EAAE,KAAK;gBACb,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC,KAAK;gBAC5B,KAAK,EAAE,IAAI;~~aACd~~,CAAC,CAAC;YAEH,IAAI,EAAE,CAAC;YACP,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;SAChC;QAED,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE,CAAC;QACjC,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,IAAI,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC;QAE7E,qBAAqB;QACrB,IAAG,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,IAAK,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,EAAG,CAAC,CAAC,EACtH;YACI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SAC9B;IACL,CAAC;IAED,uEAAuE;IAEvE;;;OAGG;IACO,YAAY,CAAC,MAAyB;QAE5C,OAAO,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,CAAC,KAAK,CAAC;IACjE,CAAC;IAED;;;OAGG;IACO,wBAAwB,CAAC,GAAyB;QAExD,OAAO,GAAG,CAAC,YAAY,CAAC,IAAI,CAAC,WAAY,CAAC,KAAK,CAAC,CAAC;IACrD,CAAC;IAED;;;;OAIG;IACO,aAAa,CAAC,GAAyB,EAAE,MAAa;QAE5D,OAAO,GAAG,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;IAClC,CAAC;IAED;;;OAGG;IACO,cAAc,CAAC,GAAyB;QAE9C,OAAO,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC;IAC5C,CAAC;;~~wHAlIQ~~,2BAA2B,kBAWhB,QAAQ;4GAXnB,2BAA2B,oFCjCxC,2vBAYM;2FDqBO,2BAA2B;kBAPvC,SAAS;+BAEI,uBAAuB,mBAGhB,uBAAuB,CAAC,MAAM;;0BAalC,MAAM;2BAAC,QAAQ","sourcesContent":["import {Component, ChangeDetectionStrategy, Inject, ChangeDetectorRef} from '@angular/core';\nimport {extend} from '@jscrpt/common';\n\nimport {DATE_API} from '../../../../misc/tokens';\nimport {DateApi, DateApiObject} from '../../../../services/dateApi/dateApi.interface';\nimport {DateTimeLegacyPicker, PeriodData, YearData} from '../../misc/datetimePicker.interface';\nimport {PickerBaseComponent} from '../pickerBase.component';\nimport {YearPickerCssClasses} from './yearPicker.interfaces';\n\n/*\n Default styles for picker\n /\nconst defaultStyles: YearPickerCssClasses =\n{\n periodSelection: 'period',\n previousPeriod: 'fas fa-angle-left clickable',\n nextPeriod: 'fas fa-angle-right clickable',\n periodValue: 'period-value',\n periodData: 'period-data',\n periodDatum: 'period-datum clickable',\n clickable: 'clickable'\n};\n\n/\n Component used for displaying year picker\n /\n@Component(\n{\n selector: 'date-time-year-picker',\n templateUrl: 'yearPicker.component.html',\n styleUrls: ['yearPicker.component.css'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class DateTimeYearPickerComponent<TDate = any> extends PickerBaseComponent<TDate, YearData<TDate>, YearPickerCssClasses> implements DateTimeLegacyPicker<TDate, YearPickerCssClasses>\n{\n //######################### public properties - template bindings #########################\n\n /\n Displayed decade period\n * @internal\n /\n public period: string = '';\n\n //######################### constructor #########################\n constructor(@Inject(DATE_API) dateApi: DateApi<TDate>,\n changeDetector: ChangeDetectorRef)\n {\n super(dateApi, changeDetector);\n\n this.cssClasses = extend(true, {}, defaultStyles);\n }\n\n //######################### public methods - template bindings #########################\n\n /\n Changes displayed decade to next decade\n * @param event - Event that occured\n * @internal\n /\n public nextDecade(event: Event)\n {\n event.preventDefault();\n this.displayDate!.addYears(10);\n\n this.display(this.displayDate!);\n }\n\n /\n Changes displayed decade to previous decade\n * @param event - Event that occured\n * @internal\n /\n public previousDecade(event: Event)\n {\n event.preventDefault();\n this.displayDate!.subtractYears(10);\n\n this.display(this.displayDate!);\n }\n\n //######################### public methods - implementation of DateTimePicker #########################\n\n /\n Set displays date to be displayed\n * @param value - Value that identifies period that is going to be displayed\n /\n public display(value: DateApiObject<TDate>): void\n {\n this.displayDate = value;\n\n let year = this.displayDate.startOfYear().year();\n\n while(year % 10 !== 0)\n {\n year--;\n }\n\n this.displayDate.year(year).updateOriginal();\n\n this.periodData = [];\n\n for(let x = 0; x < 10; x++)\n {\n this.periodData.push(\n {\n active: false,\n disabled: false,\n date: this.displayDate.value,\n value: year\n });\n\n year++;\n this.displayDate.addYears(1);\n }\n\n this.displayDate.resetOriginal();\n this._updateMinMax();\n this.period = `${this.displayDate.year()} - ${this.displayDate.year() + 10}`;\n\n //set value if exists\n if(this._value && (this.displayDate.isSameDecade(this._value.from!) \|\| this.displayDate.isSameDecade(this._value.to!)))\n {\n this.setValue(this._value);\n }\n }\n\n //######################### protected methods #########################\n\n /\n Obtains end of period\n * @param period - Period for which should be end obtained\n /\n protected _endOfPeriod(period: PeriodData<TDate>): TDate\n {\n return this._dateApi.getValue(period.date).endOfYear().value;\n }\n\n /\n Tests whether provided value is in same period as displayed picker\n * @param val - Tested value for same period as displayed picker\n /\n protected _isSamePeriodAsDisplayed(val: DateApiObject<TDate>): boolean\n {\n return val.isSameDecade(this.displayDate!.value);\n }\n\n /\n Tests whether provided value is in same period target value\n * @param val - Tested value\n * @param target - Target value to be tested against\n /\n protected _isSamePeriod(val: DateApiObject<TDate>, target: TDate): boolean\n {\n return val.isSameYear(target);\n }\n\n /\n Gets period data for specified value\n * @param val - Value for which is period data obtained\n /\n protected _getPeriodData(val: DateApiObject<TDate>): PeriodData<TDate>\n {\n return this.periodData[val.year() % 10];\n }\n}","<div [ngClass]=\"cssClasses.periodSelection \| asRequired\">\r\n <div [ngClass]=\"cssClasses.previousPeriod \| asRequired\" (mousedown)=\"previousDecade($event)\"></div>\r\n <div [ngClass]=\"cssClasses.periodValue \| asRequired\" [class.clickable]=\"canGoUp\" (mousedown)=\"goUp($event)\">{{period}}</div>\r\n <div [ngClass]=\"cssClasses.nextPeriod \| asRequired\" (mousedown)=\"nextDecade($event)\"></div>\r\n</div>\r\n\r\n<div [ngClass]=\"cssClasses.periodData \| asRequired\">\r\n <div ngFor=\"let year of periodData\"\r\n [ngClass]=\"cssClasses.periodDatum \| asRequired\"\r\n [class.active]=\"year.active\"\r\n [class.disabled]=\"year.disabled\"\r\n (mousedown)=\"select($event, year)\">{{year.value}}</div>\r\n</div>"]}
1	+ {"version":3,"file":"yearPicker.component.js","sourceRoot":"","sources":["../../../../../../src/legacy/picker/components/yearPicker/yearPicker.component.ts","../../../../../../src/legacy/picker/components/yearPicker/yearPicker.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,uBAAuB,EAAE,MAAM,EAAE,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAC5F,OAAO,EAAC,MAAM,EAAC,MAAM,gBAAgB,CAAC;AAEtC,OAAO,EAAC,QAAQ,EAAC,MAAM,yBAAyB,CAAC;AAGjD,OAAO,EAAC,mBAAmB,EAAC,MAAM,yBAAyB,CAAC;;;;AAG5D;;GAEG;AACH,MAAM,aAAa,GACnB;IACI,eAAe,EAAE,QAAQ;IACzB,cAAc,EAAE,6BAA6B;IAC7C,UAAU,EAAE,8BAA8B;IAC1C,WAAW,EAAE,cAAc;IAC3B,UAAU,EAAE,aAAa;IACzB,WAAW,EAAE,wBAAwB;IACrC,SAAS,EAAE,WAAW;CACzB,CAAC;AAEF;;GAEG;AAQH,MAAM,OAAO,2BAAyC,SAAQ,mBAAiE;IAU3H,iEAAiE;IACjE,YAA8B,OAAuB,EACzC,cAAiC;QAEzC,KAAK,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QAZnC,2FAA2F;QAE3F;;;WAGG;QACI,WAAM,GAAW,EAAE,CAAC;QAQvB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,IAAI,EAAE,EAAE,EAAE,aAAa,CAAC,CAAC;IACtD,CAAC;IAED,wFAAwF;IAExF;;;;OAIG;IACI,UAAU,CAAC,KAAY;QAE1B,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,WAAY,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAE/B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,WAAY,CAAC,CAAC;IACpC,CAAC;IAED;;;;OAIG;IACI,cAAc,CAAC,KAAY;QAE9B,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,WAAY,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;QAEpC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,WAAY,CAAC,CAAC;IACpC,CAAC;IAED,uGAAuG;IAEvG;;;OAGG;IACI,OAAO,CAAC,KAA2B;QAEtC,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAEzB,IAAI,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC;QAEjD,OAAM,IAAI,GAAG,EAAE,KAAK,CAAC,EACrB;YACI,IAAI,EAAE,CAAC;SACV;QAED,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,cAAc,EAAE,CAAC;QAE7C,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QAErB,KAAI,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,EAAE,EAC1B;YACI,IAAI,CAAC,UAAU,CAAC,IAAI,CACpB;gBACI,MAAM,EAAE,KAAK;gBACb,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC,KAAK;gBAC5B,KAAK,EAAE,IAAI;gBACX,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE;aACpC,CAAC,CAAC;YAEH,IAAI,EAAE,CAAC;YACP,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;SAChC;QAED,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE,CAAC;QACjC,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,IAAI,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC;QAE7E,qBAAqB;QACrB,IAAG,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,IAAK,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,EAAG,CAAC,CAAC,EACtH;YACI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SAC9B;IACL,CAAC;IAED,uEAAuE;IAEvE;;;OAGG;IACO,YAAY,CAAC,MAAyB;QAE5C,OAAO,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,CAAC,KAAK,CAAC;IACjE,CAAC;IAED;;;OAGG;IACO,wBAAwB,CAAC,GAAyB;QAExD,OAAO,GAAG,CAAC,YAAY,CAAC,IAAI,CAAC,WAAY,CAAC,KAAK,CAAC,CAAC;IACrD,CAAC;IAED;;;;OAIG;IACO,aAAa,CAAC,GAAyB,EAAE,MAAa;QAE5D,OAAO,GAAG,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;IAClC,CAAC;IAED;;;OAGG;IACO,cAAc,CAAC,GAAyB;QAE9C,OAAO,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC;IAC5C,CAAC;;wHAnIQ,2BAA2B,kBAWhB,QAAQ;4GAXnB,2BAA2B,oFCjCxC,2vBAYM;2FDqBO,2BAA2B;kBAPvC,SAAS;+BAEI,uBAAuB,mBAGhB,uBAAuB,CAAC,MAAM;;0BAalC,MAAM;2BAAC,QAAQ","sourcesContent":["import {Component, ChangeDetectionStrategy, Inject, ChangeDetectorRef} from '@angular/core';\nimport {extend} from '@jscrpt/common';\n\nimport {DATE_API} from '../../../../misc/tokens';\nimport {DateApi, DateApiObject} from '../../../../services/dateApi/dateApi.interface';\nimport {DateTimeLegacyPicker, PeriodData, YearData} from '../../misc/datetimePicker.interface';\nimport {PickerBaseComponent} from '../pickerBase.component';\nimport {YearPickerCssClasses} from './yearPicker.interfaces';\n\n/*\n Default styles for picker\n /\nconst defaultStyles: YearPickerCssClasses =\n{\n periodSelection: 'period',\n previousPeriod: 'fas fa-angle-left clickable',\n nextPeriod: 'fas fa-angle-right clickable',\n periodValue: 'period-value',\n periodData: 'period-data',\n periodDatum: 'period-datum clickable',\n clickable: 'clickable'\n};\n\n/\n Component used for displaying year picker\n /\n@Component(\n{\n selector: 'date-time-year-picker',\n templateUrl: 'yearPicker.component.html',\n styleUrls: ['yearPicker.component.css'],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class DateTimeYearPickerComponent<TDate = any> extends PickerBaseComponent<TDate, YearData<TDate>, YearPickerCssClasses> implements DateTimeLegacyPicker<TDate, YearPickerCssClasses>\n{\n //######################### public properties - template bindings #########################\n\n /\n Displayed decade period\n * @internal\n /\n public period: string = '';\n\n //######################### constructor #########################\n constructor(@Inject(DATE_API) dateApi: DateApi<TDate>,\n changeDetector: ChangeDetectorRef)\n {\n super(dateApi, changeDetector);\n\n this.cssClasses = extend(true, {}, defaultStyles);\n }\n\n //######################### public methods - template bindings #########################\n\n /\n Changes displayed decade to next decade\n * @param event - Event that occured\n * @internal\n /\n public nextDecade(event: Event)\n {\n event.preventDefault();\n this.displayDate!.addYears(10);\n\n this.display(this.displayDate!);\n }\n\n /\n Changes displayed decade to previous decade\n * @param event - Event that occured\n * @internal\n /\n public previousDecade(event: Event)\n {\n event.preventDefault();\n this.displayDate!.subtractYears(10);\n\n this.display(this.displayDate!);\n }\n\n //######################### public methods - implementation of DateTimePicker #########################\n\n /\n Set displays date to be displayed\n * @param value - Value that identifies period that is going to be displayed\n /\n public display(value: DateApiObject<TDate>): void\n {\n this.displayDate = value;\n\n let year = this.displayDate.startOfYear().year();\n\n while(year % 10 !== 0)\n {\n year--;\n }\n\n this.displayDate.year(year).updateOriginal();\n\n this.periodData = [];\n\n for(let x = 0; x < 10; x++)\n {\n this.periodData.push(\n {\n active: false,\n disabled: false,\n date: this.displayDate.value,\n value: year,\n dateObj: this.displayDate.clone(),\n });\n\n year++;\n this.displayDate.addYears(1);\n }\n\n this.displayDate.resetOriginal();\n this._updateMinMax();\n this.period = `${this.displayDate.year()} - ${this.displayDate.year() + 10}`;\n\n //set value if exists\n if(this._value && (this.displayDate.isSameDecade(this._value.from!) \|\| this.displayDate.isSameDecade(this._value.to!)))\n {\n this.setValue(this._value);\n }\n }\n\n //######################### protected methods #########################\n\n /\n Obtains end of period\n * @param period - Period for which should be end obtained\n /\n protected _endOfPeriod(period: PeriodData<TDate>): TDate\n {\n return this._dateApi.getValue(period.date).endOfYear().value;\n }\n\n /\n Tests whether provided value is in same period as displayed picker\n * @param val - Tested value for same period as displayed picker\n /\n protected _isSamePeriodAsDisplayed(val: DateApiObject<TDate>): boolean\n {\n return val.isSameDecade(this.displayDate!.value);\n }\n\n /\n Tests whether provided value is in same period target value\n * @param val - Tested value\n * @param target - Target value to be tested against\n /\n protected _isSamePeriod(val: DateApiObject<TDate>, target: TDate): boolean\n {\n return val.isSameYear(target);\n }\n\n /\n Gets period data for specified value\n * @param val - Value for which is period data obtained\n /\n protected _getPeriodData(val: DateApiObject<TDate>): PeriodData<TDate>\n {\n return this.periodData[val.year() % 10];\n }\n}","<div [ngClass]=\"cssClasses.periodSelection \| asRequired\">\r\n <div [ngClass]=\"cssClasses.previousPeriod \| asRequired\" (mousedown)=\"previousDecade($event)\"></div>\r\n <div [ngClass]=\"cssClasses.periodValue \| asRequired\" [class.clickable]=\"canGoUp\" (mousedown)=\"goUp($event)\">{{period}}</div>\r\n <div [ngClass]=\"cssClasses.nextPeriod \| asRequired\" (mousedown)=\"nextDecade($event)\"></div>\r\n</div>\r\n\r\n<div [ngClass]=\"cssClasses.periodData \| asRequired\">\r\n <div ngFor=\"let year of periodData\"\r\n [ngClass]=\"cssClasses.periodDatum \| asRequired\"\r\n [class.active]=\"year.active\"\r\n [class.disabled]=\"year.disabled\"\r\n (mousedown)=\"select($event, year)\">{{year.value}}</div>\r\n</div>"]}

package/es2020/src/legacy/picker/misc/datetimePicker.interface.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"datetimePicker.interface.js","sourceRoot":"","sources":["../../../../../src/legacy/picker/misc/datetimePicker.interface.ts"],"names":[],"mappings":"","sourcesContent":["import {Type} from '@angular/core';\nimport {Dictionary} from '@jscrpt/common';\nimport {Observable} from 'rxjs';\n\nimport {DateTimeValue} from '../../../interfaces/dateTime/datetime.interface';\nimport {DateApiObject} from '../../../services/dateApi/dateApi.interface';\n\n/*\n Shared css classes for all pickers\n /\nexport interface CommonPickerCssClasses\n{\n /\n Period selection element wrapping displayed period and previous, next buttons\n /\n periodSelection: string;\n\n /\n Element used for switching period to previous one\n /\n previousPeriod: string;\n\n /\n Element used for switching period to next one\n /\n nextPeriod: string;\n\n /\n Element representing currently displayed period\n /\n periodValue: string;\n\n /\n Element wrapping displayed period data\n /\n periodData: string;\n\n /\n Element representing single datum for period item\n /\n periodDatum: string;\n\n /\n Name of css class that represents clickable items in picker\n /\n clickable: string;\n}\n\n/\n Css classes applied to datetime picker\n /\nexport interface DateTimePickerCssClasses\n{\n /\n Shared css classes for all pickers\n /\n pickerShared?: CommonPickerCssClasses;\n\n /\n Custom css classes specific for each picker type\n /\n pickerCustom?: Dictionary<object>;\n}\n\n/\n Defintion of datetime picker component options\n /\nexport interface DateTimePickerLegacyOptions<TPicker = any>\n{\n /\n Order of pickers, it's possible use less pickers as is defined in pickerPeriodsDefinition for example 'month,year'\n /\n pickerPeriodsOrder: string[]\|string\|null;\n\n /\n Definition of types for each period type for picker\n /\n pickerPeriodsDefinition: Dictionary<Type<TPicker>>;\n\n /\n Name of default period for picker that is displayed\n /\n defaultPeriod: string;\n\n /\n Css classes for date time picker\n /\n cssClasses: DateTimePickerCssClasses;\n}\n\n/\n Describes datetime picker component used for displaying and selecting value\n /\nexport interface DateTimeLegacyPicker<TDate = any, TCssClasses = object>\n{\n /\n Gets current value of datetime\n /\n readonly value: DateTimeValue<TDate>\|null;\n\n /\n Occurs when value changes\n /\n readonly valueChange: Observable<void>;\n\n /\n Occurs when user scales up\n /\n readonly scaleUp: Observable<TDate>;\n\n /\n Occurs when user scales down\n /\n readonly scaleDown: Observable<TDate>;\n\n /\n Sets css classes for picker, allowing to override defaults\n * @param cssClasses - Css classes to be set for picker\n /\n setCssClasses(cssClasses: TCssClasses): void;\n\n /\n Sets minimal possible value for picker, that can be picked\n * @param value - Minimal possible value that can be picked\n /\n setMinValue(value: TDate\|null): void;\n\n /\n Sets maximal possible value for picker, that can be picked\n * @param value - Maximal possible value that can be picked\n /\n setMaxValue(value: TDate\|null): void;\n\n /\n Sets value of datetime picker\n * @param value - Value to be set to this picker\n /\n setValue(value: DateTimeValue<TDate>\|null): void;\n\n /\n Set displays date to be displayed\n * @param value - Value that identifies period that is going to be displayed\n /\n display(value: DateApiObject<TDate>): void;\n\n /\n Sets indication whether can go down\n * @param value - Indication whether can go down in period\n /\n setCanGoDown(value: boolean): void;\n\n /\n Sets indication whether can go up\n * @param value - Indication whether can go up in period\n /\n setCanGoUp(value: boolean): void;\n\n /\n Explicitly runs invalidation of content (change detection)\n /\n invalidateVisuals(): void;\n}\n\n/\n Data that represents data for any picker type\n /\nexport interface PeriodData<TDate = any>\n{\n /\n Indication that this period item is active and selected\n /\n active: boolean;\n\n /\n Indication that this period item is disabled\n /\n disabled: boolean;\n\n /\n Date for this period item\n /\n date: TDate;\n}\n\n/\n Data that represents day in date picker\n /\nexport interface DayData<TDate = any> extends PeriodData<TDate>\n{\n\n /\n Indication that this day is out of currently selected month\n /\n otherMonth: boolean;\n\n /\n Indication that this day is today\n /\n today: boolean;\n\n /\n Indication that this day is weekend day\n /\n weekend: boolean;\n\n /\n Day number of month\n /\n day: number;\n}\n\n/\n Data that represents month in date picker\n /\nexport interface MonthData<TDate = any> extends PeriodData<TDate>\n{\n /\n Name of month\n /\n name: string;\n}\n\n/\n Data that represents year in date picker\n /\nexport interface YearData<TDate = any> extends PeriodData<TDate>\n{\n /\n Value of year\n */\n value: number;\n}\n"]}
1	+ {"version":3,"file":"datetimePicker.interface.js","sourceRoot":"","sources":["../../../../../src/legacy/picker/misc/datetimePicker.interface.ts"],"names":[],"mappings":"","sourcesContent":["import {Type} from '@angular/core';\nimport {Dictionary} from '@jscrpt/common';\nimport {Observable} from 'rxjs';\n\nimport {DateTimeValue} from '../../../interfaces/dateTime/datetime.interface';\nimport {DateApiObject} from '../../../services/dateApi/dateApi.interface';\n\n/*\n Shared css classes for all pickers\n /\nexport interface CommonPickerCssClasses\n{\n /\n Period selection element wrapping displayed period and previous, next buttons\n /\n periodSelection: string;\n\n /\n Element used for switching period to previous one\n /\n previousPeriod: string;\n\n /\n Element used for switching period to next one\n /\n nextPeriod: string;\n\n /\n Element representing currently displayed period\n /\n periodValue: string;\n\n /\n Element wrapping displayed period data\n /\n periodData: string;\n\n /\n Element representing single datum for period item\n /\n periodDatum: string;\n\n /\n Name of css class that represents clickable items in picker\n /\n clickable: string;\n}\n\n/\n Css classes applied to datetime picker\n /\nexport interface DateTimePickerCssClasses\n{\n /\n Shared css classes for all pickers\n /\n pickerShared?: CommonPickerCssClasses;\n\n /\n Custom css classes specific for each picker type\n /\n pickerCustom?: Dictionary<object>;\n}\n\n/\n Defintion of datetime picker component options\n /\nexport interface DateTimePickerLegacyOptions<TPicker = any>\n{\n /\n Order of pickers, it's possible use less pickers as is defined in pickerPeriodsDefinition for example 'month,year'\n /\n pickerPeriodsOrder: string[]\|string\|null;\n\n /\n Definition of types for each period type for picker\n /\n pickerPeriodsDefinition: Dictionary<Type<TPicker>>;\n\n /\n Name of default period for picker that is displayed\n /\n defaultPeriod: string;\n\n /\n Css classes for date time picker\n /\n cssClasses: DateTimePickerCssClasses;\n}\n\n/\n Describes datetime picker component used for displaying and selecting value\n /\nexport interface DateTimeLegacyPicker<TDate = any, TCssClasses = object>\n{\n /\n Gets current value of datetime\n /\n readonly value: DateTimeValue<TDate>\|null;\n\n /\n Occurs when value changes\n /\n readonly valueChange: Observable<void>;\n\n /\n Occurs when user scales up\n /\n readonly scaleUp: Observable<TDate>;\n\n /\n Occurs when user scales down\n /\n readonly scaleDown: Observable<TDate>;\n\n /\n Sets css classes for picker, allowing to override defaults\n * @param cssClasses - Css classes to be set for picker\n /\n setCssClasses(cssClasses: TCssClasses): void;\n\n /\n Sets minimal possible value for picker, that can be picked\n * @param value - Minimal possible value that can be picked\n /\n setMinValue(value: TDate\|null): void;\n\n /\n Sets maximal possible value for picker, that can be picked\n * @param value - Maximal possible value that can be picked\n /\n setMaxValue(value: TDate\|null): void;\n\n /\n Sets value of datetime picker\n * @param value - Value to be set to this picker\n /\n setValue(value: DateTimeValue<TDate>\|null): void;\n\n /\n Set displays date to be displayed\n * @param value - Value that identifies period that is going to be displayed\n /\n display(value: DateApiObject<TDate>): void;\n\n /\n Sets indication whether can go down\n * @param value - Indication whether can go down in period\n /\n setCanGoDown(value: boolean): void;\n\n /\n Sets indication whether can go up\n * @param value - Indication whether can go up in period\n /\n setCanGoUp(value: boolean): void;\n\n /\n Explicitly runs invalidation of content (change detection)\n /\n invalidateVisuals(): void;\n}\n\n/\n Data that represents data for any picker type\n /\nexport interface PeriodData<TDate = any>\n{\n /\n Indication that this period item is active and selected\n /\n active: boolean;\n\n /\n Indication that this period item is disabled\n /\n disabled: boolean;\n\n //TODO: remove\n\n /\n Date for this period item\n /\n date: TDate;\n\n /\n Date for this period item as date api object\n /\n dateObj: DateApiObject<TDate>;\n}\n\n/\n Data that represents day in date picker\n /\nexport interface DayData<TDate = any> extends PeriodData<TDate>\n{\n\n /\n Indication that this day is out of currently selected month\n /\n otherMonth: boolean;\n\n /\n Indication that this day is today\n /\n today: boolean;\n\n /\n Indication that this day is weekend day\n /\n weekend: boolean;\n\n /\n Day number of month\n /\n day: number;\n}\n\n/\n Data that represents month in date picker\n /\nexport interface MonthData<TDate = any> extends PeriodData<TDate>\n{\n /\n Name of month\n /\n name: string;\n}\n\n/\n Data that represents year in date picker\n /\nexport interface YearData<TDate = any> extends PeriodData<TDate>\n{\n /\n Value of year\n */\n value: number;\n}\n"]}

package/es2020/src/modules/dateTimePicker/components/dateTimePeriodPickerBase.js CHANGED Viewed

@@ -1,10 +1,16 @@
+import { ChangeDetectorRef, inject } from '@angular/core';
 import { Subject } from 'rxjs';
+import { DATE_API } from '../../../misc/tokens';
 /**
  * Base abstract class for each date time period picker
  */
 export class DateTimePeriodPickerBase {
     constructor() {
         //######################### protected properties #########################
+        /**
+         * Array of period data to be displayed
+         */
+        this.periodData = [];
         /**
          * Subject used for emitting of value changes
          */
@@ -17,6 +23,14 @@ export class DateTimePeriodPickerBase {
          * Subject used for scaling down
          */
         this.scaleDownSubject = new Subject();
+        /**
+         * Change detector instance
+         */
+        this.changeDetector = inject(ChangeDetectorRef);
+        /**
+         * Instance of date api for manipulation with date time
+         */
+        this.dateApi = inject(DATE_API);
         /**
          * @inheritdoc
          */
@@ -26,6 +40,45 @@ export class DateTimePeriodPickerBase {
          */
         this.canScaleDown = false;
     }
+    /**
+     * @inheritdoc
+     */
+    get display() {
+        return this.displayDate?.value;
+    }
+    set display(value) {
+        if (!value) {
+            this.displayDate = null;
+            return;
+        }
+        this.displayDate = this.dateApi.getValue(value);
+    }
+    /**
+     * @inheritdoc
+     */
+    get maxDate() {
+        return this.maxDateObj?.value;
+    }
+    set maxDate(value) {
+        if (!value) {
+            this.maxDateObj = null;
+            return;
+        }
+        this.maxDateObj = this.dateApi.getValue(value);
+    }
+    /**
+     * @inheritdoc
+     */
+    get minDate() {
+        return this.minDateObj?.value;
+    }
+    set minDate(value) {
+        if (!value) {
+            this.minDateObj = null;
+            return;
+        }
+        this.minDateObj = this.dateApi.getValue(value);
+    }
     /**
      * @inheritdoc
      */
@@ -44,5 +97,36 @@ export class DateTimePeriodPickerBase {
     get scaleDown() {
         return this.scaleDownSubject.asObservable();
     }
+    //######################### public methods - implementation of invalidatable #########################
+    /**
+     * @inheritdoc
+     */
+    invalidateVisuals() {
+        this.onRender();
+        this.changeDetector.detectChanges();
+    }
+    /**
+     * Updates minimal and maximal value for picker
+     */
+    updateMinMax() {
+        if (!this.periodData.length) {
+            return;
+        }
+        //no min, no max
+        if (!this.minDateObj && !this.maxDateObj) {
+            this.periodData.forEach(itm => itm.disabled = false);
+            return;
+        }
+        let restAfter = false;
+        for (const period of this.periodData) {
+            if (this.minDateObj && this.minDateObj.isAfter(period.dateObj.value) && !this.isSamePeriod(this.minDateObj, period.dateObj.value)) {
+                period.disabled = true;
+            }
+            if (restAfter || (this.maxDateObj && this.maxDateObj.isBefore(period.dateObj.value) && !this.isSamePeriod(this.maxDateObj, period.dateObj.value))) {
+                restAfter = true;
+                period.disabled = true;
+            }
+        }
+    }
 }
 //# sourceMappingURL=dateTimePeriodPickerBase.js.map

package/es2020/src/modules/dateTimePicker/components/dateTimePeriodPickerBase.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dateTimePeriodPickerBase.js","sourceRoot":"","sources":["../../../../../src/modules/dateTimePicker/components/dateTimePeriodPickerBase.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,OAAO,EAAC,MAAM,MAAM,CAAC;~~AAMzC~~;;GAEG;AACH,MAAM,OAAgB,wBAAwB;IAA9C;QAEI,0EAA0E;QAE1E;;WAEG;QACO,uBAAkB,GAAkB,IAAI,OAAO,EAAQ,CAAC;QAElE;;WAEG;QACO,mBAAc,GAAmB,IAAI,OAAO,EAAS,CAAC;QAEhE;;WAEG;QACO,qBAAgB,GAAmB,IAAI,OAAO,EAAS,CAAC;~~QAkClE~~;;WAEG;QACI,eAAU,GAAY,KAAK,CAAC;QAEnC;;WAEG;QACI,iBAAY,GAAY,KAAK,CAAC;~~IAyBzC~~,CAAC;~~IAvBG~~;;OAEG;IACH,IAAW,WAAW;QAElB,OAAO,IAAI,CAAC,kBAAkB,CAAC,YAAY,EAAE,CAAC;IAClD,CAAC;IAED;;OAEG;IACH,IAAW,OAAO;QAEd,OAAO,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;IAC9C,CAAC;IAED;;OAEG;IACH,IAAW,SAAS;QAEhB,OAAO,IAAI,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC;IAChD,CAAC;CACJ","sourcesContent":["import {Observable, Subject} from 'rxjs';\n\nimport {DateTimeObjectValue} from '../../../misc/types';\nimport {DateApiObject} from '../../../services';\nimport {DateTimePicker} from '../interfaces';\n\n/*\n Base abstract class for each date time period picker\n /\nexport abstract class DateTimePeriodPickerBase<TDate = unknown, TOptions = unknown> implements DateTimePicker<TDate, TOptions>\n{\n //######################### protected properties #########################\n\n /\n Subject used for emitting of value changes\n /\n protected valueChangeSubject: Subject<void> = new Subject<void>();\n\n /\n Subject used for scaling up\n /\n protected scaleUpSubject: Subject<TDate> = new Subject<TDate>();\n\n /\n Subject used for scaling down\n /\n protected scaleDownSubject: Subject<TDate> = new Subject<TDate>();\n\n /\n Date api instance for displayed date\n /\n protected displayDate: DateApiObject<TDate>\|undefined\|null;\n\n //######################### public properties - implementation of DateTimePicker #########################\n\n /\n @inheritdoc\n /\n public value: DateTimeObjectValue<TDate>\|undefined\|null;\n\n /\n @inheritdoc\n /\n public options: TOptions\|undefined\|null;\n\n /\n @inheritdoc\n /\n public display: TDate\|undefined\|null;\n\n /\n @inheritdoc\n /\n public maxDate: TDate\|undefined\|null;\n\n /\n @inheritdoc\n /\n public minDate: TDate\|undefined\|null;\n\n /\n @inheritdoc\n /\n public canScaleUp: boolean = false;\n\n /\n @inheritdoc\n /\n public canScaleDown: boolean = false;\n\n /\n @inheritdoc\n /\n public get valueChange(): Observable<void>\n {\n return this.valueChangeSubject.asObservable();\n }\n\n /\n @inheritdoc\n /\n public get scaleUp(): Observable<TDate>\n {\n return this.scaleUpSubject.asObservable();\n }\n\n /\n @inheritdoc\n */\n public get scaleDown(): Observable<TDate>\n {\n return this.scaleDownSubject.asObservable();\n }\n}"]}
1	+ {"version":3,"file":"dateTimePeriodPickerBase.js","sourceRoot":"","sources":["../../../../../src/modules/dateTimePicker/components/dateTimePeriodPickerBase.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,iBAAiB,EAAE,MAAM,EAAC,MAAM,eAAe,CAAC;AACxD,OAAO,EAAa,OAAO,EAAC,MAAM,MAAM,CAAC;AAGzC,OAAO,EAAC,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AAK9C;;GAEG;AACH,MAAM,OAAgB,wBAAwB;IAA9C;QAEI,0EAA0E;QAE1E;;WAEG;QACO,eAAU,GAAc,EAAE,CAAC;QAErC;;WAEG;QACO,uBAAkB,GAAkB,IAAI,OAAO,EAAQ,CAAC;QAElE;;WAEG;QACO,mBAAc,GAAmB,IAAI,OAAO,EAAS,CAAC;QAEhE;;WAEG;QACO,qBAAgB,GAAmB,IAAI,OAAO,EAAS,CAAC;QAiBlE;;WAEG;QACO,mBAAc,GAAsB,MAAM,CAAC,iBAAiB,CAAC,CAAC;QAExE;;WAEG;QACO,YAAO,GAAmB,MAAM,CAAC,QAAQ,CAAC,CAAC;QAuErD;;WAEG;QACI,eAAU,GAAY,KAAK,CAAC;QAEnC;;WAEG;QACI,iBAAY,GAAY,KAAK,CAAC;IAsFzC,CAAC;IAvJG;;OAEG;IACH,IAAW,OAAO;QAEd,OAAO,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC;IACnC,CAAC;IACD,IAAW,OAAO,CAAC,KAA2B;QAE1C,IAAG,CAAC,KAAK,EACT;YACI,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;YAExB,OAAO;SACV;QAED,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,CAAC;IAED;;OAEG;IACH,IAAW,OAAO;QAEd,OAAO,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC;IAClC,CAAC;IACD,IAAW,OAAO,CAAC,KAA2B;QAE1C,IAAG,CAAC,KAAK,EACT;YACI,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YAEvB,OAAO;SACV;QAED,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACnD,CAAC;IAED;;OAEG;IACH,IAAW,OAAO;QAEd,OAAO,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC;IAClC,CAAC;IACD,IAAW,OAAO,CAAC,KAA2B;QAE1C,IAAG,CAAC,KAAK,EACT;YACI,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YAEvB,OAAO;SACV;QAED,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACnD,CAAC;IAYD;;OAEG;IACH,IAAW,WAAW;QAElB,OAAO,IAAI,CAAC,kBAAkB,CAAC,YAAY,EAAE,CAAC;IAClD,CAAC;IAED;;OAEG;IACH,IAAW,OAAO;QAEd,OAAO,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;IAC9C,CAAC;IAED;;OAEG;IACH,IAAW,SAAS;QAEhB,OAAO,IAAI,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC;IAChD,CAAC;IAED,sGAAsG;IAEtG;;OAEG;IACI,iBAAiB;QAEpB,IAAI,CAAC,QAAQ,EAAE,CAAC;QAEhB,IAAI,CAAC,cAAc,CAAC,aAAa,EAAE,CAAC;IACxC,CAAC;IAgBD;;OAEG;IACO,YAAY;QAElB,IAAG,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,EAC1B;YACI,OAAO;SACV;QAED,gBAAgB;QAChB,IAAG,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,UAAU,EACvC;YACI,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,QAAQ,GAAG,KAAK,CAAC,CAAC;YAErD,OAAO;SACV;QAED,IAAI,SAAS,GAAG,KAAK,CAAC;QAEtB,KAAI,MAAM,MAAM,IAAI,IAAI,CAAC,UAAU,EACnC;YACI,IAAG,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAChI;gBACI,MAAM,CAAC,QAAQ,GAAG,IAAI,CAAC;aAC1B;YAED,IAAG,SAAS,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAChJ;gBACI,SAAS,GAAG,IAAI,CAAC;gBACjB,MAAM,CAAC,QAAQ,GAAG,IAAI,CAAC;aAC1B;SACJ;IACL,CAAC;CACJ","sourcesContent":["import {ChangeDetectorRef, inject} from '@angular/core';\nimport {Observable, Subject} from 'rxjs';\n\nimport {PeriodData} from '../../../legacy/picker/interfaces';\nimport {DATE_API} from '../../../misc/tokens';\nimport {DateTimeObjectValue} from '../../../misc/types';\nimport {DateApi, DateApiObject} from '../../../services';\nimport {DateTimePicker} from '../interfaces';\n\n/*\n Base abstract class for each date time period picker\n /\nexport abstract class DateTimePeriodPickerBase<TPeriod extends PeriodData<TDate>, TDate = unknown, TOptions = unknown> implements DateTimePicker<TDate, TOptions>\n{\n //######################### protected properties #########################\n\n /\n Array of period data to be displayed\n /\n protected periodData: TPeriod[] = [];\n\n /\n Subject used for emitting of value changes\n /\n protected valueChangeSubject: Subject<void> = new Subject<void>();\n\n /\n Subject used for scaling up\n /\n protected scaleUpSubject: Subject<TDate> = new Subject<TDate>();\n\n /\n Subject used for scaling down\n /\n protected scaleDownSubject: Subject<TDate> = new Subject<TDate>();\n\n /\n Date api instance for displayed date\n /\n protected displayDate: DateApiObject<TDate>\|undefined\|null;\n\n /\n Date api instance for max date\n /\n protected maxDateObj: DateApiObject<TDate>\|undefined\|null;\n\n /\n Date api instance for min date\n /\n protected minDateObj: DateApiObject<TDate>\|undefined\|null;\n\n /\n Change detector instance\n /\n protected changeDetector: ChangeDetectorRef = inject(ChangeDetectorRef);\n\n /\n Instance of date api for manipulation with date time\n /\n protected dateApi: DateApi<TDate> = inject(DATE_API);\n\n //######################### public properties - implementation of DateTimePicker #########################\n\n /\n @inheritdoc\n /\n public value: DateTimeObjectValue<TDate>\|undefined\|null;\n\n /\n @inheritdoc\n /\n public options: TOptions\|undefined\|null;\n\n /\n @inheritdoc\n /\n public get display(): TDate\|undefined\|null\n {\n return this.displayDate?.value;\n }\n public set display(value: TDate\|undefined\|null)\n {\n if(!value)\n {\n this.displayDate = null;\n\n return;\n }\n\n this.displayDate = this.dateApi.getValue(value);\n }\n\n /\n @inheritdoc\n /\n public get maxDate(): TDate\|undefined\|null\n {\n return this.maxDateObj?.value;\n }\n public set maxDate(value: TDate\|undefined\|null)\n {\n if(!value)\n {\n this.maxDateObj = null;\n\n return;\n }\n\n this.maxDateObj = this.dateApi.getValue(value);\n }\n\n /\n @inheritdoc\n /\n public get minDate(): TDate\|undefined\|null\n {\n return this.minDateObj?.value;\n }\n public set minDate(value: TDate\|undefined\|null)\n {\n if(!value)\n {\n this.minDateObj = null;\n\n return;\n }\n\n this.minDateObj = this.dateApi.getValue(value);\n }\n\n /\n @inheritdoc\n /\n public canScaleUp: boolean = false;\n\n /\n @inheritdoc\n /\n public canScaleDown: boolean = false;\n\n /\n @inheritdoc\n /\n public get valueChange(): Observable<void>\n {\n return this.valueChangeSubject.asObservable();\n }\n\n /\n @inheritdoc\n /\n public get scaleUp(): Observable<TDate>\n {\n return this.scaleUpSubject.asObservable();\n }\n\n /\n @inheritdoc\n /\n public get scaleDown(): Observable<TDate>\n {\n return this.scaleDownSubject.asObservable();\n }\n\n //######################### public methods - implementation of invalidatable #########################\n\n /\n @inheritdoc\n /\n public invalidateVisuals(): void\n {\n this.onRender();\n\n this.changeDetector.detectChanges();\n }\n\n //######################### protected methods #########################\n\n /\n Method that is being called to render changes\n /\n protected abstract onRender(): void;\n\n /\n Tests whether provided value is in same period target value\n * @param val - Tested value\n * @param target - Target value to be tested against\n /\n protected abstract isSamePeriod(val: DateApiObject<TDate>, target: TDate): boolean;\n\n /\n Updates minimal and maximal value for picker\n */\n protected updateMinMax(): void\n {\n if(!this.periodData.length)\n {\n return;\n }\n\n //no min, no max\n if(!this.minDateObj && !this.maxDateObj)\n {\n this.periodData.forEach(itm => itm.disabled = false);\n\n return;\n }\n\n let restAfter = false;\n\n for(const period of this.periodData)\n {\n if(this.minDateObj && this.minDateObj.isAfter(period.dateObj.value) && !this.isSamePeriod(this.minDateObj, period.dateObj.value))\n {\n period.disabled = true;\n }\n\n if(restAfter \|\| (this.maxDateObj && this.maxDateObj.isBefore(period.dateObj.value) && !this.isSamePeriod(this.maxDateObj, period.dateObj.value)))\n {\n restAfter = true;\n period.disabled = true;\n }\n }\n }\n}"]}

package/es2020/src/modules/dateTimePicker/components/dateTimePicker/dateTimePicker.component.js CHANGED Viewed

@@ -5,9 +5,11 @@ import { Subscription } from 'rxjs';
 import { DATE_TIME_PICKER_OPTIONS } from '../../misc/tokens';
 import { DayPickerSAComponent } from '../dayPicker/dayPicker.component';
 import { formatDateTime, parseDateTime } from '../../../../misc/utils';
-import { DateTimeValueFormat } from '../../../../misc/enums';
 import { DateTimeDirective } from '../../../dateTime/directives';
+import { DateValueProvider } from '../../../../services';
 import * as i0 from "@angular/core";
+import * as i1 from "../../../../services";
+//TODO: use mixin for set internal
 /**
  * Text to be displayed when configuration, options are corrupted
  */
@@ -26,9 +28,10 @@ const defaultOptions = {
  */
 export class DateTimePickerComponent extends DateTimeDirective {
     //######################### constructor #########################
-    constructor(position, options) {
+    constructor(position, valueProvider, options) {
         super();
         this.position = position;
+        this.valueProvider = valueProvider;
         //######################### public properties - outputs #########################
         /**
          * @inheritdoc
@@ -44,6 +47,18 @@ export class DateTimePickerComponent extends DateTimeDirective {
             throw new Error(CORRUPTED_CONFIG_TEXT);
         }
     }
+    //######################### public properties - inputs #########################
+    /**
+     * @inheritdoc
+     */
+    get value() {
+        return this.ɵValue;
+    }
+    set value(value) {
+        //accepts all available formats
+        this.setInternalValue(value);
+        this.ɵValue = formatDateTime(this.internalValue, this.valueFormat, this.customFormat);
+    }
     /**
      * Options for date time picker
      */
@@ -56,18 +71,47 @@ export class DateTimePickerComponent extends DateTimeDirective {
             this.ɵOptions.periodsDefinition = value.periodsDefinition;
         }
     }
+    //######################### public methods - implementation of OnInit #########################
+    /**
+     * Initialize component
+     */
+    ngOnInit() {
+        //empty value show now
+        if (isBlank(this.value)) {
+            const now = this.dateApi.now();
+            this.showPicker(this.displayedPeriodType, now.value);
+        }
+        else {
+            const val = (Array.isArray(this.internalValue) ? this.internalValue[0] : this.internalValue) ?? this.dateApi.now();
+            this.showPicker(this.displayedPeriodType, val.value);
+        }
+    }
     //######################### public methods - implementation of OnChanges #########################
     /**
      * Called when input value changes
      */
     ngOnChanges(changes) {
+        if (!this.component) {
+            return;
+        }
+        const component = this.component.instance;
+        let invalidate = false;
+        if (nameof('maxDateTime') in changes) {
+            component.maxDate = this.maxDateTime;
+            invalidate = true;
+        }
+        if (nameof('minDateTime') in changes) {
+            component.minDate = this.minDateTime;
+            invalidate = true;
+        }
         if (nameof('value') in changes) {
-            //empty value show now
-            if (isBlank(this.value)) {
-                const now = this.dateApi.now();
-                this.showPicker(this.displayedPeriodType, now.value);
-                return;
-            }
+            const val = (Array.isArray(this.internalValue) ? this.internalValue[0] : this.internalValue) ?? this.dateApi.now();
+            component.display = val.isValid() ? val.value : this.dateApi.now().value;
+            component.value = this.internalValue;
+            invalidate = true;
+        }
+        if (this.component && invalidate) {
+            this.component.instance.invalidateVisuals();
         }
     }
     //######################### public methods - implementation of OnDestroy #########################
@@ -82,6 +126,38 @@ export class DateTimePickerComponent extends DateTimeDirective {
         this.periodChangesSubscription = null;
     }
     //######################### protected methods #########################
+    /**
+     * Sets internal value and fix lowest time difference
+     * @param value - Value to be set
+     */
+    setInternalValue(value) {
+        this.internalValue = parseDateTime(value, this.dateApi, null, this.customFormat);
+        if (isBlank(this.internalValue)) {
+            return;
+        }
+        //ranged value
+        if (Array.isArray(this.internalValue)) {
+            const [from, to] = this.internalValue;
+            if (from) {
+                const val = this.valueProvider.getValue(from.value, this.customFormat).from;
+                if (val) {
+                    this.internalValue[0] = this.dateApi.getValue(val, this.customFormat);
+                }
+            }
+            if (to) {
+                const val = this.valueProvider.getValue(to.value, this.customFormat).to;
+                if (val) {
+                    this.internalValue[1] = this.dateApi.getValue(val, this.customFormat);
+                }
+            }
+        }
+        else {
+            const val = this.valueProvider.getValue(this.internalValue.value, this.customFormat).from;
+            if (val) {
+                this.internalValue = this.dateApi.getValue(val, this.customFormat);
+            }
+        }
+    }
     /**
      * Shows picker
      * @param type - Type of period that should be displayed
@@ -102,7 +178,13 @@ export class DateTimePickerComponent extends DateTimeDirective {
                 if (!component) {
                     return;
                 }
-                this.value = formatDateTime(component.value, DateTimeValueFormat.DateInstance, null);
+                if (!Array.isArray(component.value)) {
+                    this.setInternalValue(component.value?.value);
+                }
+                else {
+                    //TODO: handle ranges
+                }
+                this.value = formatDateTime(this.internalValue, this.valueFormat, this.customFormat);
                 this.valueChange.emit();
             }));
             this.periodChangesSubscription.add(this.component.instance.scaleUp.subscribe(date => this.showPicker(this.getUpperType(), date)));
@@ -113,8 +195,10 @@ export class DateTimePickerComponent extends DateTimeDirective {
             component.canScaleUp = false;
         component.display = displayDate;
         // component.options
-        //TODO: maybe add support for format!
-        component.value = parseDateTime(this.value, this.dateApi, null, null);
+        component.maxDate = this.maxDateTime;
+        component.minDate = this.minDateTime;
+        component.value = this.internalValue;
+        component.invalidateVisuals();
     }
     /**
      * Gets type that is above current period picker
@@ -149,7 +233,7 @@ export class DateTimePickerComponent extends DateTimeDirective {
         return this.displayedPeriodType;
     }
 }
-DateTimePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: DateTimePickerComponent, deps: [{ token: POSITION }, { token: DATE_TIME_PICKER_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+DateTimePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: DateTimePickerComponent, deps: [{ token: POSITION }, { token: i1.DateValueProvider }, { token: DATE_TIME_PICKER_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
 DateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: DateTimePickerComponent, selector: "date-time-picker", inputs: { value: "value", options: "options" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "pickerContainer", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container #container></ng-container>", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: DateTimePickerComponent, decorators: [{
             type: Component,
@@ -157,7 +241,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [POSITION]
-                }] }, { type: undefined, decorators: [{
+                }] }, { type: i1.DateValueProvider }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [DATE_TIME_PICKER_OPTIONS]
                 }, {