@atlaskit/emoji 64.2.0 → 64.4.0

package/dist/esm/components/uploader/EmojiUploadComponent.js

@@ -10,15 +10,16 @@ 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 React from 'react';
+/** @jsx jsx */
+import { jsx } from '@emotion/core';
 import { PureComponent } from 'react';
 import { FormattedMessage } from 'react-intl-next';
-import classNames from 'classnames';
-import * as styles from './styles';
 import { supportsUploadFeature } from '../../api/EmojiResource';
 import EmojiUploadPickerWithIntl from '../common/EmojiUploadPicker';
 import { uploadEmoji } from '../common/UploadEmoji';
 import { createAndFireEventInElementsChannel, selectedFileEvent, uploadCancelButton, uploadConfirmButton } from '../../util/analytics';
+import { emojiUploadFooter, emojiUploadWidget } from './styles';
+import { ufoExperiences } from '../../util/analytics/ufoExperiences';
 
 var EmojiUploadComponent = /*#__PURE__*/function (_PureComponent) {
   _inherits(EmojiUploadComponent, _PureComponent);
@@ -34,6 +35,10 @@ var EmojiUploadComponent = /*#__PURE__*/function (_PureComponent) {
 
     _defineProperty(_assertThisInitialized(_this), "onUploadEmoji", function (upload, retry) {
       var emojiProvider = _this.props.emojiProvider;
+      ufoExperiences['emoji-uploaded'].start();
+      ufoExperiences['emoji-uploaded'].addMetadata({
+        retry: retry
+      });
 
       _this.fireAnalytics(uploadConfirmButton({
         retry: retry
@@ -95,16 +100,21 @@ var EmojiUploadComponent = /*#__PURE__*/function (_PureComponent) {
   }
 
   _createClass(EmojiUploadComponent, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      ufoExperiences['emoji-uploaded'].abort();
+    }
+  }, {
     key: "render",
     value: function render() {
       var uploadErrorMessage = this.state.uploadErrorMessage;
-      var errorMessage = uploadErrorMessage ? /*#__PURE__*/React.createElement(FormattedMessage, uploadErrorMessage) : null;
-      return /*#__PURE__*/React.createElement("div", {
-        className: classNames([styles.emojiUploadWidget]),
+      var errorMessage = uploadErrorMessage ? jsx(FormattedMessage, uploadErrorMessage) : null;
+      return jsx("div", {
+        css: emojiUploadWidget,
         ref: this.props.onUploaderRef
-      }, /*#__PURE__*/React.createElement("div", {
-        className: classNames([styles.emojiUploadFooter])
-      }, /*#__PURE__*/React.createElement(EmojiUploadPickerWithIntl, {
+      }, jsx("div", {
+        css: emojiUploadFooter
+      }, jsx(EmojiUploadPickerWithIntl, {
         ref: this.onUploaderRef,
         onFileChooserClicked: this.onFileChooserClicked,
         onUploadCancelled: this.onUploadCancelled,

package/dist/esm/components/uploader/styles.js

@@ -1,8 +1,8 @@
-import { style } from 'typestyle';
 import { token } from '@atlaskit/tokens';
-import { emojiPickerWidth } from '../../util/constants'; // Uploader
+import { emojiPickerWidth } from '../../util/constants';
+import { css } from '@emotion/core'; // Uploader
 
-export var emojiUploadWidget = style({
+export var emojiUploadWidget = css({
   display: 'flex',
   flexDirection: 'column',
   justifyContent: 'center',
@@ -16,6 +16,6 @@ export var emojiUploadWidget = style({
   marginTop: '-16px'
 }); /// Footer
 
-export var emojiUploadFooter = style({
+export var emojiUploadFooter = css({
   flex: '0 0 auto'
 });

package/dist/esm/index.js

@@ -6,18 +6,19 @@ import EmojiPicker from './components/picker/EmojiPicker';
 import EmojiUploader from './components/uploader/EmojiUploader';
 import EmojiTypeAhead from './components/typeahead/EmojiTypeAhead';
 import EmojiTypeAheadItem from './components/typeahead/EmojiTypeAheadItem';
-export { selected, selectOnHover, emojiSprite, emojiNode, emojiImage } from './components/common/styles';
+export { // renaming exports to prevent breaking changes due to renaming
+commonSelectedStyles as selected, selectOnHoverStyles as selectOnHover, emojiSprite, emojiNodeStyles as emojiNode, emojiImage } from './components/common/styles';
 import EmojiResource from './api/EmojiResource';
 import EmojiRepository from './api/EmojiRepository';
 import EmojiLoader from './api/EmojiLoader';
 import { denormaliseEmojiServiceResponse } from './api/EmojiUtils';
 import { toEmojiId, toOptionalEmojiId } from './util/type-helpers';
-import { recordSelectionFailedSli, recordSelectionSucceededSli } from './util/analytics';
+import { recordSelectionFailedSli, recordSelectionSucceededSli, ufoExperiences } from './util/analytics';
 import { customCategory, defaultEmojiHeight, emojiPickerWidth, emojiPickerHeight } from './util/constants';
 import { UsageFrequencyTracker } from './api/internal/UsageFrequencyTracker';
 export { // Classes
 AbstractResource, Emoji, EmojiPlaceholder, EmojiLoader, EmojiPicker, EmojiUploader, EmojiResource, EmojiRepository, EmojiTypeAhead, ResourcedEmoji, // functions
-denormaliseEmojiServiceResponse, toEmojiId, toOptionalEmojiId, recordSelectionFailedSli, recordSelectionSucceededSli, // Constants
+denormaliseEmojiServiceResponse, toEmojiId, toOptionalEmojiId, recordSelectionFailedSli, recordSelectionSucceededSli, ufoExperiences, // Constants
 emojiPickerWidth, emojiPickerHeight, defaultEmojiHeight, customCategory, UsageFrequencyTracker, EmojiTypeAheadItem };
 export { // Enums
 SearchSort } from './types';

package/dist/esm/types.js

@@ -33,4 +33,13 @@ export var SearchSort;
   SearchSort[SearchSort["None"] = 0] = "None";
   SearchSort[SearchSort["Default"] = 1] = "Default";
   SearchSort[SearchSort["UsageFrequency"] = 2] = "UsageFrequency";
-})(SearchSort || (SearchSort = {}));
+})(SearchSort || (SearchSort = {}));
+
+export var ProviderTypes;
+
+(function (ProviderTypes) {
+  ProviderTypes["SITE"] = "SITE";
+  ProviderTypes["STANDARD"] = "STANDARD";
+  ProviderTypes["ATLASSIAN"] = "ATLASSIAN";
+  ProviderTypes["UNKNOWN"] = "UNKNOWN";
+})(ProviderTypes || (ProviderTypes = {}));

package/dist/esm/util/{analytics.js → analytics/analytics.js}

@@ -11,7 +11,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 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; }
 
 import { createAndFireEvent } from '@atlaskit/analytics-next';
-import { name as packageName, version as packageVersion } from '../version.json';
+import { name as packageName, version as packageVersion } from '../../version.json';
 export var createAndFireEventInElementsChannel = createAndFireEvent('fabric-elements');
 
 var createEvent = function createEvent(eventType, action, actionSubject, actionSubjectId) {
@@ -28,12 +28,12 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
   };
 };
 
-export var insertionSucceeded = function insertionSucceeded(source) {
+export var recordSucceeded = function recordSucceeded(source) {
   return createEvent('operational', 'succeeded', 'recordEmojiSelection', undefined, {
     source: source
   });
 };
-export var insertionFailed = function insertionFailed(source) {
+export var recordFailed = function recordFailed(source) {
   return createEvent('operational', 'failed', 'recordEmojiSelection', undefined, {
     source: source
   });
@@ -195,18 +195,20 @@ export var typeaheadRenderedEvent = function typeaheadRenderedEvent(duration, qu
   return createEvent('operational', 'rendered', 'emojiTypeahead', undefined, _objectSpread({
     duration: duration
   }, extractCommonAttributes(query, emojiList)));
-};
+}; // it's used in editor typeahead to fire success record analytics
+
 export var recordSelectionSucceededSli = function recordSelectionSucceededSli(options) {
   return function () {
     if (options && options.createAnalyticsEvent) {
-      createAndFireEvent('editor')(insertionSucceeded('typeahead'))(options.createAnalyticsEvent);
+      createAndFireEvent('editor')(recordSucceeded('typeahead'))(options.createAnalyticsEvent);
     }
   };
-};
+}; // it's used in editor typeahead to fire failure record analytics
+
 export var recordSelectionFailedSli = function recordSelectionFailedSli(options) {
   return function (err) {
     if (options && options.createAnalyticsEvent) {
-      createAndFireEvent('editor')(insertionFailed('typeahead'))(options.createAnalyticsEvent);
+      createAndFireEvent('editor')(recordFailed('typeahead'))(options.createAnalyticsEvent);
     }
 
     return Promise.reject(err);

package/dist/esm/util/analytics/index.js

@@ -0,0 +1,4 @@
+export { ufoExperiencesSampled, clearSampled, isExperienceSampled, withSampling } from './samplingUfo';
+export { categoryClickedEvent, createAndFireEventInElementsChannel, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, recordFailed, recordSucceeded, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, recordSelectionFailedSli, recordSelectionSucceededSli, selectedFileEvent, toneSelectedEvent, toneSelectorClosedEvent, toneSelectorOpenedEvent, typeaheadCancelledEvent, typeaheadRenderedEvent, typeaheadSelectedEvent, uploadBeginButton, uploadCancelButton, uploadConfirmButton, uploadFailedEvent, uploadSucceededEvent } from './analytics';
+export { sampledUfoRenderedEmoji, ufoExperiences } from './ufoExperiences';
+export { useSampledUFOComponentExperience } from './useSampledUFOComponentExperience';

package/dist/esm/util/analytics/samplingUfo.js

@@ -0,0 +1,259 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+
+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 _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+export var ufoExperiencesSampled = {};
+
+var sampleChance = function sampleChance(min, max) {
+  // min and max included
+  return Math.floor(Math.random() * (max - min + 1) + min);
+};
+
+export var clearSampled = function clearSampled() {
+  var _iterator = _createForOfIteratorHelper(Object.getOwnPropertyNames(ufoExperiencesSampled)),
+      _step;
+
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var prop = _step.value;
+      delete ufoExperiencesSampled[prop];
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+}; // default sampling function to determine which one to be sampled
+
+export var isExperienceSampled = function isExperienceSampled(rate) {
+  // if invalid sampling rate provided, we sample it
+  if (rate > 1 || rate < 0) {
+    return true;
+  }
+
+  if (rate === 1) {
+    return true;
+  }
+
+  if (rate === 0) {
+    return false;
+  }
+
+  var maxCount = Math.ceil(1 / rate);
+  var chance = sampleChance(1, maxCount);
+  return chance === maxCount;
+};
+
+var hasSampledFromStart = function hasSampledFromStart(experience) {
+  if (!ufoExperiencesSampled[experience.id]) {
+    return false;
+  }
+
+  if (experience.instanceId) {
+    // if the instance of concurrent exp has been sampled from start, allow it.
+    return ufoExperiencesSampled[experience.id].sampledInstance[experience.instanceId];
+  }
+
+  return ufoExperiencesSampled[experience.id].sampled;
+};
+
+/**
+ * This function is a temp solution to reduce the event traffic, as UFO package does not support it.
+ *
+ * e.g. Emoji Picker contains thousands of emojis, which means will trigger a large number of renderred events without sampling
+ * @param ufoExperience
+ * @returns
+ */
+export var withSampling = function withSampling(ufoExperience) {
+  var init = function init() {
+    if (!ufoExperiencesSampled[ufoExperience.id]) {
+      ufoExperiencesSampled[ufoExperience.id] = {
+        sampled: false,
+        sampledInstance: {}
+      };
+    }
+  };
+
+  var start = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(options) {
+      var isSampled;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!hasSampledFromStart(ufoExperience)) {
+                _context.next = 2;
+                break;
+              }
+
+              return _context.abrupt("return");
+
+            case 2:
+              isSampled = options.samplingFunc || isExperienceSampled;
+
+              if (isSampled(options.samplingRate)) {
+                _context.next = 7;
+                break;
+              }
+
+              if (ufoExperience.instanceId) {
+                ufoExperiencesSampled[ufoExperience.id].sampledInstance[ufoExperience.instanceId] = false;
+              }
+
+              ufoExperiencesSampled[ufoExperience.id].sampled = false;
+              return _context.abrupt("return");
+
+            case 7:
+              // update sampled records
+              if (ufoExperience.instanceId) {
+                ufoExperiencesSampled[ufoExperience.id].sampledInstance[ufoExperience.instanceId] = true;
+                ufoExperiencesSampled[ufoExperience.id].sampled = true;
+              }
+
+              return _context.abrupt("return", ufoExperience.start(options.startTime));
+
+            case 9:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+
+    return function start(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  var success = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(config) {
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              if (hasSampledFromStart(ufoExperience)) {
+                _context2.next = 2;
+                break;
+              }
+
+              return _context2.abrupt("return", null);
+
+            case 2:
+              return _context2.abrupt("return", ufoExperience.success(config));
+
+            case 3:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+
+    return function success(_x2) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  var failure = /*#__PURE__*/function () {
+    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(config) {
+      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              if (hasSampledFromStart(ufoExperience)) {
+                _context3.next = 2;
+                break;
+              }
+
+              return _context3.abrupt("return", null);
+
+            case 2:
+              return _context3.abrupt("return", ufoExperience.failure(config));
+
+            case 3:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    }));
+
+    return function failure(_x3) {
+      return _ref3.apply(this, arguments);
+    };
+  }();
+
+  var abort = /*#__PURE__*/function () {
+    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(config) {
+      return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+        while (1) {
+          switch (_context4.prev = _context4.next) {
+            case 0:
+              if (hasSampledFromStart(ufoExperience)) {
+                _context4.next = 2;
+                break;
+              }
+
+              return _context4.abrupt("return", null);
+
+            case 2:
+              return _context4.abrupt("return", ufoExperience.abort(config));
+
+            case 3:
+            case "end":
+              return _context4.stop();
+          }
+        }
+      }, _callee4);
+    }));
+
+    return function abort(_x4) {
+      return _ref4.apply(this, arguments);
+    };
+  }();
+
+  var mark = function mark(name, timestamp) {
+    if (!hasSampledFromStart(ufoExperience)) {
+      return;
+    }
+
+    return ufoExperience.mark(name, timestamp);
+  };
+
+  var markFMP = function markFMP(timestamp) {
+    if (!hasSampledFromStart(ufoExperience)) {
+      return;
+    }
+
+    return ufoExperience.markFMP(timestamp);
+  };
+
+  var markInlineResponse = function markInlineResponse(timestamp) {
+    if (!hasSampledFromStart(ufoExperience)) {
+      return;
+    }
+
+    return ufoExperience.markInlineResponse(timestamp);
+  };
+
+  init();
+  return _objectSpread(_objectSpread({}, ufoExperience), {}, {
+    start: start,
+    success: success,
+    failure: failure,
+    abort: abort,
+    mark: mark,
+    markFMP: markFMP,
+    markInlineResponse: markInlineResponse
+  });
+};

package/dist/esm/util/analytics/ufoExperiences.js

@@ -0,0 +1,34 @@
+import { ExperiencePerformanceTypes, ExperienceTypes, ConcurrentExperience, UFOExperience } from '@atlaskit/ufo';
+import { withSampling } from './samplingUfo'; // TODO: clean up as not needed
+
+var createRenderExperience = function createRenderExperience(componentName) {
+  return {
+    platform: {
+      component: componentName
+    },
+    type: ExperienceTypes.Load,
+    performanceType: ExperiencePerformanceTypes.PageSegmentLoad
+  };
+};
+
+var createInlineExperience = function createInlineExperience(componentName) {
+  return {
+    platform: {
+      component: componentName
+    },
+    type: ExperienceTypes.Experience,
+    performanceType: ExperiencePerformanceTypes.InlineResult
+  };
+};
+
+export var ufoExperiences = {
+  'emoji-rendered': new ConcurrentExperience('emoji-rendered', createRenderExperience('emoji')),
+  'emoji-resource-fetched': new ConcurrentExperience('emoji-resource-fetched', createRenderExperience('emoji-provider')),
+  'emoji-picker-opened': new UFOExperience('emoji-picker-opened', createRenderExperience('emoji-picker')),
+  'emoji-selection-recorded': new UFOExperience('emoji-selection-recorded', createInlineExperience('emoji-picker')),
+  'emoji-uploaded': new UFOExperience('emoji-uploaded', createInlineExperience('emoji-picker')),
+  'emoji-searched': new UFOExperience('emoji-searched', createInlineExperience('emoji-picker'))
+};
+export var sampledUfoRenderedEmoji = function sampledUfoRenderedEmoji(emojiId) {
+  return withSampling(ufoExperiences['emoji-rendered'].getInstance(emojiId.id || emojiId.shortName));
+};

package/dist/esm/util/analytics/useSampledUFOComponentExperience.js

@@ -0,0 +1,39 @@
+import { useEffect, useRef } from 'react';
+import { withSampling } from './samplingUfo';
+
+var useConstructor = function useConstructor(callback) {
+  var hasBeenFired = useRef(false);
+
+  if (!hasBeenFired.current) {
+    callback();
+    hasBeenFired.current = true;
+  }
+
+  return null;
+};
+/**
+ * A hook to start an experience and to auto abort the experience when the parent component is unmounted.
+ * Use this instead of a direct call to `experience.start`. If you need to restart the experience
+ * simply trigger an unmount and remount of the parent component.
+ * @param experience the experience to start and abort
+ */
+
+
+export var useSampledUFOComponentExperience = function useSampledUFOComponentExperience(experience, samplingRate, metadata) {
+  useEffect(function () {
+    return function () {
+      withSampling(experience).abort();
+    }; // we want this cleanup to only happen on unmount so this is a legit use of empty array
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  useConstructor(function () {
+    withSampling(experience).start({
+      samplingRate: samplingRate
+    });
+
+    if (metadata) {
+      experience.addMetadata(metadata);
+    }
+  });
+  return null;
+};

package/dist/esm/util/constants.js

@@ -19,4 +19,8 @@ export var selectedToneStorageKey = "".concat(localStoragePrefix, ".selectedTone
 export var defaultCategories = ['PEOPLE', 'NATURE', 'FOODS', 'ACTIVITY', 'PLACES', 'OBJECTS', 'SYMBOLS', 'FLAGS'];
 export var defaultListLimit = 50;
 export var migrationUserId = 'hipchat_migration_emoticons';
-export var analyticsEmojiPrefix = 'atlassian.fabric.emoji.picker';
+export var analyticsEmojiPrefix = 'atlassian.fabric.emoji.picker'; // This is the base sampling rate in Emoji
+
+export var SAMPLING_RATE_EMOJI_RENDERED_EXP = 0.05; // This rate is used in ResourceEmoji which will be used in stead of base sampling rate above
+
+export var SAMPLING_RATE_EMOJI_RENDERED_EXP_RESOURCEEMOJI = 0.1; // add more sampling rate in parent components like EmojiTypeAheadItem.

package/dist/esm/version.json

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

package/dist/types/api/EmojiResource.d.ts

@@ -59,6 +59,7 @@ export declare class EmojiResource extends AbstractResource<string, EmojiSearchR
     protected selectedTone: ToneSelection;
     protected currentUser?: User;
     constructor(config: EmojiResourceConfig);
+    private getProviderType;
     protected initEmojiRepository(emojiResponses: EmojiResponse[]): void;
     protected initSiteEmojiResource(emojiResponse: EmojiResponse, provider: ServiceConfig): Promise<void>;
     private performRetries;

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

@@ -1,8 +1,8 @@
-import React, { ContextType } from 'react';
+import PropTypes from 'prop-types';
 import { PureComponent } from 'react';
 import { EmojiDescription } from '../../types';
 import { Props as EmojiProps } from './Emoji';
-import { EmojiContext, EmojiContextType } from '../../context/EmojiContext';
+import { EmojiContext } from './internal-types';
 export interface State {
     cachedEmoji?: EmojiDescription;
     invalidImage?: boolean;
@@ -19,13 +19,15 @@ 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;
-    static contextType: React.Context<EmojiContextType>;
-    context: ContextType<typeof EmojiContext>;
-    constructor(props: EmojiProps, context: ContextType<typeof EmojiContext>);
+    context: EmojiContext;
+    constructor(props: EmojiProps, context: EmojiContext);
     componentDidMount(): void;
     componentWillUnmount(): void;
-    UNSAFE_componentWillReceiveProps(nextProps: EmojiProps, nextContext: EmojiContextType): void;
+    UNSAFE_componentWillReceiveProps(nextProps: EmojiProps, nextContext: EmojiContext): void;
     private loadEmoji;
     private handleLoadError;
     render(): JSX.Element;

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

@@ -1,4 +1,3 @@
-import React from 'react';
 import { PureComponent } from 'react';
 import { WrappedComponentProps } from 'react-intl-next';
 import { EmojiDescription, EmojiDescriptionWithVariations, Message, OnToneSelected, OnToneSelectorCancelled, ToneSelection } from '../../types';
@@ -37,7 +36,7 @@ export declare class EmojiActions extends PureComponent<Props & WrappedComponent
     renderAddOwnEmoji(): JSX.Element | null;
     render(): JSX.Element;
 }
-declare const _default: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps<"intl">>> & {
-    WrappedComponent: React.ComponentType<Props & WrappedComponentProps<"intl">>;
+declare const _default: import("react").FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps<"intl">>> & {
+    WrappedComponent: import("react").ComponentType<Props & WrappedComponentProps<"intl">>;
 };
 export default _default;

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

@@ -1,4 +1,4 @@
-import React from 'react';
+/// <reference types="react" />
 import { WrappedComponentProps } from 'react-intl-next';
 import { EmojiDescription } from '../../types';
 export interface OnDeleteEmoji {
@@ -14,7 +14,7 @@ export interface State {
     loading: boolean;
     error: boolean;
 }
-declare const _default: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps<"intl">>> & {
-    WrappedComponent: React.ComponentType<Props & WrappedComponentProps<"intl">>;
+declare const _default: import("react").FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps<"intl">>> & {
+    WrappedComponent: import("react").ComponentType<Props & WrappedComponentProps<"intl">>;
 };
 export default _default;

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

@@ -1,9 +1,10 @@
 import { PureComponent } from 'react';
 import { Message } from '../../types';
+import { SerializedStyles } from '@emotion/core';
 export interface Props {
     message: Message;
-    className: string;
     tooltip?: boolean;
+    messageStyles: SerializedStyles;
 }
 export default class EmojiErrorMessage extends PureComponent<Props> {
     renderWithTooltip(): JSX.Element;

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

@@ -1,4 +1,3 @@
-import React from 'react';
 import { PureComponent } from 'react';
 import { WrappedComponentProps } from 'react-intl-next';
 import { EmojiDescription, EmojiDescriptionWithVariations, OnToneSelected, OnToneSelectorCancelled, ToneSelection } from '../../types';
@@ -26,7 +25,7 @@ export declare class EmojiPreview extends PureComponent<Props & WrappedComponent
     renderAddOwnEmoji(): JSX.Element | null;
     render(): JSX.Element;
 }
-declare const _default: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps<"intl">>> & {
-    WrappedComponent: React.ComponentType<Props & WrappedComponentProps<"intl">>;
+declare const _default: import("react").FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps<"intl">>> & {
+    WrappedComponent: import("react").ComponentType<Props & WrappedComponentProps<"intl">>;
 };
 export default _default;

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { EmojiDescription } from '../../types';
+declare type Props = {
+    emoji: EmojiDescription;
+};
+export declare const EmojiPreviewComponent: ({ emoji }: Props) => JSX.Element;
+export {};

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

@@ -1,4 +1,4 @@
-import React from 'react';
+/// <reference types="react" />
 import { WrappedComponentProps } from 'react-intl-next';
 import { Message } from '../../types';
 import { UploadStatus } from './internal-types';
@@ -10,7 +10,7 @@ export interface EmojiUploadPreviewProps {
     onUploadCancelled: () => void;
     onAddEmoji: () => void;
 }
-declare const _default: React.FC<import("react-intl-next").WithIntlProps<EmojiUploadPreviewProps & WrappedComponentProps<"intl">>> & {
-    WrappedComponent: React.ComponentType<EmojiUploadPreviewProps & WrappedComponentProps<"intl">>;
+declare const _default: import("react").FC<import("react-intl-next").WithIntlProps<EmojiUploadPreviewProps & WrappedComponentProps<"intl">>> & {
+    WrappedComponent: import("react").ComponentType<EmojiUploadPreviewProps & WrappedComponentProps<"intl">>;
 };
 export default _default;