@atlaskit/emoji 64.4.1 → 64.5.0

package/dist/es2019/components/picker/EmojiPickerList.js

@@ -2,7 +2,6 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
-import PropTypes from 'prop-types';
 import React from 'react';
 import { PureComponent } from 'react';
 import { List as VirtualList } from 'react-virtualized/dist/commonjs/List';
@@ -198,16 +197,6 @@ export default class EmojiPickerVirtualList extends PureComponent {
     this.buildVirtualItems(_props, this.state);
   }
 
-  getChildContext() {
-    const {
-      emoji
-    } = this.context;
-    return {
-      emoji: { ...emoji
-      }
-    };
-  }
-
   UNSAFE_componentWillUpdate(nextProps, nextState) {
     if (this.props.emojis !== nextProps.emojis || this.props.selectedTone !== nextProps.selectedTone || this.props.loading !== nextProps.loading || this.props.query !== nextProps.query) {
       if (!nextProps.query) {
@@ -289,14 +278,6 @@ export default class EmojiPickerVirtualList extends PureComponent {
 
 }
 
-_defineProperty(EmojiPickerVirtualList, "contextTypes", {
-  emoji: PropTypes.object
-});
-
-_defineProperty(EmojiPickerVirtualList, "childContextTypes", {
-  emoji: PropTypes.object
-});
-
 _defineProperty(EmojiPickerVirtualList, "defaultProps", {
   onEmojiSelected: () => {},
   onEmojiActive: () => {},

package/dist/es2019/components/typeahead/EmojiTypeAheadComponent.js

@@ -3,7 +3,6 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import uuid from 'uuid';
-import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 import { defaultListLimit } from '../../util/constants';
 import { toEmojiId } from '../../util/type-helpers';
@@ -13,6 +12,7 @@ import { typeaheadCancelledEvent, typeaheadSelectedEvent, typeaheadRenderedEvent
 import { createRecordSelectionDefault } from '../common/RecordSelectionDefault';
 import EmojiList from './EmojiTypeAheadList';
 import { emojiTypeAhead } from './styles';
+import LegacyEmojiContextProvider from '../../context/LegacyEmojiContextProvider';
 
 const isFullShortName = query => query && query.length > 1 && query.charAt(0) === ':' && query.charAt(query.length - 1) === ':';
 
@@ -150,14 +150,6 @@ export default class EmojiTypeAheadComponent extends PureComponent {
     this.selected = false;
   }
 
-  getChildContext() {
-    return {
-      emoji: {
-        emojiProvider: this.props.emojiProvider
-      }
-    };
-  }
-
   componentDidMount() {
     const {
       emojiProvider
@@ -265,7 +257,14 @@ export default class EmojiTypeAheadComponent extends PureComponent {
     const style = {
       display: visible ? 'block' : 'none'
     };
-    return jsx("div", {
+    const emojiContextValue = {
+      emoji: {
+        emojiProvider: this.props.emojiProvider
+      }
+    };
+    return jsx(LegacyEmojiContextProvider, {
+      emojiContextValue: emojiContextValue
+    }, jsx("div", {
       style: style,
       className: 'ak-emoji-typeahead',
       css: emojiTypeAhead
@@ -274,15 +273,11 @@ export default class EmojiTypeAheadComponent extends PureComponent {
       onEmojiSelected: recordUsageOnSelection,
       ref: this.onEmojiListRef,
       loading: loading
-    }));
+    })));
   }
 
 }
 
-_defineProperty(EmojiTypeAheadComponent, "childContextTypes", {
-  emoji: PropTypes.object
-});
-
 _defineProperty(EmojiTypeAheadComponent, "defaultProps", {
   onSelection: () => {},
   onOpen: () => {},

package/dist/es2019/components/typeahead/EmojiTypeAheadItem.js

@@ -8,6 +8,7 @@ import { toEmojiId } from '../../util/type-helpers';
 import { leftClick } from '../../util/mouse';
 import { EmojiPreviewComponent } from '../common/EmojiPreviewComponent';
 import { typeAheadItem, selected as selectedStyles, typeAheadItemRow, typeaheadSelected } from './styles';
+import LegacyEmojiContextProvider from '../../context/LegacyEmojiContextProvider';
 export default class EmojiTypeAheadItem extends PureComponent {
   constructor(...args) {
     super(...args);
@@ -42,7 +43,7 @@ export default class EmojiTypeAheadItem extends PureComponent {
       emoji
     } = this.props;
     const classes = [typeAheadItem, selected && selectedStyles];
-    return jsx("div", {
+    return jsx(LegacyEmojiContextProvider, null, jsx("div", {
       className: `ak-emoji-typeahead-item ${selected ? typeaheadSelected : ''}`,
       css: classes,
       onMouseDown: this.onEmojiSelected,
@@ -52,7 +53,7 @@ export default class EmojiTypeAheadItem extends PureComponent {
       css: typeAheadItemRow
     }, emoji && jsx(EmojiPreviewComponent, {
       emoji: emoji
-    })));
+    }))));
   }
 
 }

package/dist/es2019/context/EmojiContext.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export const EmojiContext = /*#__PURE__*/createContext(null);

package/dist/es2019/context/EmojiContextProvider.js

@@ -0,0 +1,11 @@
+import React, { useMemo } from 'react';
+import { EmojiContext } from './EmojiContext';
+export const EmojiContextProvider = ({
+  children,
+  emojiContextValue
+}) => {
+  const memoizedEmojiContextValue = useMemo(() => emojiContextValue, [emojiContextValue]);
+  return /*#__PURE__*/React.createElement(EmojiContext.Provider, {
+    value: memoizedEmojiContextValue
+  }, children);
+};

package/dist/es2019/context/LegacyEmojiContextProvider.js

@@ -0,0 +1,32 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { EmojiContextProvider } from './EmojiContextProvider';
+
+/**
+ * Legacy Context Priority Passthrough ...
+ * If component finds legacy context, then use it, otherwise use the passed through context
+ */
+export default class LegacyEmojiContextProvider extends Component {
+  constructor(props, context) {
+    super(props, context);
+    this.state = {
+      prioritisedContextValue: context.emoji ? context : this.props.emojiContextValue
+    };
+  }
+
+  render() {
+    if (this.state.prioritisedContextValue) {
+      return /*#__PURE__*/React.createElement(EmojiContextProvider, {
+        emojiContextValue: this.state.prioritisedContextValue
+      }, this.props.children);
+    }
+
+    return this.props.children;
+  }
+
+}
+
+_defineProperty(LegacyEmojiContextProvider, "contextTypes", {
+  emoji: PropTypes.object
+});

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/emoji",
-	"version": "64.4.1",
+	"version": "64.5.0",
 	"sideEffects": false
 }

package/dist/esm/components/common/CachingEmoji.js

@@ -14,7 +14,6 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
-import PropTypes from 'prop-types';
 import React from 'react';
 import { PureComponent } from 'react';
 import { shouldUseAltRepresentation } from '../../api/EmojiUtils';
@@ -25,6 +24,7 @@ import EmojiPlaceholder from './EmojiPlaceholder';
 import { UfoErrorBoundary } from './UfoErrorBoundary';
 import { sampledUfoRenderedEmoji, ufoExperiences, useSampledUFOComponentExperience } from '../../util/analytics';
 import { SAMPLING_RATE_EMOJI_RENDERED_EXP } from '../../util/constants';
+import { EmojiContext } from '../../context/EmojiContext';
 
 /**
  * Renders an emoji from a cached image, if required.
@@ -67,7 +67,7 @@ export var CachingMediaEmoji = /*#__PURE__*/function (_PureComponent) {
 
     _classCallCheck(this, CachingMediaEmoji);
 
-    _this = _super.call(this, props, context);
+    _this = _super.call(this, props);
 
     _defineProperty(_assertThisInitialized(_this), "mounted", false);
 
@@ -122,6 +122,10 @@ export var CachingMediaEmoji = /*#__PURE__*/function (_PureComponent) {
     value: function loadEmoji(emoji, context, forceLoad) {
       var _this2 = this;
 
+      if (!context) {
+        return;
+      }
+
       if (!context.emoji) {
         return undefined;
       }
@@ -215,8 +219,6 @@ export var CachingMediaEmoji = /*#__PURE__*/function (_PureComponent) {
   return CachingMediaEmoji;
 }(PureComponent);
 
-_defineProperty(CachingMediaEmoji, "contextTypes", {
-  emoji: PropTypes.object
-});
+_defineProperty(CachingMediaEmoji, "contextType", EmojiContext);
 
 export default CachingEmoji;

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

@@ -10,7 +10,6 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
-import PropTypes from 'prop-types';
 import React from 'react';
 import { Component } from 'react';
 import { defaultEmojiHeight } from '../../util/constants';
@@ -18,6 +17,7 @@ import { isPromise } from '../../util/type-helpers';
 import CachingEmoji from './CachingEmoji';
 import EmojiPlaceholder from './EmojiPlaceholder';
 import { sampledUfoRenderedEmoji } from '../../util/analytics';
+import LegacyEmojiContextProvider from '../../context/LegacyEmojiContextProvider';
 
 var ResourcedEmojiComponent = /*#__PURE__*/function (_Component) {
   _inherits(ResourcedEmojiComponent, _Component);
@@ -41,15 +41,6 @@ var ResourcedEmojiComponent = /*#__PURE__*/function (_Component) {
   }
 
   _createClass(ResourcedEmojiComponent, [{
-    key: "getChildContext",
-    value: function getChildContext() {
-      return {
-        emoji: {
-          emojiProvider: this.props.emojiProvider
-        }
-      };
-    }
-  }, {
     key: "refreshEmoji",
     value: function refreshEmoji(emojiProvider, emojiId) {
       var _this2 = this;
@@ -153,19 +144,22 @@ var ResourcedEmojiComponent = /*#__PURE__*/function (_Component) {
           shortName = _this$props$emojiId.shortName,
           id = _this$props$emojiId.id,
           fallback = _this$props$emojiId.fallback;
-      return /*#__PURE__*/React.createElement("span", {
+      var emojiContextValue = {
+        emoji: {
+          emojiProvider: this.props.emojiProvider
+        }
+      };
+      return /*#__PURE__*/React.createElement(LegacyEmojiContextProvider, {
+        emojiContextValue: emojiContextValue
+      }, /*#__PURE__*/React.createElement("span", {
         "data-emoji-id": id,
         "data-emoji-short-name": shortName,
         "data-emoji-text": fallback || shortName
-      }, element);
+      }, element));
     }
   }]);
 
   return ResourcedEmojiComponent;
 }(Component);
 
-_defineProperty(ResourcedEmojiComponent, "childContextTypes", {
-  emoji: PropTypes.object
-});
-
 export { ResourcedEmojiComponent as default };

package/dist/esm/components/picker/EmojiPickerComponent.js

@@ -17,7 +17,6 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
-import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 import { FormattedMessage } from 'react-intl-next';
 import { getEmojiVariation } from '../../api/EmojiRepository';
@@ -35,6 +34,7 @@ import EmojiPickerFooter from './EmojiPickerFooter';
 import EmojiPickerList from './EmojiPickerList';
 import { createAndFireEventInElementsChannel, categoryClickedEvent, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, selectedFileEvent, uploadBeginButton, uploadCancelButton, uploadConfirmButton, toneSelectorClosedEvent, ufoExperiences } from '../../util/analytics';
 import { emojiPicker } from './styles';
+import LegacyEmojiContextProvider from '../../context/LegacyEmojiContextProvider';
 var FREQUENTLY_USED_MAX = 16;
 
 var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
@@ -378,15 +378,6 @@ var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
   }
 
   _createClass(EmojiPickerComponent, [{
-    key: "getChildContext",
-    value: function getChildContext() {
-      return {
-        emoji: {
-          emojiProvider: this.props.emojiProvider
-        }
-      };
-    }
-  }, {
     key: "UNSAFE_componentWillMount",
     value: function UNSAFE_componentWillMount() {
       this.openTime = Date.now();
@@ -561,7 +552,14 @@ var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
         return _this4.fireAnalytics(analytic('picker'));
       });
       var formattedErrorMessage = uploadErrorMessage ? jsx(FormattedMessage, uploadErrorMessage) : null;
-      var picker = jsx("div", {
+      var emojiContextValue = {
+        emoji: {
+          emojiProvider: this.props.emojiProvider
+        }
+      };
+      var picker = jsx(LegacyEmojiContextProvider, {
+        emojiContextValue: emojiContextValue
+      }, jsx("div", {
         css: emojiPicker,
         ref: this.handlePickerRef,
         "data-emoji-picker-container": true
@@ -599,7 +597,7 @@ var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
       }), jsx(EmojiPickerFooter, {
         selectedEmoji: selectedEmoji,
         isUploading: uploading
-      }));
+      })));
       return picker;
     }
   }]);
@@ -607,10 +605,6 @@ var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
   return EmojiPickerComponent;
 }(PureComponent);
 
-_defineProperty(EmojiPickerComponent, "childContextTypes", {
-  emoji: PropTypes.object
-});
-
 _defineProperty(EmojiPickerComponent, "defaultProps", {
   onSelection: function onSelection() {}
 });

package/dist/esm/components/picker/EmojiPickerList.js

@@ -7,17 +7,12 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@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) { _defineProperty(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; }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
-import PropTypes from 'prop-types';
 import React from 'react';
 import { PureComponent } from 'react';
 import { List as VirtualList } from 'react-virtualized/dist/commonjs/List';
@@ -233,14 +228,6 @@ var EmojiPickerVirtualList = /*#__PURE__*/function (_PureComponent) {
   }
 
   _createClass(EmojiPickerVirtualList, [{
-    key: "getChildContext",
-    value: function getChildContext() {
-      var emoji = this.context.emoji;
-      return {
-        emoji: _objectSpread({}, emoji)
-      };
-    }
-  }, {
     key: "UNSAFE_componentWillUpdate",
     value: function UNSAFE_componentWillUpdate(nextProps, nextState) {
       if (this.props.emojis !== nextProps.emojis || this.props.selectedTone !== nextProps.selectedTone || this.props.loading !== nextProps.loading || this.props.query !== nextProps.query) {
@@ -328,14 +315,6 @@ var EmojiPickerVirtualList = /*#__PURE__*/function (_PureComponent) {
   return EmojiPickerVirtualList;
 }(PureComponent);
 
-_defineProperty(EmojiPickerVirtualList, "contextTypes", {
-  emoji: PropTypes.object
-});
-
-_defineProperty(EmojiPickerVirtualList, "childContextTypes", {
-  emoji: PropTypes.object
-});
-
 _defineProperty(EmojiPickerVirtualList, "defaultProps", {
   onEmojiSelected: function onEmojiSelected() {},
   onEmojiActive: function onEmojiActive() {},

package/dist/esm/components/typeahead/EmojiTypeAheadComponent.js

@@ -19,7 +19,6 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import uuid from 'uuid';
-import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 import { defaultListLimit } from '../../util/constants';
 import { toEmojiId } from '../../util/type-helpers';
@@ -29,6 +28,7 @@ import { typeaheadCancelledEvent, typeaheadSelectedEvent, typeaheadRenderedEvent
 import { createRecordSelectionDefault } from '../common/RecordSelectionDefault';
 import EmojiList from './EmojiTypeAheadList';
 import { emojiTypeAhead } from './styles';
+import LegacyEmojiContextProvider from '../../context/LegacyEmojiContextProvider';
 
 var isFullShortName = function isFullShortName(query) {
   return query && query.length > 1 && query.charAt(0) === ':' && query.charAt(query.length - 1) === ':';
@@ -192,15 +192,6 @@ var EmojiTypeAheadComponent = /*#__PURE__*/function (_PureComponent) {
   }
 
   _createClass(EmojiTypeAheadComponent, [{
-    key: "getChildContext",
-    value: function getChildContext() {
-      return {
-        emoji: {
-          emojiProvider: this.props.emojiProvider
-        }
-      };
-    }
-  }, {
     key: "componentDidMount",
     value: function componentDidMount() {
       var emojiProvider = this.props.emojiProvider;
@@ -307,7 +298,14 @@ var EmojiTypeAheadComponent = /*#__PURE__*/function (_PureComponent) {
       var style = {
         display: visible ? 'block' : 'none'
       };
-      return jsx("div", {
+      var emojiContextValue = {
+        emoji: {
+          emojiProvider: this.props.emojiProvider
+        }
+      };
+      return jsx(LegacyEmojiContextProvider, {
+        emojiContextValue: emojiContextValue
+      }, jsx("div", {
         style: style,
         className: 'ak-emoji-typeahead',
         css: emojiTypeAhead
@@ -316,17 +314,13 @@ var EmojiTypeAheadComponent = /*#__PURE__*/function (_PureComponent) {
         onEmojiSelected: recordUsageOnSelection,
         ref: this.onEmojiListRef,
         loading: loading
-      }));
+      })));
     }
   }]);
 
   return EmojiTypeAheadComponent;
 }(PureComponent);
 
-_defineProperty(EmojiTypeAheadComponent, "childContextTypes", {
-  emoji: PropTypes.object
-});
-
 _defineProperty(EmojiTypeAheadComponent, "defaultProps", {
   onSelection: function onSelection() {},
   onOpen: function onOpen() {},

package/dist/esm/components/typeahead/EmojiTypeAheadItem.js

@@ -18,6 +18,7 @@ import { toEmojiId } from '../../util/type-helpers';
 import { leftClick } from '../../util/mouse';
 import { EmojiPreviewComponent } from '../common/EmojiPreviewComponent';
 import { typeAheadItem, selected as selectedStyles, typeAheadItemRow, typeaheadSelected } from './styles';
+import LegacyEmojiContextProvider from '../../context/LegacyEmojiContextProvider';
 
 var EmojiTypeAheadItem = /*#__PURE__*/function (_PureComponent) {
   _inherits(EmojiTypeAheadItem, _PureComponent);
@@ -66,7 +67,7 @@ var EmojiTypeAheadItem = /*#__PURE__*/function (_PureComponent) {
           selected = _this$props3.selected,
           emoji = _this$props3.emoji;
       var classes = [typeAheadItem, selected && selectedStyles];
-      return jsx("div", {
+      return jsx(LegacyEmojiContextProvider, null, jsx("div", {
         className: "ak-emoji-typeahead-item ".concat(selected ? typeaheadSelected : ''),
         css: classes,
         onMouseDown: this.onEmojiSelected,
@@ -76,7 +77,7 @@ var EmojiTypeAheadItem = /*#__PURE__*/function (_PureComponent) {
         css: typeAheadItemRow
       }, emoji && jsx(EmojiPreviewComponent, {
         emoji: emoji
-      })));
+      }))));
     }
   }]);
 

package/dist/esm/context/EmojiContext.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export var EmojiContext = /*#__PURE__*/createContext(null);

package/dist/esm/context/EmojiContextProvider.js

@@ -0,0 +1,12 @@
+import React, { useMemo } from 'react';
+import { EmojiContext } from './EmojiContext';
+export var EmojiContextProvider = function EmojiContextProvider(_ref) {
+  var children = _ref.children,
+      emojiContextValue = _ref.emojiContextValue;
+  var memoizedEmojiContextValue = useMemo(function () {
+    return emojiContextValue;
+  }, [emojiContextValue]);
+  return /*#__PURE__*/React.createElement(EmojiContext.Provider, {
+    value: memoizedEmojiContextValue
+  }, children);
+};

package/dist/esm/context/LegacyEmojiContextProvider.js

@@ -0,0 +1,57 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { EmojiContextProvider } from './EmojiContextProvider';
+
+/**
+ * Legacy Context Priority Passthrough ...
+ * If component finds legacy context, then use it, otherwise use the passed through context
+ */
+var LegacyEmojiContextProvider = /*#__PURE__*/function (_Component) {
+  _inherits(LegacyEmojiContextProvider, _Component);
+
+  var _super = _createSuper(LegacyEmojiContextProvider);
+
+  function LegacyEmojiContextProvider(props, context) {
+    var _this;
+
+    _classCallCheck(this, LegacyEmojiContextProvider);
+
+    _this = _super.call(this, props, context);
+    _this.state = {
+      prioritisedContextValue: context.emoji ? context : _this.props.emojiContextValue
+    };
+    return _this;
+  }
+
+  _createClass(LegacyEmojiContextProvider, [{
+    key: "render",
+    value: function render() {
+      if (this.state.prioritisedContextValue) {
+        return /*#__PURE__*/React.createElement(EmojiContextProvider, {
+          emojiContextValue: this.state.prioritisedContextValue
+        }, this.props.children);
+      }
+
+      return this.props.children;
+    }
+  }]);
+
+  return LegacyEmojiContextProvider;
+}(Component);
+
+_defineProperty(LegacyEmojiContextProvider, "contextTypes", {
+  emoji: PropTypes.object
+});
+
+export { LegacyEmojiContextProvider as default };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/emoji",
-	"version": "64.4.1",
+	"version": "64.5.0",
 	"sideEffects": false
 }

package/dist/types/components/common/CachingEmoji.d.ts

@@ -1,8 +1,8 @@
-import PropTypes from 'prop-types';
+import React, { ContextType } from 'react';
 import { PureComponent } from 'react';
 import { EmojiDescription } from '../../types';
 import { Props as EmojiProps } from './Emoji';
-import { EmojiContext } from './internal-types';
+import { EmojiContext, EmojiContextType } from '../../context/EmojiContext';
 export interface State {
     cachedEmoji?: EmojiDescription;
     invalidImage?: boolean;
@@ -19,15 +19,13 @@ export declare const CachingEmoji: (props: CachingEmojiProps) => JSX.Element;
  * rendering paths depending on caching strategy.
  */
 export declare class CachingMediaEmoji extends PureComponent<CachingEmojiProps, State> {
-    static contextTypes: {
-        emoji: PropTypes.Requireable<any>;
-    };
     private mounted;
-    context: EmojiContext;
-    constructor(props: EmojiProps, context: EmojiContext);
+    static contextType: React.Context<EmojiContextType>;
+    context: ContextType<typeof EmojiContext>;
+    constructor(props: EmojiProps, context: ContextType<typeof EmojiContext>);
     componentDidMount(): void;
     componentWillUnmount(): void;
-    UNSAFE_componentWillReceiveProps(nextProps: EmojiProps, nextContext: EmojiContext): void;
+    UNSAFE_componentWillReceiveProps(nextProps: EmojiProps, nextContext: EmojiContextType): void;
     private loadEmoji;
     private handleLoadError;
     render(): JSX.Element;

package/dist/types/components/common/ResourcedEmojiComponent.d.ts

@@ -1,8 +1,6 @@
-import PropTypes from 'prop-types';
 import { Component } from 'react';
 import EmojiProvider from '../../api/EmojiResource';
 import { EmojiId, OptionalEmojiDescription } from '../../types';
-import { EmojiContext } from './internal-types';
 import { State as LoadingState } from './LoadingEmojiComponent';
 export interface BaseResourcedEmojiProps {
     emojiId: EmojiId;
@@ -17,12 +15,8 @@ export interface State extends LoadingState {
     loaded: boolean;
 }
 export default class ResourcedEmojiComponent extends Component<Props, State> {
-    static childContextTypes: {
-        emoji: PropTypes.Requireable<any>;
-    };
     private ready;
     constructor(props: Props);
-    getChildContext(): EmojiContext;
     private refreshEmoji;
     UNSAFE_componentWillMount(): void;
     componentWillUnmount(): void;

package/dist/types/components/picker/EmojiPickerComponent.d.ts

@@ -1,9 +1,7 @@
-import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 import { MessageDescriptor } from 'react-intl-next';
 import { EmojiProvider } from '../../api/EmojiResource';
 import { EmojiDescription, EmojiId, OnEmojiEvent, OptionalEmojiDescription, OptionalEmojiDescriptionWithVariations, ToneSelection } from '../../types';
-import { EmojiContext } from '../common/internal-types';
 import { CategoryId } from './categories';
 import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
 export interface PickerRefHandler {
@@ -34,15 +32,11 @@ export interface State {
     loading: boolean;
 }
 export default class EmojiPickerComponent extends PureComponent<Props, State> {
-    static childContextTypes: {
-        emoji: PropTypes.Requireable<any>;
-    };
     static defaultProps: {
         onSelection: () => void;
     };
     constructor(props: Props);
     openTime: number;
-    getChildContext(): EmojiContext;
     UNSAFE_componentWillMount(): void;
     componentDidMount(): void;
     componentWillUnmount(): void;