@atlaskit/tokens 1.30.0 → 1.31.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/tokens
 
+## 1.31.0
+
+### Minor Changes
+
+- [#62155](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/62155) [`d88ffee39278`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d88ffee39278) - Added new themes for ads-vision-lab
+
 ## 1.30.0
 
 ### Minor Changes

package/dist/cjs/artifacts/theme-import-map.js

@@ -16,7 +16,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  * This allows users to compose their themes and only use the tokens that are requested.
  * When a new theme is created, the import should automatically be added to the map
  *
- * @codegen <<SignedSource::da31df0b9dea8584d4ae7e0ad251f3dd>>
+ * @codegen <<SignedSource::6c438d052bfcec2f42bfb917a01beef9>>
  * @codegenCommand yarn build tokens
  */
 
@@ -27,6 +27,12 @@ var themeImportsMap = {
       './themes/atlassian-light'));
     });
   },
+  'light-future': function lightFuture() {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_atlassian-light-future" */
+      './themes/atlassian-light-future'));
+    });
+  },
   'light-increased-contrast': function lightIncreasedContrast() {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_atlassian-light-increased-contrast" */
@@ -39,6 +45,12 @@ var themeImportsMap = {
       './themes/atlassian-dark'));
     });
   },
+  'dark-future': function darkFuture() {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_atlassian-dark-future" */
+      './themes/atlassian-dark-future'));
+    });
+  },
   'dark-increased-contrast': function darkIncreasedContrast() {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_atlassian-dark-increased-contrast" */

package/dist/cjs/artifacts/themes/atlassian-dark-future.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::d075fc63f2fcbc4c48f9221541c1d067>>
+ * @codegenCommand yarn build tokens
+ */
+var _default = exports.default = "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: dark;\n  --ds-background-disabled: #B3DF72;\n}\n";

package/dist/cjs/artifacts/themes/atlassian-light-future.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::b66f003f52ebad6767e95eaeb646085b>>
+ * @codegenCommand yarn build tokens
+ */
+var _default = exports.default = "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: light;\n  --ds-background-disabled: #28311B;\n}\n";

package/dist/cjs/artifacts/tokens-raw/atlassian-dark-future.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::ab55c164418ef8725d43715108841276>>
+ * @codegenCommand yarn build tokens
+ */
+var tokens = [{
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "0.0.15",
+    "description": "Use for backgrounds of elements in a disabled state."
+  },
+  "value": "#B3DF72",
+  "filePath": "schema/themes/atlassian-dark-future/color/background.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "0.0.15",
+      "description": "Use for backgrounds of elements in a disabled state."
+    },
+    "value": "Lime300"
+  },
+  "name": "color.background.disabled",
+  "path": ["color", "background", "disabled"],
+  "cleanName": "color.background.disabled"
+}];
+var _default = exports.default = tokens;

package/dist/cjs/artifacts/tokens-raw/atlassian-light-future.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::940fbbe091341b7f246528cfc921961d>>
+ * @codegenCommand yarn build tokens
+ */
+var tokens = [{
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "0.0.15",
+    "description": "Use for backgrounds of elements in a disabled state."
+  },
+  "value": "#28311B",
+  "filePath": "schema/themes/atlassian-light-future/color/background.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "0.0.15",
+      "description": "Use for backgrounds of elements in a disabled state."
+    },
+    "value": "Lime1000"
+  },
+  "name": "color.background.disabled",
+  "path": ["color", "background", "disabled"],
+  "cleanName": "color.background.disabled"
+}];
+var _default = exports.default = tokens;

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

@@ -8,7 +8,7 @@ exports.default = void 0;
 var _warnOnce = _interopRequireDefault(require("@atlaskit/ds-lib/warn-once"));
 var _tokenNames = _interopRequireDefault(require("./artifacts/token-names"));
 var name = "@atlaskit/tokens";
-var version = "1.30.0";
+var version = "1.31.0";
 /**
  * Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
  * resulting CSS Custom Property.

package/dist/cjs/get-token.js

@@ -9,7 +9,7 @@ var _warnOnce = _interopRequireDefault(require("@atlaskit/ds-lib/warn-once"));
 var _tokenNames = _interopRequireDefault(require("./artifacts/token-names"));
 var _constants = require("./constants");
 var name = "@atlaskit/tokens";
-var version = "1.30.0";
+var version = "1.31.0";
 /**
  * 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.

package/dist/cjs/theme-config.js

@@ -44,7 +44,7 @@ var themeContrastModes = exports.themeContrastModes = ['more', 'no-preference',
  *
  * These ids must be kebab case
  */
-var themeIds = exports.themeIds = ['light-increased-contrast', 'light', 'dark', 'dark-increased-contrast', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-minor3'];
+var themeIds = exports.themeIds = ['light-increased-contrast', 'light', 'light-future', 'dark', 'dark-future', 'dark-increased-contrast', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-minor3'];
 /**
  * Theme override ids: the equivalent of themeIds for theme overrides.
  * Theme overrides are temporary and there may not be any defined at times.
@@ -79,6 +79,16 @@ var themeConfig = {
       mode: 'light'
     }
   },
+  'atlassian-light-future': {
+    id: 'light-future',
+    displayName: 'Future Light Theme',
+    palette: 'defaultPalette',
+    attributes: {
+      type: 'color',
+      mode: 'light'
+    },
+    override: 'light'
+  },
   'atlassian-light-increased-contrast': {
     id: 'light-increased-contrast',
     displayName: 'Light Theme (increased contrast)',
@@ -99,6 +109,16 @@ var themeConfig = {
       mode: 'dark'
     }
   },
+  'atlassian-dark-future': {
+    id: 'dark-future',
+    displayName: 'Future Dark Theme',
+    palette: 'defaultPalette',
+    attributes: {
+      type: 'color',
+      mode: 'dark'
+    },
+    override: 'light'
+  },
   'atlassian-dark-increased-contrast': {
     id: 'dark-increased-contrast',
     displayName: 'Dark Theme (increased contrast)',

package/dist/es2019/artifacts/theme-import-map.js

@@ -6,17 +6,21 @@
  * This allows users to compose their themes and only use the tokens that are requested.
  * When a new theme is created, the import should automatically be added to the map
  *
- * @codegen <<SignedSource::da31df0b9dea8584d4ae7e0ad251f3dd>>
+ * @codegen <<SignedSource::6c438d052bfcec2f42bfb917a01beef9>>
  * @codegenCommand yarn build tokens
  */
 
 const themeImportsMap = {
   'light': () => import( /* webpackChunkName: "@atlaskit-internal_atlassian-light" */
   './themes/atlassian-light'),
+  'light-future': () => import( /* webpackChunkName: "@atlaskit-internal_atlassian-light-future" */
+  './themes/atlassian-light-future'),
   'light-increased-contrast': () => import( /* webpackChunkName: "@atlaskit-internal_atlassian-light-increased-contrast" */
   './themes/atlassian-light-increased-contrast'),
   'dark': () => import( /* webpackChunkName: "@atlaskit-internal_atlassian-dark" */
   './themes/atlassian-dark'),
+  'dark-future': () => import( /* webpackChunkName: "@atlaskit-internal_atlassian-dark-future" */
+  './themes/atlassian-dark-future'),
   'dark-increased-contrast': () => import( /* webpackChunkName: "@atlaskit-internal_atlassian-dark-increased-contrast" */
   './themes/atlassian-dark-increased-contrast'),
   'legacy-light': () => import( /* webpackChunkName: "@atlaskit-internal_atlassian-legacy-light" */

package/dist/es2019/artifacts/themes/atlassian-dark-future.js

@@ -0,0 +1,12 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::d075fc63f2fcbc4c48f9221541c1d067>>
+ * @codegenCommand yarn build tokens
+ */
+export default `
+html[data-color-mode="light"][data-theme~="light:light"],
+html[data-color-mode="dark"][data-theme~="dark:light"] {
+  color-scheme: dark;
+  --ds-background-disabled: #B3DF72;
+}
+`;

package/dist/es2019/artifacts/themes/atlassian-light-future.js

@@ -0,0 +1,12 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::b66f003f52ebad6767e95eaeb646085b>>
+ * @codegenCommand yarn build tokens
+ */
+export default `
+html[data-color-mode="light"][data-theme~="light:light"],
+html[data-color-mode="dark"][data-theme~="dark:light"] {
+  color-scheme: light;
+  --ds-background-disabled: #28311B;
+}
+`;

package/dist/es2019/artifacts/tokens-raw/atlassian-dark-future.js

@@ -0,0 +1,29 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::ab55c164418ef8725d43715108841276>>
+ * @codegenCommand yarn build tokens
+ */
+const tokens = [{
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "0.0.15",
+    "description": "Use for backgrounds of elements in a disabled state."
+  },
+  "value": "#B3DF72",
+  "filePath": "schema/themes/atlassian-dark-future/color/background.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "0.0.15",
+      "description": "Use for backgrounds of elements in a disabled state."
+    },
+    "value": "Lime300"
+  },
+  "name": "color.background.disabled",
+  "path": ["color", "background", "disabled"],
+  "cleanName": "color.background.disabled"
+}];
+export default tokens;

package/dist/es2019/artifacts/tokens-raw/atlassian-light-future.js

@@ -0,0 +1,29 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::940fbbe091341b7f246528cfc921961d>>
+ * @codegenCommand yarn build tokens
+ */
+const tokens = [{
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "0.0.15",
+    "description": "Use for backgrounds of elements in a disabled state."
+  },
+  "value": "#28311B",
+  "filePath": "schema/themes/atlassian-light-future/color/background.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "0.0.15",
+      "description": "Use for backgrounds of elements in a disabled state."
+    },
+    "value": "Lime1000"
+  },
+  "name": "color.background.disabled",
+  "path": ["color", "background", "disabled"],
+  "cleanName": "color.background.disabled"
+}];
+export default tokens;

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

@@ -1,7 +1,7 @@
 import warnOnce from '@atlaskit/ds-lib/warn-once';
 import tokens from './artifacts/token-names';
 const name = "@atlaskit/tokens";
-const version = "1.30.0";
+const version = "1.31.0";
 /**
  * Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
  * resulting CSS Custom Property.

package/dist/es2019/get-token.js

@@ -2,7 +2,7 @@ import warnOnce from '@atlaskit/ds-lib/warn-once';
 import tokens from './artifacts/token-names';
 import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
 const name = "@atlaskit/tokens";
-const version = "1.30.0";
+const version = "1.31.0";
 /**
  * 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.

package/dist/es2019/theme-config.js

@@ -38,7 +38,7 @@ export const themeContrastModes = ['more', 'no-preference', 'auto'];
  *
  * These ids must be kebab case
  */
-export const themeIds = ['light-increased-contrast', 'light', 'dark', 'dark-increased-contrast', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-minor3'];
+export const themeIds = ['light-increased-contrast', 'light', 'light-future', 'dark', 'dark-future', 'dark-increased-contrast', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-minor3'];
 /**
  * Theme override ids: the equivalent of themeIds for theme overrides.
  * Theme overrides are temporary and there may not be any defined at times.
@@ -73,6 +73,16 @@ const themeConfig = {
       mode: 'light'
     }
   },
+  'atlassian-light-future': {
+    id: 'light-future',
+    displayName: 'Future Light Theme',
+    palette: 'defaultPalette',
+    attributes: {
+      type: 'color',
+      mode: 'light'
+    },
+    override: 'light'
+  },
   'atlassian-light-increased-contrast': {
     id: 'light-increased-contrast',
     displayName: 'Light Theme (increased contrast)',
@@ -93,6 +103,16 @@ const themeConfig = {
       mode: 'dark'
     }
   },
+  'atlassian-dark-future': {
+    id: 'dark-future',
+    displayName: 'Future Dark Theme',
+    palette: 'defaultPalette',
+    attributes: {
+      type: 'color',
+      mode: 'dark'
+    },
+    override: 'light'
+  },
   'atlassian-dark-increased-contrast': {
     id: 'dark-increased-contrast',
     displayName: 'Dark Theme (increased contrast)',

package/dist/esm/artifacts/theme-import-map.js

@@ -6,7 +6,7 @@
  * This allows users to compose their themes and only use the tokens that are requested.
  * When a new theme is created, the import should automatically be added to the map
  *
- * @codegen <<SignedSource::da31df0b9dea8584d4ae7e0ad251f3dd>>
+ * @codegen <<SignedSource::6c438d052bfcec2f42bfb917a01beef9>>
  * @codegenCommand yarn build tokens
  */
 
@@ -15,6 +15,10 @@ var themeImportsMap = {
     return import( /* webpackChunkName: "@atlaskit-internal_atlassian-light" */
     './themes/atlassian-light');
   },
+  'light-future': function lightFuture() {
+    return import( /* webpackChunkName: "@atlaskit-internal_atlassian-light-future" */
+    './themes/atlassian-light-future');
+  },
   'light-increased-contrast': function lightIncreasedContrast() {
     return import( /* webpackChunkName: "@atlaskit-internal_atlassian-light-increased-contrast" */
     './themes/atlassian-light-increased-contrast');
@@ -23,6 +27,10 @@ var themeImportsMap = {
     return import( /* webpackChunkName: "@atlaskit-internal_atlassian-dark" */
     './themes/atlassian-dark');
   },
+  'dark-future': function darkFuture() {
+    return import( /* webpackChunkName: "@atlaskit-internal_atlassian-dark-future" */
+    './themes/atlassian-dark-future');
+  },
   'dark-increased-contrast': function darkIncreasedContrast() {
     return import( /* webpackChunkName: "@atlaskit-internal_atlassian-dark-increased-contrast" */
     './themes/atlassian-dark-increased-contrast');

package/dist/esm/artifacts/themes/atlassian-dark-future.js

@@ -0,0 +1,6 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::d075fc63f2fcbc4c48f9221541c1d067>>
+ * @codegenCommand yarn build tokens
+ */
+export default "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: dark;\n  --ds-background-disabled: #B3DF72;\n}\n";

package/dist/esm/artifacts/themes/atlassian-light-future.js

@@ -0,0 +1,6 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::b66f003f52ebad6767e95eaeb646085b>>
+ * @codegenCommand yarn build tokens
+ */
+export default "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: light;\n  --ds-background-disabled: #28311B;\n}\n";

package/dist/esm/artifacts/tokens-raw/atlassian-dark-future.js

@@ -0,0 +1,29 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::ab55c164418ef8725d43715108841276>>
+ * @codegenCommand yarn build tokens
+ */
+var tokens = [{
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "0.0.15",
+    "description": "Use for backgrounds of elements in a disabled state."
+  },
+  "value": "#B3DF72",
+  "filePath": "schema/themes/atlassian-dark-future/color/background.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "0.0.15",
+      "description": "Use for backgrounds of elements in a disabled state."
+    },
+    "value": "Lime300"
+  },
+  "name": "color.background.disabled",
+  "path": ["color", "background", "disabled"],
+  "cleanName": "color.background.disabled"
+}];
+export default tokens;

package/dist/esm/artifacts/tokens-raw/atlassian-light-future.js

@@ -0,0 +1,29 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::940fbbe091341b7f246528cfc921961d>>
+ * @codegenCommand yarn build tokens
+ */
+var tokens = [{
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "0.0.15",
+    "description": "Use for backgrounds of elements in a disabled state."
+  },
+  "value": "#28311B",
+  "filePath": "schema/themes/atlassian-light-future/color/background.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "0.0.15",
+      "description": "Use for backgrounds of elements in a disabled state."
+    },
+    "value": "Lime1000"
+  },
+  "name": "color.background.disabled",
+  "path": ["color", "background", "disabled"],
+  "cleanName": "color.background.disabled"
+}];
+export default tokens;

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

@@ -1,7 +1,7 @@
 import warnOnce from '@atlaskit/ds-lib/warn-once';
 import tokens from './artifacts/token-names';
 var name = "@atlaskit/tokens";
-var version = "1.30.0";
+var version = "1.31.0";
 /**
  * Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
  * resulting CSS Custom Property.

package/dist/esm/get-token.js

@@ -2,7 +2,7 @@ import warnOnce from '@atlaskit/ds-lib/warn-once';
 import tokens from './artifacts/token-names';
 import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
 var name = "@atlaskit/tokens";
-var version = "1.30.0";
+var version = "1.31.0";
 /**
  * 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.

package/dist/esm/theme-config.js

@@ -38,7 +38,7 @@ export var themeContrastModes = ['more', 'no-preference', 'auto'];
  *
  * These ids must be kebab case
  */
-export var themeIds = ['light-increased-contrast', 'light', 'dark', 'dark-increased-contrast', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-minor3'];
+export var themeIds = ['light-increased-contrast', 'light', 'light-future', 'dark', 'dark-future', 'dark-increased-contrast', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-minor3'];
 /**
  * Theme override ids: the equivalent of themeIds for theme overrides.
  * Theme overrides are temporary and there may not be any defined at times.
@@ -73,6 +73,16 @@ var themeConfig = {
       mode: 'light'
     }
   },
+  'atlassian-light-future': {
+    id: 'light-future',
+    displayName: 'Future Light Theme',
+    palette: 'defaultPalette',
+    attributes: {
+      type: 'color',
+      mode: 'light'
+    },
+    override: 'light'
+  },
   'atlassian-light-increased-contrast': {
     id: 'light-increased-contrast',
     displayName: 'Light Theme (increased contrast)',
@@ -93,6 +103,16 @@ var themeConfig = {
       mode: 'dark'
     }
   },
+  'atlassian-dark-future': {
+    id: 'dark-future',
+    displayName: 'Future Dark Theme',
+    palette: 'defaultPalette',
+    attributes: {
+      type: 'color',
+      mode: 'dark'
+    },
+    override: 'light'
+  },
   'atlassian-dark-increased-contrast': {
     id: 'dark-increased-contrast',
     displayName: 'Dark Theme (increased contrast)',

package/dist/types/artifacts/theme-import-map.d.ts

@@ -6,7 +6,7 @@
  * This allows users to compose their themes and only use the tokens that are requested.
  * When a new theme is created, the import should automatically be added to the map
  *
- * @codegen <<SignedSource::da31df0b9dea8584d4ae7e0ad251f3dd>>
+ * @codegen <<SignedSource::6c438d052bfcec2f42bfb917a01beef9>>
  * @codegenCommand yarn build tokens
  */
 import { ThemeIds, ThemeOverrideIds } from '../theme-config';

package/dist/types/artifacts/themes/atlassian-dark-future.d.ts

@@ -0,0 +1,7 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::d075fc63f2fcbc4c48f9221541c1d067>>
+ * @codegenCommand yarn build tokens
+ */
+declare const _default: "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: dark;\n  --ds-background-disabled: #B3DF72;\n}\n";
+export default _default;

package/dist/types/artifacts/themes/atlassian-light-future.d.ts

@@ -0,0 +1,7 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::b66f003f52ebad6767e95eaeb646085b>>
+ * @codegenCommand yarn build tokens
+ */
+declare const _default: "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: light;\n  --ds-background-disabled: #28311B;\n}\n";
+export default _default;

package/dist/types/artifacts/tokens-raw/atlassian-dark-future.d.ts

@@ -0,0 +1,29 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::ab55c164418ef8725d43715108841276>>
+ * @codegenCommand yarn build tokens
+ */
+declare const tokens: {
+    attributes: {
+        group: string;
+        state: string;
+        introduced: string;
+        description: string;
+    };
+    value: string;
+    filePath: string;
+    isSource: boolean;
+    original: {
+        attributes: {
+            group: string;
+            state: string;
+            introduced: string;
+            description: string;
+        };
+        value: string;
+    };
+    name: string;
+    path: string[];
+    cleanName: string;
+}[];
+export default tokens;

package/dist/types/artifacts/tokens-raw/atlassian-light-future.d.ts

@@ -0,0 +1,29 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::940fbbe091341b7f246528cfc921961d>>
+ * @codegenCommand yarn build tokens
+ */
+declare const tokens: {
+    attributes: {
+        group: string;
+        state: string;
+        introduced: string;
+        description: string;
+    };
+    value: string;
+    filePath: string;
+    isSource: boolean;
+    original: {
+        attributes: {
+            group: string;
+            state: string;
+            introduced: string;
+            description: string;
+        };
+        value: string;
+    };
+    name: string;
+    path: string[];
+    cleanName: string;
+}[];
+export default tokens;

package/dist/types/theme-config.d.ts

@@ -6,7 +6,7 @@
  * These ids are what the actual theme files/folders are called.
  * style-dictionary will attempt to locate these in the file-system.
  */
-export type Themes = 'atlassian-light' | 'atlassian-light-increased-contrast' | 'atlassian-dark' | 'atlassian-dark-increased-contrast' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography-minor3' | 'atlassian-typography-adg3';
+export type Themes = 'atlassian-light' | 'atlassian-light-future' | 'atlassian-light-increased-contrast' | 'atlassian-dark' | 'atlassian-dark-future' | 'atlassian-dark-increased-contrast' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography-minor3' | 'atlassian-typography-adg3';
 export type ThemeFileNames = Themes;
 /**
  * ThemeOverrides: The internal identifier of a theme override. Which are themes that contain
@@ -42,7 +42,7 @@ export type DataContrastModes = 'more' | 'no-preference' | 'auto';
  *
  * These ids must be kebab case
  */
-export declare const themeIds: readonly ["light-increased-contrast", "light", "dark", "dark-increased-contrast", "legacy-light", "legacy-dark", "spacing", "shape", "typography-adg3", "typography-minor3"];
+export declare const themeIds: readonly ["light-increased-contrast", "light", "light-future", "dark", "dark-future", "dark-increased-contrast", "legacy-light", "legacy-dark", "spacing", "shape", "typography-adg3", "typography-minor3"];
 export type ThemeIds = (typeof themeIds)[number];
 /**
  * Theme override ids: the equivalent of themeIds for theme overrides.
@@ -50,7 +50,7 @@ export type ThemeIds = (typeof themeIds)[number];
  */
 export declare const themeOverrideIds: readonly ["light-new-input-border", "dark-new-input-border"];
 export type ThemeOverrideIds = (typeof themeOverrideIds)[number];
-export declare const themeIdsWithOverrides: readonly ["light-increased-contrast", "light", "dark", "dark-increased-contrast", "legacy-light", "legacy-dark", "spacing", "shape", "typography-adg3", "typography-minor3", "light-new-input-border", "dark-new-input-border"];
+export declare const themeIdsWithOverrides: readonly ["light-increased-contrast", "light", "light-future", "dark", "dark-future", "dark-increased-contrast", "legacy-light", "legacy-dark", "spacing", "shape", "typography-adg3", "typography-minor3", "light-new-input-border", "dark-new-input-border"];
 export type ThemeIdsWithOverrides = (typeof themeIdsWithOverrides)[number];
 /**
  * Theme to use a base. This will create the theme as
@@ -115,8 +115,8 @@ export interface ThemeOptionsSchema {
  * ThemeState: the standard representation of an app's current theme and preferences
  */
 export interface ThemeState {
-    light: Extract<ThemeIds, 'light' | 'dark' | 'legacy-dark' | 'legacy-light' | 'light-increased-contrast' | 'dark-increased-contrast'>;
-    dark: Extract<ThemeIds, 'light' | 'dark' | 'legacy-dark' | 'legacy-light' | 'light-increased-contrast' | 'dark-increased-contrast'>;
+    light: Extract<ThemeIds, 'light' | 'light-future' | 'dark' | 'dark-future' | 'legacy-dark' | 'legacy-light' | 'light-increased-contrast' | 'dark-increased-contrast'>;
+    dark: Extract<ThemeIds, 'light' | 'light-future' | 'dark' | 'dark-future' | 'legacy-dark' | 'legacy-light' | 'light-increased-contrast' | 'dark-increased-contrast'>;
     colorMode: ThemeColorModes;
     contrastMode: ThemeContrastModes;
     shape?: Extract<ThemeIds, 'shape'>;

package/dist/types-ts4.5/artifacts/theme-import-map.d.ts

@@ -6,7 +6,7 @@
  * This allows users to compose their themes and only use the tokens that are requested.
  * When a new theme is created, the import should automatically be added to the map
  *
- * @codegen <<SignedSource::da31df0b9dea8584d4ae7e0ad251f3dd>>
+ * @codegen <<SignedSource::6c438d052bfcec2f42bfb917a01beef9>>
  * @codegenCommand yarn build tokens
  */
 import { ThemeIds, ThemeOverrideIds } from '../theme-config';

package/dist/types-ts4.5/artifacts/themes/atlassian-dark-future.d.ts

@@ -0,0 +1,7 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::d075fc63f2fcbc4c48f9221541c1d067>>
+ * @codegenCommand yarn build tokens
+ */
+declare const _default: "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: dark;\n  --ds-background-disabled: #B3DF72;\n}\n";
+export default _default;

package/dist/types-ts4.5/artifacts/themes/atlassian-light-future.d.ts

@@ -0,0 +1,7 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::b66f003f52ebad6767e95eaeb646085b>>
+ * @codegenCommand yarn build tokens
+ */
+declare const _default: "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: light;\n  --ds-background-disabled: #28311B;\n}\n";
+export default _default;

package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-future.d.ts

@@ -0,0 +1,29 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::ab55c164418ef8725d43715108841276>>
+ * @codegenCommand yarn build tokens
+ */
+declare const tokens: {
+    attributes: {
+        group: string;
+        state: string;
+        introduced: string;
+        description: string;
+    };
+    value: string;
+    filePath: string;
+    isSource: boolean;
+    original: {
+        attributes: {
+            group: string;
+            state: string;
+            introduced: string;
+            description: string;
+        };
+        value: string;
+    };
+    name: string;
+    path: string[];
+    cleanName: string;
+}[];
+export default tokens;

package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-future.d.ts

@@ -0,0 +1,29 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::940fbbe091341b7f246528cfc921961d>>
+ * @codegenCommand yarn build tokens
+ */
+declare const tokens: {
+    attributes: {
+        group: string;
+        state: string;
+        introduced: string;
+        description: string;
+    };
+    value: string;
+    filePath: string;
+    isSource: boolean;
+    original: {
+        attributes: {
+            group: string;
+            state: string;
+            introduced: string;
+            description: string;
+        };
+        value: string;
+    };
+    name: string;
+    path: string[];
+    cleanName: string;
+}[];
+export default tokens;

package/dist/types-ts4.5/theme-config.d.ts

@@ -6,7 +6,7 @@
  * These ids are what the actual theme files/folders are called.
  * style-dictionary will attempt to locate these in the file-system.
  */
-export type Themes = 'atlassian-light' | 'atlassian-light-increased-contrast' | 'atlassian-dark' | 'atlassian-dark-increased-contrast' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography-minor3' | 'atlassian-typography-adg3';
+export type Themes = 'atlassian-light' | 'atlassian-light-future' | 'atlassian-light-increased-contrast' | 'atlassian-dark' | 'atlassian-dark-future' | 'atlassian-dark-increased-contrast' | 'atlassian-legacy-light' | 'atlassian-legacy-dark' | 'atlassian-shape' | 'atlassian-spacing' | 'atlassian-typography-minor3' | 'atlassian-typography-adg3';
 export type ThemeFileNames = Themes;
 /**
  * ThemeOverrides: The internal identifier of a theme override. Which are themes that contain
@@ -53,7 +53,9 @@ export type DataContrastModes = 'more' | 'no-preference' | 'auto';
 export declare const themeIds: readonly [
     "light-increased-contrast",
     "light",
+    "light-future",
     "dark",
+    "dark-future",
     "dark-increased-contrast",
     "legacy-light",
     "legacy-dark",
@@ -75,7 +77,9 @@ export type ThemeOverrideIds = (typeof themeOverrideIds)[number];
 export declare const themeIdsWithOverrides: readonly [
     "light-increased-contrast",
     "light",
+    "light-future",
     "dark",
+    "dark-future",
     "dark-increased-contrast",
     "legacy-light",
     "legacy-dark",
@@ -150,8 +154,8 @@ export interface ThemeOptionsSchema {
  * ThemeState: the standard representation of an app's current theme and preferences
  */
 export interface ThemeState {
-    light: Extract<ThemeIds, 'light' | 'dark' | 'legacy-dark' | 'legacy-light' | 'light-increased-contrast' | 'dark-increased-contrast'>;
-    dark: Extract<ThemeIds, 'light' | 'dark' | 'legacy-dark' | 'legacy-light' | 'light-increased-contrast' | 'dark-increased-contrast'>;
+    light: Extract<ThemeIds, 'light' | 'light-future' | 'dark' | 'dark-future' | 'legacy-dark' | 'legacy-light' | 'light-increased-contrast' | 'dark-increased-contrast'>;
+    dark: Extract<ThemeIds, 'light' | 'light-future' | 'dark' | 'dark-future' | 'legacy-dark' | 'legacy-light' | 'light-increased-contrast' | 'dark-increased-contrast'>;
     colorMode: ThemeColorModes;
     contrastMode: ThemeContrastModes;
     shape?: Extract<ThemeIds, 'shape'>;

package/figma/atlassian-dark-future.json

@@ -0,0 +1,15 @@
+{
+  "name": "Dark future",
+  "tokens": {
+    "Dark future/color.background.disabled": {
+      "attributes": {
+        "group": "paint",
+        "state": "active",
+        "introduced": "0.0.15",
+        "description": "Use for backgrounds of elements in a disabled state."
+      },
+      "value": "#B3DF72"
+    }
+  },
+  "renameMap": {}
+}

package/figma/atlassian-light-future.json

@@ -0,0 +1,15 @@
+{
+  "name": "Light future",
+  "tokens": {
+    "Light future/color.background.disabled": {
+      "attributes": {
+        "group": "paint",
+        "state": "active",
+        "introduced": "0.0.15",
+        "description": "Use for backgrounds of elements in a disabled state."
+      },
+      "value": "#28311B"
+    }
+  },
+  "renameMap": {}
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/tokens",
-  "version": "1.30.0",
+  "version": "1.31.0",
   "description": "Design tokens are the single source of truth to name and store design decisions.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"