import { type EventEmitter } from '../../stencil-public-runtime'; import { type FormValidationState } from '../../shared/utils/form'; import { type FormValidationChangeDetail } from '../../shared/utils/validator'; import type { SwitchValidator } from './switch.types'; /** * O `br-switch` alterna instantaneamente entre os estados ligado e desligado. * * Defina o estado em `checked`. Opcionalmente configure os rótulos de estado em `label-on` e `label-off`. * * ```html * * * ``` * * Em formulários HTML, o componente integra-se via `ElementInternals`, participando do submit nativo. * * ### Quando usar * * - Ativar ou desativar uma funcionalidade com efeito imediato na tela ou configuração. * * ### Quando evitar * * - Confirmação de termos em formulários (ex.: "Li e concordo"): use `br-checkbox`. * - Escolha entre alternativas mutuamente exclusivas: use `br-radio`. * * Consulte as [diretrizes de design do GovBR](https://www.gov.br/ds/components/switch?tab=designer). * * @category Formulários, Seleção, Ações * @status stable * @slot default - Slot para o rótulo do switch, com prioridade sobre a propriedade label. * @slot feedback - Mensagem de validação, normalmente um `br-message`. * * @part container - Contêiner visual do switch. * @part input - Elemento input nativo com role switch. * @part label - Rótulo do switch. * @part data - Elemento com textos de estado ligado/desligado. * @part feedback - Contêiner da mensagem de validação. */ export declare class Switch { elementInternals: ElementInternals; formDisabledCallback(disabled: boolean): void; formResetCallback(): void; formStateRestoreCallback(state: string | File | FormData | null): void; /** * Referência ao elemento host do componente. * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente. */ el: HTMLBrSwitchElement; _slotDefault: boolean; formDisabled: boolean; hasFeedbackSlot: boolean; manualValidationMessage: string; validatorMessage: string | null; isValidating: boolean; /** * Desativa o switch, tornando-o não interativo. */ readonly disabled: boolean; /** * Se verdadeiro, o switch é obrigatório e deve ser ativado antes que o formulário possa ser enviado. */ readonly required: boolean; /** * Regra síncrona ou assíncrona aplicada ao estado booleano do switch. * Retorne uma mensagem para invalidar ou `null` para aceitar o valor. * * @example * ```js * const toggle = document.querySelector('br-switch'); * toggle.validator = (checked) => checked ? null : 'Ative esta opção para continuar'; * ``` */ readonly validator?: SwitchValidator; /** * Define o estado de seleção do checkbox. * Se definido como verdadeiro, o checkbox estará marcado. Caso contrário, estará desmarcado. */ checked: boolean; /** * Identificador único; gerado automaticamente quando omitido. */ readonly customId: string; /** * Texto descritivo. * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado. */ readonly label: string; /** * Posição do rótulo em relação ao switch. Valores inválidos usam `left`. */ readonly labelPosition: 'right' | 'left' | 'top'; /** * Texto exibido quando o switch está ativado. */ readonly labelOn: string; /** * Texto exibido quando o switch está desativado. */ readonly labelOff: string; /** * Adiciona um ícone ao switch para indicar a mudança de estado. * @deprecated Use `showIcon`. */ readonly hasIcon: boolean; /** Exibe o ícone de estado. Quando informada, tem precedência sobre `hasIcon`. */ readonly showIcon?: boolean; /** * Define o nome do switch, que é utilizado para agrupar switches em formulários e identificar o campo. * O valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários. */ readonly name: string; /** * Define o valor associado ao switch quando ele faz parte de um formulário nativo (`
`). * Esse valor é enviado com o formulário quando o switch está selecionado. * **Nota:** Esta propriedade não deve ser utilizada para determinar se o switch está selecionado; para verificar o estado de seleção, use a propriedade `checked`. */ readonly value: string; /** Ajusta a área de interação: `small` é compacto, `medium` é o padrão e `large` é mais espaçado. * Valores inválidos usam `medium`. */ readonly density: 'large' | 'medium' | 'small'; checkedChanged(): void; /** * Disparado depois que o valor do `checked` foi alterado. * @deprecated Use `input`/`change` e leia `event.target.checked`. */ checkedChange: EventEmitter; /** Emitido ao iniciar e concluir a validação customizada. */ brSwitchValidationChange: EventEmitter; componentWillLoad(): void; componentDidLoad(): void; componentDidUpdate(): void; /** * Retorna `true` se o valor do switch for válido, caso contrário `false`. * Se o switch for inválido, dispara um evento 'invalid'. */ checkValidity(): Promise; /** * Retorna `true` se o valor do componente for válido, caso contrário `false`. * Se for inválido, exibe a mensagem de erro padrão do navegador. */ reportValidity(): Promise; /** * Define uma mensagem de validação customizada para o switch. * Se a mensagem for uma string vazia, o erro customizado é limpo. */ setCustomValidity(message: string): Promise; /** Executa o validator do switch e retorna se o valor atual é válido. */ validate(): Promise; /** Retorna um snapshot serializável da Constraint Validation API. */ getValidationState(): Promise; /** * Inverte o valor da prop `checked` * @deprecated Atualize a propriedade `checked` diretamente. */ toggleChecked(): Promise; /** * Referência nativa do input checkbox para acessar a API de validação */ private nativeInput?; private validationRunId; private initialChecked; private syncFormState; private isDisabled; private updateValidity; private _hasSlotContentDefault; /** * Determina o texto a ser usado para acessibilidade quando não há label visível */ private getAccessibilityLabel; private readonly handleCheckedInput; private readonly handleCheckedChange; private readonly handleClick; /** * Verifica se o componente tem texto visível (via slot ou label) */ private hasVisibleText; private getCssClassMap; private get effectiveLabelPosition(); render(): any; }