react-lgpd-consent 0.2.4 → 0.3.0

package/README.md

@@ -1,752 +1,171 @@
 # react-lgpd-consent 🍪
 
-[![NPM Version](https://img.shields.io/npm/v/react-lgpd-consent?style=for-the-badge&color=blue)](http### 🚨 Sistema de Orientações para Desenvolvedores (v0.2.2)
+[![NPM Version](https://img.shields.io/npm/v/react-lgpd-consent/v0.3.0?style=for-the-badge&color=blue)](https://www.npmjs.com/package/react-lgpd-consent)
+[![Bundle Size](https://img.shields.io/bundlephobia/minzip/react-lgpd-consent?style=for-the-badge&color=green)](https://bundlephobia.com/package/react-lgpd-consent)
+[![Downloads](https://img.shields.io/npm/dm/react-lgpd-consent?style=for-the-badge&color=orange)](https://www.npmjs.com/package/react-lgpd-consent)
+[![TypeScript](https://img.shields.io/badge/TypeScript-Ready-blue?style=for-the-badge&logo=typescript)](https://www.typescriptlang.org/)
+[![License](https://img.shields.io/npm/l/react-lgpd-consent?style=for-the-badge&color=lightgrey)](https://github.com/lucianoedipo/react-lgpd-consent/blob/main/LICENSE)
+
+> **Biblioteca completa de consentimento de cookies para React, em conformidade com a LGPD.**
 
-A v0.2.2 inclui sistema inteligente que **orienta developers sobre configuração adequada para compliance LGPD**:
+Solução moderna, acessível e personalizável para gerenciar o consentimento de cookies em aplicações React, com suporte a SSR, Material-UI, e um sistema inteligente de orientações para desenvolvedores.
 
-- 🧠 **Console Automático**: Avisos e sugestões sobre configuração
-- 🎯 **UI Dinâmica**: Componentes se adaptam à configuração do projeto
-- 🛡️ **Compliance por Design**: Previne problemas de conformidade LGPD
-- 🔧 **Hooks Avançados**: `useCategories()` e `useCategoryStatus()` para controle total
+## ✨ Características Principais
 
-**Desativando os Avisos:**
+- 🇧🇷 **Conformidade com a LGPD**: Desenvolvido seguindo as diretrizes da ANPD.
+- 🧠 **Orientações para Desenvolvedores**: Avisos e sugestões automáticas no console para garantir uma configuração adequada.
+- 🎯 **UI Dinâmica e Inteligente**: Os componentes se adaptam automaticamente às categorias de cookies que você realmente utiliza.
+- 🛡️ **Minimização de Dados**: O cookie de consentimento armazena apenas as informações estritamente necessárias.
+- 🚀 **Integrações Nativas**: Carregue scripts como Google Analytics e GTM automaticamente após o consentimento.
+- ⏰ **Auditoria**: O cookie armazena metadados essenciais como data do consentimento, versão e origem.
+- 🎨 **Customizável**: Personalize textos, tema (Material-UI) e componentes.
+- ♿ **Acessibilidade**: Suporte para navegação por teclado e leitores de tela.
+- 📦 **Leve e Otimizado**: Performance em foco, com tree-shaking.
+- ✨ **Renderização Automática de UI**: O `ConsentProvider` agora gerencia a exibição do banner e do botão flutuante por padrão.
+- 🎨 **Componentes UI Sobrescrevíveis**: Forneça seus próprios componentes de UI com tipagem clara para total personalização.
 
-Por padrão, os avisos são desativados automaticamente em builds de produção (`process.env.NODE_ENV === 'production'`). Para desativá-los explicitamente em desenvolvimento, você pode usar a prop `disableDeveloperGuidance` no `ConsentProvider`:
+## 🚀 Instalação
 
-```tsx
-<ConsentProvider disableDeveloperGuidance={true}>
-  {/* Sua aplicação */}
-</ConsentProvider>
+```bash
+npm install react-lgpd-consent
 ```
 
-A forma anterior de desativar os avisos via `window.__LGPD_DISABLE_GUIDANCE__ = true` ainda funciona, mas o uso da prop é a forma **preferencial e mais idiomática** em React.
+Você também precisará das dependências `peer`, caso ainda não as tenha:
 
+```bash
+npm install react react-dom @mui/material js-cookie
+```
 
-## 📖 Uso Básico - Configuração Consciente (v0.2.2)
+## 📖 Uso Básico
 
-### 1. Setup Básico (Compliance LGPD Automática)
+O exemplo abaixo mostra como implementar um banner de consentimento funcional com o mínimo de configuração.
 
-````tsx
-import { ConsentProvider, CookieBanner } from 'react-lgpd-consent'
+```tsx
+// Em seu componente principal, como App.tsx
+import { ConsentProvider } from 'react-lgpd-consent'
 
 function App() {
   return (
     <ConsentProvider
-      // 🛡️ Especificar apenas categorias necessárias (Minimização de Dados LGPD)
+      // 1. Especifique as categorias que seu site utiliza
       categories={{
-        enabledCategories: ['analytics'], // Apenas analytics + necessary
+        enabledCategories: ['analytics', 'marketing'],
       }}
-
-      // � Textos ANPD para compliance (opcionais)
+      // 2. (Opcional) Adicione textos para total transparência
       texts={{
-        bannerMessage: "Utilizamos cookies conforme LGPD...",
-        controllerInfo: "Controlado por: Empresa XYZ - CNPJ: 00.000.000/0001-00",
-        dataTypes: "Coletamos: dados de navegação para análise estatística",
-        userRights: "Direitos: acessar, corrigir, excluir dados (dpo@empresa.com)"
+        controllerInfo: 'Controlado por: Sua Empresa LTDA',
+        userRights: 'Você tem o direito de acessar e corrigir seus dados.',
       }}
-
-      // 🔔 Callbacks para auditoria (opcionais)
-      onConsentGiven={(state) => console.log('Consentimento registrado:', state)}
+      // 3. (Opcional) Adicione callbacks para auditoria
+      onConsentGiven={(state) => console.log('Consentimento dado:', state)}
     >
-      <CookieBanner policyLinkUrl="/politica-de-privacidade" />
-      <YourApp />
+      {/* O resto da sua aplicação */}
+      <h1>Meu Site</h1>
+      <p>Bem-vindo ao meu site.</p>
+
+      {/* O ConsentProvider agora renderiza automaticamente o banner e o botão flutuante */}
+      {/* Você pode sobrescrevê-los usando as props CookieBannerComponent e FloatingPreferencesButtonComponent */}
     </ConsentProvider>
   )
 }
-```eact-lgpd-consent?style=for-the-badge)](https://github.com/lucianoedipo/react-lgpd-consent/blob/main/LICENSE)
-[![TypeScript](https://img.shields.io/badge/TypeScript-Ready-blue?style=for-the-badge&logo=typescript)](https://www.typescriptlang.org/)
-[![React](https://img.shields.io/badge/React-18%2B-61DAFB?style=for-the-badge&logo=react)](https://reactjs.org/)
-[![Material-UI](https://img.shields.io/badge/MUI-Ready-007FFF?style=for-the-badge&logo=mui)](https://mui.com/)
-[![Bundle Size](https://img.shields.io/bundlephobia/minzip/react-lgpd-consent?style=for-the-badge&color=green)](https://bundlephobia.com/package/react-lgpd-consent)
-[![Downloads](https://img.shields.io/npm/dm/react-lgpd-consent?style=for-the-badge&color=orange)](https://www.npmjs.com/package/react-lgpd-consent)
-
-[![React](https://img.shields.io/badge/React-18%2B-61DAFB?style=for-the-badge&logo=react)](https://reactjs.org/)
-[![Material-UI](https://img.shields.io/badge/MUI-Ready-007FFF?style=for-the-badge&logo=mui)](https://mui.com/)
-
-> **Biblioteca completa de consentimento de cookies para React e Next.js em conformidade com a LGPD**
-
-Solução moderna, acessível e personalizável para gerenciar consentimento de cookies em aplicações React, com suporte completo a SSR, Material-UI e TypeScript.
-
-## ✨ Características Principais
-
-- 🇧🇷 **Conformidade LGPD + ANPD**: Cookie otimizado conforme Guia Orientativo da ANPD
-- 🍪 **Categorias Configuráveis**: Sistema dinâmico - apenas categorias necessárias ao projeto
-- 🛡️ **Princípio da Minimização**: Cookie contém apenas dados essenciais para compliance
-- 🚀 **Integrações Nativas**: Google Analytics, Tag Manager, UserWay automatizados
-- ⏰ **Auditoria Completa**: Timestamps e rastreabilidade para prestação de contas
-- ⚡ **Client-Side First**: Arquitetura otimizada para SPA com zero-flash
-- 🎨 **Material-UI Integration**: Componentes prontos e customizáveis com MUI
-- ♿ **Acessibilidade**: Navegação por teclado e leitores de tela nativamente suportados
-- 🌐 **Internacionalização**: Textos totalmente customizáveis (padrão pt-BR)
-- 🚀 **TypeScript**: API completamente tipada para melhor DX
-- 📦 **Zero Config**: Funciona out-of-the-box com configurações sensatas
-- 🎯 **Granular Control**: Controle individual por categoria ativa
-- 🚫 **Banner Bloqueante**: Modo opcional para exigir interação antes de continuar
-- 🎨 **Sistema de Temas**: Temas customizáveis para integração visual perfeita
-- ⚡ **Carregamento Automático**: Scripts só executam após consentimento explícito
-- 🔌 **Modal Automático**: Modal de preferências incluído automaticamente com lazy loading
-- 🎛️ **Botão Flutuante**: Componente opcional para acesso fácil às preferências
-
-## 🚀 Instalação
-
-```bash
-npm install react-lgpd-consent
-# ou
-yarn add react-lgpd-consent
-# ou
-pnpm add react-lgpd-consent
-````
-
-### Dependências
 
-```bash
-npm install @mui/material js-cookie
-```
-
-## 🆕 Novidades v0.2.0 - Adequação ANPD Completa
-
-### 🍪 Categorias Baseadas no Guia da ANPD
-
-A biblioteca agora inclui **6 categorias** baseadas no Guia Orientativo da ANPD:
-
-- **`necessary`**: Cookies essenciais (sempre ativos)
-- **`analytics`**: Análise e estatísticas de uso
-- **`functional`**: Funcionalidades extras (preferências, idioma)
-- **`marketing`**: Publicidade e marketing direcionado
-- **`social`**: Integração com redes sociais
-- **`personalization`**: Personalização de conteúdo
-
-### 🛡️ Conformidade LGPD Rigorosa (v0.2.1)
-
-**Princípio da Minimização**: Cookie contém apenas categorias realmente utilizadas:
-
-```tsx
-<ConsentProvider
-  categories={{
-    enabledCategories: ['analytics'], // Apenas analytics + necessary
-    customCategories: [{
-      id: 'governo',
-      name: 'Integração Governamental',
-      description: 'Cookies para sistemas gov.br',
-      essential: false
-    }]
-  }}
-  blocking={true} // Banner bloqueia até decisão explícita
->
-```
-
-**Cookie resultante** (apenas dados essenciais):
-
-```json
-{
-  "version": "1.0",
-  "consented": true,
-  "preferences": { "necessary": true, "analytics": false, "governo": true },
-  "consentDate": "2025-08-12T14:30:00.000Z",
-  "lastUpdate": "2025-08-12T14:30:00.000Z",
-  "source": "banner"
-}
+export default App
 ```
 
-> 📋 **[Guia Completo de Conformidade LGPD](./docs/CONFORMIDADE-LGPD.md)**
+## 🔧 API e Funcionalidades
 
-### � Sistema de Orientações para Desenvolvedores
+### Configuração Consciente
 
-A v0.2.1 inclui sistema inteligente que **orienta developers sobre configuração adequada**:
+A prop `categories` no `ConsentProvider` é o ponto central da biblioteca. Ela força o desenvolvedor a declarar quais categorias de cookies são utilizadas, em linha com o princípio de minimização de dados da LGPD.
 
 ```tsx
-// ⚠️ Sem configuração - usa padrão e avisa
-<ConsentProvider>
-  <App />
-</ConsentProvider>
-// Console: "Usando padrão: necessary + analytics. Especificar para produção."
-
-// ✅ Configuração explícita - recomendado
 <ConsentProvider
   categories={{
-    enabledCategories: ['analytics', 'marketing'],
-    customCategories: [...]
+    // Habilita as categorias padrão 'analytics' e 'functional'
+    enabledCategories: ['analytics', 'functional'],
   }}
 >
-  <App />
-</ConsentProvider>
-```
-
-**Console de desenvolvimento** mostra automaticamente:
-
-- 🟨 **Avisos**: Configuração faltante ou inconsistente
-- 💡 **Sugestões**: Melhorias para compliance
-- 🔧 **Tabela de categorias ativas**: Para UI customizada
-
-> 📋 **[Sistema de Orientações Completo](./docs/ORIENTACOES-DESENVOLVIMENTO.md)**
-
-### 🔧 Categorias Customizadas (API Legacy)
-
-```tsx
-// LEGACY: ainda suportado, mas deprecated
-const customCategories = [
-  {
-    id: 'governo',
-    name: 'Integração Governo',
-    description: 'Cookies para integração com sistemas governamentais.',
-    essential: false,
-    cookies: ['gov_session', 'cpf_hash']
-  }
-]
-
-<ConsentProvider customCategories={customCategories}>
-  {/* Sua aplicação */}
+  {/*...*/}
 </ConsentProvider>
 ```
 
-### 🎨 Componentes UI Dinâmicos (v0.2.2)
-
-Os componentes agora **renderizam automaticamente** baseado na configuração:
-
-```tsx
-import { useCategories, useCategoryStatus } from 'react-lgpd-consent'
-
-// ✅ Modal customizado que se adapta às categorias ativas
-function CustomPreferencesModal() {
-  const { toggleableCategories } = useCategories()
-  const { preferences, setPreferences } = useConsent()
-
-  return (
-    <dialog>
-      {/* Renderiza APENAS categorias configuradas no projeto */}
-      {toggleableCategories.map((category) => (
-        <label key={category.id}>
-          <input
-            type="checkbox"
-            checked={preferences[category.id] ?? false} // ✅ Controlado
-            onChange={(e) =>
-              setPreferences({
-                ...preferences,
-                [category.id]: e.target.checked,
-              })
-            }
-          />
-          <strong>{category.name}</strong>
-          <p>{category.description}</p>
-        </label>
-      ))}
-    </dialog>
-  )
-}
-
-// ✅ Feature condicional baseada em configuração
-function AnalyticsDashboard() {
-  const analytics = useCategoryStatus('analytics')
-
-  if (!analytics.isActive) {
-    return null // Categoria não configurada - não renderiza
-  }
-
-  return <div>Dashboard só aparece se analytics estiver configurado!</div>
-}
-```
-
-**Benefícios:**
+### Carregamento de Scripts (`ConsentScriptLoader`)
 
-- ✅ **Zero bugs**: UI sempre consistente com configuração
-- ✅ **Performance**: Não renderiza categorias não utilizadas
-- ✅ **Manutenibilidade**: Mudou configuração? UI atualiza automaticamente
-- ✅ **Orientação**: Console avisa sobre inconsistências
-
-### 🚀 Integrações Automáticas
+Evite carregar scripts de rastreamento antes do consentimento. O `ConsentScriptLoader` faz isso automaticamente.
 
 ```tsx
 import {
+  ConsentProvider,
   ConsentScriptLoader,
   createGoogleAnalyticsIntegration,
-  createUserWayIntegration,
 } from 'react-lgpd-consent'
 
 const integrations = [
   createGoogleAnalyticsIntegration({
-    measurementId: 'GA_MEASUREMENT_ID',
-  }),
-  createUserWayIntegration({
-    accountId: 'USERWAY_ACCOUNT_ID',
+    measurementId: 'G-XXXXXXXXXX',
   }),
 ]
 
 function App() {
   return (
-    <ConsentProvider>
-      {/* Scripts carregam automaticamente quando categoria é aceita */}
+    <ConsentProvider categories={{ enabledCategories: ['analytics'] }}>
+      {/* Este componente carrega os scripts para você quando o consentimento é dado */}
       <ConsentScriptLoader integrations={integrations} />
 
-      <CookieBanner policyLinkUrl="/privacy-policy" />
-    </ConsentProvider>
-  )
-}
-```
-
-### 📝 Textos ANPD Expandidos
-
-```tsx
-<ConsentProvider
-  texts={{
-    bannerMessage: 'Utilizamos cookies para melhorar sua experiência.',
-    // Textos ANPD opcionais
-    controllerInfo: 'Controlado por Empresa LTDA (CNPJ: 00.000.000/0001-00)',
-    dataTypes: 'Coletamos dados de navegação, preferências e interações.',
-    thirdPartySharing: 'Compartilhamos com: Google Analytics, Facebook Pixel',
-    userRights: 'Você tem direito a acesso, correção e exclusão dos dados.',
-    contactInfo: 'Contato DPO: dpo@empresa.com.br | (11) 9999-9999',
-    retentionPeriod: 'Dados armazenados por até 12 meses.',
-    lawfulBasis: 'Base legal: consentimento do titular dos dados.',
-    transferCountries: 'Dados podem ser transferidos para: EUA, Irlanda.',
-  }}
->
-  {/* Os textos são exibidos condicionalmente apenas se definidos */}
-</ConsentProvider>
-```
-
-## � Exemplo Completo
-
-```tsx
-import {
-  ConsentProvider,
-  CookieBanner,
-  FloatingPreferencesButton,
-} from 'react-lgpd-consent'
-
-function App() {
-  return (
-    <ConsentProvider>
-      <div>
-        <h1>Meu Site</h1>
-        <p>Conteúdo do site...</p>
-
-        {/* Banner de cookies - Modal incluído automaticamente! */}
-        <CookieBanner policyLinkUrl="/privacy-policy" blocking={true} />
-
-        {/* Botão flutuante opcional para acesso às preferências */}
-        <FloatingPreferencesButton position="bottom-right" />
-      </div>
-    </ConsentProvider>
-  )
-}
-```
-
-## �📖 Uso Básico
-
-### 1. Setup do Provider
-
-```tsx
-import { ConsentProvider } from 'react-lgpd-consent'
-
-function App() {
-  return (
-    <ConsentProvider>
-      <YourApp />
+      {/* ... resto do app */}
     </ConsentProvider>
   )
 }
 ```
 
-### 2. Banner de Consentimento
-
-```tsx
-import { CookieBanner } from 'react-lgpd-consent'
-
-function Layout() {
-  return (
-    <>
-      <YourContent />
-      <CookieBanner
-        policyLinkUrl="/politica-privacidade"
-        blocking={true} // Padrão: bloqueia até decisão
-      />
-      {/* Modal de preferências incluído automaticamente! */}
-    </>
-  )
-}
-```
+### Renderização Condicional (`ConsentGate`)
 
-### 3. Uso do Hook
+Renderize componentes ou partes da sua UI apenas se o usuário consentiu com uma categoria específica.
 
 ```tsx
-import { useConsent } from 'react-lgpd-consent'
-
-function MyComponent() {
-  const { consented, preferences, acceptAll, openPreferences } = useConsent()
+import { ConsentGate } from 'react-lgpd-consent'
 
+function MarketingPixel() {
   return (
-    <div>
-      <p>Consentimento: {consented ? 'Dado' : 'Pendente'}</p>
-      <button onClick={acceptAll}>Aceitar Todos</button>
-      <button onClick={openPreferences}>Gerenciar Preferências</button>
-    </div>
-  )
-}
-```
-
-> ✅ **O modal de preferências é incluído automaticamente pelo ConsentProvider!** Não é mais necessário renderizá-lo manualmente.
-
-````
-
-### 4. Carregamento Condicional de Scripts
-
-```tsx
-import { ConsentGate, loadScript } from 'react-lgpd-consent'
-
-function Analytics() {
-  return (
-    <ConsentGate category="analytics">
-      <GoogleAnalytics />
+    <ConsentGate category="marketing">
+      {/* Este componente só será renderizado se o usuário aceitar cookies de marketing */}
+      <img src="/pixel.gif" alt="Marketing Pixel" />
     </ConsentGate>
   )
 }
-
-// Ou carregando scripts que aguardam consentimento
-function MyComponent() {
-  const { preferences, consented } = useConsent()
-
-  useEffect(() => {
-    if (consented && preferences.analytics) {
-      loadConditionalScript(
-        'ga',
-        'https://www.googletagmanager.com/gtag/js?id=GA_ID',
-        () => preferences.analytics, // Condição que aguarda
-      )
-    }
-  }, [preferences, consented])
-}
-````
-
-## 🎨 Customização
-
-### Banner Bloqueante vs Não-bloqueante
-
-```tsx
-// Banner bloqueante (padrão) - impede interação até decisão
-<CookieBanner blocking={true} />
-
-// Banner não-intrusivo - permite navegação
-<CookieBanner blocking={false} />
-```
-
-### Tema Personalizado
-
-```tsx
-import { ConsentProvider, defaultConsentTheme } from 'react-lgpd-consent'
-import { createTheme } from '@mui/material/styles'
-
-const meuTema = createTheme({
-  ...defaultConsentTheme,
-  palette: {
-    ...defaultConsentTheme.palette,
-    primary: {
-      main: '#1976d2', // Sua cor principal
-    },
-  },
-})
-
-<ConsentProvider theme={meuTema}>
-  <App />
-</ConsentProvider>
-```
-
-### Textos Personalizados
-
-```tsx
-<ConsentProvider
-  texts={{
-    bannerMessage: "Utilizamos cookies para melhorar sua experiência.",
-    acceptAll: "Aceitar Todos",
-    declineAll: "Recusar Opcionais",
-    preferences: "Configurar"
-  }}
->
-```
-
-### Configuração do Cookie
-
-```tsx
-<ConsentProvider
-  cookie={{
-    name: 'meuSiteConsent',
-    maxAgeDays: 180,
-    sameSite: 'Strict'
-  }}
->
-```
-
-### Callbacks
-
-```tsx
-<ConsentProvider
-  onConsentGiven={(state) => {
-    console.log('Consentimento dado:', state)
-    // Inicializar analytics, etc.
-  }}
-  onPreferencesSaved={(prefs) => {
-    console.log('Preferências salvas:', prefs)
-  }}
->
-```
-
-## � Banner Bloqueante
-
-Para cenários onde é necessário bloquear o acesso até obter consentimento explícito:
-
-```tsx
-<CookieBanner blocking />
-```
-
-Com `blocking={true}`, o banner:
-
-- Cria um overlay escuro sobre todo o conteúdo
-- Impede interação com o resto da página
-- É útil para casos críticos onde consentimento é obrigatório
-
-## 🎨 Sistema de Temas
-
-### Tema Personalizado
-
-```tsx
-import { createTheme } from '@mui/material/styles'
-
-const meuTema = createTheme({
-  palette: {
-    primary: { main: '#2196f3' },
-    secondary: { main: '#f50057' },
-  },
-})
-
-<ConsentProvider theme={meuTema}>
-  <App />
-</ConsentProvider>
-```
-
-### Tema Padrão
-
-O tema padrão do react-lgpd-consent está disponível para customização:
-
-```tsx
-import { defaultConsentTheme } from 'react-lgpd-consent'
-
-const temaCustomizado = createTheme({
-  ...defaultConsentTheme,
-  palette: {
-    ...defaultConsentTheme.palette,
-    primary: { main: '#your-color' },
-  },
-})
 ```
 
-## ⚡ Carregamento Inteligente de Scripts
+### API e Funcionalidades
 
-### Função loadScript
+A versão `v0.3.0` simplifica a API e melhora a experiência do desenvolvedor.
 
-Scripts aguardam automaticamente o **consentimento finalizado** (banner fechado ou preferências salvas):
+- **Componentes UI Sobrescrevíveis com Tipagem Clara**: Agora você pode fornecer seus próprios componentes para o banner, modal e botão flutuante, com props tipadas para garantir a compatibilidade. Consulte `CustomCookieBannerProps`, `CustomPreferencesModalProps` e `CustomFloatingPreferencesButtonProps` para detalhes.
+- **Controle Simplificado do Modal**: A prop `disableAutomaticModal` foi removida. A visibilidade do modal é controlada internamente.
+- **Remoção de Hooks Internos**: O hook `useConsentComponentProps` foi removido para simplificar a API. Use `useConsent()` e `useConsentTexts()` diretamente.
 
-```tsx
-import { loadScript } from 'react-lgpd-consent'
+### Hooks
 
-// Carrega script apenas após consentimento para analytics
-await loadScript(
-  'gtag',
-  'https://www.googletagmanager.com/gtag/js?id=GA_ID',
-  'analytics', // Categoria obrigatória
-)
+A biblioteca exporta hooks para controle total e criação de UIs customizadas:
 
-// Script geral (sempre carrega após consentimento)
-await loadScript('custom-script', 'https://example.com/script.js')
-```
+- `useConsent()`: O hook principal para interagir com o estado de consentimento.
+- `useCategories()`: Retorna a lista de todas as categorias ativas no projeto.
+- `useCategoryStatus('id')`: Verifica se uma categoria específica está ativa e configurada.
 
-### Comportamento Inteligente
+## 🛡️ Conformidade e LGPD
 
-- **Aguarda decisão final**: Não executa durante mudanças no modal de preferências
-- **Só executa após salvar**: Scripts só rodam quando o usuário finaliza as preferências
-- **Baseado em categoria**: Respeita as permissões por categoria
+Esta biblioteca foi projetada para auxiliar na conformidade com a LGPD, implementando princípios como:
 
-## 🎨 Personalização Total
+- **Consentimento Granular**: O usuário pode escolher quais categorias aceitar.
+- **Minimização de Dados**: Apenas as categorias declaradas são gerenciadas e armazenadas no cookie.
+- **Transparência**: O sistema de textos e o cookie de auditoria fornecem informações claras.
+- **Facilidade de Revogação**: O usuário pode alterar suas preferências a qualquer momento.
 
-### Modal de Preferências Customizado
+Para mais detalhes, consulte o nosso **[Guia de Conformidade](docs/CONFORMIDADE-LGPD.md)**.
 
-Substitua completamente o modal padrão com seu próprio componente:
+## 🤝 Contribuições
 
-```tsx
-import { ConsentProvider, useConsent } from 'react-lgpd-consent'
-import MeuModalCustomizado from './MeuModalCustomizado'
-
-function App() {
-  return (
-    <ConsentProvider
-      PreferencesModalComponent={MeuModalCustomizado}
-      preferencesModalProps={{ variant: 'custom' }}
-    >
-      <MeuApp />
-    </ConsentProvider>
-  )
-}
-
-// Seu componente customizado
-function MeuModalCustomizado({ variant }) {
-  const { isModalOpen, closePreferences, setPreference } = useConsent()
-
-  return (
-    <MyCustomDialog open={isModalOpen} onClose={closePreferences}>
-      {/* Seu design personalizado aqui */}
-    </MyCustomDialog>
-  )
-}
-```
-
-### Desabilitar Modal Automático
-
-Para controle total, desabilite o modal automático:
-
-```tsx
-<ConsentProvider disableAutomaticModal>
-  <MeuApp />
-  {/* Renderize seus componentes customizados onde quiser */}
-  <MeuModalTotalmenteCustomizado />
-</ConsentProvider>
-```
-
-## �🔧 API Completa
-
-### Components
-
-| Componente                  | Descrição                                        | Props Principais                                                                         |
-| --------------------------- | ------------------------------------------------ | ---------------------------------------------------------------------------------------- |
-| `ConsentProvider`           | Provider principal do contexto                   | `initialState`, `texts`, `theme`, `hideBranding`, `PreferencesModalComponent`, `disableDeveloperGuidance`, callbacks |
-| `CookieBanner`              | Banner de consentimento                          | `policyLinkUrl`, `blocking`, `hideBranding`, `debug`, pass-through MUI props             |
-| `PreferencesModal`          | Modal de preferências (incluído automaticamente) | `DialogProps`, `hideBranding` - **Opcional**                                             |
-| `FloatingPreferencesButton` | Botão flutuante para abrir preferências          | `position`, `hideWhenConsented`, `tooltip`, `icon`, `FabProps`                           |
-| `ConsentGate`               | Renderização condicional por categoria           | `category`, `children`                                                                   |
-
-### Hook `useConsent()`
-
-```typescript
-interface ConsentContextValue {
-  consented: boolean // usuário já consentiu?
-  preferences: ConsentPreferences // preferências atuais
-  isModalOpen: boolean // estado do modal de preferências
-  acceptAll(): void // aceitar todas as categorias
-  rejectAll(): void // recusar opcionais
-  setPreference(cat: Category, value: boolean): void // definir categoria específica
-  openPreferences(): void // abrir modal de preferências
-  closePreferences(): void // fechar modal
-  resetConsent(): void // resetar tudo
-}
-```
-
-### Hook `useConsentTexts()`
-
-```typescript
-// Acesso aos textos contextuais
-const texts = useConsentTexts()
-console.log(texts.banner.title) // "Política de Cookies"
-```
-
-### Utilitários
-
-- `loadScript(id, src, category?, attrs?)` - Carrega scripts com consentimento inteligente
-- `defaultConsentTheme` - Tema padrão do Material-UI
-- Tipos TypeScript completos exportados## 🌐 SSR / Next.js
-
-Para evitar flash de conteúdo em SSR:
-
-```tsx
-// pages/_app.tsx (Next.js)
-function MyApp({ Component, pageProps }) {
-  return (
-    <ConsentProvider
-      initialState={{
-        consented: false,
-        preferences: { analytics: false, marketing: false },
-      }}
-    >
-      <Component {...pageProps} />
-    </ConsentProvider>
-  )
-}
-```
-
-## ♿ Acessibilidade
-
-A biblioteca segue as melhores práticas de acessibilidade:
-
-- ✅ Navegação por teclado (Tab, Enter, Escape)
-- ✅ Leitores de tela (`aria-labelledby`, `aria-describedby`)
-- ✅ Foco gerenciado automaticamente
-- ✅ Contrastes adequados
-- ✅ Estrutura semântica correta
-
-## 📚 Exemplos
-
-Confira exemplos completos no repositório:
-
-- [Básico com React](./examples/basic)
-- [Next.js com SSR](./examples/nextjs)
-- [Customização avançada](./examples/advanced)
-- [Integração com analytics](./examples/analytics)
-
-## 🤝 Contribuição
-
-Contribuições são bem-vindas! Por favor:
-
-1. Faça fork do projeto
-2. Crie uma branch para sua feature (`git checkout -b feature/AmazingFeature`)
-3. Commit suas mudanças (`git commit -m 'Add some AmazingFeature'`)
-4. Push para a branch (`git push origin feature/AmazingFeature`)
-5. Abra um Pull Request
+Contribuições são bem-vindas! Sinta-se à vontade para abrir uma _issue_ ou um _pull request_.
 
 ## 📄 Licença
 
-Este projeto está licenciado sob a Licença MIT - veja o arquivo [LICENSE](LICENSE) para detalhes.
-
-## 🙋‍♀️ Suporte
-
-- 📖 [Documentação](./docs)
-- 🐛 [Issues](https://github.com/lucianoedipo/react-lgpd-consent/issues)
-- 💬 [Discussões](https://github.com/lucianoedipo/react-lgpd-consent/discussions)
-
-## 🔮 Roadmap
-
-### ✅ v0.2.2 - Sistema de Orientações (Lançado!)
-
-**Implementado: Sistema inteligente de orientação para desenvolvedores**
-
-- ✅ **Console de Desenvolvimento**: Avisos automáticos e orientações
-- ✅ **UI Dinâmica**: Componentes se adaptam à configuração do projeto
-- ✅ **Hooks Avançados**: `useCategories()` e `useCategoryStatus()`
-- ✅ **Validação Automática**: Prevenção de bugs de configuração vs UI
-
-### v0.2.3 - Compliance Avançado (Próxima Release)
-
-**Baseado em feedback de uso real em projetos governamentais:**
-
-- 📋 **Sistema de Logs de Auditoria**: Rastreamento completo para prestação de contas
-- 📜 **Templates Setoriais**: Textos pré-configurados (governo, saúde, educação)
-- 🎨 **Presets Visuais**: Identidade visual por setor (acessibilidade WCAG AAA)
-- 📊 **Dashboard para DPOs**: Relatórios automáticos de compliance
-- 🔌 **Mais Integrações**: Microsoft Clarity, Hotjar, Intercom, LinkedIn
-
-### v0.3.0 - Multi-Regulamentação
-
-- 🌍 **Suporte GDPR/CCPA**: Detecção automática por geolocalização
-- 🏗️ **Sistema de Plugins**: Extensões de terceiros
-- 🎭 **Temas Avançados**: Design system tokens
-
-### v0.4.0 - Enterprise
-
-- 📈 **Analytics Avançadas**: Dashboards completos
-- 🔄 **Sync Multi-Domínio**: Consentimento compartilhado
-- 🛡️ **Segurança Empresarial**: Criptografia, audit logs remotos
-
-> 📋 **Implementado na v0.2.2**: Sistema de orientações para developers e UI dinâmica
-
----
-
-<div align="center">
-
-**Feito com ❤️ para a comunidade React brasileira**
-
-</div>
+Este projeto está sob a licença MIT. Veja o arquivo [LICENSE](LICENSE) para mais detalhes.