@atlaskit/emoji 64.3.0 → 64.4.0

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

@@ -9,7 +9,7 @@ import { defaultListLimit } from '../../util/constants';
 import { toEmojiId } from '../../util/type-helpers';
 import { SearchSort } from '../../types';
 import debug from '../../util/logger';
-import { typeaheadCancelledEvent, typeaheadSelectedEvent, typeaheadRenderedEvent } from '../../util/analytics';
+import { typeaheadCancelledEvent, typeaheadSelectedEvent, typeaheadRenderedEvent, ufoExperiences } from '../../util/analytics';
 import { createRecordSelectionDefault } from '../common/RecordSelectionDefault';
 import EmojiList from './EmojiTypeAheadList';
 import { emojiTypeAhead } from './styles';
@@ -89,6 +89,11 @@ export default class EmojiTypeAheadComponent extends PureComponent {
       const wasVisible = this.state.visible;
       const visible = emojis.length > 0;
       this.fireAnalyticsEvent(typeaheadRenderedEvent(Date.now() - this.renderStartTime, query, emojis));
+      ufoExperiences['emoji-searched'].success({
+        metadata: {
+          emojisLength: emojis.length
+        }
+      });
       debug('emoji-typeahead.applyPropChanges', emojis.length, wasVisible, visible);
       this.setState({
         emojis: emojis,
@@ -175,6 +180,8 @@ export default class EmojiTypeAheadComponent extends PureComponent {
       this.fireAnalyticsEvent(typeaheadCancelledEvent(Date.now() - this.openTime, query, emojis));
     }
 
+    ufoExperiences['emoji-searched'].abort();
+    ufoExperiences['emoji-selection-recorded'].abort();
     this.sessionId = uuid();
     this.selected = false;
   }
@@ -218,6 +225,11 @@ export default class EmojiTypeAheadComponent extends PureComponent {
       options.sort = SearchSort.UsageFrequency;
     }
 
+    ufoExperiences['emoji-searched'].start();
+    ufoExperiences['emoji-searched'].addMetadata({
+      queryLength: (query === null || query === void 0 ? void 0 : query.length) || 0,
+      source: 'typeahead'
+    });
     this.renderStartTime = Date.now();
     emojiProvider.filter(query, options);
   }

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

@@ -9,6 +9,7 @@ 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';
 export default class EmojiUploadComponent extends PureComponent {
   constructor(props) {
     super(props);
@@ -17,6 +18,10 @@ export default class EmojiUploadComponent extends PureComponent {
       const {
         emojiProvider
       } = this.props;
+      ufoExperiences['emoji-uploaded'].start();
+      ufoExperiences['emoji-uploaded'].addMetadata({
+        retry
+      });
       this.fireAnalytics(uploadConfirmButton({
         retry
       }));
@@ -78,6 +83,10 @@ export default class EmojiUploadComponent extends PureComponent {
     this.state = {};
   }
 
+  componentWillUnmount() {
+    ufoExperiences['emoji-uploaded'].abort();
+  }
+
   render() {
     const {
       uploadErrorMessage

package/dist/es2019/index.js

@@ -13,12 +13,12 @@ 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/es2019/util/analytics/analytics.js

@@ -1,32 +1,5 @@
 import { createAndFireEvent } from '@atlaskit/analytics-next';
 import { name as packageName, version as packageVersion } from '../../version.json';
-import { ExperiencePerformanceTypes, ExperienceTypes, ConcurrentExperience } from '@atlaskit/ufo';
-import { withSampling } from './samplingUfo';
-
-const createRenderExperience = componentName => {
-  return {
-    platform: {
-      component: componentName
-    },
-    type: ExperienceTypes.Load,
-    performanceType: ExperiencePerformanceTypes.PageSegmentLoad
-  };
-}; // const createInlineExperience = (componentName: string) => {
-//   return {
-//     platform: { component: componentName },
-//     type: ExperienceTypes.Experience,
-//     performanceType: ExperiencePerformanceTypes.InlineResult,
-//   };
-// };
-
-
-export const ufoExperiences = {
-  'emoji-rendered': new ConcurrentExperience('emoji-rendered', createRenderExperience('emoji')),
-  'emoji-resource-fetched': new ConcurrentExperience('emoji-resource-fetched', createRenderExperience('emoji-provider'))
-};
-export const sampledUfoRenderedEmoji = emojiId => {
-  return withSampling(ufoExperiences['emoji-rendered'].getInstance(emojiId.id || emojiId.shortName));
-};
 export const createAndFireEventInElementsChannel = createAndFireEvent('fabric-elements');
 
 const createEvent = (eventType, action, actionSubject, actionSubjectId, attributes = {}) => ({
@@ -41,12 +14,16 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
   }
 });
 
-export const insertionSucceeded = source => createEvent('operational', 'succeeded', 'recordEmojiSelection', undefined, {
-  source
-});
-export const insertionFailed = source => createEvent('operational', 'failed', 'recordEmojiSelection', undefined, {
-  source
-});
+export const recordSucceeded = source => {
+  return createEvent('operational', 'succeeded', 'recordEmojiSelection', undefined, {
+    source
+  });
+};
+export const recordFailed = source => {
+  return createEvent('operational', 'failed', 'recordEmojiSelection', undefined, {
+    source
+  });
+};
 
 const emojiPickerEvent = (action, attributes = {}, actionSubjectId) => createEvent('ui', action, 'emojiPicker', actionSubjectId, attributes);
 
@@ -146,15 +123,17 @@ export const typeaheadSelectedEvent = (pressed, duration, emoji, emojiList, quer
 export const typeaheadRenderedEvent = (duration, query, emojiList) => createEvent('operational', 'rendered', 'emojiTypeahead', undefined, {
   duration,
   ...extractCommonAttributes(query, emojiList)
-});
+}); // it's used in editor typeahead to fire success record analytics
+
 export const recordSelectionSucceededSli = options => () => {
   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 const recordSelectionFailedSli = options => err => {
   if (options && options.createAnalyticsEvent) {
-    createAndFireEvent('editor')(insertionFailed('typeahead'))(options.createAnalyticsEvent);
+    createAndFireEvent('editor')(recordFailed('typeahead'))(options.createAnalyticsEvent);
   }
 
   return Promise.reject(err);

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

@@ -1,3 +1,4 @@
 export { ufoExperiencesSampled, clearSampled, isExperienceSampled, withSampling } from './samplingUfo';
-export { categoryClickedEvent, createAndFireEventInElementsChannel, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, insertionFailed, insertionSucceeded, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, recordSelectionFailedSli, recordSelectionSucceededSli, sampledUfoRenderedEmoji, selectedFileEvent, toneSelectedEvent, toneSelectorClosedEvent, toneSelectorOpenedEvent, typeaheadCancelledEvent, typeaheadRenderedEvent, typeaheadSelectedEvent, ufoExperiences, uploadBeginButton, uploadCancelButton, uploadConfirmButton, uploadFailedEvent, uploadSucceededEvent } from './analytics';
+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/es2019/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
+
+const createRenderExperience = componentName => {
+  return {
+    platform: {
+      component: componentName
+    },
+    type: ExperienceTypes.Load,
+    performanceType: ExperiencePerformanceTypes.PageSegmentLoad
+  };
+};
+
+const createInlineExperience = componentName => {
+  return {
+    platform: {
+      component: componentName
+    },
+    type: ExperienceTypes.Experience,
+    performanceType: ExperiencePerformanceTypes.InlineResult
+  };
+};
+
+export const 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 const sampledUfoRenderedEmoji = emojiId => {
+  return withSampling(ufoExperiences['emoji-rendered'].getInstance(emojiId.id || emojiId.shortName));
+};

package/dist/es2019/version.json

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

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

@@ -1,4 +1,4 @@
-import { insertionFailed, insertionSucceeded } from '../../util/analytics';
+import { recordFailed, recordSucceeded, ufoExperiences } from '../../util/analytics';
 
 /**
  * A function that will wrap any configured Emoji 'onSelection' function to ensure recordSelection is always
@@ -12,10 +12,13 @@ export var createRecordSelectionDefault = function createRecordSelectionDefault(
   return function (emojiId, emoji, event) {
     try {
       if (provider.recordSelection && emoji) {
+        ufoExperiences['emoji-selection-recorded'].start();
         provider.recordSelection(emoji).then(function () {
-          return fireAnalytics && fireAnalytics(insertionSucceeded);
+          fireAnalytics && fireAnalytics(recordSucceeded);
+          ufoExperiences['emoji-selection-recorded'].success();
         }).catch(function () {
-          return fireAnalytics && fireAnalytics(insertionFailed);
+          fireAnalytics && fireAnalytics(recordFailed);
+          ufoExperiences['emoji-selection-recorded'].failure();
         });
       }
     } finally {

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

@@ -1,16 +1,19 @@
 import { supportsUploadFeature } from '../../api/EmojiResource';
 import { uploadFailedEvent, uploadSucceededEvent } from '../../util/analytics';
 import { messages } from '../i18n';
+import { ufoExperiences } from '../../util/analytics/ufoExperiences';
 export var uploadEmoji = function uploadEmoji(upload, emojiProvider, errorSetter, onSuccess, fireAnalytics) {
   var startTime = Date.now();
   errorSetter(undefined);
 
   if (supportsUploadFeature(emojiProvider)) {
+    ufoExperiences['emoji-uploaded'].start();
     emojiProvider.uploadCustomEmoji(upload).then(function (emojiDescription) {
       fireAnalytics(uploadSucceededEvent({
         duration: Date.now() - startTime
       }));
       onSuccess(emojiDescription);
+      ufoExperiences['emoji-uploaded'].success();
     }).catch(function (err) {
       errorSetter(messages.emojiUploadFailed); // eslint-disable-next-line no-console
 
@@ -19,6 +22,7 @@ export var uploadEmoji = function uploadEmoji(upload, emojiProvider, errorSetter
         duration: Date.now() - startTime,
         reason: messages.emojiUploadFailed.defaultMessage
       }));
+      ufoExperiences['emoji-uploaded'].failure();
     });
   }
 };

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

@@ -16,9 +16,11 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
+import { ufoExperiences } from '../../util/analytics';
 import LoadingEmojiComponent from '../common/LoadingEmojiComponent';
 import { LoadingItem } from './EmojiPickerVirtualItems';
 import { emojiPicker } from './styles';
+import { UfoErrorBoundary } from '../common/UfoErrorBoundary';
 
 var emojiPickerModuleLoader = function emojiPickerModuleLoader() {
   return import(
@@ -50,6 +52,7 @@ export var EmojiPickerInternal = /*#__PURE__*/function (_LoadingEmojiComponen) {
       asyncLoadedComponent: EmojiPickerInternal.AsyncLoadedComponent
     });
 
+    ufoExperiences['emoji-picker-opened'].start();
     return _this;
   }
 
@@ -77,6 +80,7 @@ export var EmojiPickerInternal = /*#__PURE__*/function (_LoadingEmojiComponen) {
         }
       };
 
+      ufoExperiences['emoji-picker-opened'].markFMP();
       return jsx("div", {
         css: emojiPicker,
         ref: handlePickerRef
@@ -89,9 +93,11 @@ export var EmojiPickerInternal = /*#__PURE__*/function (_LoadingEmojiComponen) {
           emojiProvider = _this$props.emojiProvider,
           otherProps = _objectWithoutProperties(_this$props, _excluded);
 
-      return jsx(EmojiPickerComponent, _extends({
+      return jsx(UfoErrorBoundary, {
+        experiences: [ufoExperiences['emoji-picker-opened']]
+      }, jsx(EmojiPickerComponent, _extends({
         emojiProvider: loadedEmojiProvider
-      }, otherProps));
+      }, otherProps)));
     }
   }]);
 

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

@@ -33,7 +33,7 @@ import { createRecordSelectionDefault } from '../common/RecordSelectionDefault';
 import CategorySelector from './CategorySelector';
 import EmojiPickerFooter from './EmojiPickerFooter';
 import EmojiPickerList from './EmojiPickerList';
-import { createAndFireEventInElementsChannel, categoryClickedEvent, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, selectedFileEvent, uploadBeginButton, uploadCancelButton, uploadConfirmButton, toneSelectorClosedEvent } from '../../util/analytics';
+import { createAndFireEventInElementsChannel, categoryClickedEvent, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, selectedFileEvent, uploadBeginButton, uploadCancelButton, uploadConfirmButton, toneSelectorClosedEvent, ufoExperiences } from '../../util/analytics';
 import { emojiPicker } from './styles';
 var FREQUENTLY_USED_MAX = 16;
 
@@ -125,9 +125,19 @@ var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "onSearch", function (query) {
-      _this.updateEmojis(query, {
+      var options = {
         skinTone: _this.state.selectedTone
-      });
+      };
+
+      if (query !== _this.state.query) {
+        ufoExperiences['emoji-searched'].start();
+        ufoExperiences['emoji-searched'].addMetadata({
+          queryLength: query.length,
+          source: 'picker'
+        });
+      }
+
+      _this.updateEmojis(query, options);
     });
 
     _defineProperty(_assertThisInitialized(_this), "onSearchResult", function (searchResults) {
@@ -141,6 +151,12 @@ var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
           queryLength: searchQuery.length,
           numMatches: emojiToRender.length
         }));
+
+        ufoExperiences['emoji-searched'].success({
+          metadata: {
+            emojisLength: emojiToRender.length
+          }
+        });
       }
 
       _this.setStateAfterEmojiChange(searchQuery, emojiToRender, searchResults.emojis, frequentlyUsedEmoji);
@@ -381,6 +397,7 @@ var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
     value: function componentDidMount() {
       var _this2 = this;
 
+      ufoExperiences['emoji-picker-opened'].success();
       var _this$props = this.props,
           emojiProvider = _this$props.emojiProvider,
           hideToneSelector = _this$props.hideToneSelector;
@@ -415,6 +432,9 @@ var EmojiPickerComponent = /*#__PURE__*/function (_PureComponent) {
       this.fireAnalytics(closedPickerEvent({
         duration: this.calculateElapsedTime()
       }));
+      ufoExperiences['emoji-picker-opened'].abort();
+      ufoExperiences['emoji-searched'].abort();
+      ufoExperiences['emoji-selection-recorded'].abort();
     }
   }, {
     key: "UNSAFE_componentWillReceiveProps",

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

@@ -25,7 +25,7 @@ import { defaultListLimit } from '../../util/constants';
 import { toEmojiId } from '../../util/type-helpers';
 import { SearchSort } from '../../types';
 import debug from '../../util/logger';
-import { typeaheadCancelledEvent, typeaheadSelectedEvent, typeaheadRenderedEvent } from '../../util/analytics';
+import { typeaheadCancelledEvent, typeaheadSelectedEvent, typeaheadRenderedEvent, ufoExperiences } from '../../util/analytics';
 import { createRecordSelectionDefault } from '../common/RecordSelectionDefault';
 import EmojiList from './EmojiTypeAheadList';
 import { emojiTypeAhead } from './styles';
@@ -124,6 +124,11 @@ var EmojiTypeAheadComponent = /*#__PURE__*/function (_PureComponent) {
 
       _this.fireAnalyticsEvent(typeaheadRenderedEvent(Date.now() - _this.renderStartTime, query, emojis));
 
+      ufoExperiences['emoji-searched'].success({
+        metadata: {
+          emojisLength: emojis.length
+        }
+      });
       debug('emoji-typeahead.applyPropChanges', emojis.length, wasVisible, visible);
 
       _this.setState({
@@ -215,6 +220,8 @@ var EmojiTypeAheadComponent = /*#__PURE__*/function (_PureComponent) {
         this.fireAnalyticsEvent(typeaheadCancelledEvent(Date.now() - this.openTime, query, emojis));
       }
 
+      ufoExperiences['emoji-searched'].abort();
+      ufoExperiences['emoji-selection-recorded'].abort();
       this.sessionId = uuid();
       this.selected = false;
     }
@@ -260,6 +267,11 @@ var EmojiTypeAheadComponent = /*#__PURE__*/function (_PureComponent) {
         options.sort = SearchSort.UsageFrequency;
       }
 
+      ufoExperiences['emoji-searched'].start();
+      ufoExperiences['emoji-searched'].addMetadata({
+        queryLength: (query === null || query === void 0 ? void 0 : query.length) || 0,
+        source: 'typeahead'
+      });
       this.renderStartTime = Date.now();
       emojiProvider.filter(query, options);
     }

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

@@ -19,6 +19,7 @@ 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,6 +100,11 @@ 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;

package/dist/esm/index.js

@@ -13,12 +13,12 @@ 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/util/analytics/analytics.js

@@ -12,33 +12,6 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import { createAndFireEvent } from '@atlaskit/analytics-next';
 import { name as packageName, version as packageVersion } from '../../version.json';
-import { ExperiencePerformanceTypes, ExperienceTypes, ConcurrentExperience } from '@atlaskit/ufo';
-import { withSampling } from './samplingUfo';
-
-var createRenderExperience = function createRenderExperience(componentName) {
-  return {
-    platform: {
-      component: componentName
-    },
-    type: ExperienceTypes.Load,
-    performanceType: ExperiencePerformanceTypes.PageSegmentLoad
-  };
-}; // const createInlineExperience = (componentName: string) => {
-//   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'))
-};
-export var sampledUfoRenderedEmoji = function sampledUfoRenderedEmoji(emojiId) {
-  return withSampling(ufoExperiences['emoji-rendered'].getInstance(emojiId.id || emojiId.shortName));
-};
 export var createAndFireEventInElementsChannel = createAndFireEvent('fabric-elements');
 
 var createEvent = function createEvent(eventType, action, actionSubject, actionSubjectId) {
@@ -55,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
   });
@@ -222,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

@@ -1,3 +1,4 @@
 export { ufoExperiencesSampled, clearSampled, isExperienceSampled, withSampling } from './samplingUfo';
-export { categoryClickedEvent, createAndFireEventInElementsChannel, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, insertionFailed, insertionSucceeded, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, recordSelectionFailedSli, recordSelectionSucceededSli, sampledUfoRenderedEmoji, selectedFileEvent, toneSelectedEvent, toneSelectorClosedEvent, toneSelectorOpenedEvent, typeaheadCancelledEvent, typeaheadRenderedEvent, typeaheadSelectedEvent, ufoExperiences, uploadBeginButton, uploadCancelButton, uploadConfirmButton, uploadFailedEvent, uploadSucceededEvent } from './analytics';
+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/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/version.json

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

package/dist/types/components/uploader/EmojiUploadComponent.d.ts

@@ -16,6 +16,7 @@ export interface State {
 export default class EmojiUploadComponent extends PureComponent<Props, State> {
     private ref?;
     constructor(props: Props);
+    componentWillUnmount(): void;
     private onUploadEmoji;
     private prepareForUpload;
     onFileChooserClicked: () => void;

package/dist/types/index.d.ts

@@ -12,10 +12,10 @@ 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 { AbstractResource, Emoji, EmojiPlaceholder, EmojiLoader, EmojiPicker, EmojiUploader, EmojiResource, EmojiRepository, EmojiTypeAhead, ResourcedEmoji, denormaliseEmojiServiceResponse, toEmojiId, toOptionalEmojiId, recordSelectionFailedSli, recordSelectionSucceededSli, emojiPickerWidth, emojiPickerHeight, defaultEmojiHeight, customCategory, UsageFrequencyTracker, EmojiTypeAheadItem, };
+export { AbstractResource, Emoji, EmojiPlaceholder, EmojiLoader, EmojiPicker, EmojiUploader, EmojiResource, EmojiRepository, EmojiTypeAhead, ResourcedEmoji, denormaliseEmojiServiceResponse, toEmojiId, toOptionalEmojiId, recordSelectionFailedSli, recordSelectionSucceededSli, ufoExperiences, emojiPickerWidth, emojiPickerHeight, defaultEmojiHeight, customCategory, UsageFrequencyTracker, EmojiTypeAheadItem, };
 export type { EmojiProvider, UploadingEmojiProvider, EmojiResourceConfig, };
 export { SearchSort, } from './types';
 export type { CategoryId, EmojiRepresentation, EmojiServiceRepresentation, Message, OptionalEmojiDescription, OptionalEmojiDescriptionWithVariations, OptionalUser, RelativePosition, ToneSelection, AltRepresentations, CategoryDescription, EmojiDescription, EmojiDescriptionWithVariations, EmojiId, EmojiImageRepresentation, EmojiMeta, EmojiResponse, EmojiSearchResult, EmojiServiceDescription, EmojiServiceDescriptionWithVariations, EmojiServiceResponse, EmojiUpload, EmojiVariationDescription, ImageRepresentation, MediaApiRepresentation, MediaApiToken, OnCategory, OnEmojiEvent, OnToneSelected, OnToneSelectorCancelled, SearchOptions, SpriteImageRepresentation, SpriteRepresentation, SpriteServiceRepresentation, SpriteSheet, SpriteSheets, Styles, User, } from './types';

package/dist/types/util/analytics/analytics.d.ts

@@ -1,13 +1,9 @@
 import { AnalyticsEventPayload, CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
-import { EmojiDescription, EmojiId } from '../../types';
-import { ConcurrentExperience } from '@atlaskit/ufo';
-export declare type UfoExperienceName = 'emoji-rendered' | 'emoji-resource-fetched';
-export declare const ufoExperiences: Record<UfoExperienceName, ConcurrentExperience>;
-export declare const sampledUfoRenderedEmoji: (emojiId: EmojiId) => import("./samplingUfo").WithSampling;
+import { EmojiDescription } from '../../types';
 export declare const createAndFireEventInElementsChannel: (payload: Record<string, any>) => (createAnalyticsEvent: CreateUIAnalyticsEvent) => import("@atlaskit/analytics-next").UIAnalyticsEvent;
 export declare type EmojiInsertionAnalytic = (source: 'picker' | 'typeahead') => AnalyticsEventPayload;
-export declare const insertionSucceeded: EmojiInsertionAnalytic;
-export declare const insertionFailed: EmojiInsertionAnalytic;
+export declare const recordSucceeded: EmojiInsertionAnalytic;
+export declare const recordFailed: EmojiInsertionAnalytic;
 interface Duration {
     duration: number;
 }

package/dist/types/util/analytics/index.d.ts

@@ -1,5 +1,6 @@
 export { ufoExperiencesSampled, clearSampled, isExperienceSampled, withSampling, } from './samplingUfo';
 export type { UFOExperienceSampledRecords, WithSampling } from './samplingUfo';
-export { categoryClickedEvent, createAndFireEventInElementsChannel, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, insertionFailed, insertionSucceeded, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, recordSelectionFailedSli, recordSelectionSucceededSli, sampledUfoRenderedEmoji, selectedFileEvent, toneSelectedEvent, toneSelectorClosedEvent, toneSelectorOpenedEvent, typeaheadCancelledEvent, typeaheadRenderedEvent, typeaheadSelectedEvent, ufoExperiences, uploadBeginButton, uploadCancelButton, uploadConfirmButton, uploadFailedEvent, uploadSucceededEvent, } from './analytics';
-export type { EmojiInsertionAnalytic, UfoExperienceName } from './analytics';
+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 type { EmojiInsertionAnalytic } from './analytics';
 export { useSampledUFOComponentExperience } from './useSampledUFOComponentExperience';