MetricText

MetricText is a token-backed typography component to display metrics.

Examples Code Usage Changelog

Installation

Package installation information
Install	`yarn add @atlaskit/primitives`
Source	Bitbucket.org, (opens new window)
npm	@atlaskit/primitives, (opens new window)
Bundle	unpkg.com, (opens new window)

Props

`align`
Description	Text alignment.
Type	`"center" \| "start" \| "end"`

`as`
Description	HTML tag to be rendered. Defaults to `span`.
Type	`"div" \| "span"`

`children`
Required
Description	Elements rendered within the Text element.
Type	`string \| number \| boolean \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal`

`data-testid`
Description	`data-testid` is strictly controlled through the `testId` prop. This lets consumers know that this data attribute will not be applied.
Type	`never`

`id`
Description	The HTML `id` attribute.
Type	`string`

`ref`
Description	Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref). @see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}
Type	`string \| Ref<any>`

`role`
Description	Accessible role.
Type	`string`

`size`
Required
Description	Text size.
Type	`"small" \| "large" \| "medium"`

`testId`
Description	A unique string that appears as data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
Type	`string`

Was this page helpful?

We use this feedback to improve our documentation.