sceyt-chat-react-uikit 1.6.8-beta.5 → 1.6.8-beta.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.modern.js CHANGED
@@ -9050,6 +9050,8 @@ var THEME_COLORS = {
9050
9050
  AVATAR_BRAND_2: 'avatarBrand2',
9051
9051
  AVATAR_BRAND_3: 'avatarBrand3',
9052
9052
  AVATAR_BRAND_4: 'avatarBrand4',
9053
+ AVATAR_BRAND_5: 'avatarBrand5',
9054
+ AVATAR_BRAND_6: 'avatarBrand6',
9053
9055
  TEXT_PRIMARY: 'textPrimary',
9054
9056
  TEXT_SECONDARY: 'textSecondary',
9055
9057
  TEXT_FOOTNOTE: 'textFootnote',
@@ -9075,7 +9077,8 @@ var THEME_COLORS = {
9075
9077
  INCOMING_MESSAGE_BACKGROUND: 'incomingMessageBackground',
9076
9078
  INCOMING_MESSAGE_BACKGROUND_X: 'incomingMessageBackgroundX',
9077
9079
  LINK_COLOR: 'linkColor',
9078
- HIGHLIGHTED_BACKGROUND: 'highlightedBackground'
9080
+ HIGHLIGHTED_BACKGROUND: 'highlightedBackground',
9081
+ TOOLTIP_BACKGROUND: 'tooltipBackground'
9079
9082
  };
9080
9083
  var defaultTheme = {
9081
9084
  colors: (_colors = {}, _colors[THEME_COLORS.ACCENT] = {
@@ -9093,6 +9096,12 @@ var defaultTheme = {
9093
9096
  }, _colors[THEME_COLORS.AVATAR_BRAND_4] = {
9094
9097
  light: '#67D292',
9095
9098
  dark: '#67D292'
9099
+ }, _colors[THEME_COLORS.AVATAR_BRAND_5] = {
9100
+ light: '#9F35E7',
9101
+ dark: '#9F35E7'
9102
+ }, _colors[THEME_COLORS.AVATAR_BRAND_6] = {
9103
+ light: '#63AFFF',
9104
+ dark: '#63AFFF'
9096
9105
  }, _colors[THEME_COLORS.BACKGROUND] = {
9097
9106
  light: '#FFFFFF',
9098
9107
  dark: '#19191B'
@@ -9171,6 +9180,9 @@ var defaultTheme = {
9171
9180
  }, _colors[THEME_COLORS.HIGHLIGHTED_BACKGROUND] = {
9172
9181
  light: '#C8D0FF',
9173
9182
  dark: '#3B3D68'
9183
+ }, _colors[THEME_COLORS.TOOLTIP_BACKGROUND] = {
9184
+ light: '#11153980',
9185
+ dark: '#00000080'
9174
9186
  }, _colors)
9175
9187
  };
9176
9188
  var defaultThemeMode = 'light';
@@ -10711,12 +10723,22 @@ function SvgPendingIcon(props) {
10711
10723
  })));
10712
10724
  }
10713
10725
 
10714
- var _avatarColors = ['#FF3E74', '#4F6AFF', '#FBB019', '#00CC99', '#9F35E7', '#63AFFF'];
10726
+ var avatarColors = {
10727
+ light: [defaultTheme.colors.avatarBrand1.light, defaultTheme.colors.avatarBrand2.light, defaultTheme.colors.avatarBrand3.light, defaultTheme.colors.avatarBrand4.light, defaultTheme.colors.avatarBrand5.light, defaultTheme.colors.avatarBrand6.light],
10728
+ dark: [defaultTheme.colors.avatarBrand1.dark, defaultTheme.colors.avatarBrand2.dark, defaultTheme.colors.avatarBrand3.dark, defaultTheme.colors.avatarBrand4.dark, defaultTheme.colors.avatarBrand5.dark, defaultTheme.colors.avatarBrand6.dark]
10729
+ };
10730
+ var _avatarColors = {
10731
+ light: avatarColors.light,
10732
+ dark: avatarColors.dark
10733
+ };
10715
10734
  var setAvatarColor = function setAvatarColor(colors) {
10716
- _avatarColors = colors;
10735
+ _avatarColors = {
10736
+ light: colors,
10737
+ dark: colors
10738
+ };
10717
10739
  };
10718
- var getAvatarColors = function getAvatarColors() {
10719
- return _avatarColors;
10740
+ var getAvatarColors = function getAvatarColors(theme) {
10741
+ return _avatarColors[theme];
10720
10742
  };
10721
10743
 
10722
10744
  var _path$4;
@@ -10898,8 +10920,8 @@ function md5(inputString) {
10898
10920
  return rh(a) + rh(b) + rh(c) + rh(d);
10899
10921
  }
10900
10922
  var GlobalStyles = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n\n .mention_menu_item-active {\n background: #e6f7ff;\n }\n\n @keyframes makeVisible {\n 0% {\n opacity: 0;\n visibility: visible;\n }\n 100% {\n opacity: 1;\n visibility: visible;\n }\n }\n"])));
10901
- function generateAvatarColor(itemName) {
10902
- var avatarColors = getAvatarColors();
10923
+ function generateAvatarColor(itemName, theme) {
10924
+ var avatarColors = getAvatarColors(theme);
10903
10925
  if (itemName && itemName !== '') {
10904
10926
  var hash = md5(itemName).toString().padStart(32, '0').slice(-6);
10905
10927
  var hashInt = parseInt(hash, 16);
@@ -11090,14 +11112,14 @@ var SectionHeader = styled.h4(_templateObject20 || (_templateObject20 = _taggedT
11090
11112
  }, function (props) {
11091
11113
  return props.uppercase && 'uppercase';
11092
11114
  });
11093
- var ItemNote = styled.div(_templateObject21 || (_templateObject21 = _taggedTemplateLiteralLoose(["\n display: none;\n position: absolute;\n z-index: 301;\n padding: 10px 12px;\n background-color: ", ";\n border-radius: 12px;\n font-size: 0.75rem;\n white-space: nowrap;\n font-weight: 600;\n color: white;\n pointer-events: none;\n user-select: none;\n\n &::before {\n content: '';\n position: absolute;\n z-index: -1;\n background-color: ", ";\n border-radius: 3px;\n width: 14px;\n height: 14px;\n\n ", " ", "\n }\n\n ", " ", " ", " ", "\n"])), function (props) {
11115
+ var ItemNote = styled.div(_templateObject21 || (_templateObject21 = _taggedTemplateLiteralLoose(["\n display: none;\n position: absolute;\n z-index: 301;\n padding: 10px 12px;\n background-color: ", ";\n border-radius: 12px;\n font-size: 0.75rem;\n white-space: nowrap;\n font-weight: 600;\n color: white;\n pointer-events: none;\n user-select: none;\n\n & > svg {\n width: 20px;\n height: 20px;\n color: ", ";\n fill: ", ";\n position: absolute;\n top: 100%;\n left: calc(50% - 10px);\n path {\n fill: ", " !important;\n }\n }\n ", " ", " ", " ", "\n"])), function (props) {
11094
11116
  return props.bgColor;
11095
11117
  }, function (props) {
11096
11118
  return props.bgColor;
11097
11119
  }, function (props) {
11098
- return props.direction === 'right' && "\n left: -5px;\n top: 50%;\n transform: translateY(-50%) rotate(45deg);\n ";
11120
+ return props.bgColor;
11099
11121
  }, function (props) {
11100
- return props.direction === 'top' && "\n bottom: -5px;\n left: 50%;\n transform: translateX(-50%) rotate(45deg);\n ";
11122
+ return props.bgColor;
11101
11123
  }, function (props) {
11102
11124
  return props.visible && "\n display: block;\n ";
11103
11125
  }, function (props) {
@@ -12251,6 +12273,17 @@ function watchForEvents() {
12251
12273
  }
12252
12274
  _context.next = 185;
12253
12275
  return put(updateChannelDataAC(_channel5.id, {
12276
+ messageCount: channelForAdd.messageCount,
12277
+ unread: channelForAdd.unread,
12278
+ newMessageCount: channelForAdd.newMessageCount,
12279
+ newMentionCount: channelForAdd.newMentionCount,
12280
+ newReactedMessageCount: channelForAdd.newReactedMessageCount,
12281
+ lastReceivedMsgId: channelForAdd.lastReceivedMsgId,
12282
+ lastDisplayedMessageId: channelForAdd.lastDisplayedMessageId,
12283
+ messageRetentionPeriod: channelForAdd.messageRetentionPeriod,
12284
+ lastMessage: channelForAdd.lastMessage,
12285
+ messages: channelForAdd.messages,
12286
+ newReactions: channelForAdd.newReactions,
12254
12287
  userMessageReactions: [],
12255
12288
  lastReactedMessage: null
12256
12289
  }));
@@ -12258,6 +12291,17 @@ function watchForEvents() {
12258
12291
  _groupName4 = getChannelGroupName(_channel5);
12259
12292
  _context.next = 188;
12260
12293
  return put(updateSearchedChannelDataAC(_channel5.id, {
12294
+ messageCount: channelForAdd.messageCount,
12295
+ unread: channelForAdd.unread,
12296
+ newMessageCount: channelForAdd.newMessageCount,
12297
+ newMentionCount: channelForAdd.newMentionCount,
12298
+ newReactedMessageCount: channelForAdd.newReactedMessageCount,
12299
+ lastReceivedMsgId: channelForAdd.lastReceivedMsgId,
12300
+ lastDisplayedMessageId: channelForAdd.lastDisplayedMessageId,
12301
+ messageRetentionPeriod: channelForAdd.messageRetentionPeriod,
12302
+ lastMessage: channelForAdd.lastMessage,
12303
+ messages: channelForAdd.messages,
12304
+ newReactions: channelForAdd.newReactions,
12261
12305
  userMessageReactions: [],
12262
12306
  lastReactedMessage: null
12263
12307
  }, _groupName4));
@@ -12317,8 +12361,19 @@ function watchForEvents() {
12317
12361
  return put(markMessagesAsDeliveredAC(_channel5.id, [message.id]));
12318
12362
  case 213:
12319
12363
  updateChannelOnAllChannels(_channel5.id, {
12320
- userMessageReactions: [],
12321
- lastReactedMessage: null
12364
+ messageCount: channelForAdd.messageCount,
12365
+ unread: channelForAdd.unread,
12366
+ newMessageCount: channelForAdd.newMessageCount,
12367
+ newMentionCount: channelForAdd.newMentionCount,
12368
+ newReactedMessageCount: channelForAdd.newReactedMessageCount,
12369
+ lastReceivedMsgId: channelForAdd.lastReceivedMsgId,
12370
+ lastDisplayedMessageId: channelForAdd.lastDisplayedMessageId,
12371
+ messageRetentionPeriod: channelForAdd.messageRetentionPeriod,
12372
+ lastMessage: channelForAdd.lastMessage,
12373
+ messages: channelForAdd.messages,
12374
+ newReactions: channelForAdd.newReactions,
12375
+ lastReactedMessage: _channel5.lastReactedMessage,
12376
+ userMessageReactions: _channel5.userMessageReactions
12322
12377
  });
12323
12378
  updateChannelLastMessageOnAllChannels(_channel5.id, _channel5.lastMessage);
12324
12379
  case 215:
@@ -18948,7 +19003,8 @@ var SceytChatContainer = function SceytChatContainer(_ref) {
18948
19003
  };
18949
19004
 
18950
19005
  var themeSelector = function themeSelector(store) {
18951
- return store.ThemeReducer.theme;
19006
+ var _store$ThemeReducer;
19007
+ return store === null || store === void 0 ? void 0 : (_store$ThemeReducer = store.ThemeReducer) === null || _store$ThemeReducer === void 0 ? void 0 : _store$ThemeReducer.theme;
18952
19008
  };
18953
19009
 
18954
19010
  var updateInterval;
@@ -19252,6 +19308,7 @@ var Avatar = function Avatar(_ref) {
19252
19308
  border = _ref.border,
19253
19309
  borderRadius = _ref.borderRadius,
19254
19310
  handleAvatarClick = _ref.handleAvatarClick;
19311
+ var theme = useSelector(themeSelector);
19255
19312
  var _useColor = useColors(),
19256
19313
  iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE];
19257
19314
  var isDeletedUserAvatar = !image && !name;
@@ -19279,7 +19336,8 @@ var Avatar = function Avatar(_ref) {
19279
19336
  textSize: textSize,
19280
19337
  onClick: handleAvatarClick,
19281
19338
  cursorPointer: !!handleAvatarClick,
19282
- borderRadius: borderRadius
19339
+ borderRadius: borderRadius,
19340
+ theme: theme
19283
19341
  }, isDeletedUserAvatar ? DeletedIcon || /*#__PURE__*/React__default.createElement(DeletedAvatarWrapper, {
19284
19342
  color: iconInactive
19285
19343
  }) : !image ? setDefaultAvatar ? DefaultAvatar || /*#__PURE__*/React__default.createElement(DefaultAvatarWrapper, {
@@ -19303,7 +19361,7 @@ var Container$1 = styled.div(_templateObject$3 || (_templateObject$3 = _taggedTe
19303
19361
  }, function (props) {
19304
19362
  return props.marginAuto ? 'auto' : '';
19305
19363
  }, function (props) {
19306
- return !props.isImage ? "background-color:" + generateAvatarColor(props.avatarName) + ";" : '';
19364
+ return !props.isImage ? "background-color:" + generateAvatarColor(props.avatarName, props.theme) + ";" : '';
19307
19365
  }, function (props) {
19308
19366
  return props.cursorPointer && 'pointer';
19309
19367
  }, function (props) {
@@ -19594,22 +19652,7 @@ var Channel = function Channel(_ref2) {
19594
19652
  color: iconInactive
19595
19653
  }, pinedIcon || /*#__PURE__*/React__default.createElement(SvgPin, null)))));
19596
19654
  };
19597
- var Container$2 = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n cursor: pointer;\n background-color: ", ";\n border-left: ", ";\n // padding: selectedChannel ? '8px 16px 8px 13px' : '8px 16px'\n padding: ", ";\n margin: ", ";\n border-radius: ", ";\n\n transition: all 0.2s;\n &:hover {\n ", "\n }\n"])), function (props) {
19598
- return props.selectedChannel ? props.selectedBackgroundColor : 'inherit';
19599
- }, function (props) {
19600
- return props.selectedChannel ? props.selectedChannelLeftBorder : null;
19601
- }, function (props) {
19602
- return props.selectedChannel ? props.selectedChannelPaddings || props.channelsPaddings || '8px' : props.channelsPaddings || '8px';
19603
- }, function (props) {
19604
- return props.channelsMargin || '0 8px';
19605
- }, function (props) {
19606
- return props.selectedChannelBorderRadius || '12px';
19607
- }, function (_ref3) {
19608
- var selectedChannel = _ref3.selectedChannel,
19609
- hoverBackground = _ref3.hoverBackground;
19610
- return !selectedChannel && "\n background-color: " + hoverBackground + ";\n ";
19611
- });
19612
- var ChannelInfo = styled.div(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n text-align: left;\n margin-left: ", ";\n width: 100%;\n max-width: ", ";\n\n h3 {\n display: inline-block;\n margin: 0;\n font-size: ", ";\n font-weight: 500;\n text-overflow: ellipsis;\n line-height: ", ";\n letter-spacing: -0.2px;%;\n max-width: ", ";\n overflow: hidden;\n white-space: nowrap;\n color: ", ";\n text-transform: ", ";\n }\n"])), function (props) {
19655
+ var ChannelInfo = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n text-align: left;\n margin-left: ", ";\n width: 100%;\n max-width: ", ";\n\n h3 {\n display: inline-block;\n margin: 0;\n font-size: ", ";\n font-weight: 500;\n text-overflow: ellipsis;\n line-height: ", ";\n letter-spacing: -0.2px;%;\n max-width: ", ";\n overflow: hidden;\n white-space: nowrap;\n color: ", ";\n text-transform: ", ";\n }\n"])), function (props) {
19613
19656
  return props.avatar && '12px';
19614
19657
  }, function (props) {
19615
19658
  return props.avatarSize ? "calc(100% - " + (props.avatarSize + 52) + "px)" : "calc(100% - " + (props.isPinned ? 92 : 72) + "px)";
@@ -19624,10 +19667,10 @@ var ChannelInfo = styled.div(_templateObject2$4 || (_templateObject2$4 = _tagged
19624
19667
  }, function (props) {
19625
19668
  return props.uppercase && 'uppercase';
19626
19669
  });
19627
- var MutedIcon = styled.span(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n & > svg {\n height: 16px;\n width: 16px;\n margin-left: 5px;\n color: ", ";\n }\n"])), function (props) {
19670
+ var MutedIcon = styled.span(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n & > svg {\n height: 16px;\n width: 16px;\n margin-left: 5px;\n color: ", ";\n }\n"])), function (props) {
19628
19671
  return props.color;
19629
19672
  });
19630
- var LastMessage = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: ", ";\n color: ", ";\n max-width: ", ";\n\n height: ", ";\n"])), function (props) {
19673
+ var LastMessage = styled.div(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: ", ";\n color: ", ";\n max-width: ", ";\n\n height: ", ";\n"])), function (props) {
19631
19674
  return props.fontSize || '14px';
19632
19675
  }, function (props) {
19633
19676
  return props.color;
@@ -19636,12 +19679,31 @@ var LastMessage = styled.div(_templateObject4$3 || (_templateObject4$3 = _tagged
19636
19679
  }, function (props) {
19637
19680
  return props.height || '20px';
19638
19681
  });
19639
- var AvatarWrapper = styled.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19640
- var UserStatus = styled.span(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid ", ";\n box-sizing: border-box;\n"])), function (props) {
19682
+ var AvatarWrapper = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19683
+ var UserStatus = styled.span(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 12px;\n height: 12px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid ", ";\n box-sizing: border-box;\n"])), function (props) {
19641
19684
  return props.backgroundColor || '#56E464';
19642
19685
  }, function (props) {
19643
19686
  return props.borderColor || '#ffffff';
19644
19687
  });
19688
+ var Container$2 = styled.div(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n cursor: pointer;\n background-color: ", ";\n border-left: ", ";\n // padding: selectedChannel ? '8px 16px 8px 13px' : '8px 16px'\n padding: ", ";\n margin: ", ";\n border-radius: ", ";\n\n transition: all 0.2s;\n &:hover {\n ", "\n ", " {\n border-color: ", ";\n }\n }\n ", " {\n ", "\n }\n"])), function (props) {
19689
+ return props.selectedChannel ? props.selectedBackgroundColor : 'inherit';
19690
+ }, function (props) {
19691
+ return props.selectedChannel ? props.selectedChannelLeftBorder : null;
19692
+ }, function (props) {
19693
+ return props.selectedChannel ? props.selectedChannelPaddings || props.channelsPaddings || '8px' : props.channelsPaddings || '8px';
19694
+ }, function (props) {
19695
+ return props.channelsMargin || '0 8px';
19696
+ }, function (props) {
19697
+ return props.selectedChannelBorderRadius || '12px';
19698
+ }, function (_ref3) {
19699
+ var selectedChannel = _ref3.selectedChannel,
19700
+ hoverBackground = _ref3.hoverBackground;
19701
+ return !selectedChannel && "\n background-color: " + hoverBackground + ";\n ";
19702
+ }, UserStatus, function (props) {
19703
+ return props.selectedChannel ? props.selectedBackgroundColor : props.hoverBackground;
19704
+ }, UserStatus, function (props) {
19705
+ return props.selectedChannel && "\n border-color: " + props.selectedBackgroundColor + ";\n ";
19706
+ });
19645
19707
  var DraftMessageTitle = styled.span(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (props) {
19646
19708
  return props.color;
19647
19709
  });
@@ -19812,14 +19874,7 @@ var ContactItem = function ContactItem(_ref) {
19812
19874
  textColor: textPrimary
19813
19875
  }, /*#__PURE__*/React__default.createElement("h3", null, contactUserName)));
19814
19876
  };
19815
- var Container$3 = styled.div(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n cursor: pointer;\n padding: ", ";\n margin: ", ";\n &:hover {\n background-color: ", ";\n }\n"])), function (props) {
19816
- return props.channelsPaddings || '8px';
19817
- }, function (props) {
19818
- return props.channelsMargin || '0 8px';
19819
- }, function (props) {
19820
- return props.hoverBackground;
19821
- });
19822
- var ChannelInfo$1 = styled.div(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n text-align: left;\n margin-left: ", ";\n width: 100%;\n max-width: calc(100% - 62px);\n\n h3 {\n display: inline-block;\n margin: 0;\n font-size: ", ";\n font-weight: 500;\n text-overflow: ellipsis;\n line-height: ", ";\n letter-spacing: -0.2px;%;\n max-width: calc(100% - 2px);\n overflow: hidden;\n white-space: nowrap;\n color: ", ";\n }\n"])), function (props) {
19877
+ var ChannelInfo$1 = styled.div(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n text-align: left;\n margin-left: ", ";\n width: 100%;\n max-width: calc(100% - 62px);\n\n h3 {\n display: inline-block;\n margin: 0;\n font-size: ", ";\n font-weight: 500;\n text-overflow: ellipsis;\n line-height: ", ";\n letter-spacing: -0.2px;%;\n max-width: calc(100% - 2px);\n overflow: hidden;\n white-space: nowrap;\n color: ", ";\n }\n"])), function (props) {
19823
19878
  return props.avatar && '12px';
19824
19879
  }, function (props) {
19825
19880
  return props.subjectFontSize || '15px';
@@ -19828,12 +19883,21 @@ var ChannelInfo$1 = styled.div(_templateObject2$6 || (_templateObject2$6 = _tagg
19828
19883
  }, function (props) {
19829
19884
  return props.subjectColor || props.textColor;
19830
19885
  });
19831
- var AvatarWrapper$1 = styled.div(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19832
- var UserStatus$1 = styled.span(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 14px;\n height: 14px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid ", ";\n box-sizing: border-box;\n"])), function (props) {
19886
+ var AvatarWrapper$1 = styled.div(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19887
+ var UserStatus$1 = styled.span(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 12px;\n height: 12px;\n right: 0;\n bottom: 0;\n border-radius: 50%;\n background-color: ", ";\n border: 2.5px solid ", ";\n box-sizing: border-box;\n"])), function (props) {
19833
19888
  return props.backgroundColor || '#56E464';
19834
19889
  }, function (props) {
19835
19890
  return props.borderColor || '#ffffff';
19836
19891
  });
19892
+ var Container$3 = styled.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n cursor: pointer;\n padding: ", ";\n margin: ", ";\n &:hover {\n background-color: ", ";\n ", " {\n border-color: ", ";\n }\n }\n"])), function (props) {
19893
+ return props.channelsPaddings || '8px';
19894
+ }, function (props) {
19895
+ return props.channelsMargin || '0 8px';
19896
+ }, function (props) {
19897
+ return props.hoverBackground;
19898
+ }, UserStatus$1, function (props) {
19899
+ return props.hoverBackground;
19900
+ });
19837
19901
 
19838
19902
  var _path$f;
19839
19903
  function _extends$g() {
@@ -24845,6 +24909,31 @@ function SvgReplyInThreadIcon(props) {
24845
24909
  })));
24846
24910
  }
24847
24911
 
24912
+ var _path$R;
24913
+ function _extends$S() {
24914
+ return _extends$S = Object.assign ? Object.assign.bind() : function (n) {
24915
+ for (var e = 1; e < arguments.length; e++) {
24916
+ var t = arguments[e];
24917
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
24918
+ }
24919
+ return n;
24920
+ }, _extends$S.apply(null, arguments);
24921
+ }
24922
+ function SvgArrowDown(props) {
24923
+ return /*#__PURE__*/createElement$1("svg", _extends$S({
24924
+ width: 20,
24925
+ height: 8,
24926
+ viewBox: "0 0 20 20",
24927
+ fill: "none",
24928
+ xmlns: "http://www.w3.org/2000/svg"
24929
+ }, props), _path$R || (_path$R = /*#__PURE__*/createElement$1("path", {
24930
+ fillRule: "evenodd",
24931
+ clipRule: "evenodd",
24932
+ d: "M10 8C7 8 4 0 0 0h20c-3.975 0-7 8-10 8z",
24933
+ fill: "currentColor"
24934
+ })));
24935
+ }
24936
+
24848
24937
  var _templateObject$r, _templateObject2$n, _templateObject3$h;
24849
24938
  function MessageActions(_ref) {
24850
24939
  var editModeToggle = _ref.editModeToggle,
@@ -24904,10 +24993,10 @@ function MessageActions(_ref) {
24904
24993
  accentColor = _useColor[THEME_COLORS.ACCENT],
24905
24994
  backgroundSections = _useColor[THEME_COLORS.BACKGROUND_SECTIONS],
24906
24995
  backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED],
24907
- surface2 = _useColor[THEME_COLORS.SURFACE_2],
24908
24996
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
24909
24997
  warningColor = _useColor[THEME_COLORS.WARNING],
24910
- iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE];
24998
+ iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE],
24999
+ tooltipBackground = _useColor[THEME_COLORS.TOOLTIP_BACKGROUND];
24911
25000
  var ChatClient = getClient();
24912
25001
  var user = ChatClient.user;
24913
25002
  var _usePermissions = usePermissions(myRole),
@@ -24938,9 +25027,9 @@ function MessageActions(_ref) {
24938
25027
  onClick: handleOpenReaction
24939
25028
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24940
25029
  disabledColor: textSecondary,
24941
- bgColor: surface2,
25030
+ bgColor: tooltipBackground,
24942
25031
  direction: 'top'
24943
- }, reactionIconTooltipText || 'React'), reactionIcon || /*#__PURE__*/React__default.createElement(SvgEmojiSmileIcon, null))), showEditMessage && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (isIncoming ? allowEditDeleteIncomingMessage : true) && editMessagePermitted && (isDirectChannel && directChannelUser ? !isIncoming && directChannelUser.state !== USER_STATE.DELETED : true) && (/*#__PURE__*/React__default.createElement(Action, {
25032
+ }, reactionIconTooltipText || 'React', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), reactionIcon || /*#__PURE__*/React__default.createElement(SvgEmojiSmileIcon, null))), showEditMessage && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (isIncoming ? allowEditDeleteIncomingMessage : true) && editMessagePermitted && (isDirectChannel && directChannelUser ? !isIncoming && directChannelUser.state !== USER_STATE.DELETED : true) && (/*#__PURE__*/React__default.createElement(Action, {
24944
25033
  order: editIconOrder || 1,
24945
25034
  iconColor: messageActionIconsColor || iconInactive,
24946
25035
  hoverBackgroundColor: backgroundHovered,
@@ -24950,9 +25039,9 @@ function MessageActions(_ref) {
24950
25039
  }
24951
25040
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24952
25041
  disabledColor: textSecondary,
24953
- bgColor: surface2,
25042
+ bgColor: tooltipBackground,
24954
25043
  direction: 'top'
24955
- }, editIconTooltipText || 'Edit Message'), editIcon || /*#__PURE__*/React__default.createElement(SvgEditIcon, null))), messageStatus === MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
25044
+ }, editIconTooltipText || 'Edit Message', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), editIcon || /*#__PURE__*/React__default.createElement(SvgEditIcon, null))), messageStatus === MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
24956
25045
  iconColor: messageActionIconsColor || iconInactive,
24957
25046
  hoverBackgroundColor: backgroundHovered,
24958
25047
  hoverIconColor: accentColor,
@@ -24961,9 +25050,9 @@ function MessageActions(_ref) {
24961
25050
  }
24962
25051
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24963
25052
  disabledColor: textSecondary,
24964
- bgColor: surface2,
25053
+ bgColor: tooltipBackground,
24965
25054
  direction: 'top'
24966
- }, ' ', "Resend Message", ' '), /*#__PURE__*/React__default.createElement(SvgResend, null))), !isThreadMessage && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, showReplyMessage && replyMessagePermitted && (isDirectChannel && directChannelUser ? directChannelUser.state !== USER_STATE.DELETED : true) && (/*#__PURE__*/React__default.createElement(Action, {
25055
+ }, ' ', "Resend Message ", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgResend, null))), !isThreadMessage && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, showReplyMessage && replyMessagePermitted && (isDirectChannel && directChannelUser ? directChannelUser.state !== USER_STATE.DELETED : true) && (/*#__PURE__*/React__default.createElement(Action, {
24967
25056
  order: replyIconOrder || 2,
24968
25057
  iconColor: messageActionIconsColor || iconInactive,
24969
25058
  hoverBackgroundColor: backgroundHovered,
@@ -24973,9 +25062,9 @@ function MessageActions(_ref) {
24973
25062
  }
24974
25063
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24975
25064
  disabledColor: textSecondary,
24976
- bgColor: surface2,
25065
+ bgColor: tooltipBackground,
24977
25066
  direction: 'top'
24978
- }, replyIconTooltipText || 'Reply'), replyIcon || /*#__PURE__*/React__default.createElement(SvgReplyIcon, null))), showReplyMessageInThread && replyMessagePermitted && (/*#__PURE__*/React__default.createElement(Action, {
25067
+ }, replyIconTooltipText || 'Reply', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), replyIcon || /*#__PURE__*/React__default.createElement(SvgReplyIcon, null))), showReplyMessageInThread && replyMessagePermitted && (/*#__PURE__*/React__default.createElement(Action, {
24979
25068
  order: replyInThreadIconOrder || 3,
24980
25069
  iconColor: messageActionIconsColor || iconInactive,
24981
25070
  hoverBackgroundColor: backgroundHovered,
@@ -24985,9 +25074,9 @@ function MessageActions(_ref) {
24985
25074
  }
24986
25075
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24987
25076
  disabledColor: textSecondary,
24988
- bgColor: surface2,
25077
+ bgColor: tooltipBackground,
24989
25078
  direction: 'top'
24990
- }, replyInThreadIconTooltipText || 'Reply in thread'), replyInThreadIcon || /*#__PURE__*/React__default.createElement(SvgReplyInThreadIcon, null))))), showCopyMessage && (/*#__PURE__*/React__default.createElement(Action, {
25079
+ }, replyInThreadIconTooltipText || 'Reply in thread', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), replyInThreadIcon || /*#__PURE__*/React__default.createElement(SvgReplyInThreadIcon, null))))), showCopyMessage && (/*#__PURE__*/React__default.createElement(Action, {
24991
25080
  order: copyIconOrder || 4,
24992
25081
  iconColor: messageActionIconsColor || iconInactive,
24993
25082
  hoverBackgroundColor: backgroundHovered,
@@ -24997,9 +25086,9 @@ function MessageActions(_ref) {
24997
25086
  }
24998
25087
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24999
25088
  disabledColor: textSecondary,
25000
- bgColor: surface2,
25089
+ bgColor: tooltipBackground,
25001
25090
  direction: 'top'
25002
- }, copyIconTooltipText || 'Copy'), copyIcon || /*#__PURE__*/React__default.createElement(SvgCopyIcon, null))), showForwardMessage && forwardMessagePermitted && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
25091
+ }, copyIconTooltipText || 'Copy', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), copyIcon || /*#__PURE__*/React__default.createElement(SvgCopyIcon, null))), showForwardMessage && forwardMessagePermitted && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
25003
25092
  order: forwardIconOrder || 5,
25004
25093
  iconColor: messageActionIconsColor || iconInactive,
25005
25094
  hoverBackgroundColor: backgroundHovered,
@@ -25009,9 +25098,9 @@ function MessageActions(_ref) {
25009
25098
  }
25010
25099
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
25011
25100
  disabledColor: textSecondary,
25012
- bgColor: surface2,
25101
+ bgColor: tooltipBackground,
25013
25102
  direction: 'top'
25014
- }, forwardIconTooltipText || 'Forward Message'), forwardIcon || /*#__PURE__*/React__default.createElement(SvgForward, null))), showSelectMessage && (/*#__PURE__*/React__default.createElement(Action, {
25103
+ }, forwardIconTooltipText || 'Forward Message', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), forwardIcon || /*#__PURE__*/React__default.createElement(SvgForward, null))), showSelectMessage && (/*#__PURE__*/React__default.createElement(Action, {
25015
25104
  order: selectIconOrder || 6,
25016
25105
  iconColor: messageActionIconsColor || iconInactive,
25017
25106
  hoverBackgroundColor: backgroundHovered,
@@ -25021,9 +25110,9 @@ function MessageActions(_ref) {
25021
25110
  }
25022
25111
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
25023
25112
  disabledColor: textSecondary,
25024
- bgColor: surface2,
25113
+ bgColor: tooltipBackground,
25025
25114
  direction: 'top'
25026
- }, selectIconTooltipText || 'Select'), selectIcon || /*#__PURE__*/React__default.createElement(SvgCheckCircle, null))), showDeleteMessage && (channel.type === DEFAULT_CHANNEL_TYPE.BROADCAST || channel.type === DEFAULT_CHANNEL_TYPE.PUBLIC ? myRole === 'owner' || myRole === 'admin' : true) && (/*#__PURE__*/React__default.createElement(Action, {
25115
+ }, selectIconTooltipText || 'Select', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), selectIcon || /*#__PURE__*/React__default.createElement(SvgCheckCircle, null))), showDeleteMessage && (channel.type === DEFAULT_CHANNEL_TYPE.BROADCAST || channel.type === DEFAULT_CHANNEL_TYPE.PUBLIC ? myRole === 'owner' || myRole === 'admin' : true) && (/*#__PURE__*/React__default.createElement(Action, {
25027
25116
  order: deleteIconOrder || 7,
25028
25117
  iconColor: messageActionIconsColor || warningColor,
25029
25118
  hoverBackgroundColor: backgroundHovered,
@@ -25033,9 +25122,9 @@ function MessageActions(_ref) {
25033
25122
  }
25034
25123
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
25035
25124
  disabledColor: textSecondary,
25036
- bgColor: surface2,
25125
+ bgColor: tooltipBackground,
25037
25126
  direction: 'top'
25038
- }, deleteIconTooltipText || 'Delete Message'), deleteIcon || /*#__PURE__*/React__default.createElement(SvgDeleteIcon, null))), showReportMessage && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
25127
+ }, deleteIconTooltipText || 'Delete Message', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), deleteIcon || /*#__PURE__*/React__default.createElement(SvgDeleteIcon, null))), showReportMessage && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
25039
25128
  order: reportIconOrder || 8,
25040
25129
  iconColor: messageActionIconsColor || iconInactive,
25041
25130
  hoverBackgroundColor: backgroundHovered,
@@ -25045,9 +25134,9 @@ function MessageActions(_ref) {
25045
25134
  }
25046
25135
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
25047
25136
  disabledColor: textSecondary,
25048
- bgColor: surface2,
25137
+ bgColor: tooltipBackground,
25049
25138
  direction: 'top'
25050
- }, reportIconTooltipText || 'Report'), reportIcon || /*#__PURE__*/React__default.createElement(SvgReportIcon, null)))));
25139
+ }, reportIconTooltipText || 'Report', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), reportIcon || /*#__PURE__*/React__default.createElement(SvgReportIcon, null)))));
25051
25140
  }
25052
25141
  var MessageActionsWrapper = styled.div(_templateObject$r || (_templateObject$r = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: ", ";\n right: ", ";\n direction: ", ";\n top: -46px;\n padding: 0 0 8px;\n z-index: 90;\n"])), function (_ref2) {
25053
25142
  var isThreadMessage = _ref2.isThreadMessage,
@@ -25074,18 +25163,18 @@ var Action = styled.div(_templateObject3$h || (_templateObject3$h = _taggedTempl
25074
25163
  return props.hoverBackgroundColor;
25075
25164
  }, ItemNote);
25076
25165
 
25077
- var _rect$1, _path$R;
25078
- function _extends$S() {
25079
- return _extends$S = Object.assign ? Object.assign.bind() : function (n) {
25166
+ var _rect$1, _path$S;
25167
+ function _extends$T() {
25168
+ return _extends$T = Object.assign ? Object.assign.bind() : function (n) {
25080
25169
  for (var e = 1; e < arguments.length; e++) {
25081
25170
  var t = arguments[e];
25082
25171
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25083
25172
  }
25084
25173
  return n;
25085
- }, _extends$S.apply(null, arguments);
25174
+ }, _extends$T.apply(null, arguments);
25086
25175
  }
25087
25176
  function SvgFileIcon(props) {
25088
- return /*#__PURE__*/createElement$1("svg", _extends$S({
25177
+ return /*#__PURE__*/createElement$1("svg", _extends$T({
25089
25178
  width: 40,
25090
25179
  height: 40,
25091
25180
  viewBox: "0 0 40.01 40.01",
@@ -25096,24 +25185,24 @@ function SvgFileIcon(props) {
25096
25185
  height: 40,
25097
25186
  rx: 20,
25098
25187
  fill: "Transparent"
25099
- })), _path$R || (_path$R = /*#__PURE__*/createElement$1("path", {
25188
+ })), _path$S || (_path$S = /*#__PURE__*/createElement$1("path", {
25100
25189
  d: "M22.48 10.097c.298.068.56.177.819.338.258.162.468.332 1.015.88l3.372 3.37c.547.548.717.758.879 1.016.161.258.27.521.338.818.069.297.097.565.097 1.34v7.295c0 1.337-.14 1.822-.4 2.311a2.726 2.726 0 01-1.135 1.134c-.489.262-.974.401-2.31.401h-9.31c-1.337 0-1.821-.14-2.31-.4a2.726 2.726 0 01-1.134-1.135c-.262-.489-.401-.974-.401-2.31v-11.31c0-1.337.14-1.821.4-2.31a2.726 2.726 0 011.135-1.134c.489-.262.973-.401 2.31-.401h5.296c.775 0 1.043.028 1.34.097zm-.68 1.827a.3.3 0 00-.3.3V16a.5.5 0 00.5.5h3.776a.3.3 0 00.212-.512l-3.976-3.976a.3.3 0 00-.212-.088z",
25101
25190
  fill: "#fff"
25102
25191
  })));
25103
25192
  }
25104
25193
 
25105
- var _circle$2, _path$S;
25106
- function _extends$T() {
25107
- return _extends$T = Object.assign ? Object.assign.bind() : function (n) {
25194
+ var _circle$2, _path$T;
25195
+ function _extends$U() {
25196
+ return _extends$U = Object.assign ? Object.assign.bind() : function (n) {
25108
25197
  for (var e = 1; e < arguments.length; e++) {
25109
25198
  var t = arguments[e];
25110
25199
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25111
25200
  }
25112
25201
  return n;
25113
- }, _extends$T.apply(null, arguments);
25202
+ }, _extends$U.apply(null, arguments);
25114
25203
  }
25115
25204
  function SvgDeleteUpload(props) {
25116
- return /*#__PURE__*/createElement$1("svg", _extends$T({
25205
+ return /*#__PURE__*/createElement$1("svg", _extends$U({
25117
25206
  width: 20,
25118
25207
  height: 20,
25119
25208
  viewBox: "0 0 20.01 20.01",
@@ -25126,7 +25215,7 @@ function SvgDeleteUpload(props) {
25126
25215
  fill: "CurrentColor",
25127
25216
  stroke: "#fff",
25128
25217
  strokeWidth: 1.4
25129
- })), _path$S || (_path$S = /*#__PURE__*/createElement$1("path", {
25218
+ })), _path$T || (_path$T = /*#__PURE__*/createElement$1("path", {
25130
25219
  d: "M13.5 6.5l-7 7M6.5 6.5l7 7",
25131
25220
  stroke: "#fff",
25132
25221
  strokeWidth: 1.4,
@@ -25135,24 +25224,24 @@ function SvgDeleteUpload(props) {
25135
25224
  })));
25136
25225
  }
25137
25226
 
25138
- var _path$T;
25139
- function _extends$U() {
25140
- return _extends$U = Object.assign ? Object.assign.bind() : function (n) {
25227
+ var _path$U;
25228
+ function _extends$V() {
25229
+ return _extends$V = Object.assign ? Object.assign.bind() : function (n) {
25141
25230
  for (var e = 1; e < arguments.length; e++) {
25142
25231
  var t = arguments[e];
25143
25232
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25144
25233
  }
25145
25234
  return n;
25146
- }, _extends$U.apply(null, arguments);
25235
+ }, _extends$V.apply(null, arguments);
25147
25236
  }
25148
25237
  function SvgUpload(props) {
25149
- return /*#__PURE__*/createElement$1("svg", _extends$U({
25238
+ return /*#__PURE__*/createElement$1("svg", _extends$V({
25150
25239
  width: 32,
25151
25240
  height: 32,
25152
25241
  viewBox: "0 0 32.01 32.01",
25153
25242
  fill: "none",
25154
25243
  xmlns: "http://www.w3.org/2000/svg"
25155
- }, props), _path$T || (_path$T = /*#__PURE__*/createElement$1("path", {
25244
+ }, props), _path$U || (_path$U = /*#__PURE__*/createElement$1("path", {
25156
25245
  fillRule: "evenodd",
25157
25246
  clipRule: "evenodd",
25158
25247
  d: "M14.5 20.5a1.5 1.5 0 003 0V7.121l4.44 4.44a1.5 1.5 0 002.12-2.122l-7-7a1.5 1.5 0 00-2.12 0l-7 7a1.5 1.5 0 002.12 2.122l4.44-4.44V20.5zm-9 4.5a1.5 1.5 0 000 3h21a1.5 1.5 0 000-3h-21z",
@@ -25160,18 +25249,18 @@ function SvgUpload(props) {
25160
25249
  })));
25161
25250
  }
25162
25251
 
25163
- var _circle$3, _path$U;
25164
- function _extends$V() {
25165
- return _extends$V = Object.assign ? Object.assign.bind() : function (n) {
25252
+ var _circle$3, _path$V;
25253
+ function _extends$W() {
25254
+ return _extends$W = Object.assign ? Object.assign.bind() : function (n) {
25166
25255
  for (var e = 1; e < arguments.length; e++) {
25167
25256
  var t = arguments[e];
25168
25257
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25169
25258
  }
25170
25259
  return n;
25171
- }, _extends$V.apply(null, arguments);
25260
+ }, _extends$W.apply(null, arguments);
25172
25261
  }
25173
25262
  function SvgPlayVideo(props) {
25174
- return /*#__PURE__*/createElement$1("svg", _extends$V({
25263
+ return /*#__PURE__*/createElement$1("svg", _extends$W({
25175
25264
  width: 56,
25176
25265
  height: 56,
25177
25266
  fill: "none",
@@ -25182,7 +25271,7 @@ function SvgPlayVideo(props) {
25182
25271
  r: 28,
25183
25272
  fill: "#17191C",
25184
25273
  fillOpacity: 0.4
25185
- })), _path$U || (_path$U = /*#__PURE__*/createElement$1("path", {
25274
+ })), _path$V || (_path$V = /*#__PURE__*/createElement$1("path", {
25186
25275
  d: "M38.048 26.262c1.27.767 1.27 2.706 0 3.473l-13.224 7.996c-1.258.76-2.824-.202-2.824-1.737V20.003c0-1.535 1.566-2.498 2.824-1.737l13.224 7.996z",
25187
25276
  fill: "#fff"
25188
25277
  })));
@@ -25377,18 +25466,18 @@ var AttachmentImg = styled.img(_templateObject7$a || (_templateObject7$a = _tagg
25377
25466
  return props.borderRadius || '6px';
25378
25467
  });
25379
25468
 
25380
- var _circle$4, _path$V;
25381
- function _extends$W() {
25382
- return _extends$W = Object.assign ? Object.assign.bind() : function (n) {
25469
+ var _circle$4, _path$W;
25470
+ function _extends$X() {
25471
+ return _extends$X = Object.assign ? Object.assign.bind() : function (n) {
25383
25472
  for (var e = 1; e < arguments.length; e++) {
25384
25473
  var t = arguments[e];
25385
25474
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25386
25475
  }
25387
25476
  return n;
25388
- }, _extends$W.apply(null, arguments);
25477
+ }, _extends$X.apply(null, arguments);
25389
25478
  }
25390
25479
  function SvgPlay(props) {
25391
- return /*#__PURE__*/createElement$1("svg", _extends$W({
25480
+ return /*#__PURE__*/createElement$1("svg", _extends$X({
25392
25481
  width: 32,
25393
25482
  height: 32,
25394
25483
  viewBox: "0 0 33 33",
@@ -25399,24 +25488,24 @@ function SvgPlay(props) {
25399
25488
  cy: 16,
25400
25489
  r: 16,
25401
25490
  fill: "CurrentColor"
25402
- })), _path$V || (_path$V = /*#__PURE__*/createElement$1("path", {
25491
+ })), _path$W || (_path$W = /*#__PURE__*/createElement$1("path", {
25403
25492
  d: "M21.652 15.022c.714.432.714 1.522 0 1.954l-7.438 4.498c-.708.428-1.589-.114-1.589-.977v-8.995c0-.864.88-1.405 1.589-.977l7.438 4.497z",
25404
25493
  fill: "#fff"
25405
25494
  })));
25406
25495
  }
25407
25496
 
25408
- var _circle$5, _path$W;
25409
- function _extends$X() {
25410
- return _extends$X = Object.assign ? Object.assign.bind() : function (n) {
25497
+ var _circle$5, _path$X;
25498
+ function _extends$Y() {
25499
+ return _extends$Y = Object.assign ? Object.assign.bind() : function (n) {
25411
25500
  for (var e = 1; e < arguments.length; e++) {
25412
25501
  var t = arguments[e];
25413
25502
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25414
25503
  }
25415
25504
  return n;
25416
- }, _extends$X.apply(null, arguments);
25505
+ }, _extends$Y.apply(null, arguments);
25417
25506
  }
25418
25507
  function SvgPause(props) {
25419
- return /*#__PURE__*/createElement$1("svg", _extends$X({
25508
+ return /*#__PURE__*/createElement$1("svg", _extends$Y({
25420
25509
  width: 32,
25421
25510
  height: 32,
25422
25511
  viewBox: "0 0 33 33",
@@ -25427,7 +25516,7 @@ function SvgPause(props) {
25427
25516
  cy: 16,
25428
25517
  r: 16,
25429
25518
  fill: "CurrentColor"
25430
- })), _path$W || (_path$W = /*#__PURE__*/createElement$1("path", {
25519
+ })), _path$X || (_path$X = /*#__PURE__*/createElement$1("path", {
25431
25520
  d: "M13.721 10.375c.401 0 .547.042.694.12a.818.818 0 01.34.34c.078.147.12.293.12.694v8.942c0 .401-.042.547-.12.694a.818.818 0 01-.34.34c-.147.078-.293.12-.694.12h-1.067c-.401 0-.547-.042-.694-.12a.818.818 0 01-.34-.34c-.078-.147-.12-.293-.12-.694V11.53c0-.401.042-.547.12-.694a.818.818 0 01.34-.34c.147-.078.293-.12.694-.12h1.067zm5.625 0c.401 0 .547.042.694.12a.818.818 0 01.34.34c.078.147.12.293.12.694v8.942c0 .401-.042.547-.12.694a.818.818 0 01-.34.34c-.147.078-.293.12-.694.12H18.28c-.401 0-.547-.042-.694-.12a.818.818 0 01-.34-.34c-.078-.147-.12-.293-.12-.694V11.53c0-.401.042-.547.12-.694a.818.818 0 01.34-.34c.147-.078.293-.12.694-.12h1.067z",
25432
25521
  fill: "#fff"
25433
25522
  })));
@@ -28314,24 +28403,24 @@ var MessageHeaderCont = styled.div(_templateObject$w || (_templateObject$w = _ta
28314
28403
  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');
28315
28404
  });
28316
28405
 
28317
- var _path$X;
28318
- function _extends$Y() {
28319
- return _extends$Y = Object.assign ? Object.assign.bind() : function (n) {
28406
+ var _path$Y;
28407
+ function _extends$Z() {
28408
+ return _extends$Z = Object.assign ? Object.assign.bind() : function (n) {
28320
28409
  for (var e = 1; e < arguments.length; e++) {
28321
28410
  var t = arguments[e];
28322
28411
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28323
28412
  }
28324
28413
  return n;
28325
- }, _extends$Y.apply(null, arguments);
28414
+ }, _extends$Z.apply(null, arguments);
28326
28415
  }
28327
28416
  function SvgEmojiAnimalIcon(props) {
28328
- return /*#__PURE__*/createElement$1("svg", _extends$Y({
28417
+ return /*#__PURE__*/createElement$1("svg", _extends$Z({
28329
28418
  width: 20,
28330
28419
  height: 20,
28331
28420
  viewBox: "0 0 20.01 20.01",
28332
28421
  fill: "none",
28333
28422
  xmlns: "http://www.w3.org/2000/svg"
28334
- }, props), _path$X || (_path$X = /*#__PURE__*/createElement$1("path", {
28423
+ }, props), _path$Y || (_path$Y = /*#__PURE__*/createElement$1("path", {
28335
28424
  fillRule: "evenodd",
28336
28425
  clipRule: "evenodd",
28337
28426
  d: "M7.188 3.875a.813.813 0 100 1.625.813.813 0 000-1.625zm-2.313.813a2.312 2.312 0 114.625 0 2.312 2.312 0 01-4.625 0zm7.938-.813a.813.813 0 100 1.625.813.813 0 000-1.625zm-2.313.813a2.312 2.312 0 114.625 0 2.312 2.312 0 01-4.625 0zM3.437 7.624a.813.813 0 100 1.625.813.813 0 000-1.625zm-2.312.813a2.312 2.312 0 114.625 0 2.312 2.312 0 01-4.625 0zm15.438-.813a.813.813 0 100 1.625.813.813 0 000-1.625zm-2.313.813a2.312 2.312 0 114.625 0 2.312 2.312 0 01-4.625 0zm-6.393-.359a3.563 3.563 0 015.567 1.862c.193.672.643 1.24 1.252 1.582a3.25 3.25 0 01-1.548 6.102h-.002c-.435 0-.864-.086-1.265-.253a4.859 4.859 0 00-3.722 0h.001a3.28 3.28 0 01-1.265.253h-.003a3.25 3.25 0 01-1.548-6.101A2.657 2.657 0 006.576 9.94a3.563 3.563 0 011.28-1.862zM10 8.863a2.062 2.062 0 00-1.982 1.493 4.156 4.156 0 01-1.964 2.478l-.008.004a1.75 1.75 0 001.517 3.15l.001-.001a6.358 6.358 0 014.872 0h.001a1.75 1.75 0 001.516-3.15l-.007-.003a4.156 4.156 0 01-1.964-2.478A2.062 2.062 0 0010 8.863z",
@@ -28339,24 +28428,24 @@ function SvgEmojiAnimalIcon(props) {
28339
28428
  })));
28340
28429
  }
28341
28430
 
28342
- var _path$Y, _path2$5, _path3$2;
28343
- function _extends$Z() {
28344
- return _extends$Z = Object.assign ? Object.assign.bind() : function (n) {
28431
+ var _path$Z, _path2$5, _path3$2;
28432
+ function _extends$_() {
28433
+ return _extends$_ = Object.assign ? Object.assign.bind() : function (n) {
28345
28434
  for (var e = 1; e < arguments.length; e++) {
28346
28435
  var t = arguments[e];
28347
28436
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28348
28437
  }
28349
28438
  return n;
28350
- }, _extends$Z.apply(null, arguments);
28439
+ }, _extends$_.apply(null, arguments);
28351
28440
  }
28352
28441
  function SvgEmojiFoodIcon(props) {
28353
- return /*#__PURE__*/createElement$1("svg", _extends$Z({
28442
+ return /*#__PURE__*/createElement$1("svg", _extends$_({
28354
28443
  width: 20,
28355
28444
  height: 20,
28356
28445
  viewBox: "0 0 20.01 20.01",
28357
28446
  fill: "none",
28358
28447
  xmlns: "http://www.w3.org/2000/svg"
28359
- }, props), _path$Y || (_path$Y = /*#__PURE__*/createElement$1("path", {
28448
+ }, props), _path$Z || (_path$Z = /*#__PURE__*/createElement$1("path", {
28360
28449
  fillRule: "evenodd",
28361
28450
  clipRule: "evenodd",
28362
28451
  d: "M12.143 7.855c0-.395.32-.714.714-.714.779 0 1.501.261 2.033.779.535.52.824 1.249.824 2.078a.714.714 0 11-1.428 0c0-.49-.165-.833-.392-1.054-.23-.224-.579-.375-1.037-.375a.714.714 0 01-.714-.714z",
@@ -28374,24 +28463,24 @@ function SvgEmojiFoodIcon(props) {
28374
28463
  })));
28375
28464
  }
28376
28465
 
28377
- var _path$Z;
28378
- function _extends$_() {
28379
- return _extends$_ = Object.assign ? Object.assign.bind() : function (n) {
28466
+ var _path$_;
28467
+ function _extends$$() {
28468
+ return _extends$$ = Object.assign ? Object.assign.bind() : function (n) {
28380
28469
  for (var e = 1; e < arguments.length; e++) {
28381
28470
  var t = arguments[e];
28382
28471
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28383
28472
  }
28384
28473
  return n;
28385
- }, _extends$_.apply(null, arguments);
28474
+ }, _extends$$.apply(null, arguments);
28386
28475
  }
28387
28476
  function SvgEmojiTravelIcon(props) {
28388
- return /*#__PURE__*/createElement$1("svg", _extends$_({
28477
+ return /*#__PURE__*/createElement$1("svg", _extends$$({
28389
28478
  width: 20,
28390
28479
  height: 20,
28391
28480
  viewBox: "0 0 20.01 20.01",
28392
28481
  fill: "none",
28393
28482
  xmlns: "http://www.w3.org/2000/svg"
28394
- }, props), _path$Z || (_path$Z = /*#__PURE__*/createElement$1("path", {
28483
+ }, props), _path$_ || (_path$_ = /*#__PURE__*/createElement$1("path", {
28395
28484
  fillRule: "evenodd",
28396
28485
  clipRule: "evenodd",
28397
28486
  d: "M13.763 2.458a2.6 2.6 0 013.748 3.604l-2.135 2.236a5.065 5.065 0 00-.188.204.076.076 0 00-.004.017l.004.03c.008.05.024.116.053.241l1.327 5.754.012.05c.044.189.096.412.079.639-.015.197-.07.39-.162.564-.106.202-.268.364-.406.5l-.036.037-.306.306c-.215.215-.409.408-.58.55-.175.147-.406.309-.705.362a1.46 1.46 0 01-1.124-.266c-.244-.18-.378-.429-.47-.638-.089-.204-.175-.464-.272-.752l-1.2-3.6-1.779 1.78a4.815 4.815 0 00-.172.178.076.076 0 00-.005.015l.001.027c.003.045.01.105.022.22l.141 1.27.005.045c.02.168.042.368.01.567a1.46 1.46 0 01-.172.49c-.1.176-.242.317-.362.437l-.032.032-.152.151-.018.019c-.166.166-.32.32-.46.438-.15.125-.338.258-.583.322a1.46 1.46 0 01-1.007-.1 1.49 1.49 0 01-.508-.43c-.114-.142-.236-.325-.366-.52l-1.22-1.83a4.929 4.929 0 00-.063-.09l-.009-.006a4.655 4.655 0 00-.077-.052l-1.829-1.22a7.783 7.783 0 01-.52-.365 1.492 1.492 0 01-.43-.509 1.46 1.46 0 01-.1-1.006c.065-.245.197-.434.323-.584.117-.14.272-.294.438-.46l.018-.018.152-.152.031-.032c.12-.12.262-.262.437-.362.152-.086.318-.145.49-.172a2.09 2.09 0 01.568.01l.044.005 1.27.141a4.747 4.747 0 00.247.023.075.075 0 00.015-.005 4.867 4.867 0 00.178-.172l1.78-1.78-3.6-1.199a9.48 9.48 0 01-.752-.272c-.209-.092-.457-.226-.638-.47a1.46 1.46 0 01-.265-1.124c.053-.298.215-.53.36-.705.143-.171.337-.365.552-.58l.02-.02.285-.285.037-.037c.136-.137.298-.3.5-.406a1.46 1.46 0 01.564-.161c.228-.018.45.034.64.078l.05.012 5.731 1.323a5.096 5.096 0 00.275.057.075.075 0 00.019-.005 5.146 5.146 0 00.199-.197l2.082-2.152zm2.728.948a1.216 1.216 0 00-1.734.014l-2.082 2.151-.036.037c-.132.137-.288.3-.483.407a1.46 1.46 0 01-.602.178c-.223.016-.442-.036-.627-.079l-.05-.011L5.146 4.78a5.06 5.06 0 00-.279-.059.077.077 0 00-.017.005 5.065 5.065 0 00-.205.197l-.285.285c-.243.243-.39.392-.487.508a.915.915 0 00-.063.083c0 .006.002.012.004.018.016.01.045.025.094.046.138.06.337.128.662.236l4.633 1.544a.692.692 0 01.27 1.146l-2.57 2.57-.032.032c-.12.12-.261.262-.436.362a1.459 1.459 0 01-.492.172 2.09 2.09 0 01-.567-.01l-.044-.005-1.27-.141a4.747 4.747 0 00-.247-.023.075.075 0 00-.015.005 4.867 4.867 0 00-.178.172l-.152.152c-.19.19-.301.302-.375.39a.735.735 0 00-.045.058c0 .008 0 .015.002.023.01.009.027.025.056.048.09.072.22.16.444.309l1.808 1.205.015.01a1.466 1.466 0 01.507.507l.01.016 1.206 1.807c.15.225.237.355.308.444.024.03.04.047.049.056a.076.076 0 00.022.002.723.723 0 00.059-.045c.087-.073.199-.184.39-.375l.151-.151a4.89 4.89 0 00.172-.178.077.077 0 00.005-.016v-.026a4.94 4.94 0 00-.023-.22l-.14-1.27-.006-.045a2.091 2.091 0 01-.01-.567 1.46 1.46 0 01.172-.491c.1-.175.242-.317.363-.437l.031-.031 2.57-2.57a.692.692 0 011.146.27L13.9 15.43c.109.325.175.523.236.662a.9.9 0 00.046.093.073.073 0 00.019.004.917.917 0 00.083-.063c.116-.096.264-.244.507-.486l.285-.285a5.078 5.078 0 00.197-.206.073.073 0 00.005-.017 5.042 5.042 0 00-.058-.279l-1.328-5.753-.011-.049c-.044-.184-.095-.401-.079-.624a1.46 1.46 0 01.152-.553c.1-.199.255-.36.386-.496l.034-.037 2.136-2.236a1.216 1.216 0 00-.02-1.7z",
@@ -28400,17 +28489,17 @@ function SvgEmojiTravelIcon(props) {
28400
28489
  }
28401
28490
 
28402
28491
  var _g, _defs$1;
28403
- function _extends$$() {
28404
- return _extends$$ = Object.assign ? Object.assign.bind() : function (n) {
28492
+ function _extends$10() {
28493
+ return _extends$10 = Object.assign ? Object.assign.bind() : function (n) {
28405
28494
  for (var e = 1; e < arguments.length; e++) {
28406
28495
  var t = arguments[e];
28407
28496
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28408
28497
  }
28409
28498
  return n;
28410
- }, _extends$$.apply(null, arguments);
28499
+ }, _extends$10.apply(null, arguments);
28411
28500
  }
28412
28501
  function SvgEmojiObjectIcon(props) {
28413
- return /*#__PURE__*/createElement$1("svg", _extends$$({
28502
+ return /*#__PURE__*/createElement$1("svg", _extends$10({
28414
28503
  width: 20,
28415
28504
  height: 20,
28416
28505
  viewBox: "0 0 20.01 20.01",
@@ -28431,24 +28520,24 @@ function SvgEmojiObjectIcon(props) {
28431
28520
  })))));
28432
28521
  }
28433
28522
 
28434
- var _path$_;
28435
- function _extends$10() {
28436
- return _extends$10 = Object.assign ? Object.assign.bind() : function (n) {
28523
+ var _path$$;
28524
+ function _extends$11() {
28525
+ return _extends$11 = Object.assign ? Object.assign.bind() : function (n) {
28437
28526
  for (var e = 1; e < arguments.length; e++) {
28438
28527
  var t = arguments[e];
28439
28528
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28440
28529
  }
28441
28530
  return n;
28442
- }, _extends$10.apply(null, arguments);
28531
+ }, _extends$11.apply(null, arguments);
28443
28532
  }
28444
28533
  function SvgEmojiSymbolsIcon(props) {
28445
- return /*#__PURE__*/createElement$1("svg", _extends$10({
28534
+ return /*#__PURE__*/createElement$1("svg", _extends$11({
28446
28535
  width: 20,
28447
28536
  height: 20,
28448
28537
  viewBox: "0 0 20.01 20.01",
28449
28538
  fill: "none",
28450
28539
  xmlns: "http://www.w3.org/2000/svg"
28451
- }, props), _path$_ || (_path$_ = /*#__PURE__*/createElement$1("path", {
28540
+ }, props), _path$$ || (_path$$ = /*#__PURE__*/createElement$1("path", {
28452
28541
  fillRule: "evenodd",
28453
28542
  clipRule: "evenodd",
28454
28543
  d: "M8.04 1.76a.75.75 0 01.616.863l-.548 3.294h5.146l.59-3.54a.75.75 0 111.48.246l-.55 3.294h2.31a.75.75 0 010 1.5h-2.56l-.86 5.167h2.586a.75.75 0 110 1.5h-2.837l-.59 3.54a.75.75 0 11-1.48-.247l.55-3.293H6.745l-.59 3.54a.75.75 0 11-1.48-.247l.55-3.293H2.083a.75.75 0 010-1.5h3.393l.86-5.167h-3.42a.75.75 0 110-1.5h3.67l.59-3.54a.75.75 0 01.864-.617zm-.182 5.657l-.862 5.167h5.146l.862-5.167H7.858z",
@@ -28456,24 +28545,24 @@ function SvgEmojiSymbolsIcon(props) {
28456
28545
  })));
28457
28546
  }
28458
28547
 
28459
- var _path$$;
28460
- function _extends$11() {
28461
- return _extends$11 = Object.assign ? Object.assign.bind() : function (n) {
28548
+ var _path$10;
28549
+ function _extends$12() {
28550
+ return _extends$12 = Object.assign ? Object.assign.bind() : function (n) {
28462
28551
  for (var e = 1; e < arguments.length; e++) {
28463
28552
  var t = arguments[e];
28464
28553
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28465
28554
  }
28466
28555
  return n;
28467
- }, _extends$11.apply(null, arguments);
28556
+ }, _extends$12.apply(null, arguments);
28468
28557
  }
28469
28558
  function SvgEmojiFlagicon(props) {
28470
- return /*#__PURE__*/createElement$1("svg", _extends$11({
28559
+ return /*#__PURE__*/createElement$1("svg", _extends$12({
28471
28560
  width: 20,
28472
28561
  height: 20,
28473
28562
  viewBox: "0 0 20.01 20.01",
28474
28563
  fill: "none",
28475
28564
  xmlns: "http://www.w3.org/2000/svg"
28476
- }, props), _path$$ || (_path$$ = /*#__PURE__*/createElement$1("path", {
28565
+ }, props), _path$10 || (_path$10 = /*#__PURE__*/createElement$1("path", {
28477
28566
  fillRule: "evenodd",
28478
28567
  clipRule: "evenodd",
28479
28568
  d: "M4.167 3.25a.917.917 0 00-.917.917v7.764c.288-.118.6-.181.917-.181h5.416a.75.75 0 01.53.22l.614.613h5.56L14.329 8.67a.75.75 0 010-.671l1.957-3.915H10.75V7.5a.75.75 0 01-1.5 0V3.25H4.167zm6.56-.667l-.613-.613a.75.75 0 00-.53-.22H4.166A2.417 2.417 0 001.75 4.167V17.5a.75.75 0 001.5 0v-3.333a.917.917 0 01.917-.917h5.106l.613.614c.141.14.332.22.53.22H17.5a.75.75 0 00.67-1.086l-2.332-4.665 2.333-4.664a.75.75 0 00-.671-1.086h-6.773z",
@@ -28969,24 +29058,24 @@ var Emoji = styled.li(_templateObject8$b || (_templateObject8$b = _taggedTemplat
28969
29058
  return props.hoverBackgroundColor;
28970
29059
  });
28971
29060
 
28972
- var _path$10;
28973
- function _extends$12() {
28974
- return _extends$12 = Object.assign ? Object.assign.bind() : function (n) {
29061
+ var _path$11;
29062
+ function _extends$13() {
29063
+ return _extends$13 = Object.assign ? Object.assign.bind() : function (n) {
28975
29064
  for (var e = 1; e < arguments.length; e++) {
28976
29065
  var t = arguments[e];
28977
29066
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28978
29067
  }
28979
29068
  return n;
28980
- }, _extends$12.apply(null, arguments);
29069
+ }, _extends$13.apply(null, arguments);
28981
29070
  }
28982
29071
  function SvgPlus(props) {
28983
- return /*#__PURE__*/createElement$1("svg", _extends$12({
29072
+ return /*#__PURE__*/createElement$1("svg", _extends$13({
28984
29073
  width: 20,
28985
29074
  height: 20,
28986
29075
  viewBox: "0 0 20.01 20.01",
28987
29076
  fill: "none",
28988
29077
  xmlns: "http://www.w3.org/2000/svg"
28989
- }, props), _path$10 || (_path$10 = /*#__PURE__*/createElement$1("path", {
29078
+ }, props), _path$11 || (_path$11 = /*#__PURE__*/createElement$1("path", {
28990
29079
  d: "M10 3.778c.43 0 .778.348.778.778v4.666h4.666a.778.778 0 110 1.556h-4.666v4.666a.778.778 0 11-1.556 0v-4.666H4.556a.778.778 0 110-1.556h4.666V4.556c0-.43.348-.778.778-.778z",
28991
29080
  fill: "currentColor"
28992
29081
  })));
@@ -32174,24 +32263,24 @@ var MemberName$2 = styled.h3(_templateObject5$k || (_templateObject5$k = _tagged
32174
32263
  return props.color;
32175
32264
  });
32176
32265
 
32177
- var _path$11;
32178
- function _extends$13() {
32179
- return _extends$13 = Object.assign ? Object.assign.bind() : function (n) {
32266
+ var _path$12;
32267
+ function _extends$14() {
32268
+ return _extends$14 = Object.assign ? Object.assign.bind() : function (n) {
32180
32269
  for (var e = 1; e < arguments.length; e++) {
32181
32270
  var t = arguments[e];
32182
32271
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32183
32272
  }
32184
32273
  return n;
32185
- }, _extends$13.apply(null, arguments);
32274
+ }, _extends$14.apply(null, arguments);
32186
32275
  }
32187
32276
  function SvgBold(props) {
32188
- return /*#__PURE__*/createElement$1("svg", _extends$13({
32277
+ return /*#__PURE__*/createElement$1("svg", _extends$14({
32189
32278
  width: 18,
32190
32279
  height: 18,
32191
32280
  viewBox: "0 0 18.01 18.01",
32192
32281
  fill: "none",
32193
32282
  xmlns: "http://www.w3.org/2000/svg"
32194
- }, props), _path$11 || (_path$11 = /*#__PURE__*/createElement$1("path", {
32283
+ }, props), _path$12 || (_path$12 = /*#__PURE__*/createElement$1("path", {
32195
32284
  fillRule: "evenodd",
32196
32285
  clipRule: "evenodd",
32197
32286
  d: "M6.35 3.029A1.1 1.1 0 005 4.1v10a1.1 1.1 0 001.35 1.072c.08.018.164.028.25.028h3.429c1.998 0 3.671-1.583 3.671-3.6a3.566 3.566 0 00-1.596-2.969c.38-.588.596-1.294.596-2.031 0-1.904-1.444-3.6-3.408-3.6H6.6c-.086 0-.17.01-.25.029zm3.41 7.138a3.318 3.318 0 01-.468.033H7.2V13h2.829c.842 0 1.471-.656 1.471-1.4 0-.744-.63-1.4-1.471-1.4a1.1 1.1 0 01-.268-.033zM7.2 8h2.092c.586 0 1.208-.542 1.208-1.4 0-.858-.622-1.4-1.208-1.4H7.2V8z",
@@ -32199,24 +32288,24 @@ function SvgBold(props) {
32199
32288
  })));
32200
32289
  }
32201
32290
 
32202
- var _path$12;
32203
- function _extends$14() {
32204
- return _extends$14 = Object.assign ? Object.assign.bind() : function (n) {
32291
+ var _path$13;
32292
+ function _extends$15() {
32293
+ return _extends$15 = Object.assign ? Object.assign.bind() : function (n) {
32205
32294
  for (var e = 1; e < arguments.length; e++) {
32206
32295
  var t = arguments[e];
32207
32296
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32208
32297
  }
32209
32298
  return n;
32210
- }, _extends$14.apply(null, arguments);
32299
+ }, _extends$15.apply(null, arguments);
32211
32300
  }
32212
32301
  function SvgItalic(props) {
32213
- return /*#__PURE__*/createElement$1("svg", _extends$14({
32302
+ return /*#__PURE__*/createElement$1("svg", _extends$15({
32214
32303
  width: 18,
32215
32304
  height: 18,
32216
32305
  viewBox: "0 0 18.01 18.01",
32217
32306
  fill: "none",
32218
32307
  xmlns: "http://www.w3.org/2000/svg"
32219
- }, props), _path$12 || (_path$12 = /*#__PURE__*/createElement$1("path", {
32308
+ }, props), _path$13 || (_path$13 = /*#__PURE__*/createElement$1("path", {
32220
32309
  fillRule: "evenodd",
32221
32310
  clipRule: "evenodd",
32222
32311
  d: "M9.984 3.2H8a.8.8 0 000 1.6h1.024l-1.68 8.4H6a.8.8 0 100 1.6h4a.8.8 0 000-1.6H8.976l1.68-8.4H12a.8.8 0 000-1.6H9.984z",
@@ -32225,17 +32314,17 @@ function SvgItalic(props) {
32225
32314
  }
32226
32315
 
32227
32316
  var _g$1;
32228
- function _extends$15() {
32229
- return _extends$15 = Object.assign ? Object.assign.bind() : function (n) {
32317
+ function _extends$16() {
32318
+ return _extends$16 = Object.assign ? Object.assign.bind() : function (n) {
32230
32319
  for (var e = 1; e < arguments.length; e++) {
32231
32320
  var t = arguments[e];
32232
32321
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32233
32322
  }
32234
32323
  return n;
32235
- }, _extends$15.apply(null, arguments);
32324
+ }, _extends$16.apply(null, arguments);
32236
32325
  }
32237
32326
  function SvgStrikethrough(props) {
32238
- return /*#__PURE__*/createElement$1("svg", _extends$15({
32327
+ return /*#__PURE__*/createElement$1("svg", _extends$16({
32239
32328
  width: 18,
32240
32329
  height: 18,
32241
32330
  viewBox: "0 0 18.01 18.01",
@@ -32252,41 +32341,41 @@ function SvgStrikethrough(props) {
32252
32341
  }))));
32253
32342
  }
32254
32343
 
32255
- var _path$13;
32256
- function _extends$16() {
32257
- return _extends$16 = Object.assign ? Object.assign.bind() : function (n) {
32344
+ var _path$14;
32345
+ function _extends$17() {
32346
+ return _extends$17 = Object.assign ? Object.assign.bind() : function (n) {
32258
32347
  for (var e = 1; e < arguments.length; e++) {
32259
32348
  var t = arguments[e];
32260
32349
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32261
32350
  }
32262
32351
  return n;
32263
- }, _extends$16.apply(null, arguments);
32352
+ }, _extends$17.apply(null, arguments);
32264
32353
  }
32265
32354
  function SvgMono(props) {
32266
- return /*#__PURE__*/createElement$1("svg", _extends$16({
32355
+ return /*#__PURE__*/createElement$1("svg", _extends$17({
32267
32356
  width: 18,
32268
32357
  height: 18,
32269
32358
  viewBox: "0 0 18.01 18.01",
32270
32359
  fill: "none",
32271
32360
  xmlns: "http://www.w3.org/2000/svg"
32272
- }, props), _path$13 || (_path$13 = /*#__PURE__*/createElement$1("path", {
32361
+ }, props), _path$14 || (_path$14 = /*#__PURE__*/createElement$1("path", {
32273
32362
  d: "M4.98 14.753A.826.826 0 014.37 15a.882.882 0 01-.624-.247.882.882 0 01-.247-.624V3.87c0-.24.082-.444.247-.608A.853.853 0 014.37 3c.581 0 1.003.258 1.266.773l3.238 6.28c0 .01.006.015.017.015.01 0 .016-.005.016-.016l3.222-6.247c.274-.537.712-.805 1.315-.805.252 0 .466.088.641.263a.873.873 0 01.263.641v10.192a.873.873 0 01-.263.641.872.872 0 01-.64.263.873.873 0 01-.642-.263.873.873 0 01-.263-.641V6.14c0-.011-.005-.017-.016-.017s-.017.006-.017.017l-2.433 4.833c-.252.493-.646.74-1.183.74s-.932-.247-1.184-.74L5.275 6.14c0-.011-.005-.017-.016-.017s-.017.006-.017.017v7.989c0 .24-.087.45-.263.624z",
32274
32363
  fill: "CurrentColor"
32275
32364
  })));
32276
32365
  }
32277
32366
 
32278
32367
  var _g$2;
32279
- function _extends$17() {
32280
- return _extends$17 = Object.assign ? Object.assign.bind() : function (n) {
32368
+ function _extends$18() {
32369
+ return _extends$18 = Object.assign ? Object.assign.bind() : function (n) {
32281
32370
  for (var e = 1; e < arguments.length; e++) {
32282
32371
  var t = arguments[e];
32283
32372
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32284
32373
  }
32285
32374
  return n;
32286
- }, _extends$17.apply(null, arguments);
32375
+ }, _extends$18.apply(null, arguments);
32287
32376
  }
32288
32377
  function SvgUnderline(props) {
32289
- return /*#__PURE__*/createElement$1("svg", _extends$17({
32378
+ return /*#__PURE__*/createElement$1("svg", _extends$18({
32290
32379
  width: 18,
32291
32380
  height: 18,
32292
32381
  viewBox: "0 0 18.01 18.01",
@@ -32380,9 +32469,9 @@ function TextFormatFloatingToolbar(_ref) {
32380
32469
  var _useColor = useColors(),
32381
32470
  accentColor = _useColor[THEME_COLORS.ACCENT],
32382
32471
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
32383
- surface2 = _useColor[THEME_COLORS.SURFACE_2],
32384
32472
  backgroundSections = _useColor[THEME_COLORS.BACKGROUND_SECTIONS],
32385
- surface1 = _useColor[THEME_COLORS.SURFACE_1];
32473
+ surface1 = _useColor[THEME_COLORS.SURFACE_1],
32474
+ tooltipBackground = _useColor[THEME_COLORS.TOOLTIP_BACKGROUND];
32386
32475
  var popupCharStylesEditorRef = useRef(null);
32387
32476
  function mouseMoveListener(e) {
32388
32477
  if (popupCharStylesEditorRef !== null && popupCharStylesEditorRef !== void 0 && popupCharStylesEditorRef.current && (e.buttons === 1 || e.buttons === 3)) {
@@ -32477,9 +32566,9 @@ function TextFormatFloatingToolbar(_ref) {
32477
32566
  isActive: isBold
32478
32567
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32479
32568
  disabledColor: textSecondary,
32480
- bgColor: surface2,
32569
+ bgColor: tooltipBackground,
32481
32570
  direction: 'top'
32482
- }, "Bold"), /*#__PURE__*/React__default.createElement(SvgBold, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32571
+ }, "Bold", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgBold, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32483
32572
  iconColor: textSecondary,
32484
32573
  hoverBackgroundColor: surface1,
32485
32574
  hoverIconColor: accentColor,
@@ -32491,9 +32580,9 @@ function TextFormatFloatingToolbar(_ref) {
32491
32580
  "aria-label": 'Format text as italics'
32492
32581
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32493
32582
  disabledColor: textSecondary,
32494
- bgColor: surface2,
32583
+ bgColor: tooltipBackground,
32495
32584
  direction: 'top'
32496
- }, "Italic"), /*#__PURE__*/React__default.createElement(SvgItalic, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32585
+ }, "Italic", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgItalic, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32497
32586
  iconColor: textSecondary,
32498
32587
  hoverBackgroundColor: surface1,
32499
32588
  hoverIconColor: accentColor,
@@ -32505,9 +32594,9 @@ function TextFormatFloatingToolbar(_ref) {
32505
32594
  "aria-label": 'Format text with a strikethrough'
32506
32595
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32507
32596
  disabledColor: textSecondary,
32508
- bgColor: surface2,
32597
+ bgColor: tooltipBackground,
32509
32598
  direction: 'top'
32510
- }, ' ', "Strikethrough", ' '), /*#__PURE__*/React__default.createElement(SvgStrikethrough, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32599
+ }, "Strikethrough ", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgStrikethrough, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32511
32600
  type: 'button',
32512
32601
  iconColor: textSecondary,
32513
32602
  hoverBackgroundColor: surface1,
@@ -32519,9 +32608,9 @@ function TextFormatFloatingToolbar(_ref) {
32519
32608
  "aria-label": 'Insert code block'
32520
32609
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32521
32610
  disabledColor: textSecondary,
32522
- bgColor: surface2,
32611
+ bgColor: tooltipBackground,
32523
32612
  direction: 'top'
32524
- }, "Monospace"), /*#__PURE__*/React__default.createElement(SvgMono, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32613
+ }, "Monospace ", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgMono, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32525
32614
  type: 'button',
32526
32615
  iconColor: textSecondary,
32527
32616
  hoverBackgroundColor: surface1,
@@ -32533,9 +32622,9 @@ function TextFormatFloatingToolbar(_ref) {
32533
32622
  "aria-label": 'Insert code block'
32534
32623
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32535
32624
  disabledColor: textSecondary,
32536
- bgColor: surface2,
32625
+ bgColor: tooltipBackground,
32537
32626
  direction: 'top'
32538
- }, "Underline"), /*#__PURE__*/React__default.createElement(SvgUnderline, null)))));
32627
+ }, "Underline ", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgUnderline, null)))));
32539
32628
  }
32540
32629
  function useFloatingTextFormatToolbar(editor, anchorElem) {
32541
32630
  var _useState = useState(false),
@@ -33248,18 +33337,18 @@ var Emoji$1 = styled.li(_templateObject8$e || (_templateObject8$e = _taggedTempl
33248
33337
 
33249
33338
  var CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
33250
33339
 
33251
- var _circle$6, _path$14;
33252
- function _extends$18() {
33253
- return _extends$18 = Object.assign ? Object.assign.bind() : function (n) {
33340
+ var _circle$6, _path$15;
33341
+ function _extends$19() {
33342
+ return _extends$19 = Object.assign ? Object.assign.bind() : function (n) {
33254
33343
  for (var e = 1; e < arguments.length; e++) {
33255
33344
  var t = arguments[e];
33256
33345
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33257
33346
  }
33258
33347
  return n;
33259
- }, _extends$18.apply(null, arguments);
33348
+ }, _extends$19.apply(null, arguments);
33260
33349
  }
33261
33350
  function SvgSend(props) {
33262
- return /*#__PURE__*/createElement$1("svg", _extends$18({
33351
+ return /*#__PURE__*/createElement$1("svg", _extends$19({
33263
33352
  width: 32,
33264
33353
  height: 32,
33265
33354
  fill: "none",
@@ -33269,142 +33358,142 @@ function SvgSend(props) {
33269
33358
  cy: 16,
33270
33359
  r: 16,
33271
33360
  fill: "currentColor"
33272
- })), _path$14 || (_path$14 = /*#__PURE__*/createElement$1("path", {
33361
+ })), _path$15 || (_path$15 = /*#__PURE__*/createElement$1("path", {
33273
33362
  d: "M10.953 18.945c-.545 1.46-.888 2.485-1.028 3.076-.439 1.856-.758 2.274.879 1.392 1.637-.882 9.56-5.251 11.329-6.222 2.304-1.266 2.335-1.167-.124-2.511-1.873-1.024-9.704-5.279-11.205-6.115-1.501-.835-1.318-.464-.879 1.392.142.6.49 1.634 1.043 3.105a3.143 3.143 0 002.35 1.98l4.595.88a.079.079 0 010 .155l-4.606.88a3.143 3.143 0 00-2.354 1.988z",
33274
33363
  fill: "#fff"
33275
33364
  })));
33276
33365
  }
33277
33366
 
33278
- var _path$15;
33279
- function _extends$19() {
33280
- return _extends$19 = Object.assign ? Object.assign.bind() : function (n) {
33367
+ var _path$16;
33368
+ function _extends$1a() {
33369
+ return _extends$1a = Object.assign ? Object.assign.bind() : function (n) {
33281
33370
  for (var e = 1; e < arguments.length; e++) {
33282
33371
  var t = arguments[e];
33283
33372
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33284
33373
  }
33285
33374
  return n;
33286
- }, _extends$19.apply(null, arguments);
33375
+ }, _extends$1a.apply(null, arguments);
33287
33376
  }
33288
33377
  function SvgEye(props) {
33289
- return /*#__PURE__*/createElement$1("svg", _extends$19({
33378
+ return /*#__PURE__*/createElement$1("svg", _extends$1a({
33290
33379
  width: 25,
33291
33380
  height: 24,
33292
33381
  fill: "none",
33293
33382
  xmlns: "http://www.w3.org/2000/svg"
33294
- }, props), _path$15 || (_path$15 = /*#__PURE__*/createElement$1("path", {
33383
+ }, props), _path$16 || (_path$16 = /*#__PURE__*/createElement$1("path", {
33295
33384
  d: "M12.5 5c6 0 10 5.6 10 7 0 1.4-4 7-10 7s-10-5.6-10-7c0-1.4 4-7 10-7zm0 2a5 5 0 100 10 5 5 0 000-10zm.001 2.5a2.5 2.5 0 110 5 2.5 2.5 0 010-5z",
33296
33385
  fill: "CurrentColor"
33297
33386
  })));
33298
33387
  }
33299
33388
 
33300
- var _path$16;
33301
- function _extends$1a() {
33302
- return _extends$1a = Object.assign ? Object.assign.bind() : function (n) {
33389
+ var _path$17;
33390
+ function _extends$1b() {
33391
+ return _extends$1b = Object.assign ? Object.assign.bind() : function (n) {
33303
33392
  for (var e = 1; e < arguments.length; e++) {
33304
33393
  var t = arguments[e];
33305
33394
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33306
33395
  }
33307
33396
  return n;
33308
- }, _extends$1a.apply(null, arguments);
33397
+ }, _extends$1b.apply(null, arguments);
33309
33398
  }
33310
33399
  function SvgAddAttachment(props) {
33311
- return /*#__PURE__*/createElement$1("svg", _extends$1a({
33400
+ return /*#__PURE__*/createElement$1("svg", _extends$1b({
33312
33401
  width: 24,
33313
33402
  height: 24,
33314
33403
  viewBox: "0 0 24.01 24.01",
33315
33404
  fill: "none",
33316
33405
  xmlns: "http://www.w3.org/2000/svg"
33317
- }, props), _path$16 || (_path$16 = /*#__PURE__*/createElement$1("path", {
33406
+ }, props), _path$17 || (_path$17 = /*#__PURE__*/createElement$1("path", {
33318
33407
  d: "M12 1.714c5.68 0 10.286 4.605 10.286 10.286 0 5.68-4.605 10.286-10.286 10.286C6.32 22.286 1.714 17.68 1.714 12 1.714 6.32 6.32 1.714 12 1.714zm0 1.715a8.571 8.571 0 100 17.143 8.571 8.571 0 000-17.143zm0 3.428c.473 0 .857.384.857.857v3.429h3.429a.857.857 0 010 1.714h-3.429v3.429a.857.857 0 11-1.714 0v-3.429H7.714a.857.857 0 110-1.714h3.429V7.714c0-.473.384-.857.857-.857z",
33319
33408
  fill: "CurrentColor"
33320
33409
  })));
33321
33410
  }
33322
33411
 
33323
- var _path$17;
33324
- function _extends$1b() {
33325
- return _extends$1b = Object.assign ? Object.assign.bind() : function (n) {
33412
+ var _path$18;
33413
+ function _extends$1c() {
33414
+ return _extends$1c = Object.assign ? Object.assign.bind() : function (n) {
33326
33415
  for (var e = 1; e < arguments.length; e++) {
33327
33416
  var t = arguments[e];
33328
33417
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33329
33418
  }
33330
33419
  return n;
33331
- }, _extends$1b.apply(null, arguments);
33420
+ }, _extends$1c.apply(null, arguments);
33332
33421
  }
33333
33422
  function SvgErrorCircle(props) {
33334
- return /*#__PURE__*/createElement$1("svg", _extends$1b({
33423
+ return /*#__PURE__*/createElement$1("svg", _extends$1c({
33335
33424
  width: 25,
33336
33425
  height: 24,
33337
33426
  fill: "none",
33338
33427
  xmlns: "http://www.w3.org/2000/svg"
33339
- }, props), _path$17 || (_path$17 = /*#__PURE__*/createElement$1("path", {
33428
+ }, props), _path$18 || (_path$18 = /*#__PURE__*/createElement$1("path", {
33340
33429
  d: "M12.5 1.714c5.68 0 10.286 4.605 10.286 10.286 0 5.68-4.605 10.285-10.286 10.285C6.82 22.285 2.214 17.68 2.214 12 2.214 6.319 6.82 1.714 12.5 1.714zm0 1.714a8.571 8.571 0 100 17.143 8.571 8.571 0 000-17.143zm0 11.657a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4zm.063-8.228c.204 0 .332.032.443.091.112.06.2.148.26.26.06.111.091.24.091.443v5.269c0 .204-.032.331-.091.443a.623.623 0 01-.26.26c-.111.059-.24.09-.443.09h-.126c-.204 0-.332-.031-.443-.09a.624.624 0 01-.26-.26c-.06-.112-.091-.24-.091-.443V7.65c0-.203.032-.33.091-.442.06-.112.148-.2.26-.26.111-.06.24-.091.443-.091h.126z",
33341
33430
  fill: "#FFB73D"
33342
33431
  })));
33343
33432
  }
33344
33433
 
33345
- var _path$18;
33346
- function _extends$1c() {
33347
- return _extends$1c = Object.assign ? Object.assign.bind() : function (n) {
33434
+ var _path$19;
33435
+ function _extends$1d() {
33436
+ return _extends$1d = Object.assign ? Object.assign.bind() : function (n) {
33348
33437
  for (var e = 1; e < arguments.length; e++) {
33349
33438
  var t = arguments[e];
33350
33439
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33351
33440
  }
33352
33441
  return n;
33353
- }, _extends$1c.apply(null, arguments);
33442
+ }, _extends$1d.apply(null, arguments);
33354
33443
  }
33355
33444
  function SvgPlayRecord(props) {
33356
- return /*#__PURE__*/createElement$1("svg", _extends$1c({
33445
+ return /*#__PURE__*/createElement$1("svg", _extends$1d({
33357
33446
  width: 20,
33358
33447
  height: 20,
33359
33448
  viewBox: "0 0 20.01 20.01",
33360
33449
  fill: "none",
33361
33450
  xmlns: "http://www.w3.org/2000/svg"
33362
- }, props), _path$18 || (_path$18 = /*#__PURE__*/createElement$1("path", {
33451
+ }, props), _path$19 || (_path$19 = /*#__PURE__*/createElement$1("path", {
33363
33452
  d: "M16.28 8.913c.793.48.793 1.692 0 2.172l-8.265 4.997c-.787.475-1.765-.126-1.765-1.086V5.002c0-.96.979-1.561 1.765-1.086l8.265 4.997z",
33364
33453
  fill: "CurrentColor"
33365
33454
  })));
33366
33455
  }
33367
33456
 
33368
- var _path$19;
33369
- function _extends$1d() {
33370
- return _extends$1d = Object.assign ? Object.assign.bind() : function (n) {
33457
+ var _path$1a;
33458
+ function _extends$1e() {
33459
+ return _extends$1e = Object.assign ? Object.assign.bind() : function (n) {
33371
33460
  for (var e = 1; e < arguments.length; e++) {
33372
33461
  var t = arguments[e];
33373
33462
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33374
33463
  }
33375
33464
  return n;
33376
- }, _extends$1d.apply(null, arguments);
33465
+ }, _extends$1e.apply(null, arguments);
33377
33466
  }
33378
33467
  function SvgPauseRecord(props) {
33379
- return /*#__PURE__*/createElement$1("svg", _extends$1d({
33468
+ return /*#__PURE__*/createElement$1("svg", _extends$1e({
33380
33469
  width: 20,
33381
33470
  height: 20,
33382
33471
  viewBox: "0 0 20.01 20.01",
33383
33472
  fill: "none",
33384
33473
  xmlns: "http://www.w3.org/2000/svg"
33385
- }, props), _path$19 || (_path$19 = /*#__PURE__*/createElement$1("path", {
33474
+ }, props), _path$1a || (_path$1a = /*#__PURE__*/createElement$1("path", {
33386
33475
  d: "M7.468 3.75c.446 0 .607.046.77.134.163.087.291.215.378.378.088.163.134.324.134.77v9.936c0 .446-.046.607-.134.77a.908.908 0 01-.378.378c-.163.088-.324.134-.77.134H6.282c-.446 0-.607-.046-.77-.134a.908.908 0 01-.378-.378c-.088-.162-.134-.324-.134-.77V5.032c0-.446.046-.607.134-.77a.909.909 0 01.378-.378c.163-.088.324-.134.77-.134h1.186zm6.25 0c.446 0 .607.046.77.134.163.087.291.215.378.378.088.163.134.324.134.77v9.936c0 .446-.046.607-.134.77a.908.908 0 01-.378.378c-.162.088-.324.134-.77.134h-1.186c-.446 0-.607-.046-.77-.134a.908.908 0 01-.378-.378c-.088-.162-.134-.324-.134-.77V5.032c0-.446.046-.607.134-.77a.908.908 0 01.378-.378c.162-.088.324-.134.77-.134h1.186z",
33387
33476
  fill: "CurrentColor"
33388
33477
  })));
33389
33478
  }
33390
33479
 
33391
- var _path$1a;
33392
- function _extends$1e() {
33393
- return _extends$1e = Object.assign ? Object.assign.bind() : function (n) {
33480
+ var _path$1b;
33481
+ function _extends$1f() {
33482
+ return _extends$1f = Object.assign ? Object.assign.bind() : function (n) {
33394
33483
  for (var e = 1; e < arguments.length; e++) {
33395
33484
  var t = arguments[e];
33396
33485
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33397
33486
  }
33398
33487
  return n;
33399
- }, _extends$1e.apply(null, arguments);
33488
+ }, _extends$1f.apply(null, arguments);
33400
33489
  }
33401
33490
  function SvgStopRecord(props) {
33402
- return /*#__PURE__*/createElement$1("svg", _extends$1e({
33491
+ return /*#__PURE__*/createElement$1("svg", _extends$1f({
33403
33492
  width: 20,
33404
33493
  height: 20,
33405
33494
  fill: "none",
33406
33495
  xmlns: "http://www.w3.org/2000/svg"
33407
- }, props), _path$1a || (_path$1a = /*#__PURE__*/createElement$1("path", {
33496
+ }, props), _path$1b || (_path$1b = /*#__PURE__*/createElement$1("path", {
33408
33497
  fillRule: "evenodd",
33409
33498
  clipRule: "evenodd",
33410
33499
  d: "M4.421 5.441c-.254.5-.254 1.153-.254 2.46v4.2c0 1.306 0 1.96.254 2.459.224.439.581.796 1.02 1.02.5.254 1.153.254 2.46.254h4.2c1.306 0 1.96 0 2.459-.255.439-.223.796-.58 1.02-1.02.254-.498.254-1.152.254-2.459V7.9c0-1.306 0-1.96-.255-2.459a2.333 2.333 0 00-1.02-1.02c-.498-.254-1.152-.254-2.459-.254H7.9c-1.306 0-1.96 0-2.459.254-.439.224-.796.581-1.02 1.02z",
@@ -33412,18 +33501,18 @@ function SvgStopRecord(props) {
33412
33501
  })));
33413
33502
  }
33414
33503
 
33415
- var _circle$7, _path$1b, _path2$6;
33416
- function _extends$1f() {
33417
- return _extends$1f = Object.assign ? Object.assign.bind() : function (n) {
33504
+ var _circle$7, _path$1c, _path2$6;
33505
+ function _extends$1g() {
33506
+ return _extends$1g = Object.assign ? Object.assign.bind() : function (n) {
33418
33507
  for (var e = 1; e < arguments.length; e++) {
33419
33508
  var t = arguments[e];
33420
33509
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33421
33510
  }
33422
33511
  return n;
33423
- }, _extends$1f.apply(null, arguments);
33512
+ }, _extends$1g.apply(null, arguments);
33424
33513
  }
33425
33514
  function SvgRecordButton(props) {
33426
- return /*#__PURE__*/createElement$1("svg", _extends$1f({
33515
+ return /*#__PURE__*/createElement$1("svg", _extends$1g({
33427
33516
  width: 32,
33428
33517
  height: 32,
33429
33518
  viewBox: "0 0 32.01 32.01",
@@ -33434,7 +33523,7 @@ function SvgRecordButton(props) {
33434
33523
  cy: 16,
33435
33524
  r: 16,
33436
33525
  fill: "CurrentColor"
33437
- })), _path$1b || (_path$1b = /*#__PURE__*/createElement$1("path", {
33526
+ })), _path$1c || (_path$1c = /*#__PURE__*/createElement$1("path", {
33438
33527
  d: "M12.875 10.375a3.125 3.125 0 116.25 0v5a3.125 3.125 0 11-6.25 0v-5zM15.219 22.406a.781.781 0 111.562 0v1.563a.781.781 0 11-1.562 0v-1.563zM23.5 14.906a.781.781 0 11-1.563 0 .781.781 0 011.563 0zM10.063 14.906a.781.781 0 11-1.563 0 .781.781 0 011.563 0z",
33439
33528
  fill: "#fff"
33440
33529
  })), _path2$6 || (_path2$6 = /*#__PURE__*/createElement$1("path", {
@@ -35618,23 +35707,23 @@ var CloseIconWrapper = styled.span(_templateObject34$1 || (_templateObject34$1 =
35618
35707
  return props.color;
35619
35708
  });
35620
35709
 
35621
- var _path$1c;
35622
- function _extends$1g() {
35623
- return _extends$1g = Object.assign ? Object.assign.bind() : function (n) {
35710
+ var _path$1d;
35711
+ function _extends$1h() {
35712
+ return _extends$1h = Object.assign ? Object.assign.bind() : function (n) {
35624
35713
  for (var e = 1; e < arguments.length; e++) {
35625
35714
  var t = arguments[e];
35626
35715
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35627
35716
  }
35628
35717
  return n;
35629
- }, _extends$1g.apply(null, arguments);
35718
+ }, _extends$1h.apply(null, arguments);
35630
35719
  }
35631
35720
  function SvgBottom(props) {
35632
- return /*#__PURE__*/createElement$1("svg", _extends$1g({
35721
+ return /*#__PURE__*/createElement$1("svg", _extends$1h({
35633
35722
  width: 12,
35634
35723
  height: 7,
35635
35724
  fill: "none",
35636
35725
  xmlns: "http://www.w3.org/2000/svg"
35637
- }, props), _path$1c || (_path$1c = /*#__PURE__*/createElement$1("path", {
35726
+ }, props), _path$1d || (_path$1d = /*#__PURE__*/createElement$1("path", {
35638
35727
  d: "M1.5 1.5l4.5 4 4.5-4",
35639
35728
  stroke: "#676A7C",
35640
35729
  strokeWidth: 1.4,
@@ -35643,24 +35732,24 @@ function SvgBottom(props) {
35643
35732
  })));
35644
35733
  }
35645
35734
 
35646
- var _path$1d, _path2$7;
35647
- function _extends$1h() {
35648
- return _extends$1h = Object.assign ? Object.assign.bind() : function (n) {
35735
+ var _path$1e, _path2$7;
35736
+ function _extends$1i() {
35737
+ return _extends$1i = Object.assign ? Object.assign.bind() : function (n) {
35649
35738
  for (var e = 1; e < arguments.length; e++) {
35650
35739
  var t = arguments[e];
35651
35740
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35652
35741
  }
35653
35742
  return n;
35654
- }, _extends$1h.apply(null, arguments);
35743
+ }, _extends$1i.apply(null, arguments);
35655
35744
  }
35656
35745
  function SvgMarkAsUnRead(props) {
35657
- return /*#__PURE__*/createElement$1("svg", _extends$1h({
35746
+ return /*#__PURE__*/createElement$1("svg", _extends$1i({
35658
35747
  width: 20,
35659
35748
  height: 20,
35660
35749
  viewBox: "0 0 20.01 20.01",
35661
35750
  fill: "none",
35662
35751
  xmlns: "http://www.w3.org/2000/svg"
35663
- }, props), _path$1d || (_path$1d = /*#__PURE__*/createElement$1("path", {
35752
+ }, props), _path$1e || (_path$1e = /*#__PURE__*/createElement$1("path", {
35664
35753
  d: "M18.25 7.189v3.843c0 .673 0 1.224-.037 1.671-.037.464-.118.882-.317 1.273a3.25 3.25 0 01-1.42 1.42c-.391.2-.81.28-1.273.318-.447.036-.998.036-1.671.036h-2.129c-.55 0-.72.004-.878.036a1.752 1.752 0 00-.444.156c-.143.073-.279.177-.708.52l-2.01 1.608c-.154.124-.307.246-.441.335-.129.085-.366.228-.67.228-.356 0-.692-.16-.914-.438-.19-.239-.226-.513-.24-.667-.015-.16-.015-.356-.015-.554v-1.228c-.358-.01-.655-.034-.924-.107a3.25 3.25 0 01-2.298-2.298c-.111-.415-.111-.896-.111-1.566V6.469c0-.674 0-1.224.037-1.672.037-.463.118-.881.317-1.272a3.25 3.25 0 011.42-1.42c.391-.2.81-.28 1.273-.318.448-.037.998-.037 1.672-.037h6.342c-.19.464-.3.97-.31 1.5h-6c-.713 0-1.203 0-1.582.032-.37.03-.57.086-.713.159a1.75 1.75 0 00-.765.765c-.074.144-.13.343-.16.713-.03.38-.03.869-.03 1.581v5.167c0 .823.006 1.088.059 1.286a1.75 1.75 0 001.237 1.238c.199.053.463.06 1.286.06a.75.75 0 01.75.75v1.772L8.49 15.25c.355-.284.614-.492.91-.643.26-.133.538-.23.825-.29.324-.066.657-.066 1.112-.066H13.5c.713 0 1.202 0 1.581-.031.37-.03.57-.086.713-.16a1.75 1.75 0 00.765-.764c.074-.144.13-.343.16-.714.03-.38.031-.868.031-1.58V7.498c.53-.01 1.036-.12 1.5-.31z",
35665
35754
  fill: "currentColor"
35666
35755
  })), _path2$7 || (_path2$7 = /*#__PURE__*/createElement$1("path", {
@@ -35669,24 +35758,24 @@ function SvgMarkAsUnRead(props) {
35669
35758
  })));
35670
35759
  }
35671
35760
 
35672
- var _path$1e;
35673
- function _extends$1i() {
35674
- return _extends$1i = Object.assign ? Object.assign.bind() : function (n) {
35761
+ var _path$1f;
35762
+ function _extends$1j() {
35763
+ return _extends$1j = Object.assign ? Object.assign.bind() : function (n) {
35675
35764
  for (var e = 1; e < arguments.length; e++) {
35676
35765
  var t = arguments[e];
35677
35766
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35678
35767
  }
35679
35768
  return n;
35680
- }, _extends$1i.apply(null, arguments);
35769
+ }, _extends$1j.apply(null, arguments);
35681
35770
  }
35682
35771
  function SvgMarkAsRead(props) {
35683
- return /*#__PURE__*/createElement$1("svg", _extends$1i({
35772
+ return /*#__PURE__*/createElement$1("svg", _extends$1j({
35684
35773
  width: 20,
35685
35774
  height: 20,
35686
35775
  viewBox: "0 0 20.01 20.01",
35687
35776
  fill: "none",
35688
35777
  xmlns: "http://www.w3.org/2000/svg"
35689
- }, props), _path$1e || (_path$1e = /*#__PURE__*/createElement$1("path", {
35778
+ }, props), _path$1f || (_path$1f = /*#__PURE__*/createElement$1("path", {
35690
35779
  fillRule: "evenodd",
35691
35780
  clipRule: "evenodd",
35692
35781
  d: "M6.469 1.75h7.062c.674 0 1.225 0 1.672.037.463.037.882.118 1.273.317a3.25 3.25 0 011.42 1.42c.199.391.28.81.317 1.273.037.448.037.998.037 1.672v4.562c0 .674 0 1.224-.037 1.672-.037.463-.118.882-.317 1.273a3.25 3.25 0 01-1.42 1.42c-.391.199-.81.28-1.273.317-.447.037-.998.037-1.671.037h-2.129c-.55 0-.72.004-.878.036a1.752 1.752 0 00-.444.156c-.143.073-.279.177-.708.52l-2.01 1.608a6.553 6.553 0 01-.441.334c-.129.085-.366.229-.67.23-.356 0-.692-.162-.914-.44-.19-.238-.226-.513-.24-.666-.015-.16-.015-.356-.015-.554v-1.229c-.358-.008-.655-.034-.924-.106a3.25 3.25 0 01-2.298-2.298c-.111-.415-.111-.896-.111-1.566V6.469c0-.674 0-1.224.037-1.672.037-.463.118-.882.317-1.272a3.25 3.25 0 011.42-1.42c.391-.2.81-.28 1.273-.318.448-.037.998-.037 1.672-.037zm-1.55 1.532c-.37.03-.57.085-.713.159a1.75 1.75 0 00-.765.765c-.074.144-.13.343-.16.713-.03.38-.03.869-.03 1.581v5.167c0 .823.006 1.087.059 1.286a1.75 1.75 0 001.237 1.237c.199.054.463.06 1.286.06a.75.75 0 01.75.75v1.773l1.853-1.482.053-.042c.355-.285.614-.492.91-.643.26-.133.538-.23.825-.29.324-.066.657-.066 1.112-.066H13.5c.713 0 1.202 0 1.581-.032.37-.03.57-.085.713-.159a1.75 1.75 0 00.765-.764c.074-.145.13-.344.16-.714.03-.38.031-.869.031-1.581V6.5c0-.712 0-1.202-.032-1.58-.03-.371-.085-.57-.159-.714a1.75 1.75 0 00-.765-.765c-.144-.074-.343-.13-.713-.16-.38-.03-.868-.031-1.58-.031h-7c-.713 0-1.203 0-1.582.032zm.164 3.801a.75.75 0 01.75-.75H10a.75.75 0 010 1.5H5.833a.75.75 0 01-.75-.75zm0 2.917a.75.75 0 01.75-.75H12.5a.75.75 0 010 1.5H5.833a.75.75 0 01-.75-.75z",
@@ -35694,23 +35783,23 @@ function SvgMarkAsRead(props) {
35694
35783
  })));
35695
35784
  }
35696
35785
 
35697
- var _path$1f;
35698
- function _extends$1j() {
35699
- return _extends$1j = Object.assign ? Object.assign.bind() : function (n) {
35786
+ var _path$1g;
35787
+ function _extends$1k() {
35788
+ return _extends$1k = Object.assign ? Object.assign.bind() : function (n) {
35700
35789
  for (var e = 1; e < arguments.length; e++) {
35701
35790
  var t = arguments[e];
35702
35791
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35703
35792
  }
35704
35793
  return n;
35705
- }, _extends$1j.apply(null, arguments);
35794
+ }, _extends$1k.apply(null, arguments);
35706
35795
  }
35707
35796
  function SvgClear(props) {
35708
- return /*#__PURE__*/createElement$1("svg", _extends$1j({
35797
+ return /*#__PURE__*/createElement$1("svg", _extends$1k({
35709
35798
  width: 20,
35710
35799
  height: 21,
35711
35800
  fill: "none",
35712
35801
  xmlns: "http://www.w3.org/2000/svg"
35713
- }, props), _path$1f || (_path$1f = /*#__PURE__*/createElement$1("path", {
35802
+ }, props), _path$1g || (_path$1g = /*#__PURE__*/createElement$1("path", {
35714
35803
  fillRule: "evenodd",
35715
35804
  clipRule: "evenodd",
35716
35805
  d: "M10 3.833a6.667 6.667 0 100 13.333 6.667 6.667 0 000-13.333zm-8.333 6.666a8.333 8.333 0 1116.667 0 8.333 8.333 0 01-16.667 0zM6.911 7.41a.833.833 0 011.179 0L10 9.32l1.911-1.91A.833.833 0 0113.09 8.59l-1.911 1.91 1.91 1.911a.833.833 0 01-1.178 1.179l-1.91-1.911-1.911 1.91A.833.833 0 016.91 12.41l1.91-1.91-1.91-1.911a.833.833 0 010-1.179z",
@@ -35718,46 +35807,46 @@ function SvgClear(props) {
35718
35807
  })));
35719
35808
  }
35720
35809
 
35721
- var _path$1g;
35722
- function _extends$1k() {
35723
- return _extends$1k = Object.assign ? Object.assign.bind() : function (n) {
35810
+ var _path$1h;
35811
+ function _extends$1l() {
35812
+ return _extends$1l = Object.assign ? Object.assign.bind() : function (n) {
35724
35813
  for (var e = 1; e < arguments.length; e++) {
35725
35814
  var t = arguments[e];
35726
35815
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35727
35816
  }
35728
35817
  return n;
35729
- }, _extends$1k.apply(null, arguments);
35818
+ }, _extends$1l.apply(null, arguments);
35730
35819
  }
35731
35820
  function SvgBlockChannel(props) {
35732
- return /*#__PURE__*/createElement$1("svg", _extends$1k({
35821
+ return /*#__PURE__*/createElement$1("svg", _extends$1l({
35733
35822
  width: 20,
35734
35823
  height: 21,
35735
35824
  viewBox: "0 0 20.01 21.01",
35736
35825
  fill: "none",
35737
35826
  xmlns: "http://www.w3.org/2000/svg"
35738
- }, props), _path$1g || (_path$1g = /*#__PURE__*/createElement$1("path", {
35827
+ }, props), _path$1h || (_path$1h = /*#__PURE__*/createElement$1("path", {
35739
35828
  d: "M10 2.167A8.336 8.336 0 001.667 10.5c0 4.6 3.733 8.334 8.333 8.334s8.333-3.734 8.333-8.334S14.6 2.167 10 2.167zm0 15A6.665 6.665 0 013.333 10.5c0-1.541.525-2.958 1.409-4.083l9.341 9.342A6.586 6.586 0 0110 17.167zm5.258-2.583L5.917 5.242A6.585 6.585 0 0110 3.834a6.665 6.665 0 016.667 6.666 6.586 6.586 0 01-1.409 4.084z",
35740
35829
  fill: "CurrentColor"
35741
35830
  })));
35742
35831
  }
35743
35832
 
35744
- var _path$1h, _path2$8;
35745
- function _extends$1l() {
35746
- return _extends$1l = Object.assign ? Object.assign.bind() : function (n) {
35833
+ var _path$1i, _path2$8;
35834
+ function _extends$1m() {
35835
+ return _extends$1m = Object.assign ? Object.assign.bind() : function (n) {
35747
35836
  for (var e = 1; e < arguments.length; e++) {
35748
35837
  var t = arguments[e];
35749
35838
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35750
35839
  }
35751
35840
  return n;
35752
- }, _extends$1l.apply(null, arguments);
35841
+ }, _extends$1m.apply(null, arguments);
35753
35842
  }
35754
35843
  function SvgReport(props) {
35755
- return /*#__PURE__*/createElement$1("svg", _extends$1l({
35844
+ return /*#__PURE__*/createElement$1("svg", _extends$1m({
35756
35845
  width: 20,
35757
35846
  height: 21,
35758
35847
  fill: "none",
35759
35848
  xmlns: "http://www.w3.org/2000/svg"
35760
- }, props), _path$1h || (_path$1h = /*#__PURE__*/createElement$1("path", {
35849
+ }, props), _path$1i || (_path$1i = /*#__PURE__*/createElement$1("path", {
35761
35850
  d: "M9.096 10.402a.882.882 0 011.765 0v3.627a.882.882 0 11-1.765 0v-3.627zM9.979 6.088a.98.98 0 100 1.96.98.98 0 000-1.96z",
35762
35851
  fill: "CurrentColor"
35763
35852
  })), _path2$8 || (_path2$8 = /*#__PURE__*/createElement$1("path", {
@@ -35768,46 +35857,46 @@ function SvgReport(props) {
35768
35857
  })));
35769
35858
  }
35770
35859
 
35771
- var _path$1i;
35772
- function _extends$1m() {
35773
- return _extends$1m = Object.assign ? Object.assign.bind() : function (n) {
35860
+ var _path$1j;
35861
+ function _extends$1n() {
35862
+ return _extends$1n = Object.assign ? Object.assign.bind() : function (n) {
35774
35863
  for (var e = 1; e < arguments.length; e++) {
35775
35864
  var t = arguments[e];
35776
35865
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35777
35866
  }
35778
35867
  return n;
35779
- }, _extends$1m.apply(null, arguments);
35868
+ }, _extends$1n.apply(null, arguments);
35780
35869
  }
35781
35870
  function SvgStar(props) {
35782
- return /*#__PURE__*/createElement$1("svg", _extends$1m({
35871
+ return /*#__PURE__*/createElement$1("svg", _extends$1n({
35783
35872
  width: 20,
35784
35873
  height: 20,
35785
35874
  fill: "none",
35786
35875
  xmlns: "http://www.w3.org/2000/svg"
35787
- }, props), _path$1i || (_path$1i = /*#__PURE__*/createElement$1("path", {
35876
+ }, props), _path$1j || (_path$1j = /*#__PURE__*/createElement$1("path", {
35788
35877
  d: "M12.888 7.002l3.823.367c1.33.128 1.739 1.43.711 2.285l-2.993 2.49 1.111 4.06c.365 1.332-.767 2.14-1.901 1.337l-3.637-2.573-3.637 2.573c-1.13.799-2.267-.005-1.902-1.338l1.111-4.058-2.993-2.491c-1.032-.86-.625-2.156.711-2.285l3.823-.367 1.684-3.889c.528-1.217 1.878-1.217 2.405 0l1.684 3.889z",
35789
35878
  fill: "#B2B6BE"
35790
35879
  })));
35791
35880
  }
35792
35881
 
35793
- var _path$1j;
35794
- function _extends$1n() {
35795
- return _extends$1n = Object.assign ? Object.assign.bind() : function (n) {
35882
+ var _path$1k;
35883
+ function _extends$1o() {
35884
+ return _extends$1o = Object.assign ? Object.assign.bind() : function (n) {
35796
35885
  for (var e = 1; e < arguments.length; e++) {
35797
35886
  var t = arguments[e];
35798
35887
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35799
35888
  }
35800
35889
  return n;
35801
- }, _extends$1n.apply(null, arguments);
35890
+ }, _extends$1o.apply(null, arguments);
35802
35891
  }
35803
35892
  function SvgUnpin(props) {
35804
- return /*#__PURE__*/createElement$1("svg", _extends$1n({
35893
+ return /*#__PURE__*/createElement$1("svg", _extends$1o({
35805
35894
  width: 20,
35806
35895
  height: 21,
35807
35896
  viewBox: "0 0 20.01 21.01",
35808
35897
  fill: "none",
35809
35898
  xmlns: "http://www.w3.org/2000/svg"
35810
- }, props), _path$1j || (_path$1j = /*#__PURE__*/createElement$1("path", {
35899
+ }, props), _path$1k || (_path$1k = /*#__PURE__*/createElement$1("path", {
35811
35900
  d: "M8.74 6.616l1.09 1.089 2.995 2.996 1.09 1.088 3.557 3.559a.77.77 0 01-1.09 1.09l-3.365-3.366-.306 3.982a1.059 1.059 0 01-1.805.667l-3.504-3.504-4.356 4.356c-.726.726-1.816-.363-1.09-1.089l4.357-4.356L2.81 9.624a1.059 1.059 0 01.667-1.805l3.982-.306L4.06 4.115a.77.77 0 011.09-1.09l3.59 3.591zm1.634-1.634l.32-.32a.385.385 0 00.106-.197l.34-1.699a.77.77 0 011.3-.394l5.717 5.718a.77.77 0 01-.393 1.3l-1.7.34a.385.385 0 00-.196.105l-.32.32a.77.77 0 01-1.09-1.089l.32-.32c.27-.269.612-.452.985-.526l.288-.058-3.683-3.683-.058.288a1.926 1.926 0 01-.526.984l-.32.32a.77.77 0 11-1.09-1.089zM8.701 8.755a1.925 1.925 0 01-.849.272l-3.214.247 6.617 6.618.248-3.214c.023-.303.117-.593.272-.849L8.7 8.755z",
35812
35901
  fill: "CurrentColor"
35813
35902
  })));
@@ -36313,18 +36402,18 @@ var ActionItem = styled.li(_templateObject16$3 || (_templateObject16$3 = _tagged
36313
36402
  return props.hoverColor;
36314
36403
  });
36315
36404
 
36316
- var _rect$2, _rect2, _path$1k;
36317
- function _extends$1o() {
36318
- return _extends$1o = Object.assign ? Object.assign.bind() : function (n) {
36405
+ var _rect$2, _rect2, _path$1l;
36406
+ function _extends$1p() {
36407
+ return _extends$1p = Object.assign ? Object.assign.bind() : function (n) {
36319
36408
  for (var e = 1; e < arguments.length; e++) {
36320
36409
  var t = arguments[e];
36321
36410
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
36322
36411
  }
36323
36412
  return n;
36324
- }, _extends$1o.apply(null, arguments);
36413
+ }, _extends$1p.apply(null, arguments);
36325
36414
  }
36326
36415
  function SvgAddMember(props) {
36327
- return /*#__PURE__*/createElement$1("svg", _extends$1o({
36416
+ return /*#__PURE__*/createElement$1("svg", _extends$1p({
36328
36417
  width: 40,
36329
36418
  height: 40,
36330
36419
  viewBox: "0 0 40.01 40.01",
@@ -36344,29 +36433,29 @@ function SvgAddMember(props) {
36344
36433
  stroke: "#000",
36345
36434
  strokeOpacity: 0.08,
36346
36435
  strokeWidth: 0.5
36347
- })), _path$1k || (_path$1k = /*#__PURE__*/createElement$1("path", {
36436
+ })), _path$1l || (_path$1l = /*#__PURE__*/createElement$1("path", {
36348
36437
  d: "M20 12a1 1 0 011 1v6h6a1 1 0 110 2h-6v6a1 1 0 11-2 0l-.001-6H13a1 1 0 110-2h5.999L19 13a1 1 0 011-1z",
36349
36438
  fill: "CurrentColor"
36350
36439
  })));
36351
36440
  }
36352
36441
 
36353
- var _path$1l;
36354
- function _extends$1p() {
36355
- return _extends$1p = Object.assign ? Object.assign.bind() : function (n) {
36442
+ var _path$1m;
36443
+ function _extends$1q() {
36444
+ return _extends$1q = Object.assign ? Object.assign.bind() : function (n) {
36356
36445
  for (var e = 1; e < arguments.length; e++) {
36357
36446
  var t = arguments[e];
36358
36447
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
36359
36448
  }
36360
36449
  return n;
36361
- }, _extends$1p.apply(null, arguments);
36450
+ }, _extends$1q.apply(null, arguments);
36362
36451
  }
36363
36452
  function SvgMoreVert(props) {
36364
- return /*#__PURE__*/createElement$1("svg", _extends$1p({
36453
+ return /*#__PURE__*/createElement$1("svg", _extends$1q({
36365
36454
  width: 4,
36366
36455
  height: 14,
36367
36456
  fill: "none",
36368
36457
  xmlns: "http://www.w3.org/2000/svg"
36369
- }, props), _path$1l || (_path$1l = /*#__PURE__*/createElement$1("path", {
36458
+ }, props), _path$1m || (_path$1m = /*#__PURE__*/createElement$1("path", {
36370
36459
  d: "M.532 11.012c.355-.355.764-.533 1.228-.533.464 0 .874.178 1.228.533.355.354.532.764.532 1.228 0 .464-.177.873-.532 1.228-.354.355-.764.532-1.228.532-.464 0-.873-.177-1.228-.532C.177 13.113 0 12.704 0 12.24c0-.464.177-.873.532-1.228zm0-5.24c.355-.355.764-.532 1.228-.532.464 0 .874.177 1.228.532.355.355.532.764.532 1.228 0 .464-.177.873-.532 1.228-.354.355-.764.532-1.228.532-.464 0-.873-.177-1.228-.532C.177 7.873 0 7.464 0 7c0-.464.177-.873.532-1.228zm2.456-2.784c-.354.355-.764.532-1.228.532-.464 0-.873-.177-1.228-.532C.177 2.634 0 2.224 0 1.76 0 1.296.177.887.532.532.887.177 1.296 0 1.76 0c.464 0 .874.177 1.228.532.355.355.532.764.532 1.228 0 .464-.177.874-.532 1.228z",
36371
36460
  fill: "#9B9DA8"
36372
36461
  })));
@@ -36859,18 +36948,18 @@ var Media = function Media(_ref) {
36859
36948
  var Container$n = styled.div(_templateObject$M || (_templateObject$M = _taggedTemplateLiteralLoose(["\n padding: 6px 4px;\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n transition: all 0.2s;\n align-items: flex-start;\n display: flex;\n flex-wrap: wrap;\n"])));
36860
36949
  var MediaItem = styled.div(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteralLoose(["\n width: calc(33.3333% - 4px);\n height: 110px;\n box-sizing: border-box;\n //border: 1px solid #ccc;\n border: 0.5px solid rgba(0, 0, 0, 0.1);\n border-radius: 8px;\n overflow: hidden;\n margin: 2px;\n"])));
36861
36950
 
36862
- var _rect$3, _path$1m;
36863
- function _extends$1q() {
36864
- return _extends$1q = Object.assign ? Object.assign.bind() : function (n) {
36951
+ var _rect$3, _path$1n;
36952
+ function _extends$1r() {
36953
+ return _extends$1r = Object.assign ? Object.assign.bind() : function (n) {
36865
36954
  for (var e = 1; e < arguments.length; e++) {
36866
36955
  var t = arguments[e];
36867
36956
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
36868
36957
  }
36869
36958
  return n;
36870
- }, _extends$1q.apply(null, arguments);
36959
+ }, _extends$1r.apply(null, arguments);
36871
36960
  }
36872
36961
  function SvgFileIcon$1(props) {
36873
- return /*#__PURE__*/createElement$1("svg", _extends$1q({
36962
+ return /*#__PURE__*/createElement$1("svg", _extends$1r({
36874
36963
  width: 40,
36875
36964
  height: 40,
36876
36965
  fill: "none",
@@ -36882,7 +36971,7 @@ function SvgFileIcon$1(props) {
36882
36971
  rx: 8,
36883
36972
  fill: "currentColor",
36884
36973
  fillOpacity: 0.2
36885
- })), _path$1m || (_path$1m = /*#__PURE__*/createElement$1("path", {
36974
+ })), _path$1n || (_path$1n = /*#__PURE__*/createElement$1("path", {
36886
36975
  fillRule: "evenodd",
36887
36976
  clipRule: "evenodd",
36888
36977
  d: "M18.022 9.714c-2.098 0-3.023.185-3.962.687a4.685 4.685 0 00-1.944 1.944c-.502.94-.687 1.864-.687 3.962v7.386c0 2.098.184 3.023.687 3.962a4.686 4.686 0 001.944 1.944c.938.502 1.864.687 3.962.687h3.957c2.098 0 3.023-.185 3.962-.687a4.686 4.686 0 001.944-1.944c.502-.939.687-1.864.687-3.962v-5.1c0-.683-.024-.99-.105-1.34a3.097 3.097 0 00-.399-.964c-.19-.305-.391-.539-.874-1.022l-4.175-4.175c-.483-.483-.717-.683-1.022-.874a3.095 3.095 0 00-.964-.399c-.293-.068-.556-.095-1.033-.103v-.002h-1.978zm0 1.715c-2.002 0-2.587.181-3.154.484a2.971 2.971 0 00-1.24 1.24c-.304.567-.485 1.153-.485 3.154v7.386c0 2.001.181 2.587.484 3.153.288.538.704.954 1.241 1.241.566.303 1.152.485 3.154.485h3.957c2.001 0 2.587-.182 3.153-.485a2.971 2.971 0 001.241-1.24c.303-.567.484-1.153.484-3.154v-5.1c0-.117 0-.219-.002-.308h-4.712A2.143 2.143 0 0120 16.144l.001-4.712-.15-.002h-1.83zm3.784.875l-.092-.091v3.93c0 .21.152.385.352.422l.077.006 3.932.002-.093-.093-4.176-4.176zm-6.092 12.839c0-.474.384-.857.858-.857H20A.857.857 0 1120 26h-3.428a.857.857 0 01-.858-.857zm.858-4.286a.857.857 0 000 1.715h6a.857.857 0 000-1.715h-6z",
@@ -36890,23 +36979,23 @@ function SvgFileIcon$1(props) {
36890
36979
  })));
36891
36980
  }
36892
36981
 
36893
- var _path$1n;
36894
- function _extends$1r() {
36895
- return _extends$1r = Object.assign ? Object.assign.bind() : function (n) {
36982
+ var _path$1o;
36983
+ function _extends$1s() {
36984
+ return _extends$1s = Object.assign ? Object.assign.bind() : function (n) {
36896
36985
  for (var e = 1; e < arguments.length; e++) {
36897
36986
  var t = arguments[e];
36898
36987
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
36899
36988
  }
36900
36989
  return n;
36901
- }, _extends$1r.apply(null, arguments);
36990
+ }, _extends$1s.apply(null, arguments);
36902
36991
  }
36903
36992
  function SvgDownloadFile(props) {
36904
- return /*#__PURE__*/createElement$1("svg", _extends$1r({
36993
+ return /*#__PURE__*/createElement$1("svg", _extends$1s({
36905
36994
  width: 24,
36906
36995
  height: 24,
36907
36996
  xmlns: "http://www.w3.org/2000/svg",
36908
36997
  fill: "currentColor"
36909
- }, props), _path$1n || (_path$1n = /*#__PURE__*/createElement$1("path", {
36998
+ }, props), _path$1o || (_path$1o = /*#__PURE__*/createElement$1("path", {
36910
36999
  fillRule: "evenodd",
36911
37000
  clipRule: "evenodd",
36912
37001
  d: "M12 2a.91.91 0 01.91.91v11.44l2.993-2.993a.91.91 0 011.285 1.286l-4.545 4.545a.91.91 0 01-1.286 0l-4.545-4.545a.909.909 0 111.285-1.286l2.994 2.994V2.909A.91.91 0 0112 2zM2.91 15.636a.91.91 0 01.908.91v1.136a2.5 2.5 0 002.5 2.5h11.364a2.5 2.5 0 002.5-2.5v-1.136a.91.91 0 111.818 0v1.136A4.318 4.318 0 0117.682 22H6.318A4.318 4.318 0 012 17.682v-1.136a.91.91 0 01.91-.91z"
@@ -37061,18 +37150,18 @@ var FileSizeAndDate = styled.span(_templateObject8$i || (_templateObject8$i = _t
37061
37150
  return props.color;
37062
37151
  });
37063
37152
 
37064
- var _rect$4, _path$1o;
37065
- function _extends$1s() {
37066
- return _extends$1s = Object.assign ? Object.assign.bind() : function (n) {
37153
+ var _rect$4, _path$1p;
37154
+ function _extends$1t() {
37155
+ return _extends$1t = Object.assign ? Object.assign.bind() : function (n) {
37067
37156
  for (var e = 1; e < arguments.length; e++) {
37068
37157
  var t = arguments[e];
37069
37158
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
37070
37159
  }
37071
37160
  return n;
37072
- }, _extends$1s.apply(null, arguments);
37161
+ }, _extends$1t.apply(null, arguments);
37073
37162
  }
37074
37163
  function SvgLinkIcon(props) {
37075
- return /*#__PURE__*/createElement$1("svg", _extends$1s({
37164
+ return /*#__PURE__*/createElement$1("svg", _extends$1t({
37076
37165
  width: 40,
37077
37166
  height: 40,
37078
37167
  fill: "none",
@@ -37084,7 +37173,7 @@ function SvgLinkIcon(props) {
37084
37173
  rx: 8,
37085
37174
  fill: "currentColor",
37086
37175
  fillOpacity: 0.2
37087
- })), _path$1o || (_path$1o = /*#__PURE__*/createElement$1("path", {
37176
+ })), _path$1p || (_path$1p = /*#__PURE__*/createElement$1("path", {
37088
37177
  fillRule: "evenodd",
37089
37178
  clipRule: "evenodd",
37090
37179
  d: "M21.547 11.524a4.9 4.9 0 016.928 6.929l-.01.011-4 4a4.9 4.9 0 01-6.93 0 .9.9 0 011.273-1.273 3.1 3.1 0 004.384 0l3.994-3.994a3.1 3.1 0 00-4.384-4.383l-1.094 1.094a.9.9 0 01-1.272-1.273l1.1-1.1.01-.01zm-6.011 6.011a4.9 4.9 0 016.928 0 .9.9 0 11-1.272 1.273 3.1 3.1 0 00-4.384 0l-4 4-.01.011a3.1 3.1 0 104.383 4.384l.01-.012 1.103-1.1a.9.9 0 111.272 1.272l-1.097 1.096a4.9 4.9 0 11-6.928-6.929l3.995-3.995z",
@@ -37168,18 +37257,18 @@ var Links = function Links(_ref) {
37168
37257
  };
37169
37258
  var Container$p = styled.ul(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 11px 0 0;\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n transition: all 0.2s;\n"])));
37170
37259
 
37171
- var _rect$5, _path$1p;
37172
- function _extends$1t() {
37173
- return _extends$1t = Object.assign ? Object.assign.bind() : function (n) {
37260
+ var _rect$5, _path$1q;
37261
+ function _extends$1u() {
37262
+ return _extends$1u = Object.assign ? Object.assign.bind() : function (n) {
37174
37263
  for (var e = 1; e < arguments.length; e++) {
37175
37264
  var t = arguments[e];
37176
37265
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
37177
37266
  }
37178
37267
  return n;
37179
- }, _extends$1t.apply(null, arguments);
37268
+ }, _extends$1u.apply(null, arguments);
37180
37269
  }
37181
37270
  function SvgVoicePreview(props) {
37182
- return /*#__PURE__*/createElement$1("svg", _extends$1t({
37271
+ return /*#__PURE__*/createElement$1("svg", _extends$1u({
37183
37272
  width: 40,
37184
37273
  height: 40,
37185
37274
  fill: "none",
@@ -37189,24 +37278,24 @@ function SvgVoicePreview(props) {
37189
37278
  height: 40,
37190
37279
  rx: 20,
37191
37280
  fill: "#5159F6"
37192
- })), _path$1p || (_path$1p = /*#__PURE__*/createElement$1("path", {
37281
+ })), _path$1q || (_path$1q = /*#__PURE__*/createElement$1("path", {
37193
37282
  d: "M27.536 18.696c.952.576.952 2.03 0 2.605l-9.918 5.997c-.944.57-2.118-.151-2.118-1.303V14.002c0-1.151 1.174-1.873 2.118-1.303l9.918 5.997z",
37194
37283
  fill: "#fff"
37195
37284
  })));
37196
37285
  }
37197
37286
 
37198
- var _rect$6, _path$1q;
37199
- function _extends$1u() {
37200
- return _extends$1u = Object.assign ? Object.assign.bind() : function (n) {
37287
+ var _rect$6, _path$1r;
37288
+ function _extends$1v() {
37289
+ return _extends$1v = Object.assign ? Object.assign.bind() : function (n) {
37201
37290
  for (var e = 1; e < arguments.length; e++) {
37202
37291
  var t = arguments[e];
37203
37292
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
37204
37293
  }
37205
37294
  return n;
37206
- }, _extends$1u.apply(null, arguments);
37295
+ }, _extends$1v.apply(null, arguments);
37207
37296
  }
37208
37297
  function SvgVoicePreviewPause(props) {
37209
- return /*#__PURE__*/createElement$1("svg", _extends$1u({
37298
+ return /*#__PURE__*/createElement$1("svg", _extends$1v({
37210
37299
  width: 40,
37211
37300
  height: 40,
37212
37301
  fill: "none",
@@ -37216,7 +37305,7 @@ function SvgVoicePreviewPause(props) {
37216
37305
  height: 40,
37217
37306
  rx: 20,
37218
37307
  fill: "#5159F6"
37219
- })), _path$1q || (_path$1q = /*#__PURE__*/createElement$1("path", {
37308
+ })), _path$1r || (_path$1r = /*#__PURE__*/createElement$1("path", {
37220
37309
  d: "M16.962 12.5c.535 0 .729.056.924.16.196.105.35.258.454.454.104.195.16.39.16.924v11.924c0 .535-.056.729-.16.924a1.09 1.09 0 01-.454.454c-.195.104-.39.16-.924.16h-1.424c-.535 0-.729-.056-.924-.16a1.09 1.09 0 01-.454-.454c-.104-.195-.16-.39-.16-.924V14.038c0-.535.056-.729.16-.924a1.09 1.09 0 01.454-.454c.195-.104.39-.16.924-.16h1.424zm7.5 0c.535 0 .729.056.924.16.196.105.35.258.454.454.104.195.16.39.16.924v11.924c0 .535-.056.729-.16.924a1.09 1.09 0 01-.454.454c-.195.104-.39.16-.924.16h-1.424c-.535 0-.729-.056-.924-.16a1.09 1.09 0 01-.454-.454c-.104-.195-.16-.39-.16-.924V14.038c0-.535.056-.729.16-.924a1.09 1.09 0 01.454-.454c.195-.104.39-.16.924-.16h1.424z",
37221
37310
  fill: "#fff"
37222
37311
  })));
@@ -38502,23 +38591,23 @@ var ChannelDetailsContainer = function ChannelDetailsContainer(_ref) {
38502
38591
  };
38503
38592
  var DetailsWrapper = styled.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteralLoose([""])));
38504
38593
 
38505
- var _path$1r;
38506
- function _extends$1v() {
38507
- return _extends$1v = Object.assign ? Object.assign.bind() : function (n) {
38594
+ var _path$1s;
38595
+ function _extends$1w() {
38596
+ return _extends$1w = Object.assign ? Object.assign.bind() : function (n) {
38508
38597
  for (var e = 1; e < arguments.length; e++) {
38509
38598
  var t = arguments[e];
38510
38599
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
38511
38600
  }
38512
38601
  return n;
38513
- }, _extends$1v.apply(null, arguments);
38602
+ }, _extends$1w.apply(null, arguments);
38514
38603
  }
38515
38604
  function SvgChevronDown(props) {
38516
- return /*#__PURE__*/createElement$1("svg", _extends$1v({
38605
+ return /*#__PURE__*/createElement$1("svg", _extends$1w({
38517
38606
  width: 32,
38518
38607
  height: 32,
38519
38608
  fill: "none",
38520
38609
  xmlns: "http://www.w3.org/2000/svg"
38521
- }, props), _path$1r || (_path$1r = /*#__PURE__*/createElement$1("path", {
38610
+ }, props), _path$1s || (_path$1s = /*#__PURE__*/createElement$1("path", {
38522
38611
  d: "M9.298 12.937a1.056 1.056 0 10-1.374 1.603l7.39 6.333c.395.339.978.339 1.373 0l7.389-6.333a1.056 1.056 0 10-1.374-1.603L16 18.68l-6.702-5.744z",
38523
38612
  fill: "CurrentColor"
38524
38613
  })));