@atlaskit/emoji 71.4.6 → 71.4.7

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

@@ -6,7 +6,16 @@ import Button from '@atlaskit/button/new';
 import UploadIcon from '@atlaskit/icon/core/upload';
 import { dropTargetForExternal } from '@atlaskit/pragmatic-drag-and-drop/external/adapter';
 import { containsFiles, getFiles } from '@atlaskit/pragmatic-drag-and-drop/external/file';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 export const chooseFileButtonTestId = 'choose-file-button';
 export const fileUploadInputTestId = 'file-upload';
 export const dropzoneTestId = 'file-dropzone';
@@ -60,7 +69,7 @@ const FileChooser = props => {
   }, [onChange]);
   useEffect(() => {
     const element = dropzoneRef.current;
-    if (!element || !expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+    if (!element || !isRefreshEmojiPickerEnabled()) {
       return;
     }
     const suppressNativeFileDrop = event => {
@@ -161,7 +170,7 @@ const FileChooser = props => {
     },
     "data-testid": fileUploadInputTestId
   });
-  if (expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+  if (isRefreshEmojiPickerEnabled()) {
     return /*#__PURE__*/React.createElement("div", {
       ref: dropzoneRef,
       "data-testid": dropzoneTestId,

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

@@ -1,7 +1,7 @@
 /* ToneSelector.tsx generated by @compiled/babel-plugin v0.39.1 */
 import "./ToneSelector.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 import React, { memo, useCallback, useEffect, useMemo, useRef } from 'react';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { createAndFireEventInElementsChannel, toneSelectedEvent, toneSelectorOpenedEvent } from '../../util/analytics';
@@ -9,6 +9,15 @@ import { setSkinToneAriaLabelText } from './setSkinToneAriaLabelText';
 import EmojiRadioButton from './EmojiRadioButton';
 import { useIntl } from 'react-intl';
 import { messages } from '../i18n';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 const hidden = null;
 export const toneSelectorTestId = 'tone-selector';
 const extractAllTones = emoji => {
@@ -92,7 +101,7 @@ export const ToneSelectorInternal = props => {
     "aria-label": formatMessage(messages.emojiSelectSkinToneListAriaLabelText),
     className: ax([!isVisible && "_tzy4idpf _3um015vq _1e0cglyw"])
   }, emojiToneCollection.map((tone, renderIndex) => {
-    return expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement(EmojiRadioButton, {
+    return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement(EmojiRadioButton, {
       ref: el => {
         radioRefs.current[renderIndex] = el;
         if (tone.isSelected && selectedToneRadioRef) {

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

@@ -7,12 +7,21 @@ import { cx } from '@atlaskit/css';
 import { useIntl } from 'react-intl';
 import { Pressable } from '@atlaskit/primitives/compiled';
 import Tooltip from '@atlaskit/tooltip';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 import { CATEGORYSELECTOR_KEYBOARD_KEYS_SUPPORTED, defaultCategories, KeyboardKeys } from '../../util/constants';
 import { messages } from '../i18n';
 import { CategoryDescriptionMap, CategoryDescriptionMapNew } from './categories';
 import { usePrevious } from '../../hooks/usePrevious';
 import { RENDER_EMOJI_PICKER_LIST_TESTID } from './EmojiPickerList';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 const styles = {
   commonCategory: "_2rko12b0 _v564h5h4 _189eidpf _bfhksm61 _ca0qze3t _n3tdze3t _19bvze3t _u5f3ze3t",
   commonCategoryNew: "_v564h5h4 _189eidpf _bfhksm61 _ca0qu2gc _n3tdu2gc _19bv12x7 _u5f312x7 _1e0c1txw _4cvr1h6o _1bah1h6o",
@@ -32,7 +41,7 @@ const addNewCategories = (oldCategories, newCategories) => {
   if (!newCategories) {
     return oldCategories;
   }
-  return oldCategories.concat(newCategories.filter(category => !!(expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? CategoryDescriptionMapNew : CategoryDescriptionMap)[category])).sort(expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? sortCategoriesNew : sortCategories);
+  return oldCategories.concat(newCategories.filter(category => !!(isRefreshEmojiPickerEnabled() ? CategoryDescriptionMapNew : CategoryDescriptionMap)[category])).sort(isRefreshEmojiPickerEnabled() ? sortCategoriesNew : sortCategories);
 };
 export const categorySelectorComponentTestId = 'category-selector-component';
 export const categorySelectorCategoryTestId = categoryId => `category-selector-${categoryId}`;
@@ -103,14 +112,14 @@ const CategorySelector = props => {
   };
   let categoriesSection;
   if (categories) {
-    categoriesSection = expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement("div", {
+    categoriesSection = isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
       role: "tablist",
       "aria-label": formatMessage(messages.categoriesSelectorLabel),
       "data-testid": categorySelectorComponentTestId,
       ref: categoryRef,
       className: ax(["_ca0qze3t _n3tdze3t _19bvu2gc _u5f3u2gc _1e0c1txw _2lx2vrvc _1bah1b1v _4cvr1fhb"])
     }, categories.map((categoryId, index) => {
-      const category = expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? CategoryDescriptionMapNew[categoryId] : CategoryDescriptionMap[categoryId];
+      const category = isRefreshEmojiPickerEnabled() ? CategoryDescriptionMapNew[categoryId] : CategoryDescriptionMap[categoryId];
       const Icon = category.icon;
       const categoryName = formatMessage(messages[category.name]);
       return /*#__PURE__*/React.createElement(Tooltip, {
@@ -140,7 +149,7 @@ const CategorySelector = props => {
       ref: categoryRef,
       className: ax(["_ca0q12x7 _n3td12x7 _19bvu2gc _u5f3u2gc _1e0c1txw _2lx2vrvc _1bah1b1v _4cvr1h6o"])
     }, categories.map((categoryId, index) => {
-      const category = expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? CategoryDescriptionMapNew[categoryId] : CategoryDescriptionMap[categoryId];
+      const category = isRefreshEmojiPickerEnabled() ? CategoryDescriptionMapNew[categoryId] : CategoryDescriptionMap[categoryId];
       const Icon = category.icon;
       const categoryName = formatMessage(messages[category.name]);
       return /*#__PURE__*/React.createElement(Tooltip, {
@@ -165,7 +174,7 @@ const CategorySelector = props => {
       })));
     }));
   }
-  return expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement("div", {
+  return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
     className: ax(["_16jlidpf _1o9zidpf _i0dl1wug _bfhkvuon _13li1mok _qrwq1mok _ca0qze3t _n3tdze3t _1doce4h9 _1il9nqa1 _1o3i1l7x _dpd31txw"])
   }, categoriesSection) : /*#__PURE__*/React.createElement("div", {
     className: ax(["_16jlidpf _1o9zidpf _i0dl1wug _bfhkhfxm _dpd31txw"])

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

@@ -5,12 +5,21 @@ import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { ufoExperiences } from '../../util/analytics';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 import LoadingEmojiComponent from '../common/LoadingEmojiComponent';
 import { LoadingItem } from './EmojiPickerVirtualItems';
 import { UfoErrorBoundary } from '../common/UfoErrorBoundary';
 import { defaultEmojiPickerSize } from '../../util/constants';
 import { EmojiCommonProvider } from '../../context/EmojiCommonProvider';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 const emojiPicker = null;
 const emojiPickerNew = null;
 const emojiPickerModuleLoader = () => import( /* webpackChunkName:"@atlaskit-internal_emojiPickerComponent" */'./EmojiPickerComponent');
@@ -42,7 +51,7 @@ export class EmojiPickerInternal extends LoadingEmojiComponent {
       }
     };
     ufoExperiences['emoji-picker-opened'].markFMP();
-    return expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement("div", {
+    return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
       ref: handlePickerRef,
       className: ax(["_19itahnd _2rko1mok _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iixjv _1bsb1edt _1ul91edt _1tke5x59 _c71l1y6z"])
     }, item.renderItem()) : /*#__PURE__*/React.createElement("div", {

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

@@ -2,7 +2,7 @@
 import "./EmojiPickerComponent.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 import { useCallback, useEffect, useMemo, useRef, useState, createRef, memo } from 'react';
 import { getDocument } from '@atlaskit/browser-apis';
 import { dropTargetForExternal, monitorForExternal } from '@atlaskit/pragmatic-drag-and-drop/external/adapter';
@@ -28,6 +28,15 @@ import { useIsMounted } from '../../hooks/useIsMounted';
 import { messages } from '../i18n';
 import { defaultProductivityColor, getStoredProductivityColor, storeProductivityColor } from '../../util/productivity-colors';
 import { filterHiddenEmojis } from '../../util/hidden-emojis';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 const emojiPickerBoxShadow = "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)";
 const emojiPickerHeight = 295;
 const emojiPickerHeightWithPreview = 349; // emojiPickerHeight + emojiPickerPreviewHeight;
@@ -80,7 +89,7 @@ const EmojiPickerComponent = ({
     emojiProvider,
     isUploadSupported
   } = useEmoji();
-  const isTeamojiExperimentEnabled = expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  const isTeamojiExperimentEnabled = isRefreshEmojiPickerEnabled();
   const [filteredEmojis, setFilteredEmojis] = useState([]);
   const [searchEmojis, setSearchEmojis] = useState([]);
   const [frequentlyUsedEmojis, setFrequentlyUsedEmojis] = useState([]);
@@ -124,7 +133,7 @@ const EmojiPickerComponent = ({
     }
   }, [selectedEmoji]);
   const onEmojiLeave = useCallback(() => {
-    if (expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+    if (isRefreshEmojiPickerEnabled()) {
       setSelectedEmoji(undefined);
     }
   }, []);
@@ -132,16 +141,16 @@ const EmojiPickerComponent = ({
     // Ignore scroll-driven category changes while a programmatic reveal()
     // scroll is in progress — they would flicker the indicator through
     // intermediate categories before landing on the correct one.
-    if (isProgrammaticScroll.current && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+    if (isProgrammaticScroll.current && isRefreshEmojiPickerEnabled()) {
       return;
     }
     // Ignore scroll-driven category changes while the upload or delete screen is open
-    if ((uploading || emojiToDelete) && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+    if ((uploading || emojiToDelete) && isRefreshEmojiPickerEnabled()) {
       return;
     }
     if (activeCategory !== category) {
       setActiveCategory(category);
-      if (!query && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+      if (!query && isRefreshEmojiPickerEnabled()) {
         lastNonSearchCategory.current = category;
       }
     }
@@ -158,7 +167,7 @@ const EmojiPickerComponent = ({
       setUploadErrorMessage(undefined);
     });
     fireAnalytics(uploadCancelButton());
-    if (expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+    if (isRefreshEmojiPickerEnabled()) {
       setTimeout(() => {
         var _getDocument, _getDocument$getEleme;
         (_getDocument = getDocument()) === null || _getDocument === void 0 ? void 0 : (_getDocument$getEleme = _getDocument.getElementById('add-custom-emoji')) === null || _getDocument$getEleme === void 0 ? void 0 : _getDocument$getEleme.focus();
@@ -310,7 +319,7 @@ const EmojiPickerComponent = ({
     }
 
     // If the upload or delete screen is open, close it when a category is selected
-    if (expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+    if (isRefreshEmojiPickerEnabled()) {
       if (uploading) {
         setUploading(false);
         setUploadErrorMessage(undefined);
@@ -366,7 +375,7 @@ const EmojiPickerComponent = ({
     };
     if (searchQuery !== query) {
       // Capture the active category before entering search so we can keep it highlighted
-      if (!query && searchQuery && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+      if (!query && searchQuery && isRefreshEmojiPickerEnabled()) {
         lastNonSearchCategory.current = activeCategory;
       }
       setQuery(searchQuery);
@@ -382,7 +391,7 @@ const EmojiPickerComponent = ({
   // cannot reach underlying page drop handlers (e.g. the Confluence editor).
   useEffect(() => {
     var _getDocument2;
-    if (!uploading || !expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+    if (!uploading || !isRefreshEmojiPickerEnabled()) {
       return;
     }
     const body = (_getDocument2 = getDocument()) === null || _getDocument2 === void 0 ? void 0 : _getDocument2.body;
@@ -442,7 +451,7 @@ const EmojiPickerComponent = ({
       });
       scrollToUploadedEmoji(emojiDescription);
     };
-    if (expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) {
+    if (isRefreshEmojiPickerEnabled()) {
       const uploadShortName = `:${upload.name.toLowerCase()}:`;
       const existing = await emojiProvider.findByShortName(uploadShortName);
       if (existing) {
@@ -561,14 +570,14 @@ const EmojiPickerComponent = ({
       emojiProvider.unsubscribe(onProviderChange);
     };
   }, [emojiProvider, onProviderChange]);
-  const showPreview = expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? !uploading : selectedEmoji && !uploading;
+  const showPreview = isRefreshEmojiPickerEnabled() ? !uploading : selectedEmoji && !uploading;
   return /*#__PURE__*/React.createElement("div", {
     ref: setPickerRef,
     "data-emoji-picker-container": true,
     role: "dialog",
     "aria-label": formatMessage(messages.emojiPickerTitle),
     "aria-modal": true,
-    className: ax([expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? "_19itahnd _2rko1mok _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iaq3k _1bsb1edt _1ul91edt _c71l1y6z _kqswh2mm" : "_19itahnd _2rkofajl _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iaq3k _1bsb1edt _1ul91edt _c71l1y6z _kqswh2mm", !!emojiToDelete && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? withDeleteRefreshHeight[size] : uploading && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? withUploadRefreshHeight[size] : query && filteredEmojis.length === 0 && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? withNoResultsRefreshHeight[size] : showPreview ? withPreviewHeight[size] : withoutPreviewHeight[size]])
+    className: ax([isRefreshEmojiPickerEnabled() ? "_19itahnd _2rko1mok _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iaq3k _1bsb1edt _1ul91edt _c71l1y6z _kqswh2mm" : "_19itahnd _2rkofajl _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iaq3k _1bsb1edt _1ul91edt _c71l1y6z _kqswh2mm", !!emojiToDelete && isRefreshEmojiPickerEnabled() ? withDeleteRefreshHeight[size] : uploading && isRefreshEmojiPickerEnabled() ? withUploadRefreshHeight[size] : query && filteredEmojis.length === 0 && isRefreshEmojiPickerEnabled() ? withNoResultsRefreshHeight[size] : showPreview ? withPreviewHeight[size] : withoutPreviewHeight[size]])
   }, /*#__PURE__*/React.createElement("div", {
     role: "presentation",
     onKeyPress: suppressKeyPress,
@@ -576,7 +585,7 @@ const EmojiPickerComponent = ({
     onKeyDown: suppressKeyPress,
     className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bah1yb4 _1tkeidpf"])
   }, /*#__PURE__*/React.createElement(CategorySelector, {
-    activeCategoryId: (uploading || emojiToDelete) && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? null : activeCategory,
+    activeCategoryId: (uploading || emojiToDelete) && isRefreshEmojiPickerEnabled() ? null : activeCategory,
     dynamicCategories: dynamicCategories,
     disableCategories: disableCategories,
     onCategorySelected: onCategorySelected
@@ -611,7 +620,7 @@ const EmojiPickerComponent = ({
     onOpenUpload: onOpenUpload,
     size: size,
     activeCategoryId: activeCategory
-  }), showPreview && !(emojiToDelete && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) && !(query && filteredEmojis.length === 0 && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false)) && /*#__PURE__*/React.createElement(EmojiPickerFooter, {
+  }), showPreview && !(emojiToDelete && isRefreshEmojiPickerEnabled()) && !(query && filteredEmojis.length === 0 && isRefreshEmojiPickerEnabled()) && /*#__PURE__*/React.createElement(EmojiPickerFooter, {
     selectedEmoji: selectedEmoji,
     uploadEnabled: isUploadSupported && !uploading,
     onOpenUpload: onOpenUpload

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

@@ -7,7 +7,16 @@ import { useIntl } from 'react-intl';
 import { Box } from '@atlaskit/primitives/compiled';
 import { EmojiPreviewComponent } from '../common/EmojiPreviewComponent';
 import { AddOwnEmoji } from '../common/AddEmoji';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 const emojiPickerFooter = null;
 const emojiPickerFooterWithTopShadow = null;
 const emojiPickerFooterWithTopShadowNew = null;
@@ -21,7 +30,7 @@ const EmojiPickerFooter = ({
   uploadEnabled
 }) => {
   const intl = useIntl();
-  return expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement("div", {
+  return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
     "data-testid": emojiPickerFooterTestId,
     className: ax(["_16jlidpf _1o9zidpf _i0dl1wug", "_x3doia51"])
   }, selectedEmoji ? /*#__PURE__*/React.createElement(Box, {

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

@@ -1,5 +1,5 @@
 import { useIntl } from 'react-intl';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 import React, { useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { customCategory, defaultEmojiPickerSize, frequentCategory, searchCategory, userCustomTitle, yourUploadsCategory } from '../../util/constants';
 import { filterProductivityEmojisByColor, getProductivityColorPreviewEmojis } from '../../util/productivity-colors';
@@ -21,6 +21,15 @@ import { messages } from '../i18n';
 export const RENDER_EMOJI_PICKER_LIST_TESTID = 'render-emoji-picker-list';
 const categoryClassname = 'emoji-category';
 const teamojiRefreshExperimentName = 'platform_teamoji_26_refresh_emoji_picker';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue(teamojiRefreshExperimentName, 'isEnabled', false);
+  return isEnabled;
+};
 const atlassianCategory = 'ATLASSIAN';
 const atlassianSubcategoryOrder = ['Faces', 'Hands', 'Reactions', 'Objects', 'Productivity', 'Logos'];
 
@@ -77,7 +86,7 @@ export const EmojiPickerVirtualListInternal = /*#__PURE__*/React.forwardRef((pro
   const [lastYourUploadsRow, setLastYourUploadsRow] = useState(0);
   const categoryTracker = useMemo(() => new CategoryTracker(), []);
   const [categoriesChanged, setCategoriesChanged] = useState(false);
-  const isTeamojiExperimentEnabled = expVal(teamojiRefreshExperimentName, 'isEnabled', false);
+  const isTeamojiExperimentEnabled = isRefreshEmojiPickerEnabled();
   const visibleEmojis = useMemo(() => isTeamojiExperimentEnabled ? filterHiddenEmojis(emojis) : emojis, [emojis, isTeamojiExperimentEnabled]);
   const productivityColorPreviewEmojis = useMemo(() => isTeamojiExperimentEnabled ? getProductivityColorPreviewEmojis(visibleEmojis) : {}, [isTeamojiExperimentEnabled, visibleEmojis]);
   const addToCategoryMap = useCallback((categoryToGroupMap, emoji, category) => {

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

@@ -9,7 +9,16 @@ import { useIntl } from 'react-intl';
 import { useDebouncedCallback } from 'use-debounce';
 import { EMOJI_SEARCH_DEBOUNCE } from '../../util/constants';
 import { messages } from '../i18n';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 const input = null;
 const inputNew = null;
 const textFieldWrapperNew = null;
@@ -58,7 +67,7 @@ export const EmojiPickerListSearch = props => {
     role: "status"
   }, dirty ? query === '' ? formatMessage(messages.searchResultsStatusSeeAll) : formatMessage(messages.searchResultsStatus, {
     count: resultsCount
-  }) : null), expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement("div", {
+  }) : null), isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
     className: ax(["_n6341l7x _18z11b66"])
   }, /*#__PURE__*/React.createElement(TextField, {
     role: "searchbox",

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

@@ -5,9 +5,18 @@ import { ax, ix } from "@compiled/react/runtime";
 import React, { useCallback, useImperativeHandle } from 'react';
 import { useVirtualizer } from '@tanstack/react-virtual';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 import { useEmojiPickerListContext } from '../../hooks/useEmojiPickerListContext';
 import { EMOJIPICKERLIST_KEYBOARD_KEYS_SUPPORTED, EMOJI_LIST_COLUMNS, EMOJI_LIST_PAGE_COUNT, KeyboardNavigationDirection, KeyboardKeys } from '../../util/constants';
+const isRefreshEmojiPickerEnabled = () => {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  const isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 const virtualList = null;
 const virtualRowStyle = null;
 export const virtualListScrollContainerTestId = 'virtual-list-scroll-container';
@@ -56,7 +65,7 @@ export const VirtualList = /*#__PURE__*/React.forwardRef((props, ref) => {
     const elemBottom = elementRect.bottom;
     const parentTop = parentRect.top;
     const parentBottom = parentRect.bottom;
-    const isVisible = expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? elemTop >= parentTop && elemBottom <= parentBottom : elemBottom > parentTop && elemTop < parentBottom;
+    const isVisible = isRefreshEmojiPickerEnabled() ? elemTop >= parentTop && elemBottom <= parentBottom : elemBottom > parentTop && elemTop < parentBottom;
     return isVisible;
   };
   const getFirstVisibleListElementIndex = useCallback(() => {
@@ -73,7 +82,7 @@ export const VirtualList = /*#__PURE__*/React.forwardRef((props, ref) => {
       var _virtualList$firstVis;
       return ((_virtualList$firstVis = virtualList[firstVisibleIndex]) === null || _virtualList$firstVis === void 0 ? void 0 : _virtualList$firstVis.index) || 0;
     }
-    return expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? ((_virtualList$ = virtualList[0]) === null || _virtualList$ === void 0 ? void 0 : _virtualList$.index) || 0 : 0;
+    return isRefreshEmojiPickerEnabled() ? ((_virtualList$ = virtualList[0]) === null || _virtualList$ === void 0 ? void 0 : _virtualList$.index) || 0 : 0;
   }, [rowVirtualizer]);
 
   /**

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

@@ -9,7 +9,7 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
   actionSubjectId,
   attributes: {
     packageName: "@atlaskit/emoji",
-    packageVersion: "71.4.5",
+    packageVersion: "71.4.6",
     ...attributes
   }
 });

package/dist/esm/api/EmojiRepository.js

@@ -10,7 +10,7 @@ import { tokenizerRegex } from './EmojiRepositoryRegex';
 import { createSearchEmojiComparator, createUsageOnlyEmojiComparator } from './internal/Comparators';
 import { UsageFrequencyTracker } from './internal/UsageFrequencyTracker';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 // FS-1097 - duplicated in mentions - extract at some point into a shared library
 var Tokenizer = /*#__PURE__*/function () {
   function Tokenizer() {
@@ -109,6 +109,15 @@ var findEmojiIndex = function findEmojiIndex(emojis, toFind) {
   return match;
 };
 var teamojiRefreshExperimentName = 'platform_teamoji_26_refresh_emoji_picker';
+var isRefreshEmojiPickerEnabled = function isRefreshEmojiPickerEnabled() {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  var isEnabled = FeatureGates.getExperimentValue(teamojiRefreshExperimentName, 'isEnabled', false);
+  return isEnabled;
+};
 var EmojiRepository = /*#__PURE__*/function () {
   // protected to allow subclasses to access (for testing and storybooks).
 
@@ -198,7 +207,7 @@ var EmojiRepository = /*#__PURE__*/function () {
     value: function findInCategory(categoryId) {
       if (categoryId === frequentCategory) {
         return this.getFrequentlyUsed();
-      } else if (expVal(teamojiRefreshExperimentName, 'isEnabled', false) && categoryId === 'ATLASSIAN') {
+      } else if (isRefreshEmojiPickerEnabled() && categoryId === 'ATLASSIAN') {
         return this.all().emojis.filter(function (emoji) {
           return emoji.type === 'ATLASSIAN';
         });
@@ -351,7 +360,7 @@ var EmojiRepository = /*#__PURE__*/function () {
       this.asciiMap = new Map();
       var categorySet = new Set();
       this.emojis.forEach(function (emoji) {
-        categorySet.add(_this3.getDynamicCategoryForEmoji(emoji, expVal(teamojiRefreshExperimentName, 'isEnabled', false)));
+        categorySet.add(_this3.getDynamicCategoryForEmoji(emoji, isRefreshEmojiPickerEnabled()));
         _this3.addToMaps(emoji);
       });
       if (this.usageTracker.getOrder().length) {
@@ -369,7 +378,7 @@ var EmojiRepository = /*#__PURE__*/function () {
       this.fullSearch.searchIndex = new UnorderedSearchIndex();
       this.fullSearch.addIndex('name');
       this.fullSearch.addIndex('shortName');
-      if (expVal(teamojiRefreshExperimentName, 'isEnabled', false)) {
+      if (isRefreshEmojiPickerEnabled()) {
         this.fullSearch.addIndex('keywords');
       }
       this.fullSearch.addDocuments(this.getAllSearchableEmojis());
@@ -416,7 +425,7 @@ var EmojiRepository = /*#__PURE__*/function () {
   }, {
     key: "addToDynamicCategories",
     value: function addToDynamicCategories(emoji) {
-      var category = this.getDynamicCategoryForEmoji(emoji, expVal(teamojiRefreshExperimentName, 'isEnabled', false));
+      var category = this.getDynamicCategoryForEmoji(emoji, isRefreshEmojiPickerEnabled());
       if (defaultCategories.indexOf(category) === -1 && this.dynamicCategoryList.indexOf(category) === -1) {
         this.dynamicCategoryList.push(category);
       }

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

@@ -7,7 +7,16 @@ import CrossCircleIcon from '@atlaskit/icon/core/cross-circle';
 import { deleteEmojiLabel } from '../../util/constants';
 import { emojiDeleteButton } from './styles';
 import { Box } from '@atlaskit/primitives/compiled';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
+var isRefreshEmojiPickerEnabled = function isRefreshEmojiPickerEnabled() {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  var isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 var styles = {
   boxWrapperStyle: "_1bsbf6fq _4t3if6fq"
 };
@@ -19,7 +28,7 @@ var refreshedDeleteButton = null;
  */
 export var RENDER_EMOJI_DELETE_BUTTON_TESTID = 'render-emoji-delete-button';
 var DeleteButton = function DeleteButton(props) {
-  var isRefreshEnabled = expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  var isRefreshEnabled = isRefreshEmojiPickerEnabled();
   return /*#__PURE__*/React.createElement("span", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: ax(["_3um015vq _1e0c1txw _kqswstnw _154ix0bf _1xi2x0bf _1pbykb7n _13t3idpf", isRefreshEnabled && "_154ir5cr _1xi2r5cr", emojiDeleteButton]),

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

@@ -6,7 +6,7 @@ import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { Fragment, useState, useRef, memo, useLayoutEffect, useCallback, useEffect } from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
+import FeatureGates from '@atlaskit/feature-gate-js-client';
 import { FormattedMessage, injectIntl } from 'react-intl';
 import EmojiDeletePreview from './EmojiDeletePreview';
 import EmojiUploadPicker from './EmojiUploadPicker';
@@ -23,6 +23,15 @@ import { emojiPickerAddEmoji } from './styles';
 import { DEFAULT_TONE } from '../../util/constants';
 import { Box } from '@atlaskit/primitives/compiled';
 import { layers } from '@atlaskit/theme/constants';
+var isRefreshEmojiPickerEnabled = function isRefreshEmojiPickerEnabled() {
+  if (!FeatureGates.initializeCompleted()) {
+    return false;
+  }
+
+  // eslint-disable-next-line @atlaskit/platform/use-recommended-utils
+  var isEnabled = FeatureGates.getExperimentValue('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false);
+  return isEnabled;
+};
 var styles = {
   icon: "_18u0r5cr _2hwx1i6y"
 };
@@ -131,7 +140,7 @@ var TonesWrapper = function TonesWrapper(props) {
       openProductivityColorSelectorWithKeyboard.current = true;
     }
   }, []);
-  var shouldShowProductivityColorSelector = !!(activeCategoryId === 'ATLASSIAN' && productivityColorPreviewEmojis && selectedProductivityColor && onProductivityColorSelected && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false));
+  var shouldShowProductivityColorSelector = !!(activeCategoryId === 'ATLASSIAN' && productivityColorPreviewEmojis && selectedProductivityColor && onProductivityColorSelected && isRefreshEmojiPickerEnabled());
   if (shouldShowProductivityColorSelector) {
     var previewEmoji = (productivityColorPreviewEmojis === null || productivityColorPreviewEmojis === void 0 ? void 0 : productivityColorPreviewEmojis[selectedProductivityColor]) || Object.values(productivityColorPreviewEmojis || {})[0];
     if (!previewEmoji) {
@@ -212,7 +221,7 @@ export var EmojiActions = function EmojiActions(props) {
     showToneSelector = _useState6[0],
     setShowToneSelector = _useState6[1];
   var wasProductivityColorSelectorOpen = useRef(false);
-  var shouldUseProductivityColorControl = !!(props.activeCategoryId === 'ATLASSIAN' && props.productivityColorPreviewEmojis && props.selectedProductivityColor && props.onProductivityColorSelected && expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false));
+  var shouldUseProductivityColorControl = !!(props.activeCategoryId === 'ATLASSIAN' && props.productivityColorPreviewEmojis && props.selectedProductivityColor && props.onProductivityColorSelected && isRefreshEmojiPickerEnabled());
   var onToneOpenHandler = useCallback(function () {
     return setShowToneSelector(true);
   }, []);
@@ -250,7 +259,7 @@ export var EmojiActions = function EmojiActions(props) {
     }
   }, [shouldUseProductivityColorControl, showToneSelector]);
   if (uploading) {
-    return expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement("div", {
+    return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
       className: ax(["_16jlidpf _1o9zidpf _i0dl1wug"])
     }, /*#__PURE__*/React.createElement(EmojiUploadPicker, {
       onUploadCancelled: onUploadCancelled,
@@ -269,7 +278,7 @@ export var EmojiActions = function EmojiActions(props) {
     }));
   }
   if (emojiToDelete) {
-    return expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement("div", {
+    return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
       className: ax(["_16jlidpf _1o9zidpf _i0dl1wug"])
     }, /*#__PURE__*/React.createElement(EmojiDeletePreview, {
       emoji: emojiToDelete,
@@ -283,7 +292,7 @@ export var EmojiActions = function EmojiActions(props) {
       onCloseDelete: onCloseDelete
     }));
   }
-  return expVal('platform_teamoji_26_refresh_emoji_picker', 'isEnabled', false) ? /*#__PURE__*/React.createElement("div", {
+  return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
     "data-testid": emojiActionsTestId,
     onMouseLeave: onMouseLeaveHandler,
     onBlur: fg('platform_suppression_removal_fix_reactions') ? onMouseLeaveHandler : undefined,