emoji-picker-react 4.7.0 → 4.7.1

package/dist/emoji-picker-react.esm.js

@@ -16886,7 +16886,8 @@ function useMutableConfig() {
 }
 function useDefineMutableConfig(config) {
   var MutableConfigRef = React__default.useRef({
-    onEmojiClick: config.onEmojiClick || emptyFunc
+    onEmojiClick: config.onEmojiClick || emptyFunc,
+    onReactionClick: config.onReactionClick || config.onEmojiClick
   });
   React__default.useEffect(function () {
     MutableConfigRef.current.onEmojiClick = config.onEmojiClick || emptyFunc;
@@ -16895,6 +16896,11 @@ function useDefineMutableConfig(config) {
 }
 function emptyFunc() {}
 
+var MOUSE_EVENT_SOURCE;
+(function (MOUSE_EVENT_SOURCE) {
+  MOUSE_EVENT_SOURCE["REACTIONS"] = "reactions";
+  MOUSE_EVENT_SOURCE["PICKER"] = "picker";
+})(MOUSE_EVENT_SOURCE || (MOUSE_EVENT_SOURCE = {}));
 function useSearchPlaceHolderConfig() {
   var _find;
   var _usePickerConfig = usePickerConfig(),
@@ -16934,10 +16940,12 @@ function useCustomEmojisConfig() {
     customEmojis = _usePickerConfig7.customEmojis;
   return customEmojis;
 }
-function useOnEmojiClickConfig() {
+function useOnEmojiClickConfig(mouseEventSource) {
+  var _ref;
   var _useMutableConfig = useMutableConfig(),
     current = _useMutableConfig.current;
-  return current.onEmojiClick || function () {};
+  var handler = (_ref = mouseEventSource === MOUSE_EVENT_SOURCE.REACTIONS ? current.onReactionClick : current.onEmojiClick) != null ? _ref : current.onEmojiClick;
+  return handler || function () {};
 }
 function usePreviewConfig() {
   var _usePickerConfig8 = usePickerConfig(),
@@ -17688,7 +17696,7 @@ function useSetVariationPicker() {
   };
 }
 
-function useMouseDownHandlers(BodyRef) {
+function useMouseDownHandlers(ContainerRef, mouseEventSource) {
   var mouseDownTimerRef = useRef();
   var setVariationPicker = useSetVariationPicker();
   var disallowClickRef = useDisallowClickRef();
@@ -17697,7 +17705,7 @@ function useMouseDownHandlers(BodyRef) {
   var closeAllOpenToggles = useCloseAllOpenToggles();
   var _useActiveSkinToneSta = useActiveSkinToneState(),
     activeSkinTone = _useActiveSkinToneSta[0];
-  var onEmojiClick = useOnEmojiClickConfig();
+  var onEmojiClick = useOnEmojiClickConfig(mouseEventSource);
   var _useUpdateSuggested = useUpdateSuggested(),
     updateSuggested = _useUpdateSuggested[1];
   var getEmojiUrl = useGetEmojiUrlConfig();
@@ -17752,25 +17760,25 @@ function useMouseDownHandlers(BodyRef) {
     }
   }, [disallowClickRef]);
   useEffect(function () {
-    if (!BodyRef.current) {
+    if (!ContainerRef.current) {
       return;
     }
-    var bodyRef = BodyRef.current;
-    bodyRef.addEventListener('click', onClick, {
+    var confainerRef = ContainerRef.current;
+    confainerRef.addEventListener('click', onClick, {
       passive: true
     });
-    bodyRef.addEventListener('mousedown', onMouseDown, {
+    confainerRef.addEventListener('mousedown', onMouseDown, {
       passive: true
     });
-    bodyRef.addEventListener('mouseup', onMouseUp, {
+    confainerRef.addEventListener('mouseup', onMouseUp, {
       passive: true
     });
     return function () {
-      bodyRef == null ? void 0 : bodyRef.removeEventListener('click', onClick);
-      bodyRef == null ? void 0 : bodyRef.removeEventListener('mousedown', onMouseDown);
-      bodyRef == null ? void 0 : bodyRef.removeEventListener('mouseup', onMouseUp);
+      confainerRef == null ? void 0 : confainerRef.removeEventListener('click', onClick);
+      confainerRef == null ? void 0 : confainerRef.removeEventListener('mousedown', onMouseDown);
+      confainerRef == null ? void 0 : confainerRef.removeEventListener('mouseup', onMouseUp);
     };
-  }, [BodyRef, onClick, onMouseDown, onMouseUp]);
+  }, [ContainerRef, onClick, onMouseDown, onMouseUp]);
 }
 function emojiFromEvent(event) {
   var target = event == null ? void 0 : event.target;
@@ -18129,7 +18137,7 @@ function Reactions() {
     reactionsOpen = _useReactionsModeStat[0];
   var ReactionsRef = useReactionsRef();
   var reactions = useReactionsConfig();
-  useMouseDownHandlers(ReactionsRef);
+  useMouseDownHandlers(ReactionsRef, MOUSE_EVENT_SOURCE.REACTIONS);
   var emojiStyle = useEmojiStyleConfig();
   if (!reactionsOpen) {
     return null;
@@ -18885,7 +18893,7 @@ var styles$8 = /*#__PURE__*/stylesheet.create({
 function Body() {
   var BodyRef = useBodyRef();
   useOnScroll(BodyRef);
-  useMouseDownHandlers(BodyRef);
+  useMouseDownHandlers(BodyRef, MOUSE_EVENT_SOURCE.PICKER);
   useOnMouseMove();
   return createElement("div", {
     className: cx(styles$9.body, commonInteractionStyles.hiddenOnReactions),
@@ -20457,7 +20465,8 @@ function ExportedEmoji(_ref) {
 
 function EmojiPicker$1(props) {
   var MutableConfigRef = useDefineMutableConfig({
-    onEmojiClick: props.onEmojiClick
+    onEmojiClick: props.onEmojiClick,
+    onReactionClick: props.onReactionClick
   });
   return createElement(ErrorBoundary, null, createElement(MutableConfigContext.Provider, {
     value: MutableConfigRef