@atlaskit/tokens 1.59.1 → 1.61.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,26 @@
1
1
  # @atlaskit/tokens
2
2
 
3
+ ## 1.61.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#143310](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/143310)
8
+ [`b41f7cad2418e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b41f7cad2418e) -
9
+ Migrated feature flag for increased contrast themes to new provider
10
+
11
+ ## 1.60.0
12
+
13
+ ### Minor Changes
14
+
15
+ - [#138792](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/138792)
16
+ [`59c6812e1be91`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/59c6812e1be91) -
17
+ Update the @atlaskit/css schema to include:
18
+
19
+ - `border` and `font` shorthand token values
20
+ - Background and color `-hovered` and `-pressed` tokens are available in the non-psuedo-states for
21
+ patterns like `<div css={[isHovered && hoveredStyles]} />`
22
+ - Adds more commonly used media queries
23
+
3
24
  ## 1.59.1
4
25
 
5
26
  ### Patch Changes
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.default = void 0;
8
8
  var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
9
9
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
10
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != (0, _typeof2.default)(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
10
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != (0, _typeof2.default)(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
11
11
  /**
12
12
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
13
13
  *
@@ -15,7 +15,7 @@ var _atlassianShape = _interopRequireDefault(require("../artifacts/tokens-raw/at
15
15
  var _atlassianSpacing = _interopRequireDefault(require("../artifacts/tokens-raw/atlassian-spacing"));
16
16
  var _atlassianTypographyAdg = _interopRequireDefault(require("../artifacts/tokens-raw/atlassian-typography-adg3"));
17
17
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
18
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
18
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
19
19
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
20
20
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
21
21
  // Convert raw tokens to key-value pairs { token: value }
@@ -65,15 +65,7 @@ function plugin() {
65
65
  return;
66
66
  }
67
67
  path.traverse({
68
- CallExpression: function (_CallExpression) {
69
- function CallExpression(_x) {
70
- return _CallExpression.apply(this, arguments);
71
- }
72
- CallExpression.toString = function () {
73
- return _CallExpression.toString();
74
- };
75
- return CallExpression;
76
- }(function (path) {
68
+ CallExpression: function CallExpression(path) {
77
69
  var tokenImportScope = getTokenImportScope(path);
78
70
  if (!tokenImportScope) {
79
71
  return;
@@ -127,7 +119,7 @@ function plugin() {
127
119
  replacementNode && path.replaceWith(replacementNode);
128
120
  // @ts-ignore crawl is a valid property
129
121
  tokenImportScope.crawl();
130
- })
122
+ }
131
123
  });
132
124
  },
133
125
  exit: function exit(path) {
@@ -20,7 +20,7 @@ var getSSRAutoScript = function getSSRAutoScript(colorMode, contrastMode) {
20
20
  return undefined;
21
21
  }
22
22
  var setColorMode = colorMode === 'auto' ? "\n try {\n const darkModeMql = window.matchMedia('".concat(_themeLoading.darkModeMediaQuery, "');\n const colorMode = darkModeMql.matches ? 'dark' : 'light';\n document.documentElement.setAttribute('").concat(_constants.COLOR_MODE_ATTRIBUTE, "', colorMode);\n } catch (e) {}") : '';
23
- var setContrastMode = (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.increased-contrast-themes') && contrastMode === 'auto' ? "\n try {\n const contrastModeMql = window.matchMedia('".concat(_themeLoading.moreContrastMediaQuery, "');\n const contrastMode = contrastModeMql.matches ? 'more' : 'no-preference';\n document.documentElement.setAttribute('").concat(_constants.CONTRAST_MODE_ATTRIBUTE, "', contrastMode);\n } catch (e) {}") : '';
23
+ var setContrastMode = contrastMode === 'auto' && (0, _platformFeatureFlags.fg)('platform_increased-contrast-themes') ? "\n try {\n const contrastModeMql = window.matchMedia('".concat(_themeLoading.moreContrastMediaQuery, "');\n const contrastMode = contrastModeMql.matches ? 'more' : 'no-preference';\n document.documentElement.setAttribute('").concat(_constants.CONTRAST_MODE_ATTRIBUTE, "', contrastMode);\n } catch (e) {}") : '';
24
24
  return "(() => {".concat(setColorMode).concat(setContrastMode, "})()");
25
25
  };
26
26
  var _default = exports.default = getSSRAutoScript;
@@ -58,7 +58,7 @@ var getThemeHtmlAttrs = function getThemeHtmlAttrs() {
58
58
  typography: typography
59
59
  });
60
60
  var result = (_result = {}, (0, _defineProperty2.default)(_result, _constants.THEME_DATA_ATTRIBUTE, themeAttribute), (0, _defineProperty2.default)(_result, _constants.COLOR_MODE_ATTRIBUTE, colorMode === 'auto' ? defaultColorMode : colorMode), _result);
61
- if ((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.increased-contrast-themes')) {
61
+ if ((0, _platformFeatureFlags.fg)('platform_increased-contrast-themes')) {
62
62
  result = _objectSpread(_objectSpread({}, result), {}, (0, _defineProperty2.default)({}, _constants.CONTRAST_MODE_ATTRIBUTE, contrastMode === 'auto' ? defaultContrastMode : contrastMode));
63
63
  }
64
64
  if (UNSAFE_themeOptions && (0, _colorUtils.isValidBrandHex)(UNSAFE_themeOptions.brandColor)) {
@@ -15,7 +15,7 @@ var _colorUtils = require("./utils/color-utils");
15
15
  var _getThemePreferences = require("./utils/get-theme-preferences");
16
16
  var _themeLoading = require("./utils/theme-loading");
17
17
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
18
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
18
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
19
19
  /**
20
20
  * Takes an object containing theme preferences, and returns an array of objects for use in applying styles to the document head.
21
21
  * Only supplies the color themes necessary for initial render, based on the current themeState. I.e. if in light mode, dark mode themes are not returned.
@@ -43,7 +43,7 @@ var getThemeStyles = /*#__PURE__*/function () {
43
43
  themePreferences = _themeConfig.themeIdsWithOverrides;
44
44
 
45
45
  // CLEANUP: Remove
46
- if (!(0, _platformFeatureFlags.fg)('platform.design-system-team.increased-contrast-themes')) {
46
+ if (!(0, _platformFeatureFlags.fg)('platform_increased-contrast-themes')) {
47
47
  themePreferences = themePreferences.filter(function (n) {
48
48
  return n !== 'light-increased-contrast' && n !== 'dark-increased-contrast';
49
49
  });
@@ -15,11 +15,11 @@ var _configurePage = _interopRequireDefault(require("./utils/configure-page"));
15
15
  var _customThemeLoadingUtils = require("./utils/custom-theme-loading-utils");
16
16
  var _getThemePreferences = require("./utils/get-theme-preferences");
17
17
  var _themeLoading = require("./utils/theme-loading");
18
- function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
19
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
20
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
18
+ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
19
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
20
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
21
21
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
22
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
22
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
23
23
  /**
24
24
  * Sets the theme globally at runtime. This updates the `data-theme` and `data-color-mode` attributes on your page's <html> tag.
25
25
  *
@@ -80,7 +80,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
80
80
  themeLoader = _args3.length > 1 ? _args3[1] : undefined;
81
81
  // CLEANUP: Remove. This blocks application of increased contrast themes
82
82
  // without the feature flag enabled.
83
- if (!(0, _platformFeatureFlags.fg)('platform.design-system-team.increased-contrast-themes')) {
83
+ if (!(0, _platformFeatureFlags.fg)('platform_increased-contrast-themes')) {
84
84
  if (light === 'light-increased-contrast') {
85
85
  light = 'light';
86
86
  }
@@ -23,7 +23,7 @@ function configurePage(themeState) {
23
23
  } else {
24
24
  _colorModeListeners.default.unbind();
25
25
  }
26
- if ((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.increased-contrast-themes')) {
26
+ if ((0, _platformFeatureFlags.fg)('platform_increased-contrast-themes')) {
27
27
  if (themeState.contrastMode === 'auto') {
28
28
  // Set contrastMode based on the user preference
29
29
  themeState.contrastMode = _contrastModeListeners.default.getContrastMode();
@@ -42,7 +42,7 @@ function configurePage(themeState) {
42
42
  });
43
43
  return function () {
44
44
  _colorModeListeners.default.unbind();
45
- if ((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.increased-contrast-themes')) {
45
+ if ((0, _platformFeatureFlags.fg)('platform_increased-contrast-themes')) {
46
46
  _contrastModeListeners.default.unbind();
47
47
  }
48
48
  };
@@ -19,7 +19,7 @@ var getThemePreferences = exports.getThemePreferences = function getThemePrefere
19
19
  var autoColorModeThemes = [light, dark];
20
20
  var themePreferences = [];
21
21
  if (colorMode === 'auto') {
22
- if (contrastMode !== 'no-preference' && (0, _platformFeatureFlags.fg)('platform.design-system-team.increased-contrast-themes')) {
22
+ if (contrastMode !== 'no-preference' && (0, _platformFeatureFlags.fg)('platform_increased-contrast-themes')) {
23
23
  autoColorModeThemes.forEach(function (normalTheme) {
24
24
  var increasedContrastTheme = (0, _getIncreasedContrastTheme.default)(normalTheme);
25
25
  if (increasedContrastTheme) {
@@ -30,7 +30,7 @@ var getThemePreferences = exports.getThemePreferences = function getThemePrefere
30
30
  themePreferences.push.apply(themePreferences, autoColorModeThemes);
31
31
  } else {
32
32
  themePreferences.push(themeState[colorMode]);
33
- if (contrastMode !== 'no-preference' && (0, _platformFeatureFlags.fg)('platform.design-system-team.increased-contrast-themes')) {
33
+ if (contrastMode !== 'no-preference' && (0, _platformFeatureFlags.fg)('platform_increased-contrast-themes')) {
34
34
  var increasedContrastTheme = (0, _getIncreasedContrastTheme.default)(themeState[colorMode]);
35
35
  if (increasedContrastTheme) {
36
36
  themePreferences.push(increasedContrastTheme);
@@ -24,7 +24,7 @@ exports.xyzFromArgb = xyzFromArgb;
24
24
  exports.yFromLstar = yFromLstar;
25
25
  var mathUtils = _interopRequireWildcard(require("./math-utils"));
26
26
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
27
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
27
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
28
28
  /**
29
29
  * Below lines are copied from @material/material-color-utilities.
30
30
  * Do not modify it.
@@ -11,7 +11,7 @@ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
11
11
  var utils = _interopRequireWildcard(require("./color-utils"));
12
12
  var math = _interopRequireWildcard(require("./math-utils"));
13
13
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
14
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
14
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
15
15
  /**
16
16
  * Below lines are copied from @material/material-color-utilities.
17
17
  * Do not modify it.
@@ -33,7 +33,7 @@ var _class2;
33
33
  * limitations under the License.
34
34
  */
35
35
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
36
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
36
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
37
37
  /**
38
38
  * A color system built using CAM16 hue and chroma, and L* from
39
39
  * L*a*b*.
@@ -1,4 +1,4 @@
1
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
1
+ import { fg } from '@atlaskit/platform-feature-flags';
2
2
  import { COLOR_MODE_ATTRIBUTE, CONTRAST_MODE_ATTRIBUTE } from './constants';
3
3
  import { darkModeMediaQuery, moreContrastMediaQuery } from './utils/theme-loading';
4
4
 
@@ -19,7 +19,7 @@ const getSSRAutoScript = (colorMode, contrastMode) => {
19
19
  const colorMode = darkModeMql.matches ? 'dark' : 'light';
20
20
  document.documentElement.setAttribute('${COLOR_MODE_ATTRIBUTE}', colorMode);
21
21
  } catch (e) {}` : '';
22
- const setContrastMode = getBooleanFF('platform.design-system-team.increased-contrast-themes') && contrastMode === 'auto' ? `\n try {
22
+ const setContrastMode = contrastMode === 'auto' && fg('platform_increased-contrast-themes') ? `\n try {
23
23
  const contrastModeMql = window.matchMedia('${moreContrastMediaQuery}');
24
24
  const contrastMode = contrastModeMql.matches ? 'more' : 'no-preference';
25
25
  document.documentElement.setAttribute('${CONTRAST_MODE_ATTRIBUTE}', contrastMode);
@@ -1,4 +1,4 @@
1
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
1
+ import { fg } from '@atlaskit/platform-feature-flags';
2
2
  import { COLOR_MODE_ATTRIBUTE, CONTRAST_MODE_ATTRIBUTE, CUSTOM_THEME_ATTRIBUTE, THEME_DATA_ATTRIBUTE } from './constants';
3
3
  import { themeStateDefaults } from './theme-config';
4
4
  import { themeObjectToString } from './theme-state-transformer';
@@ -42,7 +42,7 @@ const getThemeHtmlAttrs = ({
42
42
  [THEME_DATA_ATTRIBUTE]: themeAttribute,
43
43
  [COLOR_MODE_ATTRIBUTE]: colorMode === 'auto' ? defaultColorMode : colorMode
44
44
  };
45
- if (getBooleanFF('platform.design-system-team.increased-contrast-themes')) {
45
+ if (fg('platform_increased-contrast-themes')) {
46
46
  result = {
47
47
  ...result,
48
48
  // CLEANUP: Move this to the initial `result` assignment above
@@ -26,7 +26,7 @@ const getThemeStyles = async preferences => {
26
26
  themePreferences = themeIdsWithOverrides;
27
27
 
28
28
  // CLEANUP: Remove
29
- if (!fg('platform.design-system-team.increased-contrast-themes')) {
29
+ if (!fg('platform_increased-contrast-themes')) {
30
30
  themePreferences = themePreferences.filter(n => n !== 'light-increased-contrast' && n !== 'dark-increased-contrast');
31
31
  }
32
32
  themePreferences = themePreferences.filter(n => n !== 'light-brand-refresh' && n !== 'dark-brand-refresh');
@@ -39,7 +39,7 @@ const setGlobalTheme = async ({
39
39
  } = {}, themeLoader) => {
40
40
  // CLEANUP: Remove. This blocks application of increased contrast themes
41
41
  // without the feature flag enabled.
42
- if (!fg('platform.design-system-team.increased-contrast-themes')) {
42
+ if (!fg('platform_increased-contrast-themes')) {
43
43
  if (light === 'light-increased-contrast') {
44
44
  light = 'light';
45
45
  }
@@ -1,4 +1,4 @@
1
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
1
+ import { fg } from '@atlaskit/platform-feature-flags';
2
2
  import getThemeHtmlAttrs from '../get-theme-html-attrs';
3
3
  import ColorModeObserver from './color-mode-listeners';
4
4
  import ContrastModeObserver from './contrast-mode-listeners';
@@ -16,7 +16,7 @@ export default function configurePage(themeState) {
16
16
  } else {
17
17
  ColorModeObserver.unbind();
18
18
  }
19
- if (getBooleanFF('platform.design-system-team.increased-contrast-themes')) {
19
+ if (fg('platform_increased-contrast-themes')) {
20
20
  if (themeState.contrastMode === 'auto') {
21
21
  // Set contrastMode based on the user preference
22
22
  themeState.contrastMode = ContrastModeObserver.getContrastMode();
@@ -32,7 +32,7 @@ export default function configurePage(themeState) {
32
32
  });
33
33
  return () => {
34
34
  ColorModeObserver.unbind();
35
- if (getBooleanFF('platform.design-system-team.increased-contrast-themes')) {
35
+ if (fg('platform_increased-contrast-themes')) {
36
36
  ContrastModeObserver.unbind();
37
37
  }
38
38
  };
@@ -13,7 +13,7 @@ export const getThemePreferences = themeState => {
13
13
  const autoColorModeThemes = [light, dark];
14
14
  const themePreferences = [];
15
15
  if (colorMode === 'auto') {
16
- if (contrastMode !== 'no-preference' && fg('platform.design-system-team.increased-contrast-themes')) {
16
+ if (contrastMode !== 'no-preference' && fg('platform_increased-contrast-themes')) {
17
17
  autoColorModeThemes.forEach(normalTheme => {
18
18
  const increasedContrastTheme = getIncreasedContrastTheme(normalTheme);
19
19
  if (increasedContrastTheme) {
@@ -24,7 +24,7 @@ export const getThemePreferences = themeState => {
24
24
  themePreferences.push(...autoColorModeThemes);
25
25
  } else {
26
26
  themePreferences.push(themeState[colorMode]);
27
- if (contrastMode !== 'no-preference' && fg('platform.design-system-team.increased-contrast-themes')) {
27
+ if (contrastMode !== 'no-preference' && fg('platform_increased-contrast-themes')) {
28
28
  const increasedContrastTheme = getIncreasedContrastTheme(themeState[colorMode]);
29
29
  if (increasedContrastTheme) {
30
30
  themePreferences.push(increasedContrastTheme);
@@ -55,15 +55,7 @@ export default function plugin() {
55
55
  return;
56
56
  }
57
57
  path.traverse({
58
- CallExpression: function (_CallExpression) {
59
- function CallExpression(_x) {
60
- return _CallExpression.apply(this, arguments);
61
- }
62
- CallExpression.toString = function () {
63
- return _CallExpression.toString();
64
- };
65
- return CallExpression;
66
- }(function (path) {
58
+ CallExpression: function CallExpression(path) {
67
59
  var tokenImportScope = getTokenImportScope(path);
68
60
  if (!tokenImportScope) {
69
61
  return;
@@ -117,7 +109,7 @@ export default function plugin() {
117
109
  replacementNode && path.replaceWith(replacementNode);
118
110
  // @ts-ignore crawl is a valid property
119
111
  tokenImportScope.crawl();
120
- })
112
+ }
121
113
  });
122
114
  },
123
115
  exit: function exit(path) {
@@ -1,4 +1,4 @@
1
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
1
+ import { fg } from '@atlaskit/platform-feature-flags';
2
2
  import { COLOR_MODE_ATTRIBUTE, CONTRAST_MODE_ATTRIBUTE } from './constants';
3
3
  import { darkModeMediaQuery, moreContrastMediaQuery } from './utils/theme-loading';
4
4
 
@@ -15,7 +15,7 @@ var getSSRAutoScript = function getSSRAutoScript(colorMode, contrastMode) {
15
15
  return undefined;
16
16
  }
17
17
  var setColorMode = colorMode === 'auto' ? "\n try {\n const darkModeMql = window.matchMedia('".concat(darkModeMediaQuery, "');\n const colorMode = darkModeMql.matches ? 'dark' : 'light';\n document.documentElement.setAttribute('").concat(COLOR_MODE_ATTRIBUTE, "', colorMode);\n } catch (e) {}") : '';
18
- var setContrastMode = getBooleanFF('platform.design-system-team.increased-contrast-themes') && contrastMode === 'auto' ? "\n try {\n const contrastModeMql = window.matchMedia('".concat(moreContrastMediaQuery, "');\n const contrastMode = contrastModeMql.matches ? 'more' : 'no-preference';\n document.documentElement.setAttribute('").concat(CONTRAST_MODE_ATTRIBUTE, "', contrastMode);\n } catch (e) {}") : '';
18
+ var setContrastMode = contrastMode === 'auto' && fg('platform_increased-contrast-themes') ? "\n try {\n const contrastModeMql = window.matchMedia('".concat(moreContrastMediaQuery, "');\n const contrastMode = contrastModeMql.matches ? 'more' : 'no-preference';\n document.documentElement.setAttribute('").concat(CONTRAST_MODE_ATTRIBUTE, "', contrastMode);\n } catch (e) {}") : '';
19
19
  return "(() => {".concat(setColorMode).concat(setContrastMode, "})()");
20
20
  };
21
21
  export default getSSRAutoScript;
@@ -1,7 +1,7 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
3
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
4
+ import { fg } from '@atlaskit/platform-feature-flags';
5
5
  import { COLOR_MODE_ATTRIBUTE, CONTRAST_MODE_ATTRIBUTE, CUSTOM_THEME_ATTRIBUTE, THEME_DATA_ATTRIBUTE } from './constants';
6
6
  import { themeStateDefaults } from './theme-config';
7
7
  import { themeObjectToString } from './theme-state-transformer';
@@ -51,7 +51,7 @@ var getThemeHtmlAttrs = function getThemeHtmlAttrs() {
51
51
  typography: typography
52
52
  });
53
53
  var result = (_result = {}, _defineProperty(_result, THEME_DATA_ATTRIBUTE, themeAttribute), _defineProperty(_result, COLOR_MODE_ATTRIBUTE, colorMode === 'auto' ? defaultColorMode : colorMode), _result);
54
- if (getBooleanFF('platform.design-system-team.increased-contrast-themes')) {
54
+ if (fg('platform_increased-contrast-themes')) {
55
55
  result = _objectSpread(_objectSpread({}, result), {}, _defineProperty({}, CONTRAST_MODE_ATTRIBUTE, contrastMode === 'auto' ? defaultContrastMode : contrastMode));
56
56
  }
57
57
  if (UNSAFE_themeOptions && isValidBrandHex(UNSAFE_themeOptions.brandColor)) {
@@ -33,7 +33,7 @@ var getThemeStyles = /*#__PURE__*/function () {
33
33
  themePreferences = themeIdsWithOverrides;
34
34
 
35
35
  // CLEANUP: Remove
36
- if (!fg('platform.design-system-team.increased-contrast-themes')) {
36
+ if (!fg('platform_increased-contrast-themes')) {
37
37
  themePreferences = themePreferences.filter(function (n) {
38
38
  return n !== 'light-increased-contrast' && n !== 'dark-increased-contrast';
39
39
  });
@@ -1,7 +1,7 @@
1
1
  import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
2
- function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
3
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
2
+ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
3
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
4
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
5
5
  import _regeneratorRuntime from "@babel/runtime/regenerator";
6
6
  import { fg } from '@atlaskit/platform-feature-flags';
7
7
  import { themeStateDefaults } from './theme-config';
@@ -71,7 +71,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
71
71
  themeLoader = _args3.length > 1 ? _args3[1] : undefined;
72
72
  // CLEANUP: Remove. This blocks application of increased contrast themes
73
73
  // without the feature flag enabled.
74
- if (!fg('platform.design-system-team.increased-contrast-themes')) {
74
+ if (!fg('platform_increased-contrast-themes')) {
75
75
  if (light === 'light-increased-contrast') {
76
76
  light = 'light';
77
77
  }
@@ -1,5 +1,5 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
2
+ import { fg } from '@atlaskit/platform-feature-flags';
3
3
  import getThemeHtmlAttrs from '../get-theme-html-attrs';
4
4
  import ColorModeObserver from './color-mode-listeners';
5
5
  import ContrastModeObserver from './contrast-mode-listeners';
@@ -17,7 +17,7 @@ export default function configurePage(themeState) {
17
17
  } else {
18
18
  ColorModeObserver.unbind();
19
19
  }
20
- if (getBooleanFF('platform.design-system-team.increased-contrast-themes')) {
20
+ if (fg('platform_increased-contrast-themes')) {
21
21
  if (themeState.contrastMode === 'auto') {
22
22
  // Set contrastMode based on the user preference
23
23
  themeState.contrastMode = ContrastModeObserver.getContrastMode();
@@ -36,7 +36,7 @@ export default function configurePage(themeState) {
36
36
  });
37
37
  return function () {
38
38
  ColorModeObserver.unbind();
39
- if (getBooleanFF('platform.design-system-team.increased-contrast-themes')) {
39
+ if (fg('platform_increased-contrast-themes')) {
40
40
  ContrastModeObserver.unbind();
41
41
  }
42
42
  };
@@ -12,7 +12,7 @@ export var getThemePreferences = function getThemePreferences(themeState) {
12
12
  var autoColorModeThemes = [light, dark];
13
13
  var themePreferences = [];
14
14
  if (colorMode === 'auto') {
15
- if (contrastMode !== 'no-preference' && fg('platform.design-system-team.increased-contrast-themes')) {
15
+ if (contrastMode !== 'no-preference' && fg('platform_increased-contrast-themes')) {
16
16
  autoColorModeThemes.forEach(function (normalTheme) {
17
17
  var increasedContrastTheme = getIncreasedContrastTheme(normalTheme);
18
18
  if (increasedContrastTheme) {
@@ -23,7 +23,7 @@ export var getThemePreferences = function getThemePreferences(themeState) {
23
23
  themePreferences.push.apply(themePreferences, autoColorModeThemes);
24
24
  } else {
25
25
  themePreferences.push(themeState[colorMode]);
26
- if (contrastMode !== 'no-preference' && fg('platform.design-system-team.increased-contrast-themes')) {
26
+ if (contrastMode !== 'no-preference' && fg('platform_increased-contrast-themes')) {
27
27
  var increasedContrastTheme = getIncreasedContrastTheme(themeState[colorMode]);
28
28
  if (increasedContrastTheme) {
29
29
  themePreferences.push(increasedContrastTheme);
@@ -3,23 +3,25 @@
3
3
  *
4
4
  * Strict design token based typedef representing a subset of safe CSS properties.
5
5
  *
6
- * @codegen <<SignedSource::73ea861e90cff1941e5848336ce46260>>
6
+ * @codegen <<SignedSource::21c2ae52ced4fa9337277f9daca4b814>>
7
7
  * @codegenCommand yarn build tokens
8
8
  */
9
- export type BackgroundColor = 'transparent' | 'currentcolor' | 'var(--ds-background-accent-lime-subtlest)' | 'var(--ds-background-accent-lime-subtler)' | 'var(--ds-background-accent-lime-subtle)' | 'var(--ds-background-accent-lime-bolder)' | 'var(--ds-background-accent-red-subtlest)' | 'var(--ds-background-accent-red-subtler)' | 'var(--ds-background-accent-red-subtle)' | 'var(--ds-background-accent-red-bolder)' | 'var(--ds-background-accent-orange-subtlest)' | 'var(--ds-background-accent-orange-subtler)' | 'var(--ds-background-accent-orange-subtle)' | 'var(--ds-background-accent-orange-bolder)' | 'var(--ds-background-accent-yellow-subtlest)' | 'var(--ds-background-accent-yellow-subtler)' | 'var(--ds-background-accent-yellow-subtle)' | 'var(--ds-background-accent-yellow-bolder)' | 'var(--ds-background-accent-green-subtlest)' | 'var(--ds-background-accent-green-subtler)' | 'var(--ds-background-accent-green-subtle)' | 'var(--ds-background-accent-green-bolder)' | 'var(--ds-background-accent-teal-subtlest)' | 'var(--ds-background-accent-teal-subtler)' | 'var(--ds-background-accent-teal-subtle)' | 'var(--ds-background-accent-teal-bolder)' | 'var(--ds-background-accent-blue-subtlest)' | 'var(--ds-background-accent-blue-subtler)' | 'var(--ds-background-accent-blue-subtle)' | 'var(--ds-background-accent-blue-bolder)' | 'var(--ds-background-accent-purple-subtlest)' | 'var(--ds-background-accent-purple-subtler)' | 'var(--ds-background-accent-purple-subtle)' | 'var(--ds-background-accent-purple-bolder)' | 'var(--ds-background-accent-magenta-subtlest)' | 'var(--ds-background-accent-magenta-subtler)' | 'var(--ds-background-accent-magenta-subtle)' | 'var(--ds-background-accent-magenta-bolder)' | 'var(--ds-background-accent-gray-subtlest)' | 'var(--ds-background-accent-gray-subtler)' | 'var(--ds-background-accent-gray-subtle)' | 'var(--ds-background-accent-gray-bolder)' | 'var(--ds-background-disabled)' | 'var(--ds-background-input)' | 'var(--ds-background-inverse-subtle)' | 'var(--ds-background-neutral)' | 'var(--ds-background-neutral-subtle)' | 'var(--ds-background-neutral-bold)' | 'var(--ds-background-selected)' | 'var(--ds-background-selected-bold)' | 'var(--ds-background-brand-subtlest)' | 'var(--ds-background-brand-bold)' | 'var(--ds-background-brand-boldest)' | 'var(--ds-background-danger)' | 'var(--ds-background-danger-bold)' | 'var(--ds-background-warning)' | 'var(--ds-background-warning-bold)' | 'var(--ds-background-success)' | 'var(--ds-background-success-bold)' | 'var(--ds-background-discovery)' | 'var(--ds-background-discovery-bold)' | 'var(--ds-background-information)' | 'var(--ds-background-information-bold)' | 'var(--ds-skeleton)' | 'var(--ds-skeleton-subtle)' | 'var(--ds-surface)' | 'var(--ds-surface-overlay)' | 'var(--ds-surface-raised)' | 'var(--ds-surface-sunken)' | 'var(--ds-elevation-surface-current)';
10
9
  export type BackgroundColorHovered = 'var(--ds-background-accent-lime-subtlest-hovered)' | 'var(--ds-background-accent-lime-subtler-hovered)' | 'var(--ds-background-accent-lime-subtle-hovered)' | 'var(--ds-background-accent-lime-bolder-hovered)' | 'var(--ds-background-accent-red-subtlest-hovered)' | 'var(--ds-background-accent-red-subtler-hovered)' | 'var(--ds-background-accent-red-subtle-hovered)' | 'var(--ds-background-accent-red-bolder-hovered)' | 'var(--ds-background-accent-orange-subtlest-hovered)' | 'var(--ds-background-accent-orange-subtler-hovered)' | 'var(--ds-background-accent-orange-subtle-hovered)' | 'var(--ds-background-accent-orange-bolder-hovered)' | 'var(--ds-background-accent-yellow-subtlest-hovered)' | 'var(--ds-background-accent-yellow-subtler-hovered)' | 'var(--ds-background-accent-yellow-subtle-hovered)' | 'var(--ds-background-accent-yellow-bolder-hovered)' | 'var(--ds-background-accent-green-subtlest-hovered)' | 'var(--ds-background-accent-green-subtler-hovered)' | 'var(--ds-background-accent-green-subtle-hovered)' | 'var(--ds-background-accent-green-bolder-hovered)' | 'var(--ds-background-accent-teal-subtlest-hovered)' | 'var(--ds-background-accent-teal-subtler-hovered)' | 'var(--ds-background-accent-teal-subtle-hovered)' | 'var(--ds-background-accent-teal-bolder-hovered)' | 'var(--ds-background-accent-blue-subtlest-hovered)' | 'var(--ds-background-accent-blue-subtler-hovered)' | 'var(--ds-background-accent-blue-subtle-hovered)' | 'var(--ds-background-accent-blue-bolder-hovered)' | 'var(--ds-background-accent-purple-subtlest-hovered)' | 'var(--ds-background-accent-purple-subtler-hovered)' | 'var(--ds-background-accent-purple-subtle-hovered)' | 'var(--ds-background-accent-purple-bolder-hovered)' | 'var(--ds-background-accent-magenta-subtlest-hovered)' | 'var(--ds-background-accent-magenta-subtler-hovered)' | 'var(--ds-background-accent-magenta-subtle-hovered)' | 'var(--ds-background-accent-magenta-bolder-hovered)' | 'var(--ds-background-accent-gray-subtlest-hovered)' | 'var(--ds-background-accent-gray-subtler-hovered)' | 'var(--ds-background-accent-gray-subtle-hovered)' | 'var(--ds-background-accent-gray-bolder-hovered)' | 'var(--ds-background-input-hovered)' | 'var(--ds-background-inverse-subtle-hovered)' | 'var(--ds-background-neutral-hovered)' | 'var(--ds-background-neutral-subtle-hovered)' | 'var(--ds-background-neutral-bold-hovered)' | 'var(--ds-background-selected-hovered)' | 'var(--ds-background-selected-bold-hovered)' | 'var(--ds-background-brand-subtlest-hovered)' | 'var(--ds-background-brand-bold-hovered)' | 'var(--ds-background-brand-boldest-hovered)' | 'var(--ds-background-danger-hovered)' | 'var(--ds-background-danger-bold-hovered)' | 'var(--ds-background-warning-hovered)' | 'var(--ds-background-warning-bold-hovered)' | 'var(--ds-background-success-hovered)' | 'var(--ds-background-success-bold-hovered)' | 'var(--ds-background-discovery-hovered)' | 'var(--ds-background-discovery-bold-hovered)' | 'var(--ds-background-information-hovered)' | 'var(--ds-background-information-bold-hovered)' | 'var(--ds-surface-hovered)' | 'var(--ds-surface-overlay-hovered)' | 'var(--ds-surface-raised-hovered)';
11
10
  export type BackgroundColorPressed = 'var(--ds-background-accent-lime-subtlest-pressed)' | 'var(--ds-background-accent-lime-subtler-pressed)' | 'var(--ds-background-accent-lime-subtle-pressed)' | 'var(--ds-background-accent-lime-bolder-pressed)' | 'var(--ds-background-accent-red-subtlest-pressed)' | 'var(--ds-background-accent-red-subtler-pressed)' | 'var(--ds-background-accent-red-subtle-pressed)' | 'var(--ds-background-accent-red-bolder-pressed)' | 'var(--ds-background-accent-orange-subtlest-pressed)' | 'var(--ds-background-accent-orange-subtler-pressed)' | 'var(--ds-background-accent-orange-subtle-pressed)' | 'var(--ds-background-accent-orange-bolder-pressed)' | 'var(--ds-background-accent-yellow-subtlest-pressed)' | 'var(--ds-background-accent-yellow-subtler-pressed)' | 'var(--ds-background-accent-yellow-subtle-pressed)' | 'var(--ds-background-accent-yellow-bolder-pressed)' | 'var(--ds-background-accent-green-subtlest-pressed)' | 'var(--ds-background-accent-green-subtler-pressed)' | 'var(--ds-background-accent-green-subtle-pressed)' | 'var(--ds-background-accent-green-bolder-pressed)' | 'var(--ds-background-accent-teal-subtlest-pressed)' | 'var(--ds-background-accent-teal-subtler-pressed)' | 'var(--ds-background-accent-teal-subtle-pressed)' | 'var(--ds-background-accent-teal-bolder-pressed)' | 'var(--ds-background-accent-blue-subtlest-pressed)' | 'var(--ds-background-accent-blue-subtler-pressed)' | 'var(--ds-background-accent-blue-subtle-pressed)' | 'var(--ds-background-accent-blue-bolder-pressed)' | 'var(--ds-background-accent-purple-subtlest-pressed)' | 'var(--ds-background-accent-purple-subtler-pressed)' | 'var(--ds-background-accent-purple-subtle-pressed)' | 'var(--ds-background-accent-purple-bolder-pressed)' | 'var(--ds-background-accent-magenta-subtlest-pressed)' | 'var(--ds-background-accent-magenta-subtler-pressed)' | 'var(--ds-background-accent-magenta-subtle-pressed)' | 'var(--ds-background-accent-magenta-bolder-pressed)' | 'var(--ds-background-accent-gray-subtlest-pressed)' | 'var(--ds-background-accent-gray-subtler-pressed)' | 'var(--ds-background-accent-gray-subtle-pressed)' | 'var(--ds-background-accent-gray-bolder-pressed)' | 'var(--ds-background-input-pressed)' | 'var(--ds-background-inverse-subtle-pressed)' | 'var(--ds-background-neutral-pressed)' | 'var(--ds-background-neutral-subtle-pressed)' | 'var(--ds-background-neutral-bold-pressed)' | 'var(--ds-background-selected-pressed)' | 'var(--ds-background-selected-bold-pressed)' | 'var(--ds-background-brand-subtlest-pressed)' | 'var(--ds-background-brand-bold-pressed)' | 'var(--ds-background-brand-boldest-pressed)' | 'var(--ds-background-danger-pressed)' | 'var(--ds-background-danger-bold-pressed)' | 'var(--ds-background-warning-pressed)' | 'var(--ds-background-warning-bold-pressed)' | 'var(--ds-background-success-pressed)' | 'var(--ds-background-success-bold-pressed)' | 'var(--ds-background-discovery-pressed)' | 'var(--ds-background-discovery-bold-pressed)' | 'var(--ds-background-information-pressed)' | 'var(--ds-background-information-bold-pressed)' | 'var(--ds-surface-pressed)' | 'var(--ds-surface-overlay-pressed)' | 'var(--ds-surface-raised-pressed)';
12
- export type IconColor = 'var(--ds-link)' | 'var(--ds-link-visited)' | 'var(--ds-icon)' | 'var(--ds-icon-accent-lime)' | 'var(--ds-icon-accent-red)' | 'var(--ds-icon-accent-orange)' | 'var(--ds-icon-accent-yellow)' | 'var(--ds-icon-accent-green)' | 'var(--ds-icon-accent-teal)' | 'var(--ds-icon-accent-blue)' | 'var(--ds-icon-accent-purple)' | 'var(--ds-icon-accent-magenta)' | 'var(--ds-icon-accent-gray)' | 'var(--ds-icon-disabled)' | 'var(--ds-icon-inverse)' | 'var(--ds-icon-selected)' | 'var(--ds-icon-brand)' | 'var(--ds-icon-danger)' | 'var(--ds-icon-warning)' | 'var(--ds-icon-warning-inverse)' | 'var(--ds-icon-success)' | 'var(--ds-icon-discovery)' | 'var(--ds-icon-information)' | 'var(--ds-icon-subtlest)' | 'var(--ds-icon-subtle)';
11
+ export type BackgroundColor = 'transparent' | 'currentcolor' | BackgroundColorHovered | BackgroundColorPressed | 'var(--ds-background-accent-lime-subtlest)' | 'var(--ds-background-accent-lime-subtler)' | 'var(--ds-background-accent-lime-subtle)' | 'var(--ds-background-accent-lime-bolder)' | 'var(--ds-background-accent-red-subtlest)' | 'var(--ds-background-accent-red-subtler)' | 'var(--ds-background-accent-red-subtle)' | 'var(--ds-background-accent-red-bolder)' | 'var(--ds-background-accent-orange-subtlest)' | 'var(--ds-background-accent-orange-subtler)' | 'var(--ds-background-accent-orange-subtle)' | 'var(--ds-background-accent-orange-bolder)' | 'var(--ds-background-accent-yellow-subtlest)' | 'var(--ds-background-accent-yellow-subtler)' | 'var(--ds-background-accent-yellow-subtle)' | 'var(--ds-background-accent-yellow-bolder)' | 'var(--ds-background-accent-green-subtlest)' | 'var(--ds-background-accent-green-subtler)' | 'var(--ds-background-accent-green-subtle)' | 'var(--ds-background-accent-green-bolder)' | 'var(--ds-background-accent-teal-subtlest)' | 'var(--ds-background-accent-teal-subtler)' | 'var(--ds-background-accent-teal-subtle)' | 'var(--ds-background-accent-teal-bolder)' | 'var(--ds-background-accent-blue-subtlest)' | 'var(--ds-background-accent-blue-subtler)' | 'var(--ds-background-accent-blue-subtle)' | 'var(--ds-background-accent-blue-bolder)' | 'var(--ds-background-accent-purple-subtlest)' | 'var(--ds-background-accent-purple-subtler)' | 'var(--ds-background-accent-purple-subtle)' | 'var(--ds-background-accent-purple-bolder)' | 'var(--ds-background-accent-magenta-subtlest)' | 'var(--ds-background-accent-magenta-subtler)' | 'var(--ds-background-accent-magenta-subtle)' | 'var(--ds-background-accent-magenta-bolder)' | 'var(--ds-background-accent-gray-subtlest)' | 'var(--ds-background-accent-gray-subtler)' | 'var(--ds-background-accent-gray-subtle)' | 'var(--ds-background-accent-gray-bolder)' | 'var(--ds-background-disabled)' | 'var(--ds-background-input)' | 'var(--ds-background-inverse-subtle)' | 'var(--ds-background-neutral)' | 'var(--ds-background-neutral-subtle)' | 'var(--ds-background-neutral-bold)' | 'var(--ds-background-selected)' | 'var(--ds-background-selected-bold)' | 'var(--ds-background-brand-subtlest)' | 'var(--ds-background-brand-bold)' | 'var(--ds-background-brand-boldest)' | 'var(--ds-background-danger)' | 'var(--ds-background-danger-bold)' | 'var(--ds-background-warning)' | 'var(--ds-background-warning-bold)' | 'var(--ds-background-success)' | 'var(--ds-background-success-bold)' | 'var(--ds-background-discovery)' | 'var(--ds-background-discovery-bold)' | 'var(--ds-background-information)' | 'var(--ds-background-information-bold)' | 'var(--ds-skeleton)' | 'var(--ds-skeleton-subtle)' | 'var(--ds-surface)' | 'var(--ds-surface-overlay)' | 'var(--ds-surface-raised)' | 'var(--ds-surface-sunken)' | 'var(--ds-elevation-surface-current)';
12
+ export type FontShorthand = 'var(--ds-font-heading-xxlarge)' | 'var(--ds-font-heading-xlarge)' | 'var(--ds-font-heading-large)' | 'var(--ds-font-heading-medium)' | 'var(--ds-font-heading-small)' | 'var(--ds-font-heading-xsmall)' | 'var(--ds-font-heading-xxsmall)' | 'var(--ds-font-body-large)' | 'var(--ds-font-body)' | 'var(--ds-font-body-small)' | 'var(--ds-font-body-UNSAFE_small)' | 'var(--ds-font-code)';
13
13
  export type IconColorPressed = 'var(--ds-link-pressed)' | 'var(--ds-link-visited-pressed)';
14
- export type BorderColor = 'var(--ds-border)' | 'var(--ds-border-accent-lime)' | 'var(--ds-border-accent-red)' | 'var(--ds-border-accent-orange)' | 'var(--ds-border-accent-yellow)' | 'var(--ds-border-accent-green)' | 'var(--ds-border-accent-teal)' | 'var(--ds-border-accent-blue)' | 'var(--ds-border-accent-purple)' | 'var(--ds-border-accent-magenta)' | 'var(--ds-border-accent-gray)' | 'var(--ds-border-disabled)' | 'var(--ds-border-focused)' | 'var(--ds-border-input)' | 'var(--ds-border-inverse)' | 'var(--ds-border-selected)' | 'var(--ds-border-brand)' | 'var(--ds-border-danger)' | 'var(--ds-border-warning)' | 'var(--ds-border-success)' | 'var(--ds-border-discovery)' | 'var(--ds-border-information)' | 'var(--ds-border-bold)';
15
- export type BorderWidth = 'var(--ds-border-width)' | 'var(--ds-border-width-indicator)' | 'var(--ds-border-width-outline)';
14
+ export type IconColor = IconColorPressed | 'var(--ds-link)' | 'var(--ds-link-visited)' | 'var(--ds-icon)' | 'var(--ds-icon-accent-lime)' | 'var(--ds-icon-accent-red)' | 'var(--ds-icon-accent-orange)' | 'var(--ds-icon-accent-yellow)' | 'var(--ds-icon-accent-green)' | 'var(--ds-icon-accent-teal)' | 'var(--ds-icon-accent-blue)' | 'var(--ds-icon-accent-purple)' | 'var(--ds-icon-accent-magenta)' | 'var(--ds-icon-accent-gray)' | 'var(--ds-icon-disabled)' | 'var(--ds-icon-inverse)' | 'var(--ds-icon-selected)' | 'var(--ds-icon-brand)' | 'var(--ds-icon-danger)' | 'var(--ds-icon-warning)' | 'var(--ds-icon-warning-inverse)' | 'var(--ds-icon-success)' | 'var(--ds-icon-discovery)' | 'var(--ds-icon-information)' | 'var(--ds-icon-subtlest)' | 'var(--ds-icon-subtle)';
15
+ export type BorderColor = 'transparent' | 'var(--ds-border)' | 'var(--ds-border-accent-lime)' | 'var(--ds-border-accent-red)' | 'var(--ds-border-accent-orange)' | 'var(--ds-border-accent-yellow)' | 'var(--ds-border-accent-green)' | 'var(--ds-border-accent-teal)' | 'var(--ds-border-accent-blue)' | 'var(--ds-border-accent-purple)' | 'var(--ds-border-accent-magenta)' | 'var(--ds-border-accent-gray)' | 'var(--ds-border-disabled)' | 'var(--ds-border-focused)' | 'var(--ds-border-input)' | 'var(--ds-border-inverse)' | 'var(--ds-border-selected)' | 'var(--ds-border-brand)' | 'var(--ds-border-danger)' | 'var(--ds-border-warning)' | 'var(--ds-border-success)' | 'var(--ds-border-discovery)' | 'var(--ds-border-information)' | 'var(--ds-border-bold)';
16
16
  export type BorderRadius = 'var(--ds-border-radius-050)' | 'var(--ds-border-radius)' | 'var(--ds-border-radius-100)' | 'var(--ds-border-radius-200)' | 'var(--ds-border-radius-300)' | 'var(--ds-border-radius-400)' | 'var(--ds-border-radius-circle)';
17
- export type SizeIntrinsic = `${number}px` | `${number}rem` | '100%';
17
+ export type BorderWidth = 'var(--ds-border-width)' | 'var(--ds-border-width-indicator)' | 'var(--ds-border-width-outline)';
18
+ export type BorderShorthand = 'none' | `${BorderWidth} solid ${BorderColor}`;
19
+ export type SizeIntrinsic = `${number}px` | `${number}rem` | '100%' | 'min-content' | 'max-content' | 'fit-content' | 'auto';
18
20
  export type Space = 'var(--ds-space-0)' | 'var(--ds-space-025)' | 'var(--ds-space-050)' | 'var(--ds-space-075)' | 'var(--ds-space-100)' | 'var(--ds-space-150)' | 'var(--ds-space-200)' | 'var(--ds-space-250)' | 'var(--ds-space-300)' | 'var(--ds-space-400)' | 'var(--ds-space-500)' | 'var(--ds-space-600)' | 'var(--ds-space-800)' | 'var(--ds-space-1000)' | 'var(--ds-space-negative-025)' | 'var(--ds-space-negative-050)' | 'var(--ds-space-negative-075)' | 'var(--ds-space-negative-100)' | 'var(--ds-space-negative-150)' | 'var(--ds-space-negative-200)' | 'var(--ds-space-negative-250)' | 'var(--ds-space-negative-300)' | 'var(--ds-space-negative-400)';
19
21
  export type SpaceMargin = Space | 'auto' | '0 auto' | '0';
20
22
  export type Shadow = 'var(--ds-shadow-overflow)' | 'var(--ds-shadow-overflow-perimeter)' | 'var(--ds-shadow-overflow-spread)' | 'var(--ds-shadow-overlay)' | 'var(--ds-shadow-raised)';
21
- export type TextColor = 'transparent' | 'var(--ds-text)' | 'var(--ds-text-accent-lime)' | 'var(--ds-text-accent-lime-bolder)' | 'var(--ds-text-accent-red)' | 'var(--ds-text-accent-red-bolder)' | 'var(--ds-text-accent-orange)' | 'var(--ds-text-accent-orange-bolder)' | 'var(--ds-text-accent-yellow)' | 'var(--ds-text-accent-yellow-bolder)' | 'var(--ds-text-accent-green)' | 'var(--ds-text-accent-green-bolder)' | 'var(--ds-text-accent-teal)' | 'var(--ds-text-accent-teal-bolder)' | 'var(--ds-text-accent-blue)' | 'var(--ds-text-accent-blue-bolder)' | 'var(--ds-text-accent-purple)' | 'var(--ds-text-accent-purple-bolder)' | 'var(--ds-text-accent-magenta)' | 'var(--ds-text-accent-magenta-bolder)' | 'var(--ds-text-accent-gray)' | 'var(--ds-text-accent-gray-bolder)' | 'var(--ds-text-disabled)' | 'var(--ds-text-inverse)' | 'var(--ds-text-selected)' | 'var(--ds-text-brand)' | 'var(--ds-text-danger)' | 'var(--ds-text-warning)' | 'var(--ds-text-warning-inverse)' | 'var(--ds-text-success)' | 'var(--ds-text-discovery)' | 'var(--ds-text-information)' | 'var(--ds-text-subtlest)' | 'var(--ds-text-subtle)' | 'var(--ds-link)' | 'var(--ds-link-visited)';
22
23
  export type TextColorPressed = 'var(--ds-link-pressed)' | 'var(--ds-link-visited-pressed)';
24
+ export type TextColor = 'transparent' | TextColorPressed | 'var(--ds-text)' | 'var(--ds-text-accent-lime)' | 'var(--ds-text-accent-lime-bolder)' | 'var(--ds-text-accent-red)' | 'var(--ds-text-accent-red-bolder)' | 'var(--ds-text-accent-orange)' | 'var(--ds-text-accent-orange-bolder)' | 'var(--ds-text-accent-yellow)' | 'var(--ds-text-accent-yellow-bolder)' | 'var(--ds-text-accent-green)' | 'var(--ds-text-accent-green-bolder)' | 'var(--ds-text-accent-teal)' | 'var(--ds-text-accent-teal-bolder)' | 'var(--ds-text-accent-blue)' | 'var(--ds-text-accent-blue-bolder)' | 'var(--ds-text-accent-purple)' | 'var(--ds-text-accent-purple-bolder)' | 'var(--ds-text-accent-magenta)' | 'var(--ds-text-accent-magenta-bolder)' | 'var(--ds-text-accent-gray)' | 'var(--ds-text-accent-gray-bolder)' | 'var(--ds-text-disabled)' | 'var(--ds-text-inverse)' | 'var(--ds-text-selected)' | 'var(--ds-text-brand)' | 'var(--ds-text-danger)' | 'var(--ds-text-warning)' | 'var(--ds-text-warning-inverse)' | 'var(--ds-text-success)' | 'var(--ds-text-discovery)' | 'var(--ds-text-information)' | 'var(--ds-text-subtlest)' | 'var(--ds-text-subtle)' | 'var(--ds-link)' | 'var(--ds-link-visited)';
23
25
  export type Opacity = 'var(--ds-opacity-disabled)' | 'var(--ds-opacity-loading)';
24
26
  export interface CSSPropertiesHovered {
25
27
  backgroundColor: BackgroundColorHovered;
@@ -31,6 +33,17 @@ export interface CSSPropertiesActive {
31
33
  export interface DesignTokenStyles {
32
34
  '&:active': CSSPropertiesActive;
33
35
  '&:hover': CSSPropertiesHovered;
36
+ border: BorderShorthand;
37
+ borderBlock: BorderShorthand;
38
+ borderBlockEnd: BorderShorthand;
39
+ borderBlockStart: BorderShorthand;
40
+ borderBottom: BorderShorthand;
41
+ borderInline: BorderShorthand;
42
+ borderInlineEnd: BorderShorthand;
43
+ borderInlineStart: BorderShorthand;
44
+ borderLeft: BorderShorthand;
45
+ borderRight: BorderShorthand;
46
+ borderTop: BorderShorthand;
34
47
  appearance: 'none' | 'auto';
35
48
  backgroundColor: BackgroundColor;
36
49
  blockSize: SizeIntrinsic;
@@ -76,7 +89,7 @@ export interface DesignTokenStyles {
76
89
  containerName: never;
77
90
  containerType: never;
78
91
  float: never;
79
- font: never;
92
+ font: FontShorthand;
80
93
  fontFamily: never;
81
94
  fontSize: never;
82
95
  fontSizeAdjust: never;
@@ -3,23 +3,25 @@
3
3
  *
4
4
  * Strict design token based typedef representing a subset of safe CSS properties.
5
5
  *
6
- * @codegen <<SignedSource::73ea861e90cff1941e5848336ce46260>>
6
+ * @codegen <<SignedSource::21c2ae52ced4fa9337277f9daca4b814>>
7
7
  * @codegenCommand yarn build tokens
8
8
  */
9
- export type BackgroundColor = 'transparent' | 'currentcolor' | 'var(--ds-background-accent-lime-subtlest)' | 'var(--ds-background-accent-lime-subtler)' | 'var(--ds-background-accent-lime-subtle)' | 'var(--ds-background-accent-lime-bolder)' | 'var(--ds-background-accent-red-subtlest)' | 'var(--ds-background-accent-red-subtler)' | 'var(--ds-background-accent-red-subtle)' | 'var(--ds-background-accent-red-bolder)' | 'var(--ds-background-accent-orange-subtlest)' | 'var(--ds-background-accent-orange-subtler)' | 'var(--ds-background-accent-orange-subtle)' | 'var(--ds-background-accent-orange-bolder)' | 'var(--ds-background-accent-yellow-subtlest)' | 'var(--ds-background-accent-yellow-subtler)' | 'var(--ds-background-accent-yellow-subtle)' | 'var(--ds-background-accent-yellow-bolder)' | 'var(--ds-background-accent-green-subtlest)' | 'var(--ds-background-accent-green-subtler)' | 'var(--ds-background-accent-green-subtle)' | 'var(--ds-background-accent-green-bolder)' | 'var(--ds-background-accent-teal-subtlest)' | 'var(--ds-background-accent-teal-subtler)' | 'var(--ds-background-accent-teal-subtle)' | 'var(--ds-background-accent-teal-bolder)' | 'var(--ds-background-accent-blue-subtlest)' | 'var(--ds-background-accent-blue-subtler)' | 'var(--ds-background-accent-blue-subtle)' | 'var(--ds-background-accent-blue-bolder)' | 'var(--ds-background-accent-purple-subtlest)' | 'var(--ds-background-accent-purple-subtler)' | 'var(--ds-background-accent-purple-subtle)' | 'var(--ds-background-accent-purple-bolder)' | 'var(--ds-background-accent-magenta-subtlest)' | 'var(--ds-background-accent-magenta-subtler)' | 'var(--ds-background-accent-magenta-subtle)' | 'var(--ds-background-accent-magenta-bolder)' | 'var(--ds-background-accent-gray-subtlest)' | 'var(--ds-background-accent-gray-subtler)' | 'var(--ds-background-accent-gray-subtle)' | 'var(--ds-background-accent-gray-bolder)' | 'var(--ds-background-disabled)' | 'var(--ds-background-input)' | 'var(--ds-background-inverse-subtle)' | 'var(--ds-background-neutral)' | 'var(--ds-background-neutral-subtle)' | 'var(--ds-background-neutral-bold)' | 'var(--ds-background-selected)' | 'var(--ds-background-selected-bold)' | 'var(--ds-background-brand-subtlest)' | 'var(--ds-background-brand-bold)' | 'var(--ds-background-brand-boldest)' | 'var(--ds-background-danger)' | 'var(--ds-background-danger-bold)' | 'var(--ds-background-warning)' | 'var(--ds-background-warning-bold)' | 'var(--ds-background-success)' | 'var(--ds-background-success-bold)' | 'var(--ds-background-discovery)' | 'var(--ds-background-discovery-bold)' | 'var(--ds-background-information)' | 'var(--ds-background-information-bold)' | 'var(--ds-skeleton)' | 'var(--ds-skeleton-subtle)' | 'var(--ds-surface)' | 'var(--ds-surface-overlay)' | 'var(--ds-surface-raised)' | 'var(--ds-surface-sunken)' | 'var(--ds-elevation-surface-current)';
10
9
  export type BackgroundColorHovered = 'var(--ds-background-accent-lime-subtlest-hovered)' | 'var(--ds-background-accent-lime-subtler-hovered)' | 'var(--ds-background-accent-lime-subtle-hovered)' | 'var(--ds-background-accent-lime-bolder-hovered)' | 'var(--ds-background-accent-red-subtlest-hovered)' | 'var(--ds-background-accent-red-subtler-hovered)' | 'var(--ds-background-accent-red-subtle-hovered)' | 'var(--ds-background-accent-red-bolder-hovered)' | 'var(--ds-background-accent-orange-subtlest-hovered)' | 'var(--ds-background-accent-orange-subtler-hovered)' | 'var(--ds-background-accent-orange-subtle-hovered)' | 'var(--ds-background-accent-orange-bolder-hovered)' | 'var(--ds-background-accent-yellow-subtlest-hovered)' | 'var(--ds-background-accent-yellow-subtler-hovered)' | 'var(--ds-background-accent-yellow-subtle-hovered)' | 'var(--ds-background-accent-yellow-bolder-hovered)' | 'var(--ds-background-accent-green-subtlest-hovered)' | 'var(--ds-background-accent-green-subtler-hovered)' | 'var(--ds-background-accent-green-subtle-hovered)' | 'var(--ds-background-accent-green-bolder-hovered)' | 'var(--ds-background-accent-teal-subtlest-hovered)' | 'var(--ds-background-accent-teal-subtler-hovered)' | 'var(--ds-background-accent-teal-subtle-hovered)' | 'var(--ds-background-accent-teal-bolder-hovered)' | 'var(--ds-background-accent-blue-subtlest-hovered)' | 'var(--ds-background-accent-blue-subtler-hovered)' | 'var(--ds-background-accent-blue-subtle-hovered)' | 'var(--ds-background-accent-blue-bolder-hovered)' | 'var(--ds-background-accent-purple-subtlest-hovered)' | 'var(--ds-background-accent-purple-subtler-hovered)' | 'var(--ds-background-accent-purple-subtle-hovered)' | 'var(--ds-background-accent-purple-bolder-hovered)' | 'var(--ds-background-accent-magenta-subtlest-hovered)' | 'var(--ds-background-accent-magenta-subtler-hovered)' | 'var(--ds-background-accent-magenta-subtle-hovered)' | 'var(--ds-background-accent-magenta-bolder-hovered)' | 'var(--ds-background-accent-gray-subtlest-hovered)' | 'var(--ds-background-accent-gray-subtler-hovered)' | 'var(--ds-background-accent-gray-subtle-hovered)' | 'var(--ds-background-accent-gray-bolder-hovered)' | 'var(--ds-background-input-hovered)' | 'var(--ds-background-inverse-subtle-hovered)' | 'var(--ds-background-neutral-hovered)' | 'var(--ds-background-neutral-subtle-hovered)' | 'var(--ds-background-neutral-bold-hovered)' | 'var(--ds-background-selected-hovered)' | 'var(--ds-background-selected-bold-hovered)' | 'var(--ds-background-brand-subtlest-hovered)' | 'var(--ds-background-brand-bold-hovered)' | 'var(--ds-background-brand-boldest-hovered)' | 'var(--ds-background-danger-hovered)' | 'var(--ds-background-danger-bold-hovered)' | 'var(--ds-background-warning-hovered)' | 'var(--ds-background-warning-bold-hovered)' | 'var(--ds-background-success-hovered)' | 'var(--ds-background-success-bold-hovered)' | 'var(--ds-background-discovery-hovered)' | 'var(--ds-background-discovery-bold-hovered)' | 'var(--ds-background-information-hovered)' | 'var(--ds-background-information-bold-hovered)' | 'var(--ds-surface-hovered)' | 'var(--ds-surface-overlay-hovered)' | 'var(--ds-surface-raised-hovered)';
11
10
  export type BackgroundColorPressed = 'var(--ds-background-accent-lime-subtlest-pressed)' | 'var(--ds-background-accent-lime-subtler-pressed)' | 'var(--ds-background-accent-lime-subtle-pressed)' | 'var(--ds-background-accent-lime-bolder-pressed)' | 'var(--ds-background-accent-red-subtlest-pressed)' | 'var(--ds-background-accent-red-subtler-pressed)' | 'var(--ds-background-accent-red-subtle-pressed)' | 'var(--ds-background-accent-red-bolder-pressed)' | 'var(--ds-background-accent-orange-subtlest-pressed)' | 'var(--ds-background-accent-orange-subtler-pressed)' | 'var(--ds-background-accent-orange-subtle-pressed)' | 'var(--ds-background-accent-orange-bolder-pressed)' | 'var(--ds-background-accent-yellow-subtlest-pressed)' | 'var(--ds-background-accent-yellow-subtler-pressed)' | 'var(--ds-background-accent-yellow-subtle-pressed)' | 'var(--ds-background-accent-yellow-bolder-pressed)' | 'var(--ds-background-accent-green-subtlest-pressed)' | 'var(--ds-background-accent-green-subtler-pressed)' | 'var(--ds-background-accent-green-subtle-pressed)' | 'var(--ds-background-accent-green-bolder-pressed)' | 'var(--ds-background-accent-teal-subtlest-pressed)' | 'var(--ds-background-accent-teal-subtler-pressed)' | 'var(--ds-background-accent-teal-subtle-pressed)' | 'var(--ds-background-accent-teal-bolder-pressed)' | 'var(--ds-background-accent-blue-subtlest-pressed)' | 'var(--ds-background-accent-blue-subtler-pressed)' | 'var(--ds-background-accent-blue-subtle-pressed)' | 'var(--ds-background-accent-blue-bolder-pressed)' | 'var(--ds-background-accent-purple-subtlest-pressed)' | 'var(--ds-background-accent-purple-subtler-pressed)' | 'var(--ds-background-accent-purple-subtle-pressed)' | 'var(--ds-background-accent-purple-bolder-pressed)' | 'var(--ds-background-accent-magenta-subtlest-pressed)' | 'var(--ds-background-accent-magenta-subtler-pressed)' | 'var(--ds-background-accent-magenta-subtle-pressed)' | 'var(--ds-background-accent-magenta-bolder-pressed)' | 'var(--ds-background-accent-gray-subtlest-pressed)' | 'var(--ds-background-accent-gray-subtler-pressed)' | 'var(--ds-background-accent-gray-subtle-pressed)' | 'var(--ds-background-accent-gray-bolder-pressed)' | 'var(--ds-background-input-pressed)' | 'var(--ds-background-inverse-subtle-pressed)' | 'var(--ds-background-neutral-pressed)' | 'var(--ds-background-neutral-subtle-pressed)' | 'var(--ds-background-neutral-bold-pressed)' | 'var(--ds-background-selected-pressed)' | 'var(--ds-background-selected-bold-pressed)' | 'var(--ds-background-brand-subtlest-pressed)' | 'var(--ds-background-brand-bold-pressed)' | 'var(--ds-background-brand-boldest-pressed)' | 'var(--ds-background-danger-pressed)' | 'var(--ds-background-danger-bold-pressed)' | 'var(--ds-background-warning-pressed)' | 'var(--ds-background-warning-bold-pressed)' | 'var(--ds-background-success-pressed)' | 'var(--ds-background-success-bold-pressed)' | 'var(--ds-background-discovery-pressed)' | 'var(--ds-background-discovery-bold-pressed)' | 'var(--ds-background-information-pressed)' | 'var(--ds-background-information-bold-pressed)' | 'var(--ds-surface-pressed)' | 'var(--ds-surface-overlay-pressed)' | 'var(--ds-surface-raised-pressed)';
12
- export type IconColor = 'var(--ds-link)' | 'var(--ds-link-visited)' | 'var(--ds-icon)' | 'var(--ds-icon-accent-lime)' | 'var(--ds-icon-accent-red)' | 'var(--ds-icon-accent-orange)' | 'var(--ds-icon-accent-yellow)' | 'var(--ds-icon-accent-green)' | 'var(--ds-icon-accent-teal)' | 'var(--ds-icon-accent-blue)' | 'var(--ds-icon-accent-purple)' | 'var(--ds-icon-accent-magenta)' | 'var(--ds-icon-accent-gray)' | 'var(--ds-icon-disabled)' | 'var(--ds-icon-inverse)' | 'var(--ds-icon-selected)' | 'var(--ds-icon-brand)' | 'var(--ds-icon-danger)' | 'var(--ds-icon-warning)' | 'var(--ds-icon-warning-inverse)' | 'var(--ds-icon-success)' | 'var(--ds-icon-discovery)' | 'var(--ds-icon-information)' | 'var(--ds-icon-subtlest)' | 'var(--ds-icon-subtle)';
11
+ export type BackgroundColor = 'transparent' | 'currentcolor' | BackgroundColorHovered | BackgroundColorPressed | 'var(--ds-background-accent-lime-subtlest)' | 'var(--ds-background-accent-lime-subtler)' | 'var(--ds-background-accent-lime-subtle)' | 'var(--ds-background-accent-lime-bolder)' | 'var(--ds-background-accent-red-subtlest)' | 'var(--ds-background-accent-red-subtler)' | 'var(--ds-background-accent-red-subtle)' | 'var(--ds-background-accent-red-bolder)' | 'var(--ds-background-accent-orange-subtlest)' | 'var(--ds-background-accent-orange-subtler)' | 'var(--ds-background-accent-orange-subtle)' | 'var(--ds-background-accent-orange-bolder)' | 'var(--ds-background-accent-yellow-subtlest)' | 'var(--ds-background-accent-yellow-subtler)' | 'var(--ds-background-accent-yellow-subtle)' | 'var(--ds-background-accent-yellow-bolder)' | 'var(--ds-background-accent-green-subtlest)' | 'var(--ds-background-accent-green-subtler)' | 'var(--ds-background-accent-green-subtle)' | 'var(--ds-background-accent-green-bolder)' | 'var(--ds-background-accent-teal-subtlest)' | 'var(--ds-background-accent-teal-subtler)' | 'var(--ds-background-accent-teal-subtle)' | 'var(--ds-background-accent-teal-bolder)' | 'var(--ds-background-accent-blue-subtlest)' | 'var(--ds-background-accent-blue-subtler)' | 'var(--ds-background-accent-blue-subtle)' | 'var(--ds-background-accent-blue-bolder)' | 'var(--ds-background-accent-purple-subtlest)' | 'var(--ds-background-accent-purple-subtler)' | 'var(--ds-background-accent-purple-subtle)' | 'var(--ds-background-accent-purple-bolder)' | 'var(--ds-background-accent-magenta-subtlest)' | 'var(--ds-background-accent-magenta-subtler)' | 'var(--ds-background-accent-magenta-subtle)' | 'var(--ds-background-accent-magenta-bolder)' | 'var(--ds-background-accent-gray-subtlest)' | 'var(--ds-background-accent-gray-subtler)' | 'var(--ds-background-accent-gray-subtle)' | 'var(--ds-background-accent-gray-bolder)' | 'var(--ds-background-disabled)' | 'var(--ds-background-input)' | 'var(--ds-background-inverse-subtle)' | 'var(--ds-background-neutral)' | 'var(--ds-background-neutral-subtle)' | 'var(--ds-background-neutral-bold)' | 'var(--ds-background-selected)' | 'var(--ds-background-selected-bold)' | 'var(--ds-background-brand-subtlest)' | 'var(--ds-background-brand-bold)' | 'var(--ds-background-brand-boldest)' | 'var(--ds-background-danger)' | 'var(--ds-background-danger-bold)' | 'var(--ds-background-warning)' | 'var(--ds-background-warning-bold)' | 'var(--ds-background-success)' | 'var(--ds-background-success-bold)' | 'var(--ds-background-discovery)' | 'var(--ds-background-discovery-bold)' | 'var(--ds-background-information)' | 'var(--ds-background-information-bold)' | 'var(--ds-skeleton)' | 'var(--ds-skeleton-subtle)' | 'var(--ds-surface)' | 'var(--ds-surface-overlay)' | 'var(--ds-surface-raised)' | 'var(--ds-surface-sunken)' | 'var(--ds-elevation-surface-current)';
12
+ export type FontShorthand = 'var(--ds-font-heading-xxlarge)' | 'var(--ds-font-heading-xlarge)' | 'var(--ds-font-heading-large)' | 'var(--ds-font-heading-medium)' | 'var(--ds-font-heading-small)' | 'var(--ds-font-heading-xsmall)' | 'var(--ds-font-heading-xxsmall)' | 'var(--ds-font-body-large)' | 'var(--ds-font-body)' | 'var(--ds-font-body-small)' | 'var(--ds-font-body-UNSAFE_small)' | 'var(--ds-font-code)';
13
13
  export type IconColorPressed = 'var(--ds-link-pressed)' | 'var(--ds-link-visited-pressed)';
14
- export type BorderColor = 'var(--ds-border)' | 'var(--ds-border-accent-lime)' | 'var(--ds-border-accent-red)' | 'var(--ds-border-accent-orange)' | 'var(--ds-border-accent-yellow)' | 'var(--ds-border-accent-green)' | 'var(--ds-border-accent-teal)' | 'var(--ds-border-accent-blue)' | 'var(--ds-border-accent-purple)' | 'var(--ds-border-accent-magenta)' | 'var(--ds-border-accent-gray)' | 'var(--ds-border-disabled)' | 'var(--ds-border-focused)' | 'var(--ds-border-input)' | 'var(--ds-border-inverse)' | 'var(--ds-border-selected)' | 'var(--ds-border-brand)' | 'var(--ds-border-danger)' | 'var(--ds-border-warning)' | 'var(--ds-border-success)' | 'var(--ds-border-discovery)' | 'var(--ds-border-information)' | 'var(--ds-border-bold)';
15
- export type BorderWidth = 'var(--ds-border-width)' | 'var(--ds-border-width-indicator)' | 'var(--ds-border-width-outline)';
14
+ export type IconColor = IconColorPressed | 'var(--ds-link)' | 'var(--ds-link-visited)' | 'var(--ds-icon)' | 'var(--ds-icon-accent-lime)' | 'var(--ds-icon-accent-red)' | 'var(--ds-icon-accent-orange)' | 'var(--ds-icon-accent-yellow)' | 'var(--ds-icon-accent-green)' | 'var(--ds-icon-accent-teal)' | 'var(--ds-icon-accent-blue)' | 'var(--ds-icon-accent-purple)' | 'var(--ds-icon-accent-magenta)' | 'var(--ds-icon-accent-gray)' | 'var(--ds-icon-disabled)' | 'var(--ds-icon-inverse)' | 'var(--ds-icon-selected)' | 'var(--ds-icon-brand)' | 'var(--ds-icon-danger)' | 'var(--ds-icon-warning)' | 'var(--ds-icon-warning-inverse)' | 'var(--ds-icon-success)' | 'var(--ds-icon-discovery)' | 'var(--ds-icon-information)' | 'var(--ds-icon-subtlest)' | 'var(--ds-icon-subtle)';
15
+ export type BorderColor = 'transparent' | 'var(--ds-border)' | 'var(--ds-border-accent-lime)' | 'var(--ds-border-accent-red)' | 'var(--ds-border-accent-orange)' | 'var(--ds-border-accent-yellow)' | 'var(--ds-border-accent-green)' | 'var(--ds-border-accent-teal)' | 'var(--ds-border-accent-blue)' | 'var(--ds-border-accent-purple)' | 'var(--ds-border-accent-magenta)' | 'var(--ds-border-accent-gray)' | 'var(--ds-border-disabled)' | 'var(--ds-border-focused)' | 'var(--ds-border-input)' | 'var(--ds-border-inverse)' | 'var(--ds-border-selected)' | 'var(--ds-border-brand)' | 'var(--ds-border-danger)' | 'var(--ds-border-warning)' | 'var(--ds-border-success)' | 'var(--ds-border-discovery)' | 'var(--ds-border-information)' | 'var(--ds-border-bold)';
16
16
  export type BorderRadius = 'var(--ds-border-radius-050)' | 'var(--ds-border-radius)' | 'var(--ds-border-radius-100)' | 'var(--ds-border-radius-200)' | 'var(--ds-border-radius-300)' | 'var(--ds-border-radius-400)' | 'var(--ds-border-radius-circle)';
17
- export type SizeIntrinsic = `${number}px` | `${number}rem` | '100%';
17
+ export type BorderWidth = 'var(--ds-border-width)' | 'var(--ds-border-width-indicator)' | 'var(--ds-border-width-outline)';
18
+ export type BorderShorthand = 'none' | `${BorderWidth} solid ${BorderColor}`;
19
+ export type SizeIntrinsic = `${number}px` | `${number}rem` | '100%' | 'min-content' | 'max-content' | 'fit-content' | 'auto';
18
20
  export type Space = 'var(--ds-space-0)' | 'var(--ds-space-025)' | 'var(--ds-space-050)' | 'var(--ds-space-075)' | 'var(--ds-space-100)' | 'var(--ds-space-150)' | 'var(--ds-space-200)' | 'var(--ds-space-250)' | 'var(--ds-space-300)' | 'var(--ds-space-400)' | 'var(--ds-space-500)' | 'var(--ds-space-600)' | 'var(--ds-space-800)' | 'var(--ds-space-1000)' | 'var(--ds-space-negative-025)' | 'var(--ds-space-negative-050)' | 'var(--ds-space-negative-075)' | 'var(--ds-space-negative-100)' | 'var(--ds-space-negative-150)' | 'var(--ds-space-negative-200)' | 'var(--ds-space-negative-250)' | 'var(--ds-space-negative-300)' | 'var(--ds-space-negative-400)';
19
21
  export type SpaceMargin = Space | 'auto' | '0 auto' | '0';
20
22
  export type Shadow = 'var(--ds-shadow-overflow)' | 'var(--ds-shadow-overflow-perimeter)' | 'var(--ds-shadow-overflow-spread)' | 'var(--ds-shadow-overlay)' | 'var(--ds-shadow-raised)';
21
- export type TextColor = 'transparent' | 'var(--ds-text)' | 'var(--ds-text-accent-lime)' | 'var(--ds-text-accent-lime-bolder)' | 'var(--ds-text-accent-red)' | 'var(--ds-text-accent-red-bolder)' | 'var(--ds-text-accent-orange)' | 'var(--ds-text-accent-orange-bolder)' | 'var(--ds-text-accent-yellow)' | 'var(--ds-text-accent-yellow-bolder)' | 'var(--ds-text-accent-green)' | 'var(--ds-text-accent-green-bolder)' | 'var(--ds-text-accent-teal)' | 'var(--ds-text-accent-teal-bolder)' | 'var(--ds-text-accent-blue)' | 'var(--ds-text-accent-blue-bolder)' | 'var(--ds-text-accent-purple)' | 'var(--ds-text-accent-purple-bolder)' | 'var(--ds-text-accent-magenta)' | 'var(--ds-text-accent-magenta-bolder)' | 'var(--ds-text-accent-gray)' | 'var(--ds-text-accent-gray-bolder)' | 'var(--ds-text-disabled)' | 'var(--ds-text-inverse)' | 'var(--ds-text-selected)' | 'var(--ds-text-brand)' | 'var(--ds-text-danger)' | 'var(--ds-text-warning)' | 'var(--ds-text-warning-inverse)' | 'var(--ds-text-success)' | 'var(--ds-text-discovery)' | 'var(--ds-text-information)' | 'var(--ds-text-subtlest)' | 'var(--ds-text-subtle)' | 'var(--ds-link)' | 'var(--ds-link-visited)';
22
23
  export type TextColorPressed = 'var(--ds-link-pressed)' | 'var(--ds-link-visited-pressed)';
24
+ export type TextColor = 'transparent' | TextColorPressed | 'var(--ds-text)' | 'var(--ds-text-accent-lime)' | 'var(--ds-text-accent-lime-bolder)' | 'var(--ds-text-accent-red)' | 'var(--ds-text-accent-red-bolder)' | 'var(--ds-text-accent-orange)' | 'var(--ds-text-accent-orange-bolder)' | 'var(--ds-text-accent-yellow)' | 'var(--ds-text-accent-yellow-bolder)' | 'var(--ds-text-accent-green)' | 'var(--ds-text-accent-green-bolder)' | 'var(--ds-text-accent-teal)' | 'var(--ds-text-accent-teal-bolder)' | 'var(--ds-text-accent-blue)' | 'var(--ds-text-accent-blue-bolder)' | 'var(--ds-text-accent-purple)' | 'var(--ds-text-accent-purple-bolder)' | 'var(--ds-text-accent-magenta)' | 'var(--ds-text-accent-magenta-bolder)' | 'var(--ds-text-accent-gray)' | 'var(--ds-text-accent-gray-bolder)' | 'var(--ds-text-disabled)' | 'var(--ds-text-inverse)' | 'var(--ds-text-selected)' | 'var(--ds-text-brand)' | 'var(--ds-text-danger)' | 'var(--ds-text-warning)' | 'var(--ds-text-warning-inverse)' | 'var(--ds-text-success)' | 'var(--ds-text-discovery)' | 'var(--ds-text-information)' | 'var(--ds-text-subtlest)' | 'var(--ds-text-subtle)' | 'var(--ds-link)' | 'var(--ds-link-visited)';
23
25
  export type Opacity = 'var(--ds-opacity-disabled)' | 'var(--ds-opacity-loading)';
24
26
  export interface CSSPropertiesHovered {
25
27
  backgroundColor: BackgroundColorHovered;
@@ -31,6 +33,17 @@ export interface CSSPropertiesActive {
31
33
  export interface DesignTokenStyles {
32
34
  '&:active': CSSPropertiesActive;
33
35
  '&:hover': CSSPropertiesHovered;
36
+ border: BorderShorthand;
37
+ borderBlock: BorderShorthand;
38
+ borderBlockEnd: BorderShorthand;
39
+ borderBlockStart: BorderShorthand;
40
+ borderBottom: BorderShorthand;
41
+ borderInline: BorderShorthand;
42
+ borderInlineEnd: BorderShorthand;
43
+ borderInlineStart: BorderShorthand;
44
+ borderLeft: BorderShorthand;
45
+ borderRight: BorderShorthand;
46
+ borderTop: BorderShorthand;
34
47
  appearance: 'none' | 'auto';
35
48
  backgroundColor: BackgroundColor;
36
49
  blockSize: SizeIntrinsic;
@@ -76,7 +89,7 @@ export interface DesignTokenStyles {
76
89
  containerName: never;
77
90
  containerType: never;
78
91
  float: never;
79
- font: never;
92
+ font: FontShorthand;
80
93
  fontFamily: never;
81
94
  fontSize: never;
82
95
  fontSizeAdjust: never;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/tokens",
3
- "version": "1.59.1",
3
+ "version": "1.61.0",
4
4
  "description": "Design tokens are the single source of truth to name and store design decisions.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -18,10 +18,6 @@
18
18
  "atlaskit:src": "src/index.tsx",
19
19
  "atlassian": {
20
20
  "team": "Design System Team",
21
- "productPushConsumption": [
22
- "jira"
23
- ],
24
- "releaseModel": "continuous",
25
21
  "runReact18": true,
26
22
  "website": {
27
23
  "name": "Design tokens",
@@ -35,7 +31,7 @@
35
31
  "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"
36
32
  },
37
33
  "dependencies": {
38
- "@atlaskit/ds-lib": "^2.5.0",
34
+ "@atlaskit/ds-lib": "^2.6.0",
39
35
  "@atlaskit/platform-feature-flags": "^0.3.0",
40
36
  "@babel/runtime": "^7.0.0",
41
37
  "@babel/traverse": "^7.23.2",
@@ -49,8 +45,8 @@
49
45
  "@af/accessibility-testing": "*",
50
46
  "@af/formatting": "*",
51
47
  "@atlaskit/button": "^20.1.0",
52
- "@atlaskit/calendar": "^14.5.0",
53
- "@atlaskit/checkbox": "^13.7.0",
48
+ "@atlaskit/calendar": "^15.0.0",
49
+ "@atlaskit/checkbox": "^14.0.0",
54
50
  "@atlaskit/radio": "^6.5.0",
55
51
  "@atlaskit/textfield": "^6.5.0",
56
52
  "@atlaskit/tooltip": "^18.7.0",
@@ -58,7 +54,7 @@
58
54
  "@atlassian/codegen": "^0.1.0",
59
55
  "@atlassian/feature-flags-test-utils": "*",
60
56
  "@atlassian/ts-loader": "*",
61
- "@babel/core": "^7.20.0",
57
+ "@babel/core": "7.24.9",
62
58
  "@emotion/react": "^11.7.1",
63
59
  "@hypermod/utils": "^0.4.2",
64
60
  "@testing-library/dom": "^10.1.0",
@@ -129,7 +125,7 @@
129
125
  "./css-type-schema": "./src/entry-points/css-type-schema.codegen.tsx"
130
126
  },
131
127
  "platform-feature-flags": {
132
- "platform.design-system-team.increased-contrast-themes": {
128
+ "platform_increased-contrast-themes": {
133
129
  "type": "boolean"
134
130
  },
135
131
  "platform-component-visual-refresh": {