@inspark/inspark-components 14.0.11 → 14.0.13
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/full/esm2020/components/autocomplete/autocomplete.component.mjs +3 -3
- package/full/esm2020/components/button/button.component.mjs +1 -1
- package/full/esm2020/components/dropdown/dropdown.component.mjs +31 -31
- package/full/esm2020/components/input-text/input-text.component.mjs +3 -3
- package/full/esm2020/components/inspark.module.mjs +1 -1
- package/full/esm2020/components/link/link.component.mjs +1 -1
- package/full/esm2020/components/modal-input-text/modal-input-text.component.mjs +1 -1
- package/full/esm2020/components/pie/pie.component.mjs +1 -1
- package/full/esm2020/components/primeng.module.mjs +1 -1
- package/full/esm2020/components/select-list/select-list.component.mjs +1 -1
- package/full/esm2020/components/svg/svg.component.mjs +1 -1
- package/full/esm2020/components/table/table.component.mjs +1 -1
- package/full/esm2020/components/tree-table/tree-table.component.mjs +1 -1
- package/full/esm2020/interface.mjs +1 -1
- package/full/esm2020/public_api.mjs +1 -1
- package/full/esm2020/services/inspark-dialog.service.mjs +1 -1
- package/full/fesm2015/inspark-inspark-components.mjs +34 -34
- package/full/fesm2015/inspark-inspark-components.mjs.map +1 -1
- package/full/fesm2020/inspark-inspark-components.mjs +34 -34
- package/full/fesm2020/inspark-inspark-components.mjs.map +1 -1
- package/full/index.css +6 -6
- package/full/package.json +1 -1
- package/interface/esm2020/interface.mjs +1 -1
- package/interface/package.json +1 -1
- package/package.json +1 -1
|
@@ -766,7 +766,7 @@ InputTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
|
|
|
766
766
|
useExisting: forwardRef(() => InputTextComponent),
|
|
767
767
|
multi: true,
|
|
768
768
|
}
|
|
769
|
-
], ngImport: i0, template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\n <span *ngIf=\"label\" class=\"c-label__content\">\n {{label}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n <span\n *ngIf=\"maxlength && value && value.length && value.length >= maxlength\"\n class=\"constraints-message__warning u-text_uppercase\">\n {{'maxlength: ' | translate}} {{maxlength}}</span>\n </span>\n <div class=\"input-wrapper u-margin-right-tiny\" [ngClass]=\"{'u-margin-right-tiny': right}\">\n <input (blur)=\"this.blur.emit($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"this.focus.emit($event)\"\n (input)=\"onChange($event)\"\n [(ngModel)]=\"value\"\n [autocomplete]=\"autocomplete? 'on':'off'\"\n [disabled]=\"disabled\"\n [id]=\"id\"\n [maxlength]=\"maxlength\"\n [name]=\"name\"\n [ngClass]=\"{'c-input_opaque' : opacity === false,\n 'c-input_shadowed' : shadow,\n 'c-input_large' : large,\n 'c-input_small' : small,\n 'c-input_margin_padding': widget,\n 'c-input_padding_right': forms}\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [size]=\"size\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n class=\"search-box c-input field_{{id}}\"\n [type]=\"type\">\n <button (click)=\"clear()\"\n class=\"button-reset empty\"\n [ngClass]=\"{empty: display}\"\n type=\"submit\"\n [attr.title]=\"'Reset' | translate\">\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n</label>\n", styles: ["@charset \"UTF-8\";.label{display:inline-block;margin-bottom:0}.c-input{height:36px;width:100%}.c-input_opaque{background:var(--colorBgLevel3)}.c-input_shadowed{box-shadow:0 2px 6px #0003}.constraints-message__warning{color:red}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.empty{display:none}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}.c-input_margin_padding{margin-left:56px;padding-right:10px;max-width:1200px}.c-input_padding_right{padding-right:28px}\n"], dependencies: [{ kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
769
|
+
], ngImport: i0, template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\r\n <span *ngIf=\"label\" class=\"c-label__content\">\r\n {{label}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n <span\r\n *ngIf=\"maxlength && value && value.length && value.length >= maxlength\"\r\n class=\"constraints-message__warning u-text_uppercase\">\r\n {{'maxlength: ' | translate}} {{maxlength}}</span>\r\n </span>\r\n <div class=\"input-wrapper u-margin-right-tiny\" [ngClass]=\"{'u-margin-right-tiny': right}\">\r\n <input (blur)=\"this.blur.emit($event)\"\r\n (change)=\"onChange($event)\"\r\n (focus)=\"this.focus.emit($event)\"\r\n (input)=\"onChange($event)\"\r\n [(ngModel)]=\"value\"\r\n [autocomplete]=\"autocomplete? 'on':'off'\"\r\n [disabled]=\"disabled\"\r\n [id]=\"id\"\r\n [maxlength]=\"maxlength\"\r\n [name]=\"name\"\r\n [ngClass]=\"{'c-input_opaque' : opacity === false,\r\n 'c-input_shadowed' : shadow,\r\n 'c-input_large' : large,\r\n 'c-input_small' : small,\r\n 'c-input_margin_padding': widget,\r\n 'c-input_padding_right': forms}\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n [placeholder]=\"placeholder\"\r\n [required]=\"required\"\r\n [size]=\"size\"\r\n [min]=\"min\"\r\n [max]=\"max\"\r\n [step]=\"step\"\r\n class=\"search-box c-input field_{{id}}\"\r\n [type]=\"type\">\r\n <button (click)=\"clear()\"\r\n class=\"button-reset empty\"\r\n [ngClass]=\"{empty: display}\"\r\n type=\"submit\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"fa fa-close\"></i>\r\n </button>\r\n </div>\r\n</label>\r\n", styles: ["@charset \"UTF-8\";.label{display:inline-block;margin-bottom:0}.c-input{height:36px;width:100%}.c-input_opaque{background:var(--colorBgLevel3)}.c-input_shadowed{box-shadow:0 2px 6px #0003}.constraints-message__warning{color:red}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.empty{display:none}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}.c-input_margin_padding{margin-left:56px;padding-right:10px;max-width:1200px}.c-input_padding_right{padding-right:28px}\n"], dependencies: [{ kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
770
770
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputTextComponent, decorators: [{
|
|
771
771
|
type: Component,
|
|
772
772
|
args: [{ selector: 'in-input-text', providers: [
|
|
@@ -775,7 +775,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
775
775
|
useExisting: forwardRef(() => InputTextComponent),
|
|
776
776
|
multi: true,
|
|
777
777
|
}
|
|
778
|
-
], template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\n <span *ngIf=\"label\" class=\"c-label__content\">\n {{label}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n <span\n *ngIf=\"maxlength && value && value.length && value.length >= maxlength\"\n class=\"constraints-message__warning u-text_uppercase\">\n {{'maxlength: ' | translate}} {{maxlength}}</span>\n </span>\n <div class=\"input-wrapper u-margin-right-tiny\" [ngClass]=\"{'u-margin-right-tiny': right}\">\n <input (blur)=\"this.blur.emit($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"this.focus.emit($event)\"\n (input)=\"onChange($event)\"\n [(ngModel)]=\"value\"\n [autocomplete]=\"autocomplete? 'on':'off'\"\n [disabled]=\"disabled\"\n [id]=\"id\"\n [maxlength]=\"maxlength\"\n [name]=\"name\"\n [ngClass]=\"{'c-input_opaque' : opacity === false,\n 'c-input_shadowed' : shadow,\n 'c-input_large' : large,\n 'c-input_small' : small,\n 'c-input_margin_padding': widget,\n 'c-input_padding_right': forms}\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [size]=\"size\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n class=\"search-box c-input field_{{id}}\"\n [type]=\"type\">\n <button (click)=\"clear()\"\n class=\"button-reset empty\"\n [ngClass]=\"{empty: display}\"\n type=\"submit\"\n [attr.title]=\"'Reset' | translate\">\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n</label>\n", styles: ["@charset \"UTF-8\";.label{display:inline-block;margin-bottom:0}.c-input{height:36px;width:100%}.c-input_opaque{background:var(--colorBgLevel3)}.c-input_shadowed{box-shadow:0 2px 6px #0003}.constraints-message__warning{color:red}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.empty{display:none}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}.c-input_margin_padding{margin-left:56px;padding-right:10px;max-width:1200px}.c-input_padding_right{padding-right:28px}\n"] }]
|
|
778
|
+
], template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\r\n <span *ngIf=\"label\" class=\"c-label__content\">\r\n {{label}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n <span\r\n *ngIf=\"maxlength && value && value.length && value.length >= maxlength\"\r\n class=\"constraints-message__warning u-text_uppercase\">\r\n {{'maxlength: ' | translate}} {{maxlength}}</span>\r\n </span>\r\n <div class=\"input-wrapper u-margin-right-tiny\" [ngClass]=\"{'u-margin-right-tiny': right}\">\r\n <input (blur)=\"this.blur.emit($event)\"\r\n (change)=\"onChange($event)\"\r\n (focus)=\"this.focus.emit($event)\"\r\n (input)=\"onChange($event)\"\r\n [(ngModel)]=\"value\"\r\n [autocomplete]=\"autocomplete? 'on':'off'\"\r\n [disabled]=\"disabled\"\r\n [id]=\"id\"\r\n [maxlength]=\"maxlength\"\r\n [name]=\"name\"\r\n [ngClass]=\"{'c-input_opaque' : opacity === false,\r\n 'c-input_shadowed' : shadow,\r\n 'c-input_large' : large,\r\n 'c-input_small' : small,\r\n 'c-input_margin_padding': widget,\r\n 'c-input_padding_right': forms}\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n [placeholder]=\"placeholder\"\r\n [required]=\"required\"\r\n [size]=\"size\"\r\n [min]=\"min\"\r\n [max]=\"max\"\r\n [step]=\"step\"\r\n class=\"search-box c-input field_{{id}}\"\r\n [type]=\"type\">\r\n <button (click)=\"clear()\"\r\n class=\"button-reset empty\"\r\n [ngClass]=\"{empty: display}\"\r\n type=\"submit\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"fa fa-close\"></i>\r\n </button>\r\n </div>\r\n</label>\r\n", styles: ["@charset \"UTF-8\";.label{display:inline-block;margin-bottom:0}.c-input{height:36px;width:100%}.c-input_opaque{background:var(--colorBgLevel3)}.c-input_shadowed{box-shadow:0 2px 6px #0003}.constraints-message__warning{color:red}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.empty{display:none}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}.c-input_margin_padding{margin-left:56px;padding-right:10px;max-width:1200px}.c-input_padding_right{padding-right:28px}\n"] }]
|
|
779
779
|
}], propDecorators: { name: [{
|
|
780
780
|
type: Input
|
|
781
781
|
}], autocomplete: [{
|
|
@@ -1036,39 +1036,39 @@ class DropdownItem {
|
|
|
1036
1036
|
}
|
|
1037
1037
|
}
|
|
1038
1038
|
DropdownItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1039
|
-
DropdownItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownItem, selector: "p-dropdownItem", inputs: { option: "option", selected: "selected", label: "label", disabled: "disabled", visible: "visible", itemSize: "itemSize", template: "template" }, outputs: { onClick: "onClick" }, ngImport: i0, template: `
|
|
1040
|
-
<li
|
|
1041
|
-
(click)="onOptionClick($event)"
|
|
1042
|
-
role="option"
|
|
1043
|
-
pRipple
|
|
1044
|
-
[attr.aria-label]="label"
|
|
1045
|
-
[attr.aria-selected]="selected"
|
|
1046
|
-
[ngStyle]="{ height: itemSize + 'px' }"
|
|
1047
|
-
[id]="selected ? 'p-highlighted-option' : ''"
|
|
1048
|
-
[ngClass]="{ 'p-dropdown-item': true, 'p-highlight': selected, 'p-disabled': disabled }"
|
|
1049
|
-
>
|
|
1050
|
-
<span *ngIf="!template">{{ label || 'empty' }}</span>
|
|
1051
|
-
<ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
|
|
1052
|
-
</li>
|
|
1039
|
+
DropdownItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownItem, selector: "p-dropdownItem", inputs: { option: "option", selected: "selected", label: "label", disabled: "disabled", visible: "visible", itemSize: "itemSize", template: "template" }, outputs: { onClick: "onClick" }, ngImport: i0, template: `
|
|
1040
|
+
<li
|
|
1041
|
+
(click)="onOptionClick($event)"
|
|
1042
|
+
role="option"
|
|
1043
|
+
pRipple
|
|
1044
|
+
[attr.aria-label]="label"
|
|
1045
|
+
[attr.aria-selected]="selected"
|
|
1046
|
+
[ngStyle]="{ height: itemSize + 'px' }"
|
|
1047
|
+
[id]="selected ? 'p-highlighted-option' : ''"
|
|
1048
|
+
[ngClass]="{ 'p-dropdown-item': true, 'p-highlight': selected, 'p-disabled': disabled }"
|
|
1049
|
+
>
|
|
1050
|
+
<span *ngIf="!template">{{ label || 'empty' }}</span>
|
|
1051
|
+
<ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
|
|
1052
|
+
</li>
|
|
1053
1053
|
`, isInline: true, dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$2.Ripple, selector: "[pRipple]" }] });
|
|
1054
1054
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownItem, decorators: [{
|
|
1055
1055
|
type: Component,
|
|
1056
1056
|
args: [{
|
|
1057
1057
|
selector: 'p-dropdownItem',
|
|
1058
|
-
template: `
|
|
1059
|
-
<li
|
|
1060
|
-
(click)="onOptionClick($event)"
|
|
1061
|
-
role="option"
|
|
1062
|
-
pRipple
|
|
1063
|
-
[attr.aria-label]="label"
|
|
1064
|
-
[attr.aria-selected]="selected"
|
|
1065
|
-
[ngStyle]="{ height: itemSize + 'px' }"
|
|
1066
|
-
[id]="selected ? 'p-highlighted-option' : ''"
|
|
1067
|
-
[ngClass]="{ 'p-dropdown-item': true, 'p-highlight': selected, 'p-disabled': disabled }"
|
|
1068
|
-
>
|
|
1069
|
-
<span *ngIf="!template">{{ label || 'empty' }}</span>
|
|
1070
|
-
<ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
|
|
1071
|
-
</li>
|
|
1058
|
+
template: `
|
|
1059
|
+
<li
|
|
1060
|
+
(click)="onOptionClick($event)"
|
|
1061
|
+
role="option"
|
|
1062
|
+
pRipple
|
|
1063
|
+
[attr.aria-label]="label"
|
|
1064
|
+
[attr.aria-selected]="selected"
|
|
1065
|
+
[ngStyle]="{ height: itemSize + 'px' }"
|
|
1066
|
+
[id]="selected ? 'p-highlighted-option' : ''"
|
|
1067
|
+
[ngClass]="{ 'p-dropdown-item': true, 'p-highlight': selected, 'p-disabled': disabled }"
|
|
1068
|
+
>
|
|
1069
|
+
<span *ngIf="!template">{{ label || 'empty' }}</span>
|
|
1070
|
+
<ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
|
|
1071
|
+
</li>
|
|
1072
1072
|
`
|
|
1073
1073
|
}]
|
|
1074
1074
|
}], propDecorators: { option: [{
|
|
@@ -1176,14 +1176,14 @@ class DropdownComponent extends Dropdown {
|
|
|
1176
1176
|
}
|
|
1177
1177
|
}
|
|
1178
1178
|
DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1179
|
-
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownComponent, selector: "in-dropdown", inputs: { title: "title", error: "error", scrollHeight: "scrollHeight", filter: "filter", name: "name", options: "options", style: "style", panelStyle: "panelStyle", styleClass: "styleClass", panelStyleClass: "panelStyleClass", readonly: "readonly", required: "required", editable: "editable", appendTo: "appendTo", tabindex: "tabindex", placeholder: "placeholder", filterPlaceholder: "filterPlaceholder", filterLocale: "filterLocale", inputId: "inputId", selectId: "selectId", dataKey: "dataKey", filterBy: "filterBy", autofocus: "autofocus", resetFilterOnHide: "resetFilterOnHide", dropdownIcon: "dropdownIcon", optionLabel: "optionLabel", optionValue: "optionValue", optionDisabled: "optionDisabled", optionGroupLabel: "optionGroupLabel", optionGroupChildren: "optionGroupChildren", autoDisplayFirst: "autoDisplayFirst", group: "group", showClear: "showClear", emptyFilterMessage: "emptyFilterMessage", emptyMessage: "emptyMessage", lazy: "lazy", virtualScroll: "virtualScroll", virtualScrollItemSize: "virtualScrollItemSize", virtualScrollOptions: "virtualScrollOptions", overlayOptions: "overlayOptions", ariaFilterLabel: "ariaFilterLabel", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", filterMatchMode: "filterMatchMode", maxlength: "maxlength", tooltip: "tooltip", tooltipPosition: "tooltipPosition", tooltipPositionStyle: "tooltipPositionStyle", tooltipStyleClass: "tooltipStyleClass", autofocusFilter: "autofocusFilter", overlayDirection: "overlayDirection", itemSize: "itemSize", autoZIndex: "autoZIndex", baseZIndex: "baseZIndex", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onChange: "onChange", onFilter: "onFilter", onFocus: "onFocus", onBlur: "onBlur", onClick: "onClick", onShow: "onShow", onHide: "onHide", onClear: "onClear", onLazyLoad: "onLazyLoad" }, host: { properties: { "class.p-inputwrapper-filled": "filled", "class.p-inputwrapper-focus": "focused || overlayVisible" }, classAttribute: "p-element p-inputwrapper" }, providers: [DROPDOWN_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "<span *ngIf=\"label\" class=\"c-label__content\">\n {{title}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n </span>\n<div\n #container\n [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\n (click)=\"onMouseclick($event)\"\n [ngStyle]=\"style\"\n [class]=\"styleClass\"\n>\n <div class=\"p-hidden-accessible\">\n <input\n #in\n [attr.id]=\"inputId\"\n type=\"text\"\n readonly\n (focus)=\"onInputFocus($event)\"\n aria-haspopup=\"listbox\"\n [attr.placeholder]=\"placeholder\"\n aria-haspopup=\"listbox\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-expanded]=\"false\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n (blur)=\"onInputBlur($event)\"\n (keydown)=\"onKeydown($event, true)\"\n [disabled]=\"disabled\"\n [attr.tabindex]=\"tabindex\"\n pAutoFocus\n [autofocus]=\"autofocus\"\n [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\n role=\"combobox\"\n />\n </div>\n <span\n [attr.id]=\"labelId\"\n [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\n *ngIf=\"!editable && label != null\"\n [pTooltip]=\"tooltip\"\n [tooltipPosition]=\"tooltipPosition\"\n [positionStyle]=\"tooltipPositionStyle\"\n [tooltipStyleClass]=\"tooltipStyleClass\"\n >\n <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || 'empty' }}</ng-container>\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\n </span>\n <span [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\" *ngIf=\"!editable && label == null\">{{ placeholder || 'empty' }}</span>\n <input\n #editableInput\n type=\"text\"\n [attr.maxlength]=\"maxlength\"\n class=\"p-dropdown-label p-inputtext\"\n *ngIf=\"editable\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"placeholder\"\n aria-haspopup=\"listbox\"\n [attr.aria-expanded]=\"overlayVisible\"\n (input)=\"onEditableInputChange($event)\"\n (focus)=\"onEditableInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n />\n <i class=\"p-dropdown-clear-icon pi pi-times\" (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\"></i>\n <div class=\"p-dropdown-trigger\" role=\"button\" aria-label=\"dropdown trigger\" aria-haspopup=\"listbox\" [attr.aria-expanded]=\"overlayVisible\">\n <span class=\"p-dropdown-trigger-icon\" [ngClass]=\"dropdownIcon\"></span>\n </div>\n <p-overlay\n #overlay\n [(visible)]=\"overlayVisible\"\n [options]=\"overlayOptions\"\n [target]=\"'@parent'\"\n [appendTo]=\"appendTo\"\n [autoZIndex]=\"autoZIndex\"\n [baseZIndex]=\"baseZIndex\"\n [showTransitionOptions]=\"showTransitionOptions\"\n [hideTransitionOptions]=\"hideTransitionOptions\"\n (onAnimationStart)=\"onOverlayAnimationStart($event)\"\n (onHide)=\"hide()\"\n >\n <ng-template pTemplate=\"content\">\n <div [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\" [class]=\"panelStyleClass\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <div class=\"p-dropdown-header\" *ngIf=\"filter\" (click)=\"$event.stopPropagation()\">\n <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\n <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\n </ng-container>\n <ng-template #builtInFilterElement>\n <div class=\"p-dropdown-filter-container\">\n <input\n #filter\n type=\"text\"\n autocomplete=\"off\"\n [value]=\"filterValue || ''\"\n class=\"p-dropdown-filter p-inputtext p-component\"\n [attr.placeholder]=\"filterPlaceholder\"\n (keydown.enter)=\"$event.preventDefault()\"\n (keydown)=\"onKeydown($event, false)\"\n (input)=\"onFilterInputChange($event)\"\n [attr.aria-label]=\"ariaFilterLabel\"\n [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\n />\n <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\n </div>\n </ng-template>\n </div>\n <div class=\"p-dropdown-items-wrapper\" [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\">\n <p-scroller\n *ngIf=\"virtualScroll\"\n #scroller\n [items]=\"optionsToDisplay\"\n [style]=\"{ height: scrollHeight }\"\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\n [autoSize]=\"true\"\n [lazy]=\"lazy\"\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\n [options]=\"virtualScrollOptions\"\n >\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n </ng-template>\n <ng-container *ngIf=\"loaderTemplate\">\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n </ng-template>\n </ng-container>\n </p-scroller>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\n </ng-container>\n\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n <ul #items [attr.id]=\"listId\" class=\"p-dropdown-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\" role=\"listbox\">\n <ng-container *ngIf=\"group\">\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\n <li class=\"p-dropdown-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n </li>\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!group\">\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\n </ng-container>\n <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\n <ng-template ngFor let-option let-i=\"index\" [ngForOf]=\"options\">\n <p-dropdownItem\n [option]=\"option\"\n [selected]=\"selectedOption == option\"\n [label]=\"getOptionLabel(option)\"\n [disabled]=\"isOptionDisabled(option)\"\n (onClick)=\"onItemClick($event)\"\n [template]=\"itemTemplate\"\n ></p-dropdownItem>\n </ng-template>\n </ng-template>\n <li *ngIf=\"filterValue && isEmpty()\" class=\"p-dropdown-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\n {{ emptyFilterMessageLabel }}\n </ng-container>\n <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\n </li>\n <li *ngIf=\"!filterValue && isEmpty()\" class=\"p-dropdown-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <ng-container *ngIf=\"!emptyTemplate\">\n {{ emptyMessageLabel }}\n </ng-container>\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n </li>\n </ul>\n </ng-template>\n </div>\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n </ng-template>\n </p-overlay>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.Overlay, selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i7$1.AutoFocus, selector: "[pAutoFocus]", inputs: ["autofocus"] }, { kind: "component", type: DropdownItem, selector: "p-dropdownItem", inputs: ["option", "selected", "label", "disabled", "visible", "itemSize", "template"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1179
|
+
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownComponent, selector: "in-dropdown", inputs: { title: "title", error: "error", scrollHeight: "scrollHeight", filter: "filter", name: "name", options: "options", style: "style", panelStyle: "panelStyle", styleClass: "styleClass", panelStyleClass: "panelStyleClass", readonly: "readonly", required: "required", editable: "editable", appendTo: "appendTo", tabindex: "tabindex", placeholder: "placeholder", filterPlaceholder: "filterPlaceholder", filterLocale: "filterLocale", inputId: "inputId", selectId: "selectId", dataKey: "dataKey", filterBy: "filterBy", autofocus: "autofocus", resetFilterOnHide: "resetFilterOnHide", dropdownIcon: "dropdownIcon", optionLabel: "optionLabel", optionValue: "optionValue", optionDisabled: "optionDisabled", optionGroupLabel: "optionGroupLabel", optionGroupChildren: "optionGroupChildren", autoDisplayFirst: "autoDisplayFirst", group: "group", showClear: "showClear", emptyFilterMessage: "emptyFilterMessage", emptyMessage: "emptyMessage", lazy: "lazy", virtualScroll: "virtualScroll", virtualScrollItemSize: "virtualScrollItemSize", virtualScrollOptions: "virtualScrollOptions", overlayOptions: "overlayOptions", ariaFilterLabel: "ariaFilterLabel", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", filterMatchMode: "filterMatchMode", maxlength: "maxlength", tooltip: "tooltip", tooltipPosition: "tooltipPosition", tooltipPositionStyle: "tooltipPositionStyle", tooltipStyleClass: "tooltipStyleClass", autofocusFilter: "autofocusFilter", overlayDirection: "overlayDirection", itemSize: "itemSize", autoZIndex: "autoZIndex", baseZIndex: "baseZIndex", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onChange: "onChange", onFilter: "onFilter", onFocus: "onFocus", onBlur: "onBlur", onClick: "onClick", onShow: "onShow", onHide: "onHide", onClear: "onClear", onLazyLoad: "onLazyLoad" }, host: { properties: { "class.p-inputwrapper-filled": "filled", "class.p-inputwrapper-focus": "focused || overlayVisible" }, classAttribute: "p-element p-inputwrapper" }, providers: [DROPDOWN_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "<span *ngIf=\"label\" class=\"c-label__content\">\r\n {{title}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n </span>\r\n<div\r\n #container\r\n [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\r\n (click)=\"onMouseclick($event)\"\r\n [ngStyle]=\"style\"\r\n [class]=\"styleClass\"\r\n>\r\n <div class=\"p-hidden-accessible\">\r\n <input\r\n #in\r\n [attr.id]=\"inputId\"\r\n type=\"text\"\r\n readonly\r\n (focus)=\"onInputFocus($event)\"\r\n aria-haspopup=\"listbox\"\r\n [attr.placeholder]=\"placeholder\"\r\n aria-haspopup=\"listbox\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-expanded]=\"false\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n (blur)=\"onInputBlur($event)\"\r\n (keydown)=\"onKeydown($event, true)\"\r\n [disabled]=\"disabled\"\r\n [attr.tabindex]=\"tabindex\"\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\r\n role=\"combobox\"\r\n />\r\n </div>\r\n <span\r\n [attr.id]=\"labelId\"\r\n [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\r\n *ngIf=\"!editable && label != null\"\r\n [pTooltip]=\"tooltip\"\r\n [tooltipPosition]=\"tooltipPosition\"\r\n [positionStyle]=\"tooltipPositionStyle\"\r\n [tooltipStyleClass]=\"tooltipStyleClass\"\r\n >\r\n <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || 'empty' }}</ng-container>\r\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\r\n </span>\r\n <span [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\" *ngIf=\"!editable && label == null\">{{ placeholder || 'empty' }}</span>\r\n <input\r\n #editableInput\r\n type=\"text\"\r\n [attr.maxlength]=\"maxlength\"\r\n class=\"p-dropdown-label p-inputtext\"\r\n *ngIf=\"editable\"\r\n [disabled]=\"disabled\"\r\n [attr.placeholder]=\"placeholder\"\r\n aria-haspopup=\"listbox\"\r\n [attr.aria-expanded]=\"overlayVisible\"\r\n (input)=\"onEditableInputChange($event)\"\r\n (focus)=\"onEditableInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n />\r\n <i class=\"p-dropdown-clear-icon pi pi-times\" (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\"></i>\r\n <div class=\"p-dropdown-trigger\" role=\"button\" aria-label=\"dropdown trigger\" aria-haspopup=\"listbox\" [attr.aria-expanded]=\"overlayVisible\">\r\n <span class=\"p-dropdown-trigger-icon\" [ngClass]=\"dropdownIcon\"></span>\r\n </div>\r\n <p-overlay\r\n #overlay\r\n [(visible)]=\"overlayVisible\"\r\n [options]=\"overlayOptions\"\r\n [target]=\"'@parent'\"\r\n [appendTo]=\"appendTo\"\r\n [autoZIndex]=\"autoZIndex\"\r\n [baseZIndex]=\"baseZIndex\"\r\n [showTransitionOptions]=\"showTransitionOptions\"\r\n [hideTransitionOptions]=\"hideTransitionOptions\"\r\n (onAnimationStart)=\"onOverlayAnimationStart($event)\"\r\n (onHide)=\"hide()\"\r\n >\r\n <ng-template pTemplate=\"content\">\r\n <div [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\" [class]=\"panelStyleClass\">\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n <div class=\"p-dropdown-header\" *ngIf=\"filter\" (click)=\"$event.stopPropagation()\">\r\n <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\r\n <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\r\n </ng-container>\r\n <ng-template #builtInFilterElement>\r\n <div class=\"p-dropdown-filter-container\">\r\n <input\r\n #filter\r\n type=\"text\"\r\n autocomplete=\"off\"\r\n [value]=\"filterValue || ''\"\r\n class=\"p-dropdown-filter p-inputtext p-component\"\r\n [attr.placeholder]=\"filterPlaceholder\"\r\n (keydown.enter)=\"$event.preventDefault()\"\r\n (keydown)=\"onKeydown($event, false)\"\r\n (input)=\"onFilterInputChange($event)\"\r\n [attr.aria-label]=\"ariaFilterLabel\"\r\n [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\r\n />\r\n <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\r\n </div>\r\n </ng-template>\r\n </div>\r\n <div class=\"p-dropdown-items-wrapper\" [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\">\r\n <p-scroller\r\n *ngIf=\"virtualScroll\"\r\n #scroller\r\n [items]=\"optionsToDisplay\"\r\n [style]=\"{ height: scrollHeight }\"\r\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\r\n [autoSize]=\"true\"\r\n [lazy]=\"lazy\"\r\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\r\n [options]=\"virtualScrollOptions\"\r\n >\r\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n <ng-container *ngIf=\"loaderTemplate\">\r\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </p-scroller>\r\n <ng-container *ngIf=\"!virtualScroll\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\r\n <ul #items [attr.id]=\"listId\" class=\"p-dropdown-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\" role=\"listbox\">\r\n <ng-container *ngIf=\"group\">\r\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\r\n <li class=\"p-dropdown-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\r\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\r\n </li>\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"!group\">\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\r\n </ng-container>\r\n <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\r\n <ng-template ngFor let-option let-i=\"index\" [ngForOf]=\"options\">\r\n <p-dropdownItem\r\n [option]=\"option\"\r\n [selected]=\"selectedOption == option\"\r\n [label]=\"getOptionLabel(option)\"\r\n [disabled]=\"isOptionDisabled(option)\"\r\n (onClick)=\"onItemClick($event)\"\r\n [template]=\"itemTemplate\"\r\n ></p-dropdownItem>\r\n </ng-template>\r\n </ng-template>\r\n <li *ngIf=\"filterValue && isEmpty()\" class=\"p-dropdown-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\r\n {{ emptyFilterMessageLabel }}\r\n </ng-container>\r\n <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\r\n </li>\r\n <li *ngIf=\"!filterValue && isEmpty()\" class=\"p-dropdown-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <ng-container *ngIf=\"!emptyTemplate\">\r\n {{ emptyMessageLabel }}\r\n </ng-container>\r\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </p-overlay>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.Overlay, selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i7$1.AutoFocus, selector: "[pAutoFocus]", inputs: ["autofocus"] }, { kind: "component", type: DropdownItem, selector: "p-dropdownItem", inputs: ["option", "selected", "label", "disabled", "visible", "itemSize", "template"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1180
1180
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
1181
1181
|
type: Component,
|
|
1182
1182
|
args: [{ selector: 'in-dropdown', host: {
|
|
1183
1183
|
class: 'p-element p-inputwrapper',
|
|
1184
1184
|
'[class.p-inputwrapper-filled]': 'filled',
|
|
1185
1185
|
'[class.p-inputwrapper-focus]': 'focused || overlayVisible'
|
|
1186
|
-
}, providers: [DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span *ngIf=\"label\" class=\"c-label__content\">\n {{title}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n </span>\n<div\n #container\n [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\n (click)=\"onMouseclick($event)\"\n [ngStyle]=\"style\"\n [class]=\"styleClass\"\n>\n <div class=\"p-hidden-accessible\">\n <input\n #in\n [attr.id]=\"inputId\"\n type=\"text\"\n readonly\n (focus)=\"onInputFocus($event)\"\n aria-haspopup=\"listbox\"\n [attr.placeholder]=\"placeholder\"\n aria-haspopup=\"listbox\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-expanded]=\"false\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n (blur)=\"onInputBlur($event)\"\n (keydown)=\"onKeydown($event, true)\"\n [disabled]=\"disabled\"\n [attr.tabindex]=\"tabindex\"\n pAutoFocus\n [autofocus]=\"autofocus\"\n [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\n role=\"combobox\"\n />\n </div>\n <span\n [attr.id]=\"labelId\"\n [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\n *ngIf=\"!editable && label != null\"\n [pTooltip]=\"tooltip\"\n [tooltipPosition]=\"tooltipPosition\"\n [positionStyle]=\"tooltipPositionStyle\"\n [tooltipStyleClass]=\"tooltipStyleClass\"\n >\n <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || 'empty' }}</ng-container>\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\n </span>\n <span [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\" *ngIf=\"!editable && label == null\">{{ placeholder || 'empty' }}</span>\n <input\n #editableInput\n type=\"text\"\n [attr.maxlength]=\"maxlength\"\n class=\"p-dropdown-label p-inputtext\"\n *ngIf=\"editable\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"placeholder\"\n aria-haspopup=\"listbox\"\n [attr.aria-expanded]=\"overlayVisible\"\n (input)=\"onEditableInputChange($event)\"\n (focus)=\"onEditableInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n />\n <i class=\"p-dropdown-clear-icon pi pi-times\" (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\"></i>\n <div class=\"p-dropdown-trigger\" role=\"button\" aria-label=\"dropdown trigger\" aria-haspopup=\"listbox\" [attr.aria-expanded]=\"overlayVisible\">\n <span class=\"p-dropdown-trigger-icon\" [ngClass]=\"dropdownIcon\"></span>\n </div>\n <p-overlay\n #overlay\n [(visible)]=\"overlayVisible\"\n [options]=\"overlayOptions\"\n [target]=\"'@parent'\"\n [appendTo]=\"appendTo\"\n [autoZIndex]=\"autoZIndex\"\n [baseZIndex]=\"baseZIndex\"\n [showTransitionOptions]=\"showTransitionOptions\"\n [hideTransitionOptions]=\"hideTransitionOptions\"\n (onAnimationStart)=\"onOverlayAnimationStart($event)\"\n (onHide)=\"hide()\"\n >\n <ng-template pTemplate=\"content\">\n <div [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\" [class]=\"panelStyleClass\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <div class=\"p-dropdown-header\" *ngIf=\"filter\" (click)=\"$event.stopPropagation()\">\n <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\n <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\n </ng-container>\n <ng-template #builtInFilterElement>\n <div class=\"p-dropdown-filter-container\">\n <input\n #filter\n type=\"text\"\n autocomplete=\"off\"\n [value]=\"filterValue || ''\"\n class=\"p-dropdown-filter p-inputtext p-component\"\n [attr.placeholder]=\"filterPlaceholder\"\n (keydown.enter)=\"$event.preventDefault()\"\n (keydown)=\"onKeydown($event, false)\"\n (input)=\"onFilterInputChange($event)\"\n [attr.aria-label]=\"ariaFilterLabel\"\n [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\n />\n <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\n </div>\n </ng-template>\n </div>\n <div class=\"p-dropdown-items-wrapper\" [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\">\n <p-scroller\n *ngIf=\"virtualScroll\"\n #scroller\n [items]=\"optionsToDisplay\"\n [style]=\"{ height: scrollHeight }\"\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\n [autoSize]=\"true\"\n [lazy]=\"lazy\"\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\n [options]=\"virtualScrollOptions\"\n >\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n </ng-template>\n <ng-container *ngIf=\"loaderTemplate\">\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n </ng-template>\n </ng-container>\n </p-scroller>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\n </ng-container>\n\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n <ul #items [attr.id]=\"listId\" class=\"p-dropdown-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\" role=\"listbox\">\n <ng-container *ngIf=\"group\">\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\n <li class=\"p-dropdown-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n </li>\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!group\">\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\n </ng-container>\n <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\n <ng-template ngFor let-option let-i=\"index\" [ngForOf]=\"options\">\n <p-dropdownItem\n [option]=\"option\"\n [selected]=\"selectedOption == option\"\n [label]=\"getOptionLabel(option)\"\n [disabled]=\"isOptionDisabled(option)\"\n (onClick)=\"onItemClick($event)\"\n [template]=\"itemTemplate\"\n ></p-dropdownItem>\n </ng-template>\n </ng-template>\n <li *ngIf=\"filterValue && isEmpty()\" class=\"p-dropdown-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\n {{ emptyFilterMessageLabel }}\n </ng-container>\n <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\n </li>\n <li *ngIf=\"!filterValue && isEmpty()\" class=\"p-dropdown-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <ng-container *ngIf=\"!emptyTemplate\">\n {{ emptyMessageLabel }}\n </ng-container>\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n </li>\n </ul>\n </ng-template>\n </div>\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n </ng-template>\n </p-overlay>\n</div>\n" }]
|
|
1186
|
+
}, providers: [DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span *ngIf=\"label\" class=\"c-label__content\">\r\n {{title}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n </span>\r\n<div\r\n #container\r\n [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\r\n (click)=\"onMouseclick($event)\"\r\n [ngStyle]=\"style\"\r\n [class]=\"styleClass\"\r\n>\r\n <div class=\"p-hidden-accessible\">\r\n <input\r\n #in\r\n [attr.id]=\"inputId\"\r\n type=\"text\"\r\n readonly\r\n (focus)=\"onInputFocus($event)\"\r\n aria-haspopup=\"listbox\"\r\n [attr.placeholder]=\"placeholder\"\r\n aria-haspopup=\"listbox\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-expanded]=\"false\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n (blur)=\"onInputBlur($event)\"\r\n (keydown)=\"onKeydown($event, true)\"\r\n [disabled]=\"disabled\"\r\n [attr.tabindex]=\"tabindex\"\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\r\n role=\"combobox\"\r\n />\r\n </div>\r\n <span\r\n [attr.id]=\"labelId\"\r\n [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\r\n *ngIf=\"!editable && label != null\"\r\n [pTooltip]=\"tooltip\"\r\n [tooltipPosition]=\"tooltipPosition\"\r\n [positionStyle]=\"tooltipPositionStyle\"\r\n [tooltipStyleClass]=\"tooltipStyleClass\"\r\n >\r\n <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || 'empty' }}</ng-container>\r\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\r\n </span>\r\n <span [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\" *ngIf=\"!editable && label == null\">{{ placeholder || 'empty' }}</span>\r\n <input\r\n #editableInput\r\n type=\"text\"\r\n [attr.maxlength]=\"maxlength\"\r\n class=\"p-dropdown-label p-inputtext\"\r\n *ngIf=\"editable\"\r\n [disabled]=\"disabled\"\r\n [attr.placeholder]=\"placeholder\"\r\n aria-haspopup=\"listbox\"\r\n [attr.aria-expanded]=\"overlayVisible\"\r\n (input)=\"onEditableInputChange($event)\"\r\n (focus)=\"onEditableInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n />\r\n <i class=\"p-dropdown-clear-icon pi pi-times\" (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\"></i>\r\n <div class=\"p-dropdown-trigger\" role=\"button\" aria-label=\"dropdown trigger\" aria-haspopup=\"listbox\" [attr.aria-expanded]=\"overlayVisible\">\r\n <span class=\"p-dropdown-trigger-icon\" [ngClass]=\"dropdownIcon\"></span>\r\n </div>\r\n <p-overlay\r\n #overlay\r\n [(visible)]=\"overlayVisible\"\r\n [options]=\"overlayOptions\"\r\n [target]=\"'@parent'\"\r\n [appendTo]=\"appendTo\"\r\n [autoZIndex]=\"autoZIndex\"\r\n [baseZIndex]=\"baseZIndex\"\r\n [showTransitionOptions]=\"showTransitionOptions\"\r\n [hideTransitionOptions]=\"hideTransitionOptions\"\r\n (onAnimationStart)=\"onOverlayAnimationStart($event)\"\r\n (onHide)=\"hide()\"\r\n >\r\n <ng-template pTemplate=\"content\">\r\n <div [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\" [class]=\"panelStyleClass\">\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n <div class=\"p-dropdown-header\" *ngIf=\"filter\" (click)=\"$event.stopPropagation()\">\r\n <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\r\n <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\r\n </ng-container>\r\n <ng-template #builtInFilterElement>\r\n <div class=\"p-dropdown-filter-container\">\r\n <input\r\n #filter\r\n type=\"text\"\r\n autocomplete=\"off\"\r\n [value]=\"filterValue || ''\"\r\n class=\"p-dropdown-filter p-inputtext p-component\"\r\n [attr.placeholder]=\"filterPlaceholder\"\r\n (keydown.enter)=\"$event.preventDefault()\"\r\n (keydown)=\"onKeydown($event, false)\"\r\n (input)=\"onFilterInputChange($event)\"\r\n [attr.aria-label]=\"ariaFilterLabel\"\r\n [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\r\n />\r\n <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\r\n </div>\r\n </ng-template>\r\n </div>\r\n <div class=\"p-dropdown-items-wrapper\" [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\">\r\n <p-scroller\r\n *ngIf=\"virtualScroll\"\r\n #scroller\r\n [items]=\"optionsToDisplay\"\r\n [style]=\"{ height: scrollHeight }\"\r\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\r\n [autoSize]=\"true\"\r\n [lazy]=\"lazy\"\r\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\r\n [options]=\"virtualScrollOptions\"\r\n >\r\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n <ng-container *ngIf=\"loaderTemplate\">\r\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </p-scroller>\r\n <ng-container *ngIf=\"!virtualScroll\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\r\n <ul #items [attr.id]=\"listId\" class=\"p-dropdown-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\" role=\"listbox\">\r\n <ng-container *ngIf=\"group\">\r\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\r\n <li class=\"p-dropdown-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\r\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\r\n </li>\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"!group\">\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\r\n </ng-container>\r\n <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\r\n <ng-template ngFor let-option let-i=\"index\" [ngForOf]=\"options\">\r\n <p-dropdownItem\r\n [option]=\"option\"\r\n [selected]=\"selectedOption == option\"\r\n [label]=\"getOptionLabel(option)\"\r\n [disabled]=\"isOptionDisabled(option)\"\r\n (onClick)=\"onItemClick($event)\"\r\n [template]=\"itemTemplate\"\r\n ></p-dropdownItem>\r\n </ng-template>\r\n </ng-template>\r\n <li *ngIf=\"filterValue && isEmpty()\" class=\"p-dropdown-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\r\n {{ emptyFilterMessageLabel }}\r\n </ng-container>\r\n <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\r\n </li>\r\n <li *ngIf=\"!filterValue && isEmpty()\" class=\"p-dropdown-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <ng-container *ngIf=\"!emptyTemplate\">\r\n {{ emptyMessageLabel }}\r\n </ng-container>\r\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </p-overlay>\r\n</div>\r\n" }]
|
|
1187
1187
|
}], propDecorators: { title: [{
|
|
1188
1188
|
type: Input
|
|
1189
1189
|
}], error: [{
|
|
@@ -3129,7 +3129,7 @@ AutoCompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
3129
3129
|
provide: NG_VALUE_ACCESSOR,
|
|
3130
3130
|
useExisting: forwardRef(() => AutoCompleteComponent),
|
|
3131
3131
|
multi: true
|
|
3132
|
-
}], queries: [{ propertyName: "templates", predicate: InsparkTemplate }], viewQueries: [{ propertyName: "inputEL", first: true, predicate: ["in"], descendants: true }, { propertyName: "multiInputEL", first: true, predicate: ["multiIn"], descendants: true }, { propertyName: "multiContainerEL", first: true, predicate: ["multiContainer"], descendants: true }, { propertyName: "dropdownButton", first: true, predicate: ["ddBtn"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span #container [ngClass]=\"{ 'p-autocomplete p-component': true, 'p-autocomplete-dd': dropdown, 'p-autocomplete-multiple': multiple }\" [ngStyle]=\"style\" [class]=\"styleClass\">\n <input\n pAutoFocus\n [autofocus]=\"autofocus\"\n *ngIf=\"!multiple\"\n #in\n [attr.type]=\"type\"\n [attr.id]=\"inputId\"\n [ngStyle]=\"inputStyle\"\n [class]=\"inputStyleClass\"\n [autocomplete]=\"autocomplete\"\n [attr.required]=\"required\"\n [attr.name]=\"name\"\n class=\"p-autocomplete-input p-inputtext p-component\"\n [ngClass]=\"{ 'p-autocomplete-dd-input': dropdown, 'p-disabled': disabled }\"\n [value]=\"inputFieldValue\"\n aria-autocomplete=\"list\"\n role=\"searchbox\"\n (click)=\"onInputClick($event)\"\n (input)=\"onInput($event)\"\n (keydown)=\"onKeydown($event)\"\n (keyup)=\"onKeyup($event)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"onInputChange($event)\"\n (paste)=\"onInputPaste($event)\"\n [attr.placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [attr.maxlength]=\"maxlength\"\n [attr.tabindex]=\"tabindex\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-required]=\"required\"\n />\n <i *ngIf=\"!multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n <i *ngIf=\"multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n <ul *ngIf=\"multiple\" #multiContainer class=\"p-autocomplete-multiple-container p-component p-inputtext\" [ngClass]=\"{ 'p-disabled': disabled, 'p-focus': focus }\" (click)=\"multiIn.focus()\">\n <li #token *ngFor=\"let val of value\" class=\"p-autocomplete-token\">\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: val }\"></ng-container>\n <span *ngIf=\"!selectedItemTemplate\" class=\"p-autocomplete-token-label\">{{ resolveFieldData(val) }}</span>\n <span class=\"p-autocomplete-token-icon pi pi-times-circle\" (click)=\"removeItem(token)\" *ngIf=\"!disabled && !readonly\"></span>\n </li>\n <li class=\"p-autocomplete-input-token\">\n <input\n pAutoFocus\n [autofocus]=\"autofocus\"\n #multiIn\n [attr.type]=\"type\"\n [attr.id]=\"inputId\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"value && value.length ? null : placeholder\"\n [attr.tabindex]=\"tabindex\"\n [attr.maxlength]=\"maxlength\"\n (input)=\"onInput($event)\"\n (click)=\"onInputClick($event)\"\n (keydown)=\"onKeydown($event)\"\n [readonly]=\"readonly\"\n (keyup)=\"onKeyup($event)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"onInputChange($event)\"\n (paste)=\"onInputPaste($event)\"\n [autocomplete]=\"autocomplete\"\n [ngStyle]=\"inputStyle\"\n [class]=\"inputStyleClass\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-required]=\"required\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listId\"\n role=\"searchbox\"\n [attr.aria-expanded]=\"overlayVisible\"\n aria-haspopup=\"true\"\n [attr.aria-activedescendant]=\"'p-highlighted-option'\"\n />\n </li>\n </ul>\n <i *ngIf=\"loading\" class=\"p-autocomplete-loader pi pi-spinner pi-spin\"></i\n ><button\n #ddBtn\n type=\"button\"\n pButton\n [icon]=\"dropdownIcon\"\n [attr.aria-label]=\"dropdownAriaLabel\"\n class=\"p-autocomplete-dropdown\"\n [disabled]=\"disabled\"\n pRipple\n (click)=\"handleDropdownClick($event)\"\n *ngIf=\"dropdown\"\n [attr.tabindex]=\"tabindex\"\n></button>\n <div\n #panel\n *ngIf=\"overlayVisible\"\n (click)=\"onOverlayClick($event)\"\n [ngClass]=\"['p-autocomplete-panel p-component']\"\n [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight\"\n [ngStyle]=\"panelStyle\"\n [class]=\"panelStyleClass\"\n [@overlayAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\n (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\n >\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <p-scroller\n *ngIf=\"virtualScroll\"\n #scroller\n [items]=\"suggestions\"\n [style]=\"{ height: scrollHeight }\"\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\n [autoSize]=\"true\"\n [lazy]=\"lazy\"\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\n [options]=\"virtualScrollOptions\"\n >\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n </ng-template>\n <ng-container *ngIf=\"loaderTemplate\">\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n </ng-template>\n </ng-container>\n </p-scroller>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: suggestions, options: {} }\"></ng-container>\n </ng-container>\n\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n <ul #items role=\"listbox\" [attr.id]=\"listId\" class=\"p-autocomplete-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\">\n <ng-container *ngIf=\"group\">\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\n <li class=\"p-autocomplete-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n </li>\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup) }\"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!group\">\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items }\"></ng-container>\n </ng-container>\n <ng-template #itemslist let-suggestionsToDisplay>\n <li\n role=\"option\"\n *ngFor=\"let option of suggestionsToDisplay; let idx = index\"\n class=\"p-autocomplete-item\"\n pRipple\n [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n [ngClass]=\"{ 'p-highlight': option === highlightOption }\"\n [id]=\"highlightOption == option ? 'p-highlighted-option' : ''\"\n (click)=\"selectItem(option)\"\n >\n <span *ngIf=\"!itemTemplate\">{{ resolveFieldData(option) }}</span>\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: option, index: scrollerOptions.getOptions ? scrollerOptions.getOptions(idx) : idx }\"></ng-container>\n </li>\n </ng-template>\n <li *ngIf=\"noResults && showEmptyMessage\" class=\"p-autocomplete-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <ng-container *ngIf=\"!emptyTemplate\">\n {{ emptyMessageLabel }}\n </ng-container>\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n </li>\n </ul>\n </ng-template>\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n </span>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }], animations: [trigger('overlayAnimation', [transition(':enter', [style({
|
|
3132
|
+
}], queries: [{ propertyName: "templates", predicate: InsparkTemplate }], viewQueries: [{ propertyName: "inputEL", first: true, predicate: ["in"], descendants: true }, { propertyName: "multiInputEL", first: true, predicate: ["multiIn"], descendants: true }, { propertyName: "multiContainerEL", first: true, predicate: ["multiContainer"], descendants: true }, { propertyName: "dropdownButton", first: true, predicate: ["ddBtn"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span #container [ngClass]=\"{ 'p-autocomplete p-component': true, 'p-autocomplete-dd': dropdown, 'p-autocomplete-multiple': multiple }\" [ngStyle]=\"style\" [class]=\"styleClass\">\r\n <input\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n *ngIf=\"!multiple\"\r\n #in\r\n [attr.type]=\"type\"\r\n [attr.id]=\"inputId\"\r\n [ngStyle]=\"inputStyle\"\r\n [class]=\"inputStyleClass\"\r\n [autocomplete]=\"autocomplete\"\r\n [attr.required]=\"required\"\r\n [attr.name]=\"name\"\r\n class=\"p-autocomplete-input p-inputtext p-component\"\r\n [ngClass]=\"{ 'p-autocomplete-dd-input': dropdown, 'p-disabled': disabled }\"\r\n [value]=\"inputFieldValue\"\r\n aria-autocomplete=\"list\"\r\n role=\"searchbox\"\r\n (click)=\"onInputClick($event)\"\r\n (input)=\"onInput($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n (keyup)=\"onKeyup($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n (change)=\"onInputChange($event)\"\r\n (paste)=\"onInputPaste($event)\"\r\n [attr.placeholder]=\"placeholder\"\r\n [attr.size]=\"size\"\r\n [attr.maxlength]=\"maxlength\"\r\n [attr.tabindex]=\"tabindex\"\r\n [readonly]=\"readonly\"\r\n [disabled]=\"disabled\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-required]=\"required\"\r\n />\r\n <i *ngIf=\"!multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\r\n <i *ngIf=\"multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\r\n <ul *ngIf=\"multiple\" #multiContainer class=\"p-autocomplete-multiple-container p-component p-inputtext\" [ngClass]=\"{ 'p-disabled': disabled, 'p-focus': focus }\" (click)=\"multiIn.focus()\">\r\n <li #token *ngFor=\"let val of value\" class=\"p-autocomplete-token\">\r\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: val }\"></ng-container>\r\n <span *ngIf=\"!selectedItemTemplate\" class=\"p-autocomplete-token-label\">{{ resolveFieldData(val) }}</span>\r\n <span class=\"p-autocomplete-token-icon pi pi-times-circle\" (click)=\"removeItem(token)\" *ngIf=\"!disabled && !readonly\"></span>\r\n </li>\r\n <li class=\"p-autocomplete-input-token\">\r\n <input\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n #multiIn\r\n [attr.type]=\"type\"\r\n [attr.id]=\"inputId\"\r\n [disabled]=\"disabled\"\r\n [attr.placeholder]=\"value && value.length ? null : placeholder\"\r\n [attr.tabindex]=\"tabindex\"\r\n [attr.maxlength]=\"maxlength\"\r\n (input)=\"onInput($event)\"\r\n (click)=\"onInputClick($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n [readonly]=\"readonly\"\r\n (keyup)=\"onKeyup($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n (change)=\"onInputChange($event)\"\r\n (paste)=\"onInputPaste($event)\"\r\n [autocomplete]=\"autocomplete\"\r\n [ngStyle]=\"inputStyle\"\r\n [class]=\"inputStyleClass\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-required]=\"required\"\r\n aria-autocomplete=\"list\"\r\n [attr.aria-controls]=\"listId\"\r\n role=\"searchbox\"\r\n [attr.aria-expanded]=\"overlayVisible\"\r\n aria-haspopup=\"true\"\r\n [attr.aria-activedescendant]=\"'p-highlighted-option'\"\r\n />\r\n </li>\r\n </ul>\r\n <i *ngIf=\"loading\" class=\"p-autocomplete-loader pi pi-spinner pi-spin\"></i\r\n ><button\r\n #ddBtn\r\n type=\"button\"\r\n pButton\r\n [icon]=\"dropdownIcon\"\r\n [attr.aria-label]=\"dropdownAriaLabel\"\r\n class=\"p-autocomplete-dropdown\"\r\n [disabled]=\"disabled\"\r\n pRipple\r\n (click)=\"handleDropdownClick($event)\"\r\n *ngIf=\"dropdown\"\r\n [attr.tabindex]=\"tabindex\"\r\n></button>\r\n <div\r\n #panel\r\n *ngIf=\"overlayVisible\"\r\n (click)=\"onOverlayClick($event)\"\r\n [ngClass]=\"['p-autocomplete-panel p-component']\"\r\n [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight\"\r\n [ngStyle]=\"panelStyle\"\r\n [class]=\"panelStyleClass\"\r\n [@overlayAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\r\n (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n <p-scroller\r\n *ngIf=\"virtualScroll\"\r\n #scroller\r\n [items]=\"suggestions\"\r\n [style]=\"{ height: scrollHeight }\"\r\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\r\n [autoSize]=\"true\"\r\n [lazy]=\"lazy\"\r\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\r\n [options]=\"virtualScrollOptions\"\r\n >\r\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n <ng-container *ngIf=\"loaderTemplate\">\r\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </p-scroller>\r\n <ng-container *ngIf=\"!virtualScroll\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: suggestions, options: {} }\"></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\r\n <ul #items role=\"listbox\" [attr.id]=\"listId\" class=\"p-autocomplete-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\">\r\n <ng-container *ngIf=\"group\">\r\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\r\n <li class=\"p-autocomplete-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\r\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\r\n </li>\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup) }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"!group\">\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items }\"></ng-container>\r\n </ng-container>\r\n <ng-template #itemslist let-suggestionsToDisplay>\r\n <li\r\n role=\"option\"\r\n *ngFor=\"let option of suggestionsToDisplay; let idx = index\"\r\n class=\"p-autocomplete-item\"\r\n pRipple\r\n [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\r\n [ngClass]=\"{ 'p-highlight': option === highlightOption }\"\r\n [id]=\"highlightOption == option ? 'p-highlighted-option' : ''\"\r\n (click)=\"selectItem(option)\"\r\n >\r\n <span *ngIf=\"!itemTemplate\">{{ resolveFieldData(option) }}</span>\r\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: option, index: scrollerOptions.getOptions ? scrollerOptions.getOptions(idx) : idx }\"></ng-container>\r\n </li>\r\n </ng-template>\r\n <li *ngIf=\"noResults && showEmptyMessage\" class=\"p-autocomplete-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <ng-container *ngIf=\"!emptyTemplate\">\r\n {{ emptyMessageLabel }}\r\n </ng-container>\r\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </div>\r\n </span>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }], animations: [trigger('overlayAnimation', [transition(':enter', [style({
|
|
3133
3133
|
opacity: 0,
|
|
3134
3134
|
transform: 'scaleY(0.8)'
|
|
3135
3135
|
}), animate('{{showTransitionParams}}')]), transition(':leave', [animate('{{hideTransitionParams}}', style({ opacity: 0 }))])])] });
|
|
@@ -3142,7 +3142,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
3142
3142
|
provide: NG_VALUE_ACCESSOR,
|
|
3143
3143
|
useExisting: forwardRef(() => AutoCompleteComponent),
|
|
3144
3144
|
multi: true
|
|
3145
|
-
}], template: "<span #container [ngClass]=\"{ 'p-autocomplete p-component': true, 'p-autocomplete-dd': dropdown, 'p-autocomplete-multiple': multiple }\" [ngStyle]=\"style\" [class]=\"styleClass\">\n <input\n pAutoFocus\n [autofocus]=\"autofocus\"\n *ngIf=\"!multiple\"\n #in\n [attr.type]=\"type\"\n [attr.id]=\"inputId\"\n [ngStyle]=\"inputStyle\"\n [class]=\"inputStyleClass\"\n [autocomplete]=\"autocomplete\"\n [attr.required]=\"required\"\n [attr.name]=\"name\"\n class=\"p-autocomplete-input p-inputtext p-component\"\n [ngClass]=\"{ 'p-autocomplete-dd-input': dropdown, 'p-disabled': disabled }\"\n [value]=\"inputFieldValue\"\n aria-autocomplete=\"list\"\n role=\"searchbox\"\n (click)=\"onInputClick($event)\"\n (input)=\"onInput($event)\"\n (keydown)=\"onKeydown($event)\"\n (keyup)=\"onKeyup($event)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"onInputChange($event)\"\n (paste)=\"onInputPaste($event)\"\n [attr.placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [attr.maxlength]=\"maxlength\"\n [attr.tabindex]=\"tabindex\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-required]=\"required\"\n />\n <i *ngIf=\"!multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n <i *ngIf=\"multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n <ul *ngIf=\"multiple\" #multiContainer class=\"p-autocomplete-multiple-container p-component p-inputtext\" [ngClass]=\"{ 'p-disabled': disabled, 'p-focus': focus }\" (click)=\"multiIn.focus()\">\n <li #token *ngFor=\"let val of value\" class=\"p-autocomplete-token\">\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: val }\"></ng-container>\n <span *ngIf=\"!selectedItemTemplate\" class=\"p-autocomplete-token-label\">{{ resolveFieldData(val) }}</span>\n <span class=\"p-autocomplete-token-icon pi pi-times-circle\" (click)=\"removeItem(token)\" *ngIf=\"!disabled && !readonly\"></span>\n </li>\n <li class=\"p-autocomplete-input-token\">\n <input\n pAutoFocus\n [autofocus]=\"autofocus\"\n #multiIn\n [attr.type]=\"type\"\n [attr.id]=\"inputId\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"value && value.length ? null : placeholder\"\n [attr.tabindex]=\"tabindex\"\n [attr.maxlength]=\"maxlength\"\n (input)=\"onInput($event)\"\n (click)=\"onInputClick($event)\"\n (keydown)=\"onKeydown($event)\"\n [readonly]=\"readonly\"\n (keyup)=\"onKeyup($event)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"onInputChange($event)\"\n (paste)=\"onInputPaste($event)\"\n [autocomplete]=\"autocomplete\"\n [ngStyle]=\"inputStyle\"\n [class]=\"inputStyleClass\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-required]=\"required\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listId\"\n role=\"searchbox\"\n [attr.aria-expanded]=\"overlayVisible\"\n aria-haspopup=\"true\"\n [attr.aria-activedescendant]=\"'p-highlighted-option'\"\n />\n </li>\n </ul>\n <i *ngIf=\"loading\" class=\"p-autocomplete-loader pi pi-spinner pi-spin\"></i\n ><button\n #ddBtn\n type=\"button\"\n pButton\n [icon]=\"dropdownIcon\"\n [attr.aria-label]=\"dropdownAriaLabel\"\n class=\"p-autocomplete-dropdown\"\n [disabled]=\"disabled\"\n pRipple\n (click)=\"handleDropdownClick($event)\"\n *ngIf=\"dropdown\"\n [attr.tabindex]=\"tabindex\"\n></button>\n <div\n #panel\n *ngIf=\"overlayVisible\"\n (click)=\"onOverlayClick($event)\"\n [ngClass]=\"['p-autocomplete-panel p-component']\"\n [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight\"\n [ngStyle]=\"panelStyle\"\n [class]=\"panelStyleClass\"\n [@overlayAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\n (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\n >\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <p-scroller\n *ngIf=\"virtualScroll\"\n #scroller\n [items]=\"suggestions\"\n [style]=\"{ height: scrollHeight }\"\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\n [autoSize]=\"true\"\n [lazy]=\"lazy\"\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\n [options]=\"virtualScrollOptions\"\n >\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n </ng-template>\n <ng-container *ngIf=\"loaderTemplate\">\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n </ng-template>\n </ng-container>\n </p-scroller>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: suggestions, options: {} }\"></ng-container>\n </ng-container>\n\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n <ul #items role=\"listbox\" [attr.id]=\"listId\" class=\"p-autocomplete-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\">\n <ng-container *ngIf=\"group\">\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\n <li class=\"p-autocomplete-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n </li>\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup) }\"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!group\">\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items }\"></ng-container>\n </ng-container>\n <ng-template #itemslist let-suggestionsToDisplay>\n <li\n role=\"option\"\n *ngFor=\"let option of suggestionsToDisplay; let idx = index\"\n class=\"p-autocomplete-item\"\n pRipple\n [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n [ngClass]=\"{ 'p-highlight': option === highlightOption }\"\n [id]=\"highlightOption == option ? 'p-highlighted-option' : ''\"\n (click)=\"selectItem(option)\"\n >\n <span *ngIf=\"!itemTemplate\">{{ resolveFieldData(option) }}</span>\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: option, index: scrollerOptions.getOptions ? scrollerOptions.getOptions(idx) : idx }\"></ng-container>\n </li>\n </ng-template>\n <li *ngIf=\"noResults && showEmptyMessage\" class=\"p-autocomplete-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <ng-container *ngIf=\"!emptyTemplate\">\n {{ emptyMessageLabel }}\n </ng-container>\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n </li>\n </ul>\n </ng-template>\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n </span>\n" }]
|
|
3145
|
+
}], template: "<span #container [ngClass]=\"{ 'p-autocomplete p-component': true, 'p-autocomplete-dd': dropdown, 'p-autocomplete-multiple': multiple }\" [ngStyle]=\"style\" [class]=\"styleClass\">\r\n <input\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n *ngIf=\"!multiple\"\r\n #in\r\n [attr.type]=\"type\"\r\n [attr.id]=\"inputId\"\r\n [ngStyle]=\"inputStyle\"\r\n [class]=\"inputStyleClass\"\r\n [autocomplete]=\"autocomplete\"\r\n [attr.required]=\"required\"\r\n [attr.name]=\"name\"\r\n class=\"p-autocomplete-input p-inputtext p-component\"\r\n [ngClass]=\"{ 'p-autocomplete-dd-input': dropdown, 'p-disabled': disabled }\"\r\n [value]=\"inputFieldValue\"\r\n aria-autocomplete=\"list\"\r\n role=\"searchbox\"\r\n (click)=\"onInputClick($event)\"\r\n (input)=\"onInput($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n (keyup)=\"onKeyup($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n (change)=\"onInputChange($event)\"\r\n (paste)=\"onInputPaste($event)\"\r\n [attr.placeholder]=\"placeholder\"\r\n [attr.size]=\"size\"\r\n [attr.maxlength]=\"maxlength\"\r\n [attr.tabindex]=\"tabindex\"\r\n [readonly]=\"readonly\"\r\n [disabled]=\"disabled\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-required]=\"required\"\r\n />\r\n <i *ngIf=\"!multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\r\n <i *ngIf=\"multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\r\n <ul *ngIf=\"multiple\" #multiContainer class=\"p-autocomplete-multiple-container p-component p-inputtext\" [ngClass]=\"{ 'p-disabled': disabled, 'p-focus': focus }\" (click)=\"multiIn.focus()\">\r\n <li #token *ngFor=\"let val of value\" class=\"p-autocomplete-token\">\r\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: val }\"></ng-container>\r\n <span *ngIf=\"!selectedItemTemplate\" class=\"p-autocomplete-token-label\">{{ resolveFieldData(val) }}</span>\r\n <span class=\"p-autocomplete-token-icon pi pi-times-circle\" (click)=\"removeItem(token)\" *ngIf=\"!disabled && !readonly\"></span>\r\n </li>\r\n <li class=\"p-autocomplete-input-token\">\r\n <input\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n #multiIn\r\n [attr.type]=\"type\"\r\n [attr.id]=\"inputId\"\r\n [disabled]=\"disabled\"\r\n [attr.placeholder]=\"value && value.length ? null : placeholder\"\r\n [attr.tabindex]=\"tabindex\"\r\n [attr.maxlength]=\"maxlength\"\r\n (input)=\"onInput($event)\"\r\n (click)=\"onInputClick($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n [readonly]=\"readonly\"\r\n (keyup)=\"onKeyup($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n (change)=\"onInputChange($event)\"\r\n (paste)=\"onInputPaste($event)\"\r\n [autocomplete]=\"autocomplete\"\r\n [ngStyle]=\"inputStyle\"\r\n [class]=\"inputStyleClass\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-required]=\"required\"\r\n aria-autocomplete=\"list\"\r\n [attr.aria-controls]=\"listId\"\r\n role=\"searchbox\"\r\n [attr.aria-expanded]=\"overlayVisible\"\r\n aria-haspopup=\"true\"\r\n [attr.aria-activedescendant]=\"'p-highlighted-option'\"\r\n />\r\n </li>\r\n </ul>\r\n <i *ngIf=\"loading\" class=\"p-autocomplete-loader pi pi-spinner pi-spin\"></i\r\n ><button\r\n #ddBtn\r\n type=\"button\"\r\n pButton\r\n [icon]=\"dropdownIcon\"\r\n [attr.aria-label]=\"dropdownAriaLabel\"\r\n class=\"p-autocomplete-dropdown\"\r\n [disabled]=\"disabled\"\r\n pRipple\r\n (click)=\"handleDropdownClick($event)\"\r\n *ngIf=\"dropdown\"\r\n [attr.tabindex]=\"tabindex\"\r\n></button>\r\n <div\r\n #panel\r\n *ngIf=\"overlayVisible\"\r\n (click)=\"onOverlayClick($event)\"\r\n [ngClass]=\"['p-autocomplete-panel p-component']\"\r\n [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight\"\r\n [ngStyle]=\"panelStyle\"\r\n [class]=\"panelStyleClass\"\r\n [@overlayAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\r\n (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n <p-scroller\r\n *ngIf=\"virtualScroll\"\r\n #scroller\r\n [items]=\"suggestions\"\r\n [style]=\"{ height: scrollHeight }\"\r\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\r\n [autoSize]=\"true\"\r\n [lazy]=\"lazy\"\r\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\r\n [options]=\"virtualScrollOptions\"\r\n >\r\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n <ng-container *ngIf=\"loaderTemplate\">\r\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </p-scroller>\r\n <ng-container *ngIf=\"!virtualScroll\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: suggestions, options: {} }\"></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\r\n <ul #items role=\"listbox\" [attr.id]=\"listId\" class=\"p-autocomplete-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\">\r\n <ng-container *ngIf=\"group\">\r\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\r\n <li class=\"p-autocomplete-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\r\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\r\n </li>\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup) }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"!group\">\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items }\"></ng-container>\r\n </ng-container>\r\n <ng-template #itemslist let-suggestionsToDisplay>\r\n <li\r\n role=\"option\"\r\n *ngFor=\"let option of suggestionsToDisplay; let idx = index\"\r\n class=\"p-autocomplete-item\"\r\n pRipple\r\n [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\r\n [ngClass]=\"{ 'p-highlight': option === highlightOption }\"\r\n [id]=\"highlightOption == option ? 'p-highlighted-option' : ''\"\r\n (click)=\"selectItem(option)\"\r\n >\r\n <span *ngIf=\"!itemTemplate\">{{ resolveFieldData(option) }}</span>\r\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: option, index: scrollerOptions.getOptions ? scrollerOptions.getOptions(idx) : idx }\"></ng-container>\r\n </li>\r\n </ng-template>\r\n <li *ngIf=\"noResults && showEmptyMessage\" class=\"p-autocomplete-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <ng-container *ngIf=\"!emptyTemplate\">\r\n {{ emptyMessageLabel }}\r\n </ng-container>\r\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </div>\r\n </span>\r\n" }]
|
|
3146
3146
|
}], propDecorators: { minLength: [{
|
|
3147
3147
|
type: Input
|
|
3148
3148
|
}], delay: [{
|