CSS

Style components backed by Atlassian Design System design tokens powered by Compiled CSS-in-JS.

Overview Migration Changelog

1.1.3

Patch Changes

Updated dependencies

1.1.2

Patch Changes

695fcbc68ad47, (opens new window) - Experimental React 19 peer dependency support. This patch widens the peer range; CI coverage is partial.

1.1.1

Patch Changes

fdedfb06aa229, (opens new window) - Allow canonical typed media queries and typed container-query exceptions in styling lint rules.

1.1.0

Minor Changes

971a484d0cc7f, (opens new window) - Add canonical default type entrypoints for media and other CSS at-rules to @atlaskit/css/at-rules.

1.0.2

Patch Changes

Updated dependencies

1.0.1

Patch Changes

Updated dependencies

1.0.0

Major Changes

f2dc9097319f0, (opens new window) - ### Dropped support for legacy Typescript 4 types. Typescript 5 is now the new minimum.

Removes the typesVersions property and dist/types-ts4.5 directory from the dist.

Types are now exclusively via the "types": "dist/types/index.d.ts" property.
- "typesVersions": { - ">=4.5 <4.9": { - "*": [ - "dist/types-ts4.5/*", - "dist/types-ts4.5/index.d.ts" - ] - } - },

Patch Changes

Updated dependencies

0.19.4

Patch Changes

Updated dependencies

0.19.3

Patch Changes

Updated dependencies

0.19.2

Patch Changes

Updated dependencies

0.19.1

Patch Changes

f111803c4e253, (opens new window) - Updating typography fallbacks to refreshed typography values as the deprecated legacy typography theme has been removed.
Updated dependencies

0.19.0

Minor Changes

55546332d4ef4, (opens new window) - Restricted borderRadius xcss and cssMap types to only accept tokens, 0, and "inherit". Restricted borderWidth types to only accept tokens and 0. Previously any string was allowed, this is no longer the case and will throw a type error.

Patch Changes

Updated dependencies

0.18.1

Patch Changes

8f904ca860b20, (opens new window) - Fixed codegen script not respecting manual changes in partially codegen'd files.
Updated dependencies

0.18.0

Minor Changes

762b79e21f96a, (opens new window) - Migrated and cleaned up legacy iconography usage.

Patch Changes

Updated dependencies

0.17.1

Patch Changes

a60a82196851a, (opens new window) - Internal refactors to remove unused variables. No functional or public changes.
Updated dependencies

0.17.0

Minor Changes

644c0f593ae62, (opens new window) - Adds new semantic background and text tokens.

Background Tokens (background.[semantics].subtler.*):

Added subtler variants for semantic background colors with default, hovered, and pressed states:
- background.success.subtler.[default|hovered|pressed]
- background.warning.subtler.[default|hovered|pressed]
- background.danger.subtler.[default|hovered|pressed]
- background.information.subtler.[default|hovered|pressed]
- background.discovery.subtler.[default|hovered|pressed]
Text Tokens (text.[semantics].bolder):

Added bolder variants for semantic text colors to ensure proper contrast on colored backgrounds:
- text.success.bolder
- text.warning.bolder
- text.danger.bolder
- text.information.bolder
- text.discovery.bolder

Patch Changes

Updated dependencies

0.16.0

Minor Changes

d50ecf8e02d28, (opens new window) - Added radius.xxlarge token available for borderRadius in cssMap.

Patch Changes

Updated dependencies

0.15.2

Patch Changes

Updated dependencies

0.15.1

Patch Changes

75ba0401c1743, (opens new window) - Internal changes.
Updated dependencies

0.15.0

Minor Changes

d65b31774de31, (opens new window) - Removed deprecated border radius and border width tokens from CSS type.

Patch Changes

Updated dependencies

0.14.4

Patch Changes

9d6e4b66e81f9, (opens new window) - Internal changes.
Updated dependencies

0.14.3

Patch Changes

c72a8190e4e4f, (opens new window) - add types to generated code for tokens
Updated dependencies

0.14.2

Patch Changes

d92f75f49b03f, (opens new window) - added type definitions to return type of generated code

0.14.1

Patch Changes

eb69a4b60c75e, (opens new window) - Split type export and regular export

0.14.0

Minor Changes

d4a45d8562c6d, (opens new window) - Added radius.tile token to be used exclusively for creating tiles.

Patch Changes

Updated dependencies

0.13.1

Patch Changes

74c2f420ee49b, (opens new window) - Internal changes to how border radius is applied.

0.13.0

Minor Changes

b2cbc15f17d6a, (opens new window) - Added radius.tile token to be used exclusively for creating tiles.

Patch Changes

Updated dependencies

0.12.5

Patch Changes

23bcc5bbc9cee, (opens new window) - Internal changes to how border radius is applied.
Updated dependencies

0.12.4

Patch Changes

3b5b4a919aaaf, (opens new window) - Internal changes to how border radius is applied.
Updated dependencies

0.12.3

Patch Changes

fcd8f46058cd2, (opens new window) - Updated codemod to reference new border radius tokens available in xcss.
Updated dependencies

0.12.2

Patch Changes

Updated dependencies

0.12.1

Patch Changes

#193214, (opens new window) c661806a65543, (opens new window) - Internal changes to how border radius and border width values are applied. No visual change.
Updated dependencies

0.12.0

Minor Changes

#177956, (opens new window) 124aac4a851f1, (opens new window) - Added metric typography tokens which can be used via the CSS font shorthand.

Patch Changes

Updated dependencies

0.11.0

Minor Changes

#172429, (opens new window) efcc283cecdfe, (opens new window) - Added metric typography tokens which can be used via the CSS font shorthand.

Patch Changes

Updated dependencies

0.10.7

Patch Changes

Updated dependencies

0.10.6

Patch Changes

#137715, (opens new window) 40696be85b10e, (opens new window) - Improvements to primitives-emotion-to-compiled codemod: remove unnecessary tokens import.

0.10.5

Patch Changes

#135712, (opens new window) fa9caa5adb7a3, (opens new window) - Improvements to xcss() -> cssMap() codemod.
Updated dependencies

0.10.4

Patch Changes

#133515, (opens new window) 3e092526fea27, (opens new window) - Fix codemod config.

0.10.3

Patch Changes

#127093, (opens new window) 1378ea7a99ce1, (opens new window) - Upgrades jscodeshift to handle generics properly.
Updated dependencies

0.10.2

Patch Changes

#129972, (opens new window) b2d69a39e6687, (opens new window) - Update @compiled/react dependency for improved type checking support.

0.10.1

Patch Changes

#124329, (opens new window) b0d988fe689d9, (opens new window) - Consolidate ADS themes by adding the icon.color.subtlest with the value equal to icon.color.subtle to non-brand-refresh themes
Updated dependencies

0.10.0

Minor Changes

#117363, (opens new window) 10a0f7f6c2027, (opens new window) - This package's peerDependencies have been adjusted for react and/or react-dom to reflect the status of only supporting React 18 going forward. No explicit breaking change to React support has been made in this release, but this is to signify going forward, breaking changes for React 16 or React 17 may come via non-major semver releases.

Please refer this community post for more details: https://community.developer.atlassian.com/t/rfc-78-dropping-support-for-react-16-and-rendering-in-a-react-18-concurrent-root-in-jira-and-confluence/87026, (opens new window)

Patch Changes

Updated dependencies

0.9.0

Minor Changes

#116138, (opens new window) b50c5d5d65ae2, (opens new window) - Bump to the latest version of @compiled/react

0.8.0

Minor Changes

#109060, (opens new window) 4660ec858a305, (opens new window) - Update React from v16 to v18

Patch Changes

Updated dependencies

0.7.5

Patch Changes

#105661, (opens new window) f944cf37082f6, (opens new window) - Update dependencies and remove unused internal export.

0.7.4

Patch Changes

#103999, (opens new window) 9f62ecec4d422, (opens new window) - Update dependencies.

0.7.3

Patch Changes

Updated dependencies

0.7.2

Patch Changes

#178053, (opens new window) cb318c8c28c26, (opens new window) - Internal changes to typography.

0.7.1

Patch Changes

#175552, (opens new window) 0384c8ac8996a, (opens new window) - Narrow down fontStyle type definition to only allow normal and italic.

0.7.0

Minor Changes

#168289, (opens new window) 5fe404687ca98, (opens new window) - Add a test helper to reduce issues when migrating to Compiled CSS.

Change dom Node's textContent property to remove Compiled CSS definitions except for Compiled style nodes.

0.6.2

Patch Changes

#165531, (opens new window) 57f451bda8919, (opens new window) - Adds side-effect config to support Compiled css extraction in third-party apps

0.6.1

Patch Changes

#160054, (opens new window) a85c8b06aad62, (opens new window) - Updates to the 0.5.2-primitives-emotion-to-compiled codemod to group imports from @atlaskit/primitives.

0.6.0

Minor Changes

#154669, (opens new window) 20db78434becd, (opens new window) - Bump to the latest version of @compiled/*
#154669, (opens new window) 20db78434becd, (opens new window) - Adds the jsx export to allow @atlaskit/css to be used for the JSX Pragma within the Compiled ecosystem.

0.5.3

Patch Changes

#151036, (opens new window) 5fa98b5962048, (opens new window) - Add version prefix to codemod

0.5.2

Patch Changes

#150360, (opens new window) 284490a8c1813, (opens new window) - Add codemod to migrate @atlaskit/primitives from using Emotion APIs towards Compiled.

0.5.1

Patch Changes

Updated dependencies

0.5.0

Minor Changes

#138792, (opens new window) 59c6812e1be91, (opens new window) - Update the @atlaskit/css schema to include:
- border and font shorthand token values
- Background and color -hovered and -pressed tokens are available in the non-psuedo-states for patterns like <div css={[isHovered && hoveredStyles]} />
- Adds more commonly used media queries

Patch Changes

Updated dependencies

0.4.0

Minor Changes

#127511, (opens new window) db30e29344013, (opens new window) - Widening range of react and react-dom peer dependencies from ^16.8.0 || ^17.0.0 || ~18.2.0 to the wider range of ``^16.8.0 || ^17.0.0 || ^18.0.0` (where applicable).

This change has been done to enable usage of react@18.3 as well as to have a consistent peer dependency range for react and react-dom for /platform packages.

Patch Changes

Updated dependencies

0.3.0

Minor Changes

#108386, (opens new window) 8f3fa9e80b93c, (opens new window) - Updated xl breakpoint to be 1768px instead of 1760px (110.5rem instead of 110rem) to match updated design guidance.

0.2.0

Minor Changes

#111878, (opens new window) 223959ef57c80, (opens new window) - Explicitly set jsxRuntime to classic via pragma comments in order to avoid issues where jsxRuntime is implicitly set to automatic.

0.1.1

Patch Changes

#107116, (opens new window) 9a038f5d3834, (opens new window) - Upgrade dependency @compiled/react to latest version

0.1.0

Minor Changes

#90242, (opens new window) aff0087405c1, (opens new window) - Add support for React 18 in non-strict mode.

0.0.6

Patch Changes

#89540, (opens new window) 1748b673d90d, (opens new window) - DSP-17890 Add media query types to createStrictAPI, just be aware that cascading media queries are not guaranteed to work with Compiled, refer to https://compiledcssinjs.com/docs/atomic-css#selector-specificity, (opens new window)

0.0.5

Patch Changes

#83116, (opens new window) 8d4e99057fe0, (opens new window) - Upgrade Typescript from 4.9.5 to 5.4.2

0.0.4

Patch Changes

#80571, (opens new window) fafdb1dcce96, (opens new window) - Fix bugs in strict CSS typedef.
#79686, (opens new window) 7dc7cf06a8b9, (opens new window) - Bump @compiled/react to v0.17.0

0.0.3

Patch Changes

#62648, (opens new window) 1902f30344b5, (opens new window) - Add a StrictXCSSProp to clarify the loose vs. strict implementation.

0.0.2

Patch Changes

#63504, (opens new window) a48de33c8536, (opens new window) - Uses codegen'd token schema type definition from the tokens package
Updated dependencies

0.0.1

Patch Changes

#58767, (opens new window) 6a6dbc5197e8, (opens new window) - Initial commit.

Was this page helpful?

We use this feedback to improve our documentation.