monkey-style-guide 2.0.119 → 2.0.122
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.
- package/assets/scss/partials/components/_table.scss +5 -0
- package/esm2020/lib/components/date-range-picker/date-range-picker.component.mjs +66 -47
- package/esm2020/lib/components/table/table.component.mjs +10 -2
- package/fesm2015/monkey-style-guide.mjs +74 -47
- package/fesm2015/monkey-style-guide.mjs.map +1 -1
- package/fesm2020/monkey-style-guide.mjs +74 -47
- package/fesm2020/monkey-style-guide.mjs.map +1 -1
- package/lib/components/date-range-picker/date-range-picker.component.d.ts +4 -2
- package/lib/components/table/table.component.d.ts +3 -1
- package/monkey-style-guide-2.0.122.tgz +0 -0
- package/package.json +1 -1
- package/monkey-style-guide-2.0.119.tgz +0 -0
|
@@ -3043,19 +3043,23 @@ class MonkeyDateRangePickerComponent {
|
|
|
3043
3043
|
this.fb = fb;
|
|
3044
3044
|
this.cdr = cdr;
|
|
3045
3045
|
this.helperMessage = '';
|
|
3046
|
-
this.
|
|
3046
|
+
this.moveDaysForward = true;
|
|
3047
3047
|
this.onChange = new EventEmitter();
|
|
3048
|
-
this.today = moment
|
|
3048
|
+
this.today = moment().format('YYYY-MM-DD');
|
|
3049
3049
|
this.onModelChange = (value) => { };
|
|
3050
3050
|
this.onModelTouched = (value) => { };
|
|
3051
|
-
this._dateFirst = moment
|
|
3052
|
-
this._dateSecond = moment
|
|
3051
|
+
this._dateFirst = moment();
|
|
3052
|
+
this._dateSecond = moment().add(1, 'M');
|
|
3053
3053
|
this._id = `mecx-date-range-picker-${MonkeyUtils.getRandomString(10)}`;
|
|
3054
3054
|
this._daysArrFirst = [];
|
|
3055
3055
|
this._daysArrSecond = [];
|
|
3056
3056
|
this._disabled = false;
|
|
3057
|
+
this._minDate = null;
|
|
3057
3058
|
this.initDateRange();
|
|
3058
3059
|
}
|
|
3060
|
+
set minDate(value) {
|
|
3061
|
+
this._minDate = !this.moveDaysForward ? null : value;
|
|
3062
|
+
}
|
|
3059
3063
|
initDateRange() {
|
|
3060
3064
|
return (this._dateForm = this.fb.group({
|
|
3061
3065
|
startDate: [null, Validators.required],
|
|
@@ -3063,12 +3067,12 @@ class MonkeyDateRangePickerComponent {
|
|
|
3063
3067
|
}));
|
|
3064
3068
|
}
|
|
3065
3069
|
createCalendar(month) {
|
|
3066
|
-
let firstDay = moment
|
|
3067
|
-
let lastDay = moment
|
|
3070
|
+
let firstDay = moment(month).startOf('M');
|
|
3071
|
+
let lastDay = moment(month).endOf('M');
|
|
3068
3072
|
let days = Array.apply(null, { length: month.daysInMonth() })
|
|
3069
3073
|
.map(Number.call, Number)
|
|
3070
3074
|
.map((n) => {
|
|
3071
|
-
return moment
|
|
3075
|
+
return moment(firstDay).add(n, 'd');
|
|
3072
3076
|
});
|
|
3073
3077
|
let n = 0;
|
|
3074
3078
|
while (n < firstDay.weekday()) {
|
|
@@ -3106,8 +3110,8 @@ class MonkeyDateRangePickerComponent {
|
|
|
3106
3110
|
this.writeValue(this._dateForm.value);
|
|
3107
3111
|
}
|
|
3108
3112
|
navigateToToday() {
|
|
3109
|
-
this._dateFirst = moment
|
|
3110
|
-
this._dateSecond = moment
|
|
3113
|
+
this._dateFirst = moment();
|
|
3114
|
+
this._dateSecond = moment().add(1, 'M');
|
|
3111
3115
|
this.build();
|
|
3112
3116
|
}
|
|
3113
3117
|
ngOnInit() {
|
|
@@ -3162,14 +3166,14 @@ class MonkeyDateRangePickerComponent {
|
|
|
3162
3166
|
if (!day) {
|
|
3163
3167
|
return false;
|
|
3164
3168
|
}
|
|
3165
|
-
return moment
|
|
3169
|
+
return moment().format('L') === day.format('L');
|
|
3166
3170
|
}
|
|
3167
3171
|
isSelected(day) {
|
|
3168
3172
|
if (!day) {
|
|
3169
3173
|
return false;
|
|
3170
3174
|
}
|
|
3171
|
-
let startDateMoment = moment
|
|
3172
|
-
let endDateMoment = moment
|
|
3175
|
+
let startDateMoment = moment(this._dateForm.value.startDate, 'YYYY-MM-DD');
|
|
3176
|
+
let endDateMoment = moment(this._dateForm.value.endDate, 'YYYY-MM-DD');
|
|
3173
3177
|
if (this._dateForm.valid) {
|
|
3174
3178
|
return startDateMoment.isSameOrBefore(day) && endDateMoment.isSameOrAfter(day);
|
|
3175
3179
|
}
|
|
@@ -3178,9 +3182,9 @@ class MonkeyDateRangePickerComponent {
|
|
|
3178
3182
|
}
|
|
3179
3183
|
}
|
|
3180
3184
|
isDisabled(day) {
|
|
3181
|
-
const {
|
|
3182
|
-
if (
|
|
3183
|
-
const firstDay = moment
|
|
3185
|
+
const { _minDate } = this;
|
|
3186
|
+
if (_minDate) {
|
|
3187
|
+
const firstDay = moment(_minDate);
|
|
3184
3188
|
return day.isBefore(firstDay.subtract(1, 'day'));
|
|
3185
3189
|
}
|
|
3186
3190
|
return false;
|
|
@@ -3196,52 +3200,65 @@ class MonkeyDateRangePickerComponent {
|
|
|
3196
3200
|
return day === null || day === void 0 ? void 0 : day.isSame(endDate);
|
|
3197
3201
|
}
|
|
3198
3202
|
selectedDate(day) {
|
|
3199
|
-
|
|
3200
|
-
|
|
3201
|
-
const { _dateForm, minDate } = this;
|
|
3202
|
-
let dayFormatted = day.format('YYYY-MM-DD');
|
|
3203
|
-
if (minDate) {
|
|
3204
|
-
const firstDay = moment.default(minDate);
|
|
3205
|
-
if (day.isBefore(firstDay.subtract(1, 'day')))
|
|
3203
|
+
try {
|
|
3204
|
+
if (this._disabled)
|
|
3206
3205
|
return;
|
|
3207
|
-
|
|
3208
|
-
|
|
3209
|
-
|
|
3210
|
-
|
|
3211
|
-
|
|
3212
|
-
|
|
3213
|
-
|
|
3214
|
-
|
|
3206
|
+
const { _dateForm, _minDate } = this;
|
|
3207
|
+
let dayFormatted = day.format('YYYY-MM-DD');
|
|
3208
|
+
if (_minDate) {
|
|
3209
|
+
const firstDay = moment(_minDate);
|
|
3210
|
+
if (day.isBefore(firstDay.subtract(1, 'day')))
|
|
3211
|
+
return;
|
|
3212
|
+
}
|
|
3213
|
+
if (_dateForm.valid) {
|
|
3214
|
+
this.clearDates();
|
|
3215
|
+
}
|
|
3216
|
+
let { startDate, endDate } = _dateForm.value;
|
|
3217
|
+
if (startDate) {
|
|
3218
|
+
if (moment(startDate).isAfter(moment(dayFormatted))) {
|
|
3219
|
+
endDate = startDate;
|
|
3220
|
+
startDate = dayFormatted;
|
|
3221
|
+
}
|
|
3222
|
+
else {
|
|
3223
|
+
endDate = dayFormatted;
|
|
3224
|
+
}
|
|
3225
|
+
}
|
|
3226
|
+
else
|
|
3215
3227
|
startDate = dayFormatted;
|
|
3228
|
+
if (startDate) {
|
|
3229
|
+
_dateForm.get('startDate').patchValue(startDate);
|
|
3216
3230
|
}
|
|
3217
|
-
|
|
3218
|
-
endDate
|
|
3231
|
+
if (endDate) {
|
|
3232
|
+
_dateForm.get('endDate').patchValue(endDate);
|
|
3219
3233
|
}
|
|
3234
|
+
console.log(_dateForm.value);
|
|
3235
|
+
this.writeValue(_dateForm.value);
|
|
3220
3236
|
}
|
|
3221
|
-
|
|
3222
|
-
|
|
3223
|
-
if (startDate) {
|
|
3224
|
-
_dateForm.get('startDate').patchValue(startDate);
|
|
3225
|
-
}
|
|
3226
|
-
if (endDate) {
|
|
3227
|
-
_dateForm.get('endDate').patchValue(endDate);
|
|
3237
|
+
catch (e) {
|
|
3238
|
+
console.log(e);
|
|
3228
3239
|
}
|
|
3229
|
-
this.writeValue(_dateForm.value);
|
|
3230
3240
|
}
|
|
3231
3241
|
selectRangeOfDays(days) {
|
|
3232
3242
|
if (this._disabled)
|
|
3233
3243
|
return;
|
|
3234
|
-
const { _dateForm,
|
|
3244
|
+
const { _dateForm, _minDate, today, moveDaysForward } = this;
|
|
3235
3245
|
const { startDate } = _dateForm.value;
|
|
3236
|
-
const firstDay = moment
|
|
3237
|
-
const
|
|
3238
|
-
|
|
3239
|
-
|
|
3246
|
+
const firstDay = moment(startDate || _minDate || today).format('YYYY-MM-DD');
|
|
3247
|
+
const method = moveDaysForward ? 'add' : 'subtract';
|
|
3248
|
+
const lastDay = moment(firstDay)[method](days, 'day').format('YYYY-MM-DD');
|
|
3249
|
+
if (moveDaysForward) {
|
|
3250
|
+
_dateForm.get('startDate').patchValue(firstDay);
|
|
3251
|
+
_dateForm.get('endDate').patchValue(lastDay);
|
|
3252
|
+
}
|
|
3253
|
+
else {
|
|
3254
|
+
_dateForm.get('startDate').patchValue(lastDay);
|
|
3255
|
+
_dateForm.get('endDate').patchValue(firstDay);
|
|
3256
|
+
}
|
|
3240
3257
|
this.writeValue(_dateForm.value);
|
|
3241
3258
|
}
|
|
3242
3259
|
}
|
|
3243
3260
|
MonkeyDateRangePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0", ngImport: i0, type: MonkeyDateRangePickerComponent, deps: [{ token: i1$2.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3244
|
-
MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.0", type: MonkeyDateRangePickerComponent, selector: "monkey-date-range-picker", inputs: { label: "label", helperMessage: "helperMessage", i18n: "i18n", infoMessage: "infoMessage", errorMessage: "errorMessage", minDate: "minDate", value: "value" }, outputs: { onChange: "onChange" }, providers: [
|
|
3261
|
+
MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.0", type: MonkeyDateRangePickerComponent, selector: "monkey-date-range-picker", inputs: { label: "label", helperMessage: "helperMessage", i18n: "i18n", infoMessage: "infoMessage", errorMessage: "errorMessage", moveDaysForward: "moveDaysForward", minDate: "minDate", value: "value" }, outputs: { onChange: "onChange" }, providers: [
|
|
3245
3262
|
{
|
|
3246
3263
|
provide: NG_VALUE_ACCESSOR,
|
|
3247
3264
|
useExisting: forwardRef(() => MonkeyDateRangePickerComponent),
|
|
@@ -3584,6 +3601,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImpor
|
|
|
3584
3601
|
type: Input
|
|
3585
3602
|
}], errorMessage: [{
|
|
3586
3603
|
type: Input
|
|
3604
|
+
}], moveDaysForward: [{
|
|
3605
|
+
type: Input
|
|
3587
3606
|
}], minDate: [{
|
|
3588
3607
|
type: Input
|
|
3589
3608
|
}], onChange: [{
|
|
@@ -7521,6 +7540,7 @@ class MonkeyTableComponent {
|
|
|
7521
7540
|
this.selectedList = null;
|
|
7522
7541
|
this.selection = new EventEmitter();
|
|
7523
7542
|
this.selected = new EventEmitter();
|
|
7543
|
+
this.clicked = new EventEmitter();
|
|
7524
7544
|
this.list = [];
|
|
7525
7545
|
this._maxWidth = 100;
|
|
7526
7546
|
//not to do
|
|
@@ -7612,9 +7632,12 @@ class MonkeyTableComponent {
|
|
|
7612
7632
|
onHandleSelectedAll() {
|
|
7613
7633
|
return this.list.length === this.newDataSource.length;
|
|
7614
7634
|
}
|
|
7635
|
+
onHandleClicked(row) {
|
|
7636
|
+
this.clicked.next(row);
|
|
7637
|
+
}
|
|
7615
7638
|
}
|
|
7616
7639
|
MonkeyTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0", ngImport: i0, type: MonkeyTableComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
7617
|
-
MonkeyTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.0", type: MonkeyTableComponent, selector: "monkey-table", inputs: { headers: "headers", dataSource: "dataSource", loading: "loading", rowTemplate: "rowTemplate", selectable: "selectable", showSelectAll: "showSelectAll", callbackValidation: "callbackValidation", callbackValidationAll: "callbackValidationAll", selectedList: "selectedList", functionId: "functionId" }, outputs: { selection: "selection", selected: "selected" }, usesOnChanges: true, ngImport: i0, template: `
|
|
7640
|
+
MonkeyTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.0", type: MonkeyTableComponent, selector: "monkey-table", inputs: { headers: "headers", dataSource: "dataSource", loading: "loading", rowTemplate: "rowTemplate", selectable: "selectable", showSelectAll: "showSelectAll", callbackValidation: "callbackValidation", callbackValidationAll: "callbackValidationAll", selectedList: "selectedList", functionId: "functionId" }, outputs: { selection: "selection", selected: "selected", clicked: "clicked" }, usesOnChanges: true, ngImport: i0, template: `
|
|
7618
7641
|
<mecx-monkey-table>
|
|
7619
7642
|
<mecx-monkey-table-header>
|
|
7620
7643
|
<monkey-checkbox
|
|
@@ -7630,6 +7653,7 @@ MonkeyTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
|
|
|
7630
7653
|
<mecx-monkey-table-body-row
|
|
7631
7654
|
[class.selected]="onHandleSelected(row)"
|
|
7632
7655
|
*ngFor="let row of newDataSource"
|
|
7656
|
+
(click)="onHandleClicked(row)"
|
|
7633
7657
|
>
|
|
7634
7658
|
<monkey-checkbox
|
|
7635
7659
|
[value]="onHandleSelected(row)"
|
|
@@ -7666,6 +7690,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImpor
|
|
|
7666
7690
|
<mecx-monkey-table-body-row
|
|
7667
7691
|
[class.selected]="onHandleSelected(row)"
|
|
7668
7692
|
*ngFor="let row of newDataSource"
|
|
7693
|
+
(click)="onHandleClicked(row)"
|
|
7669
7694
|
>
|
|
7670
7695
|
<monkey-checkbox
|
|
7671
7696
|
[value]="onHandleSelected(row)"
|
|
@@ -7708,6 +7733,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImpor
|
|
|
7708
7733
|
type: Output
|
|
7709
7734
|
}], selected: [{
|
|
7710
7735
|
type: Output
|
|
7736
|
+
}], clicked: [{
|
|
7737
|
+
type: Output
|
|
7711
7738
|
}] } });
|
|
7712
7739
|
|
|
7713
7740
|
/**************************
|