storefront-layouts-staging 1.0.0-staging.0

package/dist/components/ui/image-with-fallback.js

@@ -0,0 +1,165 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef } from 'react';
+import { cn } from '../../lib/utils/index.js';
+import { ImageSkeleton } from './image-skeleton.js';
+function extractSrcUrl(input) {
+    if (!input)
+        return undefined;
+    if (typeof input === 'string') {
+        const trimmed = input.trim();
+        return trimmed.length > 0 ? trimmed : undefined;
+    }
+    if (typeof input === 'object' && input !== null) {
+        const obj = input;
+        for (const key of ['url', 'src', 'image', 'imageUrl']) {
+            const value = obj[key];
+            if (typeof value === 'string' && value.trim())
+                return value.trim();
+        }
+    }
+    if (Array.isArray(input) && input.length > 0) {
+        return extractSrcUrl(input[0]);
+    }
+    return undefined;
+}
+/** Keeps `[data-payaza-*]` on the clickable wrapper so skeletons/overlays still resolve image targets */
+function partitionDataAttrs(props) {
+    const dataAttrs = {};
+    const imgProps = {};
+    for (const [key, val] of Object.entries(props)) {
+        if (key.startsWith('data-') && val != null && val !== '') {
+            dataAttrs[key] = typeof val === 'string' ? val : String(val);
+        }
+        else if (val !== undefined) {
+            imgProps[key] = val;
+        }
+    }
+    return { dataAttrs, imgProps };
+}
+export function ImageWithFallback({ src, alt, className, fallbackSrc, fallbackText, skeletonAspectRatio = 'square', showSkeletonOnError = true, lazy = false, ...props }) {
+    const { dataAttrs, imgProps } = partitionDataAttrs(props);
+    const initialSrc = extractSrcUrl(src) || extractSrcUrl(fallbackSrc);
+    const [isLoading, setIsLoading] = useState(!!initialSrc && !lazy);
+    const [error, setError] = useState(false);
+    const [currentSrc, setCurrentSrc] = useState(lazy ? undefined : initialSrc);
+    const [isInView, setIsInView] = useState(!lazy);
+    const prevSrcRef = useRef(src);
+    const prevFallbackRef = useRef(fallbackSrc);
+    const hasTriedFallback = useRef(false);
+    const imageRef = useRef(null);
+    const containerRef = useRef(null);
+    const mountedRef = useRef(false);
+    useEffect(() => {
+        mountedRef.current = true;
+        return () => {
+            mountedRef.current = false;
+        };
+    }, []);
+    useEffect(() => {
+        if (!lazy || !containerRef.current || isInView)
+            return;
+        const observer = new IntersectionObserver((entries) => {
+            entries.forEach((entry) => {
+                if (entry.isIntersecting) {
+                    setIsInView(true);
+                    const srcUrl = extractSrcUrl(src) || extractSrcUrl(fallbackSrc);
+                    if (srcUrl) {
+                        setCurrentSrc(srcUrl);
+                        setIsLoading(true);
+                    }
+                    observer.disconnect();
+                }
+            });
+        }, { rootMargin: '100px', threshold: 0.01 });
+        observer.observe(containerRef.current);
+        return () => observer.disconnect();
+    }, [lazy, isInView, src, fallbackSrc]);
+    useEffect(() => {
+        const currentSrcValue = extractSrcUrl(src);
+        const extractedFallback = extractSrcUrl(fallbackSrc);
+        const hasChanged = currentSrcValue !== extractSrcUrl(prevSrcRef.current) ||
+            extractedFallback !== extractSrcUrl(prevFallbackRef.current);
+        if (hasChanged) {
+            const newSrc = currentSrcValue || extractedFallback;
+            setIsLoading(!!newSrc && !lazy);
+            setCurrentSrc(lazy && !isInView ? undefined : newSrc);
+            setError(false);
+            hasTriedFallback.current = false;
+            prevSrcRef.current = src;
+            prevFallbackRef.current = fallbackSrc;
+            if (imageRef.current) {
+                imageRef.current.src = '';
+            }
+        }
+    }, [src, fallbackSrc, lazy, isInView]);
+    const checkAndUpdateImageState = (img, forceCheck = false) => {
+        if (!mountedRef.current || !img)
+            return false;
+        if (img.complete && img.naturalHeight !== 0) {
+            if (forceCheck || isLoading) {
+                setIsLoading(false);
+                setError(false);
+                return true;
+            }
+        }
+        return false;
+    };
+    useEffect(() => {
+        if (!mountedRef.current || !currentSrc || !isLoading)
+            return;
+        const syncLoadedState = () => {
+            if (imageRef.current) {
+                checkAndUpdateImageState(imageRef.current, true);
+            }
+        };
+        syncLoadedState();
+        const rafId = requestAnimationFrame(syncLoadedState);
+        const timeoutId = window.setTimeout(syncLoadedState, 100);
+        return () => {
+            cancelAnimationFrame(rafId);
+            window.clearTimeout(timeoutId);
+        };
+    }, [currentSrc, isLoading]);
+    const handleLoad = () => {
+        if (mountedRef.current) {
+            setIsLoading(false);
+            setError(false);
+        }
+    };
+    const handleError = () => {
+        const extractedFallback = extractSrcUrl(fallbackSrc);
+        if (extractedFallback && !hasTriedFallback.current && currentSrc !== extractedFallback) {
+            hasTriedFallback.current = true;
+            setCurrentSrc(extractedFallback);
+            setError(false);
+            setIsLoading(true);
+            return;
+        }
+        setError(true);
+        setIsLoading(false);
+    };
+    if (!currentSrc || (lazy && !isInView)) {
+        return (_jsx("div", { ref: containerRef, className: cn('relative w-full h-full min-h-[100px]', className), ...dataAttrs, children: _jsx(ImageSkeleton, { className: "absolute inset-0 h-full w-full", aspectRatio: skeletonAspectRatio }) }));
+    }
+    if (isLoading && currentSrc) {
+        return (_jsxs("div", { ref: containerRef, className: cn('relative w-full h-full', className), ...dataAttrs, children: [_jsx("img", { ref: (node) => {
+                        imageRef.current = node;
+                        if (node) {
+                            checkAndUpdateImageState(node, true);
+                        }
+                    }, src: currentSrc, alt: alt || 'Product image', className: "absolute inset-0 h-full w-full opacity-0", onLoad: handleLoad, onError: handleError, loading: "eager", decoding: "async", ...imgProps }), _jsx(ImageSkeleton, { className: "absolute inset-0 h-full w-full", aspectRatio: skeletonAspectRatio })] }));
+    }
+    if (error) {
+        if (showSkeletonOnError && !fallbackText) {
+            return (_jsx("div", { ref: containerRef, className: cn('relative w-full h-full min-h-[100px]', className), ...dataAttrs, children: _jsx(ImageSkeleton, { className: "absolute inset-0 h-full w-full", aspectRatio: skeletonAspectRatio }) }));
+        }
+        return (_jsxs("div", { ref: containerRef, className: cn('flex flex-col items-center justify-center bg-gray-100 text-gray-400 border border-gray-200', className), style: { minHeight: '100px' }, ...dataAttrs, children: [_jsx("svg", { className: "w-1/4 h-1/4 max-w-[48px] max-h-[48px] opacity-20", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" }) }), fallbackText && (_jsx("span", { className: "text-[10px] uppercase tracking-widest font-bold mt-2 opacity-40", children: fallbackText }))] }));
+    }
+    return (_jsx("div", { ref: containerRef, className: "relative w-full h-full", ...dataAttrs, children: _jsx("img", { ref: (node) => {
+                imageRef.current = node;
+                if (node) {
+                    checkAndUpdateImageState(node, true);
+                }
+            }, src: currentSrc, alt: alt || 'Product image', className: cn('h-full w-full object-cover', className), onLoad: handleLoad, onError: handleError, loading: lazy ? 'lazy' : 'eager', decoding: "async", ...imgProps }) }));
+}

package/dist/components/ui/input.d.ts

@@ -0,0 +1,6 @@
+import * as React from "react";
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+}
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+export { Input };
+//# sourceMappingURL=input.d.ts.map

package/dist/components/ui/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/ui/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,WAAW,UACb,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;CAAI;AAE3D,QAAA,MAAM,KAAK,qFAcV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/components/ui/input.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../lib/utils/index.js";
+const Input = React.forwardRef(({ className, type, ...props }, ref) => {
+    return (_jsx("input", { type: type, className: cn("flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50", className), ref: ref, ...props }));
+});
+Input.displayName = "Input";
+export { Input };

package/dist/components/ui/limited-time-offer-badge.d.ts

@@ -0,0 +1,12 @@
+type LimitedOfferProduct = {
+    isLimitedTimeOffer?: boolean;
+    limitedTimeOfferEndsAt?: string | Date | null;
+};
+type LimitedTimeOfferBadgeProps = {
+    product: LimitedOfferProduct;
+    className?: string;
+    compact?: boolean;
+};
+export declare function LimitedTimeOfferBadge({ product, className, compact, }: LimitedTimeOfferBadgeProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=limited-time-offer-badge.d.ts.map

package/dist/components/ui/limited-time-offer-badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"limited-time-offer-badge.d.ts","sourceRoot":"","sources":["../../../src/components/ui/limited-time-offer-badge.tsx"],"names":[],"mappings":"AAQA,KAAK,mBAAmB,GAAG;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,sBAAsB,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;CAC/C,CAAC;AAEF,KAAK,0BAA0B,GAAG;IAChC,OAAO,EAAE,mBAAmB,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,qBAAqB,CAAC,EACpC,OAAO,EACP,SAAS,EACT,OAAe,GAChB,EAAE,0BAA0B,2CAiC5B"}

package/dist/components/ui/limited-time-offer-badge.js

@@ -0,0 +1,13 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../../lib/utils/index.js';
+import { formatLimitedOfferEndsAt, isActiveLimitedTimeOffer, } from '../../lib/limited-time-offer.js';
+export function LimitedTimeOfferBadge({ product, className, compact = false, }) {
+    if (!isActiveLimitedTimeOffer(product))
+        return null;
+    const endsLabel = formatLimitedOfferEndsAt(product.limitedTimeOfferEndsAt);
+    if (compact) {
+        return (_jsx("span", { className: cn('bg-amber-500 text-white text-[10px] font-bold px-2.5 py-1 rounded-full uppercase tracking-wider shadow-sm', className), children: "Limited Offer" }));
+    }
+    return (_jsxs("span", { className: cn('inline-flex flex-wrap items-center gap-x-2 gap-y-1 rounded-full bg-amber-100 text-amber-900 text-xs font-bold px-3 py-1.5', className), children: [_jsx("span", { className: "uppercase tracking-wide", children: "Limited-time offer" }), endsLabel && (_jsxs("span", { className: "font-semibold text-amber-800/80 normal-case tracking-normal", children: ["Ends ", endsLabel] }))] }));
+}

package/dist/components/ui/loading-skeleton-wrapper.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Client component wrapper for Next.js loading.tsx files
+ * Uses pathname to determine which skeleton to show
+ */
+export declare function LoadingSkeletonWrapper(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=loading-skeleton-wrapper.d.ts.map

package/dist/components/ui/loading-skeleton-wrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading-skeleton-wrapper.d.ts","sourceRoot":"","sources":["../../../src/components/ui/loading-skeleton-wrapper.tsx"],"names":[],"mappings":"AAIA;;;GAGG;AACH,wBAAgB,sBAAsB,4CAErC"}

package/dist/components/ui/loading-skeleton-wrapper.js

@@ -0,0 +1,10 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { RouteSkeletonLoader } from './route-skeleton-loader.js';
+/**
+ * Client component wrapper for Next.js loading.tsx files
+ * Uses pathname to determine which skeleton to show
+ */
+export function LoadingSkeletonWrapper() {
+    return _jsx(RouteSkeletonLoader, {});
+}

package/dist/components/ui/modal.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+interface ModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    title?: string;
+    children: React.ReactNode;
+    className?: string;
+}
+export declare function Modal({ isOpen, onClose, title, children, className }: ModalProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=modal.d.ts.map

package/dist/components/ui/modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/ui/modal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,UAAU,UAAU;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,KAAK,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,UAAU,2CAkDhF"}

package/dist/components/ui/modal.js

@@ -0,0 +1,26 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { X } from 'lucide-react';
+import { cn } from '../../lib/utils/index.js';
+import { Button } from './button.js';
+export function Modal({ isOpen, onClose, title, children, className }) {
+    const overlayRef = React.useRef(null);
+    React.useEffect(() => {
+        const handleEscape = (e) => {
+            if (e.key === 'Escape')
+                onClose();
+        };
+        if (isOpen) {
+            document.addEventListener('keydown', handleEscape);
+            document.body.style.overflow = 'hidden';
+        }
+        return () => {
+            document.removeEventListener('keydown', handleEscape);
+            document.body.style.overflow = 'unset';
+        };
+    }, [isOpen, onClose]);
+    if (!isOpen)
+        return null;
+    return (_jsxs("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4", children: [_jsx("div", { ref: overlayRef, className: "absolute inset-0 bg-black/60 backdrop-blur-sm transition-opacity", onClick: onClose }), _jsxs("div", { className: cn("relative bg-white rounded-lg shadow-xl w-full max-w-lg overflow-hidden animate-in fade-in zoom-in-95 duration-200", className), children: [_jsxs("div", { className: "flex items-center justify-between p-4 border-b", children: [_jsx("h3", { className: "text-lg font-semibold", children: title }), _jsx(Button, { variant: "ghost", size: "icon", onClick: onClose, className: "rounded-full", children: _jsx(X, { className: "h-4 w-4" }) })] }), _jsx("div", { className: "p-4", children: children })] })] }));
+}

package/dist/components/ui/otp-input.d.ts

@@ -0,0 +1,10 @@
+interface OtpInputProps {
+    length?: number;
+    value: string;
+    onChange: (value: string) => void;
+    disabled?: boolean;
+    className?: string;
+}
+export declare function OtpInput({ length, value, onChange, disabled, className, }: OtpInputProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=otp-input.d.ts.map

package/dist/components/ui/otp-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"otp-input.d.ts","sourceRoot":"","sources":["../../../src/components/ui/otp-input.tsx"],"names":[],"mappings":"AAGA,UAAU,aAAa;IACrB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,QAAQ,CAAC,EACvB,MAAU,EACV,KAAK,EACL,QAAQ,EACR,QAAgB,EAChB,SAAS,GACV,EAAE,aAAa,2CAkFf"}

package/dist/components/ui/otp-input.js

@@ -0,0 +1,57 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../lib/utils/index.js";
+export function OtpInput({ length = 6, value, onChange, disabled = false, className, }) {
+    const inputRefs = React.useRef([]);
+    const handleChange = (index, e) => {
+        const newValue = e.target.value;
+        if (isNaN(Number(newValue)))
+            return;
+        const newOtp = value.split('');
+        // Handle case where user types multiple characters (some browsers/mobile)
+        const lastChar = newValue.substring(newValue.length - 1);
+        newOtp[index] = lastChar;
+        const result = newOtp.join('').substring(0, length);
+        onChange(result);
+        // Move to next input if value is entered
+        if (newValue && index < length - 1) {
+            inputRefs.current[index + 1]?.focus();
+        }
+    };
+    const handleKeyDown = (index, e) => {
+        if (e.key === 'Backspace') {
+            if (!value[index] && index > 0) {
+                // If empty and backspace pressed, move to previous and delete
+                const newOtp = value.split('');
+                newOtp[index - 1] = '';
+                onChange(newOtp.join(''));
+                inputRefs.current[index - 1]?.focus();
+            }
+            else {
+                // Just delete current
+                const newOtp = value.split('');
+                newOtp[index] = '';
+                onChange(newOtp.join(''));
+            }
+        }
+        else if (e.key === 'ArrowLeft' && index > 0) {
+            inputRefs.current[index - 1]?.focus();
+        }
+        else if (e.key === 'ArrowRight' && index < length - 1) {
+            inputRefs.current[index + 1]?.focus();
+        }
+    };
+    const handlePaste = (e) => {
+        e.preventDefault();
+        const pastedData = e.clipboardData.getData('text/plain').replace(/\D/g, '').slice(0, length);
+        onChange(pastedData);
+        // Focus the last filled input or the first empty one
+        const nextIndex = Math.min(pastedData.length, length - 1);
+        inputRefs.current[nextIndex]?.focus();
+    };
+    return (_jsx("div", { className: cn("flex gap-2 sm:gap-4 justify-center", className), children: Array.from({ length }).map((_, index) => (_jsx("input", { ref: (el) => {
+                inputRefs.current[index] = el;
+            }, type: "text", inputMode: "numeric", maxLength: 1, value: value[index] || '', onChange: (e) => handleChange(index, e), onKeyDown: (e) => handleKeyDown(index, e), onPaste: handlePaste, disabled: disabled, className: cn("w-10 h-12 sm:w-12 sm:h-14 text-center text-2xl font-bold border-2 rounded-lg transition-all bg-background", "focus:outline-none focus:ring-2 focus:ring-primary focus:border-primary focus:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-50", value[index]
+                ? "border-primary text-foreground"
+                : "border-gray-200 text-muted-foreground"), "aria-label": `Digit ${index + 1}`, autoComplete: "one-time-code" }, index))) }));
+}

package/dist/components/ui/out-of-stock-overlay.d.ts

@@ -0,0 +1,8 @@
+interface OutOfStockOverlayProps {
+    className?: string;
+    showBadge?: boolean;
+    badgePosition?: 'top-left' | 'top-right' | 'center' | 'bottom-center';
+}
+export declare function OutOfStockOverlay({ className, showBadge, badgePosition }: OutOfStockOverlayProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=out-of-stock-overlay.d.ts.map

package/dist/components/ui/out-of-stock-overlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"out-of-stock-overlay.d.ts","sourceRoot":"","sources":["../../../src/components/ui/out-of-stock-overlay.tsx"],"names":[],"mappings":"AAIA,UAAU,sBAAsB;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,QAAQ,GAAG,eAAe,CAAC;CACvE;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,SAAgB,EAChB,aAAwB,EACzB,EAAE,sBAAsB,2CA8BxB"}

package/dist/components/ui/out-of-stock-overlay.js

@@ -0,0 +1,12 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../../lib/utils/index.js';
+export function OutOfStockOverlay({ className, showBadge = true, badgePosition = 'center' }) {
+    const badgePositions = {
+        'top-left': 'top-4 left-4',
+        'top-right': 'top-4 right-4',
+        'center': 'top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',
+        'bottom-center': 'bottom-4 left-1/2 -translate-x-1/2',
+    };
+    return (_jsx("div", { className: cn("absolute inset-0 bg-black/40 backdrop-blur-[1px] z-10 flex items-center justify-center", className), "aria-label": "Out of stock", children: showBadge && (_jsx("div", { className: cn("absolute z-20", badgePositions[badgePosition]), children: _jsx("span", { className: "inline-flex items-center px-4 py-2 rounded-full text-sm font-bold bg-red-600 text-white shadow-lg border-2 border-white/50", children: "Out of Stock" }) })) }));
+}

package/dist/components/ui/page-animate-wrapper.d.ts

@@ -0,0 +1,7 @@
+interface PageAnimateWrapperProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export declare function PageAnimateWrapper({ children, className }: PageAnimateWrapperProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=page-animate-wrapper.d.ts.map

package/dist/components/ui/page-animate-wrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-animate-wrapper.d.ts","sourceRoot":"","sources":["../../../src/components/ui/page-animate-wrapper.tsx"],"names":[],"mappings":"AAOA,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,uBAAuB,2CAkBlF"}

package/dist/components/ui/page-animate-wrapper.js

@@ -0,0 +1,13 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { usePathname } from 'next/navigation';
+import { useEffect } from 'react';
+import { cn } from '../../lib/utils/index.js';
+import { scrollToTop } from '../../lib/utils/scroll-to-top.util.js';
+export function PageAnimateWrapper({ children, className }) {
+    const pathname = usePathname();
+    useEffect(() => {
+        scrollToTop();
+    }, [pathname]);
+    return (_jsx("div", { className: cn("animate-fade-in", className), children: children }, pathname));
+}

package/dist/components/ui/page-content-loader.d.ts

@@ -0,0 +1,13 @@
+interface PageContentLoaderProps {
+    className?: string;
+    minHeight?: number;
+    text?: string;
+}
+/**
+ * PageContentLoader component that displays a spinner loader
+ * with minimum height for proper user feedback during backend operations.
+ * Uses fixed positioning to center spinner on viewport regardless of scroll position.
+ */
+export declare function PageContentLoader({ className, minHeight, text }: PageContentLoaderProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=page-content-loader.d.ts.map

package/dist/components/ui/page-content-loader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-content-loader.d.ts","sourceRoot":"","sources":["../../../src/components/ui/page-content-loader.tsx"],"names":[],"mappings":"AAKA,UAAU,sBAAsB;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,SAAe,EACf,IAAI,EACL,EAAE,sBAAsB,2CAYxB"}

package/dist/components/ui/page-content-loader.js

@@ -0,0 +1,12 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../../lib/utils/index.js';
+import { PageLoader } from './page-loader.js';
+/**
+ * PageContentLoader component that displays a spinner loader
+ * with minimum height for proper user feedback during backend operations.
+ * Uses fixed positioning to center spinner on viewport regardless of scroll position.
+ */
+export function PageContentLoader({ className, minHeight = 500, text }) {
+    return (_jsx("div", { className: cn('fixed inset-0 flex items-center justify-center w-full h-full bg-white/95 backdrop-blur-sm z-40', className), style: { minHeight: `${minHeight}px` }, children: _jsx(PageLoader, { size: "lg", text: text }) }));
+}

package/dist/components/ui/page-loader.d.ts

@@ -0,0 +1,20 @@
+interface PageLoaderProps {
+    fullPage?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+    text?: string;
+}
+export declare function PageLoader({ fullPage, size, className, text }: PageLoaderProps): import("react/jsx-runtime").JSX.Element;
+interface InlineLoaderProps {
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+    color?: string;
+}
+export declare function InlineLoader({ size, className, color }: InlineLoaderProps): import("react/jsx-runtime").JSX.Element;
+interface ButtonLoaderProps {
+    className?: string;
+    color?: string;
+}
+export declare function ButtonLoader({ className, color }: ButtonLoaderProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=page-loader.d.ts.map

package/dist/components/ui/page-loader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-loader.d.ts","sourceRoot":"","sources":["../../../src/components/ui/page-loader.tsx"],"names":[],"mappings":"AAyCA,UAAU,eAAe;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAgB,EAChB,IAAW,EACX,SAAS,EACT,IAAI,EACL,EAAE,eAAe,2CAmBjB;AAED,UAAU,iBAAiB;IACzB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,YAAY,CAAC,EAAE,IAAW,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,iBAAiB,2CAQhF;AAED,UAAU,iBAAiB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,iBAAiB,2CAQnE"}

package/dist/components/ui/page-loader.js

@@ -0,0 +1,31 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../../lib/utils/index.js';
+function Spinner({ size = 'md', className, color = 'text-gray-900' }) {
+    const sizeClasses = {
+        sm: 'w-4 h-4',
+        md: 'w-8 h-8',
+        lg: 'w-12 h-12',
+    };
+    const borderClasses = {
+        sm: 'border-2',
+        md: 'border-[3px]',
+        lg: 'border-4',
+    };
+    return (_jsx("div", { className: cn('rounded-full border-solid border-t-transparent border-r-transparent', 'animate-spin', sizeClasses[size], borderClasses[size], color, 'border-l-current border-b-current', className), style: {
+            animationTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
+        } }));
+}
+export function PageLoader({ fullPage = false, size = 'md', className, text }) {
+    const spinner = (_jsxs("div", { className: cn('flex flex-col items-center justify-center gap-3', className), children: [_jsx(Spinner, { size: size, color: "text-gray-900" }), text && (_jsx("p", { className: "text-sm text-gray-600 font-medium animate-pulse", children: text }))] }));
+    if (fullPage) {
+        return (_jsx("div", { className: "fixed inset-0 bg-white/90 backdrop-blur-sm z-50 flex items-center justify-center", children: spinner }));
+    }
+    return spinner;
+}
+export function InlineLoader({ size = 'sm', className, color }) {
+    return (_jsx(Spinner, { size: size, className: className, color: color || 'text-gray-600' }));
+}
+export function ButtonLoader({ className, color }) {
+    return (_jsx(Spinner, { size: "sm", className: className, color: color || 'text-current' }));
+}

package/dist/components/ui/product-card.d.ts

@@ -0,0 +1,11 @@
+import { StoreProduct } from '../../lib/store-types';
+interface ProductCardProps {
+    product: StoreProduct;
+    storeSlug: string;
+    onAddToCart: (product: StoreProduct) => void;
+    onQuickView: (product: StoreProduct) => void;
+    className?: string;
+}
+export declare function ProductCard({ product, storeSlug, onAddToCart, onQuickView, className }: ProductCardProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=product-card.d.ts.map

package/dist/components/ui/product-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/product-card.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAmBjD,UAAU,gBAAgB;IACxB,OAAO,EAAE,YAAY,CAAC;IACtB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC7C,WAAW,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAyPxG"}