@govbr-ds/webcomponents
Version:
Biblioteca de Web Components baseado no GovBR-DS
103 lines (102 loc) • 4.66 kB
TypeScript
import { EventEmitter } from '../../stencil-public-runtime';
/**
* Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/step?tab=designer).
*
* @slot nomeado label-area: insere o conteúdo customizado dentro do botão que compõe o componente.
*/
export declare class StepItem {
/**
* Referência ao elemento host do componente.
* Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.
*/
el: HTMLBrStepItemElement;
elementInternals: ElementInternals;
/**
* Propriedade que define o conteúdo do texto auxiliar de realce do item de Step.
*/
label: string;
/**
* Propriedade que define o tipo de ícone de destaque exibido pelo item Step, com quatro opções disponíveis: "success", "info", "danger" e "warning".
*/
highlight?: 'success' | 'info' | 'danger' | 'warning';
/**
* Propriedade que define se o item Step está com estado ativo.
*/
active: boolean;
/**
* Propriedade que define se o item Step está com estado desativado..
*/
disabled: boolean;
/**
* Propriedade Define o nome do ícone do componente BRIcon que será exibido como conteúdo do step item, propriedade funciona apenas quando o state contentType assume o valor br-icon.
*/
brIconName?: string;
/**
* Propriedade Define o nome do ícone o texto de acessibilidade apresentando quando o tipo de conteúdo for o br-icon
*/
brIconAria: string;
showTimeLine: boolean;
stepItemPositionStatus: 'first' | 'middle' | 'last';
stepLayout: 'horizontal' | 'vertical';
labelPosition: 'top' | 'right' | 'bottom' | 'left';
contentType: 'default' | 'br-icon' | 'no-content' | 'slotted';
mode: 'controller' | 'step';
content: string;
ariaLabelContent: string;
/**
* Emite um evento após o componente ter sido carregado pela primeira vez.
* Utilize este evento para realizar ações que devem ocorrer antes que o componente seja renderizado ou atualizado.
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.
*/
brWillRender: EventEmitter<void>;
componentWillRender(): void;
/**
* Emite um evento após o componente ter sido carregado pela primeira vez.
* Utilize este evento para realizar ações que devem ocorrer antes que o componente seja renderizado ou atualizado.
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.
*/
brDidRender: EventEmitter<void>;
componentDidRender(): void;
/**
* Watch que observa o valor da propriedade active, e ao alterar seu valor este método altera o valor do campo de acessibilidade aria-selected
*/
watchItemIsActive(newValue: boolean, oldValue: boolean): void;
/**
*
* Método disponibilizado via api do elemento que indica a posição do step item, ele serve para setar o state stepItemPositionStatus do componente
*/
setStepItemPositionStatus(value: 'first' | 'middle' | 'last'): Promise<void>;
/**
* Método que define a orientação do stepItem e controla a exibição da linha do tempo após o componente.
*/
handleShowTimeLine(value: boolean, layout: any): Promise<void>;
/**
*
* Método disponibilizado via api do elemento que atribui o valor ao estado que define onde o label, o texto de destaque, irá ficar localizado
*/
setLabelPosition(value: 'top' | 'right' | 'bottom' | 'left'): Promise<void>;
/**
*
* Método disponibilizado via api do elemento que atribui o valor que irá definir o tipo de conteúdo apresentado dentro do componente stepItem
*/
setContentType(value: 'default' | 'br-icon' | 'no-content' | 'slotted'): Promise<void>;
/**
*
* Método disponibilizado via api do elemento que atribui o valor que irá definir o modo como o componente irá se comportar e exibir seu estilo.
*/
setMode(value: 'controller' | 'step'): Promise<void>;
/**
*
* Método disponibilizado via api do elemento que atribui o valor que irá ser exibido dentro do componente stepItem
*/
setContent(value: string): Promise<void>;
private getStepContainerClassMap;
private getStepItemContentClassMap;
private getStepItemIndicatorAreaClassMap;
private getStepItemLabelAreaClassMap;
private getHighlightClass;
private getStepItemIndicatorClass;
private highLightAriaLabel;
private IconsName;
render(): any;
}