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
- <ng-template
2581
- [monkeyPopover]="showPopOver"
2582
- [monkeyPopoverTarget]="elementTarget"
2583
- [monkeyPopoverClosed]="closePopOver"
2584
- monkeyPopoverDir="ltr"
2585
- [monkeyPopoverBackdrop]="false"
2586
- [monkeyPopoverHideHeader]="true"
2587
- [monkeyPopoverWatch]="true"
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 *ngIf="options.length > 0" class="mecx-autocomplete-options">
2595
- <div
2596
- class="mecx-autocomplete-option"
2597
- *ngFor="let option of options"
2598
- (click)="onSelect(option)"
2599
- [class.mecx-autocomplete-selected]="isSelected(option)"
2600
- >
2601
- <ng-container
2602
- *ngTemplateOutlet="optionTemplate || defaultTemplate; context: { $implicit: option }"
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
- </ng-container>
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
- <ng-template #defaultTemplate let-option>
2622
- <monkey-option>
2623
- {{ option.description }}
2624
- </monkey-option>
2625
+ <ng-template #defaultTemplate let-option>
2626
+ <monkey-option>
2627
+ {{ option.description }}
2628
+ </monkey-option>
2629
+ </ng-template>
2625
2630
  </ng-template>
2626
- </ng-template>
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
- <ng-template
2655
- [monkeyPopover]="showPopOver"
2656
- [monkeyPopoverTarget]="elementTarget"
2657
- [monkeyPopoverClosed]="closePopOver"
2658
- monkeyPopoverDir="ltr"
2659
- [monkeyPopoverBackdrop]="false"
2660
- [monkeyPopoverHideHeader]="true"
2661
- [monkeyPopoverWatch]="true"
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 *ngIf="options.length > 0" class="mecx-autocomplete-options">
2669
- <div
2670
- class="mecx-autocomplete-option"
2671
- *ngFor="let option of options"
2672
- (click)="onSelect(option)"
2673
- [class.mecx-autocomplete-selected]="isSelected(option)"
2674
- >
2675
- <ng-container
2676
- *ngTemplateOutlet="optionTemplate || defaultTemplate; context: { $implicit: option }"
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
- </ng-container>
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
- <ng-template #defaultTemplate let-option>
2696
- <monkey-option>
2697
- {{ option.description }}
2698
- </monkey-option>
2704
+ <ng-template #defaultTemplate let-option>
2705
+ <monkey-option>
2706
+ {{ option.description }}
2707
+ </monkey-option>
2708
+ </ng-template>
2699
2709
  </ng-template>
2700
- </ng-template>
2710
+ }
2701
2711
  `, providers: [
2702
2712
  // eslint-disable-next-line no-use-before-define
2703
2713
  { provide: MonkeyFormFieldControl, useExisting: MonkeyAutocompleteComponent }