@propeller-commerce/propeller-v2-react-ui 0.18.0 → 0.19.0

package/dist/index.js

@@ -1,8 +1,8 @@
 "use client";
-import { getLabel, getLocalizedValue, formatPrice, getClusterSku, getClusterImageUrl, isContentHidden, getProductSku, getProductImageUrl, createServices, err, ok, formatSurcharge, deriveUserMode, isContact, isCustomer, getAddresses, attributeNameMatches, getAttributeDisplayName, filterProductsBySelections, extractAttributeValues, buildInventoryFilter, MIN_STOCK_THRESHOLD, getNettedBonusItems, getLanguageString, collectAttributeValues, getCountryName } from '@propeller-commerce/propeller-v2-core-ui';
+import { getLabel, getLocalizedValue, formatPrice, localeForLanguage, getClusterSku, getClusterImageUrl, isContentHidden, getProductSku, getProductImageUrl, createServices, err, ok, formatSurcharge, deriveUserMode, isContact, isCustomer, getAddresses, attributeNameMatches, getAttributeDisplayName, filterProductsBySelections, extractAttributeValues, buildInventoryFilter, MIN_STOCK_THRESHOLD, getNettedBonusItems, getLanguageString, collectAttributeValues, getCountryName } from '@propeller-commerce/propeller-v2-core-ui';
 export * from '@propeller-commerce/propeller-v2-core-ui';
 import * as React6 from 'react';
-import { createContext, useState, useRef, useMemo, useCallback, useContext, useEffect } from 'react';
+import { createContext, useState, useRef, useCallback, useMemo, useContext, useEffect } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { ProductStatus, ProductSortField, SortOrder, PurchaseRole, CrossupsellType, CartStatus, CartAddressType, Gender, YesNo, AddressType, MagicTokenService, PaymentStatuses, OrderSearchFields, OrderItemClass, ProductSearchableField, machineService, AttributeType, OrderSortField, OrderType, OrderDiscountType, BundleCondition } from '@propeller-commerce/propeller-sdk-v2';
 import { clsx } from 'clsx';
@@ -716,12 +716,33 @@ async function initCart(config) {
 }
 
 // src/composables/react/useCart.ts
+var DEFAULT_IMAGE_SEARCH_FILTERS = { page: 1, offset: 1 };
+var DEFAULT_IMAGE_VARIANT_FILTERS = {
+  transformations: [
+    { name: "thumb", transformation: { format: "WEBP", height: 100, width: 100, fit: "BOUNDS" } }
+  ]
+};
 function useCart(options) {
   const { graphqlClient, user, companyId, configuration, onCartCreated } = options;
   const language = options.language || configuration?.language || "NL";
   const [cart, setCart] = useState(null);
   const [createdCartId, setCreatedCartId] = useState("");
   const cartId = options.cartId || createdCartId;
+  const cartIdRef = useRef(cartId);
+  if (cartId && cartIdRef.current !== cartId) cartIdRef.current = cartId;
+  const rememberCart = useCallback((c) => {
+    setCart(c);
+    setCreatedCartId(c.cartId);
+    cartIdRef.current = c.cartId;
+  }, []);
+  const imageSearchFilters = useCallback(
+    () => configuration?.imageSearchFiltersGrid ?? DEFAULT_IMAGE_SEARCH_FILTERS,
+    [configuration]
+  );
+  const imageVariantFilters = useCallback(
+    () => configuration?.imageVariantFiltersSmall ?? DEFAULT_IMAGE_VARIANT_FILTERS,
+    [configuration]
+  );
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState(null);
   const notesTimers = useRef({});
@@ -753,17 +774,15 @@ function useCart(options) {
       user,
       companyId,
       language,
-      imageSearchFilters: configuration?.imageSearchFiltersGrid,
-      imageVariantFilters: configuration?.imageVariantFiltersSmall,
+      imageSearchFilters: imageSearchFilters(),
+      imageVariantFilters: imageVariantFilters(),
       onCartCreated: (c) => {
-        setCart(c);
-        setCreatedCartId(c.cartId);
+        rememberCart(c);
         onCartCreated?.(c);
       }
     };
     const resolved = await initCart(config);
-    setCart(resolved);
-    setCreatedCartId(resolved.cartId);
+    rememberCart(resolved);
     return resolved;
   }, [graphqlClient, user, companyId, language, configuration, onCartCreated]);
   const addItem = useCallback(async (opts) => {
@@ -776,14 +795,13 @@ function useCart(options) {
       }
       const childItemInputs = opts.childItems?.map((id) => ({ productId: id, quantity: opts.quantity }));
       if (opts.onAddToCart) {
-        const resultCart2 = opts.onAddToCart(opts.product, opts.cluster?.clusterId, opts.quantity, childItemInputs, opts.notes, opts.price);
-        setCart(resultCart2);
-        setCreatedCartId(resultCart2.cartId);
+        const resultCart2 = await opts.onAddToCart(opts.product, opts.cluster?.clusterId, opts.quantity, childItemInputs, opts.notes, opts.price);
+        rememberCart(resultCart2);
         const addedItem2 = resultCart2.items?.find((i) => i.productId === opts.product.productId) ?? null;
         opts.afterAddToCart?.(resultCart2, addedItem2);
         return ok({ cart: resultCart2, item: addedItem2 });
       }
-      let resolvedCartId = opts.cartId || cartId;
+      let resolvedCartId = opts.cartId || cartIdRef.current || cartId;
       if (!resolvedCartId) {
         if (opts.createCart) {
           const c = await resolveCart();
@@ -795,11 +813,10 @@ function useCart(options) {
         id: resolvedCartId,
         input: { productId: opts.product.productId, quantity: opts.quantity, ...opts.cluster?.clusterId !== void 0 && { clusterId: opts.cluster.clusterId }, ...childItemInputs && { childItems: childItemInputs }, ...opts.notes && { notes: opts.notes }, ...opts.price !== void 0 && { price: opts.price } },
         language,
-        imageSearchFilters: configuration?.imageSearchFiltersGrid,
-        imageVariantFilters: configuration?.imageVariantFiltersSmall
+        imageSearchFilters: imageSearchFilters(),
+        imageVariantFilters: imageVariantFilters()
       });
-      setCart(resultCart);
-      setCreatedCartId(resultCart.cartId);
+      rememberCart(resultCart);
       const addedItem = resultCart.items?.find((i) => i.productId === opts.product.productId) ?? null;
       opts.afterAddToCart?.(resultCart, addedItem);
       return ok({ cart: resultCart, item: addedItem });
@@ -810,13 +827,25 @@ function useCart(options) {
     } finally {
       setLoading(false);
     }
-  }, [graphqlClient, cartId, language, configuration, resolveCart]);
+  }, [graphqlClient, cartId, language, configuration, resolveCart, rememberCart, imageSearchFilters, imageVariantFilters]);
+  const addItems = useCallback(async (items) => {
+    const added = [];
+    let lastCart = null;
+    for (const item of items) {
+      const result = await addItem({ createCart: true, ...item });
+      if (!result.ok) return err(result.error);
+      lastCart = result.data.cart;
+      added.push(result.data.item);
+    }
+    if (!lastCart) return err("No items to add");
+    return ok({ cart: lastCart, items: added });
+  }, [addItem]);
   const updateItemQuantity = useCallback(async (cartItemId, quantity) => {
     if (!cartId) return void 0;
     setLoading(true);
     try {
       const service = createServices(graphqlClient).cart;
-      const updated = await service.updateCartItem({ id: cartId, itemId: cartItemId, input: { quantity }, language, imageSearchFilters: configuration?.imageSearchFiltersGrid, imageVariantFilters: configuration?.imageVariantFiltersSmall });
+      const updated = await service.updateCartItem({ id: cartId, itemId: cartItemId, input: { quantity }, language, imageSearchFilters: imageSearchFilters(), imageVariantFilters: imageVariantFilters() });
       setCart(updated);
       return updated;
     } catch (e) {
@@ -832,7 +861,7 @@ function useCart(options) {
       if (!cartId) return;
       try {
         const service = createServices(graphqlClient).cart;
-        const updated = await service.updateCartItem({ id: cartId, itemId: cartItemId, input: { notes }, language, imageSearchFilters: configuration?.imageSearchFiltersGrid, imageVariantFilters: configuration?.imageVariantFiltersSmall });
+        const updated = await service.updateCartItem({ id: cartId, itemId: cartItemId, input: { notes }, language, imageSearchFilters: imageSearchFilters(), imageVariantFilters: imageVariantFilters() });
         setCart(updated);
       } catch (e) {
         setError(e instanceof Error ? e.message : "Failed to update notes");
@@ -848,8 +877,8 @@ function useCart(options) {
         id: cartId,
         input: { itemId: cartItemId },
         language,
-        imageSearchFilters: configuration?.imageSearchFiltersGrid,
-        imageVariantFilters: configuration?.imageVariantFiltersSmall
+        imageSearchFilters: imageSearchFilters(),
+        imageVariantFilters: imageVariantFilters()
       });
       setCart(updated);
       return updated;
@@ -863,7 +892,7 @@ function useCart(options) {
     if (!cartId) return void 0;
     try {
       const service = createServices(graphqlClient).cart;
-      const updated = await service.addActionCodeToCart({ id: cartId, input: { actionCode: code }, language, imageSearchFilters: configuration?.imageSearchFiltersGrid, imageVariantFilters: configuration?.imageVariantFiltersSmall });
+      const updated = await service.addActionCodeToCart({ id: cartId, input: { actionCode: code }, language, imageSearchFilters: imageSearchFilters(), imageVariantFilters: imageVariantFilters() });
       setCart(updated);
       return updated;
     } catch (e) {
@@ -874,7 +903,7 @@ function useCart(options) {
     if (!cartId) return void 0;
     try {
       const service = createServices(graphqlClient).cart;
-      const updated = await service.removeActionCodeFromCart({ id: cartId, input: { actionCode: code }, language, imageSearchFilters: configuration?.imageSearchFiltersGrid, imageVariantFilters: configuration?.imageVariantFiltersSmall });
+      const updated = await service.removeActionCodeFromCart({ id: cartId, input: { actionCode: code }, language, imageSearchFilters: imageSearchFilters(), imageVariantFilters: imageVariantFilters() });
       setCart(updated);
       return updated;
     } catch (e) {
@@ -902,7 +931,7 @@ function useCart(options) {
     }
   }, [graphqlClient, cartId, language]);
   const getCrossupsells = useCallback(async (opts) => {
-    const { productId, clusterId, types, taxZone, imageVariantFilters } = opts;
+    const { productId, clusterId, types, taxZone } = opts;
     if (!productId && !clusterId) return [];
     try {
       const service = createServices(graphqlClient).crossupsell;
@@ -915,8 +944,8 @@ function useCart(options) {
           ...clusterId && { clusterIdsFrom: [clusterId] }
         },
         language,
-        imageSearchFilters: configuration?.imageSearchFiltersGrid,
-        imageVariantFilters: imageVariantFilters ?? configuration?.imageVariantFiltersSmall,
+        imageSearchFilters: imageSearchFilters(),
+        imageVariantFilters: opts.imageVariantFilters ?? imageVariantFilters(),
         priceCalculateProductInput: {
           taxZone: taxZone || "NL",
           ...user && "company" in user && { companyId: user?.company?.companyId },
@@ -929,8 +958,8 @@ function useCart(options) {
     } catch {
       return [];
     }
-  }, [graphqlClient, language, configuration, user]);
-  return { cart, cartId, loading, error, checkoutAllowed, resolveCart, addItem, updateItemQuantity, updateItemNotes, deleteItem, addActionCode, removeActionCode, requestAuthorization, processCart, getCrossupsells, getMinQuantity, getStep };
+  }, [graphqlClient, language, user, imageSearchFilters, imageVariantFilters]);
+  return { cart, cartId, loading, error, checkoutAllowed, resolveCart, addItem, addItems, updateItemQuantity, updateItemNotes, deleteItem, addActionCode, removeActionCode, requestAuthorization, processCart, getCrossupsells, getMinQuantity, getStep };
 }
 function buildAddressInput(type, addr) {
   return {
@@ -4423,6 +4452,64 @@ function ActionCode(rawProps) {
   ] });
 }
 var ActionCode_default = ActionCode;
+function CartBonusItems(rawProps) {
+  const props = useInfraProps(rawProps);
+  const items = props.bonusItems ?? props.cart?.bonusItems ?? [];
+  if (items.length === 0) return null;
+  const currency = props.currency ?? "\u20AC";
+  const money = (value) => formatPrice(value, { symbol: currency, locale: localeForLanguage(props.language) });
+  const productName = (item) => getLocalizedValue(item.product?.names, props.language, "Product");
+  const productImage = (item) => item.product?.media?.images?.items?.[0]?.imageVariants?.[0]?.url || "";
+  return /* @__PURE__ */ jsxs("div", { className: cn(`propeller-cart-bonus-items ${props.className || "mt-2"}`), children: [
+    /* @__PURE__ */ jsx("h2", { className: "propeller-cart-bonus-items__title text-lg font-semibold mb-3", children: getLabel(props.labels, "title", "Bonus items") }),
+    /* @__PURE__ */ jsx("div", { className: "propeller-cart-bonus-items__list space-y-4", children: items.map((item) => {
+      const img = productImage(item);
+      const name = productName(item);
+      const total = props.includeTax ? item.totalPriceNet : item.totalPrice;
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "propeller-cart-bonus-item flex items-center gap-4 bg-card p-4 rounded-container shadow-sm border border-border",
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "propeller-cart-bonus-item__media w-20 h-20 flex-shrink-0 bg-surface-hover rounded-control overflow-hidden flex items-center justify-center", children: img ? /* @__PURE__ */ jsx("img", { className: "propeller-cart-bonus-item__image w-full h-full object-contain p-1", src: img, alt: name }) : /* @__PURE__ */ jsx(
+              "svg",
+              {
+                fill: "none",
+                viewBox: "0 0 24 24",
+                stroke: "currentColor",
+                className: "propeller-cart-bonus-item__image-placeholder w-8 h-8 text-foreground-subtle",
+                strokeWidth: 1.5,
+                children: /* @__PURE__ */ jsx(
+                  "path",
+                  {
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    d: "M2.25 15.75l5.159-5.159a2.25 2.25 0 013.182 0l5.159 5.159m-1.5-1.5l1.409-1.409a2.25 2.25 0 013.182 0l2.909 2.909M3.75 21h16.5A2.25 2.25 0 0022.5 18.75V5.25A2.25 2.25 0 0020.25 3H3.75A2.25 2.25 0 001.5 5.25v13.5A2.25 2.25 0 003.75 21z"
+                  }
+                )
+              }
+            ) }),
+            /* @__PURE__ */ jsxs("div", { className: "propeller-cart-bonus-item__body flex-1 min-w-0", children: [
+              item.product?.sku ? /* @__PURE__ */ jsxs("p", { className: "propeller-cart-bonus-item__sku font-mono text-xs text-foreground-subtle", children: [
+                getLabel(props.labels, "sku", "SKU"),
+                ": ",
+                item.product.sku
+              ] }) : null,
+              /* @__PURE__ */ jsx("p", { className: "propeller-cart-bonus-item__title font-semibold text-sm md:text-base text-foreground line-clamp-2", children: name })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "propeller-cart-bonus-item__qty text-sm text-muted-foreground whitespace-nowrap", children: [
+              item.quantity,
+              " \xD7"
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "propeller-cart-bonus-item__price font-semibold text-foreground whitespace-nowrap", children: money(total) })
+          ]
+        },
+        item.itemId
+      );
+    }) })
+  ] });
+}
+var CartBonusItems_default = CartBonusItems;
 function mergeGrouped(p) {
   const d = p.display;
   const e = p.events;
@@ -4456,6 +4543,7 @@ function AddToCart(rawProps) {
   const [modalVisible, setModalVisible] = useState(() => false);
   const [addedCartItem, setAddedCartItem] = useState(() => null);
   const [activeFullCart, setActiveFullCart] = useState(() => null);
+  const [grantedBonusItems, setGrantedBonusItems] = useState(() => []);
   const [includeTax] = useState(() => false);
   function getProductUrl2() {
     return props.configuration?.urls?.getProductUrl(props.product, props.language) ?? "#";
@@ -4498,9 +4586,9 @@ function AddToCart(rawProps) {
     if (addedCartItem) {
       const useTax = props.includeTax !== void 0 ? !!props.includeTax : includeTax;
       const price = useTax ? addedCartItem.totalSumNet : addedCartItem.totalSum;
-      return formatPrice(price, { symbol: props.currency ?? "\u20AC" });
+      return formatPrice(price, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
     }
-    return formatPrice(props.price !== void 0 ? props.price : props.product?.price?.gross, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(props.price !== void 0 ? props.price : props.product?.price?.gross, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function getModalSku() {
     if (addedCartItem) return addedCartItem.product?.sku || "";
@@ -4534,10 +4622,20 @@ function AddToCart(rawProps) {
   function closeModal() {
     setModalVisible(false);
     setAddedCartItem(null);
+    setGrantedBonusItems([]);
+  }
+  function newBonusItems(before, after) {
+    const granted = after?.bonusItems ?? [];
+    if (granted.length === 0) return [];
+    const previous = before?.bonusItems;
+    if (!previous) return granted;
+    const seen = new Map(previous.map((item) => [item.itemId, item.quantity ?? 0]));
+    return granted.filter((item) => (item.quantity ?? 0) > (seen.get(item.itemId) ?? 0));
   }
   async function handleAddToCart() {
     if (!props.graphqlClient) return;
     if (props.beforeAddToCart && !props.beforeAddToCart()) return;
+    const cartBeforeAdd = activeFullCart ?? cart ?? null;
     const result = await addItem({
       product: props.product,
       cluster: props.cluster,
@@ -4549,6 +4647,7 @@ function AddToCart(rawProps) {
       afterAddToCart: (resultCart, addedItem) => {
         setActiveFullCart(resultCart);
         setAddedCartItem(resolveAddedItem(resultCart, addedItem || null));
+        setGrantedBonusItems(newBonusItems(cartBeforeAdd, resultCart));
         props.afterAddToCart?.(resultCart, addedItem || void 0);
       },
       enableStockValidation: props.enableStockValidation,
@@ -4845,12 +4944,22 @@ function AddToCart(rawProps) {
                     /* @__PURE__ */ jsx("span", { className: "line-clamp-1", children: getLocalizedValue(child.product?.names, props.language, "Option") }),
                     /* @__PURE__ */ jsx("span", { className: "text-foreground-subtle whitespace-nowrap ml-2", children: formatPrice(
                       ((props.includeTax !== void 0 ? !!props.includeTax : includeTax) ? child.totalSumNet : child.totalSum) ?? 0,
-                      { symbol: props.currency ?? "\u20AC" }
+                      { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) }
                     ) })
                   ]
                 },
                 idx
-              )) }) : null
+              )) }) : null,
+              grantedBonusItems.length > 0 ? /* @__PURE__ */ jsx("div", { className: "propeller-add-to-cart__modal-bonus-items mt-4 pt-4 border-t border-border-subtle", children: /* @__PURE__ */ jsx(
+                CartBonusItems_default,
+                {
+                  bonusItems: grantedBonusItems,
+                  includeTax: props.includeTax,
+                  currency: props.currency,
+                  language: props.language,
+                  labels: props.bonusItemsLabels
+                }
+              ) }) : null
             ] }),
             /* @__PURE__ */ jsxs("div", { className: "propeller-add-to-cart__modal-actions flex gap-3 px-6 py-4 border-t border-border-subtle", children: [
               /* @__PURE__ */ jsx(
@@ -6376,64 +6485,6 @@ function BreadcrumbsWithProvider(rawProps) {
   return /* @__PURE__ */ jsx(Breadcrumbs_default, { ...props });
 }
 var BreadcrumbsWithProvider_default = BreadcrumbsWithProvider;
-function CartBonusItems(rawProps) {
-  const props = useInfraProps(rawProps);
-  const items = props.bonusItems ?? props.cart?.bonusItems ?? [];
-  if (items.length === 0) return null;
-  const currency = props.currency ?? "\u20AC";
-  const money = (value) => formatPrice(value, { symbol: currency });
-  const productName = (item) => getLocalizedValue(item.product?.names, props.language, "Product");
-  const productImage = (item) => item.product?.media?.images?.items?.[0]?.imageVariants?.[0]?.url || "";
-  return /* @__PURE__ */ jsxs("div", { className: cn(`propeller-cart-bonus-items ${props.className || "mt-2"}`), children: [
-    /* @__PURE__ */ jsx("h2", { className: "propeller-cart-bonus-items__title text-lg font-semibold mb-3", children: getLabel(props.labels, "title", "Bonus items") }),
-    /* @__PURE__ */ jsx("div", { className: "propeller-cart-bonus-items__list space-y-4", children: items.map((item) => {
-      const img = productImage(item);
-      const name = productName(item);
-      const total = props.includeTax ? item.totalPriceNet : item.totalPrice;
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: "propeller-cart-bonus-item flex items-center gap-4 bg-card p-4 rounded-container shadow-sm border border-border",
-          children: [
-            /* @__PURE__ */ jsx("div", { className: "propeller-cart-bonus-item__media w-20 h-20 flex-shrink-0 bg-surface-hover rounded-control overflow-hidden flex items-center justify-center", children: img ? /* @__PURE__ */ jsx("img", { className: "propeller-cart-bonus-item__image w-full h-full object-contain p-1", src: img, alt: name }) : /* @__PURE__ */ jsx(
-              "svg",
-              {
-                fill: "none",
-                viewBox: "0 0 24 24",
-                stroke: "currentColor",
-                className: "propeller-cart-bonus-item__image-placeholder w-8 h-8 text-foreground-subtle",
-                strokeWidth: 1.5,
-                children: /* @__PURE__ */ jsx(
-                  "path",
-                  {
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    d: "M2.25 15.75l5.159-5.159a2.25 2.25 0 013.182 0l5.159 5.159m-1.5-1.5l1.409-1.409a2.25 2.25 0 013.182 0l2.909 2.909M3.75 21h16.5A2.25 2.25 0 0022.5 18.75V5.25A2.25 2.25 0 0020.25 3H3.75A2.25 2.25 0 001.5 5.25v13.5A2.25 2.25 0 003.75 21z"
-                  }
-                )
-              }
-            ) }),
-            /* @__PURE__ */ jsxs("div", { className: "propeller-cart-bonus-item__body flex-1 min-w-0", children: [
-              item.product?.sku ? /* @__PURE__ */ jsxs("p", { className: "propeller-cart-bonus-item__sku font-mono text-xs text-foreground-subtle", children: [
-                getLabel(props.labels, "sku", "SKU"),
-                ": ",
-                item.product.sku
-              ] }) : null,
-              /* @__PURE__ */ jsx("p", { className: "propeller-cart-bonus-item__title font-semibold text-sm md:text-base text-foreground line-clamp-2", children: name })
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "propeller-cart-bonus-item__qty text-sm text-muted-foreground whitespace-nowrap", children: [
-              item.quantity,
-              " \xD7"
-            ] }),
-            /* @__PURE__ */ jsx("div", { className: "propeller-cart-bonus-item__price font-semibold text-foreground whitespace-nowrap", children: money(total) })
-          ]
-        },
-        item.itemId
-      );
-    }) })
-  ] });
-}
-var CartBonusItems_default = CartBonusItems;
 
 // src/composables/shared/utils/preselect.ts
 function pickPreselected(items, stored, keyOf) {
@@ -6447,7 +6498,7 @@ function CartCarriers(props) {
   const carriers = props.cart?.carriers || [];
   function formatCarrierPrice(price) {
     if (props.formatPrice) return props.formatPrice(price);
-    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function handleSelect(carrier) {
     setSelectedName(carrier.name);
@@ -6644,7 +6695,7 @@ function CartItem(rawProps) {
   function getFormattedPrice() {
     const item = props.cartItem;
     const price = props.includeTax ? item?.totalSumNet || 0 : item?.totalSum || 0;
-    return formatPrice(price, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function isBundleItem() {
     return !!props.cartItem.bundle;
@@ -6655,7 +6706,7 @@ function CartItem(rawProps) {
   function getBundlePrice2() {
     const price = props.cartItem.bundle?.price?.net;
     if (price === void 0 || price === null) return "";
-    return formatPrice(price, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function getBundleLeaderName() {
     const items = props.cartItem.bundle?.items;
@@ -6671,7 +6722,7 @@ function CartItem(rawProps) {
     if (!leader) return "";
     const price = leader.price?.net;
     if (price === void 0 || price === null) return "";
-    return formatPrice(price, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function getBundleNonLeaders2() {
     const items = props.cartItem.bundle?.items;
@@ -6684,7 +6735,7 @@ function CartItem(rawProps) {
   function getBundleItemPrice(bundleItem) {
     const price = bundleItem.price?.net;
     if (price === void 0 || price === null) return "";
-    return formatPrice(price, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function getCrossupsellName(item) {
     const product = item?.productTo || item?.clusterTo;
@@ -6777,7 +6828,7 @@ function CartItem(rawProps) {
     if (!price) return "";
     const value = props.includeTax ? price.net : price.gross;
     if (value === void 0 || value === null) return "";
-    return formatPrice(value, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(value, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   async function handleAddCrossupsellToCart(item) {
     if (!props.cartId || addingCrossupsellId) return;
@@ -7017,7 +7068,7 @@ function CartItemChildItems(props = {}) {
       /* @__PURE__ */ jsx("span", { className: "text-foreground-subtle hidden sm:inline", children: "-" }),
       /* @__PURE__ */ jsx("span", { className: "text-foreground-subtle text-xs self-center", children: child.product.sku }),
       /* @__PURE__ */ jsx("div", { className: "flex-1 border-b border-dotted border-border mx-1 mb-1" }),
-      /* @__PURE__ */ jsx("span", { className: "font-semibold text-foreground", children: formatPrice(child.totalSum, { symbol: resolved.currency ?? "\u20AC" }) })
+      /* @__PURE__ */ jsx("span", { className: "font-semibold text-foreground", children: formatPrice(child.totalSum, { symbol: resolved.currency ?? "\u20AC", locale: localeForLanguage(resolved.language) }) })
     ] }, idx))
   ] });
 }
@@ -7258,7 +7309,7 @@ function CartIconAndSidebar(rawProps) {
   const CartBonusItemsImpl = props.cartBonusItemsComponent ?? CartBonusItems_default;
   const CartItemImpl = props.cartItemComponent ?? CartItem_default;
   const currencySymbol = props.currency ?? "\u20AC";
-  const money = (value) => value === void 0 || value === null ? "" : formatPrice(value, { symbol: currencySymbol });
+  const money = (value) => value === void 0 || value === null ? "" : formatPrice(value, { symbol: currencySymbol, locale: localeForLanguage(props.language) });
   const { requestAuthorization } = useCart({
     graphqlClient: props.graphqlClient,
     user: props.user ?? null,
@@ -7279,6 +7330,9 @@ function CartIconAndSidebar(rawProps) {
   const useTax = !!props.includeTax;
   const totalRaw = useTax ? props.cart?.total?.totalNet : props.cart?.total?.totalGross;
   const totalPrice = totalRaw === void 0 || totalRaw === null ? money(0) : money(totalRaw);
+  function totalLabel(key) {
+    return useTax ? getLabel(props.labels, key, "Total") : getLabel(props.labels, "totalExclVat", "Total excl. VAT");
+  }
   const sidebarTitle = props.cartSidebarTitle || props.labels?.["cartSidebarTitle"] || "Shopping cart";
   const purchaserPAC = findPurchaserPAC(props.user, props.companyId);
   const totalGross = props.cart?.total?.totalGross ?? 0;
@@ -7368,7 +7422,7 @@ function CartIconAndSidebar(rawProps) {
           ),
           props.showTotals && isHovered && totalItems > 0 ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-icon__popover absolute top-full right-0 mt-1 z-40 bg-popover border border-border rounded-container shadow-lg px-3 py-2 min-w-[140px] text-sm whitespace-nowrap", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex justify-between gap-4", children: [
-              /* @__PURE__ */ jsx("span", { className: "propeller-cart-icon__popover-label text-muted-foreground", children: getLabel(props.labels, "totalLabel", "Total") }),
+              /* @__PURE__ */ jsx("span", { className: "propeller-cart-icon__popover-label text-muted-foreground", children: totalLabel("totalLabel") }),
               /* @__PURE__ */ jsx("span", { className: "propeller-cart-icon__popover-total font-semibold text-foreground", children: totalPrice })
             ] }),
             /* @__PURE__ */ jsxs("div", { className: "propeller-cart-icon__popover-count text-xs text-foreground-subtle mt-0.5", children: [
@@ -7523,7 +7577,7 @@ function CartIconAndSidebar(rawProps) {
           " ",
           items.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-icon__sidebar-footer px-5 py-4 border-t border-border space-y-3 bg-surface-hover", children: [
             /* @__PURE__ */ jsxs("div", { className: "propeller-cart-icon__total-row flex justify-between items-center", children: [
-              /* @__PURE__ */ jsx("span", { className: "propeller-cart-icon__total-label text-sm font-medium text-muted-foreground", children: getLabel(props.labels, "total", "Total") }),
+              /* @__PURE__ */ jsx("span", { className: "propeller-cart-icon__total-label text-sm font-medium text-muted-foreground", children: totalLabel("total") }),
               /* @__PURE__ */ jsx("span", { className: "propeller-cart-icon__total-value text-base font-bold text-foreground", children: totalPrice })
             ] }),
             showCheckoutButton && !showRequestAuthorizationButton ? /* @__PURE__ */ jsx(
@@ -7765,7 +7819,7 @@ function CartPaymethods(rawProps) {
   });
   function formatMethodPrice(price) {
     if (props.formatPrice) return props.formatPrice(price);
-    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function methodName(method) {
     const code = (method.code || "").toLowerCase();
@@ -7851,7 +7905,7 @@ function CartSummary(rawProps) {
     if (props.formatPrice) {
       return props.formatPrice(price);
     }
-    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function subtotal() {
     return props.cart?.total?.subTotal || 0;
@@ -7930,83 +7984,96 @@ function CartSummary(rawProps) {
       setRequestLoading(false);
     }
   }
-  return /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary w-full bg-card space-y-3", children: [
-    /* @__PURE__ */ jsx("h2", { className: "propeller-cart-summary__title text-xl font-bold mb-4", children: title() }),
-    showSubtotal() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground", "data-row": "subtotal", children: [
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "subtotal", "Subtotal:") }),
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(subtotal()) })
-    ] }) : null,
-    showDiscount() && hasDiscount() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-success", "data-row": "discount", children: [
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "discount", "Discount:") }),
-      /* @__PURE__ */ jsxs("span", { className: "propeller-cart-summary__value", children: [
-        "-",
-        formatItemPrice(discountAmount())
-      ] })
-    ] }) : null,
-    hasTransactionCosts() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground", "data-row": "transaction-costs", children: [
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "transactionCosts", "Transaction costs:") }),
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(transactionCosts()) })
-    ] }) : null,
-    showShippingCosts() && hasShippingCosts() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground", "data-row": "shipping-costs", children: [
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "shippingCosts", "Shipping costs:") }),
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(shippingCosts()) })
-    ] }) : null,
-    showTotalExclVat() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground pt-2 border-t", "data-row": "total-excl-vat", children: [
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "totalExclVat", "Total excl. VAT:") }),
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(totalExclVat()) })
-    ] }) : null,
-    showVATs() && taxLevels().length > 0 ? /* @__PURE__ */ jsx(Fragment, { children: taxLevels()?.map((tax, index) => /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground text-sm", "data-row": "vat-line", children: [
-      /* @__PURE__ */ jsxs("span", { className: "propeller-cart-summary__label", children: [
-        tax.taxPercentage,
-        "% ",
-        getLabel(props.labels, "vat", "VAT"),
-        ":"
-      ] }),
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(Number(tax.price)) })
-    ] }, index)) }) : null,
-    showTotalVat() && totalVat() > 0 ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground text-sm", "data-row": "total-vat", children: [
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "totalVat", "Total VAT:") }),
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(totalVat()) })
-    ] }) : null,
-    /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row propeller-cart-summary__row--total flex justify-between text-xl font-bold pt-4 border-t text-foreground mt-2", "data-row": "total", children: [
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "total", "Total:") }),
-      /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(totalInclVat()) })
-    ] }),
-    showCheckoutButton() && !showRequestAuthorizationButton() ? /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: "propeller-cart-summary__checkout-btn block w-full bg-secondary text-secondary-foreground text-center py-3 rounded-container hover:bg-secondary/90 transition font-semibold mt-4",
-          onClick: (event) => handleCheckoutClick(),
-          children: getLabel(props.labels, "checkoutButton", "Continue to Checkout")
-        }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        // Padding, radius and shadow to match ActionCode, which sits directly
+        // under this panel on the cart page. Without them the summary painted
+        // a card background with its text against the edges and a full-bleed
+        // checkout button — the same column, two different card treatments.
+        "propeller-cart-summary w-full bg-card p-6 rounded-container shadow space-y-3",
+        props.className
       ),
-      " ",
-      !!props.onRequestQuoteClick && showRequestQuoteButton() ? /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: "propeller-cart-summary__quote-btn block w-full bg-card border border-secondary text-secondary text-center py-3 rounded-container hover:bg-secondary/5 transition font-semibold mt-2",
-          onClick: (event) => props.onRequestQuoteClick && props.onRequestQuoteClick(props.cart),
-          children: getLabel(props.labels, "requestQuoteButton", "Request a Quote")
-        }
-      ) : null
-    ] }) : null,
-    showRequestAuthorizationButton() ? /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        className: "propeller-cart-summary__authorization-btn block w-full bg-secondary text-secondary-foreground text-center py-3 rounded-container hover:bg-secondary/90 transition font-semibold mt-4 disabled:opacity-50 disabled:cursor-not-allowed",
-        onClick: (event) => handleRequestAuthorizationClick(),
-        disabled: requestLoading,
-        children: [
-          requestLoading ? /* @__PURE__ */ jsx(Fragment, { children: getLabel(props.labels, "requestingAuthorization", "Requesting...") }) : null,
-          !requestLoading ? /* @__PURE__ */ jsx(Fragment, { children: getLabel(props.labels, "requestAuthorizationButton", "Request Authorization") }) : null
-        ]
-      }
-    ) : null
-  ] });
+      children: [
+        /* @__PURE__ */ jsx("h2", { className: "propeller-cart-summary__title text-xl font-bold mb-4", children: title() }),
+        showSubtotal() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground", "data-row": "subtotal", children: [
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "subtotal", "Subtotal:") }),
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(subtotal()) })
+        ] }) : null,
+        showDiscount() && hasDiscount() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-success", "data-row": "discount", children: [
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "discount", "Discount:") }),
+          /* @__PURE__ */ jsxs("span", { className: "propeller-cart-summary__value", children: [
+            "-",
+            formatItemPrice(discountAmount())
+          ] })
+        ] }) : null,
+        hasTransactionCosts() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground", "data-row": "transaction-costs", children: [
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "transactionCosts", "Transaction costs:") }),
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(transactionCosts()) })
+        ] }) : null,
+        showShippingCosts() && hasShippingCosts() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground", "data-row": "shipping-costs", children: [
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "shippingCosts", "Shipping costs:") }),
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(shippingCosts()) })
+        ] }) : null,
+        showTotalExclVat() ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground pt-2 border-t", "data-row": "total-excl-vat", children: [
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "totalExclVat", "Total excl. VAT:") }),
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(totalExclVat()) })
+        ] }) : null,
+        showVATs() && taxLevels().length > 0 ? /* @__PURE__ */ jsx(Fragment, { children: taxLevels()?.map((tax, index) => /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground text-sm", "data-row": "vat-line", children: [
+          /* @__PURE__ */ jsxs("span", { className: "propeller-cart-summary__label", children: [
+            tax.taxPercentage,
+            "% ",
+            getLabel(props.labels, "vat", "VAT"),
+            ":"
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(Number(tax.price)) })
+        ] }, index)) }) : null,
+        showTotalVat() && totalVat() > 0 ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row flex justify-between text-muted-foreground text-sm", "data-row": "total-vat", children: [
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "totalVat", "Total VAT:") }),
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(totalVat()) })
+        ] }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "propeller-cart-summary__row propeller-cart-summary__row--total flex justify-between text-xl font-bold pt-4 border-t text-foreground mt-2", "data-row": "total", children: [
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__label", children: getLabel(props.labels, "total", "Total:") }),
+          /* @__PURE__ */ jsx("span", { className: "propeller-cart-summary__value", children: formatItemPrice(totalInclVat()) })
+        ] }),
+        showCheckoutButton() && !showRequestAuthorizationButton() ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "propeller-cart-summary__checkout-btn block w-full bg-secondary text-secondary-foreground text-center py-3 rounded-container hover:bg-secondary/90 transition font-semibold mt-4",
+              onClick: (event) => handleCheckoutClick(),
+              children: getLabel(props.labels, "checkoutButton", "Continue to Checkout")
+            }
+          ),
+          " ",
+          !!props.onRequestQuoteClick && showRequestQuoteButton() ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "propeller-cart-summary__quote-btn block w-full bg-card border border-secondary text-secondary text-center py-3 rounded-container hover:bg-secondary/5 transition font-semibold mt-2",
+              onClick: (event) => props.onRequestQuoteClick && props.onRequestQuoteClick(props.cart),
+              children: getLabel(props.labels, "requestQuoteButton", "Request a Quote")
+            }
+          ) : null
+        ] }) : null,
+        showRequestAuthorizationButton() ? /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            className: "propeller-cart-summary__authorization-btn block w-full bg-secondary text-secondary-foreground text-center py-3 rounded-container hover:bg-secondary/90 transition font-semibold mt-4 disabled:opacity-50 disabled:cursor-not-allowed",
+            onClick: (event) => handleRequestAuthorizationClick(),
+            disabled: requestLoading,
+            children: [
+              requestLoading ? /* @__PURE__ */ jsx(Fragment, { children: getLabel(props.labels, "requestingAuthorization", "Requesting...") }) : null,
+              !requestLoading ? /* @__PURE__ */ jsx(Fragment, { children: getLabel(props.labels, "requestAuthorizationButton", "Request Authorization") }) : null
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
 }
 var CartSummary_default = CartSummary;
 function CategoryDescription(props) {
@@ -8146,7 +8213,7 @@ function ClusterCard(rawProps) {
   const useTax = props.includeTax !== void 0 ? !!props.includeTax : false;
   const priceObj = contentHidden ? void 0 : cluster?.defaultProduct?.price;
   const priceValue = useTax ? priceObj?.net : priceObj?.gross;
-  const clusterPrice = props.showPrice === false ? "" : formatPrice(priceValue, { symbol: props.currency ?? "\u20AC" });
+  const clusterPrice = props.showPrice === false ? "" : formatPrice(priceValue, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   function handleClusterClick(e) {
     if (props.onClusterClick) {
       e.preventDefault();
@@ -8572,7 +8639,7 @@ function ProductPriceDisplay(props) {
   }
   function formatPrice17(value) {
     if (value === null || value === void 0) return "";
-    return formatPrice(value, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(value, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function getOptionsTotal(useNet) {
     const options = props.options || [];
@@ -8661,6 +8728,11 @@ var RESOLVE_SPEC2 = {
   includeTax: { infra: "includeTax" },
   portalMode: { infra: "portalMode" },
   configuration: { infra: "configuration" },
+  // Same entry ClusterCard has always had. Without it a shop priced in
+  // anything but euros had no route to the cards at all: the grid resolved the
+  // currency and then dropped it, and the card fell through to the package
+  // default on every price it rendered.
+  currency: { infra: "currency", default: "\u20AC" },
   columns: { grid: "columns", default: 3 },
   showPrice: { grid: "showPrice" },
   showStock: { grid: "showStock" },
@@ -8995,7 +9067,8 @@ function ProductCardPrice(props) {
       {
         price: product.price,
         includeTax: derived.useTax,
-        labels: resolved.priceLabels
+        labels: resolved.priceLabels,
+        currency: resolved.currency
       }
     ) });
   }
@@ -9006,6 +9079,8 @@ function ProductCardPrice(props) {
       includeTax: derived.useTax,
       priceSize: props.priceSize ?? "text-base sm:text-lg",
       labels: resolved.priceLabels,
+      currency: resolved.currency,
+      language: resolved.language,
       portalMode: resolved.portalMode,
       user: resolved.user,
       showLoginPrompt: false
@@ -9411,6 +9486,7 @@ ProductGridCompound.Pagination = ProductGridPagination;
 var ProductGrid_default = ProductGridCompound;
 function GridFilters(rawProps) {
   const props = useInfraProps(rawProps);
+  const currencySymbol = props.currency ?? "\u20AC";
   const [selectedFilters, setSelectedFilters] = useState(
     () => ({ ...props.activeTextFilters || {} })
   );
@@ -9627,7 +9703,7 @@ function GridFilters(rawProps) {
             ] }),
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsxs("div", { className: "relative flex-1", children: [
-                /* @__PURE__ */ jsx("span", { className: "propeller-grid-filters__price-currency absolute left-2.5 top-1/2 -translate-y-1/2 text-xs text-foreground-subtle pointer-events-none", children: "\u20AC" }),
+                /* @__PURE__ */ jsx("span", { className: "propeller-grid-filters__price-currency absolute left-2.5 top-1/2 -translate-y-1/2 text-xs text-foreground-subtle pointer-events-none", children: currencySymbol }),
                 /* @__PURE__ */ jsx(
                   "input",
                   {
@@ -9646,7 +9722,7 @@ function GridFilters(rawProps) {
               ] }),
               /* @__PURE__ */ jsx("span", { className: "propeller-grid-filters__price-separator text-foreground-subtle text-sm select-none", children: "\u2013" }),
               /* @__PURE__ */ jsxs("div", { className: "relative flex-1", children: [
-                /* @__PURE__ */ jsx("span", { className: "propeller-grid-filters__price-currency absolute left-2.5 top-1/2 -translate-y-1/2 text-xs text-foreground-subtle pointer-events-none", children: "\u20AC" }),
+                /* @__PURE__ */ jsx("span", { className: "propeller-grid-filters__price-currency absolute left-2.5 top-1/2 -translate-y-1/2 text-xs text-foreground-subtle pointer-events-none", children: currencySymbol }),
                 /* @__PURE__ */ jsx(
                   "input",
                   {
@@ -9954,6 +10030,7 @@ var DEFAULT_LABELS = {
 };
 function GridToolbar(rawProps) {
   const props = useInfraProps(rawProps);
+  const currencySymbol = props.currency ?? "\u20AC";
   const [currentSortField, setCurrentSortField] = useState(
     ProductSortField.CATEGORY_ORDER
   );
@@ -10166,9 +10243,11 @@ function GridToolbar(rawProps) {
               },
               children: [
                 getLabel59("price"),
-                ": \u20AC",
+                ": ",
+                currencySymbol,
                 props.priceFilterMin ?? 0,
-                " \u2013 \u20AC",
+                " \u2013 ",
+                currencySymbol,
                 props.priceFilterMax ?? "\u221E",
                 /* @__PURE__ */ jsx("span", { className: "propeller-grid-toolbar__filter-badge-remove", children: "\xD7" })
               ]
@@ -10819,8 +10898,8 @@ function ClusterInfo(rawProps) {
   ] });
 }
 var ClusterInfo_default = ClusterInfo;
-function formatPrice9(price, currency) {
-  return formatPrice(price, { symbol: currency });
+function formatPrice9(price, currency, language) {
+  return formatPrice(price, { symbol: currency, locale: localeForLanguage(language) });
 }
 function getProductName2(product, language) {
   return getLocalizedValue(product.names, language, `Product ${product.productId}`);
@@ -10847,7 +10926,7 @@ function ClusterOptions(rawProps) {
       const products = (option.products || []).map((p) => ({
         productId: p.productId,
         productIdStr: p.productId.toString(),
-        label: hidePrices ? getProductName2(p, language) : `${getProductName2(p, language)} \u2014 ${formatPrice9(p.price?.gross || 0, props.currency ?? "\u20AC")}`
+        label: hidePrices ? getProductName2(p, language) : `${getProductName2(p, language)} \u2014 ${formatPrice9(p.price?.gross || 0, props.currency ?? "\u20AC", language)}`
       }));
       let previewImageUrl = "";
       let previewName = "";
@@ -10859,7 +10938,7 @@ function ClusterOptions(rawProps) {
         if (selectedProduct) {
           previewImageUrl = getProductImageUrl4(selectedProduct);
           previewName = getProductName2(selectedProduct, language);
-          previewPrice = hidePrices ? "" : formatPrice9(selectedProduct.price?.gross || 0, props.currency ?? "\u20AC");
+          previewPrice = hidePrices ? "" : formatPrice9(selectedProduct.price?.gross || 0, props.currency ?? "\u20AC", props.language);
         }
       }
       const isRequired = option.isRequired === YesNo.Y;
@@ -11348,7 +11427,7 @@ function FavoriteListItem(rawProps) {
     if (!priceObj) return "";
     const value = useTax ? priceObj.net : priceObj.gross;
     if (!value && value !== 0) return "";
-    return formatPrice(value, { symbol: currency });
+    return formatPrice(value, { symbol: currency, locale: localeForLanguage(props.language) });
   })();
   function handleItemClick(e) {
     if (props.onItemClick) {
@@ -12923,12 +13002,12 @@ function ItemsOverview(rawProps) {
   const showPrice = props.showPrice !== void 0 ? props.showPrice : true;
   const items = props.cart?.items ?? [];
   const currencySymbol = props.currency ?? "\u20AC";
-  const money = (value) => value === void 0 || value === null ? "" : formatPrice(value, { symbol: currencySymbol });
+  const money = (value) => value === void 0 || value === null ? "" : formatPrice(value, { symbol: currencySymbol, locale: localeForLanguage(props.language) });
   function formatItemPrice(price) {
     if (props.formatPrice) {
       return props.formatPrice(price);
     }
-    return formatPrice(price || 0, { symbol: currencySymbol });
+    return formatPrice(price || 0, { symbol: currencySymbol, locale: localeForLanguage(props.language) });
   }
   function lineTotal(item) {
     return (useTax ? item.totalSumNet : item.totalSum) || 0;
@@ -13531,20 +13610,21 @@ var OrderActions_default = OrderActions;
 function getProductName3(orderItem, language) {
   return getLocalizedValue(orderItem?.product?.names, language, "") || orderItem?.name || "Unknown Product";
 }
-function getClusterUrl(orderItem, language) {
+function getClusterUrl(orderItem, language, urls) {
   const cluster = orderItem?.product?.cluster;
   if (!cluster) return "";
   const id = cluster.clusterId;
   const slug = getLocalizedValue(cluster.slugs, language, "");
   if (!id || !slug) return "";
-  return `/cluster/${id}/${slug}`;
+  return urls?.getClusterUrl?.(cluster, language) || `/cluster/${id}/${slug}`;
 }
-function getProductUrl(orderItem, language) {
-  const cu = getClusterUrl(orderItem, language);
+function getProductUrl(orderItem, language, urls) {
+  const cu = getClusterUrl(orderItem, language, urls);
   if (cu) return cu;
-  const id = orderItem?.product?.productId;
-  const slug = getLocalizedValue(orderItem?.product?.slugs, language, "");
-  if (id && slug) return `/product/${id}/${slug}`;
+  const product = orderItem?.product;
+  const id = product?.productId;
+  const slug = getLocalizedValue(product?.slugs, language, "");
+  if (id && slug) return urls?.getProductUrl?.(product, language) || `/product/${id}/${slug}`;
   return "";
 }
 function OrderItemCard(props) {
@@ -13561,7 +13641,7 @@ function OrderItemCard(props) {
   const productName = getProductName3(item, props.language);
   const productSku = item?.product?.sku || item?.sku || "";
   const productImage = item?.product?.media?.images?.items?.[0]?.imageVariants?.[0]?.url || "";
-  const productUrl = getProductUrl(item, props.language);
+  const productUrl = getProductUrl(item, props.language, props.configuration?.urls);
   const quantity = item?.quantity || 0;
   const priceTotal = item?.priceTotal || 0;
   const discount = item?.discount || 0;
@@ -13574,7 +13654,7 @@ function OrderItemCard(props) {
       return props.formatPrice(price);
     }
     if (!price && price !== 0) return "-";
-    return formatPrice(price, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   const discountDisplay = discountPercentage > 0 ? `${formatItemPrice(discount)} (${discountPercentage.toFixed(2).replace(".", ",")}%)` : formatItemPrice(discount);
   return /* @__PURE__ */ jsxs("tbody", { className: "propeller-order-item-card", children: [
@@ -13739,7 +13819,7 @@ function OrderList(rawProps) {
   function formatPrice17(price) {
     if (props.formatPrice) return props.formatPrice(price);
     if (!price) return "-";
-    return formatPrice(price, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function getStatusColor(status) {
     if (props.getStatusColor) return props.getStatusColor(status);
@@ -14168,7 +14248,31 @@ function OrderList(rawProps) {
           ) })
         ] })
       ] }) : null
-    ] }) : /* @__PURE__ */ jsx("div", { className: `propeller-order-list__empty${props.flat ? "" : " bg-card rounded-container shadow"} p-8 text-center`, children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mb-4", children: getLabel(props.labels, "noOrders", "No orders found.") }) }) }) : /* @__PURE__ */ jsx("div", { className: "propeller-order-list__loading p-8 text-center text-muted-foreground", children: getLabel(props.labels, "loading", "Loading orders...") })
+    ] }) : /* @__PURE__ */ jsx("div", { className: `propeller-order-list__empty${props.flat ? "" : " bg-card rounded-container shadow"} p-8 text-center`, children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mb-4", children: getLabel(props.labels, "noOrders", "No orders found.") }) }) }) : (
+      // A centred line of text collapsed the list to one row and then
+      // snapped back, which is what made a language switch on the account
+      // pages look broken. Skeleton rows hold the layout instead.
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: `propeller-order-list__loading${props.flat ? "" : " bg-card rounded-container shadow"} p-4`,
+          "aria-busy": "true",
+          "aria-label": getLabel(props.labels, "loading", "Loading orders..."),
+          children: Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "propeller-order-list__skeleton-row flex items-center gap-4 py-4 border-b border-border last:border-b-0 animate-pulse",
+              children: [
+                /* @__PURE__ */ jsx("div", { className: "propeller-order-list__skeleton-line h-4 bg-surface-hover rounded w-24" }),
+                /* @__PURE__ */ jsx("div", { className: "propeller-order-list__skeleton-line h-4 bg-surface-hover rounded w-32" }),
+                /* @__PURE__ */ jsx("div", { className: "propeller-order-list__skeleton-line h-4 bg-surface-hover rounded w-20 ml-auto" })
+              ]
+            },
+            index
+          ))
+        }
+      )
+    )
   ] });
 }
 var OrderList_default = OrderList;
@@ -14209,7 +14313,7 @@ function QuickOrderInner(props) {
   } = props;
   const user = props.user ?? null;
   const graphqlClient = props.graphqlClient;
-  const displayPrice = (n) => props.formatPrice ? props.formatPrice(n) : formatPrice(n, { symbol: currency });
+  const displayPrice = (n) => props.formatPrice ? props.formatPrice(n) : formatPrice(n, { symbol: currency, locale: localeForLanguage(props.language) });
   const L = (key, fallback) => getLabel(labels, key, fallback);
   const { submitting, searchProducts, submit } = useQuickOrder({
     graphqlClient,
@@ -14743,7 +14847,7 @@ function OrderSummary(props) {
     if (props.formatPrice) {
       return props.formatPrice(price);
     }
-    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function numericDate(dateString) {
     const d = new Date(dateString);
@@ -14851,7 +14955,7 @@ function OrderTotals(props) {
   const postageData = props.order?.postageData;
   function formatItemPrice(price) {
     if (props.formatPrice) return props.formatPrice(price);
-    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   const subtotal = total?.gross || 0;
   const hasDiscount = !!total && total.discountType !== OrderDiscountType.N && total.discountValue > 0;
@@ -15016,7 +15120,7 @@ function ProductBulkPrices(props) {
   function getPrice(tier) {
     const value = includeTax ? tier.net : tier.gross;
     if (value === null || value === void 0) return "";
-    return formatPrice(value, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(value, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   function getQuantityLabel(tier, index) {
     const discount = tier.discount;
@@ -15027,13 +15131,14 @@ function ProductBulkPrices(props) {
     if (nextQty) return `${qty}\u2013${nextQty - 1}`;
     return `${qty}+`;
   }
+  const title = props.labels?.title ?? "Volume pricing";
   return /* @__PURE__ */ jsx(Fragment, { children: !isHidden2 && hasItems ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
     "div",
     {
       className: cn(`propeller-product-bulk-prices ${props.className || ""}`),
       "data-include-tax": includeTax ? "true" : "false",
       children: [
-        getLabel(props.labels, "title", "Volume pricing") ? /* @__PURE__ */ jsx("h3", { className: "propeller-product-bulk-prices__title text-base font-semibold text-foreground mb-3", children: getLabel(props.labels, "title", "Volume pricing") }) : null,
+        title ? /* @__PURE__ */ jsx("h3", { className: "propeller-product-bulk-prices__title text-base font-semibold text-foreground mb-3", children: title }) : null,
         /* @__PURE__ */ jsx("div", { className: "propeller-product-bulk-prices__table-wrapper overflow-hidden rounded-container border border-border", children: /* @__PURE__ */ jsxs("table", { className: "propeller-product-bulk-prices__table w-full text-sm", children: [
           /* @__PURE__ */ jsx("thead", { className: "propeller-product-bulk-prices__thead bg-muted/50", children: /* @__PURE__ */ jsxs("tr", { children: [
             /* @__PURE__ */ jsx("th", { className: "propeller-product-bulk-prices__th propeller-product-bulk-prices__th--quantity px-4 py-2 text-left font-medium text-muted-foreground", children: getLabel(props.labels, "quantityFrom", "Qty from") }),
@@ -15080,7 +15185,7 @@ function ProductBundles(rawProps) {
   const props = useInfraProps(rawProps);
   const language = props.language;
   const currencySymbol = props.currency ?? "\u20AC";
-  const money = (value) => formatPrice(value, { symbol: currencySymbol });
+  const money = (value) => formatPrice(value, { symbol: currencySymbol, locale: localeForLanguage(props.language) });
   const [isMounted, setIsMounted] = useState(false);
   const [addingBundleId, setAddingBundleId] = useState(null);
   const [lastAddedBundle, setLastAddedBundle] = useState(null);
@@ -15271,7 +15376,7 @@ function ProductBundles(rawProps) {
                     onClick: () => handleAddToCart(bundle),
                     disabled: addingBundleId === bundle.id,
                     "data-loading": addingBundleId === bundle.id ? "true" : "false",
-                    children: addingBundleId === bundle.id ? getLabel(props.labels, "adding", "Adding...") : getLabel(props.labels, "addToCart", "In cart")
+                    children: addingBundleId === bundle.id ? getLabel(props.labels, "adding", "Adding...") : getLabel(props.labels, "addToCart", "Add to cart")
                   }
                 )
               ] }) : props.showLoginPrompt !== false ? /* @__PURE__ */ jsx("div", { className: "propeller-product-bundles__login-prompt text-center text-sm text-muted-foreground py-2", children: getLabel(
@@ -17410,7 +17515,7 @@ function PurchaseAuthorizationRequests(rawProps) {
   }
   function formatPrice17(price) {
     if (props.formatPrice) return props.formatPrice(price);
-    return formatPrice(price, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   const columnLabelKeys = {
     date: ["colDate", "Date"],
@@ -18631,12 +18736,12 @@ function RegisterForm(rawProps) {
   ] });
 }
 var RegisterForm_default = RegisterForm;
-function mapToSearchBarResult(item, language) {
+function mapToSearchBarResult(item, language, urls) {
   const isCluster = "clusterId" in item;
   const displayItem = isCluster ? item.defaultProduct : item;
   const id = isCluster ? item.clusterId : item.productId;
   const slug = getLocalizedValue(item.slugs, language, "");
-  const url = isCluster ? "/cluster/" + id + "/" + slug : "/product/" + id + "/" + slug;
+  const url = isCluster ? urls?.getClusterUrl?.(item, language) || "/cluster/" + id + "/" + slug : urls?.getProductUrl?.(item, language) || "/product/" + id + "/" + slug;
   const priceNet = displayItem?.price?.net || 0;
   const priceGross = displayItem?.price?.gross || 0;
   const localizedName = language && item.names?.find((n) => n.language === language)?.value || item.names?.[0]?.value || "Product";
@@ -18676,13 +18781,19 @@ function SearchBar(rawProps) {
     applyOrderlists: props.applyOrderlists,
     productTrackAttributes: props.productTrackAttributes
   });
-  const results = searchResults.slice(0, maxResults).map((item) => mapToSearchBarResult(item, props.language));
+  const results = searchResults.slice(0, maxResults).map(
+    (item) => mapToSearchBarResult(
+      item,
+      props.language,
+      props.configuration?.urls
+    )
+  );
   const itemsFound = searchItemsFound;
   function formatItemPrice(price) {
     if (props.formatPrice) {
       return props.formatPrice(price);
     }
-    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC" });
+    return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC", locale: localeForLanguage(props.language) });
   }
   const useTax = !!props.includeTax;
   function leadingPrice(result) {
@@ -18781,7 +18892,14 @@ function SearchBar(rawProps) {
             {
               type: "search",
               autoComplete: "off",
-              className: "propeller-search-bar__input w-full pl-10 pr-10 py-2 bg-white/95 border border-white/20 rounded-container focus:outline-none focus:ring-2 focus:ring-secondary placeholder:text-muted-foreground",
+              className: cn(
+                // Themed surface + border rather than the white-on-white the
+                // boilerplate's dark header band happened to make work: on a
+                // light header `bg-white/95 border-white/20` rendered as an
+                // invisible input.
+                "propeller-search-bar__input w-full pl-10 pr-10 py-2 bg-card border border-input rounded-container focus:outline-none focus:ring-2 focus:ring-secondary placeholder:text-muted-foreground",
+                props.inputClassName
+              ),
               placeholder: props.placeholder || "Search products...",
               value: localTerm,
               onChange: (e) => handleInputChange(e.target.value)