monkey-style-guide 2.0.211 → 2.0.212
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/esm2020/lib/components/date-range-picker/date-range-picker.component.mjs +14 -9
- package/esm2020/lib/components/date-range-picker-v2/date-range-picker.component.mjs +14 -9
- package/esm2020/lib/components/input/input-filter.component.mjs +1 -1
- package/esm2020/lib/components/input/input.component.mjs +1 -1
- package/fesm2015/monkey-style-guide.mjs +28 -18
- package/fesm2015/monkey-style-guide.mjs.map +1 -1
- package/fesm2020/monkey-style-guide.mjs +28 -18
- package/fesm2020/monkey-style-guide.mjs.map +1 -1
- package/lib/components/date-range-picker/date-range-picker.component.d.ts +1 -0
- package/lib/components/date-range-picker-v2/date-range-picker.component.d.ts +1 -0
- package/monkey-style-guide-2.0.212.tgz +0 -0
- package/package.json +1 -1
- package/monkey-style-guide-2.0.211.tgz +0 -0
|
@@ -5318,6 +5318,7 @@ class MonkeyDateRangePickerComponent {
|
|
|
5318
5318
|
this.helperMessage = '';
|
|
5319
5319
|
this.moveDaysForward = true;
|
|
5320
5320
|
this.onChange = new EventEmitter();
|
|
5321
|
+
this.isPickerFocused = false;
|
|
5321
5322
|
this.today = moment$2.default().format('YYYY-MM-DD');
|
|
5322
5323
|
this.onModelChange = (value) => { };
|
|
5323
5324
|
this.onModelTouched = (value) => { };
|
|
@@ -5584,10 +5585,11 @@ MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
5584
5585
|
</span>
|
|
5585
5586
|
<span class="data">
|
|
5586
5587
|
<input
|
|
5587
|
-
class="date-input"
|
|
5588
5588
|
type="date"
|
|
5589
5589
|
[(ngModel)]="_startDate"
|
|
5590
5590
|
(change)="onDataChange($event, true)"
|
|
5591
|
+
(focus)="isPickerFocused = true"
|
|
5592
|
+
(blur)="isPickerFocused = false"
|
|
5591
5593
|
/>
|
|
5592
5594
|
</span>
|
|
5593
5595
|
</div>
|
|
@@ -5598,9 +5600,10 @@ MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
5598
5600
|
<span class="data">
|
|
5599
5601
|
<input
|
|
5600
5602
|
type="date"
|
|
5601
|
-
class="date-input"
|
|
5602
5603
|
[(ngModel)]="_endDate"
|
|
5603
5604
|
(change)="onDataChange($event, false)"
|
|
5605
|
+
(focus)="isPickerFocused = true"
|
|
5606
|
+
(blur)="isPickerFocused = false"
|
|
5604
5607
|
/>
|
|
5605
5608
|
</span>
|
|
5606
5609
|
</div>
|
|
@@ -5608,7 +5611,7 @@ MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
5608
5611
|
{{ i18n?.select }}
|
|
5609
5612
|
</ng-template>
|
|
5610
5613
|
</mecx-date-range-picker-selected-dates>
|
|
5611
|
-
<mecx-date-range-picker-group-body>
|
|
5614
|
+
<mecx-date-range-picker-group-body [class.picker-open]="isPickerFocused">
|
|
5612
5615
|
<mecx-date-range-picker class="first-date-range">
|
|
5613
5616
|
<mecx-date-range-picker-header>
|
|
5614
5617
|
<div class="calendar-title">
|
|
@@ -5753,7 +5756,7 @@ MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
5753
5756
|
</monkey-button>
|
|
5754
5757
|
</mecx-date-range-picker-group-action>
|
|
5755
5758
|
</mecx-date-range-picker-group>
|
|
5756
|
-
`, isInline: true, styles: ["monkey-date-range-picker .
|
|
5759
|
+
`, isInline: true, styles: ["monkey-date-range-picker .picker-open{opacity:.4}\n"], components: [{ type: MonkeyButtonComponent, selector: "monkey-button", inputs: ["label", "icon", "iconPosition", "type", "color", "disabled", "size"] }], directives: [{ type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
5757
5760
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MonkeyDateRangePickerComponent, decorators: [{
|
|
5758
5761
|
type: Component,
|
|
5759
5762
|
args: [{ selector: 'monkey-date-range-picker', template: `
|
|
@@ -5774,10 +5777,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
5774
5777
|
</span>
|
|
5775
5778
|
<span class="data">
|
|
5776
5779
|
<input
|
|
5777
|
-
class="date-input"
|
|
5778
5780
|
type="date"
|
|
5779
5781
|
[(ngModel)]="_startDate"
|
|
5780
5782
|
(change)="onDataChange($event, true)"
|
|
5783
|
+
(focus)="isPickerFocused = true"
|
|
5784
|
+
(blur)="isPickerFocused = false"
|
|
5781
5785
|
/>
|
|
5782
5786
|
</span>
|
|
5783
5787
|
</div>
|
|
@@ -5788,9 +5792,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
5788
5792
|
<span class="data">
|
|
5789
5793
|
<input
|
|
5790
5794
|
type="date"
|
|
5791
|
-
class="date-input"
|
|
5792
5795
|
[(ngModel)]="_endDate"
|
|
5793
5796
|
(change)="onDataChange($event, false)"
|
|
5797
|
+
(focus)="isPickerFocused = true"
|
|
5798
|
+
(blur)="isPickerFocused = false"
|
|
5794
5799
|
/>
|
|
5795
5800
|
</span>
|
|
5796
5801
|
</div>
|
|
@@ -5798,7 +5803,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
5798
5803
|
{{ i18n?.select }}
|
|
5799
5804
|
</ng-template>
|
|
5800
5805
|
</mecx-date-range-picker-selected-dates>
|
|
5801
|
-
<mecx-date-range-picker-group-body>
|
|
5806
|
+
<mecx-date-range-picker-group-body [class.picker-open]="isPickerFocused">
|
|
5802
5807
|
<mecx-date-range-picker class="first-date-range">
|
|
5803
5808
|
<mecx-date-range-picker-header>
|
|
5804
5809
|
<div class="calendar-title">
|
|
@@ -5950,7 +5955,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
5950
5955
|
multi: true,
|
|
5951
5956
|
},
|
|
5952
5957
|
CurrencyPipe,
|
|
5953
|
-
], styles: ["monkey-date-range-picker .
|
|
5958
|
+
], styles: ["monkey-date-range-picker .picker-open{opacity:.4}\n"] }]
|
|
5954
5959
|
}], ctorParameters: function () { return [{ type: i1$2.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
|
|
5955
5960
|
type: Input
|
|
5956
5961
|
}], helperMessage: [{
|
|
@@ -6002,6 +6007,7 @@ class MonkeyDateRangePickerV2Component {
|
|
|
6002
6007
|
this.onChange = new EventEmitter();
|
|
6003
6008
|
this.onSubmit = new EventEmitter();
|
|
6004
6009
|
this.onClose = new EventEmitter();
|
|
6010
|
+
this.isPickerFocused = false;
|
|
6005
6011
|
this.today = moment$1.default().format('YYYY-MM-DD');
|
|
6006
6012
|
this.onModelChange = (value) => { };
|
|
6007
6013
|
this.onModelTouched = (value) => { };
|
|
@@ -6271,10 +6277,11 @@ MonkeyDateRangePickerV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
6271
6277
|
</span>
|
|
6272
6278
|
<span class="data">
|
|
6273
6279
|
<input
|
|
6274
|
-
class="date-input"
|
|
6275
6280
|
type="date"
|
|
6276
6281
|
[(ngModel)]="_startDate"
|
|
6277
6282
|
(change)="onDataChange($event, true)"
|
|
6283
|
+
(focus)="isPickerFocused = true"
|
|
6284
|
+
(blur)="isPickerFocused = false"
|
|
6278
6285
|
/>
|
|
6279
6286
|
</span>
|
|
6280
6287
|
</div>
|
|
@@ -6285,9 +6292,10 @@ MonkeyDateRangePickerV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
6285
6292
|
<span class="data">
|
|
6286
6293
|
<input
|
|
6287
6294
|
type="date"
|
|
6288
|
-
class="date-input"
|
|
6289
6295
|
[(ngModel)]="_endDate"
|
|
6290
6296
|
(change)="onDataChange($event, false)"
|
|
6297
|
+
(focus)="isPickerFocused = true"
|
|
6298
|
+
(blur)="isPickerFocused = false"
|
|
6291
6299
|
/>
|
|
6292
6300
|
</span>
|
|
6293
6301
|
</div>
|
|
@@ -6295,7 +6303,7 @@ MonkeyDateRangePickerV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
6295
6303
|
{{ i18n?.select }}
|
|
6296
6304
|
</ng-template>
|
|
6297
6305
|
</mecx-date-range-picker-selected-dates>
|
|
6298
|
-
<mecx-date-range-picker-group-body>
|
|
6306
|
+
<mecx-date-range-picker-group-body [class.picker-open]="isPickerFocused">
|
|
6299
6307
|
<mecx-date-range-picker class="first-date-range">
|
|
6300
6308
|
<mecx-date-range-picker-header>
|
|
6301
6309
|
<div class="calendar-title">
|
|
@@ -6440,7 +6448,7 @@ MonkeyDateRangePickerV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
6440
6448
|
</div>
|
|
6441
6449
|
</mecx-date-range-picker-group-action>
|
|
6442
6450
|
</mecx-date-range-picker-group>
|
|
6443
|
-
`, isInline: true, styles: ["monkey-date-range-picker-v2 .
|
|
6451
|
+
`, isInline: true, styles: ["monkey-date-range-picker-v2 .picker-open{opacity:.4}\n"], components: [{ type: MonkeyButtonComponent, selector: "monkey-button", inputs: ["label", "icon", "iconPosition", "type", "color", "disabled", "size"] }], directives: [{ type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
6444
6452
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MonkeyDateRangePickerV2Component, decorators: [{
|
|
6445
6453
|
type: Component,
|
|
6446
6454
|
args: [{ selector: 'monkey-date-range-picker-v2', template: `
|
|
@@ -6460,10 +6468,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
6460
6468
|
</span>
|
|
6461
6469
|
<span class="data">
|
|
6462
6470
|
<input
|
|
6463
|
-
class="date-input"
|
|
6464
6471
|
type="date"
|
|
6465
6472
|
[(ngModel)]="_startDate"
|
|
6466
6473
|
(change)="onDataChange($event, true)"
|
|
6474
|
+
(focus)="isPickerFocused = true"
|
|
6475
|
+
(blur)="isPickerFocused = false"
|
|
6467
6476
|
/>
|
|
6468
6477
|
</span>
|
|
6469
6478
|
</div>
|
|
@@ -6474,9 +6483,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
6474
6483
|
<span class="data">
|
|
6475
6484
|
<input
|
|
6476
6485
|
type="date"
|
|
6477
|
-
class="date-input"
|
|
6478
6486
|
[(ngModel)]="_endDate"
|
|
6479
6487
|
(change)="onDataChange($event, false)"
|
|
6488
|
+
(focus)="isPickerFocused = true"
|
|
6489
|
+
(blur)="isPickerFocused = false"
|
|
6480
6490
|
/>
|
|
6481
6491
|
</span>
|
|
6482
6492
|
</div>
|
|
@@ -6484,7 +6494,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
6484
6494
|
{{ i18n?.select }}
|
|
6485
6495
|
</ng-template>
|
|
6486
6496
|
</mecx-date-range-picker-selected-dates>
|
|
6487
|
-
<mecx-date-range-picker-group-body>
|
|
6497
|
+
<mecx-date-range-picker-group-body [class.picker-open]="isPickerFocused">
|
|
6488
6498
|
<mecx-date-range-picker class="first-date-range">
|
|
6489
6499
|
<mecx-date-range-picker-header>
|
|
6490
6500
|
<div class="calendar-title">
|
|
@@ -6636,7 +6646,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
6636
6646
|
multi: true
|
|
6637
6647
|
},
|
|
6638
6648
|
CurrencyPipe
|
|
6639
|
-
], styles: ["monkey-date-range-picker-v2 .
|
|
6649
|
+
], styles: ["monkey-date-range-picker-v2 .picker-open{opacity:.4}\n"] }]
|
|
6640
6650
|
}], ctorParameters: function () { return [{ type: i1$2.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
|
|
6641
6651
|
type: Input
|
|
6642
6652
|
}], helperMessage: [{
|
|
@@ -7920,7 +7930,7 @@ MonkeyInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
|
|
|
7920
7930
|
</error>
|
|
7921
7931
|
</mecx-form-field-footer>
|
|
7922
7932
|
</mecx-form-field>
|
|
7923
|
-
`, isInline: true, components: [{ type: MonkeyIconComponent, selector: "monkey-icon", inputs: ["icon", "color", "contrast", "disabled"] }], directives: [{ type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$3.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers"] }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
7933
|
+
`, isInline: true, components: [{ type: MonkeyIconComponent, selector: "monkey-icon", inputs: ["icon", "color", "contrast", "disabled"] }], directives: [{ type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$3.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime"] }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
7924
7934
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MonkeyInputComponent, decorators: [{
|
|
7925
7935
|
type: Component,
|
|
7926
7936
|
args: [{
|
|
@@ -8232,7 +8242,7 @@ MonkeyInputFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
|
|
|
8232
8242
|
></monkey-icon>
|
|
8233
8243
|
</mecx-form-field-body>
|
|
8234
8244
|
</mecx-form-field-filter>
|
|
8235
|
-
`, isInline: true, components: [{ type: MonkeyIconComponent, selector: "monkey-icon", inputs: ["icon", "color", "contrast", "disabled"] }], directives: [{ type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$3.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers"] }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
8245
|
+
`, isInline: true, components: [{ type: MonkeyIconComponent, selector: "monkey-icon", inputs: ["icon", "color", "contrast", "disabled"] }], directives: [{ type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$3.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime"] }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
8236
8246
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MonkeyInputFilterComponent, decorators: [{
|
|
8237
8247
|
type: Component,
|
|
8238
8248
|
args: [{
|