storefront-layouts 1.0.6 → 1.0.7

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

@@ -13,14 +13,17 @@ import { useLoading } from '../../../lib/loading-context.js';
 import { useAnalytics } from '../../../hooks/use-analytics.js';
 import { ChevronDown, ChevronUp, Star, Check, Search, RotateCcw, SlidersHorizontal } from 'lucide-react';
 import { useSearchParams } from 'next/navigation';
-import { useState, useMemo, useEffect, useRef, Suspense } from 'react';
+import { useState, useMemo, useEffect, Suspense } from 'react';
 import { useProductBrands } from '../../../hooks/use-product-brands.js';
+import { useFilteredProductsFetch } from '../../../hooks/use-filtered-products-fetch.js';
 import { filterActiveProducts } from '../../../lib/utils/index.js';
 import { getAllCategoryIds, flattenCategoryTree, buildCategoryTree } from '../../../lib/utils/category-tree.js';
 import { getBannerImage, getLayoutText } from '../../../lib/utils/asset-helpers.js';
 import { shouldUseAPI } from '../../../lib/utils/demo-detection.js';
 import { useCatalogPriceRange } from '../../../hooks/use-catalog-price-range.js';
-import { isWithinActivePriceRange } from '../../../lib/utils/catalog-price-bounds.js';
+import { getApiPriceFilterActive, isWithinActivePriceRange } from '../../../lib/utils/catalog-price-bounds.js';
+import { buildFilteredProductQuery, getFilteredProductQueryKey, } from '../../../lib/utils/filtered-product-query.js';
+import { transformProductToStoreProduct } from '../../../lib/store-config-utils.js';
 import { ProductPriceFilterSection } from '../../shared/components/ProductPriceFilterSection';
 function ProductsPageContent({ storeConfig }) {
     const searchParams = useSearchParams();
@@ -62,7 +65,9 @@ function ProductsPageContent({ storeConfig }) {
     const [selectedBrands, setSelectedBrands] = useState([]);
     const [selectedCategories, setSelectedCategories] = useState([]);
     const storeCurrency = storeConfig.settings?.currency || 'NGN';
-    const { priceRange, setPriceRange, catalogBounds, resetPriceRange, hasActivePriceFilter, } = useCatalogPriceRange(products);
+    const bootstrapProducts = useMemo(() => filterActiveProducts(storeConfig.products || []), [storeConfig.products]);
+    const priceCatalogItems = bootstrapProducts.length > 0 ? bootstrapProducts : products;
+    const { priceRange, setPriceRange, catalogBounds, resetPriceRange, hasActivePriceFilter, } = useCatalogPriceRange(priceCatalogItems);
     const [selectedCategoryFilter, setSelectedCategoryFilter] = useState(null);
     // Initialize filters from URL
     useEffect(() => {
@@ -180,64 +185,52 @@ function ProductsPageContent({ storeConfig }) {
         }
         return result;
     }, [products, selectedBrands, effectiveCategoryIds, priceRange, selectedCategoryFilter, minRating, showInStockOnly, sortBy, categories]);
-    const productQuery = useMemo(() => {
-        const categoryIds = new Set(effectiveCategoryIds);
-        const selectedCategory = categories.find((category) => category.slug === selectedCategoryFilter);
-        if (selectedCategory)
-            getAllCategoryIds(selectedCategory).forEach((id) => categoryIds.add(id));
-        return {
+    const hasApiPriceFilter = getApiPriceFilterActive(priceRange, bootstrapProducts);
+    const priceQueryMin = hasApiPriceFilter ? priceRange[0] : undefined;
+    const priceQueryMax = hasApiPriceFilter ? priceRange[1] : undefined;
+    const { productQueryParams, productQueryKey } = useMemo(() => {
+        const params = buildFilteredProductQuery({
             storeId: storeConfig.id,
-            categoryIds: categoryIds.size ? Array.from(categoryIds).join(',') : undefined,
-            brands: selectedBrands.length ? selectedBrands.join(',') : undefined,
-            minPrice: priceRange[0] || undefined,
-            maxPrice: priceRange[1] < catalogBounds.max ? priceRange[1] : undefined,
-            rating: minRating || undefined,
-            inStock: showInStockOnly || undefined,
+            categories,
+            effectiveCategoryIds,
+            selectedCategoryFilter,
+            selectedBrands,
+            priceRange,
+            hasActivePriceFilter: hasApiPriceFilter,
+            minRating,
+            showInStockOnly,
             sortBy,
+        });
+        return {
+            productQueryParams: params,
+            productQueryKey: getFilteredProductQueryKey(params),
         };
-    }, [catalogBounds.max, categories, effectiveCategoryIds, minRating, priceRange, selectedBrands, selectedCategoryFilter, showInStockOnly, sortBy, storeConfig.id]);
-    const skipBootstrapRefetch = useRef(true);
-    useEffect(() => {
-        let cancelled = false;
-        const isDefaultQuery = !productQuery.categoryIds &&
-            !productQuery.brands &&
-            !productQuery.minPrice &&
-            productQuery.maxPrice === undefined &&
-            !productQuery.rating &&
-            !productQuery.inStock &&
-            productQuery.sortBy === 'featured';
-        const fetchFilteredProducts = async () => {
-            // Keep SSR bootstrap first paint; only refetch when filters/sort change.
-            if (skipBootstrapRefetch.current && isDefaultQuery && products.length > 0) {
-                skipBootstrapRefetch.current = false;
-                setTotalProducts(storeConfig.productsTotal || products.length);
-                return;
-            }
-            skipBootstrapRefetch.current = false;
-            setIsLoadingProducts(true);
-            try {
-                const { productService } = await import('../../../lib/services/product.service.js');
-                const { transformProductToStoreProduct } = await import('../../../lib/store-config-utils.js');
-                const response = await productService.getProducts({ ...productQuery, page: 1, limit: 12 });
-                if (cancelled)
-                    return;
-                setProducts(response.data.map(transformProductToStoreProduct));
-                setCurrentPage(1);
-                setTotalProducts(response.meta.total);
-                setVisibleProducts(12);
-            }
-            catch (error) {
-                if (!cancelled)
-                    console.error('Failed to fetch products:', error);
-            }
-            finally {
-                if (!cancelled)
-                    setIsLoadingProducts(false);
-            }
-        };
-        fetchFilteredProducts();
-        return () => { cancelled = true; };
-    }, [productQuery]);
+    }, [
+        storeConfig.id,
+        categories,
+        effectiveCategoryIds,
+        selectedCategoryFilter,
+        selectedBrands,
+        hasApiPriceFilter,
+        priceQueryMin,
+        priceQueryMax,
+        minRating,
+        showInStockOnly,
+        sortBy,
+    ]);
+    useFilteredProductsFetch(productQueryParams, productQueryKey, {
+        bootstrapItemCount: bootstrapProducts.length,
+        bootstrapTotal: storeConfig.productsTotal,
+        mapResponse: (data) => data.map(transformProductToStoreProduct),
+        applyResults: (items, total) => {
+            setProducts(items);
+            setCurrentPage(1);
+            setTotalProducts(total);
+            setVisibleProducts(12);
+        },
+        setTotalProducts,
+        setLoading: setIsLoadingProducts,
+    });
     const displayedProducts = filteredAndSortedProducts.slice(0, visibleProducts);
     const hasMore = currentPage * 12 < totalProducts;
     const handleLoadMore = async () => {
@@ -248,7 +241,7 @@ function ProductsPageContent({ storeConfig }) {
             const { productService } = await import('../../../lib/services/product.service.js');
             const { transformProductToStoreProduct } = await import('../../../lib/store-config-utils.js');
             const nextPage = currentPage + 1;
-            const response = await productService.getProducts({ ...productQuery, page: nextPage, limit: 12 });
+            const response = await productService.getProducts({ ...productQueryParams, page: nextPage, limit: 12 });
             setProducts((current) => [...current, ...response.data.map(transformProductToStoreProduct)]);
             setCurrentPage(nextPage);
             setTotalProducts(response.meta.total);
@@ -318,7 +311,7 @@ function ProductsPageContent({ storeConfig }) {
     const secondaryButtonText = hasSecondaryButtonFromConfig
         ? (categoryHeaderSecondaryButton && categoryHeaderSecondaryButton.trim() !== '' ? categoryHeaderSecondaryButton.trim() : null)
         : getLayoutText(storeConfig, 'sections.categories.viewAll', 'View Categories');
-    return (_jsxs("div", { className: "min-h-screen bg-white font-sans text-slate-900", children: [_jsxs("div", { className: "relative overflow-hidden bg-white", children: [categoryHeaderImage && (_jsxs("div", { className: "absolute inset-0 z-0", children: [_jsx(ImageWithFallback, { src: categoryHeaderImage, alt: categoryHeaderTitle || storeConfig.name, className: "w-full h-full object-cover", skeletonAspectRatio: "16/9" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/60 via-black/40 to-black/60" })] })), !categoryHeaderImage && (_jsxs("div", { className: "absolute top-0 left-0 w-full h-full overflow-hidden z-0 pointer-events-none", children: [_jsx("div", { className: "absolute top-[-10%] right-[-5%] w-[500px] h-[500px] bg-gray-100 rounded-full mix-blend-multiply filter blur-3xl opacity-70 animate-pulse-slow" }), _jsx("div", { className: "absolute bottom-[-10%] left-[-10%] w-[400px] h-[400px] bg-gray-50 rounded-full mix-blend-multiply filter blur-3xl opacity-70 animate-pulse-slow", style: { animationDelay: '2s' } })] })), _jsx("div", { className: `container mx-auto px-4 sm:px-6 lg:px-8 relative z-10 pt-12 pb-16 lg:pt-20 lg:pb-24 ${categoryHeaderImage ? 'min-h-[500px] flex items-center' : ''}`, children: _jsx("div", { className: "flex flex-col items-center w-full max-w-4xl mx-auto", children: _jsxs("div", { className: `w-full text-center lg:text-left animate-fade-in-up ${categoryHeaderImage ? 'text-white' : ''}`, children: [_jsx("div", { className: "flex justify-center lg:justify-start mb-6", children: _jsx("div", { className: categoryHeaderImage ? 'bg-white/10 backdrop-blur-md px-4 py-2 rounded-full border border-white/20' : '', children: _jsx(Breadcrumbs, { items: breadcrumbItems, variant: categoryHeaderImage ? 'light' : 'default' }) }) }), _jsxs("div", { className: `inline-flex items-center gap-2 px-3 py-1 rounded-full text-xs font-bold tracking-wider uppercase mb-6 ${categoryHeaderImage ? 'bg-white/20 backdrop-blur-md text-white border border-white/30' : 'bg-black/5 text-gray-900'}`, children: [_jsx("span", { className: `w-2 h-2 rounded-full animate-pulse ${categoryHeaderImage ? 'bg-white' : 'bg-black'}` }), getLayoutText(storeConfig, 'common.newArrivals', 'New Arrivals 2024')] }), _jsx("h1", { className: `text-4xl sm:text-5xl lg:text-6xl font-bold tracking-tight mb-6 leading-[1.1] ${categoryHeaderImage ? 'text-white' : 'text-gray-900'}`, children: categoryHeaderTitle || (_jsxs(_Fragment, { children: ["Explore The Collections of ", _jsx("br", {}), _jsx("span", { className: "text-transparent bg-clip-text bg-gradient-to-r from-gray-900 via-gray-700 to-gray-900", children: storeConfig.name })] })) }), _jsx("p", { className: `text-lg mb-8 leading-relaxed max-w-lg mx-auto lg:mx-0 ${categoryHeaderImage ? 'text-white/90' : 'text-gray-600'}`, children: getLayoutText(storeConfig, 'category_header:description', "Don't miss out on shopping our latest collection! curated for quality and style. Experience the perfect blend of modern aesthetics and premium craftsmanship.") }), _jsxs("div", { className: "flex flex-col sm:flex-row gap-4 justify-center lg:justify-start", children: [primaryButtonText && primaryButtonText.trim() !== '' && (_jsx(Button, { className: `h-12 px-8 rounded-full text-base font-medium shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1 ${categoryHeaderImage ? 'bg-white text-gray-900 hover:bg-gray-100' : ''}`, onClick: () => {
+    return (_jsxs("div", { className: "min-h-screen bg-white font-sans text-slate-900", children: [_jsxs("div", { className: "relative overflow-hidden bg-white", children: [categoryHeaderImage && (_jsxs("div", { className: "absolute inset-0 z-0", children: [_jsx(ImageWithFallback, { src: categoryHeaderImage, alt: categoryHeaderTitle || storeConfig.name, className: "w-full h-full object-cover", skeletonAspectRatio: "16/9" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/60 via-black/40 to-black/60" })] })), !categoryHeaderImage && (_jsxs("div", { className: "absolute top-0 left-0 w-full h-full overflow-hidden z-0 pointer-events-none", children: [_jsx("div", { className: "absolute top-[-10%] right-[-5%] w-[500px] h-[500px] bg-gray-100 rounded-full mix-blend-multiply filter blur-3xl opacity-70 animate-pulse-slow" }), _jsx("div", { className: "absolute bottom-[-10%] left-[-10%] w-[400px] h-[400px] bg-gray-50 rounded-full mix-blend-multiply filter blur-3xl opacity-70 animate-pulse-slow", style: { animationDelay: '2s' } })] })), _jsx("div", { className: `container mx-auto px-4 sm:px-6 lg:px-8 relative z-10 pt-12 pb-16 lg:pt-20 lg:pb-24 ${categoryHeaderImage ? 'min-h-[500px] flex items-center' : ''}`, children: _jsx("div", { className: "flex flex-col items-center w-full max-w-4xl mx-auto", children: _jsxs("div", { className: `w-full text-center lg:text-left animate-fade-in-up ${categoryHeaderImage ? 'text-white' : ''}`, children: [_jsx("div", { className: "flex justify-center lg:justify-start mb-6", children: _jsx("div", { className: categoryHeaderImage ? 'bg-white/10 backdrop-blur-md px-4 py-2 rounded-full border border-white/20' : '', children: _jsx(Breadcrumbs, { items: breadcrumbItems, variant: categoryHeaderImage ? 'light' : 'default' }) }) }), _jsx("h1", { className: `text-4xl sm:text-5xl lg:text-6xl font-bold tracking-tight mb-6 leading-[1.1] ${categoryHeaderImage ? 'text-white' : 'text-gray-900'}`, children: categoryHeaderTitle || (_jsxs(_Fragment, { children: ["Explore The Collections of ", _jsx("br", {}), _jsx("span", { className: "text-transparent bg-clip-text bg-gradient-to-r from-gray-900 via-gray-700 to-gray-900", children: storeConfig.name })] })) }), _jsx("p", { className: `text-lg mb-8 leading-relaxed max-w-lg mx-auto lg:mx-0 ${categoryHeaderImage ? 'text-white/90' : 'text-gray-600'}`, children: getLayoutText(storeConfig, 'category_header:description', "Don't miss out on shopping our latest collection! curated for quality and style. Experience the perfect blend of modern aesthetics and premium craftsmanship.") }), _jsxs("div", { className: "flex flex-col sm:flex-row gap-4 justify-center lg:justify-start", children: [primaryButtonText && primaryButtonText.trim() !== '' && (_jsx(Button, { className: `h-12 px-8 rounded-full text-base font-medium shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1 ${categoryHeaderImage ? 'bg-white text-gray-900 hover:bg-gray-100' : ''}`, onClick: () => {
                                                     const element = document.getElementById('product-grid');
                                                     element?.scrollIntoView({ behavior: 'smooth' });
                                                 }, children: primaryButtonText })), secondaryButtonText && secondaryButtonText.trim() !== '' && (_jsx(Button, { className: `h-12 px-8 rounded-full text-base font-medium shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1 ${categoryHeaderImage ? 'bg-white/10 backdrop-blur-md text-white border border-white/30 hover:bg-white/20' : 'bg-gray-100 text-gray-900 hover:bg-gray-200 border border-gray-200'}`, onClick: () => {

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

@@ -1 +1 @@
-{"version":3,"file":"ServiceDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/motivational-speaker/pages/ServiceDetailPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAgB,MAAM,mBAAmB,CAAC;AAgB9D,UAAU,sBAAsB;IAC9B,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,EAAE,sBAAsB,+BA4hBrF"}
+{"version":3,"file":"ServiceDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/motivational-speaker/pages/ServiceDetailPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAgB,MAAM,mBAAmB,CAAC;AAiB9D,UAAU,sBAAsB;IAC9B,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,EAAE,sBAAsB,+BA8hBrF"}

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

@@ -12,6 +12,7 @@ import Image from 'next/image';
 import { formatCurrency, filterActiveServices } from '../../../lib/utils/index.js';
 import { getServiceImage } from '../../../lib/utils/asset-helpers.js';
 import { motion } from 'framer-motion';
+import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml.js';
 import Link from 'next/link';
 import { cn } from '../../../lib/utils/index.js';
 export function ServiceDetailPage({ storeConfig, serviceSlug }) {
@@ -117,7 +118,7 @@ export function ServiceDetailPage({ storeConfig, serviceSlug }) {
             }
         }
     };
-    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" }), _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("p", { className: "text-xl text-gray-600 leading-relaxed", children: service.description })] }), _jsx("div", { className: "border-b border-gray-200", children: _jsx("div", { className: "flex gap-8", children: [
+    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" }), _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(SafeRichHtml, { value: service.description, as: "div", className: "text-xl text-gray-600 leading-relaxed [&_p]:mb-0 [&_p+p]:mt-2" })] }), _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' },

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

@@ -1 +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;AAQhD,UAAU,iBAAiB;IACzB,WAAW,EAAE,WAAW,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,YAAY,CAAC,EAAE,WAAW,EAAE,eAAe,EAAE,aAAa,EAAE,EAAE,iBAAiB,+BA2J9F"}
+{"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;AAUhD,UAAU,iBAAiB;IACzB,WAAW,EAAE,WAAW,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,YAAY,CAAC,EAAE,WAAW,EAAE,eAAe,EAAE,aAAa,EAAE,EAAE,iBAAiB,+BA+J9F"}

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

@@ -3,6 +3,8 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { Button } from '../../../components/ui/button.js';
 import { Clock, ArrowRight, Filter } from 'lucide-react';
 import Link from 'next/link';
+import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
+import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml.js';
 import { useState } from 'react';
 import { cn, formatCurrency, filterActiveServices } from '../../../lib/utils/index.js';
 import Image from 'next/image';
@@ -25,7 +27,7 @@ export function ServicesPage({ storeConfig, initialCategory, titleOverride }) {
         return `/${storeConfig.slug}/services/${slug}`;
     };
     const pageTitle = titleOverride || 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: [_jsxs("div", { "data-section": "hero", className: "relative bg-gray-900 py-32 px-4 text-center overflow-hidden", children: [_jsxs("div", { className: "absolute inset-0", children: [_jsx(Image, { src: "https://images.unsplash.com/photo-1544531696-608a67ed9739?q=80&w=2070&auto=format&fit=crop", alt: "Service Menu", fill: true, className: "w-full h-full object-cover opacity-60" }), _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: [_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", children: pageTitle }), _jsx("p", { className: "text-gray-200 max-w-2xl mx-auto text-lg font-light leading-relaxed", children: 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
+    return (_jsxs("div", { className: "min-h-screen bg-white pb-20", children: [_jsxs("div", { "data-section": "hero", className: "relative bg-gray-900 py-32 px-4 text-center overflow-hidden", children: [_jsxs("div", { className: "absolute inset-0", children: [_jsx(Image, { src: "https://images.unsplash.com/photo-1544531696-608a67ed9739?q=80&w=2070&auto=format&fit=crop", alt: "Service Menu", fill: true, className: "w-full h-full object-cover opacity-60" }), _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: [_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", children: pageTitle }), _jsx(SafeRichHtml, { value: servicesConfig?.description || storeConfig.description || `Explore our curated selection of premium ${serviceLabel.toLowerCase()} designed for your success.`, as: "div", className: "text-gray-200 max-w-2xl mx-auto text-lg font-light leading-relaxed [&_p]:mb-0" })] })] }), _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", 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" }), _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("p", { className: "text-gray-500 mb-6 line-clamp-2 leading-relaxed text-base flex-1", children: service.description }), _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))) }) })] }));
+                                    : "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", 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" }), _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.map

@@ -1 +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,+BA8TlF"}
+{"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;AAehD,UAAU,qBAAqB;IAC7B,WAAW,EAAE,WAAW,CAAC;CAC1B;AAcD,wBAAgB,4BAA4B,CAAC,EAAE,WAAW,EAAE,EAAE,qBAAqB,+BA8TlF"}

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

@@ -11,6 +11,7 @@ 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 { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
 import { showLayoutDecorativeBadges } from '../../../lib/layout-badges.js';
 export function MotivationalSubscriptionPage({ storeConfig }) {
     const router = useRouter();
@@ -100,7 +101,7 @@ export function MotivationalSubscriptionPage({ storeConfig }) {
     ];
     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
+                            : "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(RichTextExcerpt, { value: tier.description, as: "p", className: "text-gray-600 mb-6" }), _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"
@@ -120,7 +121,7 @@ export function MotivationalSubscriptionPage({ storeConfig }) {
                                     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: [
+                            ].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(RichTextExcerpt, { value: feature.description, as: "p", className: "text-gray-600" })] }, 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.',

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

@@ -1 +1 @@
-{"version":3,"file":"StoreFooter.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/components/StoreFooter.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AA4BvD,UAAU,gBAAgB;IACxB,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAgB,WAAW,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,EAAE,gBAAgB,+BAga3E"}
+{"version":3,"file":"StoreFooter.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/components/StoreFooter.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAkBvD,UAAU,gBAAgB;IACxB,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAgB,WAAW,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,EAAE,gBAAgB,+BA6Y3E"}

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

@@ -11,17 +11,8 @@ import { useStore } from '../../../lib/store-context';
 import { payazaInlineBindingProps } from '../../../preview/canvas/field-key';
 import { isEditorPreviewMode } from '../../../lib/utils/editor-preview';
 import { resolveStoreLink } from '../../../lib/layout-route-utils';
+import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
 import { BOOKING_DEFAULT_FOOTER_TAGLINE, resolveBookingFooterMainLinks, resolveBookingFooterSupportLinks, resolveBookingFooterPrimaryColumnTitle, } from '../../booking/components/booking-footer-defaults';
-const PAYMENT_METHODS = [
-    'Bank Transfer',
-    'Visa',
-    'Mastercard',
-    'Verve',
-    'Afrigo',
-    'ApplePay',
-    'Google Pay',
-    'Mobile Money',
-];
 export function StoreFooter({ storeConfig: initialConfig }) {
     const { store } = useStore();
     const storeConfig = store || initialConfig;
@@ -60,7 +51,6 @@ export function StoreFooter({ storeConfig: initialConfig }) {
     const copyrightLine = footerConfig?.copyrightText?.trim() ||
         `© ${currentYear} ${storeConfig.name}. All rights reserved.`;
     const showSocial = footerConfig?.showSocialLinks !== false;
-    const showPaymentBadges = footerConfig?.showPaymentBadges !== false;
     const bgPrimary = isDarkTheme ? '#000000' : '#F8FAFC';
     const bgSecondary = isDarkTheme ? '#0a0a0f' : '#FFFFFF';
     const bgDark = '#000000';
@@ -76,7 +66,7 @@ export function StoreFooter({ storeConfig: initialConfig }) {
             borderTopStyle: 'solid',
         }, children: [_jsx("div", { className: "absolute inset-0 z-0 opacity-[0.4] pointer-events-none", children: _jsx(DotPattern, { color: isDarkTheme ? "#3b82f6" : "#94a3b8", cx: 1, cy: 1, cr: 1, width: 20, height: 20 }) }), _jsxs("div", { className: "relative z-10 container mx-auto px-4 sm:px-6 lg:px-8 pt-16 pb-8", children: [_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-12 gap-12 lg:gap-8 mb-16", children: [_jsxs("div", { className: "lg:col-span-4 space-y-6", children: [_jsx(Link, { href: `/${storeConfig.slug}`, className: "inline-block", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(StoreLogo, { storeConfig: storeConfig, className: "h-10 w-10", alt: storeConfig.name }), !getLogoUrl(storeConfig) && (_jsx("span", { className: cn("text-2xl font-extrabold tracking-tight", isDarkTheme ? "text-white" : ""), style: {
                                                         color: isDarkTheme ? undefined : primaryColor,
-                                                    }, children: storeConfig.name }))] }) }), _jsx("p", { className: cn("text-base leading-relaxed max-w-sm", isDarkTheme ? "text-gray-400" : "text-gray-500"), children: _jsx("span", { ...inline(['tagline']), children: tagline }) }), showSocial && storeConfig.branding.socialMedia && (_jsxs("div", { className: "flex items-center gap-4 pt-2", children: [storeConfig.branding.socialMedia.facebook && (_jsx("a", { href: storeConfig.branding.socialMedia.facebook, target: "_blank", rel: "noopener noreferrer", className: cn("h-10 w-10 flex items-center justify-center rounded-full transition-all duration-300 transform hover:scale-110 shadow-sm", isDarkTheme
+                                                    }, children: storeConfig.name }))] }) }), _jsx("p", { className: cn("text-base leading-relaxed max-w-sm", isDarkTheme ? "text-gray-400" : "text-gray-500"), children: _jsx("span", { ...inline(['tagline']), children: _jsx(RichTextExcerpt, { value: tagline, as: "span" }) }) }), showSocial && storeConfig.branding.socialMedia && (_jsxs("div", { className: "flex items-center gap-4 pt-2", children: [storeConfig.branding.socialMedia.facebook && (_jsx("a", { href: storeConfig.branding.socialMedia.facebook, target: "_blank", rel: "noopener noreferrer", className: cn("h-10 w-10 flex items-center justify-center rounded-full transition-all duration-300 transform hover:scale-110 shadow-sm", isDarkTheme
                                                     ? "bg-white/10 border border-white/20 text-gray-400 hover:text-white hover:border-white/40"
                                                     : "bg-white border border-gray-200 text-gray-500 hover:text-white hover:border-transparent"), style: {
                                                     '--hover-bg': primaryColor
@@ -152,5 +142,5 @@ export function StoreFooter({ storeConfig: initialConfig }) {
                                                         e.currentTarget.style.color = '#6b7280';
                                                         e.currentTarget.style.borderColor = '#e5e7eb';
                                                     }
-                                                }, children: _jsx(Share2, { className: "h-5 w-5" }) }))] }))] }), _jsxs("div", { className: "lg:col-span-8 grid grid-cols-2 sm:grid-cols-3 gap-8", children: [_jsxs("div", { children: [_jsx("h4", { className: cn("font-bold text-lg mb-6", isDarkTheme ? "text-white" : "text-gray-900"), children: _jsx("span", { ...inline(['primaryColumnTitle']), children: primaryColumnTitle }) }), _jsx("ul", { className: "space-y-4", children: mainLinks.map((link, index) => (_jsx("li", { children: _jsx(Link, { href: resolveStoreLink(link.href, storeConfig.slug), className: cn("transition-colors flex items-center group", isDarkTheme ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-900"), children: _jsxs("span", { className: "relative", children: [_jsx("span", { ...inline(['mainLinks', String(index), 'label']), children: link.label }), _jsx("span", { className: cn("absolute -bottom-1 left-0 w-0 h-0.5 transition-all group-hover:w-full", isDarkTheme ? "bg-white" : "bg-gray-900") })] }) }) }, link.id || `${index}-${link.href}`))) })] }), _jsxs("div", { children: [_jsx("h4", { className: cn("font-bold text-lg mb-6", isDarkTheme ? "text-white" : "text-gray-900"), children: _jsx("span", { ...inline(['supportColumnTitle']), children: supportColumnTitle }) }), _jsx("ul", { className: "space-y-4", children: supportLinks.map((link, index) => (_jsx("li", { children: _jsx(Link, { href: resolveStoreLink(link.href, storeConfig.slug), className: cn("transition-colors group flex items-center", isDarkTheme ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-900"), children: _jsxs("span", { className: "relative", children: [_jsx("span", { ...inline(['supportLinks', String(index), 'label']), children: link.label }), _jsx("span", { className: cn("absolute -bottom-1 left-0 w-0 h-0.5 transition-all group-hover:w-full", isDarkTheme ? "bg-white" : "bg-gray-900") })] }) }) }, link.id || `support-${index}-${link.href}`))) })] }), _jsxs("div", { children: [_jsx("h4", { className: cn("font-bold text-lg mb-6", isDarkTheme ? "text-white" : "text-gray-900"), children: _jsx("span", { ...inline(['contactColumnTitle']), children: contactColumnTitle }) }), _jsxs("ul", { className: "space-y-4", children: [footerAddress && (_jsx("li", { className: cn("text-sm leading-relaxed whitespace-pre-line", isDarkTheme ? "text-gray-400" : "text-gray-500"), children: _jsx("span", { ...inline(['address']), children: footerAddress }) })), footerEmail && (_jsx("li", { className: cn(isDarkTheme ? "text-gray-400" : "text-gray-500"), children: _jsx("a", { href: `mailto:${footerEmail}`, className: cn("transition-colors", isDarkTheme ? "hover:text-white" : "hover:text-gray-900"), children: _jsx("span", { ...inline(['email']), children: footerEmail }) }) })), footerPhone && (_jsx("li", { className: cn(isDarkTheme ? "text-gray-400" : "text-gray-500"), children: _jsx("a", { href: `tel:${footerPhone.replace(/\D/g, '')}`, className: cn("transition-colors", isDarkTheme ? "hover:text-white" : "hover:text-gray-900"), children: _jsx("span", { ...inline(['phone']), children: footerPhone }) }) }))] })] })] })] }), _jsxs("div", { className: cn("pt-8 border-t flex flex-col md:flex-row justify-between items-center gap-4", isDarkTheme ? "border-white/10" : "border-slate-200"), children: [_jsx("p", { className: cn("text-sm font-medium", isDarkTheme ? "text-gray-500" : "text-gray-500"), children: _jsx("span", { ...inline(['copyrightText']), children: copyrightLine }) }), showPaymentBadges && (_jsx("div", { className: "flex items-center gap-4 grayscale opacity-70 hover:grayscale-0 hover:opacity-100 transition-all w-full md:w-auto justify-center md:justify-end", children: _jsxs("div", { className: "flex gap-2 flex-wrap justify-center md:justify-end max-w-full", children: [PAYMENT_METHODS.map((method, index) => (_jsx("div", { className: `h-8 px-2 bg-white border border-gray-200 rounded flex items-center justify-center text-[10px] font-bold text-gray-600 shadow-sm whitespace-nowrap ${index >= 6 ? 'hidden lg:flex' : 'flex'}`, children: method }, method))), PAYMENT_METHODS.length > 6 && (_jsxs("div", { className: "h-8 px-2 bg-gray-50 border border-gray-200 rounded flex items-center justify-center text-[10px] font-bold text-gray-500 shadow-sm cursor-help lg:hidden", title: PAYMENT_METHODS.slice(6).join(', '), children: ["+", PAYMENT_METHODS.length - 6, " more"] }))] }) }))] })] })] }));
+                                                }, children: _jsx(Share2, { className: "h-5 w-5" }) }))] }))] }), _jsxs("div", { className: "lg:col-span-8 grid grid-cols-2 sm:grid-cols-3 gap-8", children: [_jsxs("div", { children: [_jsx("h4", { className: cn("font-bold text-lg mb-6", isDarkTheme ? "text-white" : "text-gray-900"), children: _jsx("span", { ...inline(['primaryColumnTitle']), children: primaryColumnTitle }) }), _jsx("ul", { className: "space-y-4", children: mainLinks.map((link, index) => (_jsx("li", { children: _jsx(Link, { href: resolveStoreLink(link.href, storeConfig.slug), className: cn("transition-colors flex items-center group", isDarkTheme ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-900"), children: _jsxs("span", { className: "relative", children: [_jsx("span", { ...inline(['mainLinks', String(index), 'label']), children: link.label }), _jsx("span", { className: cn("absolute -bottom-1 left-0 w-0 h-0.5 transition-all group-hover:w-full", isDarkTheme ? "bg-white" : "bg-gray-900") })] }) }) }, link.id || `${index}-${link.href}`))) })] }), _jsxs("div", { children: [_jsx("h4", { className: cn("font-bold text-lg mb-6", isDarkTheme ? "text-white" : "text-gray-900"), children: _jsx("span", { ...inline(['supportColumnTitle']), children: supportColumnTitle }) }), _jsx("ul", { className: "space-y-4", children: supportLinks.map((link, index) => (_jsx("li", { children: _jsx(Link, { href: resolveStoreLink(link.href, storeConfig.slug), className: cn("transition-colors group flex items-center", isDarkTheme ? "text-gray-400 hover:text-white" : "text-gray-500 hover:text-gray-900"), children: _jsxs("span", { className: "relative", children: [_jsx("span", { ...inline(['supportLinks', String(index), 'label']), children: link.label }), _jsx("span", { className: cn("absolute -bottom-1 left-0 w-0 h-0.5 transition-all group-hover:w-full", isDarkTheme ? "bg-white" : "bg-gray-900") })] }) }) }, link.id || `support-${index}-${link.href}`))) })] }), _jsxs("div", { children: [_jsx("h4", { className: cn("font-bold text-lg mb-6", isDarkTheme ? "text-white" : "text-gray-900"), children: _jsx("span", { ...inline(['contactColumnTitle']), children: contactColumnTitle }) }), _jsxs("ul", { className: "space-y-4", children: [footerAddress && (_jsx("li", { className: cn("text-sm leading-relaxed whitespace-pre-line", isDarkTheme ? "text-gray-400" : "text-gray-500"), children: _jsx("span", { ...inline(['address']), children: footerAddress }) })), footerEmail && (_jsx("li", { className: cn(isDarkTheme ? "text-gray-400" : "text-gray-500"), children: _jsx("a", { href: `mailto:${footerEmail}`, className: cn("transition-colors", isDarkTheme ? "hover:text-white" : "hover:text-gray-900"), children: _jsx("span", { ...inline(['email']), children: footerEmail }) }) })), footerPhone && (_jsx("li", { className: cn(isDarkTheme ? "text-gray-400" : "text-gray-500"), children: _jsx("a", { href: `tel:${footerPhone.replace(/\D/g, '')}`, className: cn("transition-colors", isDarkTheme ? "hover:text-white" : "hover:text-gray-900"), children: _jsx("span", { ...inline(['phone']), children: footerPhone }) }) }))] })] })] })] }), _jsx("div", { className: cn("pt-8 border-t flex flex-col md:flex-row justify-between items-center gap-4", isDarkTheme ? "border-white/10" : "border-slate-200"), children: _jsx("p", { className: cn("text-sm font-medium", isDarkTheme ? "text-gray-500" : "text-gray-500"), children: _jsx("span", { ...inline(['copyrightText']), children: copyrightLine }) }) })] })] }));
 }

package/dist/layouts/shared/pages/PortfolioPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PortfolioPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/pages/PortfolioPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAOhD,UAAU,kBAAkB;IAC1B,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAAE,WAAW,EAAE,EAAE,kBAAkB,+BAsThE"}
+{"version":3,"file":"PortfolioPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/pages/PortfolioPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAQhD,UAAU,kBAAkB;IAC1B,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAAE,WAAW,EAAE,EAAE,kBAAkB,+BAsThE"}

package/dist/layouts/shared/pages/PortfolioPage.js

@@ -5,6 +5,7 @@ import Link from 'next/link';
 import { useState, useEffect, useCallback } from 'react';
 import { cn } from '../../../lib/utils/index.js';
 import Image from 'next/image';
+import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
 export function PortfolioPage({ storeConfig }) {
     const primaryColor = storeConfig.branding.primaryColor;
     const [activeCategory, setActiveCategory] = useState('All');
@@ -126,5 +127,5 @@ export function PortfolioPage({ storeConfig }) {
                                     ? "bg-gray-900 text-white shadow-sm"
                                     : "text-gray-500 hover:text-gray-900 hover:bg-gray-50"), children: "All" }), categories.map((category) => (_jsx("button", { onClick: () => setActiveCategory(category), className: cn("px-6 py-2.5 rounded-full text-sm font-bold whitespace-nowrap flex-shrink-0 transition-all", activeCategory === category
                                     ? "text-white shadow-sm"
-                                    : "text-gray-500 hover:text-gray-900 hover:bg-gray-50"), style: activeCategory === category ? { backgroundColor: primaryColor } : {}, children: category }, category)))] }) }) }), _jsx("div", { className: "container mx-auto px-4 max-w-7xl py-16", children: _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8", children: filteredItems.map((item, index) => (_jsxs("div", { onClick: () => setSelectedIndex(index), className: "group relative overflow-hidden rounded-2xl bg-gray-100 aspect-[4/5] cursor-pointer", children: [_jsx(Image, { src: item.image, alt: item.title, fill: true, className: "w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-black/80 via-black/40 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-end p-6", children: _jsxs("div", { className: "text-white", children: [_jsxs("div", { className: "flex items-center gap-2 mb-2", children: [_jsx("span", { className: "text-xs font-bold uppercase tracking-wider opacity-80", children: item.category }), item.featured && (_jsx("span", { className: "text-xs px-2 py-0.5 rounded-full bg-white/20 backdrop-blur", children: "Featured" }))] }), _jsx("h3", { className: "text-xl font-bold mb-2", children: item.title }), _jsx("p", { className: "text-sm text-white/80 mb-4 line-clamp-2", children: item.description }), _jsx("div", { className: "flex items-center gap-4 text-xs text-white/60", children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Calendar, { className: "w-3.5 h-3.5" }), item.date] }) })] }) }), item.featured && (_jsx("div", { className: "absolute top-4 right-4 bg-white/95 backdrop-blur px-3 py-1 rounded-full text-xs font-bold shadow-sm", children: "Featured" }))] }, item.id))) }) }), selectedIndex !== null && (_jsxs("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/95 backdrop-blur-md animate-in fade-in duration-200", onClick: handleClose, children: [_jsx("button", { onClick: handleClose, className: "absolute top-6 right-6 p-2 text-white/70 hover:text-white transition-colors hover:bg-white/10 rounded-full z-50", children: _jsx(X, { className: "w-8 h-8" }) }), _jsx("button", { onClick: handlePrev, className: "absolute left-4 md:left-8 top-1/2 -translate-y-1/2 p-3 text-white/70 hover:text-white transition-all hover:bg-white/10 rounded-full z-50 hover:scale-110", "aria-label": "Previous image", children: _jsx(ChevronLeft, { className: "w-8 h-8 md:w-10 md:h-10" }) }), _jsx("button", { onClick: handleNext, className: "absolute right-4 md:right-8 top-1/2 -translate-y-1/2 p-3 text-white/70 hover:text-white transition-all hover:bg-white/10 rounded-full z-50 hover:scale-110", "aria-label": "Next image", children: _jsx(ChevronRight, { className: "w-8 h-8 md:w-10 md:h-10" }) }), _jsxs("div", { className: "relative w-full h-full max-w-7xl mx-auto p-4 md:p-12 flex flex-col items-center justify-center", onClick: (e) => e.stopPropagation(), children: [_jsx("div", { className: "relative w-full h-full flex items-center justify-center", children: _jsx(Image, { src: filteredItems[selectedIndex].image, alt: filteredItems[selectedIndex].title, fill: true, className: "max-w-full max-h-[85vh] object-contain shadow-2xl rounded-sm" }) }), _jsx("div", { className: "absolute bottom-0 left-0 right-0 z-20 p-8 pb-10 flex flex-col items-center justify-end bg-gradient-to-t from-black/90 via-black/60 to-transparent pt-32 pointer-events-none", children: _jsxs("div", { className: "text-center max-w-3xl mx-auto pointer-events-auto", children: [_jsx("h3", { className: "text-2xl md:text-3xl font-bold text-white mb-3 drop-shadow-lg", children: filteredItems[selectedIndex].title }), _jsx("p", { className: "text-white/90 text-base md:text-lg drop-shadow-md leading-relaxed max-w-2xl mx-auto", children: filteredItems[selectedIndex].description }), _jsxs("div", { className: "mt-4 flex items-center justify-center gap-3", children: [_jsx("span", { className: "bg-white/20 backdrop-blur-md px-3 py-1 rounded-full text-white text-xs font-bold uppercase tracking-wider border border-white/10 shadow-sm", children: filteredItems[selectedIndex].category }), _jsxs("span", { className: "text-white/70 text-sm font-medium drop-shadow-md", children: [selectedIndex + 1, " / ", filteredItems.length] })] })] }) })] })] })), _jsx("div", { className: "bg-gray-50 py-24 px-4", children: _jsxs("div", { className: "container mx-auto max-w-2xl text-center", children: [_jsx("h2", { className: "text-3xl md:text-4xl font-bold mb-6 text-gray-900", children: "Ready to Create Your Look?" }), _jsx("p", { className: "text-gray-500 text-lg mb-10", children: "Book a consultation and let us bring your vision to life." }), _jsx(Link, { href: `/${storeConfig.slug}/book`, children: _jsx("button", { className: "h-14 px-10 rounded-full text-lg font-bold shadow-xl hover:shadow-2xl transition-all hover:-translate-y-1", style: { backgroundColor: primaryColor, color: 'white' }, children: "Book Appointment" }) })] }) })] }));
+                                    : "text-gray-500 hover:text-gray-900 hover:bg-gray-50"), style: activeCategory === category ? { backgroundColor: primaryColor } : {}, children: category }, category)))] }) }) }), _jsx("div", { className: "container mx-auto px-4 max-w-7xl py-16", children: _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8", children: filteredItems.map((item, index) => (_jsxs("div", { onClick: () => setSelectedIndex(index), className: "group relative overflow-hidden rounded-2xl bg-gray-100 aspect-[4/5] cursor-pointer", children: [_jsx(Image, { src: item.image, alt: item.title, fill: true, className: "w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-black/80 via-black/40 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col justify-end p-6", children: _jsxs("div", { className: "text-white", children: [_jsxs("div", { className: "flex items-center gap-2 mb-2", children: [_jsx("span", { className: "text-xs font-bold uppercase tracking-wider opacity-80", children: item.category }), item.featured && (_jsx("span", { className: "text-xs px-2 py-0.5 rounded-full bg-white/20 backdrop-blur", children: "Featured" }))] }), _jsx("h3", { className: "text-xl font-bold mb-2", children: item.title }), _jsx(RichTextExcerpt, { value: item.description, as: "p", className: "text-sm text-white/80 mb-4 line-clamp-2" }), _jsx("div", { className: "flex items-center gap-4 text-xs text-white/60", children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Calendar, { className: "w-3.5 h-3.5" }), item.date] }) })] }) }), item.featured && (_jsx("div", { className: "absolute top-4 right-4 bg-white/95 backdrop-blur px-3 py-1 rounded-full text-xs font-bold shadow-sm", children: "Featured" }))] }, item.id))) }) }), selectedIndex !== null && (_jsxs("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/95 backdrop-blur-md animate-in fade-in duration-200", onClick: handleClose, children: [_jsx("button", { onClick: handleClose, className: "absolute top-6 right-6 p-2 text-white/70 hover:text-white transition-colors hover:bg-white/10 rounded-full z-50", children: _jsx(X, { className: "w-8 h-8" }) }), _jsx("button", { onClick: handlePrev, className: "absolute left-4 md:left-8 top-1/2 -translate-y-1/2 p-3 text-white/70 hover:text-white transition-all hover:bg-white/10 rounded-full z-50 hover:scale-110", "aria-label": "Previous image", children: _jsx(ChevronLeft, { className: "w-8 h-8 md:w-10 md:h-10" }) }), _jsx("button", { onClick: handleNext, className: "absolute right-4 md:right-8 top-1/2 -translate-y-1/2 p-3 text-white/70 hover:text-white transition-all hover:bg-white/10 rounded-full z-50 hover:scale-110", "aria-label": "Next image", children: _jsx(ChevronRight, { className: "w-8 h-8 md:w-10 md:h-10" }) }), _jsxs("div", { className: "relative w-full h-full max-w-7xl mx-auto p-4 md:p-12 flex flex-col items-center justify-center", onClick: (e) => e.stopPropagation(), children: [_jsx("div", { className: "relative w-full h-full flex items-center justify-center", children: _jsx(Image, { src: filteredItems[selectedIndex].image, alt: filteredItems[selectedIndex].title, fill: true, className: "max-w-full max-h-[85vh] object-contain shadow-2xl rounded-sm" }) }), _jsx("div", { className: "absolute bottom-0 left-0 right-0 z-20 p-8 pb-10 flex flex-col items-center justify-end bg-gradient-to-t from-black/90 via-black/60 to-transparent pt-32 pointer-events-none", children: _jsxs("div", { className: "text-center max-w-3xl mx-auto pointer-events-auto", children: [_jsx("h3", { className: "text-2xl md:text-3xl font-bold text-white mb-3 drop-shadow-lg", children: filteredItems[selectedIndex].title }), _jsx(RichTextExcerpt, { value: filteredItems[selectedIndex].description, as: "p", className: "text-white/90 text-base md:text-lg drop-shadow-md leading-relaxed max-w-2xl mx-auto" }), _jsxs("div", { className: "mt-4 flex items-center justify-center gap-3", children: [_jsx("span", { className: "bg-white/20 backdrop-blur-md px-3 py-1 rounded-full text-white text-xs font-bold uppercase tracking-wider border border-white/10 shadow-sm", children: filteredItems[selectedIndex].category }), _jsxs("span", { className: "text-white/70 text-sm font-medium drop-shadow-md", children: [selectedIndex + 1, " / ", filteredItems.length] })] })] }) })] })] })), _jsx("div", { className: "bg-gray-50 py-24 px-4", children: _jsxs("div", { className: "container mx-auto max-w-2xl text-center", children: [_jsx("h2", { className: "text-3xl md:text-4xl font-bold mb-6 text-gray-900", children: "Ready to Create Your Look?" }), _jsx("p", { className: "text-gray-500 text-lg mb-10", children: "Book a consultation and let us bring your vision to life." }), _jsx(Link, { href: `/${storeConfig.slug}/book`, children: _jsx("button", { className: "h-14 px-10 rounded-full text-lg font-bold shadow-xl hover:shadow-2xl transition-all hover:-translate-y-1", style: { backgroundColor: primaryColor, color: 'white' }, children: "Book Appointment" }) })] }) })] }));
 }

package/dist/layouts/shared/pages/StoreMaintenanceScreen.d.ts

@@ -0,0 +1,9 @@
+import type { StoreConfig } from '../../../lib/store-types.js';
+export type StoreMaintenanceReason = 'unpublished' | 'inactive' | 'offline';
+interface StoreMaintenanceScreenProps {
+    storeConfig: StoreConfig;
+    reason?: StoreMaintenanceReason;
+}
+export declare function StoreMaintenanceScreen({ storeConfig, reason, }: StoreMaintenanceScreenProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=StoreMaintenanceScreen.d.ts.map

package/dist/layouts/shared/pages/StoreMaintenanceScreen.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StoreMaintenanceScreen.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/pages/StoreMaintenanceScreen.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD,MAAM,MAAM,sBAAsB,GAAG,aAAa,GAAG,UAAU,GAAG,SAAS,CAAC;AAE5E,UAAU,2BAA2B;IACnC,WAAW,EAAE,WAAW,CAAC;IACzB,MAAM,CAAC,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,sBAAsB,CAAC,EACrC,WAAW,EACX,MAAsB,GACvB,EAAE,2BAA2B,+BAM7B"}

package/dist/layouts/shared/pages/StoreMaintenanceScreen.js

@@ -0,0 +1,10 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { MaintenancePage } from './MaintenancePage';
+import { StoreOfflinePage } from './StoreOfflinePage';
+export function StoreMaintenanceScreen({ storeConfig, reason = 'unpublished', }) {
+    if (reason === 'offline') {
+        return _jsx(StoreOfflinePage, { storeConfig: storeConfig });
+    }
+    return _jsx(MaintenancePage, { storeConfig: storeConfig });
+}

package/dist/layouts/shared/pages/StoreOfflinePage.d.ts

@@ -0,0 +1,19 @@
+import { StoreConfig } from '../../../lib/store-types';
+export declare const STORE_OFFLINE_MOBILE_DEFAULTS: {
+    copyY: number;
+    subtextGap: number;
+    subtextToIllustration: number;
+    illustrationScaleY: number;
+    buttonGap: number;
+    logoHeight: number;
+};
+export type StoreOfflineMobileTuning = typeof STORE_OFFLINE_MOBILE_DEFAULTS;
+interface StoreOfflinePageProps {
+    storeConfig: StoreConfig;
+    illustrationSrc?: string;
+    shopazaLogoSrc?: string;
+    mobileTuning?: StoreOfflineMobileTuning;
+}
+export declare function StoreOfflinePage({ storeConfig, illustrationSrc, shopazaLogoSrc, mobileTuning, }: StoreOfflinePageProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=StoreOfflinePage.d.ts.map

package/dist/layouts/shared/pages/StoreOfflinePage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StoreOfflinePage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/shared/pages/StoreOfflinePage.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AASvD,eAAO,MAAM,6BAA6B;;;;;;;CAOzC,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,OAAO,6BAA6B,CAAC;AAE5E,UAAU,qBAAqB;IAC7B,WAAW,EAAE,WAAW,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,wBAAwB,CAAC;CACzC;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,WAAW,EACX,eAA0C,EAC1C,cAAyC,EACzC,YAA4C,GAC7C,EAAE,qBAAqB,+BAkKvB"}