@primus-saas/react

Premium React UI components for building modern SaaS applications with the Primus Framework.

Installation

``bash
npm install @primus-saas/react
`

Quick Start

`tsx
import { PrimusProvider, PrimusLogin } from '@primus-saas/react';

function App() {
return (



);
}
`

Components

$3

| Component | Description |
|-----------|-------------|
| | Universal login form with social providers |
| | User profile display with avatar |
| | Real-time notification list |
| | Payment checkout with card input |
| | Universal document viewer (PDF, images) |

$3

| Component | Description |
|-----------|-------------|
| | 3D credit card display |
| | Transaction list with filters |

$3

| Component | Description |
|-----------|-------------|
| | Insurance policy summary |
| | Claim progress tracker |

Props Reference

$3

| Prop | Type | Description |
|------|------|-------------|
| allowSocial | boolean | Enable Google/GitHub login |
| onSuccess | (user) => void | Login success callback |

$3

| Prop | Type | Description |
|------|------|-------------|
| cardHolder | string | Name on card |
| last4 | string | Last 4 digits |
| expiry | string | MM/YY format |
| variant | 'black' \| 'gold' \| 'platinum' | Card theme |
| brand | 'visa' \| 'mastercard' | Card network |

$3

| Prop | Type | Description |
|------|------|-------------|
| amount | number | Charge amount (required) |
| onSubmit | () => Promise | Submit handler |

$3

| Prop | Type | Description |
|------|------|-------------|
| policyNumber | string | Policy ID |
| type | string | Auto, Home, Life, etc. |
| status | 'active' \| 'pending' \| 'expired' | Status |
| coverageAmount | number | Coverage limit |
| premiumAmount | number` | Monthly cost |

License

MIT © Primus SaaS Framework