storefront-layouts 1.0.16 → 1.0.18

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

@@ -7,6 +7,7 @@ import { useStore } from '../../../lib/store-context.js';
 import Image from 'next/image';
 import { SafeRichHtml } from '../../../components/rich-text/SafeRichHtml.js';
 import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
+import { storySectionImage, storySectionLabel, storySectionTitle, storyTeamSubtitle, storyTeamTitle, } from '../../shared/about-story-media.js';
 export function AboutPage({ storeConfig: initialConfig }) {
     const { store } = useStore();
     const storeConfig = store || initialConfig;
@@ -18,7 +19,13 @@ export function AboutPage({ storeConfig: initialConfig }) {
     const pageTitle = aboutConfig?.hero?.title || aboutConfig?.title || "Empowering Minds, Changing Lives.";
     const pageContent = aboutConfig?.story?.content || aboutConfig?.content || storeConfig.description;
     const missionStatement = aboutConfig?.hero?.missionStatement || aboutConfig?.missionStatement;
-    const galleryImages = aboutConfig?.gallerySection;
+    const storyConfig = aboutConfig?.story || aboutConfig;
+    const galleryImages = storyConfig?.gallerySection || aboutConfig?.gallerySection;
+    const storyImage = storySectionImage(storyConfig);
+    const storyLabel = storySectionLabel(storyConfig);
+    const storyTitle = storySectionTitle(storyConfig);
+    const storyCaptionTitle = storyTeamTitle(storyConfig);
+    const storyCaptionSubtitle = storyTeamSubtitle(storyConfig);
     const values = [
         {
             icon: Award,
@@ -41,7 +48,7 @@ export function AboutPage({ storeConfig: initialConfig }) {
             description: "Success built on integrity, balance, and sustainable high performance."
         }
     ];
-    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: [
+    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: storyImage, alt: storyCaptionTitle, 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: storyCaptionTitle }), _jsx("p", { className: "text-white/80 text-sm", children: storyCaptionSubtitle })] })] })), _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: [
                                 { label: "Students Empowered", value: "25k+" },
                                 { label: "Hours of Content", value: "500+" },
                                 { label: "Global Events", value: "100+" },

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

@@ -20,12 +20,12 @@ import { filterActiveProducts } from '../../../lib/utils/index.js';
 import { getAllCategoryIds, flattenCategoryTree, buildCategoryTree } from '../../../lib/utils/category-tree.js';
 import { getBannerImage, getLayoutText } from '../../../lib/utils/asset-helpers.js';
 import { shouldUseAPI } from '../../../lib/utils/demo-detection.js';
-import { productCategoryFilterChipClass } from '../../shared/product-category-filter-chip';
+import { productCategoryFilterChipClass } from '../../shared/product-category-filter-chip.js';
 import { useCatalogPriceRange } from '../../../hooks/use-catalog-price-range.js';
 import { getApiPriceFilterActive, isWithinActivePriceRange } from '../../../lib/utils/catalog-price-bounds.js';
 import { buildFilteredProductQuery, getFilteredProductQueryKey, productMatchesCategoryIds, productMatchesCategorySlug, } from '../../../lib/utils/filtered-product-query.js';
 import { transformProductToStoreProduct } from '../../../lib/store-config-utils.js';
-import { ProductPriceFilterSection } from '../../shared/components/ProductPriceFilterSection';
+import { ProductPriceFilterSection } from '../../shared/components/ProductPriceFilterSection.js';
 function ProductsPageContent({ storeConfig }) {
     const searchParams = useSearchParams();
     const categoryParam = searchParams.get('category');

package/dist/layouts/shared/about-story-media.d.ts

@@ -0,0 +1,27 @@
+export declare const DEFAULT_ABOUT_STORY_IMAGE = "https://images.unsplash.com/photo-1522202176988-66273c2fd55f?q=80&w=2071&auto=format&fit=crop";
+export type AboutStoryConfig = {
+    storyImage?: unknown;
+    teamImage?: unknown;
+    image?: unknown;
+    teamTitle?: unknown;
+    teamSubtitle?: unknown;
+    teamBadgeTitle?: unknown;
+    teamBadgeSubtitle?: unknown;
+    galleryOverlayTitle?: unknown;
+    galleryOverlaySubtitle?: unknown;
+    teamCaption?: unknown;
+    teamSubCaption?: unknown;
+    sectionLabel?: unknown;
+    label?: unknown;
+    subLabel?: unknown;
+    title?: unknown;
+    sectionHeading?: unknown;
+    heading?: unknown;
+} | null | undefined;
+export declare function resolveLayoutImageUrl(value: unknown): string;
+export declare function storySectionImage(config: AboutStoryConfig, fallback?: string): string;
+export declare function storySectionLabel(config: AboutStoryConfig, fallback?: string): string;
+export declare function storySectionTitle(config: AboutStoryConfig, fallback?: string): string;
+export declare function storyTeamTitle(config: AboutStoryConfig, fallback?: string): string;
+export declare function storyTeamSubtitle(config: AboutStoryConfig, fallback?: string): string;
+//# sourceMappingURL=about-story-media.d.ts.map

package/dist/layouts/shared/about-story-media.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"about-story-media.d.ts","sourceRoot":"","sources":["../../../src/layouts/shared/about-story-media.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,yBAAyB,kGAA8B,CAAC;AAErE,MAAM,MAAM,gBAAgB,GAAG;IAC7B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,IAAI,GAAG,SAAS,CAAC;AAErB,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAe5D;AAED,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,gBAAgB,EACxB,QAAQ,GAAE,MAAkC,GAC3C,MAAM,CAMR;AAMD,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,gBAAgB,EACxB,QAAQ,SAAe,GACtB,MAAM,CAKR;AAED,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,gBAAgB,EACxB,QAAQ,SAAgB,GACvB,MAAM,CAKR;AAED,wBAAgB,cAAc,CAC5B,MAAM,EAAE,gBAAgB,EACxB,QAAQ,SAAmB,GAC1B,MAAM,CAQR;AAED,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,gBAAgB,EACxB,QAAQ,SAAyC,GAChD,MAAM,CAQR"}

package/dist/layouts/shared/about-story-media.js

@@ -0,0 +1,46 @@
+import { BOOKING_DEFAULT_STORY_IMAGE } from '../booking/components/booking-about-defaults.js';
+export const DEFAULT_ABOUT_STORY_IMAGE = BOOKING_DEFAULT_STORY_IMAGE;
+export function resolveLayoutImageUrl(value) {
+    if (value == null)
+        return '';
+    if (typeof value === 'string') {
+        return value.trim();
+    }
+    if (typeof value === 'object') {
+        const record = value;
+        for (const key of ['url', 'src', 'imageUrl', 'image']) {
+            const candidate = record[key];
+            if (typeof candidate === 'string' && candidate.trim()) {
+                return candidate.trim();
+            }
+        }
+    }
+    return '';
+}
+export function storySectionImage(config, fallback = DEFAULT_ABOUT_STORY_IMAGE) {
+    const resolved = resolveLayoutImageUrl(config?.storyImage) ||
+        resolveLayoutImageUrl(config?.teamImage) ||
+        resolveLayoutImageUrl(config?.image);
+    return resolved || fallback;
+}
+function readText(value, fallback) {
+    return typeof value === 'string' && value.trim() ? value.trim() : fallback;
+}
+export function storySectionLabel(config, fallback = 'Who We Are') {
+    return readText(config?.sectionLabel ?? config?.label ?? config?.subLabel, fallback);
+}
+export function storySectionTitle(config, fallback = 'Our Journey') {
+    return readText(config?.title ?? config?.sectionHeading ?? config?.heading, fallback);
+}
+export function storyTeamTitle(config, fallback = 'The Dream Team') {
+    return readText(config?.teamTitle ??
+        config?.teamBadgeTitle ??
+        config?.galleryOverlayTitle ??
+        config?.teamCaption, fallback);
+}
+export function storyTeamSubtitle(config, fallback = 'Working together to serve you better') {
+    return readText(config?.teamSubtitle ??
+        config?.teamBadgeSubtitle ??
+        config?.galleryOverlaySubtitle ??
+        config?.teamSubCaption, fallback);
+}

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

@@ -1,14 +1,14 @@
 'use client';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { isBookingAgendaStoreRoot } from '../../../lib/layout-route-utils';
-import { StandardLayout } from '../wrappers/StandardLayout';
-import { ClothingLayout } from '../wrappers/ClothingLayout';
-import { ClothingMinimalLayout } from '../wrappers/ClothingMinimalLayout';
-import { FoodModernLayout } from '../wrappers/FoodModernLayout';
-import { BookingAgendaLayout } from '../wrappers/BookingAgendaLayout';
-import { ElectronicsLayout } from '../wrappers/ElectronicsLayout';
-import { MotivationalLayout } from '../wrappers/MotivationalLayout';
-import { LoginSheet } from '../../../components/auth/LoginSheet';
+import { isBookingAgendaStoreRoot } from '../../../lib/layout-route-utils.js';
+import { StandardLayout } from '../wrappers/StandardLayout.js';
+import { ClothingLayout } from '../wrappers/ClothingLayout.js';
+import { ClothingMinimalLayout } from '../wrappers/ClothingMinimalLayout.js';
+import { FoodModernLayout } from '../wrappers/FoodModernLayout.js';
+import { BookingAgendaLayout } from '../wrappers/BookingAgendaLayout.js';
+import { ElectronicsLayout } from '../wrappers/ElectronicsLayout.js';
+import { MotivationalLayout } from '../wrappers/MotivationalLayout.js';
+import { LoginSheet } from '../../../components/auth/LoginSheet.js';
 import { usePathname, useSearchParams } from 'next/navigation';
 export function BaseStoreLayout({ children, storeConfig }) {
     const pathname = usePathname();

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

@@ -1,8 +1,8 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { StoreHeader } from '../../shared/components/StoreHeader';
-import { StoreFooter } from '../../shared/components/StoreFooter';
-import { useStore } from '../../../lib/store-context';
+import { StoreHeader } from '../../shared/components/StoreHeader.js';
+import { StoreFooter } from '../../shared/components/StoreFooter.js';
+import { useStore } from '../../../lib/store-context.js';
 export function GenericPageWrapper({ children, storeConfig: initialConfig }) {
     const { store } = useStore();
     const storeConfig = store || initialConfig;

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

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getSortedVariationOptionKeys, getVariationAttributeLabel, } from '../../../lib/product-variation-utils';
-import { PdpColorSwatch } from './PdpColorSwatch';
+import { getSortedVariationOptionKeys, getVariationAttributeLabel, } from '../../../lib/product-variation-utils.js';
+import { PdpColorSwatch } from './PdpColorSwatch.js';
 const DEFAULT_COLOR_SWATCHES = {
     White: '#FFFFFF',
     white: '#FFFFFF',

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

@@ -1,10 +1,10 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Link from 'next/link';
-import { Button } from '../../../components/ui/button';
-import { cn } from '../../../lib/utils';
-import { useStore } from '../../../lib/store-context';
-import { toStoreHref } from '../../../lib/utils/url-helpers';
+import { Button } from '../../../components/ui/button.js';
+import { cn } from '../../../lib/utils/index.js';
+import { useStore } from '../../../lib/store-context.js';
+import { toStoreHref } from '../../../lib/utils/url-helpers.js';
 export function PromoBanner({ config, layoutStyle = 'default', className, storeSlug: storeSlugProp }) {
     const { store } = useStore();
     if (!config?.show)

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

@@ -1,16 +1,16 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ShoppingBag, Minus, Plus, Trash2 } from 'lucide-react';
-import { Sheet } from '../../../components/ui/sheet';
-import { Button } from '../../../components/ui/button';
-import { CheckoutButton } from '../../../components/ui/checkout-button';
-import { ImageWithFallback } from '../../../components/ui/image-with-fallback';
+import { Sheet } from '../../../components/ui/sheet.js';
+import { Button } from '../../../components/ui/button.js';
+import { CheckoutButton } from '../../../components/ui/checkout-button.js';
+import { ImageWithFallback } from '../../../components/ui/image-with-fallback.js';
 import { useMemo } from 'react';
-import { useStore } from '../../../lib/store-context';
-import { formatCurrency } from '../../../lib/utils';
-import { getCartLineImage } from '../../../lib/product-variation-utils';
-import { getLayoutText } from '../../../lib/utils/asset-helpers';
-import { resolveCartChargeCurrency } from '../../../lib/cart-charge-currency';
+import { useStore } from '../../../lib/store-context.js';
+import { formatCurrency } from '../../../lib/utils/index.js';
+import { getCartLineImage } from '../../../lib/product-variation-utils.js';
+import { getLayoutText } from '../../../lib/utils/asset-helpers.js';
+import { resolveCartChargeCurrency } from '../../../lib/cart-charge-currency.js';
 export function StoreCartSheet({ storeConfig, title }) {
     const { cart, removeFromCart, updateCartQuantity, isCartOpen, setIsCartOpen, cartTotal, } = useStore();
     const { currency: cartCurrency } = useMemo(() => resolveCartChargeCurrency(cart, storeConfig.settings?.currency), [cart, storeConfig.settings?.currency]);

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

@@ -3,16 +3,16 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Link from 'next/link';
 import { getCurrentYear } from '../../../utils/date.js';
 import { Facebook, Twitter, Instagram, Share2 } from 'lucide-react';
-import { DotPattern } from '../../../components/ui/background-patterns';
-import { cn } from '../../../lib/utils';
-import { getLogoUrl } from '../../../lib/utils/asset-helpers';
-import { StoreLogo } from '../../../components/ui/store-logos';
-import { useStore } from '../../../lib/store-context';
-import { payazaInlineBindingProps } from '../../../preview/canvas/field-key';
-import { isEditorPreviewMode } from '../../../lib/utils/editor-preview';
-import { resolveStoreLink } from '../../../lib/layout-route-utils';
+import { DotPattern } from '../../../components/ui/background-patterns.js';
+import { cn } from '../../../lib/utils/index.js';
+import { getLogoUrl } from '../../../lib/utils/asset-helpers.js';
+import { StoreLogo } from '../../../components/ui/store-logos.js';
+import { useStore } from '../../../lib/store-context.js';
+import { payazaInlineBindingProps } from '../../../preview/canvas/field-key.js';
+import { isEditorPreviewMode } from '../../../lib/utils/editor-preview.js';
+import { resolveStoreLink } from '../../../lib/layout-route-utils.js';
 import { RichTextExcerpt } from '../../../components/rich-text/RichTextExcerpt.js';
-import { BOOKING_DEFAULT_FOOTER_TAGLINE, resolveBookingFooterMainLinks, resolveBookingFooterSupportLinks, resolveBookingFooterPrimaryColumnTitle, } from '../../booking/components/booking-footer-defaults';
+import { BOOKING_DEFAULT_FOOTER_TAGLINE, resolveBookingFooterMainLinks, resolveBookingFooterSupportLinks, resolveBookingFooterPrimaryColumnTitle, } from '../../booking/components/booking-footer-defaults.js';
 export function StoreFooter({ storeConfig: initialConfig }) {
     const { store } = useStore();
     const storeConfig = store || initialConfig;

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

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import Link from 'next/link';
-import { Button } from '../../../components/ui/button';
+import { Button } from '../../../components/ui/button.js';
 import { ShoppingCart, Heart, Search, Menu, X, ChevronRight, ChevronDown, Instagram, Twitter, Youtube, Home, Info, Phone, Package, Calendar, BookOpen, GraduationCap, Sparkles, Tag, LayoutGrid } from 'lucide-react';
 // Navigation icon helper
 const getNavIcon = (label) => {
@@ -30,14 +30,14 @@ const getNavIcon = (label) => {
 };
 import { useState, useEffect, useRef } from 'react';
 import { usePathname } from 'next/navigation';
-import { cn, formatStoreDisplayName } from '../../../lib/utils';
-import { useAuth } from '../../../lib/auth-context';
-import { StoreLogo } from '../../../components/ui/store-logos';
-import { useStore } from '../../../lib/store-context';
-import { getLogoUrl } from '../../../lib/utils/asset-helpers';
-import { AvatarImage } from '../../../components/ui/avatar-image';
+import { cn, formatStoreDisplayName } from '../../../lib/utils/index.js';
+import { useAuth } from '../../../lib/auth-context.js';
+import { StoreLogo } from '../../../components/ui/store-logos.js';
+import { useStore } from '../../../lib/store-context.js';
+import { getLogoUrl } from '../../../lib/utils/asset-helpers.js';
+import { AvatarImage } from '../../../components/ui/avatar-image.js';
 import { motion, AnimatePresence } from 'framer-motion';
-import { StoreCartSheet } from './StoreCartSheet';
+import { StoreCartSheet } from './StoreCartSheet.js';
 function headerNavLinkClass(isDarkTheme) {
     return cn('px-2 py-2.5 text-[11px] font-bold uppercase tracking-[0.12em] transition-colors underline-offset-4 decoration-2 inline-flex items-center gap-2 whitespace-nowrap', isDarkTheme
         ? 'text-gray-400 hover:text-white hover:underline'

package/dist/layouts/shared/components/headers/BookingAgendaSidebar.js

@@ -1,10 +1,10 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button } from '../../../../components/ui/button';
+import { Button } from '../../../../components/ui/button.js';
 import { User, Sparkles, X, MoreHorizontal, Calendar, Search, Heart } from 'lucide-react';
 import Link from 'next/link';
 import { useState } from 'react';
-import { getLayoutText, getThemeColor } from '../../../../lib/utils/asset-helpers';
+import { getLayoutText, getThemeColor } from '../../../../lib/utils/asset-helpers.js';
 export function BookingAgendaSidebar({ storeConfig, onBookClick }) {
     const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
     const categories = storeConfig.categories || [];

package/dist/layouts/shared/components/headers/ClothingMinimalHeader.js

@@ -1,18 +1,18 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button } from '../../../../components/ui/button';
-import { Sheet } from '../../../../components/ui/sheet';
-import { StoreCartSheet } from '../StoreCartSheet';
-import { useStore } from '../../../../lib/store-context';
+import { Button } from '../../../../components/ui/button.js';
+import { Sheet } from '../../../../components/ui/sheet.js';
+import { StoreCartSheet } from '../StoreCartSheet.js';
+import { useStore } from '../../../../lib/store-context.js';
 import { ShoppingBag, Menu, Search } from 'lucide-react';
 import Link from 'next/link';
 import { useState, useEffect } from 'react';
 import { usePathname } from 'next/navigation';
-import { formatStoreDisplayName } from '../../../../lib/utils';
-import { getLayoutText, getLogoUrl } from '../../../../lib/utils/asset-helpers';
-import { StoreLogo } from '../../../../components/ui/store-logos';
-import { useAuth } from '../../../../lib/auth-context';
-import { AvatarImage } from '../../../../components/ui/avatar-image';
+import { formatStoreDisplayName } from '../../../../lib/utils/index.js';
+import { getLayoutText, getLogoUrl } from '../../../../lib/utils/asset-helpers.js';
+import { StoreLogo } from '../../../../components/ui/store-logos.js';
+import { useAuth } from '../../../../lib/auth-context.js';
+import { AvatarImage } from '../../../../components/ui/avatar-image.js';
 import { User } from 'lucide-react';
 export function ClothingMinimalHeader({ storeConfig }) {
     const { isCartOpen, setIsCartOpen, cartCount } = useStore();

package/dist/layouts/shared/components/headers/FoodModernHeader.js

@@ -1,16 +1,16 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button } from '../../../../components/ui/button';
-import { Modal } from '../../../../components/ui/modal';
-import { useToast } from '../../../../components/ui/toast';
+import { Button } from '../../../../components/ui/button.js';
+import { Modal } from '../../../../components/ui/modal.js';
+import { useToast } from '../../../../components/ui/toast.js';
 import { Menu as MenuIcon, Search, X, Calendar, Clock, Users, Mail, Phone, CheckCircle, User } from 'lucide-react';
-import { useAuth } from '../../../../lib/auth-context';
+import { useAuth } from '../../../../lib/auth-context.js';
 import { usePathname } from 'next/navigation';
 import Link from 'next/link';
 import { useState, useEffect } from 'react';
-import { getLayoutText, getLogoUrl } from '../../../../lib/utils/asset-helpers';
-import { formatStoreDisplayName } from '../../../../lib/utils';
-import { StoreLogo } from '../../../../components/ui/store-logos';
+import { getLayoutText, getLogoUrl } from '../../../../lib/utils/asset-helpers.js';
+import { formatStoreDisplayName } from '../../../../lib/utils/index.js';
+import { StoreLogo } from '../../../../components/ui/store-logos.js';
 export function FoodModernHeader({ storeConfig }) {
     const { addToast } = useToast();
     const { isAuthenticated, openLogin } = useAuth();

package/dist/layouts/shared/index.js

@@ -1,23 +1,23 @@
 // Shared layout exports
-export { BaseStoreLayout } from './components/BaseStoreLayout';
-export { GenericPageWrapper } from './components/GenericPageWrapper';
-export { PromoBanner } from './components/PromoBanner';
-export { StoreFooter } from './components/StoreFooter';
-export { StoreHeader } from './components/StoreHeader';
-export { TestimonialCard } from './components/TestimonialCard';
-export { AccountPage } from './pages/AccountPage';
-export { CartPage } from './pages/CartPage';
-export { CheckoutPage } from './pages/CheckoutPage';
-export { CookiePolicyPage } from './pages/CookiePolicyPage';
-export { FeatureDisabledPage } from './pages/FeatureDisabledPage';
-export { HelpCenterPage } from './pages/HelpCenterPage';
-export { MaintenancePage } from './pages/MaintenancePage';
-export { PortfolioPage } from './pages/PortfolioPage';
-export { PrivacyPolicyPage } from './pages/PrivacyPolicyPage';
-export { ShippingReturnsPage } from './pages/ShippingReturnsPage';
-export { SizeGuidePage } from './pages/SizeGuidePage';
-export { StyleGuidePage } from './pages/StyleGuidePage';
-export { TeamPage } from './pages/TeamPage';
-export { TermsPage } from './pages/TermsPage';
-export { TrackOrderPage } from './pages/TrackOrderPage';
-export { WishlistPage } from './pages/WishlistPage';
+export { BaseStoreLayout } from './components/BaseStoreLayout.js';
+export { GenericPageWrapper } from './components/GenericPageWrapper.js';
+export { PromoBanner } from './components/PromoBanner.js';
+export { StoreFooter } from './components/StoreFooter.js';
+export { StoreHeader } from './components/StoreHeader.js';
+export { TestimonialCard } from './components/TestimonialCard.js';
+export { AccountPage } from './pages/AccountPage.js';
+export { CartPage } from './pages/CartPage.js';
+export { CheckoutPage } from './pages/CheckoutPage.js';
+export { CookiePolicyPage } from './pages/CookiePolicyPage.js';
+export { FeatureDisabledPage } from './pages/FeatureDisabledPage.js';
+export { HelpCenterPage } from './pages/HelpCenterPage.js';
+export { MaintenancePage } from './pages/MaintenancePage.js';
+export { PortfolioPage } from './pages/PortfolioPage.js';
+export { PrivacyPolicyPage } from './pages/PrivacyPolicyPage.js';
+export { ShippingReturnsPage } from './pages/ShippingReturnsPage.js';
+export { SizeGuidePage } from './pages/SizeGuidePage.js';
+export { StyleGuidePage } from './pages/StyleGuidePage.js';
+export { TeamPage } from './pages/TeamPage.js';
+export { TermsPage } from './pages/TermsPage.js';
+export { TrackOrderPage } from './pages/TrackOrderPage.js';
+export { WishlistPage } from './pages/WishlistPage.js';

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

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

package/dist/layouts/shared/wrappers/BookingAgendaLayout.js

@@ -1,22 +1,22 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { createContext, useContext, useState, useEffect, useRef } from 'react';
-import { BookingAgendaSidebar } from '../components/headers/BookingAgendaSidebar';
-import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper';
-import { PageContentLoader } from '../../../components/ui/page-content-loader';
-import { useLoading } from '../../../lib/loading-context';
-import { getThemeColor, getLayoutText } from '../../../lib/utils/asset-helpers';
-import { AlertModalProvider } from '../../../components/ui/alert-modal';
-import { Modal } from '../../../components/ui/modal';
-import { Button } from '../../../components/ui/button';
-import { usePayazaCheckout } from '../../../hooks/use-payaza-checkout';
-import { checkoutService } from '../../../lib/services/checkout.service';
-import { requireCheckoutPayazaPublicKey } from '../../../lib/payaza-public-key';
-import { getOrCreateIdempotencyKey } from '../../../lib/utils/idempotency-key';
-import { CHECKOUT_UNAVAILABLE_MESSAGE } from '../../../lib/checkout-availability';
-import { useToast } from '../../../components/ui/toast';
-import { useAuth } from '../../../lib/auth-context';
-import { filterActiveServices, formatCurrency } from '../../../lib/utils';
+import { BookingAgendaSidebar } from '../components/headers/BookingAgendaSidebar.js';
+import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper.js';
+import { PageContentLoader } from '../../../components/ui/page-content-loader.js';
+import { useLoading } from '../../../lib/loading-context.js';
+import { getThemeColor, getLayoutText } from '../../../lib/utils/asset-helpers.js';
+import { AlertModalProvider } from '../../../components/ui/alert-modal.js';
+import { Modal } from '../../../components/ui/modal.js';
+import { Button } from '../../../components/ui/button.js';
+import { usePayazaCheckout } from '../../../hooks/use-payaza-checkout.js';
+import { checkoutService } from '../../../lib/services/checkout.service.js';
+import { requireCheckoutPayazaPublicKey } from '../../../lib/payaza-public-key.js';
+import { getOrCreateIdempotencyKey } from '../../../lib/utils/idempotency-key.js';
+import { CHECKOUT_UNAVAILABLE_MESSAGE } from '../../../lib/checkout-availability.js';
+import { useToast } from '../../../components/ui/toast.js';
+import { useAuth } from '../../../lib/auth-context.js';
+import { filterActiveServices, formatCurrency } from '../../../lib/utils/index.js';
 import { CheckCircle, Sparkles, Lock } from 'lucide-react';
 import { formatDateSafe } from '../../../utils/date.js';
 const BookingContext = createContext(undefined);

package/dist/layouts/shared/wrappers/ClothingLayout.js

@@ -1,13 +1,13 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { StoreHeader } from '../components/StoreHeader';
-import { StoreFooter } from '../components/StoreFooter';
-import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper';
-import { PageContentLoader } from '../../../components/ui/page-content-loader';
-import { useStore } from '../../../lib/store-context';
-import { useLoading } from '../../../lib/loading-context';
-import { getThemeColor } from '../../../lib/utils/asset-helpers';
-import { AlertModalProvider } from '../../../components/ui/alert-modal';
+import { StoreHeader } from '../components/StoreHeader.js';
+import { StoreFooter } from '../components/StoreFooter.js';
+import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper.js';
+import { PageContentLoader } from '../../../components/ui/page-content-loader.js';
+import { useStore } from '../../../lib/store-context.js';
+import { useLoading } from '../../../lib/loading-context.js';
+import { getThemeColor } from '../../../lib/utils/asset-helpers.js';
+import { AlertModalProvider } from '../../../components/ui/alert-modal.js';
 import '../../clothing/styles/clothing.css';
 /** Fashion Hub shell — scoped CSS + theme tokens under data-layout="clothing". */
 export function ClothingLayout({ children, storeConfig }) {

package/dist/layouts/shared/wrappers/ClothingMinimalLayout.js

@@ -1,13 +1,13 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ClothingMinimalHeader } from '../components/headers/ClothingMinimalHeader';
-import { StoreFooter } from '../components/StoreFooter';
-import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper';
-import { PageContentLoader } from '../../../components/ui/page-content-loader';
+import { ClothingMinimalHeader } from '../components/headers/ClothingMinimalHeader.js';
+import { StoreFooter } from '../components/StoreFooter.js';
+import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper.js';
+import { PageContentLoader } from '../../../components/ui/page-content-loader.js';
 import { usePathname } from 'next/navigation';
-import { useLoading } from '../../../lib/loading-context';
-import { getThemeColor } from '../../../lib/utils/asset-helpers';
-import { AlertModalProvider } from '../../../components/ui/alert-modal';
+import { useLoading } from '../../../lib/loading-context.js';
+import { getThemeColor } from '../../../lib/utils/asset-helpers.js';
+import { AlertModalProvider } from '../../../components/ui/alert-modal.js';
 export function ClothingMinimalLayout({ children, storeConfig }) {
     const pathname = usePathname();
     const { isBackendLoading } = useLoading();

package/dist/layouts/shared/wrappers/ElectronicsLayout.js

@@ -1,10 +1,10 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper';
-import { PageContentLoader } from '../../../components/ui/page-content-loader';
-import { useLoading } from '../../../lib/loading-context';
-import { getThemeColor } from '../../../lib/utils/asset-helpers';
-import { AlertModalProvider } from '../../../components/ui/alert-modal';
+import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper.js';
+import { PageContentLoader } from '../../../components/ui/page-content-loader.js';
+import { useLoading } from '../../../lib/loading-context.js';
+import { getThemeColor } from '../../../lib/utils/asset-helpers.js';
+import { AlertModalProvider } from '../../../components/ui/alert-modal.js';
 export function ElectronicsLayout({ children, storeConfig }) {
     const { isBackendLoading } = useLoading();
     // Get theme colors with fallbacks

package/dist/layouts/shared/wrappers/FoodModernLayout.js

@@ -1,12 +1,12 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FoodModernHeader } from '../components/headers/FoodModernHeader';
-import { StoreFooter } from '../components/StoreFooter';
-import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper';
-import { PageContentLoader } from '../../../components/ui/page-content-loader';
+import { FoodModernHeader } from '../components/headers/FoodModernHeader.js';
+import { StoreFooter } from '../components/StoreFooter.js';
+import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper.js';
+import { PageContentLoader } from '../../../components/ui/page-content-loader.js';
 import { usePathname } from 'next/navigation';
-import { useLoading } from '../../../lib/loading-context';
-import { AlertModalProvider } from '../../../components/ui/alert-modal';
+import { useLoading } from '../../../lib/loading-context.js';
+import { AlertModalProvider } from '../../../components/ui/alert-modal.js';
 export function FoodModernLayout({ children, storeConfig }) {
     const pathname = usePathname();
     const { isBackendLoading } = useLoading();

package/dist/layouts/shared/wrappers/MotivationalLayout.js

@@ -1,15 +1,15 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { StoreHeader } from '../components/StoreHeader';
-import { StoreFooter } from '../components/StoreFooter';
-import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper';
-import { PageContentLoader } from '../../../components/ui/page-content-loader';
-import { useStore } from '../../../lib/store-context';
-import { useLoading } from '../../../lib/loading-context';
-import { getThemeColor } from '../../../lib/utils/asset-helpers';
-import { AlertModalProvider } from '../../../components/ui/alert-modal';
+import { StoreHeader } from '../components/StoreHeader.js';
+import { StoreFooter } from '../components/StoreFooter.js';
+import { PageAnimateWrapper } from '../../../components/ui/page-animate-wrapper.js';
+import { PageContentLoader } from '../../../components/ui/page-content-loader.js';
+import { useStore } from '../../../lib/store-context.js';
+import { useLoading } from '../../../lib/loading-context.js';
+import { getThemeColor } from '../../../lib/utils/asset-helpers.js';
+import { AlertModalProvider } from '../../../components/ui/alert-modal.js';
 import { usePathname } from 'next/navigation';
-import { cn } from '../../../lib/utils';
+import { cn } from '../../../lib/utils/index.js';
 export function MotivationalLayout({ children, storeConfig }) {
     const { cartCount } = useStore();
     const { isBackendLoading } = useLoading();