@atlaskit/code 14.6.9 → 15.1.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/code
 
+## 15.1.0
+
+### Minor Changes
+
+- [#42903](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/42903) [`96e3a0ee5b7`](https://bitbucket.org/atlassian/atlassian-frontend/commits/96e3a0ee5b7) - [ux] Add support for Dockerfile, HCL, NGINX and Protobuf languages
+
+## 15.0.0
+
+### Major Changes
+
+- [#41498](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41498) [`73adf14896c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/73adf14896c) - Remove usage of legacy theming from the Code component and refactor where necessary to accomodate the updated API.
+
 ## 14.6.9
 
 ### Patch Changes

package/dist/cjs/code-block.js

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = require("react");
 var _react2 = require("@emotion/react");
-var _components = require("@atlaskit/theme/components");
 var _useHighlight = require("./internal/hooks/use-highlight");
 var _styles = require("./internal/theme/styles");
 var _getNormalizedLanguage = require("./internal/utils/get-normalized-language");
@@ -44,10 +43,9 @@ var CodeBlock = /*#__PURE__*/(0, _react.memo)(function CodeBlock(_ref) {
     _ref$shouldWrapLongLi = _ref.shouldWrapLongLines,
     shouldWrapLongLines = _ref$shouldWrapLongLi === void 0 ? false : _ref$shouldWrapLongLi;
   var numLines = (text || '').split('\n').length;
-  var globalTheme = (0, _components.useGlobalTheme)();
   var theme = (0, _react.useMemo)(function () {
-    return (0, _styles.getCodeBlockTheme)(globalTheme, numLines);
-  }, [globalTheme, numLines]);
+    return (0, _styles.getCodeBlockTheme)(numLines);
+  }, [numLines]);
   var getStyles = (0, _react.useMemo)(function () {
     return (0, _styles.getCodeBlockStyles)(theme);
   }, [theme]);

package/dist/cjs/code.js

@@ -16,7 +16,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
-var _components = require("@atlaskit/theme/components");
 var _bidiWarning = _interopRequireDefault(require("./bidi-warning"));
 var _bidiWarningDecorator = _interopRequireDefault(require("./bidi-warning/bidi-warning-decorator"));
 var _styles = require("./internal/theme/styles");
@@ -37,10 +36,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var Code = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(function Code(_ref, ref) {
   var testId = _ref.testId,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var theme = (0, _components.useGlobalTheme)();
-  var styles = (0, _react.useMemo)(function () {
-    return (0, _react2.css)((0, _styles.getCodeStyles)(theme));
-  }, [theme]);
+  var styles = (0, _react2.css)((0, _styles.getCodeStyles)());
   var children = props.children,
     _props$codeBidiWarnin = props.codeBidiWarnings,
     codeBidiWarnings = _props$codeBidiWarnin === void 0 ? true : _props$codeBidiWarnin,

package/dist/cjs/constants.js

@@ -11,6 +11,8 @@ Object.defineProperty(exports, "CODE_BLOCK_SELECTOR", {
 });
 exports.SUPPORTED_LANGUAGES = void 0;
 var _constants = require("./internal/theme/constants");
+// The full list of languages that can potentially be supported is found in
+// https://prismjs.com/#supported-languages
 var SUPPORTED_LANGUAGES = exports.SUPPORTED_LANGUAGES = [{
   name: 'PHP',
   alias: ['php', 'php3', 'php4', 'php5'],
@@ -319,4 +321,20 @@ var SUPPORTED_LANGUAGES = exports.SUPPORTED_LANGUAGES = [{
   name: 'SplunkSPL',
   alias: ['splunk-spl'],
   value: 'splunk-spl'
+}, {
+  name: 'Dockerfile',
+  alias: ['docker', 'dockerfile'],
+  value: 'dockerfile'
+}, {
+  name: 'HCL',
+  alias: ['hcl', 'terraform'],
+  value: 'hcl'
+}, {
+  name: 'NGINX',
+  alias: ['nginx'],
+  value: 'nginx'
+}, {
+  name: 'Protocol Buffers',
+  alias: ['protobuf', 'proto'],
+  value: 'protobuf'
 }];

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

@@ -9,7 +9,6 @@ exports.getColorPalette = exports.getBaseTheme = exports.defaultBaseTheme = expo
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
 var colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
-var _components = require("@atlaskit/theme/components");
 var _constants = require("@atlaskit/theme/constants");
 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; }
@@ -19,224 +18,66 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 // accessible color options for Teal and Yellow and +20A
 var T800 = '#067384';
 var Y1100 = '#7A5D1A';
-var PLUS20 = '#3A434E';
-var getBaseTheme = exports.getBaseTheme = function getBaseTheme(theme) {
+var getBaseTheme = exports.getBaseTheme = function getBaseTheme() {
   return {
     fontFamily: (0, _constants.codeFontFamily)(),
     fontFamilyItalic: "SFMono-MediumItalic, ".concat((0, _constants.codeFontFamily)()),
-    backgroundColor: (0, _components.themed)({
-      light: "var(--ds-background-neutral, ".concat(colors.N20, ")"),
-      dark: "var(--ds-background-neutral, ".concat(colors.DN50, ")")
-    })({
-      theme: theme
-    }),
-    textColor: (0, _components.themed)({
-      light: "var(--ds-text, ".concat(colors.N800, ")"),
-      dark: "var(--ds-text, ".concat(colors.DN800, ")")
-    })({
-      theme: theme
-    }),
-    lineNumberColor: (0, _components.themed)({
-      light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
-      dark: "var(--ds-text-subtlest, ".concat(colors.DN400, ")")
-    })({
-      theme: theme
-    }),
-    lineNumberBgColor: (0, _components.themed)({
-      light: "var(--ds-background-neutral, ".concat(colors.N30, ")"),
-      dark: "var(--ds-background-neutral, ".concat(colors.DN20, ")")
-    })({
-      theme: theme
-    })
+    backgroundColor: "var(--ds-background-neutral, ".concat(colors.N20, ")"),
+    textColor: "var(--ds-text, ".concat(colors.N800, ")"),
+    lineNumberColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
+    lineNumberBgColor: "var(--ds-background-neutral, ".concat(colors.N30, ")")
   };
 };
-var defaultBaseTheme = exports.defaultBaseTheme = getBaseTheme({
-  mode: 'light'
-});
-var getColorPalette = exports.getColorPalette = (0, _memoizeOne.default)(function (theme) {
-  var akTheme = {
-    theme: theme
-  };
+var defaultBaseTheme = exports.defaultBaseTheme = getBaseTheme();
+var getColorPalette = exports.getColorPalette = (0, _memoizeOne.default)(function () {
   return {
-    highlightedLineBgColor: (0, _components.themed)({
-      light: "var(--ds-background-neutral, ".concat(colors.N30, ")"),
-      dark: "var(--ds-background-neutral, ".concat(PLUS20, ")")
-    })(akTheme),
-    highlightedLineBorderColor: (0, _components.themed)({
-      light: "var(--ds-border-focused, ".concat(colors.B200, ")"),
-      dark: "var(--ds-border-focused, ".concat(colors.B100, ")")
-    })(akTheme),
-    substringColor: (0, _components.themed)({
-      light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
-      dark: "var(--ds-text-subtlest, ".concat(colors.DN400, ")")
-    })(akTheme),
-    keywordColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    attributeColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
-    })(akTheme),
-    selectorTagColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    docTagColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-yellow, ".concat(Y1100, ")"),
-      dark: "var(--ds-text-accent-yellow, ".concat(colors.Y300, ")")
-    })(akTheme),
-    nameColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    builtInColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    literalColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    bulletColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    codeColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    regexpColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
-    })(akTheme),
-    symbolColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
-    })(akTheme),
-    variableColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
-    })(akTheme),
-    templateVariableColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
-    })(akTheme),
-    linkColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
-      dark: "var(--ds-text-accent-purple, ".concat(colors.P75, ")")
-    })(akTheme),
-    selectorAttributeColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
-    })(akTheme),
-    selectorPseudoColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T200, ")")
-    })(akTheme),
-    typeColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
-    })(akTheme),
-    stringColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
-      dark: "var(--ds-text-accent-green, ".concat(colors.G200, ")")
-    })(akTheme),
-    selectorIdColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
-    })(akTheme),
-    selectorClassColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
-    })(akTheme),
-    quoteColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
-    })(akTheme),
-    templateTagColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
-    })(akTheme),
-    titleColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
-      dark: "var(--ds-text-accent-purple, ".concat(colors.P75, ")")
-    })(akTheme),
-    sectionColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
-      dark: "var(--ds-text-accent-purple, ".concat(colors.P75, ")")
-    })(akTheme),
-    commentColor: (0, _components.themed)({
-      light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
-      dark: "var(--ds-text-subtlest, ".concat(colors.DN400, ")")
-    })(akTheme),
-    metaKeywordColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
-      dark: "var(--ds-text-accent-green, ".concat(colors.G200, ")")
-    })(akTheme),
-    metaColor: (0, _components.themed)({
-      light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
-      dark: "var(--ds-text-subtlest, ".concat(colors.DN400, ")")
-    })(akTheme),
-    functionColor: (0, _components.themed)({
-      light: "var(--ds-text, ".concat(colors.N800, ")"),
-      dark: "var(--ds-text, ".concat(colors.DN800, ")")
-    })(akTheme),
-    numberColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    prologColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    cdataColor: (0, _components.themed)({
-      light: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
-      dark: "var(--ds-text-subtlest, ".concat(colors.B75, ")")
-    })(akTheme),
-    punctuationColor: (0, _components.themed)({
-      light: "var(--ds-text, ".concat(colors.N800, ")"),
-      dark: "var(--ds-text, ".concat(colors.DN800, ")")
-    })(akTheme),
-    propertyColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
-      dark: "var(--ds-text-accent-purple, ".concat(colors.P75, ")")
-    })(akTheme),
-    constantColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-teal, ".concat(T800, ")"),
-      dark: "var(--ds-text-accent-teal, ".concat(colors.T100, ")")
-    })(akTheme),
-    booleanColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
-      dark: "var(--ds-text-accent-blue, ".concat(colors.B75, ")")
-    })(akTheme),
-    charColor: (0, _components.themed)({
-      light: "var(--ds-text, ".concat(colors.N800, ")"),
-      dark: "var(--ds-text, ".concat(colors.DN800, ")")
-    })(akTheme),
-    insertedColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
-      dark: "var(--ds-text-accent-green, ".concat(colors.B75, ")")
-    })(akTheme),
-    deletedColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-red, ".concat(colors.R500, ")"),
-      dark: "var(--ds-text-accent-red, ".concat(colors.B75, ")")
-    })(akTheme),
-    operatorColor: (0, _components.themed)({
-      light: "var(--ds-text, ".concat(colors.N800, ")"),
-      dark: "var(--ds-text, ".concat(colors.B75, ")")
-    })(akTheme),
-    atruleColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
-      dark: "var(--ds-text-accent-green, ".concat(colors.G200, ")")
-    })(akTheme),
-    importantColor: (0, _components.themed)({
-      light: "var(--ds-text-accent-yellow, ".concat(Y1100, ")"),
-      dark: "var(--ds-text-accent-yellow, ".concat(colors.Y300, ")")
-    })(akTheme)
+    highlightedLineBgColor: "var(--ds-background-neutral, ".concat(colors.N30, ")"),
+    highlightedLineBorderColor: "var(--ds-border-focused, ".concat(colors.B200, ")"),
+    substringColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
+    keywordColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    attributeColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    selectorTagColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    docTagColor: "var(--ds-text-accent-yellow, ".concat(Y1100, ")"),
+    nameColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    builtInColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    literalColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    bulletColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    codeColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    regexpColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    symbolColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    variableColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    templateVariableColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    linkColor: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
+    selectorAttributeColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    selectorPseudoColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    typeColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    stringColor: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
+    selectorIdColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    selectorClassColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    quoteColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    templateTagColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    titleColor: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
+    sectionColor: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
+    commentColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
+    metaKeywordColor: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
+    metaColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
+    functionColor: "var(--ds-text, ".concat(colors.N800, ")"),
+    numberColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    prologColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    cdataColor: "var(--ds-text-subtlest, ".concat(colors.N400, ")"),
+    punctuationColor: "var(--ds-text, ".concat(colors.N800, ")"),
+    propertyColor: "var(--ds-text-accent-purple, ".concat(colors.P300, ")"),
+    constantColor: "var(--ds-text-accent-teal, ".concat(T800, ")"),
+    booleanColor: "var(--ds-text-accent-blue, ".concat(colors.B400, ")"),
+    charColor: "var(--ds-text, ".concat(colors.N800, ")"),
+    insertedColor: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
+    deletedColor: "var(--ds-text-accent-red, ".concat(colors.R500, ")"),
+    operatorColor: "var(--ds-text, ".concat(colors.N800, ")"),
+    atruleColor: "var(--ds-text-accent-green, ".concat(colors.G500, ")"),
+    importantColor: "var(--ds-text-accent-yellow, ".concat(Y1100, ")")
   };
 });
-var getTheme = function getTheme(theme) {
-  return _objectSpread(_objectSpread({}, getBaseTheme(theme)), getColorPalette(theme));
+var getTheme = function getTheme() {
+  return _objectSpread(_objectSpread({}, getBaseTheme()), getColorPalette());
 };
 var _default = exports.default = getTheme;

package/dist/cjs/internal/theme/styles.js

@@ -6,8 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getLineNumWidth = exports.getCodeStyles = exports.getCodeBlockTheme = exports.getCodeBlockStyles = exports.getBaseCodeStyles = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _constants = require("@atlaskit/theme/constants");
-var _constants2 = require("./constants");
+var _constants = require("./constants");
 var _getTheme = require("./get-theme");
 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; }
 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; }
@@ -20,7 +19,7 @@ var getLineNumWidth = exports.getLineNumWidth = function getLineNumWidth(numLine
 var lineNumberStyle = function lineNumberStyle(theme) {
   return {
     // width of the line number gutter
-    minWidth: "calc(".concat(theme.lineNumberWidth, " + ").concat(_constants2.LINE_NUMBER_GUTTER, "px) !important"),
+    minWidth: "calc(".concat(theme.lineNumberWidth, " + ").concat(_constants.LINE_NUMBER_GUTTER, "px) !important"),
     // this needs to be important or it gets overwritten by inline styles
     fontStyle: 'normal !important',
     // this needs to be important or it gets overwritten by inline styles
@@ -28,9 +27,9 @@ var lineNumberStyle = function lineNumberStyle(theme) {
     flexShrink: 0,
     // needed to replicate existing design spec
     boxSizing: 'border-box',
-    paddingRight: "".concat(_constants2.SPACING, "px !important"),
-    paddingLeft: _constants2.SPACING,
-    marginRight: _constants2.SPACING,
+    paddingRight: "".concat(_constants.SPACING, "px !important"),
+    paddingLeft: _constants.SPACING,
+    marginRight: _constants.SPACING,
     textAlign: 'right',
     userSelect: 'none',
     // this is to fix SSR spacing issue
@@ -198,13 +197,13 @@ var syntaxKeywordColors = function syntaxKeywordColors(theme) {
  */
 var getBaseCodeStyles = exports.getBaseCodeStyles = function getBaseCodeStyles(theme) {
   return {
-    fontSize: _constants2.CODE_FONT_SIZE,
+    fontSize: _constants.CODE_FONT_SIZE,
     fontFamily: theme.fontFamily,
     fontWeight: 'normal',
-    backgroundColor: "var(".concat(_constants2.VAR_CODE_BG_COLOR, ",").concat(theme.backgroundColor, ")"),
+    backgroundColor: "var(".concat(_constants.VAR_CODE_BG_COLOR, ",").concat(theme.backgroundColor, ")"),
     color: theme.textColor,
     borderStyle: 'none',
-    borderRadius: "".concat((0, _constants.borderRadius)(), "px")
+    borderRadius: "var(--ds-border-radius, 3px)"
   };
 };
 
@@ -220,10 +219,10 @@ var getCodeBlockStyles = exports.getCodeBlockStyles = function getCodeBlockStyle
       // this is required to account for prismjs styles leaking into the codeblock
       'code[class*="language-"], pre[class*="language-"], code': {
         all: 'unset',
-        padding: showLineNumbers ? "".concat(_constants2.SPACING, "px 0") : _constants2.SPACING
+        padding: showLineNumbers ? "".concat(_constants.SPACING, "px 0") : _constants.SPACING
       },
       display: 'flex',
-      lineHeight: _constants2.CODE_LINE_HEIGHT,
+      lineHeight: _constants.CODE_LINE_HEIGHT,
       overflowX: 'auto',
       whiteSpace: 'pre',
       direction: 'ltr'
@@ -237,8 +236,8 @@ var getCodeBlockStyles = exports.getCodeBlockStyles = function getCodeBlockStyle
       // these styles are for line highlighting
       '& [data-ds--code--row]': {
         display: showLineNumbers ? 'flex' : 'block',
-        paddingRight: "".concat(_constants2.SPACING, "px !important"),
-        marginRight: "-".concat(_constants2.SPACING, "px")
+        paddingRight: "".concat(_constants.SPACING, "px !important"),
+        marginRight: "-".concat(_constants.SPACING, "px")
       },
       '& [data-ds--code--row--highlight]': {
         background: "".concat(theme.highlightedLineBgColor),
@@ -261,17 +260,17 @@ var getCodeBlockStyles = exports.getCodeBlockStyles = function getCodeBlockStyle
         }
       },
       '& [data-ds--code--row--highlight] .linenumber': {
-        borderLeft: "".concat(_constants2.HIGHLIGHT_BORDER_WIDTH, " solid ").concat(theme.highlightedLineBorderColor),
-        paddingLeft: "".concat(_constants2.SPACING / 2, "px !important"),
+        borderLeft: "".concat(_constants.HIGHLIGHT_BORDER_WIDTH, " solid ").concat(theme.highlightedLineBorderColor),
+        paddingLeft: "".concat(_constants.SPACING / 2, "px !important"),
         position: 'relative'
       },
       // fill in space caused by parent border top
       '& [data-ds--code--row--highlight] .linenumber::before': {
         content: '""',
         position: 'absolute',
-        width: _constants2.HIGHLIGHT_BORDER_WIDTH,
+        width: _constants.HIGHLIGHT_BORDER_WIDTH,
         top: '-1px',
-        left: "-".concat(_constants2.HIGHLIGHT_BORDER_WIDTH),
+        left: "-".concat(_constants.HIGHLIGHT_BORDER_WIDTH),
         borderTop: "1px solid ".concat(theme.highlightedLineBorderColor)
       },
       '[data-ds--code--row--highlight] + [data-ds--code--row]:not([data-ds--code--row--highlight]), [data-ds--code--row]:not([data-ds--code--row--highlight]) + [data-ds--code--row--highlight]': {
@@ -282,13 +281,13 @@ var getCodeBlockStyles = exports.getCodeBlockStyles = function getCodeBlockStyle
       },
       '& code:first-of-type': {
         paddingRight: "0px !important",
-        backgroundImage: showLineNumbers ? "linear-gradient(to right, var(".concat(_constants2.VAR_CODE_LINE_NUMBER_BG_COLOR, ",").concat(theme.lineNumberBgColor, "), var(").concat(_constants2.VAR_CODE_LINE_NUMBER_BG_COLOR, ",").concat(theme.lineNumberBgColor, ")\n    calc(").concat(theme.lineNumberWidth, " + ").concat(_constants2.LINE_NUMBER_GUTTER, "px), transparent calc(").concat(theme.lineNumberWidth, " + ").concat(_constants2.LINE_NUMBER_GUTTER, "px), transparent)") : undefined
+        backgroundImage: showLineNumbers ? "linear-gradient(to right, var(".concat(_constants.VAR_CODE_LINE_NUMBER_BG_COLOR, ",").concat(theme.lineNumberBgColor, "), var(").concat(_constants.VAR_CODE_LINE_NUMBER_BG_COLOR, ",").concat(theme.lineNumberBgColor, ")\n    calc(").concat(theme.lineNumberWidth, " + ").concat(_constants.LINE_NUMBER_GUTTER, "px), transparent calc(").concat(theme.lineNumberWidth, " + ").concat(_constants.LINE_NUMBER_GUTTER, "px), transparent)") : undefined
       },
       // we need to use last-of-type because when Code is SSR'd
       // 2 <code> elements are created and we don't want this style
       // applied to the first one
       '& code:last-of-type': {
-        paddingRight: "".concat(_constants2.SPACING, "px !important"),
+        paddingRight: "".concat(_constants.SPACING, "px !important"),
         flexBasis: 'auto',
         flexGrow: 1,
         // Needed for the highlight line to extend full-width
@@ -302,10 +301,8 @@ var getCodeBlockStyles = exports.getCodeBlockStyles = function getCodeBlockStyle
     });
   };
 };
-var getCodeStyles = exports.getCodeStyles = function getCodeStyles(globalTheme) {
-  // Required to have proper compatibility with styled components interpolations
-  var akTheme = 'theme' in globalTheme ? globalTheme.theme : globalTheme;
-  var theme = (0, _getTheme.getBaseTheme)(akTheme);
+var getCodeStyles = exports.getCodeStyles = function getCodeStyles() {
+  var theme = (0, _getTheme.getBaseTheme)();
   var baseStyles = getBaseCodeStyles(theme);
   return _objectSpread(_objectSpread({}, baseStyles), {}, {
     display: 'inline',
@@ -317,8 +314,8 @@ var getCodeStyles = exports.getCodeStyles = function getCodeStyles(globalTheme)
     whiteSpace: 'pre-wrap'
   });
 };
-var getCodeBlockTheme = exports.getCodeBlockTheme = function getCodeBlockTheme(globalTheme, maxLines) {
-  return _objectSpread(_objectSpread(_objectSpread({}, (0, _getTheme.getBaseTheme)(globalTheme)), (0, _getTheme.getColorPalette)(globalTheme)), {}, {
+var getCodeBlockTheme = exports.getCodeBlockTheme = function getCodeBlockTheme(maxLines) {
+  return _objectSpread(_objectSpread(_objectSpread({}, (0, _getTheme.getBaseTheme)()), (0, _getTheme.getColorPalette)()), {}, {
     lineNumberWidth: maxLines ? getLineNumWidth(maxLines) : undefined
   });
 };

package/dist/es2019/code-block.js

@@ -1,7 +1,6 @@
 /** @jsx jsx */
 import { memo, useCallback, useMemo } from 'react';
 import { css, jsx } from '@emotion/react';
-import { useGlobalTheme } from '@atlaskit/theme/components';
 import { useHighlightLines } from './internal/hooks/use-highlight';
 import { getCodeBlockStyles, getCodeBlockTheme } from './internal/theme/styles';
 import { normalizeLanguage } from './internal/utils/get-normalized-language';
@@ -30,8 +29,7 @@ const CodeBlock = /*#__PURE__*/memo(function CodeBlock({
   shouldWrapLongLines = false
 }) {
   const numLines = (text || '').split('\n').length;
-  const globalTheme = useGlobalTheme();
-  const theme = useMemo(() => getCodeBlockTheme(globalTheme, numLines), [globalTheme, numLines]);
+  const theme = useMemo(() => getCodeBlockTheme(numLines), [numLines]);
   const getStyles = useMemo(() => getCodeBlockStyles(theme), [theme]);
   const styles = useMemo(() => css(getStyles(highlightedStartText, highlightedEndText, showLineNumbers, shouldWrapLongLines)), [highlightedStartText, highlightedEndText, showLineNumbers, shouldWrapLongLines, getStyles]);
   const {

package/dist/es2019/code.js

@@ -1,8 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
-import React, { forwardRef, memo, useMemo } from 'react';
+import React, { forwardRef, memo } from 'react';
 import { css, jsx } from '@emotion/react';
-import { useGlobalTheme } from '@atlaskit/theme/components';
 import CodeBidiWarning from './bidi-warning';
 import codeBidiWarningDecorator from './bidi-warning/bidi-warning-decorator';
 import { getCodeStyles } from './internal/theme/styles';
@@ -19,8 +18,7 @@ const Code = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Code({
   testId,
   ...props
 }, ref) {
-  const theme = useGlobalTheme();
-  const styles = useMemo(() => css(getCodeStyles(theme)), [theme]);
+  const styles = css(getCodeStyles());
   const {
     children,
     codeBidiWarnings = true,

package/dist/es2019/constants.js

@@ -1,3 +1,5 @@
+// The full list of languages that can potentially be supported is found in
+// https://prismjs.com/#supported-languages
 export const SUPPORTED_LANGUAGES = [{
   name: 'PHP',
   alias: ['php', 'php3', 'php4', 'php5'],
@@ -306,5 +308,21 @@ export const SUPPORTED_LANGUAGES = [{
   name: 'SplunkSPL',
   alias: ['splunk-spl'],
   value: 'splunk-spl'
+}, {
+  name: 'Dockerfile',
+  alias: ['docker', 'dockerfile'],
+  value: 'dockerfile'
+}, {
+  name: 'HCL',
+  alias: ['hcl', 'terraform'],
+  value: 'hcl'
+}, {
+  name: 'NGINX',
+  alias: ['nginx'],
+  value: 'nginx'
+}, {
+  name: 'Protocol Buffers',
+  alias: ['protobuf', 'proto'],
+  value: 'protobuf'
 }];
 export { CODE_BLOCK_SELECTOR } from './internal/theme/constants';