Application
40 components
Alert Notification Dropdown
A sophisticated notification center component with dropdown interface for managing alerts and notifications. Features unread count badges, categorized notification types (info, success, warning, error), visual type indicators, and comprehensive action controls. Includes notification status management, timestamp display, and bulk actions like 'View all' and 'Mark all read'. Uses content structure pattern for simplified props interface. Perfect for application headers, dashboards, and user notification systems requiring real-time alert management.
Delete Confirmation Modal
A focused confirmation modal for destructive delete actions with proper warning UI, accessible design, and clear action buttons. Features warning icon, descriptive text, and cancel/confirm options with proper error handling and user feedback.
Project Creation Form Modal
A comprehensive form modal with React Hook Form validation and Zod schema for creating projects. Features text input, textarea, select dropdown, switch controls with proper validation, error handling, and accessibility support. Perfect for data collection workflows requiring robust form validation.
User Profile Modal
A comprehensive user profile modal displaying user information with avatar, contact details, badges, and recent activity. Features professional layout with clear information hierarchy, role and tier badges, department details, and activity timeline. Perfect for user directories and profile management.
Account Settings Modal
A comprehensive settings modal with tabbed interface for managing account preferences, notifications, security settings, and billing information. Features interactive switches, session management, billing details, and organized content sections with proper accessibility and responsive design.
Team Directory Modal
A searchable team member directory modal with contact information, status indicators, and interactive actions. Features member search, status badges, contact details, and dropdown actions for email, phone, and messaging. Perfect for team management and internal directories.
Projects Overview Modal
A comprehensive projects overview modal displaying project lists with status tracking, progress indicators, and team information. Features project table with status badges, priority indicators, progress bars, and summary statistics. Perfect for project management dashboards and tracking.
Media Gallery Modal
A comprehensive media gallery modal with image viewer, zoom controls, rotation, and navigation capabilities. Features responsive grid layout, full-screen viewer with controls, image metadata display, and comprehensive media management interface. Perfect for portfolio sites, media management systems, and photo galleries.
Multi-Step Wizard Modal
A comprehensive multi-step wizard modal for complex workflows and guided setup processes with React Hook Form integration and Zod validation. Features customizable steps, form validation with error handling, step navigation with validation triggers, progress tracking, and step completion management. Perfect for onboarding flows, project setup wizards, and account creation processes.
Basic Toast Notifications
Basic toast notification component showcasing simple toast configurations with minimal content. Features three toast types: simple message, with icon, and with description. Perfect for applications requiring straightforward notification experiences with clean, minimal design and basic functionality.
Status Toast Notifications
Status toast notification component showcasing different toast types with semantic colors and appropriate icons. Features success, error, warning, and info toasts with consistent styling and messaging patterns. Perfect for applications requiring clear status communication with users.
Interactive Toast Notifications
Interactive toast notification component showcasing toasts with action buttons, confirmations, and user interactions. Features single and multiple action buttons, delete confirmations, and retry functionality with async operations. Perfect for applications requiring user engagement through toast notifications.
Loading & Progress Toast Notifications
Loading and progress toast notification component showcasing different loading states and progress indicators. Features promise-based loading, incremental progress updates, simple loading states, and download progress simulation. Perfect for async operations, file uploads/downloads, and long-running processes.
Custom Styled Toasts
Toast notifications with custom styling, themes, and branding for different contexts. Features premium yellow themes, notification blue themes, persistent toasts with custom actions, and comprehensive styling options. Perfect for applications requiring branded notification experiences with custom visual themes.
Rich Content Toasts
Advanced toast notifications with complex layouts, custom components, and interactive elements. Features social notifications with avatars and action buttons, email notifications with priority badges, and comprehensive interaction handling. Perfect for applications requiring rich notification experiences with user engagement features.
User Management Table
A comprehensive data table with user management capabilities including sorting, filtering, column visibility toggles, row selection, pagination, and action dropdowns. Built with TanStack Table for performance and flexibility. Features avatar display, status badges, date formatting, and contextual actions. Perfect for admin dashboards, user management systems, and data display applications requiring full CRUD operations.
Order Management Table
An advanced order management table with comprehensive filtering, bulk actions, and status management capabilities. Features search functionality, status filtering, column visibility controls, row selection, bulk operations, and detailed order information with currency formatting. Includes header with action buttons, configurable pagination, and complete CRUD operations. Perfect for e-commerce admin panels, order management systems, and business dashboards requiring complex data operations with internationalization support.
Expandable Project Table
An expandable project management table with hierarchical data display and comprehensive task management. Features expandable rows to show project tasks, progress tracking with visual progress bars, status management with color-coded badges, and overdue date highlighting. Includes nested task management, detailed project information, search functionality, row selection, and comprehensive action menus for both projects and tasks. Perfect for project management dashboards, task tracking systems, hierarchical data visualization, and applications requiring parent-child data relationships with detailed drill-down capabilities.
Analytics Dashboard Table
An advanced analytics dashboard table with comprehensive metrics visualization and trend analysis capabilities. Features summary metric cards with trend indicators, visual progress bars for bounce rates, category-based filtering, date range selection, and detailed analytics data display. Includes trend visualization with directional arrows, color-coded progress indicators based on performance thresholds, and comprehensive action menus for data management. Perfect for web analytics dashboards, marketing analytics platforms, performance monitoring systems, and data visualization applications requiring detailed metrics analysis with visual trend indicators and interactive filtering.
Team Member List
Comprehensive team member list with status indicators, role badges, star functionality, and action dropdowns. Features responsive design with mobile-friendly actions, customizable display options, and interactive elements for team management.
Project Updates Feed
Project updates feed displaying various activity types with status indicators, metadata, and interactive elements. Features type-based icons, author information, timestamps, and customizable display options for project management dashboards.
File Management List
File management list with type-based icons, star functionality, sharing status, tags, and comprehensive action menus. Features responsive design with mobile-friendly dropdown actions, file type detection, and customizable display options.
Task Management List
Comprehensive task management list with checkboxes, priority indicators, due date tracking, subtask progress, assignee information, and dropdown actions. Features overdue detection, priority-based styling, and comprehensive task management functionality.
App Store Grid
Responsive card grid component for displaying applications, tools, or content items with images, metadata, and interactive actions. Features star toggles, dropdown menus, status badges, download counts, ratings, and install buttons. Perfect for app stores, galleries, plugin marketplaces, or any content showcase with customizable event handlers and empty states.
Team Member Grid
Responsive team member grid component with avatars, status indicators, department badges, and communication actions. Features online/busy/away/offline status colors, project statistics, task completion metrics, and dropdown menus for email, phone, and video calls. Perfect for team directories, employee dashboards, organizational charts, and contact management systems.
Project Management Grid
Comprehensive project management grid component with progress tracking, team members, technology stacks, status badges, and priority indicators. Features star functionality, progress bars, team avatars, technology tags, due dates, commit counts, and dropdown actions for project and repository access. Perfect for project dashboards, portfolio displays, development tracking, and team management systems.
Media Gallery Grid
Comprehensive media gallery grid component for displaying images, videos, and audio files with thumbnails, metadata, and interactive actions. Features type-based badges and icons, duration overlays for media files, like functionality with real-time updates, hover effects with play buttons for videos, view/download/share dropdown actions, and comprehensive metadata display including file size, resolution, and upload dates. Perfect for media libraries, digital asset management systems, content galleries, or multimedia portfolios.
Activity Feed Card
Activity feed card with real-time updates, type-based icons, user avatars, and action buttons. Features activity timeline with timestamps, user attribution, and dropdown menus. Perfect for dashboards, admin panels, and user engagement tracking.
Notifications Card
Notifications card with alert system, read/unread status indicators, type-based styling, and action dropdowns. Features notification badges, timestamps, and configurable actions. Perfect for notification centers, alerts dashboard, and user communication systems.
Stats Cards
Dashboard statistics cards with customizable metrics, trend indicators, color-coded icons, and dropdown menus. Features responsive grid layout, gradient overlays, and support for increase/decrease trends. Perfect for displaying KPIs, analytics, and business metrics.
Profile Cards
Professional profile cards with cover images, avatars, status indicators, contact information, badges, and statistics. Features dropdown menus, action buttons, and responsive design. Perfect for team directories, user profiles, and contact management.
Project Cards
Project management cards with progress tracking, team members, status indicators, priority flags, and task counters. Features time tracking, due dates, attachments, comments, and dropdown actions. Perfect for project dashboards, team management, and workflow tracking.