@celke/kole-react 0.0.0-stage → 0.1.0

package/dist/components/Paginacao/Paginacao.d.ts

@@ -0,0 +1,13 @@
+export interface PaginacaoProps {
+    total: number;
+    /** Página atual, começando em 1. */
+    pagina: number;
+    tamanho: number;
+    tamanhoOpcoes?: number[];
+    aoMudarPagina: (pagina: number) => void;
+    aoMudarTamanho?: (tamanho: number) => void;
+    /** Sem borda própria (dentro do card da tabela). */
+    embutida?: boolean;
+    className?: string;
+}
+export declare function Paginacao({ total, pagina, tamanho, tamanhoOpcoes, aoMudarPagina, aoMudarTamanho, embutida, className, }: PaginacaoProps): import("react").JSX.Element;

package/dist/components/Picklist/Picklist.d.ts

@@ -0,0 +1,28 @@
+import { type ReactNode } from 'react';
+import { type PicklistValor } from '../../utils/picklist.js';
+import { type CampoBaseProps } from '../Campo/Campo.js';
+export interface PicklistProps<T> extends Omit<CampoBaseProps, 'variante'> {
+    valor?: PicklistValor<T>;
+    aoMudar?: (valor: PicklistValor<T>) => void;
+    rotuloFonte?: string;
+    rotuloAlvo?: string;
+    /** Texto do item (linha, filtro e anúncios). Obrigatório para objetos. */
+    paraRotulo?: (item: T) => string;
+    /** Linha customizada; padrão = `paraRotulo(item)`. */
+    renderItem?: (item: T) => ReactNode;
+    /** Campo de busca no topo de cada lista. */
+    filtro?: boolean;
+    /** Arrastar e soltar como caminho ADICIONAL (o teclado sempre funciona). */
+    dragdrop?: boolean;
+    /** Reordenar dentro da lista (Alt + setas, ou arrastando). */
+    reordenar?: boolean;
+    alturaLista?: string;
+    disabled?: boolean;
+    id?: string;
+}
+/**
+ * Transferência entre duas listas (disponíveis × selecionados). Teclado:
+ * setas movem o foco, Espaço marca, Enter transfere, Alt+setas reordena;
+ * duplo clique também transfere.
+ */
+export declare function Picklist<T>({ rotulo, dica, erro, aviso, obrigatorio, className, id: idExterno, valor: valorBruto, aoMudar, rotuloFonte, rotuloAlvo, paraRotulo, renderItem, filtro, dragdrop, reordenar, alturaLista, disabled, }: PicklistProps<T>): import("react").JSX.Element;

package/dist/components/Placa/Placa.d.ts

@@ -0,0 +1,9 @@
+export interface PlacaProps {
+    /** Número da placa (ex.: `QBX-7H42`) — sempre exibido em maiúsculas. */
+    numero: string;
+    /** UF da faixa superior (padrão: PR). */
+    uf?: string;
+    className?: string;
+}
+/** Arte da placa de veículo (faixa BRASIL/UF + número), só leitura. */
+export declare function Placa({ numero, uf, className }: PlacaProps): import("react").JSX.Element;

package/dist/components/Preferencias/Preferencias.d.ts

@@ -0,0 +1,26 @@
+import { type ReactNode } from 'react';
+export type Tema = 'claro' | 'escuro';
+export type Densidade = 'compacta' | 'confortavel' | 'espacosa';
+export interface Preferencias {
+    tema: Tema;
+    escuro: boolean;
+    densidade: Densidade;
+    definirTema: (t: Tema) => void;
+    alternarTema: () => void;
+    definirDensidade: (d: Densidade) => void;
+}
+export interface ProvedorPreferenciasProps {
+    children: ReactNode;
+    temaInicial?: Tema;
+    densidadeInicial?: Densidade;
+}
+/**
+ * Tema (claro/escuro) e densidade, lembrados no navegador. Aplica
+ * `data-theme` no <html> e a classe de densidade no <body>.
+ */
+export declare function ProvedorPreferencias({ children, temaInicial, densidadeInicial }: ProvedorPreferenciasProps): import("react").JSX.Element;
+export declare function usePreferencias(): Preferencias;
+/** Tudo que a biblioteca precisa na raiz do app: preferências, toasts e confirmação. */
+export declare function ProvedorUi({ children, ...prefs }: ProvedorPreferenciasProps): import("react").JSX.Element;
+/** Igual a `usePreferencias`, mas devolve `null` fora do provedor. */
+export declare function usePreferenciasOpcional(): Preferencias | null;

package/dist/components/Progresso/Progresso.d.ts

@@ -0,0 +1,42 @@
+export type CorProgresso = 'pri' | 'secundario' | 'ok' | 'warn' | 'err' | 'info' | 'destaque' | 'escuro';
+export interface SegmentoProgresso {
+    valor: number;
+    cor?: CorProgresso;
+    /** Nome do segmento (leitor de tela e texto `dentro`). */
+    rotulo?: string;
+}
+export interface ProgressoProps {
+    /** Valor atual (0 a `max`). Ignorado quando há `segmentos`. */
+    valor?: number;
+    max?: number;
+    /** Várias barras empilhadas na mesma trilha. */
+    segmentos?: SegmentoProgresso[];
+    cor?: CorProgresso;
+    /** `listrado` = faixas diagonais · `gradiente` = clareia no começo. */
+    aparencia?: 'solido' | 'listrado' | 'gradiente';
+    /** Faixas em movimento (com `listrado`). */
+    animado?: boolean;
+    /** A barra cresce do zero ao aparecer. */
+    entrada?: boolean;
+    altura?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /**
+     * Onde mostrar o valor: `dentro` da barra · no `fim` da linha · `balao`
+     * acima da ponta · `pilula` na ponta da barra.
+     */
+    mostrarValor?: 'nenhum' | 'dentro' | 'fim' | 'balao' | 'pilula';
+    /** Bolinha na ponta da barra. */
+    marcador?: boolean;
+    /** Pontos de marco ao longo da trilha (valores, ex.: `[25, 50, 75]`). */
+    marcos?: number[];
+    /** Trilha com o tom claro da cor. */
+    trilhaColorida?: boolean;
+    /** Selo colorido no começo da barra (ex.: "Celulares"). */
+    etiqueta?: string;
+    /** Nome acessível (ex.: "Envio do arquivo"). */
+    rotulo?: string;
+    /** Formata o valor exibido (padrão: porcentagem). */
+    formatar?: (valor: number, max: number) => string;
+    className?: string;
+}
+/** Barra de progresso: simples, listrada, em gradiente, com marcos, balão de valor ou várias barras. */
+export declare function Progresso({ valor, max, segmentos, cor, aparencia, animado, entrada, altura, mostrarValor, marcador, marcos, trilhaColorida, etiqueta, rotulo, formatar, className, }: ProgressoProps): import("react").JSX.Element;

package/dist/components/QuadroArrastavel/QuadroArrastavel.d.ts

@@ -0,0 +1,27 @@
+import { type ReactNode } from 'react';
+export interface ColunaArrastavel<T> {
+    id: string;
+    /** Nome da coluna (anunciado ao mover pelo teclado). */
+    titulo?: string;
+    itens: T[];
+}
+export interface QuadroArrastavelProps<T extends {
+    id: string;
+}> {
+    colunas: ColunaArrastavel<T>[];
+    /** Recebe as colunas já reordenadas. */
+    aoMudar: (colunas: ColunaArrastavel<T>[]) => void;
+    /** Desenha o item; ponha a `alca` (botão de arrastar) onde quiser, ex.: no cabeçalho do card. */
+    renderItem: (item: T, alca: ReactNode) => ReactNode;
+    /** Nome de cada item para leitor de tela (ex.: o título do card). */
+    nomeItem: (item: T) => string;
+    className?: string;
+}
+/**
+ * Colunas de itens (cards) que se reordenam arrastando, entre colunas
+ * inclusive. Mouse, toque e teclado: na alça, Espaço pega/solta, setas movem,
+ * Esc devolve ao lugar de origem.
+ */
+export declare function QuadroArrastavel<T extends {
+    id: string;
+}>({ colunas, aoMudar, renderItem, nomeItem, className }: QuadroArrastavelProps<T>): import("react").JSX.Element;

package/dist/components/Recolhivel/Recolhivel.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from 'react';
+export interface RecolhivelProps {
+    aberto: boolean;
+    children: ReactNode;
+    /** `vertical` (padrão) anima a altura; `horizontal`, a largura. */
+    orientacao?: 'vertical' | 'horizontal';
+    id?: string;
+    className?: string;
+}
+/**
+ * Mostra/esconde o conteúdo com animação. Fechado, o conteúdo sai da ordem de
+ * foco e do leitor de tela (`inert`).
+ */
+export declare function Recolhivel({ aberto, children, orientacao, id, className }: RecolhivelProps): import("react").JSX.Element;

package/dist/components/Referencias/Referencias.d.ts

@@ -0,0 +1,24 @@
+import { type ReactNode } from 'react';
+export interface ItemReferencia {
+    id: string;
+    /** Nome da fonte (documento, página, artigo…). */
+    titulo: ReactNode;
+    /** Linha curta ao lado do título (ex.: "Página 3"). */
+    detalhe?: ReactNode;
+    /** Trecho citado; aparece truncado, com opção de expandir. */
+    trecho?: ReactNode;
+    /** Torna o título um link (abre em nova aba). */
+    href?: string;
+}
+export interface ReferenciasProps {
+    itens: ItemReferencia[];
+    /** Começa aberta. */
+    abertoInicial?: boolean;
+    /** Texto do botão que abre a lista. Padrão: "3 fontes". */
+    rotulo?: (quantidade: number) => ReactNode;
+    rotuloMostrarMais?: string;
+    rotuloMostrarMenos?: string;
+    className?: string;
+}
+/** Lista recolhível de fontes/citações de uma mensagem (vai no `rodape` da `Mensagem`). */
+export declare function Referencias({ itens, abertoInicial, rotulo, rotuloMostrarMais, rotuloMostrarMenos, className, }: ReferenciasProps): import("react").JSX.Element | null;

package/dist/components/Skeleton/Skeleton.d.ts

@@ -0,0 +1,8 @@
+export interface SkeletonProps {
+    largura?: string;
+    altura?: string;
+    formato?: 'retangulo' | 'circulo';
+    className?: string;
+}
+/** Silhueta de carregamento. */
+export declare function Skeleton({ largura, altura, formato, className }: SkeletonProps): import("react").JSX.Element;

package/dist/components/Status/Status.d.ts

@@ -0,0 +1,10 @@
+import { type IconeProp } from '../../utils/Icone.js';
+import type { Severidade } from '../../utils/tipos.js';
+export interface StatusProps {
+    rotulo: string;
+    severidade?: Severidade;
+    icone?: IconeProp;
+    className?: string;
+}
+/** Selo de situação (Ativo, Pendente, Cancelado…). */
+export declare function Status({ rotulo, severidade, icone, className }: StatusProps): import("react").JSX.Element;

package/dist/components/Tabela/Tabela.d.ts

@@ -0,0 +1,57 @@
+import { type Key, type ReactNode } from 'react';
+import { lerCampo } from '../../utils/texto.js';
+import type { Severidade } from '../../utils/tipos.js';
+import { type PaginacaoProps } from '../Paginacao/Paginacao.js';
+export interface Coluna<T> {
+    /** Chave do campo no registro (aceita caminho com ponto: `endereco.cidade`). */
+    campo: string;
+    rotulo: string;
+    ordenavel?: boolean;
+    alinhamento?: 'esquerda' | 'centro' | 'direita';
+    /** Texto forte (coluna principal). */
+    destaque?: boolean;
+    maiuscula?: boolean;
+    largura?: string;
+    /** Formata o valor cru da célula. */
+    formato?: (valor: unknown, linha: T) => ReactNode;
+    /** Renderiza a célula como selo de situação. */
+    severidade?: (linha: T) => Severidade;
+    /** Célula totalmente customizada. */
+    render?: (linha: T) => ReactNode;
+}
+export interface Ordenacao {
+    campo: string;
+    direcao: 'asc' | 'desc';
+}
+export interface TabelaProps<T> {
+    colunas: Coluna<T>[];
+    registros: T[];
+    /** Chave de cada linha (padrão: `linha.id` ou o índice). */
+    chave?: (linha: T, indice: number) => Key;
+    /** Botões de ação por linha (use `<AcaoLinha>`), na última coluna. */
+    acoes?: (linha: T) => ReactNode;
+    aparencia?: 'listrada' | 'grade';
+    rotulo?: string;
+    /** Primeira carga: silhuetas no lugar das linhas. */
+    carregando?: boolean;
+    /** Recarga (paginar/ordenar): mantém a tabela esmaecida. */
+    atualizando?: boolean;
+    erro?: string | boolean;
+    aoRecarregar?: () => void;
+    vazioTitulo?: string;
+    vazioDescricao?: string;
+    vazioIcone?: string;
+    vazioAcoes?: ReactNode;
+    ordenacao?: Ordenacao | null;
+    aoOrdenar?: (campo: string) => void;
+    selecao?: 'unica' | 'multipla';
+    selecionados?: Key[];
+    aoMudarSelecao?: (chaves: Key[]) => void;
+    aoClicarLinha?: (linha: T) => void;
+    /** Paginação controlada (servidor). */
+    paginacao?: Omit<PaginacaoProps, 'embutida' | 'className'>;
+    className?: string;
+}
+/** Mantido por compatibilidade: é o `lerCampo` dos utilitários. */
+export declare const valorDoCampo: typeof lerCampo;
+export declare function Tabela<T>({ colunas, registros, chave, acoes, aparencia, rotulo, carregando, atualizando, erro, aoRecarregar, vazioTitulo, vazioDescricao, vazioIcone, vazioAcoes, ordenacao, aoOrdenar, selecao, selecionados, aoMudarSelecao, aoClicarLinha, paginacao, className, }: TabelaProps<T>): import("react").JSX.Element;

package/dist/components/TelaErro/TelaErro.d.ts

@@ -0,0 +1,25 @@
+import type { ReactNode } from 'react';
+import { type IconeProp } from '../../utils/Icone.js';
+import type { Marca } from '../Estrutura/Estrutura.js';
+export interface TelaErroProps {
+    /** Código grande em destaque (ex.: 404). */
+    codigo: string | number;
+    /** Frase principal (vira o `h1` da página). */
+    titulo: string;
+    descricao?: ReactNode;
+    /** Ícone no selo acima do código. */
+    icone?: IconeProp;
+    /** Cor do código: `pri` (padrão) · `warn` · `err`. */
+    cor?: 'pri' | 'warn' | 'err';
+    /** Botões (voltar, tentar de novo, entrar…). */
+    acoes?: ReactNode;
+    /** Informação técnica miúda (ex.: código do incidente para o suporte). */
+    detalhe?: ReactNode;
+    /** Marca no topo, como na tela de login. */
+    marca?: Marca;
+    /** `cheia` (padrão) ocupa a janela; `contida` cabe dentro da moldura do sistema. */
+    tela?: 'cheia' | 'contida';
+    className?: string;
+}
+/** Página de erro (401, 404, 500…) com código em destaque e caminhos de saída. */
+export declare function TelaErro({ codigo, titulo, descricao, icone, cor, acoes, detalhe, marca, tela, className }: TelaErroProps): import("react").JSX.Element;

package/dist/components/TelaLogin/TelaLogin.d.ts

@@ -0,0 +1,66 @@
+import { type ReactNode } from 'react';
+import { type IconeProp } from '../../utils/Icone.js';
+import type { Marca } from '../Estrutura/Estrutura.js';
+export interface CredenciaisLogin {
+    usuario: string;
+    senha: string;
+}
+/**
+ * Resposta do `aoEntrar`: nada = entrou · `'codigo'` = pedir o código de
+ * verificação em duas etapas · `{ erro }` = mensagem para o usuário.
+ */
+export type ResultadoLogin = void | 'codigo' | {
+    erro: string;
+};
+/** Painel institucional do modelo `conteudo`. */
+export interface ApresentacaoLogin {
+    /** Chamada em caixa alta acima do título (ex.: "Plataforma comercial"). */
+    chamada?: string;
+    titulo: string;
+    descricao?: ReactNode;
+    /** Até 3–4 pontos fortes do sistema, cada um com ícone. */
+    destaques?: {
+        icone: IconeProp;
+        texto: string;
+    }[];
+    /** Conteúdo livre abaixo dos destaques (ilustração, gráfico, depoimento). */
+    extra?: ReactNode;
+}
+export interface TelaLoginProps {
+    marca: Marca;
+    /**
+     * `conteudo` (padrão) = apresentação do sistema à esquerda + cartão do
+     * formulário · `formulario` = só o cartão, centralizado.
+     */
+    modelo?: 'conteudo' | 'formulario';
+    /** Conteúdo da lateral esquerda no modelo `conteudo` (some em telas estreitas). */
+    apresentacao?: ApresentacaoLogin;
+    /** Selo de ambiente sob o subtítulo (Homologação, Treinamento…). Produção: omita. */
+    ambiente?: {
+        rotulo: string;
+        severidade?: 'warn' | 'err' | 'info' | 'neutral';
+    };
+    /** Como o usuário se identifica (padrão: CPF). */
+    identificador?: 'cpf' | 'email' | 'usuario';
+    titulo?: string;
+    descricao?: string;
+    aoEntrar: (credenciais: CredenciaisLogin) => Promise<ResultadoLogin> | ResultadoLogin;
+    /** Confirma o código de 6 dígitos; devolva `{ erro }` para manter o diálogo aberto. */
+    aoConfirmarCodigo?: (codigo: string, confiarDispositivo: boolean) => Promise<void | {
+        erro: string;
+    }> | void | {
+        erro: string;
+    };
+    /** Mostra "Confiar neste dispositivo" no diálogo do código (padrão: sim). */
+    confiarDispositivo?: boolean;
+    /** Onde o usuário encontra o código (ex.: "Abra o aplicativo autenticador no celular…"). */
+    instrucaoCodigo?: string;
+    /** Link sob a senha, alinhado à direita (ex.: "Esqueci minha senha"). */
+    linkSenha?: ReactNode;
+    /** Links ou botões abaixo do Entrar. */
+    acoes?: ReactNode;
+    rodape?: ReactNode;
+    className?: string;
+}
+/** Tela de login institucional: imagem + painel com identificação, senha e 2FA. */
+export declare function TelaLogin({ marca, modelo, apresentacao, ambiente, identificador, titulo, descricao, aoEntrar, aoConfirmarCodigo, confiarDispositivo, instrucaoCodigo, linkSenha, acoes, rodape, className, }: TelaLoginProps): import("react").JSX.Element;

package/dist/components/Toast/Toast.d.ts

@@ -0,0 +1,62 @@
+import { type IconeProp } from '../../utils/Icone.js';
+import { type HTMLAttributes, type ReactNode } from 'react';
+import type { Severidade } from '../../utils/tipos.js';
+type SevToast = Exclude<Severidade, 'neutral'>;
+export type CorToast = 'pri' | 'secundario' | 'ok' | 'warn' | 'err' | 'info' | 'destaque' | 'escuro';
+/** `suave` (padrão) = fundo claro da cor · `padrao` = fundo neutro, ícone na cor · `solido` · `translucido` = vidro fosco. */
+export type AparenciaToast = 'suave' | 'padrao' | 'solido' | 'translucido';
+export type PosicaoToast = 'topo-esquerda' | 'topo-centro' | 'topo-direita' | 'meio-esquerda' | 'meio-centro' | 'meio-direita' | 'base-esquerda' | 'base-centro' | 'base-direita';
+export interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    /** Dá o ícone e a cor padrão. */
+    severidade?: SevToast;
+    /** Cor no lugar da que vem da severidade. */
+    cor?: CorToast;
+    aparencia?: AparenciaToast;
+    titulo?: ReactNode;
+    detalhe?: ReactNode;
+    /** Ícone no lugar do da severidade; `false` tira. */
+    icone?: IconeProp | false;
+    /** `cabecalho` = linha de cima com ícone, título, tempo e ×; o detalhe vai embaixo. */
+    modelo?: 'compacto' | 'cabecalho';
+    /** Quando aconteceu (ex.: "há 11 min"), no modelo com cabeçalho. */
+    tempo?: string;
+    /** Botões ou links abaixo do texto. */
+    acoes?: ReactNode;
+    /** Mostra o × e é chamado ao fechar. */
+    aoFechar?: () => void;
+}
+/**
+ * O cartão de aviso. Aparece sozinho via `useToast()`; use direto para um
+ * aviso fixo na página.
+ */
+export declare function Toast({ severidade, cor, aparencia, titulo, detalhe, icone, modelo, tempo, acoes, aoFechar, children, className, ...resto }: ToastProps): import("react").JSX.Element;
+export interface OpcoesToast {
+    severidade?: SevToast;
+    titulo: string;
+    detalhe?: string;
+    /** ms até sumir sozinho. 0 = só fecha no ×. */
+    duracao?: number;
+    /** Canto/lado da tela. Padrão: `topo-direita`. */
+    posicao?: PosicaoToast;
+    cor?: CorToast;
+    aparencia?: AparenciaToast;
+    /** Ícone no lugar do da severidade; `false` tira. */
+    icone?: IconeProp | false;
+}
+export interface ApiToast {
+    mostrar: (o: OpcoesToast) => number;
+    ok: (titulo: string, detalhe?: string) => number;
+    info: (titulo: string, detalhe?: string) => number;
+    warn: (titulo: string, detalhe?: string) => number;
+    err: (titulo: string, detalhe?: string) => number;
+    fechar: (id: number) => void;
+}
+/** Fornece `useToast()` e renderiza a pilha. Já incluso no `ProvedorUi`. */
+export declare function ProvedorToast({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** `const toast = useToast(); toast.ok('Salvo com sucesso');` */
+export declare function useToast(): ApiToast;
+/** Igual a `useToast`, mas devolve `null` fora do provedor. */
+export declare function useToastOpcional(): ApiToast | null;
+export {};

package/dist/components/Trilha/Trilha.d.ts

@@ -0,0 +1,60 @@
+import { type ReactNode } from 'react';
+import { type IconeProp } from '../../utils/Icone.js';
+/** Um passo da trilha. Sem `rota`, aparece como texto (grupo do menu). */
+export interface ItemTrilha {
+    rotulo: string;
+    rota?: string;
+    icone?: IconeProp;
+}
+/** Separadores prontos, ou qualquer nó React (ex.: `'|'` ou um ícone). */
+export type SeparadorTrilha = 'chevron' | 'barra' | 'duplo' | 'seta' | 'til' | 'ponto' | ReactNode;
+/** Aparência da trilha — pode valer para o sistema todo (`Estrutura.modeloTrilha`). */
+export interface ModeloTrilha {
+    /** Padrão: `chevron` (›). */
+    separador?: SeparadorTrilha;
+    /** Ícones: só no Início (padrão), em todos os passos que têm, ou nenhum. */
+    icones?: 'inicio' | 'todos' | 'nenhum';
+    /** `simples` (padrão) · `fundo` = faixa com fundo suave. */
+    aparencia?: 'simples' | 'fundo';
+}
+interface CtxTrilha {
+    /** Caminho da página atual, calculado do menu (já com "Início"). */
+    itens: ItemTrilha[];
+    /** Desenha um link pelo mesmo caminho dos links do menu (renderLink/aoNavegar). */
+    link: (rota: string, conteudo: ReactNode, className: string) => ReactNode;
+    /** Modelo padrão do sistema. */
+    modelo?: ModeloTrilha;
+}
+export declare const ProvedorTrilha: import("react").Provider<CtxTrilha | null>;
+/** Caminho calculado pela `Estrutura` para a rota atual (vazio fora dela). */
+export declare function useTrilha(): ItemTrilha[];
+interface NoMenu {
+    rotulo: string;
+    rota?: string;
+    icone?: IconeProp;
+    filhos?: NoMenu[];
+}
+/**
+ * Caminho no menu até o item da rota atual: seção › grupo(s) › item. Vence o
+ * item de rota mais longa que casa (em `/pedidos/novo`, "Novo pedido" ganha
+ * de "Pedidos").
+ */
+export declare function caminhoNoMenu(secoes: {
+    rotulo?: string;
+    itens: NoMenu[];
+}[], ativo: (rota?: string) => boolean): ItemTrilha[];
+export interface TrilhaProps extends ModeloTrilha {
+    /** Passos explícitos. Sem a prop, usa o caminho calculado pela `Estrutura`. */
+    itens?: ItemTrilha[];
+    /** Passos acrescentados ao final do caminho automático (ex.: o registro aberto). */
+    extras?: ItemTrilha[];
+    /** Mostra mesmo com um passo só (por padrão, some: o título já diz onde se está). */
+    mostrarUnico?: boolean;
+    className?: string;
+}
+/**
+ * Trilha de navegação (breadcrumb). O último passo é a página atual; os do
+ * meio com rota são links. Em tela estreita vira só "‹ nível de cima".
+ */
+export declare function Trilha({ itens: explicitos, extras, mostrarUnico, separador, icones, aparencia, className }: TrilhaProps): import("react").JSX.Element | null;
+export {};

package/dist/components/Vazio/Vazio.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from 'react';
+import { type IconeProp } from '../../utils/Icone.js';
+export interface VazioProps {
+    titulo: string;
+    descricao?: string;
+    icone?: IconeProp;
+    /** Botões de ação abaixo do texto. */
+    children?: ReactNode;
+    className?: string;
+}
+/** Estado vazio (lista sem registros, busca sem resultado…). */
+export declare function Vazio({ titulo, descricao, icone, children, className }: VazioProps): import("react").JSX.Element;

package/dist/css.d.ts

@@ -0,0 +1 @@
+export {};