@o2vend/theme-cli 1.0.36 → 1.0.38

package/lib/lib/widget-service.js

@@ -147,9 +147,17 @@ class WidgetService {
       widget.settings.subtitle = widget.subtitle;
     }
 
-    // Store content
-    widget.data.content = parsedContent;
-    widget.content = parsedContent; // Legacy support
+    // Store content: only overwrite when we have parsed content from widget.content; otherwise preserve existing data.content (e.g. mock data with Items)
+    const hasParsedContent = parsedContent && typeof parsedContent === 'object' && (Array.isArray(parsedContent) ? parsedContent.length > 0 : Object.keys(parsedContent).length > 0);
+    if (hasParsedContent) {
+      widget.data.content = parsedContent;
+      widget.content = parsedContent;
+    } else if (widget.data && typeof widget.data.content === 'undefined') {
+      widget.data.content = {};
+    }
+    if (widget.data.content && !widget.content) {
+      widget.content = widget.data.content; // Legacy support
+    }
 
     // Handle HtmlContent
     if (widget.htmlContent !== undefined && widget.htmlContent !== null && widget.htmlContent !== '') {
@@ -332,7 +340,7 @@ class WidgetService {
    * @returns {Promise<Object>} Widgets organized by section { header:[], hero:[], content:[], footer:[] }
    */
   async fetchPageWidgets(pageId) {
-    const validPageIds = ['home', 'product', 'category', 'products', 'categories', 'brand', 'checkout'];
+    const validPageIds = ['home', 'product', 'category', 'products', 'categories', 'brand', 'cart', 'checkout'];
     if (!pageId || !validPageIds.includes(pageId)) {
       console.warn(`[WidgetService] Invalid pageId: ${pageId}, returning empty widgets`);
       return { header: [], hero: [], content: [], footer: [] };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@o2vend/theme-cli",
-  "version": "1.0.36",
+  "version": "1.0.38",
   "description": "O2VEND Theme Development CLI - Standalone tool for local theme development",
   "bin": {
     "o2vend": "./bin/o2vend"
@@ -46,7 +46,7 @@
     "table": "^6.8.3"
   },
   "engines": {
-    "node": ">=18.0.0"
+    "node": ">=24.0.0"
   },
   "files": [
     "bin/**/*",

package/test-theme/assets/async-sections.js

@@ -3,7 +3,7 @@
  * Loads non-critical page sections asynchronously to improve initial page load time
  */
 
-(function() {
+(() => {
   'use strict';
 
   const AsyncSectionLoader = {
@@ -18,17 +18,13 @@
      */
     init(sectionsConfig) {
       this.config = sectionsConfig || {};
-      console.log('[AsyncSectionLoader] Initializing with config:', this.config);
       
       // Find all async sections in the page
       const asyncSections = document.querySelectorAll('[data-async-section]');
       
       if (asyncSections.length === 0) {
-        console.log('[AsyncSectionLoader] No async sections found');
         return;
       }
-
-      console.log(`[AsyncSectionLoader] Found ${asyncSections.length} async sections`);
       
       // Load each section
       asyncSections.forEach(section => {
@@ -45,12 +41,9 @@
       const sectionConfig = this.config[sectionName];
 
       if (!sectionConfig) {
-        console.warn(`[AsyncSectionLoader] No config found for section: ${sectionName}`);
         return;
       }
 
-      console.log(`[AsyncSectionLoader] Loading section: ${sectionName}`);
-
       try {
         // Get data from API
         const data = await this.fetchSectionData(
@@ -84,12 +77,10 @@
 
       // Check cache first
       if (this.cache.has(url)) {
-        console.log(`[AsyncSectionLoader] Using cached data for: ${url}`);
         return this.cache.get(url);
       }
 
       try {
-        console.log(`[AsyncSectionLoader] Fetching: ${url} (attempt ${attempt})`);
         
         const response = await fetch(url, {
           method: 'GET',
@@ -113,7 +104,6 @@
       } catch (error) {
         // Retry logic
         if (attempt < this.retryAttempts) {
-          console.warn(`[AsyncSectionLoader] Retry ${attempt}/${this.retryAttempts} for ${url}`);
           await this.delay(this.retryDelay * attempt);
           return this.fetchSectionData(endpoint, params, attempt + 1);
         }
@@ -129,8 +119,6 @@
      * @param {string} sectionName - Section name
      */
     renderSection(sectionElement, data, sectionName) {
-      console.log(`[AsyncSectionLoader] Rendering section: ${sectionName}`, data);
-
       // Different rendering strategies based on section type
       switch (sectionName) {
         case 'products':
@@ -145,7 +133,6 @@
           this.renderRelatedProducts(sectionElement, data);
           break;
         default:
-          console.warn(`[AsyncSectionLoader] Unknown section type: ${sectionName}`);
           this.renderGenericSection(sectionElement, data);
       }
 
@@ -241,17 +228,42 @@
     renderProductCard(product, variant = 'default') {
       const imageUrl = product.images?.[0] || product.thumbnailImage || product.image || '/assets/default/placeholder-product.png';
       const price = this.formatPrice(product.prices?.priceString || product.prices?.price || product.price);
+      const priceString = product.prices?.priceString || price;
+      const showCallForPricing = (
+        product.showCallForPricing === true || product.showCallForPricing === 'true' || product.showCallForPricing === 1 || product.showCallForPricing === '1' ||
+        product.ShowCallForPricing === true || product.ShowCallForPricing === 'true' || product.ShowCallForPricing === 1 || product.ShowCallForPricing === '1' ||
+        product.isCallForPricing === true || product.isCallForPricing === 'true' || product.isCallForPricing === 1 || product.isCallForPricing === '1' ||
+        product.IsCallForPricing === true || product.IsCallForPricing === 'true' || product.IsCallForPricing === 1 || product.IsCallForPricing === '1'
+      );
       const comparePrice = product.prices?.mrp && product.prices.mrp > product.prices.price 
         ? this.formatPrice(product.prices.mrpString || product.prices.mrp) 
         : null;
       const slug = product.slug || product.handle || product.id;
+      const productUrl = product.url || product.productUrl || slug;
       const available = product.stockQuantity > 0 || product.inStock || product.available !== false;
-      const showSaleBadge = product.prices?.mrp && product.prices.mrp > product.prices.price;
+      const productTypeRaw = product.productType ?? product.type ?? 0;
+      const productType = Number.isNaN(Number(productTypeRaw)) ? 0 : Number(productTypeRaw);
+      const variants = Array.isArray(product.variations)
+        ? product.variations
+        : (Array.isArray(product.variants) ? product.variants : []);
+      const variantsCountRaw = product.variantsCount ?? product.variationCount ?? variants.length ?? 0;
+      const variantsCount = Number.isNaN(Number(variantsCountRaw)) ? 0 : Number(variantsCountRaw);
+      const baseProductId = product.baseProductId || product.productId || product.id;
+      const showSaleBadge = !showCallForPricing && product.prices?.mrp && product.prices.mrp > product.prices.price;
 
       return `
         <div class="product-card" 
-             data-price="${product.prices?.price || product.price}" 
+             data-product-id="${product.productId || product.id}"
+             data-base-product-id="${baseProductId}"
+             data-price="${product.prices?.price ?? product.price ?? 0}" 
+             data-price-string="${this.escapeHtml(priceString)}"
              data-name="${this.escapeHtml((product.name || product.title || '').toLowerCase())}"
+             data-title="${this.escapeHtml(product.name || product.title || '')}"
+             data-product-url="${this.escapeHtml(String(productUrl))}"
+             data-image="${this.escapeHtml(String(imageUrl))}"
+             data-show-call-for-pricing="${showCallForPricing ? 'true' : 'false'}"
+             data-product-type="${productType}"
+             data-variants-count="${variantsCount}"
              data-availability="${available ? 'in-stock' : 'out-of-stock'}"
              data-brand="${this.escapeHtml((product.brandName || product.vendor || '').toLowerCase())}">
           
@@ -292,8 +304,8 @@
             </h3>
             
             <div class="product-price">
-              <span class="product-price-current">${price}</span>
-              ${comparePrice ? `<span class="product-price-original">${comparePrice}</span>` : ''}
+              <span class="product-price-current">${showCallForPricing ? 'Call for pricing' : price}</span>
+              ${(!showCallForPricing && comparePrice) ? `<span class="product-price-original">${comparePrice}</span>` : ''}
             </div>
             
             ${product.shortDescription ? `<p class="product-description">${this.truncate(product.shortDescription, 80)}</p>` : ''}
@@ -321,12 +333,12 @@
           <div class="collection-image-container">
             <img src="${imageUrl}" alt="${this.escapeHtml(collection.title || collection.name)}" loading="lazy">
             <div class="collection-overlay">
-              <a href="/collections/${slug}" class="collection-link">View Collection</a>
+              <a href="/categories/${slug}" class="collection-link">View Collection</a>
             </div>
           </div>
           <div class="collection-content">
             <h3 class="collection-title">
-              <a href="/collections/${slug}">${this.escapeHtml(collection.title || collection.name)}</a>
+              <a href="/categories/${slug}">${this.escapeHtml(collection.title || collection.name)}</a>
             </h3>
             ${collection.description ? `<p class="collection-description">${this.truncate(collection.description, 120)}</p>` : ''}
             <div class="collection-meta">
@@ -341,7 +353,6 @@
      * Render generic section (fallback)
      */
     renderGenericSection(sectionElement, data) {
-      console.log('[AsyncSectionLoader] Using generic renderer for:', data);
       sectionElement.innerHTML = `<pre>${JSON.stringify(data, null, 2)}</pre>`;
     },
 
@@ -394,7 +405,6 @@
         bubbles: true
       });
       sectionElement.dispatchEvent(event);
-      console.log(`[AsyncSectionLoader] Triggered event for: ${sectionName}`);
     },
 
     /**
@@ -440,7 +450,5 @@
   // Make available globally
   window.AsyncSectionLoader = AsyncSectionLoader;
 
-  console.log('[AsyncSectionLoader] Module loaded');
-
 })();
 

package/test-theme/assets/cart-drawer.js

@@ -1,8 +1,6 @@
-;(function(){
-  console.log('[Cart Drawer] Script loaded')
-  
-  function qs(sel, ctx){ return (ctx||document).querySelector(sel) }
-  function qsa(sel, ctx){ return Array.from((ctx||document).querySelectorAll(sel)) }
+;(() => {
+  const qs = (sel, ctx) => (ctx||document).querySelector(sel);
+  const qsa = (sel, ctx) => Array.from((ctx||document).querySelectorAll(sel));
 
   const bodyEl = () => document.body;
   const shopCurrency = () => (bodyEl() && bodyEl().dataset.shopCurrency) || window.__SHOP_CURRENCY__ || 'USD';
@@ -10,7 +8,7 @@
   const shopLocale = () => (bodyEl() && bodyEl().dataset.shopLocale) || window.__SHOP_LOCALE__ || 'en-US';
 
   // Format money helper
-  function formatMoney(amount, currency = shopCurrency()) {
+  const formatMoney = (amount, currency = shopCurrency()) => {
     const locale = shopLocale();
     const value = typeof amount === 'number' ? amount : Number(amount) || 0;
     const currencySymbol = shopCurrencySymbol();
@@ -23,7 +21,7 @@
           currency
         }).format(value);
       } catch (error) {
-        console.warn('Failed to format money with locale/currency', locale, currency, error);
+        // Silently handle formatting errors
       }
     }
 
@@ -36,7 +34,7 @@
     return currencySymbol ? `${currencySymbol}${formattedNumber}` : formattedNumber;
   }
 
-  function resetCheckoutButton() {
+  const resetCheckoutButton = () => {
     const checkoutBtn = qs('#cart-drawer-checkout-btn')
     if (checkoutBtn) {
       checkoutBtn.classList.remove('loading')
@@ -59,7 +57,7 @@
     loadCartData()
   }
 
-  function closeDrawer(){
+  const closeDrawer = () => {
     const drawer = qs('#cart-drawer')
     if(!drawer) return
     drawer.classList.remove('active')
@@ -139,7 +137,7 @@
     }
   }
 
-  async function loadCartData(){
+  const loadCartData = async () => {
     const loading = qs('[data-cart-loading]')
     const empty = qs('[data-cart-empty]')
     const itemsList = qs('[data-cart-items-list]')
@@ -206,7 +204,7 @@
       try {
         variantImage = localStorage.getItem(imageKey);
       } catch (e) {
-        console.warn('Failed to read variant image from localStorage:', e);
+        // Silently handle localStorage read failures
       }
       
       // Use variant image if available, otherwise use API image
@@ -240,7 +238,7 @@
     }).join('')
   }
 
-  function updateCartFooter(cart) {
+  const updateCartFooter = (cart) => {
     const total = qs('[data-cart-total]')
     if (total) {
       total.textContent = formatMoney(cart.total)
@@ -253,7 +251,7 @@
     await syncQuantity(input)
   }
 
-  async function syncQuantity(input){
+  const syncQuantity = async (input) => {
     const productId = input.dataset.productId
     const variantId = input.dataset.variantId
     const quantity = parseInt(input.value, 10)
@@ -295,7 +293,7 @@
   // Flag to prevent multiple simultaneous API calls
   // Use CartManager instead of making direct API calls
   // This prevents duplicate API calls since CartManager handles caching and deduplication
-  function initCartQuantity() {
+  const initCartQuantity = () => {
     // Wait for CartManager to be available
     const checkCartManager = () => {
       if (window.CartManager && typeof window.CartManager.getCartCount === 'function') {
@@ -342,15 +340,15 @@
     runCartQuantityInit()
   }
 
-  document.addEventListener('DOMContentLoaded', function(){
+  document.addEventListener('DOMContentLoaded', () => {
     const toggle = qsa('[data-cart-toggle]')
-    toggle.forEach(t => t.addEventListener('click', function(e){ 
+    toggle.forEach(t => t.addEventListener('click', (e) => { 
       e.preventDefault()
       e.stopPropagation()
       openDrawer() 
     }))
 
-    document.body.addEventListener('click', function(e){
+    document.body.addEventListener('click', (e) => {
       const closeBtn = e.target.closest('[data-cart-close]')
       const overlay = e.target.closest('[data-cart-overlay]')
       if (closeBtn || overlay) {
@@ -359,7 +357,7 @@
       }
     })
 
-    document.body.addEventListener('click', function(e){
+    document.body.addEventListener('click', (e) => {
       const dec = e.target.closest('.qty-btn[data-action="decrease"]')
       const inc = e.target.closest('.qty-btn[data-action="increase"]')
       const removeBtn = e.target.closest('[data-remove-item]')
@@ -377,7 +375,7 @@
       }
     })
 
-    document.body.addEventListener('change', function(e){
+    document.body.addEventListener('change', (e) => {
       const input = e.target.closest('.qty-input')
       if (input) syncQuantity(input)
     })
@@ -390,7 +388,7 @@
         checkoutBtn.dataset.originalText = checkoutBtn.textContent.trim() || 'Check out'
       }
       
-      checkoutBtn.addEventListener('click', function(e) {
+      checkoutBtn.addEventListener('click', (e) => {
         // Prevent multiple clicks
         if (checkoutBtn.classList.contains('loading') || checkoutBtn.disabled) {
           e.preventDefault()
@@ -428,7 +426,7 @@
     // Discount toggle
     const discountToggle = qs('[data-discount-toggle]')
     if (discountToggle) {
-      discountToggle.addEventListener('click', function() {
+      discountToggle.addEventListener('click', () => {
         const content = qs('[data-discount-content]')
         const isExpanded = discountToggle.getAttribute('aria-expanded') === 'true'
         discountToggle.setAttribute('aria-expanded', !isExpanded)
@@ -439,7 +437,7 @@
     }
 
     // Close on Escape key
-    document.addEventListener('keydown', function(e) {
+    document.addEventListener('keydown', (e) => {
       if (e.key === 'Escape') {
         const drawer = qs('#cart-drawer')
         if (drawer && drawer.classList.contains('active')) {

package/test-theme/assets/cart-manager.js

@@ -4,7 +4,7 @@
  * Ensures cart badge updates across all components
  */
 
-(function() {
+(() => {
   'use strict';
 
   const CartManager = {
@@ -55,9 +55,6 @@
       cartToggles.forEach(toggle => {
         toggle.setAttribute('aria-label', `Shopping cart with ${numericCount} item${numericCount !== 1 ? 's' : ''}`);
       });
-      
-      // Debug logging (can be removed in production)
-      console.log('[CartManager] Updated cart badge:', numericCount, 'badges:', countElements.length);
     },
 
     /**
@@ -72,14 +69,12 @@
       if (!forceRefresh && this._cartQuantityCache !== null && this._cacheTimestamp) {
         const cacheAge = now - this._cacheTimestamp;
         if (cacheAge < this._cacheTTL) {
-          console.log('[CartManager] Returning cached cart count:', this._cartQuantityCache);
           return this._cartQuantityCache;
         }
       }
 
       // If already loading, return the existing promise to prevent duplicate calls
       if (this._cartQuantityLoading && this._cartQuantityPromise) {
-        console.log('[CartManager] Cart quantity already loading, returning existing promise');
         return this._cartQuantityPromise;
       }
 
@@ -105,7 +100,6 @@
             // Update cache
             this._cartQuantityCache = count;
             this._cacheTimestamp = Date.now();
-            console.log('[CartManager] Fetched and cached cart count:', count);
             return count;
           }
           
@@ -139,8 +133,6 @@
                 0;
       }
       
-      console.log('[CartManager] Dispatching cart:updated event with count:', count, 'cartData:', cartData);
-      
       const event = new CustomEvent('cart:updated', {
         detail: {
           count: count,
@@ -166,29 +158,24 @@
     invalidateCache() {
       this._cartQuantityCache = null;
       this._cacheTimestamp = null;
-      console.log('[CartManager] Cart quantity cache invalidated');
     },
 
     /**
      * Initialize cart manager and set up event listeners
      */
     init() {
-      console.log('[CartManager] Initializing...');
-      
       // Listen for cart:updated events from external sources
       // Note: dispatchCartUpdated() already calls updateCartBadge() directly,
       // so this listener handles events from other components (like cart-drawer fallback)
       // It's safe to call updateCartBadge() multiple times as it's idempotent
       document.addEventListener('cart:updated', (event) => {
         const count = event.detail.count || 0;
-        console.log('[CartManager] Received cart:updated event with count:', count);
         // updateCartBadge is idempotent, so calling it multiple times is safe
         this.updateCartBadge(count);
       });
 
       // Load initial cart count on page load
       const initCart = () => {
-        console.log('[CartManager] DOM ready, loading initial cart count...');
         this.loadInitialCartCount();
       };
 
@@ -207,7 +194,6 @@
       // Small delay to ensure DOM is ready
       setTimeout(async () => {
         const count = await this.getCartCount();
-        console.log('[CartManager] Loaded initial cart count:', count);
         this.updateCartBadge(count);
       }, 100);
     }

package/test-theme/assets/checkout-price-handler.js

@@ -3,9 +3,18 @@
  * Handles price change detection, polling, and user notifications on the checkout page
  */
 
-(function() {
+(() => {
   'use strict';
 
+  const percentDecode = (s) => {
+    if (typeof s !== 'string') return s || '';
+    try {
+      return s.replace(/\+/g, ' ').replace(/%([0-9A-Fa-f]{2})/g, (_, h) => String.fromCharCode(parseInt(h, 16)));
+    } catch {
+      return s;
+    }
+  };
+
   // Configuration
   const POLL_INTERVAL = 45000; // Poll every 45 seconds
   const PRICE_CHANGE_THRESHOLD = 0.01; // 1 cent threshold for price changes
@@ -36,7 +45,7 @@
     for (let cookie of cookies) {
       const [name, value] = cookie.trim().split('=');
       if (name === 'checkout_token' || name === 'checkoutToken') {
-        return decodeURIComponent(value);
+        return percentDecode(value);
       }
     }
 
@@ -49,7 +58,6 @@
   async function fetchCheckout() {
     const checkoutToken = getCheckoutToken();
     if (!checkoutToken) {
-      console.warn('[PRICE HANDLER] No checkout token found');
       return null;
     }
 
@@ -243,8 +251,6 @@
         checkForPriceChanges();
       }
     }, POLL_INTERVAL);
-
-    console.log('[PRICE HANDLER] Started polling for price changes');
   }
 
   /**
@@ -254,7 +260,6 @@
     if (pollInterval) {
       clearInterval(pollInterval);
       pollInterval = null;
-      console.log('[PRICE HANDLER] Stopped polling for price changes');
     }
   }
 
@@ -291,9 +296,7 @@
    */
   function requestNotificationPermission() {
     if ('Notification' in window && Notification.permission === 'default') {
-      Notification.requestPermission().then(permission => {
-        console.log('[PRICE HANDLER] Notification permission:', permission);
-      });
+      Notification.requestPermission();
     }
   }
 
@@ -350,8 +353,6 @@
 
     // Stop polling when page is about to unload
     window.addEventListener('beforeunload', stopPolling);
-
-    console.log('[PRICE HANDLER] Initialized');
   }
 
   // Initialize when DOM is ready