monkey-style-guide-v2 0.0.119 → 0.0.120
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.
|
@@ -2577,53 +2577,58 @@ class MonkeyAutocompleteComponent {
|
|
|
2577
2577
|
[(ngModel)]="searchData"
|
|
2578
2578
|
/>
|
|
2579
2579
|
|
|
2580
|
-
|
|
2581
|
-
|
|
2582
|
-
|
|
2583
|
-
|
|
2584
|
-
|
|
2585
|
-
|
|
2586
|
-
|
|
2587
|
-
|
|
2588
|
-
|
|
2589
|
-
<div
|
|
2590
|
-
#containerWrapper
|
|
2591
|
-
class="mecx-autocomplete-wrapper"
|
|
2592
|
-
[style.width.px]="initialDisplayWidth"
|
|
2580
|
+
@if (elementTarget) {
|
|
2581
|
+
<ng-template
|
|
2582
|
+
[monkeyPopover]="showPopOver"
|
|
2583
|
+
[monkeyPopoverTarget]="elementTarget"
|
|
2584
|
+
[monkeyPopoverClosed]="closePopOver"
|
|
2585
|
+
monkeyPopoverDir="ltr"
|
|
2586
|
+
[monkeyPopoverBackdrop]="false"
|
|
2587
|
+
[monkeyPopoverHideHeader]="true"
|
|
2588
|
+
[monkeyPopoverWatch]="true"
|
|
2593
2589
|
>
|
|
2594
|
-
<div
|
|
2595
|
-
|
|
2596
|
-
|
|
2597
|
-
|
|
2598
|
-
|
|
2599
|
-
|
|
2600
|
-
|
|
2601
|
-
|
|
2602
|
-
*
|
|
2590
|
+
<div
|
|
2591
|
+
#containerWrapper
|
|
2592
|
+
class="mecx-autocomplete-wrapper"
|
|
2593
|
+
[style.width.px]="initialDisplayWidth"
|
|
2594
|
+
>
|
|
2595
|
+
<div *ngIf="options.length > 0" class="mecx-autocomplete-options">
|
|
2596
|
+
<div
|
|
2597
|
+
class="mecx-autocomplete-option"
|
|
2598
|
+
*ngFor="let option of options"
|
|
2599
|
+
(click)="onSelect(option)"
|
|
2600
|
+
[class.mecx-autocomplete-selected]="isSelected(option)"
|
|
2603
2601
|
>
|
|
2604
|
-
|
|
2602
|
+
<ng-container
|
|
2603
|
+
*ngTemplateOutlet="
|
|
2604
|
+
optionTemplate || defaultTemplate;
|
|
2605
|
+
context: { $implicit: option }
|
|
2606
|
+
"
|
|
2607
|
+
>
|
|
2608
|
+
</ng-container>
|
|
2609
|
+
</div>
|
|
2605
2610
|
</div>
|
|
2611
|
+
@if (loading) {
|
|
2612
|
+
<div class="mecx-autocomplete-loading">
|
|
2613
|
+
<util-icon name="loading" />
|
|
2614
|
+
{{ loadingDictionary | async }}
|
|
2615
|
+
</div>
|
|
2616
|
+
}
|
|
2617
|
+
@if (!loading && !options.length) {
|
|
2618
|
+
<div class="mecx-autocomplete-no-data">
|
|
2619
|
+
<util-icon class="mecx-autocomplete-no-data-icon" name="searchFail" />
|
|
2620
|
+
{{ noDataDictionary | async }}
|
|
2621
|
+
</div>
|
|
2622
|
+
}
|
|
2606
2623
|
</div>
|
|
2607
|
-
@if (loading) {
|
|
2608
|
-
<div class="mecx-autocomplete-loading">
|
|
2609
|
-
<util-icon name="loading" />
|
|
2610
|
-
{{ loadingDictionary | async }}
|
|
2611
|
-
</div>
|
|
2612
|
-
}
|
|
2613
|
-
@if (!loading && !options.length) {
|
|
2614
|
-
<div class="mecx-autocomplete-no-data">
|
|
2615
|
-
<util-icon class="mecx-autocomplete-no-data-icon" name="searchFail" />
|
|
2616
|
-
{{ noDataDictionary | async }}
|
|
2617
|
-
</div>
|
|
2618
|
-
}
|
|
2619
|
-
</div>
|
|
2620
2624
|
|
|
2621
|
-
|
|
2622
|
-
|
|
2623
|
-
|
|
2624
|
-
|
|
2625
|
+
<ng-template #defaultTemplate let-option>
|
|
2626
|
+
<monkey-option>
|
|
2627
|
+
{{ option.description }}
|
|
2628
|
+
</monkey-option>
|
|
2629
|
+
</ng-template>
|
|
2625
2630
|
</ng-template>
|
|
2626
|
-
|
|
2631
|
+
}
|
|
2627
2632
|
`, isInline: true, styles: [":host{display:inline-flex;width:100%;min-width:0}:host input{background:transparent}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MonkeyFormFieldModule }, { kind: "ngmodule", type: MonkeyDirectivesModule }, { kind: "directive", type: MonkeyPopoverDirective, selector: "[monkeyPopover]", inputs: ["monkeyPopover", "monkeyPopoverClosed", "monkeyPopoverTarget", "monkeyPopoverMinwidth", "monkeyPopoverBackdrop", "monkeyPopoverWatch", "monkeyPopoverDir", "monkeyPopoverContextmenu", "monkeyPopoverHeight", "monkeyPopoverTitle", "monkeyPopoverActions", "monkeyPopoverHideClose", "monkeyPopoverHideHeader", "monkeyPopoverHideActions", "monkeyPopoverEnableAutofocus"] }, { kind: "component", type: MonkeyOptionComponent, selector: "monkey-option", inputs: ["value", "disabled", "type"] }, { kind: "component", type: UtilIconComponent, selector: "util-icon", inputs: ["name"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
|
|
2628
2633
|
}
|
|
2629
2634
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: MonkeyAutocompleteComponent, decorators: [{
|
|
@@ -2651,53 +2656,58 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
|
|
|
2651
2656
|
[(ngModel)]="searchData"
|
|
2652
2657
|
/>
|
|
2653
2658
|
|
|
2654
|
-
|
|
2655
|
-
|
|
2656
|
-
|
|
2657
|
-
|
|
2658
|
-
|
|
2659
|
-
|
|
2660
|
-
|
|
2661
|
-
|
|
2662
|
-
|
|
2663
|
-
<div
|
|
2664
|
-
#containerWrapper
|
|
2665
|
-
class="mecx-autocomplete-wrapper"
|
|
2666
|
-
[style.width.px]="initialDisplayWidth"
|
|
2659
|
+
@if (elementTarget) {
|
|
2660
|
+
<ng-template
|
|
2661
|
+
[monkeyPopover]="showPopOver"
|
|
2662
|
+
[monkeyPopoverTarget]="elementTarget"
|
|
2663
|
+
[monkeyPopoverClosed]="closePopOver"
|
|
2664
|
+
monkeyPopoverDir="ltr"
|
|
2665
|
+
[monkeyPopoverBackdrop]="false"
|
|
2666
|
+
[monkeyPopoverHideHeader]="true"
|
|
2667
|
+
[monkeyPopoverWatch]="true"
|
|
2667
2668
|
>
|
|
2668
|
-
<div
|
|
2669
|
-
|
|
2670
|
-
|
|
2671
|
-
|
|
2672
|
-
|
|
2673
|
-
|
|
2674
|
-
|
|
2675
|
-
|
|
2676
|
-
*
|
|
2669
|
+
<div
|
|
2670
|
+
#containerWrapper
|
|
2671
|
+
class="mecx-autocomplete-wrapper"
|
|
2672
|
+
[style.width.px]="initialDisplayWidth"
|
|
2673
|
+
>
|
|
2674
|
+
<div *ngIf="options.length > 0" class="mecx-autocomplete-options">
|
|
2675
|
+
<div
|
|
2676
|
+
class="mecx-autocomplete-option"
|
|
2677
|
+
*ngFor="let option of options"
|
|
2678
|
+
(click)="onSelect(option)"
|
|
2679
|
+
[class.mecx-autocomplete-selected]="isSelected(option)"
|
|
2677
2680
|
>
|
|
2678
|
-
|
|
2681
|
+
<ng-container
|
|
2682
|
+
*ngTemplateOutlet="
|
|
2683
|
+
optionTemplate || defaultTemplate;
|
|
2684
|
+
context: { $implicit: option }
|
|
2685
|
+
"
|
|
2686
|
+
>
|
|
2687
|
+
</ng-container>
|
|
2688
|
+
</div>
|
|
2679
2689
|
</div>
|
|
2690
|
+
@if (loading) {
|
|
2691
|
+
<div class="mecx-autocomplete-loading">
|
|
2692
|
+
<util-icon name="loading" />
|
|
2693
|
+
{{ loadingDictionary | async }}
|
|
2694
|
+
</div>
|
|
2695
|
+
}
|
|
2696
|
+
@if (!loading && !options.length) {
|
|
2697
|
+
<div class="mecx-autocomplete-no-data">
|
|
2698
|
+
<util-icon class="mecx-autocomplete-no-data-icon" name="searchFail" />
|
|
2699
|
+
{{ noDataDictionary | async }}
|
|
2700
|
+
</div>
|
|
2701
|
+
}
|
|
2680
2702
|
</div>
|
|
2681
|
-
@if (loading) {
|
|
2682
|
-
<div class="mecx-autocomplete-loading">
|
|
2683
|
-
<util-icon name="loading" />
|
|
2684
|
-
{{ loadingDictionary | async }}
|
|
2685
|
-
</div>
|
|
2686
|
-
}
|
|
2687
|
-
@if (!loading && !options.length) {
|
|
2688
|
-
<div class="mecx-autocomplete-no-data">
|
|
2689
|
-
<util-icon class="mecx-autocomplete-no-data-icon" name="searchFail" />
|
|
2690
|
-
{{ noDataDictionary | async }}
|
|
2691
|
-
</div>
|
|
2692
|
-
}
|
|
2693
|
-
</div>
|
|
2694
2703
|
|
|
2695
|
-
|
|
2696
|
-
|
|
2697
|
-
|
|
2698
|
-
|
|
2704
|
+
<ng-template #defaultTemplate let-option>
|
|
2705
|
+
<monkey-option>
|
|
2706
|
+
{{ option.description }}
|
|
2707
|
+
</monkey-option>
|
|
2708
|
+
</ng-template>
|
|
2699
2709
|
</ng-template>
|
|
2700
|
-
|
|
2710
|
+
}
|
|
2701
2711
|
`, providers: [
|
|
2702
2712
|
// eslint-disable-next-line no-use-before-define
|
|
2703
2713
|
{ provide: MonkeyFormFieldControl, useExisting: MonkeyAutocompleteComponent }
|