@deneb-ui/ui 2.0.95 → 2.0.96

package/dist/utils/productOptions.d.ts

@@ -1,10 +1,38 @@
-export type MeasurementUnit = 'size' | 'g' | 'kg' | 'mg' | 'ml' | 'l' | 'pcs' | 'pack' | 'oz' | 'lb' | (string & {});
+export type MeasurementUnit = "size" | "g" | "kg" | "mg" | "ml" | "l" | "pcs" | "pack" | "oz" | "lb" | (string & {});
+export interface ProductVariant {
+    id?: string | number;
+    size?: string | number;
+    option?: string | number;
+    color?: string;
+    price?: string | number;
+    cost?: string | number;
+    amount?: string | number;
+    compareAtPrice?: string | number;
+    originalPrice?: string | number;
+    image?: string;
+    imageUrl?: string;
+    photo?: string;
+    sku?: string;
+    inStock?: boolean;
+    [key: string]: unknown;
+}
 export interface ProductOptionInput {
     id?: string | number;
     name?: string;
     title?: string;
     unit?: MeasurementUnit;
     measurement?: string;
+    price?: string | number;
+    cost?: string | number;
+    amount?: string | number;
+    productPrice?: string | number;
+    minPrice?: string | number;
+    maxPrice?: string | number;
+    priceMin?: string | number;
+    priceMax?: string | number;
+    priceRange?: [number | string, number | string] | string;
+    compareAtPrice?: string | number;
+    originalPrice?: string | number;
     optionsLabel?: string;
     options?: (string | number)[];
     optionsText?: string;
@@ -14,61 +42,50 @@ export interface ProductOptionInput {
     colors?: Array<string | {
         name: string;
         hex?: string;
+        image?: string;
+        photo?: string;
+        imageUrl?: string;
     }> | string;
     colorsText?: string;
     colorsLabel?: string;
+    variants?: ProductVariant[];
+    variantPrices?: Record<string, number | string>;
     [key: string]: unknown;
 }
+export interface ResolvedPriceResult {
+    formattedPrice: string;
+    numericPrice: number;
+    isRange: boolean;
+    minPrice: number;
+    maxPrice: number;
+    formattedOriginalPrice?: string;
+    hasVariantPrice: boolean;
+    matchedVariant?: ProductVariant;
+    variantImage?: string;
+}
 export interface ResolvedProductOptions {
-    /**
-     * The detected or specified unit, e.g. "g", "ml", "size", "pcs".
-     */
     unit: string;
-    /**
-     * The user-facing label for the options selector.
-     * e.g. "Net Weight", "Volume", "Available Sizes", "Pack Size".
-     */
     optionsLabel: string;
-    /**
-     * Normalized list of available option values (e.g. ["100g", "250g", "500g"] or ["40", "41", "42"]).
-     */
     options: string[];
-    /**
-     * Default selected option (first option, or empty string).
-     */
     defaultOption: string;
-    /**
-     * Whether this option represents a physical measurement (weight, volume, count).
-     */
     isMeasurement: boolean;
-    /**
-     * Format option for button or badge rendering (e.g. "250g", "50ml", "42").
-     */
     formatOption: (option: string | number) => string;
-    /**
-     * Format option for headline or summary display (e.g. "250g", "50ml", "Size 42").
-     */
     formatSelectedDisplay: (option: string | number) => string;
-    /**
-     * Format an order snippet for WhatsApp or checkout (e.g. "(250g)" or "(Ivory, Size 42)").
-     */
     formatOrderSnippet: (selectedOption?: string | number, selectedColor?: string) => string;
-    /**
-     * Available color names.
-     */
     colors: string[];
-    /**
-     * Color selector label (e.g. "Available Colors").
-     */
+    detailedColors: Array<{
+        name: string;
+        hex?: string;
+        image?: string;
+    }>;
     colorsLabel: string;
-    /**
-     * Default selected color.
-     */
     defaultColor: string;
 }
-/**
- * Universal product option & measurement resolver.
- * Handles footwear/apparel sizes, food/grocery weights (g, kg, mg),
- * liquids/cosmetics volumes (ml, l), and counts (pcs, pack) seamlessly.
- */
+export declare function parsePriceRange(rawPrice: unknown, minOverride?: unknown, maxOverride?: unknown, currency?: string): {
+    isRange: boolean;
+    min: number;
+    max: number;
+    formatted: string;
+};
+export declare function resolveVariantPrice(product?: ProductOptionInput | Record<string, unknown> | null, selectedOption?: string | number, selectedColor?: string, currency?: string): ResolvedPriceResult;
 export declare function resolveProductOptions(product?: ProductOptionInput | Record<string, unknown> | null): ResolvedProductOptions;

package/dist/utils/productOptions.js

@@ -1,10 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.parsePriceRange = parsePriceRange;
+exports.resolveVariantPrice = resolveVariantPrice;
 exports.resolveProductOptions = resolveProductOptions;
+const useCart_1 = require("../cart/useCart");
 function parseList(value) {
-    if (typeof value === 'string') {
+    if (typeof value === "string") {
         return value
-            .split(',')
+            .split(",")
             .map((s) => s.trim())
             .filter(Boolean);
     }
@@ -12,8 +15,8 @@ function parseList(value) {
         return value
             .map((item) => {
             if (item == null)
-                return '';
-            if (typeof item === 'object' && 'name' in item && typeof item.name === 'string') {
+                return "";
+            if (typeof item === "object" && "name" in item && typeof item.name === "string") {
                 return item.name.trim();
             }
             return String(item).trim();
@@ -22,20 +25,209 @@ function parseList(value) {
     }
     return [];
 }
-/**
- * Universal product option & measurement resolver.
- * Handles footwear/apparel sizes, food/grocery weights (g, kg, mg),
- * liquids/cosmetics volumes (ml, l), and counts (pcs, pack) seamlessly.
- */
+function parsePriceRange(rawPrice, minOverride, maxOverride, currency = "LKR") {
+    let min = (0, useCart_1.parseNumericPrice)(minOverride);
+    let max = (0, useCart_1.parseNumericPrice)(maxOverride);
+    if (typeof rawPrice === "string") {
+        const trimmed = rawPrice.trim();
+        if (trimmed.includes("-") || trimmed.includes("–") || trimmed.includes("—") || /\bto\b/i.test(trimmed)) {
+            const parts = trimmed
+                .split(/[-–—]|\bto\b/i)
+                .map((s) => (0, useCart_1.parseNumericPrice)(s))
+                .filter((n) => n > 0);
+            if (parts.length >= 2) {
+                min = Math.min(parts[0], parts[1]);
+                max = Math.max(parts[0], parts[1]);
+            }
+            else if (parts.length === 1 && !min) {
+                min = parts[0];
+            }
+        }
+    }
+    else if (Array.isArray(rawPrice) && rawPrice.length >= 2) {
+        min = (0, useCart_1.parseNumericPrice)(rawPrice[0]);
+        max = (0, useCart_1.parseNumericPrice)(rawPrice[1]);
+    }
+    if (min > 0 && max > 0 && min !== max) {
+        return {
+            isRange: true,
+            min,
+            max,
+            formatted: `${(0, useCart_1.formatCurrency)(min, currency)} – ${(0, useCart_1.formatCurrency)(max, currency)}`,
+        };
+    }
+    const single = min || max || (0, useCart_1.parseNumericPrice)(rawPrice);
+    return {
+        isRange: false,
+        min: single,
+        max: single,
+        formatted: single > 0 ? (0, useCart_1.formatCurrency)(single, currency) : (rawPrice ? String(rawPrice) : ""),
+    };
+}
+function resolveVariantPrice(product, selectedOption, selectedColor, currency = "LKR") {
+    const p = (product || {});
+    const baseRawPrice = p.price ?? p.cost ?? p.amount ?? p.productPrice;
+    const baseOriginalPrice = p.originalPrice ?? p.compareAtPrice;
+    const variants = Array.isArray(p.variants) ? p.variants : [];
+    const variantPrices = p.variantPrices && typeof p.variantPrices === "object" && !Array.isArray(p.variantPrices)
+        ? p.variantPrices
+        : null;
+    const normOption = selectedOption ? String(selectedOption).trim().toLowerCase() : "";
+    const normColor = selectedColor && selectedColor !== "Standard"
+        ? String(selectedColor).trim().toLowerCase()
+        : "";
+    let matchedVariant;
+    if (variants.length > 0 && (normOption || normColor)) {
+        if (normOption && normColor) {
+            matchedVariant = variants.find((v) => {
+                const vOpt = String(v.size || v.option || "").trim().toLowerCase();
+                const vCol = String(v.color || "").trim().toLowerCase();
+                return vOpt === normOption && vCol === normColor;
+            });
+        }
+        if (!matchedVariant && normOption) {
+            matchedVariant = variants.find((v) => {
+                const vOpt = String(v.size || v.option || "").trim().toLowerCase();
+                return vOpt === normOption;
+            });
+        }
+        if (!matchedVariant && normColor) {
+            matchedVariant = variants.find((v) => {
+                const vCol = String(v.color || "").trim().toLowerCase();
+                return vCol === normColor;
+            });
+        }
+    }
+    let variantImage;
+    if (matchedVariant) {
+        variantImage =
+            (typeof matchedVariant.image === "string" && matchedVariant.image) ||
+                (typeof matchedVariant.imageUrl === "string" && matchedVariant.imageUrl) ||
+                (typeof matchedVariant.photo === "string" && matchedVariant.photo) ||
+                undefined;
+    }
+    if (!variantImage && normColor && Array.isArray(p.colors)) {
+        const colorObj = p.colors.find((c) => {
+            if (typeof c === "object" && c && "name" in c) {
+                return String(c.name).trim().toLowerCase() === normColor;
+            }
+            return false;
+        });
+        if (colorObj) {
+            variantImage = colorObj.image || colorObj.imageUrl || colorObj.photo;
+        }
+    }
+    let variantPriceNum = null;
+    let variantOriginalPriceNum = null;
+    if (matchedVariant) {
+        const rawVPrice = matchedVariant.price ?? matchedVariant.cost ?? matchedVariant.amount;
+        if (rawVPrice !== undefined && rawVPrice !== null && String(rawVPrice).trim() !== "") {
+            variantPriceNum = (0, useCart_1.parseNumericPrice)(rawVPrice);
+        }
+        const rawVOriginal = matchedVariant.compareAtPrice ?? matchedVariant.originalPrice;
+        if (rawVOriginal !== undefined && rawVOriginal !== null && String(rawVOriginal).trim() !== "") {
+            variantOriginalPriceNum = (0, useCart_1.parseNumericPrice)(rawVOriginal);
+        }
+    }
+    if (variantPriceNum === null && variantPrices && (normOption || normColor)) {
+        const keysToTry = [
+            `${selectedOption}-${selectedColor}`,
+            `${selectedColor}-${selectedOption}`,
+            String(selectedOption || ""),
+            String(selectedColor || ""),
+        ];
+        for (const key of keysToTry) {
+            if (key && key in variantPrices) {
+                const val = variantPrices[key];
+                const parsed = (0, useCart_1.parseNumericPrice)(val);
+                if (parsed > 0) {
+                    variantPriceNum = parsed;
+                    break;
+                }
+            }
+        }
+    }
+    if (variantPriceNum !== null && variantPriceNum > 0) {
+        return {
+            formattedPrice: (0, useCart_1.formatCurrency)(variantPriceNum, currency),
+            numericPrice: variantPriceNum,
+            isRange: false,
+            minPrice: variantPriceNum,
+            maxPrice: variantPriceNum,
+            formattedOriginalPrice: variantOriginalPriceNum && variantOriginalPriceNum > variantPriceNum
+                ? (0, useCart_1.formatCurrency)(variantOriginalPriceNum, currency)
+                : (baseOriginalPrice ? (typeof baseOriginalPrice === "number" ? (0, useCart_1.formatCurrency)(baseOriginalPrice, currency) : String(baseOriginalPrice)) : undefined),
+            hasVariantPrice: true,
+            matchedVariant,
+            variantImage,
+        };
+    }
+    const allVariantPrices = [];
+    if (variants.length > 0) {
+        variants.forEach((v) => {
+            const pNum = (0, useCart_1.parseNumericPrice)(v.price ?? v.cost ?? v.amount);
+            if (pNum > 0)
+                allVariantPrices.push(pNum);
+        });
+    }
+    else if (variantPrices) {
+        Object.values(variantPrices).forEach((val) => {
+            const pNum = (0, useCart_1.parseNumericPrice)(val);
+            if (pNum > 0)
+                allVariantPrices.push(pNum);
+        });
+    }
+    const explicitMin = p.minPrice ?? p.priceMin ?? (Array.isArray(p.priceRange) ? p.priceRange[0] : undefined);
+    const explicitMax = p.maxPrice ?? p.priceMax ?? (Array.isArray(p.priceRange) ? p.priceRange[1] : undefined);
+    let rangeMin = (0, useCart_1.parseNumericPrice)(explicitMin);
+    let rangeMax = (0, useCart_1.parseNumericPrice)(explicitMax);
+    if (allVariantPrices.length > 1 && (!rangeMin || !rangeMax)) {
+        rangeMin = Math.min(...allVariantPrices);
+        rangeMax = Math.max(...allVariantPrices);
+    }
+    const rangeCheck = parsePriceRange(baseRawPrice, rangeMin || undefined, rangeMax || undefined, currency);
+    const formattedOriginalPrice = baseOriginalPrice
+        ? (typeof baseOriginalPrice === "number"
+            ? (0, useCart_1.formatCurrency)(baseOriginalPrice, currency)
+            : String(baseOriginalPrice))
+        : undefined;
+    return {
+        formattedPrice: rangeCheck.formatted || (baseRawPrice ? String(baseRawPrice) : "LKR 0"),
+        numericPrice: rangeCheck.min || (0, useCart_1.parseNumericPrice)(baseRawPrice),
+        isRange: rangeCheck.isRange,
+        minPrice: rangeCheck.min,
+        maxPrice: rangeCheck.max,
+        formattedOriginalPrice,
+        hasVariantPrice: false,
+        matchedVariant,
+        variantImage,
+    };
+}
 function resolveProductOptions(product) {
     const p = (product || {});
-    // 1. Resolve Colors
     let colors = parseList(p.colorsText);
     if (!colors.length)
         colors = parseList(p.colors);
-    const colorsLabel = (typeof p.colorsLabel === 'string' && p.colorsLabel.trim()) || 'Available Colors';
-    const defaultColor = colors[0] || 'Standard';
-    // 2. Resolve Options / Sizes
+    const colorsLabel = (typeof p.colorsLabel === "string" && p.colorsLabel.trim()) || "Available Colors";
+    const defaultColor = colors[0] || "Standard";
+    const detailedColors = [];
+    if (Array.isArray(p.colors)) {
+        p.colors.forEach((c) => {
+            if (typeof c === "string" && c.trim()) {
+                detailedColors.push({ name: c.trim() });
+            }
+            else if (c && typeof c === "object" && "name" in c) {
+                detailedColors.push({
+                    name: String(c.name).trim(),
+                    hex: typeof c.hex === "string" ? c.hex : undefined,
+                    image: typeof c.image === "string" ? c.image : c.imageUrl || c.photo,
+                });
+            }
+        });
+    }
+    else if (colors.length > 0) {
+        colors.forEach((name) => detailedColors.push({ name }));
+    }
     let options = parseList(p.optionsText);
     if (!options.length)
         options = parseList(p.options);
@@ -43,91 +235,85 @@ function resolveProductOptions(product) {
         options = parseList(p.sizesText);
     if (!options.length)
         options = parseList(p.sizes);
-    if (!options.length && typeof p.measurement === 'string' && p.measurement.trim()) {
+    if (!options.length && typeof p.measurement === "string" && p.measurement.trim()) {
         options = [p.measurement.trim()];
     }
-    // 3. Detect Unit
-    let unit = (typeof p.unit === 'string' ? p.unit.trim().toLowerCase() : '');
+    let unit = (typeof p.unit === "string" ? p.unit.trim().toLowerCase() : "");
     if (!unit) {
-        // Auto-detect unit from options, measurement, or title
         const probe = [
             ...options,
-            typeof p.measurement === 'string' ? p.measurement : '',
-            typeof p.title === 'string' ? p.title : '',
-            typeof p.name === 'string' ? p.name : '',
-        ].join(' ');
+            typeof p.measurement === "string" ? p.measurement : "",
+            typeof p.title === "string" ? p.title : "",
+            typeof p.name === "string" ? p.name : "",
+        ].join(" ");
         if (/\b(\d+)\s*(mg)\b/i.test(probe)) {
-            unit = 'mg';
+            unit = "mg";
         }
         else if (/\b(\d+)\s*(kg)\b/i.test(probe)) {
-            unit = 'kg';
+            unit = "kg";
         }
         else if (/\b(\d+)\s*(g|grams?)\b/i.test(probe)) {
-            unit = 'g';
+            unit = "g";
         }
         else if (/\b(\d+)\s*(ml)\b/i.test(probe)) {
-            unit = 'ml';
+            unit = "ml";
         }
         else if (/\b(\d+)\s*(l|litres?|liters?)\b/i.test(probe)) {
-            unit = 'l';
+            unit = "l";
         }
         else if (/\b(\d+)\s*(pcs|pieces?|pack|packs?|boxes?)\b/i.test(probe)) {
-            unit = 'pcs';
+            unit = "pcs";
         }
         else if (/\b(\d+)\s*(oz|fl\s*oz)\b/i.test(probe)) {
-            unit = 'oz';
+            unit = "oz";
         }
         else if (/\b(\d+)\s*(lb|lbs)\b/i.test(probe)) {
-            unit = 'lb';
+            unit = "lb";
         }
         else {
-            unit = 'size';
+            unit = "size";
         }
     }
-    const isMeasurement = unit !== 'size';
-    // 4. Resolve Label
-    let optionsLabel = (typeof p.optionsLabel === 'string' && p.optionsLabel.trim()) || '';
-    if (!optionsLabel && typeof p.sizesLabel === 'string' && p.sizesLabel.trim()) {
+    const isMeasurement = unit !== "size";
+    let optionsLabel = (typeof p.optionsLabel === "string" && p.optionsLabel.trim()) || "";
+    if (!optionsLabel && typeof p.sizesLabel === "string" && p.sizesLabel.trim()) {
         optionsLabel = p.sizesLabel.trim();
     }
     if (!optionsLabel) {
         switch (unit) {
-            case 'g':
-            case 'kg':
-            case 'mg':
-            case 'oz':
-            case 'lb':
-                optionsLabel = 'Net Weight';
+            case "g":
+            case "kg":
+            case "mg":
+            case "oz":
+            case "lb":
+                optionsLabel = "Net Weight";
                 break;
-            case 'ml':
-            case 'l':
-                optionsLabel = 'Volume';
+            case "ml":
+            case "l":
+                optionsLabel = "Volume";
                 break;
-            case 'pcs':
-            case 'pack':
-                optionsLabel = 'Pack Size';
+            case "pcs":
+            case "pack":
+                optionsLabel = "Pack Size";
                 break;
-            case 'size':
-                optionsLabel = 'Available Sizes';
+            case "size":
+                optionsLabel = "Available Sizes";
                 break;
             default:
-                optionsLabel = 'Available Options';
+                optionsLabel = "Available Options";
                 break;
         }
     }
-    const defaultOption = options[0] || '';
-    // 5. Formatter helpers
+    const defaultOption = options[0] || "";
     const formatOption = (option) => {
-        const raw = String(option ?? '').trim();
+        const raw = String(option ?? "").trim();
         if (!raw)
-            return '';
-        if (unit === 'size')
+            return "";
+        if (unit === "size")
             return raw;
-        // Check if raw already ends with unit
-        const regex = new RegExp(`\\b(${unit})$`, 'i');
+        const regex = new RegExp(`\\b(${unit})$`, "i");
         if (regex.test(raw))
             return raw;
-        // If pure number and measurement unit
         if (/^\d+(\.\d+)?$/.test(raw)) {
             return `${raw}${unit}`;
         }
@@ -136,8 +322,8 @@ function resolveProductOptions(product) {
     const formatSelectedDisplay = (option) => {
         const formatted = formatOption(option);
         if (!formatted)
-            return '';
-        if (unit === 'size') {
+            return "";
+        if (unit === "size") {
             if (/^size\s+/i.test(formatted))
                 return formatted;
             return `Size ${formatted}`;
@@ -145,8 +331,8 @@ function resolveProductOptions(product) {
         return formatted;
     };
     const formatOrderSnippet = (selectedOption, selectedColor) => {
-        const cleanColor = selectedColor && selectedColor !== 'Standard' ? String(selectedColor).trim() : '';
-        const cleanOption = selectedOption ? formatSelectedDisplay(selectedOption) : '';
+        const cleanColor = selectedColor && selectedColor !== "Standard" ? String(selectedColor).trim() : "";
+        const cleanOption = selectedOption ? formatSelectedDisplay(selectedOption) : "";
         if (cleanColor && cleanOption) {
             return `(${cleanColor}, ${cleanOption})`;
         }
@@ -156,7 +342,7 @@ function resolveProductOptions(product) {
         if (cleanColor) {
             return `(${cleanColor})`;
         }
-        return '';
+        return "";
     };
     return {
         unit,
@@ -168,6 +354,7 @@ function resolveProductOptions(product) {
         formatSelectedDisplay,
         formatOrderSnippet,
         colors,
+        detailedColors,
         colorsLabel,
         defaultColor,
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deneb-ui/ui",
-  "version": "2.0.95",
+  "version": "2.0.96",
   "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.95"
+    "@deneb-ui/core": "^2.0.96"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",