@po-ui/ng-components 19.10.0 → 19.12.0

package/fesm2022/po-ui-ng-components.mjs

@@ -3620,7 +3620,7 @@ const poThemeDefault = {
  *
  * O `PoThemeService` possibilita a personalização das cores do tema padrão do `PO-UI`, permitindo a alteração dos valores das variáveis de estilo usadas no CSS padrão.
  *
- * > Para saber mais sobre como customizar as cores do tema padrão verifique o item [Customizando cores do tema padrão](https://po-ui.io/guides/colors-customization) na aba `Guias`.
+ * > Para saber mais sobre como customizar o tema padrão verifique o item [Customização de Temas usando o serviço PO-UI](guides/theme-service) na aba `Guias`.
  *
  * > Obs.: Não está documentado aqui e não indicamos a customização das cores de 'feedback' por motivos de acessibilidade e usabilidade.
  */
@@ -3676,7 +3676,7 @@ class PoThemeService {
         const onRootStyles = _themeType.onRoot ? this.generateAdditionalStyles(_themeType.onRoot) : '';
         const additionalStyles = this.generateAdditionalStyles(_themeType);
         const combinedStyles = `
-      html.${themeConfig.name}-${PoThemeTypeEnum[themeType]}-${a11yLevel}:root {
+      :root.${themeConfig.name}-${PoThemeTypeEnum[themeType]}-${a11yLevel} {
         ${colorStyles}
         ${perComponentStyles}
         ${onRootStyles}
@@ -3743,41 +3743,54 @@ class PoThemeService {
      * A classe do tema é aplicada no HTML e pode ser formatada como `html[class*="-light-AA"]` para personalizações
      * em temas específicos.
      *
-     * @param {PoThemeActive} active - Objeto que define o tema ativo, com `type` e `a11y`.
+     * @param {PoThemeActive} active - Configuração do tema ativo:
      * @param {any} perComponent - Objeto contendo os estilos específicos para componentes a serem aplicados.
      * @param {any} onRoot - Objeto contendo tokens de estilo que serão aplicados diretamente no seletor `:root` do HTML.
+     * @param {string | Array<string>} [classPrefix] - Prefixo(s) de classe para direcionamento preciso.
      *
      * @example
+     * #### 1. Com prefixo único
+     * ```typescript
+     * setPerComponentAndOnRoot(
+     *   { type: 'dark', a11y: 'AA' },
+     *   { 'po-input': { background: '#222' } },
+     *   { '--text-color': '#fff' },
+     *   'myTheme'
+     * );
+     * ```
+     * **Saída:**
+     * ```css
+     * :root[class*="-dark-AA"][class*="myTheme"] {
+     *   --text-color: #fff;
+     *   po-input { background: #222; }
+     * }
+     * ```
      *
-     * // Exemplo de utilização com um tema ativo e tokens de estilo
-     * const themeActive = { type: 'light', a11y: 'AA' };
-     * const perComponentStyles = {
-     *   'po-listbox [hidden]': {
-     *     'display': 'flex !important'
-     *   }
-     * };
-     * const onRootStyles = {
-     *   '--font-family': 'Roboto',
-     *   '--background-color': '#fff'
-     * };
-     *
-     * this.setPerComponentAndOnRoot(themeActive, perComponentStyles, onRootStyles);
+     * #### 2. Com múltiplos prefixos
+     * ```typescript
+     * setPerComponentAndOnRoot(
+     *   { type: 'light' },
+     *   null,
+     *   { '--primary': '#3e8ed0' },
+     *   ['myTheme', 'portal-v2']
+     * );
+     * ```
+     * **Saída:**
+     * ```css
+     * :root[class*="-light"][class*="myTheme"],
+     * :root[class*="-light"][class*="portal-v2"] {
+     *   --primary: #3e8ed0;
+     * }
+     * ```
      *
-     * // Resultado:
-     * // Gera e aplica os seguintes estilos no DOM
-     * // html[class*="-light-AA"]:root {
-     * //   --font-family: 'Roboto';
-     * //   --background-color: '#fff';
-     * //   po-listbox [hidden] {
-     * //     display: flex !important;
-     * //   }
-     * // }
+     * - Quando usado com array, gera um seletor CSS com múltiplos targets (separados por vírgula).
+     * - Mantém a especificidade original do tema (`[class*="-type-a11y"]`) combinada com cada prefixo.
      *
      */
-    setPerComponentAndOnRoot(active, perComponent, onRoot) {
+    setPerComponentAndOnRoot(active, perComponent, onRoot, classPrefix) {
         const perComponentStyles = perComponent ? this.generatePerComponentStyles(perComponent) : '';
         const onRootStyles = onRoot ? this.generateAdditionalStyles(onRoot) : '';
-        let selector = 'html';
+        let selector = ':root';
         const typeSelector = active?.type !== undefined ? `-${PoThemeTypeEnum[active.type]}` : '';
         const accessibilitySelector = active?.a11y !== undefined ? `-${PoThemeA11yEnum[active.a11y]}` : '';
         if (typeSelector && accessibilitySelector) {
@@ -3789,8 +3802,16 @@ class PoThemeService {
         else if (typeSelector) {
             selector += `[class*="${typeSelector}"]`;
         }
+        if (classPrefix) {
+            if (Array.isArray(classPrefix)) {
+                selector = classPrefix.map(prefix => selector + `[class*="${prefix}"]`).join(', ');
+            }
+            else {
+                selector += `[class*="${classPrefix}"]`;
+            }
+        }
         const styleCss = `
-      ${selector}:root {
+      ${selector} {
         ${perComponentStyles}
         ${onRootStyles}
       }
@@ -3800,7 +3821,7 @@ class PoThemeService {
             styleElement = this.renderer.createElement('style');
             styleElement.id = 'baseStyle';
             this.renderer.appendChild(styleElement, this.renderer.createText(styleCss));
-            this.renderer.appendChild(this.document.head, styleElement);
+            this.renderer.insertBefore(this.document.head, styleElement, this.document.head.firstChild);
         }
         else {
             if (!styleElement.textContent.includes(styleCss.trim())) {
@@ -3833,7 +3854,9 @@ class PoThemeService {
         if (existingStyleElement) {
             this.renderer.removeChild(document.head, existingStyleElement);
         }
-        this.renderer.appendChild(document.head, styleElement);
+        const existingBaseStyle = document.head.querySelector('#baseStyle');
+        const referenceNode = existingBaseStyle ? existingBaseStyle.nextSibling : document.head.firstChild;
+        this.renderer.insertBefore(document.head, styleElement, referenceNode);
     }
     changeThemeType(theme, persistPreference = true) {
         this.cleanThemeActive(persistPreference);
@@ -4119,16 +4142,16 @@ class PoThemeService {
     }
     setDefaultBaseStyle() {
         // set triple A for all themes (its the base theme)
-        // result: html:root
+        // result: :root
         this.setPerComponentAndOnRoot(undefined, poThemeDefaultAAA.perComponent, poThemeDefaultAAA.onRoot);
         // set double A
-        // result: html[class*="-AA"]:root
+        // result: :root[class*="-AA"]
         this.setPerComponentAndOnRoot({ a11y: PoThemeA11yEnum.AA }, poThemeDefaultAA.perComponent, poThemeDefaultAA.onRoot);
         // set Light mode values
-        // result: html[class*="-light"]:root
+        // result: :root[class*="-light"]
         this.setPerComponentAndOnRoot({ type: PoThemeTypeEnum.light }, poThemeDefaultLightValues.perComponent, poThemeDefaultLightValues.onRoot);
         // set Dark mode values
-        // result: html[class*="-dark"]:root
+        // result: :root[class*="-dark"]
         this.setPerComponentAndOnRoot({ type: PoThemeTypeEnum.dark }, poThemeDefaultDarkValues.perComponent, poThemeDefaultDarkValues.onRoot);
     }
     static ɵfac = function PoThemeService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PoThemeService)(i0.ɵɵinject(DOCUMENT), i0.ɵɵinject(i0.RendererFactory2), i0.ɵɵinject(ICONS_DICTIONARY, 8)); };
@@ -24419,6 +24442,7 @@ function PoSwitchComponent_po_label_8_Template(rf, ctx) { if (rf & 1) {
 class PoSwitchComponent extends PoFieldModel {
     poThemeService;
     changeDetector;
+    injector;
     switchContainer;
     id = `po-switch[${uuid()}]`;
     // Parâmetro interno, não documentar
@@ -24428,6 +24452,7 @@ class PoSwitchComponent extends PoFieldModel {
     _labelPosition = PoSwitchLabelPosition.Right;
     _formatModel = false;
     _size = undefined;
+    statusChangesSubscription;
     /**
      * @optional
      *
@@ -24493,6 +24518,41 @@ class PoSwitchComponent extends PoFieldModel {
     get labelOn() {
         return this._labelOn;
     }
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Exibe a mensagem de erro configurada quando o campo estiver desligado(off/false).
+     *
+     *
+     */
+    fieldErrorMessage;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Limita a exibição da mensagem de erro a duas linhas e exibe um tooltip com o texto completo.
+     *
+     * > Caso essa propriedade seja definida como `true`, a mensagem de erro será limitada a duas linhas
+     * e um tooltip será exibido ao passar o mouse sobre a mensagem para mostrar o conteúdo completo.
+     *
+     * @default `false`
+     */
+    errorLimit = false;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define qual valor será considerado como inválido para exibir a mensagem da propriedade `p-field-error-message`.
+     *
+     * > Caso essa propriedade seja definida como `true`, a mensagem de erro será exibida quando o campo estiver ligado(on/true).
+     *
+     * @default `false`
+     */
+    invalidValue = false;
     /**
      * @optional
      *
@@ -24514,10 +24574,19 @@ class PoSwitchComponent extends PoFieldModel {
     get size() {
         return this._size ?? getDefaultSize(this.poThemeService, PoFieldSize);
     }
-    constructor(poThemeService, changeDetector) {
+    el = inject(ElementRef);
+    injectOptions = {
+        self: true
+    };
+    control;
+    constructor(poThemeService, changeDetector, injector) {
         super();
         this.poThemeService = poThemeService;
         this.changeDetector = changeDetector;
+        this.injector = injector;
+    }
+    ngOnDestroy() {
+        this.statusChangesSubscription?.unsubscribe();
     }
     /**
      * Função que atribui foco ao componente.
@@ -24600,19 +24669,60 @@ class PoSwitchComponent extends PoFieldModel {
             this.changeDetector.markForCheck();
         }
     }
-    static ɵfac = function PoSwitchComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PoSwitchComponent)(i0.ɵɵdirectiveInject(PoThemeService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
+    validate(control) {
+        const value = this.value;
+        const isRequired = { required: true };
+        if (this.invalidValue && this.fieldErrorMessage) {
+            return value === this.invalidValue ? isRequired : null;
+        }
+        else if (this.fieldErrorMessage) {
+            return value === true ? null : isRequired;
+        }
+        return null;
+    }
+    ngAfterViewInit() {
+        this.setControl();
+    }
+    setControl() {
+        const ngControl = this.injector.get(NgControl, null, this.injectOptions);
+        if (ngControl) {
+            this.control = ngControl.control;
+            if (this.control) {
+                this.statusChangesSubscription = this.control.statusChanges.subscribe(() => {
+                    this.changeDetector.markForCheck();
+                });
+            }
+        }
+    }
+    getErrorPattern() {
+        return this.fieldErrorMessage && this.hasInvalidClass() ? this.fieldErrorMessage : '';
+    }
+    hasInvalidClass() {
+        return (this.el.nativeElement.classList.contains('ng-invalid') && this.el.nativeElement.classList.contains('ng-dirty'));
+    }
+    static ɵfac = function PoSwitchComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PoSwitchComponent)(i0.ɵɵdirectiveInject(PoThemeService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(Injector)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoSwitchComponent, selectors: [["po-switch"]], viewQuery: function PoSwitchComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0$$, 7);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.switchContainer = _t.first);
-        } }, inputs: { value: [2, "p-value", "value", convertToBoolean], formatModel: [2, "p-format-model", "formatModel", convertToBoolean], hideLabelStatus: [2, "p-hide-label-status", "hideLabelStatus", convertToBoolean], labelPosition: [0, "p-label-position", "labelPosition"], labelOff: [0, "p-label-off", "labelOff"], labelOn: [0, "p-label-on", "labelOn"], size: [0, "p-size", "size"] }, standalone: false, features: [i0.ɵɵProvidersFeature([
+        } }, inputs: { value: [2, "p-value", "value", convertToBoolean], formatModel: [2, "p-format-model", "formatModel", convertToBoolean], hideLabelStatus: [2, "p-hide-label-status", "hideLabelStatus", convertToBoolean], labelPosition: [0, "p-label-position", "labelPosition"], labelOff: [0, "p-label-off", "labelOff"], labelOn: [0, "p-label-on", "labelOn"], fieldErrorMessage: [0, "p-field-error-message", "fieldErrorMessage"], errorLimit: [0, "p-error-limit", "errorLimit"], invalidValue: [0, "p-invalid-value", "invalidValue"], size: [0, "p-size", "size"] }, standalone: false, features: [i0.ɵɵProvidersFeature([
                 {
                     provide: NG_VALUE_ACCESSOR,
                     useExisting: forwardRef(() => PoSwitchComponent),
                     multi: true
+                },
+                {
+                    provide: NG_VALIDATORS,
+                    useExisting: forwardRef(() => PoSwitchComponent),
+                    multi: true
+                },
+                {
+                    provide: NgControl,
+                    useExisting: forwardRef(() => PoSwitchComponent),
+                    multi: false
                 }
-            ]), i0.ɵɵInputTransformsFeature, i0.ɵɵInheritDefinitionFeature], decls: 10, vars: 26, consts: [["switchContainer", ""], [3, "p-disabled", "p-id", "p-label"], [1, "po-field-container-content"], [1, "po-switch"], ["role", "switch", 1, "po-switch-container", 3, "blur", "click", "keydown", "id", "tabindex"], [1, "po-switch-track"], [1, "po-switch-toggle"], ["class", "po-switch-icon", "p-icon", "ICON_OK", 3, "po-switch-icon-aa", 4, "ngIf"], ["class", "po-switch-label", 3, "po-switch-label-aa", "p-disabled", "p-label", "click", 4, "ngIf"], [3, "p-additional-help", "p-additional-help-tooltip", "p-append-in-body", "p-help", "p-disabled", "p-show-additional-help", "p-show-additional-help-icon"], ["p-icon", "ICON_OK", 1, "po-switch-icon"], [1, "po-switch-label", 3, "click", "p-disabled", "p-label"]], template: function PoSwitchComponent_Template(rf, ctx) { if (rf & 1) {
+            ]), i0.ɵɵInputTransformsFeature, i0.ɵɵInheritDefinitionFeature], decls: 10, vars: 28, consts: [["switchContainer", ""], [3, "p-disabled", "p-id", "p-label"], [1, "po-field-container-content"], [1, "po-switch"], ["role", "switch", 1, "po-switch-container", 3, "blur", "click", "keydown", "id", "tabindex"], [1, "po-switch-track"], [1, "po-switch-toggle"], ["class", "po-switch-icon", "p-icon", "ICON_OK", 3, "po-switch-icon-aa", 4, "ngIf"], ["class", "po-switch-label", 3, "po-switch-label-aa", "p-disabled", "p-label", "click", 4, "ngIf"], [3, "p-additional-help", "p-additional-help-tooltip", "p-append-in-body", "p-help", "p-disabled", "p-error-limit", "p-error-pattern", "p-show-additional-help", "p-show-additional-help-icon"], ["p-icon", "ICON_OK", 1, "po-switch-icon"], [1, "po-switch-label", 3, "click", "p-disabled", "p-label"]], template: function PoSwitchComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "po-field-container", 1)(1, "div", 2)(2, "div", 3)(3, "div", 4, 0);
             i0.ɵɵlistener("blur", function PoSwitchComponent_Template_div_blur_3_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onBlur()); })("click", function PoSwitchComponent_Template_div_click_3_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.eventClick()); })("keydown", function PoSwitchComponent_Template_div_keydown_3_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onKeyDown($event)); });
@@ -24645,7 +24755,7 @@ class PoSwitchComponent extends PoFieldModel {
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", !ctx.hideLabelStatus);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("p-additional-help-tooltip", ctx.getAdditionalHelpTooltip())("p-append-in-body", ctx.appendBox)("p-help", ctx.help)("p-disabled", ctx.disabled)("p-show-additional-help", ctx.displayAdditionalHelp)("p-show-additional-help-icon", ctx.showAdditionalHelpIcon());
+            i0.ɵɵproperty("p-additional-help-tooltip", ctx.getAdditionalHelpTooltip())("p-append-in-body", ctx.appendBox)("p-help", ctx.help)("p-disabled", ctx.disabled)("p-error-limit", ctx.errorLimit)("p-error-pattern", ctx.getErrorPattern())("p-show-additional-help", ctx.displayAdditionalHelp)("p-show-additional-help-icon", ctx.showAdditionalHelpIcon());
         } }, dependencies: [i1.NgIf, PoFieldContainerBottomComponent, PoFieldContainerComponent, PoLabelComponent, PoIconComponent], encapsulation: 2, changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoSwitchComponent, [{
@@ -24655,9 +24765,22 @@ class PoSwitchComponent extends PoFieldModel {
                         provide: NG_VALUE_ACCESSOR,
                         useExisting: forwardRef(() => PoSwitchComponent),
                         multi: true
+                    },
+                    {
+                        provide: NG_VALIDATORS,
+                        useExisting: forwardRef(() => PoSwitchComponent),
+                        multi: true
+                    },
+                    {
+                        provide: NgControl,
+                        useExisting: forwardRef(() => PoSwitchComponent),
+                        multi: false
                     }
-                ], standalone: false, template: "<po-field-container [p-disabled]=\"disabled\" [p-id]=\"id\" [p-label]=\"label\">\n  <div class=\"po-field-container-content\" [attr.name]=\"name\">\n    <div class=\"po-switch\" [class.po-switch-aa]=\"size === 'small'\" [attr.data-label-position]=\"getLabelPosition()\">\n      <div\n        #switchContainer\n        class=\"po-switch-container\"\n        [class.po-switch-container-aa]=\"size === 'small'\"\n        role=\"switch\"\n        [attr.aria-checked]=\"value\"\n        [attr.aria-disabled]=\"disabled\"\n        [id]=\"id\"\n        [tabindex]=\"disabled ? -1 : 0\"\n        (blur)=\"onBlur()\"\n        (click)=\"eventClick()\"\n        (keydown)=\"onKeyDown($event)\"\n      >\n        <div class=\"po-switch-track\" [class.po-switch-track-aa]=\"size === 'small'\">\n          <div\n            class=\"po-switch-toggle\"\n            [class.po-switch-toggle-aa]=\"size === 'small'\"\n            [attr.aria-label]=\"value === true ? labelOn : labelOff\"\n          >\n            <po-icon\n              *ngIf=\"value === true\"\n              class=\"po-switch-icon\"\n              [class.po-switch-icon-aa]=\"size === 'small'\"\n              p-icon=\"ICON_OK\"\n            ></po-icon>\n          </div>\n        </div>\n      </div>\n\n      <po-label\n        *ngIf=\"!hideLabelStatus\"\n        class=\"po-switch-label\"\n        [class.po-switch-label-aa]=\"size === 'small'\"\n        [p-disabled]=\"disabled\"\n        [p-label]=\"value === true ? labelOn : labelOff\"\n        (click)=\"eventClick()\"\n      >\n      </po-label>\n    </div>\n  </div>\n\n  <po-field-container-bottom\n    [p-additional-help-tooltip]=\"getAdditionalHelpTooltip()\"\n    [p-append-in-body]=\"appendBox\"\n    [p-help]=\"help\"\n    [p-disabled]=\"disabled\"\n    [p-show-additional-help]=\"displayAdditionalHelp\"\n    [p-show-additional-help-icon]=\"showAdditionalHelpIcon()\"\n    (p-additional-help)=\"emitAdditionalHelp()\"\n  ></po-field-container-bottom>\n</po-field-container>\n" }]
-    }], () => [{ type: PoThemeService }, { type: i0.ChangeDetectorRef }], { switchContainer: [{
+                ], standalone: false, template: "<po-field-container [p-disabled]=\"disabled\" [p-id]=\"id\" [p-label]=\"label\">\n  <div class=\"po-field-container-content\" [attr.name]=\"name\">\n    <div class=\"po-switch\" [class.po-switch-aa]=\"size === 'small'\" [attr.data-label-position]=\"getLabelPosition()\">\n      <div\n        #switchContainer\n        class=\"po-switch-container\"\n        [class.po-switch-container-aa]=\"size === 'small'\"\n        role=\"switch\"\n        [attr.aria-checked]=\"value\"\n        [attr.aria-disabled]=\"disabled\"\n        [id]=\"id\"\n        [tabindex]=\"disabled ? -1 : 0\"\n        (blur)=\"onBlur()\"\n        (click)=\"eventClick()\"\n        (keydown)=\"onKeyDown($event)\"\n      >\n        <div class=\"po-switch-track\" [class.po-switch-track-aa]=\"size === 'small'\">\n          <div\n            class=\"po-switch-toggle\"\n            [class.po-switch-toggle-aa]=\"size === 'small'\"\n            [attr.aria-label]=\"value === true ? labelOn : labelOff\"\n          >\n            <po-icon\n              *ngIf=\"value === true\"\n              class=\"po-switch-icon\"\n              [class.po-switch-icon-aa]=\"size === 'small'\"\n              p-icon=\"ICON_OK\"\n            ></po-icon>\n          </div>\n        </div>\n      </div>\n\n      <po-label\n        *ngIf=\"!hideLabelStatus\"\n        class=\"po-switch-label\"\n        [class.po-switch-label-aa]=\"size === 'small'\"\n        [p-disabled]=\"disabled\"\n        [p-label]=\"value === true ? labelOn : labelOff\"\n        (click)=\"eventClick()\"\n      >\n      </po-label>\n    </div>\n  </div>\n\n  <po-field-container-bottom\n    [p-additional-help-tooltip]=\"getAdditionalHelpTooltip()\"\n    [p-append-in-body]=\"appendBox\"\n    [p-help]=\"help\"\n    [p-disabled]=\"disabled\"\n    [p-error-limit]=\"errorLimit\"\n    [p-error-pattern]=\"getErrorPattern()\"\n    [p-show-additional-help]=\"displayAdditionalHelp\"\n    [p-show-additional-help-icon]=\"showAdditionalHelpIcon()\"\n    (p-additional-help)=\"emitAdditionalHelp()\"\n  ></po-field-container-bottom>\n</po-field-container>\n" }]
+    }], () => [{ type: PoThemeService }, { type: i0.ChangeDetectorRef }, { type: i0.Injector, decorators: [{
+                type: Inject,
+                args: [Injector]
+            }] }], { switchContainer: [{
             type: ViewChild,
             args: ['switchContainer', { static: true }]
         }], value: [{
@@ -24678,11 +24801,20 @@ class PoSwitchComponent extends PoFieldModel {
         }], labelOn: [{
             type: Input,
             args: ['p-label-on']
+        }], fieldErrorMessage: [{
+            type: Input,
+            args: ['p-field-error-message']
+        }], errorLimit: [{
+            type: Input,
+            args: ['p-error-limit']
+        }], invalidValue: [{
+            type: Input,
+            args: ['p-invalid-value']
         }], size: [{
             type: Input,
             args: ['p-size']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PoSwitchComponent, { className: "PoSwitchComponent", filePath: "lib/components/po-field/po-switch/po-switch.component.ts", lineNumber: 108 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PoSwitchComponent, { className: "PoSwitchComponent", filePath: "lib/components/po-field/po-switch/po-switch.component.ts", lineNumber: 133 }); })();
 
 const _c0$_ = a0 => ({ $implicit: a0 });
 function PoTableListManagerComponent_section_0_ng_container_3_ng_container_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
@@ -48850,7 +48982,7 @@ function PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_switch_9_T
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("name", field_r4.property);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r0.value[field_r4.property]);
-    i0.ɵɵproperty("ngClass", field_r4.componentClass)("additionalHelpEventTrigger", field_r4.additionalHelp ? "event" : "noEvent")("p-additional-help-tooltip", field_r4.additionalHelpTooltip)("p-disabled", ctx_r0.isDisabled(field_r4))("p-format-model", field_r4.formatModel)("p-help", field_r4.help)("p-label", field_r4.label)("p-label-off", field_r4.booleanFalse)("p-label-on", field_r4.booleanTrue)("p-label-position", field_r4.labelPosition)("p-hide-label-status", field_r4.hideLabelStatus)("p-size", field_r4.size || ctx_r0.componentsSize);
+    i0.ɵɵproperty("ngClass", field_r4.componentClass)("additionalHelpEventTrigger", field_r4.additionalHelp ? "event" : "noEvent")("p-additional-help-tooltip", field_r4.additionalHelpTooltip)("p-disabled", ctx_r0.isDisabled(field_r4))("p-error-limit", field_r4.errorLimit)("p-field-error-message", field_r4.errorMessage)("p-format-model", field_r4.formatModel)("p-help", field_r4.help)("p-label", field_r4.label)("p-label-off", field_r4.booleanFalse)("p-label-on", field_r4.booleanTrue)("p-label-position", field_r4.labelPosition)("p-hide-label-status", field_r4.hideLabelStatus)("p-invalid-value", field_r4.invalidValue)("p-size", field_r4.size || ctx_r0.componentsSize);
 } }
 function PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_checkbox_10_Template(rf, ctx) { if (rf & 1) {
     const _r13 = i0.ɵɵgetCurrentView();
@@ -48863,7 +48995,7 @@ function PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_checkbox_1
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("name", field_r4.property);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r0.value[field_r4.property]);
-    i0.ɵɵproperty("ngClass", field_r4.componentClass)("additionalHelpEventTrigger", field_r4.additionalHelp ? "event" : "noEvent")("p-additional-help-tooltip", field_r4.additionalHelpTooltip)("p-auto-focus", field_r4.focus)("p-disabled", ctx_r0.isDisabled(field_r4))("p-label", field_r4.label)("p-size", field_r4.size || ctx_r0.componentsSize);
+    i0.ɵɵproperty("ngClass", field_r4.componentClass)("additionalHelpEventTrigger", field_r4.additionalHelp ? "event" : "noEvent")("p-additional-help-tooltip", field_r4.additionalHelpTooltip)("p-auto-focus", field_r4.focus)("p-disabled", ctx_r0.isDisabled(field_r4))("p-help", field_r4.help)("p-label", field_r4.label)("p-size", field_r4.size || ctx_r0.componentsSize);
 } }
 function PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_combo_11_Template(rf, ctx) { if (rf & 1) {
     const _r14 = i0.ɵɵgetCurrentView();
@@ -48957,7 +49089,7 @@ function PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_upload_17_
 } }
 function PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_divider_1_Template, 1, 1, "po-divider", 7)(2, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_datepicker_2_Template, 2, 26, "po-datepicker", 8)(3, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_datepicker_range_3_Template, 2, 21, "po-datepicker-range", 9)(4, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_input_4_Template, 2, 27, "po-input", 10)(5, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_number_5_Template, 2, 27, "po-number", 11)(6, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_decimal_6_Template, 2, 29, "po-decimal", 12)(7, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_select_7_Template, 2, 19, "po-select", 13)(8, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_radio_group_8_Template, 2, 17, "po-radio-group", 14)(9, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_switch_9_Template, 2, 14, "po-switch", 15)(10, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_checkbox_10_Template, 2, 9, "po-checkbox", 16)(11, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_combo_11_Template, 2, 35, "po-combo", 17)(12, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_lookup_12_Template, 2, 29, "po-lookup", 18)(13, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_checkbox_group_13_Template, 2, 17, "po-checkbox-group", 19)(14, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_multiselect_14_Template, 2, 29, "po-multiselect", 20)(15, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_textarea_15_Template, 2, 20, "po-textarea", 21)(16, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_password_16_Template, 2, 26, "po-password", 22)(17, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_upload_17_Template, 2, 26, "po-upload", 23);
+    i0.ɵɵtemplate(1, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_divider_1_Template, 1, 1, "po-divider", 7)(2, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_datepicker_2_Template, 2, 26, "po-datepicker", 8)(3, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_datepicker_range_3_Template, 2, 21, "po-datepicker-range", 9)(4, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_input_4_Template, 2, 27, "po-input", 10)(5, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_number_5_Template, 2, 27, "po-number", 11)(6, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_decimal_6_Template, 2, 29, "po-decimal", 12)(7, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_select_7_Template, 2, 19, "po-select", 13)(8, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_radio_group_8_Template, 2, 17, "po-radio-group", 14)(9, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_switch_9_Template, 2, 17, "po-switch", 15)(10, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_checkbox_10_Template, 2, 10, "po-checkbox", 16)(11, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_combo_11_Template, 2, 35, "po-combo", 17)(12, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_lookup_12_Template, 2, 29, "po-lookup", 18)(13, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_checkbox_group_13_Template, 2, 17, "po-checkbox-group", 19)(14, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_multiselect_14_Template, 2, 29, "po-multiselect", 20)(15, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_textarea_15_Template, 2, 20, "po-textarea", 21)(16, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_password_16_Template, 2, 26, "po-password", 22)(17, PoDynamicFormFieldsComponent_ng_template_1_ng_container_0_po_upload_17_Template, 2, 26, "po-upload", 23);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const field_r4 = ctx.$implicit;
@@ -49275,7 +49407,7 @@ class PoDynamicFormFieldsComponent extends PoDynamicFormFieldsBaseComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.components = _t);
-        } }, standalone: false, features: [i0.ɵɵProvidersFeature([PoDynamicFormValidationService], [{ provide: ControlContainer, useExisting: NgForm }]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 5, vars: 1, consts: [["poContent", ""], ["poContentContainer", ""], ["component", ""], ["class", "po-row", 3, "po-dynamic", 4, "ngIf"], [1, "po-row"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [4, "ngFor", "ngForOf", "ngForTrackBy"], ["class", "po-sm-12", 3, "p-label", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async", "p-auto-focus", "p-format", "p-help", "p-iso-format", "p-label", "p-locale", "p-max-date", "p-min-date", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-required-field-error-message", "p-size", "p-show-required", "p-placeholder", "ngModelChange", "p-change", "p-additional-help", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-auto-focus", "p-help", "p-label", "p-literals", "p-max-date", "p-min-date", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-label", "p-mask-format-model", "p-mask", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-pattern", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-icon", "p-placeholder", "p-readonly", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-label", "p-min", "p-max", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-step", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-icon", "p-placeholder", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-disabled", "p-decimals-length", "p-thousand-maxlength", "p-icon", "p-auto-focus", "p-help", "p-label", "p-locale", "p-min", "p-max", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-placeholder", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-field-label", "p-field-value", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "p-placeholder", "p-readonly", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-columns", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-format-model", "p-help", "p-label", "p-label-off", "p-label-on", "p-label-position", "p-hide-label-status", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-focus", "p-disabled", "p-label", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], ["p-emit-object-value", "", 3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-focus", "p-clean", "p-disabled", "p-field-label", "p-field-value", "p-filter-params", "p-filter-service", "p-help", "p-infinite-scroll", "p-infinite-scroll-distance", "p-label", "p-literals", "p-options", "p-optional", "p-sort", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-icon", "p-placeholder", "p-filter-minlength", "p-filter-mode", "p-disabled-init-filter", "p-disabled-tab-filter", "p-debounce-time", "p-change-on-enter", "p-remove-initial-filter", "p-size", "p-listbox-control-position", "ngModelChange", "p-change", "p-keydown", "p-additional-help", 4, "ngIf"], ["p-field-label", "label", "p-field-value", "value", 3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-columns", "p-disabled", "p-field-label", "p-field-value", "p-filter-params", "p-filter-service", "p-auto-focus", "p-auto-height", "p-help", "p-field-format", "p-infinite-scroll", "p-label", "p-literals", "p-multiple", "p-no-autocomplete", "p-optional", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "p-placeholder", "p-advanced-filters", "ngModelChange", "p-change", "p-additional-help", "p-change-visible-columns", "p-keydown", "p-restore-column-manager", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-columns", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-show-required", "p-field-error-message", "p-error-limit", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-auto-focus", "p-auto-height", "p-help", "p-label", "p-literals", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-placeholder", "p-field-label", "p-field-value", "p-filter-service", "p-filter-mode", "p-debounce-time", "p-sort", "p-placeholder-search", "p-hide-search", "p-hide-select-all", "p-size", "p-listbox-control-position", "ngModelChange", "p-change", "p-additional-help", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-auto-focus", "p-help", "p-label", "p-maxlength", "p-minlength", "p-optional", "p-readonly", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-rows", "p-size", "p-placeholder", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-hide-password-peek", "p-icon", "p-label", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-pattern", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-placeholder", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-upload", "p-directory", "p-disabled", "p-drag-drop", "p-drag-drop-height", "p-restrictions", "p-form-field", "p-headers", "p-help", "p-hide-restrictions-info", "p-hide-select-button", "p-hide-send-button", "p-multiple", "p-label", "p-literals", "name", "p-custom-action", "p-optional", "p-required", "p-show-required", "p-size", "p-url", "ngModelChange", "p-custom-action-click", "p-error", "p-success", "p-upload", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [1, "po-sm-12", 3, "p-label"], [3, "ngModelChange", "p-change", "p-additional-help", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async", "p-auto-focus", "p-format", "p-help", "p-iso-format", "p-label", "p-locale", "p-max-date", "p-min-date", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-required-field-error-message", "p-size", "p-show-required", "p-placeholder"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-auto-focus", "p-help", "p-label", "p-literals", "p-max-date", "p-min-date", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-label", "p-mask-format-model", "p-mask", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-pattern", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-icon", "p-placeholder", "p-readonly"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-label", "p-min", "p-max", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-step", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-icon", "p-placeholder"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-disabled", "p-decimals-length", "p-thousand-maxlength", "p-icon", "p-auto-focus", "p-help", "p-label", "p-locale", "p-min", "p-max", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-placeholder"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-field-label", "p-field-value", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "p-placeholder", "p-readonly"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-columns", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-format-model", "p-help", "p-label", "p-label-off", "p-label-on", "p-label-position", "p-hide-label-status", "p-size"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-focus", "p-disabled", "p-label", "p-size"], ["p-emit-object-value", "", 3, "ngModelChange", "p-change", "p-keydown", "p-additional-help", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-focus", "p-clean", "p-disabled", "p-field-label", "p-field-value", "p-filter-params", "p-filter-service", "p-help", "p-infinite-scroll", "p-infinite-scroll-distance", "p-label", "p-literals", "p-options", "p-optional", "p-sort", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-icon", "p-placeholder", "p-filter-minlength", "p-filter-mode", "p-disabled-init-filter", "p-disabled-tab-filter", "p-debounce-time", "p-change-on-enter", "p-remove-initial-filter", "p-size", "p-listbox-control-position"], ["p-field-label", "label", "p-field-value", "value", 3, "ngModelChange", "p-change", "p-additional-help", "p-change-visible-columns", "p-keydown", "p-restore-column-manager", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-columns", "p-disabled", "p-field-label", "p-field-value", "p-filter-params", "p-filter-service", "p-auto-focus", "p-auto-height", "p-help", "p-field-format", "p-infinite-scroll", "p-label", "p-literals", "p-multiple", "p-no-autocomplete", "p-optional", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "p-placeholder", "p-advanced-filters"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-columns", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-show-required", "p-field-error-message", "p-error-limit", "p-size"], [3, "ngModelChange", "p-change", "p-additional-help", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-auto-focus", "p-auto-height", "p-help", "p-label", "p-literals", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-placeholder", "p-field-label", "p-field-value", "p-filter-service", "p-filter-mode", "p-debounce-time", "p-sort", "p-placeholder-search", "p-hide-search", "p-hide-select-all", "p-size", "p-listbox-control-position"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-auto-focus", "p-help", "p-label", "p-maxlength", "p-minlength", "p-optional", "p-readonly", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-rows", "p-size", "p-placeholder"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-hide-password-peek", "p-icon", "p-label", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-pattern", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-placeholder"], [3, "ngModelChange", "p-custom-action-click", "p-error", "p-success", "p-upload", "p-additional-help", "p-change", "p-change-model", "p-keydown", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-upload", "p-directory", "p-disabled", "p-drag-drop", "p-drag-drop-height", "p-restrictions", "p-form-field", "p-headers", "p-help", "p-hide-restrictions-info", "p-hide-select-button", "p-hide-send-button", "p-multiple", "p-label", "p-literals", "name", "p-custom-action", "p-optional", "p-required", "p-show-required", "p-size", "p-url"], [3, "p-fields", "p-content"]], template: function PoDynamicFormFieldsComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, standalone: false, features: [i0.ɵɵProvidersFeature([PoDynamicFormValidationService], [{ provide: ControlContainer, useExisting: NgForm }]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 5, vars: 1, consts: [["poContent", ""], ["poContentContainer", ""], ["component", ""], ["class", "po-row", 3, "po-dynamic", 4, "ngIf"], [1, "po-row"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [4, "ngFor", "ngForOf", "ngForTrackBy"], ["class", "po-sm-12", 3, "p-label", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async", "p-auto-focus", "p-format", "p-help", "p-iso-format", "p-label", "p-locale", "p-max-date", "p-min-date", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-required-field-error-message", "p-size", "p-show-required", "p-placeholder", "ngModelChange", "p-change", "p-additional-help", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-auto-focus", "p-help", "p-label", "p-literals", "p-max-date", "p-min-date", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-label", "p-mask-format-model", "p-mask", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-pattern", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-icon", "p-placeholder", "p-readonly", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-label", "p-min", "p-max", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-step", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-icon", "p-placeholder", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-disabled", "p-decimals-length", "p-thousand-maxlength", "p-icon", "p-auto-focus", "p-help", "p-label", "p-locale", "p-min", "p-max", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-placeholder", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-field-label", "p-field-value", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "p-placeholder", "p-readonly", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-columns", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-error-limit", "p-field-error-message", "p-format-model", "p-help", "p-label", "p-label-off", "p-label-on", "p-label-position", "p-hide-label-status", "p-invalid-value", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], ["p-emit-object-value", "", 3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-focus", "p-clean", "p-disabled", "p-field-label", "p-field-value", "p-filter-params", "p-filter-service", "p-help", "p-infinite-scroll", "p-infinite-scroll-distance", "p-label", "p-literals", "p-options", "p-optional", "p-sort", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-icon", "p-placeholder", "p-filter-minlength", "p-filter-mode", "p-disabled-init-filter", "p-disabled-tab-filter", "p-debounce-time", "p-change-on-enter", "p-remove-initial-filter", "p-size", "p-listbox-control-position", "ngModelChange", "p-change", "p-keydown", "p-additional-help", 4, "ngIf"], ["p-field-label", "label", "p-field-value", "value", 3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-columns", "p-disabled", "p-field-label", "p-field-value", "p-filter-params", "p-filter-service", "p-auto-focus", "p-auto-height", "p-help", "p-field-format", "p-infinite-scroll", "p-label", "p-literals", "p-multiple", "p-no-autocomplete", "p-optional", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "p-placeholder", "p-advanced-filters", "ngModelChange", "p-change", "p-additional-help", "p-change-visible-columns", "p-keydown", "p-restore-column-manager", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-columns", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-show-required", "p-field-error-message", "p-error-limit", "p-size", "ngModelChange", "p-additional-help", "p-change", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-auto-focus", "p-auto-height", "p-help", "p-label", "p-literals", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-placeholder", "p-field-label", "p-field-value", "p-filter-service", "p-filter-mode", "p-debounce-time", "p-sort", "p-placeholder-search", "p-hide-search", "p-hide-select-all", "p-size", "p-listbox-control-position", "ngModelChange", "p-change", "p-additional-help", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-auto-focus", "p-help", "p-label", "p-maxlength", "p-minlength", "p-optional", "p-readonly", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-rows", "p-size", "p-placeholder", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-hide-password-peek", "p-icon", "p-label", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-pattern", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-placeholder", "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [3, "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-upload", "p-directory", "p-disabled", "p-drag-drop", "p-drag-drop-height", "p-restrictions", "p-form-field", "p-headers", "p-help", "p-hide-restrictions-info", "p-hide-select-button", "p-hide-send-button", "p-multiple", "p-label", "p-literals", "name", "p-custom-action", "p-optional", "p-required", "p-show-required", "p-size", "p-url", "ngModelChange", "p-custom-action-click", "p-error", "p-success", "p-upload", "p-additional-help", "p-change", "p-change-model", "p-keydown", 4, "ngIf"], [1, "po-sm-12", 3, "p-label"], [3, "ngModelChange", "p-change", "p-additional-help", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async", "p-auto-focus", "p-format", "p-help", "p-iso-format", "p-label", "p-locale", "p-max-date", "p-min-date", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-required-field-error-message", "p-size", "p-show-required", "p-placeholder"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-auto-focus", "p-help", "p-label", "p-literals", "p-max-date", "p-min-date", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-label", "p-mask-format-model", "p-mask", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-pattern", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-icon", "p-placeholder", "p-readonly"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-label", "p-min", "p-max", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-step", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-icon", "p-placeholder"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-disabled", "p-decimals-length", "p-thousand-maxlength", "p-icon", "p-auto-focus", "p-help", "p-label", "p-locale", "p-min", "p-max", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-placeholder"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-field-label", "p-field-value", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "p-placeholder", "p-readonly"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-columns", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-error-limit", "p-field-error-message", "p-format-model", "p-help", "p-label", "p-label-off", "p-label-on", "p-label-position", "p-hide-label-status", "p-invalid-value", "p-size"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-size"], ["p-emit-object-value", "", 3, "ngModelChange", "p-change", "p-keydown", "p-additional-help", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-focus", "p-clean", "p-disabled", "p-field-label", "p-field-value", "p-filter-params", "p-filter-service", "p-help", "p-infinite-scroll", "p-infinite-scroll-distance", "p-label", "p-literals", "p-options", "p-optional", "p-sort", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-icon", "p-placeholder", "p-filter-minlength", "p-filter-mode", "p-disabled-init-filter", "p-disabled-tab-filter", "p-debounce-time", "p-change-on-enter", "p-remove-initial-filter", "p-size", "p-listbox-control-position"], ["p-field-label", "label", "p-field-value", "value", 3, "ngModelChange", "p-change", "p-additional-help", "p-change-visible-columns", "p-keydown", "p-restore-column-manager", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-columns", "p-disabled", "p-field-label", "p-field-value", "p-filter-params", "p-filter-service", "p-auto-focus", "p-auto-height", "p-help", "p-field-format", "p-infinite-scroll", "p-label", "p-literals", "p-multiple", "p-no-autocomplete", "p-optional", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-size", "p-placeholder", "p-advanced-filters"], [3, "ngModelChange", "p-additional-help", "p-change", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-columns", "p-auto-focus", "p-disabled", "p-help", "p-label", "p-optional", "p-options", "p-required", "p-show-required", "p-field-error-message", "p-error-limit", "p-size"], [3, "ngModelChange", "p-change", "p-additional-help", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-auto-focus", "p-auto-height", "p-help", "p-label", "p-literals", "p-optional", "p-options", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-placeholder", "p-field-label", "p-field-value", "p-filter-service", "p-filter-mode", "p-debounce-time", "p-sort", "p-placeholder-search", "p-hide-search", "p-hide-select-all", "p-size", "p-listbox-control-position"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-disabled", "p-auto-focus", "p-help", "p-label", "p-maxlength", "p-minlength", "p-optional", "p-readonly", "p-required", "p-field-error-message", "p-error-limit", "p-show-required", "p-rows", "p-size", "p-placeholder"], [3, "ngModelChange", "p-additional-help", "p-change", "p-change-model", "p-keydown", "name", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-clean", "p-disabled", "p-error-pattern", "p-error-limit", "p-error-async-properties", "p-auto-focus", "p-help", "p-hide-password-peek", "p-icon", "p-label", "p-maxlength", "p-minlength", "p-no-autocomplete", "p-optional", "p-pattern", "p-readonly", "p-required", "p-required-field-error-message", "p-show-required", "p-size", "p-placeholder"], [3, "ngModelChange", "p-custom-action-click", "p-error", "p-success", "p-upload", "p-additional-help", "p-change", "p-change-model", "p-keydown", "ngModel", "ngClass", "additionalHelpEventTrigger", "p-additional-help-tooltip", "p-auto-upload", "p-directory", "p-disabled", "p-drag-drop", "p-drag-drop-height", "p-restrictions", "p-form-field", "p-headers", "p-help", "p-hide-restrictions-info", "p-hide-select-button", "p-hide-send-button", "p-multiple", "p-label", "p-literals", "name", "p-custom-action", "p-optional", "p-required", "p-show-required", "p-size", "p-url"], [3, "p-fields", "p-content"]], template: function PoDynamicFormFieldsComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, PoDynamicFormFieldsComponent_div_0_Template, 2, 6, "div", 3)(1, PoDynamicFormFieldsComponent_ng_template_1_Template, 1, 2, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, PoDynamicFormFieldsComponent_ng_template_3_Template, 1, 2, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.visibleFields && ctx.visibleFields.length > 0);
@@ -49283,7 +49415,7 @@ class PoDynamicFormFieldsComponent extends PoDynamicFormFieldsBaseComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoDynamicFormFieldsComponent, [{
         type: Component,
-        args: [{ selector: 'po-dynamic-form-fields', viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], providers: [PoDynamicFormValidationService], standalone: false, template: "<div class=\"po-row\" [class.po-dynamic]=\"hasContainers\" *ngIf=\"visibleFields && visibleFields.length > 0\">\n  <ng-container\n    *ngTemplateOutlet=\"\n      hasContainers ? poContentContainer : poContent;\n      context: { $implicit: hasContainers ? containerFields : visibleFields }\n    \"\n  ></ng-container>\n</div>\n\n<ng-template #poContent let-fields>\n  <ng-container *ngFor=\"let field of fields; trackBy: trackBy\">\n    <po-divider *ngIf=\"field?.divider?.trim()\" class=\"po-sm-12\" [p-label]=\"field.divider\"> </po-divider>\n    <po-datepicker\n      #component\n      *ngIf=\"compareTo(field.control, 'datepicker')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async]=\"field.errorAsyncFunction\"\n      [p-auto-focus]=\"field.focus\"\n      [p-format]=\"field.format\"\n      [p-help]=\"field.help\"\n      [p-iso-format]=\"field.isoFormat\"\n      [p-label]=\"field.label\"\n      [p-locale]=\"field.locale\"\n      [p-max-date]=\"field.maxValue\"\n      [p-min-date]=\"field.minValue\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-size]=\"field.size || componentsSize\"\n      [p-show-required]=\"field.showRequired\"\n      (p-change)=\"onChangeField(field)\"\n      [p-placeholder]=\"field.placeholder\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-datepicker>\n\n    <po-datepicker-range\n      #component\n      *ngIf=\"compareTo(field.control, 'datepickerrange')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [p-max-date]=\"field.maxValue\"\n      [p-min-date]=\"field.minValue\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-datepicker-range>\n\n    <po-input\n      #component\n      *ngIf=\"compareTo(field.control, 'input')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async-properties]=\"field.errorAsyncProperties\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-mask-format-model]=\"field.maskFormatModel\"\n      [p-mask]=\"field.mask\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-pattern]=\"field.pattern\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-icon]=\"field.icon\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-readonly]=\"field.readonly\"\n    >\n    </po-input>\n\n    <po-number\n      #component\n      *ngIf=\"compareTo(field.control, 'number')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async-properties]=\"field.errorAsyncProperties\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-min]=\"field.minValue\"\n      [p-max]=\"field.maxValue\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-step]=\"field.step\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-icon]=\"field.icon\"\n      [p-placeholder]=\"field.placeholder\"\n    >\n    </po-number>\n\n    <po-decimal\n      #component\n      *ngIf=\"compareTo(field.control, 'decimal')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async-properties]=\"field.errorAsyncProperties\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-decimals-length]=\"field.decimalsLength\"\n      [p-thousand-maxlength]=\"field.thousandMaxlength\"\n      [p-icon]=\"field.icon\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-locale]=\"field.locale\"\n      [p-min]=\"field.minValue\"\n      [p-max]=\"field.maxValue\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-placeholder]=\"field.placeholder\"\n    >\n    </po-decimal>\n\n    <po-select\n      #component\n      *ngIf=\"compareTo(field.control, 'select')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-field-label]=\"field.fieldLabel\"\n      [p-field-value]=\"field.fieldValue\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-optional]=\"field.optional\"\n      [p-options]=\"field.options\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-readonly]=\"field.readonly\"\n    >\n    </po-select>\n\n    <po-radio-group\n      #component\n      *ngIf=\"compareTo(field.control, 'radioGroup')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-columns]=\"field.columns || 3\"\n      [p-auto-focus]=\"field.focus\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-optional]=\"field.optional\"\n      [p-options]=\"field.options\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-radio-group>\n\n    <po-switch\n      #component\n      *ngIf=\"compareTo(field.control, 'switch')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-format-model]=\"field.formatModel\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-label-off]=\"field.booleanFalse\"\n      [p-label-on]=\"field.booleanTrue\"\n      [p-label-position]=\"field.labelPosition\"\n      [p-hide-label-status]=\"field.hideLabelStatus\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-switch>\n\n    <po-checkbox\n      #component\n      *ngIf=\"compareTo(field.control, 'checkbox')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-auto-focus]=\"field.focus\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-label]=\"field.label\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-checkbox>\n\n    <po-combo\n      #component\n      *ngIf=\"compareTo(field.control, 'combo')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      p-emit-object-value\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-auto-focus]=\"field.focus\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-field-label]=\"field.fieldLabel\"\n      [p-field-value]=\"field.fieldValue\"\n      [p-filter-params]=\"field.params\"\n      [p-filter-service]=\"field.optionsService\"\n      [p-help]=\"field.help\"\n      [p-infinite-scroll]=\"field.infiniteScroll\"\n      [p-infinite-scroll-distance]=\"field.infiniteScrollDistance || 100\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [p-options]=\"field.options\"\n      [p-optional]=\"field.optional\"\n      [p-sort]=\"field.sort\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      (p-change)=\"onChangeField(field, $event)\"\n      [p-icon]=\"field.icon\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-filter-minlength]=\"field.filterMinlength\"\n      [p-filter-mode]=\"field.filterMode\"\n      [p-disabled-init-filter]=\"field.disabledInitFilter\"\n      [p-disabled-tab-filter]=\"field.disabledTabFilter\"\n      [p-debounce-time]=\"field.debounceTime\"\n      [p-change-on-enter]=\"field.changeOnEnter\"\n      [p-remove-initial-filter]=\"field.removeInitialFilter\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      [p-listbox-control-position]=\"field.listboxControlPosition\"\n    >\n    </po-combo>\n\n    <po-lookup\n      #component\n      *ngIf=\"compareTo(field.control, 'lookup')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      p-field-label=\"label\"\n      p-field-value=\"value\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-columns]=\"field.columns\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-field-label]=\"field.fieldLabel || 'label'\"\n      [p-field-value]=\"field.fieldValue || 'value'\"\n      [p-filter-params]=\"field.params\"\n      [p-filter-service]=\"field.searchService\"\n      [p-auto-focus]=\"field.focus\"\n      [p-auto-height]=\"field.autoHeight\"\n      [p-help]=\"field.help\"\n      [p-field-format]=\"field.format\"\n      [p-infinite-scroll]=\"field.infiniteScroll\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [p-multiple]=\"field.multiple\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-change)=\"onChangeField(field)\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-advanced-filters]=\"field.advancedFilters\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change-visible-columns)=\"field.changeVisibleColumns?.($event)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      (p-restore-column-manager)=\"field.columnRestoreManager?.($event)\"\n    >\n    </po-lookup>\n\n    <po-checkbox-group\n      #component\n      *ngIf=\"compareTo(field.control, 'checkboxGroup')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-columns]=\"field.columns || 3\"\n      [p-auto-focus]=\"field.focus\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-optional]=\"field.optional\"\n      [p-options]=\"field.options\"\n      [p-required]=\"field.required\"\n      [p-show-required]=\"field.showRequired\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-checkbox-group>\n\n    <po-multiselect\n      #component\n      *ngIf=\"compareTo(field.control, 'multiselect')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-auto-focus]=\"field.focus\"\n      [p-auto-height]=\"field.autoHeight\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [p-optional]=\"field.optional\"\n      [p-options]=\"field.options\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      (p-change)=\"onChangeField(field)\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-field-label]=\"field.fieldLabel\"\n      [p-field-value]=\"field.fieldValue\"\n      [p-filter-service]=\"field.optionsService\"\n      [p-filter-mode]=\"field.filterMode\"\n      [p-debounce-time]=\"field.debounceTime\"\n      [p-sort]=\"field.sort\"\n      [p-placeholder-search]=\"field.placeholderSearch\"\n      [p-hide-search]=\"field.hideSearch\"\n      [p-hide-select-all]=\"field.hideSelectAll\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-listbox-control-position]=\"field.listboxControlPosition\"\n    >\n    </po-multiselect>\n\n    <po-textarea\n      #component\n      *ngIf=\"compareTo(field.control, 'textarea')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-optional]=\"field.optional\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-rows]=\"field.rows\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-placeholder]=\"field.placeholder\"\n    >\n    </po-textarea>\n\n    <po-password\n      #component\n      *ngIf=\"compareTo(field.control, 'password')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async-properties]=\"field.errorAsyncProperties\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-hide-password-peek]=\"field.hidePasswordPeek\"\n      [p-icon]=\"field.icon\"\n      [p-label]=\"field.label\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-pattern]=\"field.pattern\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-placeholder]=\"field.placeholder\"\n    >\n    </po-password>\n\n    <po-upload\n      #component\n      *ngIf=\"compareTo(field.control, 'upload')\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-auto-upload]=\"field.autoUpload\"\n      [p-directory]=\"field.directory\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-drag-drop]=\"field.dragDrop\"\n      [p-drag-drop-height]=\"field.dragDropHeight\"\n      [p-restrictions]=\"field.restrictions\"\n      [p-form-field]=\"field.formField\"\n      [p-headers]=\"field.headers\"\n      [p-help]=\"field.help\"\n      [p-hide-restrictions-info]=\"field.hideRestrictionsInfo\"\n      [p-hide-select-button]=\"field.hideSelectButton\"\n      [p-hide-send-button]=\"field.hideSendButton\"\n      [p-multiple]=\"field.multiple\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [name]=\"field.property\"\n      [p-custom-action]=\"field.customAction\"\n      (p-custom-action-click)=\"field.customActionClick($event)\"\n      (p-error)=\"field.onError($event)\"\n      (p-success)=\"field.onSuccess($event)\"\n      (p-upload)=\"field.onUpload($event)\"\n      [p-optional]=\"field.optional\"\n      [p-required]=\"field.required\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-url]=\"field.url\"\n    >\n    </po-upload>\n  </ng-container>\n</ng-template>\n\n<ng-template #poContentContainer let-fields>\n  <po-dynamic-container [p-fields]=\"fields\" [p-content]=\"poContent\"></po-dynamic-container>\n</ng-template>\n" }]
+        args: [{ selector: 'po-dynamic-form-fields', viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], providers: [PoDynamicFormValidationService], standalone: false, template: "<div class=\"po-row\" [class.po-dynamic]=\"hasContainers\" *ngIf=\"visibleFields && visibleFields.length > 0\">\n  <ng-container\n    *ngTemplateOutlet=\"\n      hasContainers ? poContentContainer : poContent;\n      context: { $implicit: hasContainers ? containerFields : visibleFields }\n    \"\n  ></ng-container>\n</div>\n\n<ng-template #poContent let-fields>\n  <ng-container *ngFor=\"let field of fields; trackBy: trackBy\">\n    <po-divider *ngIf=\"field?.divider?.trim()\" class=\"po-sm-12\" [p-label]=\"field.divider\"> </po-divider>\n    <po-datepicker\n      #component\n      *ngIf=\"compareTo(field.control, 'datepicker')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async]=\"field.errorAsyncFunction\"\n      [p-auto-focus]=\"field.focus\"\n      [p-format]=\"field.format\"\n      [p-help]=\"field.help\"\n      [p-iso-format]=\"field.isoFormat\"\n      [p-label]=\"field.label\"\n      [p-locale]=\"field.locale\"\n      [p-max-date]=\"field.maxValue\"\n      [p-min-date]=\"field.minValue\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-size]=\"field.size || componentsSize\"\n      [p-show-required]=\"field.showRequired\"\n      (p-change)=\"onChangeField(field)\"\n      [p-placeholder]=\"field.placeholder\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-datepicker>\n\n    <po-datepicker-range\n      #component\n      *ngIf=\"compareTo(field.control, 'datepickerrange')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [p-max-date]=\"field.maxValue\"\n      [p-min-date]=\"field.minValue\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-datepicker-range>\n\n    <po-input\n      #component\n      *ngIf=\"compareTo(field.control, 'input')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async-properties]=\"field.errorAsyncProperties\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-mask-format-model]=\"field.maskFormatModel\"\n      [p-mask]=\"field.mask\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-pattern]=\"field.pattern\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-icon]=\"field.icon\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-readonly]=\"field.readonly\"\n    >\n    </po-input>\n\n    <po-number\n      #component\n      *ngIf=\"compareTo(field.control, 'number')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async-properties]=\"field.errorAsyncProperties\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-min]=\"field.minValue\"\n      [p-max]=\"field.maxValue\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-step]=\"field.step\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-icon]=\"field.icon\"\n      [p-placeholder]=\"field.placeholder\"\n    >\n    </po-number>\n\n    <po-decimal\n      #component\n      *ngIf=\"compareTo(field.control, 'decimal')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async-properties]=\"field.errorAsyncProperties\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-decimals-length]=\"field.decimalsLength\"\n      [p-thousand-maxlength]=\"field.thousandMaxlength\"\n      [p-icon]=\"field.icon\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-locale]=\"field.locale\"\n      [p-min]=\"field.minValue\"\n      [p-max]=\"field.maxValue\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-placeholder]=\"field.placeholder\"\n    >\n    </po-decimal>\n\n    <po-select\n      #component\n      *ngIf=\"compareTo(field.control, 'select')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-field-label]=\"field.fieldLabel\"\n      [p-field-value]=\"field.fieldValue\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-optional]=\"field.optional\"\n      [p-options]=\"field.options\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-readonly]=\"field.readonly\"\n    >\n    </po-select>\n\n    <po-radio-group\n      #component\n      *ngIf=\"compareTo(field.control, 'radioGroup')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-columns]=\"field.columns || 3\"\n      [p-auto-focus]=\"field.focus\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-optional]=\"field.optional\"\n      [p-options]=\"field.options\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-radio-group>\n\n    <po-switch\n      #component\n      *ngIf=\"compareTo(field.control, 'switch')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-format-model]=\"field.formatModel\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-label-off]=\"field.booleanFalse\"\n      [p-label-on]=\"field.booleanTrue\"\n      [p-label-position]=\"field.labelPosition\"\n      [p-hide-label-status]=\"field.hideLabelStatus\"\n      [p-invalid-value]=\"field.invalidValue\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-switch>\n\n    <po-checkbox\n      #component\n      *ngIf=\"compareTo(field.control, 'checkbox')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-auto-focus]=\"field.focus\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-checkbox>\n\n    <po-combo\n      #component\n      *ngIf=\"compareTo(field.control, 'combo')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      p-emit-object-value\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-auto-focus]=\"field.focus\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-field-label]=\"field.fieldLabel\"\n      [p-field-value]=\"field.fieldValue\"\n      [p-filter-params]=\"field.params\"\n      [p-filter-service]=\"field.optionsService\"\n      [p-help]=\"field.help\"\n      [p-infinite-scroll]=\"field.infiniteScroll\"\n      [p-infinite-scroll-distance]=\"field.infiniteScrollDistance || 100\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [p-options]=\"field.options\"\n      [p-optional]=\"field.optional\"\n      [p-sort]=\"field.sort\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      (p-change)=\"onChangeField(field, $event)\"\n      [p-icon]=\"field.icon\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-filter-minlength]=\"field.filterMinlength\"\n      [p-filter-mode]=\"field.filterMode\"\n      [p-disabled-init-filter]=\"field.disabledInitFilter\"\n      [p-disabled-tab-filter]=\"field.disabledTabFilter\"\n      [p-debounce-time]=\"field.debounceTime\"\n      [p-change-on-enter]=\"field.changeOnEnter\"\n      [p-remove-initial-filter]=\"field.removeInitialFilter\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      [p-listbox-control-position]=\"field.listboxControlPosition\"\n    >\n    </po-combo>\n\n    <po-lookup\n      #component\n      *ngIf=\"compareTo(field.control, 'lookup')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      p-field-label=\"label\"\n      p-field-value=\"value\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-columns]=\"field.columns\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-field-label]=\"field.fieldLabel || 'label'\"\n      [p-field-value]=\"field.fieldValue || 'value'\"\n      [p-filter-params]=\"field.params\"\n      [p-filter-service]=\"field.searchService\"\n      [p-auto-focus]=\"field.focus\"\n      [p-auto-height]=\"field.autoHeight\"\n      [p-help]=\"field.help\"\n      [p-field-format]=\"field.format\"\n      [p-infinite-scroll]=\"field.infiniteScroll\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [p-multiple]=\"field.multiple\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-change)=\"onChangeField(field)\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-advanced-filters]=\"field.advancedFilters\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change-visible-columns)=\"field.changeVisibleColumns?.($event)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      (p-restore-column-manager)=\"field.columnRestoreManager?.($event)\"\n    >\n    </po-lookup>\n\n    <po-checkbox-group\n      #component\n      *ngIf=\"compareTo(field.control, 'checkboxGroup')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-columns]=\"field.columns || 3\"\n      [p-auto-focus]=\"field.focus\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-optional]=\"field.optional\"\n      [p-options]=\"field.options\"\n      [p-required]=\"field.required\"\n      [p-show-required]=\"field.showRequired\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n    >\n    </po-checkbox-group>\n\n    <po-multiselect\n      #component\n      *ngIf=\"compareTo(field.control, 'multiselect')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-auto-focus]=\"field.focus\"\n      [p-auto-height]=\"field.autoHeight\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [p-optional]=\"field.optional\"\n      [p-options]=\"field.options\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      (p-change)=\"onChangeField(field)\"\n      [p-placeholder]=\"field.placeholder\"\n      [p-field-label]=\"field.fieldLabel\"\n      [p-field-value]=\"field.fieldValue\"\n      [p-filter-service]=\"field.optionsService\"\n      [p-filter-mode]=\"field.filterMode\"\n      [p-debounce-time]=\"field.debounceTime\"\n      [p-sort]=\"field.sort\"\n      [p-placeholder-search]=\"field.placeholderSearch\"\n      [p-hide-search]=\"field.hideSearch\"\n      [p-hide-select-all]=\"field.hideSelectAll\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-listbox-control-position]=\"field.listboxControlPosition\"\n    >\n    </po-multiselect>\n\n    <po-textarea\n      #component\n      *ngIf=\"compareTo(field.control, 'textarea')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-label]=\"field.label\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-optional]=\"field.optional\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-field-error-message]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-show-required]=\"field.showRequired\"\n      [p-rows]=\"field.rows\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-placeholder]=\"field.placeholder\"\n    >\n    </po-textarea>\n\n    <po-password\n      #component\n      *ngIf=\"compareTo(field.control, 'password')\"\n      [name]=\"field.property\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-clean]=\"field.clean\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-error-pattern]=\"field.errorMessage\"\n      [p-error-limit]=\"field.errorLimit\"\n      [p-error-async-properties]=\"field.errorAsyncProperties\"\n      [p-auto-focus]=\"field.focus\"\n      [p-help]=\"field.help\"\n      [p-hide-password-peek]=\"field.hidePasswordPeek\"\n      [p-icon]=\"field.icon\"\n      [p-label]=\"field.label\"\n      [p-maxlength]=\"field.maxLength\"\n      [p-minlength]=\"field.minLength\"\n      [p-no-autocomplete]=\"field.noAutocomplete\"\n      [p-optional]=\"field.optional\"\n      [p-pattern]=\"field.pattern\"\n      [p-readonly]=\"field.readonly\"\n      [p-required]=\"field.required\"\n      [p-required-field-error-message]=\"field.requiredFieldErrorMessage\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-placeholder]=\"field.placeholder\"\n    >\n    </po-password>\n\n    <po-upload\n      #component\n      *ngIf=\"compareTo(field.control, 'upload')\"\n      [(ngModel)]=\"value[field.property]\"\n      [ngClass]=\"field.componentClass\"\n      [additionalHelpEventTrigger]=\"field.additionalHelp ? 'event' : 'noEvent'\"\n      [p-additional-help-tooltip]=\"field.additionalHelpTooltip\"\n      [p-auto-upload]=\"field.autoUpload\"\n      [p-directory]=\"field.directory\"\n      [p-disabled]=\"isDisabled(field)\"\n      [p-drag-drop]=\"field.dragDrop\"\n      [p-drag-drop-height]=\"field.dragDropHeight\"\n      [p-restrictions]=\"field.restrictions\"\n      [p-form-field]=\"field.formField\"\n      [p-headers]=\"field.headers\"\n      [p-help]=\"field.help\"\n      [p-hide-restrictions-info]=\"field.hideRestrictionsInfo\"\n      [p-hide-select-button]=\"field.hideSelectButton\"\n      [p-hide-send-button]=\"field.hideSendButton\"\n      [p-multiple]=\"field.multiple\"\n      [p-label]=\"field.label\"\n      [p-literals]=\"field.literals\"\n      [name]=\"field.property\"\n      [p-custom-action]=\"field.customAction\"\n      (p-custom-action-click)=\"field.customActionClick($event)\"\n      (p-error)=\"field.onError($event)\"\n      (p-success)=\"field.onSuccess($event)\"\n      (p-upload)=\"field.onUpload($event)\"\n      [p-optional]=\"field.optional\"\n      [p-required]=\"field.required\"\n      [p-show-required]=\"field.showRequired\"\n      [p-size]=\"field.size || componentsSize\"\n      (p-additional-help)=\"field.additionalHelp?.($event)\"\n      (p-change)=\"onChangeField(field)\"\n      (p-change-model)=\"onChangeFieldModel(field)\"\n      (p-keydown)=\"field.keydown?.($event)\"\n      [p-url]=\"field.url\"\n    >\n    </po-upload>\n  </ng-container>\n</ng-template>\n\n<ng-template #poContentContainer let-fields>\n  <po-dynamic-container [p-fields]=\"fields\" [p-content]=\"poContent\"></po-dynamic-container>\n</ng-template>\n" }]
     }], () => [{ type: i1.TitleCasePipe }, { type: PoThemeService }, { type: PoDynamicFormValidationService }, { type: i0.ChangeDetectorRef }, { type: i2.NgForm }], { components: [{
             type: ViewChildren,
             args: ['component']