storefront-layouts-staging 1.0.0-staging.0

package/dist/layouts/motivational-speaker/pages/ServiceDetailPage.js

@@ -0,0 +1,153 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Button } from '../../../components/ui/button.js';
+import { Breadcrumbs } from '../../../components/ui/breadcrumbs.js';
+import { Play, FileText, Headphones, Lock, Star, CheckCircle, Clock, Download, Share2, Heart, ArrowRight, BookOpen, Users, Award, X } from 'lucide-react';
+import { useState, useMemo } from 'react';
+import { useStore } from '../../../lib/store-context.js';
+import { useToast } from '../../../components/ui/toast.js';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '../../../lib/auth-context.js';
+import Image from 'next/image';
+import { CategoryDescription } from '../../../components/rich-text/CategoryDescription.js';
+import { richFieldPlainTextForDisplay } from '../../../lib/rich-html.js';
+import { formatCurrency, isEditorPreviewMode, resolveServiceBySlugForDisplay, resolveStoreServicesForDisplay } from '../../../lib/utils/index.js';
+import { useCatalogLoader } from '../../../hooks/use-catalog-loader.js';
+import { getServiceImage } from '../../../lib/utils/asset-helpers.js';
+import { motion } from 'framer-motion';
+import Link from 'next/link';
+import { cn } from '../../../lib/utils/index.js';
+export function MotivationalServiceDetailPage({ storeConfig: initialConfig, serviceSlug }) {
+    const { store, addToCart, isCartLoading, toggleWishlist, isInWishlist, isWishlistLoading, cart } = useStore();
+    const storeConfig = store || initialConfig;
+    const isPreview = isEditorPreviewMode(storeConfig);
+    const { services: loadedServices } = useCatalogLoader(storeConfig, {
+        fetchProducts: false,
+        fetchCategories: false,
+    });
+    const services = resolveStoreServicesForDisplay(loadedServices, isPreview);
+    const service = resolveServiceBySlugForDisplay(loadedServices, serviceSlug, isPreview);
+    const { addToast } = useToast();
+    const router = useRouter();
+    const { isAuthenticated } = useAuth();
+    const [selectedTab, setSelectedTab] = useState('overview');
+    const [isPlaying, setIsPlaying] = useState(false);
+    const hasAccess = useMemo(() => {
+        if (service?.accessLevel === 'free' || service?.price === 0)
+            return true;
+        // In a real app, we'd check if the user has purchased this specific item or has a subscription
+        // For this demo, let's assume they have access if they are authenticated
+        return isAuthenticated;
+    }, [service, isAuthenticated]);
+    // Handle playing video/audio
+    const handlePlay = () => {
+        if (!hasAccess) {
+            handleAddToCart();
+            return;
+        }
+        setIsPlaying(true);
+    };
+    // Related services
+    const relatedServices = useMemo(() => {
+        if (!service)
+            return [];
+        return services
+            .filter(s => s.categoryId === service.categoryId && s.id !== service.id)
+            .slice(0, 4);
+    }, [service, services]);
+    if (!service) {
+        return (_jsx("div", { className: "min-h-screen bg-white flex items-center justify-center p-8", children: _jsxs("div", { className: "text-center", children: [_jsx("h1", { className: "text-2xl font-bold mb-2", children: "Content Not Found" }), _jsx("p", { className: "text-gray-600 mb-4", children: "The content you're looking for doesn't exist." }), _jsx(Link, { href: `/${storeConfig.slug}/services`, children: _jsx(Button, { children: "Browse All Content" }) })] }) }));
+    }
+    // Determine content type
+    let TypeIcon = Play;
+    let typeLabel = "Video Course";
+    let contentTypeColor = "bg-blue-500";
+    if (service.contentType === 'audio') {
+        TypeIcon = Headphones;
+        typeLabel = "Audiobook";
+        contentTypeColor = "bg-purple-500";
+    }
+    else if (service.contentType === 'pdf') {
+        TypeIcon = FileText;
+        typeLabel = "PDF Guide";
+        contentTypeColor = "bg-green-500";
+    }
+    const isLocked = service.accessLevel === 'subscription' || service.accessLevel === 'paid';
+    const isFree = service.accessLevel === 'free' || service.price === 0;
+    // Breadcrumbs
+    const category = storeConfig.categories.find(c => c.id === service.categoryId);
+    const baseSlug = storeConfig.slug.startsWith('demo/') ? storeConfig.slug : `/${storeConfig.slug}`;
+    const breadcrumbItems = [
+        { label: storeConfig.name, href: baseSlug.startsWith('/') ? baseSlug : `/${baseSlug}` },
+        { label: 'Services', href: `${baseSlug.startsWith('/') ? baseSlug : '/' + baseSlug}/services` },
+        ...(category ? [{ label: category.name, href: `${baseSlug.startsWith('/') ? baseSlug : '/' + baseSlug}/categories/${category.slug}` }] : []),
+        { label: service.name, href: `${baseSlug.startsWith('/') ? baseSlug : '/' + baseSlug}/services/${service.slug}` },
+    ];
+    const handleAddToCart = () => {
+        // For services, we add them to cart similar to products
+        addToCart(service, 1);
+        addToast(`${service.name} added to cart`, 'success');
+    };
+    const handleWishlistClick = async () => {
+        if (isWishlistLoading)
+            return;
+        try {
+            const wasInWishlist = isInWishlist(service.id);
+            await toggleWishlist(service.id);
+            addToast(wasInWishlist
+                ? `${service.name} removed from wishlist`
+                : `${service.name} added to wishlist`, 'success');
+        }
+        catch (error) {
+            console.error('Failed to toggle wishlist:', error);
+            addToast('Failed to update wishlist', 'error');
+        }
+    };
+    const handleShare = async () => {
+        if (typeof navigator !== 'undefined' && navigator.share) {
+            try {
+                await navigator.share({
+                    title: service.name,
+                    text: richFieldPlainTextForDisplay(service.description),
+                    url: window.location.href,
+                });
+            }
+            catch (error) {
+                console.log('Error sharing:', error);
+            }
+        }
+        else {
+            try {
+                await navigator.clipboard.writeText(window.location.href);
+                addToast('Link copied to clipboard!', 'success');
+            }
+            catch (err) {
+                addToast('Failed to copy link', 'error');
+            }
+        }
+    };
+    return (_jsx("div", { className: "min-h-screen bg-white", children: _jsxs("div", { className: "container mx-auto px-4 sm:px-6 lg:px-8 py-8 lg:py-12 max-w-7xl", children: [_jsx("div", { className: "mb-6", children: _jsx(Breadcrumbs, { items: breadcrumbItems }) }), _jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-3 gap-8 lg:gap-12 mb-20", children: [_jsxs("div", { className: "lg:col-span-2 space-y-8", children: [_jsxs("div", { className: "relative aspect-video bg-black rounded-2xl overflow-hidden group shadow-2xl border border-gray-800", children: [isPlaying && hasAccess ? (_jsxs("div", { className: "absolute inset-0 bg-black flex items-center justify-center", children: [service.contentType === 'video' ? (_jsx("video", { src: service.contentUrl, controls: true, autoPlay: true, className: "w-full h-full object-contain", poster: getServiceImage(service.image, storeConfig, ""), children: "Your browser does not support the video tag." })) : service.contentType === 'audio' ? (_jsxs("div", { className: "w-full h-full flex flex-col items-center justify-center p-8 bg-gradient-to-br from-gray-900 to-slate-900 text-white", children: [_jsxs("div", { className: "w-32 h-32 bg-white/5 rounded-full flex items-center justify-center mb-6 backdrop-blur-xl border border-white/10 shadow-2xl relative", children: [_jsx(Headphones, { className: "w-12 h-12 text-white relative z-10" }), _jsx("div", { className: "absolute inset-0 bg-blue-500/20 rounded-full animate-ping opacity-20" })] }), _jsx("h3", { className: "text-xl font-bold mb-2", children: service.name }), _jsx("p", { className: "text-gray-400 mb-8", children: "Now Playing \u2022 Audiobook" }), _jsx("audio", { src: service.contentUrl, controls: true, autoPlay: true, className: "w-full max-w-md h-12" })] })) : (_jsxs("div", { className: "w-full h-full flex flex-col items-center justify-center p-8 bg-gray-50", children: [_jsx("div", { className: "w-24 h-24 bg-blue-100 rounded-2xl flex items-center justify-center mb-6 shadow-sm", children: _jsx(FileText, { className: "w-12 h-12 text-blue-600" }) }), _jsx("h3", { className: "text-2xl font-bold text-gray-900 mb-2", children: "Resource Ready" }), _jsx("p", { className: "text-gray-500 mb-8 text-center max-w-sm", children: "You have access to this premium guide. Download it below to start reading." }), _jsxs("a", { href: service.contentUrl, target: "_blank", rel: "noopener noreferrer", className: "bg-black text-white px-10 py-4 rounded-full font-bold hover:bg-gray-800 transition-all flex items-center gap-3 shadow-xl", children: [_jsx(Download, { className: "w-5 h-5" }), " Download PDF Guide"] })] })), _jsx("button", { onClick: () => setIsPlaying(false), className: "absolute top-6 right-6 bg-black/40 hover:bg-black/60 p-3 rounded-full backdrop-blur-md transition-all border border-white/10 group/close", title: "Close player", children: _jsx(X, { className: "w-5 h-5 text-white group-hover/close:rotate-90 transition-transform" }) })] })) : (_jsxs(_Fragment, { children: [_jsx(Image, { src: getServiceImage(service.image, storeConfig, "https://images.unsplash.com/photo-1516321318423-f06f85e504b3?w=800&auto=format&fit=crop"), alt: service.name, fill: true, className: "object-cover transition-transform duration-700 group-hover:scale-105 opacity-80", unoptimized: true }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-black/90 via-black/40 to-transparent" }), _jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: hasAccess ? (_jsxs(motion.button, { whileHover: { scale: 1.1 }, whileTap: { scale: 0.9 }, onClick: () => setIsPlaying(true), className: "w-24 h-24 rounded-full bg-white/10 backdrop-blur-xl flex items-center justify-center shadow-2xl hover:bg-white/20 transition-colors border border-white/30 relative group/play", children: [_jsx("div", { className: "absolute inset-0 bg-white/20 rounded-full blur-xl group-hover/play:blur-2xl transition-all" }), service.contentType === 'pdf' ? (_jsx(Download, { className: "w-10 h-10 text-white relative z-10" })) : (_jsx(Play, { className: "w-10 h-10 text-white ml-1 relative z-10", fill: "currentColor" }))] })) : (_jsxs("div", { className: "text-center p-6 backdrop-blur-md bg-black/40 rounded-3xl border border-white/10 max-w-sm mx-4", children: [_jsx("div", { className: "w-16 h-16 bg-white/10 rounded-full flex items-center justify-center mx-auto mb-4 border border-white/20", children: _jsx(Lock, { className: "w-8 h-8 text-white" }) }), _jsx("h3", { className: "text-xl font-bold text-white mb-2", children: "Premium Content" }), _jsxs("p", { className: "text-gray-300 text-sm mb-6", children: ["This ", typeLabel.toLowerCase(), " is exclusive to members. Unlock it now to start learning."] }), _jsxs(Button, { onClick: handleAddToCart, className: "bg-white text-black hover:bg-gray-200 rounded-full px-8 h-14 font-bold text-base w-full shadow-2xl", children: ["Unlock For ", formatCurrency(service.price, service.currency || 'USD')] })] })) })] })), _jsx("div", { className: "absolute top-6 left-6", children: _jsxs("div", { className: cn("px-4 py-2 rounded-full text-white text-xs font-bold uppercase tracking-wider flex items-center gap-2 backdrop-blur-md shadow-lg", contentTypeColor), children: [_jsx(TypeIcon, { className: "w-3 h-3" }), " ", typeLabel] }) }), !hasAccess && isLocked && (_jsx("div", { className: "absolute top-6 right-6", children: _jsxs("div", { className: "px-4 py-2 rounded-full bg-black/90 backdrop-blur-md text-white text-xs font-bold uppercase tracking-wider flex items-center gap-2 shadow-lg", children: [_jsx(Lock, { className: "w-3 h-3" }), " Premium"] }) }))] }), _jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-3 mb-4", children: [_jsx("span", { className: "text-sm font-semibold text-gray-700 uppercase tracking-wide", children: category?.name || 'Course' }), _jsx("span", { className: "text-gray-300", children: "\u2022" }), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Star, { className: "w-4 h-4 fill-yellow-400 text-yellow-400" }), _jsx("span", { className: "text-sm font-semibold", children: "4.9" }), _jsx("span", { className: "text-sm text-gray-500", children: "(127 reviews)" })] })] }), _jsx("h1", { className: "text-4xl md:text-5xl font-serif text-gray-900 mb-4 leading-tight", children: service.name }), _jsx(CategoryDescription, { description: service.description, className: "text-xl text-gray-600 leading-relaxed [&_p]:mb-0" })] }), _jsx("div", { className: "border-b border-gray-200", children: _jsx("div", { className: "flex gap-8", children: [
+                                            { id: 'overview', label: 'Overview' },
+                                            { id: 'curriculum', label: 'Curriculum' },
+                                            { id: 'reviews', label: 'Reviews' },
+                                        ].map((tab) => (_jsx("button", { onClick: () => setSelectedTab(tab.id), className: cn("pb-4 px-2 text-sm font-semibold transition-colors border-b-2 -mb-px", selectedTab === tab.id
+                                                ? "text-gray-900 border-gray-900"
+                                                : "text-gray-500 border-transparent hover:text-gray-700"), children: tab.label }, tab.id))) }) }), _jsxs("div", { className: "py-8", children: [selectedTab === 'overview' && (_jsxs("div", { className: "space-y-6 prose prose-lg max-w-none", children: [_jsxs("div", { children: [_jsx("h3", { className: "text-2xl font-serif text-gray-900 mb-4", children: "What You'll Learn" }), _jsx("ul", { className: "space-y-3", children: [
+                                                                "Master the fundamentals of mindset transformation",
+                                                                "Develop practical strategies for daily success",
+                                                                "Build confidence and overcome limiting beliefs",
+                                                                "Create actionable plans for your goals",
+                                                            ].map((item, i) => (_jsxs("li", { className: "flex items-start gap-3", children: [_jsx(CheckCircle, { className: "w-5 h-5 text-green-500 shrink-0 mt-0.5" }), _jsx("span", { className: "text-gray-700", children: item })] }, i))) })] }), _jsxs("div", { children: [_jsx("h3", { className: "text-2xl font-serif text-gray-900 mb-4", children: "Course Details" }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Clock, { className: "w-5 h-5 text-gray-400" }), _jsxs("div", { children: [_jsx("div", { className: "text-sm text-gray-500", children: "Duration" }), _jsxs("div", { className: "font-semibold", children: [service.duration, " minutes"] })] })] }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Users, { className: "w-5 h-5 text-gray-400" }), _jsxs("div", { children: [_jsx("div", { className: "text-sm text-gray-500", children: "Students" }), _jsx("div", { className: "font-semibold", children: "12,345 enrolled" })] })] }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(BookOpen, { className: "w-5 h-5 text-gray-400" }), _jsxs("div", { children: [_jsx("div", { className: "text-sm text-gray-500", children: "Level" }), _jsx("div", { className: "font-semibold", children: "All Levels" })] })] }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Award, { className: "w-5 h-5 text-gray-400" }), _jsxs("div", { children: [_jsx("div", { className: "text-sm text-gray-500", children: "Certificate" }), _jsx("div", { className: "font-semibold", children: "Included" })] })] })] })] })] })), selectedTab === 'curriculum' && (_jsx("div", { className: "space-y-4", children: [
+                                                { title: "Introduction", lessons: 3, duration: "15 min" },
+                                                { title: "Core Concepts", lessons: 8, duration: "45 min" },
+                                                { title: "Practical Applications", lessons: 5, duration: "30 min" },
+                                                { title: "Advanced Techniques", lessons: 4, duration: "20 min" },
+                                                { title: "Conclusion & Next Steps", lessons: 2, duration: "10 min" },
+                                            ].map((section, i) => (_jsxs("div", { className: "border border-gray-200 rounded-lg p-4", children: [_jsxs("div", { className: "flex items-center justify-between mb-2", children: [_jsx("h4", { className: "font-semibold text-gray-900", children: section.title }), _jsx("span", { className: "text-sm text-gray-500", children: section.duration })] }), _jsxs("p", { className: "text-sm text-gray-600", children: [section.lessons, " lessons"] })] }, i))) })), selectedTab === 'reviews' && (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "flex items-center gap-4 mb-6", children: [_jsx("div", { className: "text-5xl font-bold", children: "4.9" }), _jsxs("div", { children: [_jsx("div", { className: "flex items-center gap-1 mb-1", children: [...Array(5)].map((_, i) => (_jsx(Star, { className: "w-5 h-5 fill-yellow-400 text-yellow-400" }, i))) }), _jsx("div", { className: "text-sm text-gray-600", children: "Based on 127 reviews" })] })] }), [
+                                                    { name: "Sarah Johnson", rating: 5, comment: "This course completely transformed my approach to goal setting. Highly recommend!", date: "2 weeks ago" },
+                                                    { name: "Michael Chen", rating: 5, comment: "Excellent content and delivery. Worth every penny!", date: "1 month ago" },
+                                                    { name: "David Lee", rating: 4, comment: "Great course overall. Some sections could be more detailed.", date: "2 months ago" },
+                                                ].map((review, i) => (_jsxs("div", { className: "border-b border-gray-100 pb-6 last:border-b-0", children: [_jsxs("div", { className: "flex items-center gap-3 mb-2", children: [_jsx("div", { className: "w-10 h-10 rounded-full bg-gray-200 flex items-center justify-center", children: _jsx("span", { className: "text-sm font-semibold", children: review.name[0] }) }), _jsxs("div", { children: [_jsx("div", { className: "font-semibold", children: review.name }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex items-center gap-1", children: [...Array(5)].map((_, j) => (_jsx(Star, { className: cn("w-3 h-3", j < review.rating ? "fill-yellow-400 text-yellow-400" : "text-gray-300") }, j))) }), _jsx("span", { className: "text-xs text-gray-500", children: review.date })] })] })] }), _jsx("p", { className: "text-gray-700 mt-2", children: review.comment })] }, i)))] }))] })] }), _jsx("div", { className: "lg:col-span-1", children: _jsx("div", { className: "sticky top-24", children: _jsxs("div", { className: "bg-white border-2 border-gray-200 rounded-2xl p-8 shadow-lg", children: [_jsxs("div", { className: "mb-6", children: [_jsx("div", { className: "text-4xl font-bold text-gray-900 mb-2", children: isFree ? 'Free' : formatCurrency(service.price, service.currency || 'USD') }), !isFree && (_jsx("div", { className: "text-sm text-gray-500 line-through", children: formatCurrency(service.price * 1.5, service.currency || 'USD') }))] }), _jsxs("div", { className: "space-y-4 mb-6", children: [_jsxs(Button, { size: "lg", onClick: handleAddToCart, disabled: isCartLoading, className: "w-full h-14 rounded-full bg-black text-white hover:bg-gray-800 font-bold text-lg", children: [isCartLoading ? 'Adding...' : isFree ? 'Enroll Now' : 'Add to Cart', _jsx(ArrowRight, { className: "ml-2 h-5 w-5" })] }), storeConfig.features.wishlist && (_jsxs(Button, { variant: "outline", size: "lg", onClick: handleWishlistClick, disabled: isWishlistLoading, className: cn("w-full h-14 rounded-full border-2 transition-all", isInWishlist(service.id)
+                                                        ? "border-red-500 bg-red-50 text-red-500 hover:bg-red-100"
+                                                        : "border-gray-200 hover:border-gray-300"), children: [_jsx(Heart, { className: cn("w-5 h-5 mr-2", isInWishlist(service.id) && "fill-current") }), isInWishlist(service.id) ? 'In Wishlist' : 'Add to Wishlist'] })), _jsxs(Button, { variant: "outline", size: "lg", onClick: handleShare, className: "w-full h-14 rounded-full border-2 border-gray-200", children: [_jsx(Share2, { className: "w-5 h-5 mr-2" }), "Share"] })] }), _jsxs("div", { className: "border-t border-gray-200 pt-6 space-y-4", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsx(CheckCircle, { className: "w-5 h-5 text-green-500 shrink-0 mt-0.5" }), _jsxs("div", { className: "text-sm text-gray-700", children: [_jsx("div", { className: "font-semibold", children: "Lifetime Access" }), _jsx("div", { className: "text-gray-500", children: "Access this course forever" })] })] }), _jsxs("div", { className: "flex items-start gap-3", children: [_jsx(CheckCircle, { className: "w-5 h-5 text-green-500 shrink-0 mt-0.5" }), _jsxs("div", { className: "text-sm text-gray-700", children: [_jsx("div", { className: "font-semibold", children: "Certificate of Completion" }), _jsx("div", { className: "text-gray-500", children: "Get certified upon completion" })] })] }), _jsxs("div", { className: "flex items-start gap-3", children: [_jsx(CheckCircle, { className: "w-5 h-5 text-green-500 shrink-0 mt-0.5" }), _jsxs("div", { className: "text-sm text-gray-700", children: [_jsx("div", { className: "font-semibold", children: "30-Day Money-Back Guarantee" }), _jsx("div", { className: "text-gray-500", children: "Full refund if not satisfied" })] })] })] }), isLocked && !isAuthenticated && (_jsx("div", { className: "mt-6 p-4 bg-yellow-50 border border-yellow-200 rounded-lg", children: _jsxs("p", { className: "text-sm text-yellow-800", children: [_jsx(Lock, { className: "w-4 h-4 inline mr-1" }), "This content requires a membership or purchase."] }) }))] }) }) })] }), relatedServices.length > 0 && (_jsxs("div", { className: "mt-20 pt-16 border-t border-gray-200", children: [_jsx("h2", { className: "text-3xl font-serif text-gray-900 mb-8", children: "You Might Also Like" }), _jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6", children: relatedServices.map((relatedService) => (_jsx(Link, { href: `/${storeConfig.slug}/services/${relatedService.slug}`, className: "group", children: _jsxs("div", { className: "bg-white border border-gray-200 rounded-lg overflow-hidden hover:shadow-xl transition-all", children: [_jsx("div", { className: "relative aspect-video bg-gray-200", children: _jsx(Image, { src: getServiceImage(relatedService.image, storeConfig, "https://images.unsplash.com/photo-1516321318423-f06f85e504b3?w=800&auto=format&fit=crop"), alt: relatedService.name, fill: true, className: "object-cover group-hover:scale-105 transition-transform duration-300", unoptimized: true }) }), _jsxs("div", { className: "p-4", children: [_jsx("h3", { className: "font-semibold text-gray-900 mb-2 line-clamp-2 group-hover:underline", children: relatedService.name }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "font-bold text-gray-900", children: relatedService.price > 0 ? formatCurrency(relatedService.price, relatedService.currency || 'USD') : 'Free' }), _jsx(ArrowRight, { className: "w-4 h-4 text-gray-400 group-hover:text-gray-900 group-hover:translate-x-1 transition-all" })] })] })] }) }, relatedService.id))) })] }))] }) }));
+}

package/dist/layouts/motivational-speaker/pages/ServicesPage.d.ts

@@ -0,0 +1,9 @@
+import { StoreConfig } from '../../../lib/store-types';
+interface ServicesPageProps {
+    storeConfig: StoreConfig;
+    initialCategory?: string;
+    titleOverride?: string;
+}
+export declare function MotivationalServicesPage({ storeConfig: initialConfig, initialCategory, titleOverride }: ServicesPageProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ServicesPage.d.ts.map

package/dist/layouts/motivational-speaker/pages/ServicesPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ServicesPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/motivational-speaker/pages/ServicesPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAahD,UAAU,iBAAiB;IACzB,WAAW,EAAE,WAAW,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,wBAAwB,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,eAAe,EAAE,aAAa,EAAE,EAAE,iBAAiB,2CAoLzH"}

package/dist/layouts/motivational-speaker/pages/ServicesPage.js

@@ -0,0 +1,46 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../../../components/ui/button.js';
+import { Clock, ArrowRight, Filter } from 'lucide-react';
+import Link from 'next/link';
+import { useState } from 'react';
+import { cn, formatCurrency, isEditorPreviewMode, resolveStoreCategoriesForDisplay, resolveStoreServicesForDisplay } from '../../../lib/utils/index.js';
+import { useCatalogLoader } from '../../../hooks/use-catalog-loader.js';
+import Image from 'next/image';
+import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
+import { useStore } from '../../../lib/store-context.js';
+import { showLayoutDecorativeBadges } from '../../../lib/layout-badges.js';
+import { encodePayazaFieldKey, payazaInlineBindingProps } from '../../../preview/canvas/field-key.js';
+export function MotivationalServicesPage({ storeConfig: initialConfig, initialCategory, titleOverride }) {
+    const { store } = useStore();
+    const storeConfig = store || initialConfig;
+    const isPreview = isEditorPreviewMode(storeConfig);
+    const { services: loadedServices, categories: loadedCategories } = useCatalogLoader(storeConfig, {
+        fetchProducts: false,
+    });
+    const services = resolveStoreServicesForDisplay(loadedServices, isPreview);
+    const categories = resolveStoreCategoriesForDisplay(loadedCategories, isPreview);
+    const [activeCategory, setActiveCategory] = useState(initialCategory || categories[0]?.slug || '');
+    const primaryColor = storeConfig.branding.primaryColor;
+    const servicesConfig = storeConfig.layoutConfig?.pages?.services;
+    const heroConfig = servicesConfig?.hero;
+    const heroImage = typeof heroConfig?.backgroundImage === 'string' && heroConfig.backgroundImage.trim().length > 0
+        ? heroConfig.backgroundImage.trim()
+        : 'https://images.unsplash.com/photo-1544531696-608a67ed9739?q=80&w=2070&auto=format&fit=crop';
+    // Motivational-speaker specific labels
+    const categoryLabel = 'Categories';
+    const serviceLabel = 'Courses';
+    const filteredServices = activeCategory
+        ? services.filter(s => {
+            const cat = categories.find(c => c.id === s.categoryId);
+            return cat?.slug === activeCategory;
+        })
+        : services;
+    const getServiceLink = (slug) => {
+        return `/${storeConfig.slug}/services/${slug}`;
+    };
+    const pageTitle = titleOverride || heroConfig?.title || servicesConfig?.title || (_jsxs(_Fragment, { children: ["Signature ", _jsx("span", { className: "font-bold font-sans", style: { color: primaryColor }, children: serviceLabel })] }));
+    return (_jsxs("div", { className: "min-h-screen bg-white pb-20", children: [heroConfig?.show !== false && (_jsxs("div", { "data-section": "hero", "data-payaza-section-key": "hero", "data-payaza-page": "services", className: "relative bg-gray-900 py-32 px-4 text-center overflow-hidden", children: [_jsxs("div", { className: "absolute inset-0", "data-payaza-image": isPreview ? encodePayazaFieldKey('hero', ['backgroundImage']) : undefined, children: [_jsx(Image, { src: heroImage, alt: "Service Menu", fill: true, className: "w-full h-full object-cover opacity-60", unoptimized: true }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-black/80 via-black/40 to-black/30" })] }), _jsxs("div", { className: "container mx-auto max-w-4xl relative z-10", children: [showLayoutDecorativeBadges() && (_jsx("span", { className: "inline-block py-1 px-3 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-xs font-bold uppercase tracking-widest text-white mb-6 shadow-sm", children: storeConfig.name })), _jsx("h1", { className: "text-5xl md:text-7xl font-serif font-light mb-6 tracking-tight text-white leading-tight", ...payazaInlineBindingProps(isPreview, 'hero', ['title']), children: pageTitle }), _jsx("p", { className: "text-gray-200 max-w-2xl mx-auto text-lg font-light leading-relaxed", ...payazaInlineBindingProps(isPreview, 'hero', ['description']), children: heroConfig?.description || servicesConfig?.description || storeConfig.description || `Explore our curated selection of premium ${serviceLabel.toLowerCase()} designed for your success.` })] })] })), _jsx("div", { className: "sticky top-16 z-30 bg-white/80 backdrop-blur-xl border-b border-gray-100 transition-all", children: _jsx("div", { className: "container mx-auto px-4", children: _jsxs("div", { className: "flex items-center gap-3 overflow-x-auto py-4 scrollbar-hide no-scrollbar", children: [_jsxs("div", { className: "flex items-center gap-2 text-xs font-bold text-gray-400 uppercase tracking-wider px-4 border-r border-gray-100 hidden md:flex shrink-0", children: [_jsx(Filter, { className: "w-3.5 h-3.5" }), categoryLabel] }), categories.map((cat) => (_jsx("button", { onClick: () => setActiveCategory(cat.slug), className: cn("px-6 py-2.5 rounded-full text-sm font-bold whitespace-nowrap transition-all duration-300 border flex-shrink-0", activeCategory === cat.slug
+                                    ? "text-white shadow-lg scale-105 border-transparent"
+                                    : "bg-white text-gray-500 border-gray-100 hover:border-gray-300 hover:text-black"), style: activeCategory === cat.slug ? { backgroundColor: primaryColor } : {}, children: cat.name }, cat.id)))] }) }) }), _jsx("div", { "data-section": "services-list", "data-payaza-section-key": "services-list", "data-payaza-page": "services", className: "container mx-auto px-4 max-w-7xl py-16", children: _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-x-10 gap-y-16", children: filteredServices.map((service) => (_jsxs("div", { className: "group flex flex-col h-full", children: [_jsxs(Link, { href: getServiceLink(service.slug), className: "block relative aspect-[4/3] rounded-3xl overflow-hidden bg-gray-100 mb-6 shadow-sm group-hover:shadow-xl transition-all duration-500", children: [_jsx(Image, { src: service.image || 'https://images.unsplash.com/photo-1629909613654-28e377c37b09?w=800&auto=format&fit=crop&q=60', alt: service.name, fill: true, className: "w-full h-full object-cover transition-transform duration-700 group-hover:scale-105", unoptimized: true }), _jsx("div", { className: "absolute bottom-4 left-4 bg-white/95 backdrop-blur px-4 py-2 rounded-full text-sm font-bold shadow-sm text-gray-900", children: service.price > 0 ? formatCurrency(service.price, service.currency || storeConfig.settings?.currency || 'USD') : 'Free' }), _jsx("div", { className: "absolute inset-0 bg-black/20 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-center justify-center", children: _jsx(Button, { className: "rounded-full bg-white text-black hover:bg-gray-100 transform translate-y-4 group-hover:translate-y-0 transition-all duration-300 shadow-lg font-bold px-8", children: "View Content" }) })] }), _jsxs("div", { className: "flex flex-col flex-1", children: [_jsx("div", { className: "flex justify-between items-start mb-3", children: _jsx(Link, { href: getServiceLink(service.slug), children: _jsx("h3", { className: "text-2xl font-bold text-gray-900 group-hover:text-gray-600 transition-colors", children: service.name }) }) }), _jsx(RichTextExcerpt, { value: service.description, as: "p", className: "text-gray-500 mb-6 line-clamp-2 leading-relaxed text-base flex-1" }), _jsxs("div", { className: "flex items-center justify-between pt-4 border-t border-gray-100 text-sm font-medium text-gray-500", children: [_jsxs("div", { className: "flex items-center gap-6", children: [service.duration > 0 && (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Clock, { className: "w-4 h-4 text-gray-400" }), service.duration, " mins"] })), service.contentType && (_jsx("div", { className: "flex items-center gap-2 uppercase tracking-widest text-[10px] font-black", children: service.contentType }))] }), _jsxs(Link, { href: getServiceLink(service.slug), className: "flex items-center gap-2 text-black font-bold group/link", children: ["Explore ", _jsx(ArrowRight, { className: "w-4 h-4 transition-transform group-hover/link:translate-x-1" })] })] })] })] }, service.id))) }) })] }));
+}

package/dist/layouts/motivational-speaker/pages/SubscriptionPage.d.ts

@@ -0,0 +1,7 @@
+import { StoreConfig } from '../../../lib/store-types';
+interface SubscriptionPageProps {
+    storeConfig: StoreConfig;
+}
+export declare function MotivationalSubscriptionPage({ storeConfig }: SubscriptionPageProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SubscriptionPage.d.ts.map

package/dist/layouts/motivational-speaker/pages/SubscriptionPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SubscriptionPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/motivational-speaker/pages/SubscriptionPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAchD,UAAU,qBAAqB;IAC7B,WAAW,EAAE,WAAW,CAAC;CAC1B;AAcD,wBAAgB,4BAA4B,CAAC,EAAE,WAAW,EAAE,EAAE,qBAAqB,2CA8TlF"}

package/dist/layouts/motivational-speaker/pages/SubscriptionPage.js

@@ -0,0 +1,137 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../../../components/ui/button.js';
+import { Breadcrumbs } from '../../../components/ui/breadcrumbs.js';
+import { CheckCircle, Star, Zap, Crown, ArrowRight, Users, BookOpen, Video, Headphones } from 'lucide-react';
+import Link from 'next/link';
+import { useRouter } from 'next/navigation';
+import { formatCurrency } from '../../../lib/utils/index.js';
+import { motion } from 'framer-motion';
+import { useState } from 'react';
+import { useStore } from '../../../lib/store-context.js';
+import { useToast } from '../../../components/ui/toast.js';
+import { cn } from '../../../lib/utils/index.js';
+import { showLayoutDecorativeBadges } from '../../../lib/layout-badges.js';
+export function MotivationalSubscriptionPage({ storeConfig }) {
+    const router = useRouter();
+    const { addToCart } = useStore();
+    const { addToast } = useToast();
+    const [billingPeriod, setBillingPeriod] = useState('month');
+    const pricingTiers = [
+        {
+            id: 'free',
+            name: 'Free',
+            description: 'Perfect for getting started',
+            price: 0,
+            period: 'month',
+            features: [
+                'Access to 3 free courses',
+                'Community forum access',
+                'Weekly newsletter',
+                'Basic support',
+            ],
+            icon: _jsx(BookOpen, { className: "w-6 h-6" }),
+            color: 'bg-gray-500',
+        },
+        {
+            id: 'pro',
+            name: 'Pro',
+            description: 'For serious learners',
+            price: billingPeriod === 'month' ? 29 : 290,
+            period: billingPeriod,
+            features: [
+                'Unlimited course access',
+                'All video courses',
+                'Downloadable PDFs',
+                'Monthly live Q&A sessions',
+                'Priority support',
+                'Progress tracking',
+            ],
+            icon: _jsx(Zap, { className: "w-6 h-6" }),
+            popular: true,
+            color: 'bg-blue-500',
+        },
+        {
+            id: 'elite',
+            name: 'Elite',
+            description: 'Complete transformation package',
+            price: billingPeriod === 'month' ? 99 : 990,
+            period: billingPeriod,
+            features: [
+                'Everything in Pro',
+                '1-on-1 coaching sessions (monthly)',
+                'Exclusive masterclasses',
+                'Early access to new content',
+                'Private community access',
+                'Personalized learning path',
+                'Certificate of completion',
+            ],
+            icon: _jsx(Crown, { className: "w-6 h-6" }),
+            color: 'bg-yellow-500',
+        },
+    ];
+    const handleSubscribe = (tier) => {
+        if (tier.id === 'free') {
+            addToast('Free tier activated! Start exploring our free courses.', 'success');
+            setTimeout(() => {
+                router.push(`/${storeConfig.slug}/services`);
+            }, 1500);
+            return;
+        }
+        // In a real app, this would create a subscription
+        // For now, we'll add it to cart as a service/product
+        const subscriptionItem = {
+            id: `subscription-${tier.id}-${billingPeriod}`,
+            name: `${tier.name} Membership (${billingPeriod === 'month' ? 'Monthly' : 'Yearly'})`,
+            slug: `subscription-${tier.id}-${billingPeriod}`,
+            description: tier.description,
+            price: tier.price,
+            currency: storeConfig.settings?.currency || 'USD',
+            images: ['https://images.unsplash.com/photo-1552664730-d307ca884978?w=800&auto=format&fit=crop'],
+            categoryId: 'subscriptions',
+            inStock: true,
+        };
+        addToCart(subscriptionItem, 1);
+        addToast(`${tier.name} membership added to cart`, 'success');
+    };
+    const breadcrumbItems = [
+        { label: storeConfig.name, href: `/${storeConfig.slug}` },
+        { label: 'Subscription', href: `/${storeConfig.slug}/subscription` },
+    ];
+    return (_jsx("div", { className: "min-h-screen bg-gradient-to-b from-gray-50 to-white", children: _jsxs("div", { className: "container mx-auto px-4 sm:px-6 lg:px-8 py-12 max-w-7xl", children: [_jsx("div", { className: "mb-8", children: _jsx(Breadcrumbs, { items: breadcrumbItems }) }), _jsxs(motion.div, { initial: { opacity: 0, y: 20 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.6 }, className: "text-center mb-16", children: [showLayoutDecorativeBadges() && (_jsxs("div", { className: "inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-yellow-100 text-yellow-800 text-xs font-bold uppercase tracking-widest mb-6", children: [_jsx(Star, { className: "w-3 h-3" }), "Choose Your Path"] })), _jsx("h1", { className: "text-5xl md:text-6xl font-serif text-gray-900 mb-6 leading-tight", children: "Membership Plans" }), _jsx("p", { className: "text-xl text-gray-600 max-w-2xl mx-auto mb-8", children: "Unlock your potential with unlimited access to all courses, exclusive content, and a community of like-minded individuals." }), _jsxs("div", { className: "flex items-center justify-center gap-4", children: [_jsx("span", { className: cn("text-sm font-medium", billingPeriod === 'month' ? 'text-gray-900' : 'text-gray-500'), children: "Monthly" }), _jsx("button", { onClick: () => setBillingPeriod(billingPeriod === 'month' ? 'year' : 'month'), className: cn("relative w-14 h-8 rounded-full transition-colors", billingPeriod === 'year' ? 'bg-yellow-500' : 'bg-gray-300'), children: _jsx(motion.div, { layout: true, className: cn("absolute top-1 w-6 h-6 rounded-full bg-white shadow-lg", billingPeriod === 'year' ? 'right-1' : 'left-1') }) }), _jsxs("span", { className: cn("text-sm font-medium", billingPeriod === 'year' ? 'text-gray-900' : 'text-gray-500'), children: ["Yearly", _jsx("span", { className: "ml-2 text-yellow-600 font-bold", children: "Save 17%" })] })] })] }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8 mb-16", children: pricingTiers.map((tier, index) => (_jsxs(motion.div, { initial: { opacity: 0, y: 30 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.6, delay: index * 0.1 }, className: cn("relative bg-white rounded-2xl border-2 p-8 flex flex-col", tier.popular
+                            ? "border-yellow-500 shadow-2xl scale-105"
+                            : "border-gray-200 hover:border-gray-300 hover:shadow-xl transition-all"), children: [tier.popular && (_jsx("div", { className: "absolute -top-4 left-1/2 -translate-x-1/2", children: _jsx("div", { className: "px-4 py-1 bg-yellow-500 text-black text-xs font-bold uppercase tracking-wider rounded-full", children: "Most Popular" }) })), _jsx("div", { className: cn("w-12 h-12 rounded-full flex items-center justify-center text-white mb-6", tier.color), children: tier.icon }), _jsx("h3", { className: "text-2xl font-serif text-gray-900 mb-2", children: tier.name }), _jsx("p", { className: "text-gray-600 mb-6", children: tier.description }), _jsxs("div", { className: "mb-6", children: [_jsxs("div", { className: "flex items-baseline gap-2", children: [_jsx("span", { className: "text-5xl font-bold text-gray-900", children: tier.price === 0 ? 'Free' : formatCurrency(tier.price, storeConfig.settings?.currency || 'USD') }), tier.price > 0 && (_jsxs("span", { className: "text-gray-500", children: ["/", tier.period === 'month' ? 'mo' : 'yr'] }))] }), tier.price > 0 && billingPeriod === 'year' && (_jsxs("p", { className: "text-sm text-gray-500 mt-1", children: [formatCurrency(tier.price / 12, storeConfig.settings?.currency || 'USD'), " per month"] }))] }), _jsx("ul", { className: "space-y-4 mb-8 flex-1", children: tier.features.map((feature, i) => (_jsxs("li", { className: "flex items-start gap-3", children: [_jsx(CheckCircle, { className: "w-5 h-5 text-green-500 shrink-0 mt-0.5" }), _jsx("span", { className: "text-gray-700", children: feature })] }, i))) }), _jsxs(Button, { size: "lg", onClick: () => handleSubscribe(tier), className: cn("w-full h-14 rounded-full font-bold text-lg transition-all", tier.popular
+                                    ? "bg-yellow-500 text-black hover:bg-yellow-400 hover:shadow-xl transform hover:-translate-y-1"
+                                    : tier.id === 'free'
+                                        ? "bg-gray-900 text-white hover:bg-gray-800"
+                                        : "bg-black text-white hover:bg-gray-800"), children: [tier.id === 'free' ? 'Get Started Free' : 'Subscribe Now', _jsx(ArrowRight, { className: "ml-2 h-5 w-5" })] })] }, tier.id))) }), _jsxs(motion.div, { initial: { opacity: 0, y: 20 }, whileInView: { opacity: 1, y: 0 }, viewport: { once: true }, transition: { duration: 0.6 }, className: "bg-white rounded-2xl border-2 border-gray-200 p-8 mb-16", children: [_jsx("h2", { className: "text-3xl font-serif text-gray-900 mb-8 text-center", children: "What's Included" }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8", children: [
+                                {
+                                    icon: _jsx(Video, { className: "w-8 h-8" }),
+                                    title: 'Unlimited Courses',
+                                    description: 'Access to all video courses, audiobooks, and PDF guides',
+                                },
+                                {
+                                    icon: _jsx(Users, { className: "w-8 h-8" }),
+                                    title: 'Community Access',
+                                    description: 'Join a community of like-minded individuals on the same journey',
+                                },
+                                {
+                                    icon: _jsx(Headphones, { className: "w-8 h-8" }),
+                                    title: 'Live Sessions',
+                                    description: 'Monthly Q&A sessions and exclusive masterclasses',
+                                },
+                            ].map((feature, i) => (_jsxs("div", { className: "text-center", children: [_jsx("div", { className: "w-16 h-16 rounded-full bg-gray-100 flex items-center justify-center mx-auto mb-4 text-gray-700", children: feature.icon }), _jsx("h3", { className: "text-xl font-semibold text-gray-900 mb-2", children: feature.title }), _jsx("p", { className: "text-gray-600", children: feature.description })] }, i))) })] }), _jsxs(motion.div, { initial: { opacity: 0, y: 20 }, whileInView: { opacity: 1, y: 0 }, viewport: { once: true }, transition: { duration: 0.6 }, className: "text-center", children: [_jsx("h2", { className: "text-3xl font-serif text-gray-900 mb-8", children: "Frequently Asked Questions" }), _jsx("div", { className: "max-w-3xl mx-auto space-y-4", children: [
+                                {
+                                    question: 'Can I cancel my subscription anytime?',
+                                    answer: 'Yes, you can cancel your subscription at any time. You\'ll continue to have access until the end of your billing period.',
+                                },
+                                {
+                                    question: 'What happens if I upgrade or downgrade?',
+                                    answer: 'You can upgrade or downgrade at any time. Changes take effect immediately, and we\'ll prorate the difference.',
+                                },
+                                {
+                                    question: 'Do you offer refunds?',
+                                    answer: 'We offer a 30-day money-back guarantee. If you\'re not satisfied, contact us for a full refund.',
+                                },
+                            ].map((faq, i) => (_jsxs("div", { className: "bg-gray-50 rounded-lg p-6 text-left", children: [_jsx("h4", { className: "font-semibold text-gray-900 mb-2", children: faq.question }), _jsx("p", { className: "text-gray-600", children: faq.answer })] }, i))) })] }), _jsx(motion.div, { initial: { opacity: 0, y: 20 }, whileInView: { opacity: 1, y: 0 }, viewport: { once: true }, transition: { duration: 0.6 }, className: "mt-16 text-center", children: _jsxs("div", { className: "bg-gradient-to-br from-gray-900 to-black rounded-2xl p-12 text-white", children: [_jsx("h2", { className: "text-4xl font-serif mb-4", children: "Ready to Transform Your Life?" }), _jsx("p", { className: "text-xl text-gray-300 mb-8 max-w-2xl mx-auto", children: "Join thousands of students who are already on their journey to success." }), _jsx(Link, { href: `/${storeConfig.slug}/services`, children: _jsxs(Button, { size: "lg", className: "h-16 px-12 rounded-full bg-yellow-500 text-black hover:bg-yellow-400 font-bold text-lg shadow-xl hover:shadow-2xl transform hover:-translate-y-1 transition-all", children: ["Browse All Courses", _jsx(ArrowRight, { className: "ml-2 h-5 w-5" })] }) })] }) })] }) }));
+}

package/dist/layouts/shared/components/BaseStoreLayout.d.ts

@@ -0,0 +1,8 @@
+import { StoreConfig } from '../../../lib/store-types';
+interface BaseStoreLayoutProps {
+    children: React.ReactNode;
+    storeConfig: StoreConfig;
+}
+export declare function BaseStoreLayout({ children, storeConfig }: BaseStoreLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=BaseStoreLayout.d.ts.map

package/dist/layouts/shared/components/BaseStoreLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseStoreLayout.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/components/BaseStoreLayout.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAavD,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,EAAE,oBAAoB,2CAoD9E"}

package/dist/layouts/shared/components/BaseStoreLayout.js

@@ -0,0 +1,49 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { isBookingAgendaStoreRoot } from '../../../lib/layout-route-utils.js';
+import { StandardLayout } from '../wrappers/StandardLayout.js';
+import { ClothingLayout } from '../wrappers/ClothingLayout.js';
+import { ClothingMinimalLayout } from '../wrappers/ClothingMinimalLayout.js';
+import { FoodModernLayout } from '../wrappers/FoodModernLayout.js';
+import { BookingAgendaLayout } from '../wrappers/BookingAgendaLayout.js';
+import { ElectronicsLayout } from '../wrappers/ElectronicsLayout.js';
+import { MotivationalLayout } from '../wrappers/MotivationalLayout.js';
+import { LoginSheet } from '../../../components/auth/LoginSheet.js';
+import { usePathname, useSearchParams } from 'next/navigation';
+export function BaseStoreLayout({ children, storeConfig }) {
+    const pathname = usePathname();
+    const searchParams = useSearchParams();
+    // Determine layout wrapper based on config
+    // Allow preview override via query param to ensure wrapper matches page content
+    const previewLayout = searchParams.get('preview_layout');
+    const layout = previewLayout || storeConfig.layout;
+    // For booking-agenda: single source of truth so template, demo, slug, and custom-domain store roots behave the same (no double sidebar)
+    const isHomePage = layout === 'booking-agenda'
+        ? isBookingAgendaStoreRoot(pathname || '/', storeConfig)
+        : !pathname ||
+            pathname === '/' ||
+            pathname === `/${storeConfig.slug}` ||
+            pathname.endsWith(`/${storeConfig.slug}`);
+    const wrapWithLoginSheet = (content) => (_jsxs(_Fragment, { children: [content, _jsx(LoginSheet, { storeConfig: storeConfig })] }));
+    switch (layout) {
+        case 'clothing':
+            return wrapWithLoginSheet(_jsx(ClothingLayout, { storeConfig: storeConfig, children: children }));
+        case 'clothing-minimal':
+            return wrapWithLoginSheet(_jsx(ClothingMinimalLayout, { storeConfig: storeConfig, children: children }));
+        case 'food-modern':
+            return wrapWithLoginSheet(_jsx(FoodModernLayout, { storeConfig: storeConfig, children: children }));
+        case 'booking-agenda':
+            // Homepage is self-contained, other pages need the wrapper for sidebar consistency
+            if (isHomePage) {
+                return wrapWithLoginSheet(_jsx(_Fragment, { children: children }));
+            }
+            return wrapWithLoginSheet(_jsx(BookingAgendaLayout, { storeConfig: storeConfig, children: children }));
+        case 'electronics':
+        case 'electronics-grid':
+            return wrapWithLoginSheet(_jsx(ElectronicsLayout, { storeConfig: storeConfig, children: children }));
+        case 'motivational-speaker':
+            return wrapWithLoginSheet(_jsx(MotivationalLayout, { storeConfig: storeConfig, children: children }));
+        default:
+            return wrapWithLoginSheet(_jsx(StandardLayout, { storeConfig: storeConfig, children: children }));
+    }
+}

package/dist/layouts/shared/components/CartLineQuantityControl.d.ts

@@ -0,0 +1,12 @@
+import type { StoreProduct } from '../../../lib/store-types';
+interface CartLineQuantityControlProps {
+    quantity: number;
+    product: StoreProduct;
+    disabled?: boolean;
+    isUpdating?: boolean;
+    onUpdate: (quantity: number) => Promise<void>;
+    onError: (message: string) => void;
+}
+export declare function CartLineQuantityControl({ quantity, product, disabled, isUpdating, onUpdate, onError, }: CartLineQuantityControlProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=CartLineQuantityControl.d.ts.map

package/dist/layouts/shared/components/CartLineQuantityControl.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CartLineQuantityControl.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/components/CartLineQuantityControl.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGtD,UAAU,4BAA4B;IACpC,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,YAAY,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9C,OAAO,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAuCD,wBAAgB,uBAAuB,CAAC,EACtC,QAAQ,EACR,OAAO,EACP,QAAgB,EAChB,UAAkB,EAClB,QAAQ,EACR,OAAO,GACR,EAAE,4BAA4B,2CA4I9B"}

package/dist/layouts/shared/components/CartLineQuantityControl.js

@@ -0,0 +1,99 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { Minus, Plus } from 'lucide-react';
+import { formatStockLimitMessage, getCartLineStockInfo } from '../../../lib/inventory-utils.js';
+function parsePositiveInteger(raw) {
+    const trimmed = raw.trim();
+    if (!trimmed || !/^\d+$/.test(trimmed))
+        return null;
+    const value = parseInt(trimmed, 10);
+    return value > 0 ? value : null;
+}
+function getEffectiveQuantity(committedQuantity, draft, isEditing) {
+    if (!isEditing)
+        return committedQuantity;
+    return parsePositiveInteger(draft) ?? committedQuantity;
+}
+function resolveTargetQuantity(product, requested, currentQuantity, onError) {
+    if (requested < currentQuantity && requested > 0) {
+        return requested;
+    }
+    const { maxLineQuantity, stockError } = getCartLineStockInfo(product, requested);
+    if (stockError && maxLineQuantity != null && maxLineQuantity <= 0) {
+        onError(stockError);
+        return null;
+    }
+    if (maxLineQuantity != null && requested > maxLineQuantity) {
+        onError(formatStockLimitMessage(product.name, maxLineQuantity, requested));
+        return maxLineQuantity;
+    }
+    return requested;
+}
+export function CartLineQuantityControl({ quantity, product, disabled = false, isUpdating = false, onUpdate, onError, }) {
+    const [draft, setDraft] = useState(String(quantity));
+    const [isEditing, setIsEditing] = useState(false);
+    const isBusy = disabled || isUpdating;
+    const effectiveQuantity = useMemo(() => getEffectiveQuantity(quantity, draft, isEditing), [quantity, draft, isEditing]);
+    const lineStock = useMemo(() => getCartLineStockInfo(product, effectiveQuantity), [product, effectiveQuantity]);
+    useEffect(() => {
+        if (!isEditing) {
+            setDraft(String(quantity));
+        }
+    }, [quantity, isEditing]);
+    const commitDraft = useCallback(async () => {
+        setIsEditing(false);
+        const parsed = parsePositiveInteger(draft);
+        if (parsed === null) {
+            setDraft(String(quantity));
+            onError('Enter a whole number greater than 0');
+            return;
+        }
+        if (parsed === quantity) {
+            setDraft(String(quantity));
+            return;
+        }
+        const targetQty = resolveTargetQuantity(product, parsed, quantity, onError);
+        if (targetQty == null) {
+            setDraft(String(quantity));
+            return;
+        }
+        setDraft(String(targetQty));
+        await onUpdate(targetQty);
+    }, [draft, onError, onUpdate, product, quantity]);
+    const adjustQuantity = useCallback(async (nextQuantity) => {
+        if (nextQuantity <= 0)
+            return;
+        const targetQty = resolveTargetQuantity(product, nextQuantity, quantity, onError);
+        if (targetQty == null || targetQty === quantity)
+            return;
+        setIsEditing(false);
+        setDraft(String(targetQty));
+        await onUpdate(targetQty);
+    }, [onError, onUpdate, product, quantity]);
+    const handleDecrease = () => {
+        void adjustQuantity(effectiveQuantity - 1);
+    };
+    const handleIncrease = () => {
+        void adjustQuantity(effectiveQuantity + 1);
+    };
+    return (_jsxs("div", { className: "flex items-center gap-1 bg-gray-50 rounded-full p-1 border border-gray-200", children: [_jsx("button", { type: "button", onClick: handleDecrease, className: "w-8 h-8 flex items-center justify-center rounded-full bg-white shadow-sm hover:bg-gray-50 transition-colors disabled:opacity-50 text-gray-600", disabled: !lineStock.canDecrease || isBusy, "aria-label": "Decrease quantity", children: isUpdating ? (_jsx("div", { className: "w-3.5 h-3.5 border-2 border-gray-400 border-t-transparent rounded-full animate-spin" })) : (_jsx(Minus, { className: "w-3.5 h-3.5" })) }), _jsx("div", { className: "relative w-10 flex items-center justify-center", children: isUpdating ? (_jsx("div", { className: "w-4 h-4 border-2 border-gray-400 border-t-transparent rounded-full animate-spin" })) : (_jsx("input", { type: "text", inputMode: "numeric", pattern: "[0-9]*", "aria-label": "Item quantity", "aria-valuemin": 1, "aria-valuemax": lineStock.maxLineQuantity ?? undefined, "aria-valuenow": effectiveQuantity, value: draft, disabled: isBusy, onFocus: (event) => {
+                        setIsEditing(true);
+                        event.currentTarget.select();
+                    }, onChange: (event) => {
+                        const next = event.target.value.replace(/\D/g, '');
+                        setDraft(next);
+                    }, onBlur: () => {
+                        void commitDraft();
+                    }, onKeyDown: (event) => {
+                        if (event.key === 'Enter') {
+                            event.preventDefault();
+                            event.currentTarget.blur();
+                        }
+                        if (event.key === 'Escape') {
+                            setIsEditing(false);
+                            setDraft(String(quantity));
+                            event.currentTarget.blur();
+                        }
+                    }, className: "w-full text-sm font-bold text-center text-gray-900 bg-transparent border-0 outline-none focus:ring-0 disabled:opacity-50 tabular-nums" })) }), _jsx("button", { type: "button", onClick: handleIncrease, className: "w-8 h-8 flex items-center justify-center rounded-full bg-white shadow-sm hover:bg-gray-50 transition-colors disabled:opacity-50 text-gray-900", disabled: isBusy || !lineStock.canIncrease, "aria-label": "Increase quantity", children: isUpdating ? (_jsx("div", { className: "w-3.5 h-3.5 border-2 border-gray-400 border-t-transparent rounded-full animate-spin" })) : (_jsx(Plus, { className: "w-3.5 h-3.5" })) })] }));
+}

package/dist/layouts/shared/components/GenericPageWrapper.d.ts

@@ -0,0 +1,8 @@
+import { StoreConfig } from '../../../lib/store-types';
+interface GenericPageWrapperProps {
+    children: React.ReactNode;
+    storeConfig: StoreConfig;
+}
+export declare function GenericPageWrapper({ children, storeConfig: initialConfig }: GenericPageWrapperProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=GenericPageWrapper.d.ts.map

package/dist/layouts/shared/components/GenericPageWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericPageWrapper.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/components/GenericPageWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAKvD,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,aAAa,EAAE,EAAE,uBAAuB,2CAgCnG"}