Changelog

All notable changes to the SaaS Metrics Kit are documented here.

v1.0.0 -- Initial Release

Released: May 2026

Pages (25 total)

• Analytics (10): Dashboard Overview, Revenue, Customers, Churn Analysis, Retention, Growth, Unit Economics, Forecasting, Conversion Funnel, Industry Benchmarks
• Management (8): Subscriptions, Pricing Plans, Customer List, Customer Detail, Invoices, Integrations, Reports, Alerts & Monitoring
• Settings (3): General Settings, Team Management, User Profile
• Auth (3): Login, Register, Forgot Password
• Utility (1): Landing Page, 404 Page

Components (40+ total)

• ~30 Primitives -- shadcn/ui components (Accordion, AlertDialog, Avatar, Badge, Breadcrumb, Button, Calendar, Card, Checkbox, Collapsible, Command, Dialog, DropdownMenu, Input, InputGroup, Label, Popover, Progress, RadioGroup, ScrollArea, Select, Separator, Sheet, Slider, Sonner, Switch, Table, Tabs, Textarea, Tooltip)
• 2 Analytics Composites -- MetricCard, ActivityFeed
• 4 Shared Composites -- PageHeader, StatCard, StatusBadge, EmptyState
• 4 Layout Components -- AppHeader, AppSidebar, SkipLink, ThemeToggle
• 2 Accessibility Components -- LiveRegion, VisuallyHidden

Chart Types (10+)

• Area charts (MRR trend on dashboard)
• Line charts (revenue history, retention curves, customer count trend, MRR contribution)
• Bar charts -- grouped (new vs churned, churn by plan), stacked (MRR movement, revenue by plan), horizontal (CAC by channel), standard (health score distribution, conversion by source, time to convert, subscribers per plan)
• Pie/donut charts (churn reasons, customer segments, plan distribution, revenue per plan)
• Composed charts (forecast with area bands + line overlays)
• Custom funnel visualization (conversion funnel with proportional bars)
• Cohort heatmap (retention table with color-coded cells)

Features

• Next.js 16 with App Router
• React 19 with TypeScript
• Tailwind CSS v4 with oklch design tokens (hue 260 blue-violet primary, hue 71 gold secondary)
• Route groups: (dashboard), (auth) for clean URL structure
• 10 analytics dashboards covering all core SaaS metrics
• Recharts analytics (area, bar, line, pie, composed, funnel, heatmap)
• Cohort retention heatmap with color-coded percentage cells
• Revenue forecasting with optimistic/base/pessimistic scenarios and adjustable assumption sliders
• Industry benchmark comparison with percentile rankings
• Subscription management with plan/status filtering
• Pricing plan cards with feature comparison matrix
• Customer management with search, filter, pagination, and health scores
• Customer detail page with MRR trend, health score, and activity log
• Invoice management with failed payment alerts, search, date filtering, and bulk actions
• Integration management with category tabs and connect/disconnect controls
• Report generation with templates, format selection, and saved report history
• Alert monitoring with active alert tracking and configurable alert rules with channel selection
• General settings with company info, localization, data retention, and danger zone
• Team management with role-based permissions matrix, member table, and invite dialog
• User profile with avatar upload, password change, notification preferences, 2FA toggle, and session management
• Light and dark mode via next-themes
• WCAG AA accessible (skip link, keyboard navigation, focus indicators, screen reader support, ARIA labels)
• Responsive from 375px to 1440px+
• 44px minimum touch targets
• Reduced motion support via prefers-reduced-motion
• Five accessibility hooks (use-announce, use-focus-trap, use-keyboard-navigation, use-mobile, use-reduced-motion)
• Three font families: Inter (body), DM Sans (headings), JetBrains Mono (code)
• date-fns for localized date formatting
• Sonner for toast notifications
• Realistic seed data modeling a B2B SaaS at ~$127K MRR with 1,284 customers