@atlaskit/tokens 0.13.5 → 1.1.0

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

@@ -4,7 +4,6 @@ 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::7bcab6ad73069f6baf12316783222835>>

package/dist/cjs/artifacts/typescript/atlassian-dark-token-names.js

@@ -4,7 +4,6 @@ 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::67b1320ced47c8c76310c2cf5f057502>>

package/dist/cjs/artifacts/typescript/atlassian-light-token-names.js

@@ -4,7 +4,6 @@ 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::67b1320ced47c8c76310c2cf5f057502>>

package/dist/cjs/babel-plugin/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "default", {
     return _plugin.default;
   }
 });
-
 var _plugin = _interopRequireDefault(require("./plugin"));

package/dist/cjs/babel-plugin/plugin.js

@@ -1,24 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = plugin;
-
 var t = _interopRequireWildcard(require("@babel/types"));
-
 var _tokenDefaultValues = _interopRequireDefault(require("../artifacts/token-default-values"));
-
 var _tokenNames = _interopRequireDefault(require("../artifacts/token-names"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function plugin() {
   return {
     visitor: {
@@ -29,49 +21,44 @@ function plugin() {
               function CallExpression(_x) {
                 return _CallExpression.apply(this, arguments);
               }
-
               CallExpression.toString = function () {
                 return _CallExpression.toString();
               };
-
               return CallExpression;
             }(function (path) {
               var tokenImportScope = getTokenImportScope(path);
-
               if (!tokenImportScope) {
                 return;
-              } // Check arguments have correct format
-
+              }
 
+              // Check arguments have correct format
               if (!path.node.arguments[0]) {
                 throw new Error("token() requires at least one argument");
               } else if (!t.isStringLiteral(path.node.arguments[0])) {
                 throw new Error("token() must have a string as the first argument");
               } else if (path.node.arguments.length > 2) {
                 throw new Error("token() does not accept ".concat(path.node.arguments.length, " arguments"));
-              } // Check the token exists
-
+              }
 
+              // Check the token exists
               var tokenName = path.node.arguments[0].value;
               var cssTokenValue = _tokenNames.default[tokenName];
-
               if (!cssTokenValue) {
                 throw new Error("token '".concat(tokenName, "' does not exist"));
               }
+              var replacementNode;
 
-              var replacementNode; // if no fallback is set, optionally find one from the default theme
-
+              // if no fallback is set, optionally find one from the default theme
               if (path.node.arguments.length < 2) {
                 if (state.opts.shouldUseAutoFallback) {
                   replacementNode = t.stringLiteral("var(".concat(cssTokenValue, ", ").concat(getDefaultFallback(tokenName), ")"));
                 } else {
                   replacementNode = t.stringLiteral("var(".concat(cssTokenValue, ")"));
                 }
-              } // Handle fallbacks
-
+              }
 
+              // Handle fallbacks
               var fallback = path.node.arguments[1];
-
               if (t.isStringLiteral(fallback)) {
                 // String literals can be concatenated into css variable call
                 // Empty string fallbacks are ignored. For now, as the user did specify a fallback, no default is inserted
@@ -86,11 +73,11 @@ function plugin() {
                   raw: ')',
                   cooked: ')'
                 }, true)], [fallback]);
-              } // Replace path and call scope.crawl() to refresh the scope bindings + references
-
-
-              replacementNode && path.replaceWith(replacementNode); // @ts-ignore crawl is a valid property
+              }
 
+              // Replace path and call scope.crawl() to refresh the scope bindings + references
+              replacementNode && path.replaceWith(replacementNode);
+              // @ts-ignore crawl is a valid property
               tokenImportScope.crawl();
             })
           });
@@ -102,23 +89,22 @@ function plugin() {
               if (path.node.source.value !== '@atlaskit/tokens') {
                 return;
               }
-
               path.get('specifiers').forEach(function (specifier) {
                 if (!specifier.isImportSpecifier()) {
                   return;
                 }
-
                 if (getNonAliasedImportName(specifier.node) !== 'token') {
                   return;
                 }
+                var binding = path.scope.bindings[getAliasedImportName(specifier.node)];
 
-                var binding = path.scope.bindings[getAliasedImportName(specifier.node)]; // if no longer used, remove
-
+                // if no longer used, remove
                 if (!binding.referenced) {
                   specifier.remove();
                 }
-              }); // remove '@atlaskit/tokens' import if it is no longer needed
+              });
 
+              // remove '@atlaskit/tokens' import if it is no longer needed
               if (path.get('specifiers').length === 0) {
                 path.remove();
               }
@@ -129,55 +115,43 @@ function plugin() {
     }
   };
 }
-
 function getDefaultFallback(tokenName) {
   return _tokenDefaultValues.default[tokenName];
 }
-
 function getNonAliasedImportName(node) {
   if (t.isIdentifier(node.imported)) {
     return node.imported.name;
   }
-
   return node.imported.value;
 }
-
 function getAliasedImportName(node) {
   return node.local.name;
 }
+
 /**
  * Determine if the current call is to a token function, and
  * return the relevant scope
  */
-
-
 function getTokenImportScope(path) {
   var callee = path.node.callee;
-
   if (!t.isIdentifier(callee)) {
     return undefined;
   }
-
   var binding = getTokenBinding(path.scope, callee.name);
-
   if (!binding || !t.isImportSpecifier(binding.path.node)) {
     return undefined;
   }
-
   if (binding.path.parent && t.isImportDeclaration(binding.path.parent)) {
     if (binding.path.parent.source.value !== '@atlaskit/tokens') {
       return undefined;
     }
   }
-
   return getNonAliasedImportName(binding.path.node) === 'token' ? binding.scope : undefined;
 }
-
 function getTokenBinding(scope, name) {
   if (!scope) {
     return undefined;
   }
-
   if (scope.bindings[name]) {
     return scope.bindings[name];
   } else {

package/dist/cjs/entry-points/babel-plugin.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "default", {
     return _plugin.default;
   }
 });
-
 var _plugin = _interopRequireDefault(require("../babel-plugin/plugin"));

package/dist/cjs/entry-points/palettes-raw.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "default", {
     return _palette.default;
   }
 });
-
 var _palette = _interopRequireDefault(require("../artifacts/palettes-raw/palette"));

package/dist/cjs/entry-points/rename-mapping.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "default", {
     return _replacementMapping.default;
   }
 });
-
 var _replacementMapping = _interopRequireDefault(require("../artifacts/replacement-mapping"));

package/dist/cjs/entry-points/token-ids.js

@@ -21,5 +21,4 @@ Object.defineProperty(exports, "getTokenId", {
     return _tokenIds.getTokenId;
   }
 });
-
 var _tokenIds = require("../utils/token-ids");

package/dist/cjs/entry-points/token-names.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "default", {
     return _tokenNames.default;
   }
 });
-
 var _tokenNames = _interopRequireDefault(require("../artifacts/token-names"));

package/dist/cjs/entry-points/tokens-raw.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -29,11 +28,7 @@ Object.defineProperty(exports, "typography", {
     return _atlassianTypography.default;
   }
 });
-
 var _atlassianLight = _interopRequireDefault(require("../artifacts/tokens-raw/atlassian-light"));
-
 var _atlassianDark = _interopRequireDefault(require("../artifacts/tokens-raw/atlassian-dark"));
-
 var _atlassianSpacing = _interopRequireDefault(require("../artifacts/tokens-raw/atlassian-spacing"));
-
 var _atlassianTypography = _interopRequireDefault(require("../artifacts/tokens-raw/atlassian-typography"));

package/dist/cjs/get-global-theme.js

@@ -0,0 +1,30 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getGlobalTheme = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _constants = require("./constants");
+var _themeConfig = require("./theme-config");
+var _themeStateTransformer = require("./utils/theme-state-transformer");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var isThemeColorMode = function isThemeColorMode(colorMode) {
+  return _themeConfig.themeColorModes.find(function (mode) {
+    return mode === colorMode;
+  }) !== undefined;
+};
+var getGlobalTheme = function getGlobalTheme() {
+  if (typeof document === 'undefined') {
+    return {};
+  }
+  var element = document.documentElement;
+  var colorMode = element.getAttribute(_constants.COLOR_MODE_ATTRIBUTE) || '';
+  var theme = element.getAttribute(_constants.THEME_DATA_ATTRIBUTE) || '';
+  return _objectSpread(_objectSpread({}, (0, _themeStateTransformer.themeStringToObject)(theme)), isThemeColorMode(colorMode) && {
+    colorMode: colorMode
+  });
+};
+exports.getGlobalTheme = getGlobalTheme;

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

@@ -1,19 +1,14 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 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 = "0.13.5";
-
+var version = "1.1.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.
@@ -39,19 +34,15 @@ function getTokenValue(tokenId) {
   var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   var token = _tokenNames.default[tokenId];
   var tokenValue = fallback;
-
   if (process.env.NODE_ENV !== 'production' && !token) {
     (0, _warnOnce.default)("Unknown token id at path: ".concat(tokenId, " for ").concat(name, "@").concat(version));
   }
-
   if (typeof window === 'undefined') {
     return tokenValue;
   }
-
   tokenValue = window.getComputedStyle(document.documentElement).getPropertyValue(token);
   tokenValue = tokenValue || fallback;
   return tokenValue;
 }
-
 var _default = getTokenValue;
 exports.default = _default;

package/dist/cjs/get-token.js

@@ -1,21 +1,15 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 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 = "0.13.5";
-
+var version = "1.1.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.
@@ -40,20 +34,16 @@ var version = "0.13.5";
  */
 function token(path, fallback) {
   var token = _tokenNames.default[path];
-
   if (process.env.NODE_ENV !== 'production' && !token) {
-    token = _tokenNames.default['utility.UNSAFE_util.MISSING_TOKEN'];
     (0, _warnOnce.default)("Unknown token id at path: ".concat(path, " for ").concat(name, "@").concat(version));
-  } // if the token is not found - replacing it with variable name without any value, to avoid it being undefined which would result in invalid css
-
+  }
 
+  // if the token is not found - replacing it with variable name without any value, to avoid it being undefined which would result in invalid css
   if (!token) {
     token = _constants.TOKEN_NOT_FOUND_CSS_VAR;
   }
-
   var tokenCall = fallback ? "var(".concat(token, ", ").concat(fallback, ")") : "var(".concat(token, ")");
   return tokenCall;
 }
-
 var _default = token;
 exports.default = _default;

package/dist/cjs/index.js

@@ -1,14 +1,38 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 Object.defineProperty(exports, "ThemeMutationObserver", {
   enumerable: true,
   get: function get() {
-    return _themeChangeObserver.ThemeMutationObserver;
+    return _themeMutationObserver.ThemeMutationObserver;
+  }
+});
+Object.defineProperty(exports, "getGlobalTheme", {
+  enumerable: true,
+  get: function get() {
+    return _getGlobalTheme.getGlobalTheme;
+  }
+});
+Object.defineProperty(exports, "getSSRAutoScript", {
+  enumerable: true,
+  get: function get() {
+    return _setGlobalTheme.getSSRAutoScript;
+  }
+});
+Object.defineProperty(exports, "getThemeHtmlAttrs", {
+  enumerable: true,
+  get: function get() {
+    return _setGlobalTheme.getThemeHtmlAttrs;
+  }
+});
+Object.defineProperty(exports, "getThemeStyles", {
+  enumerable: true,
+  get: function get() {
+    return _setGlobalTheme.getThemeStyles;
   }
 });
 Object.defineProperty(exports, "getTokenValue", {
@@ -29,6 +53,18 @@ Object.defineProperty(exports, "themeConfig", {
     return _themeConfig.default;
   }
 });
+Object.defineProperty(exports, "themeObjectToString", {
+  enumerable: true,
+  get: function get() {
+    return _themeStateTransformer.themeObjectToString;
+  }
+});
+Object.defineProperty(exports, "themeStringToObject", {
+  enumerable: true,
+  get: function get() {
+    return _themeStateTransformer.themeStringToObject;
+  }
+});
 Object.defineProperty(exports, "token", {
   enumerable: true,
   get: function get() {
@@ -38,16 +74,16 @@ Object.defineProperty(exports, "token", {
 Object.defineProperty(exports, "useThemeObserver", {
   enumerable: true,
   get: function get() {
-    return _themeChangeObserver.useThemeObserver;
+    return _useThemeObserver.useThemeObserver;
   }
 });
-
 var _getToken = _interopRequireDefault(require("./get-token"));
-
 var _getTokenValue = _interopRequireDefault(require("./get-token-value"));
-
-var _setGlobalTheme = _interopRequireDefault(require("./set-global-theme"));
-
+var _setGlobalTheme = _interopRequireWildcard(require("./set-global-theme"));
 var _themeConfig = _interopRequireDefault(require("./theme-config"));
-
-var _themeChangeObserver = require("./theme-change-observer");
+var _useThemeObserver = require("./use-theme-observer");
+var _themeMutationObserver = require("./theme-mutation-observer");
+var _getGlobalTheme = require("./get-global-theme");
+var _themeStateTransformer = require("./utils/theme-state-transformer");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

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

@@ -4,12 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 /**
  * Legacy color palette sourced from: packages/design-system/theme/src/colors.tsx
  *
  * This palette should be exclusively used for backwards compatible themes
  */
+
 var palette = {
   value: {
     opacity: {

package/dist/cjs/palettes/spacing-scale.js

@@ -4,10 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 /**
  * Types are inferred from the base tokens below
  */
+
 var baseSpacingTokens = {
   Space0: {
     value: '0',

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

@@ -1,18 +1,13 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var lineHeightScale = {
   lineHeight: {
     LineHeight100: {