@atlaskit/tokens 0.10.16 → 0.10.19

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

@@ -7,7 +7,7 @@ exports.default = void 0;
 
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::f6a9d19d9e568ee23ce24a7127ceb09c>>
+ * @codegen <<SignedSource::6977decc7ef870a337b1171d6775d9dc>>
  * @codegenCommand yarn build tokens
  */
 var tokens = [{
@@ -6486,7 +6486,7 @@ var tokens = [{
     "group": "shadow",
     "state": "active",
     "introduced": "0.6.0",
-    "description": "Use to create a shadow when content scolls under other content."
+    "description": "Use to create a shadow when content scrolls under other content."
   },
   "value": [{
     "radius": 8,
@@ -6512,7 +6512,7 @@ var tokens = [{
       "group": "shadow",
       "state": "active",
       "introduced": "0.6.0",
-      "description": "Use to create a shadow when content scolls under other content."
+      "description": "Use to create a shadow when content scrolls under other content."
     },
     "value": [{
       "radius": 8,
@@ -6671,6 +6671,48 @@ var tokens = [{
   },
   "name": "elevation.surface.overlay",
   "path": ["elevation", "surface", "overlay"]
+}, {
+  "attributes": {
+    "group": "opacity",
+    "state": "active",
+    "introduced": "0.10.13",
+    "description": "Apply to images when in a disabled state."
+  },
+  "value": 0.4,
+  "filePath": "src/tokens/atlassian-light/opacity/opacity.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "opacity",
+      "state": "active",
+      "introduced": "0.10.13",
+      "description": "Apply to images when in a disabled state."
+    },
+    "value": "Opacity40"
+  },
+  "name": "opacity.disabled",
+  "path": ["opacity", "disabled"]
+}, {
+  "attributes": {
+    "group": "opacity",
+    "state": "active",
+    "introduced": "0.10.13",
+    "description": "Apply to content that sits under a loading spinner."
+  },
+  "value": 0.2,
+  "filePath": "src/tokens/atlassian-light/opacity/opacity.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "opacity",
+      "state": "active",
+      "introduced": "0.10.13",
+      "description": "Apply to content that sits under a loading spinner."
+    },
+    "value": "Opacity20"
+  },
+  "name": "opacity.loading",
+  "path": ["opacity", "loading"]
 }, {
   "attributes": {
     "group": "raw",

package/dist/cjs/constants.js

@@ -3,19 +3,23 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TOKEN_NOT_FOUND_CSS_VAR = exports.THEME_NAME_MAP = exports.THEME_DATA_ATTRIBUTE = exports.THEMES = exports.DEFAULT_THEME = exports.CSS_PREFIX = void 0;
-var THEMES = ['light', 'dark'];
+exports.TOKEN_NOT_FOUND_CSS_VAR = exports.THEME_NAME_MAP = exports.THEME_DATA_ATTRIBUTE = exports.THEMES = exports.DEFAULT_THEME = exports.CSS_VAR_FULL = exports.CSS_PREFIX = void 0;
+var THEMES = ['light', 'dark', 'legacy-light', 'legacy-dark'];
 exports.THEMES = THEMES;
 var THEME_DATA_ATTRIBUTE = 'data-theme';
 exports.THEME_DATA_ATTRIBUTE = THEME_DATA_ATTRIBUTE;
 var DEFAULT_THEME = 'light';
 exports.DEFAULT_THEME = DEFAULT_THEME;
-var CSS_PREFIX = 'ds'; // Maps the longer theme name to a shorthand used in css/code
-
+var CSS_PREFIX = 'ds';
 exports.CSS_PREFIX = CSS_PREFIX;
+var CSS_VAR_FULL = ['opacity']; // Maps the longer theme name to a shorthand used in css/code
+
+exports.CSS_VAR_FULL = CSS_VAR_FULL;
 var THEME_NAME_MAP = {
   'atlassian-light': 'light',
-  'atlassian-dark': 'dark'
+  'atlassian-dark': 'dark',
+  'atlassian-legacy-light': 'legacy-light',
+  'atlassian-legacy-dark': 'legacy-dark'
 };
 exports.THEME_NAME_MAP = THEME_NAME_MAP;
 var TOKEN_NOT_FOUND_CSS_VAR = "--".concat(CSS_PREFIX, "-token-not-found");

package/dist/cjs/get-token.js

@@ -14,7 +14,7 @@ var _tokenNames = _interopRequireDefault(require("./artifacts/token-names"));
 var _constants = require("./constants");
 
 var name = "@atlaskit/tokens";
-var version = "0.10.16";
+var version = "0.10.19";
 
 function token(path, fallback) {
   var token = _tokenNames.default[path];

package/dist/cjs/palettes/legacy-palette.js

@@ -11,8 +11,33 @@ exports.default = void 0;
  * This palette should be exclusively used for backwards compatible themes
  */
 var palette = {
+  value: {
+    opacity: {
+      Opacity20: {
+        value: 0.2,
+        attributes: {
+          group: 'palette',
+          category: 'opacity'
+        }
+      },
+      Opacity40: {
+        value: 0.4,
+        attributes: {
+          group: 'palette',
+          category: 'opacity'
+        }
+      }
+    }
+  },
   color: {
     palette: {
+      transparent: {
+        value: 'transparent',
+        attributes: {
+          group: 'palette',
+          category: 'red'
+        }
+      },
       R50: {
         value: '#FFEBE6',
         attributes: {
@@ -441,119 +466,119 @@ var palette = {
         }
       },
       N10A: {
-        value: 'rgba(9, 30, 66, 0.02)',
+        value: '#091e425',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N20A: {
-        value: 'rgba(9, 30, 66, 0.04)',
+        value: '#091e42a',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N30A: {
-        value: 'rgba(9, 30, 66, 0.08)',
+        value: '#091e4214',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N40A: {
-        value: 'rgba(9, 30, 66, 0.13)',
+        value: '#091e4221',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N50A: {
-        value: 'rgba(9, 30, 66, 0.25)',
+        value: '#091e423f',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N60A: {
-        value: 'rgba(9, 30, 66, 0.31)',
+        value: '#091e424f',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N70A: {
-        value: 'rgba(9, 30, 66, 0.36)',
+        value: '#091e425b',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N80A: {
-        value: 'rgba(9, 30, 66, 0.42)',
+        value: '#091e426b',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N90A: {
-        value: 'rgba(9, 30, 66, 0.48)',
+        value: '#091e427a',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N100A: {
-        value: 'rgba(9, 30, 66, 0.54)',
+        value: '#091e4289',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N200A: {
-        value: 'rgba(9, 30, 66, 0.60)',
+        value: '#091e4299',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N300A: {
-        value: 'rgba(9, 30, 66, 0.66)',
+        value: '#091e42a8',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N400A: {
-        value: 'rgba(9, 30, 66, 0.71)',
+        value: '#091e42b5',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N500A: {
-        value: 'rgba(9, 30, 66, 0.77)',
+        value: '#091e42c4',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N600A: {
-        value: 'rgba(9, 30, 66, 0.82)',
+        value: '#091e42d1',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N700A: {
-        value: 'rgba(9, 30, 66, 0.89)',
+        value: '#091e42e2',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
         }
       },
       N800A: {
-        value: 'rgba(9, 30, 66, 0.95)',
+        value: '#091e42f2',
         attributes: {
           group: 'palette',
           category: 'light mode neutral'
@@ -693,119 +718,119 @@ var palette = {
         }
       },
       DN800A: {
-        value: 'rgba(13, 20, 36, 0.06)',
+        value: '#0d1424f',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN700A: {
-        value: 'rgba(13, 20, 36, 0.14)',
+        value: '#0d142423',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN600A: {
-        value: 'rgba(13, 20, 36, 0.18)',
+        value: '#0d14242d',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN500A: {
-        value: 'rgba(13, 20, 36, 0.29)',
+        value: '#0d142449',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN400A: {
-        value: 'rgba(13, 20, 36, 0.36)',
+        value: '#0d14245b',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN300A: {
-        value: 'rgba(13, 20, 36, 0.40)',
+        value: '#0d142466',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN200A: {
-        value: 'rgba(13, 20, 36, 0.47)',
+        value: '#0d142477',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN100A: {
-        value: 'rgba(13, 20, 36, 0.53)',
+        value: '#0d142487',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN90A: {
-        value: 'rgba(13, 20, 36, 0.63)',
+        value: '#0d1424a0',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN80A: {
-        value: 'rgba(13, 20, 36, 0.73)',
+        value: '#0d1424ba',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN70A: {
-        value: 'rgba(13, 20, 36, 0.78)',
+        value: '#0d1424c6',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN60A: {
-        value: 'rgba(13, 20, 36, 0.81)',
+        value: '#0d1424ce',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN50A: {
-        value: 'rgba(13, 20, 36, 0.85)',
+        value: '#0d1424d8',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN40A: {
-        value: 'rgba(13, 20, 36, 0.89)',
+        value: '#0d1424e2',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN30A: {
-        value: 'rgba(13, 20, 36, 0.92)',
+        value: '#0d1424ea',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN20A: {
-        value: 'rgba(13, 20, 36, 0.95)',
+        value: '#0d1424f2',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'
         }
       },
       DN10A: {
-        value: 'rgba(13, 20, 36, 0.97)',
+        value: '#0d1424f7',
         attributes: {
           group: 'palette',
           category: 'dark mode neutral'

package/dist/cjs/palettes/palette.js

@@ -5,6 +5,24 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var palette = {
+  value: {
+    opacity: {
+      Opacity20: {
+        value: 0.2,
+        attributes: {
+          group: 'palette',
+          category: 'opacity'
+        }
+      },
+      Opacity40: {
+        value: 0.4,
+        attributes: {
+          group: 'palette',
+          category: 'opacity'
+        }
+      }
+    }
+  },
   color: {
     palette: {
       B100: {

package/dist/cjs/tokens/atlassian-dark/opacity/opacity.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var opacity = {
+  opacity: {
+    disabled: {
+      value: 'Opacity40'
+    },
+    loading: {
+      value: 'Opacity20'
+    }
+  }
+};
+var _default = opacity;
+exports.default = _default;