@atlaskit/tokens 3.1.0 → 3.3.0

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @atlaskit/tokens
 
+## 3.3.0
+
+### Minor Changes
+
+- [#109060](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/109060)
+  [`4660ec858a305`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4660ec858a305) -
+  Update `React` from v16 to v18
+
+### Patch Changes
+
+- Updated dependencies
+
+## 3.2.0
+
+### Minor Changes
+
+- [#102495](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/102495)
+  [`cf97e4ada8d52`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/cf97e4ada8d52) -
+  Modernized typography theme now applies a font weight of 653 for bold instead of 700. This
+  includes heading tokens and the individual `font.weight.bold` token.
+
+### Patch Changes
+
+- [#105744](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/105744)
+  [`bc9ed5e4ee94d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/bc9ed5e4ee94d) -
+  Updated 'ak-postbuild' script to also build '@atlaskit/platform-feature-flags'
+
 ## 3.1.0
 
 ### Minor Changes

package/dist/cjs/artifacts/themes/atlassian-typography-modernized.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::38b6ba79bdb23bd72bf5db3990d1bfb2>>
+ * @codegen <<SignedSource::04ce6f89b744c2a0ec7cf592807e1ba2>>
  * @codegenCommand yarn build tokens
  */
-var _default = exports.default = "\nhtml[data-theme~=\"typography:typography-modernized\"] {\n  --ds-UNSAFE-textTransformUppercase: uppercase;\n  --ds-font-heading-xxlarge: normal 700 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xlarge: normal 700 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-large: normal 700 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-medium: normal 700 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-small: normal 700 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xsmall: normal 700 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xxsmall: normal 700 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 700;\n  --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";
+var _default = exports.default = "\nhtml[data-theme~=\"typography:typography-modernized\"] {\n  --ds-UNSAFE-textTransformUppercase: uppercase;\n  --ds-font-heading-xxlarge: normal 653 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xlarge: normal 653 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-large: normal 653 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-medium: normal 653 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-small: normal 653 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xsmall: normal 653 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xxsmall: normal 653 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 653;\n  --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";

package/dist/cjs/artifacts/tokens-raw/atlassian-typography-modernized.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::2e613448665c48489ceb1abb4eefd550>>
+ * @codegen <<SignedSource::355fb0bf4ef3f45e232f8637a1fa195f>>
  * @codegenCommand yarn build tokens
  */
 var tokens = [{
@@ -38,7 +38,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
   },
-  "value": "normal 700 32px/36px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 32px/36px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -49,7 +49,7 @@ var tokens = [{
       "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize32",
       "lineHeight": "LineHeight36",
       "fontFamily": "FontFamilyWebSans",
@@ -67,7 +67,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
   },
-  "value": "normal 700 28px/32px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 28px/32px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -78,7 +78,7 @@ var tokens = [{
       "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize28",
       "lineHeight": "LineHeight32",
       "fontFamily": "FontFamilyWebSans",
@@ -96,7 +96,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
   },
-  "value": "normal 700 24px/28px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 24px/28px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -107,7 +107,7 @@ var tokens = [{
       "description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize24",
       "lineHeight": "LineHeight28",
       "fontFamily": "FontFamilyWebSans",
@@ -125,7 +125,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
   },
-  "value": "normal 700 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -136,7 +136,7 @@ var tokens = [{
       "description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize20",
       "lineHeight": "LineHeight24",
       "fontFamily": "FontFamilyWebSans",
@@ -154,7 +154,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in small components where space is limited. Migrate instances of H500 to Heading S."
   },
-  "value": "normal 700 16px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 16px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -165,7 +165,7 @@ var tokens = [{
       "description": "For headers in small components where space is limited. Migrate instances of H500 to Heading S."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize16",
       "lineHeight": "LineHeight20",
       "fontFamily": "FontFamilyWebSans",
@@ -183,7 +183,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in small components where space is limited. Migrate instances of H400 to Heading XS."
   },
-  "value": "normal 700 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -194,7 +194,7 @@ var tokens = [{
       "description": "For headers in small components where space is limited. Migrate instances of H400 to Heading XS."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize14",
       "lineHeight": "LineHeight20",
       "fontFamily": "FontFamilyWebSans",
@@ -212,7 +212,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in fine print or tight spaces. Use sparingly. Migrate instances of H100, H200 and H300 to Heading XXS."
   },
-  "value": "normal 700 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -223,7 +223,7 @@ var tokens = [{
       "description": "For headers in fine print or tight spaces. Use sparingly. Migrate instances of H100, H200 and H300 to Heading XXS."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize12",
       "lineHeight": "LineHeight16",
       "fontFamily": "FontFamilyWebSans",
@@ -452,7 +452,7 @@ var tokens = [{
     "introduced": "0.10.33",
     "description": "Use sparingly for emphasising text, such as in a lozenge."
   },
-  "value": "700",
+  "value": "653",
   "filePath": "schema/themes/atlassian-typography-modernized/font-weight.tsx",
   "isSource": true,
   "original": {
@@ -462,7 +462,7 @@ var tokens = [{
       "introduced": "0.10.33",
       "description": "Use sparingly for emphasising text, such as in a lozenge."
     },
-    "value": "FontWeight700"
+    "value": "FontWeight653"
   },
   "name": "font.weight.bold",
   "path": ["font", "weight", "bold"],

package/dist/cjs/get-token-analytics.js

@@ -0,0 +1,57 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.recordTokenCall = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+// Extend the Window interface to include optional analyticsWebClient
+
+/**
+ * Records a token call event to the analytics service. This is used to track which tokens are being used at runtime as they should be substituted by the values by @atlaskit/tokens/babel-plugin at build time.
+ * @param token - The token that was called.
+ * @param fallback - The fallback value that was used.
+ */
+var recordTokenCall = exports.recordTokenCall = /*#__PURE__*/function () {
+  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(token, fallback) {
+    var _window, analyticsClient, isThemeEnabled;
+    return _regenerator.default.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          try {
+            // TODO: window.analyticsWebClient is a property specific to Jira. It is not available in the other products. We might consider to register a dedicated analytics client for logging token calls for each product to enable cohesive experience across different products.
+            analyticsClient = (_window = window) === null || _window === void 0 ? void 0 : _window.analyticsWebClient;
+            if (analyticsClient) {
+              // Check for a <style> element with a data-theme attribute in the document
+              isThemeEnabled = !!document.querySelector('style[data-theme]'); // when such property exists, we are using it to send this event https://data-portal.internal.atlassian.com/analytics/registry/75682 which is registered specifically for Jira.
+              analyticsClient.sendEvent({
+                type: 'TRACK',
+                payload: {
+                  action: 'called_at_runtime',
+                  actionSubject: 'token',
+                  source: 'design-system',
+                  attributes: {
+                    url: window.location.href,
+                    token: token,
+                    fallback: fallback,
+                    isThemeEnabled: isThemeEnabled
+                  }
+                }
+              });
+            }
+          } catch (e) {
+            // eslint-disable-next-line no-console
+            console.error(e);
+          }
+        case 1:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return function recordTokenCall(_x, _x2) {
+    return _ref.apply(this, arguments);
+  };
+}();

package/dist/cjs/get-token.js

@@ -9,6 +9,7 @@ var _warnOnce = _interopRequireDefault(require("@atlaskit/ds-lib/warn-once"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _tokenNames = _interopRequireDefault(require("./artifacts/token-names"));
 var _constants = require("./constants");
+var _getTokenAnalytics = require("./get-token-analytics");
 /**
  * Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
  * This should be used to implement design decisions throughout your application.
@@ -32,6 +33,9 @@ var _constants = require("./constants");
  *
  */
 function token(path, fallback) {
+  if ((0, _platformFeatureFlags.fg)('platform-token-runtime-call-tracking')) {
+    (0, _getTokenAnalytics.recordTokenCall)(path, fallback);
+  }
   var token = _tokenNames.default[path];
   if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production') {
     if (!token) {

package/dist/es2019/artifacts/themes/atlassian-typography-modernized.js

@@ -1,18 +1,18 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::38b6ba79bdb23bd72bf5db3990d1bfb2>>
+ * @codegen <<SignedSource::04ce6f89b744c2a0ec7cf592807e1ba2>>
  * @codegenCommand yarn build tokens
  */
 export default `
 html[data-theme~="typography:typography-modernized"] {
   --ds-UNSAFE-textTransformUppercase: uppercase;
-  --ds-font-heading-xxlarge: normal 700 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
-  --ds-font-heading-xlarge: normal 700 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
-  --ds-font-heading-large: normal 700 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
-  --ds-font-heading-medium: normal 700 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
-  --ds-font-heading-small: normal 700 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
-  --ds-font-heading-xsmall: normal 700 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
-  --ds-font-heading-xxsmall: normal 700 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
+  --ds-font-heading-xxlarge: normal 653 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
+  --ds-font-heading-xlarge: normal 653 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
+  --ds-font-heading-large: normal 653 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
+  --ds-font-heading-medium: normal 653 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
+  --ds-font-heading-small: normal 653 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
+  --ds-font-heading-xsmall: normal 653 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
+  --ds-font-heading-xxsmall: normal 653 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
   --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
   --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
   --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
@@ -21,7 +21,7 @@ html[data-theme~="typography:typography-modernized"] {
   --ds-font-weight-regular: 400;
   --ds-font-weight-medium: 500;
   --ds-font-weight-semibold: 600;
-  --ds-font-weight-bold: 700;
+  --ds-font-weight-bold: 653;
   --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
   --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
   --ds-font-family-code: ui-monospace, Menlo, "Segoe UI Mono", "Ubuntu Mono", monospace;

package/dist/es2019/artifacts/tokens-raw/atlassian-typography-modernized.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::2e613448665c48489ceb1abb4eefd550>>
+ * @codegen <<SignedSource::355fb0bf4ef3f45e232f8637a1fa195f>>
  * @codegenCommand yarn build tokens
  */
 const tokens = [{
@@ -32,7 +32,7 @@ const tokens = [{
     "introduced": "1.14.0",
     "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
   },
-  "value": "normal 700 32px/36px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 32px/36px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -43,7 +43,7 @@ const tokens = [{
       "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize32",
       "lineHeight": "LineHeight36",
       "fontFamily": "FontFamilyWebSans",
@@ -61,7 +61,7 @@ const tokens = [{
     "introduced": "1.14.0",
     "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
   },
-  "value": "normal 700 28px/32px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 28px/32px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -72,7 +72,7 @@ const tokens = [{
       "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize28",
       "lineHeight": "LineHeight32",
       "fontFamily": "FontFamilyWebSans",
@@ -90,7 +90,7 @@ const tokens = [{
     "introduced": "1.14.0",
     "description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
   },
-  "value": "normal 700 24px/28px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 24px/28px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -101,7 +101,7 @@ const tokens = [{
       "description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize24",
       "lineHeight": "LineHeight28",
       "fontFamily": "FontFamilyWebSans",
@@ -119,7 +119,7 @@ const tokens = [{
     "introduced": "1.14.0",
     "description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
   },
-  "value": "normal 700 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -130,7 +130,7 @@ const tokens = [{
       "description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize20",
       "lineHeight": "LineHeight24",
       "fontFamily": "FontFamilyWebSans",
@@ -148,7 +148,7 @@ const tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in small components where space is limited. Migrate instances of H500 to Heading S."
   },
-  "value": "normal 700 16px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 16px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -159,7 +159,7 @@ const tokens = [{
       "description": "For headers in small components where space is limited. Migrate instances of H500 to Heading S."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize16",
       "lineHeight": "LineHeight20",
       "fontFamily": "FontFamilyWebSans",
@@ -177,7 +177,7 @@ const tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in small components where space is limited. Migrate instances of H400 to Heading XS."
   },
-  "value": "normal 700 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -188,7 +188,7 @@ const tokens = [{
       "description": "For headers in small components where space is limited. Migrate instances of H400 to Heading XS."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize14",
       "lineHeight": "LineHeight20",
       "fontFamily": "FontFamilyWebSans",
@@ -206,7 +206,7 @@ const tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in fine print or tight spaces. Use sparingly. Migrate instances of H100, H200 and H300 to Heading XXS."
   },
-  "value": "normal 700 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -217,7 +217,7 @@ const tokens = [{
       "description": "For headers in fine print or tight spaces. Use sparingly. Migrate instances of H100, H200 and H300 to Heading XXS."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize12",
       "lineHeight": "LineHeight16",
       "fontFamily": "FontFamilyWebSans",
@@ -446,7 +446,7 @@ const tokens = [{
     "introduced": "0.10.33",
     "description": "Use sparingly for emphasising text, such as in a lozenge."
   },
-  "value": "700",
+  "value": "653",
   "filePath": "schema/themes/atlassian-typography-modernized/font-weight.tsx",
   "isSource": true,
   "original": {
@@ -456,7 +456,7 @@ const tokens = [{
       "introduced": "0.10.33",
       "description": "Use sparingly for emphasising text, such as in a lozenge."
     },
-    "value": "FontWeight700"
+    "value": "FontWeight653"
   },
   "name": "font.weight.bold",
   "path": ["font", "weight", "bold"],

package/dist/es2019/get-token-analytics.js

@@ -0,0 +1,37 @@
+// Extend the Window interface to include optional analyticsWebClient
+
+/**
+ * Records a token call event to the analytics service. This is used to track which tokens are being used at runtime as they should be substituted by the values by @atlaskit/tokens/babel-plugin at build time.
+ * @param token - The token that was called.
+ * @param fallback - The fallback value that was used.
+ */
+export const recordTokenCall = async (token, fallback) => {
+  try {
+    var _window;
+    // TODO: window.analyticsWebClient is a property specific to Jira. It is not available in the other products. We might consider to register a dedicated analytics client for logging token calls for each product to enable cohesive experience across different products.
+    const analyticsClient = (_window = window) === null || _window === void 0 ? void 0 : _window.analyticsWebClient;
+    if (analyticsClient) {
+      // Check for a <style> element with a data-theme attribute in the document
+      const isThemeEnabled = !!document.querySelector('style[data-theme]');
+
+      // when such property exists, we are using it to send this event https://data-portal.internal.atlassian.com/analytics/registry/75682 which is registered specifically for Jira.
+      analyticsClient.sendEvent({
+        type: 'TRACK',
+        payload: {
+          action: 'called_at_runtime',
+          actionSubject: 'token',
+          source: 'design-system',
+          attributes: {
+            url: window.location.href,
+            token,
+            fallback,
+            isThemeEnabled
+          }
+        }
+      });
+    }
+  } catch (e) {
+    // eslint-disable-next-line no-console
+    console.error(e);
+  }
+};

package/dist/es2019/get-token.js

@@ -2,6 +2,7 @@ import warnOnce from '@atlaskit/ds-lib/warn-once';
 import { fg } from '@atlaskit/platform-feature-flags';
 import tokens from './artifacts/token-names';
 import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
+import { recordTokenCall } from './get-token-analytics';
 /**
  * Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
  * This should be used to implement design decisions throughout your application.
@@ -25,6 +26,9 @@ import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
  *
  */
 function token(path, fallback) {
+  if (fg('platform-token-runtime-call-tracking')) {
+    recordTokenCall(path, fallback);
+  }
   let token = tokens[path];
   if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production') {
     if (!token) {

package/dist/esm/artifacts/themes/atlassian-typography-modernized.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::38b6ba79bdb23bd72bf5db3990d1bfb2>>
+ * @codegen <<SignedSource::04ce6f89b744c2a0ec7cf592807e1ba2>>
  * @codegenCommand yarn build tokens
  */
-export default "\nhtml[data-theme~=\"typography:typography-modernized\"] {\n  --ds-UNSAFE-textTransformUppercase: uppercase;\n  --ds-font-heading-xxlarge: normal 700 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xlarge: normal 700 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-large: normal 700 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-medium: normal 700 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-small: normal 700 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xsmall: normal 700 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xxsmall: normal 700 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 700;\n  --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";
+export default "\nhtml[data-theme~=\"typography:typography-modernized\"] {\n  --ds-UNSAFE-textTransformUppercase: uppercase;\n  --ds-font-heading-xxlarge: normal 653 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xlarge: normal 653 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-large: normal 653 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-medium: normal 653 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-small: normal 653 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xsmall: normal 653 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xxsmall: normal 653 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 653;\n  --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";

package/dist/esm/artifacts/tokens-raw/atlassian-typography-modernized.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::2e613448665c48489ceb1abb4eefd550>>
+ * @codegen <<SignedSource::355fb0bf4ef3f45e232f8637a1fa195f>>
  * @codegenCommand yarn build tokens
  */
 var tokens = [{
@@ -32,7 +32,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
   },
-  "value": "normal 700 32px/36px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 32px/36px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -43,7 +43,7 @@ var tokens = [{
       "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize32",
       "lineHeight": "LineHeight36",
       "fontFamily": "FontFamilyWebSans",
@@ -61,7 +61,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
   },
-  "value": "normal 700 28px/32px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 28px/32px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -72,7 +72,7 @@ var tokens = [{
       "description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize28",
       "lineHeight": "LineHeight32",
       "fontFamily": "FontFamilyWebSans",
@@ -90,7 +90,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
   },
-  "value": "normal 700 24px/28px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 24px/28px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -101,7 +101,7 @@ var tokens = [{
       "description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize24",
       "lineHeight": "LineHeight28",
       "fontFamily": "FontFamilyWebSans",
@@ -119,7 +119,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
   },
-  "value": "normal 700 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -130,7 +130,7 @@ var tokens = [{
       "description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize20",
       "lineHeight": "LineHeight24",
       "fontFamily": "FontFamilyWebSans",
@@ -148,7 +148,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in small components where space is limited. Migrate instances of H500 to Heading S."
   },
-  "value": "normal 700 16px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 16px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -159,7 +159,7 @@ var tokens = [{
       "description": "For headers in small components where space is limited. Migrate instances of H500 to Heading S."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize16",
       "lineHeight": "LineHeight20",
       "fontFamily": "FontFamilyWebSans",
@@ -177,7 +177,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in small components where space is limited. Migrate instances of H400 to Heading XS."
   },
-  "value": "normal 700 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -188,7 +188,7 @@ var tokens = [{
       "description": "For headers in small components where space is limited. Migrate instances of H400 to Heading XS."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize14",
       "lineHeight": "LineHeight20",
       "fontFamily": "FontFamilyWebSans",
@@ -206,7 +206,7 @@ var tokens = [{
     "introduced": "1.14.0",
     "description": "For headers in fine print or tight spaces. Use sparingly. Migrate instances of H100, H200 and H300 to Heading XXS."
   },
-  "value": "normal 700 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
+  "value": "normal 653 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
   "filePath": "schema/themes/atlassian-typography-modernized/theme.tsx",
   "isSource": true,
   "original": {
@@ -217,7 +217,7 @@ var tokens = [{
       "description": "For headers in fine print or tight spaces. Use sparingly. Migrate instances of H100, H200 and H300 to Heading XXS."
     },
     "value": {
-      "fontWeight": "FontWeight700",
+      "fontWeight": "FontWeight653",
       "fontSize": "FontSize12",
       "lineHeight": "LineHeight16",
       "fontFamily": "FontFamilyWebSans",
@@ -446,7 +446,7 @@ var tokens = [{
     "introduced": "0.10.33",
     "description": "Use sparingly for emphasising text, such as in a lozenge."
   },
-  "value": "700",
+  "value": "653",
   "filePath": "schema/themes/atlassian-typography-modernized/font-weight.tsx",
   "isSource": true,
   "original": {
@@ -456,7 +456,7 @@ var tokens = [{
       "introduced": "0.10.33",
       "description": "Use sparingly for emphasising text, such as in a lozenge."
     },
-    "value": "FontWeight700"
+    "value": "FontWeight653"
   },
   "name": "font.weight.bold",
   "path": ["font", "weight", "bold"],

package/dist/esm/get-token-analytics.js

@@ -0,0 +1,50 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+// Extend the Window interface to include optional analyticsWebClient
+
+/**
+ * Records a token call event to the analytics service. This is used to track which tokens are being used at runtime as they should be substituted by the values by @atlaskit/tokens/babel-plugin at build time.
+ * @param token - The token that was called.
+ * @param fallback - The fallback value that was used.
+ */
+export var recordTokenCall = /*#__PURE__*/function () {
+  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(token, fallback) {
+    var _window, analyticsClient, isThemeEnabled;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          try {
+            // TODO: window.analyticsWebClient is a property specific to Jira. It is not available in the other products. We might consider to register a dedicated analytics client for logging token calls for each product to enable cohesive experience across different products.
+            analyticsClient = (_window = window) === null || _window === void 0 ? void 0 : _window.analyticsWebClient;
+            if (analyticsClient) {
+              // Check for a <style> element with a data-theme attribute in the document
+              isThemeEnabled = !!document.querySelector('style[data-theme]'); // when such property exists, we are using it to send this event https://data-portal.internal.atlassian.com/analytics/registry/75682 which is registered specifically for Jira.
+              analyticsClient.sendEvent({
+                type: 'TRACK',
+                payload: {
+                  action: 'called_at_runtime',
+                  actionSubject: 'token',
+                  source: 'design-system',
+                  attributes: {
+                    url: window.location.href,
+                    token: token,
+                    fallback: fallback,
+                    isThemeEnabled: isThemeEnabled
+                  }
+                }
+              });
+            }
+          } catch (e) {
+            // eslint-disable-next-line no-console
+            console.error(e);
+          }
+        case 1:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return function recordTokenCall(_x, _x2) {
+    return _ref.apply(this, arguments);
+  };
+}();

package/dist/esm/get-token.js

@@ -2,6 +2,7 @@ import warnOnce from '@atlaskit/ds-lib/warn-once';
 import { fg } from '@atlaskit/platform-feature-flags';
 import tokens from './artifacts/token-names';
 import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
+import { recordTokenCall } from './get-token-analytics';
 /**
  * Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
  * This should be used to implement design decisions throughout your application.
@@ -25,6 +26,9 @@ import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
  *
  */
 function token(path, fallback) {
+  if (fg('platform-token-runtime-call-tracking')) {
+    recordTokenCall(path, fallback);
+  }
   var token = tokens[path];
   if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production') {
     if (!token) {

package/dist/types/artifacts/themes/atlassian-typography-modernized.d.ts

@@ -1,7 +1,7 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::38b6ba79bdb23bd72bf5db3990d1bfb2>>
+ * @codegen <<SignedSource::04ce6f89b744c2a0ec7cf592807e1ba2>>
  * @codegenCommand yarn build tokens
  */
-declare const _default: "\nhtml[data-theme~=\"typography:typography-modernized\"] {\n  --ds-UNSAFE-textTransformUppercase: uppercase;\n  --ds-font-heading-xxlarge: normal 700 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xlarge: normal 700 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-large: normal 700 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-medium: normal 700 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-small: normal 700 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xsmall: normal 700 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xxsmall: normal 700 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 700;\n  --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";
+declare const _default: "\nhtml[data-theme~=\"typography:typography-modernized\"] {\n  --ds-UNSAFE-textTransformUppercase: uppercase;\n  --ds-font-heading-xxlarge: normal 653 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xlarge: normal 653 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-large: normal 653 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-medium: normal 653 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-small: normal 653 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xsmall: normal 653 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xxsmall: normal 653 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 653;\n  --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";
 export default _default;

package/dist/types/artifacts/tokens-raw/atlassian-typography-modernized.d.ts

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::2e613448665c48489ceb1abb4eefd550>>
+ * @codegen <<SignedSource::355fb0bf4ef3f45e232f8637a1fa195f>>
  * @codegenCommand yarn build tokens
  */
 declare const tokens: ({

package/dist/types/get-token-analytics.d.ts

@@ -0,0 +1,11 @@
+declare global {
+    interface Window {
+        analyticsWebClient?: any;
+    }
+}
+/**
+ * Records a token call event to the analytics service. This is used to track which tokens are being used at runtime as they should be substituted by the values by @atlaskit/tokens/babel-plugin at build time.
+ * @param token - The token that was called.
+ * @param fallback - The fallback value that was used.
+ */
+export declare const recordTokenCall: <T extends "color.text" | "color.text.accent.lime" | "color.text.accent.lime.bolder" | "color.text.accent.red" | "color.text.accent.red.bolder" | "color.text.accent.orange" | "color.text.accent.orange.bolder" | "color.text.accent.yellow" | "color.text.accent.yellow.bolder" | "color.text.accent.green" | "color.text.accent.green.bolder" | "color.text.accent.teal" | "color.text.accent.teal.bolder" | "color.text.accent.blue" | "color.text.accent.blue.bolder" | "color.text.accent.purple" | "color.text.accent.purple.bolder" | "color.text.accent.magenta" | "color.text.accent.magenta.bolder" | "color.text.accent.gray" | "color.text.accent.gray.bolder" | "color.text.disabled" | "color.text.inverse" | "color.text.selected" | "color.text.brand" | "color.text.danger" | "color.text.warning" | "color.text.warning.inverse" | "color.text.success" | "color.text.discovery" | "color.text.information" | "color.text.subtlest" | "color.text.subtle" | "color.link" | "color.link.pressed" | "color.link.visited" | "color.link.visited.pressed" | "color.icon" | "color.icon.accent.lime" | "color.icon.accent.red" | "color.icon.accent.orange" | "color.icon.accent.yellow" | "color.icon.accent.green" | "color.icon.accent.teal" | "color.icon.accent.blue" | "color.icon.accent.purple" | "color.icon.accent.magenta" | "color.icon.accent.gray" | "color.icon.disabled" | "color.icon.inverse" | "color.icon.selected" | "color.icon.brand" | "color.icon.danger" | "color.icon.warning" | "color.icon.warning.inverse" | "color.icon.success" | "color.icon.discovery" | "color.icon.information" | "color.icon.subtlest" | "color.icon.subtle" | "color.border" | "color.border.accent.lime" | "color.border.accent.red" | "color.border.accent.orange" | "color.border.accent.yellow" | "color.border.accent.green" | "color.border.accent.teal" | "color.border.accent.blue" | "color.border.accent.purple" | "color.border.accent.magenta" | "color.border.accent.gray" | "color.border.disabled" | "color.border.focused" | "color.border.input" | "color.border.inverse" | "color.border.selected" | "color.border.brand" | "color.border.danger" | "color.border.warning" | "color.border.success" | "color.border.discovery" | "color.border.information" | "color.border.bold" | "color.background.accent.lime.subtlest" | "color.background.accent.lime.subtlest.hovered" | "color.background.accent.lime.subtlest.pressed" | "color.background.accent.lime.subtler" | "color.background.accent.lime.subtler.hovered" | "color.background.accent.lime.subtler.pressed" | "color.background.accent.lime.subtle" | "color.background.accent.lime.subtle.hovered" | "color.background.accent.lime.subtle.pressed" | "color.background.accent.lime.bolder" | "color.background.accent.lime.bolder.hovered" | "color.background.accent.lime.bolder.pressed" | "color.background.accent.red.subtlest" | "color.background.accent.red.subtlest.hovered" | "color.background.accent.red.subtlest.pressed" | "color.background.accent.red.subtler" | "color.background.accent.red.subtler.hovered" | "color.background.accent.red.subtler.pressed" | "color.background.accent.red.subtle" | "color.background.accent.red.subtle.hovered" | "color.background.accent.red.subtle.pressed" | "color.background.accent.red.bolder" | "color.background.accent.red.bolder.hovered" | "color.background.accent.red.bolder.pressed" | "color.background.accent.orange.subtlest" | "color.background.accent.orange.subtlest.hovered" | "color.background.accent.orange.subtlest.pressed" | "color.background.accent.orange.subtler" | "color.background.accent.orange.subtler.hovered" | "color.background.accent.orange.subtler.pressed" | "color.background.accent.orange.subtle" | "color.background.accent.orange.subtle.hovered" | "color.background.accent.orange.subtle.pressed" | "color.background.accent.orange.bolder" | "color.background.accent.orange.bolder.hovered" | "color.background.accent.orange.bolder.pressed" | "color.background.accent.yellow.subtlest" | "color.background.accent.yellow.subtlest.hovered" | "color.background.accent.yellow.subtlest.pressed" | "color.background.accent.yellow.subtler" | "color.background.accent.yellow.subtler.hovered" | "color.background.accent.yellow.subtler.pressed" | "color.background.accent.yellow.subtle" | "color.background.accent.yellow.subtle.hovered" | "color.background.accent.yellow.subtle.pressed" | "color.background.accent.yellow.bolder" | "color.background.accent.yellow.bolder.hovered" | "color.background.accent.yellow.bolder.pressed" | "color.background.accent.green.subtlest" | "color.background.accent.green.subtlest.hovered" | "color.background.accent.green.subtlest.pressed" | "color.background.accent.green.subtler" | "color.background.accent.green.subtler.hovered" | "color.background.accent.green.subtler.pressed" | "color.background.accent.green.subtle" | "color.background.accent.green.subtle.hovered" | "color.background.accent.green.subtle.pressed" | "color.background.accent.green.bolder" | "color.background.accent.green.bolder.hovered" | "color.background.accent.green.bolder.pressed" | "color.background.accent.teal.subtlest" | "color.background.accent.teal.subtlest.hovered" | "color.background.accent.teal.subtlest.pressed" | "color.background.accent.teal.subtler" | "color.background.accent.teal.subtler.hovered" | "color.background.accent.teal.subtler.pressed" | "color.background.accent.teal.subtle" | "color.background.accent.teal.subtle.hovered" | "color.background.accent.teal.subtle.pressed" | "color.background.accent.teal.bolder" | "color.background.accent.teal.bolder.hovered" | "color.background.accent.teal.bolder.pressed" | "color.background.accent.blue.subtlest" | "color.background.accent.blue.subtlest.hovered" | "color.background.accent.blue.subtlest.pressed" | "color.background.accent.blue.subtler" | "color.background.accent.blue.subtler.hovered" | "color.background.accent.blue.subtler.pressed" | "color.background.accent.blue.subtle" | "color.background.accent.blue.subtle.hovered" | "color.background.accent.blue.subtle.pressed" | "color.background.accent.blue.bolder" | "color.background.accent.blue.bolder.hovered" | "color.background.accent.blue.bolder.pressed" | "color.background.accent.purple.subtlest" | "color.background.accent.purple.subtlest.hovered" | "color.background.accent.purple.subtlest.pressed" | "color.background.accent.purple.subtler" | "color.background.accent.purple.subtler.hovered" | "color.background.accent.purple.subtler.pressed" | "color.background.accent.purple.subtle" | "color.background.accent.purple.subtle.hovered" | "color.background.accent.purple.subtle.pressed" | "color.background.accent.purple.bolder" | "color.background.accent.purple.bolder.hovered" | "color.background.accent.purple.bolder.pressed" | "color.background.accent.magenta.subtlest" | "color.background.accent.magenta.subtlest.hovered" | "color.background.accent.magenta.subtlest.pressed" | "color.background.accent.magenta.subtler" | "color.background.accent.magenta.subtler.hovered" | "color.background.accent.magenta.subtler.pressed" | "color.background.accent.magenta.subtle" | "color.background.accent.magenta.subtle.hovered" | "color.background.accent.magenta.subtle.pressed" | "color.background.accent.magenta.bolder" | "color.background.accent.magenta.bolder.hovered" | "color.background.accent.magenta.bolder.pressed" | "color.background.accent.gray.subtlest" | "color.background.accent.gray.subtlest.hovered" | "color.background.accent.gray.subtlest.pressed" | "color.background.accent.gray.subtler" | "color.background.accent.gray.subtler.hovered" | "color.background.accent.gray.subtler.pressed" | "color.background.accent.gray.subtle" | "color.background.accent.gray.subtle.hovered" | "color.background.accent.gray.subtle.pressed" | "color.background.accent.gray.bolder" | "color.background.accent.gray.bolder.hovered" | "color.background.accent.gray.bolder.pressed" | "color.background.disabled" | "color.background.input" | "color.background.input.hovered" | "color.background.input.pressed" | "color.background.inverse.subtle" | "color.background.inverse.subtle.hovered" | "color.background.inverse.subtle.pressed" | "color.background.neutral" | "color.background.neutral.hovered" | "color.background.neutral.pressed" | "color.background.neutral.subtle" | "color.background.neutral.subtle.hovered" | "color.background.neutral.subtle.pressed" | "color.background.neutral.bold" | "color.background.neutral.bold.hovered" | "color.background.neutral.bold.pressed" | "color.background.selected" | "color.background.selected.hovered" | "color.background.selected.pressed" | "color.background.selected.bold" | "color.background.selected.bold.hovered" | "color.background.selected.bold.pressed" | "color.background.brand.subtlest" | "color.background.brand.subtlest.hovered" | "color.background.brand.subtlest.pressed" | "color.background.brand.bold" | "color.background.brand.bold.hovered" | "color.background.brand.bold.pressed" | "color.background.brand.boldest" | "color.background.brand.boldest.hovered" | "color.background.brand.boldest.pressed" | "color.background.danger" | "color.background.danger.hovered" | "color.background.danger.pressed" | "color.background.danger.bold" | "color.background.danger.bold.hovered" | "color.background.danger.bold.pressed" | "color.background.warning" | "color.background.warning.hovered" | "color.background.warning.pressed" | "color.background.warning.bold" | "color.background.warning.bold.hovered" | "color.background.warning.bold.pressed" | "color.background.success" | "color.background.success.hovered" | "color.background.success.pressed" | "color.background.success.bold" | "color.background.success.bold.hovered" | "color.background.success.bold.pressed" | "color.background.discovery" | "color.background.discovery.hovered" | "color.background.discovery.pressed" | "color.background.discovery.bold" | "color.background.discovery.bold.hovered" | "color.background.discovery.bold.pressed" | "color.background.information" | "color.background.information.hovered" | "color.background.information.pressed" | "color.background.information.bold" | "color.background.information.bold.hovered" | "color.background.information.bold.pressed" | "color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "color.interaction.hovered" | "color.interaction.pressed" | "color.skeleton" | "color.skeleton.subtle" | "color.chart.categorical.1" | "color.chart.categorical.1.hovered" | "color.chart.categorical.2" | "color.chart.categorical.2.hovered" | "color.chart.categorical.3" | "color.chart.categorical.3.hovered" | "color.chart.categorical.4" | "color.chart.categorical.4.hovered" | "color.chart.categorical.5" | "color.chart.categorical.5.hovered" | "color.chart.categorical.6" | "color.chart.categorical.6.hovered" | "color.chart.categorical.7" | "color.chart.categorical.7.hovered" | "color.chart.categorical.8" | "color.chart.categorical.8.hovered" | "color.chart.lime.bold" | "color.chart.lime.bold.hovered" | "color.chart.lime.bolder" | "color.chart.lime.bolder.hovered" | "color.chart.lime.boldest" | "color.chart.lime.boldest.hovered" | "color.chart.neutral" | "color.chart.neutral.hovered" | "color.chart.red.bold" | "color.chart.red.bold.hovered" | "color.chart.red.bolder" | "color.chart.red.bolder.hovered" | "color.chart.red.boldest" | "color.chart.red.boldest.hovered" | "color.chart.orange.bold" | "color.chart.orange.bold.hovered" | "color.chart.orange.bolder" | "color.chart.orange.bolder.hovered" | "color.chart.orange.boldest" | "color.chart.orange.boldest.hovered" | "color.chart.yellow.bold" | "color.chart.yellow.bold.hovered" | "color.chart.yellow.bolder" | "color.chart.yellow.bolder.hovered" | "color.chart.yellow.boldest" | "color.chart.yellow.boldest.hovered" | "color.chart.green.bold" | "color.chart.green.bold.hovered" | "color.chart.green.bolder" | "color.chart.green.bolder.hovered" | "color.chart.green.boldest" | "color.chart.green.boldest.hovered" | "color.chart.teal.bold" | "color.chart.teal.bold.hovered" | "color.chart.teal.bolder" | "color.chart.teal.bolder.hovered" | "color.chart.teal.boldest" | "color.chart.teal.boldest.hovered" | "color.chart.blue.bold" | "color.chart.blue.bold.hovered" | "color.chart.blue.bolder" | "color.chart.blue.bolder.hovered" | "color.chart.blue.boldest" | "color.chart.blue.boldest.hovered" | "color.chart.purple.bold" | "color.chart.purple.bold.hovered" | "color.chart.purple.bolder" | "color.chart.purple.bolder.hovered" | "color.chart.purple.boldest" | "color.chart.purple.boldest.hovered" | "color.chart.magenta.bold" | "color.chart.magenta.bold.hovered" | "color.chart.magenta.bolder" | "color.chart.magenta.bolder.hovered" | "color.chart.magenta.boldest" | "color.chart.magenta.boldest.hovered" | "color.chart.gray.bold" | "color.chart.gray.bold.hovered" | "color.chart.gray.bolder" | "color.chart.gray.bolder.hovered" | "color.chart.gray.boldest" | "color.chart.gray.boldest.hovered" | "color.chart.brand" | "color.chart.brand.hovered" | "color.chart.danger" | "color.chart.danger.hovered" | "color.chart.danger.bold" | "color.chart.danger.bold.hovered" | "color.chart.warning" | "color.chart.warning.hovered" | "color.chart.warning.bold" | "color.chart.warning.bold.hovered" | "color.chart.success" | "color.chart.success.hovered" | "color.chart.success.bold" | "color.chart.success.bold.hovered" | "color.chart.discovery" | "color.chart.discovery.hovered" | "color.chart.discovery.bold" | "color.chart.discovery.bold.hovered" | "color.chart.information" | "color.chart.information.hovered" | "color.chart.information.bold" | "color.chart.information.bold.hovered" | "elevation.surface" | "elevation.surface.hovered" | "elevation.surface.pressed" | "elevation.surface.overlay" | "elevation.surface.overlay.hovered" | "elevation.surface.overlay.pressed" | "elevation.surface.raised" | "elevation.surface.raised.hovered" | "elevation.surface.raised.pressed" | "elevation.surface.sunken" | "elevation.shadow.overflow" | "elevation.shadow.overflow.perimeter" | "elevation.shadow.overflow.spread" | "elevation.shadow.overlay" | "elevation.shadow.raised" | "opacity.disabled" | "opacity.loading" | "utility.UNSAFE.textTransformUppercase" | "utility.UNSAFE.transparent" | "utility.elevation.surface.current" | "border.radius.050" | "border.radius" | "border.radius.100" | "border.radius.200" | "border.radius.300" | "border.radius.400" | "border.radius.circle" | "border.width" | "border.width.0" | "border.width.indicator" | "border.width.outline" | "space.0" | "space.025" | "space.050" | "space.075" | "space.100" | "space.150" | "space.200" | "space.250" | "space.300" | "space.400" | "space.500" | "space.600" | "space.800" | "space.1000" | "space.negative.025" | "space.negative.050" | "space.negative.075" | "space.negative.100" | "space.negative.150" | "space.negative.200" | "space.negative.250" | "space.negative.300" | "space.negative.400" | "font.heading.xxlarge" | "font.heading.xlarge" | "font.heading.large" | "font.heading.medium" | "font.heading.small" | "font.heading.xsmall" | "font.heading.xxsmall" | "font.body.large" | "font.body" | "font.body.small" | "font.body.UNSAFE_small" | "font.code" | "font.weight.regular" | "font.weight.medium" | "font.weight.semibold" | "font.weight.bold" | "font.family.heading" | "font.family.body" | "font.family.code" | "font.family.brand.heading" | "font.family.brand.body">(token: T, fallback?: string) => Promise<void>;

package/dist/types-ts4.5/artifacts/themes/atlassian-typography-modernized.d.ts

@@ -1,7 +1,7 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::38b6ba79bdb23bd72bf5db3990d1bfb2>>
+ * @codegen <<SignedSource::04ce6f89b744c2a0ec7cf592807e1ba2>>
  * @codegenCommand yarn build tokens
  */
-declare const _default: "\nhtml[data-theme~=\"typography:typography-modernized\"] {\n  --ds-UNSAFE-textTransformUppercase: uppercase;\n  --ds-font-heading-xxlarge: normal 700 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xlarge: normal 700 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-large: normal 700 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-medium: normal 700 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-small: normal 700 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xsmall: normal 700 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xxsmall: normal 700 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 700;\n  --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";
+declare const _default: "\nhtml[data-theme~=\"typography:typography-modernized\"] {\n  --ds-UNSAFE-textTransformUppercase: uppercase;\n  --ds-font-heading-xxlarge: normal 653 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xlarge: normal 653 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-large: normal 653 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-medium: normal 653 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-small: normal 653 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xsmall: normal 653 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-heading-xxsmall: normal 653 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-weight-regular: 400;\n  --ds-font-weight-medium: 500;\n  --ds-font-weight-semibold: 600;\n  --ds-font-weight-bold: 653;\n  --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n  --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n  --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";
 export default _default;

package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-typography-modernized.d.ts

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::2e613448665c48489ceb1abb4eefd550>>
+ * @codegen <<SignedSource::355fb0bf4ef3f45e232f8637a1fa195f>>
  * @codegenCommand yarn build tokens
  */
 declare const tokens: ({

package/dist/types-ts4.5/get-token-analytics.d.ts

@@ -0,0 +1,11 @@
+declare global {
+    interface Window {
+        analyticsWebClient?: any;
+    }
+}
+/**
+ * Records a token call event to the analytics service. This is used to track which tokens are being used at runtime as they should be substituted by the values by @atlaskit/tokens/babel-plugin at build time.
+ * @param token - The token that was called.
+ * @param fallback - The fallback value that was used.
+ */
+export declare const recordTokenCall: <T extends "color.text" | "color.text.accent.lime" | "color.text.accent.lime.bolder" | "color.text.accent.red" | "color.text.accent.red.bolder" | "color.text.accent.orange" | "color.text.accent.orange.bolder" | "color.text.accent.yellow" | "color.text.accent.yellow.bolder" | "color.text.accent.green" | "color.text.accent.green.bolder" | "color.text.accent.teal" | "color.text.accent.teal.bolder" | "color.text.accent.blue" | "color.text.accent.blue.bolder" | "color.text.accent.purple" | "color.text.accent.purple.bolder" | "color.text.accent.magenta" | "color.text.accent.magenta.bolder" | "color.text.accent.gray" | "color.text.accent.gray.bolder" | "color.text.disabled" | "color.text.inverse" | "color.text.selected" | "color.text.brand" | "color.text.danger" | "color.text.warning" | "color.text.warning.inverse" | "color.text.success" | "color.text.discovery" | "color.text.information" | "color.text.subtlest" | "color.text.subtle" | "color.link" | "color.link.pressed" | "color.link.visited" | "color.link.visited.pressed" | "color.icon" | "color.icon.accent.lime" | "color.icon.accent.red" | "color.icon.accent.orange" | "color.icon.accent.yellow" | "color.icon.accent.green" | "color.icon.accent.teal" | "color.icon.accent.blue" | "color.icon.accent.purple" | "color.icon.accent.magenta" | "color.icon.accent.gray" | "color.icon.disabled" | "color.icon.inverse" | "color.icon.selected" | "color.icon.brand" | "color.icon.danger" | "color.icon.warning" | "color.icon.warning.inverse" | "color.icon.success" | "color.icon.discovery" | "color.icon.information" | "color.icon.subtlest" | "color.icon.subtle" | "color.border" | "color.border.accent.lime" | "color.border.accent.red" | "color.border.accent.orange" | "color.border.accent.yellow" | "color.border.accent.green" | "color.border.accent.teal" | "color.border.accent.blue" | "color.border.accent.purple" | "color.border.accent.magenta" | "color.border.accent.gray" | "color.border.disabled" | "color.border.focused" | "color.border.input" | "color.border.inverse" | "color.border.selected" | "color.border.brand" | "color.border.danger" | "color.border.warning" | "color.border.success" | "color.border.discovery" | "color.border.information" | "color.border.bold" | "color.background.accent.lime.subtlest" | "color.background.accent.lime.subtlest.hovered" | "color.background.accent.lime.subtlest.pressed" | "color.background.accent.lime.subtler" | "color.background.accent.lime.subtler.hovered" | "color.background.accent.lime.subtler.pressed" | "color.background.accent.lime.subtle" | "color.background.accent.lime.subtle.hovered" | "color.background.accent.lime.subtle.pressed" | "color.background.accent.lime.bolder" | "color.background.accent.lime.bolder.hovered" | "color.background.accent.lime.bolder.pressed" | "color.background.accent.red.subtlest" | "color.background.accent.red.subtlest.hovered" | "color.background.accent.red.subtlest.pressed" | "color.background.accent.red.subtler" | "color.background.accent.red.subtler.hovered" | "color.background.accent.red.subtler.pressed" | "color.background.accent.red.subtle" | "color.background.accent.red.subtle.hovered" | "color.background.accent.red.subtle.pressed" | "color.background.accent.red.bolder" | "color.background.accent.red.bolder.hovered" | "color.background.accent.red.bolder.pressed" | "color.background.accent.orange.subtlest" | "color.background.accent.orange.subtlest.hovered" | "color.background.accent.orange.subtlest.pressed" | "color.background.accent.orange.subtler" | "color.background.accent.orange.subtler.hovered" | "color.background.accent.orange.subtler.pressed" | "color.background.accent.orange.subtle" | "color.background.accent.orange.subtle.hovered" | "color.background.accent.orange.subtle.pressed" | "color.background.accent.orange.bolder" | "color.background.accent.orange.bolder.hovered" | "color.background.accent.orange.bolder.pressed" | "color.background.accent.yellow.subtlest" | "color.background.accent.yellow.subtlest.hovered" | "color.background.accent.yellow.subtlest.pressed" | "color.background.accent.yellow.subtler" | "color.background.accent.yellow.subtler.hovered" | "color.background.accent.yellow.subtler.pressed" | "color.background.accent.yellow.subtle" | "color.background.accent.yellow.subtle.hovered" | "color.background.accent.yellow.subtle.pressed" | "color.background.accent.yellow.bolder" | "color.background.accent.yellow.bolder.hovered" | "color.background.accent.yellow.bolder.pressed" | "color.background.accent.green.subtlest" | "color.background.accent.green.subtlest.hovered" | "color.background.accent.green.subtlest.pressed" | "color.background.accent.green.subtler" | "color.background.accent.green.subtler.hovered" | "color.background.accent.green.subtler.pressed" | "color.background.accent.green.subtle" | "color.background.accent.green.subtle.hovered" | "color.background.accent.green.subtle.pressed" | "color.background.accent.green.bolder" | "color.background.accent.green.bolder.hovered" | "color.background.accent.green.bolder.pressed" | "color.background.accent.teal.subtlest" | "color.background.accent.teal.subtlest.hovered" | "color.background.accent.teal.subtlest.pressed" | "color.background.accent.teal.subtler" | "color.background.accent.teal.subtler.hovered" | "color.background.accent.teal.subtler.pressed" | "color.background.accent.teal.subtle" | "color.background.accent.teal.subtle.hovered" | "color.background.accent.teal.subtle.pressed" | "color.background.accent.teal.bolder" | "color.background.accent.teal.bolder.hovered" | "color.background.accent.teal.bolder.pressed" | "color.background.accent.blue.subtlest" | "color.background.accent.blue.subtlest.hovered" | "color.background.accent.blue.subtlest.pressed" | "color.background.accent.blue.subtler" | "color.background.accent.blue.subtler.hovered" | "color.background.accent.blue.subtler.pressed" | "color.background.accent.blue.subtle" | "color.background.accent.blue.subtle.hovered" | "color.background.accent.blue.subtle.pressed" | "color.background.accent.blue.bolder" | "color.background.accent.blue.bolder.hovered" | "color.background.accent.blue.bolder.pressed" | "color.background.accent.purple.subtlest" | "color.background.accent.purple.subtlest.hovered" | "color.background.accent.purple.subtlest.pressed" | "color.background.accent.purple.subtler" | "color.background.accent.purple.subtler.hovered" | "color.background.accent.purple.subtler.pressed" | "color.background.accent.purple.subtle" | "color.background.accent.purple.subtle.hovered" | "color.background.accent.purple.subtle.pressed" | "color.background.accent.purple.bolder" | "color.background.accent.purple.bolder.hovered" | "color.background.accent.purple.bolder.pressed" | "color.background.accent.magenta.subtlest" | "color.background.accent.magenta.subtlest.hovered" | "color.background.accent.magenta.subtlest.pressed" | "color.background.accent.magenta.subtler" | "color.background.accent.magenta.subtler.hovered" | "color.background.accent.magenta.subtler.pressed" | "color.background.accent.magenta.subtle" | "color.background.accent.magenta.subtle.hovered" | "color.background.accent.magenta.subtle.pressed" | "color.background.accent.magenta.bolder" | "color.background.accent.magenta.bolder.hovered" | "color.background.accent.magenta.bolder.pressed" | "color.background.accent.gray.subtlest" | "color.background.accent.gray.subtlest.hovered" | "color.background.accent.gray.subtlest.pressed" | "color.background.accent.gray.subtler" | "color.background.accent.gray.subtler.hovered" | "color.background.accent.gray.subtler.pressed" | "color.background.accent.gray.subtle" | "color.background.accent.gray.subtle.hovered" | "color.background.accent.gray.subtle.pressed" | "color.background.accent.gray.bolder" | "color.background.accent.gray.bolder.hovered" | "color.background.accent.gray.bolder.pressed" | "color.background.disabled" | "color.background.input" | "color.background.input.hovered" | "color.background.input.pressed" | "color.background.inverse.subtle" | "color.background.inverse.subtle.hovered" | "color.background.inverse.subtle.pressed" | "color.background.neutral" | "color.background.neutral.hovered" | "color.background.neutral.pressed" | "color.background.neutral.subtle" | "color.background.neutral.subtle.hovered" | "color.background.neutral.subtle.pressed" | "color.background.neutral.bold" | "color.background.neutral.bold.hovered" | "color.background.neutral.bold.pressed" | "color.background.selected" | "color.background.selected.hovered" | "color.background.selected.pressed" | "color.background.selected.bold" | "color.background.selected.bold.hovered" | "color.background.selected.bold.pressed" | "color.background.brand.subtlest" | "color.background.brand.subtlest.hovered" | "color.background.brand.subtlest.pressed" | "color.background.brand.bold" | "color.background.brand.bold.hovered" | "color.background.brand.bold.pressed" | "color.background.brand.boldest" | "color.background.brand.boldest.hovered" | "color.background.brand.boldest.pressed" | "color.background.danger" | "color.background.danger.hovered" | "color.background.danger.pressed" | "color.background.danger.bold" | "color.background.danger.bold.hovered" | "color.background.danger.bold.pressed" | "color.background.warning" | "color.background.warning.hovered" | "color.background.warning.pressed" | "color.background.warning.bold" | "color.background.warning.bold.hovered" | "color.background.warning.bold.pressed" | "color.background.success" | "color.background.success.hovered" | "color.background.success.pressed" | "color.background.success.bold" | "color.background.success.bold.hovered" | "color.background.success.bold.pressed" | "color.background.discovery" | "color.background.discovery.hovered" | "color.background.discovery.pressed" | "color.background.discovery.bold" | "color.background.discovery.bold.hovered" | "color.background.discovery.bold.pressed" | "color.background.information" | "color.background.information.hovered" | "color.background.information.pressed" | "color.background.information.bold" | "color.background.information.bold.hovered" | "color.background.information.bold.pressed" | "color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "color.interaction.hovered" | "color.interaction.pressed" | "color.skeleton" | "color.skeleton.subtle" | "color.chart.categorical.1" | "color.chart.categorical.1.hovered" | "color.chart.categorical.2" | "color.chart.categorical.2.hovered" | "color.chart.categorical.3" | "color.chart.categorical.3.hovered" | "color.chart.categorical.4" | "color.chart.categorical.4.hovered" | "color.chart.categorical.5" | "color.chart.categorical.5.hovered" | "color.chart.categorical.6" | "color.chart.categorical.6.hovered" | "color.chart.categorical.7" | "color.chart.categorical.7.hovered" | "color.chart.categorical.8" | "color.chart.categorical.8.hovered" | "color.chart.lime.bold" | "color.chart.lime.bold.hovered" | "color.chart.lime.bolder" | "color.chart.lime.bolder.hovered" | "color.chart.lime.boldest" | "color.chart.lime.boldest.hovered" | "color.chart.neutral" | "color.chart.neutral.hovered" | "color.chart.red.bold" | "color.chart.red.bold.hovered" | "color.chart.red.bolder" | "color.chart.red.bolder.hovered" | "color.chart.red.boldest" | "color.chart.red.boldest.hovered" | "color.chart.orange.bold" | "color.chart.orange.bold.hovered" | "color.chart.orange.bolder" | "color.chart.orange.bolder.hovered" | "color.chart.orange.boldest" | "color.chart.orange.boldest.hovered" | "color.chart.yellow.bold" | "color.chart.yellow.bold.hovered" | "color.chart.yellow.bolder" | "color.chart.yellow.bolder.hovered" | "color.chart.yellow.boldest" | "color.chart.yellow.boldest.hovered" | "color.chart.green.bold" | "color.chart.green.bold.hovered" | "color.chart.green.bolder" | "color.chart.green.bolder.hovered" | "color.chart.green.boldest" | "color.chart.green.boldest.hovered" | "color.chart.teal.bold" | "color.chart.teal.bold.hovered" | "color.chart.teal.bolder" | "color.chart.teal.bolder.hovered" | "color.chart.teal.boldest" | "color.chart.teal.boldest.hovered" | "color.chart.blue.bold" | "color.chart.blue.bold.hovered" | "color.chart.blue.bolder" | "color.chart.blue.bolder.hovered" | "color.chart.blue.boldest" | "color.chart.blue.boldest.hovered" | "color.chart.purple.bold" | "color.chart.purple.bold.hovered" | "color.chart.purple.bolder" | "color.chart.purple.bolder.hovered" | "color.chart.purple.boldest" | "color.chart.purple.boldest.hovered" | "color.chart.magenta.bold" | "color.chart.magenta.bold.hovered" | "color.chart.magenta.bolder" | "color.chart.magenta.bolder.hovered" | "color.chart.magenta.boldest" | "color.chart.magenta.boldest.hovered" | "color.chart.gray.bold" | "color.chart.gray.bold.hovered" | "color.chart.gray.bolder" | "color.chart.gray.bolder.hovered" | "color.chart.gray.boldest" | "color.chart.gray.boldest.hovered" | "color.chart.brand" | "color.chart.brand.hovered" | "color.chart.danger" | "color.chart.danger.hovered" | "color.chart.danger.bold" | "color.chart.danger.bold.hovered" | "color.chart.warning" | "color.chart.warning.hovered" | "color.chart.warning.bold" | "color.chart.warning.bold.hovered" | "color.chart.success" | "color.chart.success.hovered" | "color.chart.success.bold" | "color.chart.success.bold.hovered" | "color.chart.discovery" | "color.chart.discovery.hovered" | "color.chart.discovery.bold" | "color.chart.discovery.bold.hovered" | "color.chart.information" | "color.chart.information.hovered" | "color.chart.information.bold" | "color.chart.information.bold.hovered" | "elevation.surface" | "elevation.surface.hovered" | "elevation.surface.pressed" | "elevation.surface.overlay" | "elevation.surface.overlay.hovered" | "elevation.surface.overlay.pressed" | "elevation.surface.raised" | "elevation.surface.raised.hovered" | "elevation.surface.raised.pressed" | "elevation.surface.sunken" | "elevation.shadow.overflow" | "elevation.shadow.overflow.perimeter" | "elevation.shadow.overflow.spread" | "elevation.shadow.overlay" | "elevation.shadow.raised" | "opacity.disabled" | "opacity.loading" | "utility.UNSAFE.textTransformUppercase" | "utility.UNSAFE.transparent" | "utility.elevation.surface.current" | "border.radius.050" | "border.radius" | "border.radius.100" | "border.radius.200" | "border.radius.300" | "border.radius.400" | "border.radius.circle" | "border.width" | "border.width.0" | "border.width.indicator" | "border.width.outline" | "space.0" | "space.025" | "space.050" | "space.075" | "space.100" | "space.150" | "space.200" | "space.250" | "space.300" | "space.400" | "space.500" | "space.600" | "space.800" | "space.1000" | "space.negative.025" | "space.negative.050" | "space.negative.075" | "space.negative.100" | "space.negative.150" | "space.negative.200" | "space.negative.250" | "space.negative.300" | "space.negative.400" | "font.heading.xxlarge" | "font.heading.xlarge" | "font.heading.large" | "font.heading.medium" | "font.heading.small" | "font.heading.xsmall" | "font.heading.xxsmall" | "font.body.large" | "font.body" | "font.body.small" | "font.body.UNSAFE_small" | "font.code" | "font.weight.regular" | "font.weight.medium" | "font.weight.semibold" | "font.weight.bold" | "font.family.heading" | "font.family.body" | "font.family.code" | "font.family.brand.heading" | "font.family.brand.body">(token: T, fallback?: string) => Promise<void>;

package/figma/atlassian-typography-modernized.json

@@ -35,7 +35,7 @@
         "introduced": "0.10.33",
         "description": "Use sparingly for emphasising text, such as in a lozenge."
       },
-      "value": "700"
+      "value": "653"
     },
     "Typography modernized/font.family.heading": {
       "attributes": {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/tokens",
-	"version": "3.1.0",
+	"version": "3.3.0",
 	"description": "Design tokens are the single source of truth to name and store design decisions.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -26,12 +26,12 @@
 	},
 	"scripts": {
 		"prebuilt": "yes | cp -R $(npx repo-root)/packages/design-system/tokens/dist/cjs/* $(npx repo-root)/packages/design-system/tokens/prebuilt/",
-		"ak-postbuild": "yarn prebuilt && (cd $(npx repo-root) && yarn build @atlassian/codegen -d cjs,esm,es2019) && yarn workspace @atlaskit/tokens codegen-tokens && yarn workspace @atlaskit/tokens check-clean-git",
+		"ak-postbuild": "yarn prebuilt && (cd $(npx repo-root) && yarn build @atlaskit/platform-feature-flags -d cjs,esm,es2019 && yarn build @atlassian/codegen -d cjs,esm,es2019) && yarn workspace @atlaskit/tokens codegen-tokens && yarn workspace @atlaskit/tokens check-clean-git",
 		"check-clean-git": "git diff --exit-code -- packages/design-system/tokens/ || (echo 'tokens are out of date, run yarn build tokens' && false)",
 		"codegen-tokens": "run-ts ./scripts/style-dictionary/build.tsx && cd $(npx repo-root)/packages/design-system/primitives && yarn codegen-styles && cd $(npx repo-root)/packages/design-system/ds-explorations && yarn codegen-styles && cd $(npx repo-root)/packages/design-system/heading && yarn codegen"
 	},
 	"dependencies": {
-		"@atlaskit/ds-lib": "^3.3.0",
+		"@atlaskit/ds-lib": "^3.5.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@babel/traverse": "^7.23.2",
@@ -44,12 +44,12 @@
 	"devDependencies": {
 		"@af/accessibility-testing": "*",
 		"@af/formatting": "*",
-		"@atlaskit/button": "^20.3.0",
-		"@atlaskit/calendar": "^16.2.0",
-		"@atlaskit/checkbox": "^15.2.0",
-		"@atlaskit/radio": "^7.0.0",
-		"@atlaskit/textfield": "^6.7.0",
-		"@atlaskit/tooltip": "^19.0.0",
+		"@atlaskit/button": "^20.4.0",
+		"@atlaskit/calendar": "^16.3.0",
+		"@atlaskit/checkbox": "^15.3.0",
+		"@atlaskit/radio": "^7.2.0",
+		"@atlaskit/textfield": "^6.8.0",
+		"@atlaskit/tooltip": "^19.1.0",
 		"@atlaskit/visual-regression": "*",
 		"@atlassian/codegen": "^0.1.0",
 		"@atlassian/feature-flags-test-utils": "*",
@@ -58,7 +58,7 @@
 		"@emotion/react": "^11.7.1",
 		"@hypermod/utils": "^0.4.2",
 		"@testing-library/dom": "^10.1.0",
-		"@testing-library/react": "^12.1.5",
+		"@testing-library/react": "^13.4.0",
 		"@testing-library/react-hooks": "^8.0.1",
 		"@testing-library/user-event": "^14.4.3",
 		"@types/chrome": "^0.0.171",
@@ -72,7 +72,7 @@
 		"postcss": "^8.4.7",
 		"postcss-less": "^6.0.0",
 		"prettier": "^3.2.5",
-		"react": "^16.8.0",
+		"react": "^18.2.0",
 		"react-use-clipboard": "^1.0.0",
 		"react-window": "^1.8.8",
 		"recharts": "^1.8.5",
@@ -131,6 +131,9 @@
 		"platform-component-visual-refresh": {
 			"type": "boolean"
 		},
+		"platform-token-runtime-call-tracking": {
+			"type": "boolean"
+		},
 		"platform-default-typography-modernized": {
 			"type": "boolean"
 		}