react-smart-permission

A lightweight Role-Based Access Control (RBAC) library for React applications.

✨ Features

• 🔐 Permission-based UI rendering
• ⚛️ Built with React Context + Hooks
• 🧩 UI-agnostic (works with Vite, CRA, Next.js)
• 📦 Tree-shakable
• 🧠 TypeScript support
• 🔄 ESM + CJS build

📦 Installation

npm install react-smart-permission

USAGE

1️⃣ Wrap your App

import { PermissionProvider } from "react-smart-permission";

const permissionMap = {
  admin: ["delete_user", "edit_user"],
  user: ["view_user"]
};

<PermissionProvider
  user={{ role: "admin" }}
  permissionMap={permissionMap}
>
  <App />
</PermissionProvider>

2️⃣ Protect Components

import { Permission } from "react-smart-permission";

<Permission action="delete_user">
  <button>Delete User</button>
</Permission>

3️⃣ Use Hook

import { usePermission } from "react-smart-permission";

const { can } = usePermission();

if (can("delete_user")) { // allowed }