Lozenge

d82e6f76528ab, (opens new window) - Add direct subpath package exports as part of the linking-platform, search, media, and design-system barrel-removal (de-barrel) migration.

These packages now expose their individual modules via explicit package.json exports subpaths so that consumers can import directly from the leaf module (e.g. @atlaskit/pkg/thing) instead of the package barrel/index. This adds new public entry points without changing or removing any existing exports, so it is a backwards-compatible additive change.

No runtime behaviour changes; this is an API-surface (entry-point) addition to support tree-shaking and to unblock removal of the barrel index files.

b9a07863db348, (opens new window) - Apply Volt entry-point and multi-export standards via volt-migrate-package. This is a major change to @atlaskit/lozenge: the package exports map has been restructured so every public subpath now resolves directly to its ./src/* implementation instead of going through an intermediate ./src/entry-points/* re-export. It also introduces new public subpaths: @atlaskit/lozenge/new/lozenge.

Because each subpath now points straight at its implementation module, a subpath and the package root can resolve to the same module instance. Consumers that deep-import the internal entry-points/* files, or that jest.mock() a specific subpath, may observe changed resolution/behaviour and need updating.

Importing the published subpaths (or the package root) continues to work as before:

If you were reaching into the internal entry-point modules, switch to the public subpath:

cd097a2111788, (opens new window) - Republish packages depending on @atlaskit/react-compiler-gating so their published dependency reference is updated to the renamed @atlaskit/react-compiler-gating scope.

The earlier rename of @atlassian/react-compiler-gating to @atlaskit/react-compiler-gating only bumped the renamed package itself, so dependent packages were never republished and their published versions still referenced the old @atlassian/react-compiler-gating name, which is not available in the public npm registry. This minor bump republishes all affected packages with the corrected dependency.

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.

• Borders now use the new color.border.accent.*.subtle / color.border.*.subtle tokens (introduced in @atlaskit/tokens@13.2.0) instead of being derived via OKLCH transforms.
• Icons use color.text.* tokens for guaranteed 3:1 contrast on coloured backgrounds across default, hover, and pressed states. Neutral and accent-gray icons use color.text.subtle.
• The trailing metric Badge uses the new bold semantic Badge appearances (successBold, warningBold, dangerBold, informationBold, discoveryBold) so the badge no longer reaches into Lozenge styling. In the lozenge's pressed/selected state the badge overlays color.background.neutral to remain distinguishable. The neutral lozenge uses color.background.neutral.hovered in default/hovered states (no neutralBold appearance exists).
• Removed Lozenge-specific accent.gray .subtle border in favour of the default color.border (since gray decorative borders look the same as the neutral default).

52b7aa6b3d721, (opens new window) - Added a new /new entrypoint for @atlaskit/lozenge, @atlaskit/badge, and @atlaskit/tag. These entrypoints export the new visual refresh components directly, bypassing the platform-dst-lozenge-tag-badge-visual-uplifts feature flag. This is intended for products that don't have Statsig integrated and cannot evaluate the feature flag.

New entrypoints:

• import Lozenge from '@atlaskit/lozenge/new'
• import Badge from '@atlaskit/badge/new'
• import Tag from '@atlaskit/tag/new'

Note: Do not use the /new entrypoint if your app can evaluate the platform-dst-lozenge-tag-badge-visual-uplifts feature flag. These entrypoints will be removed after the visual uplift rollout is complete, which will require updating import paths back to the default entrypoint.

a18e28278b0ac, (opens new window) - Fixed percentage maxWidth truncation in new lozenge component. Text now correctly truncates with ellipsis when maxWidth is set to a percentage value (e.g., '50%', '100%').

Add aria-controls, aria-expanded, and aria-haspopup props support to LozengeDropdownTrigger for improved accessibility when used with DropdownMenu or Popup components. These props are now properly passed through to the underlying button element.

Updated dependencies

• Visual Refresh (Opt-in): Implemented the North Star visual uplift for Lozenge behind the feature flag platform-dst-lozenge-tag-badge-visual-uplifts.

  • New API: The appearance prop now supports AccentColor values (e.g., 'accent-red', 'accent-blue') alongside updated SemanticColor values：'neutral', 'danger', 'success', 'discovery', 'information', 'warning'.

  • Deprecation: The isBold prop is now deprecated. The new visual style is bold by default.

  • Icons: Added support for the iconBefore prop to reinforce status visually.

#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)

#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.

#27076, (opens new window) 25e09731caa, (opens new window) - Fixes:

• Removes vertical-align: baseline from Lozenge which was being applied incorrectly.
• Removes a default prop which was causing unintended re-renders.

Updated dependencies

• Deprecate @atlaskit/lozenge/theme entry-point.

#12837, (opens new window) 1cd379a2199, (opens new window) - - In this version we made Lozenge dramatically faster and lighter. 🤩

• General performance improvements.

• We are now exporting a new style prop which you can use to pass a custom backgroundColor and color.

• BREAKING We have removed the deprecated theme prop. Don't worry if you do use the theming API, you can now use the new style prop for custom styling.

Before:

After:

• BREAKING We have removed the support of appearance prop object value. Please use style prop for customization.

Before:

After:

Running the codemod cli

To run the codemod: You first need to have the latest version installed

Once upgraded, use @atlaskit/codemod-cli via npx:

The CLI will show a list of components and versions so select @atlaskit/lozenge@^11.0.0 and you will automatically be upgraded.

What will be changed:

• It will move backgroundColor and textColor from appearance prop (if object is passed as appearance prop value) to style prop.

Run npx @atlaskit/codemod-cli -h for more details on usage.

For Atlassians,

refer to the documentation, (opens new window) for more details on the codemod CLI.

#3885, (opens new window) 6c525a8229, (opens new window) - Upgraded to TypeScript 3.9.6 and tslib to 2.0.0

Since tslib is a dependency for all our packages we recommend that products also follow this tslib upgrade to prevent duplicates of tslib being bundled.

[patch]a4d063330a, (opens new window):

Change imports to comply with Atlassian conventions- Updated dependencies fd41d77c29, (opens new window):

• @atlaskit/webdriver-runner@0.3.4

• @atlaskit/docs@8.4.0
• @atlaskit/webdriver-runner@0.3.0

• @atlaskit/webdriver-runner@0.2.0

[patch]6548261c9a, (opens new window):

Remove namespace imports from React, ReactDom, and PropTypes- Updated dependencies 6548261c9a, (opens new window):

• @atlaskit/docs@8.3.2
• @atlaskit/visual-regression@0.1.9
• @atlaskit/theme@9.5.1

[patch]4a223473c5, (opens new window):

Removes babel/runtime from dependencies. Users should see a smaller bundlesize as a result- Updated dependencies 82747f2922, (opens new window):

• @atlaskit/theme@9.5.0

[patch]557a8e2451, (opens new window):

Rebuilds package to fix typescript typing error.

[patch]35d2229b2a, (opens new window):

Adding missing license to packages and update to Copyright 2019 Atlassian Pty Ltd.

[minor]10e0798da6, (opens new window):

Adding an optional prop testId that will set the attribute value data-testid. It will help products to write better integration and end to end tests.

[patch]097b696613, (opens new window):

Components now depend on TS 3.6 internally, in order to fix an issue with TS resolving non-relative imports as relative imports

[patch]ecca4d1dbb, (opens new window):

Upgraded Typescript to 3.3.x

[patch]708028db86, (opens new window):

Change all the imports to theme in Core to use multi entry points

[patch]de35ce8c67, (opens new window):

Updates component maintainers

[patch]bbff8a7d87, (opens new window):

Fixes bug, missing version.json file

[patch]18dfac7332, (opens new window):

In this PR, we are:

• Re-introducing dist build folders
• Adding back cjs
• Replacing es5 by cjs and es2015 by esm
• Creating folders at the root for entry-points
• Removing the generation of the entry-points at the root Please see this ticket, (opens new window) or this page, (opens new window) for further details

[patch]f8778d517a, (opens new window):

Remove index.ts from built module

• Lozenge has been converted to Typescript. Typescript consumers will now get static type safety. Flow types are no longer provided. No API or behavioural changes.

• Updates react and react-dom peer dependencies to react@^16.8.0 and react-dom@^16.8.0. To use this package, please ensure you use at least this version of react and react-dom.

• Add emotion and remove styled-components

• @atlaskit/docs@7.0.3
• @atlaskit/theme@8.1.7

• Removes duplicate babel-runtime dependency

[major]76299208e6, (opens new window):

• Drop ES5 from all the flow modules

As a breaking change, all @atlaskit packages will be dropping cjs distributions and will only distribute esm. This means all distributed code will be transpiled, but will still contain import and export declarations.

The major reason for doing this is to allow us to support multiple entry points in packages, e.g:

Previously this was sort of possible for consumers by doing something like:

This has a couple of issues. 1, it treats the file system as API making internal refactors harder, we have to worry about how consumers might be using things that aren't actually supposed to be used. 2. We are unable to do this internally in @atlaskit packages. This leads to lots of packages bundling all of theme, just to use a single color, especially in situations where tree shaking fails.

To support being able to use multiple entrypoints internally, we unfortunately cannot have multiple distributions as they would need to have very different imports from of their own internal dependencies.

ES Modules are widely supported by all modern bundlers and can be worked around in node environments.

We may choose to revisit this solution in the future if we find any unintended condequences, but we see this as a pretty sane path forward which should lead to some major bundle size decreases, saner API's and simpler package architecture.

Please reach out to #fabric-build (if in Atlassian) or create an issue in Design System Support, (opens new window) (for external) if you have any questions or queries about this.

• @atlaskit/theme@7.0.1
• @atlaskit/docs@6.0.0

• Change API to experimental theming API to namespace component themes into separate contexts and make theming simpler. Update all dependant components.

• @atlaskit/theme@6.0.0
• @atlaskit/docs@5.0.6

• @atlaskit/theme@5.1.3

• @atlaskit/theme@5.1.2
• @atlaskit/docs@5.0.2

• @atlaskit/theme@5.1.1

• @atlaskit/docs@5.0.1

• @atlaskit/theme@5.0.0
• @atlaskit/docs@5.0.0

• @atlaskit/theme@5.0.0
• @atlaskit/docs@5.0.0

• @atlaskit/theme@4.0.4

• @atlaskit/theme@4.0.3
• @atlaskit/docs@4.1.1

• @atlaskit/docs@4.1.0
• @atlaskit/theme@4.0.2

• @atlaskit/theme@4.0.1
• @atlaskit/docs@4.0.1

• @atlaskit/theme@4.0.0
• @atlaskit/docs@4.0.0

• @atlaskit/docs@3.0.4