@cimplify/sdk 0.8.6 → 0.8.7

package/dist/react.d.mts

@@ -77,6 +77,22 @@ interface CimplifyCheckoutProps {
 }
 declare function CimplifyCheckout({ client, businessId, cartId, locationId, linkUrl, orderTypes, enrollInLink, onComplete, onError, onStatusChange, appearance, demoMode, className, }: CimplifyCheckoutProps): React.ReactElement;
 
+interface PriceProps {
+    /** The amount in base (business) currency. */
+    amount: number | string;
+    /** Optional CSS class name for the wrapping span. */
+    className?: string;
+    /** Optional prefix rendered before the formatted price (e.g. "+"). */
+    prefix?: string;
+}
+/**
+ * Price — renders a single price value in the user's chosen display currency.
+ *
+ * Reads `displayCurrency` and `convertPrice` from CimplifyProvider context
+ * so every price on the page stays consistent with the selected currency.
+ */
+declare function Price({ amount, className, prefix }: PriceProps): React.ReactElement;
+
 interface CimplifyContextValue {
     client: CimplifyClient;
     business: Business | null;
@@ -87,6 +103,16 @@ interface CimplifyContextValue {
     setCurrentLocation: (location: Location) => void;
     isReady: boolean;
     isDemoMode: boolean;
+    /** The business's pricing currency (always the base, for API calls). */
+    baseCurrency: string;
+    /** The currency prices are displayed in. Equals baseCurrency when no FX override is set. */
+    displayCurrency: string;
+    /** Set a display currency override for FX conversion. Pass null to reset to base currency. */
+    setDisplayCurrency: (currency: string | null) => void;
+    /** Convert a base-currency amount to the display currency. No-op when currencies match. */
+    convertPrice: (amount: number | string) => number;
+    /** Current FX rate (baseCurrency → displayCurrency). Null when no conversion is active. */
+    fxRate: number | null;
 }
 interface CimplifyProviderProps {
     client?: CimplifyClient;
@@ -376,4 +402,4 @@ declare function useCheckout(): {
     isLoading: boolean;
 };
 
-export { Ad, AdPosition, type AdProps, AdProvider, AdSlot, type AddToCartOptions, AddressElement, AuthElement, CimplifyCheckout, type CimplifyCheckoutProps, type CimplifyContextValue, CimplifyProvider, type CimplifyProviderProps, ElementsProvider, PaymentElement, type UseBundleOptions, type UseBundleResult, type UseCartItem, type UseCartOptions, type UseCartResult, type UseCategoriesOptions, type UseCategoriesResult, type UseCollectionOptions, type UseCollectionResult, type UseCollectionsOptions, type UseCollectionsResult, type UseCompositeOptions, type UseCompositeResult, type UseLocationsOptions, type UseLocationsResult, type UseOrderOptions, type UseOrderResult, type UseProductOptions, type UseProductResult, type UseProductsOptions, type UseProductsResult, type UseQuoteInput, type UseQuoteOptions, type UseQuoteResult, type UseSearchOptions, type UseSearchResult, useAds, useBundle, useCart, useCategories, useCheckout, useCimplify, useCollection, useCollections, useComposite, useElements, useElementsReady, useLocations, useOptionalCimplify, useOrder, useProduct, useProducts, useQuote, useSearch };
+export { Ad, AdPosition, type AdProps, AdProvider, AdSlot, type AddToCartOptions, AddressElement, AuthElement, CimplifyCheckout, type CimplifyCheckoutProps, type CimplifyContextValue, CimplifyProvider, type CimplifyProviderProps, ElementsProvider, PaymentElement, Price, type PriceProps, type UseBundleOptions, type UseBundleResult, type UseCartItem, type UseCartOptions, type UseCartResult, type UseCategoriesOptions, type UseCategoriesResult, type UseCollectionOptions, type UseCollectionResult, type UseCollectionsOptions, type UseCollectionsResult, type UseCompositeOptions, type UseCompositeResult, type UseLocationsOptions, type UseLocationsResult, type UseOrderOptions, type UseOrderResult, type UseProductOptions, type UseProductResult, type UseProductsOptions, type UseProductsResult, type UseQuoteInput, type UseQuoteOptions, type UseQuoteResult, type UseSearchOptions, type UseSearchResult, useAds, useBundle, useCart, useCategories, useCheckout, useCimplify, useCollection, useCollections, useComposite, useElements, useElementsReady, useLocations, useOptionalCimplify, useOrder, useProduct, useProducts, useQuote, useSearch };

package/dist/react.d.ts

@@ -77,6 +77,22 @@ interface CimplifyCheckoutProps {
 }
 declare function CimplifyCheckout({ client, businessId, cartId, locationId, linkUrl, orderTypes, enrollInLink, onComplete, onError, onStatusChange, appearance, demoMode, className, }: CimplifyCheckoutProps): React.ReactElement;
 
+interface PriceProps {
+    /** The amount in base (business) currency. */
+    amount: number | string;
+    /** Optional CSS class name for the wrapping span. */
+    className?: string;
+    /** Optional prefix rendered before the formatted price (e.g. "+"). */
+    prefix?: string;
+}
+/**
+ * Price — renders a single price value in the user's chosen display currency.
+ *
+ * Reads `displayCurrency` and `convertPrice` from CimplifyProvider context
+ * so every price on the page stays consistent with the selected currency.
+ */
+declare function Price({ amount, className, prefix }: PriceProps): React.ReactElement;
+
 interface CimplifyContextValue {
     client: CimplifyClient;
     business: Business | null;
@@ -87,6 +103,16 @@ interface CimplifyContextValue {
     setCurrentLocation: (location: Location) => void;
     isReady: boolean;
     isDemoMode: boolean;
+    /** The business's pricing currency (always the base, for API calls). */
+    baseCurrency: string;
+    /** The currency prices are displayed in. Equals baseCurrency when no FX override is set. */
+    displayCurrency: string;
+    /** Set a display currency override for FX conversion. Pass null to reset to base currency. */
+    setDisplayCurrency: (currency: string | null) => void;
+    /** Convert a base-currency amount to the display currency. No-op when currencies match. */
+    convertPrice: (amount: number | string) => number;
+    /** Current FX rate (baseCurrency → displayCurrency). Null when no conversion is active. */
+    fxRate: number | null;
 }
 interface CimplifyProviderProps {
     client?: CimplifyClient;
@@ -376,4 +402,4 @@ declare function useCheckout(): {
     isLoading: boolean;
 };
 
-export { Ad, AdPosition, type AdProps, AdProvider, AdSlot, type AddToCartOptions, AddressElement, AuthElement, CimplifyCheckout, type CimplifyCheckoutProps, type CimplifyContextValue, CimplifyProvider, type CimplifyProviderProps, ElementsProvider, PaymentElement, type UseBundleOptions, type UseBundleResult, type UseCartItem, type UseCartOptions, type UseCartResult, type UseCategoriesOptions, type UseCategoriesResult, type UseCollectionOptions, type UseCollectionResult, type UseCollectionsOptions, type UseCollectionsResult, type UseCompositeOptions, type UseCompositeResult, type UseLocationsOptions, type UseLocationsResult, type UseOrderOptions, type UseOrderResult, type UseProductOptions, type UseProductResult, type UseProductsOptions, type UseProductsResult, type UseQuoteInput, type UseQuoteOptions, type UseQuoteResult, type UseSearchOptions, type UseSearchResult, useAds, useBundle, useCart, useCategories, useCheckout, useCimplify, useCollection, useCollections, useComposite, useElements, useElementsReady, useLocations, useOptionalCimplify, useOrder, useProduct, useProducts, useQuote, useSearch };
+export { Ad, AdPosition, type AdProps, AdProvider, AdSlot, type AddToCartOptions, AddressElement, AuthElement, CimplifyCheckout, type CimplifyCheckoutProps, type CimplifyContextValue, CimplifyProvider, type CimplifyProviderProps, ElementsProvider, PaymentElement, Price, type PriceProps, type UseBundleOptions, type UseBundleResult, type UseCartItem, type UseCartOptions, type UseCartResult, type UseCategoriesOptions, type UseCategoriesResult, type UseCollectionOptions, type UseCollectionResult, type UseCollectionsOptions, type UseCollectionsResult, type UseCompositeOptions, type UseCompositeResult, type UseLocationsOptions, type UseLocationsResult, type UseOrderOptions, type UseOrderResult, type UseProductOptions, type UseProductResult, type UseProductsOptions, type UseProductsResult, type UseQuoteInput, type UseQuoteOptions, type UseQuoteResult, type UseSearchOptions, type UseSearchResult, useAds, useBundle, useCart, useCategories, useCheckout, useCimplify, useCollection, useCollections, useComposite, useElements, useElementsReady, useLocations, useOptionalCimplify, useOrder, useProduct, useProducts, useQuote, useSearch };

package/dist/react.js

@@ -748,6 +748,110 @@ function CimplifyCheckout({
   ] });
 }
 
+// src/utils/price.ts
+var CURRENCY_SYMBOLS = {
+  // Major world currencies
+  USD: "$",
+  EUR: "\u20AC",
+  GBP: "\xA3",
+  JPY: "\xA5",
+  CNY: "\xA5",
+  CHF: "CHF",
+  CAD: "C$",
+  AUD: "A$",
+  NZD: "NZ$",
+  HKD: "HK$",
+  SGD: "S$",
+  INR: "\u20B9",
+  BRL: "R$",
+  MXN: "MX$",
+  KRW: "\u20A9",
+  RUB: "\u20BD",
+  TRY: "\u20BA",
+  THB: "\u0E3F",
+  PLN: "z\u0142",
+  SEK: "kr",
+  NOK: "kr",
+  DKK: "kr",
+  CZK: "K\u010D",
+  HUF: "Ft",
+  ILS: "\u20AA",
+  AED: "\u062F.\u0625",
+  SAR: "\uFDFC",
+  MYR: "RM",
+  PHP: "\u20B1",
+  IDR: "Rp",
+  VND: "\u20AB",
+  TWD: "NT$",
+  // African currencies
+  GHS: "GH\u20B5",
+  NGN: "\u20A6",
+  KES: "KSh",
+  ZAR: "R",
+  XOF: "CFA",
+  XAF: "FCFA",
+  EGP: "E\xA3",
+  MAD: "MAD",
+  TZS: "TSh",
+  UGX: "USh",
+  RWF: "FRw",
+  ETB: "Br",
+  ZMW: "ZK",
+  BWP: "P",
+  MUR: "\u20A8",
+  SCR: "\u20A8",
+  NAD: "N$",
+  SZL: "E",
+  LSL: "L",
+  MWK: "MK",
+  AOA: "Kz",
+  CDF: "FC",
+  GMD: "D",
+  GNF: "FG",
+  LRD: "L$",
+  SLL: "Le",
+  MZN: "MT",
+  SDG: "SDG",
+  SSP: "SSP",
+  SOS: "Sh.So.",
+  DJF: "Fdj",
+  ERN: "Nfk",
+  CVE: "$",
+  STN: "Db",
+  KMF: "CF",
+  BIF: "FBu"
+};
+function getCurrencySymbol(currencyCode2) {
+  return CURRENCY_SYMBOLS[currencyCode2.toUpperCase()] || currencyCode2;
+}
+function formatPrice(amount, currency = "GHS", locale = "en-US") {
+  const numAmount = typeof amount === "string" ? parseFloat(amount) : amount;
+  if (isNaN(numAmount)) {
+    return `${getCurrencySymbol(currency)}0.00`;
+  }
+  try {
+    return new Intl.NumberFormat(locale, {
+      style: "currency",
+      currency: currency.toUpperCase(),
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
+    }).format(numAmount);
+  } catch {
+    return `${getCurrencySymbol(currency)}${numAmount.toFixed(2)}`;
+  }
+}
+function parsePrice(value) {
+  if (value === void 0 || value === null) {
+    return 0;
+  }
+  if (typeof value === "number") {
+    return isNaN(value) ? 0 : value;
+  }
+  const cleaned = value.replace(/[^\d.-]/g, "");
+  const parsed = parseFloat(cleaned);
+  return isNaN(parsed) ? 0 : parsed;
+}
+
 // src/types/common.ts
 function money(value) {
   return value;
@@ -1359,19 +1463,6 @@ var MOBILE_MONEY_PROVIDER = {
   AIRTEL: "airtel"
 };
 
-// src/utils/price.ts
-function parsePrice(value) {
-  if (value === void 0 || value === null) {
-    return 0;
-  }
-  if (typeof value === "number") {
-    return isNaN(value) ? 0 : value;
-  }
-  const cleaned = value.replace(/[^\d.-]/g, "");
-  const parsed = parseFloat(cleaned);
-  return isNaN(parsed) ? 0 : parsed;
-}
-
 // src/utils/payment.ts
 var PAYMENT_SUCCESS_STATUSES = /* @__PURE__ */ new Set([
   "success",
@@ -4320,6 +4411,8 @@ function createCimplifyClient(config = {}) {
   return new CimplifyClient(config);
 }
 var LOCATION_STORAGE_KEY = "cimplify_location_id";
+var DISPLAY_CURRENCY_STORAGE_KEY = "cimplify_display_currency";
+var FX_REFRESH_INTERVAL = 12e4;
 var DEFAULT_CURRENCY = "USD";
 var DEFAULT_COUNTRY = "US";
 function createDefaultClient() {
@@ -4348,6 +4441,27 @@ function setStoredLocationId(locationId) {
   }
   window.localStorage.setItem(LOCATION_STORAGE_KEY, locationId);
 }
+function getStoredDisplayCurrency() {
+  if (typeof window === "undefined" || !window.localStorage) {
+    return null;
+  }
+  const value = window.localStorage.getItem(DISPLAY_CURRENCY_STORAGE_KEY);
+  if (!value) {
+    return null;
+  }
+  const normalized = value.trim().toUpperCase();
+  return normalized.length > 0 ? normalized : null;
+}
+function setStoredDisplayCurrency(currency) {
+  if (typeof window === "undefined" || !window.localStorage) {
+    return;
+  }
+  if (!currency) {
+    window.localStorage.removeItem(DISPLAY_CURRENCY_STORAGE_KEY);
+    return;
+  }
+  window.localStorage.setItem(DISPLAY_CURRENCY_STORAGE_KEY, currency.toUpperCase());
+}
 function resolveInitialLocation(locations) {
   if (locations.length === 0) {
     return null;
@@ -4377,6 +4491,54 @@ function CimplifyProvider({
     onLocationChangeRef.current = onLocationChange;
   }, [onLocationChange]);
   const isDemoMode = resolvedClient.getPublicKey().trim().length === 0;
+  const baseCurrency = business?.default_currency || DEFAULT_CURRENCY;
+  const [displayCurrencyOverride, setDisplayCurrencyOverride] = React2.useState(
+    () => getStoredDisplayCurrency()
+  );
+  const [fxRate, setFxRate] = React2.useState(null);
+  const displayCurrency = displayCurrencyOverride && displayCurrencyOverride !== baseCurrency ? displayCurrencyOverride : baseCurrency;
+  const setDisplayCurrency = React2.useCallback(
+    (currency) => {
+      const normalized = currency?.trim().toUpperCase() || null;
+      setDisplayCurrencyOverride(normalized);
+      setStoredDisplayCurrency(normalized);
+      if (!normalized || normalized === baseCurrency) {
+        setFxRate(null);
+      }
+    },
+    [baseCurrency]
+  );
+  React2.useEffect(() => {
+    if (displayCurrency === baseCurrency || isDemoMode) {
+      setFxRate(null);
+      return;
+    }
+    let cancelled = false;
+    async function fetchRate() {
+      const result = await resolvedClient.fx.getRate(
+        baseCurrency,
+        displayCurrency
+      );
+      if (!cancelled && result.ok) {
+        setFxRate(result.value.rate);
+      }
+    }
+    void fetchRate();
+    const intervalId = setInterval(() => void fetchRate(), FX_REFRESH_INTERVAL);
+    return () => {
+      cancelled = true;
+      clearInterval(intervalId);
+    };
+  }, [resolvedClient, baseCurrency, displayCurrency, isDemoMode]);
+  const convertPrice = React2.useCallback(
+    (amount) => {
+      const num = typeof amount === "string" ? parseFloat(amount) : amount;
+      if (isNaN(num)) return 0;
+      if (!fxRate || displayCurrency === baseCurrency) return num;
+      return Math.round(num * fxRate * 100) / 100;
+    },
+    [fxRate, displayCurrency, baseCurrency]
+  );
   const setCurrentLocation = React2.useCallback(
     (location) => {
       setCurrentLocationState(location);
@@ -4446,22 +4608,32 @@ function CimplifyProvider({
     () => ({
       client: resolvedClient,
       business,
-      currency: business?.default_currency || DEFAULT_CURRENCY,
+      currency: baseCurrency,
       country: business?.country_code || DEFAULT_COUNTRY,
       locations,
       currentLocation,
       setCurrentLocation,
       isReady,
-      isDemoMode
+      isDemoMode,
+      baseCurrency,
+      displayCurrency,
+      setDisplayCurrency,
+      convertPrice,
+      fxRate
     }),
     [
       resolvedClient,
       business,
+      baseCurrency,
       locations,
       currentLocation,
       setCurrentLocation,
       isReady,
-      isDemoMode
+      isDemoMode,
+      displayCurrency,
+      setDisplayCurrency,
+      convertPrice,
+      fxRate
     ]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(CimplifyContext.Provider, { value: contextValue, children });
@@ -4476,6 +4648,13 @@ function useCimplify() {
 function useOptionalCimplify() {
   return React2.useContext(CimplifyContext);
 }
+function Price({ amount, className, prefix }) {
+  const { displayCurrency, convertPrice } = useCimplify();
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className, children: [
+    prefix,
+    formatPrice(convertPrice(amount), displayCurrency)
+  ] });
+}
 var productsCache = /* @__PURE__ */ new Map();
 var productsInflight = /* @__PURE__ */ new Map();
 function buildProductsCacheKey(client, locationId, options) {
@@ -6513,6 +6692,7 @@ exports.CimplifyCheckout = CimplifyCheckout;
 exports.CimplifyProvider = CimplifyProvider;
 exports.ElementsProvider = ElementsProvider;
 exports.PaymentElement = PaymentElement;
+exports.Price = Price;
 exports.useAds = useAds;
 exports.useBundle = useBundle;
 exports.useCart = useCart;

package/dist/react.mjs

@@ -742,6 +742,110 @@ function CimplifyCheckout({
   ] });
 }
 
+// src/utils/price.ts
+var CURRENCY_SYMBOLS = {
+  // Major world currencies
+  USD: "$",
+  EUR: "\u20AC",
+  GBP: "\xA3",
+  JPY: "\xA5",
+  CNY: "\xA5",
+  CHF: "CHF",
+  CAD: "C$",
+  AUD: "A$",
+  NZD: "NZ$",
+  HKD: "HK$",
+  SGD: "S$",
+  INR: "\u20B9",
+  BRL: "R$",
+  MXN: "MX$",
+  KRW: "\u20A9",
+  RUB: "\u20BD",
+  TRY: "\u20BA",
+  THB: "\u0E3F",
+  PLN: "z\u0142",
+  SEK: "kr",
+  NOK: "kr",
+  DKK: "kr",
+  CZK: "K\u010D",
+  HUF: "Ft",
+  ILS: "\u20AA",
+  AED: "\u062F.\u0625",
+  SAR: "\uFDFC",
+  MYR: "RM",
+  PHP: "\u20B1",
+  IDR: "Rp",
+  VND: "\u20AB",
+  TWD: "NT$",
+  // African currencies
+  GHS: "GH\u20B5",
+  NGN: "\u20A6",
+  KES: "KSh",
+  ZAR: "R",
+  XOF: "CFA",
+  XAF: "FCFA",
+  EGP: "E\xA3",
+  MAD: "MAD",
+  TZS: "TSh",
+  UGX: "USh",
+  RWF: "FRw",
+  ETB: "Br",
+  ZMW: "ZK",
+  BWP: "P",
+  MUR: "\u20A8",
+  SCR: "\u20A8",
+  NAD: "N$",
+  SZL: "E",
+  LSL: "L",
+  MWK: "MK",
+  AOA: "Kz",
+  CDF: "FC",
+  GMD: "D",
+  GNF: "FG",
+  LRD: "L$",
+  SLL: "Le",
+  MZN: "MT",
+  SDG: "SDG",
+  SSP: "SSP",
+  SOS: "Sh.So.",
+  DJF: "Fdj",
+  ERN: "Nfk",
+  CVE: "$",
+  STN: "Db",
+  KMF: "CF",
+  BIF: "FBu"
+};
+function getCurrencySymbol(currencyCode2) {
+  return CURRENCY_SYMBOLS[currencyCode2.toUpperCase()] || currencyCode2;
+}
+function formatPrice(amount, currency = "GHS", locale = "en-US") {
+  const numAmount = typeof amount === "string" ? parseFloat(amount) : amount;
+  if (isNaN(numAmount)) {
+    return `${getCurrencySymbol(currency)}0.00`;
+  }
+  try {
+    return new Intl.NumberFormat(locale, {
+      style: "currency",
+      currency: currency.toUpperCase(),
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
+    }).format(numAmount);
+  } catch {
+    return `${getCurrencySymbol(currency)}${numAmount.toFixed(2)}`;
+  }
+}
+function parsePrice(value) {
+  if (value === void 0 || value === null) {
+    return 0;
+  }
+  if (typeof value === "number") {
+    return isNaN(value) ? 0 : value;
+  }
+  const cleaned = value.replace(/[^\d.-]/g, "");
+  const parsed = parseFloat(cleaned);
+  return isNaN(parsed) ? 0 : parsed;
+}
+
 // src/types/common.ts
 function money(value) {
   return value;
@@ -1353,19 +1457,6 @@ var MOBILE_MONEY_PROVIDER = {
   AIRTEL: "airtel"
 };
 
-// src/utils/price.ts
-function parsePrice(value) {
-  if (value === void 0 || value === null) {
-    return 0;
-  }
-  if (typeof value === "number") {
-    return isNaN(value) ? 0 : value;
-  }
-  const cleaned = value.replace(/[^\d.-]/g, "");
-  const parsed = parseFloat(cleaned);
-  return isNaN(parsed) ? 0 : parsed;
-}
-
 // src/utils/payment.ts
 var PAYMENT_SUCCESS_STATUSES = /* @__PURE__ */ new Set([
   "success",
@@ -4314,6 +4405,8 @@ function createCimplifyClient(config = {}) {
   return new CimplifyClient(config);
 }
 var LOCATION_STORAGE_KEY = "cimplify_location_id";
+var DISPLAY_CURRENCY_STORAGE_KEY = "cimplify_display_currency";
+var FX_REFRESH_INTERVAL = 12e4;
 var DEFAULT_CURRENCY = "USD";
 var DEFAULT_COUNTRY = "US";
 function createDefaultClient() {
@@ -4342,6 +4435,27 @@ function setStoredLocationId(locationId) {
   }
   window.localStorage.setItem(LOCATION_STORAGE_KEY, locationId);
 }
+function getStoredDisplayCurrency() {
+  if (typeof window === "undefined" || !window.localStorage) {
+    return null;
+  }
+  const value = window.localStorage.getItem(DISPLAY_CURRENCY_STORAGE_KEY);
+  if (!value) {
+    return null;
+  }
+  const normalized = value.trim().toUpperCase();
+  return normalized.length > 0 ? normalized : null;
+}
+function setStoredDisplayCurrency(currency) {
+  if (typeof window === "undefined" || !window.localStorage) {
+    return;
+  }
+  if (!currency) {
+    window.localStorage.removeItem(DISPLAY_CURRENCY_STORAGE_KEY);
+    return;
+  }
+  window.localStorage.setItem(DISPLAY_CURRENCY_STORAGE_KEY, currency.toUpperCase());
+}
 function resolveInitialLocation(locations) {
   if (locations.length === 0) {
     return null;
@@ -4371,6 +4485,54 @@ function CimplifyProvider({
     onLocationChangeRef.current = onLocationChange;
   }, [onLocationChange]);
   const isDemoMode = resolvedClient.getPublicKey().trim().length === 0;
+  const baseCurrency = business?.default_currency || DEFAULT_CURRENCY;
+  const [displayCurrencyOverride, setDisplayCurrencyOverride] = useState(
+    () => getStoredDisplayCurrency()
+  );
+  const [fxRate, setFxRate] = useState(null);
+  const displayCurrency = displayCurrencyOverride && displayCurrencyOverride !== baseCurrency ? displayCurrencyOverride : baseCurrency;
+  const setDisplayCurrency = useCallback(
+    (currency) => {
+      const normalized = currency?.trim().toUpperCase() || null;
+      setDisplayCurrencyOverride(normalized);
+      setStoredDisplayCurrency(normalized);
+      if (!normalized || normalized === baseCurrency) {
+        setFxRate(null);
+      }
+    },
+    [baseCurrency]
+  );
+  useEffect(() => {
+    if (displayCurrency === baseCurrency || isDemoMode) {
+      setFxRate(null);
+      return;
+    }
+    let cancelled = false;
+    async function fetchRate() {
+      const result = await resolvedClient.fx.getRate(
+        baseCurrency,
+        displayCurrency
+      );
+      if (!cancelled && result.ok) {
+        setFxRate(result.value.rate);
+      }
+    }
+    void fetchRate();
+    const intervalId = setInterval(() => void fetchRate(), FX_REFRESH_INTERVAL);
+    return () => {
+      cancelled = true;
+      clearInterval(intervalId);
+    };
+  }, [resolvedClient, baseCurrency, displayCurrency, isDemoMode]);
+  const convertPrice = useCallback(
+    (amount) => {
+      const num = typeof amount === "string" ? parseFloat(amount) : amount;
+      if (isNaN(num)) return 0;
+      if (!fxRate || displayCurrency === baseCurrency) return num;
+      return Math.round(num * fxRate * 100) / 100;
+    },
+    [fxRate, displayCurrency, baseCurrency]
+  );
   const setCurrentLocation = useCallback(
     (location) => {
       setCurrentLocationState(location);
@@ -4440,22 +4602,32 @@ function CimplifyProvider({
     () => ({
       client: resolvedClient,
       business,
-      currency: business?.default_currency || DEFAULT_CURRENCY,
+      currency: baseCurrency,
       country: business?.country_code || DEFAULT_COUNTRY,
       locations,
       currentLocation,
       setCurrentLocation,
       isReady,
-      isDemoMode
+      isDemoMode,
+      baseCurrency,
+      displayCurrency,
+      setDisplayCurrency,
+      convertPrice,
+      fxRate
     }),
     [
       resolvedClient,
       business,
+      baseCurrency,
       locations,
       currentLocation,
       setCurrentLocation,
       isReady,
-      isDemoMode
+      isDemoMode,
+      displayCurrency,
+      setDisplayCurrency,
+      convertPrice,
+      fxRate
     ]
   );
   return /* @__PURE__ */ jsx(CimplifyContext.Provider, { value: contextValue, children });
@@ -4470,6 +4642,13 @@ function useCimplify() {
 function useOptionalCimplify() {
   return useContext(CimplifyContext);
 }
+function Price({ amount, className, prefix }) {
+  const { displayCurrency, convertPrice } = useCimplify();
+  return /* @__PURE__ */ jsxs("span", { className, children: [
+    prefix,
+    formatPrice(convertPrice(amount), displayCurrency)
+  ] });
+}
 var productsCache = /* @__PURE__ */ new Map();
 var productsInflight = /* @__PURE__ */ new Map();
 function buildProductsCacheKey(client, locationId, options) {
@@ -6499,4 +6678,4 @@ function useCheckout() {
   return { submit, process, isLoading };
 }
 
-export { Ad, AdProvider, AddressElement, AuthElement, CimplifyCheckout, CimplifyProvider, ElementsProvider, PaymentElement, useAds, useBundle, useCart, useCategories, useCheckout, useCimplify, useCollection, useCollections, useComposite, useElements, useElementsReady, useLocations, useOptionalCimplify, useOrder, useProduct, useProducts, useQuote, useSearch };
+export { Ad, AdProvider, AddressElement, AuthElement, CimplifyCheckout, CimplifyProvider, ElementsProvider, PaymentElement, Price, useAds, useBundle, useCart, useCategories, useCheckout, useCimplify, useCollection, useCollections, useComposite, useElements, useElementsReady, useLocations, useOptionalCimplify, useOrder, useProduct, useProducts, useQuote, useSearch };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cimplify/sdk",
-  "version": "0.8.6",
+  "version": "0.8.7",
   "description": "Cimplify Commerce SDK for storefronts",
   "keywords": [
     "cimplify",