Prices in the configurator

The viewer never computes a price and never holds a cart — that’s the deliberate commerce boundary. If you want prices shown inside the configurator, push them from your own catalogue and they are displayed verbatim.

Push prices

await tg.setPrices({
  currency: 'EUR',
  locale: 'de-DE',
  items: {
    'OSLO-BODY-WALNUT': 129.9,   // keyed by the SAME SKUs the events report
    'OSLO-LEGS-CHROME': 129.9,
  },
  total: 259.8,                  // optional
});

Prices appear in the viewer’s summary view, next to each configured part.

Formatting rules

• Numbers are formatted with Intl.NumberFormat using your currency + locale — 129.9 → 129,90 € for de-DE/EUR.
• Strings are shown verbatim — pre-format them yourself when you need something custom ('129,90 € *').
• total is optional. When every shown price is numeric it is auto-summed; pass it explicitly when you apply bundle discounts.

Updating and clearing

Call setPrices() again whenever your price changes (currency switch, customer group, promotion) — each call replaces the previous state. Pass null to remove all price display.

Keeping prices in step with selection

Recompute on every selection change so part swaps reprice immediately:

tg.addEventListener('togenar:configurator:selection_change', async (e) => {
  const skus = (e.detail.parts || []).map(p => p.sku).filter(Boolean);
  const priced = await fetch('/api/prices?skus=' + skus.join(',')).then(r => r.json());
  tg.setPrices({ currency: priced.currency, locale: priced.locale, items: priced.items });
});