@tapcart/mobile-components 0.12.6 → 0.12.8

package/dist/components/hooks/use-product-options.d.ts

@@ -4,6 +4,10 @@ export declare function useProductOptions(variants: ProductVariant[] | undefined
     selectedOptions: SelectedOptions;
     handleSelect: (optionName: string, optionValue: string) => void;
     selectedVariant: ProductVariant | undefined;
+    productOptions: {
+        name: string;
+        values: string[];
+    }[];
 };
 export {};
 //# sourceMappingURL=use-product-options.d.ts.map

package/dist/components/hooks/use-product-options.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-product-options.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-product-options.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,KAAK,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAE7C,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,cAAc,EAAE,GAAG,SAAS,GAAG,IAAI,EAC7C,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI;;+BA+DC,MAAM,eAAe,MAAM,KAAG,IAAI;;EAwBrE"}
+{"version":3,"file":"use-product-options.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-product-options.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,KAAK,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAE7C,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,cAAc,EAAE,GAAG,SAAS,GAAG,IAAI,EAC7C,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI;;+BA+DC,MAAM,eAAe,MAAM,KAAG,IAAI;;;;;;EA4CrE"}

package/dist/components/hooks/use-product-options.js

@@ -54,9 +54,27 @@ export function useProductOptions(variants, selectedVariantId) {
         setSelectedOptions(initializeSelectedOptions(selectedVariantId));
     }, [safeVariants, initializeSelectedOptions, selectedVariantId]);
     const selectedVariant = useMemo(() => safeVariants.find((v) => { var _a; return (_a = v.selectedOptions) === null || _a === void 0 ? void 0 : _a.every((o) => selectedOptions[o.name] === o.value); }), [safeVariants, selectedOptions]);
+    const productOptions = useMemo(() => {
+        var _a;
+        const optionsMap = new Map();
+        for (const variant of safeVariants) {
+            for (const { name, value } of (variant === null || variant === void 0 ? void 0 : variant.selectedOptions) || []) {
+                if (!optionsMap.has(name)) {
+                    optionsMap.set(name, new Set());
+                }
+                (_a = optionsMap.get(name)) === null || _a === void 0 ? void 0 : _a.add(value);
+            }
+        }
+        // Convert Map to plain array
+        return Array.from(optionsMap.entries()).map(([name, values]) => ({
+            name,
+            values: Array.from(values),
+        }));
+    }, [safeVariants]);
     return {
         selectedOptions,
         handleSelect,
         selectedVariant,
+        productOptions,
     };
 }

package/dist/components/hooks/use-recommendations.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-recommendations.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-recommendations.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAA;AAOxE,UAAU,sBAAsB;IAE9B,YAAY,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IACxC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAGxC,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACnC,MAAM,EAAE,MAAM,CAAA;CACf;AAUD,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,OAAO,EAAE,CAAA;IACnB,WAAW,EAAE,UAAU,EAAE,CAAA;IACzB,QAAQ,EAAE,MAAM,EAAE,CAAA;IAClB,MAAM,EAAE,GAAG,EAAE,CAAA;IACb,SAAS,EAAE,OAAO,CAAA;IAClB,KAAK,EAAE,GAAG,CAAA;CACX;AAiBD,QAAA,MAAM,kBAAkB,yEASrB,sBAAsB,KAAG,uBAkG3B,CAAA;AAED,OAAO,EAAE,kBAAkB,EAAE,CAAA"}
+{"version":3,"file":"use-recommendations.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-recommendations.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAA;AAOxE,UAAU,sBAAsB;IAE9B,YAAY,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IACxC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAGxC,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACnC,MAAM,EAAE,MAAM,CAAA;CACf;AAUD,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,OAAO,EAAE,CAAA;IACnB,WAAW,EAAE,UAAU,EAAE,CAAA;IACzB,QAAQ,EAAE,MAAM,EAAE,CAAA;IAClB,MAAM,EAAE,GAAG,EAAE,CAAA;IACb,SAAS,EAAE,OAAO,CAAA;IAClB,KAAK,EAAE,GAAG,CAAA;CACX;AAmBD,QAAA,MAAM,kBAAkB,yEASrB,sBAAsB,KAAG,uBAmH3B,CAAA;AAED,OAAO,EAAE,kBAAkB,EAAE,CAAA"}

package/dist/components/hooks/use-recommendations.js

@@ -22,6 +22,7 @@ const getCollections = (collections) => {
         : [];
 };
 const recommendationsLocalStorage = new RecommendationsLocalStorage();
+const MIN_QUERY_LENGTH = 3;
 const useRecommendations = ({ 
 // Search client props
 searchClient, query = "", customSearchConfig, 
@@ -33,6 +34,8 @@ queryVariables, apiURL, }) => {
     const recommendation = usingSearchClient
         ? query
         : (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get("recommendation")) || "";
+    // Check if resolved recommendation meets minimum length requirement
+    const shouldFetch = recommendation.length >= MIN_QUERY_LENGTH;
     const [cachedRecommendation, setCachedRecommendations] = React.useState(recommendationsLocalStorage.getCacheItem({
         id: `${recommendation}-${queryVariables === null || queryVariables === void 0 ? void 0 : queryVariables.language}`,
     }));
@@ -59,19 +62,21 @@ queryVariables, apiURL, }) => {
         }
         return data;
     }));
-    // Determine which approach to use
-    const swrKey = usingSearchClient
-        ? {
-            type: "searchClient",
-            query: recommendation,
-            language: queryVariables === null || queryVariables === void 0 ? void 0 : queryVariables.language,
-            customSearchConfig,
-        }
-        : {
-            appId: queryVariables.appId,
-            query: recommendation,
-            language: queryVariables.language,
-        };
+    // Determine which approach to use (null key prevents fetch)
+    const swrKey = shouldFetch
+        ? usingSearchClient
+            ? {
+                type: "searchClient",
+                query: recommendation,
+                language: queryVariables === null || queryVariables === void 0 ? void 0 : queryVariables.language,
+                customSearchConfig,
+            }
+            : {
+                appId: queryVariables.appId,
+                query: recommendation,
+                language: queryVariables.language,
+            }
+        : null;
     const fetcher = usingSearchClient ? searchClientFetcher : apiFetcher;
     const { data, error, isLoading } = useSWR(swrKey, usingSearchClient ? fetcher : (body) => apiFetcher(body), {
         revalidateOnFocus: false,
@@ -89,6 +94,17 @@ queryVariables, apiURL, }) => {
             facets: (data === null || data === void 0 ? void 0 : data.facets) || [],
         });
     }, [data, recommendation, queryVariables === null || queryVariables === void 0 ? void 0 : queryVariables.language]);
+    // Return empty results when recommendation is below minimum length
+    if (!shouldFetch) {
+        return {
+            products: [],
+            collections: [],
+            searches: [],
+            facets: [],
+            isLoading: false,
+            error: null,
+        };
+    }
     return {
         products: cachedRecommendation === null || cachedRecommendation === void 0 ? void 0 : cachedRecommendation.products,
         collections: cachedRecommendation === null || cachedRecommendation === void 0 ? void 0 : cachedRecommendation.collections,

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

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../components/ui/Input/input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AACxD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAS9B,QAAA,MAAM,KAAK,qFAqLV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../../components/ui/Input/input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAA;AACxD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAS9B,QAAA,MAAM,KAAK,qFAyLV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/components/ui/Input/input.js

@@ -16,9 +16,9 @@ import { getTextTranslation, useTranslation, } from "../../contexts/translation-
 import { Icon } from "../icon";
 import { inputVariants, useInput } from "./useInput";
 const Input = React.forwardRef((_a, ref) => {
-    var { className, error = false, id, type, label, labelStyle, asChild, value, onChange, icon, iconUrl, iconPosition = "right", // Default to "right" for backward compatibility
+    var { className, error = false, id, type, label, labelStyle, labelPositionStyle, asChild, value, onChange, icon, iconUrl, iconPosition = "right", // Default to "right" for backward compatibility
     iconColor, placeholder, placeholderFont, placeholderFontWeight, placeholderFontSize, placeholderTextAlign, placeholderTextColor, placeholderUpperCase, inputPadding, backgroundColor, borderRadius, inputBorderColor, borderSides, inputSpacing, inputActiveBorderColor } = _a, // New prop for active border color
-    props = __rest(_a, ["className", "error", "id", "type", "label", "labelStyle", "asChild", "value", "onChange", "icon", "iconUrl", "iconPosition", "iconColor", "placeholder", "placeholderFont", "placeholderFontWeight", "placeholderFontSize", "placeholderTextAlign", "placeholderTextColor", "placeholderUpperCase", "inputPadding", "backgroundColor", "borderRadius", "inputBorderColor", "borderSides", "inputSpacing", "inputActiveBorderColor"]);
+    props = __rest(_a, ["className", "error", "id", "type", "label", "labelStyle", "labelPositionStyle", "asChild", "value", "onChange", "icon", "iconUrl", "iconPosition", "iconColor", "placeholder", "placeholderFont", "placeholderFontWeight", "placeholderFontSize", "placeholderTextAlign", "placeholderTextColor", "placeholderUpperCase", "inputPadding", "backgroundColor", "borderRadius", "inputBorderColor", "borderSides", "inputSpacing", "inputActiveBorderColor"]);
     const translations = useTranslation();
     const translatedPlaceholder = getTextTranslation({
         text: placeholder,
@@ -64,7 +64,7 @@ const Input = React.forwardRef((_a, ref) => {
                         iconPosition === "left" &&
                         placeholderTextAlign === "center"
                         ? undefined
-                        : inputPaddingLeft, paddingRight: inputPaddingRight, fontFamily: placeholderFont, fontWeight: placeholderFontWeight, fontSize: `${placeholderFontSize}px`, textAlign: placeholderTextAlign, color: placeholderTextColorStyle, textTransform: placeholderUpperCase ? "uppercase" : undefined, paddingTop: inputPadding === null || inputPadding === void 0 ? void 0 : inputPadding.top, paddingBottom: inputPadding === null || inputPadding === void 0 ? void 0 : inputPadding.bottom, backgroundColor: inputBgColor }, borderStyle), borderRadiusStyle) })), label ? (_jsx("label", Object.assign({ htmlFor: id, style: labelTextStyle, className: cn("absolute text-[10px] text-textColors-secondaryColor group-active:text-coreColors-brandColorPrimary top-2 z-10 h-4 origin-[0] opacity-100 peer-placeholder-shown:opacity-0", iconPosition === "left" ? "start-10" : "start-4") }, { children: label }))) : null, (icon || iconUrl) && iconPosition === "right" && (_jsx(Icon, { name: icon, url: iconUrl, "data-error": error, size: "sm", className: cn("flex items-center absolute aspect-square fill-current z-10 icon ", {
+                        : inputPaddingLeft, paddingRight: inputPaddingRight, fontFamily: placeholderFont, fontWeight: placeholderFontWeight, fontSize: `${placeholderFontSize}px`, textAlign: placeholderTextAlign, color: placeholderTextColorStyle, textTransform: placeholderUpperCase ? "uppercase" : undefined, paddingTop: inputPadding === null || inputPadding === void 0 ? void 0 : inputPadding.top, paddingBottom: inputPadding === null || inputPadding === void 0 ? void 0 : inputPadding.bottom, backgroundColor: inputBgColor }, borderStyle), borderRadiusStyle) })), label ? (_jsx("label", Object.assign({ htmlFor: id, style: Object.assign(Object.assign({}, labelTextStyle), labelPositionStyle), className: cn("absolute text-[10px] text-textColors-secondaryColor group-active:text-coreColors-brandColorPrimary top-2 z-10 h-4 origin-[0] opacity-100 peer-placeholder-shown:opacity-0", iconPosition === "left" ? "start-10" : "start-4") }, { children: label }))) : null, (icon || iconUrl) && iconPosition === "right" && (_jsx(Icon, { name: icon, url: iconUrl, "data-error": error, size: "sm", className: cn("flex items-center absolute aspect-square fill-current z-10 icon ", {
                     "w-5": true,
                     "text-stateColors-error": error,
                 }), style: {

package/dist/components/ui/Input/types.d.ts

@@ -7,6 +7,7 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
     id: string;
     label?: string;
     labelStyle?: TextStyle;
+    labelPositionStyle?: React.CSSProperties;
     asChild?: boolean;
     value: string;
     onChange: (value: string) => void;

package/dist/components/ui/Input/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../components/ui/Input/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAA;AAC9D,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAE9C,MAAM,MAAM,WAAW,GAAG,CAAC,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC,EAAE,CAAA;AAEzE,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,EACnE,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC/B,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,oBAAoB,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,oBAAoB,CAAC,EAAE,KAAK,CAAA;IAC5B,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,gBAAgB,CAAC,EAAE,KAAK,CAAA;IACxB,sBAAsB,CAAC,EAAE,KAAK,CAAA;IAC9B,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,YAAY,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAA;IAC3E,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../components/ui/Input/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAA;AAC9D,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAE9C,MAAM,MAAM,WAAW,GAAG,CAAC,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC,EAAE,CAAA;AAEzE,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,EACnE,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,kBAAkB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IACxC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC/B,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,oBAAoB,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,oBAAoB,CAAC,EAAE,KAAK,CAAA;IAC5B,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,gBAAgB,CAAC,EAAE,KAAK,CAAA;IACxB,sBAAsB,CAAC,EAAE,KAAK,CAAA;IAC9B,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,YAAY,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAA;IAC3E,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB"}

package/dist/styles.css

@@ -648,6 +648,13 @@ video {
   color: hsl(var(--foreground));
     font-feature-settings: "rlig" 1, "calt" 1;
 }
+.\!container {
+  width: 100% !important;
+  margin-right: auto !important;
+  margin-left: auto !important;
+  padding-right: 2rem !important;
+  padding-left: 2rem !important;
+}
 .container {
   width: 100%;
   margin-right: auto;
@@ -657,6 +664,10 @@ video {
 }
 @media (min-width: 1400px) {
 
+  .\!container {
+    max-width: 1400px !important;
+  }
+
   .container {
     max-width: 1400px;
   }
@@ -1291,6 +1302,10 @@ video {
   --tw-translate-y: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.rotate-0 {
+  --tw-rotate: 0deg;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .rotate-180 {
   --tw-rotate: 180deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1303,6 +1318,16 @@ video {
   --tw-rotate: 90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.scale-0 {
+  --tw-scale-x: 0;
+  --tw-scale-y: 0;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.scale-100 {
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .transform {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
@@ -1674,6 +1699,9 @@ video {
 .border-b {
   border-bottom-width: 1px;
 }
+.border-b-0 {
+  border-bottom-width: 0px;
+}
 .border-b-2 {
   border-bottom-width: 2px;
 }
@@ -1791,6 +1819,14 @@ video {
 .bg-foreground {
   background-color: hsl(var(--foreground));
 }
+.bg-gray-100 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
+}
+.bg-gray-200 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
+}
 .bg-gray-300 {
   --tw-bg-opacity: 1;
   background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
@@ -1798,6 +1834,10 @@ video {
 .bg-productBadging-fill {
   background-color: var(--productBadging-fill);
 }
+.bg-red-100 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));
+}
 .bg-stateColors-disabled {
   background-color: var(--stateColors-disabled);
 }
@@ -2214,6 +2254,10 @@ video {
 .text-productBadging-text {
   color: var(--productBadging-text);
 }
+.text-red-500 {
+  --tw-text-opacity: 1;
+  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
+}
 .text-red-600 {
   --tw-text-opacity: 1;
   color: rgb(220 38 38 / var(--tw-text-opacity, 1));
@@ -2266,6 +2310,10 @@ video {
 .text-textColors-strikethroughPriceText {
   color: var(--textColors-strikethroughPriceText);
 }
+.text-white {
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
+}
 .underline {
   text-decoration-line: underline;
 }
@@ -2379,6 +2427,10 @@ video {
   --tw-blur: blur(8px);
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
+.drop-shadow {
+  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
 .drop-shadow-\[0_3px_1px_0_rgba\(0\2c 0\2c 0\2c 1\)\] {
   --tw-drop-shadow: drop-shadow(0 3px 1px 0 rgba(0,0,0,1));
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
@@ -2490,6 +2542,10 @@ video {
 .paused {
   animation-play-state: paused;
 }
+.\!container {
+    padding-right: 16px !important;
+    padding-left: 16px !important;
+  }
 .container {
     padding-right: 16px;
     padding-left: 16px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tapcart/mobile-components",
-  "version": "0.12.6",
+  "version": "0.12.8",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "style": "dist/styles.css",