If you have any project questions, concerns, or contribution ideas, join our #pwa Slack channel. Find out how to create an account by visiting Community Resources


The Price component is used anywhere a price needs to be displayed.

Formatting of prices and currency symbol selection is handled entirely by the ECMAScript Internationalization API available in modern browsers.

A polyfill is required for any JavaScript runtime that does not have Intl.NumberFormat.prototype.formatToParts.

View Source


Name Required Default Description
value check_box - The numeric price
currencyCode check_box - A string with any of the currency code supported by Intl.NumberFormat
classes - {} Class names to use when styling this component


import Price from '@peregrine/Price';
import cssModule from './my-pricing-styles';

<Price value={100.99} currencyCode="USD" classes={cssModule} />;
    <span className="curr">$</span>
    <span className="int">88</span>
    <span className="dec">.</span>
    <span className="fract">81</span>