Datapoint displays at-a-glance data for a user to quickly view key metrics.
⚠️ Please note: Datapoint is not currently supported in dark mode.
Be sure to localize the
tooltipText and trend
accessibilityLabel props. Note that localization can lengthen text by 20 to 30 percent.
trend to display the change in the value of a Datapoint over time. Make sure to provide an
accessibilityLabel when the trend is above or below zero.
By default, a positive trend will be considered "good" (displayed as a green trend), a negative trend "bad" (displayed as a red trend) and a trend of 0 "neutral" (displayed as a dark gray trend). However, the
trendSentiment property can be used to explicitly set whether the
trend is considered "good", "bad" or "neutral", as demonstrated below.