@vanderleiip6/comprovante-react

Componente React do Comprovante de Endereço GEO CEP (Atlas / SASI). Renderiza o cartão do comprovante a partir de um geocódigo, consumindo a API pública do Atlas.

Instalação

npm install @vanderleiip6/comprovante-react

react e react-dom (>=18) são peer dependencies.

Uso

import { Comprovante } from "@vanderleiip6/comprovante-react";

export default function Pagina() {
  return <Comprovante codigo="6fod-ENhX" chave="atl_live_..." />;
}

Props

| Prop | Tipo | Descrição | |---|---|---| | codigo | string | GEO CEP (aceita XXXX-XXXX ou XXXXXXXX). | | chave | string | Chave de API do projeto. | | base | string? | Base da API. Default https://atlas.sasi.net. | | onCarregado | (dados) => void | Callback quando os dados chegam. | | className / style | — | Aplicados ao contêiner do cartão. |

O componente usa estilos inline (não depende de Tailwind nem CSS externo).

Hook

Para montar sua própria UI:

import { useComprovante } from "@vanderleiip6/comprovante-react";

const { dados, carregando, erro } = useComprovante("6fod-ENhX", "atl_live_...");

Segurança

A chave fica visível no navegador do usuário final. Os endpoints de leitura (comprovante/decode) são seguros para uso client-side; não use no navegador chaves com permissão de escrita se isso for sensível ao seu caso.

Build (para publicar)

npm install
npm run build      # gera dist/ (ESM + tipos) via tsup
npm publish --access public

Alternativa sem build (web component)

Para sites que não usam React:

<script src="https://atlas.sasi.net/sdk/atlas-comprovante.js"></script>
<atlas-comprovante codigo="6fod-ENhX" chave="atl_live_..."></atlas-comprovante>