@deneb-ui/ui 2.0.100 → 2.0.102

package/dist/EditableCustomerReviews.js

@@ -49,7 +49,7 @@ function EditableCustomerReviews({ sectionPath = 'home', listPath = 'reviews', t
     const liveReviews = (0, SiteDataProvider_1.useReviews)();
     const siteData = (0, SiteDataProvider_1.useSiteData)();
     const contentRecord = (siteData?.content && typeof siteData.content === 'object' ? siteData.content : {});
-    const siteReviews = contentRecord[sectionPath]?.reviews || contentRecord.reviews || (contentRecord.home && typeof contentRecord.home === 'object' ? contentRecord.home.reviews : undefined);
+    const siteReviews = contentRecord[sectionPath]?.[listPath] || contentRecord[listPath] || contentRecord[sectionPath]?.reviews || contentRecord.reviews || (contentRecord.home && typeof contentRecord.home === 'object' ? contentRecord.home.reviews : undefined);
     const rawReviews = (reviews && reviews.length > 0)
         ? reviews
         : (liveReviews && liveReviews.length > 0)

package/dist/EditableFilterSidebar.js

@@ -80,6 +80,6 @@ function EditableFilterSidebar({ basePath = 'filters', categories = ['All', 'Run
                                             return ((0, jsx_runtime_1.jsx)("button", { type: "button", onClick: () => toggleSize(size), "data-preview-static": "filter-size-btn", className: `rounded-lg py-2 text-xs font-semibold transition-all border ${isSelected
                                                     ? 'border-white bg-white text-black'
                                                     : 'border-neutral-800 bg-neutral-800/50 text-neutral-300 hover:border-neutral-700'}`, children: size }, size));
-                                        }) })] })), (0, jsx_runtime_1.jsx)("div", { className: "border-t border-neutral-800/80 pt-6", children: (0, jsx_runtime_1.jsxs)("label", { className: "flex items-center justify-between cursor-pointer group", "data-preview-static": "filter-instock-toggle", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs font-medium text-neutral-300 group-hover:text-white transition-colors", "data-preview-field-path": fieldPath('inStockLabel'), children: inStockLabel }), (0, jsx_runtime_1.jsx)("input", { type: "checkbox", checked: inStockOnly, onChange: toggleInStock, className: "h-4 w-4 rounded border-neutral-700 bg-neutral-800 text-emerald-500 accent-emerald-500 cursor-pointer" })] }) })] })] })] }));
+                                        }) })] })), (0, jsx_runtime_1.jsxs)("div", { className: "border-t border-neutral-800/80 pt-6", children: [(0, jsx_runtime_1.jsx)("h4", { className: "mb-3 text-xs font-semibold uppercase tracking-wider text-neutral-400", "data-preview-field-path": fieldPath('availabilityTitle'), children: availabilityTitle }), (0, jsx_runtime_1.jsxs)("label", { className: "flex items-center justify-between cursor-pointer group", "data-preview-static": "filter-instock-toggle", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs font-medium text-neutral-300 group-hover:text-white transition-colors", "data-preview-field-path": fieldPath('inStockLabel'), children: inStockLabel }), (0, jsx_runtime_1.jsx)("input", { type: "checkbox", checked: inStockOnly, onChange: toggleInStock, className: "h-4 w-4 rounded border-neutral-700 bg-neutral-800 text-emerald-500 accent-emerald-500 cursor-pointer" })] })] })] })] })] }));
 }
 exports.FilterSidebar = EditableFilterSidebar;

package/dist/EditableGrid.js

@@ -38,5 +38,5 @@ function EditableGrid({ as: Component = 'div', id, 'data-preview-list-path': pre
         ...styleVars,
         ...style,
     };
-    return ((0, jsx_runtime_1.jsx)(Component, { "data-preview-list-path": listPath, "data-preview-style-target": stylePath, "data-preview-style-type": "grid", className: `deneb-grid editable-grid ${className}`.trim(), style: gridStyle, ...(dataAttrs || {}), ...props, children: children }));
+    return ((0, jsx_runtime_1.jsx)(Component, { "data-preview-list-path": listPath, "data-preview-static": previewStatic, "data-preview-style-target": stylePath, "data-preview-style-type": "grid", className: `deneb-grid editable-grid ${className}`.trim(), style: gridStyle, ...(dataAttrs || {}), ...props, children: children }));
 }

package/dist/EditablePricingCard.js

@@ -73,6 +73,7 @@ function EditablePricingCard({ itemPath, item, as: Component = 'div', isPopular
                         }) }))] }), (0, jsx_runtime_1.jsx)("div", { style: { marginTop: 'auto', paddingTop: '1rem' }, children: actionSlot ? (actionSlot) : ((0, jsx_runtime_1.jsx)("span", { "data-target-page": ctaTarget, children: (0, jsx_runtime_1.jsx)("button", { type: "button", onClick: () => {
                             if (typeof window !== 'undefined') {
                                 const basePath = (process.env.NEXT_PUBLIC_SITE_BASE_PATH ?? '').replace(/\/$/, '');
+                                // eslint-disable-next-line @next/next/no-location-assign-relative-destination
                                 window.location.href = `${basePath}/${ctaTarget}`;
                             }
                         }, style: {

package/dist/EditableProductCard.d.ts

@@ -88,4 +88,4 @@ export interface EditableProductCardProps extends React.HTMLAttributes<HTMLEleme
     onAddToCart?: (product: ProductItem) => void;
     onWhatsAppClick?: (product: ProductItem, url: string) => void;
 }
-export declare function EditableProductCard({ itemPath, product: productProp, item: itemProp, cardVariant, imageFallback, as: Component, currency, showBrand, showPrice, showDescription, showCategory, whatsappNumber: whatsappNumberProp, whatsappPhone: whatsappPhoneProp, showOptions, allowInteractiveSwatches, storeName, showWhatsAppButton, showAddToCartButton, whatsappActionLabel, addToCartLabel, actionSlot, actionLabel, actionLabelPath, onAddToCart, onWhatsAppClick, className, style, ...props }: EditableProductCardProps): React.JSX.Element;
+export declare function EditableProductCard({ itemPath, product: productProp, item: itemProp, cardVariant, imageFallback, as: Component, currency, showBrand, showPrice, showDescription, showCategory, whatsappNumber: whatsappNumberProp, whatsappPhone: whatsappPhoneProp, storeName, showWhatsAppButton, showAddToCartButton, whatsappActionLabel, addToCartLabel, actionSlot, onAddToCart, onWhatsAppClick, className, style, ...props }: EditableProductCardProps): React.JSX.Element;

package/dist/EditableProductCard.js

@@ -45,8 +45,8 @@ function WhatsAppIcon({ className = '', style = {} }) {
 function CartIcon({ className = '', style = {} }) {
     return ((0, jsx_runtime_1.jsxs)("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: className, style: { display: 'inline-block', verticalAlign: 'middle', flexShrink: 0, ...style }, "aria-hidden": "true", children: [(0, jsx_runtime_1.jsx)("circle", { cx: "9", cy: "21", r: "1" }), (0, jsx_runtime_1.jsx)("circle", { cx: "20", cy: "21", r: "1" }), (0, jsx_runtime_1.jsx)("path", { d: "M1 1h4l2.68 13.39a2 2 0 002 1.61h9.72a2 2 0 002-1.61L23 6H6" })] }));
 }
-function EditableProductCard({ itemPath, product: productProp, item: itemProp, cardVariant = 'modern-glass', imageFallback, as: Component = 'article', currency = 'LKR', showBrand = true, showPrice = true, showDescription = true, showCategory = true, whatsappNumber: whatsappNumberProp, whatsappPhone: whatsappPhoneProp, showOptions, allowInteractiveSwatches, storeName, showWhatsAppButton = true, showAddToCartButton = true, whatsappActionLabel = 'Inquire on WhatsApp', addToCartLabel = 'Add to Cart', actionSlot, actionLabel, actionLabelPath, onAddToCart, onWhatsAppClick, className = '', style, ...props }) {
-    const product = (productProp || itemProp || {});
+function EditableProductCard({ itemPath, product: productProp, item: itemProp, cardVariant = 'modern-glass', imageFallback, as: Component = 'article', currency = 'LKR', showBrand = true, showPrice = true, showDescription = true, showCategory = true, whatsappNumber: whatsappNumberProp, whatsappPhone: whatsappPhoneProp, storeName, showWhatsAppButton = true, showAddToCartButton = true, whatsappActionLabel = 'Inquire on WhatsApp', addToCartLabel = 'Add to Cart', actionSlot, onAddToCart, onWhatsAppClick, className = '', style, ...props }) {
+    const product = (0, react_1.useMemo)(() => (productProp || itemProp || {}), [productProp, itemProp]);
     const whatsappNumber = whatsappPhoneProp || whatsappNumberProp || '94770000000';
     const cart = (0, useCart_1.useOptionalCart)();
     // Dynamic Options, Measurements & Colors resolution
@@ -60,12 +60,12 @@ function EditableProductCard({ itemPath, product: productProp, item: itemProp, c
             setSelectedColor('');
             setColorImage('');
         }
-    }, [product, resolvedOptions.colors]);
+    }, [product, resolvedOptions.colors, selectedColor]);
     (0, react_1.useEffect)(() => {
         if (selectedOption && !resolvedOptions.options.some((o) => o.toLowerCase() === selectedOption.toLowerCase())) {
             setSelectedOption('');
         }
-    }, [product, resolvedOptions.options]);
+    }, [product, resolvedOptions.options, selectedOption]);
     // Variant & Dynamic Price Resolution
     const resolvedPrice = (0, react_1.useMemo)(() => (0, productOptions_1.resolveVariantPrice)(product, selectedOption, selectedColor, currency), [product, selectedOption, selectedColor, currency]);
     const titleKey = 'title' in (product || {}) && !('name' in (product || {}) && product.name)

package/dist/EditableProductDetail.js

@@ -22,14 +22,17 @@ const urls_1 = require("./utils/urls");
  */
 function EditableProductDetail({ sectionPath = 'product', product, sizes, colors, onAddToSelection, whatsappUrl, className = '', style, ...props }) {
     // 1. Resolve Images: Support gallery, images array, and single image fields
+    const productRecord = (product || {});
+    const productPhoto = productRecord.photo;
+    const productThumbnail = productRecord.thumbnail;
     const validImages = (0, react_1.useMemo)(() => {
         const rawList = (product.gallery && product.gallery.length > 0)
             ? product.gallery
             : (product.images && product.images.length > 0)
                 ? product.images
-                : [product.featuredImage || product.imageUrl || product.image || product.photo || product.thumbnail || '/products/vanta-aero-x.jpg'];
+                : [product.featuredImage || product.imageUrl || product.image || productPhoto || productThumbnail || '/products/vanta-aero-x.jpg'];
         return rawList.filter(Boolean);
-    }, [product.gallery, product.images, product.featuredImage, product.imageUrl, product.image, product.photo, product.thumbnail]);
+    }, [product.gallery, product.images, product.featuredImage, product.imageUrl, product.image, productPhoto, productThumbnail]);
     // 2. Resolve Options (Sizes, Volumes, Weights, Counts)
     const resolved = (0, productOptions_1.resolveProductOptions)(product);
     const effectiveOptions = (0, react_1.useMemo)(() => {
@@ -105,7 +108,7 @@ function EditableProductDetail({ sectionPath = 'product', product, sizes, colors
         if (resolvedPrice.variantImage && resolvedPrice.variantImage !== activeImage) {
             setActiveImage(resolvedPrice.variantImage);
         }
-    }, [resolvedPrice.variantImage]);
+    }, [resolvedPrice.variantImage, activeImage]);
     const handleSelectColor = (c) => {
         setSelectedColor(c.name);
         if (c.image) {

package/dist/EditableProductGrid.js

@@ -124,7 +124,7 @@ function EditableProductGrid({ currency = 'LKR', whatsappNumber, whatsappPhone,
         setInternalPage(1);
         setLoadedCount(activePageSize);
         onPageChange?.(1);
-    }, [searchQuery, activeCategory, activePageSize]);
+    }, [searchQuery, activeCategory, activePageSize, onPageChange]);
     const filteredProducts = (0, react_1.useMemo)(() => {
         let result = products;
         // Filter by category

package/dist/EditableProductShowcase.js

@@ -204,8 +204,10 @@ function EditableProductShowcase({ sectionPath = 'home', listPath = 'featuredPho
                                                             e.stopPropagation();
                                                             if (onQuickView)
                                                                 onQuickView(phone, idx);
-                                                            else if (typeof window !== 'undefined')
+                                                            else if (typeof window !== 'undefined') {
+                                                                // eslint-disable-next-line @next/next/no-location-assign-relative-destination
                                                                 window.location.href = detailUrl;
+                                                            }
                                                         }, className: "flex h-9 w-9 items-center justify-center rounded-full border border-black/10 bg-black/[0.02] text-zinc-600 hover:text-cyan-600 hover:border-cyan-400/50 hover:bg-cyan-50/50 transition-all cursor-pointer", title: "Quick View", "aria-label": "Quick View Product", children: (0, jsx_runtime_1.jsxs)("svg", { className: "h-4 w-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: [(0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" }), (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" })] }) })] }), (0, jsx_runtime_1.jsxs)("button", { type: "button", onClick: (e) => handleWhatsAppOrder(phone, activeColor.name, e), className: "w-full flex items-center justify-center gap-2 rounded-2xl bg-gradient-to-r from-cyan-400 via-sky-400 to-blue-600 py-3 px-4 text-xs font-bold text-white shadow-[0_4px_15px_rgba(0,240,255,0.25)] hover:shadow-[0_6px_25px_rgba(0,240,255,0.45)] transition-all hover:scale-[1.01] active:scale-[0.99] cursor-pointer", children: [(0, jsx_runtime_1.jsx)("svg", { className: "h-4 w-4 fill-white", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { d: "M12.031 6.172c-3.181 0-5.767 2.586-5.768 5.766-.001 1.298.38 2.27 1.019 3.287l-.582 2.128 2.182-.573c.978.58 1.911.928 3.145.929 3.178 0 5.767-2.587 5.768-5.766.001-3.187-2.575-5.771-5.764-5.771zm3.392 8.244c-.144.405-.837.774-1.17.824-.312.045-.634.055-.992-.061-.635-.206-1.464-.567-2.527-1.63-1.341-1.341-1.849-2.531-2.006-2.986-.157-.455-.015-.81.212-1.037.202-.202.455-.253.606-.253.152 0 .303.004.436.012.141.008.329-.053.515.394.192.465.657 1.602.714 1.719.057.116.096.253.019.405-.076.152-.114.248-.228.38-.114.133-.24.296-.343.397-.114.114-.233.238-.1.467.133.228.591.976 1.269 1.58 1.077.959 1.83 1.157 2.058 1.271.228.114.362.096.495-.057.133-.152.571-.666.723-.894.152-.228.303-.19.515-.114.212.076 1.346.635 1.575.749.228.114.38.171.436.266.057.095.057.553-.087.958z" }) }), (0, jsx_runtime_1.jsx)("span", { "data-preview-field-path": `${sectionPath}.whatsappOrderLabel`, "data-preview-style-target": `${sectionPath}.whatsappOrderLabel`, "data-preview-style-type": "text", children: whatsappOrderLabel })] })] })] }, phoneId));
                         }) })] })] }));
 }

package/dist/EditableText.js

@@ -91,17 +91,6 @@ exports.FONT_FAMILY_MAP = {
     heading: 'var(--heading-font, Inter, sans-serif)',
     body: 'var(--body-font, Inter, sans-serif)',
 };
-function toCssUnit(value) {
-    if (value === undefined || value === null || value === '')
-        return undefined;
-    const str = String(value).trim();
-    if (!str)
-        return undefined;
-    if (/^-?\d+(\.\d+)?$/.test(str)) {
-        return `${str}px`;
-    }
-    return str;
-}
 /**
  * EditableText provides full typography controls (color, size, weight, line-height, alignment, transform, variants)
  * alongside strict Fivora visual editing bindings.

package/dist/SiteDataProvider.d.ts

@@ -167,3 +167,17 @@ export declare function useCommon(fallback?: GenericRecord): GenericRecord;
  * with robust fallbacks across contact, common, and shop profile.
  */
 export declare function useContact(fallback?: GenericRecord): GenericRecord;
+export interface SyncedBranding {
+    logoUrl: string;
+    websiteTitle: string;
+    brandSubtext: string;
+    slogan: string;
+    faviconUrl: string;
+}
+/**
+ * Universal Synced Branding Hook:
+ * Guarantees real-time live synchronization for brand identity across visual editor preview,
+ * merchant DB profile, and template defaults.
+ * Hierarchy: Visual Editor Edits (content.common) -> Live Merchant Shop Profile -> Template Fallback.
+ */
+export declare function useSyncedBranding(fallback?: Partial<SyncedBranding>): SyncedBranding;

package/dist/SiteDataProvider.js

@@ -29,6 +29,7 @@ exports.useReviews = useReviews;
 exports.isPreviewValidation = isPreviewValidation;
 exports.useCommon = useCommon;
 exports.useContact = useContact;
+exports.useSyncedBranding = useSyncedBranding;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const core_1 = require("@deneb-ui/core");
@@ -1086,3 +1087,37 @@ function useContact(fallback = {}) {
         googleMapLink,
     };
 }
+/**
+ * Universal Synced Branding Hook:
+ * Guarantees real-time live synchronization for brand identity across visual editor preview,
+ * merchant DB profile, and template defaults.
+ * Hierarchy: Visual Editor Edits (content.common) -> Live Merchant Shop Profile -> Template Fallback.
+ */
+function useSyncedBranding(fallback = {}) {
+    const siteData = useSiteData();
+    const content = isRecord(siteData?.content) ? siteData.content : null;
+    const common = isRecord(content?.common) ? content.common : {};
+    const shop = useShop();
+    const websiteTitle = (typeof common.websiteTitle === 'string' && common.websiteTitle.trim()) ||
+        (typeof common.siteName === 'string' && common.siteName.trim()) ||
+        (typeof shop.businessName === 'string' && shop.businessName.trim()) ||
+        (typeof shop.name === 'string' && shop.name.trim()) ||
+        (typeof fallback.websiteTitle === 'string' && fallback.websiteTitle.trim()) ||
+        'Storefront';
+    const logoUrl = (typeof common.logoUrl === 'string' && common.logoUrl.trim()) ||
+        (typeof shop.logoUrl === 'string' && shop.logoUrl.trim()) ||
+        (typeof fallback.logoUrl === 'string' && fallback.logoUrl.trim()) ||
+        '';
+    const brandSubtext = (typeof common.brandSubtext === 'string' && common.brandSubtext.trim()) ||
+        (typeof common.slogan === 'string' && common.slogan.trim()) ||
+        (typeof fallback.brandSubtext === 'string' && fallback.brandSubtext.trim()) ||
+        '';
+    const faviconUrl = logoUrl || fallback.faviconUrl || '';
+    return {
+        logoUrl,
+        websiteTitle,
+        brandSubtext,
+        slogan: brandSubtext,
+        faviconUrl,
+    };
+}

package/dist/ThemeStyles.d.ts

@@ -54,4 +54,4 @@ export interface ThemeStylesProps {
  * Automatically injects standard and custom fivora theme variables into the document.
  * Supports light-only, dark-only, and dual-mode (light & dark toggle) templates.
  */
-export declare function ThemeStyles({ theme, defaultPrimary, defaultSecondary, defaultAccent, defaultBg, defaultText, enableDualMode, }: ThemeStylesProps): React.JSX.Element;
+export declare function ThemeStyles({ theme, enableDualMode, }: ThemeStylesProps): React.JSX.Element;

package/dist/ThemeStyles.js

@@ -213,7 +213,7 @@ function getThemeCssProperties(theme) {
  * Automatically injects standard and custom fivora theme variables into the document.
  * Supports light-only, dark-only, and dual-mode (light & dark toggle) templates.
  */
-function ThemeStyles({ theme, defaultPrimary = '#2563eb', defaultSecondary = '#0f172a', defaultAccent = '#14b8a6', defaultBg = '#ffffff', defaultText = '#0f172a', enableDualMode = true, }) {
+function ThemeStyles({ theme, enableDualMode = true, }) {
     const styleProps = getThemeCssProperties(theme);
     const baseLines = Object.entries(styleProps)
         .filter(([key]) => key.startsWith('--'))

package/dist/hooks/useComponentStyle.js

@@ -6,25 +6,6 @@ exports.useComponentStyle = useComponentStyle;
 const react_1 = require("react");
 const core_1 = require("@deneb-ui/core");
 const SiteDataProvider_1 = require("../SiteDataProvider");
-function getNestedValue(root, dottedPath) {
-    if (!root || !dottedPath)
-        return undefined;
-    const parts = (0, SiteDataProvider_1.parseFieldPath)(dottedPath);
-    let current = root;
-    for (const part of parts) {
-        if (typeof part === 'number') {
-            if (!Array.isArray(current))
-                return undefined;
-            current = current[part];
-        }
-        else {
-            if (!(0, SiteDataProvider_1.isRecord)(current))
-                return undefined;
-            current = current[part];
-        }
-    }
-    return current;
-}
 function resolveComponentStyle(siteData, stylePath, defaults) {
     const stylesTree = (0, SiteDataProvider_1.isRecord)(siteData.styles) ? siteData.styles : {};
     const fromStylesTree = stylesTree[stylePath];

package/dist/hooks/useWhatsAppForm.js

@@ -177,7 +177,7 @@ function useWhatsAppForm(options = {}) {
             return `${resolvedUrl}${separator}text=${encodeURIComponent(message)}`;
         }
         return `https://wa.me/?text=${encodeURIComponent(message)}`;
-    }, [resolvedUrl, options.formatMessage, options.formName, resolvedBusinessName]);
+    }, [resolvedUrl, options, resolvedBusinessName]);
     const dispatchUrl = (0, react_1.useCallback)((url, data) => {
         setIsSubmitting(true);
         setWhatsAppLink(url);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deneb-ui/ui",
-  "version": "2.0.100",
+  "version": "2.0.102",
   "description": "Visual-first React component library for editable commerce storefronts. Built for Next.js and Fivora.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -50,7 +50,7 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "@deneb-ui/core": "^2.0.100"
+    "@deneb-ui/core": "^2.0.102"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",