Skip to main content

Price

Creates consistent formatting of prices across IAG applications

Installation​

Install

yarn add @iag/chroma-react-ui.components

Import

import { Price } from '@iag/chroma-react-ui.components';

Accessibility​

Accessibility documentation(opens in new window)

Usage​

The Price component is warped in a <span> so if you want to clear the inline behaviour, simply wrap the Price and any other related components with a div to make it a block level element

Default​

Font size​

This example requires tailwind

Properties​

Name
Description
  • amount*
    numberAmount (number) to be displayed as a currency/price
  • className
    stringAdditional CSS classes to be applied
  • id
    stringHTML id attribute for the component