sceyt-chat-react-uikit 1.8.9-beta.18 → 1.8.9-beta.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/index.js +32 -13
  2. package/index.modern.js +32 -13
  3. package/package.json +1 -1
package/index.js CHANGED
@@ -33757,7 +33757,7 @@ var UsersPopup = function UsersPopup(_ref2) {
33757
33757
  })));
33758
33758
  };
33759
33759
  var List = styled__default.div(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n overflow-y: scroll;\n overflow-x: hidden;\n margin-top: 12px;\n min-height: 150px;\n box-sizing: border-box;\n"])));
33760
- var MembersContainer = styled__default(List)(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n position: relative;\n max-height: ", ";\n overflow-y: auto;\n padding-right: 16px;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
33760
+ var MembersContainer = styled__default(List)(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n position: relative;\n max-height: ", ";\n overflow-y: auto;\n padding-right: 16px;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
33761
33761
  return "calc(100% - (" + ((props.isAdd ? 67 : 70) + props.selectedMembersHeight) + "px))";
33762
33762
  }, function (props) {
33763
33763
  return props.thumbColor;
@@ -33783,7 +33783,7 @@ var UserNamePresence = styled__default.div(_templateObject6$3 || (_templateObjec
33783
33783
  var MemberName = styled__default.h4(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteralLoose(["\n font-style: normal;\n font-size: 15px;\n font-weight: 500;\n line-height: 16px;\n color: ", ";\n margin: 0;\n max-width: calc(100% - 10px);\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n"])), function (props) {
33784
33784
  return props.color;
33785
33785
  });
33786
- var SelectedMembersContainer = styled__default.div(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-start;\n flex-wrap: wrap;\n width: 100%;\n max-height: 85px;\n overflow-x: hidden;\n padding: 2px 12px 0;\n box-sizing: border-box;\n overflow-y: auto;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
33786
+ var SelectedMembersContainer = styled__default.div(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-start;\n flex-wrap: wrap;\n width: 100%;\n max-height: 85px;\n overflow-x: hidden;\n padding: 2px 12px 0;\n box-sizing: border-box;\n overflow-y: auto;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
33787
33787
  return props.thumbColor;
33788
33788
  });
33789
33789
  var SelectedMemberBubble = styled__default.div(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n background: ", ";\n border-radius: 16px;\n align-items: center;\n padding: 4px 10px 4px 0;\n height: 28px;\n margin: 8px 8px 0 0;\n box-sizing: border-box;\n"])), function (props) {
@@ -35596,7 +35596,7 @@ var Container$7 = styled__default.div(_templateObject$i || (_templateObject$i =
35596
35596
  }, function (props) {
35597
35597
  return props.withCustomList ? '' : "\n @media " + device.laptopL + " {\n width: 400px;\n min-width: 400px;\n }\n ";
35598
35598
  });
35599
- var ChannelsList = styled__default.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n width: 400px;\n height: 100%;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
35599
+ var ChannelsList = styled__default.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n width: 400px;\n height: 100%;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
35600
35600
  return props.thumbColor;
35601
35601
  }, function (props) {
35602
35602
  return props.thumbColor;
@@ -37466,7 +37466,7 @@ function ForwardMessagePopup(_ref2) {
37466
37466
  onClick: handleForwardMessage
37467
37467
  }, buttonText || 'Forward'))));
37468
37468
  }
37469
- var ForwardChannelsCont = styled__default.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n margin-top: 16px;\n max-height: ", ";\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
37469
+ var ForwardChannelsCont = styled__default.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n margin-top: 16px;\n max-height: ", ";\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
37470
37470
  return "calc(100% - " + (props.selectedChannelsHeight + 82) + "px)";
37471
37471
  }, function (props) {
37472
37472
  return props.thumbColor;
@@ -41447,7 +41447,7 @@ var AttachmentImgCont = styled__default.div(_templateObject2$v || (_templateObje
41447
41447
  }, function (props) {
41448
41448
  return props.height && '165px';
41449
41449
  }, function (props) {
41450
- return props.backgroundColor && "\n background-color: " + props.backgroundColor + ";\n border-radius: 8px;\n justify-content: center;\n align-items: center;\n & > svg:first-child {\n width: 40px;\n height: 40px;\n transform: translate(2px, 3px);\n }\n ";
41450
+ return props.backgroundColor && "\n background-color: " + props.backgroundColor + ";\n border-radius: " + (props.borderRadius || '8px') + ";\n justify-content: center;\n align-items: center;\n & > svg:first-child {\n width: 40px;\n height: 40px;\n transform: translate(2px, 3px);\n }\n ";
41451
41451
  }, DownloadImage, function (props) {
41452
41452
  return props.isPreview && "\n width: 48px;\n min-width: 48px;\n height: 48px;\n ";
41453
41453
  });
@@ -42663,7 +42663,7 @@ var AllVotesPopup = function AllVotesPopup(_ref) {
42663
42663
  color: textSecondary
42664
42664
  }, "Loading...")))))));
42665
42665
  };
42666
- var VotesList = styled__default.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n max-height: 500px;\n padding: 8px 0;\n overflow-y: auto;\n overflow-x: hidden;\n padding-right: 14px;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
42666
+ var VotesList = styled__default.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n max-height: 500px;\n padding: 8px 0;\n overflow-y: auto;\n overflow-x: hidden;\n padding-right: 14px;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
42667
42667
  return props.thumbColor;
42668
42668
  }, function (props) {
42669
42669
  return props.thumbColor;
@@ -42848,7 +42848,7 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
42848
42848
  })) === null || _poll$options$find === void 0 ? void 0 : _poll$options$find.name) || ''
42849
42849
  })));
42850
42850
  };
42851
- var OptionsList = styled__default.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n max-height: calc(554px - ", "px);\n border-radius: 10px;\n overflow-y: auto;\n overflow-x: hidden;\n width: calc(100% + 20px);\n padding-right: 14px;\n box-sizing: border-box;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
42851
+ var OptionsList = styled__default.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n max-height: calc(554px - ", "px);\n border-radius: 10px;\n overflow-y: auto;\n overflow-x: hidden;\n width: calc(100% + 20px);\n padding-right: 14px;\n box-sizing: border-box;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
42852
42852
  return props.titleHeight;
42853
42853
  }, function (props) {
42854
42854
  return props.thumbColor;
@@ -49110,6 +49110,9 @@ var MessageList = function MessageList(_ref) {
49110
49110
  var _useState4 = React.useState(''),
49111
49111
  stickyDate = _useState4[0],
49112
49112
  setStickyDate = _useState4[1];
49113
+ var _useState5 = React.useState(false),
49114
+ isScrolling = _useState5[0],
49115
+ setIsScrolling = _useState5[1];
49113
49116
  var markerBatcherRef = React__default.useRef(null);
49114
49117
  if (!markerBatcherRef.current) {
49115
49118
  markerBatcherRef.current = createMessageMarkerBatcher({
@@ -49598,10 +49601,16 @@ var MessageList = function MessageList(_ref) {
49598
49601
  "$color": iconInactive
49599
49602
  }))), /*#__PURE__*/React__default.createElement(Container$j, {
49600
49603
  id: 'scrollableDiv',
49601
- className: 'show-scrollbar',
49604
+ className: isScrolling ? 'show-scrollbar' : '',
49602
49605
  ref: scrollRef,
49603
49606
  stopScrolling: stopScrolling,
49604
49607
  onDragEnter: handleDragIn,
49608
+ onMouseEnter: function onMouseEnter() {
49609
+ return setIsScrolling(true);
49610
+ },
49611
+ onMouseLeave: function onMouseLeave() {
49612
+ return setIsScrolling(false);
49613
+ },
49605
49614
  backgroundColor: backgroundColor || themeBackgroundColor,
49606
49615
  thumbColor: surface2
49607
49616
  }, messages.length && messages.length > 0 ? (/*#__PURE__*/React__default.createElement(MessagesBox, {
@@ -49697,7 +49706,7 @@ var MessageList = function MessageList(_ref) {
49697
49706
  }
49698
49707
  })));
49699
49708
  };
49700
- var Container$j = styled__default.div(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n background-color: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
49709
+ var Container$j = styled__default.div(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n background-color: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
49701
49710
  return props.backgroundColor;
49702
49711
  }, function (props) {
49703
49712
  return props.thumbColor;
@@ -53220,7 +53229,7 @@ var CustomTextArea = styled__default.textarea(_templateObject2$Q || (_templateOb
53220
53229
  var TextCounter = styled__default.span(_templateObject3$H || (_templateObject3$H = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 500;\n font-size: 13px;\n line-height: 20px;\n margin-left: auto;\n"])), function (props) {
53221
53230
  return props.color;
53222
53231
  });
53223
- var OptionsList$1 = styled__default.div(_templateObject4$B || (_templateObject4$B = _taggedTemplateLiteralLoose(["\n max-height: 200px;\n overflow-y: auto;\n margin-top: 8px;\n padding-right: 6px;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
53232
+ var OptionsList$1 = styled__default.div(_templateObject4$B || (_templateObject4$B = _taggedTemplateLiteralLoose(["\n max-height: 200px;\n overflow-y: auto;\n margin-top: 8px;\n padding-right: 6px;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
53224
53233
  return props.thumbColor;
53225
53234
  }, function (props) {
53226
53235
  return props.thumbColor;
@@ -55446,7 +55455,7 @@ var MessageInputWrapper = styled__default.div(_templateObject12$7 || (_templateO
55446
55455
  }, function (props) {
55447
55456
  return props.borderRadius || '18px';
55448
55457
  });
55449
- var LexicalWrapper = styled__default.div(_templateObject13$6 || (_templateObject13$6 = _taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n\n & .rich_text_editor {\n width: 100%;\n max-height: 80px;\n min-height: 20px;\n display: block;\n border: none;\n box-sizing: border-box;\n outline: none !important;\n border-radius: ", ";\n background-color: ", ";\n padding: ", ";\n color: ", ";\n order: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n\n & p {\n font-size: 15px;\n line-height: 20px;\n color: ", ";\n }\n\n &::selection {\n background-color: ", ";\n }\n\n & *::selection {\n background-color: ", ";\n }\n\n & span::selection {\n background-color: ", ";\n }\n\n &:empty:before {\n content: attr(data-placeholder);\n }\n\n & .content_editable_input {\n border: none !important;\n outline: none !important;\n }\n\n & .mention {\n color: ", ";\n background-color: inherit !important;\n user-select: text;\n -webkit-user-select: text;\n }\n\n & span.bold {\n font-weight: bold;\n }\n\n & .editor_paragraph {\n margin: 0;\n }\n\n & .text_bold {\n font-weight: 600;\n }\n\n & .text_italic {\n font-style: italic;\n }\n\n & .text_underline {\n text-decoration: underline;\n }\n\n & .text_strikethrough {\n text-decoration: line-through;\n }\n\n & .text_underlineStrikethrough {\n text-decoration: underline line-through;\n }\n\n & code {\n font-family: inherit;\n letter-spacing: 4px;\n }\n }\n"])), function (props) {
55458
+ var LexicalWrapper = styled__default.div(_templateObject13$6 || (_templateObject13$6 = _taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n\n & .rich_text_editor {\n width: 100%;\n max-height: 80px;\n min-height: 20px;\n display: block;\n border: none;\n box-sizing: border-box;\n outline: none !important;\n border-radius: ", ";\n background-color: ", ";\n padding: ", ";\n color: ", ";\n order: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n\n & p {\n font-size: 15px;\n line-height: 20px;\n color: ", ";\n }\n\n &::selection {\n background-color: ", ";\n }\n\n & *::selection {\n background-color: ", ";\n }\n\n & span::selection {\n background-color: ", ";\n }\n\n &:empty:before {\n content: attr(data-placeholder);\n }\n\n & .content_editable_input {\n border: none !important;\n outline: none !important;\n }\n\n & .mention {\n color: ", ";\n background-color: inherit !important;\n user-select: text;\n -webkit-user-select: text;\n }\n\n & span.bold {\n font-weight: bold;\n }\n\n & .editor_paragraph {\n margin: 0;\n }\n\n & .text_bold {\n font-weight: 600;\n }\n\n & .text_italic {\n font-style: italic;\n }\n\n & .text_underline {\n text-decoration: underline;\n }\n\n & .text_strikethrough {\n text-decoration: line-through;\n }\n\n & .text_underlineStrikethrough {\n text-decoration: underline line-through;\n }\n\n & code {\n font-family: inherit;\n letter-spacing: 4px;\n }\n }\n"])), function (props) {
55450
55459
  return props.borderRadius;
55451
55460
  }, function (props) {
55452
55461
  return props.backgroundColor;
@@ -56300,7 +56309,7 @@ var GroupsInCommonPopup = function GroupsInCommonPopup(_ref2) {
56300
56309
  color: textSecondary
56301
56310
  }, "Loading more...")))));
56302
56311
  };
56303
- var ChannelsList$1 = styled__default.div(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteralLoose(["\n max-height: 400px;\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
56312
+ var ChannelsList$1 = styled__default.div(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteralLoose(["\n max-height: 400px;\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
56304
56313
  return props.thumbColor;
56305
56314
  }, function (props) {
56306
56315
  return props.thumbColor;
@@ -59630,6 +59639,16 @@ var Details = function Details(_ref) {
59630
59639
  if (detailsContainer) {
59631
59640
  setChannelDetailsHeight(detailsContainer.offsetHeight);
59632
59641
  }
59642
+ var handleResize = function handleResize() {
59643
+ var container = document.getElementById('channel_details_wrapper');
59644
+ if (container) {
59645
+ setChannelDetailsHeight(container.offsetHeight);
59646
+ }
59647
+ };
59648
+ window.addEventListener('resize', handleResize);
59649
+ return function () {
59650
+ return window.removeEventListener('resize', handleResize);
59651
+ };
59633
59652
  }, []);
59634
59653
  React.useEffect(function () {
59635
59654
  return function () {
@@ -59882,7 +59901,7 @@ var Container$v = styled__default.div(_templateObject$1a || (_templateObject$1a
59882
59901
  var ChannelDetailsHeader = styled__default.div(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: 16px;\n position: relative;\n height: 64px;\n box-sizing: border-box;\n border-bottom: 1px solid ", ";\n\n & svg {\n cursor: pointer;\n }\n"])), function (props) {
59883
59902
  return props.borderColor;
59884
59903
  });
59885
- var ChatDetails = styled__default.div(_templateObject3$X || (_templateObject3$X = _taggedTemplateLiteralLoose(["\n //position: relative;\n width: ", ";\n //height: ", ";\n height: ", ";\n overflow-y: auto;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
59904
+ var ChatDetails = styled__default.div(_templateObject3$X || (_templateObject3$X = _taggedTemplateLiteralLoose(["\n //position: relative;\n width: ", ";\n //height: ", ";\n height: ", ";\n overflow-y: auto;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
59886
59905
  return props.size === 'small' ? '300px' : props.size === 'medium' ? '350px' : '400px';
59887
59906
  }, function (props) {
59888
59907
  return props.height ? "calc(100vh - " + props.heightOffset + "px)" : '100vh';
package/index.modern.js CHANGED
@@ -33737,7 +33737,7 @@ var UsersPopup = function UsersPopup(_ref2) {
33737
33737
  })));
33738
33738
  };
33739
33739
  var List = styled.div(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n overflow-y: scroll;\n overflow-x: hidden;\n margin-top: 12px;\n min-height: 150px;\n box-sizing: border-box;\n"])));
33740
- var MembersContainer = styled(List)(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n position: relative;\n max-height: ", ";\n overflow-y: auto;\n padding-right: 16px;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
33740
+ var MembersContainer = styled(List)(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n position: relative;\n max-height: ", ";\n overflow-y: auto;\n padding-right: 16px;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
33741
33741
  return "calc(100% - (" + ((props.isAdd ? 67 : 70) + props.selectedMembersHeight) + "px))";
33742
33742
  }, function (props) {
33743
33743
  return props.thumbColor;
@@ -33763,7 +33763,7 @@ var UserNamePresence = styled.div(_templateObject6$3 || (_templateObject6$3 = _t
33763
33763
  var MemberName = styled.h4(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteralLoose(["\n font-style: normal;\n font-size: 15px;\n font-weight: 500;\n line-height: 16px;\n color: ", ";\n margin: 0;\n max-width: calc(100% - 10px);\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n"])), function (props) {
33764
33764
  return props.color;
33765
33765
  });
33766
- var SelectedMembersContainer = styled.div(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-start;\n flex-wrap: wrap;\n width: 100%;\n max-height: 85px;\n overflow-x: hidden;\n padding: 2px 12px 0;\n box-sizing: border-box;\n overflow-y: auto;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
33766
+ var SelectedMembersContainer = styled.div(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-start;\n flex-wrap: wrap;\n width: 100%;\n max-height: 85px;\n overflow-x: hidden;\n padding: 2px 12px 0;\n box-sizing: border-box;\n overflow-y: auto;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n"])), function (props) {
33767
33767
  return props.thumbColor;
33768
33768
  });
33769
33769
  var SelectedMemberBubble = styled.div(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n background: ", ";\n border-radius: 16px;\n align-items: center;\n padding: 4px 10px 4px 0;\n height: 28px;\n margin: 8px 8px 0 0;\n box-sizing: border-box;\n"])), function (props) {
@@ -35576,7 +35576,7 @@ var Container$7 = styled.div(_templateObject$i || (_templateObject$i = _taggedTe
35576
35576
  }, function (props) {
35577
35577
  return props.withCustomList ? '' : "\n @media " + device.laptopL + " {\n width: 400px;\n min-width: 400px;\n }\n ";
35578
35578
  });
35579
- var ChannelsList = styled.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n width: 400px;\n height: 100%;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
35579
+ var ChannelsList = styled.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n width: 400px;\n height: 100%;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
35580
35580
  return props.thumbColor;
35581
35581
  }, function (props) {
35582
35582
  return props.thumbColor;
@@ -37446,7 +37446,7 @@ function ForwardMessagePopup(_ref2) {
37446
37446
  onClick: handleForwardMessage
37447
37447
  }, buttonText || 'Forward'))));
37448
37448
  }
37449
- var ForwardChannelsCont = styled.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n margin-top: 16px;\n max-height: ", ";\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
37449
+ var ForwardChannelsCont = styled.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n overflow-y: auto;\n margin-top: 16px;\n max-height: ", ";\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
37450
37450
  return "calc(100% - " + (props.selectedChannelsHeight + 82) + "px)";
37451
37451
  }, function (props) {
37452
37452
  return props.thumbColor;
@@ -41427,7 +41427,7 @@ var AttachmentImgCont = styled.div(_templateObject2$v || (_templateObject2$v = _
41427
41427
  }, function (props) {
41428
41428
  return props.height && '165px';
41429
41429
  }, function (props) {
41430
- return props.backgroundColor && "\n background-color: " + props.backgroundColor + ";\n border-radius: 8px;\n justify-content: center;\n align-items: center;\n & > svg:first-child {\n width: 40px;\n height: 40px;\n transform: translate(2px, 3px);\n }\n ";
41430
+ return props.backgroundColor && "\n background-color: " + props.backgroundColor + ";\n border-radius: " + (props.borderRadius || '8px') + ";\n justify-content: center;\n align-items: center;\n & > svg:first-child {\n width: 40px;\n height: 40px;\n transform: translate(2px, 3px);\n }\n ";
41431
41431
  }, DownloadImage, function (props) {
41432
41432
  return props.isPreview && "\n width: 48px;\n min-width: 48px;\n height: 48px;\n ";
41433
41433
  });
@@ -42643,7 +42643,7 @@ var AllVotesPopup = function AllVotesPopup(_ref) {
42643
42643
  color: textSecondary
42644
42644
  }, "Loading...")))))));
42645
42645
  };
42646
- var VotesList = styled.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n max-height: 500px;\n padding: 8px 0;\n overflow-y: auto;\n overflow-x: hidden;\n padding-right: 14px;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
42646
+ var VotesList = styled.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n max-height: 500px;\n padding: 8px 0;\n overflow-y: auto;\n overflow-x: hidden;\n padding-right: 14px;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
42647
42647
  return props.thumbColor;
42648
42648
  }, function (props) {
42649
42649
  return props.thumbColor;
@@ -42828,7 +42828,7 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
42828
42828
  })) === null || _poll$options$find === void 0 ? void 0 : _poll$options$find.name) || ''
42829
42829
  })));
42830
42830
  };
42831
- var OptionsList = styled.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n max-height: calc(554px - ", "px);\n border-radius: 10px;\n overflow-y: auto;\n overflow-x: hidden;\n width: calc(100% + 20px);\n padding-right: 14px;\n box-sizing: border-box;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
42831
+ var OptionsList = styled.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n max-height: calc(554px - ", "px);\n border-radius: 10px;\n overflow-y: auto;\n overflow-x: hidden;\n width: calc(100% + 20px);\n padding-right: 14px;\n box-sizing: border-box;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
42832
42832
  return props.titleHeight;
42833
42833
  }, function (props) {
42834
42834
  return props.thumbColor;
@@ -49090,6 +49090,9 @@ var MessageList = function MessageList(_ref) {
49090
49090
  var _useState4 = useState(''),
49091
49091
  stickyDate = _useState4[0],
49092
49092
  setStickyDate = _useState4[1];
49093
+ var _useState5 = useState(false),
49094
+ isScrolling = _useState5[0],
49095
+ setIsScrolling = _useState5[1];
49093
49096
  var markerBatcherRef = React__default.useRef(null);
49094
49097
  if (!markerBatcherRef.current) {
49095
49098
  markerBatcherRef.current = createMessageMarkerBatcher({
@@ -49578,10 +49581,16 @@ var MessageList = function MessageList(_ref) {
49578
49581
  "$color": iconInactive
49579
49582
  }))), /*#__PURE__*/React__default.createElement(Container$j, {
49580
49583
  id: 'scrollableDiv',
49581
- className: 'show-scrollbar',
49584
+ className: isScrolling ? 'show-scrollbar' : '',
49582
49585
  ref: scrollRef,
49583
49586
  stopScrolling: stopScrolling,
49584
49587
  onDragEnter: handleDragIn,
49588
+ onMouseEnter: function onMouseEnter() {
49589
+ return setIsScrolling(true);
49590
+ },
49591
+ onMouseLeave: function onMouseLeave() {
49592
+ return setIsScrolling(false);
49593
+ },
49585
49594
  backgroundColor: backgroundColor || themeBackgroundColor,
49586
49595
  thumbColor: surface2
49587
49596
  }, messages.length && messages.length > 0 ? (/*#__PURE__*/React__default.createElement(MessagesBox, {
@@ -49677,7 +49686,7 @@ var MessageList = function MessageList(_ref) {
49677
49686
  }
49678
49687
  })));
49679
49688
  };
49680
- var Container$j = styled.div(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n background-color: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
49689
+ var Container$j = styled.div(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n background-color: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
49681
49690
  return props.backgroundColor;
49682
49691
  }, function (props) {
49683
49692
  return props.thumbColor;
@@ -53200,7 +53209,7 @@ var CustomTextArea = styled.textarea(_templateObject2$Q || (_templateObject2$Q =
53200
53209
  var TextCounter = styled.span(_templateObject3$H || (_templateObject3$H = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 500;\n font-size: 13px;\n line-height: 20px;\n margin-left: auto;\n"])), function (props) {
53201
53210
  return props.color;
53202
53211
  });
53203
- var OptionsList$1 = styled.div(_templateObject4$B || (_templateObject4$B = _taggedTemplateLiteralLoose(["\n max-height: 200px;\n overflow-y: auto;\n margin-top: 8px;\n padding-right: 6px;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
53212
+ var OptionsList$1 = styled.div(_templateObject4$B || (_templateObject4$B = _taggedTemplateLiteralLoose(["\n max-height: 200px;\n overflow-y: auto;\n margin-top: 8px;\n padding-right: 6px;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
53204
53213
  return props.thumbColor;
53205
53214
  }, function (props) {
53206
53215
  return props.thumbColor;
@@ -55426,7 +55435,7 @@ var MessageInputWrapper = styled.div(_templateObject12$7 || (_templateObject12$7
55426
55435
  }, function (props) {
55427
55436
  return props.borderRadius || '18px';
55428
55437
  });
55429
- var LexicalWrapper = styled.div(_templateObject13$6 || (_templateObject13$6 = _taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n\n & .rich_text_editor {\n width: 100%;\n max-height: 80px;\n min-height: 20px;\n display: block;\n border: none;\n box-sizing: border-box;\n outline: none !important;\n border-radius: ", ";\n background-color: ", ";\n padding: ", ";\n color: ", ";\n order: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n\n & p {\n font-size: 15px;\n line-height: 20px;\n color: ", ";\n }\n\n &::selection {\n background-color: ", ";\n }\n\n & *::selection {\n background-color: ", ";\n }\n\n & span::selection {\n background-color: ", ";\n }\n\n &:empty:before {\n content: attr(data-placeholder);\n }\n\n & .content_editable_input {\n border: none !important;\n outline: none !important;\n }\n\n & .mention {\n color: ", ";\n background-color: inherit !important;\n user-select: text;\n -webkit-user-select: text;\n }\n\n & span.bold {\n font-weight: bold;\n }\n\n & .editor_paragraph {\n margin: 0;\n }\n\n & .text_bold {\n font-weight: 600;\n }\n\n & .text_italic {\n font-style: italic;\n }\n\n & .text_underline {\n text-decoration: underline;\n }\n\n & .text_strikethrough {\n text-decoration: line-through;\n }\n\n & .text_underlineStrikethrough {\n text-decoration: underline line-through;\n }\n\n & code {\n font-family: inherit;\n letter-spacing: 4px;\n }\n }\n"])), function (props) {
55438
+ var LexicalWrapper = styled.div(_templateObject13$6 || (_templateObject13$6 = _taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n\n & .rich_text_editor {\n width: 100%;\n max-height: 80px;\n min-height: 20px;\n display: block;\n border: none;\n box-sizing: border-box;\n outline: none !important;\n border-radius: ", ";\n background-color: ", ";\n padding: ", ";\n color: ", ";\n order: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n\n & p {\n font-size: 15px;\n line-height: 20px;\n color: ", ";\n }\n\n &::selection {\n background-color: ", ";\n }\n\n & *::selection {\n background-color: ", ";\n }\n\n & span::selection {\n background-color: ", ";\n }\n\n &:empty:before {\n content: attr(data-placeholder);\n }\n\n & .content_editable_input {\n border: none !important;\n outline: none !important;\n }\n\n & .mention {\n color: ", ";\n background-color: inherit !important;\n user-select: text;\n -webkit-user-select: text;\n }\n\n & span.bold {\n font-weight: bold;\n }\n\n & .editor_paragraph {\n margin: 0;\n }\n\n & .text_bold {\n font-weight: 600;\n }\n\n & .text_italic {\n font-style: italic;\n }\n\n & .text_underline {\n text-decoration: underline;\n }\n\n & .text_strikethrough {\n text-decoration: line-through;\n }\n\n & .text_underlineStrikethrough {\n text-decoration: underline line-through;\n }\n\n & code {\n font-family: inherit;\n letter-spacing: 4px;\n }\n }\n"])), function (props) {
55430
55439
  return props.borderRadius;
55431
55440
  }, function (props) {
55432
55441
  return props.backgroundColor;
@@ -56280,7 +56289,7 @@ var GroupsInCommonPopup = function GroupsInCommonPopup(_ref2) {
56280
56289
  color: textSecondary
56281
56290
  }, "Loading more...")))));
56282
56291
  };
56283
- var ChannelsList$1 = styled.div(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteralLoose(["\n max-height: 400px;\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
56292
+ var ChannelsList$1 = styled.div(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteralLoose(["\n max-height: 400px;\n overflow-y: auto;\n overflow-x: hidden;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
56284
56293
  return props.thumbColor;
56285
56294
  }, function (props) {
56286
56295
  return props.thumbColor;
@@ -59610,6 +59619,16 @@ var Details = function Details(_ref) {
59610
59619
  if (detailsContainer) {
59611
59620
  setChannelDetailsHeight(detailsContainer.offsetHeight);
59612
59621
  }
59622
+ var handleResize = function handleResize() {
59623
+ var container = document.getElementById('channel_details_wrapper');
59624
+ if (container) {
59625
+ setChannelDetailsHeight(container.offsetHeight);
59626
+ }
59627
+ };
59628
+ window.addEventListener('resize', handleResize);
59629
+ return function () {
59630
+ return window.removeEventListener('resize', handleResize);
59631
+ };
59613
59632
  }, []);
59614
59633
  useEffect(function () {
59615
59634
  return function () {
@@ -59862,7 +59881,7 @@ var Container$v = styled.div(_templateObject$1a || (_templateObject$1a = _tagged
59862
59881
  var ChannelDetailsHeader = styled.div(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: 16px;\n position: relative;\n height: 64px;\n box-sizing: border-box;\n border-bottom: 1px solid ", ";\n\n & svg {\n cursor: pointer;\n }\n"])), function (props) {
59863
59882
  return props.borderColor;
59864
59883
  });
59865
- var ChatDetails = styled.div(_templateObject3$X || (_templateObject3$X = _taggedTemplateLiteralLoose(["\n //position: relative;\n width: ", ";\n //height: ", ";\n height: ", ";\n overflow-y: auto;\n scrollbar-width: none;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-width: thin;\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
59884
+ var ChatDetails = styled.div(_templateObject3$X || (_templateObject3$X = _taggedTemplateLiteralLoose(["\n //position: relative;\n width: ", ";\n //height: ", ";\n height: ", ";\n overflow-y: auto;\n scrollbar-width: thin;\n scrollbar-color: transparent transparent;\n overscroll-behavior: none;\n\n @supports (overflow: overlay) {\n overflow-y: overlay;\n }\n\n &::-webkit-scrollbar {\n width: 8px;\n background: transparent;\n }\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n &.show-scrollbar::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 4px;\n }\n &.show-scrollbar::-webkit-scrollbar-track {\n background: transparent;\n }\n\n &.show-scrollbar {\n scrollbar-color: ", " transparent;\n }\n"])), function (props) {
59866
59885
  return props.size === 'small' ? '300px' : props.size === 'medium' ? '350px' : '400px';
59867
59886
  }, function (props) {
59868
59887
  return props.height ? "calc(100vh - " + props.heightOffset + "px)" : '100vh';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sceyt-chat-react-uikit",
3
- "version": "1.8.9-beta.18",
3
+ "version": "1.8.9-beta.19",
4
4
  "description": "Interactive React UI Components for Sceyt Chat.",
5
5
  "author": "Sceyt",
6
6
  "license": "MIT",