Price Hooks

useIgPrices() returns the price (and compare-at price) for the currently assigned variation when one is available. When no eligible experience is found or the experience is not ready, the hook falls back to the original price inputs and marks isIgPrice as false.

High-level behavior:

1. If no productId or variantId is provided, the hook returns a best-effort conversion of originalPrice / originalCompareAtPrice (if provided) and sets isIgPrice: false.

2. If the product/variant is part of an active experience and the user has a resolved variation assignment, the hook returns the assigned test price and sets isIgPrice: true.

3. If the experience is pending assignment or the experience is in preview but the user is not (or vice-versa), the hook returns original prices and sets isReady accordingly.

useIgPrices()

Returns the product price based on the user's test group. Intelligems will return the original prices if updated prices are not found. You may pass in an object with the required data or an array of objects. If an array is passed in, the response will be an object keyed by variantId.

export interface UseIgPricesProps {
  productId?: string;
  variantId?: string;
  originalPrice?: number | string;
  originalCompareAtPrice?: number | string;
  currencyCode?: string;
}

export interface IgPriceReturn {
  value: number | null;
  currencyCode: string;
}

export interface DuplicateProductReturn {
  productId: string;
  variantId: string;
  handle: string;
}

export interface UseIgPricesReturn {
  igPrice?: IgPriceReturn;
  igCompareAtPrice?: IgPriceReturn;
  duplicateProduct?: DuplicateProductReturn;
  experienceId?: string;
  variationId?: string;
  isIgPrice: boolean;
  isReady: boolean;
}

type UseIgPricesInput = UseIgPricesProps | UseIgPricesProps[];

export type UseIgPricesOutput<T extends UseIgPricesInput> =
  T extends UseIgPricesProps[]
    ? Record<string, UseIgPricesReturn>
    : UseIgPricesReturn;

const useIgPrices = <T extends UseIgPricesInput>(
  props: UseIgPricesInput
) => UseIgPricesOutput

When passing an array, the return value is an object keyed by variantId. Use isIgMultiPriceReturn() to type-guard the multi-return shape.

useIgStyles

Useful for manually styling components for integration mode.

const igStyles = useIgStyles(isIgPrice);