Playground
Interactive e-commerce demo. Switch users to explore RBAC, feature flags, experiments, ABAC policies, plan gating, and gate components — all powered by react-access-engine.
User
customerfree planBasic access, free plan
Product Catalog
<Allow> + useAccess()⚡ Flash Sale — 40% off everything for the next 2 hours
🎧
Wireless Headphones
$249.99
📱
Phone Case
$29.99
⌨️
Mechanical Keyboard
$179.99
🖥️
4K Monitor
$599.99
AI Recommendations
<Allow feature>✗Upgrade to Premium to unlock AI-powered recommendations
Live Chat
<Feature>✗Live chat requires Plus or Premium plan
Usage
import { Allow, Feature, useAccess } from 'react-access-engine';
// Declarative gate
<Allow permission="cart:manage">
<AddToCartButton />
</Allow>
// Feature flag gate
<Feature name="live-chat" fallback={<UpgradeBanner />}>
<ChatWidget />
</Feature>
// Imperative check
const { can, has } = useAccess();
if (has('quick-buy') && can('cart:manage')) {
// show Buy Now button
}