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
|
@@ -5313,6 +5313,7 @@ class MonkeyDateRangePickerComponent {
|
|
|
5313
5313
|
this.helperMessage = '';
|
|
5314
5314
|
this.moveDaysForward = true;
|
|
5315
5315
|
this.onChange = new EventEmitter();
|
|
5316
|
+
this.isPickerFocused = false;
|
|
5316
5317
|
this.today = moment$2.default().format('YYYY-MM-DD');
|
|
5317
5318
|
this.onModelChange = (value) => { };
|
|
5318
5319
|
this.onModelTouched = (value) => { };
|
|
@@ -5580,10 +5581,11 @@ MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
5580
5581
|
</span>
|
|
5581
5582
|
<span class="data">
|
|
5582
5583
|
<input
|
|
5583
|
-
class="date-input"
|
|
5584
5584
|
type="date"
|
|
5585
5585
|
[(ngModel)]="_startDate"
|
|
5586
5586
|
(change)="onDataChange($event, true)"
|
|
5587
|
+
(focus)="isPickerFocused = true"
|
|
5588
|
+
(blur)="isPickerFocused = false"
|
|
5587
5589
|
/>
|
|
5588
5590
|
</span>
|
|
5589
5591
|
</div>
|
|
@@ -5594,9 +5596,10 @@ MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
5594
5596
|
<span class="data">
|
|
5595
5597
|
<input
|
|
5596
5598
|
type="date"
|
|
5597
|
-
class="date-input"
|
|
5598
5599
|
[(ngModel)]="_endDate"
|
|
5599
5600
|
(change)="onDataChange($event, false)"
|
|
5601
|
+
(focus)="isPickerFocused = true"
|
|
5602
|
+
(blur)="isPickerFocused = false"
|
|
5600
5603
|
/>
|
|
5601
5604
|
</span>
|
|
5602
5605
|
</div>
|
|
@@ -5604,7 +5607,7 @@ MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
5604
5607
|
{{ i18n?.select }}
|
|
5605
5608
|
</ng-template>
|
|
5606
5609
|
</mecx-date-range-picker-selected-dates>
|
|
5607
|
-
<mecx-date-range-picker-group-body>
|
|
5610
|
+
<mecx-date-range-picker-group-body [class.picker-open]="isPickerFocused">
|
|
5608
5611
|
<mecx-date-range-picker class="first-date-range">
|
|
5609
5612
|
<mecx-date-range-picker-header>
|
|
5610
5613
|
<div class="calendar-title">
|
|
@@ -5749,7 +5752,7 @@ MonkeyDateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
5749
5752
|
</monkey-button>
|
|
5750
5753
|
</mecx-date-range-picker-group-action>
|
|
5751
5754
|
</mecx-date-range-picker-group>
|
|
5752
|
-
`, isInline: true, styles: ["monkey-date-range-picker .
|
|
5755
|
+
`, 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 });
|
|
5753
5756
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MonkeyDateRangePickerComponent, decorators: [{
|
|
5754
5757
|
type: Component,
|
|
5755
5758
|
args: [{ selector: 'monkey-date-range-picker', template: `
|
|
@@ -5770,10 +5773,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
5770
5773
|
</span>
|
|
5771
5774
|
<span class="data">
|
|
5772
5775
|
<input
|
|
5773
|
-
class="date-input"
|
|
5774
5776
|
type="date"
|
|
5775
5777
|
[(ngModel)]="_startDate"
|
|
5776
5778
|
(change)="onDataChange($event, true)"
|
|
5779
|
+
(focus)="isPickerFocused = true"
|
|
5780
|
+
(blur)="isPickerFocused = false"
|
|
5777
5781
|
/>
|
|
5778
5782
|
</span>
|
|
5779
5783
|
</div>
|
|
@@ -5784,9 +5788,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
5784
5788
|
<span class="data">
|
|
5785
5789
|
<input
|
|
5786
5790
|
type="date"
|
|
5787
|
-
class="date-input"
|
|
5788
5791
|
[(ngModel)]="_endDate"
|
|
5789
5792
|
(change)="onDataChange($event, false)"
|
|
5793
|
+
(focus)="isPickerFocused = true"
|
|
5794
|
+
(blur)="isPickerFocused = false"
|
|
5790
5795
|
/>
|
|
5791
5796
|
</span>
|
|
5792
5797
|
</div>
|
|
@@ -5794,7 +5799,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
5794
5799
|
{{ i18n?.select }}
|
|
5795
5800
|
</ng-template>
|
|
5796
5801
|
</mecx-date-range-picker-selected-dates>
|
|
5797
|
-
<mecx-date-range-picker-group-body>
|
|
5802
|
+
<mecx-date-range-picker-group-body [class.picker-open]="isPickerFocused">
|
|
5798
5803
|
<mecx-date-range-picker class="first-date-range">
|
|
5799
5804
|
<mecx-date-range-picker-header>
|
|
5800
5805
|
<div class="calendar-title">
|
|
@@ -5946,7 +5951,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
5946
5951
|
multi: true,
|
|
5947
5952
|
},
|
|
5948
5953
|
CurrencyPipe,
|
|
5949
|
-
], styles: ["monkey-date-range-picker .
|
|
5954
|
+
], styles: ["monkey-date-range-picker .picker-open{opacity:.4}\n"] }]
|
|
5950
5955
|
}], ctorParameters: function () { return [{ type: i1$2.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
|
|
5951
5956
|
type: Input
|
|
5952
5957
|
}], helperMessage: [{
|
|
@@ -5998,6 +6003,7 @@ class MonkeyDateRangePickerV2Component {
|
|
|
5998
6003
|
this.onChange = new EventEmitter();
|
|
5999
6004
|
this.onSubmit = new EventEmitter();
|
|
6000
6005
|
this.onClose = new EventEmitter();
|
|
6006
|
+
this.isPickerFocused = false;
|
|
6001
6007
|
this.today = moment$1.default().format('YYYY-MM-DD');
|
|
6002
6008
|
this.onModelChange = (value) => { };
|
|
6003
6009
|
this.onModelTouched = (value) => { };
|
|
@@ -6268,10 +6274,11 @@ MonkeyDateRangePickerV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
6268
6274
|
</span>
|
|
6269
6275
|
<span class="data">
|
|
6270
6276
|
<input
|
|
6271
|
-
class="date-input"
|
|
6272
6277
|
type="date"
|
|
6273
6278
|
[(ngModel)]="_startDate"
|
|
6274
6279
|
(change)="onDataChange($event, true)"
|
|
6280
|
+
(focus)="isPickerFocused = true"
|
|
6281
|
+
(blur)="isPickerFocused = false"
|
|
6275
6282
|
/>
|
|
6276
6283
|
</span>
|
|
6277
6284
|
</div>
|
|
@@ -6282,9 +6289,10 @@ MonkeyDateRangePickerV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
6282
6289
|
<span class="data">
|
|
6283
6290
|
<input
|
|
6284
6291
|
type="date"
|
|
6285
|
-
class="date-input"
|
|
6286
6292
|
[(ngModel)]="_endDate"
|
|
6287
6293
|
(change)="onDataChange($event, false)"
|
|
6294
|
+
(focus)="isPickerFocused = true"
|
|
6295
|
+
(blur)="isPickerFocused = false"
|
|
6288
6296
|
/>
|
|
6289
6297
|
</span>
|
|
6290
6298
|
</div>
|
|
@@ -6292,7 +6300,7 @@ MonkeyDateRangePickerV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
6292
6300
|
{{ i18n?.select }}
|
|
6293
6301
|
</ng-template>
|
|
6294
6302
|
</mecx-date-range-picker-selected-dates>
|
|
6295
|
-
<mecx-date-range-picker-group-body>
|
|
6303
|
+
<mecx-date-range-picker-group-body [class.picker-open]="isPickerFocused">
|
|
6296
6304
|
<mecx-date-range-picker class="first-date-range">
|
|
6297
6305
|
<mecx-date-range-picker-header>
|
|
6298
6306
|
<div class="calendar-title">
|
|
@@ -6437,7 +6445,7 @@ MonkeyDateRangePickerV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
6437
6445
|
</div>
|
|
6438
6446
|
</mecx-date-range-picker-group-action>
|
|
6439
6447
|
</mecx-date-range-picker-group>
|
|
6440
|
-
`, isInline: true, styles: ["monkey-date-range-picker-v2 .
|
|
6448
|
+
`, 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 });
|
|
6441
6449
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MonkeyDateRangePickerV2Component, decorators: [{
|
|
6442
6450
|
type: Component,
|
|
6443
6451
|
args: [{ selector: 'monkey-date-range-picker-v2', template: `
|
|
@@ -6457,10 +6465,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
6457
6465
|
</span>
|
|
6458
6466
|
<span class="data">
|
|
6459
6467
|
<input
|
|
6460
|
-
class="date-input"
|
|
6461
6468
|
type="date"
|
|
6462
6469
|
[(ngModel)]="_startDate"
|
|
6463
6470
|
(change)="onDataChange($event, true)"
|
|
6471
|
+
(focus)="isPickerFocused = true"
|
|
6472
|
+
(blur)="isPickerFocused = false"
|
|
6464
6473
|
/>
|
|
6465
6474
|
</span>
|
|
6466
6475
|
</div>
|
|
@@ -6471,9 +6480,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
6471
6480
|
<span class="data">
|
|
6472
6481
|
<input
|
|
6473
6482
|
type="date"
|
|
6474
|
-
class="date-input"
|
|
6475
6483
|
[(ngModel)]="_endDate"
|
|
6476
6484
|
(change)="onDataChange($event, false)"
|
|
6485
|
+
(focus)="isPickerFocused = true"
|
|
6486
|
+
(blur)="isPickerFocused = false"
|
|
6477
6487
|
/>
|
|
6478
6488
|
</span>
|
|
6479
6489
|
</div>
|
|
@@ -6481,7 +6491,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
6481
6491
|
{{ i18n?.select }}
|
|
6482
6492
|
</ng-template>
|
|
6483
6493
|
</mecx-date-range-picker-selected-dates>
|
|
6484
|
-
<mecx-date-range-picker-group-body>
|
|
6494
|
+
<mecx-date-range-picker-group-body [class.picker-open]="isPickerFocused">
|
|
6485
6495
|
<mecx-date-range-picker class="first-date-range">
|
|
6486
6496
|
<mecx-date-range-picker-header>
|
|
6487
6497
|
<div class="calendar-title">
|
|
@@ -6633,7 +6643,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
6633
6643
|
multi: true
|
|
6634
6644
|
},
|
|
6635
6645
|
CurrencyPipe
|
|
6636
|
-
], styles: ["monkey-date-range-picker-v2 .
|
|
6646
|
+
], styles: ["monkey-date-range-picker-v2 .picker-open{opacity:.4}\n"] }]
|
|
6637
6647
|
}], ctorParameters: function () { return [{ type: i1$2.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
|
|
6638
6648
|
type: Input
|
|
6639
6649
|
}], helperMessage: [{
|
|
@@ -7914,7 +7924,7 @@ MonkeyInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
|
|
|
7914
7924
|
</error>
|
|
7915
7925
|
</mecx-form-field-footer>
|
|
7916
7926
|
</mecx-form-field>
|
|
7917
|
-
`, 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 });
|
|
7927
|
+
`, 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 });
|
|
7918
7928
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MonkeyInputComponent, decorators: [{
|
|
7919
7929
|
type: Component,
|
|
7920
7930
|
args: [{
|
|
@@ -8229,7 +8239,7 @@ MonkeyInputFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
|
|
|
8229
8239
|
></monkey-icon>
|
|
8230
8240
|
</mecx-form-field-body>
|
|
8231
8241
|
</mecx-form-field-filter>
|
|
8232
|
-
`, 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 });
|
|
8242
|
+
`, 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 });
|
|
8233
8243
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MonkeyInputFilterComponent, decorators: [{
|
|
8234
8244
|
type: Component,
|
|
8235
8245
|
args: [{
|