popsite-ui 1.0.0

package/data/systems/analyticsDashboard.js

@@ -0,0 +1,48 @@
+const analyticsDashboardSystem = {
+    id: 'analytics-dashboard',
+    title: 'Analytics Dashboard',
+    uiStyle: 'Data-heavy UI',
+    appearance: 'light',
+    primary: '#7c3aed',
+    description: 'Dense analytical setup flow for dataset volume, refresh cadence, and seat planning.',
+    highlights: ['Data source scaling', 'Refresh schedule', 'Analyst seat economics'],
+    fields: [
+        { name: 'accountName', label: 'Account Name', type: 'text', required: true, placeholder: 'Growth Intelligence' },
+        {
+            name: 'dashboardType',
+            label: 'Dashboard Type',
+            type: 'select',
+            options: ['Executive KPI', 'Marketing Funnel', 'Finance Control', 'Product Usage']
+        },
+        { name: 'dataSources', label: 'Data Sources', type: 'number', min: 1, max: 100, defaultValue: 8, required: true },
+        {
+            name: 'refreshRate',
+            label: 'Refresh Rate',
+            type: 'select',
+            options: ['Hourly', 'Every 6 Hours', 'Daily', 'Weekly']
+        },
+        { name: 'analystSeats', label: 'Analyst Seats', type: 'number', min: 1, max: 120, defaultValue: 10, required: true },
+        {
+            name: 'subscriptionTier',
+            label: 'Subscription Tier',
+            type: 'radio',
+            options: ['Core', 'Pro', 'Elite'],
+            defaultValue: 'Core'
+        }
+    ],
+    pricing: {
+        quantityField: 'analystSeats',
+        quantityLabel: 'Seats',
+        tierField: 'subscriptionTier',
+        tiers: {
+            Core: 55,
+            Pro: 95,
+            Elite: 150
+        },
+        fee: 40,
+        currency: 'USD',
+        chargeLabel: 'Platform Total'
+    }
+};
+
+export default analyticsDashboardSystem;

package/data/systems/chatMessaging.js

@@ -0,0 +1,43 @@
+const chatMessagingSystem = {
+    id: 'chat-messaging',
+    title: 'Chat and Messaging App',
+    uiStyle: 'WhatsApp Web UI',
+    appearance: 'light',
+    primary: '#0084ff',
+    description: 'Communication workspace setup with team seats, support windows, and plan tiers.',
+    highlights: ['Workspace onboarding', 'Seat scaling', 'Plan-level pricing'],
+    fields: [
+        { name: 'workspaceName', label: 'Workspace Name', type: 'text', required: true, placeholder: 'Blue Orbit Team' },
+        { name: 'teamLead', label: 'Team Lead', type: 'text', required: true, placeholder: 'Priya Das' },
+        { name: 'activeUsers', label: 'Active Users', type: 'number', min: 1, max: 500, defaultValue: 25, required: true },
+        { name: 'goLiveDate', label: 'Go Live Date', type: 'date', required: true },
+        {
+            name: 'planTier',
+            label: 'Plan Tier',
+            type: 'radio',
+            options: ['Starter', 'Business', 'Enterprise'],
+            defaultValue: 'Starter'
+        },
+        {
+            name: 'supportWindow',
+            label: 'Support Window',
+            type: 'select',
+            options: ['Business Hours', 'Extended Hours', '24x7 Support']
+        }
+    ],
+    pricing: {
+        quantityField: 'activeUsers',
+        quantityLabel: 'Users',
+        tierField: 'planTier',
+        tiers: {
+            Starter: 6,
+            Business: 12,
+            Enterprise: 20
+        },
+        fee: 15,
+        currency: 'USD',
+        chargeLabel: 'Subscription Total'
+    }
+};
+
+export default chatMessagingSystem;

package/data/systems/ecommerceStore.js

@@ -0,0 +1,50 @@
+const ecommerceStoreSystem = {
+    id: 'ecommerce-store',
+    title: 'E-commerce Store',
+    uiStyle: 'Amazon-style UI',
+    appearance: 'light',
+    primary: '#f97316',
+    description: 'Commerce checkout shell with delivery plans, quantity scaling, and invoice totals.',
+    highlights: ['Catalog-first flow', 'Fulfillment options', 'Order economics panel'],
+    fields: [
+        { name: 'customerName', label: 'Customer Name', type: 'text', required: true, placeholder: 'Morgan Reed' },
+        {
+            name: 'category',
+            label: 'Product Category',
+            type: 'select',
+            options: ['Electronics', 'Home Decor', 'Sports', 'Beauty']
+        },
+        { name: 'dispatchDate', label: 'Dispatch Date', type: 'date', required: true },
+        { name: 'quantity', label: 'Quantity', type: 'number', min: 1, max: 50, defaultValue: 1, required: true },
+        {
+            name: 'deliveryPlan',
+            label: 'Delivery Plan',
+            type: 'radio',
+            options: ['Standard', 'Prime', 'Same Day'],
+            defaultValue: 'Standard'
+        },
+        {
+            name: 'addressNote',
+            label: 'Address Note',
+            type: 'textarea',
+            rows: 3,
+            placeholder: 'Landmark or delivery instruction',
+            fullWidth: true
+        }
+    ],
+    pricing: {
+        quantityField: 'quantity',
+        quantityLabel: 'Units',
+        tierField: 'deliveryPlan',
+        tiers: {
+            Standard: 35,
+            Prime: 55,
+            'Same Day': 85
+        },
+        fee: 12,
+        currency: 'USD',
+        chargeLabel: 'Order Grand Total'
+    }
+};
+
+export default ecommerceStoreSystem;

package/data/systems/eventTicketBooking.js

@@ -0,0 +1,50 @@
+const eventTicketBookingSystem = {
+    id: 'event-ticket-booking',
+    title: 'Event and Ticket Booking',
+    uiStyle: 'Dark event UI',
+    appearance: 'dark',
+    primary: '#7c3aed',
+    description: 'Concert and stage event workflow with dark visuals and access-zone tiers.',
+    highlights: ['Event-centric cards', 'Zone-based access', 'Fast attendee confirmation'],
+    fields: [
+        { name: 'attendeeName', label: 'Attendee Name', type: 'text', required: true, placeholder: 'Riley Brooks' },
+        {
+            name: 'eventName',
+            label: 'Event',
+            type: 'select',
+            options: ['Indie Night Live', 'Tech Summit 2026', 'Stand-up Showcase', 'Startup Expo']
+        },
+        { name: 'eventDate', label: 'Event Date', type: 'date', required: true },
+        { name: 'passes', label: 'Passes', type: 'number', min: 1, max: 20, defaultValue: 2, required: true },
+        {
+            name: 'accessZone',
+            label: 'Access Zone',
+            type: 'radio',
+            options: ['General', 'VIP', 'Backstage'],
+            defaultValue: 'General'
+        },
+        {
+            name: 'notes',
+            label: 'Special Notes',
+            type: 'textarea',
+            rows: 3,
+            placeholder: 'Accessibility or seating preferences',
+            fullWidth: true
+        }
+    ],
+    pricing: {
+        quantityField: 'passes',
+        quantityLabel: 'Passes',
+        tierField: 'accessZone',
+        tiers: {
+            General: 95,
+            VIP: 180,
+            Backstage: 320
+        },
+        fee: 35,
+        currency: 'USD',
+        chargeLabel: 'Event Total'
+    }
+};
+
+export default eventTicketBookingSystem;

package/data/systems/flightBooking.js

@@ -0,0 +1,38 @@
+const flightBookingSystem = {
+    id: 'flight-booking',
+    title: 'Flight Booking System',
+    uiStyle: 'Clean travel UI',
+    appearance: 'light',
+    primary: '#1a73e8',
+    description: 'Route-first travel booking flow with clear class selection and traveler totals.',
+    highlights: ['City pair routing', 'Cabin class pricing', 'Travel-ready summary'],
+    fields: [
+        { name: 'passengerName', label: 'Passenger Name', type: 'text', required: true, placeholder: 'Jordan Lee' },
+        { name: 'origin', label: 'From', type: 'select', options: ['Chennai', 'Mumbai', 'Delhi', 'Bengaluru'] },
+        { name: 'destination', label: 'To', type: 'select', options: ['Dubai', 'Singapore', 'London', 'New York'] },
+        { name: 'travelDate', label: 'Travel Date', type: 'date', required: true },
+        { name: 'passengers', label: 'Passengers', type: 'number', min: 1, max: 8, defaultValue: 1, required: true },
+        {
+            name: 'cabinClass',
+            label: 'Cabin Class',
+            type: 'radio',
+            options: ['Economy', 'Business', 'First Class'],
+            defaultValue: 'Economy'
+        }
+    ],
+    pricing: {
+        quantityField: 'passengers',
+        quantityLabel: 'Travelers',
+        tierField: 'cabinClass',
+        tiers: {
+            Economy: 180,
+            Business: 420,
+            'First Class': 720
+        },
+        fee: 65,
+        currency: 'USD',
+        chargeLabel: 'Trip Total'
+    }
+};
+
+export default flightBookingSystem;

package/data/systems/foodOrdering.js

@@ -0,0 +1,48 @@
+const foodOrderingSystem = {
+    id: 'food-ordering',
+    title: 'Food Ordering System',
+    uiStyle: 'Swiggy-style UI',
+    appearance: 'light',
+    primary: '#fc8019',
+    description: 'Fast-moving delivery ordering UI with per-item totals and delivery speed tiers.',
+    highlights: ['Restaurant switcher', 'Delivery speed tiers', 'Live-ready order summary'],
+    fields: [
+        { name: 'customerName', label: 'Customer Name', type: 'text', required: true, placeholder: 'Casey James' },
+        {
+            name: 'restaurant',
+            label: 'Restaurant',
+            type: 'select',
+            options: ['Spice Factory', 'Urban Bowl', 'Tandoor Point', 'Salad Story']
+        },
+        { name: 'deliveryDate', label: 'Delivery Date', type: 'date', required: true },
+        {
+            name: 'deliveryWindow',
+            label: 'Delivery Window',
+            type: 'select',
+            options: ['30 mins', '45 mins', '60 mins', '90 mins']
+        },
+        { name: 'items', label: 'Items', type: 'number', min: 1, max: 25, defaultValue: 3, required: true },
+        {
+            name: 'deliveryType',
+            label: 'Delivery Type',
+            type: 'radio',
+            options: ['Standard', 'Express', 'Priority'],
+            defaultValue: 'Standard'
+        }
+    ],
+    pricing: {
+        quantityField: 'items',
+        quantityLabel: 'Items',
+        tierField: 'deliveryType',
+        tiers: {
+            Standard: 14,
+            Express: 21,
+            Priority: 28
+        },
+        fee: 5,
+        currency: 'USD',
+        chargeLabel: 'Order Total'
+    }
+};
+
+export default foodOrderingSystem;

package/data/systems/hospitalAppointment.js

@@ -0,0 +1,50 @@
+const hospitalAppointmentSystem = {
+    id: 'hospital-appointment',
+    title: 'Hospital and Appointment System',
+    uiStyle: 'Medical UI',
+    appearance: 'light',
+    primary: '#00897b',
+    description: 'Clean care-centric scheduling UI for departments, modes, and appointment batches.',
+    highlights: ['Department routing', 'Consultation modes', 'Appointment totals'],
+    fields: [
+        { name: 'patientName', label: 'Patient Name', type: 'text', required: true, placeholder: 'Samira Khan' },
+        {
+            name: 'department',
+            label: 'Department',
+            type: 'select',
+            options: ['Cardiology', 'Dermatology', 'Orthopedics', 'General Medicine']
+        },
+        { name: 'appointmentDate', label: 'Appointment Date', type: 'date', required: true },
+        { name: 'slots', label: 'Slots', type: 'number', min: 1, max: 5, defaultValue: 1, required: true },
+        {
+            name: 'consultationMode',
+            label: 'Consultation Mode',
+            type: 'radio',
+            options: ['OPD', 'Telehealth', 'Priority'],
+            defaultValue: 'OPD'
+        },
+        {
+            name: 'symptoms',
+            label: 'Symptoms Note',
+            type: 'textarea',
+            rows: 3,
+            placeholder: 'Describe key symptoms briefly',
+            fullWidth: true
+        }
+    ],
+    pricing: {
+        quantityField: 'slots',
+        quantityLabel: 'Appointments',
+        tierField: 'consultationMode',
+        tiers: {
+            OPD: 60,
+            Telehealth: 75,
+            Priority: 120
+        },
+        fee: 20,
+        currency: 'USD',
+        chargeLabel: 'Consultation Total'
+    }
+};
+
+export default hospitalAppointmentSystem;

package/data/systems/hotelBooking.js

@@ -0,0 +1,38 @@
+const hotelBookingSystem = {
+    id: 'hotel-booking',
+    title: 'Hotel Booking System',
+    uiStyle: 'Airbnb-style UI',
+    appearance: 'light',
+    primary: '#ff5a5f',
+    description: 'Warm hospitality layout for stays, room classes, and night-based billing.',
+    highlights: ['Stay length billing', 'Room categories', 'Guest-friendly flow'],
+    fields: [
+        { name: 'guestName', label: 'Guest Name', type: 'text', required: true, placeholder: 'Taylor Watts' },
+        { name: 'city', label: 'City', type: 'select', options: ['Goa', 'Jaipur', 'Pondicherry', 'Kochi'] },
+        { name: 'checkInDate', label: 'Check In', type: 'date', required: true },
+        { name: 'nights', label: 'Nights', type: 'number', min: 1, max: 30, defaultValue: 2, required: true },
+        {
+            name: 'roomType',
+            label: 'Room Type',
+            type: 'radio',
+            options: ['Studio', 'Deluxe', 'Suite'],
+            defaultValue: 'Studio'
+        },
+        { name: 'guests', label: 'Guests', type: 'number', min: 1, max: 6, defaultValue: 2, required: true }
+    ],
+    pricing: {
+        quantityField: 'nights',
+        quantityLabel: 'Nights',
+        tierField: 'roomType',
+        tiers: {
+            Studio: 120,
+            Deluxe: 210,
+            Suite: 360
+        },
+        fee: 80,
+        currency: 'USD',
+        chargeLabel: 'Stay Total'
+    }
+};
+
+export default hotelBookingSystem;

package/data/systems/index.js

@@ -0,0 +1,31 @@
+import movieBookingSystem from './movieBooking';
+import flightBookingSystem from './flightBooking';
+import hotelBookingSystem from './hotelBooking';
+import eventTicketBookingSystem from './eventTicketBooking';
+import foodOrderingSystem from './foodOrdering';
+import ecommerceStoreSystem from './ecommerceStore';
+import libraryManagementSystem from './libraryManagement';
+import studentRegistrationSystem from './studentRegistration';
+import hospitalAppointmentSystem from './hospitalAppointment';
+import invoiceBillingSystem from './invoiceBilling';
+import chatMessagingSystem from './chatMessaging';
+import analyticsDashboardSystem from './analyticsDashboard';
+import quizExamSystem from './quizExam';
+
+const systems = [
+    movieBookingSystem,
+    flightBookingSystem,
+    hotelBookingSystem,
+    eventTicketBookingSystem,
+    foodOrderingSystem,
+    ecommerceStoreSystem,
+    libraryManagementSystem,
+    studentRegistrationSystem,
+    hospitalAppointmentSystem,
+    invoiceBillingSystem,
+    chatMessagingSystem,
+    analyticsDashboardSystem,
+    quizExamSystem
+];
+
+export default systems;

package/data/systems/invoiceBilling.js

@@ -0,0 +1,50 @@
+const invoiceBillingSystem = {
+    id: 'invoice-billing',
+    title: 'Invoice and Billing System',
+    uiStyle: 'FreshBooks-style UI',
+    appearance: 'light',
+    primary: '#1e3a5f',
+    description: 'Professional billing interface for services, usage units, and polished invoice totals.',
+    highlights: ['Client-first billing', 'Plan-based unit rates', 'Clear amount breakdown'],
+    fields: [
+        { name: 'clientName', label: 'Client Name', type: 'text', required: true, placeholder: 'Northwind Labs' },
+        {
+            name: 'serviceType',
+            label: 'Service Type',
+            type: 'select',
+            options: ['Design', 'Engineering', 'Consulting', 'Support']
+        },
+        { name: 'invoiceDate', label: 'Invoice Date', type: 'date', required: true },
+        { name: 'billableUnits', label: 'Billable Units', type: 'number', min: 1, max: 300, defaultValue: 20, required: true },
+        {
+            name: 'billingPlan',
+            label: 'Billing Plan',
+            type: 'radio',
+            options: ['Hourly', 'Project', 'Retainer'],
+            defaultValue: 'Hourly'
+        },
+        {
+            name: 'memo',
+            label: 'Invoice Memo',
+            type: 'textarea',
+            rows: 3,
+            placeholder: 'Reference terms, milestone, or PO number',
+            fullWidth: true
+        }
+    ],
+    pricing: {
+        quantityField: 'billableUnits',
+        quantityLabel: 'Units',
+        tierField: 'billingPlan',
+        tiers: {
+            Hourly: 40,
+            Project: 70,
+            Retainer: 90
+        },
+        fee: 25,
+        currency: 'USD',
+        chargeLabel: 'Invoice Total'
+    }
+};
+
+export default invoiceBillingSystem;

package/data/systems/libraryManagement.js

@@ -0,0 +1,43 @@
+const libraryManagementSystem = {
+    id: 'library-management',
+    title: 'Library Management System',
+    uiStyle: 'Admin panel UI',
+    appearance: 'light',
+    primary: '#0891b2',
+    description: 'Administrative module for membership, lending period, and service charge control.',
+    highlights: ['Member onboarding', 'Borrow duration controls', 'Librarian dashboard rhythm'],
+    fields: [
+        { name: 'librarianName', label: 'Librarian Name', type: 'text', required: true, placeholder: 'Devika Nair' },
+        { name: 'memberName', label: 'Member Name', type: 'text', required: true, placeholder: 'Noah Carter' },
+        {
+            name: 'bookCategory',
+            label: 'Book Category',
+            type: 'select',
+            options: ['Technology', 'Literature', 'Business', 'History']
+        },
+        { name: 'issueDate', label: 'Issue Date', type: 'date', required: true },
+        { name: 'borrowDays', label: 'Borrow Days', type: 'number', min: 1, max: 45, defaultValue: 7, required: true },
+        {
+            name: 'membershipType',
+            label: 'Membership Type',
+            type: 'radio',
+            options: ['Regular', 'Scholar', 'Premium'],
+            defaultValue: 'Regular'
+        }
+    ],
+    pricing: {
+        quantityField: 'borrowDays',
+        quantityLabel: 'Borrow Days',
+        tierField: 'membershipType',
+        tiers: {
+            Regular: 2,
+            Scholar: 1,
+            Premium: 3
+        },
+        fee: 10,
+        currency: 'USD',
+        chargeLabel: 'Library Service Total'
+    }
+};
+
+export default libraryManagementSystem;

package/data/systems/movieBooking.js

@@ -0,0 +1,48 @@
+const movieBookingSystem = {
+    id: 'movie-booking',
+    title: 'Movie Booking System',
+    uiStyle: 'Dark cinema UI',
+    appearance: 'dark',
+    primary: '#e50914',
+    description: 'High-contrast cinema booking workspace with tiered seating and fast checkout.',
+    highlights: ['Night show focus', 'Tiered seats', 'Compact confirmation'],
+    fields: [
+        { name: 'customerName', label: 'Customer Name', type: 'text', required: true, placeholder: 'Alex Morgan' },
+        {
+            name: 'movieTitle',
+            label: 'Movie',
+            type: 'select',
+            options: ['Dune: Part Two', 'Oppenheimer', 'Interstellar', 'Spider-Verse']
+        },
+        { name: 'showDate', label: 'Show Date', type: 'date', required: true },
+        {
+            name: 'showTime',
+            label: 'Show Time',
+            type: 'select',
+            options: ['12:00 PM', '03:30 PM', '07:00 PM', '10:15 PM']
+        },
+        { name: 'seats', label: 'Seats', type: 'number', min: 1, max: 12, defaultValue: 2, required: true },
+        {
+            name: 'seatType',
+            label: 'Seat Type',
+            type: 'radio',
+            options: ['Standard', 'Premium', 'Recliner'],
+            defaultValue: 'Standard'
+        }
+    ],
+    pricing: {
+        quantityField: 'seats',
+        quantityLabel: 'Seats',
+        tierField: 'seatType',
+        tiers: {
+            Standard: 220,
+            Premium: 430,
+            Recliner: 760
+        },
+        fee: 45,
+        currency: 'USD',
+        chargeLabel: 'Checkout Total'
+    }
+};
+
+export default movieBookingSystem;

package/data/systems/quizExam.js

@@ -0,0 +1,38 @@
+const quizExamSystem = {
+    id: 'quiz-exam',
+    title: 'Quiz and Exam System',
+    uiStyle: 'Test-taking UI',
+    appearance: 'light',
+    primary: '#16a34a',
+    description: 'Assessment setup portal focused on candidates, mode controls, and proctor pricing.',
+    highlights: ['Exam logistics', 'Mode switch', 'Candidate-linked totals'],
+    fields: [
+        { name: 'instructorName', label: 'Instructor Name', type: 'text', required: true, placeholder: 'Nina Thomas' },
+        { name: 'examTitle', label: 'Exam Title', type: 'text', required: true, placeholder: 'Data Structures Midterm' },
+        { name: 'examDate', label: 'Exam Date', type: 'date', required: true },
+        { name: 'questionCount', label: 'Question Count', type: 'number', min: 10, max: 300, defaultValue: 50, required: true },
+        { name: 'candidates', label: 'Candidates', type: 'number', min: 1, max: 2000, defaultValue: 60, required: true },
+        {
+            name: 'examMode',
+            label: 'Exam Mode',
+            type: 'radio',
+            options: ['Practice', 'Proctored', 'Certification'],
+            defaultValue: 'Practice'
+        }
+    ],
+    pricing: {
+        quantityField: 'candidates',
+        quantityLabel: 'Candidates',
+        tierField: 'examMode',
+        tiers: {
+            Practice: 2,
+            Proctored: 5,
+            Certification: 9
+        },
+        fee: 18,
+        currency: 'USD',
+        chargeLabel: 'Assessment Total'
+    }
+};
+
+export default quizExamSystem;

package/data/systems/studentRegistration.js

@@ -0,0 +1,43 @@
+const studentRegistrationSystem = {
+    id: 'student-registration',
+    title: 'Student Registration System',
+    uiStyle: 'University portal UI',
+    appearance: 'light',
+    primary: '#4f46e5',
+    description: 'Structured academic registration module for course, semester, and enrollment type.',
+    highlights: ['Academic intake flow', 'Semester-linked fees', 'Department-ready details'],
+    fields: [
+        { name: 'studentName', label: 'Student Name', type: 'text', required: true, placeholder: 'Aarav Menon' },
+        { name: 'registerNo', label: 'Register Number', type: 'text', required: true, placeholder: 'VIT-26-0142' },
+        { name: 'email', label: 'Email', type: 'email', required: true, placeholder: 'student@university.edu' },
+        {
+            name: 'course',
+            label: 'Course',
+            type: 'select',
+            options: ['B.Tech CSE', 'B.Tech IT', 'MBA', 'B.Sc Data Science']
+        },
+        { name: 'semester', label: 'Semester', type: 'number', min: 1, max: 8, defaultValue: 1, required: true },
+        {
+            name: 'registrationType',
+            label: 'Registration Type',
+            type: 'radio',
+            options: ['Regular', 'Lateral', 'International'],
+            defaultValue: 'Regular'
+        }
+    ],
+    pricing: {
+        quantityField: 'semester',
+        quantityLabel: 'Semester',
+        tierField: 'registrationType',
+        tiers: {
+            Regular: 120,
+            Lateral: 180,
+            International: 450
+        },
+        fee: 30,
+        currency: 'USD',
+        chargeLabel: 'Enrollment Total'
+    }
+};
+
+export default studentRegistrationSystem;