@ethora/chat-component-rn 26.8.4 → 26.8.6

package/lib/module/components/MessageBubble/MessageInteractions.js

@@ -1,14 +1,16 @@
 "use strict";
 
-import React, { useEffect, useId, useMemo, useState } from 'react';
+import React, { useEffect, useId, useMemo, useRef, useState } from 'react';
 import { Delimeter, MenuItem } from '../ContextMenu/ContextMenuComponents';
 import { useSelector } from 'react-redux';
 import { MESSAGE_INTERACTIONS, MESSAGE_INTERACTIONS_ICONS } from '../../helpers/constants/MESSAGE_INTERACTIONS';
-import { Text, StyleSheet, View, Pressable, Dimensions, Keyboard } from 'react-native';
+import { Animated, Text, StyleSheet, View, Pressable, Dimensions, Keyboard } from 'react-native';
 import * as Clipboard from 'expo-clipboard';
 import { useToast } from '../../context/ToastContext';
 import { useInteractionsOverlay } from './InteractionsOverlay';
 import { useTheme } from '../../hooks/useTheme';
+import { getEmojiNativeById } from '../../helpers/emoji';
+import { quickReactionIds, reactionPickerEnabled, reactionsEnabled } from '../../helpers/reactionsConfig';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const MessageInteractions = ({
   isReply,
@@ -18,7 +20,9 @@ const MessageInteractions = ({
   position,
   handleReplyMessage: replyMessage,
   handleDeleteMessage,
-  handleEditMessage
+  handleEditMessage,
+  handleReactionMessage,
+  onOpenEmojiPicker
 }) => {
   const {
     showToast
@@ -45,6 +49,30 @@ const MessageInteractions = ({
     width: 0,
     height: 0
   });
+  const [barSize, setBarSize] = useState({
+    width: 0,
+    height: 0
+  });
+  const showReactions = reactionsEnabled(config);
+  const quickIds = useMemo(() => quickReactionIds(config), [config]);
+  const showPicker = reactionPickerEnabled(config) && !!onOpenEmojiPicker;
+
+  // Entrance: the menu pops out of its anchor (scale + fade) and the chat
+  // dims a touch behind it. Started once the menu has been measured and
+  // placed — before that it sits invisible at a provisional spot.
+  const reveal = useRef(new Animated.Value(0)).current;
+  const placed = !!position && !!menuSize.width && !!menuSize.height;
+  useEffect(() => {
+    if (!placed) {
+      return;
+    }
+    Animated.spring(reveal, {
+      toValue: 1,
+      useNativeDriver: true,
+      speed: 24,
+      bounciness: 7
+    }).start();
+  }, [placed, reveal]);
 
   // Live keyboard height so the menu knows the REAL space below the message.
   // Without this the position math used the full screen height and happily
@@ -59,6 +87,18 @@ const MessageInteractions = ({
     const subs = [Keyboard.addListener('keyboardDidShow', onShow), Keyboard.addListener('keyboardDidChangeFrame', onShow), Keyboard.addListener('keyboardDidHide', onHide)];
     return () => subs.forEach(s => s.remove());
   }, []);
+  const handleBarLayout = e => {
+    const {
+      width,
+      height
+    } = e.nativeEvent.layout;
+    if (width && height && (width !== barSize.width || height !== barSize.height)) {
+      setBarSize({
+        width,
+        height
+      });
+    }
+  };
   const handleMenuLayout = e => {
     const {
       width,
@@ -105,6 +145,7 @@ const MessageInteractions = ({
         opacity: 0
       };
     }
+    const barReserve = showReactions && barSize.height ? barSize.height + 10 : 0;
     const {
       width: screenWidth,
       height: screenHeight
@@ -112,19 +153,21 @@ const MessageInteractions = ({
     const bottomReserve = (config?.keyboardVerticalOffset ?? 0) + 24;
     const topReserve = 16;
     const sideMargin = 8;
+    // Breathing room between the bubble and the menu.
+    const gap = 10;
 
     // The keyboard occludes the bottom `keyboardHeight` px, so the real
     // visible bottom edge is above it. Measuring space below against this
     // (not the full screen) is what makes the menu flip ABOVE the message
     // when the keyboard is open and the message sits near the input.
     const visibleBottom = screenHeight - keyboardHeight;
-    const spaceBelow = visibleBottom - position.bottom - bottomReserve;
-    const spaceAbove = position.top - topReserve;
+    const spaceBelow = visibleBottom - position.bottom - gap - bottomReserve;
+    const spaceAbove = position.top - gap - topReserve - barReserve;
     let top;
     if (spaceBelow >= menuSize.height) {
-      top = position.bottom;
+      top = position.bottom + gap;
     } else if (spaceAbove >= menuSize.height) {
-      top = position.top - menuSize.height;
+      top = position.top - gap - menuSize.height;
     } else {
       top = Math.max(topReserve, visibleBottom - menuSize.height - bottomReserve);
     }
@@ -137,7 +180,44 @@ const MessageInteractions = ({
       top,
       left
     };
-  }, [position, menuSize, config?.keyboardVerticalOffset, keyboardHeight]);
+  }, [position, menuSize, barSize.height, showReactions, config?.keyboardVerticalOffset, keyboardHeight]);
+  const barPosition = useMemo(() => {
+    if (!position || !showReactions) {
+      return undefined;
+    }
+    if (!barSize.width || !barSize.height) {
+      return {
+        top: position.top,
+        left: position.left,
+        opacity: 0
+      };
+    }
+    const {
+      width: screenWidth
+    } = Dimensions.get('window');
+    const sideMargin = 8;
+    const gap = 8;
+    const rightAligned = screenWidth - position.right < position.left;
+    let left = rightAligned ? position.right - barSize.width : position.left;
+    left = Math.max(sideMargin, Math.min(left, screenWidth - barSize.width - sideMargin));
+    const above = position.top - gap - barSize.height;
+    const menuTop = memoPosition?.top;
+    const top = above >= 16 ? above : (menuTop ?? position.bottom) + (menuSize.height || 0) + gap;
+    return {
+      top,
+      left
+    };
+  }, [position, showReactions, barSize, memoPosition, menuSize.height]);
+  const localBarPosition = useMemo(() => {
+    if (!barPosition) {
+      return undefined;
+    }
+    return {
+      ...barPosition,
+      top: barPosition.top - originY,
+      left: barPosition.left - originX
+    };
+  }, [barPosition, originX, originY]);
 
   // Window coords (memoPosition) → host-local coords. The overlay host
   // sits below the status bar / header, so subtract its measured origin.
@@ -155,16 +235,93 @@ const MessageInteractions = ({
     style: styles.overlayFill,
     children: [/*#__PURE__*/_jsx(Pressable, {
       style: StyleSheet.absoluteFill,
-      onPress: closeMenu
-    }), /*#__PURE__*/_jsxs(View, {
-      style: [styles.contextMenu, themedStyles.menu, localPosition],
+      onPress: closeMenu,
+      children: /*#__PURE__*/_jsx(Animated.View, {
+        pointerEvents: "none",
+        style: [styles.dim, {
+          opacity: reveal
+        }]
+      })
+    }), showReactions && /*#__PURE__*/_jsxs(Animated.View, {
+      testID: "reaction-bar",
+      onLayout: handleBarLayout,
+      style: [styles.reactionBar, {
+        backgroundColor: theme.surface,
+        shadowColor: theme.shadow
+      }, localBarPosition, placed && barSize.height ? {
+        opacity: reveal,
+        transform: [{
+          scale: reveal.interpolate({
+            inputRange: [0, 1],
+            outputRange: [0.6, 1]
+          })
+        }]
+      } : null],
+      children: [quickIds.map(id => /*#__PURE__*/_jsx(Pressable, {
+        testID: `quick-reaction-${id}`,
+        onPress: () => {
+          handleReactionMessage(id);
+          closeMenu();
+        },
+        style: ({
+          pressed
+        }) => [styles.reactionItem, pressed && {
+          backgroundColor: theme.surfaceHighlight
+        }],
+        children: /*#__PURE__*/_jsx(Text, {
+          style: styles.reactionGlyph,
+          children: getEmojiNativeById(id)
+        })
+      }, id)), showPicker && /*#__PURE__*/_jsx(Pressable, {
+        testID: "quick-reaction-more",
+        onPress: () => {
+          closeMenu();
+          onOpenEmojiPicker?.();
+        },
+        style: ({
+          pressed
+        }) => [styles.reactionMore, {
+          backgroundColor: theme.surfaceSecondary
+        }, pressed && {
+          backgroundColor: theme.surfaceHighlight
+        }],
+        children: /*#__PURE__*/_jsx(Text, {
+          style: [styles.reactionMoreText, {
+            color: theme.text
+          }],
+          children: "+"
+        })
+      })]
+    }), /*#__PURE__*/_jsxs(Animated.View, {
+      style: [styles.contextMenu, themedStyles.menu, localPosition, placed ? {
+        opacity: reveal,
+        transform: [{
+          scale: reveal.interpolate({
+            inputRange: [0, 1],
+            outputRange: [0.6, 1]
+          })
+        }]
+      } : null],
       onLayout: handleMenuLayout,
-      children: [/*#__PURE__*/_jsxs(MenuItem, {
+      children: [!isReply && !config?.disableReplies && /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsxs(MenuItem, {
+          testID: "menu-reply",
+          onPress: handleReplyMessage,
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: [styles.menuText, themedStyles.text],
+            children: MESSAGE_INTERACTIONS.REPLY
+          }), /*#__PURE__*/_jsx(MESSAGE_INTERACTIONS_ICONS.REPLY, {
+            color: theme.text
+          })]
+        }), /*#__PURE__*/_jsx(Delimeter, {})]
+      }), /*#__PURE__*/_jsxs(MenuItem, {
         onPress: () => handleCopyMessage(message.body),
         children: [/*#__PURE__*/_jsx(Text, {
           style: [styles.menuText, themedStyles.text],
           children: MESSAGE_INTERACTIONS.COPY
-        }), /*#__PURE__*/_jsx(MESSAGE_INTERACTIONS_ICONS.COPY, {})]
+        }), /*#__PURE__*/_jsx(MESSAGE_INTERACTIONS_ICONS.COPY, {
+          color: theme.text
+        })]
       }), isUser && /*#__PURE__*/_jsxs(_Fragment, {
         children: [message?.isMediafile !== 'true' && /*#__PURE__*/_jsxs(_Fragment, {
           children: [/*#__PURE__*/_jsx(Delimeter, {}), /*#__PURE__*/_jsxs(MenuItem, {
@@ -172,7 +329,9 @@ const MessageInteractions = ({
             children: [/*#__PURE__*/_jsx(Text, {
               style: [styles.menuText, themedStyles.text],
               children: MESSAGE_INTERACTIONS.EDIT
-            }), /*#__PURE__*/_jsx(MESSAGE_INTERACTIONS_ICONS.EDIT, {})]
+            }), /*#__PURE__*/_jsx(MESSAGE_INTERACTIONS_ICONS.EDIT, {
+              color: theme.text
+            })]
           })]
         }), /*#__PURE__*/_jsx(Delimeter, {}), /*#__PURE__*/_jsxs(MenuItem, {
           onPress: handleDeleteMessage,
@@ -207,6 +366,48 @@ const styles = StyleSheet.create({
     ...StyleSheet.absoluteFill,
     backgroundColor: 'transparent'
   },
+  dim: {
+    ...StyleSheet.absoluteFill,
+    backgroundColor: 'rgba(0,0,0,0.18)'
+  },
+  reactionBar: {
+    position: 'absolute',
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingHorizontal: 6,
+    paddingVertical: 4,
+    borderRadius: 28,
+    shadowOffset: {
+      width: 0,
+      height: 2
+    },
+    shadowOpacity: 0.18,
+    shadowRadius: 8,
+    elevation: 6
+  },
+  reactionItem: {
+    width: 40,
+    height: 40,
+    borderRadius: 20,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  reactionGlyph: {
+    fontSize: 26
+  },
+  reactionMore: {
+    width: 34,
+    height: 34,
+    borderRadius: 17,
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginLeft: 2
+  },
+  reactionMoreText: {
+    fontSize: 22,
+    lineHeight: 24,
+    fontWeight: '400'
+  },
   contextMenu: {
     position: 'absolute',
     backgroundColor: 'white',

package/lib/module/components/MessageBubble/MessageInteractions.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useId","useMemo","useState","Delimeter","MenuItem","useSelector","MESSAGE_INTERACTIONS","MESSAGE_INTERACTIONS_ICONS","Text","StyleSheet","View","Pressable","Dimensions","Keyboard","Clipboard","useToast","useInteractionsOverlay","useTheme","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","MessageInteractions","isReply","isUser","message","closeMenu","position","handleReplyMessage","replyMessage","handleDeleteMessage","handleEditMessage","showToast","present","dismiss","originX","originY","overlayId","theme","themedStyles","menu","backgroundColor","surface","shadowColor","shadow","text","color","config","state","chatSettingStore","menuSize","setMenuSize","width","height","keyboardHeight","setKeyboardHeight","metrics","onShow","e","endCoordinates","onHide","subs","addListener","forEach","s","remove","handleMenuLayout","nativeEvent","layout","handleCopyMessage","setStringAsync","id","Date","now","toString","title","type","err","console","log","memoPosition","undefined","top","bottom","left","opacity","screenWidth","screenHeight","get","bottomReserve","keyboardVerticalOffset","topReserve","sideMargin","visibleBottom","spaceBelow","spaceAbove","Math","max","leftMargin","rightMargin","right","rightAligned","min","localPosition","content","disableInteractions","isDeleted","style","styles","overlayFill","children","absoluteFill","onPress","contextMenu","onLayout","body","menuText","COPY","isMediafile","EDIT","DELETE","create","paddingVertical","paddingHorizontal","borderRadius","shadowOffset","shadowOpacity","shadowRadius","elevation","minWidth","overflow","fontSize","includeFontPadding","textAlignVertical","marginRight"],"sourceRoot":"../../../../src","sources":["components/MessageBubble/MessageInteractions.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useId","useMemo","useRef","useState","Delimeter","MenuItem","useSelector","MESSAGE_INTERACTIONS","MESSAGE_INTERACTIONS_ICONS","Animated","Text","StyleSheet","View","Pressable","Dimensions","Keyboard","Clipboard","useToast","useInteractionsOverlay","useTheme","getEmojiNativeById","quickReactionIds","reactionPickerEnabled","reactionsEnabled","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","MessageInteractions","isReply","isUser","message","closeMenu","position","handleReplyMessage","replyMessage","handleDeleteMessage","handleEditMessage","handleReactionMessage","onOpenEmojiPicker","showToast","present","dismiss","originX","originY","overlayId","theme","themedStyles","menu","backgroundColor","surface","shadowColor","shadow","text","color","config","state","chatSettingStore","menuSize","setMenuSize","width","height","barSize","setBarSize","showReactions","quickIds","showPicker","reveal","Value","current","placed","spring","toValue","useNativeDriver","speed","bounciness","start","keyboardHeight","setKeyboardHeight","metrics","onShow","e","endCoordinates","onHide","subs","addListener","forEach","s","remove","handleBarLayout","nativeEvent","layout","handleMenuLayout","handleCopyMessage","setStringAsync","id","Date","now","toString","title","type","err","console","log","memoPosition","undefined","top","bottom","left","opacity","barReserve","screenWidth","screenHeight","get","bottomReserve","keyboardVerticalOffset","topReserve","sideMargin","gap","visibleBottom","spaceBelow","spaceAbove","Math","max","leftMargin","rightMargin","right","rightAligned","min","barPosition","above","menuTop","localBarPosition","localPosition","content","disableInteractions","isDeleted","style","styles","overlayFill","children","absoluteFill","onPress","pointerEvents","dim","testID","onLayout","reactionBar","transform","scale","interpolate","inputRange","outputRange","map","pressed","reactionItem","surfaceHighlight","reactionGlyph","reactionMore","surfaceSecondary","reactionMoreText","contextMenu","disableReplies","menuText","REPLY","body","COPY","isMediafile","EDIT","DELETE","create","flexDirection","alignItems","paddingHorizontal","paddingVertical","borderRadius","shadowOffset","shadowOpacity","shadowRadius","elevation","justifyContent","fontSize","marginLeft","lineHeight","fontWeight","minWidth","overflow","includeFontPadding","textAlignVertical","marginRight"],"sourceRoot":"../../../../src","sources":["components/MessageBubble/MessageInteractions.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/MessageBubble/MessageReaction.js

@@ -1,46 +1,42 @@
 "use strict";
 
-/* eslint-disable react-hooks/rules-of-hooks -- pre-existing port artifacts; hooks called conditionally / inside helpers. TODO: refactor */
-import React, { useMemo, useState } from 'react';
-import { View, Text, TouchableOpacity, Animated } from 'react-native';
-import styled from 'styled-components/native';
+import React, { useMemo, useRef, useState } from 'react';
+import { View, Text, TouchableOpacity, Animated, StyleSheet } from 'react-native';
 import { useTheme } from '../../hooks/useTheme';
+import { getEmojiNativeById } from '../../helpers/emoji';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const ReactionContainer = styled.View`
-  flex-direction: row;
-  align-items: center;
-  gap: 8px;
-`;
-const ReactionBox = styled(TouchableOpacity)`
-  padding: 4px 8px;
-  border-radius: 20px;
-  background-color: ${({
-  active,
-  color,
-  theme
-}) => active ? color : theme.surface};
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-  elevation: 3;
-`;
-const emojiMap = {
-  joy: '😂',
-  heart: '❤️',
-  fire: '🔥',
-  '+1': '👍',
-  smile: '😄',
-  scream: '😱'
-};
 export const MessageReaction = ({
   reaction,
   color,
   changeReaction,
-  userName
+  userName,
+  interactive = true
 }) => {
   const theme = useTheme();
   const [tooltipEmoji, setTooltipEmoji] = useState(null);
-  const fadeAnim = new Animated.Value(0);
+  const fadeAnim = useRef(new Animated.Value(0)).current;
+  const reactionDetails = useMemo(() => {
+    const result = {};
+    Object.values(reaction || {}).forEach(({
+      emoji,
+      data
+    }) => {
+      (emoji || []).forEach(em => {
+        if (!result[em]) {
+          result[em] = {
+            count: 0,
+            users: []
+          };
+        }
+        result[em].count += 1;
+        result[em].users.push(`${data?.senderFirstName || ''} ${data?.senderLastName || ''}`.trim());
+      });
+    });
+    return result;
+  }, [reaction]);
+  if (!reaction || Object.keys(reactionDetails).length === 0) {
+    return null;
+  }
   const showTooltip = emoji => {
     setTooltipEmoji(emoji);
     Animated.timing(fadeAnim, {
@@ -56,90 +52,115 @@ export const MessageReaction = ({
       useNativeDriver: true
     }).start(() => setTooltipEmoji(null));
   };
-  if (!reaction) {
-    return null;
-  }
-  const reactionDetails = useMemo(() => {
-    const result = {};
-    Object.values(reaction).forEach(({
-      emoji,
-      data
-    }) => {
-      if (emoji && emoji.length > 0) {
-        emoji.forEach(em => {
-          if (!result[em]) {
-            result[em] = {
-              count: 0,
-              users: []
-            };
-          }
-          result[em].count += 1;
-          result[em].users.push(`${data?.senderFirstName} ${data?.senderLastName}`);
-        });
-      }
-    });
-    return result;
-  }, [reaction]);
-  return /*#__PURE__*/_jsx(ReactionContainer, {
+  return /*#__PURE__*/_jsx(View, {
+    style: styles.row,
     children: Object.entries(reactionDetails).map(([emoji, details]) => {
-      const isUserReacted = userName ? details.users.includes(userName) : false;
+      const isUserReacted = !!userName && details.users.includes(userName);
       return /*#__PURE__*/_jsxs(View, {
-        style: {
-          position: 'relative'
-        },
-        children: [/*#__PURE__*/_jsxs(ReactionBox, {
-          active: isUserReacted,
-          color: color,
+        style: styles.chipWrap,
+        children: [/*#__PURE__*/_jsxs(TouchableOpacity, {
+          testID: `reaction-chip-${emoji}`,
+          activeOpacity: 0.7,
+          disabled: !interactive,
           onPress: () => changeReaction(emoji),
           onLongPress: () => showTooltip(emoji),
           onPressOut: hideTooltip,
-          children: [/*#__PURE__*/_jsx(Text, {
-            style: {
-              fontSize: 18,
-              marginRight: 4
-            },
-            children: emojiMap[emoji] || emoji
+          style: [styles.chip, {
+            backgroundColor: theme.surface,
+            borderColor: isUserReacted ? color : theme.border,
+            shadowColor: theme.shadow
+          }],
+          children: [isUserReacted && /*#__PURE__*/_jsx(View, {
+            pointerEvents: "none",
+            style: [styles.tint, {
+              backgroundColor: `${color}26`
+            }]
+          }), /*#__PURE__*/_jsx(Text, {
+            style: styles.glyph,
+            children: getEmojiNativeById(emoji)
           }), /*#__PURE__*/_jsx(Text, {
-            style: {
-              fontSize: 14,
-              fontWeight: '600',
-              color: isUserReacted ? theme.textOnPrimary : color
-            },
+            style: [styles.count, {
+              color: isUserReacted ? color : theme.textSecondary
+            }],
             children: details.count
           })]
         }), tooltipEmoji === emoji && /*#__PURE__*/_jsx(Animated.View, {
-          style: {
-            position: 'absolute',
-            bottom: 36,
-            left: '50%',
+          pointerEvents: "none",
+          style: [styles.tooltip, {
+            opacity: fadeAnim,
             transform: [{
-              translateX: -50
-            }, {
               translateY: fadeAnim.interpolate({
                 inputRange: [0, 1],
                 outputRange: [4, 0]
               })
             }],
-            opacity: fadeAnim,
             // Inverted pill: text colour as ground, surface as ink,
             // so it stays high-contrast on both palettes.
-            backgroundColor: theme.text,
-            borderRadius: 6,
-            paddingHorizontal: 10,
-            paddingVertical: 6,
-            maxWidth: 220,
-            zIndex: 999
-          },
+            backgroundColor: theme.text
+          }],
           children: /*#__PURE__*/_jsx(Text, {
-            style: {
-              color: theme.surface,
-              fontSize: 12
-            },
-            children: details.users.join(', ')
+            style: [styles.tooltipText, {
+              color: theme.surface
+            }],
+            children: details.users.filter(Boolean).join(', ')
           })
         })]
       }, emoji);
     })
   });
 };
+const styles = StyleSheet.create({
+  row: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    alignItems: 'center',
+    gap: 6
+  },
+  chipWrap: {
+    position: 'relative'
+  },
+  chip: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingVertical: 3,
+    paddingHorizontal: 8,
+    borderRadius: 14,
+    borderWidth: StyleSheet.hairlineWidth,
+    shadowOpacity: 0.08,
+    shadowOffset: {
+      width: 0,
+      height: 1
+    },
+    shadowRadius: 2,
+    elevation: 1
+  },
+  tint: {
+    position: "absolute",
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0,
+    borderRadius: 14
+  },
+  glyph: {
+    fontSize: 16,
+    marginRight: 4
+  },
+  count: {
+    fontSize: 13,
+    fontWeight: '600'
+  },
+  tooltip: {
+    position: 'absolute',
+    bottom: 34,
+    left: 0,
+    borderRadius: 6,
+    paddingHorizontal: 10,
+    paddingVertical: 6,
+    maxWidth: 220
+  },
+  tooltipText: {
+    fontSize: 12
+  }
+});
 //# sourceMappingURL=MessageReaction.js.map