@po-ui/ng-components 19.39.20 → 19.39.22
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/fesm2022/po-ui-ng-components.mjs +7 -3
- package/fesm2022/po-ui-ng-components.mjs.map +1 -1
- package/lib/components/po-field/po-combo/po-combo.component.d.ts +1 -0
- package/package.json +4 -4
- package/po-ui-ng-components-19.39.22.tgz +0 -0
- package/schematics/ng-add/index.js +1 -1
- package/schematics/ng-update/v14/index.js +1 -1
- package/schematics/ng-update/v15/index.js +1 -1
- package/schematics/ng-update/v16/index.js +1 -1
- package/schematics/ng-update/v17/index.js +1 -1
- package/schematics/ng-update/v18/index.js +2 -2
- package/schematics/ng-update/v19/index.js +2 -2
- package/schematics/ng-update/v2/index.js +1 -1
- package/schematics/ng-update/v3/index.js +1 -1
- package/schematics/ng-update/v4/index.js +1 -1
- package/schematics/ng-update/v5/index.js +1 -1
- package/schematics/ng-update/v6/index.js +1 -1
- package/po-ui-ng-components-19.39.20.tgz +0 -0
|
@@ -28741,6 +28741,7 @@ class PoComboComponent extends PoComboBaseComponent {
|
|
|
28741
28741
|
outerContainer;
|
|
28742
28742
|
containerElement;
|
|
28743
28743
|
contentElement;
|
|
28744
|
+
fieldContainerInput;
|
|
28744
28745
|
iconElement;
|
|
28745
28746
|
inputEl;
|
|
28746
28747
|
poListbox;
|
|
@@ -29285,7 +29286,7 @@ class PoComboComponent extends PoComboBaseComponent {
|
|
|
29285
29286
|
window.removeEventListener('scroll', this.onScroll, true);
|
|
29286
29287
|
}
|
|
29287
29288
|
setContainerPosition() {
|
|
29288
|
-
this.controlPosition?.setElements(this.containerElement?.nativeElement, poComboContainerOffset, this.
|
|
29289
|
+
this.controlPosition?.setElements(this.containerElement?.nativeElement, poComboContainerOffset, this.fieldContainerInput, ['top', 'bottom'], true);
|
|
29289
29290
|
this.adjustContainerPosition();
|
|
29290
29291
|
}
|
|
29291
29292
|
setContainerWidth() {
|
|
@@ -29346,7 +29347,7 @@ class PoComboComponent extends PoComboBaseComponent {
|
|
|
29346
29347
|
useExisting: forwardRef(() => PoComboComponent),
|
|
29347
29348
|
multi: true
|
|
29348
29349
|
}
|
|
29349
|
-
], queries: [{ propertyName: "comboOptionTemplate", first: true, predicate: PoComboOptionTemplateDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "outerContainer", first: true, predicate: ["outerContainer "], descendants: true, read: ElementRef }, { propertyName: "containerElement", first: true, predicate: ["containerElement"], descendants: true, read: ElementRef }, { propertyName: "contentElement", first: true, predicate: ["contentElement"], descendants: true, read: ElementRef }, { propertyName: "iconElement", first: true, predicate: ["iconArrow"], descendants: true, read: ElementRef, static: true }, { propertyName: "inputEl", first: true, predicate: ["inp"], descendants: true, read: ElementRef, static: true }, { propertyName: "poListbox", first: true, predicate: ["poListbox"], descendants: true }, { propertyName: "helperEl", first: true, predicate: ["helperEl"], descendants: true, read: PoHelperComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@let poHelper = setHelper(label, additionalHelpTooltip);\n@let needsHelper = !label && (poHelperComponent() || poHelper.hideAdditionalHelp);\n<div class=\"po-combo-field-wrapper\" [class._active]=\"needsHelper\">\n <div class=\"po-combo-flex-item\">\n <div #outerContainer>\n <po-field-container\n [p-disabled]=\"isDisabled\"\n [p-id]=\"id\"\n [p-label]=\"label\"\n [p-optional]=\"optional\"\n [p-required]=\"required\"\n [p-show-required]=\"showRequired\"\n [p-helper]=\"label ? poHelper.helperSettings : undefined\"\n [p-show-helper]=\"label ? displayAdditionalHelp : undefined\"\n [p-size]=\"size\"\n [p-text-wrap]=\"labelTextWrap()\"\n >\n <div\n #searchContainer\n cdkOverlayOrigin\n #trigger=\"cdkOverlayOrigin\"\n class=\"po-field-container-content po-combo-container-content\"\n [attr.p-size]=\"size\"\n >\n <div class=\"po-combo-container-wrapper\">\n @if (icon) {\n <div class=\"po-field-icon-container-left\">\n <po-icon\n class=\"po-field-icon po-icon-input\"\n [class.po-field-icon-disabled]=\"isDisabled\"\n [class.po-field-icon-aa]=\"size === 'small'\"\n [p-icon]=\"icon\"\n ></po-icon>\n </div>\n }\n\n <input\n #inp\n class=\"po-combo-input\"\n [ngClass]=\"\n clean && inp.value\n ? size === 'small'\n ? 'po-input-double-icon-right-aa'\n : 'po-input-double-icon-right'\n : size === 'small'\n ? 'po-input-icon-right-aa'\n : 'po-input-icon-right'\n \"\n [class.po-combo-input-aa]=\"size === 'small'\"\n [class.po-input-icon-left]=\"icon\"\n [class.po-input-icon-left-aa]=\"icon && size === 'small'\"\n autocomplete=\"off\"\n type=\"text\"\n [attr.data-focused-element]=\"!isDisabled\"\n [attr.data-inactive-component]=\"isDisabled\"\n [attr.name]=\"name\"\n [disabled]=\"isDisabled\"\n [id]=\"id\"\n [placeholder]=\"isDisabled ? '' : placeholder\"\n [required]=\"required\"\n [attr.data-append-in-body]=\"appendBox\"\n [attr.p-size]=\"size\"\n (click)=\"!isDisabled && toggleComboVisibility()\"\n (keyup)=\"onKeyUp($event)\"\n (blur)=\"onBlur($event)\"\n (keyup)=\"searchOnEnterOrArrow($event, $event.target.value)\"\n (keydown)=\"onKeyDown($event)\"\n />\n\n <div class=\"po-field-icon-container-right\">\n @if (loading) {\n <po-loading-icon [p-size]=\"mapSizeToIcon(size)\"></po-loading-icon>\n } @else {\n @if (!loading && isCleanVisible()) {\n <po-clean\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-label]=\"literals.clean\"\n class=\"po-combo-clean po-icon-input\"\n [class.po-combo-clean-aa]=\"size === 'small'\"\n [p-element-ref]=\"inputEl\"\n [p-size]=\"size\"\n (p-change-event)=\"clear($event)\"\n (click)=\"clear(null); $event.preventDefault()\"\n (keydown.enter)=\"clearAndFocus(); $event.preventDefault()\"\n (keydown.tab)=\"handleCleanKeyboardTab($event)\"\n >\n </po-clean>\n }\n }\n <div\n #iconArrow\n class=\"po-combo-arrow po-field-icon\"\n [class.po-field-icon-disabled]=\"isDisabled\"\n [class.po-field-icon-disabled-aa]=\"isDisabled && size === 'small'\"\n (click)=\"!isDisabled && toggleComboVisibility(true)\"\n >\n <po-icon\n [p-icon]=\"comboOpen ? 'ICON_ARROW_UP po-icon-input' : 'ICON_ARROW_DOWN po-icon-input'\"\n [class.po-field-icon]=\"!isDisabled\"\n [class.po-field-icon-aa]=\"size === 'small'\"\n [class.po-combo-default-border]=\"!isDisabled && inp.value\"\n [class.po-combo-background-arrow-up]=\"!isDisabled && comboOpen\"\n ></po-icon>\n </div>\n </div>\n </div>\n </div>\n\n @if (appendBox) {\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"true\"\n [cdkConnectedOverlayDisableClose]=\"true\"\n >\n <ng-container *ngTemplateOutlet=\"dropdownListbox\"></ng-container>\n </ng-template>\n } @else {\n <ng-container *ngTemplateOutlet=\"dropdownListbox\"> </ng-container>\n }\n\n <po-field-container-bottom\n [p-append-in-body]=\"appendBox\"\n [p-help]=\"help\"\n [p-disabled]=\"isDisabled\"\n [p-error-pattern]=\"getErrorPattern()\"\n [p-error-limit]=\"errorLimit\"\n [p-size]=\"size\"\n ></po-field-container-bottom>\n </po-field-container>\n\n <ng-template #dropdownListbox>\n <div #containerElement class=\"po-combo-container\" [hidden]=\"!comboOpen && !isServerSearching\">\n <po-listbox\n #poListbox\n #contentElement\n p-type=\"option\"\n [p-items]=\"visibleOptions\"\n [p-field-value]=\"dynamicValue\"\n [p-field-label]=\"dynamicLabel\"\n [p-template]=\"comboOptionTemplate\"\n [p-search-value]=\"getInputValue()\"\n [p-infinite-loading]=\"infiniteLoading\"\n [p-infinite-scroll]=\"infiniteScroll\"\n [p-filtering]=\"isFiltering\"\n [p-cache]=\"cache\"\n [p-filter-mode]=\"filterMode\"\n [p-visible]=\"comboOpen\"\n [p-is-searching]=\"isServerSearching\"\n [p-should-mark-letter]=\"shouldMarkLetters\"\n [p-compare-cache]=\"compareObjects(cacheOptions, visibleOptions)\"\n [p-combo-service]=\"service\"\n [p-infinite-scroll-distance]=\"infiniteScrollDistance\"\n [p-size]=\"size\"\n [p-container-width]=\"containerWidth\"\n (p-selectcombo-item)=\"onOptionClick($event, $event.event)\"\n (p-update-infinite-scroll)=\"showMoreInfiniteScroll()\"\n (p-close)=\"onCloseCombo()\"\n (keydown)=\"onListboxKeyDown($event)\"\n ></po-listbox>\n </div>\n </ng-template>\n </div>\n </div>\n @if ((!this.label && poHelperComponent()) || (!this.label && poHelper.hideAdditionalHelp)) {\n <po-helper\n #helperEl\n class=\"po-field-helper-button\"\n [p-size]=\"size\"\n [p-helper]=\"poHelper.helperSettings\"\n [p-disabled]=\"isDisabled\"\n [p-append-in-body]=\"appendBox\"\n >\n </po-helper>\n }\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i5.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: PoCleanComponent, selector: "po-clean" }, { kind: "component", type: PoFieldContainerBottomComponent, selector: "po-field-container-bottom", inputs: ["p-append-in-body", "p-disabled", "p-error-pattern", "p-error-limit", "p-help", "p-size", "p-helper", "p-show-helper"] }, { kind: "component", type: PoFieldContainerComponent, selector: "po-field-container", inputs: ["p-disabled", "p-id", "p-label", "p-help", "p-helper", "p-show-helper", "p-text-wrap", "p-optional", "p-required", "p-show-required", "p-size"] }, { kind: "component", type: PoLoadingIconComponent, selector: "po-loading-icon", inputs: ["p-neutral-color", "p-size"] }, { kind: "component", type: PoIconComponent, selector: "po-icon", inputs: ["p-icon"] }, { kind: "component", type: PoListBoxComponent, selector: "po-listbox" }, { kind: "component", type: PoHelperComponent, selector: "po-helper" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
29350
|
+
], queries: [{ propertyName: "comboOptionTemplate", first: true, predicate: PoComboOptionTemplateDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "outerContainer", first: true, predicate: ["outerContainer "], descendants: true, read: ElementRef }, { propertyName: "containerElement", first: true, predicate: ["containerElement"], descendants: true, read: ElementRef }, { propertyName: "contentElement", first: true, predicate: ["contentElement"], descendants: true, read: ElementRef }, { propertyName: "fieldContainerInput", first: true, predicate: ["fieldContainerInput"], descendants: true, read: ElementRef }, { propertyName: "iconElement", first: true, predicate: ["iconArrow"], descendants: true, read: ElementRef, static: true }, { propertyName: "inputEl", first: true, predicate: ["inp"], descendants: true, read: ElementRef, static: true }, { propertyName: "poListbox", first: true, predicate: ["poListbox"], descendants: true }, { propertyName: "helperEl", first: true, predicate: ["helperEl"], descendants: true, read: PoHelperComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@let poHelper = setHelper(label, additionalHelpTooltip);\n@let needsHelper = !label && (poHelperComponent() || poHelper.hideAdditionalHelp);\n<div class=\"po-combo-field-wrapper\" [class._active]=\"needsHelper\">\n <div class=\"po-combo-flex-item\">\n <div #outerContainer>\n <po-field-container\n [p-disabled]=\"isDisabled\"\n [p-id]=\"id\"\n [p-label]=\"label\"\n [p-optional]=\"optional\"\n [p-required]=\"required\"\n [p-show-required]=\"showRequired\"\n [p-helper]=\"label ? poHelper.helperSettings : undefined\"\n [p-show-helper]=\"label ? displayAdditionalHelp : undefined\"\n [p-size]=\"size\"\n [p-text-wrap]=\"labelTextWrap()\"\n >\n <div\n #searchContainer\n cdkOverlayOrigin\n #trigger=\"cdkOverlayOrigin\"\n class=\"po-field-container-content po-combo-container-content\"\n [attr.p-size]=\"size\"\n >\n <div #fieldContainerInput class=\"po-combo-container-wrapper\">\n @if (icon) {\n <div class=\"po-field-icon-container-left\">\n <po-icon\n class=\"po-field-icon po-icon-input\"\n [class.po-field-icon-disabled]=\"isDisabled\"\n [class.po-field-icon-aa]=\"size === 'small'\"\n [p-icon]=\"icon\"\n ></po-icon>\n </div>\n }\n\n <input\n #inp\n class=\"po-combo-input\"\n [ngClass]=\"\n clean && inp.value\n ? size === 'small'\n ? 'po-input-double-icon-right-aa'\n : 'po-input-double-icon-right'\n : size === 'small'\n ? 'po-input-icon-right-aa'\n : 'po-input-icon-right'\n \"\n [class.po-combo-input-aa]=\"size === 'small'\"\n [class.po-input-icon-left]=\"icon\"\n [class.po-input-icon-left-aa]=\"icon && size === 'small'\"\n autocomplete=\"off\"\n type=\"text\"\n [attr.data-focused-element]=\"!isDisabled\"\n [attr.data-inactive-component]=\"isDisabled\"\n [attr.name]=\"name\"\n [disabled]=\"isDisabled\"\n [id]=\"id\"\n [placeholder]=\"isDisabled ? '' : placeholder\"\n [required]=\"required\"\n [attr.data-append-in-body]=\"appendBox\"\n [attr.p-size]=\"size\"\n (click)=\"!isDisabled && toggleComboVisibility()\"\n (keyup)=\"onKeyUp($event)\"\n (blur)=\"onBlur($event)\"\n (keyup)=\"searchOnEnterOrArrow($event, $event.target.value)\"\n (keydown)=\"onKeyDown($event)\"\n />\n\n <div class=\"po-field-icon-container-right\">\n @if (loading) {\n <po-loading-icon [p-size]=\"mapSizeToIcon(size)\"></po-loading-icon>\n } @else {\n @if (!loading && isCleanVisible()) {\n <po-clean\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-label]=\"literals.clean\"\n class=\"po-combo-clean po-icon-input\"\n [class.po-combo-clean-aa]=\"size === 'small'\"\n [p-element-ref]=\"inputEl\"\n [p-size]=\"size\"\n (p-change-event)=\"clear($event)\"\n (click)=\"clear(null); $event.preventDefault()\"\n (keydown.enter)=\"clearAndFocus(); $event.preventDefault()\"\n (keydown.tab)=\"handleCleanKeyboardTab($event)\"\n >\n </po-clean>\n }\n }\n <div\n #iconArrow\n class=\"po-combo-arrow po-field-icon\"\n [class.po-field-icon-disabled]=\"isDisabled\"\n [class.po-field-icon-disabled-aa]=\"isDisabled && size === 'small'\"\n (click)=\"!isDisabled && toggleComboVisibility(true)\"\n >\n <po-icon\n [p-icon]=\"comboOpen ? 'ICON_ARROW_UP po-icon-input' : 'ICON_ARROW_DOWN po-icon-input'\"\n [class.po-field-icon]=\"!isDisabled\"\n [class.po-field-icon-aa]=\"size === 'small'\"\n [class.po-combo-default-border]=\"!isDisabled && inp.value\"\n [class.po-combo-background-arrow-up]=\"!isDisabled && comboOpen\"\n ></po-icon>\n </div>\n </div>\n </div>\n </div>\n\n @if (appendBox) {\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"true\"\n [cdkConnectedOverlayDisableClose]=\"true\"\n >\n <ng-container *ngTemplateOutlet=\"dropdownListbox\"></ng-container>\n </ng-template>\n } @else {\n <ng-container *ngTemplateOutlet=\"dropdownListbox\"> </ng-container>\n }\n\n <po-field-container-bottom\n [p-append-in-body]=\"appendBox\"\n [p-help]=\"help\"\n [p-disabled]=\"isDisabled\"\n [p-error-pattern]=\"getErrorPattern()\"\n [p-error-limit]=\"errorLimit\"\n [p-size]=\"size\"\n ></po-field-container-bottom>\n </po-field-container>\n\n <ng-template #dropdownListbox>\n <div #containerElement class=\"po-combo-container\" [hidden]=\"!comboOpen && !isServerSearching\">\n <po-listbox\n #poListbox\n #contentElement\n p-type=\"option\"\n [p-items]=\"visibleOptions\"\n [p-field-value]=\"dynamicValue\"\n [p-field-label]=\"dynamicLabel\"\n [p-template]=\"comboOptionTemplate\"\n [p-search-value]=\"getInputValue()\"\n [p-infinite-loading]=\"infiniteLoading\"\n [p-infinite-scroll]=\"infiniteScroll\"\n [p-filtering]=\"isFiltering\"\n [p-cache]=\"cache\"\n [p-filter-mode]=\"filterMode\"\n [p-visible]=\"comboOpen\"\n [p-is-searching]=\"isServerSearching\"\n [p-should-mark-letter]=\"shouldMarkLetters\"\n [p-compare-cache]=\"compareObjects(cacheOptions, visibleOptions)\"\n [p-combo-service]=\"service\"\n [p-infinite-scroll-distance]=\"infiniteScrollDistance\"\n [p-size]=\"size\"\n [p-container-width]=\"containerWidth\"\n (p-selectcombo-item)=\"onOptionClick($event, $event.event)\"\n (p-update-infinite-scroll)=\"showMoreInfiniteScroll()\"\n (p-close)=\"onCloseCombo()\"\n (keydown)=\"onListboxKeyDown($event)\"\n ></po-listbox>\n </div>\n </ng-template>\n </div>\n </div>\n @if ((!this.label && poHelperComponent()) || (!this.label && poHelper.hideAdditionalHelp)) {\n <po-helper\n #helperEl\n class=\"po-field-helper-button\"\n [p-size]=\"size\"\n [p-helper]=\"poHelper.helperSettings\"\n [p-disabled]=\"isDisabled\"\n [p-append-in-body]=\"appendBox\"\n >\n </po-helper>\n }\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i5.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: PoCleanComponent, selector: "po-clean" }, { kind: "component", type: PoFieldContainerBottomComponent, selector: "po-field-container-bottom", inputs: ["p-append-in-body", "p-disabled", "p-error-pattern", "p-error-limit", "p-help", "p-size", "p-helper", "p-show-helper"] }, { kind: "component", type: PoFieldContainerComponent, selector: "po-field-container", inputs: ["p-disabled", "p-id", "p-label", "p-help", "p-helper", "p-show-helper", "p-text-wrap", "p-optional", "p-required", "p-show-required", "p-size"] }, { kind: "component", type: PoLoadingIconComponent, selector: "po-loading-icon", inputs: ["p-neutral-color", "p-size"] }, { kind: "component", type: PoIconComponent, selector: "po-icon", inputs: ["p-icon"] }, { kind: "component", type: PoListBoxComponent, selector: "po-listbox" }, { kind: "component", type: PoHelperComponent, selector: "po-helper" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
29350
29351
|
}
|
|
29351
29352
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: PoComboComponent, decorators: [{
|
|
29352
29353
|
type: Component,
|
|
@@ -29363,7 +29364,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
|
|
|
29363
29364
|
useExisting: forwardRef(() => PoComboComponent),
|
|
29364
29365
|
multi: true
|
|
29365
29366
|
}
|
|
29366
|
-
], standalone: false, template: "@let poHelper = setHelper(label, additionalHelpTooltip);\n@let needsHelper = !label && (poHelperComponent() || poHelper.hideAdditionalHelp);\n<div class=\"po-combo-field-wrapper\" [class._active]=\"needsHelper\">\n <div class=\"po-combo-flex-item\">\n <div #outerContainer>\n <po-field-container\n [p-disabled]=\"isDisabled\"\n [p-id]=\"id\"\n [p-label]=\"label\"\n [p-optional]=\"optional\"\n [p-required]=\"required\"\n [p-show-required]=\"showRequired\"\n [p-helper]=\"label ? poHelper.helperSettings : undefined\"\n [p-show-helper]=\"label ? displayAdditionalHelp : undefined\"\n [p-size]=\"size\"\n [p-text-wrap]=\"labelTextWrap()\"\n >\n <div\n #searchContainer\n cdkOverlayOrigin\n #trigger=\"cdkOverlayOrigin\"\n class=\"po-field-container-content po-combo-container-content\"\n [attr.p-size]=\"size\"\n >\n <div class=\"po-combo-container-wrapper\">\n @if (icon) {\n <div class=\"po-field-icon-container-left\">\n <po-icon\n class=\"po-field-icon po-icon-input\"\n [class.po-field-icon-disabled]=\"isDisabled\"\n [class.po-field-icon-aa]=\"size === 'small'\"\n [p-icon]=\"icon\"\n ></po-icon>\n </div>\n }\n\n <input\n #inp\n class=\"po-combo-input\"\n [ngClass]=\"\n clean && inp.value\n ? size === 'small'\n ? 'po-input-double-icon-right-aa'\n : 'po-input-double-icon-right'\n : size === 'small'\n ? 'po-input-icon-right-aa'\n : 'po-input-icon-right'\n \"\n [class.po-combo-input-aa]=\"size === 'small'\"\n [class.po-input-icon-left]=\"icon\"\n [class.po-input-icon-left-aa]=\"icon && size === 'small'\"\n autocomplete=\"off\"\n type=\"text\"\n [attr.data-focused-element]=\"!isDisabled\"\n [attr.data-inactive-component]=\"isDisabled\"\n [attr.name]=\"name\"\n [disabled]=\"isDisabled\"\n [id]=\"id\"\n [placeholder]=\"isDisabled ? '' : placeholder\"\n [required]=\"required\"\n [attr.data-append-in-body]=\"appendBox\"\n [attr.p-size]=\"size\"\n (click)=\"!isDisabled && toggleComboVisibility()\"\n (keyup)=\"onKeyUp($event)\"\n (blur)=\"onBlur($event)\"\n (keyup)=\"searchOnEnterOrArrow($event, $event.target.value)\"\n (keydown)=\"onKeyDown($event)\"\n />\n\n <div class=\"po-field-icon-container-right\">\n @if (loading) {\n <po-loading-icon [p-size]=\"mapSizeToIcon(size)\"></po-loading-icon>\n } @else {\n @if (!loading && isCleanVisible()) {\n <po-clean\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-label]=\"literals.clean\"\n class=\"po-combo-clean po-icon-input\"\n [class.po-combo-clean-aa]=\"size === 'small'\"\n [p-element-ref]=\"inputEl\"\n [p-size]=\"size\"\n (p-change-event)=\"clear($event)\"\n (click)=\"clear(null); $event.preventDefault()\"\n (keydown.enter)=\"clearAndFocus(); $event.preventDefault()\"\n (keydown.tab)=\"handleCleanKeyboardTab($event)\"\n >\n </po-clean>\n }\n }\n <div\n #iconArrow\n class=\"po-combo-arrow po-field-icon\"\n [class.po-field-icon-disabled]=\"isDisabled\"\n [class.po-field-icon-disabled-aa]=\"isDisabled && size === 'small'\"\n (click)=\"!isDisabled && toggleComboVisibility(true)\"\n >\n <po-icon\n [p-icon]=\"comboOpen ? 'ICON_ARROW_UP po-icon-input' : 'ICON_ARROW_DOWN po-icon-input'\"\n [class.po-field-icon]=\"!isDisabled\"\n [class.po-field-icon-aa]=\"size === 'small'\"\n [class.po-combo-default-border]=\"!isDisabled && inp.value\"\n [class.po-combo-background-arrow-up]=\"!isDisabled && comboOpen\"\n ></po-icon>\n </div>\n </div>\n </div>\n </div>\n\n @if (appendBox) {\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"true\"\n [cdkConnectedOverlayDisableClose]=\"true\"\n >\n <ng-container *ngTemplateOutlet=\"dropdownListbox\"></ng-container>\n </ng-template>\n } @else {\n <ng-container *ngTemplateOutlet=\"dropdownListbox\"> </ng-container>\n }\n\n <po-field-container-bottom\n [p-append-in-body]=\"appendBox\"\n [p-help]=\"help\"\n [p-disabled]=\"isDisabled\"\n [p-error-pattern]=\"getErrorPattern()\"\n [p-error-limit]=\"errorLimit\"\n [p-size]=\"size\"\n ></po-field-container-bottom>\n </po-field-container>\n\n <ng-template #dropdownListbox>\n <div #containerElement class=\"po-combo-container\" [hidden]=\"!comboOpen && !isServerSearching\">\n <po-listbox\n #poListbox\n #contentElement\n p-type=\"option\"\n [p-items]=\"visibleOptions\"\n [p-field-value]=\"dynamicValue\"\n [p-field-label]=\"dynamicLabel\"\n [p-template]=\"comboOptionTemplate\"\n [p-search-value]=\"getInputValue()\"\n [p-infinite-loading]=\"infiniteLoading\"\n [p-infinite-scroll]=\"infiniteScroll\"\n [p-filtering]=\"isFiltering\"\n [p-cache]=\"cache\"\n [p-filter-mode]=\"filterMode\"\n [p-visible]=\"comboOpen\"\n [p-is-searching]=\"isServerSearching\"\n [p-should-mark-letter]=\"shouldMarkLetters\"\n [p-compare-cache]=\"compareObjects(cacheOptions, visibleOptions)\"\n [p-combo-service]=\"service\"\n [p-infinite-scroll-distance]=\"infiniteScrollDistance\"\n [p-size]=\"size\"\n [p-container-width]=\"containerWidth\"\n (p-selectcombo-item)=\"onOptionClick($event, $event.event)\"\n (p-update-infinite-scroll)=\"showMoreInfiniteScroll()\"\n (p-close)=\"onCloseCombo()\"\n (keydown)=\"onListboxKeyDown($event)\"\n ></po-listbox>\n </div>\n </ng-template>\n </div>\n </div>\n @if ((!this.label && poHelperComponent()) || (!this.label && poHelper.hideAdditionalHelp)) {\n <po-helper\n #helperEl\n class=\"po-field-helper-button\"\n [p-size]=\"size\"\n [p-helper]=\"poHelper.helperSettings\"\n [p-disabled]=\"isDisabled\"\n [p-append-in-body]=\"appendBox\"\n >\n </po-helper>\n }\n</div>\n" }]
|
|
29367
|
+
], standalone: false, template: "@let poHelper = setHelper(label, additionalHelpTooltip);\n@let needsHelper = !label && (poHelperComponent() || poHelper.hideAdditionalHelp);\n<div class=\"po-combo-field-wrapper\" [class._active]=\"needsHelper\">\n <div class=\"po-combo-flex-item\">\n <div #outerContainer>\n <po-field-container\n [p-disabled]=\"isDisabled\"\n [p-id]=\"id\"\n [p-label]=\"label\"\n [p-optional]=\"optional\"\n [p-required]=\"required\"\n [p-show-required]=\"showRequired\"\n [p-helper]=\"label ? poHelper.helperSettings : undefined\"\n [p-show-helper]=\"label ? displayAdditionalHelp : undefined\"\n [p-size]=\"size\"\n [p-text-wrap]=\"labelTextWrap()\"\n >\n <div\n #searchContainer\n cdkOverlayOrigin\n #trigger=\"cdkOverlayOrigin\"\n class=\"po-field-container-content po-combo-container-content\"\n [attr.p-size]=\"size\"\n >\n <div #fieldContainerInput class=\"po-combo-container-wrapper\">\n @if (icon) {\n <div class=\"po-field-icon-container-left\">\n <po-icon\n class=\"po-field-icon po-icon-input\"\n [class.po-field-icon-disabled]=\"isDisabled\"\n [class.po-field-icon-aa]=\"size === 'small'\"\n [p-icon]=\"icon\"\n ></po-icon>\n </div>\n }\n\n <input\n #inp\n class=\"po-combo-input\"\n [ngClass]=\"\n clean && inp.value\n ? size === 'small'\n ? 'po-input-double-icon-right-aa'\n : 'po-input-double-icon-right'\n : size === 'small'\n ? 'po-input-icon-right-aa'\n : 'po-input-icon-right'\n \"\n [class.po-combo-input-aa]=\"size === 'small'\"\n [class.po-input-icon-left]=\"icon\"\n [class.po-input-icon-left-aa]=\"icon && size === 'small'\"\n autocomplete=\"off\"\n type=\"text\"\n [attr.data-focused-element]=\"!isDisabled\"\n [attr.data-inactive-component]=\"isDisabled\"\n [attr.name]=\"name\"\n [disabled]=\"isDisabled\"\n [id]=\"id\"\n [placeholder]=\"isDisabled ? '' : placeholder\"\n [required]=\"required\"\n [attr.data-append-in-body]=\"appendBox\"\n [attr.p-size]=\"size\"\n (click)=\"!isDisabled && toggleComboVisibility()\"\n (keyup)=\"onKeyUp($event)\"\n (blur)=\"onBlur($event)\"\n (keyup)=\"searchOnEnterOrArrow($event, $event.target.value)\"\n (keydown)=\"onKeyDown($event)\"\n />\n\n <div class=\"po-field-icon-container-right\">\n @if (loading) {\n <po-loading-icon [p-size]=\"mapSizeToIcon(size)\"></po-loading-icon>\n } @else {\n @if (!loading && isCleanVisible()) {\n <po-clean\n tabindex=\"0\"\n role=\"button\"\n [attr.aria-label]=\"literals.clean\"\n class=\"po-combo-clean po-icon-input\"\n [class.po-combo-clean-aa]=\"size === 'small'\"\n [p-element-ref]=\"inputEl\"\n [p-size]=\"size\"\n (p-change-event)=\"clear($event)\"\n (click)=\"clear(null); $event.preventDefault()\"\n (keydown.enter)=\"clearAndFocus(); $event.preventDefault()\"\n (keydown.tab)=\"handleCleanKeyboardTab($event)\"\n >\n </po-clean>\n }\n }\n <div\n #iconArrow\n class=\"po-combo-arrow po-field-icon\"\n [class.po-field-icon-disabled]=\"isDisabled\"\n [class.po-field-icon-disabled-aa]=\"isDisabled && size === 'small'\"\n (click)=\"!isDisabled && toggleComboVisibility(true)\"\n >\n <po-icon\n [p-icon]=\"comboOpen ? 'ICON_ARROW_UP po-icon-input' : 'ICON_ARROW_DOWN po-icon-input'\"\n [class.po-field-icon]=\"!isDisabled\"\n [class.po-field-icon-aa]=\"size === 'small'\"\n [class.po-combo-default-border]=\"!isDisabled && inp.value\"\n [class.po-combo-background-arrow-up]=\"!isDisabled && comboOpen\"\n ></po-icon>\n </div>\n </div>\n </div>\n </div>\n\n @if (appendBox) {\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"true\"\n [cdkConnectedOverlayDisableClose]=\"true\"\n >\n <ng-container *ngTemplateOutlet=\"dropdownListbox\"></ng-container>\n </ng-template>\n } @else {\n <ng-container *ngTemplateOutlet=\"dropdownListbox\"> </ng-container>\n }\n\n <po-field-container-bottom\n [p-append-in-body]=\"appendBox\"\n [p-help]=\"help\"\n [p-disabled]=\"isDisabled\"\n [p-error-pattern]=\"getErrorPattern()\"\n [p-error-limit]=\"errorLimit\"\n [p-size]=\"size\"\n ></po-field-container-bottom>\n </po-field-container>\n\n <ng-template #dropdownListbox>\n <div #containerElement class=\"po-combo-container\" [hidden]=\"!comboOpen && !isServerSearching\">\n <po-listbox\n #poListbox\n #contentElement\n p-type=\"option\"\n [p-items]=\"visibleOptions\"\n [p-field-value]=\"dynamicValue\"\n [p-field-label]=\"dynamicLabel\"\n [p-template]=\"comboOptionTemplate\"\n [p-search-value]=\"getInputValue()\"\n [p-infinite-loading]=\"infiniteLoading\"\n [p-infinite-scroll]=\"infiniteScroll\"\n [p-filtering]=\"isFiltering\"\n [p-cache]=\"cache\"\n [p-filter-mode]=\"filterMode\"\n [p-visible]=\"comboOpen\"\n [p-is-searching]=\"isServerSearching\"\n [p-should-mark-letter]=\"shouldMarkLetters\"\n [p-compare-cache]=\"compareObjects(cacheOptions, visibleOptions)\"\n [p-combo-service]=\"service\"\n [p-infinite-scroll-distance]=\"infiniteScrollDistance\"\n [p-size]=\"size\"\n [p-container-width]=\"containerWidth\"\n (p-selectcombo-item)=\"onOptionClick($event, $event.event)\"\n (p-update-infinite-scroll)=\"showMoreInfiniteScroll()\"\n (p-close)=\"onCloseCombo()\"\n (keydown)=\"onListboxKeyDown($event)\"\n ></po-listbox>\n </div>\n </ng-template>\n </div>\n </div>\n @if ((!this.label && poHelperComponent()) || (!this.label && poHelper.hideAdditionalHelp)) {\n <po-helper\n #helperEl\n class=\"po-field-helper-button\"\n [p-size]=\"size\"\n [p-helper]=\"poHelper.helperSettings\"\n [p-disabled]=\"isDisabled\"\n [p-append-in-body]=\"appendBox\"\n >\n </po-helper>\n }\n</div>\n" }]
|
|
29367
29368
|
}], ctorParameters: () => [], propDecorators: { comboOptionTemplate: [{
|
|
29368
29369
|
type: ContentChild,
|
|
29369
29370
|
args: [PoComboOptionTemplateDirective, { static: true }]
|
|
@@ -29376,6 +29377,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
|
|
|
29376
29377
|
}], contentElement: [{
|
|
29377
29378
|
type: ViewChild,
|
|
29378
29379
|
args: ['contentElement', { read: ElementRef }]
|
|
29380
|
+
}], fieldContainerInput: [{
|
|
29381
|
+
type: ViewChild,
|
|
29382
|
+
args: ['fieldContainerInput', { read: ElementRef }]
|
|
29379
29383
|
}], iconElement: [{
|
|
29380
29384
|
type: ViewChild,
|
|
29381
29385
|
args: ['iconArrow', { read: ElementRef, static: true }]
|