Gamify Points History
Points history of a loyalty program with a running balance and transaction reversal.
About this block
What it's for
- Points history of a loyalty program with a running balance and transaction reversal.
- Rewards ledger for streaks and achievements in a habit or learning app.
- Support console auditing a member's manual adjustments and point expirations.
For real monetary transactions with accounting obligations, use Finance Transaction Ledger.
Includes
- Running balance ledger
- Earn spend summary
- Day grouped timeline
- Earn spend filtering
- Entry drilldown
- Entry reversal
- Accessible data table
- Keyboard navigation
Works with
- Radix UI primitives (the registry variant it ships in)
- React 19, Next.js App Router and Tailwind CSS 4, installed with the shadcn CLI
- Your theme tokens, in light and dark mode
Install
Included with Agentic UI Kit (one-time license). Install needs your license key: see pricing · connect your project.
Agentic UI CLI
agentic-ui add gamify-points-historyInstalls through shadcn and adapts the component to your design tokens.
shadcn CLI
npx shadcn@4.17.0 add @agentic-ui/gamify-points-historyUsed in
A standalone component: drop it into any screen.
- Type
- Block
- Variants
- Radix UI
- Themes
- Light and dark
- Widths
- Preview it at desktop, tablet and mobile widths above.
- Motion
- Animated, with a reduced-motion fallback
- npm packages
lucide-react- Registry dependencies
lib-primitives- Files
1 file
- components/agentic-ui/gamify-points-history/index.tsx
Related components
Gamify Achievements
Course badges with study streak and completed modules.
Details and live previewGamify Level Progress
A member's XP progress toward the next tier of the loyalty program.
Details and live previewGamify Streak Tracker
Daily study streak in a learning app with weekly lesson targets.
Details and live previewA11y Contrast Badge
Check in the browser whether the theme palette meets AA before opening the PR.
Details and live preview