storefront-layouts 1.0.6 → 1.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ui/route-skeleton-loader.d.ts.map +1 -1
- package/dist/components/ui/route-skeleton-loader.js +6 -1
- package/dist/editor/alignment-schemas/booking-footer-section.d.ts.map +1 -1
- package/dist/editor/alignment-schemas/booking-footer-section.js +0 -1
- package/dist/editor/alignment-schemas/clothing.d.ts.map +1 -1
- package/dist/editor/alignment-schemas/clothing.js +0 -1
- package/dist/editor/alignment-schemas/food.d.ts.map +1 -1
- package/dist/editor/alignment-schemas/food.js +0 -1
- package/dist/hooks/use-category-products.d.ts +5 -1
- package/dist/hooks/use-category-products.d.ts.map +1 -1
- package/dist/hooks/use-category-products.js +8 -5
- package/dist/hooks/use-filtered-products-fetch.d.ts +12 -0
- package/dist/hooks/use-filtered-products-fetch.d.ts.map +1 -0
- package/dist/hooks/use-filtered-products-fetch.js +58 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +5 -0
- package/dist/layouts/booking/components/BookingHomePage.d.ts.map +1 -1
- package/dist/layouts/booking/components/BookingHomePage.js +3 -1
- package/dist/layouts/booking/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/booking/pages/AboutPage.js +3 -1
- package/dist/layouts/booking/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/booking/pages/CategoryPage.js +3 -1
- package/dist/layouts/booking/pages/ProductDetailPage.d.ts.map +1 -1
- package/dist/layouts/booking/pages/ProductDetailPage.js +2 -1
- package/dist/layouts/booking/pages/ServicesPage.d.ts.map +1 -1
- package/dist/layouts/booking/pages/ServicesPage.js +4 -2
- package/dist/layouts/booking-agenda/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/booking-agenda/pages/AboutPage.js +3 -1
- package/dist/layouts/booking-agenda/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/booking-agenda/pages/CategoryPage.js +3 -1
- package/dist/layouts/booking-agenda/pages/ProductDetailPage.d.ts.map +1 -1
- package/dist/layouts/booking-agenda/pages/ProductDetailPage.js +2 -1
- package/dist/layouts/booking-agenda/pages/ServicesPage.d.ts.map +1 -1
- package/dist/layouts/booking-agenda/pages/ServicesPage.js +4 -2
- package/dist/layouts/clothing/components/ClothingHomePage.d.ts.map +1 -1
- package/dist/layouts/clothing/components/ClothingHomePage.js +5 -4
- package/dist/layouts/clothing/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/clothing/pages/AboutPage.js +2 -1
- package/dist/layouts/clothing/pages/CategoriesPage.d.ts.map +1 -1
- package/dist/layouts/clothing/pages/CategoriesPage.js +3 -2
- package/dist/layouts/clothing/pages/CategoryPage.d.ts +3 -1
- package/dist/layouts/clothing/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/clothing/pages/CategoryPage.js +4 -3
- package/dist/layouts/clothing/pages/ProductDetailPage.d.ts.map +1 -1
- package/dist/layouts/clothing/pages/ProductDetailPage.js +3 -2
- package/dist/layouts/clothing/pages/ProductsPage.d.ts.map +1 -1
- package/dist/layouts/clothing/pages/ProductsPage.js +53 -60
- package/dist/layouts/clothing-minimal/components/ClothingHomePageMinimal.d.ts.map +1 -1
- package/dist/layouts/clothing-minimal/components/ClothingHomePageMinimal.js +4 -3
- package/dist/layouts/clothing-minimal/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/clothing-minimal/pages/AboutPage.js +2 -1
- package/dist/layouts/clothing-minimal/pages/CategoriesPage.d.ts.map +1 -1
- package/dist/layouts/clothing-minimal/pages/CategoriesPage.js +3 -2
- package/dist/layouts/clothing-minimal/pages/CategoryPage.d.ts +3 -1
- package/dist/layouts/clothing-minimal/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/clothing-minimal/pages/CategoryPage.js +4 -3
- package/dist/layouts/clothing-minimal/pages/ProductDetailPage.d.ts.map +1 -1
- package/dist/layouts/clothing-minimal/pages/ProductDetailPage.js +2 -1
- package/dist/layouts/clothing-minimal/pages/ProductsPage.d.ts.map +1 -1
- package/dist/layouts/clothing-minimal/pages/ProductsPage.js +53 -60
- package/dist/layouts/electronics/components/ElectronicsHomePage.d.ts.map +1 -1
- package/dist/layouts/electronics/components/ElectronicsHomePage.js +2 -1
- package/dist/layouts/electronics/components/ElectronicsProductsPage.d.ts.map +1 -1
- package/dist/layouts/electronics/components/ElectronicsProductsPage.js +45 -36
- package/dist/layouts/electronics/components/ElectronicsStoreFooter.d.ts.map +1 -1
- package/dist/layouts/electronics/components/ElectronicsStoreFooter.js +2 -1
- package/dist/layouts/electronics/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/electronics/pages/AboutPage.js +3 -1
- package/dist/layouts/electronics/pages/CategoryPage.d.ts +3 -1
- package/dist/layouts/electronics/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/electronics/pages/CategoryPage.js +4 -3
- package/dist/layouts/electronics/pages/ProductDetailPage.d.ts.map +1 -1
- package/dist/layouts/electronics/pages/ProductDetailPage.js +2 -1
- package/dist/layouts/electronics/pages/ProductsPage.d.ts.map +1 -1
- package/dist/layouts/electronics/pages/ProductsPage.js +53 -60
- package/dist/layouts/electronics-grid/components/ElectronicsHomePageGrid.d.ts.map +1 -1
- package/dist/layouts/electronics-grid/components/ElectronicsHomePageGrid.js +2 -1
- package/dist/layouts/electronics-grid/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/electronics-grid/pages/AboutPage.js +3 -1
- package/dist/layouts/electronics-grid/pages/CategoryPage.d.ts +3 -1
- package/dist/layouts/electronics-grid/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/electronics-grid/pages/CategoryPage.js +4 -3
- package/dist/layouts/electronics-grid/pages/ProductDetailPage.d.ts.map +1 -1
- package/dist/layouts/electronics-grid/pages/ProductDetailPage.js +2 -1
- package/dist/layouts/electronics-grid/pages/ProductsPage.d.ts.map +1 -1
- package/dist/layouts/electronics-grid/pages/ProductsPage.js +53 -60
- package/dist/layouts/food/components/FoodHomePage.d.ts.map +1 -1
- package/dist/layouts/food/components/FoodHomePage.js +6 -4
- package/dist/layouts/food/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/food/pages/AboutPage.js +2 -1
- package/dist/layouts/food/pages/CategoryPage.d.ts +3 -1
- package/dist/layouts/food/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/food/pages/CategoryPage.js +5 -3
- package/dist/layouts/food/pages/MenuPage.js +1 -1
- package/dist/layouts/food/pages/ProductDetailPage.d.ts.map +1 -1
- package/dist/layouts/food/pages/ProductDetailPage.js +2 -1
- package/dist/layouts/food/pages/ProductsPage.d.ts.map +1 -1
- package/dist/layouts/food/pages/ProductsPage.js +51 -54
- package/dist/layouts/food-modern/components/FoodHomePageModern.d.ts.map +1 -1
- package/dist/layouts/food-modern/components/FoodHomePageModern.js +4 -2
- package/dist/layouts/food-modern/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/food-modern/pages/AboutPage.js +3 -1
- package/dist/layouts/food-modern/pages/CategoryPage.d.ts +3 -1
- package/dist/layouts/food-modern/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/food-modern/pages/CategoryPage.js +5 -3
- package/dist/layouts/food-modern/pages/MenuPage.js +1 -1
- package/dist/layouts/food-modern/pages/ProductDetailPage.d.ts.map +1 -1
- package/dist/layouts/food-modern/pages/ProductDetailPage.js +2 -1
- package/dist/layouts/food-modern/pages/ProductsPage.d.ts.map +1 -1
- package/dist/layouts/food-modern/pages/ProductsPage.js +51 -54
- package/dist/layouts/motivational-speaker/components/MotivationalHomePage.d.ts.map +1 -1
- package/dist/layouts/motivational-speaker/components/MotivationalHomePage.js +4 -2
- package/dist/layouts/motivational-speaker/pages/AboutPage.d.ts.map +1 -1
- package/dist/layouts/motivational-speaker/pages/AboutPage.js +3 -1
- package/dist/layouts/motivational-speaker/pages/CategoryPage.d.ts +3 -1
- package/dist/layouts/motivational-speaker/pages/CategoryPage.d.ts.map +1 -1
- package/dist/layouts/motivational-speaker/pages/CategoryPage.js +6 -4
- package/dist/layouts/motivational-speaker/pages/ProductsPage.d.ts.map +1 -1
- package/dist/layouts/motivational-speaker/pages/ProductsPage.js +53 -60
- package/dist/layouts/motivational-speaker/pages/ServiceDetailPage.d.ts.map +1 -1
- package/dist/layouts/motivational-speaker/pages/ServiceDetailPage.js +2 -1
- package/dist/layouts/motivational-speaker/pages/ServicesPage.d.ts.map +1 -1
- package/dist/layouts/motivational-speaker/pages/ServicesPage.js +4 -2
- package/dist/layouts/motivational-speaker/pages/SubscriptionPage.d.ts.map +1 -1
- package/dist/layouts/motivational-speaker/pages/SubscriptionPage.js +3 -2
- package/dist/layouts/shared/components/StoreFooter.d.ts.map +1 -1
- package/dist/layouts/shared/components/StoreFooter.js +3 -13
- package/dist/layouts/shared/pages/PortfolioPage.d.ts.map +1 -1
- package/dist/layouts/shared/pages/PortfolioPage.js +2 -1
- package/dist/layouts/shared/pages/StoreMaintenanceScreen.d.ts +9 -0
- package/dist/layouts/shared/pages/StoreMaintenanceScreen.d.ts.map +1 -0
- package/dist/layouts/shared/pages/StoreMaintenanceScreen.js +10 -0
- package/dist/layouts/shared/pages/StoreOfflinePage.d.ts +19 -0
- package/dist/layouts/shared/pages/StoreOfflinePage.d.ts.map +1 -0
- package/dist/layouts/shared/pages/StoreOfflinePage.js +113 -0
- package/dist/layouts/shared/pages/WishlistPage.d.ts.map +1 -1
- package/dist/layouts/shared/pages/WishlistPage.js +11 -14
- package/dist/lib/content-selectors.js +3 -3
- package/dist/lib/layout-route-utils.d.ts +1 -0
- package/dist/lib/layout-route-utils.d.ts.map +1 -1
- package/dist/lib/layout-route-utils.js +1 -1
- package/dist/lib/services/product.service.d.ts +1 -0
- package/dist/lib/services/product.service.d.ts.map +1 -1
- package/dist/lib/store-context.d.ts +1 -0
- package/dist/lib/store-context.d.ts.map +1 -1
- package/dist/lib/store-context.js +1 -0
- package/dist/lib/utils/catalog-price-bounds.d.ts +2 -0
- package/dist/lib/utils/catalog-price-bounds.d.ts.map +1 -1
- package/dist/lib/utils/catalog-price-bounds.js +21 -0
- package/dist/lib/utils/filtered-product-query.d.ts +22 -0
- package/dist/lib/utils/filtered-product-query.d.ts.map +1 -0
- package/dist/lib/utils/filtered-product-query.js +57 -0
- package/dist/lib/utils/filtered-products-inflight.d.ts +3 -0
- package/dist/lib/utils/filtered-products-inflight.d.ts.map +1 -0
- package/dist/lib/utils/filtered-products-inflight.js +15 -0
- package/dist/lib/utils/url-helpers.d.ts.map +1 -1
- package/dist/lib/utils/url-helpers.js +2 -11
- package/dist/styles/index.css +33 -6
- package/package.json +2 -2
|
@@ -5,6 +5,8 @@ import { Button } from '../../../components/ui/button.js';
|
|
|
5
5
|
import { DotPattern } from '../../../components/ui/background-patterns.js';
|
|
6
6
|
import { useStore } from '../../../lib/store-context.js';
|
|
7
7
|
import Image from 'next/image';
|
|
8
|
+
import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml.js';
|
|
9
|
+
import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
|
|
8
10
|
export function AboutPage({ storeConfig: initialConfig }) {
|
|
9
11
|
const { store } = useStore();
|
|
10
12
|
const storeConfig = store || initialConfig;
|
|
@@ -39,7 +41,7 @@ export function AboutPage({ storeConfig: initialConfig }) {
|
|
|
39
41
|
description: "Honest, transparent, and ethical practices in everything we do."
|
|
40
42
|
}
|
|
41
43
|
];
|
|
42
|
-
return (_jsxs("div", { className: "min-h-screen bg-white pb-20 overflow-hidden", children: [_jsxs("section", { "data-section": "hero", className: "relative h-[60vh] min-h-[500px] w-full overflow-hidden", children: [_jsxs("div", { className: "absolute inset-0", children: [_jsx(Image, { src: heroImage, alt: "About Us", fill: true, className: "w-full h-full object-cover transform scale-105 animate-pulse-slow" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/80 via-black/50 to-transparent" })] }), _jsx("div", { className: "absolute inset-0 flex items-center", children: _jsx("div", { className: "container mx-auto px-4 sm:px-6 lg:px-8", children: _jsxs("div", { className: "max-w-3xl animate-fade-in-up", children: [_jsxs("div", { className: "inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-white text-sm font-medium mb-6", children: [_jsx("span", { className: "w-2 h-2 rounded-full bg-white animate-pulse" }), "Est. 2024"] }), _jsx("h1", { className: "text-5xl md:text-7xl font-bold text-white mb-6 tracking-tight leading-tight", children: pageTitle }), _jsx("
|
|
44
|
+
return (_jsxs("div", { className: "min-h-screen bg-white pb-20 overflow-hidden", children: [_jsxs("section", { "data-section": "hero", className: "relative h-[60vh] min-h-[500px] w-full overflow-hidden", children: [_jsxs("div", { className: "absolute inset-0", children: [_jsx(Image, { src: heroImage, alt: "About Us", fill: true, className: "w-full h-full object-cover transform scale-105 animate-pulse-slow" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/80 via-black/50 to-transparent" })] }), _jsx("div", { className: "absolute inset-0 flex items-center", children: _jsx("div", { className: "container mx-auto px-4 sm:px-6 lg:px-8", children: _jsxs("div", { className: "max-w-3xl animate-fade-in-up", children: [_jsxs("div", { className: "inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-white text-sm font-medium mb-6", children: [_jsx("span", { className: "w-2 h-2 rounded-full bg-white animate-pulse" }), "Est. 2024"] }), _jsx("h1", { className: "text-5xl md:text-7xl font-bold text-white mb-6 tracking-tight leading-tight", children: pageTitle }), _jsx(SafeRichHtml, { value: missionStatement || storeConfig.description, as: "div", className: "text-xl md:text-2xl text-gray-200 max-w-2xl leading-relaxed font-light [&_p]:mb-0" })] }) }) })] }), _jsxs("section", { "data-section": "story", className: "py-24 px-4 sm:px-6 lg:px-8 relative", children: [_jsx("div", { className: "absolute top-0 right-0 -mt-24 -mr-24 w-96 h-96 bg-gray-50 rounded-full blur-3xl -z-10" }), _jsx("div", { className: "container mx-auto max-w-7xl", children: _jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-16 items-center", children: [_jsxs("div", { className: "relative", children: [galleryImages && galleryImages.length > 0 ? (_jsx("div", { className: "grid grid-cols-2 gap-4", children: galleryImages.slice(0, 4).map((img, i) => (_jsx("div", { className: `relative overflow-hidden rounded-2xl shadow-lg ${i === 0 ? 'col-span-2 aspect-[16/9]' : 'aspect-square'}`, children: _jsx(Image, { src: img.image, alt: img.caption || "Gallery Image", fill: true, className: "w-full h-full object-cover hover:scale-110 transition-transform duration-500" }) }, i))) })) : (_jsxs("div", { className: "relative aspect-[4/5] rounded-[2rem] overflow-hidden shadow-2xl", children: [_jsx(Image, { src: "https://images.unsplash.com/photo-1522202176988-66273c2fd55f?q=80&w=2071&auto=format&fit=crop", alt: "Our Team", fill: true, className: "w-full h-full object-cover" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent opacity-60" }), _jsxs("div", { className: "absolute bottom-8 left-8 text-white", children: [_jsx("p", { className: "font-bold text-lg", children: "The Dream Team" }), _jsx("p", { className: "text-white/80 text-sm", children: "Working together to serve you better" })] })] })), _jsx("div", { className: "absolute -bottom-6 -right-6 w-24 h-24 bg-white rounded-2xl shadow-xl flex items-center justify-center p-4 animate-bounce duration-[3000ms]", children: _jsx(Heart, { className: "w-10 h-10", style: { color: primaryColor, fill: primaryColor } }) })] }), _jsxs("div", { className: "space-y-10", children: [_jsxs("div", { children: [_jsx("span", { className: "text-sm font-bold uppercase tracking-widest mb-3 block", style: { color: primaryColor }, children: "Who We Are" }), _jsx("h2", { className: "text-4xl md:text-5xl font-black text-gray-900 mb-6 tracking-tight", children: "Our Journey" }), _jsxs("div", { className: "prose prose-lg text-gray-600 leading-relaxed space-y-6", children: [pageContent?.split('\n').map((paragraph, idx) => (_jsx("p", { children: paragraph }, idx))), !pageContent && (_jsxs(_Fragment, { children: [_jsxs("p", { children: ["Founded with a bold vision to redefine excellence in the ", _jsx("span", { className: "font-semibold text-gray-900", children: storeConfig.type }), " industry, ", storeConfig.name, " has grown from a small passion project into a beloved brand. We believe in the power of quality, innovation, and community."] }), _jsx("p", { children: "Every day, we strive to bring you the best products, curated with care and delivered with a smile. Our team is dedicated to ensuring that your experience with us is nothing short of exceptional." })] }))] })] }), _jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-8", children: values.map((item, idx) => (_jsxs("div", { className: "flex gap-4 group", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx("div", { className: "w-14 h-14 rounded-2xl flex items-center justify-center transition-colors group-hover:bg-gray-100", style: { backgroundColor: `${primaryColor}10` }, children: _jsx(item.icon, { className: "h-7 w-7 transition-transform group-hover:scale-110", style: { color: primaryColor } }) }) }), _jsxs("div", { children: [_jsx("h4", { className: "font-bold text-gray-900 mb-2 text-lg", children: item.title }), _jsx(RichTextExcerpt, { value: item.description, as: "p", className: "text-gray-600 text-sm leading-relaxed" })] })] }, idx))) })] })] }) })] }), _jsxs("section", { "data-section": "stats", className: "py-20 relative overflow-hidden", children: [_jsx("div", { className: "absolute inset-0 opacity-10", children: _jsx(DotPattern, { color: primaryColor, cx: 2, cy: 2, cr: 2, width: 30, height: 30 }) }), _jsx("div", { className: "absolute inset-0", style: { backgroundColor: `${secondaryColor}15` } }), _jsx("div", { className: "container mx-auto px-4 relative z-10", children: _jsx("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-8 md:gap-12", children: [
|
|
43
45
|
{ label: "Sessions Held", value: "12k+" },
|
|
44
46
|
{ label: "Elite Experts", value: "20+" },
|
|
45
47
|
{ label: "Programs", value: storeConfig.services?.length ? `${storeConfig.services.length}+` : "25+" },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CategoryPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/booking-agenda/pages/CategoryPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAA8B,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"CategoryPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/booking-agenda/pages/CategoryPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAA8B,MAAM,mBAAmB,CAAC;AAgB5E,UAAU,iBAAiB;IACzB,WAAW,EAAE,WAAW,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,YAAY,CAAC,EAAE,WAAW,EAAE,YAAY,EAAE,EAAE,iBAAiB,+BAyI5E"}
|
|
@@ -10,6 +10,8 @@ import { useAnalytics } from '../../../hooks/use-analytics.js';
|
|
|
10
10
|
import { useEffect } from 'react';
|
|
11
11
|
import { formatCurrency, filterActiveServices } from '../../../lib/utils/index.js';
|
|
12
12
|
import Image from 'next/image';
|
|
13
|
+
import { CategoryDescription } from '../../../components/rich-text/CategoryDescription.js';
|
|
14
|
+
import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
|
|
13
15
|
export function CategoryPage({ storeConfig, categorySlug }) {
|
|
14
16
|
const categories = storeConfig.categories || [];
|
|
15
17
|
const category = categories.find(c => c.slug === categorySlug);
|
|
@@ -38,5 +40,5 @@ export function CategoryPage({ storeConfig, categorySlug }) {
|
|
|
38
40
|
const isDarkTheme = storeConfig.type === 'food-modern' || storeConfig.branding.theme === 'dark';
|
|
39
41
|
const bgColor = isDarkTheme ? 'bg-[#0F0F0F]' : 'bg-gray-50';
|
|
40
42
|
const textColor = isDarkTheme ? 'text-white' : 'text-gray-900';
|
|
41
|
-
return (_jsxs("div", { className: "min-h-screen bg-white text-gray-900 transition-colors duration-300", children: [_jsxs("div", { className: "relative h-[40vh] overflow-hidden", children: [_jsx(ImageWithFallback, { src: category.image, alt: category.name, className: "w-full h-full object-cover", skeletonAspectRatio: "16/9" }), _jsx("div", { className: "absolute inset-0 bg-black/40 backdrop-blur-[2px]" }), _jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center text-center p-6 text-white", children: [_jsx("h1", { className: "text-5xl md:text-7xl font-bold tracking-tight mb-4", children: category.name }),
|
|
43
|
+
return (_jsxs("div", { className: "min-h-screen bg-white text-gray-900 transition-colors duration-300", children: [_jsxs("div", { className: "relative h-[40vh] overflow-hidden", children: [_jsx(ImageWithFallback, { src: category.image, alt: category.name, className: "w-full h-full object-cover", skeletonAspectRatio: "16/9" }), _jsx("div", { className: "absolute inset-0 bg-black/40 backdrop-blur-[2px]" }), _jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center text-center p-6 text-white", children: [_jsx("h1", { className: "text-5xl md:text-7xl font-bold tracking-tight mb-4", children: category.name }), _jsx(CategoryDescription, { description: category.description })] })] }), _jsxs("div", { className: "container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-12", children: [_jsxs("div", { className: "flex flex-col md:flex-row justify-between items-center mb-10 gap-4", children: [_jsxs(Link, { href: `/${storeConfig.slug}/categories`, className: "inline-flex items-center text-sm font-medium text-gray-600 hover:text-gray-900", children: [_jsx(ArrowLeft, { className: "h-4 w-4 mr-2" }), "Back to All Categories"] }), _jsx("div", { className: "flex items-center gap-4", children: _jsxs(Button, { variant: "outline", className: "bg-white", children: [_jsx(Filter, { className: "h-4 w-4 mr-2" }), " Filter"] }) })] }), !hasItems ? (_jsxs("div", { className: "text-center py-20 border border-dashed border-gray-300 rounded-3xl", children: [_jsx("p", { className: "text-gray-500 text-lg", children: "No services found in this category." }), _jsx(Button, { className: "mt-4", onClick: () => window.history.back(), children: "Go Back" })] })) : (_jsx("div", { className: "space-y-12", children: _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8", children: services.map((service) => (_jsxs("div", { className: "group flex flex-col h-full bg-white rounded-2xl overflow-hidden border border-gray-100 shadow-sm hover:shadow-xl transition-all duration-500", children: [_jsxs(Link, { href: `/${storeConfig.slug}/book?service=${service.slug}`, className: "block relative aspect-[4/3] overflow-hidden", 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: formatCurrency(service.price, service.currency || storeConfig.settings?.currency || 'USD') })] }), _jsxs("div", { className: "p-6 flex flex-col flex-1", children: [_jsx("h3", { className: "text-xl font-bold text-gray-900 mb-2 group-hover:text-blue-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-sm flex-1" }), _jsxs("div", { className: "flex items-center justify-between pt-4 border-t border-gray-100", children: [_jsx("div", { className: "flex items-center gap-4 text-sm text-gray-500 font-medium", children: _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Clock, { className: "w-4 h-4 text-blue-500" }), service.duration, " mins"] }) }), _jsxs(Link, { href: `/${storeConfig.slug}/book?service=${service.slug}`, className: "inline-flex items-center gap-2 text-sm font-bold text-blue-600 group/btn", children: ["Book Now ", _jsx(ArrowRight, { className: "w-4 h-4 transition-transform group-hover/btn:translate-x-1" })] })] })] })] }, service.id))) }) }))] })] }));
|
|
42
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProductDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/booking-agenda/pages/ProductDetailPage.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAA8C,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"ProductDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/booking-agenda/pages/ProductDetailPage.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAA8C,MAAM,mBAAmB,CAAC;AA6B5F,UAAU,sBAAsB;IAC9B,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;CACrB;AAsHD,wBAAgB,iBAAiB,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,WAAW,EAAE,EAAE,sBAAsB,+BAwiCpG"}
|
|
@@ -18,6 +18,7 @@ import { getGuestUserInfo, saveGuestUserInfo } from '../../../lib/guest-user.js'
|
|
|
18
18
|
import { ProductCard } from '../../../components/ui/product-card.js';
|
|
19
19
|
import Image from 'next/image';
|
|
20
20
|
import { ImageWithFallback } from '../../../components/ui/image-with-fallback.js';
|
|
21
|
+
import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml.js';
|
|
21
22
|
import { ButtonLoader } from '../../../components/ui/page-loader.js';
|
|
22
23
|
import { extractImageUrls } from '../../../lib/store-config-utils.js';
|
|
23
24
|
import { OutOfStockOverlay } from '../../../components/ui/out-of-stock-overlay.js';
|
|
@@ -506,5 +507,5 @@ export function ProductDetailPage({ storeConfig: initialConfig, productSlug }) {
|
|
|
506
507
|
: 'bg-white text-gray-700 border-gray-200 hover:border-gray-300 hover:bg-gray-50'}`, children: variant.value }, variant.id));
|
|
507
508
|
}) })] })), _jsxs("div", { className: "flex flex-col gap-4 mb-8", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("span", { className: "text-sm font-semibold text-gray-900", children: "Quantity" }), _jsxs("div", { className: "flex items-center border border-gray-300 rounded-lg", children: [_jsx("button", { className: "p-3 text-gray-600 hover:bg-gray-100 rounded-l-lg disabled:opacity-50", onClick: () => setQuantity(Math.max(1, quantity - 1)), disabled: quantity <= 1, children: _jsx(Minus, { className: "h-4 w-4" }) }), _jsx("span", { className: "w-12 text-center font-semibold text-gray-900", children: quantity }), _jsx("button", { className: "p-3 text-gray-600 hover:bg-gray-100 rounded-r-lg", onClick: () => setQuantity(quantity + 1), children: _jsx(Plus, { className: "h-4 w-4" }) })] })] }), _jsxs("div", { className: "flex flex-col sm:flex-row gap-3 mt-2", children: [_jsx(Button, { "data-add-to-cart": true, size: "lg", onClick: handleAddToCart, disabled: isCartLoading || isOutOfStock, className: "flex-1 bg-white border-2 border-gray-900 text-gray-900 hover:bg-gray-50 rounded-full h-14 text-base font-bold shadow-sm transition-all disabled:opacity-50 disabled:cursor-not-allowed", children: isCartLoading ? (_jsxs(_Fragment, { children: [_jsx(ButtonLoader, { className: "mr-2" }), "Adding..."] })) : (_jsxs(_Fragment, { children: [_jsx(ShoppingCart, { className: "h-5 w-5 mr-2" }), "Add to Cart"] })) }), _jsx(Button, { size: "lg", onClick: handleBuyNow, disabled: isOutOfStock || isBuyNowLoading || isCartLoading, className: "flex-1 bg-gray-900 hover:bg-gray-800 text-white rounded-full h-14 text-base font-bold shadow-lg hover:shadow-xl transition-all disabled:opacity-50 disabled:cursor-not-allowed", children: isBuyNowLoading || isCartLoading ? (_jsxs(_Fragment, { children: [_jsx(ButtonLoader, { className: "mr-2" }), "Adding..."] })) : ('Buy Now') }), storeConfig.features.wishlist && (_jsx(Button, { variant: "outline", size: "lg", onClick: handleWishlistClick, disabled: isWishlistLoading || !product, className: cn("h-14 w-14 rounded-full border-2 transition-all disabled:opacity-50 disabled:cursor-not-allowed", product && isInWishlist(product.id)
|
|
508
509
|
? "border-red-500 bg-red-50 text-red-500 hover:bg-red-100"
|
|
509
|
-
: "border-gray-200 hover:border-gray-300 hover:bg-gray-50"), children: isWishlistLoading ? (_jsx(ButtonLoader, { className: "h-5 w-5" })) : (_jsx(Heart, { className: cn("h-5 w-5", product && isInWishlist(product.id) && "fill-current") })) }))] })] }), _jsx(ProductDeliveryInfoSection, { storeConfig: storeConfig, currency: storeConfig.settings?.currency || 'USD', productCurrency: product.currency, productPrice: product.price, quantity: quantity, shippingAddress: shippingAddress, updateShippingAddress: (patch) => setShippingAddress((prev) => ({ ...prev, ...patch })), shippingMethods: shippingMethods, isCalculatingShipping: isCalculatingShipping, shippingError: shippingError, freeShippingEligible: freeShippingEligible, freeShippingThreshold: freeShippingThreshold, onToast: addToast }), product.description && (_jsxs("div", { className: "mb-8", children: [_jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: "Description" }), _jsxs("div", { className: "prose prose-sm max-w-none text-gray-600 leading-relaxed", children: [_jsx(
|
|
510
|
+
: "border-gray-200 hover:border-gray-300 hover:bg-gray-50"), children: isWishlistLoading ? (_jsx(ButtonLoader, { className: "h-5 w-5" })) : (_jsx(Heart, { className: cn("h-5 w-5", product && isInWishlist(product.id) && "fill-current") })) }))] })] }), _jsx(ProductDeliveryInfoSection, { storeConfig: storeConfig, currency: storeConfig.settings?.currency || 'USD', productCurrency: product.currency, productPrice: product.price, quantity: quantity, shippingAddress: shippingAddress, updateShippingAddress: (patch) => setShippingAddress((prev) => ({ ...prev, ...patch })), shippingMethods: shippingMethods, isCalculatingShipping: isCalculatingShipping, shippingError: shippingError, freeShippingEligible: freeShippingEligible, freeShippingThreshold: freeShippingThreshold, onToast: addToast }), product.description && (_jsxs("div", { className: "mb-8", children: [_jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: "Description" }), _jsxs("div", { className: "prose prose-sm max-w-none text-gray-600 leading-relaxed", children: [_jsx(SafeRichHtml, { value: product.description, fallbackPlain: "", as: "div" }), _jsxs("ul", { className: "list-disc pl-5 space-y-1 mt-2", children: [_jsx("li", { children: "Premium quality material" }), _jsx("li", { children: "Comfortable fit for all-day wear" }), _jsx("li", { children: "Durable stitching and finish" })] })] })] })), product.specifications && Object.keys(product.specifications).length > 0 && (_jsxs("div", { className: "mb-8", children: [_jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-4", children: "Specifications" }), _jsx("dl", { className: "grid grid-cols-1 sm:grid-cols-2 gap-x-4 gap-y-4", children: Object.entries(product.specifications).map(([key, value]) => (_jsxs("div", { className: "flex flex-col p-3 bg-gray-50 rounded-lg", children: [_jsx("dt", { className: "text-xs text-gray-500 font-medium uppercase tracking-wider mb-1", children: key }), _jsx("dd", { className: "text-sm font-bold text-gray-900", children: value })] }, key))) })] }))] })] }), _jsx("div", { className: "mt-20 pt-16 border-t border-gray-200", children: _jsxs("div", { className: "max-w-4xl", children: [_jsxs("div", { className: "flex flex-col sm:flex-row items-start sm:items-center justify-between gap-6 mb-10", children: [_jsxs("div", { className: "flex-1", children: [_jsx("h2", { className: "text-2xl lg:text-3xl font-bold text-gray-900 mb-4", children: "Customer Reviews" }), product.reviewCount && product.reviewCount > 0 && product.rating && product.rating > 0 ? (_jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(StarRating, { rating: typeof product.rating === 'number' ? product.rating : Number(product.rating) || 0, size: "lg" }), _jsx("span", { className: "text-2xl font-bold text-gray-900", children: Number(product.rating).toFixed(1) }), _jsx("span", { className: "text-lg text-gray-500", children: "out of 5" })] }), _jsx("span", { className: "text-gray-300", children: "|" }), _jsxs("span", { className: "text-lg text-gray-600", children: [product.reviewCount, " ", product.reviewCount === 1 ? 'review' : 'reviews'] })] })) : (_jsx("div", { className: "text-gray-500", children: _jsx("p", { className: "text-base", children: "Be the first to review this product" }) }))] }), _jsx(Button, { onClick: () => setIsReviewModalOpen(true), className: "rounded-full shrink-0 bg-gray-900 hover:bg-gray-800 text-white", children: product.reviewCount && product.reviewCount > 0 ? 'Write a Review' : 'Be the First to Review' })] }), ratingDistribution.some(r => r.count > 0) && (_jsxs("div", { className: "mb-10 p-6 bg-gray-50 rounded-xl border border-gray-100", children: [_jsx("h3", { className: "text-sm font-semibold text-gray-900 mb-5", children: "Rating Breakdown" }), _jsx("div", { className: "space-y-3", children: ratingDistribution.map(({ rating, count, percentage }) => (_jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "flex items-center gap-1.5 w-20", children: [_jsx("span", { className: "text-sm font-semibold text-gray-900", children: rating }), _jsx(Star, { className: "h-4 w-4 fill-gray-900 text-gray-900" })] }), _jsx("div", { className: "flex-1 h-2.5 bg-gray-200 rounded-full overflow-hidden", children: _jsx("div", { className: "h-full bg-gradient-to-r from-gray-700 to-gray-900 rounded-full transition-all duration-500", style: { width: `${percentage}%` } }) }), _jsx("span", { className: "text-sm font-medium text-gray-700 w-12 text-right", children: count })] }, rating))) })] })), reviews.length > 0 ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "space-y-6", children: displayedReviews.map((review) => (_jsx(ReviewCard, { review: review }, review.id))) }), hasMoreReviews && !showAllReviews && (_jsx("div", { className: "mt-8 text-center", children: _jsxs(Button, { variant: "outline", onClick: () => setShowAllReviews(true), className: "px-8 rounded-full h-12 border-gray-300", children: ["Show All ", reviews.length, " Reviews"] }) }))] })) : (_jsxs("div", { className: "text-center py-12 bg-gray-50 rounded-xl border border-dashed border-gray-300", children: [_jsx("div", { className: "inline-flex items-center justify-center w-12 h-12 rounded-full bg-white shadow-sm mb-4", children: _jsx(Star, { className: "h-6 w-6 text-gray-400" }) }), _jsx("h3", { className: "text-lg font-semibold text-gray-900 mb-2", children: "No Reviews Yet" }), _jsx("p", { className: "text-gray-500 max-w-sm mx-auto mb-6", children: "Be the first to review this product and help other customers make informed decisions." }), _jsx(Button, { onClick: () => setIsReviewModalOpen(true), className: "bg-gray-900 hover:bg-gray-800 text-white", children: "Write the First Review" })] }))] }) }), relatedProducts.length > 0 && (_jsxs("div", { className: "mt-20 pt-16 border-t border-gray-200", children: [_jsx("h2", { className: "text-2xl lg:text-3xl font-bold 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: relatedProducts.map((relatedProduct) => (_jsx("div", { className: "h-[400px]", children: _jsx(ProductCard, { product: relatedProduct, storeSlug: storeConfig.slug, onAddToCart: (p) => addToCart(p, 1), onQuickView: handleQuickView, className: "h-full" }) }, relatedProduct.id))) })] }))] }), _jsx(Modal, { isOpen: isReviewModalOpen, onClose: () => setIsReviewModalOpen(false), title: "Write a Review", children: _jsxs("form", { onSubmit: handleSubmitReview, className: "space-y-4", children: [_jsxs("div", { children: [_jsx("label", { className: "block text-sm font-medium text-gray-700 mb-2", children: "Rating" }), _jsxs("div", { className: "flex items-center gap-1", children: [[1, 2, 3, 4, 5].map((star) => (_jsxs("div", { className: "relative group", children: [_jsx("button", { type: "button", onClick: () => setNewReview({ ...newReview, rating: star - 0.5 }), className: "absolute top-0 left-0 w-1/2 h-full z-20 focus:outline-none", title: `${star - 0.5} stars` }), _jsx("button", { type: "button", onClick: () => setNewReview({ ...newReview, rating: star }), className: "absolute top-0 right-0 w-1/2 h-full z-20 focus:outline-none", title: `${star} stars` }), _jsxs("div", { className: "relative pointer-events-none transition-transform group-hover:scale-110", children: [_jsx(Star, { className: "h-8 w-8 text-gray-200 fill-gray-200" }), newReview.rating >= star - 0.5 && (_jsx("div", { className: "absolute inset-0 overflow-hidden", style: { width: newReview.rating === star - 0.5 ? '50%' : '100%' }, children: _jsx(Star, { className: "h-8 w-8 text-gray-900 fill-gray-900" }) }))] })] }, star))), _jsx("span", { className: "ml-3 text-lg font-medium text-gray-900 w-12", children: newReview.rating })] })] }), _jsxs("div", { children: [_jsx("label", { htmlFor: "title", className: "block text-sm font-medium text-gray-700 mb-1", children: "Review Title" }), _jsx("input", { type: "text", id: "title", required: true, className: "w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-black", placeholder: "Summarize your thoughts", value: newReview.title, onChange: (e) => setNewReview({ ...newReview, title: e.target.value }) })] }), _jsxs("div", { children: [_jsx("label", { htmlFor: "comment", className: "block text-sm font-medium text-gray-700 mb-1", children: "Review" }), _jsx("textarea", { id: "comment", required: true, rows: 4, className: "w-full rounded-md border border-gray-300 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-black", placeholder: "What did you like or dislike?", value: newReview.comment, onChange: (e) => setNewReview({ ...newReview, comment: e.target.value }) })] }), _jsxs("div", { className: "pt-4 flex justify-end gap-3", children: [_jsx(Button, { type: "button", variant: "outline", onClick: () => setIsReviewModalOpen(false), children: "Cancel" }), _jsx(Button, { type: "submit", className: "bg-black text-white hover:bg-gray-800", children: "Submit Review" })] })] }) }), _jsx(GuestCheckoutModal, { isOpen: showGuestModal, onClose: () => setShowGuestModal(false), onSubmit: handleGuestInfoSubmit, initialData: getGuestUserInfo() || undefined })] }));
|
|
510
511
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ServicesPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/booking-agenda/pages/ServicesPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"ServicesPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/booking-agenda/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"}
|
|
@@ -3,6 +3,8 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
3
3
|
import { Button } from '../../../components/ui/button.js';
|
|
4
4
|
import { Clock, ArrowRight, Filter } from 'lucide-react';
|
|
5
5
|
import Link from 'next/link';
|
|
6
|
+
import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
|
|
7
|
+
import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml.js';
|
|
6
8
|
import { useState } from 'react';
|
|
7
9
|
import { cn, formatCurrency, filterActiveServices } from '../../../lib/utils/index.js';
|
|
8
10
|
import Image from 'next/image';
|
|
@@ -25,7 +27,7 @@ export function ServicesPage({ storeConfig, initialCategory, titleOverride }) {
|
|
|
25
27
|
return `/${storeConfig.slug}/book?service=${slug}`;
|
|
26
28
|
};
|
|
27
29
|
const pageTitle = titleOverride || servicesConfig?.title || (_jsxs(_Fragment, { children: ["Signature ", _jsx("span", { className: "font-bold font-sans", style: { color: primaryColor }, children: serviceLabel })] }));
|
|
28
|
-
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-1512496015851-a90fb38ba796?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(
|
|
30
|
+
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-1512496015851-a90fb38ba796?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
|
|
29
31
|
? "text-white shadow-lg scale-105 border-transparent"
|
|
30
|
-
: "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: "Book Now" }) })] }), _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",
|
|
32
|
+
: "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: "Book Now" }) })] }), _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: ["Book ", _jsx(ArrowRight, { className: "w-4 h-4 transition-transform group-hover/link:translate-x-1" })] })] })] })] }, service.id))) }) })] }));
|
|
31
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ClothingHomePage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/components/ClothingHomePage.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"ClothingHomePage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/components/ClothingHomePage.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAiBvD,UAAU,qBAAqB;IAC7B,WAAW,EAAE,WAAW,CAAC;CAC1B;AAaD,wBAAgB,gBAAgB,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,EAAE,qBAAqB,+BAyvBrF"}
|
|
@@ -14,6 +14,7 @@ import { shouldUseAPI } from '../../../lib/utils/demo-detection';
|
|
|
14
14
|
import { useStore } from '../../../lib/store-context';
|
|
15
15
|
import { DynamicIcon } from '../../../components/ui/dynamic-icon';
|
|
16
16
|
import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml';
|
|
17
|
+
import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt';
|
|
17
18
|
export function ClothingHomePage({ storeConfig: initialConfig }) {
|
|
18
19
|
// Use the store from context which is updated in real-time by the editor
|
|
19
20
|
const { store } = useStore();
|
|
@@ -227,20 +228,20 @@ export function ClothingHomePage({ storeConfig: initialConfig }) {
|
|
|
227
228
|
};
|
|
228
229
|
return (_jsxs("div", { className: "min-h-screen bg-white", children: [(layoutConfig?.sections?.hero?.show !== false || layoutConfig?.hero?.show !== false) && heroSlides.length > 0 && (_jsxs("section", { "data-section": "hero", className: "relative h-[85vh] w-full overflow-hidden", onMouseEnter: () => setIsAutoPlaying(false), onMouseLeave: () => layoutConfig?.hero?.autoPlay !== false && setIsAutoPlaying(true), children: [_jsx("div", { className: "relative h-full w-full", children: heroSlides.map((slide, index) => (_jsxs("div", { className: `absolute inset-0 transition-opacity duration-1000 ease-in-out ${index === currentSlide ? 'opacity-100 z-10' : 'opacity-0 z-0'}`, children: [_jsxs("div", { className: "absolute inset-0", children: [_jsx(ImageWithFallback, { src: slide.image, alt: slide.title, className: "absolute inset-0 h-full w-full object-cover", skeletonAspectRatio: "16/9", priority: index === currentSlide }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/50 via-black/20 to-transparent" })] }), _jsx("div", { className: "absolute inset-0 flex items-center z-20", children: _jsx("div", { className: "container mx-auto px-4 sm:px-6 lg:px-8", children: _jsxs("div", { className: `max-w-3xl text-white space-y-8 transition-all duration-1000 ${index === currentSlide
|
|
229
230
|
? 'opacity-100 translate-y-0'
|
|
230
|
-
: 'opacity-0 translate-y-8'}`, children: [_jsxs("div", { children: [slide.badge && (_jsx("span",
|
|
231
|
+
: 'opacity-0 translate-y-8'}`, children: [_jsxs("div", { children: [slide.badge && (_jsx(SafeRichHtml, { as: "span", className: "inline-block px-4 py-1.5 bg-white/20 backdrop-blur-md rounded-full text-sm font-medium border border-white/30 uppercase tracking-wider mb-4 [&_p]:m-0", value: slide.badge, fallbackPlain: "" })), _jsx("h1", { className: "text-4xl sm:text-6xl lg:text-7xl font-bold leading-tight tracking-tight mb-4", children: _jsx(SafeRichHtml, { value: slide.title, fallbackPlain: storeConfig.name }) }), _jsx("div", { className: "h-1 w-24 bg-white/80 rounded-full" })] }), _jsx("div", { className: "text-xl sm:text-2xl text-gray-100 font-light leading-relaxed max-w-lg [&_p]:mb-3 [&_p:last-child]:mb-0", children: _jsx(SafeRichHtml, { value: slide.description, fallbackPlain: "" }) }), _jsxs("div", { className: "flex flex-wrap gap-4 pt-4", children: [layoutConfig?.sections?.hero?.showCTA !== false &&
|
|
231
232
|
layoutConfig?.hero?.showCTA !== false &&
|
|
232
233
|
slide.primaryButtonText &&
|
|
233
|
-
slide.primaryButtonText.trim() !== '' && (_jsx(Link, { href: slide.primaryButtonLink, children: _jsx(Button, { size: "lg", className: "h-14 px-10 text-base rounded-full bg-white text-black hover:bg-gray-100 transition-all duration-300 hover:scale-105 font-semibold", children: slide.primaryButtonText }) })), (layoutConfig?.sections?.hero?.showSecondaryCTA !== false || layoutConfig?.hero?.showSecondaryCTA !== false) &&
|
|
234
|
+
slide.primaryButtonText.trim() !== '' && (_jsx(Link, { href: slide.primaryButtonLink, children: _jsx(Button, { size: "lg", className: "h-14 px-10 text-base rounded-full bg-white text-black hover:bg-gray-100 transition-all duration-300 hover:scale-105 font-semibold", children: _jsx(SafeRichHtml, { value: slide.primaryButtonText, fallbackPlain: "", className: "[&_p]:m-0" }) }) })), (layoutConfig?.sections?.hero?.showSecondaryCTA !== false || layoutConfig?.hero?.showSecondaryCTA !== false) &&
|
|
234
235
|
slide.secondaryButtonText &&
|
|
235
236
|
slide.secondaryButtonText.trim() !== '' &&
|
|
236
|
-
slide.secondaryButtonLink && (_jsx(Link, { href: slide.secondaryButtonLink, children: _jsx(Button, { size: "lg", variant: "outline", className: "h-14 px-10 text-base rounded-full border-white bg-transparent text-white hover:bg-white/20 hover:text-white backdrop-blur-sm transition-all duration-300", style: { color: 'white' }, children: slide.secondaryButtonText }) }))] })] }) }) })] }, index))) }), _jsx("button", { onClick: prevSlide, className: "absolute left-4 top-1/2 -translate-y-1/2 z-30 bg-white/10 hover:bg-white/20 backdrop-blur-md rounded-full p-3 transition-all duration-300 hover:scale-110 group", "aria-label": "Previous slide", children: _jsx(ChevronLeft, { className: "h-6 w-6 text-white group-hover:text-white" }) }), _jsx("button", { onClick: nextSlide, className: "absolute right-4 top-1/2 -translate-y-1/2 z-30 bg-white/10 hover:bg-white/20 backdrop-blur-md rounded-full p-3 transition-all duration-300 hover:scale-110 group", "aria-label": "Next slide", children: _jsx(ChevronRight, { className: "h-6 w-6 text-white group-hover:text-white" }) }), _jsx("div", { className: "absolute bottom-8 left-1/2 -translate-x-1/2 z-30 flex gap-2", children: heroSlides.map((_, index) => (_jsx("button", { onClick: () => goToSlide(index), className: `transition-all duration-300 rounded-full ${index === currentSlide
|
|
237
|
+
slide.secondaryButtonLink && (_jsx(Link, { href: slide.secondaryButtonLink, children: _jsx(Button, { size: "lg", variant: "outline", className: "h-14 px-10 text-base rounded-full border-white bg-transparent text-white hover:bg-white/20 hover:text-white backdrop-blur-sm transition-all duration-300", style: { color: 'white' }, children: _jsx(SafeRichHtml, { value: slide.secondaryButtonText, fallbackPlain: "", className: "[&_p]:m-0" }) }) }))] })] }) }) })] }, index))) }), _jsx("button", { onClick: prevSlide, className: "absolute left-4 top-1/2 -translate-y-1/2 z-30 bg-white/10 hover:bg-white/20 backdrop-blur-md rounded-full p-3 transition-all duration-300 hover:scale-110 group", "aria-label": "Previous slide", children: _jsx(ChevronLeft, { className: "h-6 w-6 text-white group-hover:text-white" }) }), _jsx("button", { onClick: nextSlide, className: "absolute right-4 top-1/2 -translate-y-1/2 z-30 bg-white/10 hover:bg-white/20 backdrop-blur-md rounded-full p-3 transition-all duration-300 hover:scale-110 group", "aria-label": "Next slide", children: _jsx(ChevronRight, { className: "h-6 w-6 text-white group-hover:text-white" }) }), _jsx("div", { className: "absolute bottom-8 left-1/2 -translate-x-1/2 z-30 flex gap-2", children: heroSlides.map((_, index) => (_jsx("button", { onClick: () => goToSlide(index), className: `transition-all duration-300 rounded-full ${index === currentSlide
|
|
237
238
|
? 'w-12 h-2 bg-white'
|
|
238
239
|
: 'w-2 h-2 bg-white/50 hover:bg-white/75'}`, "aria-label": `Go to slide ${index + 1}` }, index))) })] })), layoutConfig?.sections?.features?.show !== false && (_jsx("section", { "data-section": "about", className: "py-8 bg-gray-50 border-b border-gray-100", children: _jsx("div", { className: "container mx-auto px-4 sm:px-6 lg:px-8", children: _jsx("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8 text-center divide-y md:divide-y-0 md:divide-x divide-gray-200", children: (layoutConfig?.sections?.features?.items || [
|
|
239
240
|
{ icon: 'Truck', title: 'Free Shipping', description: `On all orders over $${storeConfig.settings.freeShippingThreshold}` },
|
|
240
241
|
{ icon: 'RefreshCw', title: 'Free Returns', description: '30-day money back guarantee' },
|
|
241
242
|
{ icon: 'ShieldCheck', title: 'Secure Payment', description: '100% secure checkout process' }
|
|
242
243
|
]).filter(Boolean).map((item, idx) => {
|
|
243
|
-
return (_jsxs("div", { className: "flex flex-col items-center justify-center gap-2 p-4", children: [_jsx(DynamicIcon, { name: item.icon, className: "h-6 w-6 text-gray-900" }), _jsx("h3", { className: "font-semibold text-gray-900", children: item.title }), _jsx("p",
|
|
244
|
+
return (_jsxs("div", { className: "flex flex-col items-center justify-center gap-2 p-4", children: [_jsx(DynamicIcon, { name: item.icon, className: "h-6 w-6 text-gray-900" }), _jsx("h3", { className: "font-semibold text-gray-900", children: item.title }), _jsx(RichTextExcerpt, { value: item.description, as: "p", className: "text-sm text-gray-500" })] }, idx));
|
|
244
245
|
}) }) }) })), layoutConfig?.sections?.categories?.show !== false && (_jsx("section", { "data-section": "categories", className: "py-12 md:py-20 px-4 sm:px-6 lg:px-8", children: _jsxs("div", { className: "container mx-auto max-w-7xl", children: [_jsxs("div", { className: "flex flex-col md:flex-row justify-between items-end mb-8 md:mb-12 gap-4", children: [_jsxs("div", { children: [_jsx("h2", { className: "text-3xl md:text-4xl font-bold mb-3 tracking-tight", children: getLayoutText(storeConfig, 'sections.categories.title', 'Shop by Category') }), _jsx("p", { className: "text-gray-500 text-lg", children: getLayoutText(storeConfig, 'sections.categories.subtitle', 'Curated collections for every style') })] }), layoutConfig?.sections?.categories?.showViewAll !== false && (_jsxs(Link, { href: `/${storeConfig.slug}/categories`, className: "group flex items-center gap-2 text-sm font-medium hover:text-gray-600 transition-colors pb-1 border-b border-transparent hover:border-gray-300", children: [getLayoutText(storeConfig, 'sections.categories.viewAll', 'View All Categories'), " ", _jsx(ArrowRight, { className: "h-4 w-4 transition-transform group-hover:translate-x-1" })] }))] }), _jsx("div", { className: `grid ${getCategoryGridClass()} gap-6`, children: displayedCategories.map((category) => {
|
|
245
246
|
// Validate category image - handle all formats
|
|
246
247
|
const extractCategoryImage = (image) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AboutPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/AboutPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"AboutPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/AboutPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAUvD,UAAU,cAAc;IACtB,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAgB,SAAS,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,EAAE,cAAc,+BAqPvE"}
|
|
@@ -6,6 +6,7 @@ import { DotPattern } from '../../../components/ui/background-patterns';
|
|
|
6
6
|
import { useStore } from '../../../lib/store-context';
|
|
7
7
|
import { DynamicIcon } from '../../../components/ui/dynamic-icon';
|
|
8
8
|
import Image from 'next/image';
|
|
9
|
+
import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
|
|
9
10
|
export function AboutPage({ storeConfig: initialConfig }) {
|
|
10
11
|
const { store } = useStore();
|
|
11
12
|
const storeConfig = store || initialConfig;
|
|
@@ -32,7 +33,7 @@ export function AboutPage({ storeConfig: initialConfig }) {
|
|
|
32
33
|
{ icon: 'Heart', title: "Ethical Fashion", description: "We believe in fair trade and ethical manufacturing processes." },
|
|
33
34
|
{ icon: 'Leaf', title: "Sustainable Style", description: "Eco-friendly collections that look good and do good for the planet." }
|
|
34
35
|
]).filter(Boolean);
|
|
35
|
-
return (_jsxs("div", { className: "min-h-screen bg-white pb-20 overflow-hidden", children: [heroConfig?.show !== false && (_jsxs("section", { "data-section": "hero", className: "relative h-[60vh] min-h-[500px] w-full overflow-hidden", children: [_jsxs("div", { className: "absolute inset-0", children: [_jsx(Image, { src: heroImage, alt: "About Us", fill: true, className: "w-full h-full object-cover transform scale-105 animate-pulse-slow" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/80 via-black/50 to-transparent" })] }), _jsx("div", { className: "absolute inset-0 flex items-center", children: _jsx("div", { className: "container mx-auto px-4 sm:px-6 lg:px-8", children: _jsxs("div", { className: "max-w-3xl animate-fade-in-up", children: [_jsxs("div", { className: "inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-white text-sm font-medium mb-6", children: [_jsx("span", { className: "w-2 h-2 rounded-full bg-white animate-pulse" }), "Est. 2024"] }), _jsx("h1", { className: "text-5xl md:text-7xl font-bold text-white mb-6 tracking-tight leading-tight", children: pageTitle }), _jsx("p", { className: "text-xl md:text-2xl text-gray-200 max-w-2xl leading-relaxed font-light", children: missionStatement })] }) }) })] })), storyConfig?.show !== false && (_jsxs("section", { "data-section": "story", className: "py-24 px-4 sm:px-6 lg:px-8 relative", children: [_jsx("div", { className: "absolute top-0 right-0 -mt-24 -mr-24 w-96 h-96 bg-gray-50 rounded-full blur-3xl -z-10" }), _jsx("div", { className: "container mx-auto max-w-7xl", children: _jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-16 items-center", children: [_jsxs("div", { className: "relative", children: [gallerySection && gallerySection.length > 0 ? (_jsx("div", { className: "grid grid-cols-2 gap-4", children: gallerySection.slice(0, 4).map((img, i) => (_jsx("div", { className: `relative overflow-hidden rounded-2xl shadow-lg ${i === 0 ? 'col-span-2 aspect-[16/9]' : 'aspect-square'}`, children: _jsx(Image, { src: img.image, alt: img.caption || "Gallery Image", fill: true, className: "w-full h-full object-cover hover:scale-110 transition-transform duration-500" }) }, i))) })) : (_jsxs("div", { className: "relative aspect-[4/5] rounded-[2rem] overflow-hidden shadow-2xl", children: [_jsx(Image, { src: "https://images.unsplash.com/photo-1522202176988-66273c2fd55f?q=80&w=2071&auto=format&fit=crop", alt: "Our Team", fill: true, className: "w-full h-full object-cover" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent opacity-60" }), _jsxs("div", { className: "absolute bottom-8 left-8 text-white", children: [_jsx("p", { className: "font-bold text-lg", children: "The Dream Team" }), _jsx("p", { className: "text-white/80 text-sm", children: "Working together to serve you better" })] })] })), _jsx("div", { className: "absolute -bottom-6 -right-6 w-24 h-24 bg-white rounded-2xl shadow-xl flex items-center justify-center p-4 animate-bounce duration-[3000ms]", children: _jsx(Heart, { className: "w-10 h-10", style: { color: primaryColor, fill: primaryColor } }) })] }), _jsxs("div", { className: "space-y-10", children: [_jsxs("div", { children: [_jsx("span", { className: "text-sm font-bold uppercase tracking-widest mb-3 block", style: { color: primaryColor }, children: "Who We Are" }), _jsx("h2", { className: "text-4xl md:text-5xl font-black text-gray-900 mb-6 tracking-tight", children: "Our Journey" }), _jsxs("div", { className: "prose prose-lg text-gray-600 leading-relaxed space-y-6", children: [pageContent?.split('\n').map((paragraph, idx) => (_jsx("p", { children: paragraph }, idx))), !pageContent && (_jsxs(_Fragment, { children: [_jsxs("p", { children: ["Founded with a bold vision to redefine excellence in the ", _jsx("span", { className: "font-semibold text-gray-900", children: storeConfig.type }), " industry, ", storeConfig.name, " has grown from a small passion project into a beloved brand. We believe in the power of quality, innovation, and community."] }), _jsx("p", { children: "Every day, we strive to bring you the best products, curated with care and delivered with a smile. Our team is dedicated to ensuring that your experience with us is nothing short of exceptional." })] }))] })] }), valuesConfig?.show !== false && valuesItems.length > 0 && (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-8", children: valuesItems.map((item, idx) => (_jsxs("div", { className: "flex gap-4 group", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx("div", { className: "w-14 h-14 rounded-2xl flex items-center justify-center transition-colors group-hover:bg-gray-100", style: { backgroundColor: `${primaryColor}10` }, children: _jsx(DynamicIcon, { name: item.icon, className: "h-7 w-7 transition-transform group-hover:scale-110", style: { color: primaryColor } }) }) }), _jsxs("div", { children: [_jsx("h4", { className: "font-bold text-gray-900 mb-2 text-lg", children: item.title }), _jsx("p",
|
|
36
|
+
return (_jsxs("div", { className: "min-h-screen bg-white pb-20 overflow-hidden", children: [heroConfig?.show !== false && (_jsxs("section", { "data-section": "hero", className: "relative h-[60vh] min-h-[500px] w-full overflow-hidden", children: [_jsxs("div", { className: "absolute inset-0", children: [_jsx(Image, { src: heroImage, alt: "About Us", fill: true, className: "w-full h-full object-cover transform scale-105 animate-pulse-slow" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/80 via-black/50 to-transparent" })] }), _jsx("div", { className: "absolute inset-0 flex items-center", children: _jsx("div", { className: "container mx-auto px-4 sm:px-6 lg:px-8", children: _jsxs("div", { className: "max-w-3xl animate-fade-in-up", children: [_jsxs("div", { className: "inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-white/10 backdrop-blur-md border border-white/20 text-white text-sm font-medium mb-6", children: [_jsx("span", { className: "w-2 h-2 rounded-full bg-white animate-pulse" }), "Est. 2024"] }), _jsx("h1", { className: "text-5xl md:text-7xl font-bold text-white mb-6 tracking-tight leading-tight", children: pageTitle }), _jsx("p", { className: "text-xl md:text-2xl text-gray-200 max-w-2xl leading-relaxed font-light", children: missionStatement })] }) }) })] })), storyConfig?.show !== false && (_jsxs("section", { "data-section": "story", className: "py-24 px-4 sm:px-6 lg:px-8 relative", children: [_jsx("div", { className: "absolute top-0 right-0 -mt-24 -mr-24 w-96 h-96 bg-gray-50 rounded-full blur-3xl -z-10" }), _jsx("div", { className: "container mx-auto max-w-7xl", children: _jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-16 items-center", children: [_jsxs("div", { className: "relative", children: [gallerySection && gallerySection.length > 0 ? (_jsx("div", { className: "grid grid-cols-2 gap-4", children: gallerySection.slice(0, 4).map((img, i) => (_jsx("div", { className: `relative overflow-hidden rounded-2xl shadow-lg ${i === 0 ? 'col-span-2 aspect-[16/9]' : 'aspect-square'}`, children: _jsx(Image, { src: img.image, alt: img.caption || "Gallery Image", fill: true, className: "w-full h-full object-cover hover:scale-110 transition-transform duration-500" }) }, i))) })) : (_jsxs("div", { className: "relative aspect-[4/5] rounded-[2rem] overflow-hidden shadow-2xl", children: [_jsx(Image, { src: "https://images.unsplash.com/photo-1522202176988-66273c2fd55f?q=80&w=2071&auto=format&fit=crop", alt: "Our Team", fill: true, className: "w-full h-full object-cover" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent opacity-60" }), _jsxs("div", { className: "absolute bottom-8 left-8 text-white", children: [_jsx("p", { className: "font-bold text-lg", children: "The Dream Team" }), _jsx("p", { className: "text-white/80 text-sm", children: "Working together to serve you better" })] })] })), _jsx("div", { className: "absolute -bottom-6 -right-6 w-24 h-24 bg-white rounded-2xl shadow-xl flex items-center justify-center p-4 animate-bounce duration-[3000ms]", children: _jsx(Heart, { className: "w-10 h-10", style: { color: primaryColor, fill: primaryColor } }) })] }), _jsxs("div", { className: "space-y-10", children: [_jsxs("div", { children: [_jsx("span", { className: "text-sm font-bold uppercase tracking-widest mb-3 block", style: { color: primaryColor }, children: "Who We Are" }), _jsx("h2", { className: "text-4xl md:text-5xl font-black text-gray-900 mb-6 tracking-tight", children: "Our Journey" }), _jsxs("div", { className: "prose prose-lg text-gray-600 leading-relaxed space-y-6", children: [pageContent?.split('\n').map((paragraph, idx) => (_jsx("p", { children: paragraph }, idx))), !pageContent && (_jsxs(_Fragment, { children: [_jsxs("p", { children: ["Founded with a bold vision to redefine excellence in the ", _jsx("span", { className: "font-semibold text-gray-900", children: storeConfig.type }), " industry, ", storeConfig.name, " has grown from a small passion project into a beloved brand. We believe in the power of quality, innovation, and community."] }), _jsx("p", { children: "Every day, we strive to bring you the best products, curated with care and delivered with a smile. Our team is dedicated to ensuring that your experience with us is nothing short of exceptional." })] }))] })] }), valuesConfig?.show !== false && valuesItems.length > 0 && (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-8", children: valuesItems.map((item, idx) => (_jsxs("div", { className: "flex gap-4 group", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx("div", { className: "w-14 h-14 rounded-2xl flex items-center justify-center transition-colors group-hover:bg-gray-100", style: { backgroundColor: `${primaryColor}10` }, children: _jsx(DynamicIcon, { name: item.icon, className: "h-7 w-7 transition-transform group-hover:scale-110", style: { color: primaryColor } }) }) }), _jsxs("div", { children: [_jsx("h4", { className: "font-bold text-gray-900 mb-2 text-lg", children: item.title }), _jsx(RichTextExcerpt, { value: item.description, as: "p", className: "text-gray-600 text-sm leading-relaxed" })] })] }, idx))) }))] })] }) })] })), statsConfig?.show !== false && (_jsxs("section", { "data-section": "stats", className: "py-20 relative overflow-hidden", children: [_jsx("div", { className: "absolute inset-0 opacity-10", children: _jsx(DotPattern, { color: primaryColor, cx: 2, cy: 2, cr: 2, width: 30, height: 30 }) }), _jsx("div", { className: "absolute inset-0", style: { backgroundColor: `${secondaryColor}15` } }), _jsx("div", { className: "container mx-auto px-4 relative z-10", children: _jsx("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-8 md:gap-12", children: [
|
|
36
37
|
{ label: "Style Lovers", value: "20k+" },
|
|
37
38
|
{ label: "New Arrivals", value: storeConfig.products?.length ? `${storeConfig.products.length * 5}+` : "100+" },
|
|
38
39
|
{ label: "Global Shipping", value: "50+" },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CategoriesPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/CategoriesPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"CategoriesPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/CategoriesPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAWvD,UAAU,mBAAmB;IAC3B,WAAW,EAAE,WAAW,CAAC;CAC1B;AAED,wBAAgB,sBAAsB,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,EAAE,mBAAmB,+BA4GzF"}
|
|
@@ -8,6 +8,7 @@ import { getPayazaSectionInlineStyle } from '../../../lib/payaza-section-styles'
|
|
|
8
8
|
import { isEditorPreviewMode, resolveStoreCategoriesForDisplay } from '../../../lib/utils';
|
|
9
9
|
import { useClothingPayaza } from '../payaza-bindings';
|
|
10
10
|
import { CategoryMasonryGrid } from '../../../components/categories/category-masonry-grid';
|
|
11
|
+
import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml';
|
|
11
12
|
export function ClothingCategoriesPage({ storeConfig: initialConfig }) {
|
|
12
13
|
const { store } = useStore();
|
|
13
14
|
const storeConfig = store || initialConfig;
|
|
@@ -29,6 +30,6 @@ export function ClothingCategoriesPage({ storeConfig: initialConfig }) {
|
|
|
29
30
|
{ label: storeConfig.name, href: `/${storeConfig.slug}` },
|
|
30
31
|
{ label: 'Categories', href: `/${storeConfig.slug}/categories` },
|
|
31
32
|
];
|
|
32
|
-
return (_jsxs("div", { "data-content-ready": true, className: "min-h-screen bg-white text-slate-900 font-sans", children: [categoriesHeaderConfig?.show !== false && (_jsxs("div", { ...section('categoriesHeader'), style: getPayazaSectionInlineStyle(storeConfig, 'categories', 'categoriesHeader'), className: `relative overflow-hidden border-b border-gray-200 ${headerBackgroundImage ? 'bg-gray-900' : 'bg-gray-50'}`, children: [headerBackgroundImage && (_jsxs("div", { className: "absolute inset-0 z-0", ...image('categoriesHeader', ['backgroundImage']), children: [_jsx(ImageWithFallback, { src: headerBackgroundImage, alt: categoriesHeaderConfig?.title || 'Categories', className: "h-full w-full object-cover object-center", skeletonAspectRatio: "16/9" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/70 via-black/45 to-black/60" })] })), _jsx("div", { className: `container relative z-10 mx-auto px-4 sm:px-6 lg:px-8 ${headerBackgroundImage ? 'min-h-[320px] py-16 lg:min-h-[380px] lg:py-20' : 'py-12 lg:py-16'}`, children: _jsxs("div", { className: "max-w-3xl animate-fade-in-up", children: [_jsx("div", { className: "mb-6", children: _jsx(Breadcrumbs, { items: breadcrumbItems, variant: headerBackgroundImage ? 'light' : 'default' }) }), _jsx("h1", { className: `mb-6 text-4xl font-bold tracking-tight lg:text-5xl ${headerBackgroundImage ? 'text-white' : 'text-gray-900'}`, ...edit('categoriesHeader', ['title']), children: categoriesHeaderConfig?.title || 'Shop by Category' }), _jsx(
|
|
33
|
-
'Explore our comprehensive collection of premium products across various departments. Dive into our curated selections designed to match your style and needs.' })] }) })] })), categoryGridConfig?.show !== false && (_jsx("div", { ...section('categoryGrid'), style: getPayazaSectionInlineStyle(storeConfig, 'categories', 'categoryGrid'), className: "container mx-auto px-4 sm:px-6 lg:px-8 py-16", children: categories.length === 0 ? (_jsxs("div", { className: "text-center py-20", children: [_jsx("h3", { className: "text-xl font-semibold text-gray-900 mb-2", children: "No categories available" }), _jsx("p", { className: "text-gray-500", children: "Categories will appear here once they are added to the store." })] })) : (_jsx(CategoryMasonryGrid, { categories: categories, mode: "page", columns: categoryGridConfig?.columns, showImages: categoryGridConfig?.showImages !== false, showDescriptions: categoryGridConfig?.showDescriptions !== false, getHref: (category) => `/${storeConfig.slug}/products?category=${category.slug}`, exploreLabel: "Explore Collection" })) }))] }));
|
|
33
|
+
return (_jsxs("div", { "data-content-ready": true, className: "min-h-screen bg-white text-slate-900 font-sans", children: [categoriesHeaderConfig?.show !== false && (_jsxs("div", { ...section('categoriesHeader'), style: getPayazaSectionInlineStyle(storeConfig, 'categories', 'categoriesHeader'), className: `relative overflow-hidden border-b border-gray-200 ${headerBackgroundImage ? 'bg-gray-900' : 'bg-gray-50'}`, children: [headerBackgroundImage && (_jsxs("div", { className: "absolute inset-0 z-0", ...image('categoriesHeader', ['backgroundImage']), children: [_jsx(ImageWithFallback, { src: headerBackgroundImage, alt: categoriesHeaderConfig?.title || 'Categories', className: "h-full w-full object-cover object-center", skeletonAspectRatio: "16/9" }), _jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-black/70 via-black/45 to-black/60" })] })), _jsx("div", { className: `container relative z-10 mx-auto px-4 sm:px-6 lg:px-8 ${headerBackgroundImage ? 'min-h-[320px] py-16 lg:min-h-[380px] lg:py-20' : 'py-12 lg:py-16'}`, children: _jsxs("div", { className: "max-w-3xl animate-fade-in-up", children: [_jsx("div", { className: "mb-6", children: _jsx(Breadcrumbs, { items: breadcrumbItems, variant: headerBackgroundImage ? 'light' : 'default' }) }), _jsx("h1", { className: `mb-6 text-4xl font-bold tracking-tight lg:text-5xl ${headerBackgroundImage ? 'text-white' : 'text-gray-900'}`, ...edit('categoriesHeader', ['title']), children: categoriesHeaderConfig?.title || 'Shop by Category' }), _jsx(SafeRichHtml, { value: categoriesHeaderConfig?.description ||
|
|
34
|
+
'Explore our comprehensive collection of premium products across various departments. Dive into our curated selections designed to match your style and needs.', fallbackPlain: "Explore our comprehensive collection of premium products across various departments. Dive into our curated selections designed to match your style and needs.", as: "div", className: `max-w-2xl text-lg leading-relaxed [&_p]:mb-0 ${headerBackgroundImage ? 'text-white/90' : 'text-gray-600'}`, ...edit('categoriesHeader', ['description']) })] }) })] })), categoryGridConfig?.show !== false && (_jsx("div", { ...section('categoryGrid'), style: getPayazaSectionInlineStyle(storeConfig, 'categories', 'categoryGrid'), className: "container mx-auto px-4 sm:px-6 lg:px-8 py-16", children: categories.length === 0 ? (_jsxs("div", { className: "text-center py-20", children: [_jsx("h3", { className: "text-xl font-semibold text-gray-900 mb-2", children: "No categories available" }), _jsx("p", { className: "text-gray-500", children: "Categories will appear here once they are added to the store." })] })) : (_jsx(CategoryMasonryGrid, { categories: categories, mode: "page", columns: categoryGridConfig?.columns, showImages: categoryGridConfig?.showImages !== false, showDescriptions: categoryGridConfig?.showDescriptions !== false, getHref: (category) => `/${storeConfig.slug}/products?category=${category.slug}`, exploreLabel: "Explore Collection" })) }))] }));
|
|
34
35
|
}
|
|
@@ -1,8 +1,10 @@
|
|
|
1
|
+
import { type CategoryProductsSeed } from '../../../hooks/use-category-products.js';
|
|
1
2
|
import { StoreConfig } from '../../../lib/store-types';
|
|
2
3
|
interface CategoryPageProps {
|
|
3
4
|
storeConfig: StoreConfig;
|
|
4
5
|
categorySlug: string;
|
|
6
|
+
categoryProductsSeed?: CategoryProductsSeed;
|
|
5
7
|
}
|
|
6
|
-
export declare function CategoryPage({ storeConfig: initialConfig, categorySlug }: CategoryPageProps): import("react").JSX.Element;
|
|
8
|
+
export declare function CategoryPage({ storeConfig: initialConfig, categorySlug, categoryProductsSeed }: CategoryPageProps): import("react").JSX.Element;
|
|
7
9
|
export {};
|
|
8
10
|
//# sourceMappingURL=CategoryPage.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CategoryPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/CategoryPage.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CategoryPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/CategoryPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAuB,KAAK,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAE/F,OAAO,EAAE,WAAW,EAA8B,MAAM,0BAA0B,CAAC;AAenF,UAAU,iBAAiB;IACzB,WAAW,EAAE,WAAW,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;IACrB,oBAAoB,CAAC,EAAE,oBAAoB,CAAC;CAC7C;AAED,wBAAgB,YAAY,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,oBAAoB,EAAE,EAAE,iBAAiB,+BA+IjH"}
|
|
@@ -10,7 +10,8 @@ import { useToast } from '../../../components/ui/toast';
|
|
|
10
10
|
import { useAnalytics } from '../../../hooks/use-analytics';
|
|
11
11
|
import { useEffect } from 'react';
|
|
12
12
|
import { ProductCard } from '../../../components/ui/product-card';
|
|
13
|
-
|
|
13
|
+
import { CategoryDescription } from '../../../components/rich-text/CategoryDescription';
|
|
14
|
+
export function CategoryPage({ storeConfig: initialConfig, categorySlug, categoryProductsSeed }) {
|
|
14
15
|
const { store, addToCart } = useStore();
|
|
15
16
|
const storeConfig = store || initialConfig;
|
|
16
17
|
const categories = storeConfig.categories || [];
|
|
@@ -18,7 +19,7 @@ export function CategoryPage({ storeConfig: initialConfig, categorySlug }) {
|
|
|
18
19
|
const { addToast } = useToast();
|
|
19
20
|
const { trackEvent } = useAnalytics();
|
|
20
21
|
const categoryDetailConfig = storeConfig.layoutConfig?.pages?.categoryDetail;
|
|
21
|
-
const { products, isLoading, hasMore, loadMore } = useCategoryProducts(storeConfig.id, category?.id);
|
|
22
|
+
const { products, isLoading, hasMore, loadMore } = useCategoryProducts(storeConfig.id, category?.id, categoryProductsSeed);
|
|
22
23
|
const hasItems = products.length > 0;
|
|
23
24
|
// Track category view
|
|
24
25
|
useEffect(() => {
|
|
@@ -47,5 +48,5 @@ export function CategoryPage({ storeConfig: initialConfig, categorySlug }) {
|
|
|
47
48
|
const isDarkTheme = storeConfig.type === 'food-modern' || storeConfig.branding.theme === 'dark';
|
|
48
49
|
const bgColor = isDarkTheme ? 'bg-[#0F0F0F]' : 'bg-gray-50';
|
|
49
50
|
const textColor = isDarkTheme ? 'text-white' : 'text-gray-900';
|
|
50
|
-
return (_jsxs("div", { className: "min-h-screen bg-white text-gray-900 transition-colors duration-300", children: [categoryDetailConfig?.showBanner !== false && (_jsxs("div", { className: "relative h-[40vh] overflow-hidden", children: [_jsx(ImageWithFallback, { src: category.image, alt: category.name, className: "w-full h-full object-cover", skeletonAspectRatio: "16/9" }), _jsx("div", { className: "absolute inset-0 bg-black/40 backdrop-blur-[2px]" }), _jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center text-center p-6 text-white", children: [_jsx("h1", { className: "text-5xl md:text-7xl font-bold tracking-tight mb-4", children: category.name }), category.description
|
|
51
|
+
return (_jsxs("div", { "data-content-ready": true, className: "min-h-screen bg-white text-gray-900 transition-colors duration-300", children: [categoryDetailConfig?.showBanner !== false && (_jsxs("div", { className: "relative h-[40vh] overflow-hidden", children: [_jsx(ImageWithFallback, { src: category.image, alt: category.name, className: "w-full h-full object-cover", skeletonAspectRatio: "16/9" }), _jsx("div", { className: "absolute inset-0 bg-black/40 backdrop-blur-[2px]" }), _jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center text-center p-6 text-white", children: [_jsx("h1", { className: "text-5xl md:text-7xl font-bold tracking-tight mb-4", children: category.name }), categoryDetailConfig?.showDescription !== false && (_jsx(CategoryDescription, { description: category.description }))] })] })), categoryDetailConfig?.showBanner === false && (_jsx("div", { className: "bg-white border-b border-gray-100 py-12", children: _jsxs("div", { className: "container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", children: [_jsx("h1", { className: "text-4xl font-bold mb-4", children: category.name }), categoryDetailConfig?.showDescription !== false && (_jsx(CategoryDescription, { description: category.description, className: "text-lg text-gray-600 max-w-2xl [&_p]:mb-0 [&_p+p]:mt-2" }))] }) })), _jsxs("div", { className: "container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-12", children: [_jsxs("div", { className: "flex flex-col md:flex-row justify-between items-center mb-10 gap-4", children: [_jsxs(Link, { href: `/${storeConfig.slug}/categories`, className: "inline-flex items-center text-sm font-medium text-gray-600 hover:text-gray-900", children: [_jsx(ArrowLeft, { className: "h-4 w-4 mr-2" }), "Back to All Categories"] }), categoryDetailConfig?.showFilters !== false && (_jsx("div", { className: "flex items-center gap-4", children: _jsxs(Button, { variant: "outline", className: "bg-white", children: [_jsx(Filter, { className: "h-4 w-4 mr-2" }), " Filter"] }) }))] }), (!hasItems && !isLoading) || categoryDetailConfig?.showProducts === false ? (_jsxs("div", { className: "text-center py-20 border border-dashed border-gray-300 rounded-3xl", children: [_jsx("p", { className: "text-gray-500 text-lg", children: categoryDetailConfig?.showProducts === false ? 'Products are currently hidden for this category.' : 'No products found in this category.' }), _jsx(Button, { className: "mt-4", onClick: () => window.history.back(), children: "Go Back" })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-8", children: products.map((product) => (_jsx(ProductCard, { product: product, storeSlug: storeConfig.slug, onAddToCart: handleAddToCart, onQuickView: handleQuickView }, product.id))) }), hasMore && (_jsx("div", { className: "mt-10 flex justify-center", children: _jsx(Button, { onClick: loadMore, disabled: isLoading, children: "Load more" }) }))] }))] })] }));
|
|
51
52
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProductDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/ProductDetailPage.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAA8C,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"ProductDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/ProductDetailPage.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAA8C,MAAM,0BAA0B,CAAC;AA6BnG,UAAU,sBAAsB;IAC9B,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;CACrB;AAsHD,wBAAgB,iBAAiB,CAAC,EAAE,WAAW,EAAE,aAAa,EAAE,WAAW,EAAE,EAAE,sBAAsB,+BAwiCpG"}
|
|
@@ -18,6 +18,7 @@ import { getGuestUserInfo, saveGuestUserInfo } from '../../../lib/guest-user';
|
|
|
18
18
|
import { ProductCard } from '../../../components/ui/product-card';
|
|
19
19
|
import Image from 'next/image';
|
|
20
20
|
import { ImageWithFallback } from '../../../components/ui/image-with-fallback';
|
|
21
|
+
import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml';
|
|
21
22
|
import { ButtonLoader } from '../../../components/ui/page-loader';
|
|
22
23
|
import { extractImageUrls } from '../../../lib/store-config-utils';
|
|
23
24
|
import { OutOfStockOverlay } from '../../../components/ui/out-of-stock-overlay';
|
|
@@ -487,9 +488,9 @@ export function ProductDetailPage({ storeConfig: initialConfig, productSlug }) {
|
|
|
487
488
|
return (_jsx("button", { onClick: () => setSelectedSize(variant.value), className: `px-4 py-3 rounded-lg border-2 text-sm font-semibold transition-all ${isSelected
|
|
488
489
|
? 'bg-gray-900 text-white border-gray-900 shadow-md transform -translate-y-0.5'
|
|
489
490
|
: 'bg-white text-gray-700 border-gray-200 hover:border-gray-300 hover:bg-gray-50'}`, children: variant.value }, variant.id));
|
|
490
|
-
}) })] })), _jsxs("div", { className: "flex flex-col gap-4 mb-8", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("span", { className: "text-sm font-semibold text-gray-900", children: "Quantity" }), _jsxs("div", { className: "flex items-center border border-gray-300 rounded-lg", children: [_jsx("button", { className: "p-3 text-gray-600 hover:bg-gray-100 rounded-l-lg disabled:opacity-50", onClick: () => setQuantity(Math.max(1, quantity - 1)), disabled: quantity <= 1, children: _jsx(Minus, { className: "h-4 w-4" }) }), _jsx("span", { className: "w-12 text-center font-semibold text-gray-900", children: quantity }), _jsx("button", { className: "p-3 text-gray-600 hover:bg-gray-100 rounded-r-lg", onClick: () => setQuantity(quantity + 1), children: _jsx(Plus, { className: "h-4 w-4" }) })] })] }), _jsxs("div", { className: "flex flex-
|
|
491
|
+
}) })] })), _jsxs("div", { className: "flex flex-col gap-4 mb-8", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("span", { className: "text-sm font-semibold text-gray-900", children: "Quantity" }), _jsxs("div", { className: "flex items-center border border-gray-300 rounded-lg", children: [_jsx("button", { className: "p-3 text-gray-600 hover:bg-gray-100 rounded-l-lg disabled:opacity-50", onClick: () => setQuantity(Math.max(1, quantity - 1)), disabled: quantity <= 1, children: _jsx(Minus, { className: "h-4 w-4" }) }), _jsx("span", { className: "w-12 text-center font-semibold text-gray-900", children: quantity }), _jsx("button", { className: "p-3 text-gray-600 hover:bg-gray-100 rounded-r-lg", onClick: () => setQuantity(quantity + 1), children: _jsx(Plus, { className: "h-4 w-4" }) })] })] }), _jsxs("div", { className: "flex flex-row items-stretch gap-2 sm:gap-3 mt-2 w-full", children: [productDetailConfig?.showAddToCart !== false && (_jsx(Button, { "data-add-to-cart": true, size: "lg", onClick: handleAddToCart, disabled: isCartLoading || isOutOfStock, className: "flex-1 min-w-0 bg-white border-2 border-gray-900 text-gray-900 hover:bg-gray-50 rounded-full h-12 sm:h-14 px-3 sm:px-6 text-sm sm:text-base font-bold shadow-sm transition-all disabled:opacity-50 disabled:cursor-not-allowed [&_svg]:text-gray-900", children: isCartLoading ? (_jsxs(_Fragment, { children: [_jsx(ButtonLoader, { className: "mr-1.5 sm:mr-2" }), "Adding..."] })) : (_jsxs(_Fragment, { children: [_jsx(ShoppingCart, { className: "h-4 w-4 sm:h-5 sm:w-5 mr-1.5 sm:mr-2 shrink-0 text-gray-900" }), "Add to Cart"] })) })), productDetailConfig?.showAddToCart !== false && (_jsx(Button, { size: "lg", onClick: handleBuyNow, disabled: isOutOfStock || isBuyNowLoading || isCartLoading, className: "flex-1 min-w-0 bg-gray-900 hover:bg-gray-800 text-white rounded-full h-12 sm:h-14 px-3 sm:px-6 text-sm sm:text-base font-bold shadow-lg hover:shadow-xl transition-all disabled:opacity-50 disabled:cursor-not-allowed", children: isBuyNowLoading || isCartLoading ? (_jsxs(_Fragment, { children: [_jsx(ButtonLoader, { className: "mr-1.5 sm:mr-2" }), "Adding..."] })) : ('Buy Now') })), storeConfig.features.wishlist && productDetailConfig?.showWishlist !== false && (_jsx(Button, { variant: "outline", size: "lg", onClick: handleWishlistClick, disabled: isWishlistLoading || !product, className: cn("h-12 w-12 sm:h-14 sm:w-14 shrink-0 rounded-full border-2 transition-all disabled:opacity-50 disabled:cursor-not-allowed", product && isInWishlist(product.id)
|
|
491
492
|
? "border-red-500 bg-red-50 text-red-500 hover:bg-red-100"
|
|
492
|
-
: "border-gray-200 hover:border-gray-300 hover:bg-gray-50"), children: isWishlistLoading ? (_jsx(ButtonLoader, { className: "h-5 w-5" })) : (_jsx(Heart, { className: cn("h-5 w-5", product && isInWishlist(product.id) && "fill-current") })) }))] })] }), _jsx(ProductDeliveryInfoSection, { storeConfig: storeConfig, currency: storeConfig.settings?.currency || 'USD', productCurrency: product.currency, productPrice: product.price, quantity: quantity, shippingAddress: shippingAddress, updateShippingAddress: (patch) => setShippingAddress((prev) => ({ ...prev, ...patch })), shippingMethods: shippingMethods, isCalculatingShipping: isCalculatingShipping, shippingError: shippingError, freeShippingEligible: freeShippingEligible, freeShippingThreshold: freeShippingThreshold, onToast: addToast }), product.description && (_jsxs("div", { className: "mb-8", children: [_jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: "Description" }), _jsxs("div", { className: "prose prose-sm max-w-none text-gray-600 leading-relaxed", children: [_jsx(
|
|
493
|
+
: "border-gray-200 hover:border-gray-300 hover:bg-gray-50"), children: isWishlistLoading ? (_jsx(ButtonLoader, { className: "h-5 w-5" })) : (_jsx(Heart, { className: cn("h-5 w-5", product && isInWishlist(product.id) && "fill-current") })) }))] })] }), _jsx(ProductDeliveryInfoSection, { storeConfig: storeConfig, currency: storeConfig.settings?.currency || 'USD', productCurrency: product.currency, productPrice: product.price, quantity: quantity, shippingAddress: shippingAddress, updateShippingAddress: (patch) => setShippingAddress((prev) => ({ ...prev, ...patch })), shippingMethods: shippingMethods, isCalculatingShipping: isCalculatingShipping, shippingError: shippingError, freeShippingEligible: freeShippingEligible, freeShippingThreshold: freeShippingThreshold, onToast: addToast }), product.description && (_jsxs("div", { className: "mb-8", children: [_jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-3", children: "Description" }), _jsxs("div", { className: "prose prose-sm max-w-none text-gray-600 leading-relaxed", children: [_jsx(SafeRichHtml, { value: product.description, fallbackPlain: "", as: "div" }), _jsxs("ul", { className: "list-disc pl-5 space-y-1 mt-2", children: [_jsx("li", { children: "Premium quality material" }), _jsx("li", { children: "Comfortable fit for all-day wear" }), _jsx("li", { children: "Durable stitching and finish" })] })] })] })), product.specifications && Object.keys(product.specifications).length > 0 && (_jsxs("div", { className: "mb-8", children: [_jsx("h2", { className: "text-lg font-semibold text-gray-900 mb-4", children: "Specifications" }), _jsx("dl", { className: "grid grid-cols-1 sm:grid-cols-2 gap-x-4 gap-y-4", children: Object.entries(product.specifications).map(([key, value]) => (_jsxs("div", { className: "flex flex-col p-3 bg-gray-50 rounded-lg", children: [_jsx("dt", { className: "text-xs text-gray-500 font-medium uppercase tracking-wider mb-1", children: key }), _jsx("dd", { className: "text-sm font-bold text-gray-900", children: value })] }, key))) })] }))] })] }), productDetailConfig?.showReviews !== false && (_jsx("div", { className: "mt-20 pt-16 border-t border-gray-200", children: _jsxs("div", { className: "max-w-4xl", children: [_jsxs("div", { className: "flex flex-col sm:flex-row items-start sm:items-center justify-between gap-6 mb-10", children: [_jsxs("div", { className: "flex-1", children: [_jsx("h2", { className: "text-2xl lg:text-3xl font-bold text-gray-900 mb-4", children: "Customer Reviews" }), reviewCount > 0 && averageRating > 0 ? (_jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(StarRating, { rating: averageRating, size: "lg" }), _jsx("span", { className: "text-2xl font-bold text-gray-900", children: averageRating.toFixed(1) }), _jsx("span", { className: "text-lg text-gray-500", children: "out of 5" })] }), _jsx("span", { className: "text-gray-300", children: "|" }), _jsxs("span", { className: "text-lg text-gray-600", children: [reviewCount, " ", reviewCount === 1 ? 'review' : 'reviews'] })] })) : (_jsx("div", { className: "text-gray-500", children: _jsx("p", { className: "text-base", children: "Be the first to review this product" }) }))] }), _jsx(Button, { onClick: () => {
|
|
493
494
|
if (!isAuthenticated) {
|
|
494
495
|
openLogin({ onSuccess: () => setIsReviewModalOpen(true) });
|
|
495
496
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProductsPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/ProductsPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAgB,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"ProductsPage.d.ts","sourceRoot":"","sources":["../../../../src/layouts/clothing/pages/ProductsPage.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAgB,MAAM,0BAA0B,CAAC;AA+BrE,UAAU,iBAAiB;IACzB,WAAW,EAAE,WAAW,CAAC;CAC1B;AA2vBD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAMpD"}
|