Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@atlaskit/heading

atlassian192.6kApache-2.05.2.0TypeScript support: included

A heading is a typography component used to display text in different sizes and formats.

readme

Heading

A heading is a typography component used to display text in different sizes and formats.

Installation

yarn add @atlaskit/heading

Usage

Detailed docs and example usage can be found here.

changelog

@atlaskit/heading

5.2.0

Minor Changes

  • #138526 1c66b8e32f30a - [ux] Removed feature flag platform-typography-improved-color-control resulting in automatic color inversion based on bold surfaces will only affect the default color.

Patch Changes

  • Updated dependencies

5.1.1

Patch Changes

  • #129972 b2d69a39e6687 - Update @compiled/react dependency for improved type checking support.
  • Updated dependencies

5.1.0

Minor Changes

  • #118121 4850fa1a503ba - [ux] Automatic color inversion based on bold surfaces will only affect the default color behind a feature flag. If testing successful, this change will be made available in a later release.

Patch Changes

  • Updated dependencies

5.0.0

Major Changes

Patch Changes

  • Updated dependencies

4.3.1

Patch Changes

4.3.0

Minor Changes

Patch Changes

  • Updated dependencies

4.2.0

Minor Changes

4.1.0

Minor Changes

Patch Changes

  • Updated dependencies

4.0.2

Patch Changes

4.0.1

Patch Changes

  • Updated dependencies

4.0.0

Major Changes

  • #171160 0d474a7c26c0d - Migrated from @emotion/react to @compiled/react in order to improve performance, align with the rest of the Atlaskit techstack, and support React 18 Streaming SSR.

    Please note, in order to use this version of @atlaskit/heading, you will need to ensure that your bundler is configured to handle .css imports correctly. Most bundlers come with built-in support for .css imports, so you may not need to do anything. If you are using a different bundler, please refer to the documentation for that bundler to understand how to handle .css imports.

3.1.0

Minor Changes

  • #166220 c02bd4e1ce076 - Removed unused types related to the old Heading API. Exported types for the Heading component are now HeadingProps and HeadingColor. Removed circular type references.

3.0.0

Major Changes

Patch Changes

  • #166026 962b5e77810fb - Adds side-effect config to support Compiled css extraction in third-party apps

2.4.7

Patch Changes

  • Updated dependencies

2.4.6

Patch Changes

  • Updated dependencies

2.4.5

Patch Changes

  • Updated dependencies

2.4.4

Patch Changes

  • Updated dependencies

2.4.3

Patch Changes

  • Updated dependencies

2.4.2

Patch Changes

  • Updated dependencies

2.4.1

Patch Changes

  • Updated dependencies

2.4.0

Minor Changes

  • #110670 c733254a2dd6e - Explicitly set jsxRuntime to classic via pragma comments in order to avoid issues where jsxRuntime is implicitly set to automatic.

Patch Changes

  • Updated dependencies

2.3.2

Patch Changes

  • #110191 c3dc02298f8aa - [ux] Change heading xsmall lineheight from 16 to 20 for minor third theme.
  • Updated dependencies

2.3.1

Patch Changes

  • Updated dependencies

2.3.0

Minor Changes

  • #97580 3e6f291ec2d5 - Color prop to take color tokens when using heading with size prop.

2.2.0

Minor Changes

2.1.2

Patch Changes

  • #83130 4efd62cdc533 - SHPLVIII-481: Assign name to default export components to fix quick-fix imports

2.1.1

Patch Changes

2.1.0

Minor Changes

Patch Changes

  • Updated dependencies

2.0.1

Patch Changes

2.0.0

Major Changes

1.8.1

Patch Changes

1.8.0

Minor Changes

  • #80528 8877e9b57d55 - Added size prop which will replace variant prop in the next major version.

1.7.1

Patch Changes

  • #80805 427c2dd9e0d6 - Update input border color token and width to meet 3:1 color contrast
  • Updated dependencies

1.7.0

Minor Changes

Patch Changes

  • Updated dependencies

1.6.0

Minor Changes

  • #68604 fdf7f6635426 - Modified mapping of variant to the HTML element that gets rendered. Previously xlarge would render a h2, large would render a h3 etc... Now xlarge renders a h1 and so on...

1.5.1

Patch Changes

  • #70023 e2d35320717b - Fix types to set either level or variant to be required props to prevent exceptions being thrown.

1.5.0

Minor Changes

  • #67463 caac5b953575 - Fixed an issue where typography tokens referenced font family tokens that may not exist on a page, causing fallbacks to break.

Patch Changes

  • Updated dependencies

1.4.4

Patch Changes

  • #63526 cae958047771 - Internal change to how typography tokens are imported. There is no expected behaviour change.
  • Updated dependencies

1.4.3

Patch Changes

  • #41226 fc7aba3cbae - [ux] Further fixes related to heading getting into possible invalid state. Heading will now always produce valid markup / aria-attributes for any configuration. Previously if there was no HeadingContext in the tree the heading would not produce accessibly correct markup in some cases. This is now resolved.

1.4.2

Patch Changes

1.4.1

Patch Changes

  • #41032 8d9dad6b977 - Heading will apply an aria level if rendered as a div. This is an accessibility fix for an incomplete feature shipped in the previous minor version.
  • #40299 b1882fdd842 - Change typography token naming to be more verbose.

1.4.0

Minor Changes

  • #40254 9cc7e23c65b - [ux] Adds additional heading types via the variant prop. This prop has been added to aid deprecation of the previous level prop. The level prop will be removed in a future release.

1.3.8

Patch Changes

1.3.7

Patch Changes

  • #36754 4ae083a7e66 - Use @af/accessibility-testing for default jest-axe config and jest-axe import in accessibility testing.

1.3.6

Patch Changes

  • #35337 529814693a1 - Pin version of @atlaskit/primitives so it resolves to correct version

1.3.5

Patch Changes

  • #33833 b8b41649492 - Update how certain background colors are referenced by name. Internal changes only.

1.3.4

Patch Changes

  • #34922 779727e307a - Internal change only. Replace all instances of Box with stable @atlaskit/primitives version.

1.3.3

Patch Changes

1.3.2

Patch Changes

1.3.1

Patch Changes

1.3.0

Minor Changes

Patch Changes

  • Updated dependencies

1.2.1

Patch Changes

1.2.0

Minor Changes

1.1.4

Patch Changes

  • #31242 cfe48bb7ece - Internal change only. Replace usages of Inline/Stack with stable version from @atlaskit/primitives.

1.1.3

Patch Changes

  • #31185 b6c5779d358 - Internal changes only to restrict usage of Box from the primitives package.

1.1.2

Patch Changes

  • Updated dependencies

1.1.1

Patch Changes

  • #29390 18aeca8c199 - Internal change to update token references. There is no expected behaviour or visual change.

1.1.0

Minor Changes

1.0.4

Patch Changes

  • Updated dependencies

1.0.3

Patch Changes

  • Updated dependencies

1.0.2

Patch Changes

  • #27341 95fdae34c94 - Revert experimental change to @compiled/react from @emotion/react.

1.0.1

Patch Changes

  • Updated dependencies

1.0.0

Major Changes

  • #27238 7d92ed50264 - [ux] This package is still considered to be in an experimental state and is discouraged for use in production. The major is to simplify consumption and versioning in product.

    Other changes:

    • Introduction of a HeadingContext provider to aid with creating the right semantic structure for headings.
    • Migrated internals to use @compiled/react from @emotion/react.

0.1.18

Patch Changes

  • #26488 bc989043572 - Internal changes to apply spacing tokens. This should be a no-op change.

0.1.17

Patch Changes

0.1.16

Patch Changes

  • #24004 30b11aab9fb - Updates @emotion/core to @emotion/react; v10 to v11. There is no expected behavior change.
  • Updated dependencies

0.1.15

Patch Changes

0.1.14

Patch Changes

0.1.13

Patch Changes

0.1.12

Patch Changes

  • Updated dependencies

0.1.11

Patch Changes

0.1.10

Patch Changes

  • Updated dependencies

0.1.9

Patch Changes

  • Updated dependencies

0.1.8

Patch Changes

  • Updated dependencies

0.1.7

Patch Changes

  • #16752 19d72473dfb - Updates usage of deprecated token names so they're aligned with the latest naming conventions. No UI or visual changes
  • Updated dependencies

0.1.6

Patch Changes

  • Updated dependencies

0.1.5

Patch Changes

  • #15998 f460cc7c411 - Builds for this package now pass through a tokens babel plugin, removing runtime invocations of the tokens() function and improving bundle size.
  • Updated dependencies

0.1.4

Patch Changes

  • Updated dependencies

0.1.3

Patch Changes

  • Updated dependencies

0.1.2

Patch Changes

  • Updated dependencies

0.1.1

Patch Changes

  • #13864 d7a9a4ff7ec - Instrumented heading with the new theming package, @atlaskit/tokens. New tokens will be visible only in applications configured to use the new Tokens API (currently in alpha). These changes are intended to be interoperable with the legacy theme implementation. Legacy dark mode users should expect no visual or breaking changes.
  • Updated dependencies

0.1.0

Minor Changes

  • #12837 ee15e59ba60 - This is the initial release of the Heading package. Typography styles have been duplicated from the @atlaskit/theme package as standalone components.

Patch Changes

  • 46816ee8526 - Changes heading element mappings to match '@atlaskit/css-reset'.
  • f9cd2065648 - Removed redundant styles for text-transform, moved font-size to rem insteda of em.
  • Updated dependencies