Documentation
React APIs
Use PermissionProvider, components, and hooks to keep frontend checks readable and explainable.
Components
Can renders children when allowed. Cannot renders children when denied. ProtectedRoute gates route-level UI but does not redirect automatically.
Components
<ProtectedRoute
permission="pages.admin"
fallback={<p>No access</p>}
loading={<p>Checking access...</p>}
>
<AdminPage />
</ProtectedRoute>Hooks
usePermission returns a boolean. usePermissions evaluates multiple permissions concurrently. useAccessDecision returns the full decision. useAccessModel returns the current model from PermissionProvider.
Hooks
const canExport = usePermission("reports.export");
const { canEdit, canDelete } = usePermissions({
canEdit: "posts:edit",
canDelete: { any: ["posts:delete", "admin"] },
});
const decision = useAccessDecision("reports.export");
const model = useAccessModel();