@po-ui/ng-components 19.28.1 → 19.30.0

package/lib/components/po-field/po-select/po-select.component.d.ts

@@ -1,8 +1,9 @@
-import { ElementRef, EventEmitter, OnChanges, Renderer2, SimpleChanges } from '@angular/core';
+import { ElementRef, EventEmitter, OnChanges, Renderer2, SimpleChanges, AfterViewInit } from '@angular/core';
 import { AbstractControl } from '@angular/forms';
 import { PoFieldValidateModel } from '../po-field-validate.model';
 import { PoSelectOptionGroup } from './po-select-option-group.interface';
 import { PoSelectOption } from './po-select-option.interface';
+import { PoHelperOptions } from '../../po-helper';
 import * as i0 from "@angular/core";
 /**
  * @docsExtends PoFieldValidateModel
@@ -72,7 +73,7 @@ import * as i0 from "@angular/core";
  * | `--background-color-disabled`     | Cor de background no estado disabled                  | `var(--color-neutral-light-20)`                 |
  *
  */
-export declare class PoSelectComponent extends PoFieldValidateModel<any> implements OnChanges {
+export declare class PoSelectComponent extends PoFieldValidateModel<any> implements AfterViewInit, OnChanges {
     private el;
     renderer: Renderer2;
     private _iconToken;
@@ -206,8 +207,36 @@ export declare class PoSelectComponent extends PoFieldValidateModel<any> impleme
      */
     set size(value: string);
     get size(): string;
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Define as opções do componente de ajuda (po-helper) que será exibido ao lado do label.
+     *
+     * > Caso o `p-label` não esteja definido, o componente po-helper não será exibido.
+     * Ao configurar esta propriedade, o antigo ícone de ajuda adicional (`p-additional-help-tooltip` e `p-additional-help`) será ignorado.
+     */
+    poHelperComponent: import("@angular/core").InputSignal<string | PoHelperOptions>;
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Habilita a quebra automática do texto da propriedade `p-label`. Quando `p-label-text-wrap` for verdadeiro, o texto que excede
+     * o espaço disponível é transferido para a próxima linha em pontos apropriados para uma
+     * leitura clara.
+     *
+     * @default `false`
+     */
+    labelTextWrap: import("@angular/core").InputSignal<boolean>;
     constructor();
     ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
     /**
      * Função que atribui foco ao componente.
      *
@@ -243,6 +272,8 @@ export declare class PoSelectComponent extends PoFieldValidateModel<any> impleme
      * Método que exibe `p-additionalHelpTooltip` ou executa a ação definida em `p-additionalHelp`.
      * Para isso, será necessário configurar uma tecla de atalho utilizando o evento `p-keydown`.
      *
+     * > Exibe ou oculta o conteúdo do componente `po-helper` quando o componente estiver com foco e com label visível.
+     *
      * ```html
      * <po-select
      *  #select
@@ -251,6 +282,16 @@ export declare class PoSelectComponent extends PoFieldValidateModel<any> impleme
      *  (p-keydown)="onKeyDown($event, select)"
      * ></po-select>
      * ```
+     * ```
+     * //Exemplo com p-label e p-helper
+     * <po-select
+     *  #select
+     *  ...
+     *  p-label="Label do select"
+     *  [p-helper]="helperOptions"
+     *  (p-keydown)="onKeyDown($event, select)"
+     * ></po-select>
+     * ```
      * ```typescript
      * onKeyDown(event: KeyboardEvent, inp: PoSelectComponent): void {
      *  if (event.code === 'F9') {
@@ -260,6 +301,10 @@ export declare class PoSelectComponent extends PoFieldValidateModel<any> impleme
      * ```
      */
     showAdditionalHelp(): boolean;
+    setHelper(label?: string, additionalHelpTooltip?: string): {
+        hideAdditionalHelp: boolean;
+        helperSettings?: any;
+    };
     private isEqual;
     private findOptionValue;
     private getValueUpdate;
@@ -268,7 +313,7 @@ export declare class PoSelectComponent extends PoFieldValidateModel<any> impleme
     private separateOptions;
     private validateOptions;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoSelectComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PoSelectComponent, "po-select", never, { "readonly": { "alias": "p-readonly"; "required": false; }; "placeholder": { "alias": "p-placeholder"; "required": false; }; "options": { "alias": "p-options"; "required": false; }; "fieldLabel": { "alias": "p-field-label"; "required": false; }; "fieldValue": { "alias": "p-field-value"; "required": false; }; "controlValueWithLabel": { "alias": "p-control-value-with-label"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; }, { "blur": "p-blur"; "ngModelChange": "ngModelChange"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PoSelectComponent, "po-select", never, { "readonly": { "alias": "p-readonly"; "required": false; }; "placeholder": { "alias": "p-placeholder"; "required": false; }; "options": { "alias": "p-options"; "required": false; }; "fieldLabel": { "alias": "p-field-label"; "required": false; }; "fieldValue": { "alias": "p-field-value"; "required": false; }; "controlValueWithLabel": { "alias": "p-control-value-with-label"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "poHelperComponent": { "alias": "p-helper"; "required": false; "isSignal": true; }; "labelTextWrap": { "alias": "p-label-text-wrap"; "required": false; "isSignal": true; }; }, { "blur": "p-blur"; "ngModelChange": "ngModelChange"; }, never, never, false, never>;
     static ngAcceptInputType_readonly: any;
     static ngAcceptInputType_controlValueWithLabel: any;
 }

package/lib/components/po-field/po-switch/po-switch.component.d.ts

@@ -2,6 +2,7 @@ import { AfterViewInit, ElementRef, OnDestroy } from '@angular/core';
 import { AbstractControl, ValidationErrors, Validator } from '@angular/forms';
 import { PoFieldModel } from '../po-field.model';
 import { PoSwitchLabelPosition } from './po-switch-label-position.enum';
+import { PoHelperOptions } from '../../po-helper';
 import * as i0 from "@angular/core";
 /**
  * @docsExtends PoFieldModel
@@ -189,6 +190,32 @@ export declare class PoSwitchComponent extends PoFieldModel<any> implements Vali
      */
     set size(value: string);
     get size(): string;
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Define as opções do componente de ajuda (po-helper) que será exibido ao lado do label.
+     *
+     * > Caso o `p-label` não esteja definido, o componente po-helper não será exibido.
+     * Ao configurar esta propriedade, o antigo ícone de ajuda adicional (`p-additional-help-tooltip` e `p-additional-help`) será ignorado.
+     */
+    poHelperComponent: import("@angular/core").InputSignal<string | PoHelperOptions>;
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     * Habilita a quebra automática do texto da propriedade `p-label`. Quando `p-label-text-wrap` for verdadeiro, o texto que excede
+     * o espaço disponível é transferido para a próxima linha em pontos apropriados para uma
+     * leitura clara.
+     *
+     * @default `false`
+     */
+    labelTextWrap: import("@angular/core").InputSignal<boolean>;
     private readonly el;
     private readonly injectOptions;
     private control;
@@ -222,8 +249,12 @@ export declare class PoSwitchComponent extends PoFieldModel<any> implements Vali
     private setControl;
     getErrorPattern(): string;
     hasInvalidClass(): boolean;
+    setHelper(label?: string, additionalHelpTooltip?: string): {
+        hideAdditionalHelp: boolean;
+        helperSettings?: any;
+    };
     static ɵfac: i0.ɵɵFactoryDeclaration<PoSwitchComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PoSwitchComponent, "po-switch", never, { "value": { "alias": "p-value"; "required": false; }; "formatModel": { "alias": "p-format-model"; "required": false; }; "hideLabelStatus": { "alias": "p-hide-label-status"; "required": false; }; "labelPosition": { "alias": "p-label-position"; "required": false; }; "labelOff": { "alias": "p-label-off"; "required": false; }; "labelOn": { "alias": "p-label-on"; "required": false; }; "fieldErrorMessage": { "alias": "p-field-error-message"; "required": false; }; "errorLimit": { "alias": "p-error-limit"; "required": false; }; "invalidValue": { "alias": "p-invalid-value"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PoSwitchComponent, "po-switch", never, { "value": { "alias": "p-value"; "required": false; }; "formatModel": { "alias": "p-format-model"; "required": false; }; "hideLabelStatus": { "alias": "p-hide-label-status"; "required": false; }; "labelPosition": { "alias": "p-label-position"; "required": false; }; "labelOff": { "alias": "p-label-off"; "required": false; }; "labelOn": { "alias": "p-label-on"; "required": false; }; "fieldErrorMessage": { "alias": "p-field-error-message"; "required": false; }; "errorLimit": { "alias": "p-error-limit"; "required": false; }; "invalidValue": { "alias": "p-invalid-value"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "poHelperComponent": { "alias": "p-helper"; "required": false; "isSignal": true; }; "labelTextWrap": { "alias": "p-label-text-wrap"; "required": false; "isSignal": true; }; }, {}, never, never, false, never>;
     static ngAcceptInputType_value: any;
     static ngAcceptInputType_formatModel: any;
     static ngAcceptInputType_hideLabelStatus: any;

package/lib/components/po-field/po-switch/po-switch.module.d.ts

@@ -5,8 +5,9 @@ import * as i3 from "@angular/forms";
 import * as i4 from "../po-field-container/po-field-container.module";
 import * as i5 from "../../po-label/po-label.module";
 import * as i6 from "../../po-icon/po-icon.module";
+import * as i7 from "../../po-helper/po-helper.module";
 export declare class PoSwitchModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<PoSwitchModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<PoSwitchModule, [typeof i1.PoSwitchComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i4.PoFieldContainerModule, typeof i5.PoLabelModule, typeof i6.PoIconModule], [typeof i1.PoSwitchComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PoSwitchModule, [typeof i1.PoSwitchComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i4.PoFieldContainerModule, typeof i5.PoLabelModule, typeof i6.PoIconModule, typeof i7.PoHelperModule], [typeof i1.PoSwitchComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<PoSwitchModule>;
 }

package/lib/components/po-field/po-textarea/po-textarea-base.component.d.ts

@@ -1,5 +1,6 @@
 import { ChangeDetectorRef, EventEmitter } from '@angular/core';
 import { AbstractControl, ControlValueAccessor, Validator } from '@angular/forms';
+import { PoHelperOptions } from '../../po-helper';
 import * as i0 from "@angular/core";
 /**
  * @description
@@ -49,6 +50,9 @@ export declare abstract class PoTextareaBaseComponent implements ControlValueAcc
     cd: ChangeDetectorRef;
     additionalHelpEventTrigger: string | undefined;
     /**
+     *
+     * @deprecated v23.x.x use `p-helper`
+     *
      * @optional
      *
      * @description
@@ -56,6 +60,8 @@ export declare abstract class PoTextareaBaseComponent implements ControlValueAcc
      * Se o evento `p-additional-help` estiver definido, o tooltip não será exibido.
      * **Como boa prática, indica-se utilizar um texto com até 140 caracteres.**
      * > Requer um recuo mínimo de 8px se o componente estiver próximo à lateral da tela.
+     *
+     * > Essa propriedade está **depreciada** e será removida na versão `23.x.x`. Recomendamos utilizar a propriedade `p-helper` que oferece mais recursos e flexibilidade.
      */
     additionalHelpTooltip?: string;
     /**
@@ -129,11 +135,43 @@ export declare abstract class PoTextareaBaseComponent implements ControlValueAcc
      */
     errorLimit: boolean;
     /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Define as opções do componente de ajuda (po-helper) que será exibido ao lado do label.
+     *
+     * > Caso o `p-label` não esteja definido, o componente po-helper não será exibido.
+     * Ao configurar esta propriedade, o antigo ícone de ajuda adicional (`p-additional-help-tooltip` e `p-additional-help`) será ignorado.
+     */
+    poHelperComponent: import("@angular/core").InputSignal<string | PoHelperOptions>;
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Habilita a quebra automática do texto da propriedade `p-label`. Quando `p-label-text-wrap` for verdadeiro, o texto que excede
+     * o espaço disponível é transferido para a próxima linha em pontos apropriados para uma
+     * leitura clara.
+     *
+     * @default `false`
+     */
+    labelTextWrap: import("@angular/core").InputSignal<boolean>;
+    /**
+     *
+     * @deprecated v23.x.x use `p-helper`
+     *
      * @optional
      *
      * @description
      * Evento disparado ao clicar no ícone de ajuda adicional.
      * Este evento ativa automaticamente a exibição do ícone de ajuda adicional ao `p-help`.
+     *
+     * > Essa propriedade está **depreciada** e será removida na versão `23.x.x`. Recomendamos utilizar a propriedade `p-helper` que oferece mais recursos e flexibilidade.
      */
     additionalHelp: EventEmitter<any>;
     /**
@@ -293,7 +331,7 @@ export declare abstract class PoTextareaBaseComponent implements ControlValueAcc
     protected validateModel(): void;
     abstract writeValueModel(value: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoTextareaBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoTextareaBaseComponent, never, never, { "additionalHelpEventTrigger": { "alias": "additionalHelpEventTrigger"; "required": false; }; "additionalHelpTooltip": { "alias": "p-additional-help-tooltip"; "required": false; }; "appendBox": { "alias": "p-append-in-body"; "required": false; }; "autoFocus": { "alias": "p-auto-focus"; "required": false; }; "label": { "alias": "p-label"; "required": false; }; "help": { "alias": "p-help"; "required": false; }; "name": { "alias": "name"; "required": false; }; "optional": { "alias": "p-optional"; "required": false; }; "fieldErrorMessage": { "alias": "p-field-error-message"; "required": false; }; "errorLimit": { "alias": "p-error-limit"; "required": false; }; "placeholder": { "alias": "p-placeholder"; "required": false; }; "disabled": { "alias": "p-disabled"; "required": false; }; "readonly": { "alias": "p-readonly"; "required": false; }; "required": { "alias": "p-required"; "required": false; }; "showRequired": { "alias": "p-show-required"; "required": false; }; "minlength": { "alias": "p-minlength"; "required": false; }; "maxlength": { "alias": "p-maxlength"; "required": false; }; "rows": { "alias": "p-rows"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; }, { "additionalHelp": "p-additional-help"; "blur": "p-blur"; "enter": "p-enter"; "change": "p-change"; "changeModel": "p-change-model"; "keydown": "p-keydown"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoTextareaBaseComponent, never, never, { "additionalHelpEventTrigger": { "alias": "additionalHelpEventTrigger"; "required": false; }; "additionalHelpTooltip": { "alias": "p-additional-help-tooltip"; "required": false; }; "appendBox": { "alias": "p-append-in-body"; "required": false; }; "autoFocus": { "alias": "p-auto-focus"; "required": false; }; "label": { "alias": "p-label"; "required": false; }; "help": { "alias": "p-help"; "required": false; }; "name": { "alias": "name"; "required": false; }; "optional": { "alias": "p-optional"; "required": false; }; "fieldErrorMessage": { "alias": "p-field-error-message"; "required": false; }; "errorLimit": { "alias": "p-error-limit"; "required": false; }; "poHelperComponent": { "alias": "p-helper"; "required": false; "isSignal": true; }; "labelTextWrap": { "alias": "p-label-text-wrap"; "required": false; "isSignal": true; }; "placeholder": { "alias": "p-placeholder"; "required": false; }; "disabled": { "alias": "p-disabled"; "required": false; }; "readonly": { "alias": "p-readonly"; "required": false; }; "required": { "alias": "p-required"; "required": false; }; "showRequired": { "alias": "p-show-required"; "required": false; }; "minlength": { "alias": "p-minlength"; "required": false; }; "maxlength": { "alias": "p-maxlength"; "required": false; }; "rows": { "alias": "p-rows"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; }, { "additionalHelp": "p-additional-help"; "blur": "p-blur"; "enter": "p-enter"; "change": "p-change"; "changeModel": "p-change-model"; "keydown": "p-keydown"; }, never, never, true, never>;
     static ngAcceptInputType_appendBox: any;
     static ngAcceptInputType_autoFocus: any;
 }

package/lib/components/po-field/po-textarea/po-textarea.component.d.ts

@@ -68,6 +68,8 @@ export declare class PoTextareaComponent extends PoTextareaBaseComponent impleme
      * Método que exibe `p-additionalHelpTooltip` ou executa a ação definida em `p-additionalHelp`.
      * Para isso, será necessário configurar uma tecla de atalho utilizando o evento `p-keydown`.
      *
+     * > Exibe ou oculta o conteúdo do componente `po-helper` quando o componente estiver com foco e com label visível.
+     *
      * ```
      * <po-textarea
      *  #textarea
@@ -77,6 +79,16 @@ export declare class PoTextareaComponent extends PoTextareaBaseComponent impleme
      * ></po-textarea>
      * ```
      * ```
+     * //Exemplo com p-label e p-helper
+     * <po-textarea
+     *  #textarea
+     *  ...
+     *  p-label="Label do textarea"
+     *  [p-helper]="helperOptions"
+     *  (p-keydown)="onKeyDown($event, textarea)"
+     * ></po-textarea>
+     * ```
+     * ```
      * ...
      * onKeyDown(event: KeyboardEvent, inp: PoTextareaComponent): void {
      *  if (event.code === 'F9') {
@@ -88,6 +100,10 @@ export declare class PoTextareaComponent extends PoTextareaBaseComponent impleme
     showAdditionalHelp(): boolean;
     showAdditionalHelpIcon(): boolean;
     private isAdditionalHelpEventTriggered;
+    setHelper(label?: string, additionalHelpTooltip?: string): {
+        hideAdditionalHelp: boolean;
+        helperSettings?: any;
+    };
     static ɵfac: i0.ɵɵFactoryDeclaration<PoTextareaComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<PoTextareaComponent, "po-textarea", never, {}, {}, never, never, false, never>;
 }

package/lib/components/po-field/po-upload/po-upload-base.component.d.ts

@@ -1,4 +1,4 @@
-import { EventEmitter } from '@angular/core';
+import { ChangeDetectorRef, EventEmitter } from '@angular/core';
 import { AbstractControl, ControlValueAccessor, Validator } from '@angular/forms';
 import { PoLanguageService } from '../../../services/po-language/po-language.service';
 import { PoProgressAction } from '../../po-progress';
@@ -6,6 +6,7 @@ import { PoUploadFileRestrictions } from './interfaces/po-upload-file-restrictio
 import { PoUploadLiterals } from './interfaces/po-upload-literals.interface';
 import { PoUploadFile } from './po-upload-file';
 import { PoUploadService } from './po-upload.service';
+import { PoHelperOptions } from '../../po-helper';
 import * as i0 from "@angular/core";
 export declare const poUploadLiteralsDefault: {
     en: PoUploadLiterals;
@@ -29,8 +30,12 @@ export declare const poUploadLiteralsDefault: {
  */
 export declare abstract class PoUploadBaseComponent implements ControlValueAccessor, Validator {
     protected uploadService: PoUploadService;
+    protected cd: ChangeDetectorRef;
     additionalHelpEventTrigger: string | undefined;
     /**
+     *
+     * @deprecated v23.x.x use `p-helper`
+     *
      * @optional
      *
      * @description
@@ -38,6 +43,8 @@ export declare abstract class PoUploadBaseComponent implements ControlValueAcces
      * Se o evento `p-additional-help` estiver definido, o tooltip não será exibido.
      * **Como boa prática, indica-se utilizar um texto com até 140 caracteres.**
      * > Requer um recuo mínimo de 8px se o componente estiver próximo à lateral da tela.
+     *
+     * > Essa propriedade está **depreciada** e será removida na versão `23.x.x`. Recomendamos utilizar a propriedade `p-helper` que oferece mais recursos e flexibilidade.
      */
     additionalHelpTooltip?: string;
     /**
@@ -143,11 +150,43 @@ export declare abstract class PoUploadBaseComponent implements ControlValueAcces
      */
     requiredUrl: boolean;
     /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Define as opções do componente de ajuda (po-helper) que será exibido ao lado do label.
+     *
+     * > Caso o `p-label` não esteja definido, o componente po-helper não será exibido.
+     * Ao configurar esta propriedade, o antigo ícone de ajuda adicional (`p-additional-help-tooltip` e `p-additional-help`) será ignorado.
+     */
+    poHelperComponent: import("@angular/core").InputSignal<string | PoHelperOptions>;
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Habilita a quebra automática do texto da propriedade `p-label`. Quando `p-label-text-wrap` for verdadeiro, o texto que excede
+     * o espaço disponível é transferido para a próxima linha em pontos apropriados para uma
+     * leitura clara.
+     *
+     * @default `false`
+     */
+    labelTextWrap: import("@angular/core").InputSignal<boolean>;
+    /**
+     *
+     * @deprecated v23.x.x use `p-helper`
+     *
      * @optional
      *
      * @description
      * Evento disparado ao clicar no ícone de ajuda adicional.
      * Este evento ativa automaticamente a exibição do ícone de ajuda adicional ao `p-help`.
+     *
+     * > Essa propriedade está **depreciada** e será removida na versão `23.x.x`. Recomendamos utilizar a propriedade `p-helper` que oferece mais recursos e flexibilidade.
      */
     additionalHelp: EventEmitter<any>;
     /**
@@ -489,7 +528,7 @@ export declare abstract class PoUploadBaseComponent implements ControlValueAcces
      */
     set size(value: string);
     get size(): string;
-    constructor(uploadService: PoUploadService, languageService: PoLanguageService);
+    constructor(uploadService: PoUploadService, languageService: PoLanguageService, cd: ChangeDetectorRef);
     setDisabledState(isDisabled: boolean): void;
     registerOnChange(fn: any): void;
     registerOnTouched(fn: any): void;
@@ -512,7 +551,7 @@ export declare abstract class PoUploadBaseComponent implements ControlValueAcces
     abstract sendFeedback(): void;
     abstract setDirectoryAttribute(value: boolean): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoUploadBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoUploadBaseComponent, never, never, { "additionalHelpEventTrigger": { "alias": "additionalHelpEventTrigger"; "required": false; }; "additionalHelpTooltip": { "alias": "p-additional-help-tooltip"; "required": false; }; "appendBox": { "alias": "p-append-in-body"; "required": false; }; "autoFocus": { "alias": "p-auto-focus"; "required": false; }; "dragDropHeight": { "alias": "p-drag-drop-height"; "required": false; }; "label": { "alias": "p-label"; "required": false; }; "help": { "alias": "p-help"; "required": false; }; "url": { "alias": "p-url"; "required": false; }; "name": { "alias": "name"; "required": false; }; "autoUpload": { "alias": "p-auto-upload"; "required": false; }; "disabledRemoveFile": { "alias": "p-disabled-remove-file"; "required": false; }; "optional": { "alias": "p-optional"; "required": false; }; "headers": { "alias": "p-headers"; "required": false; }; "requiredUrl": { "alias": "p-required-url"; "required": false; }; "customAction": { "alias": "p-custom-action"; "required": false; }; "directory": { "alias": "p-directory"; "required": false; }; "dragDrop": { "alias": "p-drag-drop"; "required": false; }; "hideRestrictionsInfo": { "alias": "p-hide-restrictions-info"; "required": false; }; "hideSelectButton": { "alias": "p-hide-select-button"; "required": false; }; "hideSendButton": { "alias": "p-hide-send-button"; "required": false; }; "literals": { "alias": "p-literals"; "required": false; }; "fileRestrictions": { "alias": "p-restrictions"; "required": false; }; "formField": { "alias": "p-form-field"; "required": false; }; "disabled": { "alias": "p-disabled"; "required": false; }; "isMultiple": { "alias": "p-multiple"; "required": false; }; "required": { "alias": "p-required"; "required": false; }; "showRequired": { "alias": "p-show-required"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; }, { "additionalHelp": "p-additional-help"; "customActionClick": "p-custom-action-click"; "keydown": "p-keydown"; "onUpload": "p-upload"; "onError": "p-error"; "onSuccess": "p-success"; "ngModelChange": "ngModelChange"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoUploadBaseComponent, never, never, { "additionalHelpEventTrigger": { "alias": "additionalHelpEventTrigger"; "required": false; }; "additionalHelpTooltip": { "alias": "p-additional-help-tooltip"; "required": false; }; "appendBox": { "alias": "p-append-in-body"; "required": false; }; "autoFocus": { "alias": "p-auto-focus"; "required": false; }; "dragDropHeight": { "alias": "p-drag-drop-height"; "required": false; }; "label": { "alias": "p-label"; "required": false; }; "help": { "alias": "p-help"; "required": false; }; "url": { "alias": "p-url"; "required": false; }; "name": { "alias": "name"; "required": false; }; "autoUpload": { "alias": "p-auto-upload"; "required": false; }; "disabledRemoveFile": { "alias": "p-disabled-remove-file"; "required": false; }; "optional": { "alias": "p-optional"; "required": false; }; "headers": { "alias": "p-headers"; "required": false; }; "requiredUrl": { "alias": "p-required-url"; "required": false; }; "poHelperComponent": { "alias": "p-helper"; "required": false; "isSignal": true; }; "labelTextWrap": { "alias": "p-label-text-wrap"; "required": false; "isSignal": true; }; "customAction": { "alias": "p-custom-action"; "required": false; }; "directory": { "alias": "p-directory"; "required": false; }; "dragDrop": { "alias": "p-drag-drop"; "required": false; }; "hideRestrictionsInfo": { "alias": "p-hide-restrictions-info"; "required": false; }; "hideSelectButton": { "alias": "p-hide-select-button"; "required": false; }; "hideSendButton": { "alias": "p-hide-send-button"; "required": false; }; "literals": { "alias": "p-literals"; "required": false; }; "fileRestrictions": { "alias": "p-restrictions"; "required": false; }; "formField": { "alias": "p-form-field"; "required": false; }; "disabled": { "alias": "p-disabled"; "required": false; }; "isMultiple": { "alias": "p-multiple"; "required": false; }; "required": { "alias": "p-required"; "required": false; }; "showRequired": { "alias": "p-show-required"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; }, { "additionalHelp": "p-additional-help"; "customActionClick": "p-custom-action-click"; "keydown": "p-keydown"; "onUpload": "p-upload"; "onError": "p-error"; "onSuccess": "p-success"; "ngModelChange": "ngModelChange"; }, never, never, true, never>;
     static ngAcceptInputType_appendBox: any;
     static ngAcceptInputType_autoFocus: any;
     static ngAcceptInputType_disabledRemoveFile: any;

package/lib/components/po-field/po-upload/po-upload.component.d.ts

@@ -39,7 +39,6 @@ export declare class PoUploadComponent extends PoUploadBaseComponent implements
     renderer: Renderer2;
     private i18nPipe;
     private notification;
-    private cd;
     private inputFile;
     private poUploadDragDropComponent;
     uploadButton: PoButtonComponent;
@@ -105,6 +104,7 @@ export declare class PoUploadComponent extends PoUploadBaseComponent implements
      * Método que exibe `p-additionalHelpTooltip` ou executa a ação definida em `p-additionalHelp`.
      * Para isso, será necessário configurar uma tecla de atalho utilizando o evento `p-keydown`.
      *
+     * > Exibe ou oculta o conteúdo do componente `po-helper` quando o componente estiver com foco e com label visível.
      * ```
      * <po-upload
      *  #upload
@@ -114,6 +114,16 @@ export declare class PoUploadComponent extends PoUploadBaseComponent implements
      * ></po-upload>
      * ```
      * ```
+     * //Exemplo com p-label e p-helper
+     * <po-upload
+     *  #upload
+     *  ...
+     *  p-label="Label do upload"
+     *  [p-helper]="helperOptions"
+     *  (p-keydown)="onKeyDown($event, upload)"
+     * ></po-upload>
+     * ```
+     * ```
      * ...
      * onKeyDown(event: KeyboardEvent, inp: PoUploadComponent): void {
      *  if (event.code === 'F9') {
@@ -128,6 +138,10 @@ export declare class PoUploadComponent extends PoUploadBaseComponent implements
     trackByFn(index: any, file: PoUploadFile): string;
     uploadFiles(files: Array<PoUploadFile>): void;
     customClick(file: PoUploadFile): void;
+    setHelper(label?: string, additionalHelpTooltip?: string): {
+        hideAdditionalHelp: boolean;
+        helperSettings?: any;
+    };
     private cleanInputValue;
     private isAdditionalHelpEventTriggered;
     private isUploadButtonFocused;

package/lib/components/po-helper/index.d.ts

@@ -0,0 +1,3 @@
+export * from './po-helper.module';
+export * from './po-helper.component';
+export * from './interfaces/po-helper.interface';

package/lib/components/po-helper/interfaces/po-helper.interface.d.ts

@@ -0,0 +1,87 @@
+/**
+ * @usedBy PoHelperComponent
+ *
+ * @description
+ *
+ * *Interface* que define as opções de configuração do componente po-helper.
+ *
+ * Permite customizar o conteúdo, título, tipo do ícone, modo de abertura do popover, ações customizadas e eventos.
+ *
+ */
+export interface PoHelperOptions {
+    /**
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Título do helper exibido no popover.
+     */
+    title?: string;
+    /**
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Texto explicativo exibido no popover.
+     */
+    content?: string;
+    /**
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Tipo do ícone exibido: `info` ou `help`.
+     *
+     * Quando o valor é `info`, o popover exibe apenas informações e não permite ações customizadas.
+     *
+     * Quando o valor é `help`, o popover pode exibir ações customizadas no rodapé.
+     *
+     * @default `help`
+     */
+    type?: 'info' | 'help';
+    /**
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Ação customizada exibida no rodapé do popover.
+     * Compatível apenas com a propriedade type com o valor `help` e desconsiderada quando o type for `info`.
+     *
+     * Deve ser um objeto com as propriedades:
+     * - `label`: Texto do botão.
+     * - `action`: Função executada ao clicar no botão.
+     *
+     * Exemplo:
+     * ```typescript
+     * { label: 'Saiba mais', action: this.footerAction.bind(this)) }
+     * ```
+     */
+    footerAction?: {
+        label: string;
+        action: Function;
+    };
+    /**
+     * @optional
+     *
+     * @description
+     * Evento disparado ao clicar no ícone do helper.
+     *
+     * O conteúdo do popover não é exibido quando esta propriedade é definida, para controle total do evento pelo desenvolvedor.
+     *
+     * Pode ser uma função ou um `EventEmitter`.
+     *
+     * Exemplo:
+     * ```
+     * eventOnClick: (event) => {
+     *  alert('Clicou no helper');
+     *  console.log(event);
+     * }
+     * ```
+     */
+    eventOnClick?: Function;
+    size?: string;
+}

package/lib/components/po-helper/po-helper-base.component.d.ts

@@ -0,0 +1,112 @@
+import { PoHelperOptions } from './interfaces/po-helper.interface';
+import * as i0 from "@angular/core";
+/**
+ * @description
+ *
+ * O componente `po-helper` exibe um ícone de ajuda ou informação ao lado de campos, botões ou outros elementos, permitindo ao usuário acessar conteúdos explicativos em um popover.
+ *
+ * Principais funcionalidades:
+ * - Exibe ícone de ajuda (`help`) ou informação (`info`) conforme configuração.
+ * - Permite definir título, conteúdo e ações no popover via propriedade `p-helper`.
+ * - Suporte a acessibilidade: navegação por teclado, atributos ARIA e leitura do conteúdo por leitores de tela.
+ * - Controle do tamanho do componente via propriedade `p-size` (`small` ou `medium`).
+ * - Permite customizar ações no rodapé do popover.
+ *
+ * Exemplo de uso:
+ * ```html
+ * <po-helper
+ *   [p-helper]="{ title: 'Ajuda', content: 'Texto explicativo', type: 'help' }"
+ *   [p-size]="'medium'"
+ * ></po-helper>
+ * ```
+ *
+ * Também é possível passar apenas uma string para o conteúdo:
+ * ```html
+ * <po-helper p-helper="Texto explicativo"></po-helper>
+ * ```
+ *
+ * A propriedade `p-helper` aceita um objeto do tipo `PoHelperOptions`:
+ * ```typescript
+ * interface PoHelperOptions {
+ *   title?: string;
+ *   content: string;
+ *   type?: 'help' | 'info';
+ *   eventOnClick?: Function;
+ *   footerAction?: { label: string; action: Function };
+ * }
+ * ```
+ *
+ * > **Importante:** A propriedade `footerAction` não pode ser utilizada quando o tipo do helper for `info`, pois o ícone de informação é destinado apenas para exibir informações estáticas sem ações adicionais.
+ *
+ * #### Tokens customizáveis
+ *
+ * É possível alterar o estilo do componente usando os seguintes tokens (CSS):
+ *
+ * > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization).
+ *
+ * | Propriedade                                | Descrição                                                     | Valor Padrão                                      |
+ * |--------------------------------------------|---------------------------------------------------------------|---------------------------------------------------|
+ * | `--color`                                  | Cor principal do ícone                                        | `var(--color-action-default)`                     |
+ * | `--border-color-hover`                     | Cor da borda no estado hover                                  | `var(--color-brand-01-darkest)`                   |
+ * | `--background-pressed`                     | Cor de background no estado de pressionado&nbsp;              | `var(--color-brand-01-light)`                     |
+ * | `--color-disabled`                         | Cor principal no estado disabled                              | `var(--color-action-disabled)`                    |
+ *
+ */
+export declare class PoHelperBaseComponent {
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Define o conteúdo e as opções do popover de ajuda/informação.
+     *
+     * Aceita uma string simples (exibida como conteúdo) ou um objeto do tipo `PoHelperOptions` para configuração avançada:
+     * - `title`: Título do popover.
+     * - `content`: Conteúdo explicativo exibido no popover.
+     * - `type`: Tipo do ícone (`help` ou `info`).
+     * - `eventOnClick`: Função chamada ao clicar no ícone.
+     * - `footerAction`: Objeto com `label` e `action` para ação customizada no rodapé do popover.
+     *
+     * Exemplo de uso:
+     * ```html
+     * <po-helper p-helper="Texto explicativo"></po-helper>
+     * <po-helper [p-helper]="{ title: 'Ajuda', content: 'Texto', type: 'help' }"></po-helper>
+     * ```
+     *
+     */
+    helper: import("@angular/core").InputSignal<string | PoHelperOptions>;
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Define o tamanho do componente:
+     * - `small`: altura do ícone com seu valor de 16px (disponível apenas para acessibilidade AA).
+     * - `medium`: altura do ícone com seu valor de 24px.
+     *
+     * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.
+     * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).
+     *
+     * @default `medium`
+     */
+    size: import("@angular/core").InputSignal<string>;
+    /**
+     * @Input
+     *
+     * @optional
+     *
+     * @description
+     *
+     * Indica se o helper deve ser exibido no estado desativado, desabilitando interações do usuário.
+     *
+     * @default `false`
+     */
+    disabled: import("@angular/core").InputSignal<boolean>;
+    private transformHelper;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PoHelperBaseComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PoHelperBaseComponent, "po-helper-base", never, { "helper": { "alias": "p-helper"; "required": false; "isSignal": true; }; "size": { "alias": "p-size"; "required": false; "isSignal": true; }; "disabled": { "alias": "p-disabled"; "required": false; "isSignal": true; }; }, {}, never, never, false, never>;
+}