import { ChangeDetectorRef, EventEmitter } from '@angular/core'; import { AbstractControl, ControlValueAccessor, Validator } from '@angular/forms'; import { PoRichTextToolbarActions } from './enum/po-rich-text-toolbar-actions.enum'; import { PoRichTextService } from './po-rich-text.service'; import { PoHelperOptions } from '../../po-helper'; /** * @description * * O componente `po-rich-text` é um editor de textos enriquecidos. * * Para edição de texto simples sem formatação recomenda-se o uso do componente [**po-textarea**](/documentation/po-textarea). * * > No navegador Internet Explorer não é possível alterar a cor do texto. */ export declare abstract class PoRichTextBaseComponent implements ControlValueAccessor, Validator { private readonly richTextService; cd: ChangeDetectorRef; /** * * @deprecated v23.x.x use `p-helper` * * @optional * * @description * Exibe um ícone de ajuda adicional, com o texto desta propriedade sendo passado para o popover do componente `po-helper`. * **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; /** * @optional * * @description * * Define que o popover (`p-helper` e/ou `p-error-limit`) será incluído no body da página e não * dentro do componente. Essa opção pode ser necessária em cenários com containers que possuem scroll ou overflow * escondido, garantindo o posicionamento correto do tooltip próximo ao elemento. * * > Quando utilizado com `p-helper`, leitores de tela como o NVDA podem não ler o conteúdo do popover. * * @default `false` */ appendBox?: boolean; /** * @optional * * @description * * Aplica foco no elemento ao ser iniciado. * * > Caso mais de um elemento seja configurado com essa propriedade, apenas o último elemento declarado com ela terá o foco. * * @default `false` */ autoFocus: boolean; /** * @optional * * @description * * Define se o alinhamento de texto será desabilitado. * * @default `false` */ disabledTextAlign: boolean; /** * @optional * * @description * * Indica que o campo será desabilitado. * * @default `false` */ disabled: boolean; /** * @optional * * @description * Exibe um ícone de carregamento no lado direito do campo para sinalizar que uma operação está em andamento. * * @default `false` */ set loading(value: boolean); get loading(): boolean; get isDisabled(): boolean; /** * @description * * Mensagem que será apresentada quando a propriedade required estiver habilitada e o campo for limpo após algo ser digitado. */ errorMessage?: string; /** * @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: boolean; /** * @optional * * @description * * Texto de apoio do campo. */ help?: string; /** * @optional * * @description * * Rótulo do campo. */ label?: string; /** * @optional * * @description * Define se o título do campo será exibido de forma compacta. * * Quando habilitado (`true`), o modo compacto afeta o conjunto composto por: * - `po-label` * - `p-requirement (showRequired)` * - `po-helper` * * Ou seja, todos os elementos relacionados ao título do campo * (rótulo, indicador de obrigatoriedade e componente auxiliar) passam * a seguir o comportamento de layout compacto. * * Também é possível definir esse comportamento de forma global, * uma única vez, na folha de estilo geral da aplicação, por meio * da customização dos tokens CSS: * * - `--field-container-title-justify` * - `--field-container-title-flex` * * Exemplo: * * ``` * :root { * --field-container-title-justify: flex-start; * --field-container-title-flex: 0 1 auto; * } * ``` * * Dessa forma, o layout compacto passa a ser o padrão da aplicação, * sem a necessidade de definir a propriedade individualmente em cada campo. * * @default `false` */ compactLabel: import("@angular/core").InputSignalWithTransform; /** Nome e identificador do campo. */ name: string; /** * @optional * * @description * * Define se a indicação de campo opcional será exibida. * * > Não será exibida a indicação se: * - O campo conter `p-required`; * - Não possuir `p-help` e/ou `p-label`. * * @default `false` */ optional: boolean; private _hideToolbarActions; /** * @optional * * @description * * Define as ações da barra de ferramentas do `PoRichTextComponent` que serão ocultadas. * Aceita um único valor do tipo `PoRichTextToolbarActions` ou uma lista de valores. * * > Esta propriedade sobrepõe a configuração da propriedade `p-disabled-text-align` quando for passada como `false`, caso sejam definidas simultaneamente. * * @default `[]` * * @example * ``` * // Oculta apenas o seletor de cores * component.hideToolbarActions = PoRichTextToolbarActions.Color; * * // Oculta as opções de alinhamento e link * component.hideToolbarActions = [PoRichTextToolbarActions.Align, PoRichTextToolbarActions.Link]; * ``` */ set hideToolbarActions(actions: Array | PoRichTextToolbarActions); get hideToolbarActions(): Array; /** * @optional * * @description * * Define as opções do componente de ajuda (po-helper) que será exibido ao lado do label quando a propriedade `p-label` for definida, ou, ao lado do componente na ausência da propriedade `p-label`. * > Para mais informações acesse: https://po-ui.io/documentation/po-helper. * * > 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; /** * @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; /** * * @deprecated v23.x.x use `p-helper` * * @optional * * @description * Evento disparado ao clicar no ícone de ajuda adicional. * * > 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; /** * @optional * * @description * * Evento disparado ao deixar o campo e que recebe como parâmetro o valor alterado. */ change: EventEmitter; /** * @optional * * @description * * Evento disparado ao modificar valor do model e que recebe como parâmetro o valor alterado. */ changeModel: EventEmitter; /** * @optional * * @description * Evento disparado quando uma tecla é pressionada enquanto o foco está no componente. * Retorna um objeto `KeyboardEvent` com informações sobre a tecla. */ keydown: EventEmitter; displayAdditionalHelp: boolean; invalid: boolean; onChangeModel: any; value: string; private _loading; private _height?; private _placeholder; private _readonly; private _required; private _size?; private _initialSize?; private validatorChange; protected onTouched: any; /** * @optional * * @description * * Define a altura da área de edição de texto. * * > Altura mínima do componente é `94` e a altura máxima é `262`. */ set height(height: number); get height(): number; /** * @optional * * @description * * Mensagem que aparecerá enquanto o campo não estiver preenchido. * * @default '' */ set placeholder(value: string); get placeholder(): string; /** * @optional * * @description * * Indica que o campo será somente leitura. * * @default `false` */ set readonly(value: boolean); get readonly(): boolean; /** * @optional * * @description * * Define que o campo será obrigatório. * * @default `false` */ set required(value: boolean); get required(): boolean; /** * @optional * * @description * * Define o tamanho do componente: * - `small`: altura dos buttons como 32px (disponível apenas para acessibilidade AA). * - `medium`: altura dos buttons como 44px. * * > 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` */ set size(value: string); get size(): string; /** * Define se a indicação de campo obrigatório será exibida. * * > Não será exibida a indicação se: * - Não possuir `p-help` e/ou `p-label`. */ showRequired: boolean; constructor(richTextService: PoRichTextService, cd: ChangeDetectorRef); setDisabledState(isDisabled: boolean): void; protected onThemeChange(): void; registerOnChange(func: any): void; registerOnTouched(func: any): void; registerOnValidatorChange(fn: () => void): void; validate(abstractControl: AbstractControl): { [key: string]: any; }; writeValue(value: string): void; protected updateModel(value: any): void; protected validateModel(value: any): void; private applySizeBasedOnA11y; }