@c10t/nice-component-library 0.0.37 → 0.0.39

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.
Files changed (5) hide show
  1. package/components/cva-live-searching.component.d.ts +2 -1
  2. package/components/tree/cva-flat-tree.component.d.ts +2 -1
  3. package/fesm2022/c10t-nice-component-library.mjs +198 -188
  4. package/fesm2022/c10t-nice-component-library.mjs.map +1 -1
  5. package/package.json +1 -1
package/fesm2022/c10t-nice-component-library.mjs CHANGED
@@ -4786,6 +4786,7 @@ class CvaLiveSearchingComponent {
4786
4786
  isFormControl = true;
4787
4787
  row;
4788
4788
  columnDef;
4789
+ isKeepSelectedOption = false;
4789
4790
  formControl = null;
4790
4791
  textControl = new FormControl('');
4791
4792
  filteredOptions = [];
@@ -4885,6 +4886,10 @@ class CvaLiveSearchingComponent {
4885
4886
  this.filteredOptions = [...values];
4886
4887
  this.onOptionSelect(obj);
4887
4888
  }
4889
+ else {
4890
+ this.filteredOptions.length = 0;
4891
+ this.filteredOptions = [];
4892
+ }
4888
4893
  });
4889
4894
  return;
4890
4895
  }
@@ -4906,7 +4911,7 @@ class CvaLiveSearchingComponent {
4906
4911
  }), tap(() => this.loading = false)).subscribe((data) => {
4907
4912
  this.filteredOptions.length = 0;
4908
4913
  this.filteredOptions = [];
4909
- if (!!this.selected && !!this.selected[this.displayKey]) {
4914
+ if (!!this.selected && !!this.selected[this.displayKey] && this.isKeepSelectedOption) {
4910
4915
  this.filteredOptions.push(this.selected);
4911
4916
  this.filteredOptions.push(...data.filter((x) => x[this.displayKey] !== this.selected[this.displayKey]));
4912
4917
  }
@@ -4940,65 +4945,65 @@ class CvaLiveSearchingComponent {
4940
4945
  return !this.disabled || (this.disabled && this.config && this.config.STYLE_DISABLE === 'CONTROL');
4941
4946
  }
4942
4947
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: CvaLiveSearchingComponent, deps: [{ token: i0.Injector }, { token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
4943
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaLiveSearchingComponent, isStandalone: false, selector: "cva-live-searching", inputs: { label: "label", placeholder: "placeholder", hint: "hint", required: "required", disabled: "disabled", errorMessages: "errorMessages", isLabelOutside: "isLabelOutside", isFloatLabel: "isFloatLabel", percentOfLabelOutside: "percentOfLabelOutside", suffixFontAwesomeClass: "suffixFontAwesomeClass", displayKey: "displayKey", mappingConfig: "mappingConfig", searchFn: "searchFn", isFormControl: "isFormControl", row: "row", columnDef: "columnDef" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
4944
- <div class="cva-live-searching"
4945
- [ngClass]="{'labelOutside': isLabelOutside,
4948
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaLiveSearchingComponent, isStandalone: false, selector: "cva-live-searching", inputs: { label: "label", placeholder: "placeholder", hint: "hint", required: "required", disabled: "disabled", errorMessages: "errorMessages", isLabelOutside: "isLabelOutside", isFloatLabel: "isFloatLabel", percentOfLabelOutside: "percentOfLabelOutside", suffixFontAwesomeClass: "suffixFontAwesomeClass", displayKey: "displayKey", mappingConfig: "mappingConfig", searchFn: "searchFn", isFormControl: "isFormControl", row: "row", columnDef: "columnDef", isKeepSelectedOption: "isKeepSelectedOption" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
4949
+ <div class="cva-live-searching"
4950
+ [ngClass]="{'labelOutside': isLabelOutside,
4946
4951
  'float_label': isFloatLabel && !isLabelOutside}"
4947
- fxLayout="row" fxLayout.lt-sm="row wrap">
4948
- <mat-label *ngIf="isLabelOutside" class="label_width"
4949
- fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
4950
- <div class="label">
4951
- <div>
4952
- {{ (label ? label : placeholder) | translate }}<span
4953
- class="required-label-outside">{{ required ? '*' : '' }}</span>
4954
- </div>
4955
- </div>
4956
- </mat-label>
4957
- <mat-form-field *ngIf="isShowControl()"
4958
- appearance="outline" [floatLabel]="isFloatLabel ? 'always' : 'auto'"
4959
- [hideRequiredMarker]="!isFloatLabel"
4960
- fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
4961
- <mat-label *ngIf="!isLabelOutside && isFloatLabel">
4962
- {{ (label ? label : placeholder) | translate }}
4963
- </mat-label>
4964
- <input type="text"
4965
- matInput
4966
- [required]="required"
4967
- [disabled]="disabled"
4968
- placeholder="{{placeholder|translate}}"
4969
- [formControl]="textControl"
4970
- [matAutocomplete]="auto"
4971
- readonly="{{disabled}}" />
4972
- <button mat-icon-button color="warn" class="btnClear" matSuffix (click)="onClear()"
4973
- *ngIf="!loading && !disabled">
4974
- <mat-icon>clear</mat-icon>
4975
- </button>
4976
- <mat-spinner diameter="20" matSuffix *ngIf="loading"></mat-spinner>
4977
- <mat-autocomplete #auto="matAutocomplete" autoActiveFirstOption
4978
- (optionSelected)="onOptionSelect($event.option.value)">
4979
- <mat-option *ngFor="let option of filteredOptions" [value]="option[displayKey]">
4980
- {{ option[displayKey] }}
4981
- </mat-option>
4982
- </mat-autocomplete>
4983
- <i *ngIf="!!suffixFontAwesomeClass" class="input-suffix {{suffixFontAwesomeClass}}" matSuffix></i>
4984
- <mat-hint align="start" *ngIf="!NsValidator.invalid(formControl)">{{ hint | translate }}</mat-hint>
4985
- <mat-hint style="color: red" align="start" *ngIf="NsValidator.invalid(formControl)">
4986
- {{ NsValidator.getErrorMessageV1(formControl, errorMessages).msg | translate: NsValidator.getErrorMessageV1(formControl, errorMessages).params }}
4987
- </mat-hint>
4988
- </mat-form-field>
4952
+ fxLayout="row" fxLayout.lt-sm="row wrap">
4953
+ <mat-label *ngIf="isLabelOutside" class="label_width"
4954
+ fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
4955
+ <div class="label">
4956
+ <div>
4957
+ {{ (label ? label : placeholder) | translate }}<span
4958
+ class="required-label-outside">{{ required ? '*' : '' }}</span>
4959
+ </div>
4960
+ </div>
4961
+ </mat-label>
4962
+ <mat-form-field *ngIf="isShowControl()"
4963
+ appearance="outline" [floatLabel]="isFloatLabel ? 'always' : 'auto'"
4964
+ [hideRequiredMarker]="!isFloatLabel"
4965
+ fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
4966
+ <mat-label *ngIf="!isLabelOutside && isFloatLabel">
4967
+ {{ (label ? label : placeholder) | translate }}
4968
+ </mat-label>
4969
+ <input type="text"
4970
+ matInput
4971
+ [required]="required"
4972
+ [disabled]="disabled"
4973
+ placeholder="{{placeholder|translate}}"
4974
+ [formControl]="textControl"
4975
+ [matAutocomplete]="auto"
4976
+ readonly="{{disabled}}"/>
4977
+ <button mat-icon-button color="warn" class="btnClear" matSuffix (click)="onClear()"
4978
+ *ngIf="!loading && !disabled">
4979
+ <mat-icon>clear</mat-icon>
4980
+ </button>
4981
+ <mat-spinner diameter="20" matSuffix *ngIf="loading"></mat-spinner>
4982
+ <mat-autocomplete #auto="matAutocomplete" autoActiveFirstOption
4983
+ (optionSelected)="onOptionSelect($event.option.value)">
4984
+ <mat-option *ngFor="let option of filteredOptions" [value]="option[displayKey]">
4985
+ {{ option[displayKey] }}
4986
+ </mat-option>
4987
+ </mat-autocomplete>
4988
+ <i *ngIf="!!suffixFontAwesomeClass" class="input-suffix {{suffixFontAwesomeClass}}" matSuffix></i>
4989
+ <mat-hint align="start" *ngIf="!NsValidator.invalid(formControl)">{{ hint | translate }}</mat-hint>
4990
+ <mat-hint style="color: red" align="start" *ngIf="NsValidator.invalid(formControl)">
4991
+ {{ NsValidator.getErrorMessageV1(formControl, errorMessages).msg | translate: NsValidator.getErrorMessageV1(formControl, errorMessages).params }}
4992
+ </mat-hint>
4993
+ </mat-form-field>
4989
4994
 
4990
- <ng-container *ngIf="!isShowControl()">
4991
- <div class="cva-style-disable-text">
4992
- <mat-label *ngIf="!isLabelOutside && isFloatLabel">
4993
- {{ (label ? label : placeholder) | translate }}
4994
- </mat-label>
4995
- <div [title]="textControl.value">
4996
- {{ textControl.value }}
4997
- </div>
4995
+ <ng-container *ngIf="!isShowControl()">
4996
+ <div class="cva-style-disable-text">
4997
+ <mat-label *ngIf="!isLabelOutside && isFloatLabel">
4998
+ {{ (label ? label : placeholder) | translate }}
4999
+ </mat-label>
5000
+ <div [title]="textControl.value">
5001
+ {{ textControl.value }}
5002
+ </div>
5003
+ </div>
5004
+ </ng-container>
4998
5005
  </div>
4999
- </ng-container>
5000
- </div>
5001
- `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", 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]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i3$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i9$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i8$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i8$1.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i9.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
5006
+ `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", 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]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i3$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i9$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i8$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i8$1.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i9.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
5002
5007
  }
5003
5008
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: CvaLiveSearchingComponent, decorators: [{
5004
5009
  type: Component,
@@ -5006,64 +5011,64 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
5006
5011
  selector: 'cva-live-searching',
5007
5012
  standalone: false,
5008
5013
  template: `
5009
- <div class="cva-live-searching"
5010
- [ngClass]="{'labelOutside': isLabelOutside,
5014
+ <div class="cva-live-searching"
5015
+ [ngClass]="{'labelOutside': isLabelOutside,
5011
5016
  'float_label': isFloatLabel && !isLabelOutside}"
5012
- fxLayout="row" fxLayout.lt-sm="row wrap">
5013
- <mat-label *ngIf="isLabelOutside" class="label_width"
5014
- fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
5015
- <div class="label">
5016
- <div>
5017
- {{ (label ? label : placeholder) | translate }}<span
5018
- class="required-label-outside">{{ required ? '*' : '' }}</span>
5019
- </div>
5020
- </div>
5021
- </mat-label>
5022
- <mat-form-field *ngIf="isShowControl()"
5023
- appearance="outline" [floatLabel]="isFloatLabel ? 'always' : 'auto'"
5024
- [hideRequiredMarker]="!isFloatLabel"
5025
- fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
5026
- <mat-label *ngIf="!isLabelOutside && isFloatLabel">
5027
- {{ (label ? label : placeholder) | translate }}
5028
- </mat-label>
5029
- <input type="text"
5030
- matInput
5031
- [required]="required"
5032
- [disabled]="disabled"
5033
- placeholder="{{placeholder|translate}}"
5034
- [formControl]="textControl"
5035
- [matAutocomplete]="auto"
5036
- readonly="{{disabled}}" />
5037
- <button mat-icon-button color="warn" class="btnClear" matSuffix (click)="onClear()"
5038
- *ngIf="!loading && !disabled">
5039
- <mat-icon>clear</mat-icon>
5040
- </button>
5041
- <mat-spinner diameter="20" matSuffix *ngIf="loading"></mat-spinner>
5042
- <mat-autocomplete #auto="matAutocomplete" autoActiveFirstOption
5043
- (optionSelected)="onOptionSelect($event.option.value)">
5044
- <mat-option *ngFor="let option of filteredOptions" [value]="option[displayKey]">
5045
- {{ option[displayKey] }}
5046
- </mat-option>
5047
- </mat-autocomplete>
5048
- <i *ngIf="!!suffixFontAwesomeClass" class="input-suffix {{suffixFontAwesomeClass}}" matSuffix></i>
5049
- <mat-hint align="start" *ngIf="!NsValidator.invalid(formControl)">{{ hint | translate }}</mat-hint>
5050
- <mat-hint style="color: red" align="start" *ngIf="NsValidator.invalid(formControl)">
5051
- {{ NsValidator.getErrorMessageV1(formControl, errorMessages).msg | translate: NsValidator.getErrorMessageV1(formControl, errorMessages).params }}
5052
- </mat-hint>
5053
- </mat-form-field>
5017
+ fxLayout="row" fxLayout.lt-sm="row wrap">
5018
+ <mat-label *ngIf="isLabelOutside" class="label_width"
5019
+ fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
5020
+ <div class="label">
5021
+ <div>
5022
+ {{ (label ? label : placeholder) | translate }}<span
5023
+ class="required-label-outside">{{ required ? '*' : '' }}</span>
5024
+ </div>
5025
+ </div>
5026
+ </mat-label>
5027
+ <mat-form-field *ngIf="isShowControl()"
5028
+ appearance="outline" [floatLabel]="isFloatLabel ? 'always' : 'auto'"
5029
+ [hideRequiredMarker]="!isFloatLabel"
5030
+ fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
5031
+ <mat-label *ngIf="!isLabelOutside && isFloatLabel">
5032
+ {{ (label ? label : placeholder) | translate }}
5033
+ </mat-label>
5034
+ <input type="text"
5035
+ matInput
5036
+ [required]="required"
5037
+ [disabled]="disabled"
5038
+ placeholder="{{placeholder|translate}}"
5039
+ [formControl]="textControl"
5040
+ [matAutocomplete]="auto"
5041
+ readonly="{{disabled}}"/>
5042
+ <button mat-icon-button color="warn" class="btnClear" matSuffix (click)="onClear()"
5043
+ *ngIf="!loading && !disabled">
5044
+ <mat-icon>clear</mat-icon>
5045
+ </button>
5046
+ <mat-spinner diameter="20" matSuffix *ngIf="loading"></mat-spinner>
5047
+ <mat-autocomplete #auto="matAutocomplete" autoActiveFirstOption
5048
+ (optionSelected)="onOptionSelect($event.option.value)">
5049
+ <mat-option *ngFor="let option of filteredOptions" [value]="option[displayKey]">
5050
+ {{ option[displayKey] }}
5051
+ </mat-option>
5052
+ </mat-autocomplete>
5053
+ <i *ngIf="!!suffixFontAwesomeClass" class="input-suffix {{suffixFontAwesomeClass}}" matSuffix></i>
5054
+ <mat-hint align="start" *ngIf="!NsValidator.invalid(formControl)">{{ hint | translate }}</mat-hint>
5055
+ <mat-hint style="color: red" align="start" *ngIf="NsValidator.invalid(formControl)">
5056
+ {{ NsValidator.getErrorMessageV1(formControl, errorMessages).msg | translate: NsValidator.getErrorMessageV1(formControl, errorMessages).params }}
5057
+ </mat-hint>
5058
+ </mat-form-field>
5054
5059
 
5055
- <ng-container *ngIf="!isShowControl()">
5056
- <div class="cva-style-disable-text">
5057
- <mat-label *ngIf="!isLabelOutside && isFloatLabel">
5058
- {{ (label ? label : placeholder) | translate }}
5059
- </mat-label>
5060
- <div [title]="textControl.value">
5061
- {{ textControl.value }}
5062
- </div>
5060
+ <ng-container *ngIf="!isShowControl()">
5061
+ <div class="cva-style-disable-text">
5062
+ <mat-label *ngIf="!isLabelOutside && isFloatLabel">
5063
+ {{ (label ? label : placeholder) | translate }}
5064
+ </mat-label>
5065
+ <div [title]="textControl.value">
5066
+ {{ textControl.value }}
5067
+ </div>
5068
+ </div>
5069
+ </ng-container>
5063
5070
  </div>
5064
- </ng-container>
5065
- </div>
5066
- `,
5071
+ `,
5067
5072
  }]
5068
5073
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1$2.NgControl, decorators: [{
5069
5074
  type: Self
@@ -5103,6 +5108,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
5103
5108
  type: Input
5104
5109
  }], columnDef: [{
5105
5110
  type: Input
5111
+ }], isKeepSelectedOption: [{
5112
+ type: Input
5106
5113
  }] } });
5107
5114
 
5108
5115
  class CvaSmartTableComponent {
@@ -5593,7 +5600,7 @@ class CvaSmartTableComponent {
5593
5600
  </ng-container>
5594
5601
  </table>
5595
5602
  </div>
5596
- `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i5.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i5.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i5.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i8$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i8$1.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i9.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: CvaTableHeaderCellComponent, selector: "cva-table-header-cell", inputs: ["moduleName", "column", "selectAllChecked"], outputs: ["changeSelectAll"] }, { kind: "component", type: CvaInputComponent, selector: "cva-input", inputs: ["label", "name", "placeholder", "hint", "required", "disabled", "text", "type", "pattern", "errorMessages", "multiline", "isLabelOutside", "isFloatLabel", "minLength", "maxLength", "alignText", "maxLengthDisplay", "percentOfLabelOutside", "suffixFontAwesomeClass", "patternFilter", "isFormControl", "formatFunc"], outputs: ["onChange"] }, { kind: "component", type: CvaCounterInputComponent, selector: "cva-counter-input", inputs: ["label", "placeholder", "suffixText", "hint", "value", "disabled", "required", "errorMessages", "min", "max", "error", "isDecimal", "isLabelOutside", "isFloatLabel", "percentOfLabelOutside", "alignNumber", "isFormControl"], outputs: ["onChange", "onEnter"] }, { kind: "component", type: CvaDatePickerComponent, selector: "cva-date-picker", inputs: ["label", "placeholder", "value", "disabled", "required", "minDate", "maxDate", "errorMessages", "isLabelOutside", "isFloatLabel", "percentOfLabelOutside", "isFormControl"], outputs: ["onChange"] }, { kind: "component", type: CvaMultiSelectAutocomplete, selector: "cva-multi-select-autocomplete", inputs: ["placeholder", "label", "hint", "value", "options", "disabled", "errorMessages", "multiple", "required", "isTree", "treeSymbol", "sizeOfItemsInListByPixels", "isLabelOutside", "isFloatLabel", "percentOfLabelOutside", "isFormControl"], outputs: ["selectionChange", "selectedOptionDataChange"] }, { kind: "component", type: CvaLiveSearchingComponent, selector: "cva-live-searching", inputs: ["label", "placeholder", "hint", "required", "disabled", "errorMessages", "isLabelOutside", "isFloatLabel", "percentOfLabelOutside", "suffixFontAwesomeClass", "displayKey", "mappingConfig", "searchFn", "isFormControl", "row", "columnDef"], outputs: ["onChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: SecureImgPipe, name: "secure" }] });
5603
+ `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i5.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i5.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i5.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i5.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i5.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i5.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i8$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i8$1.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i9.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: CvaTableHeaderCellComponent, selector: "cva-table-header-cell", inputs: ["moduleName", "column", "selectAllChecked"], outputs: ["changeSelectAll"] }, { kind: "component", type: CvaInputComponent, selector: "cva-input", inputs: ["label", "name", "placeholder", "hint", "required", "disabled", "text", "type", "pattern", "errorMessages", "multiline", "isLabelOutside", "isFloatLabel", "minLength", "maxLength", "alignText", "maxLengthDisplay", "percentOfLabelOutside", "suffixFontAwesomeClass", "patternFilter", "isFormControl", "formatFunc"], outputs: ["onChange"] }, { kind: "component", type: CvaCounterInputComponent, selector: "cva-counter-input", inputs: ["label", "placeholder", "suffixText", "hint", "value", "disabled", "required", "errorMessages", "min", "max", "error", "isDecimal", "isLabelOutside", "isFloatLabel", "percentOfLabelOutside", "alignNumber", "isFormControl"], outputs: ["onChange", "onEnter"] }, { kind: "component", type: CvaDatePickerComponent, selector: "cva-date-picker", inputs: ["label", "placeholder", "value", "disabled", "required", "minDate", "maxDate", "errorMessages", "isLabelOutside", "isFloatLabel", "percentOfLabelOutside", "isFormControl"], outputs: ["onChange"] }, { kind: "component", type: CvaMultiSelectAutocomplete, selector: "cva-multi-select-autocomplete", inputs: ["placeholder", "label", "hint", "value", "options", "disabled", "errorMessages", "multiple", "required", "isTree", "treeSymbol", "sizeOfItemsInListByPixels", "isLabelOutside", "isFloatLabel", "percentOfLabelOutside", "isFormControl"], outputs: ["selectionChange", "selectedOptionDataChange"] }, { kind: "component", type: CvaLiveSearchingComponent, selector: "cva-live-searching", inputs: ["label", "placeholder", "hint", "required", "disabled", "errorMessages", "isLabelOutside", "isFloatLabel", "percentOfLabelOutside", "suffixFontAwesomeClass", "displayKey", "mappingConfig", "searchFn", "isFormControl", "row", "columnDef", "isKeepSelectedOption"], outputs: ["onChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: SecureImgPipe, name: "secure" }] });
5597
5604
  }
5598
5605
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: CvaSmartTableComponent, decorators: [{
5599
5606
  type: Component,
@@ -7878,45 +7885,45 @@ class CvaFlatTreeNodeLeftComponent {
7878
7885
  }
7879
7886
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: CvaFlatTreeNodeLeftComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
7880
7887
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaFlatTreeNodeLeftComponent, isStandalone: false, selector: "cva-flat-tree-node-left", inputs: { treeControl: "treeControl", isHideCheckbox: "isHideCheckbox", node: "node", nodeClicked: "nodeClicked" }, outputs: { toggle: "toggle", onParentNodeClick: "onParentNodeClick", onLeafNodeClick: "onLeafNodeClick", ngModelParentChange: "ngModelParentChange", ngModelLeafChange: "ngModelLeafChange" }, ngImport: i0, template: `
7881
- <ng-container [ngSwitch]="hasChild(node)">
7882
- <ng-container *ngSwitchCase="false">
7883
- <div
7884
- class="label-area {{isHideCheckbox ? 'isClickDiv' : ''}} {{isHideCheckbox && nodeClicked?.value === node.value ? 'nodeSelected': ''}}"
7885
- (click)="onLeafNodeClick.emit()"
7886
- fxLayoutAlign="space-between center">
7887
- <button *ngIf="node.level > 0" type="button" mat-icon-button disabled></button>
7888
- <i *ngIf="node.iconClass" class="{{ node.iconClass }} icon-left"></i>
7889
- {{ node.displayValue }}
7890
- </div>
7891
- <mat-checkbox [(ngModel)]="node.checked"
7892
- [checked]="node.checked"
7893
- (ngModelChange)="ngModelLeafChange.emit($event)"
7894
- [disabled]="checkDisabledNode(node)"
7895
- *ngIf="!isHideCheckbox">
7896
- </mat-checkbox>
7897
- </ng-container>
7898
- <ng-container *ngSwitchCase="true">
7899
- <div
7900
- class="label-area {{isHideCheckbox ? 'isClickDiv' : ''}} {{isHideCheckbox && nodeClicked?.value === node.value ? 'nodeSelected': ''}}"
7901
- fxLayoutAlign="space-between center">
7902
- <button type="button" mat-icon-button (click)="toggle.emit()"
7903
- [attr.aria-label]="'toggle ' + node.displayValue">
7904
- <i class="fas {{(treeControl && treeControl.isExpanded(node)) ? 'fa-chevron-up' : 'fa-chevron-down'}}"></i>
7905
- </button>
7906
- <span (click)="onParentNodeClick.emit()">
7888
+ <ng-container [ngSwitch]="hasChild(node)">
7889
+ <ng-container *ngSwitchCase="false">
7890
+ <div title="{{node.displayValue}}"
7891
+ class="label-area {{isHideCheckbox ? 'isClickDiv' : ''}} {{isHideCheckbox && nodeClicked?.value === node.value ? 'nodeSelected': ''}}"
7892
+ (click)="onLeafNodeClick.emit()"
7893
+ fxLayoutAlign="space-between center">
7894
+ <button *ngIf="node.level > 0" type="button" mat-icon-button disabled></button>
7895
+ <i *ngIf="node.iconClass" class="{{ node.iconClass }} icon-left"></i>
7896
+ {{ node.displayValue }}
7897
+ </div>
7898
+ <mat-checkbox [(ngModel)]="node.checked"
7899
+ [checked]="node.checked"
7900
+ (ngModelChange)="ngModelLeafChange.emit($event)"
7901
+ [disabled]="checkDisabledNode(node)"
7902
+ *ngIf="!isHideCheckbox">
7903
+ </mat-checkbox>
7904
+ </ng-container>
7905
+ <ng-container *ngSwitchCase="true">
7906
+ <div
7907
+ class="label-area {{isHideCheckbox ? 'isClickDiv' : ''}} {{isHideCheckbox && nodeClicked?.value === node.value ? 'nodeSelected': ''}}"
7908
+ fxLayoutAlign="space-between center">
7909
+ <button type="button" mat-icon-button (click)="toggle.emit()"
7910
+ [attr.aria-label]="'toggle ' + node.displayValue">
7911
+ <i class="fas {{(treeControl && treeControl.isExpanded(node)) ? 'fa-chevron-up' : 'fa-chevron-down'}}"></i>
7912
+ </button>
7913
+ <span (click)="onParentNodeClick.emit()" title="{{node.displayValue}}">
7907
7914
  <i *ngIf="node.iconClass" class="{{ node.iconClass }} icon-left"></i>
7908
- {{ node.displayValue }}
7915
+ {{ node.displayValue }}
7909
7916
  </span>
7910
- </div>
7911
- <mat-checkbox [(ngModel)]="node.checked"
7912
- *ngIf="!isHideCheckbox"
7913
- [checked]="descendantsAllSelected(node)"
7914
- [disabled]="onDisabledParent(node) || getDisabledInputFunc(node)"
7915
- [indeterminate]="descendantsPartiallySelected(node)"
7916
- (ngModelChange)="ngModelParentChange.emit($event)">
7917
- </mat-checkbox>
7918
- </ng-container>
7917
+ </div>
7918
+ <mat-checkbox [(ngModel)]="node.checked"
7919
+ *ngIf="!isHideCheckbox"
7920
+ [checked]="descendantsAllSelected(node)"
7921
+ [disabled]="onDisabledParent(node) || getDisabledInputFunc(node)"
7922
+ [indeterminate]="descendantsPartiallySelected(node)"
7923
+ (ngModelChange)="ngModelParentChange.emit($event)">
7924
+ </mat-checkbox>
7919
7925
  </ng-container>
7926
+ </ng-container>
7920
7927
  `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i8$1.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }] });
7921
7928
  }
7922
7929
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: CvaFlatTreeNodeLeftComponent, decorators: [{
@@ -7925,45 +7932,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
7925
7932
  selector: 'cva-flat-tree-node-left',
7926
7933
  standalone: false,
7927
7934
  template: `
7928
- <ng-container [ngSwitch]="hasChild(node)">
7929
- <ng-container *ngSwitchCase="false">
7930
- <div
7931
- class="label-area {{isHideCheckbox ? 'isClickDiv' : ''}} {{isHideCheckbox && nodeClicked?.value === node.value ? 'nodeSelected': ''}}"
7932
- (click)="onLeafNodeClick.emit()"
7933
- fxLayoutAlign="space-between center">
7934
- <button *ngIf="node.level > 0" type="button" mat-icon-button disabled></button>
7935
- <i *ngIf="node.iconClass" class="{{ node.iconClass }} icon-left"></i>
7936
- {{ node.displayValue }}
7937
- </div>
7938
- <mat-checkbox [(ngModel)]="node.checked"
7939
- [checked]="node.checked"
7940
- (ngModelChange)="ngModelLeafChange.emit($event)"
7941
- [disabled]="checkDisabledNode(node)"
7942
- *ngIf="!isHideCheckbox">
7943
- </mat-checkbox>
7944
- </ng-container>
7945
- <ng-container *ngSwitchCase="true">
7946
- <div
7947
- class="label-area {{isHideCheckbox ? 'isClickDiv' : ''}} {{isHideCheckbox && nodeClicked?.value === node.value ? 'nodeSelected': ''}}"
7948
- fxLayoutAlign="space-between center">
7949
- <button type="button" mat-icon-button (click)="toggle.emit()"
7950
- [attr.aria-label]="'toggle ' + node.displayValue">
7951
- <i class="fas {{(treeControl && treeControl.isExpanded(node)) ? 'fa-chevron-up' : 'fa-chevron-down'}}"></i>
7952
- </button>
7953
- <span (click)="onParentNodeClick.emit()">
7935
+ <ng-container [ngSwitch]="hasChild(node)">
7936
+ <ng-container *ngSwitchCase="false">
7937
+ <div title="{{node.displayValue}}"
7938
+ class="label-area {{isHideCheckbox ? 'isClickDiv' : ''}} {{isHideCheckbox && nodeClicked?.value === node.value ? 'nodeSelected': ''}}"
7939
+ (click)="onLeafNodeClick.emit()"
7940
+ fxLayoutAlign="space-between center">
7941
+ <button *ngIf="node.level > 0" type="button" mat-icon-button disabled></button>
7942
+ <i *ngIf="node.iconClass" class="{{ node.iconClass }} icon-left"></i>
7943
+ {{ node.displayValue }}
7944
+ </div>
7945
+ <mat-checkbox [(ngModel)]="node.checked"
7946
+ [checked]="node.checked"
7947
+ (ngModelChange)="ngModelLeafChange.emit($event)"
7948
+ [disabled]="checkDisabledNode(node)"
7949
+ *ngIf="!isHideCheckbox">
7950
+ </mat-checkbox>
7951
+ </ng-container>
7952
+ <ng-container *ngSwitchCase="true">
7953
+ <div
7954
+ class="label-area {{isHideCheckbox ? 'isClickDiv' : ''}} {{isHideCheckbox && nodeClicked?.value === node.value ? 'nodeSelected': ''}}"
7955
+ fxLayoutAlign="space-between center">
7956
+ <button type="button" mat-icon-button (click)="toggle.emit()"
7957
+ [attr.aria-label]="'toggle ' + node.displayValue">
7958
+ <i class="fas {{(treeControl && treeControl.isExpanded(node)) ? 'fa-chevron-up' : 'fa-chevron-down'}}"></i>
7959
+ </button>
7960
+ <span (click)="onParentNodeClick.emit()" title="{{node.displayValue}}">
7954
7961
  <i *ngIf="node.iconClass" class="{{ node.iconClass }} icon-left"></i>
7955
- {{ node.displayValue }}
7962
+ {{ node.displayValue }}
7956
7963
  </span>
7957
- </div>
7958
- <mat-checkbox [(ngModel)]="node.checked"
7959
- *ngIf="!isHideCheckbox"
7960
- [checked]="descendantsAllSelected(node)"
7961
- [disabled]="onDisabledParent(node) || getDisabledInputFunc(node)"
7962
- [indeterminate]="descendantsPartiallySelected(node)"
7963
- (ngModelChange)="ngModelParentChange.emit($event)">
7964
- </mat-checkbox>
7965
- </ng-container>
7964
+ </div>
7965
+ <mat-checkbox [(ngModel)]="node.checked"
7966
+ *ngIf="!isHideCheckbox"
7967
+ [checked]="descendantsAllSelected(node)"
7968
+ [disabled]="onDisabledParent(node) || getDisabledInputFunc(node)"
7969
+ [indeterminate]="descendantsPartiallySelected(node)"
7970
+ (ngModelChange)="ngModelParentChange.emit($event)">
7971
+ </mat-checkbox>
7966
7972
  </ng-container>
7973
+ </ng-container>
7967
7974
  `,
7968
7975
  }]
7969
7976
  }], propDecorators: { treeControl: [{
@@ -8112,6 +8119,7 @@ class CvaFlatTreeComponent {
8112
8119
  injector;
8113
8120
  cdr;
8114
8121
  label = '';
8122
+ searchPlaceholder = 'common.searchText';
8115
8123
  required = false;
8116
8124
  value = [];
8117
8125
  valueObjRef = new Map();
@@ -8685,7 +8693,7 @@ class CvaFlatTreeComponent {
8685
8693
  _isExpandable = (node) => FlatTreeService.hasChild(node);
8686
8694
  _getChildren = (node) => of(node.children ? node.children : []);
8687
8695
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: CvaFlatTreeComponent, deps: [{ token: i1.TranslateService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
8688
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaFlatTreeComponent, isStandalone: false, selector: "cva-flat-tree", inputs: { label: "label", required: "required", value: "value", multiple: "multiple", disabled: "disabled", isView: "isView", isDisplayChooseTreeOnly: "isDisplayChooseTreeOnly", isHideCheckbox: "isHideCheckbox", isCollapseSelected: "isCollapseSelected", selectedLabelTitle: "selectedLabelTitle", viewHeight: "viewHeight", itemSize: "itemSize", ignoreCountValue: "ignoreCountValue", percentOfLabelOutside: "percentOfLabelOutside", treeConfig: "treeConfig", isSearchOutSide: "isSearchOutSide", searchTextOutSide: "searchTextOutSide", errorMessages: "errorMessages", fullDatasource: "fullDatasource", nodeClicked: "nodeClicked", isFormControl: "isFormControl" }, outputs: { selectionChange: "selectionChange", onNodeClick: "onNodeClick" }, viewQueries: [{ propertyName: "chooseVirtualScroll", first: true, predicate: ["chooseAreaScrollViewport"], descendants: true }, { propertyName: "selectedVirtualScroll", first: true, predicate: ["selectedScrollViewport"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
8696
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaFlatTreeComponent, isStandalone: false, selector: "cva-flat-tree", inputs: { label: "label", searchPlaceholder: "searchPlaceholder", required: "required", value: "value", multiple: "multiple", disabled: "disabled", isView: "isView", isDisplayChooseTreeOnly: "isDisplayChooseTreeOnly", isHideCheckbox: "isHideCheckbox", isCollapseSelected: "isCollapseSelected", selectedLabelTitle: "selectedLabelTitle", viewHeight: "viewHeight", itemSize: "itemSize", ignoreCountValue: "ignoreCountValue", percentOfLabelOutside: "percentOfLabelOutside", treeConfig: "treeConfig", isSearchOutSide: "isSearchOutSide", searchTextOutSide: "searchTextOutSide", errorMessages: "errorMessages", fullDatasource: "fullDatasource", nodeClicked: "nodeClicked", isFormControl: "isFormControl" }, outputs: { selectionChange: "selectionChange", onNodeClick: "onNodeClick" }, viewQueries: [{ propertyName: "chooseVirtualScroll", first: true, predicate: ["chooseAreaScrollViewport"], descendants: true }, { propertyName: "selectedVirtualScroll", first: true, predicate: ["selectedScrollViewport"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
8689
8697
  <div class="cva-flat-tree labelOutside"
8690
8698
  fxLayout="row" fxLayout.lt-sm="row wrap">
8691
8699
  <mat-label *ngIf="label && !isSearchOutSide" class="label_width"
@@ -8717,7 +8725,7 @@ class CvaFlatTreeComponent {
8717
8725
  *ngIf="!isSearchOutSide"
8718
8726
  fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
8719
8727
  <input matInput
8720
- placeholder="{{'common.searchText'|translate}}"
8728
+ placeholder="{{searchPlaceholder|translate}}"
8721
8729
  [(ngModel)]="searchText"
8722
8730
  (ngModelChange)="onChangeSearchText()"
8723
8731
  autocomplete="off">
@@ -8814,7 +8822,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
8814
8822
  *ngIf="!isSearchOutSide"
8815
8823
  fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
8816
8824
  <input matInput
8817
- placeholder="{{'common.searchText'|translate}}"
8825
+ placeholder="{{searchPlaceholder|translate}}"
8818
8826
  [(ngModel)]="searchText"
8819
8827
  (ngModelChange)="onChangeSearchText()"
8820
8828
  autocomplete="off">
@@ -8880,6 +8888,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
8880
8888
  type: Optional
8881
8889
  }] }], propDecorators: { label: [{
8882
8890
  type: Input
8891
+ }], searchPlaceholder: [{
8892
+ type: Input
8883
8893
  }], required: [{
8884
8894
  type: Input
8885
8895
  }], value: [{