{"_id":"@cartoriocriciuma/rbac-frontend","name":"@cartoriocriciuma/rbac-frontend","dist-tags":{"latest":"1.0.0-alpha.1"},"versions":{"1.0.0-alpha.1":{"name":"@cartoriocriciuma/rbac-frontend","version":"1.0.0-alpha.1","description":"Componentes e hooks React para o sistema RBAC","main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"tsc","clean":"rimraf dist","lint":"eslint src --ext .ts,.tsx","test":"jest","prepublishOnly":"npm run clean && npm run build"},"keywords":["rbac","frontend","react","permissions"],"author":{"name":"Cartório Criciúma"},"license":"ISC","peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0"},"dependencies":{"@cartoriocriciuma/rbac-types":"^1.0.0-alpha.1"},"devDependencies":{"@types/react":"^18.0.0","@types/react-dom":"^18.0.0","react":"^18.0.0","react-dom":"^18.0.0","rimraf":"^5.0.5"},"publishConfig":{"access":"public"},"repository":{"type":"git","url":"git+https://github.com/cartoriocriciuma/rbac-monorepo.git","directory":"packages/rbac-frontend"},"_id":"@cartoriocriciuma/rbac-frontend@1.0.0-alpha.1","bugs":{"url":"https://github.com/cartoriocriciuma/rbac-monorepo/issues"},"homepage":"https://github.com/cartoriocriciuma/rbac-monorepo#readme","_nodeVersion":"20.19.1","_npmVersion":"10.8.2","dist":{"integrity":"sha512-MDxcSfhUqbKkzQlST6kBG/zSI2x9CVEBs2locwxxfhbI+ljEqvEzENzwVvM4EOaiVavXjMM/IrqLAKmAjpBYaA==","shasum":"33eccc3ea56792e1fd7ef80dedcc1905adb26c35","tarball":"https://registry.npmjs.org/@cartoriocriciuma/rbac-frontend/-/rbac-frontend-1.0.0-alpha.1.tgz","fileCount":2,"unpackedSize":6528,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCvCgNst9GP9rtwPjII4/x2QD1nWEMNTP32t7rBTwV7CwIgI+ZdZ4zdw7kvCEMBSEXLHINTHAI+GitaLc5ZzEpjifM="}]},"_npmUser":{"name":"guilhermecelso","email":"ti@cartoriocriciuma.com.br"},"directories":{},"maintainers":[{"name":"guilhermecelso","email":"ti@cartoriocriciuma.com.br"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/rbac-frontend_1.0.0-alpha.1_1747078809930_0.44211923925686913"},"_hasShrinkwrap":false}},"time":{"created":"2025-05-12T19:40:09.824Z","1.0.0-alpha.1":"2025-05-12T19:40:10.104Z","modified":"2025-05-12T19:40:10.371Z"},"maintainers":[{"name":"guilhermecelso","email":"ti@cartoriocriciuma.com.br"}],"description":"Componentes e hooks React para o sistema RBAC","homepage":"https://github.com/cartoriocriciuma/rbac-monorepo#readme","keywords":["rbac","frontend","react","permissions"],"repository":{"type":"git","url":"git+https://github.com/cartoriocriciuma/rbac-monorepo.git","directory":"packages/rbac-frontend"},"author":{"name":"Cartório Criciúma"},"bugs":{"url":"https://github.com/cartoriocriciuma/rbac-monorepo/issues"},"license":"ISC","readme":"# @cartoriocriciuma/rbac-frontend\n\nComponentes React e hooks para integração do sistema RBAC com aplicações frontend.\n\n## Instalação\n\n```bash\nnpm install @cartoriocriciuma/rbac-frontend\n```\n\n## Configuração\n\nAntes de usar os componentes e hooks, configure os adaptadores necessários:\n\n```typescript\nimport { \n  configureAuthContextAdapter, \n  configureNavigationAdapter, \n  configureNotificationAdapter \n} from '@cartoriocriciuma/rbac-frontend';\n\n// Configurar adaptador de autenticação\nconfigureAuthContextAdapter(() => ({\n  // Map de permissões do usuário atual\n  userPermissions: {\n    'usuarios:view': { \n      id: 'usuarios:view', \n      codigo: 'usuarios:view', \n      nome: 'Ver usuários',\n      description: 'Permite visualizar usuários',\n      recurso: 'usuarios',\n      acao: 'view',\n      ativo: true\n    }\n  },\n  // Flag para indicar se o usuário é superadmin\n  isSuperAdmin: false,\n  // Função para atualizar permissões\n  refreshPermissions: async () => {\n    // Lógica para recarregar permissões\n  }\n}));\n\n// Configurar adaptador de navegação\nconfigureNavigationAdapter({\n  navigate: (path) => {\n    // Usar router da aplicação\n    history.push(path);\n  }\n});\n\n// Configurar adaptador de notificações\nconfigureNotificationAdapter({\n  showNotification: (options) => {\n    // Usar sistema de notificações da aplicação\n    toast({\n      title: options.title,\n      description: options.message,\n      status: options.type,\n      // ...outros parâmetros\n    });\n  }\n});\n```\n\n## Componentes\n\n### PermissionCheck\n\nComponente para renderização condicional baseada em permissões:\n\n```tsx\nimport { PermissionCheck } from '@cartoriocriciuma/rbac-frontend';\n\n// Verificar uma única permissão\n<PermissionCheck permission=\"usuarios:view\">\n  <button>Ver Usuários</button>\n</PermissionCheck>\n\n// Verificar múltiplas permissões (deve ter todas)\n<PermissionCheck \n  permissions={['usuarios:view', 'usuarios:edit']} \n  requireAll={true}\n>\n  <button>Editar Usuários</button>\n</PermissionCheck>\n\n// Com conteúdo alternativo quando não tem permissão\n<PermissionCheck \n  permission=\"relatorios:view\"\n  fallback={<p>Você não tem permissão para ver relatórios</p>}\n>\n  <ReportViewer />\n</PermissionCheck>\n```\n\n### ProtectedRoute\n\nComponente para proteger rotas baseado em permissões:\n\n```tsx\nimport { ProtectedRoute } from '@cartoriocriciuma/rbac-frontend';\n\n// Rota protegida por uma permissão\n<ProtectedRoute \n  permission=\"usuarios:view\"\n  redirectTo=\"/acesso-negado\"\n>\n  <UserListPage />\n</ProtectedRoute>\n\n// Rota protegida por múltiplas permissões\n<ProtectedRoute \n  permissions={['config:view', 'config:edit']}\n  requireAll={false} // Precisa de pelo menos uma\n  redirectTo=\"/acesso-negado\"\n  silentRedirect={true} // Não mostra notificação\n>\n  <ConfigPage />\n</ProtectedRoute>\n```\n\n## Hooks\n\n### useHasPermission\n\nHook para verificar se o usuário tem uma permissão específica:\n\n```tsx\nimport { useHasPermission } from '@cartoriocriciuma/rbac-frontend';\n\nfunction MyComponent() {\n  // Verificar uma permissão\n  const canViewUsers = useHasPermission('usuarios:view');\n  \n  return (\n    <div>\n      {canViewUsers && <button>Ver Usuários</button>}\n    </div>\n  );\n}\n```\n\n### useHasPermissions\n\nHook para verificar múltiplas permissões:\n\n```tsx\nimport { useHasPermissions } from '@cartoriocriciuma/rbac-frontend';\n\nfunction MyComponent() {\n  // Verificar se tem todas as permissões\n  const canManageUsers = useHasPermissions([\n    'usuarios:view', \n    'usuarios:edit',\n    'usuarios:delete'\n  ], true);\n  \n  // Verificar se tem pelo menos uma das permissões\n  const canDoSomething = useHasPermissions([\n    'feature1:use', \n    'feature2:use'\n  ], false);\n  \n  return (\n    <div>\n      {canManageUsers && <button>Gerenciar Usuários</button>}\n      {canDoSomething && <button>Usar Recursos</button>}\n    </div>\n  );\n}\n```\n\n### usePermissions\n\nHook para gerenciar permissões e grupos:\n\n```tsx\nimport { usePermissions } from '@cartoriocriciuma/rbac-frontend';\n\nfunction PermissionsManager() {\n  // Obter estado e ações para gerenciar permissões\n  const [\n    { permissoes, gruposPermissao, loading, error },\n    { \n      buscarPermissoes,\n      buscarGrupos,\n      buscarPermissoesAgrupadas\n    }\n  ] = usePermissions();\n  \n  // Carregar permissões quando o componente montar\n  useEffect(() => {\n    buscarPermissoes();\n    buscarGrupos();\n  }, []);\n  \n  return (\n    <div>\n      {loading && <Spinner />}\n      {error && <ErrorAlert message={error.message} />}\n      \n      <h2>Permissões ({permissoes.length})</h2>\n      <ul>\n        {permissoes.map(perm => (\n          <li key={perm.id}>{perm.nome}</li>\n        ))}\n      </ul>\n      \n      <h2>Grupos ({gruposPermissao.length})</h2>\n      {/* ... */}\n    </div>\n  );\n}\n```\n\n## API de Adaptadores\n\n### Adaptador de Autenticação\n\n```typescript\ninterface AuthContextType {\n  userPermissions: Record<string, Permission>;\n  isSuperAdmin?: boolean;\n  refreshPermissions: () => Promise<void>;\n}\n```\n\n### Adaptador de Navegação\n\n```typescript\ninterface NavigationAdapter {\n  navigate: (path: string) => void;\n}\n```\n\n### Adaptador de Notificações\n\n```typescript\ninterface NotificationAdapter {\n  showNotification: (options: {\n    message: string;\n    type: 'error' | 'warning' | 'info' | 'success';\n    title?: string;\n    actionText?: string;\n    actionPath?: string;\n    onAction?: () => void;\n  }) => void;\n}\n``` ","readmeFilename":"README.md","_rev":"1-43c7b49c967b3bfedaa1d687b07376cf"}