@atlaskit/emoji 69.10.0 → 69.10.2

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/emoji
 
+## 69.10.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 69.10.1
+
+### Patch Changes
+
+- [`bdcd4b4374105`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/bdcd4b4374105) -
+  Minor improvements to how styles are applied.
+- Updated dependencies
+
 ## 69.10.0
 
 ### Minor Changes

package/afm-cc/tsconfig.json

@@ -1,5 +1,5 @@
 {
-	"extends": "../../../../tsconfig.entry-points.confluence.json",
+	"extends": "../../../../tsconfig.local-consumption.json",
 	"compilerOptions": {
 		"declaration": true,
 		"target": "es5",

package/afm-products/tsconfig.json

@@ -1,5 +1,5 @@
 {
-	"extends": "../../../../tsconfig.entry-points.products.json",
+	"extends": "../../../../tsconfig.local-consumption.json",
 	"compilerOptions": {
 		"declaration": true,
 		"target": "es5",

package/dist/cjs/components/common/DeleteButton.js

@@ -37,7 +37,6 @@ var DeleteButton = function DeleteButton(props) {
     }, /*#__PURE__*/React.createElement(_crossCircle.default, {
       label: _constants.deleteEmojiLabel,
       color: "var(--ds-text-subtle, ".concat(_colors.N500, ")"),
-      LEGACY_size: "small",
       size: "small"
     })),
     onClick: props.onClick

package/dist/cjs/components/common/EmojiDeletePreview.compiled.css

@@ -1,6 +1,5 @@
-._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._19bv19bv{padding-left:10px}
+._11c8fhey{font:var(--ds-font-body,normal 400 14px/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._19bvu2gc{padding-left:var(--ds-space-100,8px)}
 ._19l3zwfg img{max-height:2pc}
 ._1bah1yb4{justify-content:space-between}
 ._1bahesu3{justify-content:flex-end}
@@ -12,10 +11,8 @@
 ._4t3i1ylp{height:40px}
 ._4t3i53f4{height:75pt}
 ._4t3ivbgk{height:4pc}
-._ca0q19bv{padding-top:10px}
-._jwwg7vkz:first-of-type{line-height:1pc}
+._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._m73io7ol .emoji-submit-delete{width:84px}
-._n3td19bv{padding-bottom:10px}
-._pnmb1vvm:first-of-type{color:var(--_bbz764)}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
 ._rtyst9kd img{max-width:72px}
-._u5f319bv{padding-right:10px}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}

package/dist/cjs/components/common/EmojiDeletePreview.js

@@ -18,10 +18,10 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _colors = require("@atlaskit/theme/colors");
 var _reactIntlNext = require("react-intl-next");
 var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _heading = _interopRequireDefault(require("@atlaskit/heading"));
+var _compiled = require("@atlaskit/primitives/compiled");
 var _reactFocusLock = _interopRequireDefault(require("react-focus-lock"));
 var _i18n = require("../i18n");
 var _CachingEmoji = _interopRequireDefault(require("./CachingEmoji"));
@@ -96,20 +96,20 @@ var EmojiDeletePreview = /*#__PURE__*/function (_Component) {
         noFocusGuards: true
       }, /*#__PURE__*/React.createElement("div", {
         "data-testid": emojiDeletePreviewTestId,
-        className: (0, _runtime.ax)(["_ca0q19bv _u5f319bv _n3td19bv _19bv19bv _4t3i53f4 _1e0c1txw _2lx21bp4 _1bahesu3"])
+        className: (0, _runtime.ax)(["_4t3i53f4 _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _1e0c1txw _2lx21bp4 _1bahesu3"])
       }, /*#__PURE__*/React.createElement("div", {
-        className: (0, _runtime.ax)(["_11c8dcr7 _4t3ivbgk _pnmb1vvm _jwwg7vkz"]),
-        style: {
-          "--_bbz764": (0, _runtime.ix)("var(--ds-text-subtle, ".concat(_colors.N300, ")"))
-        }
+        className: (0, _runtime.ax)(["_4t3ivbgk"])
       }, /*#__PURE__*/React.createElement(_heading.default, {
         size: "xxsmall"
-      }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _i18n.messages.deleteEmojiTitle)), /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _i18n.messages.deleteEmojiDescription, {
+      }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _i18n.messages.deleteEmojiTitle)), /*#__PURE__*/React.createElement(_compiled.Text, {
+        color: "color.text.subtle",
+        size: "small"
+      }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _i18n.messages.deleteEmojiDescription, {
         values: {
           emojiShortName: emoji.shortName
         }
-      }))), /*#__PURE__*/React.createElement("div", {
-        className: (0, _runtime.ax)(["_11c82smr _1e0c1txw _4t3i1ylp _4cvr1h6o _1bah1yb4 _19l3zwfg _rtyst9kd _m73io7ol _1txf1igg _1qz31b66"])
+      })))), /*#__PURE__*/React.createElement("div", {
+        className: (0, _runtime.ax)(["_11c8fhey _1e0c1txw _4t3i1ylp _4cvr1h6o _1bah1yb4 _19l3zwfg _rtyst9kd _m73io7ol _1txf1igg _1qz31b66"])
       }, /*#__PURE__*/React.createElement(_CachingEmoji.default, {
         emoji: emoji
       }), /*#__PURE__*/React.createElement("div", {

package/dist/cjs/components/common/EmojiErrorMessage.js

@@ -41,7 +41,6 @@ var EmojiErrorMessage = function EmojiErrorMessage(props) {
   }, /*#__PURE__*/React.createElement(_statusError.default, {
     color: "currentColor",
     label: formatMessage(_i18n.messages.error),
-    LEGACY_size: "medium",
     spacing: "spacious",
     testId: emojiErrorIconTestId
   }))) : /*#__PURE__*/React.createElement("div", {
@@ -49,8 +48,7 @@ var EmojiErrorMessage = function EmojiErrorMessage(props) {
     className: (0, _runtime.ax)([errorMessageStyles[errorStyle]])
   }, /*#__PURE__*/React.createElement(_statusError.default, {
     color: "currentColor",
-    label: formatMessage(_i18n.messages.error),
-    LEGACY_size: "small"
+    label: formatMessage(_i18n.messages.error)
   }), message);
   return visualContent;
 };

package/dist/cjs/components/common/EmojiPreviewComponent.compiled.css

@@ -1,5 +1,5 @@
-._10hw2smr:first-of-type{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._10hwfhey:first-of-type{font:var(--ds-font-body,normal 400 14px/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c8rymc{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._118didpf span[role=img]>img{padding-bottom:0}
 ._12s6idpf .emoji-common-emoji-sprite{padding-top:0}
 ._16jlkb7n{flex-grow:1}

package/dist/cjs/components/common/EmojiPreviewComponent.js

@@ -35,7 +35,7 @@ var EmojiPreviewComponent = exports.EmojiPreviewComponent = function EmojiPrevie
       "--_5xk3r4": (0, _runtime.ix)("var(--ds-text, ".concat(_colors.N900, ")"))
     }
   }, emoji.name), /*#__PURE__*/React.createElement("div", {
-    className: (0, _runtime.ax)(["_11c8dcr7 _1reo15vq _18m915vq _1e0c1ule _syaz121t _vwz4kb7n _otyr1i6y _n3tdv77o _1bto1l2s _o5721q9c _10hw2smr _pnmbovqm"]),
+    className: (0, _runtime.ax)(["_11c8rymc _1reo15vq _18m915vq _1e0c1ule _syaz121t _vwz4kb7n _otyr1i6y _n3tdv77o _1bto1l2s _o5721q9c _10hwfhey _pnmbovqm"]),
     style: {
       "--_1pseksa": (0, _runtime.ix)("var(--ds-text-subtle, ".concat(_colors.N400, ")")),
       "--_5xk3r4": (0, _runtime.ix)("var(--ds-text, ".concat(_colors.N900, ")"))

package/dist/cjs/components/common/EmojiUploadPicker.compiled.css

@@ -1,26 +1,24 @@
-._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._fqoxdcr7._fqoxdcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c8rymc{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c8wadc{font:var(--ds-font-body-small,normal 400 9pt/1pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._scffidpf input{border:0}
-._12r21pd9._12r21pd9{font-weight:var(--ds-font-weight-semibold,600)}
 ._16jlkb7n{flex-grow:1}
-._19bv19bv{padding-left:10px}
+._19bvu2gc{padding-left:var(--ds-space-100,8px)}
 ._1bah1b1v{justify-content:space-around}
 ._1bah1yb4{justify-content:space-between}
 ._1e0c1txw{display:flex}
 ._1o9zkb7n{flex-shrink:1}
 ._1rwq1j28 input{background-color:transparent}
 ._1w901vvm._1w901vvm{color:var(--_bbz764)}
-._2hwx14y2{margin-right:5px}
 ._2lx21bp4{flex-direction:column}
 ._34ir1o36 input{outline-width:medium}
 ._4cvresu3{align-items:flex-end}
-._4t3icae7{height:78px}
 ._9bj2glyw input::-ms-clear{display:none}
-._ca0q19bv{padding-top:10px}
+._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._coc6glyw input:invalid{box-shadow:none}
 ._gxxuglyw input{outline-style:none}
+._gy1p12x7{column-gap:var(--ds-space-075,6px)}
 ._i0dl1wug{flex-basis:auto}
-._n3td19bv{padding-bottom:10px}
-._n3td1v6z{padding-bottom:7px}
-._u5f319bv{padding-right:10px}
+._k48p1pd9{font-weight:var(--ds-font-weight-semibold,600)}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
 ._xmji1r31 input{outline-color:currentColor}

package/dist/cjs/components/common/EmojiUploadPicker.js

@@ -32,7 +32,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 var closeEmojiUploadButton = null;
 var emojiUpload = null;
 var emojiUploadTop = null;
-var headingH5 = null;
+var labelStyles = null;
 var uploadChooseFileEmojiName = null;
 var uploadChooseFileMessage = null;
 var uploadChooseFileRow = null;
@@ -82,12 +82,12 @@ var ChooseEmojiFile = /*#__PURE__*/(0, _react.memo)(function (props) {
   var emojiChooseFileTitle = formatMessage(_i18n.messages.emojiChooseFileTitle);
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": uploadEmojiComponentTestId,
-    className: (0, _runtime.ax)(["_ca0q19bv _u5f319bv _n3td19bv _19bv19bv _4t3icae7 _1e0c1txw _2lx21bp4 _1bah1b1v"])
+    className: (0, _runtime.ax)(["_ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _1e0c1txw _2lx21bp4 _1bah1b1v"])
   }, /*#__PURE__*/React.createElement("div", {
-    className: (0, _runtime.ax)(["_11c8dcr7 _n3td1v6z _1e0c1txw _1bah1yb4 _4cvresu3"])
+    className: (0, _runtime.ax)(["_11c8rymc _n3tdu2gc _1e0c1txw _1bah1yb4 _4cvresu3"])
   }, /*#__PURE__*/React.createElement("label", {
     htmlFor: "new-emoji-name-input",
-    className: (0, _runtime.ax)(["_1w901vvm", "_fqoxdcr7 _12r21pd9"]),
+    className: (0, _runtime.ax)(["_1w901vvm", "_11c8wadc _k48p1pd9"]),
     style: {
       "--_bbz764": (0, _runtime.ix)("var(--ds-text-subtle, ".concat(_colors.N300, ")"))
     }
@@ -102,12 +102,11 @@ var ChooseEmojiFile = /*#__PURE__*/(0, _react.memo)(function (props) {
     testId: cancelEmojiUploadPickerTestId
   }, /*#__PURE__*/React.createElement(_cross.default, {
     color: "currentColor",
-    LEGACY_size: "small",
     label: cancelLabel
   })))), /*#__PURE__*/React.createElement("div", {
-    className: (0, _runtime.ax)(["_1e0c1txw _1bah1yb4 _n3td1v6z"])
+    className: (0, _runtime.ax)(["_1e0c1txw _1bah1yb4 _n3tdu2gc _gy1p12x7"])
   }, /*#__PURE__*/React.createElement("span", {
-    className: (0, _runtime.ax)(["_16jlkb7n _1o9zkb7n _i0dl1wug _2hwx14y2 _1rwq1j28 _scffidpf _xmji1r31 _gxxuglyw _34ir1o36 _coc6glyw _9bj2glyw"])
+    className: (0, _runtime.ax)(["_16jlkb7n _1o9zkb7n _i0dl1wug _1rwq1j28 _scffidpf _xmji1r31 _gxxuglyw _34ir1o36 _coc6glyw _9bj2glyw"])
   }, /*#__PURE__*/React.createElement(_textfield.default, {
     placeholder: emojiPlaceholder,
     "aria-label": emojiNameAriaLabel,

package/dist/cjs/components/common/EmojiUploadPreview.compiled.css

@@ -1,7 +1,7 @@
 
-._1fztdcr7 h5{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._2rkofajl{border-radius:var(--ds-radius-small,3px)}._19bv19bv{padding-left:10px}
-._19bv1b66{padding-left:var(--ds-space-050,4px)}
+._2rkofajl{border-radius:var(--ds-radius-small,3px)}._19bv1b66{padding-left:var(--ds-space-050,4px)}
+._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._19bvutpp{padding-left:var(--ds-space-150,9pt)}
 ._19l31ylp img{max-height:40px}
 ._19l3gktf img{max-height:20px}
 ._1bah1yb4{justify-content:space-between}
@@ -9,12 +9,12 @@
 ._1e0c1txw{display:flex}
 ._2lx21bp4{flex-direction:column}
 ._4cvr1h6o{align-items:center}
-._4t3i53f4{height:75pt}
-._avw21b66 h5{padding-bottom:var(--ds-space-050,4px)}
-._bfhklslw{background-color:var(--_1jkcdu5)}
-._ca0q19bv{padding-top:10px}
-._jl6w1vvm h5{color:var(--_bbz764)}
-._n3td19bv{padding-bottom:10px}
+._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
+._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
+._ca0qutpp{padding-top:var(--ds-space-150,9pt)}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._n3tdutpp{padding-bottom:var(--ds-space-150,9pt)}
 ._rtys12am img{max-width:50px}
 ._rtys53f4 img{max-width:75pt}
-._u5f319bv{padding-right:10px}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
+._u5f3utpp{padding-right:var(--ds-space-150,9pt)}

package/dist/cjs/components/common/EmojiUploadPreview.js

@@ -17,9 +17,9 @@ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _colors = require("@atlaskit/theme/colors");
 var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
 var _heading = _interopRequireDefault(require("@atlaskit/heading"));
+var _compiled = require("@atlaskit/primitives/compiled");
 var _reactIntlNext = require("react-intl-next");
 var _constants = require("../../util/constants");
 var _i18n = require("../i18n");
@@ -76,22 +76,17 @@ var EmojiUploadPreview = /*#__PURE__*/function (_PureComponent) {
       var uploading = uploadStatus === _internalTypes.UploadStatus.Uploading;
       var retryableButtonLabel = errorMessage ? formatMessage(_i18n.messages.retryLabel) : formatMessage(_i18n.messages.addEmojiLabel);
       return /*#__PURE__*/React.createElement("div", {
-        className: (0, _runtime.ax)(["_ca0q19bv _u5f319bv _n3td19bv _19bv19bv _1e0c1txw _2lx21bp4 _4t3i53f4"])
+        className: (0, _runtime.ax)(["_1e0c1txw _2lx21bp4 _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc"])
       }, /*#__PURE__*/React.createElement("div", {
         "data-testid": uploadPreviewTestId,
-        className: (0, _runtime.ax)(["_2rkofajl _ca0q19bv _u5f319bv _n3td19bv _19bv19bv _1e0c1txw _1bah1yb4 _4cvr1h6o _bfhklslw"]),
-        style: {
-          "--_1jkcdu5": (0, _runtime.ix)("var(--ds-background-neutral, ".concat(_colors.N20, ")"))
-        }
-      }, /*#__PURE__*/React.createElement("div", {
-        className: (0, _runtime.ax)(["_1fztdcr7 _jl6w1vvm _avw21b66 _19l3gktf _rtys12am"]),
-        style: {
-          "--_bbz764": (0, _runtime.ix)("var(--ds-text-subtle, ".concat(_colors.N300, ")"))
-        }
+        className: (0, _runtime.ax)(["_2rkofajl _1e0c1txw _1bah1yb4 _4cvr1h6o _bfhki8nm _ca0qutpp _u5f3utpp _n3tdutpp _19bvutpp"])
+      }, /*#__PURE__*/React.createElement(_compiled.Stack, {
+        space: "space.050"
       }, /*#__PURE__*/React.createElement(_heading.default, {
         size: "xsmall"
       }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _i18n.messages.emojiPreviewTitle)), /*#__PURE__*/React.createElement("div", {
-        id: addEmojiPreviewDescriptionId
+        id: addEmojiPreviewDescriptionId,
+        className: (0, _runtime.ax)(["_19l3gktf _rtys12am"])
       }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _i18n.messages.emojiPreview, {
         values: {
           emoji: emojiComponent
@@ -99,7 +94,7 @@ var EmojiUploadPreview = /*#__PURE__*/function (_PureComponent) {
       })))), /*#__PURE__*/React.createElement("div", {
         className: (0, _runtime.ax)(["_19bv1b66 _19l31ylp _rtys53f4"])
       }, emojiComponent)), /*#__PURE__*/React.createElement("div", {
-        className: (0, _runtime.ax)(["_1e0c1txw _1bahesu3 _4cvr1h6o _ca0q19bv"])
+        className: (0, _runtime.ax)(["_1e0c1txw _1bahesu3 _4cvr1h6o _ca0qu2gc"])
       }, !uploading && errorMessage ? /*#__PURE__*/React.createElement(_EmojiErrorMessage.default, {
         errorStyle: "preview",
         message: errorMessage,

package/dist/cjs/components/common/ResourcedEmojiComponent.js

@@ -240,8 +240,8 @@ var ResourcedEmojiComponent = exports.ResourcedEmojiComponent = function Resourc
     onEmojiLoadSuccess && onEmojiLoadSuccess(emojiId.id);
   }, [onEmojiLoadSuccess]);
 
-  // use width: auto as long as fitToHeight is defined
-  var autoWidth = (0, _platformFeatureFlags.fg)('platform_emoji_width_auto_fittoheight') ? !!fitToHeight : !!emoji ? false : true;
+  // use width: auto when fitToHeight is defined
+  var autoWidth = !!fitToHeight;
   return /*#__PURE__*/_react.default.createElement(_EmojiCommonProvider.EmojiCommonProvider, {
     emojiProvider: resolvedEmojiProvider
   }, /*#__PURE__*/_react.default.createElement("span", {

package/dist/cjs/components/picker/EmojiPickerCategoryHeading.compiled.css

@@ -1,4 +1,4 @@
-._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c8fhey{font:var(--ds-font-body,normal 400 14px/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._19bvu2gc{padding-left:var(--ds-space-100,8px)}
 ._1p1d1qyh{text-transform:lowercase}
 ._299mangw:first-letter{text-transform:uppercase}

package/dist/cjs/components/picker/EmojiPickerCategoryHeading.js

@@ -33,7 +33,7 @@ var EmojiPickerCategoryHeading = function EmojiPickerCategoryHeading(_ref) {
     "data-testid": RENDER_EMOJI_PICKER_CATEGORY_HEADING_TESTID,
     role: "rowheader"
   }, /*#__PURE__*/React.createElement("div", {
-    className: (0, _runtime.ax)(["_11c82smr _vchhusvi _syazovqm _ca0q12x7 _n3td12x7 _19bvu2gc _u5f3u2gc _1p1d1qyh _299mangw"]),
+    className: (0, _runtime.ax)(["_11c8fhey _vchhusvi _syazovqm _ca0q12x7 _n3td12x7 _19bvu2gc _u5f3u2gc _1p1d1qyh _299mangw"]),
     style: {
       "--_5xk3r4": (0, _runtime.ix)("var(--ds-text, ".concat(_colors.N900, ")"))
     }

package/dist/cjs/components/picker/EmojiPickerListSearch.compiled.css

@@ -1,4 +1,4 @@
-._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c8fhey{font:var(--ds-font-body,normal 400 14px/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._12ji1r31{outline-color:currentColor}
 ._12y31o36{outline-width:medium}
 ._13xeglyw:invalid{box-shadow:none}

package/dist/cjs/components/picker/EmojiPickerListSearch.js

@@ -85,6 +85,6 @@ var EmojiPickerListSearch = exports.EmojiPickerListSearch = function EmojiPicker
     testId: emojiPickerSearchTestId,
     ref: textRef,
     isCompact: true,
-    className: (0, _runtime.ax)(["_11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _syaz1kw7 _80om1kw7 _1q51t94y _y4tize3t _85i5v77o _bozg12x7 _1bsb1osq _13xeglyw _1goxglyw"])
+    className: (0, _runtime.ax)(["_11c8fhey _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _syaz1kw7 _80om1kw7 _1q51t94y _y4tize3t _85i5v77o _bozg12x7 _1bsb1osq _13xeglyw _1goxglyw"])
   }));
 };

package/dist/cjs/util/analytics/analytics.js

@@ -20,7 +20,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
     actionSubjectId: actionSubjectId,
     attributes: _objectSpread({
       packageName: "@atlaskit/emoji",
-      packageVersion: "0.0.0-development"
+      packageVersion: "69.10.1"
     }, attributes)
   };
 };

package/dist/es2019/components/common/DeleteButton.js

@@ -27,7 +27,6 @@ const DeleteButton = props => /*#__PURE__*/React.createElement("span", {
   }, /*#__PURE__*/React.createElement(CrossCircleIcon, {
     label: deleteEmojiLabel,
     color: `var(--ds-text-subtle, ${N500})`,
-    LEGACY_size: "small",
     size: "small"
   })),
   onClick: props.onClick

package/dist/es2019/components/common/EmojiDeletePreview.compiled.css

@@ -1,6 +1,5 @@
-._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._19bv19bv{padding-left:10px}
+._11c8fhey{font:var(--ds-font-body,normal 400 14px/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._19bvu2gc{padding-left:var(--ds-space-100,8px)}
 ._19l3zwfg img{max-height:2pc}
 ._1bah1yb4{justify-content:space-between}
 ._1bahesu3{justify-content:flex-end}
@@ -12,10 +11,8 @@
 ._4t3i1ylp{height:40px}
 ._4t3i53f4{height:75pt}
 ._4t3ivbgk{height:4pc}
-._ca0q19bv{padding-top:10px}
-._jwwg7vkz:first-of-type{line-height:1pc}
+._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._m73io7ol .emoji-submit-delete{width:84px}
-._n3td19bv{padding-bottom:10px}
-._pnmb1n3s:first-of-type{color:var(--ds-text-subtle,#5e6c84)}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
 ._rtyst9kd img{max-width:72px}
-._u5f319bv{padding-right:10px}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}

package/dist/es2019/components/common/EmojiDeletePreview.js

@@ -5,10 +5,10 @@ import "./EmojiDeletePreview.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { Component } from 'react';
-import { N300 } from '@atlaskit/theme/colors';
 import { FormattedMessage, injectIntl } from 'react-intl-next';
 import AkButton from '@atlaskit/button/new';
 import Heading from '@atlaskit/heading';
+import { Text } from '@atlaskit/primitives/compiled';
 import FocusLock from 'react-focus-lock';
 import { messages } from '../i18n';
 import CachingEmoji from './CachingEmoji';
@@ -77,17 +77,20 @@ class EmojiDeletePreview extends Component {
       noFocusGuards: true
     }, /*#__PURE__*/React.createElement("div", {
       "data-testid": emojiDeletePreviewTestId,
-      className: ax(["_ca0q19bv _u5f319bv _n3td19bv _19bv19bv _4t3i53f4 _1e0c1txw _2lx21bp4 _1bahesu3"])
+      className: ax(["_4t3i53f4 _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _1e0c1txw _2lx21bp4 _1bahesu3"])
     }, /*#__PURE__*/React.createElement("div", {
-      className: ax(["_11c8dcr7 _4t3ivbgk _pnmb1n3s _jwwg7vkz"])
+      className: ax(["_4t3ivbgk"])
     }, /*#__PURE__*/React.createElement(Heading, {
       size: "xxsmall"
-    }, /*#__PURE__*/React.createElement(FormattedMessage, messages.deleteEmojiTitle)), /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages.deleteEmojiDescription, {
+    }, /*#__PURE__*/React.createElement(FormattedMessage, messages.deleteEmojiTitle)), /*#__PURE__*/React.createElement(Text, {
+      color: "color.text.subtle",
+      size: "small"
+    }, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages.deleteEmojiDescription, {
       values: {
         emojiShortName: emoji.shortName
       }
-    }))), /*#__PURE__*/React.createElement("div", {
-      className: ax(["_11c82smr _1e0c1txw _4t3i1ylp _4cvr1h6o _1bah1yb4 _19l3zwfg _rtyst9kd _m73io7ol _1txf1igg _1qz31b66"])
+    })))), /*#__PURE__*/React.createElement("div", {
+      className: ax(["_11c8fhey _1e0c1txw _4t3i1ylp _4cvr1h6o _1bah1yb4 _19l3zwfg _rtyst9kd _m73io7ol _1txf1igg _1qz31b66"])
     }, /*#__PURE__*/React.createElement(CachingEmoji, {
       emoji: emoji
     }), /*#__PURE__*/React.createElement("div", {

package/dist/es2019/components/common/EmojiErrorMessage.js

@@ -35,7 +35,6 @@ const EmojiErrorMessage = props => {
   }, /*#__PURE__*/React.createElement(ErrorIcon, {
     color: "currentColor",
     label: formatMessage(messages.error),
-    LEGACY_size: "medium",
     spacing: "spacious",
     testId: emojiErrorIconTestId
   }))) : /*#__PURE__*/React.createElement("div", {
@@ -43,8 +42,7 @@ const EmojiErrorMessage = props => {
     className: ax([errorMessageStyles[errorStyle]])
   }, /*#__PURE__*/React.createElement(ErrorIcon, {
     color: "currentColor",
-    label: formatMessage(messages.error),
-    LEGACY_size: "small"
+    label: formatMessage(messages.error)
   }), message);
   return visualContent;
 };

package/dist/es2019/components/common/EmojiPreviewComponent.compiled.css

@@ -1,5 +1,5 @@
-._10hw2smr:first-of-type{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._10hwfhey:first-of-type{font:var(--ds-font-body,normal 400 14px/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c8rymc{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._118didpf span[role=img]>img{padding-bottom:0}
 ._12s6idpf .emoji-common-emoji-sprite{padding-top:0}
 ._16jlkb7n{flex-grow:1}

package/dist/es2019/components/common/EmojiPreviewComponent.js

@@ -24,6 +24,6 @@ export const EmojiPreviewComponent = ({
   }, emoji.name && /*#__PURE__*/React.createElement("div", {
     className: ax(["_1reo15vq _18m915vq _1e0c1ule _syazj3m3 _1bto1l2s _o5721q9c _299mangw"])
   }, emoji.name), /*#__PURE__*/React.createElement("div", {
-    className: ax(["_11c8dcr7 _1reo15vq _18m915vq _1e0c1ule _syaz1a45 _vwz4kb7n _otyr1i6y _n3tdv77o _1bto1l2s _o5721q9c _10hw2smr _pnmbj3m3"])
+    className: ax(["_11c8rymc _1reo15vq _18m915vq _1e0c1ule _syaz1a45 _vwz4kb7n _otyr1i6y _n3tdv77o _1bto1l2s _o5721q9c _10hwfhey _pnmbj3m3"])
   }, emoji.shortName)));
 };

package/dist/es2019/components/common/EmojiUploadPicker.compiled.css

@@ -1,26 +1,24 @@
-._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._fqoxdcr7._fqoxdcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c8rymc{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c8wadc{font:var(--ds-font-body-small,normal 400 9pt/1pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._scffidpf input{border:0}
-._12r21pd9._12r21pd9{font-weight:var(--ds-font-weight-semibold,600)}
 ._16jlkb7n{flex-grow:1}
-._19bv19bv{padding-left:10px}
+._19bvu2gc{padding-left:var(--ds-space-100,8px)}
 ._1bah1b1v{justify-content:space-around}
 ._1bah1yb4{justify-content:space-between}
 ._1e0c1txw{display:flex}
 ._1o9zkb7n{flex-shrink:1}
 ._1rwq1j28 input{background-color:transparent}
 ._1w901n3s._1w901n3s{color:var(--ds-text-subtle,#5e6c84)}
-._2hwx14y2{margin-right:5px}
 ._2lx21bp4{flex-direction:column}
 ._34ir1o36 input{outline-width:medium}
 ._4cvresu3{align-items:flex-end}
-._4t3icae7{height:78px}
 ._9bj2glyw input::-ms-clear{display:none}
-._ca0q19bv{padding-top:10px}
+._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._coc6glyw input:invalid{box-shadow:none}
 ._gxxuglyw input{outline-style:none}
+._gy1p12x7{column-gap:var(--ds-space-075,6px)}
 ._i0dl1wug{flex-basis:auto}
-._n3td19bv{padding-bottom:10px}
-._n3td1v6z{padding-bottom:7px}
-._u5f319bv{padding-right:10px}
+._k48p1pd9{font-weight:var(--ds-font-weight-semibold,600)}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
 ._xmji1r31 input{outline-color:currentColor}

package/dist/es2019/components/common/EmojiUploadPicker.js

@@ -20,7 +20,7 @@ import { UploadStatus } from './internal-types';
 const closeEmojiUploadButton = null;
 const emojiUpload = null;
 const emojiUploadTop = null;
-const headingH5 = null;
+const labelStyles = null;
 const uploadChooseFileEmojiName = null;
 const uploadChooseFileMessage = null;
 const uploadChooseFileRow = null;
@@ -73,12 +73,12 @@ const ChooseEmojiFile = /*#__PURE__*/memo(props => {
   const emojiChooseFileTitle = formatMessage(messages.emojiChooseFileTitle);
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": uploadEmojiComponentTestId,
-    className: ax(["_ca0q19bv _u5f319bv _n3td19bv _19bv19bv _4t3icae7 _1e0c1txw _2lx21bp4 _1bah1b1v"])
+    className: ax(["_ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _1e0c1txw _2lx21bp4 _1bah1b1v"])
   }, /*#__PURE__*/React.createElement("div", {
-    className: ax(["_11c8dcr7 _n3td1v6z _1e0c1txw _1bah1yb4 _4cvresu3"])
+    className: ax(["_11c8rymc _n3tdu2gc _1e0c1txw _1bah1yb4 _4cvresu3"])
   }, /*#__PURE__*/React.createElement("label", {
     htmlFor: "new-emoji-name-input",
-    className: ax(["_1w901n3s", "_fqoxdcr7 _12r21pd9"])
+    className: ax(["_1w901n3s", "_11c8wadc _k48p1pd9"])
   }, /*#__PURE__*/React.createElement(FormattedMessage, messages.addCustomEmojiLabel)), /*#__PURE__*/React.createElement("div", {
     className: ax(["_1e0c1txw"])
   }, /*#__PURE__*/React.createElement(AkButton, {
@@ -90,12 +90,11 @@ const ChooseEmojiFile = /*#__PURE__*/memo(props => {
     testId: cancelEmojiUploadPickerTestId
   }, /*#__PURE__*/React.createElement(CrossIcon, {
     color: "currentColor",
-    LEGACY_size: "small",
     label: cancelLabel
   })))), /*#__PURE__*/React.createElement("div", {
-    className: ax(["_1e0c1txw _1bah1yb4 _n3td1v6z"])
+    className: ax(["_1e0c1txw _1bah1yb4 _n3tdu2gc _gy1p12x7"])
   }, /*#__PURE__*/React.createElement("span", {
-    className: ax(["_16jlkb7n _1o9zkb7n _i0dl1wug _2hwx14y2 _1rwq1j28 _scffidpf _xmji1r31 _gxxuglyw _34ir1o36 _coc6glyw _9bj2glyw"])
+    className: ax(["_16jlkb7n _1o9zkb7n _i0dl1wug _1rwq1j28 _scffidpf _xmji1r31 _gxxuglyw _34ir1o36 _coc6glyw _9bj2glyw"])
   }, /*#__PURE__*/React.createElement(TextField, {
     placeholder: emojiPlaceholder,
     "aria-label": emojiNameAriaLabel,

package/dist/es2019/components/common/EmojiUploadPreview.compiled.css

@@ -1,7 +1,7 @@
 
-._1fztdcr7 h5{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._2rkofajl{border-radius:var(--ds-radius-small,3px)}._19bv19bv{padding-left:10px}
-._19bv1b66{padding-left:var(--ds-space-050,4px)}
+._2rkofajl{border-radius:var(--ds-radius-small,3px)}._19bv1b66{padding-left:var(--ds-space-050,4px)}
+._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._19bvutpp{padding-left:var(--ds-space-150,9pt)}
 ._19l31ylp img{max-height:40px}
 ._19l3gktf img{max-height:20px}
 ._1bah1yb4{justify-content:space-between}
@@ -9,12 +9,12 @@
 ._1e0c1txw{display:flex}
 ._2lx21bp4{flex-direction:column}
 ._4cvr1h6o{align-items:center}
-._4t3i53f4{height:75pt}
-._avw21b66 h5{padding-bottom:var(--ds-space-050,4px)}
-._bfhk1s4m{background-color:var(--ds-background-neutral,#f4f5f7)}
-._ca0q19bv{padding-top:10px}
-._jl6w1n3s h5{color:var(--ds-text-subtle,#5e6c84)}
-._n3td19bv{padding-bottom:10px}
+._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
+._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
+._ca0qutpp{padding-top:var(--ds-space-150,9pt)}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._n3tdutpp{padding-bottom:var(--ds-space-150,9pt)}
 ._rtys12am img{max-width:50px}
 ._rtys53f4 img{max-width:75pt}
-._u5f319bv{padding-right:10px}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
+._u5f3utpp{padding-right:var(--ds-space-150,9pt)}