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

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) {
@@ -19252,6 +19274,7 @@ var Avatar = function Avatar(_ref) {
19252
19274
  border = _ref.border,
19253
19275
  borderRadius = _ref.borderRadius,
19254
19276
  handleAvatarClick = _ref.handleAvatarClick;
19277
+ var theme = useSelector(themeSelector);
19255
19278
  var _useColor = useColors(),
19256
19279
  iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE];
19257
19280
  var isDeletedUserAvatar = !image && !name;
@@ -19279,7 +19302,8 @@ var Avatar = function Avatar(_ref) {
19279
19302
  textSize: textSize,
19280
19303
  onClick: handleAvatarClick,
19281
19304
  cursorPointer: !!handleAvatarClick,
19282
- borderRadius: borderRadius
19305
+ borderRadius: borderRadius,
19306
+ theme: theme
19283
19307
  }, isDeletedUserAvatar ? DeletedIcon || /*#__PURE__*/React__default.createElement(DeletedAvatarWrapper, {
19284
19308
  color: iconInactive
19285
19309
  }) : !image ? setDefaultAvatar ? DefaultAvatar || /*#__PURE__*/React__default.createElement(DefaultAvatarWrapper, {
@@ -19303,7 +19327,7 @@ var Container$1 = styled.div(_templateObject$3 || (_templateObject$3 = _taggedTe
19303
19327
  }, function (props) {
19304
19328
  return props.marginAuto ? 'auto' : '';
19305
19329
  }, function (props) {
19306
- return !props.isImage ? "background-color:" + generateAvatarColor(props.avatarName) + ";" : '';
19330
+ return !props.isImage ? "background-color:" + generateAvatarColor(props.avatarName, props.theme) + ";" : '';
19307
19331
  }, function (props) {
19308
19332
  return props.cursorPointer && 'pointer';
19309
19333
  }, function (props) {
@@ -19594,22 +19618,7 @@ var Channel = function Channel(_ref2) {
19594
19618
  color: iconInactive
19595
19619
  }, pinedIcon || /*#__PURE__*/React__default.createElement(SvgPin, null)))));
19596
19620
  };
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) {
19621
+ 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
19622
  return props.avatar && '12px';
19614
19623
  }, function (props) {
19615
19624
  return props.avatarSize ? "calc(100% - " + (props.avatarSize + 52) + "px)" : "calc(100% - " + (props.isPinned ? 92 : 72) + "px)";
@@ -19624,10 +19633,10 @@ var ChannelInfo = styled.div(_templateObject2$4 || (_templateObject2$4 = _tagged
19624
19633
  }, function (props) {
19625
19634
  return props.uppercase && 'uppercase';
19626
19635
  });
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) {
19636
+ 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
19637
  return props.color;
19629
19638
  });
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) {
19639
+ 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
19640
  return props.fontSize || '14px';
19632
19641
  }, function (props) {
19633
19642
  return props.color;
@@ -19636,12 +19645,31 @@ var LastMessage = styled.div(_templateObject4$3 || (_templateObject4$3 = _tagged
19636
19645
  }, function (props) {
19637
19646
  return props.height || '20px';
19638
19647
  });
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) {
19648
+ var AvatarWrapper = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19649
+ 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
19650
  return props.backgroundColor || '#56E464';
19642
19651
  }, function (props) {
19643
19652
  return props.borderColor || '#ffffff';
19644
19653
  });
19654
+ 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) {
19655
+ return props.selectedChannel ? props.selectedBackgroundColor : 'inherit';
19656
+ }, function (props) {
19657
+ return props.selectedChannel ? props.selectedChannelLeftBorder : null;
19658
+ }, function (props) {
19659
+ return props.selectedChannel ? props.selectedChannelPaddings || props.channelsPaddings || '8px' : props.channelsPaddings || '8px';
19660
+ }, function (props) {
19661
+ return props.channelsMargin || '0 8px';
19662
+ }, function (props) {
19663
+ return props.selectedChannelBorderRadius || '12px';
19664
+ }, function (_ref3) {
19665
+ var selectedChannel = _ref3.selectedChannel,
19666
+ hoverBackground = _ref3.hoverBackground;
19667
+ return !selectedChannel && "\n background-color: " + hoverBackground + ";\n ";
19668
+ }, UserStatus, function (props) {
19669
+ return props.selectedChannel ? props.selectedBackgroundColor : props.hoverBackground;
19670
+ }, UserStatus, function (props) {
19671
+ return props.selectedChannel && "\n border-color: " + props.selectedBackgroundColor + ";\n ";
19672
+ });
19645
19673
  var DraftMessageTitle = styled.span(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (props) {
19646
19674
  return props.color;
19647
19675
  });
@@ -19812,14 +19840,7 @@ var ContactItem = function ContactItem(_ref) {
19812
19840
  textColor: textPrimary
19813
19841
  }, /*#__PURE__*/React__default.createElement("h3", null, contactUserName)));
19814
19842
  };
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) {
19843
+ 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
19844
  return props.avatar && '12px';
19824
19845
  }, function (props) {
19825
19846
  return props.subjectFontSize || '15px';
@@ -19828,12 +19849,21 @@ var ChannelInfo$1 = styled.div(_templateObject2$6 || (_templateObject2$6 = _tagg
19828
19849
  }, function (props) {
19829
19850
  return props.subjectColor || props.textColor;
19830
19851
  });
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) {
19852
+ var AvatarWrapper$1 = styled.div(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n"])));
19853
+ 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
19854
  return props.backgroundColor || '#56E464';
19834
19855
  }, function (props) {
19835
19856
  return props.borderColor || '#ffffff';
19836
19857
  });
19858
+ 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) {
19859
+ return props.channelsPaddings || '8px';
19860
+ }, function (props) {
19861
+ return props.channelsMargin || '0 8px';
19862
+ }, function (props) {
19863
+ return props.hoverBackground;
19864
+ }, UserStatus$1, function (props) {
19865
+ return props.hoverBackground;
19866
+ });
19837
19867
 
19838
19868
  var _path$f;
19839
19869
  function _extends$g() {
@@ -24845,6 +24875,31 @@ function SvgReplyInThreadIcon(props) {
24845
24875
  })));
24846
24876
  }
24847
24877
 
24878
+ var _path$R;
24879
+ function _extends$S() {
24880
+ return _extends$S = Object.assign ? Object.assign.bind() : function (n) {
24881
+ for (var e = 1; e < arguments.length; e++) {
24882
+ var t = arguments[e];
24883
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
24884
+ }
24885
+ return n;
24886
+ }, _extends$S.apply(null, arguments);
24887
+ }
24888
+ function SvgArrowDown(props) {
24889
+ return /*#__PURE__*/createElement$1("svg", _extends$S({
24890
+ width: 20,
24891
+ height: 8,
24892
+ viewBox: "0 0 20 20",
24893
+ fill: "none",
24894
+ xmlns: "http://www.w3.org/2000/svg"
24895
+ }, props), _path$R || (_path$R = /*#__PURE__*/createElement$1("path", {
24896
+ fillRule: "evenodd",
24897
+ clipRule: "evenodd",
24898
+ d: "M10 8C7 8 4 0 0 0h20c-3.975 0-7 8-10 8z",
24899
+ fill: "currentColor"
24900
+ })));
24901
+ }
24902
+
24848
24903
  var _templateObject$r, _templateObject2$n, _templateObject3$h;
24849
24904
  function MessageActions(_ref) {
24850
24905
  var editModeToggle = _ref.editModeToggle,
@@ -24904,10 +24959,10 @@ function MessageActions(_ref) {
24904
24959
  accentColor = _useColor[THEME_COLORS.ACCENT],
24905
24960
  backgroundSections = _useColor[THEME_COLORS.BACKGROUND_SECTIONS],
24906
24961
  backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED],
24907
- surface2 = _useColor[THEME_COLORS.SURFACE_2],
24908
24962
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
24909
24963
  warningColor = _useColor[THEME_COLORS.WARNING],
24910
- iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE];
24964
+ iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE],
24965
+ tooltipBackground = _useColor[THEME_COLORS.TOOLTIP_BACKGROUND];
24911
24966
  var ChatClient = getClient();
24912
24967
  var user = ChatClient.user;
24913
24968
  var _usePermissions = usePermissions(myRole),
@@ -24938,9 +24993,9 @@ function MessageActions(_ref) {
24938
24993
  onClick: handleOpenReaction
24939
24994
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24940
24995
  disabledColor: textSecondary,
24941
- bgColor: surface2,
24996
+ bgColor: tooltipBackground,
24942
24997
  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, {
24998
+ }, 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
24999
  order: editIconOrder || 1,
24945
25000
  iconColor: messageActionIconsColor || iconInactive,
24946
25001
  hoverBackgroundColor: backgroundHovered,
@@ -24950,9 +25005,9 @@ function MessageActions(_ref) {
24950
25005
  }
24951
25006
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24952
25007
  disabledColor: textSecondary,
24953
- bgColor: surface2,
25008
+ bgColor: tooltipBackground,
24954
25009
  direction: 'top'
24955
- }, editIconTooltipText || 'Edit Message'), editIcon || /*#__PURE__*/React__default.createElement(SvgEditIcon, null))), messageStatus === MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
25010
+ }, 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
25011
  iconColor: messageActionIconsColor || iconInactive,
24957
25012
  hoverBackgroundColor: backgroundHovered,
24958
25013
  hoverIconColor: accentColor,
@@ -24961,9 +25016,9 @@ function MessageActions(_ref) {
24961
25016
  }
24962
25017
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24963
25018
  disabledColor: textSecondary,
24964
- bgColor: surface2,
25019
+ bgColor: tooltipBackground,
24965
25020
  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, {
25021
+ }, ' ', "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
25022
  order: replyIconOrder || 2,
24968
25023
  iconColor: messageActionIconsColor || iconInactive,
24969
25024
  hoverBackgroundColor: backgroundHovered,
@@ -24973,9 +25028,9 @@ function MessageActions(_ref) {
24973
25028
  }
24974
25029
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24975
25030
  disabledColor: textSecondary,
24976
- bgColor: surface2,
25031
+ bgColor: tooltipBackground,
24977
25032
  direction: 'top'
24978
- }, replyIconTooltipText || 'Reply'), replyIcon || /*#__PURE__*/React__default.createElement(SvgReplyIcon, null))), showReplyMessageInThread && replyMessagePermitted && (/*#__PURE__*/React__default.createElement(Action, {
25033
+ }, replyIconTooltipText || 'Reply', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), replyIcon || /*#__PURE__*/React__default.createElement(SvgReplyIcon, null))), showReplyMessageInThread && replyMessagePermitted && (/*#__PURE__*/React__default.createElement(Action, {
24979
25034
  order: replyInThreadIconOrder || 3,
24980
25035
  iconColor: messageActionIconsColor || iconInactive,
24981
25036
  hoverBackgroundColor: backgroundHovered,
@@ -24985,9 +25040,9 @@ function MessageActions(_ref) {
24985
25040
  }
24986
25041
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24987
25042
  disabledColor: textSecondary,
24988
- bgColor: surface2,
25043
+ bgColor: tooltipBackground,
24989
25044
  direction: 'top'
24990
- }, replyInThreadIconTooltipText || 'Reply in thread'), replyInThreadIcon || /*#__PURE__*/React__default.createElement(SvgReplyInThreadIcon, null))))), showCopyMessage && (/*#__PURE__*/React__default.createElement(Action, {
25045
+ }, replyInThreadIconTooltipText || 'Reply in thread', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), replyInThreadIcon || /*#__PURE__*/React__default.createElement(SvgReplyInThreadIcon, null))))), showCopyMessage && (/*#__PURE__*/React__default.createElement(Action, {
24991
25046
  order: copyIconOrder || 4,
24992
25047
  iconColor: messageActionIconsColor || iconInactive,
24993
25048
  hoverBackgroundColor: backgroundHovered,
@@ -24997,9 +25052,9 @@ function MessageActions(_ref) {
24997
25052
  }
24998
25053
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
24999
25054
  disabledColor: textSecondary,
25000
- bgColor: surface2,
25055
+ bgColor: tooltipBackground,
25001
25056
  direction: 'top'
25002
- }, copyIconTooltipText || 'Copy'), copyIcon || /*#__PURE__*/React__default.createElement(SvgCopyIcon, null))), showForwardMessage && forwardMessagePermitted && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
25057
+ }, 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
25058
  order: forwardIconOrder || 5,
25004
25059
  iconColor: messageActionIconsColor || iconInactive,
25005
25060
  hoverBackgroundColor: backgroundHovered,
@@ -25009,9 +25064,9 @@ function MessageActions(_ref) {
25009
25064
  }
25010
25065
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
25011
25066
  disabledColor: textSecondary,
25012
- bgColor: surface2,
25067
+ bgColor: tooltipBackground,
25013
25068
  direction: 'top'
25014
- }, forwardIconTooltipText || 'Forward Message'), forwardIcon || /*#__PURE__*/React__default.createElement(SvgForward, null))), showSelectMessage && (/*#__PURE__*/React__default.createElement(Action, {
25069
+ }, forwardIconTooltipText || 'Forward Message', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), forwardIcon || /*#__PURE__*/React__default.createElement(SvgForward, null))), showSelectMessage && (/*#__PURE__*/React__default.createElement(Action, {
25015
25070
  order: selectIconOrder || 6,
25016
25071
  iconColor: messageActionIconsColor || iconInactive,
25017
25072
  hoverBackgroundColor: backgroundHovered,
@@ -25021,9 +25076,9 @@ function MessageActions(_ref) {
25021
25076
  }
25022
25077
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
25023
25078
  disabledColor: textSecondary,
25024
- bgColor: surface2,
25079
+ bgColor: tooltipBackground,
25025
25080
  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, {
25081
+ }, 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
25082
  order: deleteIconOrder || 7,
25028
25083
  iconColor: messageActionIconsColor || warningColor,
25029
25084
  hoverBackgroundColor: backgroundHovered,
@@ -25033,9 +25088,9 @@ function MessageActions(_ref) {
25033
25088
  }
25034
25089
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
25035
25090
  disabledColor: textSecondary,
25036
- bgColor: surface2,
25091
+ bgColor: tooltipBackground,
25037
25092
  direction: 'top'
25038
- }, deleteIconTooltipText || 'Delete Message'), deleteIcon || /*#__PURE__*/React__default.createElement(SvgDeleteIcon, null))), showReportMessage && messageStatus !== MESSAGE_DELIVERY_STATUS.PENDING && (/*#__PURE__*/React__default.createElement(Action, {
25093
+ }, 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
25094
  order: reportIconOrder || 8,
25040
25095
  iconColor: messageActionIconsColor || iconInactive,
25041
25096
  hoverBackgroundColor: backgroundHovered,
@@ -25045,9 +25100,9 @@ function MessageActions(_ref) {
25045
25100
  }
25046
25101
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
25047
25102
  disabledColor: textSecondary,
25048
- bgColor: surface2,
25103
+ bgColor: tooltipBackground,
25049
25104
  direction: 'top'
25050
- }, reportIconTooltipText || 'Report'), reportIcon || /*#__PURE__*/React__default.createElement(SvgReportIcon, null)))));
25105
+ }, reportIconTooltipText || 'Report', /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), reportIcon || /*#__PURE__*/React__default.createElement(SvgReportIcon, null)))));
25051
25106
  }
25052
25107
  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
25108
  var isThreadMessage = _ref2.isThreadMessage,
@@ -25074,18 +25129,18 @@ var Action = styled.div(_templateObject3$h || (_templateObject3$h = _taggedTempl
25074
25129
  return props.hoverBackgroundColor;
25075
25130
  }, ItemNote);
25076
25131
 
25077
- var _rect$1, _path$R;
25078
- function _extends$S() {
25079
- return _extends$S = Object.assign ? Object.assign.bind() : function (n) {
25132
+ var _rect$1, _path$S;
25133
+ function _extends$T() {
25134
+ return _extends$T = Object.assign ? Object.assign.bind() : function (n) {
25080
25135
  for (var e = 1; e < arguments.length; e++) {
25081
25136
  var t = arguments[e];
25082
25137
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25083
25138
  }
25084
25139
  return n;
25085
- }, _extends$S.apply(null, arguments);
25140
+ }, _extends$T.apply(null, arguments);
25086
25141
  }
25087
25142
  function SvgFileIcon(props) {
25088
- return /*#__PURE__*/createElement$1("svg", _extends$S({
25143
+ return /*#__PURE__*/createElement$1("svg", _extends$T({
25089
25144
  width: 40,
25090
25145
  height: 40,
25091
25146
  viewBox: "0 0 40.01 40.01",
@@ -25096,24 +25151,24 @@ function SvgFileIcon(props) {
25096
25151
  height: 40,
25097
25152
  rx: 20,
25098
25153
  fill: "Transparent"
25099
- })), _path$R || (_path$R = /*#__PURE__*/createElement$1("path", {
25154
+ })), _path$S || (_path$S = /*#__PURE__*/createElement$1("path", {
25100
25155
  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
25156
  fill: "#fff"
25102
25157
  })));
25103
25158
  }
25104
25159
 
25105
- var _circle$2, _path$S;
25106
- function _extends$T() {
25107
- return _extends$T = Object.assign ? Object.assign.bind() : function (n) {
25160
+ var _circle$2, _path$T;
25161
+ function _extends$U() {
25162
+ return _extends$U = Object.assign ? Object.assign.bind() : function (n) {
25108
25163
  for (var e = 1; e < arguments.length; e++) {
25109
25164
  var t = arguments[e];
25110
25165
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25111
25166
  }
25112
25167
  return n;
25113
- }, _extends$T.apply(null, arguments);
25168
+ }, _extends$U.apply(null, arguments);
25114
25169
  }
25115
25170
  function SvgDeleteUpload(props) {
25116
- return /*#__PURE__*/createElement$1("svg", _extends$T({
25171
+ return /*#__PURE__*/createElement$1("svg", _extends$U({
25117
25172
  width: 20,
25118
25173
  height: 20,
25119
25174
  viewBox: "0 0 20.01 20.01",
@@ -25126,7 +25181,7 @@ function SvgDeleteUpload(props) {
25126
25181
  fill: "CurrentColor",
25127
25182
  stroke: "#fff",
25128
25183
  strokeWidth: 1.4
25129
- })), _path$S || (_path$S = /*#__PURE__*/createElement$1("path", {
25184
+ })), _path$T || (_path$T = /*#__PURE__*/createElement$1("path", {
25130
25185
  d: "M13.5 6.5l-7 7M6.5 6.5l7 7",
25131
25186
  stroke: "#fff",
25132
25187
  strokeWidth: 1.4,
@@ -25135,24 +25190,24 @@ function SvgDeleteUpload(props) {
25135
25190
  })));
25136
25191
  }
25137
25192
 
25138
- var _path$T;
25139
- function _extends$U() {
25140
- return _extends$U = Object.assign ? Object.assign.bind() : function (n) {
25193
+ var _path$U;
25194
+ function _extends$V() {
25195
+ return _extends$V = Object.assign ? Object.assign.bind() : function (n) {
25141
25196
  for (var e = 1; e < arguments.length; e++) {
25142
25197
  var t = arguments[e];
25143
25198
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25144
25199
  }
25145
25200
  return n;
25146
- }, _extends$U.apply(null, arguments);
25201
+ }, _extends$V.apply(null, arguments);
25147
25202
  }
25148
25203
  function SvgUpload(props) {
25149
- return /*#__PURE__*/createElement$1("svg", _extends$U({
25204
+ return /*#__PURE__*/createElement$1("svg", _extends$V({
25150
25205
  width: 32,
25151
25206
  height: 32,
25152
25207
  viewBox: "0 0 32.01 32.01",
25153
25208
  fill: "none",
25154
25209
  xmlns: "http://www.w3.org/2000/svg"
25155
- }, props), _path$T || (_path$T = /*#__PURE__*/createElement$1("path", {
25210
+ }, props), _path$U || (_path$U = /*#__PURE__*/createElement$1("path", {
25156
25211
  fillRule: "evenodd",
25157
25212
  clipRule: "evenodd",
25158
25213
  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 +25215,18 @@ function SvgUpload(props) {
25160
25215
  })));
25161
25216
  }
25162
25217
 
25163
- var _circle$3, _path$U;
25164
- function _extends$V() {
25165
- return _extends$V = Object.assign ? Object.assign.bind() : function (n) {
25218
+ var _circle$3, _path$V;
25219
+ function _extends$W() {
25220
+ return _extends$W = Object.assign ? Object.assign.bind() : function (n) {
25166
25221
  for (var e = 1; e < arguments.length; e++) {
25167
25222
  var t = arguments[e];
25168
25223
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25169
25224
  }
25170
25225
  return n;
25171
- }, _extends$V.apply(null, arguments);
25226
+ }, _extends$W.apply(null, arguments);
25172
25227
  }
25173
25228
  function SvgPlayVideo(props) {
25174
- return /*#__PURE__*/createElement$1("svg", _extends$V({
25229
+ return /*#__PURE__*/createElement$1("svg", _extends$W({
25175
25230
  width: 56,
25176
25231
  height: 56,
25177
25232
  fill: "none",
@@ -25182,7 +25237,7 @@ function SvgPlayVideo(props) {
25182
25237
  r: 28,
25183
25238
  fill: "#17191C",
25184
25239
  fillOpacity: 0.4
25185
- })), _path$U || (_path$U = /*#__PURE__*/createElement$1("path", {
25240
+ })), _path$V || (_path$V = /*#__PURE__*/createElement$1("path", {
25186
25241
  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
25242
  fill: "#fff"
25188
25243
  })));
@@ -25377,18 +25432,18 @@ var AttachmentImg = styled.img(_templateObject7$a || (_templateObject7$a = _tagg
25377
25432
  return props.borderRadius || '6px';
25378
25433
  });
25379
25434
 
25380
- var _circle$4, _path$V;
25381
- function _extends$W() {
25382
- return _extends$W = Object.assign ? Object.assign.bind() : function (n) {
25435
+ var _circle$4, _path$W;
25436
+ function _extends$X() {
25437
+ return _extends$X = Object.assign ? Object.assign.bind() : function (n) {
25383
25438
  for (var e = 1; e < arguments.length; e++) {
25384
25439
  var t = arguments[e];
25385
25440
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25386
25441
  }
25387
25442
  return n;
25388
- }, _extends$W.apply(null, arguments);
25443
+ }, _extends$X.apply(null, arguments);
25389
25444
  }
25390
25445
  function SvgPlay(props) {
25391
- return /*#__PURE__*/createElement$1("svg", _extends$W({
25446
+ return /*#__PURE__*/createElement$1("svg", _extends$X({
25392
25447
  width: 32,
25393
25448
  height: 32,
25394
25449
  viewBox: "0 0 33 33",
@@ -25399,24 +25454,24 @@ function SvgPlay(props) {
25399
25454
  cy: 16,
25400
25455
  r: 16,
25401
25456
  fill: "CurrentColor"
25402
- })), _path$V || (_path$V = /*#__PURE__*/createElement$1("path", {
25457
+ })), _path$W || (_path$W = /*#__PURE__*/createElement$1("path", {
25403
25458
  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
25459
  fill: "#fff"
25405
25460
  })));
25406
25461
  }
25407
25462
 
25408
- var _circle$5, _path$W;
25409
- function _extends$X() {
25410
- return _extends$X = Object.assign ? Object.assign.bind() : function (n) {
25463
+ var _circle$5, _path$X;
25464
+ function _extends$Y() {
25465
+ return _extends$Y = Object.assign ? Object.assign.bind() : function (n) {
25411
25466
  for (var e = 1; e < arguments.length; e++) {
25412
25467
  var t = arguments[e];
25413
25468
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
25414
25469
  }
25415
25470
  return n;
25416
- }, _extends$X.apply(null, arguments);
25471
+ }, _extends$Y.apply(null, arguments);
25417
25472
  }
25418
25473
  function SvgPause(props) {
25419
- return /*#__PURE__*/createElement$1("svg", _extends$X({
25474
+ return /*#__PURE__*/createElement$1("svg", _extends$Y({
25420
25475
  width: 32,
25421
25476
  height: 32,
25422
25477
  viewBox: "0 0 33 33",
@@ -25427,7 +25482,7 @@ function SvgPause(props) {
25427
25482
  cy: 16,
25428
25483
  r: 16,
25429
25484
  fill: "CurrentColor"
25430
- })), _path$W || (_path$W = /*#__PURE__*/createElement$1("path", {
25485
+ })), _path$X || (_path$X = /*#__PURE__*/createElement$1("path", {
25431
25486
  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
25487
  fill: "#fff"
25433
25488
  })));
@@ -28314,24 +28369,24 @@ var MessageHeaderCont = styled.div(_templateObject$w || (_templateObject$w = _ta
28314
28369
  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
28370
  });
28316
28371
 
28317
- var _path$X;
28318
- function _extends$Y() {
28319
- return _extends$Y = Object.assign ? Object.assign.bind() : function (n) {
28372
+ var _path$Y;
28373
+ function _extends$Z() {
28374
+ return _extends$Z = Object.assign ? Object.assign.bind() : function (n) {
28320
28375
  for (var e = 1; e < arguments.length; e++) {
28321
28376
  var t = arguments[e];
28322
28377
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28323
28378
  }
28324
28379
  return n;
28325
- }, _extends$Y.apply(null, arguments);
28380
+ }, _extends$Z.apply(null, arguments);
28326
28381
  }
28327
28382
  function SvgEmojiAnimalIcon(props) {
28328
- return /*#__PURE__*/createElement$1("svg", _extends$Y({
28383
+ return /*#__PURE__*/createElement$1("svg", _extends$Z({
28329
28384
  width: 20,
28330
28385
  height: 20,
28331
28386
  viewBox: "0 0 20.01 20.01",
28332
28387
  fill: "none",
28333
28388
  xmlns: "http://www.w3.org/2000/svg"
28334
- }, props), _path$X || (_path$X = /*#__PURE__*/createElement$1("path", {
28389
+ }, props), _path$Y || (_path$Y = /*#__PURE__*/createElement$1("path", {
28335
28390
  fillRule: "evenodd",
28336
28391
  clipRule: "evenodd",
28337
28392
  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 +28394,24 @@ function SvgEmojiAnimalIcon(props) {
28339
28394
  })));
28340
28395
  }
28341
28396
 
28342
- var _path$Y, _path2$5, _path3$2;
28343
- function _extends$Z() {
28344
- return _extends$Z = Object.assign ? Object.assign.bind() : function (n) {
28397
+ var _path$Z, _path2$5, _path3$2;
28398
+ function _extends$_() {
28399
+ return _extends$_ = Object.assign ? Object.assign.bind() : function (n) {
28345
28400
  for (var e = 1; e < arguments.length; e++) {
28346
28401
  var t = arguments[e];
28347
28402
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28348
28403
  }
28349
28404
  return n;
28350
- }, _extends$Z.apply(null, arguments);
28405
+ }, _extends$_.apply(null, arguments);
28351
28406
  }
28352
28407
  function SvgEmojiFoodIcon(props) {
28353
- return /*#__PURE__*/createElement$1("svg", _extends$Z({
28408
+ return /*#__PURE__*/createElement$1("svg", _extends$_({
28354
28409
  width: 20,
28355
28410
  height: 20,
28356
28411
  viewBox: "0 0 20.01 20.01",
28357
28412
  fill: "none",
28358
28413
  xmlns: "http://www.w3.org/2000/svg"
28359
- }, props), _path$Y || (_path$Y = /*#__PURE__*/createElement$1("path", {
28414
+ }, props), _path$Z || (_path$Z = /*#__PURE__*/createElement$1("path", {
28360
28415
  fillRule: "evenodd",
28361
28416
  clipRule: "evenodd",
28362
28417
  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 +28429,24 @@ function SvgEmojiFoodIcon(props) {
28374
28429
  })));
28375
28430
  }
28376
28431
 
28377
- var _path$Z;
28378
- function _extends$_() {
28379
- return _extends$_ = Object.assign ? Object.assign.bind() : function (n) {
28432
+ var _path$_;
28433
+ function _extends$$() {
28434
+ return _extends$$ = Object.assign ? Object.assign.bind() : function (n) {
28380
28435
  for (var e = 1; e < arguments.length; e++) {
28381
28436
  var t = arguments[e];
28382
28437
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28383
28438
  }
28384
28439
  return n;
28385
- }, _extends$_.apply(null, arguments);
28440
+ }, _extends$$.apply(null, arguments);
28386
28441
  }
28387
28442
  function SvgEmojiTravelIcon(props) {
28388
- return /*#__PURE__*/createElement$1("svg", _extends$_({
28443
+ return /*#__PURE__*/createElement$1("svg", _extends$$({
28389
28444
  width: 20,
28390
28445
  height: 20,
28391
28446
  viewBox: "0 0 20.01 20.01",
28392
28447
  fill: "none",
28393
28448
  xmlns: "http://www.w3.org/2000/svg"
28394
- }, props), _path$Z || (_path$Z = /*#__PURE__*/createElement$1("path", {
28449
+ }, props), _path$_ || (_path$_ = /*#__PURE__*/createElement$1("path", {
28395
28450
  fillRule: "evenodd",
28396
28451
  clipRule: "evenodd",
28397
28452
  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 +28455,17 @@ function SvgEmojiTravelIcon(props) {
28400
28455
  }
28401
28456
 
28402
28457
  var _g, _defs$1;
28403
- function _extends$$() {
28404
- return _extends$$ = Object.assign ? Object.assign.bind() : function (n) {
28458
+ function _extends$10() {
28459
+ return _extends$10 = Object.assign ? Object.assign.bind() : function (n) {
28405
28460
  for (var e = 1; e < arguments.length; e++) {
28406
28461
  var t = arguments[e];
28407
28462
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28408
28463
  }
28409
28464
  return n;
28410
- }, _extends$$.apply(null, arguments);
28465
+ }, _extends$10.apply(null, arguments);
28411
28466
  }
28412
28467
  function SvgEmojiObjectIcon(props) {
28413
- return /*#__PURE__*/createElement$1("svg", _extends$$({
28468
+ return /*#__PURE__*/createElement$1("svg", _extends$10({
28414
28469
  width: 20,
28415
28470
  height: 20,
28416
28471
  viewBox: "0 0 20.01 20.01",
@@ -28431,24 +28486,24 @@ function SvgEmojiObjectIcon(props) {
28431
28486
  })))));
28432
28487
  }
28433
28488
 
28434
- var _path$_;
28435
- function _extends$10() {
28436
- return _extends$10 = Object.assign ? Object.assign.bind() : function (n) {
28489
+ var _path$$;
28490
+ function _extends$11() {
28491
+ return _extends$11 = Object.assign ? Object.assign.bind() : function (n) {
28437
28492
  for (var e = 1; e < arguments.length; e++) {
28438
28493
  var t = arguments[e];
28439
28494
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28440
28495
  }
28441
28496
  return n;
28442
- }, _extends$10.apply(null, arguments);
28497
+ }, _extends$11.apply(null, arguments);
28443
28498
  }
28444
28499
  function SvgEmojiSymbolsIcon(props) {
28445
- return /*#__PURE__*/createElement$1("svg", _extends$10({
28500
+ return /*#__PURE__*/createElement$1("svg", _extends$11({
28446
28501
  width: 20,
28447
28502
  height: 20,
28448
28503
  viewBox: "0 0 20.01 20.01",
28449
28504
  fill: "none",
28450
28505
  xmlns: "http://www.w3.org/2000/svg"
28451
- }, props), _path$_ || (_path$_ = /*#__PURE__*/createElement$1("path", {
28506
+ }, props), _path$$ || (_path$$ = /*#__PURE__*/createElement$1("path", {
28452
28507
  fillRule: "evenodd",
28453
28508
  clipRule: "evenodd",
28454
28509
  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 +28511,24 @@ function SvgEmojiSymbolsIcon(props) {
28456
28511
  })));
28457
28512
  }
28458
28513
 
28459
- var _path$$;
28460
- function _extends$11() {
28461
- return _extends$11 = Object.assign ? Object.assign.bind() : function (n) {
28514
+ var _path$10;
28515
+ function _extends$12() {
28516
+ return _extends$12 = Object.assign ? Object.assign.bind() : function (n) {
28462
28517
  for (var e = 1; e < arguments.length; e++) {
28463
28518
  var t = arguments[e];
28464
28519
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28465
28520
  }
28466
28521
  return n;
28467
- }, _extends$11.apply(null, arguments);
28522
+ }, _extends$12.apply(null, arguments);
28468
28523
  }
28469
28524
  function SvgEmojiFlagicon(props) {
28470
- return /*#__PURE__*/createElement$1("svg", _extends$11({
28525
+ return /*#__PURE__*/createElement$1("svg", _extends$12({
28471
28526
  width: 20,
28472
28527
  height: 20,
28473
28528
  viewBox: "0 0 20.01 20.01",
28474
28529
  fill: "none",
28475
28530
  xmlns: "http://www.w3.org/2000/svg"
28476
- }, props), _path$$ || (_path$$ = /*#__PURE__*/createElement$1("path", {
28531
+ }, props), _path$10 || (_path$10 = /*#__PURE__*/createElement$1("path", {
28477
28532
  fillRule: "evenodd",
28478
28533
  clipRule: "evenodd",
28479
28534
  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 +29024,24 @@ var Emoji = styled.li(_templateObject8$b || (_templateObject8$b = _taggedTemplat
28969
29024
  return props.hoverBackgroundColor;
28970
29025
  });
28971
29026
 
28972
- var _path$10;
28973
- function _extends$12() {
28974
- return _extends$12 = Object.assign ? Object.assign.bind() : function (n) {
29027
+ var _path$11;
29028
+ function _extends$13() {
29029
+ return _extends$13 = Object.assign ? Object.assign.bind() : function (n) {
28975
29030
  for (var e = 1; e < arguments.length; e++) {
28976
29031
  var t = arguments[e];
28977
29032
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
28978
29033
  }
28979
29034
  return n;
28980
- }, _extends$12.apply(null, arguments);
29035
+ }, _extends$13.apply(null, arguments);
28981
29036
  }
28982
29037
  function SvgPlus(props) {
28983
- return /*#__PURE__*/createElement$1("svg", _extends$12({
29038
+ return /*#__PURE__*/createElement$1("svg", _extends$13({
28984
29039
  width: 20,
28985
29040
  height: 20,
28986
29041
  viewBox: "0 0 20.01 20.01",
28987
29042
  fill: "none",
28988
29043
  xmlns: "http://www.w3.org/2000/svg"
28989
- }, props), _path$10 || (_path$10 = /*#__PURE__*/createElement$1("path", {
29044
+ }, props), _path$11 || (_path$11 = /*#__PURE__*/createElement$1("path", {
28990
29045
  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
29046
  fill: "currentColor"
28992
29047
  })));
@@ -32174,24 +32229,24 @@ var MemberName$2 = styled.h3(_templateObject5$k || (_templateObject5$k = _tagged
32174
32229
  return props.color;
32175
32230
  });
32176
32231
 
32177
- var _path$11;
32178
- function _extends$13() {
32179
- return _extends$13 = Object.assign ? Object.assign.bind() : function (n) {
32232
+ var _path$12;
32233
+ function _extends$14() {
32234
+ return _extends$14 = Object.assign ? Object.assign.bind() : function (n) {
32180
32235
  for (var e = 1; e < arguments.length; e++) {
32181
32236
  var t = arguments[e];
32182
32237
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32183
32238
  }
32184
32239
  return n;
32185
- }, _extends$13.apply(null, arguments);
32240
+ }, _extends$14.apply(null, arguments);
32186
32241
  }
32187
32242
  function SvgBold(props) {
32188
- return /*#__PURE__*/createElement$1("svg", _extends$13({
32243
+ return /*#__PURE__*/createElement$1("svg", _extends$14({
32189
32244
  width: 18,
32190
32245
  height: 18,
32191
32246
  viewBox: "0 0 18.01 18.01",
32192
32247
  fill: "none",
32193
32248
  xmlns: "http://www.w3.org/2000/svg"
32194
- }, props), _path$11 || (_path$11 = /*#__PURE__*/createElement$1("path", {
32249
+ }, props), _path$12 || (_path$12 = /*#__PURE__*/createElement$1("path", {
32195
32250
  fillRule: "evenodd",
32196
32251
  clipRule: "evenodd",
32197
32252
  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 +32254,24 @@ function SvgBold(props) {
32199
32254
  })));
32200
32255
  }
32201
32256
 
32202
- var _path$12;
32203
- function _extends$14() {
32204
- return _extends$14 = Object.assign ? Object.assign.bind() : function (n) {
32257
+ var _path$13;
32258
+ function _extends$15() {
32259
+ return _extends$15 = Object.assign ? Object.assign.bind() : function (n) {
32205
32260
  for (var e = 1; e < arguments.length; e++) {
32206
32261
  var t = arguments[e];
32207
32262
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32208
32263
  }
32209
32264
  return n;
32210
- }, _extends$14.apply(null, arguments);
32265
+ }, _extends$15.apply(null, arguments);
32211
32266
  }
32212
32267
  function SvgItalic(props) {
32213
- return /*#__PURE__*/createElement$1("svg", _extends$14({
32268
+ return /*#__PURE__*/createElement$1("svg", _extends$15({
32214
32269
  width: 18,
32215
32270
  height: 18,
32216
32271
  viewBox: "0 0 18.01 18.01",
32217
32272
  fill: "none",
32218
32273
  xmlns: "http://www.w3.org/2000/svg"
32219
- }, props), _path$12 || (_path$12 = /*#__PURE__*/createElement$1("path", {
32274
+ }, props), _path$13 || (_path$13 = /*#__PURE__*/createElement$1("path", {
32220
32275
  fillRule: "evenodd",
32221
32276
  clipRule: "evenodd",
32222
32277
  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 +32280,17 @@ function SvgItalic(props) {
32225
32280
  }
32226
32281
 
32227
32282
  var _g$1;
32228
- function _extends$15() {
32229
- return _extends$15 = Object.assign ? Object.assign.bind() : function (n) {
32283
+ function _extends$16() {
32284
+ return _extends$16 = Object.assign ? Object.assign.bind() : function (n) {
32230
32285
  for (var e = 1; e < arguments.length; e++) {
32231
32286
  var t = arguments[e];
32232
32287
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32233
32288
  }
32234
32289
  return n;
32235
- }, _extends$15.apply(null, arguments);
32290
+ }, _extends$16.apply(null, arguments);
32236
32291
  }
32237
32292
  function SvgStrikethrough(props) {
32238
- return /*#__PURE__*/createElement$1("svg", _extends$15({
32293
+ return /*#__PURE__*/createElement$1("svg", _extends$16({
32239
32294
  width: 18,
32240
32295
  height: 18,
32241
32296
  viewBox: "0 0 18.01 18.01",
@@ -32252,41 +32307,41 @@ function SvgStrikethrough(props) {
32252
32307
  }))));
32253
32308
  }
32254
32309
 
32255
- var _path$13;
32256
- function _extends$16() {
32257
- return _extends$16 = Object.assign ? Object.assign.bind() : function (n) {
32310
+ var _path$14;
32311
+ function _extends$17() {
32312
+ return _extends$17 = Object.assign ? Object.assign.bind() : function (n) {
32258
32313
  for (var e = 1; e < arguments.length; e++) {
32259
32314
  var t = arguments[e];
32260
32315
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32261
32316
  }
32262
32317
  return n;
32263
- }, _extends$16.apply(null, arguments);
32318
+ }, _extends$17.apply(null, arguments);
32264
32319
  }
32265
32320
  function SvgMono(props) {
32266
- return /*#__PURE__*/createElement$1("svg", _extends$16({
32321
+ return /*#__PURE__*/createElement$1("svg", _extends$17({
32267
32322
  width: 18,
32268
32323
  height: 18,
32269
32324
  viewBox: "0 0 18.01 18.01",
32270
32325
  fill: "none",
32271
32326
  xmlns: "http://www.w3.org/2000/svg"
32272
- }, props), _path$13 || (_path$13 = /*#__PURE__*/createElement$1("path", {
32327
+ }, props), _path$14 || (_path$14 = /*#__PURE__*/createElement$1("path", {
32273
32328
  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
32329
  fill: "CurrentColor"
32275
32330
  })));
32276
32331
  }
32277
32332
 
32278
32333
  var _g$2;
32279
- function _extends$17() {
32280
- return _extends$17 = Object.assign ? Object.assign.bind() : function (n) {
32334
+ function _extends$18() {
32335
+ return _extends$18 = Object.assign ? Object.assign.bind() : function (n) {
32281
32336
  for (var e = 1; e < arguments.length; e++) {
32282
32337
  var t = arguments[e];
32283
32338
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
32284
32339
  }
32285
32340
  return n;
32286
- }, _extends$17.apply(null, arguments);
32341
+ }, _extends$18.apply(null, arguments);
32287
32342
  }
32288
32343
  function SvgUnderline(props) {
32289
- return /*#__PURE__*/createElement$1("svg", _extends$17({
32344
+ return /*#__PURE__*/createElement$1("svg", _extends$18({
32290
32345
  width: 18,
32291
32346
  height: 18,
32292
32347
  viewBox: "0 0 18.01 18.01",
@@ -32380,9 +32435,9 @@ function TextFormatFloatingToolbar(_ref) {
32380
32435
  var _useColor = useColors(),
32381
32436
  accentColor = _useColor[THEME_COLORS.ACCENT],
32382
32437
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
32383
- surface2 = _useColor[THEME_COLORS.SURFACE_2],
32384
32438
  backgroundSections = _useColor[THEME_COLORS.BACKGROUND_SECTIONS],
32385
- surface1 = _useColor[THEME_COLORS.SURFACE_1];
32439
+ surface1 = _useColor[THEME_COLORS.SURFACE_1],
32440
+ tooltipBackground = _useColor[THEME_COLORS.TOOLTIP_BACKGROUND];
32386
32441
  var popupCharStylesEditorRef = useRef(null);
32387
32442
  function mouseMoveListener(e) {
32388
32443
  if (popupCharStylesEditorRef !== null && popupCharStylesEditorRef !== void 0 && popupCharStylesEditorRef.current && (e.buttons === 1 || e.buttons === 3)) {
@@ -32477,9 +32532,9 @@ function TextFormatFloatingToolbar(_ref) {
32477
32532
  isActive: isBold
32478
32533
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32479
32534
  disabledColor: textSecondary,
32480
- bgColor: surface2,
32535
+ bgColor: tooltipBackground,
32481
32536
  direction: 'top'
32482
- }, "Bold"), /*#__PURE__*/React__default.createElement(SvgBold, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32537
+ }, "Bold", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgBold, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32483
32538
  iconColor: textSecondary,
32484
32539
  hoverBackgroundColor: surface1,
32485
32540
  hoverIconColor: accentColor,
@@ -32491,9 +32546,9 @@ function TextFormatFloatingToolbar(_ref) {
32491
32546
  "aria-label": 'Format text as italics'
32492
32547
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32493
32548
  disabledColor: textSecondary,
32494
- bgColor: surface2,
32549
+ bgColor: tooltipBackground,
32495
32550
  direction: 'top'
32496
- }, "Italic"), /*#__PURE__*/React__default.createElement(SvgItalic, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32551
+ }, "Italic", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgItalic, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32497
32552
  iconColor: textSecondary,
32498
32553
  hoverBackgroundColor: surface1,
32499
32554
  hoverIconColor: accentColor,
@@ -32505,9 +32560,9 @@ function TextFormatFloatingToolbar(_ref) {
32505
32560
  "aria-label": 'Format text with a strikethrough'
32506
32561
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32507
32562
  disabledColor: textSecondary,
32508
- bgColor: surface2,
32563
+ bgColor: tooltipBackground,
32509
32564
  direction: 'top'
32510
- }, ' ', "Strikethrough", ' '), /*#__PURE__*/React__default.createElement(SvgStrikethrough, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32565
+ }, "Strikethrough ", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgStrikethrough, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32511
32566
  type: 'button',
32512
32567
  iconColor: textSecondary,
32513
32568
  hoverBackgroundColor: surface1,
@@ -32519,9 +32574,9 @@ function TextFormatFloatingToolbar(_ref) {
32519
32574
  "aria-label": 'Insert code block'
32520
32575
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32521
32576
  disabledColor: textSecondary,
32522
- bgColor: surface2,
32577
+ bgColor: tooltipBackground,
32523
32578
  direction: 'top'
32524
- }, "Monospace"), /*#__PURE__*/React__default.createElement(SvgMono, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32579
+ }, "Monospace ", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgMono, null)), /*#__PURE__*/React__default.createElement(Action$1, {
32525
32580
  type: 'button',
32526
32581
  iconColor: textSecondary,
32527
32582
  hoverBackgroundColor: surface1,
@@ -32533,9 +32588,9 @@ function TextFormatFloatingToolbar(_ref) {
32533
32588
  "aria-label": 'Insert code block'
32534
32589
  }, /*#__PURE__*/React__default.createElement(ItemNote, {
32535
32590
  disabledColor: textSecondary,
32536
- bgColor: surface2,
32591
+ bgColor: tooltipBackground,
32537
32592
  direction: 'top'
32538
- }, "Underline"), /*#__PURE__*/React__default.createElement(SvgUnderline, null)))));
32593
+ }, "Underline ", /*#__PURE__*/React__default.createElement(SvgArrowDown, null)), /*#__PURE__*/React__default.createElement(SvgUnderline, null)))));
32539
32594
  }
32540
32595
  function useFloatingTextFormatToolbar(editor, anchorElem) {
32541
32596
  var _useState = useState(false),
@@ -33248,18 +33303,18 @@ var Emoji$1 = styled.li(_templateObject8$e || (_templateObject8$e = _taggedTempl
33248
33303
 
33249
33304
  var CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
33250
33305
 
33251
- var _circle$6, _path$14;
33252
- function _extends$18() {
33253
- return _extends$18 = Object.assign ? Object.assign.bind() : function (n) {
33306
+ var _circle$6, _path$15;
33307
+ function _extends$19() {
33308
+ return _extends$19 = Object.assign ? Object.assign.bind() : function (n) {
33254
33309
  for (var e = 1; e < arguments.length; e++) {
33255
33310
  var t = arguments[e];
33256
33311
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33257
33312
  }
33258
33313
  return n;
33259
- }, _extends$18.apply(null, arguments);
33314
+ }, _extends$19.apply(null, arguments);
33260
33315
  }
33261
33316
  function SvgSend(props) {
33262
- return /*#__PURE__*/createElement$1("svg", _extends$18({
33317
+ return /*#__PURE__*/createElement$1("svg", _extends$19({
33263
33318
  width: 32,
33264
33319
  height: 32,
33265
33320
  fill: "none",
@@ -33269,142 +33324,142 @@ function SvgSend(props) {
33269
33324
  cy: 16,
33270
33325
  r: 16,
33271
33326
  fill: "currentColor"
33272
- })), _path$14 || (_path$14 = /*#__PURE__*/createElement$1("path", {
33327
+ })), _path$15 || (_path$15 = /*#__PURE__*/createElement$1("path", {
33273
33328
  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
33329
  fill: "#fff"
33275
33330
  })));
33276
33331
  }
33277
33332
 
33278
- var _path$15;
33279
- function _extends$19() {
33280
- return _extends$19 = Object.assign ? Object.assign.bind() : function (n) {
33333
+ var _path$16;
33334
+ function _extends$1a() {
33335
+ return _extends$1a = Object.assign ? Object.assign.bind() : function (n) {
33281
33336
  for (var e = 1; e < arguments.length; e++) {
33282
33337
  var t = arguments[e];
33283
33338
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33284
33339
  }
33285
33340
  return n;
33286
- }, _extends$19.apply(null, arguments);
33341
+ }, _extends$1a.apply(null, arguments);
33287
33342
  }
33288
33343
  function SvgEye(props) {
33289
- return /*#__PURE__*/createElement$1("svg", _extends$19({
33344
+ return /*#__PURE__*/createElement$1("svg", _extends$1a({
33290
33345
  width: 25,
33291
33346
  height: 24,
33292
33347
  fill: "none",
33293
33348
  xmlns: "http://www.w3.org/2000/svg"
33294
- }, props), _path$15 || (_path$15 = /*#__PURE__*/createElement$1("path", {
33349
+ }, props), _path$16 || (_path$16 = /*#__PURE__*/createElement$1("path", {
33295
33350
  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
33351
  fill: "CurrentColor"
33297
33352
  })));
33298
33353
  }
33299
33354
 
33300
- var _path$16;
33301
- function _extends$1a() {
33302
- return _extends$1a = Object.assign ? Object.assign.bind() : function (n) {
33355
+ var _path$17;
33356
+ function _extends$1b() {
33357
+ return _extends$1b = Object.assign ? Object.assign.bind() : function (n) {
33303
33358
  for (var e = 1; e < arguments.length; e++) {
33304
33359
  var t = arguments[e];
33305
33360
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33306
33361
  }
33307
33362
  return n;
33308
- }, _extends$1a.apply(null, arguments);
33363
+ }, _extends$1b.apply(null, arguments);
33309
33364
  }
33310
33365
  function SvgAddAttachment(props) {
33311
- return /*#__PURE__*/createElement$1("svg", _extends$1a({
33366
+ return /*#__PURE__*/createElement$1("svg", _extends$1b({
33312
33367
  width: 24,
33313
33368
  height: 24,
33314
33369
  viewBox: "0 0 24.01 24.01",
33315
33370
  fill: "none",
33316
33371
  xmlns: "http://www.w3.org/2000/svg"
33317
- }, props), _path$16 || (_path$16 = /*#__PURE__*/createElement$1("path", {
33372
+ }, props), _path$17 || (_path$17 = /*#__PURE__*/createElement$1("path", {
33318
33373
  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
33374
  fill: "CurrentColor"
33320
33375
  })));
33321
33376
  }
33322
33377
 
33323
- var _path$17;
33324
- function _extends$1b() {
33325
- return _extends$1b = Object.assign ? Object.assign.bind() : function (n) {
33378
+ var _path$18;
33379
+ function _extends$1c() {
33380
+ return _extends$1c = Object.assign ? Object.assign.bind() : function (n) {
33326
33381
  for (var e = 1; e < arguments.length; e++) {
33327
33382
  var t = arguments[e];
33328
33383
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33329
33384
  }
33330
33385
  return n;
33331
- }, _extends$1b.apply(null, arguments);
33386
+ }, _extends$1c.apply(null, arguments);
33332
33387
  }
33333
33388
  function SvgErrorCircle(props) {
33334
- return /*#__PURE__*/createElement$1("svg", _extends$1b({
33389
+ return /*#__PURE__*/createElement$1("svg", _extends$1c({
33335
33390
  width: 25,
33336
33391
  height: 24,
33337
33392
  fill: "none",
33338
33393
  xmlns: "http://www.w3.org/2000/svg"
33339
- }, props), _path$17 || (_path$17 = /*#__PURE__*/createElement$1("path", {
33394
+ }, props), _path$18 || (_path$18 = /*#__PURE__*/createElement$1("path", {
33340
33395
  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
33396
  fill: "#FFB73D"
33342
33397
  })));
33343
33398
  }
33344
33399
 
33345
- var _path$18;
33346
- function _extends$1c() {
33347
- return _extends$1c = Object.assign ? Object.assign.bind() : function (n) {
33400
+ var _path$19;
33401
+ function _extends$1d() {
33402
+ return _extends$1d = Object.assign ? Object.assign.bind() : function (n) {
33348
33403
  for (var e = 1; e < arguments.length; e++) {
33349
33404
  var t = arguments[e];
33350
33405
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33351
33406
  }
33352
33407
  return n;
33353
- }, _extends$1c.apply(null, arguments);
33408
+ }, _extends$1d.apply(null, arguments);
33354
33409
  }
33355
33410
  function SvgPlayRecord(props) {
33356
- return /*#__PURE__*/createElement$1("svg", _extends$1c({
33411
+ return /*#__PURE__*/createElement$1("svg", _extends$1d({
33357
33412
  width: 20,
33358
33413
  height: 20,
33359
33414
  viewBox: "0 0 20.01 20.01",
33360
33415
  fill: "none",
33361
33416
  xmlns: "http://www.w3.org/2000/svg"
33362
- }, props), _path$18 || (_path$18 = /*#__PURE__*/createElement$1("path", {
33417
+ }, props), _path$19 || (_path$19 = /*#__PURE__*/createElement$1("path", {
33363
33418
  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
33419
  fill: "CurrentColor"
33365
33420
  })));
33366
33421
  }
33367
33422
 
33368
- var _path$19;
33369
- function _extends$1d() {
33370
- return _extends$1d = Object.assign ? Object.assign.bind() : function (n) {
33423
+ var _path$1a;
33424
+ function _extends$1e() {
33425
+ return _extends$1e = Object.assign ? Object.assign.bind() : function (n) {
33371
33426
  for (var e = 1; e < arguments.length; e++) {
33372
33427
  var t = arguments[e];
33373
33428
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33374
33429
  }
33375
33430
  return n;
33376
- }, _extends$1d.apply(null, arguments);
33431
+ }, _extends$1e.apply(null, arguments);
33377
33432
  }
33378
33433
  function SvgPauseRecord(props) {
33379
- return /*#__PURE__*/createElement$1("svg", _extends$1d({
33434
+ return /*#__PURE__*/createElement$1("svg", _extends$1e({
33380
33435
  width: 20,
33381
33436
  height: 20,
33382
33437
  viewBox: "0 0 20.01 20.01",
33383
33438
  fill: "none",
33384
33439
  xmlns: "http://www.w3.org/2000/svg"
33385
- }, props), _path$19 || (_path$19 = /*#__PURE__*/createElement$1("path", {
33440
+ }, props), _path$1a || (_path$1a = /*#__PURE__*/createElement$1("path", {
33386
33441
  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
33442
  fill: "CurrentColor"
33388
33443
  })));
33389
33444
  }
33390
33445
 
33391
- var _path$1a;
33392
- function _extends$1e() {
33393
- return _extends$1e = Object.assign ? Object.assign.bind() : function (n) {
33446
+ var _path$1b;
33447
+ function _extends$1f() {
33448
+ return _extends$1f = Object.assign ? Object.assign.bind() : function (n) {
33394
33449
  for (var e = 1; e < arguments.length; e++) {
33395
33450
  var t = arguments[e];
33396
33451
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33397
33452
  }
33398
33453
  return n;
33399
- }, _extends$1e.apply(null, arguments);
33454
+ }, _extends$1f.apply(null, arguments);
33400
33455
  }
33401
33456
  function SvgStopRecord(props) {
33402
- return /*#__PURE__*/createElement$1("svg", _extends$1e({
33457
+ return /*#__PURE__*/createElement$1("svg", _extends$1f({
33403
33458
  width: 20,
33404
33459
  height: 20,
33405
33460
  fill: "none",
33406
33461
  xmlns: "http://www.w3.org/2000/svg"
33407
- }, props), _path$1a || (_path$1a = /*#__PURE__*/createElement$1("path", {
33462
+ }, props), _path$1b || (_path$1b = /*#__PURE__*/createElement$1("path", {
33408
33463
  fillRule: "evenodd",
33409
33464
  clipRule: "evenodd",
33410
33465
  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 +33467,18 @@ function SvgStopRecord(props) {
33412
33467
  })));
33413
33468
  }
33414
33469
 
33415
- var _circle$7, _path$1b, _path2$6;
33416
- function _extends$1f() {
33417
- return _extends$1f = Object.assign ? Object.assign.bind() : function (n) {
33470
+ var _circle$7, _path$1c, _path2$6;
33471
+ function _extends$1g() {
33472
+ return _extends$1g = Object.assign ? Object.assign.bind() : function (n) {
33418
33473
  for (var e = 1; e < arguments.length; e++) {
33419
33474
  var t = arguments[e];
33420
33475
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
33421
33476
  }
33422
33477
  return n;
33423
- }, _extends$1f.apply(null, arguments);
33478
+ }, _extends$1g.apply(null, arguments);
33424
33479
  }
33425
33480
  function SvgRecordButton(props) {
33426
- return /*#__PURE__*/createElement$1("svg", _extends$1f({
33481
+ return /*#__PURE__*/createElement$1("svg", _extends$1g({
33427
33482
  width: 32,
33428
33483
  height: 32,
33429
33484
  viewBox: "0 0 32.01 32.01",
@@ -33434,7 +33489,7 @@ function SvgRecordButton(props) {
33434
33489
  cy: 16,
33435
33490
  r: 16,
33436
33491
  fill: "CurrentColor"
33437
- })), _path$1b || (_path$1b = /*#__PURE__*/createElement$1("path", {
33492
+ })), _path$1c || (_path$1c = /*#__PURE__*/createElement$1("path", {
33438
33493
  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
33494
  fill: "#fff"
33440
33495
  })), _path2$6 || (_path2$6 = /*#__PURE__*/createElement$1("path", {
@@ -35618,23 +35673,23 @@ var CloseIconWrapper = styled.span(_templateObject34$1 || (_templateObject34$1 =
35618
35673
  return props.color;
35619
35674
  });
35620
35675
 
35621
- var _path$1c;
35622
- function _extends$1g() {
35623
- return _extends$1g = Object.assign ? Object.assign.bind() : function (n) {
35676
+ var _path$1d;
35677
+ function _extends$1h() {
35678
+ return _extends$1h = Object.assign ? Object.assign.bind() : function (n) {
35624
35679
  for (var e = 1; e < arguments.length; e++) {
35625
35680
  var t = arguments[e];
35626
35681
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35627
35682
  }
35628
35683
  return n;
35629
- }, _extends$1g.apply(null, arguments);
35684
+ }, _extends$1h.apply(null, arguments);
35630
35685
  }
35631
35686
  function SvgBottom(props) {
35632
- return /*#__PURE__*/createElement$1("svg", _extends$1g({
35687
+ return /*#__PURE__*/createElement$1("svg", _extends$1h({
35633
35688
  width: 12,
35634
35689
  height: 7,
35635
35690
  fill: "none",
35636
35691
  xmlns: "http://www.w3.org/2000/svg"
35637
- }, props), _path$1c || (_path$1c = /*#__PURE__*/createElement$1("path", {
35692
+ }, props), _path$1d || (_path$1d = /*#__PURE__*/createElement$1("path", {
35638
35693
  d: "M1.5 1.5l4.5 4 4.5-4",
35639
35694
  stroke: "#676A7C",
35640
35695
  strokeWidth: 1.4,
@@ -35643,24 +35698,24 @@ function SvgBottom(props) {
35643
35698
  })));
35644
35699
  }
35645
35700
 
35646
- var _path$1d, _path2$7;
35647
- function _extends$1h() {
35648
- return _extends$1h = Object.assign ? Object.assign.bind() : function (n) {
35701
+ var _path$1e, _path2$7;
35702
+ function _extends$1i() {
35703
+ return _extends$1i = Object.assign ? Object.assign.bind() : function (n) {
35649
35704
  for (var e = 1; e < arguments.length; e++) {
35650
35705
  var t = arguments[e];
35651
35706
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35652
35707
  }
35653
35708
  return n;
35654
- }, _extends$1h.apply(null, arguments);
35709
+ }, _extends$1i.apply(null, arguments);
35655
35710
  }
35656
35711
  function SvgMarkAsUnRead(props) {
35657
- return /*#__PURE__*/createElement$1("svg", _extends$1h({
35712
+ return /*#__PURE__*/createElement$1("svg", _extends$1i({
35658
35713
  width: 20,
35659
35714
  height: 20,
35660
35715
  viewBox: "0 0 20.01 20.01",
35661
35716
  fill: "none",
35662
35717
  xmlns: "http://www.w3.org/2000/svg"
35663
- }, props), _path$1d || (_path$1d = /*#__PURE__*/createElement$1("path", {
35718
+ }, props), _path$1e || (_path$1e = /*#__PURE__*/createElement$1("path", {
35664
35719
  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
35720
  fill: "currentColor"
35666
35721
  })), _path2$7 || (_path2$7 = /*#__PURE__*/createElement$1("path", {
@@ -35669,24 +35724,24 @@ function SvgMarkAsUnRead(props) {
35669
35724
  })));
35670
35725
  }
35671
35726
 
35672
- var _path$1e;
35673
- function _extends$1i() {
35674
- return _extends$1i = Object.assign ? Object.assign.bind() : function (n) {
35727
+ var _path$1f;
35728
+ function _extends$1j() {
35729
+ return _extends$1j = Object.assign ? Object.assign.bind() : function (n) {
35675
35730
  for (var e = 1; e < arguments.length; e++) {
35676
35731
  var t = arguments[e];
35677
35732
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35678
35733
  }
35679
35734
  return n;
35680
- }, _extends$1i.apply(null, arguments);
35735
+ }, _extends$1j.apply(null, arguments);
35681
35736
  }
35682
35737
  function SvgMarkAsRead(props) {
35683
- return /*#__PURE__*/createElement$1("svg", _extends$1i({
35738
+ return /*#__PURE__*/createElement$1("svg", _extends$1j({
35684
35739
  width: 20,
35685
35740
  height: 20,
35686
35741
  viewBox: "0 0 20.01 20.01",
35687
35742
  fill: "none",
35688
35743
  xmlns: "http://www.w3.org/2000/svg"
35689
- }, props), _path$1e || (_path$1e = /*#__PURE__*/createElement$1("path", {
35744
+ }, props), _path$1f || (_path$1f = /*#__PURE__*/createElement$1("path", {
35690
35745
  fillRule: "evenodd",
35691
35746
  clipRule: "evenodd",
35692
35747
  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 +35749,23 @@ function SvgMarkAsRead(props) {
35694
35749
  })));
35695
35750
  }
35696
35751
 
35697
- var _path$1f;
35698
- function _extends$1j() {
35699
- return _extends$1j = Object.assign ? Object.assign.bind() : function (n) {
35752
+ var _path$1g;
35753
+ function _extends$1k() {
35754
+ return _extends$1k = Object.assign ? Object.assign.bind() : function (n) {
35700
35755
  for (var e = 1; e < arguments.length; e++) {
35701
35756
  var t = arguments[e];
35702
35757
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35703
35758
  }
35704
35759
  return n;
35705
- }, _extends$1j.apply(null, arguments);
35760
+ }, _extends$1k.apply(null, arguments);
35706
35761
  }
35707
35762
  function SvgClear(props) {
35708
- return /*#__PURE__*/createElement$1("svg", _extends$1j({
35763
+ return /*#__PURE__*/createElement$1("svg", _extends$1k({
35709
35764
  width: 20,
35710
35765
  height: 21,
35711
35766
  fill: "none",
35712
35767
  xmlns: "http://www.w3.org/2000/svg"
35713
- }, props), _path$1f || (_path$1f = /*#__PURE__*/createElement$1("path", {
35768
+ }, props), _path$1g || (_path$1g = /*#__PURE__*/createElement$1("path", {
35714
35769
  fillRule: "evenodd",
35715
35770
  clipRule: "evenodd",
35716
35771
  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 +35773,46 @@ function SvgClear(props) {
35718
35773
  })));
35719
35774
  }
35720
35775
 
35721
- var _path$1g;
35722
- function _extends$1k() {
35723
- return _extends$1k = Object.assign ? Object.assign.bind() : function (n) {
35776
+ var _path$1h;
35777
+ function _extends$1l() {
35778
+ return _extends$1l = Object.assign ? Object.assign.bind() : function (n) {
35724
35779
  for (var e = 1; e < arguments.length; e++) {
35725
35780
  var t = arguments[e];
35726
35781
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35727
35782
  }
35728
35783
  return n;
35729
- }, _extends$1k.apply(null, arguments);
35784
+ }, _extends$1l.apply(null, arguments);
35730
35785
  }
35731
35786
  function SvgBlockChannel(props) {
35732
- return /*#__PURE__*/createElement$1("svg", _extends$1k({
35787
+ return /*#__PURE__*/createElement$1("svg", _extends$1l({
35733
35788
  width: 20,
35734
35789
  height: 21,
35735
35790
  viewBox: "0 0 20.01 21.01",
35736
35791
  fill: "none",
35737
35792
  xmlns: "http://www.w3.org/2000/svg"
35738
- }, props), _path$1g || (_path$1g = /*#__PURE__*/createElement$1("path", {
35793
+ }, props), _path$1h || (_path$1h = /*#__PURE__*/createElement$1("path", {
35739
35794
  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
35795
  fill: "CurrentColor"
35741
35796
  })));
35742
35797
  }
35743
35798
 
35744
- var _path$1h, _path2$8;
35745
- function _extends$1l() {
35746
- return _extends$1l = Object.assign ? Object.assign.bind() : function (n) {
35799
+ var _path$1i, _path2$8;
35800
+ function _extends$1m() {
35801
+ return _extends$1m = Object.assign ? Object.assign.bind() : function (n) {
35747
35802
  for (var e = 1; e < arguments.length; e++) {
35748
35803
  var t = arguments[e];
35749
35804
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35750
35805
  }
35751
35806
  return n;
35752
- }, _extends$1l.apply(null, arguments);
35807
+ }, _extends$1m.apply(null, arguments);
35753
35808
  }
35754
35809
  function SvgReport(props) {
35755
- return /*#__PURE__*/createElement$1("svg", _extends$1l({
35810
+ return /*#__PURE__*/createElement$1("svg", _extends$1m({
35756
35811
  width: 20,
35757
35812
  height: 21,
35758
35813
  fill: "none",
35759
35814
  xmlns: "http://www.w3.org/2000/svg"
35760
- }, props), _path$1h || (_path$1h = /*#__PURE__*/createElement$1("path", {
35815
+ }, props), _path$1i || (_path$1i = /*#__PURE__*/createElement$1("path", {
35761
35816
  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
35817
  fill: "CurrentColor"
35763
35818
  })), _path2$8 || (_path2$8 = /*#__PURE__*/createElement$1("path", {
@@ -35768,46 +35823,46 @@ function SvgReport(props) {
35768
35823
  })));
35769
35824
  }
35770
35825
 
35771
- var _path$1i;
35772
- function _extends$1m() {
35773
- return _extends$1m = Object.assign ? Object.assign.bind() : function (n) {
35826
+ var _path$1j;
35827
+ function _extends$1n() {
35828
+ return _extends$1n = Object.assign ? Object.assign.bind() : function (n) {
35774
35829
  for (var e = 1; e < arguments.length; e++) {
35775
35830
  var t = arguments[e];
35776
35831
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35777
35832
  }
35778
35833
  return n;
35779
- }, _extends$1m.apply(null, arguments);
35834
+ }, _extends$1n.apply(null, arguments);
35780
35835
  }
35781
35836
  function SvgStar(props) {
35782
- return /*#__PURE__*/createElement$1("svg", _extends$1m({
35837
+ return /*#__PURE__*/createElement$1("svg", _extends$1n({
35783
35838
  width: 20,
35784
35839
  height: 20,
35785
35840
  fill: "none",
35786
35841
  xmlns: "http://www.w3.org/2000/svg"
35787
- }, props), _path$1i || (_path$1i = /*#__PURE__*/createElement$1("path", {
35842
+ }, props), _path$1j || (_path$1j = /*#__PURE__*/createElement$1("path", {
35788
35843
  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
35844
  fill: "#B2B6BE"
35790
35845
  })));
35791
35846
  }
35792
35847
 
35793
- var _path$1j;
35794
- function _extends$1n() {
35795
- return _extends$1n = Object.assign ? Object.assign.bind() : function (n) {
35848
+ var _path$1k;
35849
+ function _extends$1o() {
35850
+ return _extends$1o = Object.assign ? Object.assign.bind() : function (n) {
35796
35851
  for (var e = 1; e < arguments.length; e++) {
35797
35852
  var t = arguments[e];
35798
35853
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35799
35854
  }
35800
35855
  return n;
35801
- }, _extends$1n.apply(null, arguments);
35856
+ }, _extends$1o.apply(null, arguments);
35802
35857
  }
35803
35858
  function SvgUnpin(props) {
35804
- return /*#__PURE__*/createElement$1("svg", _extends$1n({
35859
+ return /*#__PURE__*/createElement$1("svg", _extends$1o({
35805
35860
  width: 20,
35806
35861
  height: 21,
35807
35862
  viewBox: "0 0 20.01 21.01",
35808
35863
  fill: "none",
35809
35864
  xmlns: "http://www.w3.org/2000/svg"
35810
- }, props), _path$1j || (_path$1j = /*#__PURE__*/createElement$1("path", {
35865
+ }, props), _path$1k || (_path$1k = /*#__PURE__*/createElement$1("path", {
35811
35866
  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
35867
  fill: "CurrentColor"
35813
35868
  })));
@@ -36313,18 +36368,18 @@ var ActionItem = styled.li(_templateObject16$3 || (_templateObject16$3 = _tagged
36313
36368
  return props.hoverColor;
36314
36369
  });
36315
36370
 
36316
- var _rect$2, _rect2, _path$1k;
36317
- function _extends$1o() {
36318
- return _extends$1o = Object.assign ? Object.assign.bind() : function (n) {
36371
+ var _rect$2, _rect2, _path$1l;
36372
+ function _extends$1p() {
36373
+ return _extends$1p = Object.assign ? Object.assign.bind() : function (n) {
36319
36374
  for (var e = 1; e < arguments.length; e++) {
36320
36375
  var t = arguments[e];
36321
36376
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
36322
36377
  }
36323
36378
  return n;
36324
- }, _extends$1o.apply(null, arguments);
36379
+ }, _extends$1p.apply(null, arguments);
36325
36380
  }
36326
36381
  function SvgAddMember(props) {
36327
- return /*#__PURE__*/createElement$1("svg", _extends$1o({
36382
+ return /*#__PURE__*/createElement$1("svg", _extends$1p({
36328
36383
  width: 40,
36329
36384
  height: 40,
36330
36385
  viewBox: "0 0 40.01 40.01",
@@ -36344,29 +36399,29 @@ function SvgAddMember(props) {
36344
36399
  stroke: "#000",
36345
36400
  strokeOpacity: 0.08,
36346
36401
  strokeWidth: 0.5
36347
- })), _path$1k || (_path$1k = /*#__PURE__*/createElement$1("path", {
36402
+ })), _path$1l || (_path$1l = /*#__PURE__*/createElement$1("path", {
36348
36403
  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
36404
  fill: "CurrentColor"
36350
36405
  })));
36351
36406
  }
36352
36407
 
36353
- var _path$1l;
36354
- function _extends$1p() {
36355
- return _extends$1p = Object.assign ? Object.assign.bind() : function (n) {
36408
+ var _path$1m;
36409
+ function _extends$1q() {
36410
+ return _extends$1q = Object.assign ? Object.assign.bind() : function (n) {
36356
36411
  for (var e = 1; e < arguments.length; e++) {
36357
36412
  var t = arguments[e];
36358
36413
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
36359
36414
  }
36360
36415
  return n;
36361
- }, _extends$1p.apply(null, arguments);
36416
+ }, _extends$1q.apply(null, arguments);
36362
36417
  }
36363
36418
  function SvgMoreVert(props) {
36364
- return /*#__PURE__*/createElement$1("svg", _extends$1p({
36419
+ return /*#__PURE__*/createElement$1("svg", _extends$1q({
36365
36420
  width: 4,
36366
36421
  height: 14,
36367
36422
  fill: "none",
36368
36423
  xmlns: "http://www.w3.org/2000/svg"
36369
- }, props), _path$1l || (_path$1l = /*#__PURE__*/createElement$1("path", {
36424
+ }, props), _path$1m || (_path$1m = /*#__PURE__*/createElement$1("path", {
36370
36425
  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
36426
  fill: "#9B9DA8"
36372
36427
  })));
@@ -36859,18 +36914,18 @@ var Media = function Media(_ref) {
36859
36914
  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
36915
  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
36916
 
36862
- var _rect$3, _path$1m;
36863
- function _extends$1q() {
36864
- return _extends$1q = Object.assign ? Object.assign.bind() : function (n) {
36917
+ var _rect$3, _path$1n;
36918
+ function _extends$1r() {
36919
+ return _extends$1r = Object.assign ? Object.assign.bind() : function (n) {
36865
36920
  for (var e = 1; e < arguments.length; e++) {
36866
36921
  var t = arguments[e];
36867
36922
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
36868
36923
  }
36869
36924
  return n;
36870
- }, _extends$1q.apply(null, arguments);
36925
+ }, _extends$1r.apply(null, arguments);
36871
36926
  }
36872
36927
  function SvgFileIcon$1(props) {
36873
- return /*#__PURE__*/createElement$1("svg", _extends$1q({
36928
+ return /*#__PURE__*/createElement$1("svg", _extends$1r({
36874
36929
  width: 40,
36875
36930
  height: 40,
36876
36931
  fill: "none",
@@ -36882,7 +36937,7 @@ function SvgFileIcon$1(props) {
36882
36937
  rx: 8,
36883
36938
  fill: "currentColor",
36884
36939
  fillOpacity: 0.2
36885
- })), _path$1m || (_path$1m = /*#__PURE__*/createElement$1("path", {
36940
+ })), _path$1n || (_path$1n = /*#__PURE__*/createElement$1("path", {
36886
36941
  fillRule: "evenodd",
36887
36942
  clipRule: "evenodd",
36888
36943
  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 +36945,23 @@ function SvgFileIcon$1(props) {
36890
36945
  })));
36891
36946
  }
36892
36947
 
36893
- var _path$1n;
36894
- function _extends$1r() {
36895
- return _extends$1r = Object.assign ? Object.assign.bind() : function (n) {
36948
+ var _path$1o;
36949
+ function _extends$1s() {
36950
+ return _extends$1s = Object.assign ? Object.assign.bind() : function (n) {
36896
36951
  for (var e = 1; e < arguments.length; e++) {
36897
36952
  var t = arguments[e];
36898
36953
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
36899
36954
  }
36900
36955
  return n;
36901
- }, _extends$1r.apply(null, arguments);
36956
+ }, _extends$1s.apply(null, arguments);
36902
36957
  }
36903
36958
  function SvgDownloadFile(props) {
36904
- return /*#__PURE__*/createElement$1("svg", _extends$1r({
36959
+ return /*#__PURE__*/createElement$1("svg", _extends$1s({
36905
36960
  width: 24,
36906
36961
  height: 24,
36907
36962
  xmlns: "http://www.w3.org/2000/svg",
36908
36963
  fill: "currentColor"
36909
- }, props), _path$1n || (_path$1n = /*#__PURE__*/createElement$1("path", {
36964
+ }, props), _path$1o || (_path$1o = /*#__PURE__*/createElement$1("path", {
36910
36965
  fillRule: "evenodd",
36911
36966
  clipRule: "evenodd",
36912
36967
  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 +37116,18 @@ var FileSizeAndDate = styled.span(_templateObject8$i || (_templateObject8$i = _t
37061
37116
  return props.color;
37062
37117
  });
37063
37118
 
37064
- var _rect$4, _path$1o;
37065
- function _extends$1s() {
37066
- return _extends$1s = Object.assign ? Object.assign.bind() : function (n) {
37119
+ var _rect$4, _path$1p;
37120
+ function _extends$1t() {
37121
+ return _extends$1t = Object.assign ? Object.assign.bind() : function (n) {
37067
37122
  for (var e = 1; e < arguments.length; e++) {
37068
37123
  var t = arguments[e];
37069
37124
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
37070
37125
  }
37071
37126
  return n;
37072
- }, _extends$1s.apply(null, arguments);
37127
+ }, _extends$1t.apply(null, arguments);
37073
37128
  }
37074
37129
  function SvgLinkIcon(props) {
37075
- return /*#__PURE__*/createElement$1("svg", _extends$1s({
37130
+ return /*#__PURE__*/createElement$1("svg", _extends$1t({
37076
37131
  width: 40,
37077
37132
  height: 40,
37078
37133
  fill: "none",
@@ -37084,7 +37139,7 @@ function SvgLinkIcon(props) {
37084
37139
  rx: 8,
37085
37140
  fill: "currentColor",
37086
37141
  fillOpacity: 0.2
37087
- })), _path$1o || (_path$1o = /*#__PURE__*/createElement$1("path", {
37142
+ })), _path$1p || (_path$1p = /*#__PURE__*/createElement$1("path", {
37088
37143
  fillRule: "evenodd",
37089
37144
  clipRule: "evenodd",
37090
37145
  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 +37223,18 @@ var Links = function Links(_ref) {
37168
37223
  };
37169
37224
  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
37225
 
37171
- var _rect$5, _path$1p;
37172
- function _extends$1t() {
37173
- return _extends$1t = Object.assign ? Object.assign.bind() : function (n) {
37226
+ var _rect$5, _path$1q;
37227
+ function _extends$1u() {
37228
+ return _extends$1u = Object.assign ? Object.assign.bind() : function (n) {
37174
37229
  for (var e = 1; e < arguments.length; e++) {
37175
37230
  var t = arguments[e];
37176
37231
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
37177
37232
  }
37178
37233
  return n;
37179
- }, _extends$1t.apply(null, arguments);
37234
+ }, _extends$1u.apply(null, arguments);
37180
37235
  }
37181
37236
  function SvgVoicePreview(props) {
37182
- return /*#__PURE__*/createElement$1("svg", _extends$1t({
37237
+ return /*#__PURE__*/createElement$1("svg", _extends$1u({
37183
37238
  width: 40,
37184
37239
  height: 40,
37185
37240
  fill: "none",
@@ -37189,24 +37244,24 @@ function SvgVoicePreview(props) {
37189
37244
  height: 40,
37190
37245
  rx: 20,
37191
37246
  fill: "#5159F6"
37192
- })), _path$1p || (_path$1p = /*#__PURE__*/createElement$1("path", {
37247
+ })), _path$1q || (_path$1q = /*#__PURE__*/createElement$1("path", {
37193
37248
  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
37249
  fill: "#fff"
37195
37250
  })));
37196
37251
  }
37197
37252
 
37198
- var _rect$6, _path$1q;
37199
- function _extends$1u() {
37200
- return _extends$1u = Object.assign ? Object.assign.bind() : function (n) {
37253
+ var _rect$6, _path$1r;
37254
+ function _extends$1v() {
37255
+ return _extends$1v = Object.assign ? Object.assign.bind() : function (n) {
37201
37256
  for (var e = 1; e < arguments.length; e++) {
37202
37257
  var t = arguments[e];
37203
37258
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
37204
37259
  }
37205
37260
  return n;
37206
- }, _extends$1u.apply(null, arguments);
37261
+ }, _extends$1v.apply(null, arguments);
37207
37262
  }
37208
37263
  function SvgVoicePreviewPause(props) {
37209
- return /*#__PURE__*/createElement$1("svg", _extends$1u({
37264
+ return /*#__PURE__*/createElement$1("svg", _extends$1v({
37210
37265
  width: 40,
37211
37266
  height: 40,
37212
37267
  fill: "none",
@@ -37216,7 +37271,7 @@ function SvgVoicePreviewPause(props) {
37216
37271
  height: 40,
37217
37272
  rx: 20,
37218
37273
  fill: "#5159F6"
37219
- })), _path$1q || (_path$1q = /*#__PURE__*/createElement$1("path", {
37274
+ })), _path$1r || (_path$1r = /*#__PURE__*/createElement$1("path", {
37220
37275
  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
37276
  fill: "#fff"
37222
37277
  })));
@@ -38502,23 +38557,23 @@ var ChannelDetailsContainer = function ChannelDetailsContainer(_ref) {
38502
38557
  };
38503
38558
  var DetailsWrapper = styled.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteralLoose([""])));
38504
38559
 
38505
- var _path$1r;
38506
- function _extends$1v() {
38507
- return _extends$1v = Object.assign ? Object.assign.bind() : function (n) {
38560
+ var _path$1s;
38561
+ function _extends$1w() {
38562
+ return _extends$1w = Object.assign ? Object.assign.bind() : function (n) {
38508
38563
  for (var e = 1; e < arguments.length; e++) {
38509
38564
  var t = arguments[e];
38510
38565
  for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
38511
38566
  }
38512
38567
  return n;
38513
- }, _extends$1v.apply(null, arguments);
38568
+ }, _extends$1w.apply(null, arguments);
38514
38569
  }
38515
38570
  function SvgChevronDown(props) {
38516
- return /*#__PURE__*/createElement$1("svg", _extends$1v({
38571
+ return /*#__PURE__*/createElement$1("svg", _extends$1w({
38517
38572
  width: 32,
38518
38573
  height: 32,
38519
38574
  fill: "none",
38520
38575
  xmlns: "http://www.w3.org/2000/svg"
38521
- }, props), _path$1r || (_path$1r = /*#__PURE__*/createElement$1("path", {
38576
+ }, props), _path$1s || (_path$1s = /*#__PURE__*/createElement$1("path", {
38522
38577
  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
38578
  fill: "CurrentColor"
38524
38579
  })));