@atlaskit/emoji 73.3.2 → 73.3.4

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

@@ -6,36 +6,25 @@ import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { useEffect, useLayoutEffect, useState, useRef, memo, useCallback } from 'react';
-import FocusLock from 'react-focus-lock';
 import { FormattedMessage, injectIntl } from 'react-intl';
 import { getDocument } from '@atlaskit/browser-apis';
 import Button from '@atlaskit/button/default/button';
-import AkButton from '@atlaskit/button/standard-button';
-import CrossIcon from '@atlaskit/icon/core/cross';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { Box } from '@atlaskit/primitives/compiled/box';
-import { Text } from '@atlaskit/primitives/compiled/text';
 import TextField from '@atlaskit/textfield/text-field';
 import * as ImageUtil from '../../util/image';
 import debug from '../../util/logger';
 import { messages } from '../i18n';
 import CreateEmojiWithRovo from './CreateEmojiWithRovo';
 import EmojiErrorMessage from './EmojiErrorMessage';
-import EmojiUploadPreview from './EmojiUploadPreview';
 import FileChooser from './FileChooser';
 import { UploadStatus } from './internal-types';
-import { isRefreshEmojiPickerEnabled } from './isRefreshEmojiPickerEnabled';
-var closeEmojiUploadButton = null;
 var uploadAddRowNew = null;
-var emojiUpload = null;
 var emojiUploadNew = null;
-var emojiUploadTop = null;
 var emojiUploadTopNew = null;
 var labelStyles = null;
 var labelStylesNew = null;
-var uploadChooseFileEmojiName = null;
 var uploadChooseFileMessage = null;
-var uploadChooseFileRow = null;
 var uploadChooseFileRowNew = null;
 var supportedEmojiUploadMimeTypes = new Set(['image/png', 'image/jpeg', 'image/gif']);
 var supportedEmojiUploadExtensions = ['.png', '.jpg', '.jpeg', '.gif'];
@@ -60,9 +49,6 @@ var toDefaultUploadName = function toDefaultUploadName(fileName) {
   return sanitizeName(nameWithoutExtension).slice(0, maxNameLength);
 };
 var isSupportedEmojiUploadFileType = function isSupportedEmojiUploadFileType(file) {
-  if (!isRefreshEmojiPickerEnabled()) {
-    return true;
-  }
   if (supportedEmojiUploadMimeTypes.has(file.type)) {
     return true;
   }
@@ -86,7 +72,6 @@ var ChooseEmojiFile = /*#__PURE__*/memo(function (props) {
     aiSection = props.aiSection,
     intl = props.intl;
   var formatMessage = intl.formatMessage;
-  var disableChooser = !name;
   var fileChooserButtonDescriptionId = 'choose.emoji.file.button.screen.reader.description.id';
   var inputRef = useRef(null);
   var onKeyDownHandler = useCallback(function (event) {
@@ -100,14 +85,12 @@ var ChooseEmojiFile = /*#__PURE__*/memo(function (props) {
       (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
     });
   }, []);
-  var cancelLabel = formatMessage(messages.cancelLabel);
   var emojiPlaceholder = formatMessage(messages.emojiPlaceholder);
   var emojiNameAriaLabel = formatMessage(messages.emojiNameAriaLabel);
-  var emojiChooseFileTitle = formatMessage(messages.emojiChooseFileTitle);
   var emojiChooseFileTitleNew = formatMessage(messages.emojiChooseFileDndTitle);
   var isUploading = uploadStatus === UploadStatus.Uploading;
   var addEmojiDisabled = !previewImage || !name || isUploading;
-  return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     "data-testid": uploadEmojiComponentTestId,
     className: ax(["_ca0qu2gc _u5f3pxbi _n3tdu2gc _19bvpxbi _1e0c1txw _2lx21bp4 _1bah1b1v"])
   }, /*#__PURE__*/React.createElement("div", {
@@ -119,7 +102,7 @@ var ChooseEmojiFile = /*#__PURE__*/memo(function (props) {
     className: ax(["_zulp12x7 _1e0c1txw _2lx21bp4 _1tker0r7"])
   }, /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.emojiChooseFileScreenReaderDescription, function () {
     return /*#__PURE__*/React.createElement(FileChooser, {
-      label: isRefreshEmojiPickerEnabled() ? emojiChooseFileTitleNew : emojiChooseFileTitle,
+      label: emojiChooseFileTitleNew,
       onChange: onChooseFile,
       onClick: onClick,
       accept: "image/png,image/jpeg,image/gif",
@@ -164,62 +147,7 @@ var ChooseEmojiFile = /*#__PURE__*/memo(function (props) {
     appearance: "primary",
     isDisabled: addEmojiDisabled,
     isLoading: isUploading
-  }, /*#__PURE__*/React.createElement(FormattedMessage, messages.addEmojiLabel)))) : /*#__PURE__*/React.createElement("div", {
-    "data-testid": uploadEmojiComponentTestId,
-    className: ax(["_ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _1e0c1txw _2lx21bp4 _1bah1b1v"])
-  }, /*#__PURE__*/React.createElement("div", {
-    className: ax(["_11c8wadc _n3tdu2gc _1e0c1txw _1bah1yb4 _4cvresu3"])
-  }, /*#__PURE__*/React.createElement("label", {
-    htmlFor: "new-emoji-name-input",
-    className: ax(["_1w90azsu", "_11c8wadc _k48p1pd9"])
-  }, /*#__PURE__*/React.createElement(FormattedMessage, messages.addCustomEmojiLabel)), /*#__PURE__*/React.createElement("div", {
-    className: ax(["_1e0c1txw"])
-  }, /*#__PURE__*/React.createElement(AkButton, {
-    onClick: onUploadCancelled,
-    "aria-label": cancelLabel,
-    appearance: "subtle",
-    spacing: "none",
-    shouldFitContainer: true,
-    testId: cancelEmojiUploadPickerTestId,
-    name: messages.addCustomEmojiLabel.defaultMessage
-  }, /*#__PURE__*/React.createElement(CrossIcon, {
-    color: "currentColor",
-    label: cancelLabel
-  })))), /*#__PURE__*/React.createElement("div", {
-    className: ax(["_1e0c1txw _1bah1yb4 _n3tdu2gc _gy1p12x7"])
-  }, /*#__PURE__*/React.createElement("span", {
-    className: ax(["_16jlkb7n _1o9zkb7n _i0dl1wug _1rwq1j28 _scffidpf _xmji1r31 _gxxuglyw _34ir1o36 _coc6glyw _9bj2glyw"])
-  }, /*#__PURE__*/React.createElement(TextField, {
-    placeholder: emojiPlaceholder,
-    "aria-label": emojiNameAriaLabel,
-    maxLength: maxNameLength,
-    onChange: onNameChange,
-    onKeyDown: onKeyDownHandler,
-    value: name,
-    isCompact: true,
-    autoFocus: true,
-    testId: uploadEmojiNameInputTestId,
-    ref: inputRef,
-    id: "new-emoji-name-input",
-    "aria-required": true
-  })), /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.emojiChooseFileScreenReaderDescription, function () {
-    return /*#__PURE__*/React.createElement(FileChooser, {
-      label: isRefreshEmojiPickerEnabled() ? emojiChooseFileTitleNew : emojiChooseFileTitle,
-      onChange: onChooseFile,
-      onClick: onClick,
-      accept: "image/png,image/jpeg,image/gif",
-      ariaDescribedBy: fileChooserButtonDescriptionId,
-      isDisabled: disableChooser
-    });
-  }))), /*#__PURE__*/React.createElement("div", {
-    id: fileChooserButtonDescriptionId
-  }, !errorMessage ? /*#__PURE__*/React.createElement(Text, {
-    as: "p",
-    size: "small"
-  }, /*#__PURE__*/React.createElement(FormattedMessage, messages.emojiImageRequirements)) : /*#__PURE__*/React.createElement(EmojiErrorMessage, {
-    errorStyle: "chooseFile",
-    message: errorMessage
-  })));
+  }, /*#__PURE__*/React.createElement(FormattedMessage, messages.addEmojiLabel))));
 });
 var EmojiUploadPicker = function EmojiUploadPicker(props) {
   var _document$activeEleme;
@@ -228,8 +156,6 @@ var EmojiUploadPicker = function EmojiUploadPicker(props) {
     onUploadEmoji = props.onUploadEmoji,
     onFileChooserClicked = props.onFileChooserClicked,
     onUploadCancelled = props.onUploadCancelled,
-    _props$disableFocusLo = props.disableFocusLock,
-    disableFocusLock = _props$disableFocusLo === void 0 ? false : _props$disableFocusLo,
     contentId = props.contentId,
     fireAnalytics = props.fireAnalytics,
     onUploadPreviewErrorChange = props.onUploadPreviewErrorChange,
@@ -345,7 +271,7 @@ var EmojiUploadPicker = function EmojiUploadPicker(props) {
             case 0:
               _context.prev = 0;
               setFilename(file.name);
-              if (!name && isRefreshEmojiPickerEnabled()) {
+              if (!name) {
                 setName(toDefaultUploadName(file.name));
               }
               _context.next = 1;
@@ -417,7 +343,7 @@ var EmojiUploadPicker = function EmojiUploadPicker(props) {
   var onChooseFileClicked = function onChooseFileClicked() {
     onFileChooserClicked && onFileChooserClicked();
   };
-  var isDuplicateNameError = errorMessage !== null && errorMessage !== undefined && isRefreshEmojiPickerEnabled();
+  var isDuplicateNameError = errorMessage !== null && errorMessage !== undefined;
 
   // "Create an emoji with Rovo" AI generation section. Only rendered when the
   // experiment is on AND a page content id is available (the image generation
@@ -429,14 +355,7 @@ var EmojiUploadPicker = function EmojiUploadPicker(props) {
     fireAnalytics: fireAnalytics,
     onEmojiGenerated: onEmojiGenerated
   }) : null;
-  var content = name && previewImage && !isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement(EmojiUploadPreview, {
-    errorMessage: errorMessage,
-    name: name,
-    onAddEmoji: onAddEmoji,
-    onUploadCancelled: cancelUpload,
-    previewImage: previewImage,
-    uploadStatus: uploadStatus
-  }) : /*#__PURE__*/React.createElement(ChooseEmojiFile, {
+  var content = /*#__PURE__*/React.createElement(ChooseEmojiFile, {
     name: name,
     onChooseFile: onChooseFile,
     onClick: onChooseFileClicked,
@@ -450,9 +369,7 @@ var EmojiUploadPicker = function EmojiUploadPicker(props) {
     aiSection: aiSection,
     intl: intl
   });
-  return disableFocusLock || isRefreshEmojiPickerEnabled() ? content : /*#__PURE__*/React.createElement(FocusLock, {
-    noFocusGuards: true
-  }, content);
+  return content;
 };
 
 // eslint-disable-next-line @typescript-eslint/no-restricted-types

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

@@ -8,7 +8,6 @@ import UploadIcon from '@atlaskit/icon/core/upload';
 import { dropTargetForExternal } from '@atlaskit/pragmatic-drag-and-drop/adapter/drop-target-for-external';
 import { containsFiles } from '@atlaskit/pragmatic-drag-and-drop/utils/contains-files';
 import { getFiles } from '@atlaskit/pragmatic-drag-and-drop/utils/get-files';
-import { isRefreshEmojiPickerEnabled } from './isRefreshEmojiPickerEnabled';
 export var chooseFileButtonTestId = 'choose-file-button';
 export var fileUploadInputTestId = 'file-upload';
 export var dropzoneTestId = 'file-dropzone';
@@ -67,7 +66,7 @@ var FileChooser = function FileChooser(props) {
   }, [onChange]);
   useEffect(function () {
     var element = dropzoneRef.current;
-    if (!element || !isRefreshEmojiPickerEnabled()) {
+    if (!element) {
       return;
     }
     var suppressNativeFileDrop = function suppressNativeFileDrop(event) {
@@ -169,31 +168,22 @@ var FileChooser = function FileChooser(props) {
     },
     "data-testid": fileUploadInputTestId
   });
-  if (isRefreshEmojiPickerEnabled()) {
-    return /*#__PURE__*/React.createElement("div", {
-      ref: dropzoneRef,
-      "data-testid": dropzoneTestId,
-      "data-dragging": isDragging ? 'true' : undefined,
-      role: "region",
-      "aria-label": label,
-      className: ax(["_zulpu2gc _2rko1qi0 _189ee4h9 _1dqogq9o _1h6d1l7x _1e0c1txw _2lx21bp4 _4cvr1h6o _1bah1h6o _4t3i7l9q _u5f3utpp _19bvutpp _bfhkhfxm _80omtlke _k8m01rje _1oec1ign _6fl4574g", isDragging && "_1h6dq98m _bfhkufnl"])
-    }, previewImage ? /*#__PURE__*/React.createElement("img", {
-      src: previewImage,
-      alt: previewAlt,
-      className: ax(["_c71l1j4a _p12f1osq _5ral1f51"])
-    }) : /*#__PURE__*/React.createElement(Button, {
-      onClick: handleOnChooseFile,
-      isDisabled: isDisabled,
-      appearance: "subtle",
-      iconBefore: UploadIcon,
-      "aria-describedby": ariaDescribedBy,
-      testId: chooseFileButtonTestId,
-      ref: fileButtonRef
-    }, label), hiddenInput);
-  }
-  return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Button, {
+  return /*#__PURE__*/React.createElement("div", {
+    ref: dropzoneRef,
+    "data-testid": dropzoneTestId,
+    "data-dragging": isDragging ? 'true' : undefined,
+    role: "region",
+    "aria-label": label,
+    className: ax(["_zulpu2gc _2rko1qi0 _189ee4h9 _1dqogq9o _1h6d1l7x _1e0c1txw _2lx21bp4 _4cvr1h6o _1bah1h6o _4t3i7l9q _u5f3utpp _19bvutpp _bfhkhfxm _80omtlke _k8m01rje _1oec1ign _6fl4574g", isDragging && "_1h6dq98m _bfhkufnl"])
+  }, previewImage ? /*#__PURE__*/React.createElement("img", {
+    src: previewImage,
+    alt: previewAlt,
+    className: ax(["_c71l1j4a _p12f1osq _5ral1f51"])
+  }) : /*#__PURE__*/React.createElement(Button, {
     onClick: handleOnChooseFile,
     isDisabled: isDisabled,
+    appearance: "subtle",
+    iconBefore: UploadIcon,
     "aria-describedby": ariaDescribedBy,
     testId: chooseFileButtonTestId,
     ref: fileButtonRef

package/dist/esm/components/common/TonePreviewButton.compiled.css

@@ -1,7 +1,6 @@
 ._19itia51{border:var(--ds-border-width,1px) solid var(--ds-border,#0b120e24)}
 ._19itidpf{border:0}
-._2rko1qi0{border-radius:var(--ds-radius-medium,6px)}
-._2rkofajl{border-radius:var(--ds-radius-small,3px)}._11bcidpf::-moz-focus-inner{border-width:0}
+._2rko1qi0{border-radius:var(--ds-radius-medium,6px)}._11bcidpf::-moz-focus-inner{border-width:0}
 ._dqozglyw::-moz-focus-inner{border-style:none}
 ._19bvidpf{padding-left:0}
 ._1at812x7>span{padding-top:var(--ds-space-075,6px)}

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

@@ -3,7 +3,6 @@ import "./TonePreviewButton.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef, memo } from 'react';
-import { isTeamoji26RefreshEmojiPickerEnabledNoExposure } from '../../util/teamoji26RefreshEmojiPicker';
 import Emoji from './Emoji';
 export var tonePreviewTestId = 'tone-preview';
 var emojiButton = null;
@@ -21,7 +20,7 @@ export var TonePreviewButton = /*#__PURE__*/forwardRef(function (props, ref) {
     onSelected = props.onSelected,
     _props$isVisible = props.isVisible,
     isVisible = _props$isVisible === void 0 ? true : _props$isVisible;
-  return isTeamoji26RefreshEmojiPickerEnabledNoExposure() ? /*#__PURE__*/React.createElement("button", {
+  return /*#__PURE__*/React.createElement("button", {
     ref: ref,
     onClick: onSelected,
     onKeyDown: onKeyDown,
@@ -35,27 +34,7 @@ export var TonePreviewButton = /*#__PURE__*/forwardRef(function (props, ref) {
     },
     "data-testid": tonePreviewTestId,
     type: "button",
-    className: ax(["_19itidpf _2rkofajl _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _bfhk1j28 _80omtlke _kqswh2mm _1e0c1o8l _lev4idpf _1cx6idpf _tyukidpf _2ewlidpf _11bcidpf _dqozglyw _1at812x7 _1cjo12x7 _1yg612x7 _hjaq12x7 _hlt21tcg _1s3c1tcg _1i911tcg _1ye71tcg _nt751r31 _49pcglyw _1hvw1o36 _7ehi1y54 _491113zc", !isVisible && "_tzy4idpf _3um015vq _1e0cglyw", "_19itia51", "_2rko1qi0"])
-  }, /*#__PURE__*/React.createElement(Emoji, {
-    emoji: emoji,
-    selectOnHover: selectOnHover,
-    shouldBeInteractive: false,
-    "aria-hidden": true
-  })) : /*#__PURE__*/React.createElement("button", {
-    ref: ref,
-    onClick: onSelected,
-    onKeyDown: onKeyDown,
-    "aria-label": ariaLabelText,
-    "aria-expanded": ariaExpanded,
-    "aria-controls": ariaControls
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
-    ,
-    style: {
-      overflow: 'hidden'
-    },
-    "data-testid": tonePreviewTestId,
-    type: "button",
-    className: ax(["_19itidpf _2rkofajl _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _bfhk1j28 _80omtlke _kqswh2mm _1e0c1o8l _lev4idpf _1cx6idpf _tyukidpf _2ewlidpf _11bcidpf _dqozglyw _1at812x7 _1cjo12x7 _1yg612x7 _hjaq12x7 _hlt21tcg _1s3c1tcg _1i911tcg _1ye71tcg _nt751r31 _49pcglyw _1hvw1o36 _7ehi1y54 _491113zc", !isVisible && "_tzy4idpf _3um015vq _1e0cglyw"])
+    className: ax(["_19itidpf _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _bfhk1j28 _80omtlke _kqswh2mm _1e0c1o8l _lev4idpf _1cx6idpf _tyukidpf _2ewlidpf _11bcidpf _dqozglyw _1at812x7 _1cjo12x7 _1yg612x7 _hjaq12x7 _hlt21tcg _1s3c1tcg _1i911tcg _1ye71tcg _nt751r31 _49pcglyw _1hvw1o36 _7ehi1y54 _491113zc", !isVisible && "_tzy4idpf _3um015vq _1e0cglyw", "_19itia51", "_2rko1qi0"])
   }, /*#__PURE__*/React.createElement(Emoji, {
     emoji: emoji,
     selectOnHover: selectOnHover,

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

@@ -13,7 +13,6 @@ import { toneSelectedEvent } from '../../util/analytics/toneSelectedEvent';
 import { toneSelectorOpenedEvent } from '../../util/analytics/toneSelectorOpenedEvent';
 import { messages } from '../i18n';
 import EmojiRadioButton from './EmojiRadioButton';
-import { isRefreshEmojiPickerEnabled } from './isRefreshEmojiPickerEnabled';
 import { setSkinToneAriaLabelText } from './setSkinToneAriaLabelText';
 import { toneSelectorTestId } from './ToneSelector';
 var hidden = null;
@@ -104,7 +103,7 @@ export var ToneSelectorInternal = function ToneSelectorInternal(props) {
     onMouseDown: onMouseDownHandler,
     className: ax([!isVisible && "_tzy4idpf _3um015vq _1e0cglyw"])
   }, emojiToneCollection.map(function (tone, renderIndex) {
-    return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement(EmojiRadioButton, {
+    return /*#__PURE__*/React.createElement(EmojiRadioButton, {
       ref: function ref(el) {
         radioRefs.current[renderIndex] = el;
         if (tone.isSelected && selectedToneRadioRef) {
@@ -120,14 +119,6 @@ export var ToneSelectorInternal = function ToneSelectorInternal(props) {
       },
       onSelected: onToneSelectedHandler(tone.toneIndex),
       selectOnHover: true
-    }) : /*#__PURE__*/React.createElement(EmojiRadioButton, {
-      ref: tone.isSelected ? selectedToneRadioRef : null,
-      defaultChecked: tone.isSelected,
-      ariaLabelText: tone.label,
-      key: "".concat(tone.id),
-      emoji: tone,
-      onSelected: onToneSelectedHandler(tone.toneIndex),
-      selectOnHover: true
     });
   }));
 };

package/dist/esm/components/picker/CategorySelector.compiled.css

@@ -1,10 +1,8 @@
-._2rko12b0{border-radius:var(--ds-radius-small,4px)}
 ._v564h5h4{transition:color .2s ease}
 ._189eidpf{border-width:0}._13li1mok{border-top-left-radius:var(--ds-radius-large,8px)}
 ._16jlidpf{flex-grow:0}
 ._19bv12x7{padding-left:var(--ds-space-075,6px)}
 ._19bvu2gc{padding-left:var(--ds-space-100,8px)}
-._19bvze3t{padding-left:var(--ds-space-0,0)}
 ._1bah1b1v{justify-content:space-around}
 ._1bah1h6o{justify-content:center}
 ._1doc1dm9{border-bottom-width:var(--ds-border-width-selected,2px)}
@@ -18,15 +16,12 @@
 ._2lx2vrvc{flex-direction:row}
 ._4cvr1fhb{align-items:stretch}
 ._4cvr1h6o{align-items:center}
-._bfhkhfxm{background-color:var(--ds-surface-sunken,#f8f8f8)}
 ._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
 ._bfhkvuon{background-color:var(--ds-surface,#fff)}
-._ca0q12x7{padding-top:var(--ds-space-075,6px)}
 ._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._ca0qze3t{padding-top:var(--ds-space-0,0)}
 ._dpd31txw button{display:flex}
 ._i0dl1wug{flex-basis:auto}
-._n3td12x7{padding-bottom:var(--ds-space-075,6px)}
 ._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
 ._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
 ._qrwq1mok{border-top-right-radius:var(--ds-radius-large,8px)}
@@ -34,7 +29,6 @@
 ._syaz6x5g{color:var(--ds-text-selected,#1868db)}
 ._u5f312x7{padding-right:var(--ds-space-075,6px)}
 ._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
-._u5f3ze3t{padding-right:var(--ds-space-0,0)}
 ._1jc41ihb:hover{border-bottom-color:var(--ds-border-bold,#7d818a)}
 ._1jc4a755:hover{border-bottom-color:var(--ds-border-brand,#1868db)}
 ._30l31rpy:hover{color:var(--ds-text-subtlest,#6b6e76)}

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

@@ -10,33 +10,26 @@ import { Pressable } from '@atlaskit/primitives/compiled/pressable';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import { usePrevious } from '../../hooks/usePrevious';
 import { CATEGORYSELECTOR_KEYBOARD_KEYS_SUPPORTED, defaultCategories, KeyboardKeys } from '../../util/constants';
-import { isRefreshEmojiPickerEnabled } from '../common/isRefreshEmojiPickerEnabled';
 import { messages } from '../i18n';
-import { CategoryDescriptionMap, CategoryDescriptionMapNew } from './categories';
+import { CategoryDescriptionMapNew } from './categories';
 import { categorySelectorCategoryTestId } from './categorySelectorCategoryTestId';
 import { RENDER_EMOJI_PICKER_LIST_TESTID } from './EmojiPickerList';
-import { sortCategories } from './sortCategories';
 import { sortCategoriesNew } from './sortCategoriesNew';
 var styles = {
-  commonCategory: "_2rko12b0 _v564h5h4 _189eidpf _bfhksm61 _ca0qze3t _n3tdze3t _19bvze3t _u5f3ze3t",
   commonCategoryNew: "_v564h5h4 _189eidpf _bfhksm61 _ca0qu2gc _n3tdu2gc _19bv12x7 _u5f312x7 _1e0c1txw _4cvr1h6o _1bah1h6o",
-  defaultCategory: "_syaz1rpy _30l36x5g",
   defaultCategoryNew: "_syaz1rpy _1doc1dm9 _1il9nqa1 _1o3i1j28 _30l31rpy _1jc41ihb",
-  activeCategory: "_syaz6x5g _30l36x5g",
   activeCategoryNew: "_syaz6x5g _1doc1dm9 _1il9nqa1 _1o3ia755 _30l36x5g _1jc4a755",
   disabledCategory: "_syaz1rpy"
 };
-var categorySelector = null;
 var categorySelectorNew = null;
-var categorySelectorTablist = null;
 var categorySelectorTablistNew = null;
 var addNewCategories = function addNewCategories(oldCategories, newCategories) {
   if (!newCategories) {
     return oldCategories;
   }
   return oldCategories.concat(newCategories.filter(function (category) {
-    return !!(isRefreshEmojiPickerEnabled() ? CategoryDescriptionMapNew : CategoryDescriptionMap)[category];
-  })).sort(isRefreshEmojiPickerEnabled() ? sortCategoriesNew : sortCategories);
+    return !!CategoryDescriptionMapNew[category];
+  })).sort(sortCategoriesNew);
 };
 export var categorySelectorComponentTestId = 'category-selector-component';
 var CategorySelector = function CategorySelector(props) {
@@ -130,14 +123,14 @@ var CategorySelector = function CategorySelector(props) {
   };
   var categoriesSection;
   if (categories) {
-    categoriesSection = isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
+    categoriesSection = /*#__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(function (categoryId, index) {
-      var category = isRefreshEmojiPickerEnabled() ? CategoryDescriptionMapNew[categoryId] : CategoryDescriptionMap[categoryId];
+      var category = CategoryDescriptionMapNew[categoryId];
       var Icon = category.icon;
       var categoryName = formatMessage(messages[category.name]);
       return /*#__PURE__*/React.createElement(Tooltip, {
@@ -160,42 +153,10 @@ var CategorySelector = function CategorySelector(props) {
       }, /*#__PURE__*/React.createElement(Icon, {
         label: categoryName
       })));
-    })) : /*#__PURE__*/React.createElement("div", {
-      role: "tablist",
-      "aria-label": formatMessage(messages.categoriesSelectorLabel),
-      "data-testid": categorySelectorComponentTestId,
-      ref: categoryRef,
-      className: ax(["_ca0q12x7 _n3td12x7 _19bvu2gc _u5f3u2gc _1e0c1txw _2lx2vrvc _1bah1b1v _4cvr1h6o"])
-    }, categories.map(function (categoryId, index) {
-      var category = isRefreshEmojiPickerEnabled() ? CategoryDescriptionMapNew[categoryId] : CategoryDescriptionMap[categoryId];
-      var Icon = category.icon;
-      var categoryName = formatMessage(messages[category.name]);
-      return /*#__PURE__*/React.createElement(Tooltip, {
-        content: categoryName,
-        position: "bottom",
-        key: category.id
-      }, /*#__PURE__*/React.createElement(Pressable, {
-        id: "category-selector-".concat(category.id),
-        "data-focus-index": index,
-        "aria-label": categoryName,
-        "aria-controls": currentFocus === index ? RENDER_EMOJI_PICKER_LIST_TESTID : undefined,
-        "aria-selected": categoryId === activeCategoryId,
-        xcss: cx(styles.commonCategory, styles.defaultCategory, categoryId === activeCategoryId && styles.activeCategory, disableCategories && styles.disabledCategory),
-        isDisabled: disableCategories,
-        onClick: handleClick(categoryId, index),
-        testId: categorySelectorCategoryTestId(categoryId),
-        tabIndex: currentFocus === index ? 0 : -1,
-        onKeyDown: handleKeyDown,
-        role: "tab"
-      }, /*#__PURE__*/React.createElement(Icon, {
-        label: categoryName
-      })));
     }));
   }
-  return isRefreshEmojiPickerEnabled() ? /*#__PURE__*/React.createElement("div", {
+  return /*#__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"])
   }, categoriesSection);
 };
 export default CategorySelector;

package/dist/esm/components/picker/EmojiPickerComponent.compiled.css

@@ -1,6 +1,5 @@
 ._19itahnd{border:var(--ds-border,#0b120e24) var(--ds-border-width,1px) solid}
-._2rko1mok{border-radius:var(--ds-radius-large,8px)}
-._2rkofajl{border-radius:var(--ds-radius-small,3px)}._16jlkb7n{flex-grow:1}
+._2rko1mok{border-radius:var(--ds-radius-large,8px)}._16jlkb7n{flex-grow:1}
 ._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
 ._18m915vq{overflow-y:hidden}
 ._18m91wug{overflow-y:auto}