@giro-ds/react 3.0.4 → 3.0.6

package/dist/index.d.ts

@@ -2,248 +2,496 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
 import React__default, { ReactNode, ReactElement, CSSProperties } from 'react';
 
-interface AvatarProps {
+type Size = 'sm' | 'lg';
+type Variant = 'filled' | 'outlined' | 'text';
+type TextVariant = 'neutral' | 'brand' | 'color' | 'success' | 'alert';
+type Side = 'top' | 'right' | 'bottom' | 'left';
+type Align = 'start' | 'center' | 'end';
+type Position = 'right' | 'left' | 'both';
+type Locale = 'pt-br' | 'en-us';
+interface BaseProps {
     id?: string;
-    icon: React__default.ReactNode;
-    size?: 'small' | 'large';
     className?: string;
+    disabled?: boolean;
+}
+
+/**
+ * Props do componente Avatar
+ * @example
+ * ```tsx
+ * <Avatar icon={<UserIcon />} size="lg" />
+ * ```
+ * @example
+ * ```tsx
+ * <Avatar
+ *   icon={<ProfileIcon />}
+ *   size="sm"
+ *   className="custom-avatar"
+ * />
+ * ```
+ */
+interface AvatarProps extends BaseProps {
+    /** Ícone ou conteúdo a ser exibido no avatar */
+    icon: React$1.ReactNode;
+    /** Tamanho do avatar */
+    size?: Size;
 }
 
-declare let Avatar: ({ id, icon, size, className }: AvatarProps) => react_jsx_runtime.JSX.Element;
+declare let Avatar: ({ id, icon, size, className, ...rest }: AvatarProps) => react_jsx_runtime.JSX.Element;
 
+/** Tipos de badge suportados */
 type BadgeType = 'notification' | 'status';
+/** Valores possíveis para exibição no badge */
 type BadgeValue = number | string | null;
-interface BadgeProps {
+/**
+ * Props do componente Badge
+ * @example
+ * ```tsx
+ * <Badge type="notification" badgeValue={5}>
+ *   <IconButton icon={<BellIcon />} />
+ * </Badge>
+ * ```
+ * @example
+ * ```tsx
+ * <Badge
+ *   type="status"
+ *   badgeValue="novo"
+ *   aria-label="Novo item disponível"
+ * >
+ *   <Avatar icon={<UserIcon />} />
+ * </Badge>
+ * ```
+ */
+interface BadgeProps extends BaseProps {
     /** Tipo de badge (notificação ou status) */
     type: BadgeType;
     /** Conteúdo a ser envolvido pelo badge */
     children?: ReactNode;
     /** Valor a ser exibido no badge (número, texto ou null) */
     badgeValue?: BadgeValue;
-    /** Classes CSS adicionais */
-    className?: string;
-    /** ID único do componente */
-    id?: string;
-    /** Se o badge está desabilitado */
+    /** Valor máximo a ser exibido (ex: 99+ quando badgeValue > maxValue) */
     maxValue?: number;
-    /** Props de acessibilidade customizadas */
+    /** Label acessível para leitores de tela */
     'aria-label'?: string;
 }
 
 declare const Badge: React__default.FC<BadgeProps>;
 
-interface ButtonProps extends React__default.HTMLAttributes<HTMLElement> {
+/**
+ * Props do componente Button
+ * @example
+ * ```tsx
+ * <Button variant="filled" size="lg" onClick={handleClick}>
+ *   Clique aqui
+ * </Button>
+ * ```
+ * @example
+ * ```tsx
+ * <Button
+ *   variant="outlined"
+ *   icon={<Icon />}
+ *   iconPosition="left"
+ *   loading={isLoading}
+ * >
+ *   Salvar
+ * </Button>
+ * ```
+ */
+interface ButtonProps extends BaseProps, React__default.HTMLAttributes<HTMLElement> {
+    /** Elemento customizado a ser renderizado (ex: 'a', Link do React Router) */
     as?: React__default.ElementType;
+    /** Conteúdo do botão */
     children?: React__default.ReactNode;
-    variant?: 'filled' | 'outlined' | 'text';
+    /** Variante visual do botão */
+    variant?: Variant;
+    /** Define se o botão exibe apenas ícone (sem texto) */
     iconOnly?: boolean;
-    iconPosition?: 'left' | 'right' | 'both';
+    /** Posição do ícone em relação ao texto */
+    iconPosition?: Position;
+    /** URL de destino quando usado como link (renderiza <a>) */
     href?: string;
+    /** Rota de destino para roteadores (ex: React Router) */
     to?: string;
+    /** Define se o link abre em nova aba */
     external?: boolean;
+    /** Atributo target do HTML para links */
     target?: string;
+    /** Atributo rel do HTML para links */
     rel?: string;
+    /** Tipo HTML do botão */
     type?: 'button' | 'submit' | 'reset';
-    disabled?: boolean;
-    onClick?: (event: React__default.MouseEvent<HTMLElement>) => void;
-    size?: 'lg' | 'sm';
-    className?: string;
-    id?: string;
+    /** Tamanho do botão */
+    size?: Size;
+    /** Ícone a ser exibido no botão */
     icon?: React__default.ReactNode;
+    /** Define se o botão ocupa 100% da largura do container */
     fullWidth?: boolean;
+    /** Label acessível para leitores de tela */
     ariaLabel?: string;
+    /** Estado de carregamento (exibe spinner) */
     loading?: boolean;
 }
 
 declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLElement>>;
 
-type Locale = 'pt-br' | 'en-us';
+/** Formatos de exibição de data disponíveis */
 type DateFormat = 'dd/mm/yyyy' | 'mm/dd/yyyy';
+/**
+ * Representa um dia no calendário
+ */
 interface DayItem {
+    /** Tipo do item (sempre 'day') */
     type: 'day';
+    /** Chave única para renderização */
     key: number;
+    /** Número do dia */
     day: number;
+    /** Objeto Date completo */
     date: Date;
+    /** Indica se é o dia atual */
     isToday: boolean;
+    /** Indica se o dia está selecionado */
     isSelected: boolean;
+    /** Label acessível do dia */
     label: string;
 }
+/**
+ * Representa um espaço vazio no grid do calendário
+ */
 interface EmptyItem {
+    /** Tipo do item (sempre 'empty') */
     type: 'empty';
+    /** Chave única para renderização */
     key: string;
 }
+/** Item do calendário (pode ser um dia ou espaço vazio) */
 type CalendarItem = DayItem | EmptyItem;
+/**
+ * Representa um ano na visualização de seleção de ano
+ */
 interface YearItem {
+    /** Número do ano */
     year: number;
+    /** Indica se é o ano atual */
     isCurrent: boolean;
+    /** Chave única para renderização */
     key: number;
 }
-interface CalendarProps {
-    /** Data do dia Atual */
+/**
+ * Props do componente Calendar
+ * @example
+ * ```tsx
+ * <Calendar
+ *   currentDate={new Date()}
+ *   onDateChange={(date) => console.log(date)}
+ *   locale="pt-br"
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Calendar
+ *   currentDate={new Date()}
+ *   selectedDate={selectedDate}
+ *   onDaySelect={handleDaySelect}
+ *   minDate={new Date('2024-01-01')}
+ *   maxDate={new Date('2024-12-31')}
+ *   format="dd/mm/yyyy"
+ * />
+ * ```
+ */
+interface CalendarProps extends BaseProps {
+    /** Data do dia atual */
     currentDate: Date | null;
-    /** Classe CSS adicional */
-    className?: string;
-    /** Dia Selecionado pelo usuário */
+    /** Dia selecionado pelo usuário */
     selectedDate?: Date | null;
-    /** Função que é executada quando a data escolhida é alterada */
+    /** Callback executado quando a data escolhida é alterada: (date) => void */
     onDateChange?: (date: Date) => void;
-    /** Função que é executada quando um dia é selecionado */
+    /** Callback executado quando um dia é selecionado: (date) => void */
     onDaySelect?: (date: Date) => void;
+    /** Callback executado ao limpar a seleção: () => void */
     onClear?: () => void;
+    /** Data mínima selecionável */
     minDate?: Date;
+    /** Data máxima selecionável */
     maxDate?: Date;
-    /** Locale do calendário ('pt-br' ou 'en-us') */
+    /** Locale do calendário */
     locale?: Locale;
-    /** Formato de exibição da data ('dd/mm/yyyy' ou 'mm/dd/yyyy') */
+    /** Formato de exibição da data */
     format?: DateFormat;
-    /** Identificador do elemento raiz do calendário */
-    id?: string;
 }
 
 declare const MemoizedCalendar: React__default.NamedExoticComponent<CalendarProps>;
 
-interface CalloutProps {
-    /** Define o tipo de callout */
-    type?: 'neutral' | 'color' | 'brand' | 'alert' | 'success';
-    /** Define o título com mais destaque */
+/**
+ * Props do componente Callout
+ * @example
+ * ```tsx
+ * <Callout
+ *   type="success"
+ *   title="Sucesso!"
+ *   text="Operação realizada com sucesso"
+ *   icon={<CheckIcon />}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Callout
+ *   type="alert"
+ *   title="Atenção"
+ *   text="Verifique os campos obrigatórios"
+ * />
+ * ```
+ */
+interface CalloutProps extends BaseProps {
+    /** Tipo visual do callout */
+    type?: TextVariant;
+    /** Título principal do callout (texto em destaque) */
     title?: string | null;
-    /** Define o texto com menos destaque */
+    /** Texto descritivo do callout */
     text?: string;
-    /** Define o ícone a ser importado */
-    icon?: React__default.ReactNode;
-    /** Define a classe CSS adicional */
-    className?: string;
-    /** Define o id do callout */
-    id?: string;
+    /** Ícone a ser exibido no callout */
+    icon?: React$1.ReactNode;
     /** Props adicionais para o elemento div */
     [key: string]: any;
 }
 
 declare const Callout: React__default.FC<CalloutProps>;
 
-interface CheckboxProps {
-    id?: string;
-    label?: React.ReactNode;
+/**
+ * Props do componente Checkbox
+ * @example
+ * ```tsx
+ * <Checkbox
+ *   label="Aceito os termos"
+ *   checked={accepted}
+ *   onCheckedChange={setAccepted}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Checkbox
+ *   label="Selecionar todos"
+ *   indeterminate={someSelected}
+ *   onCheckedChange={handleSelectAll}
+ *   disabled={isLoading}
+ * />
+ * ```
+ */
+interface CheckboxProps extends BaseProps {
+    /** Label ou conteúdo a ser exibido ao lado do checkbox */
+    label?: React__default.ReactNode;
+    /** Callback executado quando o estado muda: (checked) => void */
     onCheckedChange?: (checked: boolean) => void;
+    /** Estado inicial (modo não controlado) */
     defaultChecked?: boolean;
+    /** Estado atual (modo controlado) */
     checked?: boolean;
-    disabled?: boolean;
-    className?: string;
+    /** Estado indeterminado (usado em selecionar todos com seleção parcial) */
     indeterminate?: boolean;
 }
 
 declare const Checkbox: React$1.FC<CheckboxProps>;
 
-interface ChipsProps {
-    /** Variante a ser escolhida para utilizar padrões de estilizações pré-definidos */
-    type?: 'neutral' | 'brand' | 'color' | 'success' | 'alert';
-    /** Texto a ser exibido dentro do componente */
+/**
+ * Props do componente Chips
+ * @example
+ * ```tsx
+ * <Chips
+ *   type="success"
+ *   title="Ativo"
+ *   leftIcon={<CheckIcon />}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Chips
+ *   type="brand"
+ *   title="Novo"
+ *   rightIcon={<CloseIcon />}
+ *   disabled={false}
+ * />
+ * ```
+ */
+interface ChipsProps extends BaseProps {
+    /** Tipo visual do chip */
+    type?: TextVariant;
+    /** Texto a ser exibido dentro do chip */
     title: string;
-    /** Ícone react que ficará posicionado à esquerda no componente */
-    leftIcon?: React__default.ReactNode;
-    /** Ícone react que ficará posicionado à direita no componente */
-    rightIcon?: React__default.ReactNode;
-    /** Estado alterável para desabilitar */
-    disabled?: boolean;
-    /** Classe CSS adicional */
-    className?: string;
+    /** Ícone posicionado à esquerda do texto */
+    leftIcon?: React$1.ReactNode;
+    /** Ícone posicionado à direita do texto */
+    rightIcon?: React$1.ReactNode;
     /** Props adicionais para o elemento div */
     [key: string]: any;
 }
 
 declare const MemoizedChips: React__default.NamedExoticComponent<ChipsProps>;
 
+/**
+ * Props do componente Container
+ * @example
+ * ```tsx
+ * <Container>
+ *   <h1>Conteúdo da página</h1>
+ *   <p>Texto dentro do container</p>
+ * </Container>
+ * ```
+ */
 interface ContainerProps {
+    /** Conteúdo a ser renderizado dentro do container */
     children: React__default.ReactNode;
 }
 
 declare function Container({ children }: ContainerProps): react_jsx_runtime.JSX.Element;
 
-type DatePickerLocale = 'pt-br' | 'en-us';
-type CalendarPosition = 'left' | 'right';
-interface DatePickerProps {
+/**
+ * Props do componente DatePicker
+ * @example
+ * ```tsx
+ * <DatePicker
+ *   label="Data de nascimento"
+ *   value={birthDate}
+ *   onChange={setBirthDate}
+ *   locale="pt-br"
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <DatePicker
+ *   label="Data de início"
+ *   required
+ *   helperText="Selecione a data de início do projeto"
+ *   minDate={new Date()}
+ *   calendarPosition="right"
+ *   error={errorMessage}
+ * />
+ * ```
+ */
+interface DatePickerProps extends BaseProps {
     /** Locale para formatação da data */
-    locale?: DatePickerLocale;
-    /** Posição do calendário */
-    calendarPosition?: CalendarPosition;
-    /** Texto de ajuda */
+    locale?: Locale;
+    /** Posição do calendário em relação ao campo */
+    calendarPosition?: Position;
+    /** Texto de ajuda exibido abaixo do campo */
     helperText?: string;
-    /** Se o campo é obrigatório */
+    /** Define se o campo é obrigatório */
     required?: boolean;
-    /** Label do campo */
+    /** Label do campo de data */
     label?: string;
     /** Valor controlado da data */
     value?: Date | null;
     /** Valor inicial para modo não controlado */
     defaultValue?: Date | null;
-    /** Callback chamado quando a data muda */
+    /** Callback executado quando a data muda: (date) => void */
     onChange?: (date: Date | null) => void;
-    /** Se o campo está desabilitado */
-    disabled?: boolean;
-    /** Mensagem de erro */
+    /** Mensagem de erro a ser exibida */
     error?: string;
-    /** Data mínima permitida */
+    /** Data mínima selecionável */
     minDate?: Date;
-    /** Data máxima permitida */
+    /** Data máxima selecionável */
     maxDate?: Date;
-    /** Classes CSS adicionais */
-    className?: string;
-    /** ID para testes */
+    /** ID para testes automatizados */
     'data-testid'?: string;
 }
 
 declare const _default$1: React__default.NamedExoticComponent<DatePickerProps>;
 
-interface DialogProps {
+/**
+ * Props do componente Dialog
+ * @example
+ * ```tsx
+ * <Dialog
+ *   show={isOpen}
+ *   title="Confirmar exclusão"
+ *   text="Tem certeza que deseja excluir este item?"
+ *   textConfirm="Excluir"
+ *   textCancel="Cancelar"
+ *   fnConfirm={handleDelete}
+ *   fnCancel={handleCancel}
+ *   onClose={handleClose}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Dialog
+ *   show={showDialog}
+ *   title="Informação"
+ *   onClose={() => setShowDialog(false)}
+ * >
+ *   <p>Conteúdo customizado do dialog</p>
+ * </Dialog>
+ * ```
+ */
+interface DialogProps extends BaseProps {
+    /** Conteúdo customizado do dialog */
     children?: ReactNode;
-    /** Se o Dialog está visível */
+    /** Define se o dialog está visível */
     show: boolean;
-    /** Título exibido no cabeçalho do Dialog (obrigatório) */
+    /** Título exibido no cabeçalho do dialog */
     title: string;
-    /** Texto do corpo do Dialog */
+    /** Texto ou conteúdo do corpo do dialog */
     text?: ReactNode;
     /** Texto do botão de confirmação */
     textConfirm?: string;
     /** Texto do botão de cancelamento */
     textCancel?: string;
-    /** Função chamada ao confirmar */
+    /** Callback executado ao confirmar: () => void */
     fnConfirm?: () => void;
-    /** Função chamada ao cancelar */
+    /** Callback executado ao cancelar: () => void */
     fnCancel?: () => void;
-    /** Função chamada ao fechar o Dialog */
+    /** Callback executado ao fechar o dialog: () => void */
     onClose?: () => void;
-    /** ID opcional para o Dialog */
-    id?: string;
-    /** Classe CSS opcional */
-    className?: string;
 }
 
 declare const MemoizedDialog: React__default.NamedExoticComponent<DialogProps>;
 
-interface DrawerProps {
-    /** Conteúdo do Drawer */
+/**
+ * Props do componente Drawer
+ * @example
+ * ```tsx
+ * <Drawer
+ *   isOpen={isDrawerOpen}
+ *   onClose={handleClose}
+ *   title="Menu"
+ * >
+ *   <nav>
+ *     <a href="/home">Home</a>
+ *     <a href="/about">Sobre</a>
+ *   </nav>
+ * </Drawer>
+ * ```
+ * @example
+ * ```tsx
+ * <Drawer
+ *   isOpen={showDrawer}
+ *   onClose={() => setShowDrawer(false)}
+ *   title="Configurações"
+ *   customWidth="400px"
+ *   closeOnOverlayClick={true}
+ *   closeOnEscape={true}
+ * >
+ *   <Settings />
+ * </Drawer>
+ * ```
+ */
+interface DrawerProps extends BaseProps {
+    /** Conteúdo a ser exibido dentro do drawer */
     children?: ReactNode;
-    /** Largura do Drawer (use design tokens quando possível) */
+    /** Largura customizada do drawer (ex: '400px', '50%') */
     customWidth?: string;
-    /** Callback quando o Drawer é fechado */
+    /** Callback executado ao fechar o drawer: () => void */
     onClose: () => void;
-    /** Título do Drawer */
+    /** Título exibido no cabeçalho do drawer */
     title?: string;
-    /** Determina se o drawer está aberto */
+    /** Define se o drawer está aberto */
     isOpen: boolean;
-    /** Callback quando o Drawer é aberto */
+    /** Callback executado ao abrir o drawer: () => void */
     onOpen?: () => void;
-    /** Classes CSS adicionais */
-    className?: string;
-    /** ID único do componente */
-    id?: string;
-    /** Se o drawer está desabilitado */
-    disabled?: boolean;
-    /** Callback chamado quando clica no overlay */
+    /** Callback executado ao clicar no overlay: () => void */
     onOverlayClick?: () => void;
-    /** Se deve fechar ao clicar no overlay */
+    /** Define se o drawer fecha ao clicar no overlay */
     closeOnOverlayClick?: boolean;
-    /** Se deve fechar ao pressionar ESC */
+    /** Define se o drawer fecha ao pressionar ESC */
     closeOnEscape?: boolean;
 }
 
@@ -254,52 +502,78 @@ interface DrawerProps {
  */
 declare const Drawer: React__default.FC<DrawerProps>;
 
+/**
+ * Representa um item individual do dropdown
+ */
 interface DropdownItem {
-    /** ID único do item (opcional, será gerado automaticamente se não fornecido) */
+    /** ID único do item (será gerado automaticamente se não fornecido) */
     id?: string;
     /** Texto principal do item */
     text: string;
     /** Texto secundário/descrição do item */
     subText?: string;
-    /** Ícone do item (React node) */
+    /** Ícone do item */
     icon?: React__default.ReactNode;
     /** Define se o item está desabilitado */
     disabled?: boolean;
 }
+/** Tipos de dropdown disponíveis */
 type DropdownType = 'text' | 'checkbox' | 'icon';
-interface DropdownProps {
-    /** Classes CSS adicionais */
-    className?: string;
-    /** Força posição do dropdown: 'top' abre para cima, 'bottom' abre para baixo. Se não especificado, usa detecção automática */
+/**
+ * Props do componente Dropdown
+ * @example
+ * ```tsx
+ * <Dropdown
+ *   items={[
+ *     { text: 'Opção 1', icon: <Icon1 /> },
+ *     { text: 'Opção 2', icon: <Icon2 /> }
+ *   ]}
+ *   type="text"
+ *   placeholder="Selecione uma opção"
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Dropdown
+ *   items={items}
+ *   type="checkbox"
+ *   applySearch={true}
+ *   onSelectionChange={(ids) => console.log(ids)}
+ *   defaultSelectedIds={['1', '2']}
+ *   maxHeight="300px"
+ * />
+ * ```
+ */
+interface DropdownProps extends BaseProps {
+    /** Força posição do dropdown: 'top' abre para cima, 'bottom' para baixo (detecção automática se não especificado) */
     position?: 'top' | 'bottom';
-    /** Array de itens para o dropdown - obrigatório */
+    /** Array de itens para o dropdown */
     items: DropdownItem[];
-    /** ID único do componente */
-    id?: string;
     /** Tipo do dropdown */
     type?: DropdownType;
     /** Habilita campo de busca */
     applySearch?: boolean;
     /** Placeholder do campo de busca */
     placeholder?: string;
-    /** Callback para mudanças na seleção */
+    /** Callback executado quando a seleção muda: (selectedIds) => void */
     onSelectionChange?: (selectedIds: string[]) => void;
-    /** Controla exibição do subtexto */
+    /** Controla exibição do subtexto dos itens */
     showSubText?: boolean;
     /** IDs dos itens selecionados por padrão */
     defaultSelectedIds?: string[];
-    /** Estado inicial dos itens selecionados (objeto com chave-valor) */
+    /** Estado inicial dos itens selecionados (objeto chave-valor) */
     initialItemsSelected?: Record<string, boolean>;
+    /** Largura do dropdown */
     width?: string | number;
+    /** Largura máxima do dropdown */
     maxWidth?: string | number;
+    /** Largura mínima do dropdown */
     minWidth?: string | number;
     /** Altura máxima do dropdown */
     maxHeight?: string | number;
-    /** Define se o componente esta sendo usado para filtro */
+    /** Define se o componente está sendo usado para filtro */
     filter?: boolean;
-    /**
-     * Configurações para paginação infinita
-     */
+    /** Configurações para paginação infinita */
     infiniteScroll?: {
         /** Status atual do carregamento */
         status: 'idle' | 'loading' | 'succeeded' | 'failed';
@@ -307,232 +581,452 @@ interface DropdownProps {
         page: number;
         /** Última página disponível */
         lastPage: number;
-        /** Callback para carregar próxima página */
+        /** Callback executado para carregar próxima página: () => void */
         onLoadMore: () => void;
-        /** Threshold para trigger (0-1) */
+        /** Threshold para trigger do scroll infinito (0-1) */
         threshold?: number;
-        /** Margem para trigger */
+        /** Margem para trigger do scroll infinito */
         rootMargin?: string;
-        /** Debug mode */
+        /** Modo de debug */
         debug?: boolean;
     };
 }
 
 declare const MemoizedDropdown: React__default.NamedExoticComponent<DropdownProps>;
 
-type FilterButtonVariant = 'filled' | 'outlined' | 'text';
-interface FilterProps {
-    /** Items para o dropdown */
+/**
+ * Props do componente Filter
+ * @example
+ * ```tsx
+ * <Filter
+ *   items={filterItems}
+ *   type="checkbox"
+ *   placeholder="Filtrar por categoria"
+ *   onApplyFilter={(ids) => handleFilter(ids)}
+ *   buttonText="Filtros"
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Filter
+ *   type="calendar"
+ *   selectedDate={selectedDate}
+ *   onDateSelect={handleDateSelect}
+ *   minDate={new Date('2024-01-01')}
+ *   locale="pt-br"
+ *   icon={<CalendarIcon />}
+ * />
+ * ```
+ */
+interface FilterProps extends BaseProps {
+    /** Array de itens para filtros do tipo dropdown */
     items?: DropdownItem[];
-    /** Tipo do dropdown */
+    /** Tipo do filtro (dropdown ou calendário) */
     type?: DropdownType | 'calendar';
-    /** IDs selecionados */
+    /** IDs dos itens selecionados */
     selectedIds?: string[];
-    /** Callback quando aplicar filtros */
+    /** Callback executado ao aplicar filtro: (selectedIds) => void */
     onApplyFilter?: (selectedIds: string[]) => void;
-    /** Placeholder do dropdown */
+    /** Placeholder do campo de busca */
     placeholder?: string;
-    /** Habilita busca no dropdown */
+    /** Habilita campo de busca no dropdown */
     enableSearch?: boolean;
-    /** Texto do botão do filtro */
+    /** Texto ou conteúdo do botão de filtro */
     buttonText?: string | ReactNode;
-    /** Ícone do botão */
+    /** Ícone do botão de filtro */
     icon?: ReactElement;
-    /** Variante do botão */
-    variant?: FilterButtonVariant;
-    /** Callback chamado quando o filtro é aberto */
+    /** Variante visual do botão */
+    variant?: Variant;
+    /** Callback executado ao abrir o filtro: () => void */
     onOpen?: () => void;
-    /** Callback chamado quando o filtro é fechado */
+    /** Callback executado ao fechar o filtro: () => void */
     onClose?: () => void;
-    /** Posição do dropdown */
-    position?: 'left' | 'right';
-    /** Se o filtro está desabilitado */
-    disabled?: boolean;
-    /** Classes CSS adicionais */
-    className?: string;
-    /** Data selecionada (quando type='calendar') */
+    /** Posição do dropdown em relação ao botão */
+    position?: Position;
+    /** Data selecionada (para tipo calendar) */
     selectedDate?: Date | null;
-    /** Callback quando data é selecionada */
+    /** Callback executado ao selecionar data: (date) => void */
     onDateSelect?: (date: Date) => void;
-    /** Callback para limpar data */
+    /** Callback executado ao limpar data: () => void */
     onClearDate?: () => void;
-    /** Data mínima permitida */
+    /** Data mínima selecionável (para tipo calendar) */
     minDate?: Date;
-    /** Data máxima permitida */
+    /** Data máxima selecionável (para tipo calendar) */
     maxDate?: Date;
-    /** Locale do calendar */
-    locale?: 'pt-br' | 'en-us';
+    /** Locale do calendário */
+    locale?: Locale;
 }
 
 declare const Filter: React__default.FC<FilterProps>;
 
+/** Variantes disponíveis para o ListItem */
 type ListItemVariant = 'text' | 'checkbox' | 'radio' | 'icon';
-interface ListItemProps {
-    /** ID único do componente */
-    id?: string;
-    /** Classes CSS customizadas */
-    className?: string;
+/**
+ * Props do componente ListItem
+ * @example
+ * ```tsx
+ * <ListItem
+ *   variant="text"
+ *   text="Item da lista"
+ *   subText="Descrição do item"
+ *   onClick={handleClick}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <ListItem
+ *   variant="checkbox"
+ *   text="Aceitar termos"
+ *   checked={isChecked}
+ *   onChange={setIsChecked}
+ *   disabled={false}
+ * />
+ * ```
+ */
+interface ListItemProps extends BaseProps {
     /** Variante do item da lista */
     variant?: ListItemVariant;
     /** Texto principal do item */
     text?: string;
-    /** Nome do input (para checkbox/radio) */
+    /** Nome do input (para variantes checkbox/radio) */
     name?: string;
-    /** Texto secundário/descrição */
+    /** Texto secundário/descrição do item */
     subText?: string;
-    /** Se o item está desabilitado */
-    disabled?: boolean;
-    /** Estado de checked (para checkbox/radio) */
+    /** Estado de checked (para variantes checkbox/radio) */
     checked?: boolean;
-    /** Estado de selecionado (para text/icon) */
+    /** Estado de selecionado (para variantes text/icon) */
     selected?: boolean;
-    /** Callback para clique no item */
-    onClick?: (event: React__default.MouseEvent<HTMLElement> | React__default.KeyboardEvent<HTMLElement>) => void;
-    /** Callback para mudança de estado */
+    /** Callback executado ao clicar no item: (event) => void */
+    onClick?: (event: React$1.MouseEvent<HTMLElement> | React$1.KeyboardEvent<HTMLElement>) => void;
+    /** Callback executado quando o estado muda: (checked) => void */
     onChange?: (checked: boolean) => void;
-    /** Ícone do item (para variant icon) */
-    icon?: React__default.ReactNode;
-    /** Valor do input (para checkbox/radio) */
+    /** Ícone do item (para variante icon) */
+    icon?: React$1.ReactNode;
+    /** Valor do input (para variantes checkbox/radio) */
     value?: string;
-    /** Se deve mostrar o subtexto */
+    /** Define se deve mostrar o subtexto */
     showSubText?: boolean;
     /** Estado de hover */
     hovered?: boolean;
 }
 
-/**
- * Componente ListItem do Zanthus Design System
- * Implementa item de lista unificado com variações text, checkbox, radio e icon
- * Segue padrões WCAG 2.1 AA para acessibilidade
- */
 declare const ListItem: React__default.FC<ListItemProps>;
 
+/**
+ * Representa um item do menu (suporta subitens aninhados)
+ */
 interface MenuItemProps {
+    /** ID único do item */
     id?: string;
+    /** Texto principal do item */
     text?: string;
+    /** Texto secundário/descrição do item */
     subText?: string;
+    /** Estado desabilitado do item */
     disabled?: boolean;
-    icon?: React.ReactNode;
+    /** Ícone do item */
+    icon?: React$1.ReactNode;
+    /** Subitens do menu (para menus aninhados) */
     children?: MenuItemProps[];
+    /** Valor do item */
     value?: string;
 }
-interface MenuProps {
+/**
+ * Props do componente Menu
+ * @example
+ * ```tsx
+ * <Menu
+ *   items={[
+ *     { id: '1', text: 'Perfil', icon: <UserIcon /> },
+ *     { id: '2', text: 'Configurações', icon: <SettingsIcon /> }
+ *   ]}
+ *   onItemSelect={(item) => handleSelect(item)}
+ * >
+ *   <Button>Menu</Button>
+ * </Menu>
+ * ```
+ * @example
+ * ```tsx
+ * <Menu
+ *   items={menuItems}
+ *   type="icon"
+ *   search={true}
+ *   enableInfiniteScroll={true}
+ *   onScrollEnd={loadMore}
+ *   maxHeight="400px"
+ *   align="end"
+ * />
+ * ```
+ */
+interface MenuProps extends BaseProps {
+    /** Array de itens do menu */
     items: MenuItemProps[];
+    /** Elemento trigger customizado para abrir o menu */
     children?: ReactElement;
+    /** Tipo de visualização do menu */
     type?: 'text' | 'icon';
-    className?: string;
+    /** Callback executado quando um item é selecionado: (item) => void */
     onItemSelect?: (items: MenuItemProps) => void;
+    /** Array de itens selecionados */
     selectedItems?: MenuItemProps[];
+    /** Habilita campo de busca */
     search?: boolean;
+    /** Alinhamento do menu */
     align?: 'start' | 'end' | 'center';
+    /** Altura máxima do menu */
     maxHeight?: number | string;
+    /** Habilita scroll infinito */
     enableInfiniteScroll?: boolean;
+    /** Callback executado ao chegar ao final do scroll: () => void */
     onScrollEnd?: () => void;
+    /** Estado de carregamento de mais itens */
     isLoadingMore?: boolean;
+    /** Habilita busca via API */
     enableApiSearch?: boolean;
+    /** Callback executado na busca via API: (searchTerm) => void */
     onApiSearch?: (searchTerm: string) => void;
+    /** Callback executado quando o menu abre/fecha: (open) => void */
     onOpenChange?: (open: boolean) => void;
 }
 
 declare const Menu: React__default.FC<MenuProps>;
 
-interface QuantityProps {
-    /** Valor padrão inicial */
+/**
+ * Props do componente Quantity
+ * @example
+ * ```tsx
+ * <Quantity
+ *   value={quantity}
+ *   onChange={setQuantity}
+ *   size="lg"
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Quantity
+ *   defaultValue={1}
+ *   decimal={true}
+ *   decimalPlaces={2}
+ *   step={0.5}
+ *   disabled={false}
+ * />
+ * ```
+ */
+interface QuantityProps extends BaseProps {
+    /** Valor inicial (modo não controlado) */
     defaultValue?: number;
-    /** Valor controlado externamente */
+    /** Valor atual (modo controlado) */
     value?: number;
-    /** Callback chamado quando o valor muda */
+    /** Callback executado quando o valor muda: (value) => void */
     onChange?: (value: number) => void;
-    /** Define se o componente está desabilitado */
-    disabled?: boolean;
-    /** Define se o valor do input será decimal ou inteiro */
+    /** Habilita entrada de valores decimais */
     decimal?: boolean;
-    /** Define o tamanho do componente */
-    size?: 'lg' | 'sm';
-    /** Define o número de casas decimais quando decimal for true */
+    /** Tamanho do componente */
+    size?: Size;
+    /** Número de casas decimais permitidas */
     decimalPlaces?: number;
+    /** Incremento/decremento ao clicar nos botões */
     step?: number;
-    id?: string;
-    /** ClassName adicional para customização */
-    className?: string;
 }
 
 declare const memorizedQuantity: React__default.NamedExoticComponent<QuantityProps>;
 
+/**
+ * Props de um item individual de rádio
+ */
 interface RadioProps {
+    /** ID único do elemento */
     id?: string | number;
+    /** Valor do radio button */
     value: string;
+    /** Label exibida ao lado do radio button */
     label: string;
+    /** Estado desabilitado do item */
     disabled?: boolean;
 }
-interface RadioGroupProps {
-    id?: string;
+/**
+ * Props do componente RadioGroup
+ * @example
+ * ```tsx
+ * <RadioGroup
+ *   items={[
+ *     { value: 'option1', label: 'Opção 1' },
+ *     { value: 'option2', label: 'Opção 2' }
+ *   ]}
+ *   onValueChange={(value) => setSelected(value)}
+ *   defaultValue="option1"
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <RadioGroup
+ *   items={options}
+ *   onValueChange={handleChange}
+ *   name="preference"
+ *   orientation="horizontal"
+ *   ariaLabel="Selecione sua preferência"
+ * />
+ * ```
+ */
+interface RadioGroupProps extends BaseProps {
+    /** Array de itens de rádio */
     items: RadioProps[];
+    /** Callback executado quando o valor muda: (value) => void */
     onValueChange?: (value: string) => void;
+    /** Valor inicial selecionado */
     defaultValue?: string;
+    /** Nome do grupo de radio buttons */
     name?: string;
+    /** Label acessível para leitores de tela */
     ariaLabel?: string;
+    /** Orientação do layout dos radio buttons */
     orientation?: "horizontal" | "vertical";
 }
 
 declare const Radio: React__default.FC<RadioGroupProps>;
 
-interface SearchProps {
+/**
+ * Props do componente Search
+ * @example
+ * ```tsx
+ * <Search
+ *   placeholder="Buscar..."
+ *   value={searchTerm}
+ *   onChange={(e) => setSearchTerm(e.target.value)}
+ *   onClear={() => setSearchTerm('')}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Search
+ *   placeholder="Pesquisar produtos"
+ *   disabled={isLoading}
+ *   onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
+ *   onFocus={handleFocus}
+ * />
+ * ```
+ */
+interface SearchProps extends BaseProps {
+    /** Placeholder do campo de busca */
     placeholder?: string;
-    disabled?: boolean;
+    /** Valor controlado do campo */
     value?: string;
-    onChange?: (e: React__default.ChangeEvent<HTMLInputElement>) => void;
-    onKeyDown?: (e: React__default.KeyboardEvent<HTMLInputElement>) => void;
-    onFocus?: (e: React__default.FocusEvent<HTMLInputElement>) => void;
-    onBlur?: (e: React__default.FocusEvent<HTMLInputElement>) => void;
+    /** Callback executado quando o valor muda: (e) => void */
+    onChange?: (e: React$1.ChangeEvent<HTMLInputElement>) => void;
+    /** Callback executado ao pressionar tecla: (e) => void */
+    onKeyDown?: (e: React$1.KeyboardEvent<HTMLInputElement>) => void;
+    /** Callback executado ao focar no campo: (e) => void */
+    onFocus?: (e: React$1.FocusEvent<HTMLInputElement>) => void;
+    /** Callback executado ao desfocar do campo: (e) => void */
+    onBlur?: (e: React$1.FocusEvent<HTMLInputElement>) => void;
+    /** Callback executado ao limpar o campo: () => void */
     onClear?: () => void;
-    onClick?: (e: React__default.MouseEvent<HTMLDivElement>) => void;
-    onMouseDown?: (e: React__default.MouseEvent<HTMLDivElement>) => void;
-    className?: string;
-    id?: string;
+    /** Callback executado ao clicar no componente: (e) => void */
+    onClick?: (e: React$1.MouseEvent<HTMLDivElement>) => void;
+    /** Callback executado ao pressionar mouse no componente: (e) => void */
+    onMouseDown?: (e: React$1.MouseEvent<HTMLDivElement>) => void;
+    /** ID para testes automatizados */
     'data-testid'?: string;
 }
 
 declare const Search: React__default.ForwardRefExoticComponent<SearchProps & React__default.RefAttributes<HTMLInputElement>>;
 
-interface SelectItemProps {
-    id?: string;
+/**
+ * Representa um item do select
+ */
+interface SelectItemProps extends BaseProps {
+    /** Texto principal do item */
     text: ReactNode;
+    /** Subtítulo ou descrição do item */
     subTitle?: ReactNode;
+    /** Ícone do item */
     icon?: ReactNode;
-    disabled?: boolean;
+    /** Valor do item */
     value: string;
+    /** Define se o item está selecionado */
     selected?: boolean;
+    /** Subitens do select (para selects aninhados) */
     children?: SelectItemProps[];
 }
+/** Variantes disponíveis para o Select */
 type SelectVariant = 'text' | 'icon' | 'checkbox';
-interface SelectProps {
+/**
+ * Props do componente Select
+ * @example
+ * ```tsx
+ * <Select
+ *   items={[
+ *     { value: '1', text: 'Opção 1' },
+ *     { value: '2', text: 'Opção 2' }
+ *   ]}
+ *   variant="text"
+ *   placeholder="Selecione uma opção"
+ *   onValueChange={(value) => console.log(value)}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Select
+ *   items={options}
+ *   variant="checkbox"
+ *   multiple={true}
+ *   search={true}
+ *   label="Selecione múltiplas opções"
+ *   helperText="Você pode selecionar mais de uma"
+ *   required={true}
+ * />
+ * ```
+ */
+interface SelectProps extends BaseProps {
+    /** Array de itens do select */
     items: SelectItemProps[];
+    /** Callback executado quando o valor muda: (value) => void */
     onValueChange?: (value: string | string[]) => void;
+    /** Callback executado quando o select abre/fecha: (open) => void */
     onOpenChange?: (open: boolean) => void;
+    /** Variante visual do select */
     variant: SelectVariant;
+    /** Define se o campo é obrigatório */
     required?: boolean;
+    /** Valor(es) selecionado(s) */
     value?: string | string[];
+    /** Habilita seleção múltipla */
     multiple?: boolean;
+    /** Placeholder do campo */
     placeholder?: string;
+    /** Habilita campo de busca */
     search?: boolean;
+    /** Label do campo */
     label?: string;
+    /** Texto de ajuda exibido abaixo do campo */
     helperText?: string;
+    /** Largura máxima do select */
     maxWidth?: number;
+    /** Mensagem de erro a ser exibida */
     errorMessage?: string;
-    disabled?: boolean;
-    className?: string;
+    /** Label acessível para leitores de tela */
     'aria-label'?: string;
+    /** ID para testes automatizados */
     'data-testid'?: string;
+    /** Habilita tooltip */
     tooltip?: boolean;
+    /** Texto do tooltip */
     tooltipText?: string;
-    side?: "top" | "right" | "bottom" | "left";
-    align?: "start" | "center" | "end";
+    /** Lado onde o dropdown abre */
+    side?: Side;
+    /** Alinhamento do dropdown */
+    align?: Align;
+    /** Habilita scroll infinito */
     enableInfiniteScroll?: boolean;
+    /** Callback executado ao chegar ao final do scroll: () => void */
     onScrollEnd?: () => void;
+    /** Estado de carregamento de mais itens */
     isLoadingMore?: boolean;
+    /** Habilita busca via API */
     enableApiSearch?: boolean;
+    /** Callback executado na busca via API: (term) => void */
     onApiSearch?: (term: string) => void;
+    /** Estado de busca em andamento */
     isSearching?: boolean;
 }
 
@@ -571,13 +1065,11 @@ interface TableColumn<T = TableRowData> {
  * Props do componente Table. Use genérico para autocomplete: `<Table<User>>`
  * @typeParam T - Tipo dos dados da linha
  */
-interface TableProps<T = TableRowData> {
+interface TableProps<T = TableRowData> extends BaseProps {
     /** Configuração das colunas */
     columns: TableColumn<T>[];
     /** Array de dados a serem exibidos */
     dataSource: T[];
-    /** Classe CSS customizada */
-    className?: string;
     /** Estado de carregamento */
     loading?: boolean;
     /** Configuração de seleção de linhas */
@@ -609,7 +1101,7 @@ interface TableProps<T = TableRowData> {
     };
 }
 
-declare const Table: <T extends TableRowData = TableRowData>({ columns, dataSource, className, loading, rowSelection, locale, onRow, }: TableProps<T>) => react_jsx_runtime.JSX.Element | null;
+declare const Table: <T extends TableRowData = TableRowData>({ columns, dataSource, className, loading, rowSelection, locale, onRow, ...rest }: TableProps<T>) => react_jsx_runtime.JSX.Element | null;
 
 interface BaseFilterItem {
     id?: string;
@@ -639,7 +1131,7 @@ interface CalendarFilterItem extends BaseFilterItem {
     placeholder?: string;
 }
 type FilterItem = CheckboxFilterItem | CalendarFilterItem;
-interface TableHeaderProps {
+interface TableHeaderProps extends React__default.HTMLAttributes<HTMLDivElement> {
     searchValue?: string;
     onSearchChange?: (value: string) => void;
     searchPlaceholder?: string;
@@ -653,67 +1145,116 @@ interface TableHeaderProps {
 }
 declare const TableHeader: React__default.FC<TableHeaderProps>;
 
-interface TablePaginationProps {
-    /** Página atual */
+interface TablePaginationProps extends React__default.HTMLAttributes<HTMLDivElement> {
     currentPage: number;
-    /** Total de itens */
     totalItems: number;
-    /** Itens por página */
     itemsPerPage: number;
-    /** Callback quando a página muda */
     onPageChange: (page: number) => void;
-    /** Callback quando itens por página muda */
     onItemsPerPageChange: (itemsPerPage: number) => void;
-    /** Opções disponíveis para itens por página */
     pageSizeOptions?: number[];
-    /** Desabilita a paginação */
     disabled?: boolean;
-    /** Classes CSS adicionais */
     className?: string;
 }
 declare const TablePagination: React__default.FC<TablePaginationProps>;
 
+/** Tipos de input suportados pelo TextField */
 type TextFieldType = 'text' | 'email' | 'password' | 'number' | 'tel' | 'url';
+/**
+ * Props do componente TextField
+ * @example
+ * ```tsx
+ * <TextField
+ *   label="Email"
+ *   type="email"
+ *   value={email}
+ *   onChange={setEmail}
+ *   placeholder="Digite seu email"
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <TextField
+ *   label="Senha"
+ *   type="password"
+ *   required
+ *   helperText="Mínimo 8 caracteres"
+ *   errorMessage={error}
+ *   tooltip={true}
+ *   tooltipText="Deve conter letras e números"
+ *   icon={<LockIcon />}
+ * />
+ * ```
+ */
 interface TextFieldProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value' | 'type'> {
-    /** Controlled value */
+    /** Valor controlado do campo */
     value?: string | number;
-    /** Change handler - receives string value */
+    /** Callback executado quando o valor muda: (value) => void */
     onChange?: (value: string) => void;
-    /** Label text */
+    /** Label do campo */
     label?: string;
-    /** Input type */
+    /** Tipo do input */
     type?: TextFieldType;
-    /** Helper text (shown below input) */
+    /** Texto de ajuda exibido abaixo do campo */
     helperText?: string;
-    /** Show tooltip with info icon */
+    /** Habilita tooltip */
     tooltip?: boolean;
-    /** Tooltip content */
+    /** Texto do tooltip */
     tooltipText?: string;
-    side?: "top" | "right" | "bottom" | "left";
-    align?: "start" | "center" | "end";
+    /** Lado onde o tooltip aparece */
+    side?: Side;
+    /** Alinhamento do tooltip */
+    align?: Align;
+    /** Mensagem de erro a ser exibida */
     errorMessage?: string;
-    /** Leading icon */
+    /** Ícone a ser exibido no campo */
     icon?: React__default.ReactNode;
 }
 
 declare const _default: React__default.NamedExoticComponent<TextFieldProps & React__default.RefAttributes<HTMLInputElement>>;
 
+/** Tipos de toast disponíveis */
 type ToastType = 'success' | 'alert' | 'info';
+/**
+ * Representa uma mensagem de toast
+ */
 interface ToastMessage {
+    /** ID único da mensagem */
     id: string;
+    /** Conteúdo da mensagem */
     message: string;
+    /** Tipo visual do toast */
     type: ToastType;
+    /** Define se o toast permanece até ser fechado manualmente */
     persistent?: boolean;
+    /** Duração em milissegundos antes de auto-fechar */
     duration?: number;
+    /** Timestamp de quando foi criado */
     timestamp: number;
 }
+/**
+ * Opções para exibição do toast
+ */
 interface ToastOptions {
+    /** Define se o toast permanece até ser fechado manualmente */
     persistent?: boolean;
+    /** Duração em milissegundos antes de auto-fechar */
     duration?: number;
 }
+/**
+ * Contexto do sistema de toasts
+ * @example
+ * ```tsx
+ * const { showToast, hideToast } = useToast();
+ *
+ * showToast('Operação realizada com sucesso!', 'success');
+ * ```
+ */
 interface ToastContextType {
+    /** Exibe um toast e retorna seu ID: (message, type?, options?) => string */
     showToast: (message: string, type?: ToastType, options?: ToastOptions) => string;
+    /** Oculta um toast específico: (id) => void */
     hideToast: (id: string) => void;
+    /** Oculta todos os toasts: () => void */
     hideAllToasts: () => void;
 }
 
@@ -724,46 +1265,115 @@ interface ToastProviderProps {
 declare const ToastProvider: React__default.FC<ToastProviderProps>;
 declare const useToast: () => ToastContextType;
 
-interface TooltipProps {
-    id?: string;
+/**
+ * Props do componente Tooltip
+ * @example
+ * ```tsx
+ * <Tooltip text="Informação adicional">
+ *   <Button>Hover me</Button>
+ * </Tooltip>
+ * ```
+ * @example
+ * ```tsx
+ * <Tooltip
+ *   text="Clique para mais detalhes"
+ *   side="top"
+ *   align="center"
+ *   sideOffset={10}
+ *   maxWidth={300}
+ * >
+ *   <IconButton icon={<InfoIcon />} />
+ * </Tooltip>
+ * ```
+ */
+interface TooltipProps extends BaseProps {
+    /** Conteúdo do tooltip */
     text: React__default.ReactNode;
-    side?: "top" | "right" | "bottom" | "left";
-    align?: "start" | "center" | "end";
+    /** Lado onde o tooltip aparece em relação ao elemento */
+    side?: Side;
+    /** Alinhamento do tooltip */
+    align?: Align;
+    /** Distância em pixels do lado do elemento */
     sideOffset?: number;
+    /** Deslocamento em pixels no eixo de alinhamento */
     alignOffset?: number;
+    /** Largura máxima do tooltip em pixels */
     maxWidth?: number;
+    /** Elemento que dispara o tooltip ao hover */
     children: React__default.ReactNode;
 }
 
 declare const Tooltip: React__default.FC<TooltipProps>;
 
-interface SwitchProps {
+/**
+ * Props do componente Switch
+ * @example
+ * ```tsx
+ * <Switch
+ *   checked={isEnabled}
+ *   onCheckedChange={setIsEnabled}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <Switch
+ *   defaultChecked={true}
+ *   disabled={isLoading}
+ *   onCheckedChange={(checked) => console.log(checked)}
+ *   name="notifications"
+ * />
+ * ```
+ */
+interface SwitchProps extends BaseProps {
+    /** Estado inicial (modo não controlado) */
     defaultChecked?: boolean;
-    disabled?: boolean;
+    /** Callback executado quando o estado muda: (checked) => void */
     onCheckedChange?: (checked: boolean) => void;
+    /** Nome do input */
     name?: string;
+    /** Valor do input */
     value?: string;
+    /** Estado atual (modo controlado) */
     checked?: boolean;
 }
 
 declare const Switch: React$1.FC<SwitchProps>;
 
+/** Tipos de entrada suportados pelo VerificationCode */
 type InputType = 'numeric' | 'alpha' | 'alphanumeric';
-interface VerificationCodeProps {
-    /** Define o número de dígitos do código (padrão: 6) */
+/**
+ * Props do componente VerificationCode
+ * @example
+ * ```tsx
+ * <VerificationCode
+ *   length={6}
+ *   inputType="numeric"
+ *   onComplete={(code) => handleVerification(code)}
+ * />
+ * ```
+ * @example
+ * ```tsx
+ * <VerificationCode
+ *   length={4}
+ *   inputType="alphanumeric"
+ *   onComplete={handleCode}
+ *   hasError={!!error}
+ *   errorMessage="Código inválido"
+ *   disabled={isVerifying}
+ * />
+ * ```
+ */
+interface VerificationCodeProps extends BaseProps {
+    /** Número de dígitos do código (padrão: 6) */
     length?: number;
-    /** Define tipo de entrada: números, letras ou alfanumérico (padrão: "numeric") */
+    /** Tipo de entrada permitida (padrão: "numeric") */
     inputType?: InputType;
-    /** Callback chamado quando todos os campos são preenchidos */
+    /** Callback executado quando todos os campos são preenchidos: (value) => void */
     onComplete?: (value: string) => void;
-    /** Indica se o campo está em estado de erro */
+    /** Define se o campo está em estado de erro */
     hasError?: boolean;
     /** Mensagem de erro exibida abaixo do componente */
     errorMessage?: string;
-    /** Define se o componente deve estar desabilitado */
-    disabled?: boolean;
-    /** Classe CSS adicional para estilização externa */
-    className?: string;
     /** Props adicionais passadas para os inputs */
     [key: string]: any;
 }
@@ -883,4 +1493,4 @@ declare function useInfiniteScroll({ status, page, lastPage, onLoadMore, thresho
 declare const normalizeText: (text: React.ReactNode) => string;
 
 export { Avatar, Badge, Button, MemoizedCalendar as Calendar, Callout, Checkbox, MemoizedChips as Chips, Container, _default$1 as DatePicker, MemoizedDialog as Dialog, Drawer, MemoizedDropdown as Dropdown, Filter, ListItem, Menu, memorizedQuantity as Quantity, Radio, Search, Select, Switch, Table, TableHeader, TablePagination, _default as TextField, ToastProvider as Toast, ToastProvider, Tooltip, VerificationCode, normalizeText, useApiSimulation, useInfiniteScroll, useToast };
-export type { AvatarProps, BadgeProps, ButtonProps, CalendarItem, CalendarProps, CalloutProps, CheckboxProps, ChipsProps, ContainerProps, DateFormat, DatePickerProps, DayItem, DialogProps, DrawerProps, DropdownItem, DropdownProps, DropdownType, EmptyItem, FilterItem, FilterProps, ListItemProps, Locale, MenuProps, QuantityProps, RadioGroupProps, RadioProps, SearchProps, SelectProps, SwitchProps, TableHeaderProps, TablePaginationProps, TableProps, TextFieldProps, ToastContextType, ToastMessage, ToastOptions, ToastType, TooltipProps, VerificationCodeProps, YearItem };
+export type { AvatarProps, BadgeProps, ButtonProps, CalendarItem, CalendarProps, CalloutProps, CheckboxProps, ChipsProps, ContainerProps, DateFormat, DatePickerProps, DayItem, DialogProps, DrawerProps, DropdownItem, DropdownProps, DropdownType, EmptyItem, FilterItem, FilterProps, ListItemProps, MenuProps, QuantityProps, RadioGroupProps, RadioProps, SearchProps, SelectProps, SwitchProps, TableHeaderProps, TablePaginationProps, TableProps, TextFieldProps, ToastContextType, ToastMessage, ToastOptions, ToastType, TooltipProps, VerificationCodeProps, YearItem };