sceyt-chat-react-uikit 1.8.0-beta.7 → 1.8.0-beta.9

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.
Files changed (3) hide show
  1. package/index.js +243 -233
  2. package/index.modern.js +242 -232
  3. package/package.json +3 -1
package/index.js CHANGED
@@ -24,8 +24,8 @@ var LexicalContentEditable = require('@lexical/react/LexicalContentEditable');
24
24
  var LexicalRichTextPlugin = require('@lexical/react/LexicalRichTextPlugin');
25
25
  var LexicalErrorBoundary = _interopDefault(require('@lexical/react/LexicalErrorBoundary'));
26
26
  var LexicalOnChangePlugin = require('@lexical/react/LexicalOnChangePlugin');
27
- var ReactDOM = require('react-dom');
28
27
  var LexicalTypeaheadMenuPlugin = require('@lexical/react/LexicalTypeaheadMenuPlugin');
28
+ var reactDom = require('react-dom');
29
29
  var offset = require('@lexical/offset');
30
30
  var MicRecorder = _interopDefault(require('mic-recorder-to-mp3'));
31
31
  var LexicalHistoryPlugin = require('@lexical/react/LexicalHistoryPlugin');
@@ -12581,14 +12581,12 @@ var ThemeReducer = (function (state, _ref) {
12581
12581
  switch (type) {
12582
12582
  case SET_THEME:
12583
12583
  {
12584
- console.log('SET_THEME', payload);
12585
12584
  var theme = payload.theme;
12586
12585
  newState.theme = theme;
12587
12586
  return newState;
12588
12587
  }
12589
12588
  case SET_THEME_NEW:
12590
12589
  {
12591
- console.log('SET_THEME_NEW', payload);
12592
12590
  var _theme = payload.theme;
12593
12591
  newState.newTheme = _theme;
12594
12592
  return newState;
@@ -14523,12 +14521,18 @@ var MessageTextFormat = function MessageTextFormat(_ref2) {
14523
14521
  }
14524
14522
  } else {
14525
14523
  nextPartIndex = attributeOffset + attribute.length;
14526
- messageText.push(firstPart, asSampleText ? "" + text.slice(attributeOffset, attributeOffset + attribute.length) : (/*#__PURE__*/React__default.createElement(StyledText, {
14524
+ var _textPart = "" + text.slice(attributeOffset, attributeOffset + attribute.length);
14525
+ var match = linkify.match(_textPart);
14526
+ var newTextPart = _textPart;
14527
+ if (!isLastMessage && !asSampleText && match) {
14528
+ newTextPart = linkifyTextPart(_textPart, match, target, isInviteLink, onInviteLinkClick);
14529
+ }
14530
+ messageText.push(firstPart, asSampleText ? newTextPart : (/*#__PURE__*/React__default.createElement(StyledText, {
14527
14531
  isLastMessage: isLastMessage,
14528
14532
  className: attribute.type,
14529
14533
  key: attributeOffset + "-" + attribute.type,
14530
14534
  color: isLastMessage ? textSecondary : accentColor
14531
- }, "" + text.slice(attributeOffset, attributeOffset + attribute.length))), index === combinedAttributesList.length - 1 ? secondPart : '');
14535
+ }, newTextPart)), index === combinedAttributesList.length - 1 ? secondPart : '');
14532
14536
  }
14533
14537
  } catch (e) {
14534
14538
  log.error('Error on format message text, message: ', message, 'error: ', e);
@@ -34071,9 +34075,8 @@ var AudioVisualization = function AudioVisualization(_ref) {
34071
34075
  var normalizedBars = React.useMemo(function () {
34072
34076
  if (!tmb || tmb.length === 0) return [];
34073
34077
  var maxVal = Math.max.apply(Math, tmb);
34074
- if (maxVal === 0) return [];
34075
34078
  return tmb.map(function (value) {
34076
- var normalized = value / maxVal * height;
34079
+ var normalized = maxVal > 0 ? value / maxVal * height : 0;
34077
34080
  return Math.max(2, normalized);
34078
34081
  });
34079
34082
  }, [tmb, height]);
@@ -34098,7 +34101,7 @@ var AudioVisualization = function AudioVisualization(_ref) {
34098
34101
  });
34099
34102
  }));
34100
34103
  };
34101
- var Container$e = styled__default.div(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: ", "px;\n width: 100%;\n gap: 2px;\n"])), function (props) {
34104
+ var Container$e = styled__default.div(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: ", "px;\n width: 100%;\n gap: 2px;\n justify-content: space-between;\n margin-right: 4px;\n"])), function (props) {
34102
34105
  return props.height;
34103
34106
  });
34104
34107
  var Bar = styled__default.div(_templateObject2$q || (_templateObject2$q = _taggedTemplateLiteralLoose(["\n position: relative;\n width: ", "px;\n height: ", "px;\n border-radius: ", "px;\n min-height: 2px;\n overflow: hidden;\n background-color: ", ";\n opacity: ", ";\n\n &::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: ", "%;\n height: 100%;\n background-color: ", ";\n border-radius: inherit;\n will-change: width;\n transform: translateZ(0);\n }\n"])), function (props) {
@@ -34629,7 +34632,112 @@ var DisappearingMessagesBadge$1 = styled__default(SvgBadge)(_templateObject8$b |
34629
34632
  return props.color;
34630
34633
  });
34631
34634
 
34632
- var _templateObject$w, _templateObject2$s, _templateObject3$m, _templateObject4$i, _templateObject5$f, _templateObject6$d;
34635
+ var _templateObject$w, _templateObject2$s, _templateObject3$m, _templateObject4$i;
34636
+ var MessageStatusAndTime = function MessageStatusAndTime(_ref) {
34637
+ var message = _ref.message,
34638
+ _ref$messageStatusDis = _ref.messageStatusDisplayingType,
34639
+ messageStatusDisplayingType = _ref$messageStatusDis === void 0 ? 'ticks' : _ref$messageStatusDis,
34640
+ showMessageTimeAndStatusOnlyOnHover = _ref.showMessageTimeAndStatusOnlyOnHover,
34641
+ messageStatusSize = _ref.messageStatusSize,
34642
+ messageStatusColor = _ref.messageStatusColor,
34643
+ messageReadStatusColor = _ref.messageReadStatusColor,
34644
+ messageStateFontSize = _ref.messageStateFontSize,
34645
+ messageStateColor = _ref.messageStateColor,
34646
+ messageTimeFontSize = _ref.messageTimeFontSize,
34647
+ messageTimeColor = _ref.messageTimeColor,
34648
+ messageStatusAndTimeLineHeight = _ref.messageStatusAndTimeLineHeight,
34649
+ messageTimeVisible = _ref.messageTimeVisible,
34650
+ messageStatusVisible = _ref.messageStatusVisible,
34651
+ withAttachment = _ref.withAttachment,
34652
+ fileAttachment = _ref.fileAttachment,
34653
+ ownMessageOnRightSide = _ref.ownMessageOnRightSide,
34654
+ leftMargin = _ref.leftMargin,
34655
+ bottomOfMessage = _ref.bottomOfMessage,
34656
+ marginBottom = _ref.marginBottom,
34657
+ messageTimeColorOnAttachment = _ref.messageTimeColorOnAttachment;
34658
+ var _useColor = useColors(),
34659
+ accentColor = _useColor[THEME_COLORS.ACCENT],
34660
+ textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
34661
+ iconPrimary = _useColor[THEME_COLORS.ICON_PRIMARY],
34662
+ textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
34663
+ overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2];
34664
+ return /*#__PURE__*/React__default.createElement(MessageStatusAndTimeContainer, {
34665
+ lineHeight: messageStatusAndTimeLineHeight,
34666
+ showOnlyOnHover: showMessageTimeAndStatusOnlyOnHover,
34667
+ leftMargin: leftMargin,
34668
+ isSelfMessage: !message.incoming,
34669
+ withAttachment: withAttachment,
34670
+ rtlDirection: ownMessageOnRightSide && !message.incoming,
34671
+ fileAttachment: fileAttachment,
34672
+ bottomOfMessage: bottomOfMessage,
34673
+ marginBottom: marginBottom,
34674
+ className: 'message_status_time',
34675
+ messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary,
34676
+ messageTimeBackgroundColor: overlayBackground2
34677
+ }, message.state === MESSAGE_STATUS.EDIT ? (/*#__PURE__*/React__default.createElement(MessageStatusUpdated, {
34678
+ color: messageStateColor || textSecondary,
34679
+ fontSize: messageStateFontSize
34680
+ }, "edited")) : '', messageTimeVisible && (/*#__PURE__*/React__default.createElement(HiddenMessageTime, {
34681
+ color: messageTimeColor || textSecondary,
34682
+ fontSize: messageTimeFontSize
34683
+ }, "" + moment(message.createdAt).format('HH:mm'))), messageStatusVisible && (/*#__PURE__*/React__default.createElement(MessageStatus, {
34684
+ height: messageStatusAndTimeLineHeight
34685
+ }, MessageStatusIcon({
34686
+ messageStatus: message.deliveryStatus,
34687
+ messageStatusDisplayingType: messageStatusDisplayingType,
34688
+ size: messageStatusSize,
34689
+ color: messageStatusColor || iconPrimary,
34690
+ readIconColor: messageReadStatusColor,
34691
+ accentColor: accentColor
34692
+ }))));
34693
+ };
34694
+ var MessageStatusAndTime$1 = /*#__PURE__*/React__default.memo(MessageStatusAndTime, function (prevProps, nextProps) {
34695
+ return prevProps.message.state === nextProps.message.state && prevProps.message.deliveryStatus === nextProps.message.deliveryStatus && prevProps.message.createdAt === nextProps.message.createdAt && prevProps.showMessageTimeAndStatusOnlyOnHover === nextProps.showMessageTimeAndStatusOnlyOnHover && prevProps.messageStatusSize === nextProps.messageStatusSize && prevProps.messageStatusColor === nextProps.messageStatusColor && prevProps.messageReadStatusColor === nextProps.messageReadStatusColor && prevProps.messageStateFontSize === nextProps.messageStateFontSize && prevProps.messageStateColor === nextProps.messageStateColor && prevProps.messageTimeFontSize === nextProps.messageTimeFontSize && prevProps.messageStatusAndTimeLineHeight === nextProps.messageStatusAndTimeLineHeight && prevProps.messageTimeColor === nextProps.messageTimeColor && prevProps.messageTimeVisible === nextProps.messageTimeVisible && prevProps.messageStatusVisible === nextProps.messageStatusVisible && prevProps.ownMessageOnRightSide === nextProps.ownMessageOnRightSide && prevProps.bottomOfMessage === nextProps.bottomOfMessage && prevProps.marginBottom === nextProps.marginBottom && prevProps.messageTimeColorOnAttachment === nextProps.messageTimeColorOnAttachment && prevProps.withAttachment === nextProps.withAttachment;
34696
+ });
34697
+ var MessageStatus = styled__default.span(_templateObject$w || (_templateObject$w = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n margin-left: 4px;\n text-align: right;\n height: ", ";\n\n & > svg {\n height: 16px;\n width: 16px;\n }\n"])), function (props) {
34698
+ return props.height || '14px';
34699
+ });
34700
+ var HiddenMessageTime = styled__default.span(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteralLoose(["\n display: ", ";\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
34701
+ return props.hide && 'none';
34702
+ }, function (props) {
34703
+ return props.fontSize || '12px';
34704
+ }, function (props) {
34705
+ return props.color;
34706
+ });
34707
+ var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteralLoose(["\n visibility: ", ";\n display: ", ";\n align-items: flex-end;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n float: right;\n line-height: ", ";\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: ", ";\n direction: ", ";\n transform: translate(0px, 4px);\n white-space: nowrap;\n width: ", ";\n justify-content: ", ";\n z-index: 10;\n\n & > svg {\n margin-left: 4px;\n height: 14px;\n width: 16px;\n }\n\n & > ", " {\n color: ", ";\n }\n\n ", "\n"])), function (props) {
34708
+ return props.showOnlyOnHover && 'hidden';
34709
+ }, function (props) {
34710
+ return props.hide ? 'none' : 'flex';
34711
+ }, function (props) {
34712
+ return props.withAttachment && '4px 6px';
34713
+ }, function (props) {
34714
+ return props.withAttachment && !props.fileAttachment && props.messageTimeBackgroundColor + "66";
34715
+ }, function (props) {
34716
+ return props.lineHeight || '14px';
34717
+ }, function (props) {
34718
+ return props.rtlDirection && 'auto';
34719
+ }, function (props) {
34720
+ return props.leftMargin && '12px';
34721
+ }, function (props) {
34722
+ return props.marginBottom && '8px';
34723
+ }, function (props) {
34724
+ return props.isSelfMessage ? 'initial' : '';
34725
+ }, function (props) {
34726
+ return props.bottomOfMessage && '100%';
34727
+ }, function (props) {
34728
+ return props.bottomOfMessage && props.rtlDirection && 'flex-end';
34729
+ }, HiddenMessageTime, function (props) {
34730
+ return props.withAttachment && !props.fileAttachment ? props.messageTimeColorOnAttachment : '';
34731
+ }, function (props) {
34732
+ return props.withAttachment && "\n position: absolute;\n z-index: 10;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
34733
+ });
34734
+ var MessageStatusUpdated = styled__default.span(_templateObject4$i || (_templateObject4$i = _taggedTemplateLiteralLoose(["\n margin-right: 4px;\n font-style: italic;\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
34735
+ return props.fontSize || '12px';
34736
+ }, function (props) {
34737
+ return props.color;
34738
+ });
34739
+
34740
+ var _templateObject$x, _templateObject2$t, _templateObject3$n, _templateObject4$j, _templateObject5$f, _templateObject6$d, _templateObject7$c;
34633
34741
  var ViewOnceVoiceModal = function ViewOnceVoiceModal(_ref) {
34634
34742
  var url = _ref.url,
34635
34743
  file = _ref.file,
@@ -34645,6 +34753,7 @@ var ViewOnceVoiceModal = function ViewOnceVoiceModal(_ref) {
34645
34753
  overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2],
34646
34754
  textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
34647
34755
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY];
34756
+ var messages = useSelector(activeChannelMessagesSelector, reactRedux.shallowEqual) || [];
34648
34757
  var dispatch = useDispatch();
34649
34758
  React.useEffect(function () {
34650
34759
  if (isOpen && incoming) {
@@ -34661,6 +34770,11 @@ var ViewOnceVoiceModal = function ViewOnceVoiceModal(_ref) {
34661
34770
  }, [isDirectChannel, activeChannel === null || activeChannel === void 0 ? void 0 : activeChannel.members]);
34662
34771
  var contactsMap = useSelector(contactsMapSelector);
34663
34772
  var getFromContacts = getShowOnlyContactUsers();
34773
+ var message = React.useMemo(function () {
34774
+ return messages.find(function (message) {
34775
+ return message.id === file.messageId;
34776
+ });
34777
+ }, [file]);
34664
34778
  if (!isOpen) return null;
34665
34779
  return /*#__PURE__*/React__default.createElement(PopupContainer, {
34666
34780
  bgColor: 'transparent'
@@ -34685,20 +34799,28 @@ var ViewOnceVoiceModal = function ViewOnceVoiceModal(_ref) {
34685
34799
  bgColor: backgroundFocused,
34686
34800
  borderRadius: '16px 16px 0 16px',
34687
34801
  onClose: onClose
34688
- }))));
34802
+ }), /*#__PURE__*/React__default.createElement(MessageStatusAndTimeContainer$1, null, /*#__PURE__*/React__default.createElement(MessageStatusAndTime$1, {
34803
+ message: message,
34804
+ messageStatusDisplayingType: 'ticks',
34805
+ messageStatusVisible: true,
34806
+ leftMargin: true,
34807
+ messageTimeColorOnAttachment: textSecondary,
34808
+ messageTimeVisible: true
34809
+ })))));
34689
34810
  };
34690
- var ModalContainer = styled__default.div(_templateObject$w || (_templateObject$w = _taggedTemplateLiteralLoose(["\n position: relative;\n border-radius: 16px;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n backdrop-filter: blur(14px);\n"])));
34691
- var CloseButton = styled__default.div(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 13px;\n right: 18px;\n cursor: pointer;\n padding: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n transition: background-color 0.2s;\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.05);\n }\n\n > svg {\n width: 28px;\n height: 28px;\n color: ", ";\n }\n"])), function (props) {
34811
+ var ModalContainer = styled__default.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteralLoose(["\n position: relative;\n border-radius: 16px;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n backdrop-filter: blur(14px);\n"])));
34812
+ var CloseButton = styled__default.div(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 13px;\n right: 18px;\n cursor: pointer;\n padding: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n transition: background-color 0.2s;\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.05);\n }\n\n > svg {\n width: 28px;\n height: 28px;\n color: ", ";\n }\n"])), function (props) {
34692
34813
  return props.iconColor;
34693
34814
  });
34694
- var AudioPlayerWrapper = styled__default.div(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
34695
- var Header = styled__default.div(_templateObject4$i || (_templateObject4$i = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding: 16px 24px;\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n"])), function (props) {
34815
+ var AudioPlayerWrapper = styled__default.div(_templateObject3$n || (_templateObject3$n = _taggedTemplateLiteralLoose(["\n width: max-content;\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
34816
+ var MessageStatusAndTimeContainer$1 = styled__default.div(_templateObject4$j || (_templateObject4$j = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 10px;\n right: 10px;\n"])));
34817
+ var Header = styled__default.div(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding: 16px 24px;\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n"])), function (props) {
34696
34818
  return props.backgroundColor;
34697
34819
  });
34698
- var HeaderTitle = styled__default.div(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteralLoose(["\n font-weight: 500;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n color: ", ";\n"])), function (props) {
34820
+ var HeaderTitle = styled__default.div(_templateObject6$d || (_templateObject6$d = _taggedTemplateLiteralLoose(["\n font-weight: 500;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n color: ", ";\n"])), function (props) {
34699
34821
  return props.color;
34700
34822
  });
34701
- var HeaderDescription = styled__default.div(_templateObject6$d || (_templateObject6$d = _taggedTemplateLiteralLoose(["\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n letter-spacing: -0.08px;\n color: ", ";\n"])), function (props) {
34823
+ var HeaderDescription = styled__default.div(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteralLoose(["\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n letter-spacing: -0.08px;\n color: ", ";\n"])), function (props) {
34702
34824
  return props.color;
34703
34825
  });
34704
34826
 
@@ -34730,7 +34852,7 @@ function SvgPlayVideo(props) {
34730
34852
  })));
34731
34853
  }
34732
34854
 
34733
- var _templateObject$x, _templateObject2$t, _templateObject3$n, _templateObject4$j, _templateObject5$g, _templateObject6$e, _templateObject7$c;
34855
+ var _templateObject$y, _templateObject2$u, _templateObject3$o, _templateObject4$k, _templateObject5$g, _templateObject6$e, _templateObject7$d;
34734
34856
  var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
34735
34857
  var width = _ref.width,
34736
34858
  height = _ref.height,
@@ -34852,8 +34974,8 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
34852
34974
  messageTimeBackgroundColor: overlayBackground2
34853
34975
  }, !isRepliedMessage && !isPreview && /*#__PURE__*/React__default.createElement(SvgVideoCall, null), videoCurrentTime))));
34854
34976
  });
34855
- var VideoControls = styled__default.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
34856
- var VideoTime = styled__default.div(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: ", ";\n bottom: ", ";\n left: ", ";\n font-size: ", ";\n display: flex;\n align-items: center;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n line-height: 14px;\n color: ", ";\n z-index: 10;\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
34977
+ var VideoControls = styled__default.div(_templateObject$y || (_templateObject$y = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
34978
+ var VideoTime = styled__default.div(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: ", ";\n bottom: ", ";\n left: ", ";\n font-size: ", ";\n display: flex;\n align-items: center;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n line-height: 14px;\n color: ", ";\n z-index: 10;\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
34857
34979
  return props.isRepliedMessage ? '3px' : props.isDetailsView ? undefined : '8px';
34858
34980
  }, function (props) {
34859
34981
  return props.isDetailsView ? '8px' : undefined;
@@ -34870,10 +34992,10 @@ var VideoTime = styled__default.div(_templateObject2$t || (_templateObject2$t =
34870
34992
  }, function (props) {
34871
34993
  return props.color;
34872
34994
  });
34873
- var VideoPlayButton = styled__default.div(_templateObject3$n || (_templateObject3$n = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n visibility: ", ";\n"])), function (props) {
34995
+ var VideoPlayButton = styled__default.div(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n visibility: ", ";\n"])), function (props) {
34874
34996
  return props.showOnHover && 'hidden';
34875
34997
  });
34876
- var Component$1 = styled__default.div(_templateObject4$j || (_templateObject4$j = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n max-width: 100%;\n max-height: 100%;\n width: ", ";\n height: ", ";\n min-height: ", ";\n\n ", ";\n /*width: 100vw;\n background-color: transparent;\n margin-top: -50vw;\n padding: 0 40px;\n z-index: 20;*/\n\n & > video {\n max-width: 100%;\n max-height: 100%;\n width: ", ";\n height: ", ";\n min-height: ", ";\n border: ", ";\n object-fit: cover;\n box-sizing: border-box;\n border-radius: ", ";\n }\n\n &:hover {\n & ", " {\n visibility: visible;\n }\n }\n"])), function (props) {
34998
+ var Component$1 = styled__default.div(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n max-width: 100%;\n max-height: 100%;\n width: ", ";\n height: ", ";\n min-height: ", ";\n\n ", ";\n /*width: 100vw;\n background-color: transparent;\n margin-top: -50vw;\n padding: 0 40px;\n z-index: 20;*/\n\n & > video {\n max-width: 100%;\n max-height: 100%;\n width: ", ";\n height: ", ";\n min-height: ", ";\n border: ", ";\n object-fit: cover;\n box-sizing: border-box;\n border-radius: ", ";\n }\n\n &:hover {\n & ", " {\n visibility: visible;\n }\n }\n"])), function (props) {
34877
34999
  return props.width;
34878
35000
  }, function (props) {
34879
35001
  return props.height;
@@ -34904,11 +35026,11 @@ var AttachmentFile = styled__default.div(_templateObject6$e || (_templateObject6
34904
35026
  }, function (props) {
34905
35027
  return props.borderRadius || '6px';
34906
35028
  }, DownloadFile, AttachmentIconCont);
34907
- var AttachmentImg = styled__default.img(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-radius: ", ";\n object-fit: cover;\n"])), function (props) {
35029
+ var AttachmentImg = styled__default.img(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-radius: ", ";\n object-fit: cover;\n"])), function (props) {
34908
35030
  return props.borderRadius || '6px';
34909
35031
  });
34910
35032
 
34911
- var _templateObject$y, _templateObject2$u, _templateObject3$o, _templateObject4$k, _templateObject5$h, _templateObject6$f, _templateObject7$d, _templateObject8$c, _templateObject9$a, _templateObject0$9, _templateObject1$6, _templateObject10$3, _templateObject11$3;
35033
+ var _templateObject$z, _templateObject2$v, _templateObject3$p, _templateObject4$l, _templateObject5$h, _templateObject6$f, _templateObject7$e, _templateObject8$c, _templateObject9$a, _templateObject0$9, _templateObject1$6, _templateObject10$3, _templateObject11$3;
34912
35034
  var Attachment = function Attachment(_ref) {
34913
35035
  var attachment = _ref.attachment,
34914
35036
  _ref$isPreview = _ref.isPreview,
@@ -35575,8 +35697,8 @@ var Attachment = function Attachment(_ref) {
35575
35697
  var Attachment$1 = /*#__PURE__*/React__default.memo(Attachment, function (prevProps, nextProps) {
35576
35698
  return prevProps.attachment.url === nextProps.attachment.url && prevProps.handleMediaItemClick === nextProps.handleMediaItemClick && prevProps.attachment.attachmentUrl === nextProps.attachment.attachmentUrl;
35577
35699
  });
35578
- var DownloadImage = styled__default.div(_templateObject$y || (_templateObject$y = _taggedTemplateLiteralLoose(["\n position: absolute;\n visibility: hidden;\n opacity: 0;\n width: 28px;\n height: 28px;\n top: 12px;\n right: 17px;\n border-radius: 50%;\n line-height: 35px;\n text-align: center;\n cursor: pointer;\n background: #ffffff;\n box-shadow: 0 4px 4px rgba(6, 10, 38, 0.2);\n transition: all 0.1s;\n\n & > svg {\n width: 16px;\n }\n"])));
35579
- var AttachmentImgCont = styled__default.div(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n margin-right: ", ";\n min-width: ", ";\n height: ", ";\n width: ", ";\n max-width: 100%;\n\n ", "\n max-height: 400px;\n min-height: ", ";\n cursor: pointer;\n\n ", "\n\n &:hover ", " {\n visibility: visible;\n opacity: 1;\n }\n\n ", "\n"])), function (props) {
35700
+ var DownloadImage = styled__default.div(_templateObject$z || (_templateObject$z = _taggedTemplateLiteralLoose(["\n position: absolute;\n visibility: hidden;\n opacity: 0;\n width: 28px;\n height: 28px;\n top: 12px;\n right: 17px;\n border-radius: 50%;\n line-height: 35px;\n text-align: center;\n cursor: pointer;\n background: #ffffff;\n box-shadow: 0 4px 4px rgba(6, 10, 38, 0.2);\n transition: all 0.1s;\n\n & > svg {\n width: 16px;\n }\n"])));
35701
+ var AttachmentImgCont = styled__default.div(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n margin-right: ", ";\n min-width: ", ";\n height: ", ";\n width: ", ";\n max-width: 100%;\n\n ", "\n max-height: 400px;\n min-height: ", ";\n cursor: pointer;\n\n ", "\n\n &:hover ", " {\n visibility: visible;\n opacity: 1;\n }\n\n ", "\n"])), function (props) {
35580
35702
  return props.isPreview ? '16px' : props.isRepliedMessage ? '8px' : '';
35581
35703
  }, function (props) {
35582
35704
  return !props.isRepliedMessage && !props.fitTheContainer && '165px';
@@ -35593,8 +35715,8 @@ var AttachmentImgCont = styled__default.div(_templateObject2$u || (_templateObje
35593
35715
  }, DownloadImage, function (props) {
35594
35716
  return props.isPreview && "\n width: 48px;\n min-width: 48px;\n height: 48px;\n ";
35595
35717
  });
35596
- var FileThumbnail = styled__default.img(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n min-width: 40px;\n max-width: 40px;\n height: 40px;\n object-fit: cover;\n border-radius: 8px;\n"])));
35597
- var DownloadFile$1 = styled__default.span(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteralLoose(["\n display: none;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n background-color: ", ";\n min-width: 40px;\n max-width: 40px;\n height: 40px;\n position: ", ";\n border-radius: ", ";\n\n & > svg {\n width: 20px;\n height: 20px;\n }\n"])), function (props) {
35718
+ var FileThumbnail = styled__default.img(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteralLoose(["\n min-width: 40px;\n max-width: 40px;\n height: 40px;\n object-fit: cover;\n border-radius: 8px;\n"])));
35719
+ var DownloadFile$1 = styled__default.span(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteralLoose(["\n display: none;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n background-color: ", ";\n min-width: 40px;\n max-width: 40px;\n height: 40px;\n position: ", ";\n border-radius: ", ";\n\n & > svg {\n width: 20px;\n height: 20px;\n }\n"])), function (props) {
35598
35720
  return props.backgroundColor;
35599
35721
  }, function (props) {
35600
35722
  return props.widthThumb && 'absolute';
@@ -35605,7 +35727,7 @@ var ProgressWrapper$1 = styled__default.span(_templateObject5$h || (_templateObj
35605
35727
  var SizeProgress = styled__default.span(_templateObject6$f || (_templateObject6$f = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: -26px;\n background-color: rgba(0, 0, 0, 0.4);\n color: ", ";\n font-size: 12px;\n border-radius: 12px;\n padding: 3px 6px;\n white-space: nowrap;\n"])), function (props) {
35606
35728
  return props.color;
35607
35729
  });
35608
- var AttachmentFile$1 = styled__default.div(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n align-items: center;\n padding: ", ";\n //width: ", ";\n min-width: ", ";\n transition: all 0.1s;\n //height: 70px;\n background: ", ";\n border: ", ";\n box-sizing: border-box;\n margin-right: ", ";\n border-radius: ", ";\n\n ", "\n\n & > ", " svg {\n width: 40px;\n height: 40px;\n }\n"])), function (props) {
35730
+ var AttachmentFile$1 = styled__default.div(_templateObject7$e || (_templateObject7$e = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n align-items: center;\n padding: ", ";\n //width: ", ";\n min-width: ", ";\n transition: all 0.1s;\n //height: 70px;\n background: ", ";\n border: ", ";\n box-sizing: border-box;\n margin-right: ", ";\n border-radius: ", ";\n\n ", "\n\n & > ", " svg {\n width: 40px;\n height: 40px;\n }\n"])), function (props) {
35609
35731
  return !props.isRepliedMessage && '8px 12px;';
35610
35732
  }, function (props) {
35611
35733
  return !props.isRepliedMessage && (props.width ? props.width + "px" : '350px');
@@ -35663,7 +35785,7 @@ var VideoCont = styled__default.div(_templateObject11$3 || (_templateObject11$3
35663
35785
  return props.isDetailsView && '100%';
35664
35786
  });
35665
35787
 
35666
- var _templateObject$z, _templateObject2$v, _templateObject3$p, _templateObject4$l;
35788
+ var _templateObject$A, _templateObject2$w, _templateObject3$q, _templateObject4$m;
35667
35789
  var RepliedMessage = function RepliedMessage(_ref) {
35668
35790
  var _message$parentMessag;
35669
35791
  var message = _ref.message,
@@ -35770,7 +35892,7 @@ var RepliedMessage = function RepliedMessage(_ref) {
35770
35892
  var RepliedMessage$1 = /*#__PURE__*/React__default.memo(RepliedMessage, function (prevProps, nextProps) {
35771
35893
  return prevProps.message.deliveryStatus === nextProps.message.deliveryStatus && prevProps.message.state === nextProps.message.state && prevProps.message.userReactions === nextProps.message.userReactions && prevProps.message.body === nextProps.message.body && prevProps.message.reactionTotals === nextProps.message.reactionTotals && prevProps.message.attachments === nextProps.message.attachments && prevProps.message.userMarkers === nextProps.message.userMarkers && prevProps.selectedMessagesMap === nextProps.selectedMessagesMap && prevProps.selectionIsActive === nextProps.selectionIsActive && prevProps.contactsMap === nextProps.contactsMap;
35772
35894
  });
35773
- var ReplyMessageContainer = styled__default.div(_templateObject$z || (_templateObject$z = _taggedTemplateLiteralLoose(["\n display: flex;\n border-left: 2px solid ", ";\n padding: 4px 6px;\n position: relative;\n //margin: ", ";\n margin: ", ";\n background-color: ", ";\n border-radius: 0 4px 4px 0;\n margin-top: ", ";\n cursor: pointer;\n"])), function (props) {
35895
+ var ReplyMessageContainer = styled__default.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n display: flex;\n border-left: 2px solid ", ";\n padding: 4px 6px;\n position: relative;\n //margin: ", ";\n margin: ", ";\n background-color: ", ";\n border-radius: 0 4px 4px 0;\n margin-top: ", ";\n cursor: pointer;\n"])), function (props) {
35774
35896
  return props.leftBorderColor || '#b8b9c2';
35775
35897
  }, function (props) {
35776
35898
  return props.withAttachments ? '8px 8px' : '0 0 8px';
@@ -35781,21 +35903,21 @@ var ReplyMessageContainer = styled__default.div(_templateObject$z || (_templateO
35781
35903
  }, function (props) {
35782
35904
  return !props.withSenderName && props.withAttachments && '8px';
35783
35905
  });
35784
- var ReplyMessageBody = styled__default.div(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteralLoose(["\n margin-top: auto;\n margin-bottom: auto;\n direction: ", ";\n max-width: ", ";\n"])), function (props) {
35906
+ var ReplyMessageBody = styled__default.div(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteralLoose(["\n margin-top: auto;\n margin-bottom: auto;\n direction: ", ";\n max-width: ", ";\n"])), function (props) {
35785
35907
  return props.rtlDirection ? 'initial' : '';
35786
35908
  }, function (props) {
35787
35909
  return props.maxWidth || '100%';
35788
35910
  });
35789
- var MessageStatusDeleted = styled__default.span(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: ", ";\n font-style: italic;\n"])), function (props) {
35911
+ var MessageStatusDeleted = styled__default.span(_templateObject3$q || (_templateObject3$q = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: ", ";\n font-style: italic;\n"])), function (props) {
35790
35912
  return props.color;
35791
35913
  }, function (props) {
35792
35914
  return props.fontSize;
35793
35915
  });
35794
- var VoiceIconWrapper = styled__default(SvgVoiceIcon)(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteralLoose(["\n transform: translate(0px, 3.5px);\n color: ", ";\n"])), function (props) {
35916
+ var VoiceIconWrapper = styled__default(SvgVoiceIcon)(_templateObject4$m || (_templateObject4$m = _taggedTemplateLiteralLoose(["\n transform: translate(0px, 3.5px);\n color: ", ";\n"])), function (props) {
35795
35917
  return props.color;
35796
35918
  });
35797
35919
 
35798
- var _templateObject$A;
35920
+ var _templateObject$B;
35799
35921
  var MessageHeader = function MessageHeader(_ref) {
35800
35922
  var message = _ref.message,
35801
35923
  ownMessageOnRightSide = _ref.ownMessageOnRightSide,
@@ -35832,7 +35954,7 @@ var MessageHeader = function MessageHeader(_ref) {
35832
35954
  var MessageHeader$1 = /*#__PURE__*/React__default.memo(MessageHeader, function (prevProps, nextProps) {
35833
35955
  return prevProps.message.body === nextProps.message.body && prevProps.message.attachments === nextProps.message.attachments && prevProps.contactsMap === nextProps.contactsMap && prevProps.ownMessageOnRightSide === nextProps.ownMessageOnRightSide && prevProps.outgoingMessageStyles === nextProps.outgoingMessageStyles && prevProps.incomingMessageStyles === nextProps.incomingMessageStyles && prevProps.showMessageSenderName === nextProps.showMessageSenderName && prevProps.getFromContacts === nextProps.getFromContacts;
35834
35956
  });
35835
- var MessageHeaderCont = styled__default.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: ", ";\n"])), function (props) {
35957
+ var MessageHeaderCont = styled__default.div(_templateObject$B || (_templateObject$B = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: ", ";\n"])), function (props) {
35836
35958
  return props.withPadding && (props.isForwarded ? '8px 0 2px 12px' : !props.isReplied && !props.messageBody ? props.withMediaAttachment ? '8px 0 8px 12px' : '8px 0 0 12px' : '8px 0 0 12px');
35837
35959
  });
35838
35960
 
@@ -36275,7 +36397,7 @@ var EMOJIS = [{
36275
36397
  }]
36276
36398
  }];
36277
36399
 
36278
- var _templateObject$B, _templateObject2$w, _templateObject3$q, _templateObject4$m, _templateObject5$i, _templateObject6$g, _templateObject7$e, _templateObject8$d;
36400
+ var _templateObject$C, _templateObject2$x, _templateObject3$r, _templateObject4$n, _templateObject5$i, _templateObject6$g, _templateObject7$f, _templateObject8$d;
36279
36401
  var EmojiIcon = function EmojiIcon(_ref) {
36280
36402
  var collectionName = _ref.collectionName;
36281
36403
  switch (collectionName) {
@@ -36450,7 +36572,7 @@ function EmojisPopup(_ref2) {
36450
36572
  }));
36451
36573
  }))));
36452
36574
  }
36453
- var Container$g = styled__default.div(_templateObject$B || (_templateObject$B = _taggedTemplateLiteralLoose(["\n position: ", ";\n left: ", ";\n right: ", ";\n direction: ", ";\n bottom: ", ";\n width: 306px;\n border: ", ";\n box-sizing: border-box;\n box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);\n border-radius: ", ";\n background: ", ";\n z-index: 35;\n //transform: scaleY(0);\n height: 0;\n overflow: hidden;\n transform-origin: ", ";\n transition: all 0.2s ease-in-out;\n ", ";\n"])), function (props) {
36575
+ var Container$g = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n position: ", ";\n left: ", ";\n right: ", ";\n direction: ", ";\n bottom: ", ";\n width: 306px;\n border: ", ";\n box-sizing: border-box;\n box-shadow: 0 0 12px rgba(0, 0, 0, 0.08);\n border-radius: ", ";\n background: ", ";\n z-index: 35;\n //transform: scaleY(0);\n height: 0;\n overflow: hidden;\n transform-origin: ", ";\n transition: all 0.2s ease-in-out;\n ", ";\n"])), function (props) {
36454
36576
  return props.relativePosition ? 'relative' : 'absolute';
36455
36577
  }, function (props) {
36456
36578
  return props.rtlDirection ? '' : props.rightSide ? '' : '5px';
@@ -36471,18 +36593,18 @@ var Container$g = styled__default.div(_templateObject$B || (_templateObject$B =
36471
36593
  }, function (props) {
36472
36594
  return props.rendered && "\n height: 225px;\n ";
36473
36595
  });
36474
- var EmojiHeader = styled__default.div(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteralLoose(["\n align-items: flex-end;\n font-style: normal;\n font-weight: 500;\n font-size: 12px;\n line-height: 22px;\n text-transform: uppercase;\n color: ", ";\n display: flex;\n padding: ", ";\n"])), function (props) {
36596
+ var EmojiHeader = styled__default.div(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteralLoose(["\n align-items: flex-end;\n font-style: normal;\n font-weight: 500;\n font-size: 12px;\n line-height: 22px;\n text-transform: uppercase;\n color: ", ";\n display: flex;\n padding: ", ";\n"])), function (props) {
36475
36597
  return props.color;
36476
36598
  }, function (props) {
36477
36599
  return props.padding || '6px 18px';
36478
36600
  });
36479
- var EmojiSection = styled__default.div(_templateObject3$q || (_templateObject3$q = _taggedTemplateLiteralLoose(["\n height: 180px;\n overflow-x: hidden;\n\n & ::selection {\n color: inherit;\n background: inherit;\n }\n"])));
36480
- var EmojiCollection = styled__default.span(_templateObject4$m || (_templateObject4$m = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: flex;\n justify-content: center;\n align-items: center;\n\n & > * {\n color: ", ";\n }\n"])), function (props) {
36601
+ var EmojiSection = styled__default.div(_templateObject3$r || (_templateObject3$r = _taggedTemplateLiteralLoose(["\n height: 180px;\n overflow-x: hidden;\n\n & ::selection {\n color: inherit;\n background: inherit;\n }\n"])));
36602
+ var EmojiCollection = styled__default.span(_templateObject4$n || (_templateObject4$n = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: flex;\n justify-content: center;\n align-items: center;\n\n & > * {\n color: ", ";\n }\n"])), function (props) {
36481
36603
  return props.iconColor;
36482
36604
  });
36483
36605
  var CollectionPointer = styled__default.span(_templateObject5$i || (_templateObject5$i = _taggedTemplateLiteralLoose([""])));
36484
36606
  var AllEmojis = styled__default.ul(_templateObject6$g || (_templateObject6$g = _taggedTemplateLiteralLoose(["\n overflow: hidden;\n padding: 0 8px 8px;\n margin: 0;\n"])));
36485
- var EmojiFooter = styled__default.div(_templateObject7$e || (_templateObject7$e = _taggedTemplateLiteralLoose(["\n height: 42px;\n display: flex;\n justify-content: space-around;\n align-items: center;\n border-top: ", ";\n border-bottom: ", ";\n padding: 0 10px;\n & > span {\n width: 100%;\n text-align: center;\n }\n"])), function (props) {
36607
+ var EmojiFooter = styled__default.div(_templateObject7$f || (_templateObject7$f = _taggedTemplateLiteralLoose(["\n height: 42px;\n display: flex;\n justify-content: space-around;\n align-items: center;\n border-top: ", ";\n border-bottom: ", ";\n padding: 0 10px;\n & > span {\n width: 100%;\n text-align: center;\n }\n"])), function (props) {
36486
36608
  return props.emojisCategoryIconsPosition !== 'top' && "1px solid " + props.borderColor;
36487
36609
  }, function (props) {
36488
36610
  return props.emojisCategoryIconsPosition === 'top' && "1px solid " + props.borderColor;
@@ -36514,7 +36636,7 @@ function SvgPlus(props) {
36514
36636
  })));
36515
36637
  }
36516
36638
 
36517
- var _templateObject$C, _templateObject2$x, _templateObject3$r;
36639
+ var _templateObject$D, _templateObject2$y, _templateObject3$s;
36518
36640
  function FrequentlyEmojis(_ref) {
36519
36641
  var handleAddEmoji = _ref.handleAddEmoji,
36520
36642
  handleEmojiPopupToggle = _ref.handleEmojiPopupToggle,
@@ -36639,19 +36761,19 @@ function FrequentlyEmojis(_ref) {
36639
36761
  iconColor: textSecondary
36640
36762
  }, /*#__PURE__*/React__default.createElement(SvgPlus, null)));
36641
36763
  }
36642
- var Container$h = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n transform: scale(0, 0);\n transform-origin: ", ";\n display: flex;\n align-items: center;\n padding: 6px;\n background-color: ", ";\n box-shadow: 0 3px 10px -4px rgba(0, 0, 0, 0.2);\n border-radius: 24px;\n overflow: hidden;\n box-sizing: border-box;\n transition: all 0.2s ease-in-out;\n ", ";\n"])), function (props) {
36764
+ var Container$h = styled__default.div(_templateObject$D || (_templateObject$D = _taggedTemplateLiteralLoose(["\n transform: scale(0, 0);\n transform-origin: ", ";\n display: flex;\n align-items: center;\n padding: 6px;\n background-color: ", ";\n box-shadow: 0 3px 10px -4px rgba(0, 0, 0, 0.2);\n border-radius: 24px;\n overflow: hidden;\n box-sizing: border-box;\n transition: all 0.2s ease-in-out;\n ", ";\n"])), function (props) {
36643
36765
  return props.rightSide ? '100% 100%' : '0 100%';
36644
36766
  }, function (props) {
36645
36767
  return props.backgroundColor;
36646
36768
  }, function (props) {
36647
36769
  return props.rendered && "\n transform: scale(1, 1);\n ";
36648
36770
  });
36649
- var EmojiItem = styled__default.span(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteralLoose(["\n font-family:\n apple color emoji,\n segoe ui emoji,\n noto color emoji,\n android emoji,\n emojisymbols,\n emojione mozilla,\n twemoji mozilla,\n segoe ui symbol;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 8px;\n font-size: 28px;\n line-height: 32px;\n cursor: pointer;\n border-radius: 50%;\n width: 36px;\n height: 36px;\n background-color: ", ";\n &:hover {\n background-color: ", ";\n }\n"])), function (props) {
36771
+ var EmojiItem = styled__default.span(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteralLoose(["\n font-family:\n apple color emoji,\n segoe ui emoji,\n noto color emoji,\n android emoji,\n emojisymbols,\n emojione mozilla,\n twemoji mozilla,\n segoe ui symbol;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 8px;\n font-size: 28px;\n line-height: 32px;\n cursor: pointer;\n border-radius: 50%;\n width: 36px;\n height: 36px;\n background-color: ", ";\n &:hover {\n background-color: ", ";\n }\n"])), function (props) {
36650
36772
  return props.active && props.activeBackground;
36651
36773
  }, function (props) {
36652
36774
  return props.activeBackground;
36653
36775
  });
36654
- var OpenMoreEmojis = styled__default.span(_templateObject3$r || (_templateObject3$r = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n background-color: ", ";\n cursor: pointer;\n\n & > svg {\n color: ", ";\n height: 18px;\n width: 18px;\n }\n &:hover {\n background-color: ", ";\n & > svg {\n color: ", ";\n }\n }\n border-radius: 50%;\n"])), function (props) {
36776
+ var OpenMoreEmojis = styled__default.span(_templateObject3$s || (_templateObject3$s = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n background-color: ", ";\n cursor: pointer;\n\n & > svg {\n color: ", ";\n height: 18px;\n width: 18px;\n }\n &:hover {\n background-color: ", ";\n & > svg {\n color: ", ";\n }\n }\n border-radius: 50%;\n"])), function (props) {
36655
36777
  return props.iconBackgroundColor;
36656
36778
  }, function (props) {
36657
36779
  return props.iconColor;
@@ -36661,112 +36783,7 @@ var OpenMoreEmojis = styled__default.span(_templateObject3$r || (_templateObject
36661
36783
  return props.iconHoverColor;
36662
36784
  });
36663
36785
 
36664
- var _templateObject$D, _templateObject2$y, _templateObject3$s, _templateObject4$n;
36665
- var MessageStatusAndTime = function MessageStatusAndTime(_ref) {
36666
- var message = _ref.message,
36667
- _ref$messageStatusDis = _ref.messageStatusDisplayingType,
36668
- messageStatusDisplayingType = _ref$messageStatusDis === void 0 ? 'ticks' : _ref$messageStatusDis,
36669
- showMessageTimeAndStatusOnlyOnHover = _ref.showMessageTimeAndStatusOnlyOnHover,
36670
- messageStatusSize = _ref.messageStatusSize,
36671
- messageStatusColor = _ref.messageStatusColor,
36672
- messageReadStatusColor = _ref.messageReadStatusColor,
36673
- messageStateFontSize = _ref.messageStateFontSize,
36674
- messageStateColor = _ref.messageStateColor,
36675
- messageTimeFontSize = _ref.messageTimeFontSize,
36676
- messageTimeColor = _ref.messageTimeColor,
36677
- messageStatusAndTimeLineHeight = _ref.messageStatusAndTimeLineHeight,
36678
- messageTimeVisible = _ref.messageTimeVisible,
36679
- messageStatusVisible = _ref.messageStatusVisible,
36680
- withAttachment = _ref.withAttachment,
36681
- fileAttachment = _ref.fileAttachment,
36682
- ownMessageOnRightSide = _ref.ownMessageOnRightSide,
36683
- leftMargin = _ref.leftMargin,
36684
- bottomOfMessage = _ref.bottomOfMessage,
36685
- marginBottom = _ref.marginBottom,
36686
- messageTimeColorOnAttachment = _ref.messageTimeColorOnAttachment;
36687
- var _useColor = useColors(),
36688
- accentColor = _useColor[THEME_COLORS.ACCENT],
36689
- textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
36690
- iconPrimary = _useColor[THEME_COLORS.ICON_PRIMARY],
36691
- textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
36692
- overlayBackground2 = _useColor[THEME_COLORS.OVERLAY_BACKGROUND_2];
36693
- return /*#__PURE__*/React__default.createElement(MessageStatusAndTimeContainer, {
36694
- lineHeight: messageStatusAndTimeLineHeight,
36695
- showOnlyOnHover: showMessageTimeAndStatusOnlyOnHover,
36696
- leftMargin: leftMargin,
36697
- isSelfMessage: !message.incoming,
36698
- withAttachment: withAttachment,
36699
- rtlDirection: ownMessageOnRightSide && !message.incoming,
36700
- fileAttachment: fileAttachment,
36701
- bottomOfMessage: bottomOfMessage,
36702
- marginBottom: marginBottom,
36703
- className: 'message_status_time',
36704
- messageTimeColorOnAttachment: messageTimeColorOnAttachment || textOnPrimary,
36705
- messageTimeBackgroundColor: overlayBackground2
36706
- }, message.state === MESSAGE_STATUS.EDIT ? (/*#__PURE__*/React__default.createElement(MessageStatusUpdated, {
36707
- color: messageStateColor || textSecondary,
36708
- fontSize: messageStateFontSize
36709
- }, "edited")) : '', messageTimeVisible && (/*#__PURE__*/React__default.createElement(HiddenMessageTime, {
36710
- color: messageTimeColor || textSecondary,
36711
- fontSize: messageTimeFontSize
36712
- }, "" + moment(message.createdAt).format('HH:mm'))), messageStatusVisible && (/*#__PURE__*/React__default.createElement(MessageStatus, {
36713
- height: messageStatusAndTimeLineHeight
36714
- }, MessageStatusIcon({
36715
- messageStatus: message.deliveryStatus,
36716
- messageStatusDisplayingType: messageStatusDisplayingType,
36717
- size: messageStatusSize,
36718
- color: messageStatusColor || iconPrimary,
36719
- readIconColor: messageReadStatusColor,
36720
- accentColor: accentColor
36721
- }))));
36722
- };
36723
- var MessageStatusAndTime$1 = /*#__PURE__*/React__default.memo(MessageStatusAndTime, function (prevProps, nextProps) {
36724
- return prevProps.message.state === nextProps.message.state && prevProps.message.deliveryStatus === nextProps.message.deliveryStatus && prevProps.message.createdAt === nextProps.message.createdAt && prevProps.showMessageTimeAndStatusOnlyOnHover === nextProps.showMessageTimeAndStatusOnlyOnHover && prevProps.messageStatusSize === nextProps.messageStatusSize && prevProps.messageStatusColor === nextProps.messageStatusColor && prevProps.messageReadStatusColor === nextProps.messageReadStatusColor && prevProps.messageStateFontSize === nextProps.messageStateFontSize && prevProps.messageStateColor === nextProps.messageStateColor && prevProps.messageTimeFontSize === nextProps.messageTimeFontSize && prevProps.messageStatusAndTimeLineHeight === nextProps.messageStatusAndTimeLineHeight && prevProps.messageTimeColor === nextProps.messageTimeColor && prevProps.messageTimeVisible === nextProps.messageTimeVisible && prevProps.messageStatusVisible === nextProps.messageStatusVisible && prevProps.ownMessageOnRightSide === nextProps.ownMessageOnRightSide && prevProps.bottomOfMessage === nextProps.bottomOfMessage && prevProps.marginBottom === nextProps.marginBottom && prevProps.messageTimeColorOnAttachment === nextProps.messageTimeColorOnAttachment && prevProps.withAttachment === nextProps.withAttachment;
36725
- });
36726
- var MessageStatus = styled__default.span(_templateObject$D || (_templateObject$D = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n margin-left: 4px;\n text-align: right;\n height: ", ";\n\n & > svg {\n height: 16px;\n width: 16px;\n }\n"])), function (props) {
36727
- return props.height || '14px';
36728
- });
36729
- var HiddenMessageTime = styled__default.span(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteralLoose(["\n display: ", ";\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
36730
- return props.hide && 'none';
36731
- }, function (props) {
36732
- return props.fontSize || '12px';
36733
- }, function (props) {
36734
- return props.color;
36735
- });
36736
- var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$s || (_templateObject3$s = _taggedTemplateLiteralLoose(["\n visibility: ", ";\n display: ", ";\n align-items: flex-end;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n float: right;\n line-height: ", ";\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: ", ";\n direction: ", ";\n transform: translate(0px, 4px);\n white-space: nowrap;\n width: ", ";\n justify-content: ", ";\n z-index: 10;\n\n & > svg {\n margin-left: 4px;\n height: 14px;\n width: 16px;\n }\n\n & > ", " {\n color: ", ";\n }\n\n ", "\n"])), function (props) {
36737
- return props.showOnlyOnHover && 'hidden';
36738
- }, function (props) {
36739
- return props.hide ? 'none' : 'flex';
36740
- }, function (props) {
36741
- return props.withAttachment && '4px 6px';
36742
- }, function (props) {
36743
- return props.withAttachment && !props.fileAttachment && props.messageTimeBackgroundColor + "66";
36744
- }, function (props) {
36745
- return props.lineHeight || '14px';
36746
- }, function (props) {
36747
- return props.rtlDirection && 'auto';
36748
- }, function (props) {
36749
- return props.leftMargin && '12px';
36750
- }, function (props) {
36751
- return props.marginBottom && '8px';
36752
- }, function (props) {
36753
- return props.isSelfMessage ? 'initial' : '';
36754
- }, function (props) {
36755
- return props.bottomOfMessage && '100%';
36756
- }, function (props) {
36757
- return props.bottomOfMessage && props.rtlDirection && 'flex-end';
36758
- }, HiddenMessageTime, function (props) {
36759
- return props.withAttachment && !props.fileAttachment ? props.messageTimeColorOnAttachment : '';
36760
- }, function (props) {
36761
- return props.withAttachment && "\n position: absolute;\n z-index: 10;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
36762
- });
36763
- var MessageStatusUpdated = styled__default.span(_templateObject4$n || (_templateObject4$n = _taggedTemplateLiteralLoose(["\n margin-right: 4px;\n font-style: italic;\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
36764
- return props.fontSize || '12px';
36765
- }, function (props) {
36766
- return props.color;
36767
- });
36768
-
36769
- var _templateObject$E, _templateObject2$z, _templateObject3$t, _templateObject4$o, _templateObject5$j, _templateObject6$h, _templateObject7$f, _templateObject8$e, _templateObject9$b, _templateObject0$a, _templateObject1$7, _templateObject10$4;
36786
+ var _templateObject$E, _templateObject2$z, _templateObject3$t, _templateObject4$o, _templateObject5$j, _templateObject6$h, _templateObject7$g, _templateObject8$e, _templateObject9$b, _templateObject0$a, _templateObject1$7, _templateObject10$4;
36770
36787
  var POLL_VOTES_LIMIT = 20;
36771
36788
  var AllVotesPopup = function AllVotesPopup(_ref) {
36772
36789
  var _pollVotesHasMore$key, _poll$voteDetails, _poll$voteDetails$vot, _poll$voteDetails3;
@@ -36906,7 +36923,7 @@ var VotedAt = styled__default.div(_templateObject5$j || (_templateObject5$j = _t
36906
36923
  var LoadingText = styled__default.div(_templateObject6$h || (_templateObject6$h = _taggedTemplateLiteralLoose(["\n color: ", ";\n text-align: center;\n padding: 16px;\n font-size: 14px;\n"])), function (p) {
36907
36924
  return p.color;
36908
36925
  });
36909
- var TitleWrapper = styled__default.div(_templateObject7$f || (_templateObject7$f = _taggedTemplateLiteralLoose(["\n max-width: calc(100% - 54px);\n margin: 0 auto;\n"])));
36926
+ var TitleWrapper = styled__default.div(_templateObject7$g || (_templateObject7$g = _taggedTemplateLiteralLoose(["\n max-width: calc(100% - 54px);\n margin: 0 auto;\n"])));
36910
36927
  var BackButton = styled__default.button(_templateObject8$e || (_templateObject8$e = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 13px;\n top: 13px;\n padding: 9px;\n cursor: pointer;\n box-sizing: content-box;\n background: transparent;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ", ";\n flex-shrink: 0;\n\n & > svg {\n width: 24px;\n height: 24px;\n }\n\n &:hover {\n opacity: 0.7;\n }\n"])), function (p) {
36911
36928
  return p.color;
36912
36929
  });
@@ -36923,7 +36940,7 @@ var Loader = styled__default.div(_templateObject10$4 || (_templateObject10$4 = _
36923
36940
  return p.color;
36924
36941
  });
36925
36942
 
36926
- var _templateObject$F, _templateObject2$A, _templateObject3$u, _templateObject4$p, _templateObject5$k, _templateObject6$i, _templateObject7$g, _templateObject8$f, _templateObject9$c, _templateObject0$b, _templateObject1$8, _templateObject10$5;
36943
+ var _templateObject$F, _templateObject2$A, _templateObject3$u, _templateObject4$p, _templateObject5$k, _templateObject6$i, _templateObject7$h, _templateObject8$f, _templateObject9$c, _templateObject0$b, _templateObject1$8, _templateObject10$5;
36927
36944
  var VotesResultsPopup = function VotesResultsPopup(_ref) {
36928
36945
  var _poll$voteDetails3, _poll$voteDetails4, _poll$options$find;
36929
36946
  var onClose = _ref.onClose,
@@ -37080,7 +37097,7 @@ var OptionCount = styled__default.div(_templateObject5$k || (_templateObject5$k
37080
37097
  return p.color;
37081
37098
  });
37082
37099
  var Voters = styled__default.div(_templateObject6$i || (_templateObject6$i = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n margin-bottom: 5px;\n"])));
37083
- var VoterRow$1 = styled__default.div(_templateObject7$g || (_templateObject7$g = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 6px 0;\n"])));
37100
+ var VoterRow$1 = styled__default.div(_templateObject7$h || (_templateObject7$h = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 6px 0;\n"])));
37084
37101
  var VoterInfo$1 = styled__default.div(_templateObject8$f || (_templateObject8$f = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n justify-content: space-between;\n"])));
37085
37102
  var VoterName$1 = styled__default.div(_templateObject9$c || (_templateObject9$c = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 500;\n font-size: 15px;\n line-height: 20px;\n letter-spacing: -0.2px;\n max-width: calc(100% - 120px);\n"])), function (p) {
37086
37103
  return p.color;
@@ -37117,7 +37134,7 @@ function SvgFilledCheckbox(props) {
37117
37134
  })));
37118
37135
  }
37119
37136
 
37120
- var _templateObject$G, _templateObject2$B, _templateObject3$v, _templateObject4$q, _templateObject5$l, _templateObject6$j, _templateObject7$h, _templateObject8$g, _templateObject9$d, _templateObject0$c, _templateObject1$9, _templateObject10$6, _templateObject11$4, _templateObject12$3;
37137
+ var _templateObject$G, _templateObject2$B, _templateObject3$v, _templateObject4$q, _templateObject5$l, _templateObject6$j, _templateObject7$i, _templateObject8$g, _templateObject9$d, _templateObject0$c, _templateObject1$9, _templateObject10$6, _templateObject11$4, _templateObject12$3;
37121
37138
  var PollMessage = function PollMessage(_ref) {
37122
37139
  var _poll$voteDetails3, _poll$voteDetails4, _poll$voteDetails5, _poll$voteDetails6, _poll$voteDetails7;
37123
37140
  var message = _ref.message,
@@ -37283,7 +37300,7 @@ var Option = styled__default.div(_templateObject5$l || (_templateObject5$l = _ta
37283
37300
  return p.disabled ? 'not-allowed' : 'pointer';
37284
37301
  });
37285
37302
  var TopRow = styled__default.div(_templateObject6$j || (_templateObject6$j = _taggedTemplateLiteralLoose(["\n display: flex;\n margin-bottom: 6px;\n min-height: 22px;\n"])));
37286
- var Indicator = styled__default.div(_templateObject7$h || (_templateObject7$h = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n min-width: 20px;\n height: 20px;\n margin-right: 8px;\n opacity: ", ";\n cursor: ", ";\n"])), function (p) {
37303
+ var Indicator = styled__default.div(_templateObject7$i || (_templateObject7$i = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n min-width: 20px;\n height: 20px;\n margin-right: 8px;\n opacity: ", ";\n cursor: ", ";\n"])), function (p) {
37287
37304
  return p.disabled ? 0.5 : 1;
37288
37305
  }, function (p) {
37289
37306
  return p.disabled ? 'not-allowed' : 'pointer';
@@ -37312,7 +37329,7 @@ var UsersContainer = styled__default.div(_templateObject12$3 || (_templateObject
37312
37329
  return p.cursor;
37313
37330
  });
37314
37331
 
37315
- var _templateObject$H, _templateObject2$C, _templateObject3$w, _templateObject4$r, _templateObject5$m, _templateObject6$k, _templateObject7$i, _templateObject8$h, _templateObject9$e, _templateObject0$d, _templateObject1$a;
37332
+ var _templateObject$H, _templateObject2$C, _templateObject3$w, _templateObject4$r, _templateObject5$m, _templateObject6$k, _templateObject7$j, _templateObject8$h, _templateObject9$e, _templateObject0$d, _templateObject1$a;
37316
37333
  var validateUrl = function validateUrl(url) {
37317
37334
  try {
37318
37335
  var urlObj = new URL(url);
@@ -37764,7 +37781,7 @@ var Url = styled__default.p(_templateObject6$k || (_templateObject6$k = _taggedT
37764
37781
  var shouldAnimate = _ref21.shouldAnimate;
37765
37782
  return shouldAnimate && "\n animation: fadeInSlideUp 0.3s ease-out 0.3s backwards;\n ";
37766
37783
  });
37767
- var Img = styled__default.img(_templateObject7$i || (_templateObject7$i = _taggedTemplateLiteralLoose(["\n ", "\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n // object-fit: cover;\n // object-position: center;\n // image-rendering: auto;\n border-radius: inherit;\n ", "\n"])), sharedKeyframes, function (_ref22) {
37784
+ var Img = styled__default.img(_templateObject7$j || (_templateObject7$j = _taggedTemplateLiteralLoose(["\n ", "\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n // object-fit: cover;\n // object-position: center;\n // image-rendering: auto;\n border-radius: inherit;\n ", "\n"])), sharedKeyframes, function (_ref22) {
37768
37785
  var shouldAnimate = _ref22.shouldAnimate;
37769
37786
  return shouldAnimate && "\n animation: fadeIn 0.4s ease-out forwards;\n ";
37770
37787
  });
@@ -37773,7 +37790,7 @@ var OGTextWrapper = styled__default.div(_templateObject9$e || (_templateObject9$
37773
37790
  var FaviconContainer = styled__default.div(_templateObject0$d || (_templateObject0$d = _taggedTemplateLiteralLoose(["\n width: 52px;\n height: 52px;\n border-radius: 8px;\n overflow: hidden;\n margin: 8px;\n flex: 0 0 52px;\n"])));
37774
37791
  var FaviconImg = styled__default.img(_templateObject1$a || (_templateObject1$a = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n"])));
37775
37792
 
37776
- var _templateObject$I, _templateObject2$D, _templateObject3$x, _templateObject4$s, _templateObject5$n, _templateObject6$l, _templateObject7$j, _templateObject8$i, _templateObject9$f, _templateObject0$e;
37793
+ var _templateObject$I, _templateObject2$D, _templateObject3$x, _templateObject4$s, _templateObject5$n, _templateObject6$l, _templateObject7$k, _templateObject8$i, _templateObject9$f, _templateObject0$e;
37777
37794
  var MessageBody = function MessageBody(_ref) {
37778
37795
  var _message$attachments2, _message$attachments3, _message$pollDetails, _message$pollDetails2;
37779
37796
  var message = _ref.message,
@@ -38512,7 +38529,7 @@ var MessageBodyContainer = styled__default.div(_templateObject6$l || (_templateO
38512
38529
  }, function (props) {
38513
38530
  return props.noBody && 'hidden';
38514
38531
  });
38515
- var EmojiContainer = styled__default.div(_templateObject7$j || (_templateObject7$j = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: ", ";\n right: ", ";\n //top: ", ";\n top: ", ";\n bottom: ", ";\n z-index: 99;\n"])), function (props) {
38532
+ var EmojiContainer = styled__default.div(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: ", ";\n right: ", ";\n //top: ", ";\n top: ", ";\n bottom: ", ";\n z-index: 99;\n"])), function (props) {
38516
38533
  return props.rtlDirection ? '' : '0';
38517
38534
  }, function (props) {
38518
38535
  return props.rtlDirection && '0';
@@ -38535,7 +38552,7 @@ var ReadMoreLink = styled__default.span(_templateObject0$e || (_templateObject0$
38535
38552
  return props.accentColor;
38536
38553
  });
38537
38554
 
38538
- var _templateObject$J, _templateObject2$E, _templateObject3$y, _templateObject4$t, _templateObject5$o, _templateObject6$m, _templateObject7$k, _templateObject8$j, _templateObject9$g, _templateObject0$f, _templateObject1$b;
38555
+ var _templateObject$J, _templateObject2$E, _templateObject3$y, _templateObject4$t, _templateObject5$o, _templateObject6$m, _templateObject7$l, _templateObject8$j, _templateObject9$g, _templateObject0$f, _templateObject1$b;
38539
38556
  var defaultFormatDate = function defaultFormatDate(date) {
38540
38557
  var m = moment(date);
38541
38558
  if (m.isSame(moment(), 'day')) {
@@ -39033,7 +39050,7 @@ var RowInfo = styled__default.div(_templateObject5$o || (_templateObject5$o = _t
39033
39050
  var RowTitle = styled__default.div(_templateObject6$m || (_templateObject6$m = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: 16px;\n font-weight: 500;\n line-height: 22px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])), function (p) {
39034
39051
  return p.color;
39035
39052
  });
39036
- var RowDate = styled__default.div(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n color: ", ";\n min-width: max-content;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n"])), function (p) {
39053
+ var RowDate = styled__default.div(_templateObject7$l || (_templateObject7$l = _taggedTemplateLiteralLoose(["\n color: ", ";\n min-width: max-content;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n"])), function (p) {
39037
39054
  return p.color;
39038
39055
  });
39039
39056
  var Empty = styled__default.div(_templateObject8$j || (_templateObject8$j = _taggedTemplateLiteralLoose(["\n color: ", ";\n text-align: center;\n padding: 16px 0;\n font-size: 14px;\n height: calc(100% - 32px);\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n"])), function (p) {
@@ -39079,7 +39096,7 @@ function ConfirmEndPollPopup(_ref) {
39079
39096
  });
39080
39097
  }
39081
39098
 
39082
- var _templateObject$K, _templateObject2$F, _templateObject3$z, _templateObject4$u, _templateObject5$p, _templateObject6$n, _templateObject7$l, _templateObject8$k, _templateObject9$h, _templateObject0$g, _templateObject1$c, _templateObject10$7, _templateObject11$5, _templateObject12$4;
39099
+ var _templateObject$K, _templateObject2$F, _templateObject3$z, _templateObject4$u, _templateObject5$p, _templateObject6$n, _templateObject7$m, _templateObject8$k, _templateObject9$h, _templateObject0$g, _templateObject1$c, _templateObject10$7, _templateObject11$5, _templateObject12$4;
39083
39100
  var Message$1 = function Message(_ref) {
39084
39101
  var message = _ref.message,
39085
39102
  channel = _ref.channel,
@@ -39920,7 +39937,7 @@ var FailedMessageIcon = styled__default.div(_templateObject5$p || (_templateObje
39920
39937
  return props.rtl && '-24px';
39921
39938
  });
39922
39939
  var ErrorIconWrapper = styled__default(SvgErrorIcon)(_templateObject6$n || (_templateObject6$n = _taggedTemplateLiteralLoose(["\n width: 20px;\n height: 20px;\n"])));
39923
- var SelectMessageWrapper = styled__default.div(_templateObject7$l || (_templateObject7$l = _taggedTemplateLiteralLoose(["\n display: flex;\n padding: 10px;\n position: absolute;\n left: 4%;\n bottom: calc(50% - 22px);\n cursor: ", ";\n & > svg {\n color: ", ";\n width: 24px;\n height: 24px;\n }\n"])), function (props) {
39940
+ var SelectMessageWrapper = styled__default.div(_templateObject7$m || (_templateObject7$m = _taggedTemplateLiteralLoose(["\n display: flex;\n padding: 10px;\n position: absolute;\n left: 4%;\n bottom: calc(50% - 22px);\n cursor: ", ";\n & > svg {\n color: ", ";\n width: 24px;\n height: 24px;\n }\n"])), function (props) {
39924
39941
  return !props.disabled && 'pointer';
39925
39942
  }, function (props) {
39926
39943
  return props.activeColor;
@@ -39991,7 +40008,7 @@ var MessageItem = styled__default.div(_templateObject12$4 || (_templateObject12$
39991
40008
  return props.hoverBackground || '';
39992
40009
  }, HiddenMessageTime$1, MessageStatus$1);
39993
40010
 
39994
- var _templateObject$L, _templateObject2$G, _templateObject3$A, _templateObject4$v, _templateObject5$q, _templateObject6$o, _templateObject7$m, _templateObject8$l, _templateObject9$i, _templateObject0$h, _templateObject1$d;
40011
+ var _templateObject$L, _templateObject2$G, _templateObject3$A, _templateObject4$v, _templateObject5$q, _templateObject6$o, _templateObject7$n, _templateObject8$l, _templateObject9$i, _templateObject0$h, _templateObject1$d;
39995
40012
  var CreateMessageDateDivider = function CreateMessageDateDivider(_ref) {
39996
40013
  var lastIndex = _ref.lastIndex,
39997
40014
  currentMessageDate = _ref.currentMessageDate,
@@ -41106,7 +41123,7 @@ var IconWrapper$1 = styled__default.span(_templateObject6$o || (_templateObject6
41106
41123
  }, function (props) {
41107
41124
  return props.iconColor;
41108
41125
  });
41109
- var DropAttachmentArea = styled__default.div(_templateObject7$m || (_templateObject7$m = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n height: 100%;\n border: 1px dashed ", ";\n border-radius: 16px;\n margin: ", ";\n font-weight: 400;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n color: ", ";\n transition: all 0.1s;\n\n &.dragover {\n background-color: ", ";\n border: 1px dashed ", ";\n\n ", " {\n background-color: ", ";\n }\n }\n"])), function (props) {
41126
+ var DropAttachmentArea = styled__default.div(_templateObject7$n || (_templateObject7$n = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n height: 100%;\n border: 1px dashed ", ";\n border-radius: 16px;\n margin: ", ";\n font-weight: 400;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n color: ", ";\n transition: all 0.1s;\n\n &.dragover {\n background-color: ", ";\n border: 1px dashed ", ";\n\n ", " {\n background-color: ", ";\n }\n }\n"])), function (props) {
41110
41127
  return props.borderColor;
41111
41128
  }, function (props) {
41112
41129
  return props.margin || '12px 32px 32px';
@@ -41686,7 +41703,9 @@ function MentionsContainer(_ref2) {
41686
41703
  selectOptionAndCleanUp = _ref2.selectOptionAndCleanUp,
41687
41704
  setHighlightedIndex = _ref2.setHighlightedIndex,
41688
41705
  setMentionsIsOpen = _ref2.setMentionsIsOpen,
41689
- channelId = _ref2.channelId;
41706
+ channelId = _ref2.channelId,
41707
+ alignLeft = _ref2.alignLeft,
41708
+ handleLeftOffset = _ref2.handleLeftOffset;
41690
41709
  var theme = useSelector(themeSelector);
41691
41710
  var _useColor2 = useColors(),
41692
41711
  borderColor = _useColor2[THEME_COLORS.BORDER],
@@ -41702,9 +41721,6 @@ function MentionsContainer(_ref2) {
41702
41721
  return channelsMembersHasNext === null || channelsMembersHasNext === void 0 ? void 0 : channelsMembersHasNext[channelId];
41703
41722
  }, [channelsMembersHasNext === null || channelsMembersHasNext === void 0 ? void 0 : channelsMembersHasNext[channelId]]);
41704
41723
  var mentionsListRef = React.useRef(null);
41705
- var _useState2 = React.useState(false),
41706
- alignRight = _useState2[0],
41707
- setAlignRight = _useState2[1];
41708
41724
  var contRef = React.useRef();
41709
41725
  var handleKeyDown = function handleKeyDown(event) {
41710
41726
  var code = event.code;
@@ -41757,28 +41773,6 @@ function MentionsContainer(_ref2) {
41757
41773
  dispatch(loadMoreMembersAC(15, channelId));
41758
41774
  }
41759
41775
  }, [options === null || options === void 0 ? void 0 : options.length, membersHasNext, membersLoadingState, channelId, dispatch]);
41760
- React.useEffect(function () {
41761
- var checkOverflow = function checkOverflow() {
41762
- if (mentionsListRef.current && contRef.current) {
41763
- var containerElement = contRef.current;
41764
- var containerRect = containerElement.getBoundingClientRect();
41765
- var listWidth = 340;
41766
- var leftOffset = -60;
41767
- var rightEdge = containerRect.left + leftOffset + listWidth;
41768
- if (rightEdge > window.innerWidth) {
41769
- setAlignRight(true);
41770
- } else {
41771
- setAlignRight(false);
41772
- }
41773
- }
41774
- };
41775
- var timeoutId = setTimeout(checkOverflow, 0);
41776
- window.addEventListener('resize', checkOverflow);
41777
- return function () {
41778
- clearTimeout(timeoutId);
41779
- window.removeEventListener('resize', checkOverflow);
41780
- };
41781
- }, [options === null || options === void 0 ? void 0 : options.length]);
41782
41776
  return /*#__PURE__*/React__default.createElement(MentionsContainerWrapper, {
41783
41777
  className: 'typeahead-popover mentions-menu',
41784
41778
  ref: contRef
@@ -41789,7 +41783,7 @@ function MentionsContainer(_ref2) {
41789
41783
  ref: mentionsListRef,
41790
41784
  borderColor: borderColor,
41791
41785
  onScroll: handleScroll,
41792
- alignRight: alignRight
41786
+ alignLeft: alignLeft
41793
41787
  }, options.map(function (option, i) {
41794
41788
  return /*#__PURE__*/React__default.createElement(MentionsTypeaheadMenuItem, {
41795
41789
  index: i,
@@ -41805,7 +41799,8 @@ function MentionsContainer(_ref2) {
41805
41799
  option: option
41806
41800
  });
41807
41801
  })), /*#__PURE__*/React__default.createElement(Handle, {
41808
- backgroundColor: background
41802
+ backgroundColor: background,
41803
+ leftOffset: handleLeftOffset
41809
41804
  }));
41810
41805
  }
41811
41806
  function MentionsPlugin(_ref3) {
@@ -41818,9 +41813,9 @@ function MentionsPlugin(_ref3) {
41818
41813
  channelId = _ref3.channelId;
41819
41814
  var _useLexicalComposerCo = LexicalComposerContext.useLexicalComposerContext(),
41820
41815
  editor = _useLexicalComposerCo[0];
41821
- var _useState3 = React.useState(null),
41822
- queryString = _useState3[0],
41823
- setQueryString = _useState3[1];
41816
+ var _useState2 = React.useState(null),
41817
+ queryString = _useState2[0],
41818
+ setQueryString = _useState2[1];
41824
41819
  var results = useMentionLookupService(queryString, contactsMap, userId, members, getFromContacts);
41825
41820
  var checkForSlashTriggerMatch = LexicalTypeaheadMenuPlugin.useBasicTypeaheadTriggerMatch('/', {
41826
41821
  minLength: 0
@@ -41868,26 +41863,39 @@ function MentionsPlugin(_ref3) {
41868
41863
  options: options,
41869
41864
  onOpen: handleOnOpen,
41870
41865
  menuRenderFn: function menuRenderFn(anchorElementRef, _ref4) {
41866
+ var _anchorElementRef$cur;
41871
41867
  var selectedIndex = _ref4.selectedIndex,
41872
41868
  selectOptionAndCleanUp = _ref4.selectOptionAndCleanUp,
41873
41869
  setHighlightedIndex = _ref4.setHighlightedIndex;
41874
- return anchorElementRef.current ? /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React__default.createElement(MentionsContainer, {
41870
+ var containerRect = (_anchorElementRef$cur = anchorElementRef.current) === null || _anchorElementRef$cur === void 0 ? void 0 : _anchorElementRef$cur.getBoundingClientRect();
41871
+ var listWidth = 340;
41872
+ var leftOffset = 30;
41873
+ var channelDetailsWrapper = document.getElementById('channel_details_wrapper');
41874
+ var channelDetailsWrapperRect = channelDetailsWrapper === null || channelDetailsWrapper === void 0 ? void 0 : channelDetailsWrapper.getBoundingClientRect();
41875
+ var channelDetailsWrapperWidth = channelDetailsWrapperRect === null || channelDetailsWrapperRect === void 0 ? void 0 : channelDetailsWrapperRect.width;
41876
+ var alignLeft = 0;
41877
+ if (window.innerWidth - (channelDetailsWrapperWidth || 0) - ((containerRect === null || containerRect === void 0 ? void 0 : containerRect.left) || 0) - listWidth < 0) {
41878
+ alignLeft = window.innerWidth - (channelDetailsWrapperWidth || 0) - 10 - listWidth;
41879
+ } else {
41880
+ alignLeft = ((containerRect === null || containerRect === void 0 ? void 0 : containerRect.left) || 0) - leftOffset;
41881
+ }
41882
+ return anchorElementRef.current ? (/*#__PURE__*/React__default.createElement(MentionsContainer, {
41875
41883
  queryString: queryString,
41876
41884
  options: options,
41877
41885
  setMentionsIsOpen: setMentionsIsOpen,
41878
41886
  selectOptionAndCleanUp: selectOptionAndCleanUp,
41879
41887
  selectedIndex: selectedIndex,
41880
41888
  setHighlightedIndex: setHighlightedIndex,
41881
- channelId: channelId
41882
- }), anchorElementRef.current) : null;
41889
+ channelId: channelId,
41890
+ alignLeft: alignLeft,
41891
+ handleLeftOffset: ((containerRect === null || containerRect === void 0 ? void 0 : containerRect.left) || 0) + 7
41892
+ })) : null;
41883
41893
  }
41884
41894
  });
41885
41895
  }
41886
- var MentionsContainerWrapper = styled__default.div(_templateObject$M || (_templateObject$M = _taggedTemplateLiteralLoose(["\n position: relative;\n animation: fadeIn 0.2s ease-in-out;\n @keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n"])));
41887
- var MentionsList = styled__default.ul(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 47px;\n width: 340px;\n max-height: 268px;\n transition: all 0.2s;\n overflow-x: hidden;\n overflow-y: auto;\n left: ", ";\n right: ", ";\n z-index: 200;\n padding: 0;\n margin: 0;\n background: ", ";\n border: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n border-radius: 6px;\n visibility: ", ";\n\n &::-webkit-scrollbar {\n width: 6px;\n }\n\n &::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 6px;\n }\n\n &::-webkit-scrollbar-thumb:hover {\n background: ", ";\n }\n"])), function (props) {
41888
- return props.alignRight ? 'auto' : '-60px';
41889
- }, function (props) {
41890
- return props.alignRight ? '-60px' : 'auto';
41896
+ var MentionsContainerWrapper = styled__default.div(_templateObject$M || (_templateObject$M = _taggedTemplateLiteralLoose(["\n animation: fadeIn 0.2s ease-in-out;\n width: 0;\n @keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n"])));
41897
+ var MentionsList = styled__default.ul(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteralLoose(["\n position: fixed;\n bottom: 47px;\n width: 340px;\n max-height: 268px;\n transition: height 0.2s ease;\n overflow-x: hidden;\n overflow-y: auto;\n left: ", ";\n z-index: 200;\n padding: 0;\n margin: 0;\n background: ", ";\n border: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n border-radius: 6px;\n visibility: ", ";\n\n &::-webkit-scrollbar {\n width: 6px;\n }\n\n &::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 6px;\n }\n\n &::-webkit-scrollbar-thumb:hover {\n background: ", ";\n }\n"])), function (props) {
41898
+ return props.alignLeft + "px";
41891
41899
  }, function (props) {
41892
41900
  return props.backgroundColor;
41893
41901
  }, function (props) {
@@ -41901,7 +41909,9 @@ var MentionsList = styled__default.ul(_templateObject2$H || (_templateObject2$H
41901
41909
  }, function (props) {
41902
41910
  return props.scrollbarThumbColor;
41903
41911
  });
41904
- var Handle = styled__default.div(_templateObject3$B || (_templateObject3$B = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 39px;\n left: 50%;\n transform: translateX(-50%);\n width: 20px;\n height: 8px;\n background: ", ";\n z-index: 201;\n clip-path: polygon(0% 0%, 100% 0%, 50% 100%);\n"])), function (props) {
41912
+ var Handle = styled__default.div(_templateObject3$B || (_templateObject3$B = _taggedTemplateLiteralLoose(["\n position: fixed;\n bottom: 39px;\n left: ", ";\n transform: translateX(-50%);\n width: 20px;\n height: 8px;\n background: ", ";\n z-index: 201;\n clip-path: polygon(0% 0%, 100% 0%, 50% 100%);\n"])), function (props) {
41913
+ return props.leftOffset + "px";
41914
+ }, function (props) {
41905
41915
  return props.backgroundColor;
41906
41916
  });
41907
41917
  var MemberItem = styled__default.li(_templateObject4$w || (_templateObject4$w = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n max-width: 340px;\n height: 52px;\n font-size: 15px;\n padding: 0 16px;\n box-sizing: border-box;\n transition: all 0.2s;\n cursor: pointer;\n background-color: ", ";\n\n & ", " {\n width: 10px;\n height: 10px;\n }\n"])), function (props) {
@@ -42401,7 +42411,7 @@ function useFloatingTextFormatToolbar(editor, anchorElem) {
42401
42411
  if (!isText) {
42402
42412
  return null;
42403
42413
  }
42404
- return /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React__default.createElement(TextFormatFloatingToolbar, {
42414
+ return /*#__PURE__*/reactDom.createPortal(/*#__PURE__*/React__default.createElement(TextFormatFloatingToolbar, {
42405
42415
  editor: editor,
42406
42416
  anchorElem: anchorElem,
42407
42417
  isBold: isBold,
@@ -42847,7 +42857,7 @@ function FormatMessagePlugin(_ref3) {
42847
42857
  return null;
42848
42858
  }
42849
42859
 
42850
- var _templateObject$O, _templateObject2$J, _templateObject3$C, _templateObject4$x, _templateObject5$s, _templateObject6$q, _templateObject7$n, _templateObject8$m;
42860
+ var _templateObject$O, _templateObject2$J, _templateObject3$C, _templateObject4$x, _templateObject5$s, _templateObject6$q, _templateObject7$o, _templateObject8$m;
42851
42861
  var EmojiIcon$1 = function EmojiIcon(_ref) {
42852
42862
  var collectionName = _ref.collectionName;
42853
42863
  switch (collectionName) {
@@ -43074,7 +43084,7 @@ var EmojiCollection$1 = styled__default.span(_templateObject4$x || (_templateObj
43074
43084
  });
43075
43085
  var CollectionPointer$1 = styled__default.span(_templateObject5$s || (_templateObject5$s = _taggedTemplateLiteralLoose([""])));
43076
43086
  var AllEmojis$1 = styled__default.ul(_templateObject6$q || (_templateObject6$q = _taggedTemplateLiteralLoose(["\n overflow: hidden;\n padding: 0 8px 8px;\n margin: 0;\n"])));
43077
- var EmojiFooter$1 = styled__default.div(_templateObject7$n || (_templateObject7$n = _taggedTemplateLiteralLoose(["\n height: 42px;\n display: flex;\n justify-content: space-around;\n align-items: center;\n border-top: ", ";\n border-bottom: ", ";\n padding: 0 10px;\n & > span {\n width: 100%;\n text-align: center;\n }\n"])), function (props) {
43087
+ var EmojiFooter$1 = styled__default.div(_templateObject7$o || (_templateObject7$o = _taggedTemplateLiteralLoose(["\n height: 42px;\n display: flex;\n justify-content: space-around;\n align-items: center;\n border-top: ", ";\n border-bottom: ", ";\n padding: 0 10px;\n & > span {\n width: 100%;\n text-align: center;\n }\n"])), function (props) {
43078
43088
  return props.emojisCategoryIconsPosition !== 'top' && "1px solid " + props.borderColor;
43079
43089
  }, function (props) {
43080
43090
  return props.emojisCategoryIconsPosition === 'top' && "1px solid " + props.borderColor;
@@ -43333,7 +43343,7 @@ function SvgRecordButton(props) {
43333
43343
  })));
43334
43344
  }
43335
43345
 
43336
- var _templateObject$P, _templateObject2$K, _templateObject3$D, _templateObject4$y, _templateObject5$t, _templateObject6$r, _templateObject7$o;
43346
+ var _templateObject$P, _templateObject2$K, _templateObject3$D, _templateObject4$y, _templateObject5$t, _templateObject6$r, _templateObject7$p;
43337
43347
  var fieldsObject = {
43338
43348
  channelId: '',
43339
43349
  currentRecordedFile: null,
@@ -43964,8 +43974,8 @@ var AudioRecord = function AudioRecord(_ref) {
43964
43974
  var AudioRecord$1 = /*#__PURE__*/React.memo(AudioRecord, function (prevProps, nextProps) {
43965
43975
  return prevProps.channelId === nextProps.channelId && prevProps.showRecording === nextProps.showRecording && prevProps.maxRecordingDuration === nextProps.maxRecordingDuration && prevProps.showViewOnceToggle === nextProps.showViewOnceToggle && prevProps.viewOnce === nextProps.viewOnce && prevProps.ViewOnceSelectedSVGIcon === nextProps.ViewOnceSelectedSVGIcon && prevProps.ViewOnceNotSelectedSVGIcon === nextProps.ViewOnceNotSelectedSVGIcon;
43966
43976
  });
43967
- var Container$l = styled__default.div(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n width: 32px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n ", ";\n transition: all 0.3s ease-in-out;\n"])), function (props) {
43968
- return props.recording && "width: 400px";
43977
+ var Container$l = styled__default.div(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n width: 32px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n ", "\n"])), function (props) {
43978
+ return props.recording && "width: 400px;\n transition: all 0.3s ease-in-out;\n ";
43969
43979
  });
43970
43980
  var AudioWrapper = styled__default.div(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n height: 36px;\n width: ", ";\n overflow: hidden;\n margin: ", ";\n background-color: ", ";\n padding: ", ";\n border-radius: 20px;\n"])), function (props) {
43971
43981
  return props.recording ? 'calc(100% - 84px)' : '0';
@@ -44004,7 +44014,7 @@ var Canvas = styled__default.canvas(_templateObject6$r || (_templateObject6$r =
44004
44014
  var hide = _ref0.hide;
44005
44015
  return hide && '-1';
44006
44016
  });
44007
- var Timer$2 = styled__default.div(_templateObject7$o || (_templateObject7$o = _taggedTemplateLiteralLoose(["\n width: 40px;\n font-weight: 400;\n font-size: 16px;\n line-height: 12px;\n color: ", ";\n margin-left: auto;\n"])), function (props) {
44017
+ var Timer$2 = styled__default.div(_templateObject7$p || (_templateObject7$p = _taggedTemplateLiteralLoose(["\n width: 40px;\n font-weight: 400;\n font-size: 16px;\n line-height: 12px;\n color: ", ";\n margin-left: auto;\n"])), function (props) {
44008
44018
  return props.color;
44009
44019
  });
44010
44020
 
@@ -44059,7 +44069,7 @@ function SvgDotsVertica(props) {
44059
44069
  })));
44060
44070
  }
44061
44071
 
44062
- var _templateObject$R, _templateObject2$M, _templateObject3$F, _templateObject4$z, _templateObject5$u, _templateObject6$s, _templateObject7$p, _templateObject8$n, _templateObject9$j;
44072
+ var _templateObject$R, _templateObject2$M, _templateObject3$F, _templateObject4$z, _templateObject5$u, _templateObject6$s, _templateObject7$q, _templateObject8$n, _templateObject9$j;
44063
44073
  var CreatePollPopup = function CreatePollPopup(_ref) {
44064
44074
  var togglePopup = _ref.togglePopup,
44065
44075
  onCreate = _ref.onCreate;
@@ -44467,7 +44477,7 @@ var RemoveOptionIcon = styled__default(SvgClose)(_templateObject6$s || (_templat
44467
44477
  }, function (props) {
44468
44478
  return props.disabled ? 0.5 : 1;
44469
44479
  });
44470
- var AddOptionButton = styled__default.button(_templateObject7$p || (_templateObject7$p = _taggedTemplateLiteralLoose(["\n margin: 16px 0 0 0;\n background: transparent;\n border: none;\n color: ", ";\n cursor: ", ";\n width: 100%;\n text-align: left;\n padding-left: 32px;\n opacity: ", ";\n"])), function (props) {
44480
+ var AddOptionButton = styled__default.button(_templateObject7$q || (_templateObject7$q = _taggedTemplateLiteralLoose(["\n margin: 16px 0 0 0;\n background: transparent;\n border: none;\n color: ", ";\n cursor: ", ";\n width: 100%;\n text-align: left;\n padding-left: 32px;\n opacity: ", ";\n"])), function (props) {
44471
44481
  return props.disabled ? props.disabledColor : props.color;
44472
44482
  }, function (props) {
44473
44483
  return props.disabled ? 'not-allowed' : 'pointer';
@@ -44479,7 +44489,7 @@ var SettingItem = styled__default.div(_templateObject9$j || (_templateObject9$j
44479
44489
  return props.color;
44480
44490
  });
44481
44491
 
44482
- var _templateObject$S, _templateObject2$N, _templateObject3$G, _templateObject4$A, _templateObject5$v, _templateObject6$t, _templateObject7$q, _templateObject8$o, _templateObject9$k, _templateObject0$i, _templateObject1$e, _templateObject10$8, _templateObject11$6, _templateObject12$5, _templateObject13$3, _templateObject14$2, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$2, _templateObject20$2, _templateObject21$2, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1, _templateObject27$1, _templateObject28$1, _templateObject29$1, _templateObject30$1, _templateObject31$1, _templateObject32$1, _templateObject33$1, _templateObject34$1, _templateObject35$1, _templateObject36$1;
44492
+ var _templateObject$S, _templateObject2$N, _templateObject3$G, _templateObject4$A, _templateObject5$v, _templateObject6$t, _templateObject7$r, _templateObject8$o, _templateObject9$k, _templateObject0$i, _templateObject1$e, _templateObject10$8, _templateObject11$6, _templateObject12$5, _templateObject13$3, _templateObject14$2, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$2, _templateObject20$2, _templateObject21$2, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1, _templateObject27$1, _templateObject28$1, _templateObject29$1, _templateObject30$1, _templateObject31$1, _templateObject32$1, _templateObject33$1, _templateObject34$1, _templateObject35$1, _templateObject36$1;
44483
44493
  function AutoFocusPlugin(_ref) {
44484
44494
  var messageForReply = _ref.messageForReply;
44485
44495
  var _useLexicalComposerCo = LexicalComposerContext.useLexicalComposerContext(),
@@ -46265,7 +46275,7 @@ var ViewOnceWarningTooltip = styled__default.div(_templateObject5$v || (_templat
46265
46275
  return props.backgroundColor;
46266
46276
  });
46267
46277
  var WarningIconWrapper = styled__default.div(_templateObject6$t || (_templateObject6$t = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 24px;\n height: 24px;\n\n & > svg {\n width: 24px;\n height: 24px;\n }\n"])));
46268
- var WarningText = styled__default.span(_templateObject7$q || (_templateObject7$q = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n font-size: 14px;\n line-height: 18px;\n"])), function (props) {
46278
+ var WarningText = styled__default.span(_templateObject7$r || (_templateObject7$r = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n font-size: 14px;\n line-height: 18px;\n"])), function (props) {
46269
46279
  return props.color;
46270
46280
  });
46271
46281
  var CloseEditMode = styled__default.span(_templateObject8$o || (_templateObject8$o = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 8px;\n right: 12px;\n width: 20px;\n height: 20px;\n text-align: center;\n line-height: 22px;\n cursor: pointer;\n\n & > svg {\n color: ", ";\n }\n"])), function (props) {
@@ -46742,7 +46752,7 @@ var StyledPopupName = styled__default(PopupName)(_templateObject$T || (_template
46742
46752
  var StyledPopupDescription = styled__default(PopupDescription)(_templateObject2$O || (_templateObject2$O = _taggedTemplateLiteralLoose(["\n font-weight: 400;\n font-style: normal;\n font-size: 15px;\n line-height: 150%;\n letter-spacing: 0%;\n margin-top: 0;\n margin-bottom: 0;\n width: 437px;\n height: 68px;\n opacity: 1;\n display: block;\n overflow-wrap: break-word;\n word-wrap: break-word;\n"])));
46743
46753
  var CloseButton$1 = styled__default(Button)(_templateObject3$H || (_templateObject3$H = _taggedTemplateLiteralLoose(["\n width: 73px;\n height: 36px;\n min-width: 73px;\n max-width: 73px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
46744
46754
 
46745
- var _templateObject$U, _templateObject2$P, _templateObject3$I, _templateObject4$B, _templateObject5$w, _templateObject6$u, _templateObject7$r, _templateObject8$p;
46755
+ var _templateObject$U, _templateObject2$P, _templateObject3$I, _templateObject4$B, _templateObject5$w, _templateObject6$u, _templateObject7$s, _templateObject8$p;
46746
46756
  var TIMER_OPTIONS = [{
46747
46757
  key: 'off',
46748
46758
  label: 'Off'
@@ -46990,12 +47000,12 @@ var CustomSelectWrapper = styled__default.div(_templateObject4$B || (_templateOb
46990
47000
  });
46991
47001
  var CustomSelectTriggerStyled = styled__default(CustomSelectTrigger)(_templateObject5$w || (_templateObject5$w = _taggedTemplateLiteralLoose(["\n font-size: 15px;\n text-transform: none;\n"])));
46992
47002
  var CustomDropdownOptionLi = styled__default(DropdownOptionLi)(_templateObject6$u || (_templateObject6$u = _taggedTemplateLiteralLoose(["\n font-size: 15px;\n"])));
46993
- var CustomDropdownOptionsUl = styled__default(DropdownOptionsUl)(_templateObject7$r || (_templateObject7$r = _taggedTemplateLiteralLoose(["\n border-color: ", ";\n height: 268px;\n max-height: 268px;\n border-radius: 0;\n\n ", " {\n padding-left: 24px;\n padding-right: 24px;\n }\n"])), function (props) {
47003
+ var CustomDropdownOptionsUl = styled__default(DropdownOptionsUl)(_templateObject7$s || (_templateObject7$s = _taggedTemplateLiteralLoose(["\n border-color: ", ";\n height: 268px;\n max-height: 268px;\n border-radius: 0;\n\n ", " {\n padding-left: 24px;\n padding-right: 24px;\n }\n"])), function (props) {
46994
47004
  return props.accentColor;
46995
47005
  }, CustomDropdownOptionLi);
46996
47006
  var SetButton = styled__default(Button)(_templateObject8$p || (_templateObject8$p = _taggedTemplateLiteralLoose(["\n width: 57px;\n height: 36px;\n min-width: 57px;\n max-width: 57px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
46997
47007
 
46998
- var _templateObject$V, _templateObject2$Q, _templateObject3$J, _templateObject4$C, _templateObject5$x, _templateObject6$v, _templateObject7$s, _templateObject8$q;
47008
+ var _templateObject$V, _templateObject2$Q, _templateObject3$J, _templateObject4$C, _templateObject5$x, _templateObject6$v, _templateObject7$t, _templateObject8$q;
46999
47009
  var formatMemberCount = function formatMemberCount(count, channelType) {
47000
47010
  if (channelType === DEFAULT_CHANNEL_TYPE.BROADCAST || channelType === DEFAULT_CHANNEL_TYPE.PUBLIC) {
47001
47011
  return count + " " + (count > 1 ? 'subscribers' : 'subscriber');
@@ -47166,12 +47176,12 @@ var ChannelMembers$1 = styled__default.div(_templateObject5$x || (_templateObjec
47166
47176
  var LoadingText$1 = styled__default.div(_templateObject6$v || (_templateObject6$v = _taggedTemplateLiteralLoose(["\n text-align: center;\n padding: 20px;\n font-size: 14px;\n color: ", ";\n"])), function (props) {
47167
47177
  return props.color;
47168
47178
  });
47169
- var EmptyText = styled__default.div(_templateObject7$s || (_templateObject7$s = _taggedTemplateLiteralLoose(["\n text-align: center;\n padding: 40px 20px;\n font-size: 14px;\n color: ", ";\n"])), function (props) {
47179
+ var EmptyText = styled__default.div(_templateObject7$t || (_templateObject7$t = _taggedTemplateLiteralLoose(["\n text-align: center;\n padding: 40px 20px;\n font-size: 14px;\n color: ", ";\n"])), function (props) {
47170
47180
  return props.color;
47171
47181
  });
47172
47182
  var ChevronRightIconWrapper = styled__default.span(_templateObject8$q || (_templateObject8$q = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n\n & > svg {\n width: 16px;\n height: 16px;\n transform: rotate(-90deg);\n }\n"])));
47173
47183
 
47174
- var _templateObject$W, _templateObject2$R, _templateObject3$K, _templateObject4$D, _templateObject5$y, _templateObject6$w, _templateObject7$t, _templateObject8$r, _templateObject9$l, _templateObject0$j, _templateObject1$f, _templateObject10$9, _templateObject11$7, _templateObject12$6, _templateObject13$4, _templateObject14$3, _templateObject15$3, _templateObject16$3, _templateObject17$3, _templateObject18$3, _templateObject19$3, _templateObject20$3;
47184
+ var _templateObject$W, _templateObject2$R, _templateObject3$K, _templateObject4$D, _templateObject5$y, _templateObject6$w, _templateObject7$u, _templateObject8$r, _templateObject9$l, _templateObject0$j, _templateObject1$f, _templateObject10$9, _templateObject11$7, _templateObject12$6, _templateObject13$4, _templateObject14$3, _templateObject15$3, _templateObject16$3, _templateObject17$3, _templateObject18$3, _templateObject19$3, _templateObject20$3;
47175
47185
  var Actions = function Actions(_ref) {
47176
47186
  var _getDisappearingSetti;
47177
47187
  var setActionsHeight = _ref.setActionsHeight,
@@ -47701,7 +47711,7 @@ var MenuTriggerIcon = styled__default.span(_templateObject3$K || (_templateObjec
47701
47711
  var ActionsMenu = styled__default.ul(_templateObject4$D || (_templateObject4$D = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n margin: 0;\n padding: 0;\n list-style: none;\n transition: all 0.2s;\n"])));
47702
47712
  var DefaultMutedIcon = styled__default(SvgUnmuteNotifications)(_templateObject5$y || (_templateObject5$y = _taggedTemplateLiteralLoose([""])));
47703
47713
  var DefaultMuteIcon = styled__default(SvgNotifications)(_templateObject6$w || (_templateObject6$w = _taggedTemplateLiteralLoose([""])));
47704
- var DefaultStarIcon = styled__default(SvgStar)(_templateObject7$t || (_templateObject7$t = _taggedTemplateLiteralLoose([""])));
47714
+ var DefaultStarIcon = styled__default(SvgStar)(_templateObject7$u || (_templateObject7$u = _taggedTemplateLiteralLoose([""])));
47705
47715
  var DefaultUnpinIcon = styled__default(SvgUnpin)(_templateObject8$r || (_templateObject8$r = _taggedTemplateLiteralLoose([""])));
47706
47716
  var DefaultPinIcon = styled__default(SvgPin)(_templateObject9$l || (_templateObject9$l = _taggedTemplateLiteralLoose([""])));
47707
47717
  var DefaultMarkAsRead = styled__default(SvgMarkAsRead)(_templateObject0$j || (_templateObject0$j = _taggedTemplateLiteralLoose([""])));
@@ -47877,7 +47887,7 @@ function SvgDownloadFile(props) {
47877
47887
  })));
47878
47888
  }
47879
47889
 
47880
- var _templateObject$Z, _templateObject2$T, _templateObject3$L, _templateObject4$E, _templateObject5$z, _templateObject6$x, _templateObject7$u, _templateObject8$s;
47890
+ var _templateObject$Z, _templateObject2$T, _templateObject3$L, _templateObject4$E, _templateObject5$z, _templateObject6$x, _templateObject7$v, _templateObject8$s;
47881
47891
  var Files = function Files(_ref) {
47882
47892
  var channelId = _ref.channelId,
47883
47893
  filePreviewIcon = _ref.filePreviewIcon,
@@ -48019,7 +48029,7 @@ var FileHoverIconCont = styled__default.span(_templateObject5$z || (_templateObj
48019
48029
  return props.fillColor;
48020
48030
  });
48021
48031
  var FileThumb = styled__default.img(_templateObject6$x || (_templateObject6$x = _taggedTemplateLiteralLoose(["\n width: 40px;\n height: 40px;\n border: 0.5px solid rgba(0, 0, 0, 0.1);\n border-radius: 8px;\n object-fit: cover;\n"])));
48022
- var FileItem = styled__default.div(_templateObject7$u || (_templateObject7$u = _taggedTemplateLiteralLoose(["\n position: relative;\n padding: 11px 16px;\n display: flex;\n align-items: center;\n font-size: 15px;\n transition: all 0.2s;\n div {\n margin-left: 7px;\n width: calc(100% - 48px);\n }\n &:hover {\n background-color: ", ";\n ", " {\n visibility: visible;\n }\n & ", " {\n display: none;\n }\n & ", " {\n display: inline-flex;\n }\n }\n /*&.isHover {\n\n }*/\n"])), function (props) {
48032
+ var FileItem = styled__default.div(_templateObject7$v || (_templateObject7$v = _taggedTemplateLiteralLoose(["\n position: relative;\n padding: 11px 16px;\n display: flex;\n align-items: center;\n font-size: 15px;\n transition: all 0.2s;\n div {\n margin-left: 7px;\n width: calc(100% - 48px);\n }\n &:hover {\n background-color: ", ";\n ", " {\n visibility: visible;\n }\n & ", " {\n display: none;\n }\n & ", " {\n display: inline-flex;\n }\n }\n /*&.isHover {\n\n }*/\n"])), function (props) {
48023
48033
  return props.hoverBackgroundColor;
48024
48034
  }, DownloadWrapper, FileIconCont, FileHoverIconCont);
48025
48035
  var FileSizeAndDate = styled__default.span(_templateObject8$s || (_templateObject8$s = _taggedTemplateLiteralLoose(["\n display: block;\n font-style: normal;\n font-weight: normal;\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n margin-top: 2px;\n"])), function (props) {
@@ -48197,7 +48207,7 @@ function SvgVoicePreviewPause(props) {
48197
48207
  })));
48198
48208
  }
48199
48209
 
48200
- var _templateObject$10, _templateObject2$V, _templateObject3$N, _templateObject4$G, _templateObject5$B, _templateObject6$y, _templateObject7$v, _templateObject8$t;
48210
+ var _templateObject$10, _templateObject2$V, _templateObject3$N, _templateObject4$G, _templateObject5$B, _templateObject6$y, _templateObject7$w, _templateObject8$t;
48201
48211
  var VoiceItem = function VoiceItem(_ref) {
48202
48212
  var file = _ref.file,
48203
48213
  voicePreviewPlayIcon = _ref.voicePreviewPlayIcon,
@@ -48342,7 +48352,7 @@ var AudioTitle = styled__default.span(_templateObject5$B || (_templateObject5$B
48342
48352
  var AudioDate = styled__default.span(_templateObject6$y || (_templateObject6$y = _taggedTemplateLiteralLoose(["\n display: block;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n max-width: calc(100% - 72px);\n font-style: normal;\n font-weight: normal;\n font-size: 13px;\n line-height: 16px;\n color: ", ";\n"])), function (props) {
48343
48353
  return props.color;
48344
48354
  });
48345
- var AudioSendTime = styled__default.span(_templateObject7$v || (_templateObject7$v = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 0;\n top: 11px;\n color: ", ";\n font-size: 12px;\n line-height: 16px;\n"])), function (props) {
48355
+ var AudioSendTime = styled__default.span(_templateObject7$w || (_templateObject7$w = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 0;\n top: 11px;\n color: ", ";\n font-size: 12px;\n line-height: 16px;\n"])), function (props) {
48346
48356
  return props.color;
48347
48357
  });
48348
48358
  var Audio = styled__default.audio(_templateObject8$t || (_templateObject8$t = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
@@ -48586,7 +48596,7 @@ function ResetLinkConfirmModal(_ref) {
48586
48596
  });
48587
48597
  }
48588
48598
 
48589
- var _templateObject$13, _templateObject2$X, _templateObject3$P, _templateObject4$H, _templateObject5$C, _templateObject6$z, _templateObject7$w, _templateObject8$u, _templateObject9$m, _templateObject0$k, _templateObject1$g, _templateObject10$a, _templateObject11$8, _templateObject12$7, _templateObject13$5;
48599
+ var _templateObject$13, _templateObject2$X, _templateObject3$P, _templateObject4$H, _templateObject5$C, _templateObject6$z, _templateObject7$x, _templateObject8$u, _templateObject9$m, _templateObject0$k, _templateObject1$g, _templateObject10$a, _templateObject11$8, _templateObject12$7, _templateObject13$5;
48590
48600
  function InviteLinkModal(_ref) {
48591
48601
  var _getInviteLinkOptions, _tabs$link, _tabs$qr, _tabs$link2, _tabs$qr2;
48592
48602
  var onClose = _ref.onClose,
@@ -49090,7 +49100,7 @@ var LinkField = styled__default.div(_templateObject6$z || (_templateObject6$z =
49090
49100
  }, function (p) {
49091
49101
  return p.backgroundColor;
49092
49102
  });
49093
- var LinkInput = styled__default.input(_templateObject7$w || (_templateObject7$w = _taggedTemplateLiteralLoose(["\n flex: 1;\n border: none;\n outline: none;\n height: 40px;\n background: transparent;\n color: ", ";\n font-size: 14px;\n"])), function (p) {
49103
+ var LinkInput = styled__default.input(_templateObject7$x || (_templateObject7$x = _taggedTemplateLiteralLoose(["\n flex: 1;\n border: none;\n outline: none;\n height: 40px;\n background: transparent;\n color: ", ";\n font-size: 14px;\n"])), function (p) {
49094
49104
  return p.color;
49095
49105
  });
49096
49106
  var CopyButton = styled__default.button(_templateObject8$u || (_templateObject8$u = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n border: none;\n background: transparent;\n cursor: pointer;\n"])));
@@ -49114,7 +49124,7 @@ var QrHint = styled__default.p(_templateObject13$5 || (_templateObject13$5 = _ta
49114
49124
  return p.color;
49115
49125
  });
49116
49126
 
49117
- var _templateObject$14, _templateObject2$Y, _templateObject3$Q, _templateObject4$I, _templateObject5$D, _templateObject6$A, _templateObject7$x, _templateObject8$v, _templateObject9$n;
49127
+ var _templateObject$14, _templateObject2$Y, _templateObject3$Q, _templateObject4$I, _templateObject5$D, _templateObject6$A, _templateObject7$y, _templateObject8$v, _templateObject9$n;
49118
49128
  var Members = function Members(_ref) {
49119
49129
  var _members$find;
49120
49130
  var channel = _ref.channel,
@@ -49432,7 +49442,7 @@ var MemberName$3 = styled__default.h4(_templateObject5$D || (_templateObject5$D
49432
49442
  var EditMemberIcon = styled__default.span(_templateObject6$A || (_templateObject6$A = _taggedTemplateLiteralLoose(["\n margin-left: auto;\n cursor: pointer;\n padding: 15px;\n opacity: 0;\n visibility: hidden;\n transition: all 0.2s;\n\n & svg {\n color: ", ";\n }\n"])), function (props) {
49433
49443
  return props.color;
49434
49444
  });
49435
- var MembersList = styled__default.ul(_templateObject7$x || (_templateObject7$x = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n list-style: none;\n transition: all 0.2s;\n"])));
49445
+ var MembersList = styled__default.ul(_templateObject7$y || (_templateObject7$y = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n list-style: none;\n transition: all 0.2s;\n"])));
49436
49446
  var MemberItem$1 = styled__default.li(_templateObject8$v || (_templateObject8$v = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: ", ";\n font-weight: 500;\n padding: 6px 16px;\n transition: all 0.2s;\n color: ", ";\n cursor: pointer;\n\n & > svg {\n rect {\n fill: transparent;\n }\n }\n\n &:first-child {\n cursor: pointer;\n\n > svg {\n color: ", ";\n margin-right: 12px;\n & > rect {\n fill: ", " !important;\n }\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:hover ", " {\n opacity: 1;\n visibility: visible;\n }\n\n & .dropdown-wrapper {\n margin-left: auto;\n }\n\n & ", " {\n width: 12px;\n height: 12px;\n right: -1px;\n bottom: -1px;\n }\n"])), function (props) {
49437
49447
  return props.fontSize || '15px';
49438
49448
  }, function (props) {
@@ -49880,7 +49890,7 @@ var EditChannel = function EditChannel(_ref) {
49880
49890
  })));
49881
49891
  };
49882
49892
 
49883
- var _templateObject$17, _templateObject2$$, _templateObject3$S, _templateObject4$K, _templateObject5$E, _templateObject6$B, _templateObject7$y, _templateObject8$w, _templateObject9$o, _templateObject0$l, _templateObject1$h, _templateObject10$b, _templateObject11$9;
49893
+ var _templateObject$17, _templateObject2$$, _templateObject3$S, _templateObject4$K, _templateObject5$E, _templateObject6$B, _templateObject7$z, _templateObject8$w, _templateObject9$o, _templateObject0$l, _templateObject1$h, _templateObject10$b, _templateObject11$9;
49884
49894
  var Details = function Details(_ref) {
49885
49895
  var _activeChannel$member;
49886
49896
  var detailsTitleText = _ref.detailsTitleText,
@@ -50354,7 +50364,7 @@ var AboutChannelTitle = styled__default.h4(_templateObject5$E || (_templateObjec
50354
50364
  var AboutChannelText = styled__default.h3(_templateObject6$B || (_templateObject6$B = _taggedTemplateLiteralLoose(["\n font-size: 15px;\n margin: 0;\n font-weight: 400;\n line-height: 20px;\n color: ", ";\n"])), function (props) {
50355
50365
  return props.color;
50356
50366
  });
50357
- var ChannelInfo$5 = styled__default.div(_templateObject7$y || (_templateObject7$y = _taggedTemplateLiteralLoose(["\n position: relative;\n margin-left: ", ";\n margin-top: ", ";\n text-align: ", ";\n"])), function (props) {
50367
+ var ChannelInfo$5 = styled__default.div(_templateObject7$z || (_templateObject7$z = _taggedTemplateLiteralLoose(["\n position: relative;\n margin-left: ", ";\n margin-top: ", ";\n text-align: ", ";\n"])), function (props) {
50358
50368
  return (!props.direction || props.direction !== 'column') && '16px';
50359
50369
  }, function (props) {
50360
50370
  return props.direction && props.direction === 'column' && '16px';