@atlaskit/emoji 70.14.3 → 70.15.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +15 -0
- package/dist/cjs/components/common/Emoji.js +8 -3
- package/dist/cjs/components/i18n.js +3 -3
- package/dist/cjs/components/picker/EmojiPickerComponent.compiled.css +2 -9
- package/dist/cjs/components/picker/EmojiPickerComponent.js +6 -78
- package/dist/cjs/util/analytics/analytics.js +1 -1
- package/dist/es2019/components/common/Emoji.js +9 -4
- package/dist/es2019/components/i18n.js +3 -3
- package/dist/es2019/components/picker/EmojiPickerComponent.compiled.css +2 -9
- package/dist/es2019/components/picker/EmojiPickerComponent.js +4 -72
- package/dist/es2019/util/analytics/analytics.js +1 -1
- package/dist/esm/components/common/Emoji.js +9 -4
- package/dist/esm/components/i18n.js +3 -3
- package/dist/esm/components/picker/EmojiPickerComponent.compiled.css +2 -9
- package/dist/esm/components/picker/EmojiPickerComponent.js +6 -78
- package/dist/esm/util/analytics/analytics.js +1 -1
- package/dist/types/components/i18n.d.ts +1 -1
- package/dist/types-ts4.5/components/i18n.d.ts +1 -1
- package/package.json +5 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# @atlaskit/emoji
|
|
2
2
|
|
|
3
|
+
## 70.15.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`9cf3c68ce80d0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9cf3c68ce80d0) -
|
|
8
|
+
Clean up platform_no_noninteractive_emojis_reactions FG
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
11
|
+
## 70.15.0
|
|
12
|
+
|
|
13
|
+
### Minor Changes
|
|
14
|
+
|
|
15
|
+
- [`d35341f95a68e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d35341f95a68e) -
|
|
16
|
+
The label for the change emoji button includes emoji shortname
|
|
17
|
+
|
|
3
18
|
## 70.14.3
|
|
4
19
|
|
|
5
20
|
### Patch Changes
|
|
@@ -14,6 +14,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
14
14
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
15
15
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
16
16
|
var _react = _interopRequireWildcard(require("react"));
|
|
17
|
+
var _reactIntl = require("react-intl");
|
|
17
18
|
var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
|
|
18
19
|
var _EmojiUtils = require("../../api/EmojiUtils");
|
|
19
20
|
var _constants = require("../../util/constants");
|
|
@@ -28,6 +29,7 @@ var _useInView3 = require("../../hooks/useInView");
|
|
|
28
29
|
var _ufoExperiences = require("../../util/analytics/ufoExperiences");
|
|
29
30
|
var _DeletableEmojiTooltipContent = require("./DeletableEmojiTooltipContent");
|
|
30
31
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
32
|
+
var _browserApis = require("@atlaskit/browser-apis");
|
|
31
33
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
32
34
|
var _i18n = require("../i18n");
|
|
33
35
|
var _excluded = ["emoji", "fitToHeight", "selected", "selectOnHover", "className", "showTooltip", "showDelete", "shouldBeInteractive", "tabIndex", "onSelected", "onMouseMove", "onFocus", "onDelete", "onLoadError", "onLoadSuccess", "disableLazyLoad", "autoWidth", "children", "type", "editorEmoji"];
|
|
@@ -268,9 +270,9 @@ var ImageEmoji = exports.ImageEmoji = function ImageEmoji(props) {
|
|
|
268
270
|
}
|
|
269
271
|
}, [ufoExp]);
|
|
270
272
|
var onMouseOver = (0, _react.useCallback)(function (e) {
|
|
271
|
-
var
|
|
273
|
+
var _getDocument;
|
|
272
274
|
// only disable tooltip when not on focus
|
|
273
|
-
if (!((
|
|
275
|
+
if (!((_getDocument = (0, _browserApis.getDocument)()) !== null && _getDocument !== void 0 && (_getDocument = _getDocument.activeElement) !== null && _getDocument !== void 0 && _getDocument.contains(e.target))) {
|
|
274
276
|
e.stopPropagation();
|
|
275
277
|
}
|
|
276
278
|
}, []);
|
|
@@ -361,7 +363,10 @@ var EmojiNodeWrapper = exports.EmojiNodeWrapper = /*#__PURE__*/(0, _react.forwar
|
|
|
361
363
|
type = props.type,
|
|
362
364
|
editorEmoji = props.editorEmoji,
|
|
363
365
|
other = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
364
|
-
var
|
|
366
|
+
var intl = (0, _react.useContext)(_reactIntl.IntlContext);
|
|
367
|
+
var ariaLabel = intl && (0, _platformFeatureFlags.fg)('platform_change_emoji_button_label') ? intl.formatMessage(_i18n.messages.changeEmojiShortnameButtonLabel, {
|
|
368
|
+
shortName: emoji.shortName
|
|
369
|
+
}) : editorEmoji ? undefined : emoji.shortName;
|
|
365
370
|
return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
|
|
366
371
|
role: editorEmoji ? undefined : shouldBeInteractive ? 'button' : ariaLabel ? 'img' : 'presentation',
|
|
367
372
|
"aria-label": ariaLabel,
|
|
@@ -261,9 +261,9 @@ var messages = exports.messages = (0, _reactIntl.defineMessages)({
|
|
|
261
261
|
defaultMessage: 'emoji button',
|
|
262
262
|
description: "Aria roledescription for emoji button, used in emoji picker."
|
|
263
263
|
},
|
|
264
|
-
|
|
265
|
-
id: 'fabric.emoji.change.button.label',
|
|
266
|
-
defaultMessage: 'Change emoji',
|
|
264
|
+
changeEmojiShortnameButtonLabel: {
|
|
265
|
+
id: 'fabric.emoji.change.shortname.button.label',
|
|
266
|
+
defaultMessage: 'Change emoji, currently {shortName}',
|
|
267
267
|
description: 'Aria label for the button in page title used to change emoji'
|
|
268
268
|
},
|
|
269
269
|
error: {
|
|
@@ -1,24 +1,19 @@
|
|
|
1
1
|
|
|
2
2
|
._19itahnd{border:var(--ds-border,#0b120e24) var(--ds-border-width,1px) solid}
|
|
3
3
|
._2rko1mok{border-radius:var(--ds-radius-large,8px)}
|
|
4
|
-
._2rkofajl{border-radius:var(--ds-radius-small,3px)}.
|
|
5
|
-
._16jlkb7n{flex-grow:1}
|
|
4
|
+
._2rkofajl{border-radius:var(--ds-radius-small,3px)}._16jlkb7n{flex-grow:1}
|
|
6
5
|
._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
|
|
7
6
|
._18m915vq{overflow-y:hidden}
|
|
8
|
-
._18m91wug{overflow-y:auto}
|
|
9
7
|
._1bah1yb4{justify-content:space-between}
|
|
10
8
|
._1bsb10mj{width:var(--_gsvyy7)}
|
|
11
9
|
._1e0c1txw{display:flex}
|
|
12
|
-
._1ltvidpf{left:0}
|
|
13
10
|
._1o9zkb7n{flex-shrink:1}
|
|
14
|
-
._1pbykb7n{z-index:1}
|
|
15
11
|
._1reo15vq{overflow-x:hidden}
|
|
16
12
|
._1tke1pna{min-height:420px}
|
|
17
13
|
._1tke5x59{min-height:340px}
|
|
18
14
|
._1tkegx0z{min-height:260px}
|
|
19
15
|
._1tkeidpf{min-height:0}
|
|
20
16
|
._1ul910mj{min-width:var(--_gsvyy7)}
|
|
21
|
-
._1xi2idpf{right:0}
|
|
22
17
|
._2lx21bp4{flex-direction:column}
|
|
23
18
|
._4t3i1784{height:470px}
|
|
24
19
|
._4t3i19lm{height:514px}
|
|
@@ -36,9 +31,7 @@
|
|
|
36
31
|
._4t3iuxo9{height:var(--_19dn98e)}
|
|
37
32
|
._4t3ivixp{height:349px}
|
|
38
33
|
._4t3ixt2k{height:509px}
|
|
39
|
-
._94n5idpf{bottom:0}
|
|
40
34
|
._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
|
|
41
35
|
._c71l1y6z{max-height:calc(80vh - 86px)}
|
|
42
36
|
._i0dlf1ug{flex-basis:0%}
|
|
43
|
-
._kqswh2mm{position:relative}
|
|
44
|
-
._kqswstnw{position:absolute}
|
|
37
|
+
._kqswh2mm{position:relative}
|
|
@@ -34,8 +34,6 @@ var _UploadEmoji = require("../common/UploadEmoji");
|
|
|
34
34
|
var _RecordSelectionDefault = require("../common/RecordSelectionDefault");
|
|
35
35
|
var _CategorySelector = _interopRequireDefault(require("./CategorySelector"));
|
|
36
36
|
var _EmojiPickerFooter = _interopRequireDefault(require("./EmojiPickerFooter"));
|
|
37
|
-
var _EmojiUploadPicker = _interopRequireDefault(require("../common/EmojiUploadPicker"));
|
|
38
|
-
var _EmojiDeletePreview = _interopRequireDefault(require("../common/EmojiDeletePreview"));
|
|
39
37
|
var _EmojiPickerList = require("./EmojiPickerList");
|
|
40
38
|
var _analytics = require("../../util/analytics");
|
|
41
39
|
var _useEmoji2 = require("../../hooks/useEmoji");
|
|
@@ -54,7 +52,6 @@ var emojiPickerMinHeight = 260;
|
|
|
54
52
|
var heightOffset = 80;
|
|
55
53
|
var emojiPicker = null;
|
|
56
54
|
var emojiPickerNew = null;
|
|
57
|
-
var uploadOverlay = null;
|
|
58
55
|
var emojiPickerWrapper = null;
|
|
59
56
|
var withPreviewHeight = {
|
|
60
57
|
small: "_4t3ivixp _1tkegx0z",
|
|
@@ -644,78 +641,23 @@ var EmojiPickerComponent = function EmojiPickerComponent(_ref) {
|
|
|
644
641
|
};
|
|
645
642
|
}, [emojiProvider, onProviderChange]);
|
|
646
643
|
var showPreview = (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? !uploading : selectedEmoji && !uploading;
|
|
647
|
-
if ((0, _platformFeatureFlags.fg)('platform_no_noninteractive_emojis_reactions')) {
|
|
648
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
649
|
-
ref: setPickerRef,
|
|
650
|
-
"data-emoji-picker-container": true,
|
|
651
|
-
role: "dialog",
|
|
652
|
-
"aria-label": formatMessage(_i18n.messages.emojiPickerTitle),
|
|
653
|
-
"aria-modal": true,
|
|
654
|
-
className: (0, _runtime.ax)([(0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? "_19itahnd _2rko1mok _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iuxo9 _1bsb10mj _1ul910mj _c71l1y6z _kqswh2mm" : "_19itahnd _2rkofajl _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iuxo9 _1bsb10mj _1ul910mj _c71l1y6z _kqswh2mm", !!emojiToDelete && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? withDeleteRefreshHeight[size] : uploading && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? withUploadRefreshHeight[size] : query && filteredEmojis.length === 0 && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? withNoResultsRefreshHeight[size] : showPreview ? withPreviewHeight[size] : withoutPreviewHeight[size]]),
|
|
655
|
-
style: {
|
|
656
|
-
"--_19dn98e": (0, _runtime.ix)("".concat(emojiPickerHeight, "px")),
|
|
657
|
-
"--_gsvyy7": (0, _runtime.ix)("".concat(emojiPickerWidth, "px"))
|
|
658
|
-
}
|
|
659
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
660
|
-
role: "presentation",
|
|
661
|
-
onKeyPress: suppressKeyPress,
|
|
662
|
-
onKeyUp: suppressKeyPress,
|
|
663
|
-
onKeyDown: suppressKeyPress,
|
|
664
|
-
className: (0, _runtime.ax)(["_16jlkb7n _1o9zkb7n _i0dlf1ug _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bah1yb4 _1tkeidpf"])
|
|
665
|
-
}, /*#__PURE__*/React.createElement(_CategorySelector.default, {
|
|
666
|
-
activeCategoryId: (uploading || emojiToDelete) && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? null : activeCategory,
|
|
667
|
-
dynamicCategories: dynamicCategories,
|
|
668
|
-
disableCategories: disableCategories,
|
|
669
|
-
onCategorySelected: onCategorySelected
|
|
670
|
-
}), /*#__PURE__*/React.createElement(_EmojiPickerList.EmojiPickerVirtualListInternal, {
|
|
671
|
-
emojis: filteredEmojis,
|
|
672
|
-
currentUser: currentUser,
|
|
673
|
-
onEmojiSelected: recordUsageOnSelection,
|
|
674
|
-
onEmojiActive: onEmojiActive,
|
|
675
|
-
onEmojiLeave: onEmojiLeave,
|
|
676
|
-
onEmojiDelete: onTriggerDelete,
|
|
677
|
-
onCategoryActivated: onCategoryActivated,
|
|
678
|
-
onSearch: onSearch,
|
|
679
|
-
query: query,
|
|
680
|
-
selectedTone: selectedTone,
|
|
681
|
-
loading: loading,
|
|
682
|
-
ref: emojiPickerList,
|
|
683
|
-
initialUploadName: query,
|
|
684
|
-
onToneSelected: onToneSelected,
|
|
685
|
-
onToneSelectorCancelled: onToneSelectorCancelled,
|
|
686
|
-
toneEmoji: toneEmoji,
|
|
687
|
-
uploading: uploading,
|
|
688
|
-
emojiToDelete: emojiToDelete,
|
|
689
|
-
uploadErrorMessage: formattedErrorMessage,
|
|
690
|
-
uploadEnabled: isUploadSupported && !uploading,
|
|
691
|
-
onUploadEmoji: onUploadEmoji,
|
|
692
|
-
onUploadCancelled: onUploadCancelled,
|
|
693
|
-
onDeleteEmoji: onDeleteEmoji,
|
|
694
|
-
onCloseDelete: onCloseDelete,
|
|
695
|
-
onFileChooserClicked: onFileChooserClicked,
|
|
696
|
-
onOpenUpload: onOpenUpload,
|
|
697
|
-
size: size,
|
|
698
|
-
activeCategoryId: activeCategory
|
|
699
|
-
}), showPreview && !(emojiToDelete && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh')) && !(query && filteredEmojis.length === 0 && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh')) && /*#__PURE__*/React.createElement(_EmojiPickerFooter.default, {
|
|
700
|
-
selectedEmoji: selectedEmoji,
|
|
701
|
-
uploadEnabled: isUploadSupported && !uploading,
|
|
702
|
-
onOpenUpload: onOpenUpload
|
|
703
|
-
})));
|
|
704
|
-
}
|
|
705
644
|
return /*#__PURE__*/React.createElement("div", {
|
|
706
645
|
ref: setPickerRef,
|
|
707
646
|
"data-emoji-picker-container": true,
|
|
708
647
|
role: "dialog",
|
|
709
648
|
"aria-label": formatMessage(_i18n.messages.emojiPickerTitle),
|
|
710
649
|
"aria-modal": true,
|
|
711
|
-
onKeyPress: suppressKeyPress,
|
|
712
|
-
onKeyUp: suppressKeyPress,
|
|
713
|
-
onKeyDown: suppressKeyPress,
|
|
714
650
|
className: (0, _runtime.ax)([(0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? "_19itahnd _2rko1mok _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iuxo9 _1bsb10mj _1ul910mj _c71l1y6z _kqswh2mm" : "_19itahnd _2rkofajl _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iuxo9 _1bsb10mj _1ul910mj _c71l1y6z _kqswh2mm", !!emojiToDelete && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? withDeleteRefreshHeight[size] : uploading && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? withUploadRefreshHeight[size] : query && filteredEmojis.length === 0 && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? withNoResultsRefreshHeight[size] : showPreview ? withPreviewHeight[size] : withoutPreviewHeight[size]]),
|
|
715
651
|
style: {
|
|
716
652
|
"--_19dn98e": (0, _runtime.ix)("".concat(emojiPickerHeight, "px")),
|
|
717
653
|
"--_gsvyy7": (0, _runtime.ix)("".concat(emojiPickerWidth, "px"))
|
|
718
654
|
}
|
|
655
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
656
|
+
role: "presentation",
|
|
657
|
+
onKeyPress: suppressKeyPress,
|
|
658
|
+
onKeyUp: suppressKeyPress,
|
|
659
|
+
onKeyDown: suppressKeyPress,
|
|
660
|
+
className: (0, _runtime.ax)(["_16jlkb7n _1o9zkb7n _i0dlf1ug _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bah1yb4 _1tkeidpf"])
|
|
719
661
|
}, /*#__PURE__*/React.createElement(_CategorySelector.default, {
|
|
720
662
|
activeCategoryId: (uploading || emojiToDelete) && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') ? null : activeCategory,
|
|
721
663
|
dynamicCategories: dynamicCategories,
|
|
@@ -754,20 +696,6 @@ var EmojiPickerComponent = function EmojiPickerComponent(_ref) {
|
|
|
754
696
|
selectedEmoji: selectedEmoji,
|
|
755
697
|
uploadEnabled: isUploadSupported && !uploading,
|
|
756
698
|
onOpenUpload: onOpenUpload
|
|
757
|
-
}), uploading && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') && /*#__PURE__*/React.createElement("div", {
|
|
758
|
-
className: (0, _runtime.ax)(["_2rko1mok _kqswstnw _154iidpf _1ltvidpf _1xi2idpf _94n5idpf _bfhk1bhr _1pbykb7n _18m91wug"])
|
|
759
|
-
}, /*#__PURE__*/React.createElement(_EmojiUploadPicker.default, {
|
|
760
|
-
onUploadEmoji: onUploadEmoji,
|
|
761
|
-
onUploadCancelled: onUploadCancelled,
|
|
762
|
-
onFileChooserClicked: onFileChooserClicked,
|
|
763
|
-
errorMessage: formattedErrorMessage,
|
|
764
|
-
initialUploadName: query
|
|
765
|
-
})), emojiToDelete && (0, _platformFeatureFlags.fg)('platform_emoji_picker_refresh') && /*#__PURE__*/React.createElement("div", {
|
|
766
|
-
className: (0, _runtime.ax)(["_2rko1mok _kqswstnw _154iidpf _1ltvidpf _1xi2idpf _94n5idpf _bfhk1bhr _1pbykb7n _18m91wug"])
|
|
767
|
-
}, /*#__PURE__*/React.createElement(_EmojiDeletePreview.default, {
|
|
768
|
-
emoji: emojiToDelete,
|
|
769
|
-
onDeleteEmoji: onDeleteEmoji,
|
|
770
|
-
onCloseDelete: onCloseDelete
|
|
771
699
|
})));
|
|
772
700
|
};
|
|
773
701
|
var _default_1 = /*#__PURE__*/(0, _react.memo)(EmojiPickerComponent);
|
|
@@ -20,7 +20,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
|
|
|
20
20
|
actionSubjectId: actionSubjectId,
|
|
21
21
|
attributes: _objectSpread({
|
|
22
22
|
packageName: "@atlaskit/emoji",
|
|
23
|
-
packageVersion: "70.
|
|
23
|
+
packageVersion: "70.15.0"
|
|
24
24
|
}, attributes)
|
|
25
25
|
};
|
|
26
26
|
};
|
|
@@ -2,7 +2,8 @@
|
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
import "./Emoji.compiled.css";
|
|
4
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
|
-
import React, { useEffect, useCallback, useMemo, forwardRef } from 'react';
|
|
5
|
+
import React, { useEffect, useCallback, useContext, useMemo, forwardRef } from 'react';
|
|
6
|
+
import { IntlContext } from 'react-intl';
|
|
6
7
|
import Tooltip from '@atlaskit/tooltip';
|
|
7
8
|
import { shouldUseAltRepresentation } from '../../api/EmojiUtils';
|
|
8
9
|
import { defaultEmojiHeight, deleteEmojiLabel, EMOJI_KEYBOARD_KEYS_SUPPORTED, KeyboardKeys, SAMPLING_RATE_EMOJI_RENDERED_EXP } from '../../util/constants';
|
|
@@ -17,6 +18,7 @@ import { useInView } from '../../hooks/useInView';
|
|
|
17
18
|
import { hasUfoMarked } from '../../util/analytics/ufoExperiences';
|
|
18
19
|
import { DeletableEmojiTooltipContent, DeletableEmojiTooltipContentForScreenReader } from './DeletableEmojiTooltipContent';
|
|
19
20
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
21
|
+
import { getDocument } from '@atlaskit/browser-apis';
|
|
20
22
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
21
23
|
import { messages } from '../i18n';
|
|
22
24
|
const emojiSpriteContainer = null;
|
|
@@ -263,9 +265,9 @@ export const ImageEmoji = props => {
|
|
|
263
265
|
}
|
|
264
266
|
}, [ufoExp]);
|
|
265
267
|
const onMouseOver = useCallback(e => {
|
|
266
|
-
var
|
|
268
|
+
var _getDocument, _getDocument$activeEl;
|
|
267
269
|
// only disable tooltip when not on focus
|
|
268
|
-
if (!((
|
|
270
|
+
if (!((_getDocument = getDocument()) !== null && _getDocument !== void 0 && (_getDocument$activeEl = _getDocument.activeElement) !== null && _getDocument$activeEl !== void 0 && _getDocument$activeEl.contains(e.target))) {
|
|
269
271
|
e.stopPropagation();
|
|
270
272
|
}
|
|
271
273
|
}, []);
|
|
@@ -355,7 +357,10 @@ export const EmojiNodeWrapper = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
355
357
|
editorEmoji,
|
|
356
358
|
...other
|
|
357
359
|
} = props;
|
|
358
|
-
const
|
|
360
|
+
const intl = useContext(IntlContext);
|
|
361
|
+
const ariaLabel = intl && fg('platform_change_emoji_button_label') ? intl.formatMessage(messages.changeEmojiShortnameButtonLabel, {
|
|
362
|
+
shortName: emoji.shortName
|
|
363
|
+
}) : editorEmoji ? undefined : emoji.shortName;
|
|
359
364
|
return /*#__PURE__*/React.createElement("span", _extends({
|
|
360
365
|
role: editorEmoji ? undefined : shouldBeInteractive ? 'button' : ariaLabel ? 'img' : 'presentation',
|
|
361
366
|
"aria-label": ariaLabel,
|
|
@@ -255,9 +255,9 @@ export const messages = defineMessages({
|
|
|
255
255
|
defaultMessage: 'emoji button',
|
|
256
256
|
description: `Aria roledescription for emoji button, used in emoji picker.`
|
|
257
257
|
},
|
|
258
|
-
|
|
259
|
-
id: 'fabric.emoji.change.button.label',
|
|
260
|
-
defaultMessage: 'Change emoji',
|
|
258
|
+
changeEmojiShortnameButtonLabel: {
|
|
259
|
+
id: 'fabric.emoji.change.shortname.button.label',
|
|
260
|
+
defaultMessage: 'Change emoji, currently {shortName}',
|
|
261
261
|
description: 'Aria label for the button in page title used to change emoji'
|
|
262
262
|
},
|
|
263
263
|
error: {
|
|
@@ -1,24 +1,19 @@
|
|
|
1
1
|
|
|
2
2
|
._19itahnd{border:var(--ds-border,#0b120e24) var(--ds-border-width,1px) solid}
|
|
3
3
|
._2rko1mok{border-radius:var(--ds-radius-large,8px)}
|
|
4
|
-
._2rkofajl{border-radius:var(--ds-radius-small,3px)}.
|
|
5
|
-
._16jlkb7n{flex-grow:1}
|
|
4
|
+
._2rkofajl{border-radius:var(--ds-radius-small,3px)}._16jlkb7n{flex-grow:1}
|
|
6
5
|
._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
|
|
7
6
|
._18m915vq{overflow-y:hidden}
|
|
8
|
-
._18m91wug{overflow-y:auto}
|
|
9
7
|
._1bah1yb4{justify-content:space-between}
|
|
10
8
|
._1bsb1edt{width:350px}
|
|
11
9
|
._1e0c1txw{display:flex}
|
|
12
|
-
._1ltvidpf{left:0}
|
|
13
10
|
._1o9zkb7n{flex-shrink:1}
|
|
14
|
-
._1pbykb7n{z-index:1}
|
|
15
11
|
._1reo15vq{overflow-x:hidden}
|
|
16
12
|
._1tke1pna{min-height:420px}
|
|
17
13
|
._1tke5x59{min-height:340px}
|
|
18
14
|
._1tkegx0z{min-height:260px}
|
|
19
15
|
._1tkeidpf{min-height:0}
|
|
20
16
|
._1ul91edt{min-width:350px}
|
|
21
|
-
._1xi2idpf{right:0}
|
|
22
17
|
._2lx21bp4{flex-direction:column}
|
|
23
18
|
._4t3i1784{height:470px}
|
|
24
19
|
._4t3i19lm{height:514px}
|
|
@@ -35,9 +30,7 @@
|
|
|
35
30
|
._4t3iqbeb{height:339px}
|
|
36
31
|
._4t3ivixp{height:349px}
|
|
37
32
|
._4t3ixt2k{height:509px}
|
|
38
|
-
._94n5idpf{bottom:0}
|
|
39
33
|
._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
|
|
40
34
|
._c71l1y6z{max-height:calc(80vh - 86px)}
|
|
41
35
|
._i0dlf1ug{flex-basis:0%}
|
|
42
|
-
._kqswh2mm{position:relative}
|
|
43
|
-
._kqswstnw{position:absolute}
|
|
36
|
+
._kqswh2mm{position:relative}
|
|
@@ -21,8 +21,6 @@ import { uploadEmoji } from '../common/UploadEmoji';
|
|
|
21
21
|
import { createRecordSelectionDefault } from '../common/RecordSelectionDefault';
|
|
22
22
|
import CategorySelector from './CategorySelector';
|
|
23
23
|
import EmojiPickerFooter from './EmojiPickerFooter';
|
|
24
|
-
import EmojiUploadPicker from '../common/EmojiUploadPicker';
|
|
25
|
-
import EmojiDeletePreviewComponent from '../common/EmojiDeletePreview';
|
|
26
24
|
import { EmojiPickerVirtualListInternal as EmojiPickerList } from './EmojiPickerList';
|
|
27
25
|
import { createAndFireEventInElementsChannel, categoryClickedEvent, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, selectedFileEvent, uploadBeginButton, uploadCancelButton, uploadConfirmButton, toneSelectorClosedEvent, ufoExperiences } from '../../util/analytics';
|
|
28
26
|
import { useEmoji } from '../../hooks/useEmoji';
|
|
@@ -38,7 +36,6 @@ const emojiPickerMinHeight = 260;
|
|
|
38
36
|
const heightOffset = 80;
|
|
39
37
|
const emojiPicker = null;
|
|
40
38
|
const emojiPickerNew = null;
|
|
41
|
-
const uploadOverlay = null;
|
|
42
39
|
const emojiPickerWrapper = null;
|
|
43
40
|
const withPreviewHeight = {
|
|
44
41
|
small: "_4t3ivixp _1tkegx0z",
|
|
@@ -554,70 +551,19 @@ const EmojiPickerComponent = ({
|
|
|
554
551
|
};
|
|
555
552
|
}, [emojiProvider, onProviderChange]);
|
|
556
553
|
const showPreview = fg('platform_emoji_picker_refresh') ? !uploading : selectedEmoji && !uploading;
|
|
557
|
-
if (fg('platform_no_noninteractive_emojis_reactions')) {
|
|
558
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
559
|
-
ref: setPickerRef,
|
|
560
|
-
"data-emoji-picker-container": true,
|
|
561
|
-
role: "dialog",
|
|
562
|
-
"aria-label": formatMessage(messages.emojiPickerTitle),
|
|
563
|
-
"aria-modal": true,
|
|
564
|
-
className: ax([fg('platform_emoji_picker_refresh') ? "_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 && fg('platform_emoji_picker_refresh') ? withDeleteRefreshHeight[size] : uploading && fg('platform_emoji_picker_refresh') ? withUploadRefreshHeight[size] : query && filteredEmojis.length === 0 && fg('platform_emoji_picker_refresh') ? withNoResultsRefreshHeight[size] : showPreview ? withPreviewHeight[size] : withoutPreviewHeight[size]])
|
|
565
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
566
|
-
role: "presentation",
|
|
567
|
-
onKeyPress: suppressKeyPress,
|
|
568
|
-
onKeyUp: suppressKeyPress,
|
|
569
|
-
onKeyDown: suppressKeyPress,
|
|
570
|
-
className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bah1yb4 _1tkeidpf"])
|
|
571
|
-
}, /*#__PURE__*/React.createElement(CategorySelector, {
|
|
572
|
-
activeCategoryId: (uploading || emojiToDelete) && fg('platform_emoji_picker_refresh') ? null : activeCategory,
|
|
573
|
-
dynamicCategories: dynamicCategories,
|
|
574
|
-
disableCategories: disableCategories,
|
|
575
|
-
onCategorySelected: onCategorySelected
|
|
576
|
-
}), /*#__PURE__*/React.createElement(EmojiPickerList, {
|
|
577
|
-
emojis: filteredEmojis,
|
|
578
|
-
currentUser: currentUser,
|
|
579
|
-
onEmojiSelected: recordUsageOnSelection,
|
|
580
|
-
onEmojiActive: onEmojiActive,
|
|
581
|
-
onEmojiLeave: onEmojiLeave,
|
|
582
|
-
onEmojiDelete: onTriggerDelete,
|
|
583
|
-
onCategoryActivated: onCategoryActivated,
|
|
584
|
-
onSearch: onSearch,
|
|
585
|
-
query: query,
|
|
586
|
-
selectedTone: selectedTone,
|
|
587
|
-
loading: loading,
|
|
588
|
-
ref: emojiPickerList,
|
|
589
|
-
initialUploadName: query,
|
|
590
|
-
onToneSelected: onToneSelected,
|
|
591
|
-
onToneSelectorCancelled: onToneSelectorCancelled,
|
|
592
|
-
toneEmoji: toneEmoji,
|
|
593
|
-
uploading: uploading,
|
|
594
|
-
emojiToDelete: emojiToDelete,
|
|
595
|
-
uploadErrorMessage: formattedErrorMessage,
|
|
596
|
-
uploadEnabled: isUploadSupported && !uploading,
|
|
597
|
-
onUploadEmoji: onUploadEmoji,
|
|
598
|
-
onUploadCancelled: onUploadCancelled,
|
|
599
|
-
onDeleteEmoji: onDeleteEmoji,
|
|
600
|
-
onCloseDelete: onCloseDelete,
|
|
601
|
-
onFileChooserClicked: onFileChooserClicked,
|
|
602
|
-
onOpenUpload: onOpenUpload,
|
|
603
|
-
size: size,
|
|
604
|
-
activeCategoryId: activeCategory
|
|
605
|
-
}), showPreview && !(emojiToDelete && fg('platform_emoji_picker_refresh')) && !(query && filteredEmojis.length === 0 && fg('platform_emoji_picker_refresh')) && /*#__PURE__*/React.createElement(EmojiPickerFooter, {
|
|
606
|
-
selectedEmoji: selectedEmoji,
|
|
607
|
-
uploadEnabled: isUploadSupported && !uploading,
|
|
608
|
-
onOpenUpload: onOpenUpload
|
|
609
|
-
})));
|
|
610
|
-
}
|
|
611
554
|
return /*#__PURE__*/React.createElement("div", {
|
|
612
555
|
ref: setPickerRef,
|
|
613
556
|
"data-emoji-picker-container": true,
|
|
614
557
|
role: "dialog",
|
|
615
558
|
"aria-label": formatMessage(messages.emojiPickerTitle),
|
|
616
559
|
"aria-modal": true,
|
|
560
|
+
className: ax([fg('platform_emoji_picker_refresh') ? "_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 && fg('platform_emoji_picker_refresh') ? withDeleteRefreshHeight[size] : uploading && fg('platform_emoji_picker_refresh') ? withUploadRefreshHeight[size] : query && filteredEmojis.length === 0 && fg('platform_emoji_picker_refresh') ? withNoResultsRefreshHeight[size] : showPreview ? withPreviewHeight[size] : withoutPreviewHeight[size]])
|
|
561
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
562
|
+
role: "presentation",
|
|
617
563
|
onKeyPress: suppressKeyPress,
|
|
618
564
|
onKeyUp: suppressKeyPress,
|
|
619
565
|
onKeyDown: suppressKeyPress,
|
|
620
|
-
className: ax([
|
|
566
|
+
className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bah1yb4 _1tkeidpf"])
|
|
621
567
|
}, /*#__PURE__*/React.createElement(CategorySelector, {
|
|
622
568
|
activeCategoryId: (uploading || emojiToDelete) && fg('platform_emoji_picker_refresh') ? null : activeCategory,
|
|
623
569
|
dynamicCategories: dynamicCategories,
|
|
@@ -656,20 +602,6 @@ const EmojiPickerComponent = ({
|
|
|
656
602
|
selectedEmoji: selectedEmoji,
|
|
657
603
|
uploadEnabled: isUploadSupported && !uploading,
|
|
658
604
|
onOpenUpload: onOpenUpload
|
|
659
|
-
}), uploading && fg('platform_emoji_picker_refresh') && /*#__PURE__*/React.createElement("div", {
|
|
660
|
-
className: ax(["_2rko1mok _kqswstnw _154iidpf _1ltvidpf _1xi2idpf _94n5idpf _bfhk1bhr _1pbykb7n _18m91wug"])
|
|
661
|
-
}, /*#__PURE__*/React.createElement(EmojiUploadPicker, {
|
|
662
|
-
onUploadEmoji: onUploadEmoji,
|
|
663
|
-
onUploadCancelled: onUploadCancelled,
|
|
664
|
-
onFileChooserClicked: onFileChooserClicked,
|
|
665
|
-
errorMessage: formattedErrorMessage,
|
|
666
|
-
initialUploadName: query
|
|
667
|
-
})), emojiToDelete && fg('platform_emoji_picker_refresh') && /*#__PURE__*/React.createElement("div", {
|
|
668
|
-
className: ax(["_2rko1mok _kqswstnw _154iidpf _1ltvidpf _1xi2idpf _94n5idpf _bfhk1bhr _1pbykb7n _18m91wug"])
|
|
669
|
-
}, /*#__PURE__*/React.createElement(EmojiDeletePreviewComponent, {
|
|
670
|
-
emoji: emojiToDelete,
|
|
671
|
-
onDeleteEmoji: onDeleteEmoji,
|
|
672
|
-
onCloseDelete: onCloseDelete
|
|
673
605
|
})));
|
|
674
606
|
};
|
|
675
607
|
const _default_1 = /*#__PURE__*/memo(EmojiPickerComponent);
|
|
@@ -8,7 +8,8 @@ import "./Emoji.compiled.css";
|
|
|
8
8
|
import { ax, ix } from "@compiled/react/runtime";
|
|
9
9
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
10
10
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
11
|
-
import React, { useEffect, useCallback, useMemo, forwardRef } from 'react';
|
|
11
|
+
import React, { useEffect, useCallback, useContext, useMemo, forwardRef } from 'react';
|
|
12
|
+
import { IntlContext } from 'react-intl';
|
|
12
13
|
import Tooltip from '@atlaskit/tooltip';
|
|
13
14
|
import { shouldUseAltRepresentation } from '../../api/EmojiUtils';
|
|
14
15
|
import { defaultEmojiHeight, deleteEmojiLabel, EMOJI_KEYBOARD_KEYS_SUPPORTED, KeyboardKeys, SAMPLING_RATE_EMOJI_RENDERED_EXP } from '../../util/constants';
|
|
@@ -23,6 +24,7 @@ import { useInView } from '../../hooks/useInView';
|
|
|
23
24
|
import { hasUfoMarked } from '../../util/analytics/ufoExperiences';
|
|
24
25
|
import { DeletableEmojiTooltipContent, DeletableEmojiTooltipContentForScreenReader } from './DeletableEmojiTooltipContent';
|
|
25
26
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
27
|
+
import { getDocument } from '@atlaskit/browser-apis';
|
|
26
28
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
27
29
|
import { messages } from '../i18n';
|
|
28
30
|
var emojiSpriteContainer = null;
|
|
@@ -259,9 +261,9 @@ export var ImageEmoji = function ImageEmoji(props) {
|
|
|
259
261
|
}
|
|
260
262
|
}, [ufoExp]);
|
|
261
263
|
var onMouseOver = useCallback(function (e) {
|
|
262
|
-
var
|
|
264
|
+
var _getDocument;
|
|
263
265
|
// only disable tooltip when not on focus
|
|
264
|
-
if (!((
|
|
266
|
+
if (!((_getDocument = getDocument()) !== null && _getDocument !== void 0 && (_getDocument = _getDocument.activeElement) !== null && _getDocument !== void 0 && _getDocument.contains(e.target))) {
|
|
265
267
|
e.stopPropagation();
|
|
266
268
|
}
|
|
267
269
|
}, []);
|
|
@@ -352,7 +354,10 @@ export var EmojiNodeWrapper = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
352
354
|
type = props.type,
|
|
353
355
|
editorEmoji = props.editorEmoji,
|
|
354
356
|
other = _objectWithoutProperties(props, _excluded);
|
|
355
|
-
var
|
|
357
|
+
var intl = useContext(IntlContext);
|
|
358
|
+
var ariaLabel = intl && fg('platform_change_emoji_button_label') ? intl.formatMessage(messages.changeEmojiShortnameButtonLabel, {
|
|
359
|
+
shortName: emoji.shortName
|
|
360
|
+
}) : editorEmoji ? undefined : emoji.shortName;
|
|
356
361
|
return /*#__PURE__*/React.createElement("span", _extends({
|
|
357
362
|
role: editorEmoji ? undefined : shouldBeInteractive ? 'button' : ariaLabel ? 'img' : 'presentation',
|
|
358
363
|
"aria-label": ariaLabel,
|
|
@@ -255,9 +255,9 @@ export var messages = defineMessages({
|
|
|
255
255
|
defaultMessage: 'emoji button',
|
|
256
256
|
description: "Aria roledescription for emoji button, used in emoji picker."
|
|
257
257
|
},
|
|
258
|
-
|
|
259
|
-
id: 'fabric.emoji.change.button.label',
|
|
260
|
-
defaultMessage: 'Change emoji',
|
|
258
|
+
changeEmojiShortnameButtonLabel: {
|
|
259
|
+
id: 'fabric.emoji.change.shortname.button.label',
|
|
260
|
+
defaultMessage: 'Change emoji, currently {shortName}',
|
|
261
261
|
description: 'Aria label for the button in page title used to change emoji'
|
|
262
262
|
},
|
|
263
263
|
error: {
|
|
@@ -1,24 +1,19 @@
|
|
|
1
1
|
|
|
2
2
|
._19itahnd{border:var(--ds-border,#0b120e24) var(--ds-border-width,1px) solid}
|
|
3
3
|
._2rko1mok{border-radius:var(--ds-radius-large,8px)}
|
|
4
|
-
._2rkofajl{border-radius:var(--ds-radius-small,3px)}.
|
|
5
|
-
._16jlkb7n{flex-grow:1}
|
|
4
|
+
._2rkofajl{border-radius:var(--ds-radius-small,3px)}._16jlkb7n{flex-grow:1}
|
|
6
5
|
._16qs130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}
|
|
7
6
|
._18m915vq{overflow-y:hidden}
|
|
8
|
-
._18m91wug{overflow-y:auto}
|
|
9
7
|
._1bah1yb4{justify-content:space-between}
|
|
10
8
|
._1bsb10mj{width:var(--_gsvyy7)}
|
|
11
9
|
._1e0c1txw{display:flex}
|
|
12
|
-
._1ltvidpf{left:0}
|
|
13
10
|
._1o9zkb7n{flex-shrink:1}
|
|
14
|
-
._1pbykb7n{z-index:1}
|
|
15
11
|
._1reo15vq{overflow-x:hidden}
|
|
16
12
|
._1tke1pna{min-height:420px}
|
|
17
13
|
._1tke5x59{min-height:340px}
|
|
18
14
|
._1tkegx0z{min-height:260px}
|
|
19
15
|
._1tkeidpf{min-height:0}
|
|
20
16
|
._1ul910mj{min-width:var(--_gsvyy7)}
|
|
21
|
-
._1xi2idpf{right:0}
|
|
22
17
|
._2lx21bp4{flex-direction:column}
|
|
23
18
|
._4t3i1784{height:470px}
|
|
24
19
|
._4t3i19lm{height:514px}
|
|
@@ -36,9 +31,7 @@
|
|
|
36
31
|
._4t3iuxo9{height:var(--_19dn98e)}
|
|
37
32
|
._4t3ivixp{height:349px}
|
|
38
33
|
._4t3ixt2k{height:509px}
|
|
39
|
-
._94n5idpf{bottom:0}
|
|
40
34
|
._bfhk1bhr{background-color:var(--ds-surface-overlay,#fff)}
|
|
41
35
|
._c71l1y6z{max-height:calc(80vh - 86px)}
|
|
42
36
|
._i0dlf1ug{flex-basis:0%}
|
|
43
|
-
._kqswh2mm{position:relative}
|
|
44
|
-
._kqswstnw{position:absolute}
|
|
37
|
+
._kqswh2mm{position:relative}
|
|
@@ -28,8 +28,6 @@ import { uploadEmoji } from '../common/UploadEmoji';
|
|
|
28
28
|
import { createRecordSelectionDefault } from '../common/RecordSelectionDefault';
|
|
29
29
|
import CategorySelector from './CategorySelector';
|
|
30
30
|
import EmojiPickerFooter from './EmojiPickerFooter';
|
|
31
|
-
import EmojiUploadPicker from '../common/EmojiUploadPicker';
|
|
32
|
-
import EmojiDeletePreviewComponent from '../common/EmojiDeletePreview';
|
|
33
31
|
import { EmojiPickerVirtualListInternal as EmojiPickerList } from './EmojiPickerList';
|
|
34
32
|
import { createAndFireEventInElementsChannel, categoryClickedEvent, closedPickerEvent, deleteBeginEvent, deleteCancelEvent, deleteConfirmEvent, openedPickerEvent, pickerClickedEvent, pickerSearchedEvent, selectedFileEvent, uploadBeginButton, uploadCancelButton, uploadConfirmButton, toneSelectorClosedEvent, ufoExperiences } from '../../util/analytics';
|
|
35
33
|
import { useEmoji } from '../../hooks/useEmoji';
|
|
@@ -45,7 +43,6 @@ var emojiPickerMinHeight = 260;
|
|
|
45
43
|
var heightOffset = 80;
|
|
46
44
|
var emojiPicker = null;
|
|
47
45
|
var emojiPickerNew = null;
|
|
48
|
-
var uploadOverlay = null;
|
|
49
46
|
var emojiPickerWrapper = null;
|
|
50
47
|
var withPreviewHeight = {
|
|
51
48
|
small: "_4t3ivixp _1tkegx0z",
|
|
@@ -635,78 +632,23 @@ var EmojiPickerComponent = function EmojiPickerComponent(_ref) {
|
|
|
635
632
|
};
|
|
636
633
|
}, [emojiProvider, onProviderChange]);
|
|
637
634
|
var showPreview = fg('platform_emoji_picker_refresh') ? !uploading : selectedEmoji && !uploading;
|
|
638
|
-
if (fg('platform_no_noninteractive_emojis_reactions')) {
|
|
639
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
640
|
-
ref: setPickerRef,
|
|
641
|
-
"data-emoji-picker-container": true,
|
|
642
|
-
role: "dialog",
|
|
643
|
-
"aria-label": formatMessage(messages.emojiPickerTitle),
|
|
644
|
-
"aria-modal": true,
|
|
645
|
-
className: ax([fg('platform_emoji_picker_refresh') ? "_19itahnd _2rko1mok _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iuxo9 _1bsb10mj _1ul910mj _c71l1y6z _kqswh2mm" : "_19itahnd _2rkofajl _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iuxo9 _1bsb10mj _1ul910mj _c71l1y6z _kqswh2mm", !!emojiToDelete && fg('platform_emoji_picker_refresh') ? withDeleteRefreshHeight[size] : uploading && fg('platform_emoji_picker_refresh') ? withUploadRefreshHeight[size] : query && filteredEmojis.length === 0 && fg('platform_emoji_picker_refresh') ? withNoResultsRefreshHeight[size] : showPreview ? withPreviewHeight[size] : withoutPreviewHeight[size]]),
|
|
646
|
-
style: {
|
|
647
|
-
"--_19dn98e": ix("".concat(emojiPickerHeight, "px")),
|
|
648
|
-
"--_gsvyy7": ix("".concat(emojiPickerWidth, "px"))
|
|
649
|
-
}
|
|
650
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
651
|
-
role: "presentation",
|
|
652
|
-
onKeyPress: suppressKeyPress,
|
|
653
|
-
onKeyUp: suppressKeyPress,
|
|
654
|
-
onKeyDown: suppressKeyPress,
|
|
655
|
-
className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bah1yb4 _1tkeidpf"])
|
|
656
|
-
}, /*#__PURE__*/React.createElement(CategorySelector, {
|
|
657
|
-
activeCategoryId: (uploading || emojiToDelete) && fg('platform_emoji_picker_refresh') ? null : activeCategory,
|
|
658
|
-
dynamicCategories: dynamicCategories,
|
|
659
|
-
disableCategories: disableCategories,
|
|
660
|
-
onCategorySelected: onCategorySelected
|
|
661
|
-
}), /*#__PURE__*/React.createElement(EmojiPickerList, {
|
|
662
|
-
emojis: filteredEmojis,
|
|
663
|
-
currentUser: currentUser,
|
|
664
|
-
onEmojiSelected: recordUsageOnSelection,
|
|
665
|
-
onEmojiActive: onEmojiActive,
|
|
666
|
-
onEmojiLeave: onEmojiLeave,
|
|
667
|
-
onEmojiDelete: onTriggerDelete,
|
|
668
|
-
onCategoryActivated: onCategoryActivated,
|
|
669
|
-
onSearch: onSearch,
|
|
670
|
-
query: query,
|
|
671
|
-
selectedTone: selectedTone,
|
|
672
|
-
loading: loading,
|
|
673
|
-
ref: emojiPickerList,
|
|
674
|
-
initialUploadName: query,
|
|
675
|
-
onToneSelected: onToneSelected,
|
|
676
|
-
onToneSelectorCancelled: onToneSelectorCancelled,
|
|
677
|
-
toneEmoji: toneEmoji,
|
|
678
|
-
uploading: uploading,
|
|
679
|
-
emojiToDelete: emojiToDelete,
|
|
680
|
-
uploadErrorMessage: formattedErrorMessage,
|
|
681
|
-
uploadEnabled: isUploadSupported && !uploading,
|
|
682
|
-
onUploadEmoji: onUploadEmoji,
|
|
683
|
-
onUploadCancelled: onUploadCancelled,
|
|
684
|
-
onDeleteEmoji: onDeleteEmoji,
|
|
685
|
-
onCloseDelete: onCloseDelete,
|
|
686
|
-
onFileChooserClicked: onFileChooserClicked,
|
|
687
|
-
onOpenUpload: onOpenUpload,
|
|
688
|
-
size: size,
|
|
689
|
-
activeCategoryId: activeCategory
|
|
690
|
-
}), showPreview && !(emojiToDelete && fg('platform_emoji_picker_refresh')) && !(query && filteredEmojis.length === 0 && fg('platform_emoji_picker_refresh')) && /*#__PURE__*/React.createElement(EmojiPickerFooter, {
|
|
691
|
-
selectedEmoji: selectedEmoji,
|
|
692
|
-
uploadEnabled: isUploadSupported && !uploading,
|
|
693
|
-
onOpenUpload: onOpenUpload
|
|
694
|
-
})));
|
|
695
|
-
}
|
|
696
635
|
return /*#__PURE__*/React.createElement("div", {
|
|
697
636
|
ref: setPickerRef,
|
|
698
637
|
"data-emoji-picker-container": true,
|
|
699
638
|
role: "dialog",
|
|
700
639
|
"aria-label": formatMessage(messages.emojiPickerTitle),
|
|
701
640
|
"aria-modal": true,
|
|
702
|
-
onKeyPress: suppressKeyPress,
|
|
703
|
-
onKeyUp: suppressKeyPress,
|
|
704
|
-
onKeyDown: suppressKeyPress,
|
|
705
641
|
className: ax([fg('platform_emoji_picker_refresh') ? "_19itahnd _2rko1mok _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iuxo9 _1bsb10mj _1ul910mj _c71l1y6z _kqswh2mm" : "_19itahnd _2rkofajl _1e0c1txw _2lx21bp4 _1bah1yb4 _bfhk1bhr _16qs130s _4t3iuxo9 _1bsb10mj _1ul910mj _c71l1y6z _kqswh2mm", !!emojiToDelete && fg('platform_emoji_picker_refresh') ? withDeleteRefreshHeight[size] : uploading && fg('platform_emoji_picker_refresh') ? withUploadRefreshHeight[size] : query && filteredEmojis.length === 0 && fg('platform_emoji_picker_refresh') ? withNoResultsRefreshHeight[size] : showPreview ? withPreviewHeight[size] : withoutPreviewHeight[size]]),
|
|
706
642
|
style: {
|
|
707
643
|
"--_19dn98e": ix("".concat(emojiPickerHeight, "px")),
|
|
708
644
|
"--_gsvyy7": ix("".concat(emojiPickerWidth, "px"))
|
|
709
645
|
}
|
|
646
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
647
|
+
role: "presentation",
|
|
648
|
+
onKeyPress: suppressKeyPress,
|
|
649
|
+
onKeyUp: suppressKeyPress,
|
|
650
|
+
onKeyDown: suppressKeyPress,
|
|
651
|
+
className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _1reo15vq _18m915vq _1e0c1txw _2lx21bp4 _1bah1yb4 _1tkeidpf"])
|
|
710
652
|
}, /*#__PURE__*/React.createElement(CategorySelector, {
|
|
711
653
|
activeCategoryId: (uploading || emojiToDelete) && fg('platform_emoji_picker_refresh') ? null : activeCategory,
|
|
712
654
|
dynamicCategories: dynamicCategories,
|
|
@@ -745,20 +687,6 @@ var EmojiPickerComponent = function EmojiPickerComponent(_ref) {
|
|
|
745
687
|
selectedEmoji: selectedEmoji,
|
|
746
688
|
uploadEnabled: isUploadSupported && !uploading,
|
|
747
689
|
onOpenUpload: onOpenUpload
|
|
748
|
-
}), uploading && fg('platform_emoji_picker_refresh') && /*#__PURE__*/React.createElement("div", {
|
|
749
|
-
className: ax(["_2rko1mok _kqswstnw _154iidpf _1ltvidpf _1xi2idpf _94n5idpf _bfhk1bhr _1pbykb7n _18m91wug"])
|
|
750
|
-
}, /*#__PURE__*/React.createElement(EmojiUploadPicker, {
|
|
751
|
-
onUploadEmoji: onUploadEmoji,
|
|
752
|
-
onUploadCancelled: onUploadCancelled,
|
|
753
|
-
onFileChooserClicked: onFileChooserClicked,
|
|
754
|
-
errorMessage: formattedErrorMessage,
|
|
755
|
-
initialUploadName: query
|
|
756
|
-
})), emojiToDelete && fg('platform_emoji_picker_refresh') && /*#__PURE__*/React.createElement("div", {
|
|
757
|
-
className: ax(["_2rko1mok _kqswstnw _154iidpf _1ltvidpf _1xi2idpf _94n5idpf _bfhk1bhr _1pbykb7n _18m91wug"])
|
|
758
|
-
}, /*#__PURE__*/React.createElement(EmojiDeletePreviewComponent, {
|
|
759
|
-
emoji: emojiToDelete,
|
|
760
|
-
onDeleteEmoji: onDeleteEmoji,
|
|
761
|
-
onCloseDelete: onCloseDelete
|
|
762
690
|
})));
|
|
763
691
|
};
|
|
764
692
|
var _default_1 = /*#__PURE__*/memo(EmojiPickerComponent);
|
|
@@ -14,7 +14,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
|
|
|
14
14
|
actionSubjectId: actionSubjectId,
|
|
15
15
|
attributes: _objectSpread({
|
|
16
16
|
packageName: "@atlaskit/emoji",
|
|
17
|
-
packageVersion: "70.
|
|
17
|
+
packageVersion: "70.15.0"
|
|
18
18
|
}, attributes)
|
|
19
19
|
};
|
|
20
20
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/emoji",
|
|
3
|
-
"version": "70.
|
|
3
|
+
"version": "70.15.1",
|
|
4
4
|
"description": "Fabric emoji React components",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -38,13 +38,13 @@
|
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
40
|
"@atlaskit/afm-i18n-platform-elements-emoji": "2.7.0",
|
|
41
|
-
"@atlaskit/analytics-next": "^11.
|
|
41
|
+
"@atlaskit/analytics-next": "^11.3.0",
|
|
42
42
|
"@atlaskit/browser-apis": "^0.0.2",
|
|
43
43
|
"@atlaskit/button": "^23.11.0",
|
|
44
44
|
"@atlaskit/css": "^0.19.0",
|
|
45
45
|
"@atlaskit/form": "^15.5.0",
|
|
46
46
|
"@atlaskit/heading": "^5.4.0",
|
|
47
|
-
"@atlaskit/icon": "^35.
|
|
47
|
+
"@atlaskit/icon": "^35.4.0",
|
|
48
48
|
"@atlaskit/image": "^3.0.0",
|
|
49
49
|
"@atlaskit/media-client": "^36.3.0",
|
|
50
50
|
"@atlaskit/media-client-react": "^5.2.0",
|
|
@@ -53,9 +53,9 @@
|
|
|
53
53
|
"@atlaskit/primitives": "^19.0.0",
|
|
54
54
|
"@atlaskit/spinner": "^19.1.0",
|
|
55
55
|
"@atlaskit/textfield": "^8.3.0",
|
|
56
|
-
"@atlaskit/tmp-editor-statsig": "^88.
|
|
56
|
+
"@atlaskit/tmp-editor-statsig": "^88.3.0",
|
|
57
57
|
"@atlaskit/tokens": "^13.1.0",
|
|
58
|
-
"@atlaskit/tooltip": "^22.
|
|
58
|
+
"@atlaskit/tooltip": "^22.6.0",
|
|
59
59
|
"@atlaskit/ufo": "^0.5.0",
|
|
60
60
|
"@atlaskit/util-service-support": "^6.4.0",
|
|
61
61
|
"@atlaskit/visually-hidden": "^3.1.0",
|
|
@@ -138,9 +138,6 @@
|
|
|
138
138
|
"platform_change_emoji_button_label": {
|
|
139
139
|
"type": "boolean"
|
|
140
140
|
},
|
|
141
|
-
"platform_no_noninteractive_emojis_reactions": {
|
|
142
|
-
"type": "boolean"
|
|
143
|
-
},
|
|
144
141
|
"increase-emoji-client-upload-timeout": {
|
|
145
142
|
"type": "boolean"
|
|
146
143
|
},
|