| Name | Type | Default | Description |
|---|---|---|---|
className | string | | Additional CSS classes. |
formattingOptions | { numberOfDecimals: undefined | number; showDecimal: undefined | false | true; showGroupSeparators: undefined | false | true;} | | |
ref | Ref<HTMLAnchorElement> | | Ref for the wrapping element. |
unit | string | | Unit to be included in the text, for example '%' |
unitPlacement | 'before' |'after' | "after"
| Determines the placement of the unit. |
value | string | | Number value |
NumberDisplay
The NumberDisplay component renders data as an auto-formatted number, according to locale.
For more information on how to use the features and props for this component, check out the developer documentation.
Usage
The NumberDisplay component can be used to display a numerical value that can include a unit and unitPlacement. The component displays "--" in the case of an undefined value.
There are a variety of formatting options for the NumberDisplay component that enable you to show decimals, show group separators, and limit the number of decimals shown. The group separators used depend on your application's locale. You can configure the locale of your application via the Configuration component.