@govbr-ds/webcomponents/dist/types/components/scrim/scrim.d.ts

Biblioteca de Web Components baseado no GovBR-DS

import { EventEmitter } from '../../stencil-public-runtime';
/**
 * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/scrim?tab=designer).
 *
 * @slot default - Elemento que será exibido junto com o Scrim, devendo ser fornecido através do slot. Esse elemento representa o conteúdo principal a ser destacado sobre o fundo escurecido.
 * @slot activator - Elemento que, quando clicado, ativa/desativa o scrim. Tem prioridade sobre a propriedade 'activator'.
 */
export declare class Scrim {
    /**
     * Referência ao elemento host do componente.
     */
    el: HTMLBrScrimElement;
    elementInternals: ElementInternals;
    /**
     * Identificador único.
     * Caso não seja fornecido, um ID gerado automaticamente será usado.
     */
    readonly customId: string;
    /**
     * Ativa/desativa o scrim
     */
    isOpen: boolean;
    /**
     * Posiciona o conteúdo no topo, centro, direita, esquerda, abaixo dentro do scrim
     */
    positionContent: 'top' | 'center' | 'right' | 'left' | 'bottom';
    /**
     * Desativa o fechamento do scrim ao ser clicado
     */
    disableCloseOnClick: boolean;
    /**
     * Define o valor de z-index do scrim
     */
    zIndex: number | null;
    /**
     * Define um valor CSS personalizado para o background do scrim
     */
    customBackground: string | null;
    /**
     * Define a opacidade personalizada do scrim
     */
    customOpacity: number | null;
    /**
     * Define o modo de exibição do scrim:
     * - 'fullscreen': Ocupa toda a tela (position: fixed).
     * - 'parent': Ocupa apenas o elemento pai (position: absolute).
     * O elemento pai deve ter `position: relative` ou outro valor de posicionamento diferente de `static`.
     */
    displayMode: 'fullscreen' | 'parent';
    /**
     * Define a estratégia de manipulação de rolagem quando scrim está aberto
     * - 'block': Impede a rolagem completamente
     * - 'close': Fecha o scrim quando ocorre rolagem
     */
    scrollStrategy: 'block' | 'close';
    /**
     * Determina quanto de rolagem (em pixels) é necessário para acionar a ação de fechamento automático do scrim.
     */
    scrollThreshold: number;
    /**
     * Define o seletor para o elemento activator.
     * Pode ser:
     * - Um seletor CSS (ex: '.button-class', '#button-id')
     * - A string 'parent' para usar o elemento pai como activator
     * Nota: O slot 'activator' tem prioridade sobre esta propriedade.
     */
    activator: string | null;
    /**
     * Define um rótulo acessível personalizado para o diálogo.
     * Se não fornecido, será usado "Conteúdo do diálogo" como padrão.
     */
    ariaLabel: string | null;
    /** Indica que o scrim foi aberto. */
    brScrimOpen: EventEmitter;
    /** Indica que o scrim foi fechado */
    brScrimClose: EventEmitter;
    isActive: boolean;
    hasActivatorSlot: boolean;
    private contentRef;
    private activatorElement;
    private scrollOffset;
    private lastScrollTop;
    private previouslyFocusedElement;
    private focusTimeoutId;
    private restoreFocusTimeoutId;
    private static readonly FOCUSABLE_SELECTORS;
    handleOpenChange(newValue: boolean): void;
    updateStyles(): void;
    handleActivatorChange(): void;
    componentWillLoad(): void;
    componentDidLoad(): void;
    /**
     * Adiciona event listener ao contentRef para capturar eventos de teclado
     * e gerenciar a navegação por teclado dentro do scrim.
     */
    private addContentEventListener;
    connectedCallback(): void;
    disconnectedCallback(): void;
    private checkActivatorSlot;
    private setupActivatorSlotClick;
    private setupActivator;
    private handleActivatorClick;
    private addActivatorClickListener;
    private removeActivatorClickListener;
    private cleanupActivatorSlotClick;
    private applyScrollStrategy;
    private enableScrollBlock;
    private enableScrollWatcher;
    private handleBlockScroll;
    private resetScrolling;
    private handleScrollClose;
    private focusFirstElement;
    private restoreFocus;
    private getFocusableElements;
    private filterVisibleElements;
    private handleKeyDown;
    private handleGlobalKeyDown;
    private handleGlobalClick;
    /**
     * Intercepta eventos de foco globalmente
     */
    private handleGlobalFocus;
    private shouldHandleEscape;
    private handleTabNavigation;
    private shouldTrapFocus;
    private wrapFocus;
    /**
     * Verifica se um elemento está dentro do scrim
     */
    private isElementInsideScrim;
    /**
     * Adiciona interceptação global de eventos
     */
    private addGlobalEventInterception;
    /**
     * Remove interceptação global de eventos
     */
    private removeGlobalEventInterception;
    private handleMaskClick;
    private getCssClassMap;
    /**
     * Define o limite de rolagem para o fechamento automático do scrim.
     */
    setScrollThreshold(threshold: number): Promise<void>;
    /**
     * Método público para exibir o scrim
     */
    open(): Promise<void>;
    /**
     * Método público para esconder o scrim
     */
    close(): Promise<void>;
    /**
     * Método público para alternar o estado de exibição do scrim
     */
    toggle(): Promise<void>;
    render(): any;
}