@tapcart/mobile-components 0.8.56 → 0.8.58

package/dist/components/ui/animate-container.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"animate-container.d.ts","sourceRoot":"","sources":["../../../components/ui/animate-container.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAA;AAG1D,KAAK,aAAa,GAAG,OAAO,GAAG,MAAM,CAAA;AAErC,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,aAAa,EAAE,eAAe,CAW7D,CAAA;AAED,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,UAAU,EAAE,eAAe,EAAE,CAAA;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,UAAU,EACV,QAAc,EACd,SAAS,EACT,SAAS,EACT,OAAO,GACR,EAAE,qBAAqB,2CAgCvB"}
+{"version":3,"file":"animate-container.d.ts","sourceRoot":"","sources":["../../../components/ui/animate-container.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAA;AAG1D,KAAK,aAAa,GAAG,OAAO,GAAG,MAAM,CAAA;AAErC,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,aAAa,EAAE,eAAe,CAW7D,CAAA;AAED,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,UAAU,EAAE,eAAe,EAAE,CAAA;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,UAAU,EACV,QAAc,EACd,SAAS,EACT,SAAS,EACT,OAAO,GACR,EAAE,qBAAqB,2CAmCvB"}

package/dist/components/ui/animate-container.js

@@ -25,6 +25,9 @@ export function AnimateContainer({ children, animations, duration = 300, classNa
             return;
     }, [isLoading, animations]);
     const getAnimationClasses = () => {
+        if (!animations || !Array.isArray(animations)) {
+            return "";
+        }
         return animations
             .map((animation) => (hasData ? animation.enter : animation.exit))
             .join(" ");

package/dist/components/ui/favorite.js

@@ -41,7 +41,7 @@ const favoriteVariants = cva("flex p-2 gap-2 rounded-[4px]", {
     },
 });
 const Favorite = (_a) => {
-    var { className, size = "small", selected = false, onClick, iconUrl = "https://storage.googleapis.com/tapcart-asset-uploads-prod/default-icon-options/Heart_1.svg", showBackground = false, showBackgroundShadow = false, cornerRadius = 4, layoutType = "below-image-on-right", favoriteFillColor = "#D91E18", disabledFillColor = "#727272", backgroundColor = "#FFFFFF", borderSides = ["all"], borderColorStyle = undefined, borderPadding = {}, disableHaptic = false } = _a, props = __rest(_a, ["className", "size", "selected", "onClick", "iconUrl", "showBackground", "showBackgroundShadow", "cornerRadius", "layoutType", "favoriteFillColor", "disabledFillColor", "backgroundColor", "borderSides", "borderColorStyle", "borderPadding", "disableHaptic"]);
+    var { className, size = "small", selected = false, onClick, iconUrl = "https://assets.tapcart.com/default-icon-options/heart-1.svg", showBackground = false, showBackgroundShadow = false, cornerRadius = 4, layoutType = "below-image-on-right", favoriteFillColor = "#D91E18", disabledFillColor = "#727272", backgroundColor = "#FFFFFF", borderSides = ["all"], borderColorStyle = undefined, borderPadding = {}, disableHaptic = false } = _a, props = __rest(_a, ["className", "size", "selected", "onClick", "iconUrl", "showBackground", "showBackgroundShadow", "cornerRadius", "layoutType", "favoriteFillColor", "disabledFillColor", "backgroundColor", "borderSides", "borderColorStyle", "borderPadding", "disableHaptic"]);
     const { action } = useActions();
     const handleClick = (e) => {
         try {

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

@@ -1 +1 @@
-{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../components/ui/icon.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAEL,eAAe,EAwChB,MAAM,qBAAqB,CAAA;AAI5B,QAAA,MAAM,YAAY;;;mFAiBjB,CAAA;AA8DD,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,EACzD,YAAY,CAAC,OAAO,YAAY,CAAC;IACnC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B;AA8KD,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,IAAI,EACJ,IAAW,EACX,KAAK,EACL,GAAG,EACH,SAAS,EACT,kBAAkB,EAClB,WAAW,EACX,WAAW,EACX,cAAc,EACd,GAAG,KAAK,EACT,EAAE,SAAS,2CAoBX;AAED,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,eAAe,EAAE,CAAA"}
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../components/ui/icon.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAEL,eAAe,EAyChB,MAAM,qBAAqB,CAAA;AAI5B,QAAA,MAAM,YAAY;;;mFAiBjB,CAAA;AA+DD,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,EACzD,YAAY,CAAC,OAAO,YAAY,CAAC;IACnC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B;AA8KD,iBAAS,IAAI,CAAC,EACZ,SAAS,EACT,IAAI,EACJ,IAAW,EACX,KAAK,EACL,GAAG,EACH,SAAS,EACT,kBAAkB,EAClB,WAAW,EACX,WAAW,EACX,cAAc,EACd,GAAG,KAAK,EACT,EAAE,SAAS,2CA+BX;AAED,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,eAAe,EAAE,CAAA"}

package/dist/components/ui/icon.js

@@ -13,7 +13,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ReactSVG } from "react-svg";
 import { cva } from "class-variance-authority";
-import { IconUpload, IconPencilMinus, IconPlus, IconMinus, IconAdjustmentsAlt, IconArrowsSort, IconAlertCircle, IconCircleX, IconInfoCircle, IconCheck, IconSquareOff, IconMapPin, IconRepeat, IconSquare, IconSquareCheck, IconChevronUp, IconChevronRight, IconChevronLeft, IconEyeOff, IconSquareX, IconCircle, IconChevronDown, IconHeartFilled, IconCurrencyDollar, IconX, IconCircleOff, IconCircleDotFilled, IconMoodSad, IconSquareXFilled, IconTrash, IconLoader2, IconColumns1, IconColumns2, IconColumns3, IconSearch, IconShoppingCartOff, IconStarFilled, IconShoppingBagPlus, IconShieldCheckFilled, IconShoppingBag, IconHeartCancel, } from "@tabler/icons-react";
+import { IconUpload, IconPencilMinus, IconPlus, IconMinus, IconAdjustmentsAlt, IconArrowsSort, IconAlertCircle, IconCircleX, IconInfoCircle, IconCheck, IconSquareOff, IconMapPin, IconRepeat, IconSquare, IconSquareCheck, IconChevronUp, IconChevronRight, IconChevronLeft, IconEyeOff, IconSquareX, IconCircle, IconChevronDown, IconHeartFilled, IconCurrencyDollar, IconX, IconCircleOff, IconCircleDotFilled, IconMoodSad, IconSquareXFilled, IconTrash, IconLoader2, IconColumns1, IconColumns2, IconColumns3, IconSearch, IconShoppingCartOff, IconStarFilled, IconShoppingBagPlus, IconShieldCheckFilled, IconShoppingBag, IconHeartCancel, IconStar, } from "@tabler/icons-react";
 import { cn, iconColorVariantClasses } from "../../lib/utils";
 const iconVariants = cva("inline-flex items-center justify-center text-sm font-medium  focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none ring-offset-background", {
     variants: {
@@ -86,6 +86,7 @@ const icons = {
     "shopping-bag-plus": IconShoppingBagPlus,
     "shield-check-filled": IconShieldCheckFilled,
     "heart-cancel": IconHeartCancel,
+    star: IconStar,
 };
 const TablerIcon = ({ name, size }) => {
     const IconComponent = icons[name];
@@ -168,6 +169,9 @@ const CustomIcon = ({ url, size, color, strokeColor, strokeWidth, fillColor, fil
 };
 function Icon(_a) {
     var { className, name, size = "md", color, url, fillColor, secondaryFillColor, strokeColor, strokeWidth, fillPercentage } = _a, props = __rest(_a, ["className", "name", "size", "color", "url", "fillColor", "secondaryFillColor", "strokeColor", "strokeWidth", "fillPercentage"]);
-    return (_jsxs("div", Object.assign({ className: cn(iconVariants({ size, color }), className) }, props, { children: [url ? (_jsx(CustomIcon, { url: url, size: size, color: color, fillColor: fillColor, secondaryFillColor: secondaryFillColor, strokeColor: strokeColor, strokeWidth: strokeWidth, fillPercentage: fillPercentage || (color || fillColor ? 1 : 0) })) : (_jsx(TablerIcon, { name: name, size: size })), props.children] })));
+    // For Tabler icons, we need to apply custom colors as inline styles
+    const isCustomColor = color && !iconColorVariantClasses[color];
+    const iconStyle = isCustomColor ? { color } : {};
+    return (_jsxs("div", Object.assign({ className: cn(iconVariants({ size, color: isCustomColor ? undefined : color }), className), style: iconStyle }, props, { children: [url ? (_jsx(CustomIcon, { url: url, size: size, color: color, fillColor: fillColor, secondaryFillColor: secondaryFillColor, strokeColor: strokeColor, strokeWidth: strokeWidth, fillPercentage: fillPercentage || (color || fillColor ? 1 : 0) })) : (_jsx(TablerIcon, { name: name, size: size })), props.children] })));
 }
 export { Icon, iconVariants, IconPencilMinus };

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

@@ -0,0 +1,35 @@
+import * as React from "react";
+declare const InputOTP: React.ForwardRefExoticComponent<(Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "onChange" | "maxLength" | "textAlign" | "onComplete" | "pushPasswordManagerStrategy" | "pasteTransformer" | "containerClassName" | "noScriptCSSFallback"> & {
+    value?: string | undefined;
+    onChange?: ((newValue: string) => unknown) | undefined;
+    maxLength: number;
+    textAlign?: "left" | "right" | "center" | undefined;
+    onComplete?: ((...args: any[]) => unknown) | undefined;
+    pushPasswordManagerStrategy?: "none" | "increase-width" | undefined;
+    pasteTransformer?: ((pasted: string) => string) | undefined;
+    containerClassName?: string | undefined;
+    noScriptCSSFallback?: string | null | undefined;
+} & {
+    render: (props: import("input-otp").RenderProps) => React.ReactNode;
+    children?: undefined;
+} & React.RefAttributes<HTMLInputElement>, "ref"> | Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "onChange" | "maxLength" | "textAlign" | "onComplete" | "pushPasswordManagerStrategy" | "pasteTransformer" | "containerClassName" | "noScriptCSSFallback"> & {
+    value?: string | undefined;
+    onChange?: ((newValue: string) => unknown) | undefined;
+    maxLength: number;
+    textAlign?: "left" | "right" | "center" | undefined;
+    onComplete?: ((...args: any[]) => unknown) | undefined;
+    pushPasswordManagerStrategy?: "none" | "increase-width" | undefined;
+    pasteTransformer?: ((pasted: string) => string) | undefined;
+    containerClassName?: string | undefined;
+    noScriptCSSFallback?: string | null | undefined;
+} & {
+    render?: undefined;
+    children: React.ReactNode;
+} & React.RefAttributes<HTMLInputElement>, "ref">) & React.RefAttributes<HTMLInputElement>>;
+declare const InputOTPGroup: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const InputOTPSlot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    index: number;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const InputOTPSeparator: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };
+//# sourceMappingURL=input-otp.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"input-otp.d.ts","sourceRoot":"","sources":["../../../components/ui/input-otp.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;2FAaZ,CAAA;AAGF,QAAA,MAAM,aAAa,mKAKjB,CAAA;AAGF,QAAA,MAAM,YAAY;WAEiC,MAAM;wCAuBvD,CAAA;AAGF,QAAA,MAAM,iBAAiB,mKAOrB,CAAA;AAGF,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,iBAAiB,EAAE,CAAA"}

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

@@ -0,0 +1,40 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { OTPInput, OTPInputContext } from "input-otp";
+import { Minus } from "lucide-react";
+import { cn } from "../../lib/utils";
+const InputOTP = React.forwardRef((_a, ref) => {
+    var { className, containerClassName } = _a, props = __rest(_a, ["className", "containerClassName"]);
+    return (_jsx(OTPInput, Object.assign({ ref: ref, containerClassName: cn("flex items-center gap-2 has-[:disabled]:opacity-50", containerClassName), className: cn("disabled:cursor-not-allowed", className) }, props)));
+});
+InputOTP.displayName = "InputOTP";
+const InputOTPGroup = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("div", Object.assign({ ref: ref, className: cn("flex items-center", className) }, props)));
+});
+InputOTPGroup.displayName = "InputOTPGroup";
+const InputOTPSlot = React.forwardRef((_a, ref) => {
+    var { index, className } = _a, props = __rest(_a, ["index", "className"]);
+    const inputOTPContext = React.useContext(OTPInputContext);
+    const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
+    return (_jsxs("div", Object.assign({ ref: ref, className: cn("relative flex h-9 w-9 items-center justify-center border-y border-r border-input text-sm shadow-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md", isActive && "z-10 ring-1 ring-ring", className) }, props, { children: [char, hasFakeCaret && (_jsx("div", Object.assign({ className: "pointer-events-none absolute inset-0 flex items-center justify-center" }, { children: _jsx("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" }) })))] })));
+});
+InputOTPSlot.displayName = "InputOTPSlot";
+const InputOTPSeparator = React.forwardRef((_a, ref) => {
+    var props = __rest(_a, []);
+    return (_jsx("div", Object.assign({ ref: ref, role: "separator" }, props, { children: _jsx(Minus, {}) })));
+});
+InputOTPSeparator.displayName = "InputOTPSeparator";
+export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };

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

@@ -25,6 +25,14 @@ type Config = {
         uppercase: boolean;
         textAlignment: string;
         cornerRadius: number;
+        defaultText?: string;
+        defaultTextColor?: string;
+        defaultBackgroundColor?: string;
+        defaultBorderColor?: string;
+        soldOutText?: string;
+        soldOutTextColor?: string;
+        soldOutBackgroundColor?: string;
+        soldOutBorderColor?: string;
     };
     favoritesIcon?: {
         enabled: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"product-card.d.ts","sourceRoot":"","sources":["../../../components/ui/product-card.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"product-card.d.ts","sourceRoot":"","sources":["../../../components/ui/product-card.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/product-card.js

@@ -190,7 +190,12 @@ const ProductCard = ({ config, tapcartData, product, isLoading, favorited, onFav
     const imageSwipeEnabled = ((_e = config.productImage) === null || _e === void 0 ? void 0 : _e.allowSwipeability) && product.images.length > 1;
     return (_jsx("div", Object.assign({ className: cn("w-1/2", className) }, { children: _jsxs("div", Object.assign({ className: "w-full active:opacity-70 cursor-pointer", onClick: () => {
                 _openProduct();
-            } }, { children: [((_f = config.productImage) === null || _f === void 0 ? void 0 : _f.enabled) && (_jsxs("div", Object.assign({ className: "relative w-full overflow-hidden", style: {
+            }, onKeyDown: (e) => {
+                if (e.key === "Enter" || e.key === " ") {
+                    e.preventDefault();
+                    _openProduct();
+                }
+            }, role: "button", tabIndex: 0 }, { children: [((_f = config.productImage) === null || _f === void 0 ? void 0 : _f.enabled) && (_jsxs("div", Object.assign({ className: "relative w-full overflow-hidden", style: {
                         borderTopLeftRadius: `${config.productImage.cornerRadius}px`,
                         borderTopRightRadius: `${config.productImage.cornerRadius}px`,
                         borderBottomLeftRadius: `${((_g = config.quickAdd) === null || _g === void 0 ? void 0 : _g.enabled)
@@ -223,13 +228,35 @@ const ProductCard = ({ config, tapcartData, product, isLoading, favorited, onFav
                                 imageSwipeEnabled,
                             })), selected: favorited, onClick: (e) => {
                                 onFavoriteClick === null || onFavoriteClick === void 0 ? void 0 : onFavoriteClick(e, product);
-                            }, iconUrl: (_q = (_p = config.favoritesIcon) === null || _p === void 0 ? void 0 : _p.icon) === null || _q === void 0 ? void 0 : _q.url, layoutType: (_r = config.favoritesIcon) === null || _r === void 0 ? void 0 : _r.layoutType, showBackground: (_s = config.favoritesIcon) === null || _s === void 0 ? void 0 : _s.showBackground, cornerRadius: (_t = config.favoritesIcon) === null || _t === void 0 ? void 0 : _t.cornerRadius }))] }))), ((_u = config.quickAdd) === null || _u === void 0 ? void 0 : _u.enabled) && (_jsx(Button, Object.assign({ className: "outline-0", style: {
-                        borderBottomLeftRadius: `${config.quickAdd.cornerRadius}px`,
-                        borderBottomRightRadius: `${config.quickAdd.cornerRadius}px`,
-                    }, labelClassName: cn("outline-0 w-full", { uppercase: (_v = config.quickAdd) === null || _v === void 0 ? void 0 : _v.uppercase }, { "text-left": ((_w = config.quickAdd) === null || _w === void 0 ? void 0 : _w.textAlignment) === "left" }, { "text-right": ((_x = config.quickAdd) === null || _x === void 0 ? void 0 : _x.textAlignment) === "right" }, { "text-center": ((_y = config.quickAdd) === null || _y === void 0 ? void 0 : _y.textAlignment) === "center" }), labelStyle: { fontSize: (_z = config.quickAdd) === null || _z === void 0 ? void 0 : _z.fontSize }, variant: "quickadd", size: "default", disabled: product.availableForSale === false, onClick: (e) => {
+                            }, iconUrl: (_q = (_p = config.favoritesIcon) === null || _p === void 0 ? void 0 : _p.icon) === null || _q === void 0 ? void 0 : _q.url, layoutType: (_r = config.favoritesIcon) === null || _r === void 0 ? void 0 : _r.layoutType, showBackground: (_s = config.favoritesIcon) === null || _s === void 0 ? void 0 : _s.showBackground, cornerRadius: (_t = config.favoritesIcon) === null || _t === void 0 ? void 0 : _t.cornerRadius }))] }))), ((_u = config.quickAdd) === null || _u === void 0 ? void 0 : _u.enabled) && (_jsx(Button, Object.assign({ className: "outline-0", style: Object.assign({ borderBottomLeftRadius: `${config.quickAdd.cornerRadius}px`, borderBottomRightRadius: `${config.quickAdd.cornerRadius}px` }, (product.availableForSale
+                        ? {
+                            backgroundColor: config.quickAdd.defaultBackgroundColor || undefined,
+                            borderColor: config.quickAdd.defaultBorderColor || undefined,
+                            color: config.quickAdd.defaultTextColor || undefined,
+                        }
+                        : {
+                            backgroundColor: config.quickAdd.soldOutBackgroundColor || undefined,
+                            borderColor: config.quickAdd.soldOutBorderColor || undefined,
+                            color: config.quickAdd.soldOutTextColor || undefined,
+                        })), labelClassName: cn("outline-0 w-full", { uppercase: (_v = config.quickAdd) === null || _v === void 0 ? void 0 : _v.uppercase }, { "text-left": ((_w = config.quickAdd) === null || _w === void 0 ? void 0 : _w.textAlignment) === "left" }, { "text-right": ((_x = config.quickAdd) === null || _x === void 0 ? void 0 : _x.textAlignment) === "right" }, { "text-center": ((_y = config.quickAdd) === null || _y === void 0 ? void 0 : _y.textAlignment) === "center" }), labelStyle: {
+                        fontSize: (_z = config.quickAdd) === null || _z === void 0 ? void 0 : _z.fontSize,
+                        color: product.availableForSale
+                            ? config.quickAdd.defaultTextColor || undefined
+                            : config.quickAdd.soldOutTextColor || undefined,
+                    }, variant: "quickadd", size: "default", disabled: product.availableForSale === false, onClick: (e) => {
                         e.stopPropagation();
                         onQuickAdd === null || onQuickAdd === void 0 ? void 0 : onQuickAdd(e, product);
-                    } }, { children: _jsxs("div", Object.assign({ className: "flex items-center justify-center gap-2" }, { children: [_jsx(Icon, { name: product.availableForSale ? "plus" : "shopping-cart-off", size: "xs" }), product.availableForSale ? "Quick Add" : "Sold Out"] })) }))), _jsxs("div", Object.assign({ className: "w-full flex-col justify-start items-start gap-0 inline-flex" }, { children: [belowBadge && (_jsx("div", Object.assign({ className: cn("mt-2 w-full flex justify-start", {
+                    } }, { children: _jsxs("div", Object.assign({ className: "flex items-center justify-center gap-2", style: {
+                            color: product.availableForSale
+                                ? config.quickAdd.defaultTextColor || undefined
+                                : config.quickAdd.soldOutTextColor || undefined,
+                        } }, { children: [_jsx(Icon, { name: product.availableForSale ? "plus" : "shopping-cart-off", size: "xs", style: {
+                                    color: product.availableForSale
+                                        ? config.quickAdd.defaultTextColor || undefined
+                                        : config.quickAdd.soldOutTextColor || undefined,
+                                } }), product.availableForSale
+                                ? config.quickAdd.defaultText || "Quick Add"
+                                : config.quickAdd.soldOutText || "Sold Out"] })) }))), _jsxs("div", Object.assign({ className: "w-full flex-col justify-start items-start gap-0 inline-flex" }, { children: [belowBadge && (_jsx("div", Object.assign({ className: cn("mt-2 w-full flex justify-start", {
                                 "justify-end": belowBadge.horizontalPosition === "end",
                             }) }, { children: _jsx(Badge, Object.assign({ size: "plp-layout", alignment: belowBadge.horizontalPosition, icon: belowBadge.image, className: cn("truncate", { rounded: belowBadge.cornerRadius === "rounded" }, { "rounded-none": belowBadge.cornerRadius === "square" }) }, { children: belowBadge.text })) }))), ((_0 = config.productTitle) === null || _0 === void 0 ? void 0 : _0.enabled) && (_jsx("div", Object.assign({ className: "mt-2 w-full" }, { children: _jsx(Text, Object.assign({ type: "body-secondary", className: cn({ uppercase: (_1 = config.productTitle) === null || _1 === void 0 ? void 0 : _1.uppercase }, {
                                     "text-left": ((_2 = config.productTitle) === null || _2 === void 0 ? void 0 : _2.textAlignment) === "left",

package/dist/components/ui/slider.js

@@ -41,7 +41,7 @@ const Slider = React.forwardRef((_a, ref) => {
     const debouncedSliderVal = useDebounce(value, 200);
     return (_jsxs(_Fragment, { children: [_jsx("div", Object.assign({ className: "mt-3 mb-6" }, { children: _jsxs(SliderPrimitive.Root, Object.assign({ ref: ref, className: cn("flex relative h-0.5 w-auto items-center select-none", className), onValueChange: (value) => onChange(value), onValueCommit: (value) => {
                         handleCommit(value);
-                    }, defaultValue: defaultValue, value: value, max: max, min: min, step: step }, props, { children: [_jsx(SliderPrimitive.Track, Object.assign({ className: "relative h-1 rounded w-full grow overflow-hidden bg-coreColors-dividingLines" }, { children: _jsx(SliderPrimitive.Range, { className: "absolute h-full bg-coreColors-brandColorPrimary" }) })), _jsx(SliderPrimitive.Thumb, { className: "block h-4 w-4 rounded-full border-2 border-coreColors-brandColorPrimary bg-coreColors-modalBackground focus-visible:outline-none disabled:pointer-events-none" })] })) })), _jsxs("div", Object.assign({ className: "flex w-auto gap-4 " }, { children: [doubleValue && doubleValue == true ? (_jsxs(_Fragment, { children: [_jsx("div", Object.assign({ className: "w-full px-4 py-2 border bg-coreColors-inputBackground" }, { children: _jsxs("div", Object.assign({ className: "flex flex-col" }, { children: [_jsx("div", Object.assign({ className: "h-4 text-textColors-secondaryColor text-[10px] leading-[13px]" }, { children: "Minimum" })), _jsxs("div", Object.assign({ className: "flex text-textColors-primaryColor text-[14px]" }, { children: ["$", min] }))] })) })), _jsx("div", { className: "w-4 h-0 self-center border-2 bg-coreColors-dividingLines" })] })) : (""), _jsx("div", Object.assign({ className: "w-full px-4 py-2 outline outline-1 outline-coreColors-dividingLines rounded bg-coreColors-inputBackground" }, { children: _jsxs("div", Object.assign({ className: "flex flex-col" }, { children: [_jsx("div", Object.assign({ className: "flex items-center h-4 text-textColors-secondaryColor text-[10px] leading-[13px]" }, { children: "Maximum" })), _jsxs("div", Object.assign({ className: "flex h-6 text-textColors-primaryColor text-[14px] w-full [&>div]:w-full" }, { children: ["$", _jsx(Input, { className: "border-0 p-0 h-full w-full text-[14px]", id: "slider-maximum", value: debouncedSliderVal[0].toString(), placeholder: defaultValue[0].toString(), onChange: (value) => {
+                    }, defaultValue: defaultValue, value: value, max: max, min: min, step: step }, props, { children: [_jsx(SliderPrimitive.Track, Object.assign({ className: "relative h-1 rounded w-full grow overflow-hidden bg-coreColors-dividingLines" }, { children: _jsx(SliderPrimitive.Range, { className: "absolute h-full bg-coreColors-brandColorPrimary" }) })), _jsx(SliderPrimitive.Thumb, { className: "block h-4 w-4 rounded-full border-2 border-coreColors-brandColorPrimary bg-coreColors-modalBackground focus-visible:outline-none disabled:pointer-events-none" })] })) })), _jsxs("div", Object.assign({ className: "flex w-auto gap-4 " }, { children: [doubleValue && doubleValue == true ? (_jsxs(_Fragment, { children: [_jsx("div", Object.assign({ className: "w-full px-4 py-2 border bg-coreColors-inputBackground" }, { children: _jsxs("div", Object.assign({ className: "flex flex-col" }, { children: [_jsx("div", Object.assign({ className: "h-4 text-textColors-secondaryColor text-[10px] leading-[13px]" }, { children: "Minimum" })), _jsxs("div", Object.assign({ className: "flex text-textColors-primaryColor text-[14px]" }, { children: ["$", min] }))] })) })), _jsx("div", { className: "w-4 h-0 self-center border-2 bg-coreColors-dividingLines" })] })) : (""), _jsx("div", Object.assign({ className: "w-full px-4 py-2 outline outline-1 outline-coreColors-dividingLines rounded bg-coreColors-inputBackground" }, { children: _jsxs("div", Object.assign({ className: "flex flex-col" }, { children: [_jsx("div", Object.assign({ className: "flex items-center h-4 text-textColors-secondaryColor text-[10px] leading-[13px]" }, { children: "Maximum" })), _jsxs("div", Object.assign({ className: "flex h-6 text-textColors-primaryColor text-[14px] w-full [&>div]:w-full" }, { children: ["$", _jsx(Input, { className: "border-0 pl-1 pr-0 py-0 h-full w-full text-[14px]", id: "slider-maximum", value: debouncedSliderVal[0].toString(), placeholder: defaultValue[0].toString(), onChange: (value) => {
                                                 const inputValue = Number(value);
                                                 inputValue > max ? onChange([max]) : onChange([inputValue]);
                                             } })] }))] })) }))] }))] }));

package/dist/components/ui/star-rating.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"star-rating.d.ts","sourceRoot":"","sources":["../../../components/ui/star-rating.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC3E,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACpC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,WAAW,GAAG,UAAU,CAAA;CACzC;AAED,QAAA,MAAM,UAAU,wFA2Df,CAAA;AAID,OAAO,EAAE,UAAU,EAAE,CAAA"}
+{"version":3,"file":"star-rating.d.ts","sourceRoot":"","sources":["../../../components/ui/star-rating.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC3E,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACpC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,WAAW,GAAG,UAAU,CAAA;CACzC;AAED,QAAA,MAAM,UAAU,wFAqGf,CAAA;AAID,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/components/ui/star-rating.js

@@ -9,24 +9,44 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../lib/utils";
 import { Icon } from "./icon";
 const StarRating = React.forwardRef((_a, ref) => {
-    var { className, score, iconSize = "sm", iconUrl, filledColor, emptyColor, designOptions } = _a, props = __rest(_a, ["className", "score", "iconSize", "iconUrl", "filledColor", "emptyColor", "designOptions"]);
+    var { className, score, iconSize = "sm", iconUrl, filledColor = "#facc15", // default to yellow-400
+    emptyColor = "#e5e7eb", // default to gray-200
+    designOptions } = _a, props = __rest(_a, ["className", "score", "iconSize", "iconUrl", "filledColor", "emptyColor", "designOptions"]);
+    const getIconProps = (isFilled) => {
+        if (iconUrl) {
+            return { url: iconUrl };
+        }
+        return { name: isFilled ? "star-filled" : "star" };
+    };
     if (designOptions === "condensed") {
-        return _jsx(Icon, { size: iconSize, url: iconUrl, color: filledColor });
+        return (_jsx(Icon, Object.assign({ size: iconSize }, getIconProps(score > 0), { color: score > 0 ? filledColor : emptyColor })));
     }
     return (_jsx("div", Object.assign({ className: cn("flex flex-row gap-1", className), ref: ref }, props, { children: Array.from({ length: 5 }).map((_, index) => {
-            if (score % 1 !== 0 && Math.floor(score) === index) {
-                return (_jsx(Icon, { size: iconSize, url: iconUrl, fillColor: filledColor, secondaryFillColor: emptyColor, fillPercentage: score % 1 }, index));
+            const starNumber = index + 1;
+            if (score >= starNumber) {
+                // Fully filled star
+                return (_jsx(Icon, Object.assign({ size: iconSize }, getIconProps(true), { color: filledColor }), index));
             }
-            else if (index + 1 > score) {
-                return (_jsx(Icon, { size: iconSize, url: iconUrl, color: emptyColor }, index));
+            else if (score > index && score < starNumber) {
+                // Partial star - create overlay effect
+                const fillPercentage = score - index;
+                if (iconUrl) {
+                    // Use fillPercentage for custom icons
+                    return (_jsx(Icon, { size: iconSize, url: iconUrl, fillColor: filledColor, secondaryFillColor: emptyColor, fillPercentage: fillPercentage }, index));
+                }
+                else {
+                    // For Tabler icons, create overlay effect
+                    return (_jsxs("div", Object.assign({ className: "relative" }, { children: [_jsx(Icon, { size: iconSize, name: "star", color: emptyColor }), _jsx("div", Object.assign({ className: "absolute inset-0 overflow-hidden", style: { width: `${fillPercentage * 100}%` } }, { children: _jsx(Icon, { size: iconSize, name: "star-filled", color: filledColor }) }))] }), index));
+                }
             }
             else {
-                return (_jsx(Icon, { size: iconSize, url: iconUrl, color: filledColor }, index));
+                // Empty star
+                return (_jsx(Icon, Object.assign({ size: iconSize }, getIconProps(false), { color: emptyColor }), index));
             }
         }) })));
 });

package/dist/index.d.ts

@@ -83,4 +83,5 @@ export * from "./components/ui/tap";
 export * from "./components/ui/circular-progress";
 export * from "./components/ui/swipeable-list-item";
 export * from "./components/ui/dialog";
+export * from "./components/ui/input-otp";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -85,3 +85,4 @@ export * from "./components/ui/tap";
 export * from "./components/ui/circular-progress";
 export * from "./components/ui/swipeable-list-item";
 export * from "./components/ui/dialog";
+export * from "./components/ui/input-otp";

package/dist/lib/variablesCart.util.d.ts

@@ -1,9 +1,7 @@
 import { CartState, CartCalculatedDiscount, CartCalculatedAppliedGiftCard } from "app-studio-types";
-export declare const getVariablesVariantPrice: ({ variantPrice, variantCompareAtPrice, quantity, currencyCode, sellingPlanAllocation, }: {
-    variantPrice: number;
-    variantCompareAtPrice: number;
+export declare const getSubscriptionPriceDetails: ({ totalAmount, quantity, sellingPlanAllocation, }: {
+    totalAmount?: number | undefined;
     quantity: number;
-    currencyCode: string;
     sellingPlanAllocation?: {
         priceAdjustments: {
             perDeliveryPrice?: number;
@@ -12,9 +10,8 @@ export declare const getVariablesVariantPrice: ({ variantPrice, variantCompareAt
         }[];
     } | undefined;
 }) => {
-    price: number;
+    price: number | undefined;
     compareAtPrice: number;
-    currency: string;
     isSale: boolean;
 };
 export declare const isVariablesOrderLevelDiscount: (code: string, cart: CartState | null) => boolean;

package/dist/lib/variablesCart.util.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"variablesCart.util.d.ts","sourceRoot":"","sources":["../../lib/variablesCart.util.ts"],"names":[],"mappings":"AACA,OAAO,EACL,SAAS,EACT,sBAAsB,EACtB,6BAA6B,EAO9B,MAAM,kBAAkB,CAAA;AAEzB,eAAO,MAAM,wBAAwB;kBAOrB,MAAM;2BACG,MAAM;cACnB,MAAM;kBACF,MAAM;;0BAEA;YAChB,gBAAgB,CAAC,EAAE,MAAM,CAAA;YACzB,KAAK,EAAE,MAAM,CAAA;YACb,cAAc,CAAC,EAAE,MAAM,CAAA;SACxB,EAAE;;;;;;;CA4BN,CAAA;AAyED,eAAO,MAAM,6BAA6B,SAClC,MAAM,QACN,SAAS,GAAG,IAAI,YAUvB,CAAA;AAED,eAAO,MAAM,2BAA2B,SAChC,MAAM,QACN,SAAS,GAAG,IAAI,YAUvB,CAAA;AA2KD,MAAM,MAAM,uBAAuB,GAAG;IACpC,yBAAyB,EAAE,sBAAsB,EAAE,CAAA;IACnD,gBAAgB,EAAE,6BAA6B,EAAE,CAAA;IACjD,cAAc,EAAE,OAAO,CAAA;IACvB,oBAAoB,EAAE,MAAM,CAAA;IAC5B,oBAAoB,EAAE,MAAM,CAAA;IAC5B,WAAW,EAAE,MAAM,CAAA;IACnB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,oBAAoB,EAAE,MAAM,CAAA;IAC5B,gBAAgB,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,iCAAiC,EAAE,uBAU/C,CAAA;AAED,eAAO,MAAM,8BAA8B,SACnC,SAAS,GAAG,IAAI,KACrB,uBAmCF,CAAA"}
+{"version":3,"file":"variablesCart.util.d.ts","sourceRoot":"","sources":["../../lib/variablesCart.util.ts"],"names":[],"mappings":"AACA,OAAO,EACL,SAAS,EACT,sBAAsB,EACtB,6BAA6B,EAO9B,MAAM,kBAAkB,CAAA;AAEzB,eAAO,MAAM,2BAA2B;;cAM5B,MAAM;;0BAEI;YAChB,gBAAgB,CAAC,EAAE,MAAM,CAAA;YACzB,KAAK,EAAE,MAAM,CAAA;YACb,cAAc,CAAC,EAAE,MAAM,CAAA;SACxB,EAAE;;;;;;CAyBN,CAAA;AAyED,eAAO,MAAM,6BAA6B,SAClC,MAAM,QACN,SAAS,GAAG,IAAI,YAUvB,CAAA;AAED,eAAO,MAAM,2BAA2B,SAChC,MAAM,QACN,SAAS,GAAG,IAAI,YAUvB,CAAA;AAkLD,MAAM,MAAM,uBAAuB,GAAG;IACpC,yBAAyB,EAAE,sBAAsB,EAAE,CAAA;IACnD,gBAAgB,EAAE,6BAA6B,EAAE,CAAA;IACjD,cAAc,EAAE,OAAO,CAAA;IACvB,oBAAoB,EAAE,MAAM,CAAA;IAC5B,oBAAoB,EAAE,MAAM,CAAA;IAC5B,WAAW,EAAE,MAAM,CAAA;IACnB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,oBAAoB,EAAE,MAAM,CAAA;IAC5B,gBAAgB,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,iCAAiC,EAAE,uBAU/C,CAAA;AAED,eAAO,MAAM,8BAA8B,SACnC,SAAS,GAAG,IAAI,KACrB,uBAmCF,CAAA"}

package/dist/lib/variablesCart.util.js

@@ -1,28 +1,27 @@
 // @ts-nocheck
 import { DiscountApplicationTargetType, } from "app-studio-types";
-export const getVariablesVariantPrice = ({ variantPrice, variantCompareAtPrice, quantity, currencyCode, sellingPlanAllocation = { priceAdjustments: [] }, }) => {
+export const getSubscriptionPriceDetails = ({ totalAmount, quantity, sellingPlanAllocation = { priceAdjustments: [] }, }) => {
     var _a;
     const isSubscription = ((_a = sellingPlanAllocation === null || sellingPlanAllocation === void 0 ? void 0 : sellingPlanAllocation.priceAdjustments) === null || _a === void 0 ? void 0 : _a.length) > 0;
     if (isSubscription) {
         const { perDeliveryPrice, price, compareAtPrice } = sellingPlanAllocation.priceAdjustments[0];
         const effectivePrice = perDeliveryPrice || price;
         const subscriptionUnitPrice = perDeliveryPrice || 0;
-        const effectiveCompareAtPrice = compareAtPrice || price || 0;
+        const effectiveCompareAtPrice = compareAtPrice * quantity || totalAmount || 0;
         return {
-            price: subscriptionUnitPrice * quantity,
-            compareAtPrice: effectiveCompareAtPrice * quantity,
-            currency: currencyCode,
-            isSale: subscriptionUnitPrice < effectiveCompareAtPrice,
+            price: totalAmount,
+            compareAtPrice: effectiveCompareAtPrice,
+            isSale: totalAmount < subscriptionUnitPrice * quantity,
+        };
+    }
+    else {
+        console.error("No selling plan allocation found");
+        return {
+            price: 0,
+            compareAtPrice: 0,
+            isSale: false,
         };
     }
-    const variantUnitPrice = variantPrice || 0;
-    const variantComparePrice = variantCompareAtPrice || 0;
-    return {
-        price: variantUnitPrice * quantity,
-        compareAtPrice: variantComparePrice * quantity,
-        currency: currencyCode,
-        isSale: variantUnitPrice < variantComparePrice,
-    };
 };
 const getOrderLevelDiscounts = (cart) => {
     // Handle null cart gracefully - the shopping cart state can be null sometimes
@@ -118,40 +117,36 @@ const getAppliedGiftCards = (cart) => {
         });
     });
 };
-const getSalesAmount = (cart) => {
+const getCompareAtPriceDifference = (cart) => {
     var _a;
     // Handle null cart gracefully - the shopping cart state can be null sometimes
     if (!cart)
         return 0;
     return (_a = cart === null || cart === void 0 ? void 0 : cart.items) === null || _a === void 0 ? void 0 : _a.reduce((acc, item) => {
-        var _a, _b;
-        // Get price and compareAtPrice directly from the CartItem
-        const itemPrice = parseFloat(((item === null || item === void 0 ? void 0 : item.price) || 0).toString());
-        const itemCompareAtPrice = parseFloat(((item === null || item === void 0 ? void 0 : item.compareAtPrice) || 0).toString());
-        // Create a custom sellingPlanAllocation if the item has one
-        let customSellingPlanAllocation;
-        if (item === null || item === void 0 ? void 0 : item.sellingPlanAllocation) {
-            customSellingPlanAllocation = {
-                priceAdjustments: (_b = (_a = item === null || item === void 0 ? void 0 : item.sellingPlanAllocation) === null || _a === void 0 ? void 0 : _a.priceAdjustments) === null || _b === void 0 ? void 0 : _b.map((adj) => ({
-                    price: parseFloat(adj.price.amount),
-                    compareAtPrice: adj.compareAtPrice
-                        ? parseFloat(adj.compareAtPrice.amount)
-                        : undefined,
-                    perDeliveryPrice: adj.perDeliveryPrice
-                        ? parseFloat(adj.perDeliveryPrice.amount)
-                        : undefined,
-                })),
-            };
+        var _a, _b, _c, _d, _e, _f;
+        /**
+         * Regular price details
+         */
+        let itemPrice = (item === null || item === void 0 ? void 0 : item.price) || 0;
+        let itemCompareAtPrice = (item === null || item === void 0 ? void 0 : item.compareAtPrice) || 0;
+        /**
+         * Subscription price details
+         */
+        if (((_b = (_a = item === null || item === void 0 ? void 0 : item.sellingPlanAllocation) === null || _a === void 0 ? void 0 : _a.priceAdjustments) === null || _b === void 0 ? void 0 : _b.length) > 0) {
+            itemPrice =
+                ((_d = (_c = item === null || item === void 0 ? void 0 : item.sellingPlanAllocation) === null || _c === void 0 ? void 0 : _c.priceAdjustments[0]) === null || _d === void 0 ? void 0 : _d.perDeliveryPrice) ||
+                    ((_f = (_e = item === null || item === void 0 ? void 0 : item.sellingPlanAllocation) === null || _e === void 0 ? void 0 : _e.priceAdjustments[0]) === null || _f === void 0 ? void 0 : _f.price) ||
+                    0;
+            const { compareAtPrice } = getSubscriptionPriceDetails({
+                quantity: (item === null || item === void 0 ? void 0 : item.quantity) || 1,
+                sellingPlanAllocation: item === null || item === void 0 ? void 0 : item.sellingPlanAllocation,
+            });
+            if (compareAtPrice && compareAtPrice > itemPrice) {
+                itemCompareAtPrice = compareAtPrice;
+            }
         }
-        const { compareAtPrice, price } = getVariablesVariantPrice({
-            quantity: (item === null || item === void 0 ? void 0 : item.quantity) || 1,
-            variantPrice: itemPrice,
-            variantCompareAtPrice: itemCompareAtPrice,
-            currencyCode: (item === null || item === void 0 ? void 0 : item.currencyCode) || "USD",
-            sellingPlanAllocation: customSellingPlanAllocation,
-        });
-        if (compareAtPrice && compareAtPrice > price) {
-            return acc + (compareAtPrice - price);
+        if (itemPrice && itemCompareAtPrice && itemCompareAtPrice > itemPrice) {
+            return (acc + (itemCompareAtPrice * (item === null || item === void 0 ? void 0 : item.quantity) - itemPrice * (item === null || item === void 0 ? void 0 : item.quantity)));
         }
         return acc;
     }, 0);
@@ -200,11 +195,25 @@ const getTotalCompareAtPrice = (cart) => {
     if (!cart)
         return 0;
     return (_a = cart === null || cart === void 0 ? void 0 : cart.items) === null || _a === void 0 ? void 0 : _a.reduce((acc, item) => {
-        // Get compareAtPrice directly from the CartItem
-        const itemCompareAtPrice = item.compareAtPrice ||
-            (item.price ? parseFloat(item.price.toString()) : 0);
-        const quantity = item.quantity || 1;
-        return acc + +itemCompareAtPrice * quantity;
+        var _a, _b;
+        /*
+         * Regular price details
+         */
+        let itemCompareAtPrice = (item === null || item === void 0 ? void 0 : item.compareAtPrice) || (item === null || item === void 0 ? void 0 : item.price) || 0;
+        const quantity = (item === null || item === void 0 ? void 0 : item.quantity) || 1;
+        /**
+         * Subscription price details
+         */
+        if (((_b = (_a = item === null || item === void 0 ? void 0 : item.sellingPlanAllocation) === null || _a === void 0 ? void 0 : _a.priceAdjustments) === null || _b === void 0 ? void 0 : _b.length) > 0) {
+            const { compareAtPrice } = getSubscriptionPriceDetails({
+                quantity: (item === null || item === void 0 ? void 0 : item.quantity) || 1,
+                sellingPlanAllocation: item === null || item === void 0 ? void 0 : item.sellingPlanAllocation,
+            });
+            if (compareAtPrice) {
+                itemCompareAtPrice = compareAtPrice;
+            }
+        }
+        return acc + itemCompareAtPrice * quantity;
     }, 0);
 };
 const getTotalDiscountedPrice = (totalCompareAtPrice, discountsTotalAmount, salesAmount, giftCardsTotalAmount) => {
@@ -224,10 +233,10 @@ const getTotalSavedAmount = (cart) => {
     // Handle null cart gracefully - the shopping cart state can be null sometimes
     if (!cart)
         return 0;
-    const salesAmount = getSalesAmount(cart);
+    const totalCompareAtPriceDifference = getCompareAtPriceDifference(cart);
     const totalDiscountsAmount = getDiscountsTotalAmount(getOrderLevelDiscounts(cart).concat(getLineItemDiscounts(cart)));
     const totalGiftCardsAmount = getGiftCardsTotalAmount(getAppliedGiftCards(cart));
-    const totalSavedAmount = salesAmount + totalDiscountsAmount + totalGiftCardsAmount;
+    const totalSavedAmount = totalCompareAtPriceDifference + totalDiscountsAmount + totalGiftCardsAmount;
     return totalSavedAmount;
 };
 export const DEFAULT_VARIABLES_CALCULATED_DATA = {
@@ -251,7 +260,7 @@ export const getVariablesCalculatedCartData = (cart) => {
     const isFreeShipping = getShippingDiscounts(cart).length > 0;
     const discountsTotalAmount = getDiscountsTotalAmount(orderAndLineItemDiscounts);
     const giftCardsTotalAmount = getGiftCardsTotalAmount(appliedGiftCards);
-    const salesAmount = getSalesAmount(cart);
+    const salesAmount = getCompareAtPriceDifference(cart);
     const totalCompareAtPrice = getTotalCompareAtPrice(cart);
     const totalDiscountedPrice = getTotalDiscountedPrice(totalCompareAtPrice, discountsTotalAmount, salesAmount, giftCardsTotalAmount);
     const totalSavedAmount = getTotalSavedAmount(cart);

package/dist/styles.css

@@ -1152,6 +1152,9 @@ video {
 .w-8 {
   width: 2rem;
 }
+.w-9 {
+  width: 2.25rem;
+}
 .w-\[138px\] {
   width: 138px;
 }
@@ -1181,6 +1184,9 @@ video {
   width: -moz-max-content;
   width: max-content;
 }
+.w-px {
+  width: 1px;
+}
 .min-w-0 {
   min-width: 0px;
 }
@@ -1547,9 +1553,6 @@ video {
 .text-wrap {
   text-wrap: wrap;
 }
-.break-words {
-  overflow-wrap: break-word;
-}
 .break-all {
   word-break: break-all;
 }
@@ -1621,6 +1624,10 @@ video {
 .border-2 {
   border-width: 2px;
 }
+.border-y {
+  border-top-width: 1px;
+  border-bottom-width: 1px;
+}
 .border-y-8 {
   border-top-width: 8px;
   border-bottom-width: 8px;
@@ -1637,6 +1644,9 @@ video {
 .border-l-\[16px\] {
   border-left-width: 16px;
 }
+.border-r {
+  border-right-width: 1px;
+}
 .border-t {
   border-top-width: 1px;
 }
@@ -1736,6 +1746,9 @@ video {
 .bg-coreColors-pageColor {
   background-color: var(--coreColors-pageColor);
 }
+.bg-foreground {
+  background-color: hsl(var(--foreground));
+}
 .bg-gray-300 {
   --tw-bg-opacity: 1;
   background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
@@ -1900,6 +1913,9 @@ video {
 .pl-0 {
   padding-left: 0px;
 }
+.pl-1 {
+  padding-left: 0.25rem;
+}
 .pl-2 {
   padding-left: 0.5rem;
 }
@@ -1912,6 +1928,9 @@ video {
 .pl-8 {
   padding-left: 2rem;
 }
+.pr-0 {
+  padding-right: 0px;
+}
 .pr-1 {
   padding-right: 0.25rem;
 }
@@ -2237,6 +2256,11 @@ video {
   --tw-shadow-colored: calc(var(--buttonColors-secondaryShadowEnabled) * 0px) calc(var(--buttonColors-secondaryShadowEnabled) * 5px) calc(var(--buttonColors-secondaryShadowEnabled) * 25px) calc(var(--buttonColors-secondaryShadowEnabled)* 0px) rgb(0, 0, 0, 0.10);;
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
+.shadow-sm {
+  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
 .shadow-buttonColors-primaryShadow {
   --tw-shadow-color: var(--buttonColors-primaryShadow);
   --tw-shadow: var(--tw-shadow-colored);
@@ -2279,6 +2303,14 @@ video {
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
+.ring-1 {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.ring-ring {
+  --tw-ring-color: hsl(var(--ring));
+}
 .ring-offset-background {
   --tw-ring-offset-color: hsl(var(--background));
 }
@@ -2321,6 +2353,9 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
+.duration-1000 {
+  transition-duration: 1000ms;
+}
 .duration-150 {
   transition-duration: 150ms;
 }
@@ -2356,6 +2391,9 @@ video {
     transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));
   }
 }
+.duration-1000 {
+  animation-duration: 1000ms;
+}
 .duration-150 {
   animation-duration: 150ms;
 }
@@ -2486,6 +2524,20 @@ body::-webkit-scrollbar {
   color: var(--textColors-secondaryColor, #727272ff);
 }
 
+.first\:rounded-l-md:first-child {
+  border-top-left-radius: calc(var(--radius) - 2px);
+  border-bottom-left-radius: calc(var(--radius) - 2px);
+}
+
+.first\:border-l:first-child {
+  border-left-width: 1px;
+}
+
+.last\:rounded-r-md:last-child {
+  border-top-right-radius: calc(var(--radius) - 2px);
+  border-bottom-right-radius: calc(var(--radius) - 2px);
+}
+
 .last\:border-b-0:last-child {
   border-bottom-width: 0px;
 }
@@ -2702,6 +2754,10 @@ body::-webkit-scrollbar {
   opacity: 0.7;
 }
 
+.has-\[\:disabled\]\:opacity-50:has(:disabled) {
+  opacity: 0.5;
+}
+
 .data-\[disabled\]\:pointer-events-none[data-disabled] {
   pointer-events: none;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tapcart/mobile-components",
-  "version": "0.8.56",
+  "version": "0.8.58",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "style": "dist/styles.css",
@@ -81,6 +81,7 @@
     "embla-carousel-autoplay": "8.5.2",
     "embla-carousel-fade": "8.5.2",
     "embla-carousel-react": "^8.3.0",
+    "input-otp": "^1.4.2",
     "lucide-react": "^0.488.0",
     "next": "^14.2.28",
     "next-themes": "^0.2.1",