4e:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 4f:T1405,'use client'; import { cn } from '@/lib/utils'; import React from 'react'; export const currencyMinorUnits: Record = { USD: 2, EUR: 2, GBP: 2, JPY: 0, }; interface PriceContextValue { amount: number | null; compareAt?: number | null; savingsPercent?: number | null; currency?: string; locale?: string; } const PriceContext = React.createContext( undefined, ); function usePriceContext() { const context = React.useContext(PriceContext); if (context === undefined) { throw new Error('usePriceContext must be used within a PriceProvider'); } return context; } /** * Returns the divider to convert minor units to major units. * e.g. USD -> 100, JPY -> 1 */ export function minorUnitDivider(currency?: string): number { const code = (currency ?? 'USD').toUpperCase(); const digits = currencyMinorUnits[code] ?? 2; return Math.pow(10, digits); } /** * Memoized Intl.NumberFormat factory keyed by locale|currency|digits. */ const nfCache = new Map(); function getNumberFormatter( locale: string, currency: string, fractionDigits: number, ) { const key = `${locale}|${currency}|${fractionDigits}`; const cached = nfCache.get(key); if (cached) return cached; const nf = new Intl.NumberFormat(locale, { style: 'currency', currency, minimumFractionDigits: fractionDigits, maximumFractionDigits: fractionDigits, currencyDisplay: 'symbol', }); nfCache.set(key, nf); return nf; } /** * Format an integer minor-unit amount (e.g. cents) to a localized currency string. * - amountMinor: integer (may be negative) * - currency: ISO code, defaults to USD * - locale: BCP47 locale, defaults to en-US */ export function formatCurrencyFromMinor( amountMinor: number, currency = 'USD', locale = 'en-US', ): string { if (!Number.isInteger(amountMinor)) { console.warn('amountMinor should be an integer'); amountMinor = Math.round(amountMinor); } const digits = currencyMinorUnits[currency.toUpperCase()] ?? 2; const divider = minorUnitDivider(currency); // Use exact division (no floating rounding) then delegate to Intl for display. const amountMajor = amountMinor / divider; const nf = getNumberFormatter(locale, currency, digits); return nf.format(amountMajor); } // components/Price.tsx interface PriceProps extends React.ComponentProps<'div'> { amount: number | null; // minor units currency?: 'USD' | 'EUR' | 'GBP' | 'JPY'; locale?: string; compareAt?: number | null; // minor units range?: { min: number | null; max: number | null } | null; } const format = (amt: number | null, currency?: string, locale?: string) => { if (amt === null) return ''; return formatCurrencyFromMinor(amt, currency ?? 'USD', locale ?? 'en-US'); }; export function Price({ amount, currency = 'USD', locale = 'en-US', compareAt = null, range = null, className, ...props }: PriceProps) { // Range handling if (range) { if (range.min === null || range.max === null) return null; if (range.min === range.max) { return ( Price: {format(range.min)} ); } return ( Price range: {format(range.min)} – {format(range.max)} ); } // Unavailable / Free if (amount == null) { return ( Price not available ); } if (amount === 0) { return ( Free Free ); } const isOnSale = compareAt != null && compareAt > amount; let savingsPercent: number | null = null; if (isOnSale) { // integer math to avoid float errors: savingsPercent = Math.round(((compareAt - amount) * 100) / compareAt); } return ( ); } export function PriceCurrent({ ...props }: React.ComponentProps<'span'>) { const { amount, currency, locale } = usePriceContext(); return ( Price: {format(amount, currency, locale)} ); } export function PriceCompareAt({ ...props }: React.ComponentProps<'span'>) { const { compareAt, currency, locale } = usePriceContext(); return ( Old Price: {format(compareAt!, currency, locale)} ); } export function PriceSavings({ children, ...props }: React.ComponentProps<'span'>) { const { savingsPercent } = usePriceContext(); return ( ); } 4d:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[null,["$","$L4e",null,{"files":[{"path":"registry/ecommerce/price/index.tsx","content":"$4f","type":"registry:block","target":"components/systaliko-ui/price.tsx"}],"className":"h-[70svh] min-h-80"}]]}]