@wix/headless-stores 0.0.37 → 0.0.38

package/cjs/dist/react/SelectedVariant.d.ts

@@ -161,3 +161,66 @@ export interface SKURenderProps {
  * ```
  */
 export declare function SKU(props: SKUProps): import("react").ReactNode;
+/**
+ * Props for Actions headless component
+ */
+export interface ActionsProps {
+    /** Render prop function that receives actions data */
+    children: (props: ActionsRenderProps) => React.ReactNode;
+}
+/**
+ * Render props for Actions component
+ */
+export interface ActionsRenderProps {
+    /** Function to add product to cart */
+    onAddToCart: () => Promise<void>;
+    /** Function to buy now (clear cart, add product, proceed to checkout) */
+    onBuyNow: () => Promise<void>;
+    /** Whether add to cart is available */
+    canAddToCart: boolean;
+    /** Whether add to cart is currently loading */
+    isLoading: boolean;
+    /** Whether variant is in stock */
+    inStock: boolean;
+    /** Whether pre-order is enabled */
+    isPreOrderEnabled: boolean;
+    /** Pre-order message */
+    preOrderMessage: string | null;
+    /** Error message if any */
+    error: string | null;
+}
+/**
+ * Headless component for product actions (add to cart, buy now)
+ *
+ * @component
+ * @example
+ * ```tsx
+ * import { SelectedVariant } from '@wix/stores/components';
+ *
+ * function AddToCartButton() {
+ *   return (
+ *     <SelectedVariant.Actions>
+ *       {({ onAddToCart, onBuyNow, canAddToCart, isLoading, inStock, error }) => (
+ *         <div>
+ *           {error && <div className="error">{error}</div>}
+ *           {!inStock && <div>Out of stock</div>}
+ *           <button
+ *             onClick={onAddToCart}
+ *             disabled={!canAddToCart || isLoading}
+ *           >
+ *             {isLoading ? 'Adding...' : 'Add to Cart'}
+ *           </button>
+ *           <button
+ *             onClick={onBuyNow}
+ *             disabled={!canAddToCart || isLoading}
+ *           >
+ *             Buy Now
+ *           </button>
+ *         </div>
+ *       )}
+ *     </SelectedVariant.Actions>
+ *   );
+ * }
+ * ```
+ */
+export declare function Actions(props: ActionsProps): import("react").ReactNode;

package/cjs/dist/react/SelectedVariant.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useService, WixServices } from "@wix/services-manager-react";
 import { SelectedVariantServiceDefinition, SelectedVariantService, } from "../services/selected-variant-service.js";
+import { ProductModifiersServiceDefinition } from "../services/product-modifiers-service.js";
+import { CurrentCartService, CurrentCartServiceDefinition, } from "@wix/headless-ecom/services";
 import { createServicesMap } from "@wix/services-manager";
 /**
  * Root component that provides the SelectedVariant service context to its children.
@@ -36,7 +38,9 @@ import { createServicesMap } from "@wix/services-manager";
  * ```
  */
 export function Root(props) {
-    return (_jsx(WixServices, { servicesMap: createServicesMap().addService(SelectedVariantServiceDefinition, SelectedVariantService, props.selectedVariantServiceConfig), children: props.children }));
+    return (_jsx(WixServices, { servicesMap: createServicesMap()
+            .addService(SelectedVariantServiceDefinition, SelectedVariantService, props.selectedVariantServiceConfig)
+            .addService(CurrentCartServiceDefinition, CurrentCartService, {}), children: props.children }));
 }
 /**
  * Headless component for selected variant details display
@@ -141,3 +145,98 @@ export function SKU(props) {
         sku,
     });
 }
+/**
+ * Headless component for product actions (add to cart, buy now)
+ *
+ * @component
+ * @example
+ * ```tsx
+ * import { SelectedVariant } from '@wix/stores/components';
+ *
+ * function AddToCartButton() {
+ *   return (
+ *     <SelectedVariant.Actions>
+ *       {({ onAddToCart, onBuyNow, canAddToCart, isLoading, inStock, error }) => (
+ *         <div>
+ *           {error && <div className="error">{error}</div>}
+ *           {!inStock && <div>Out of stock</div>}
+ *           <button
+ *             onClick={onAddToCart}
+ *             disabled={!canAddToCart || isLoading}
+ *           >
+ *             {isLoading ? 'Adding...' : 'Add to Cart'}
+ *           </button>
+ *           <button
+ *             onClick={onBuyNow}
+ *             disabled={!canAddToCart || isLoading}
+ *           >
+ *             Buy Now
+ *           </button>
+ *         </div>
+ *       )}
+ *     </SelectedVariant.Actions>
+ *   );
+ * }
+ * ```
+ */
+export function Actions(props) {
+    const variantService = useService(SelectedVariantServiceDefinition);
+    const cartService = useService(CurrentCartServiceDefinition);
+    // Try to get modifiers service - it may not exist for all products
+    let modifiersService = null;
+    try {
+        modifiersService = useService(ProductModifiersServiceDefinition);
+    }
+    catch {
+        // Modifiers service not available for this product
+        modifiersService = null;
+    }
+    const inStock = variantService.isInStock.get();
+    const isPreOrderEnabled = variantService.isPreOrderEnabled.get();
+    const preOrderMessage = variantService.preOrderMessage.get();
+    const isLoading = variantService.isLoading.get();
+    const error = variantService.error.get();
+    const quantity = variantService.selectedQuantity.get();
+    // Check if all required modifiers are filled
+    const areAllRequiredModifiersFilled = modifiersService
+        ? modifiersService.areAllRequiredModifiersFilled()
+        : true; // If no modifiers service, assume no required modifiers
+    const canAddToCart = (inStock || isPreOrderEnabled) &&
+        !isLoading &&
+        areAllRequiredModifiersFilled;
+    const onAddToCart = async () => {
+        // Get modifiers data if available
+        let modifiersData;
+        if (modifiersService) {
+            const selectedModifiers = modifiersService.selectedModifiers.get();
+            if (Object.keys(selectedModifiers).length > 0) {
+                modifiersData = selectedModifiers;
+            }
+        }
+        await variantService.addToCart(quantity, modifiersData);
+    };
+    const onBuyNow = async () => {
+        try {
+            // Clear the cart first
+            await cartService.clearCart();
+            // Add the product to cart
+            await onAddToCart();
+            // Proceed to checkout
+            await cartService.proceedToCheckout();
+        }
+        catch (error) {
+            console.error("Buy now failed:", error);
+            throw error;
+        }
+    };
+    return props.children({
+        onAddToCart,
+        onBuyNow,
+        canAddToCart,
+        isLoading,
+        inStock,
+        isPreOrderEnabled,
+        preOrderMessage,
+        error,
+    });
+}

package/cjs/dist/react/index.d.ts

@@ -1,7 +1,6 @@
 export * as CategoryList from "./CategoryList.js";
 export * as Category from "./Category.js";
 export * as Product from "./Product.js";
-export * as ProductActions from "./ProductActions.js";
 export * as ProductModifiers from "./ProductModifiers.js";
 export * as ProductList from "./ProductList.js";
 export * as ProductListFilters from "./ProductListFilters.js";

package/cjs/dist/react/index.js

@@ -1,7 +1,6 @@
 export * as CategoryList from "./CategoryList.js";
 export * as Category from "./Category.js";
 export * as Product from "./Product.js";
-export * as ProductActions from "./ProductActions.js";
 export * as ProductModifiers from "./ProductModifiers.js";
 export * as ProductList from "./ProductList.js";
 export * as ProductListFilters from "./ProductListFilters.js";

package/cjs/dist/services/products-list-service.js

@@ -1,6 +1,6 @@
 import { defineService, implementService } from "@wix/services-definitions";
 import { SignalsServiceDefinition, } from "@wix/services-definitions/core-services/signals";
-import { productsV3 } from "@wix/stores";
+import { productsV3, readOnlyVariantsV3 } from "@wix/stores";
 /**
  * Loads products list service configuration from the Wix Stores API for SSR initialization.
  * This function is designed to be used during Server-Side Rendering (SSR) to preload
@@ -83,7 +83,7 @@ import { productsV3 } from "@wix/stores";
  * ```
  */
 export async function loadProductsListServiceConfig(searchOptions) {
-    const result = await productsV3.searchProducts(searchOptions);
+    const result = await fetchProducts(searchOptions);
     return {
         products: result.products ?? [],
         searchOptions,
@@ -91,6 +91,90 @@ export async function loadProductsListServiceConfig(searchOptions) {
         aggregations: result.aggregationData,
     };
 }
+/**
+ * Fetches products and their missing variants in one optimized request.
+ * This function wraps the standard searchProducts call and automatically
+ * fetches missing variant data for all products that need it.
+ *
+ * @param searchOptions - The search options for querying products
+ * @returns Promise that resolves to the search result with complete variant data
+ */
+const fetchProducts = async (searchOptions) => {
+    const result = await productsV3.searchProducts(searchOptions);
+    // Fetch missing variants for all products in one batch request
+    if (result.products) {
+        result.products = await fetchMissingVariants(result.products);
+    }
+    return result;
+};
+/**
+ * Fetches missing variants for all products in one batch request.
+ * This function identifies products that need variant data and fetches
+ * all variants efficiently using the readOnlyVariantsV3 API.
+ *
+ * @param products - Array of products that may need variant data
+ * @returns Promise that resolves to products with complete variant information
+ */
+const fetchMissingVariants = async (products) => {
+    // Find products that need variants (both single and multi-variant products)
+    const productsNeedingVariants = products.filter((product) => !product.variantsInfo?.variants &&
+        product.variantSummary?.variantCount &&
+        product.variantSummary.variantCount > 0);
+    if (productsNeedingVariants.length === 0) {
+        return products;
+    }
+    try {
+        const productIds = productsNeedingVariants
+            .map((p) => p._id)
+            .filter(Boolean);
+        if (productIds.length === 0) {
+            return products;
+        }
+        const items = [];
+        const res = await readOnlyVariantsV3
+            .queryVariants({})
+            .in("productData.productId", productIds)
+            .limit(100)
+            .find();
+        items.push(...res.items);
+        let nextRes = res;
+        while (nextRes.hasNext()) {
+            nextRes = await nextRes.next();
+            items.push(...nextRes.items);
+        }
+        const variantsByProductId = new Map();
+        items.forEach((item) => {
+            const productId = item.productData?.productId;
+            if (productId) {
+                if (!variantsByProductId.has(productId)) {
+                    variantsByProductId.set(productId, []);
+                }
+                variantsByProductId.get(productId).push({
+                    ...item,
+                    choices: item.optionChoices,
+                });
+            }
+        });
+        // Update products with their variants
+        return products.map((product) => {
+            const variants = variantsByProductId.get(product._id || "");
+            if (variants && variants.length > 0) {
+                return {
+                    ...product,
+                    variantsInfo: {
+                        ...product.variantsInfo,
+                        variants,
+                    },
+                };
+            }
+            return product;
+        });
+    }
+    catch (error) {
+        console.error("Failed to fetch missing variants:", error);
+        return products;
+    }
+};
 /**
  * Service definition for the Products List service.
  * This defines the reactive API contract for managing a list of products with search, pagination, and filtering capabilities.
@@ -179,7 +263,7 @@ export const ProductListService = implementService.withConfig()(ProductsListServ
                         },
                     }
                     : searchOptions;
-                const result = await productsV3.searchProducts(affectiveSearchOptions);
+                const result = await fetchProducts(affectiveSearchOptions);
                 productsSignal.set(result.products ?? []);
                 pagingMetadataSignal.set(result.pagingMetadata);
             }

package/dist/react/SelectedVariant.d.ts

@@ -161,3 +161,66 @@ export interface SKURenderProps {
  * ```
  */
 export declare function SKU(props: SKUProps): import("react").ReactNode;
+/**
+ * Props for Actions headless component
+ */
+export interface ActionsProps {
+    /** Render prop function that receives actions data */
+    children: (props: ActionsRenderProps) => React.ReactNode;
+}
+/**
+ * Render props for Actions component
+ */
+export interface ActionsRenderProps {
+    /** Function to add product to cart */
+    onAddToCart: () => Promise<void>;
+    /** Function to buy now (clear cart, add product, proceed to checkout) */
+    onBuyNow: () => Promise<void>;
+    /** Whether add to cart is available */
+    canAddToCart: boolean;
+    /** Whether add to cart is currently loading */
+    isLoading: boolean;
+    /** Whether variant is in stock */
+    inStock: boolean;
+    /** Whether pre-order is enabled */
+    isPreOrderEnabled: boolean;
+    /** Pre-order message */
+    preOrderMessage: string | null;
+    /** Error message if any */
+    error: string | null;
+}
+/**
+ * Headless component for product actions (add to cart, buy now)
+ *
+ * @component
+ * @example
+ * ```tsx
+ * import { SelectedVariant } from '@wix/stores/components';
+ *
+ * function AddToCartButton() {
+ *   return (
+ *     <SelectedVariant.Actions>
+ *       {({ onAddToCart, onBuyNow, canAddToCart, isLoading, inStock, error }) => (
+ *         <div>
+ *           {error && <div className="error">{error}</div>}
+ *           {!inStock && <div>Out of stock</div>}
+ *           <button
+ *             onClick={onAddToCart}
+ *             disabled={!canAddToCart || isLoading}
+ *           >
+ *             {isLoading ? 'Adding...' : 'Add to Cart'}
+ *           </button>
+ *           <button
+ *             onClick={onBuyNow}
+ *             disabled={!canAddToCart || isLoading}
+ *           >
+ *             Buy Now
+ *           </button>
+ *         </div>
+ *       )}
+ *     </SelectedVariant.Actions>
+ *   );
+ * }
+ * ```
+ */
+export declare function Actions(props: ActionsProps): import("react").ReactNode;

package/dist/react/SelectedVariant.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useService, WixServices } from "@wix/services-manager-react";
 import { SelectedVariantServiceDefinition, SelectedVariantService, } from "../services/selected-variant-service.js";
+import { ProductModifiersServiceDefinition } from "../services/product-modifiers-service.js";
+import { CurrentCartService, CurrentCartServiceDefinition, } from "@wix/headless-ecom/services";
 import { createServicesMap } from "@wix/services-manager";
 /**
  * Root component that provides the SelectedVariant service context to its children.
@@ -36,7 +38,9 @@ import { createServicesMap } from "@wix/services-manager";
  * ```
  */
 export function Root(props) {
-    return (_jsx(WixServices, { servicesMap: createServicesMap().addService(SelectedVariantServiceDefinition, SelectedVariantService, props.selectedVariantServiceConfig), children: props.children }));
+    return (_jsx(WixServices, { servicesMap: createServicesMap()
+            .addService(SelectedVariantServiceDefinition, SelectedVariantService, props.selectedVariantServiceConfig)
+            .addService(CurrentCartServiceDefinition, CurrentCartService, {}), children: props.children }));
 }
 /**
  * Headless component for selected variant details display
@@ -141,3 +145,98 @@ export function SKU(props) {
         sku,
     });
 }
+/**
+ * Headless component for product actions (add to cart, buy now)
+ *
+ * @component
+ * @example
+ * ```tsx
+ * import { SelectedVariant } from '@wix/stores/components';
+ *
+ * function AddToCartButton() {
+ *   return (
+ *     <SelectedVariant.Actions>
+ *       {({ onAddToCart, onBuyNow, canAddToCart, isLoading, inStock, error }) => (
+ *         <div>
+ *           {error && <div className="error">{error}</div>}
+ *           {!inStock && <div>Out of stock</div>}
+ *           <button
+ *             onClick={onAddToCart}
+ *             disabled={!canAddToCart || isLoading}
+ *           >
+ *             {isLoading ? 'Adding...' : 'Add to Cart'}
+ *           </button>
+ *           <button
+ *             onClick={onBuyNow}
+ *             disabled={!canAddToCart || isLoading}
+ *           >
+ *             Buy Now
+ *           </button>
+ *         </div>
+ *       )}
+ *     </SelectedVariant.Actions>
+ *   );
+ * }
+ * ```
+ */
+export function Actions(props) {
+    const variantService = useService(SelectedVariantServiceDefinition);
+    const cartService = useService(CurrentCartServiceDefinition);
+    // Try to get modifiers service - it may not exist for all products
+    let modifiersService = null;
+    try {
+        modifiersService = useService(ProductModifiersServiceDefinition);
+    }
+    catch {
+        // Modifiers service not available for this product
+        modifiersService = null;
+    }
+    const inStock = variantService.isInStock.get();
+    const isPreOrderEnabled = variantService.isPreOrderEnabled.get();
+    const preOrderMessage = variantService.preOrderMessage.get();
+    const isLoading = variantService.isLoading.get();
+    const error = variantService.error.get();
+    const quantity = variantService.selectedQuantity.get();
+    // Check if all required modifiers are filled
+    const areAllRequiredModifiersFilled = modifiersService
+        ? modifiersService.areAllRequiredModifiersFilled()
+        : true; // If no modifiers service, assume no required modifiers
+    const canAddToCart = (inStock || isPreOrderEnabled) &&
+        !isLoading &&
+        areAllRequiredModifiersFilled;
+    const onAddToCart = async () => {
+        // Get modifiers data if available
+        let modifiersData;
+        if (modifiersService) {
+            const selectedModifiers = modifiersService.selectedModifiers.get();
+            if (Object.keys(selectedModifiers).length > 0) {
+                modifiersData = selectedModifiers;
+            }
+        }
+        await variantService.addToCart(quantity, modifiersData);
+    };
+    const onBuyNow = async () => {
+        try {
+            // Clear the cart first
+            await cartService.clearCart();
+            // Add the product to cart
+            await onAddToCart();
+            // Proceed to checkout
+            await cartService.proceedToCheckout();
+        }
+        catch (error) {
+            console.error("Buy now failed:", error);
+            throw error;
+        }
+    };
+    return props.children({
+        onAddToCart,
+        onBuyNow,
+        canAddToCart,
+        isLoading,
+        inStock,
+        isPreOrderEnabled,
+        preOrderMessage,
+        error,
+    });
+}

package/dist/react/index.d.ts

@@ -1,7 +1,6 @@
 export * as CategoryList from "./CategoryList.js";
 export * as Category from "./Category.js";
 export * as Product from "./Product.js";
-export * as ProductActions from "./ProductActions.js";
 export * as ProductModifiers from "./ProductModifiers.js";
 export * as ProductList from "./ProductList.js";
 export * as ProductListFilters from "./ProductListFilters.js";

package/dist/react/index.js

@@ -1,7 +1,6 @@
 export * as CategoryList from "./CategoryList.js";
 export * as Category from "./Category.js";
 export * as Product from "./Product.js";
-export * as ProductActions from "./ProductActions.js";
 export * as ProductModifiers from "./ProductModifiers.js";
 export * as ProductList from "./ProductList.js";
 export * as ProductListFilters from "./ProductListFilters.js";

package/dist/services/products-list-service.js

@@ -1,6 +1,6 @@
 import { defineService, implementService } from "@wix/services-definitions";
 import { SignalsServiceDefinition, } from "@wix/services-definitions/core-services/signals";
-import { productsV3 } from "@wix/stores";
+import { productsV3, readOnlyVariantsV3 } from "@wix/stores";
 /**
  * Loads products list service configuration from the Wix Stores API for SSR initialization.
  * This function is designed to be used during Server-Side Rendering (SSR) to preload
@@ -83,7 +83,7 @@ import { productsV3 } from "@wix/stores";
  * ```
  */
 export async function loadProductsListServiceConfig(searchOptions) {
-    const result = await productsV3.searchProducts(searchOptions);
+    const result = await fetchProducts(searchOptions);
     return {
         products: result.products ?? [],
         searchOptions,
@@ -91,6 +91,90 @@ export async function loadProductsListServiceConfig(searchOptions) {
         aggregations: result.aggregationData,
     };
 }
+/**
+ * Fetches products and their missing variants in one optimized request.
+ * This function wraps the standard searchProducts call and automatically
+ * fetches missing variant data for all products that need it.
+ *
+ * @param searchOptions - The search options for querying products
+ * @returns Promise that resolves to the search result with complete variant data
+ */
+const fetchProducts = async (searchOptions) => {
+    const result = await productsV3.searchProducts(searchOptions);
+    // Fetch missing variants for all products in one batch request
+    if (result.products) {
+        result.products = await fetchMissingVariants(result.products);
+    }
+    return result;
+};
+/**
+ * Fetches missing variants for all products in one batch request.
+ * This function identifies products that need variant data and fetches
+ * all variants efficiently using the readOnlyVariantsV3 API.
+ *
+ * @param products - Array of products that may need variant data
+ * @returns Promise that resolves to products with complete variant information
+ */
+const fetchMissingVariants = async (products) => {
+    // Find products that need variants (both single and multi-variant products)
+    const productsNeedingVariants = products.filter((product) => !product.variantsInfo?.variants &&
+        product.variantSummary?.variantCount &&
+        product.variantSummary.variantCount > 0);
+    if (productsNeedingVariants.length === 0) {
+        return products;
+    }
+    try {
+        const productIds = productsNeedingVariants
+            .map((p) => p._id)
+            .filter(Boolean);
+        if (productIds.length === 0) {
+            return products;
+        }
+        const items = [];
+        const res = await readOnlyVariantsV3
+            .queryVariants({})
+            .in("productData.productId", productIds)
+            .limit(100)
+            .find();
+        items.push(...res.items);
+        let nextRes = res;
+        while (nextRes.hasNext()) {
+            nextRes = await nextRes.next();
+            items.push(...nextRes.items);
+        }
+        const variantsByProductId = new Map();
+        items.forEach((item) => {
+            const productId = item.productData?.productId;
+            if (productId) {
+                if (!variantsByProductId.has(productId)) {
+                    variantsByProductId.set(productId, []);
+                }
+                variantsByProductId.get(productId).push({
+                    ...item,
+                    choices: item.optionChoices,
+                });
+            }
+        });
+        // Update products with their variants
+        return products.map((product) => {
+            const variants = variantsByProductId.get(product._id || "");
+            if (variants && variants.length > 0) {
+                return {
+                    ...product,
+                    variantsInfo: {
+                        ...product.variantsInfo,
+                        variants,
+                    },
+                };
+            }
+            return product;
+        });
+    }
+    catch (error) {
+        console.error("Failed to fetch missing variants:", error);
+        return products;
+    }
+};
 /**
  * Service definition for the Products List service.
  * This defines the reactive API contract for managing a list of products with search, pagination, and filtering capabilities.
@@ -179,7 +263,7 @@ export const ProductListService = implementService.withConfig()(ProductsListServ
                         },
                     }
                     : searchOptions;
-                const result = await productsV3.searchProducts(affectiveSearchOptions);
+                const result = await fetchProducts(affectiveSearchOptions);
                 productsSignal.set(result.products ?? []);
                 pagingMetadataSignal.set(result.pagingMetadata);
             }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-stores",
-  "version": "0.0.37",
+  "version": "0.0.38",
   "type": "module",
   "scripts": {
     "prebuild": "cd ../media && yarn build && cd ../ecom && yarn build",

package/cjs/dist/react/ProductActions.d.ts

@@ -1,70 +0,0 @@
-/**
- * Props for Actions headless component
- */
-export interface ActionsProps {
-    /** Quantity to add (optional) */
-    quantity?: number;
-    /** Render prop function that receives actions data */
-    children: (props: ActionsRenderProps) => React.ReactNode;
-}
-/**
- * Render props for Actions component
- */
-export interface ActionsRenderProps {
-    /** Function to add product to cart */
-    onAddToCart: () => Promise<void>;
-    /** Function to buy now (clear cart, add product, proceed to checkout) */
-    onBuyNow: () => Promise<void>;
-    /** Whether add to cart is available */
-    canAddToCart: boolean;
-    /** Whether add to cart is currently loading */
-    isLoading: boolean;
-    /** Current variant price */
-    price: string;
-    /** Whether variant is in stock */
-    inStock: boolean;
-    /** Whether pre-order is enabled */
-    isPreOrderEnabled: boolean;
-    /** Pre-order message */
-    preOrderMessage: string | null;
-    /** Error message if any */
-    error: string | null;
-    /** Available quantity */
-    availableQuantity: number | null;
-}
-/**
- * Headless component for product actions (add to cart, buy now)
- *
- * @component
- * @example
- * ```tsx
- * import { ProductActions } from '@wix/stores/components';
- *
- * function AddToCartButton() {
- *   return (
- *     <ProductActions.Actions quantity={1}>
- *       {({ onAddToCart, onBuyNow, canAddToCart, isLoading, price, inStock, error }) => (
- *         <div>
- *           <div>Price: {price}</div>
- *           {error && <div className="error">{error}</div>}
- *           {!inStock && <div>Out of stock</div>}
- *           <button
- *             onClick={onAddToCart}
- *             disabled={!canAddToCart || isLoading}
- *           >
- *             {isLoading ? 'Adding...' : 'Add to Cart'}
- *           </button>
- *           <button
- *             onClick={onBuyNow}
- *             disabled={!canAddToCart || isLoading}
- *           >
- *             Buy Now
- *           </button>
- *         </div>
- *       )}
- *     </ProductActions.Actions>
- *   );
- * }
- * ```
- */
-export declare function Actions(props: ActionsProps): import("react").ReactNode;

package/cjs/dist/react/ProductActions.js

@@ -1,104 +0,0 @@
-import { useService } from "@wix/services-manager-react";
-import { SelectedVariantServiceDefinition } from "../services/selected-variant-service.js";
-import { ProductModifiersServiceDefinition } from "../services/product-modifiers-service.js";
-import { CurrentCartServiceDefinition } from "@wix/headless-ecom/services";
-/**
- * Headless component for product actions (add to cart, buy now)
- *
- * @component
- * @example
- * ```tsx
- * import { ProductActions } from '@wix/stores/components';
- *
- * function AddToCartButton() {
- *   return (
- *     <ProductActions.Actions quantity={1}>
- *       {({ onAddToCart, onBuyNow, canAddToCart, isLoading, price, inStock, error }) => (
- *         <div>
- *           <div>Price: {price}</div>
- *           {error && <div className="error">{error}</div>}
- *           {!inStock && <div>Out of stock</div>}
- *           <button
- *             onClick={onAddToCart}
- *             disabled={!canAddToCart || isLoading}
- *           >
- *             {isLoading ? 'Adding...' : 'Add to Cart'}
- *           </button>
- *           <button
- *             onClick={onBuyNow}
- *             disabled={!canAddToCart || isLoading}
- *           >
- *             Buy Now
- *           </button>
- *         </div>
- *       )}
- *     </ProductActions.Actions>
- *   );
- * }
- * ```
- */
-export function Actions(props) {
-    const variantService = useService(SelectedVariantServiceDefinition);
-    const cartService = useService(CurrentCartServiceDefinition);
-    // Try to get modifiers service - it may not exist for all products
-    let modifiersService = null;
-    try {
-        modifiersService = useService(ProductModifiersServiceDefinition);
-    }
-    catch {
-        // Modifiers service not available for this product
-        modifiersService = null;
-    }
-    const price = variantService.currentPrice.get();
-    const inStock = variantService.isInStock.get();
-    const isPreOrderEnabled = variantService.isPreOrderEnabled.get();
-    const preOrderMessage = variantService.preOrderMessage.get();
-    const isLoading = variantService.isLoading.get();
-    const error = variantService.error.get();
-    const availableQuantity = variantService.quantityAvailable.get();
-    const quantity = variantService.selectedQuantity.get();
-    // Check if all required modifiers are filled
-    const areAllRequiredModifiersFilled = modifiersService
-        ? modifiersService.areAllRequiredModifiersFilled()
-        : true; // If no modifiers service, assume no required modifiers
-    const canAddToCart = (inStock || isPreOrderEnabled) &&
-        !isLoading &&
-        areAllRequiredModifiersFilled;
-    const onAddToCart = async () => {
-        // Get modifiers data if available
-        let modifiersData;
-        if (modifiersService) {
-            const selectedModifiers = modifiersService.selectedModifiers.get();
-            if (Object.keys(selectedModifiers).length > 0) {
-                modifiersData = selectedModifiers;
-            }
-        }
-        await variantService.addToCart(quantity, modifiersData);
-    };
-    const onBuyNow = async () => {
-        try {
-            // Clear the cart first
-            await cartService.clearCart();
-            // Add the product to cart
-            await onAddToCart();
-            // Proceed to checkout
-            await cartService.proceedToCheckout();
-        }
-        catch (error) {
-            console.error("Buy now failed:", error);
-            throw error;
-        }
-    };
-    return props.children({
-        onAddToCart,
-        onBuyNow,
-        canAddToCart,
-        isLoading,
-        price,
-        inStock,
-        isPreOrderEnabled,
-        preOrderMessage,
-        error,
-        availableQuantity,
-    });
-}

package/dist/react/ProductActions.d.ts

@@ -1,70 +0,0 @@
-/**
- * Props for Actions headless component
- */
-export interface ActionsProps {
-    /** Quantity to add (optional) */
-    quantity?: number;
-    /** Render prop function that receives actions data */
-    children: (props: ActionsRenderProps) => React.ReactNode;
-}
-/**
- * Render props for Actions component
- */
-export interface ActionsRenderProps {
-    /** Function to add product to cart */
-    onAddToCart: () => Promise<void>;
-    /** Function to buy now (clear cart, add product, proceed to checkout) */
-    onBuyNow: () => Promise<void>;
-    /** Whether add to cart is available */
-    canAddToCart: boolean;
-    /** Whether add to cart is currently loading */
-    isLoading: boolean;
-    /** Current variant price */
-    price: string;
-    /** Whether variant is in stock */
-    inStock: boolean;
-    /** Whether pre-order is enabled */
-    isPreOrderEnabled: boolean;
-    /** Pre-order message */
-    preOrderMessage: string | null;
-    /** Error message if any */
-    error: string | null;
-    /** Available quantity */
-    availableQuantity: number | null;
-}
-/**
- * Headless component for product actions (add to cart, buy now)
- *
- * @component
- * @example
- * ```tsx
- * import { ProductActions } from '@wix/stores/components';
- *
- * function AddToCartButton() {
- *   return (
- *     <ProductActions.Actions quantity={1}>
- *       {({ onAddToCart, onBuyNow, canAddToCart, isLoading, price, inStock, error }) => (
- *         <div>
- *           <div>Price: {price}</div>
- *           {error && <div className="error">{error}</div>}
- *           {!inStock && <div>Out of stock</div>}
- *           <button
- *             onClick={onAddToCart}
- *             disabled={!canAddToCart || isLoading}
- *           >
- *             {isLoading ? 'Adding...' : 'Add to Cart'}
- *           </button>
- *           <button
- *             onClick={onBuyNow}
- *             disabled={!canAddToCart || isLoading}
- *           >
- *             Buy Now
- *           </button>
- *         </div>
- *       )}
- *     </ProductActions.Actions>
- *   );
- * }
- * ```
- */
-export declare function Actions(props: ActionsProps): import("react").ReactNode;

package/dist/react/ProductActions.js

@@ -1,104 +0,0 @@
-import { useService } from "@wix/services-manager-react";
-import { SelectedVariantServiceDefinition } from "../services/selected-variant-service.js";
-import { ProductModifiersServiceDefinition } from "../services/product-modifiers-service.js";
-import { CurrentCartServiceDefinition } from "@wix/headless-ecom/services";
-/**
- * Headless component for product actions (add to cart, buy now)
- *
- * @component
- * @example
- * ```tsx
- * import { ProductActions } from '@wix/stores/components';
- *
- * function AddToCartButton() {
- *   return (
- *     <ProductActions.Actions quantity={1}>
- *       {({ onAddToCart, onBuyNow, canAddToCart, isLoading, price, inStock, error }) => (
- *         <div>
- *           <div>Price: {price}</div>
- *           {error && <div className="error">{error}</div>}
- *           {!inStock && <div>Out of stock</div>}
- *           <button
- *             onClick={onAddToCart}
- *             disabled={!canAddToCart || isLoading}
- *           >
- *             {isLoading ? 'Adding...' : 'Add to Cart'}
- *           </button>
- *           <button
- *             onClick={onBuyNow}
- *             disabled={!canAddToCart || isLoading}
- *           >
- *             Buy Now
- *           </button>
- *         </div>
- *       )}
- *     </ProductActions.Actions>
- *   );
- * }
- * ```
- */
-export function Actions(props) {
-    const variantService = useService(SelectedVariantServiceDefinition);
-    const cartService = useService(CurrentCartServiceDefinition);
-    // Try to get modifiers service - it may not exist for all products
-    let modifiersService = null;
-    try {
-        modifiersService = useService(ProductModifiersServiceDefinition);
-    }
-    catch {
-        // Modifiers service not available for this product
-        modifiersService = null;
-    }
-    const price = variantService.currentPrice.get();
-    const inStock = variantService.isInStock.get();
-    const isPreOrderEnabled = variantService.isPreOrderEnabled.get();
-    const preOrderMessage = variantService.preOrderMessage.get();
-    const isLoading = variantService.isLoading.get();
-    const error = variantService.error.get();
-    const availableQuantity = variantService.quantityAvailable.get();
-    const quantity = variantService.selectedQuantity.get();
-    // Check if all required modifiers are filled
-    const areAllRequiredModifiersFilled = modifiersService
-        ? modifiersService.areAllRequiredModifiersFilled()
-        : true; // If no modifiers service, assume no required modifiers
-    const canAddToCart = (inStock || isPreOrderEnabled) &&
-        !isLoading &&
-        areAllRequiredModifiersFilled;
-    const onAddToCart = async () => {
-        // Get modifiers data if available
-        let modifiersData;
-        if (modifiersService) {
-            const selectedModifiers = modifiersService.selectedModifiers.get();
-            if (Object.keys(selectedModifiers).length > 0) {
-                modifiersData = selectedModifiers;
-            }
-        }
-        await variantService.addToCart(quantity, modifiersData);
-    };
-    const onBuyNow = async () => {
-        try {
-            // Clear the cart first
-            await cartService.clearCart();
-            // Add the product to cart
-            await onAddToCart();
-            // Proceed to checkout
-            await cartService.proceedToCheckout();
-        }
-        catch (error) {
-            console.error("Buy now failed:", error);
-            throw error;
-        }
-    };
-    return props.children({
-        onAddToCart,
-        onBuyNow,
-        canAddToCart,
-        isLoading,
-        price,
-        inStock,
-        isPreOrderEnabled,
-        preOrderMessage,
-        error,
-        availableQuantity,
-    });
-}