sceyt-chat-react-uikit 1.8.9-beta.17 → 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.
- package/index.js +66 -20
- package/index.modern.js +66 -20
- 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:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
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;
|
|
@@ -46854,6 +46854,10 @@ function useChatController(_ref5) {
|
|
|
46854
46854
|
var highlightTimeoutRef = React.useRef(null);
|
|
46855
46855
|
var unreadRestoreCompletedRef = React.useRef(false);
|
|
46856
46856
|
var previousUnreadScrollToRef = React.useRef(unreadScrollTo);
|
|
46857
|
+
var unreadScrollToRef = React.useRef(unreadScrollTo);
|
|
46858
|
+
var tabIsActiveRef = React.useRef(tabIsActive);
|
|
46859
|
+
var hasNextMessagesRef = React.useRef(hasNextMessages);
|
|
46860
|
+
var needsVisibleUnreadCheckRef = React.useRef(false);
|
|
46857
46861
|
var historyLoadArmedRef = React.useRef(true);
|
|
46858
46862
|
var latestLoadArmedRef = React.useRef(true);
|
|
46859
46863
|
var pendingNewestCountRef = React.useRef(0);
|
|
@@ -46965,6 +46969,9 @@ function useChatController(_ref5) {
|
|
|
46965
46969
|
visibleMessagesMapRef.current = visibleMessagesMap;
|
|
46966
46970
|
channelRef.current = channel;
|
|
46967
46971
|
connectionStatusRef.current = connectionStatus;
|
|
46972
|
+
unreadScrollToRef.current = unreadScrollTo;
|
|
46973
|
+
tabIsActiveRef.current = tabIsActive;
|
|
46974
|
+
hasNextMessagesRef.current = hasNext;
|
|
46968
46975
|
});
|
|
46969
46976
|
var oldestConfirmedMessage = getFirstConfirmedMessage(messages);
|
|
46970
46977
|
var newestConfirmedMessage = getLastConfirmedMessage(messages);
|
|
@@ -46998,6 +47005,7 @@ function useChatController(_ref5) {
|
|
|
46998
47005
|
});
|
|
46999
47006
|
}, [channel.id, messages]);
|
|
47000
47007
|
var hasNext = hasNextMessages || (newestConfirmedMessage ? hasNextContiguousInMap(channel.id, newestConfirmedMessage) : false) || (newestConfirmedMessageId && (_channel$lastMessage = channel.lastMessage) !== null && _channel$lastMessage !== void 0 && _channel$lastMessage.id ? compareMessageIds(channel.lastMessage.id, newestConfirmedMessageId) > 0 : false) || hiddenPendingTailExists;
|
|
47008
|
+
hasNextMessagesRef.current = hasNext;
|
|
47001
47009
|
var isScrollInteractionActive = React.useCallback(function () {
|
|
47002
47010
|
return Date.now() - lastScrollActivityAtRef.current < SCROLL_IDLE_MS;
|
|
47003
47011
|
}, []);
|
|
@@ -47102,21 +47110,32 @@ function useChatController(_ref5) {
|
|
|
47102
47110
|
}, lockDuration);
|
|
47103
47111
|
}, [clearJumpScrollingLock]);
|
|
47104
47112
|
var queueVisibleUnreadCheck = React.useCallback(function () {
|
|
47105
|
-
if (pendingVisibleUnreadFrameRef.current !== null
|
|
47113
|
+
if (pendingVisibleUnreadFrameRef.current !== null) {
|
|
47114
|
+
return;
|
|
47115
|
+
}
|
|
47116
|
+
if (unreadScrollToRef.current || !tabIsActiveRef.current || connectionStatusRef.current !== CONNECTION_STATUS.CONNECTED) {
|
|
47117
|
+
needsVisibleUnreadCheckRef.current = true;
|
|
47106
47118
|
return;
|
|
47107
47119
|
}
|
|
47120
|
+
var scheduledChannelId = channel.id;
|
|
47108
47121
|
pendingVisibleUnreadFrameRef.current = requestAnimationFrame(function () {
|
|
47109
47122
|
pendingVisibleUnreadFrameRef.current = null;
|
|
47123
|
+
var currentChannel = channelRef.current;
|
|
47124
|
+
if (currentChannel.id !== scheduledChannelId || unreadScrollToRef.current || !tabIsActiveRef.current || connectionStatusRef.current !== CONNECTION_STATUS.CONNECTED) {
|
|
47125
|
+
needsVisibleUnreadCheckRef.current = true;
|
|
47126
|
+
return;
|
|
47127
|
+
}
|
|
47110
47128
|
var container = scrollRef.current;
|
|
47111
47129
|
if (!container) {
|
|
47112
47130
|
return;
|
|
47113
47131
|
}
|
|
47114
|
-
var
|
|
47132
|
+
var currentMessages = messagesRef.current;
|
|
47133
|
+
var unreadStartIndex = getUnreadTrackingStartIndex(currentMessages);
|
|
47115
47134
|
if (unreadStartIndex < 0) {
|
|
47116
47135
|
return;
|
|
47117
47136
|
}
|
|
47118
|
-
var candidateUnreadMessages =
|
|
47119
|
-
var pinnedToLatestWithoutMorePages = !
|
|
47137
|
+
var candidateUnreadMessages = currentMessages.slice(unreadStartIndex);
|
|
47138
|
+
var pinnedToLatestWithoutMorePages = !hasNextMessagesRef.current && isPinnedToLatest(container);
|
|
47120
47139
|
var containerRect = pinnedToLatestWithoutMorePages ? null : container.getBoundingClientRect();
|
|
47121
47140
|
var visibleUnreadMessages = candidateUnreadMessages.map(function (message) {
|
|
47122
47141
|
if (visibleUnreadReportedRef.current.has(message.id)) {
|
|
@@ -47137,16 +47156,17 @@ function useChatController(_ref5) {
|
|
|
47137
47156
|
var ids = visibleUnreadMessages.filter(isUnreadIncomingMessage).map(function (message) {
|
|
47138
47157
|
return message.id;
|
|
47139
47158
|
});
|
|
47140
|
-
if (!ids.length || !
|
|
47159
|
+
if (!ids.length || !currentChannel.id || !currentChannel.newMessageCount) {
|
|
47141
47160
|
return;
|
|
47142
47161
|
}
|
|
47143
47162
|
ids.forEach(function (id) {
|
|
47144
47163
|
visibleUnreadReportedRef.current.add(id);
|
|
47145
47164
|
});
|
|
47165
|
+
needsVisibleUnreadCheckRef.current = false;
|
|
47146
47166
|
registerLocallyReadUnreadMessages(ids.length);
|
|
47147
|
-
dispatch(markMessagesAsReadAC(
|
|
47167
|
+
dispatch(markMessagesAsReadAC(currentChannel.id, ids));
|
|
47148
47168
|
});
|
|
47149
|
-
}, [channel.id,
|
|
47169
|
+
}, [channel.id, dispatch, registerLocallyReadUnreadMessages]);
|
|
47150
47170
|
var timelineItems = React.useMemo(function () {
|
|
47151
47171
|
var unreadStartIndex = getUnreadDividerIndex(messages, unreadMessageId);
|
|
47152
47172
|
return messages.flatMap(function (message, index) {
|
|
@@ -48574,8 +48594,15 @@ function useChatController(_ref5) {
|
|
|
48574
48594
|
if (!previousUnreadScrollTo || unreadScrollTo) {
|
|
48575
48595
|
return;
|
|
48576
48596
|
}
|
|
48597
|
+
needsVisibleUnreadCheckRef.current = true;
|
|
48577
48598
|
queueVisibleUnreadCheck();
|
|
48578
48599
|
}, [queueVisibleUnreadCheck, unreadScrollTo]);
|
|
48600
|
+
React.useEffect(function () {
|
|
48601
|
+
if (!needsVisibleUnreadCheckRef.current || unreadScrollTo || !tabIsActive || connectionStatus !== CONNECTION_STATUS.CONNECTED) {
|
|
48602
|
+
return;
|
|
48603
|
+
}
|
|
48604
|
+
queueVisibleUnreadCheck();
|
|
48605
|
+
}, [connectionStatus, queueVisibleUnreadCheck, tabIsActive, unreadScrollTo]);
|
|
48579
48606
|
React.useEffect(function () {
|
|
48580
48607
|
return function () {
|
|
48581
48608
|
var _pendingWindowLoadRef3, _pendingEdgeLoadRefs$5, _pendingEdgeLoadRefs$6;
|
|
@@ -49083,6 +49110,9 @@ var MessageList = function MessageList(_ref) {
|
|
|
49083
49110
|
var _useState4 = React.useState(''),
|
|
49084
49111
|
stickyDate = _useState4[0],
|
|
49085
49112
|
setStickyDate = _useState4[1];
|
|
49113
|
+
var _useState5 = React.useState(false),
|
|
49114
|
+
isScrolling = _useState5[0],
|
|
49115
|
+
setIsScrolling = _useState5[1];
|
|
49086
49116
|
var markerBatcherRef = React__default.useRef(null);
|
|
49087
49117
|
if (!markerBatcherRef.current) {
|
|
49088
49118
|
markerBatcherRef.current = createMessageMarkerBatcher({
|
|
@@ -49571,10 +49601,16 @@ var MessageList = function MessageList(_ref) {
|
|
|
49571
49601
|
"$color": iconInactive
|
|
49572
49602
|
}))), /*#__PURE__*/React__default.createElement(Container$j, {
|
|
49573
49603
|
id: 'scrollableDiv',
|
|
49574
|
-
className: 'show-scrollbar',
|
|
49604
|
+
className: isScrolling ? 'show-scrollbar' : '',
|
|
49575
49605
|
ref: scrollRef,
|
|
49576
49606
|
stopScrolling: stopScrolling,
|
|
49577
49607
|
onDragEnter: handleDragIn,
|
|
49608
|
+
onMouseEnter: function onMouseEnter() {
|
|
49609
|
+
return setIsScrolling(true);
|
|
49610
|
+
},
|
|
49611
|
+
onMouseLeave: function onMouseLeave() {
|
|
49612
|
+
return setIsScrolling(false);
|
|
49613
|
+
},
|
|
49578
49614
|
backgroundColor: backgroundColor || themeBackgroundColor,
|
|
49579
49615
|
thumbColor: surface2
|
|
49580
49616
|
}, messages.length && messages.length > 0 ? (/*#__PURE__*/React__default.createElement(MessagesBox, {
|
|
@@ -49670,7 +49706,7 @@ var MessageList = function MessageList(_ref) {
|
|
|
49670
49706
|
}
|
|
49671
49707
|
})));
|
|
49672
49708
|
};
|
|
49673
|
-
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:
|
|
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) {
|
|
49674
49710
|
return props.backgroundColor;
|
|
49675
49711
|
}, function (props) {
|
|
49676
49712
|
return props.thumbColor;
|
|
@@ -53193,7 +53229,7 @@ var CustomTextArea = styled__default.textarea(_templateObject2$Q || (_templateOb
|
|
|
53193
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) {
|
|
53194
53230
|
return props.color;
|
|
53195
53231
|
});
|
|
53196
|
-
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:
|
|
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) {
|
|
53197
53233
|
return props.thumbColor;
|
|
53198
53234
|
}, function (props) {
|
|
53199
53235
|
return props.thumbColor;
|
|
@@ -55419,7 +55455,7 @@ var MessageInputWrapper = styled__default.div(_templateObject12$7 || (_templateO
|
|
|
55419
55455
|
}, function (props) {
|
|
55420
55456
|
return props.borderRadius || '18px';
|
|
55421
55457
|
});
|
|
55422
|
-
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:
|
|
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) {
|
|
55423
55459
|
return props.borderRadius;
|
|
55424
55460
|
}, function (props) {
|
|
55425
55461
|
return props.backgroundColor;
|
|
@@ -56273,7 +56309,7 @@ var GroupsInCommonPopup = function GroupsInCommonPopup(_ref2) {
|
|
|
56273
56309
|
color: textSecondary
|
|
56274
56310
|
}, "Loading more...")))));
|
|
56275
56311
|
};
|
|
56276
|
-
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:
|
|
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) {
|
|
56277
56313
|
return props.thumbColor;
|
|
56278
56314
|
}, function (props) {
|
|
56279
56315
|
return props.thumbColor;
|
|
@@ -59603,6 +59639,16 @@ var Details = function Details(_ref) {
|
|
|
59603
59639
|
if (detailsContainer) {
|
|
59604
59640
|
setChannelDetailsHeight(detailsContainer.offsetHeight);
|
|
59605
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
|
+
};
|
|
59606
59652
|
}, []);
|
|
59607
59653
|
React.useEffect(function () {
|
|
59608
59654
|
return function () {
|
|
@@ -59855,7 +59901,7 @@ var Container$v = styled__default.div(_templateObject$1a || (_templateObject$1a
|
|
|
59855
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) {
|
|
59856
59902
|
return props.borderColor;
|
|
59857
59903
|
});
|
|
59858
|
-
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:
|
|
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) {
|
|
59859
59905
|
return props.size === 'small' ? '300px' : props.size === 'medium' ? '350px' : '400px';
|
|
59860
59906
|
}, function (props) {
|
|
59861
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:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
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;
|
|
@@ -46834,6 +46834,10 @@ function useChatController(_ref5) {
|
|
|
46834
46834
|
var highlightTimeoutRef = useRef(null);
|
|
46835
46835
|
var unreadRestoreCompletedRef = useRef(false);
|
|
46836
46836
|
var previousUnreadScrollToRef = useRef(unreadScrollTo);
|
|
46837
|
+
var unreadScrollToRef = useRef(unreadScrollTo);
|
|
46838
|
+
var tabIsActiveRef = useRef(tabIsActive);
|
|
46839
|
+
var hasNextMessagesRef = useRef(hasNextMessages);
|
|
46840
|
+
var needsVisibleUnreadCheckRef = useRef(false);
|
|
46837
46841
|
var historyLoadArmedRef = useRef(true);
|
|
46838
46842
|
var latestLoadArmedRef = useRef(true);
|
|
46839
46843
|
var pendingNewestCountRef = useRef(0);
|
|
@@ -46945,6 +46949,9 @@ function useChatController(_ref5) {
|
|
|
46945
46949
|
visibleMessagesMapRef.current = visibleMessagesMap;
|
|
46946
46950
|
channelRef.current = channel;
|
|
46947
46951
|
connectionStatusRef.current = connectionStatus;
|
|
46952
|
+
unreadScrollToRef.current = unreadScrollTo;
|
|
46953
|
+
tabIsActiveRef.current = tabIsActive;
|
|
46954
|
+
hasNextMessagesRef.current = hasNext;
|
|
46948
46955
|
});
|
|
46949
46956
|
var oldestConfirmedMessage = getFirstConfirmedMessage(messages);
|
|
46950
46957
|
var newestConfirmedMessage = getLastConfirmedMessage(messages);
|
|
@@ -46978,6 +46985,7 @@ function useChatController(_ref5) {
|
|
|
46978
46985
|
});
|
|
46979
46986
|
}, [channel.id, messages]);
|
|
46980
46987
|
var hasNext = hasNextMessages || (newestConfirmedMessage ? hasNextContiguousInMap(channel.id, newestConfirmedMessage) : false) || (newestConfirmedMessageId && (_channel$lastMessage = channel.lastMessage) !== null && _channel$lastMessage !== void 0 && _channel$lastMessage.id ? compareMessageIds(channel.lastMessage.id, newestConfirmedMessageId) > 0 : false) || hiddenPendingTailExists;
|
|
46988
|
+
hasNextMessagesRef.current = hasNext;
|
|
46981
46989
|
var isScrollInteractionActive = useCallback(function () {
|
|
46982
46990
|
return Date.now() - lastScrollActivityAtRef.current < SCROLL_IDLE_MS;
|
|
46983
46991
|
}, []);
|
|
@@ -47082,21 +47090,32 @@ function useChatController(_ref5) {
|
|
|
47082
47090
|
}, lockDuration);
|
|
47083
47091
|
}, [clearJumpScrollingLock]);
|
|
47084
47092
|
var queueVisibleUnreadCheck = useCallback(function () {
|
|
47085
|
-
if (pendingVisibleUnreadFrameRef.current !== null
|
|
47093
|
+
if (pendingVisibleUnreadFrameRef.current !== null) {
|
|
47094
|
+
return;
|
|
47095
|
+
}
|
|
47096
|
+
if (unreadScrollToRef.current || !tabIsActiveRef.current || connectionStatusRef.current !== CONNECTION_STATUS.CONNECTED) {
|
|
47097
|
+
needsVisibleUnreadCheckRef.current = true;
|
|
47086
47098
|
return;
|
|
47087
47099
|
}
|
|
47100
|
+
var scheduledChannelId = channel.id;
|
|
47088
47101
|
pendingVisibleUnreadFrameRef.current = requestAnimationFrame(function () {
|
|
47089
47102
|
pendingVisibleUnreadFrameRef.current = null;
|
|
47103
|
+
var currentChannel = channelRef.current;
|
|
47104
|
+
if (currentChannel.id !== scheduledChannelId || unreadScrollToRef.current || !tabIsActiveRef.current || connectionStatusRef.current !== CONNECTION_STATUS.CONNECTED) {
|
|
47105
|
+
needsVisibleUnreadCheckRef.current = true;
|
|
47106
|
+
return;
|
|
47107
|
+
}
|
|
47090
47108
|
var container = scrollRef.current;
|
|
47091
47109
|
if (!container) {
|
|
47092
47110
|
return;
|
|
47093
47111
|
}
|
|
47094
|
-
var
|
|
47112
|
+
var currentMessages = messagesRef.current;
|
|
47113
|
+
var unreadStartIndex = getUnreadTrackingStartIndex(currentMessages);
|
|
47095
47114
|
if (unreadStartIndex < 0) {
|
|
47096
47115
|
return;
|
|
47097
47116
|
}
|
|
47098
|
-
var candidateUnreadMessages =
|
|
47099
|
-
var pinnedToLatestWithoutMorePages = !
|
|
47117
|
+
var candidateUnreadMessages = currentMessages.slice(unreadStartIndex);
|
|
47118
|
+
var pinnedToLatestWithoutMorePages = !hasNextMessagesRef.current && isPinnedToLatest(container);
|
|
47100
47119
|
var containerRect = pinnedToLatestWithoutMorePages ? null : container.getBoundingClientRect();
|
|
47101
47120
|
var visibleUnreadMessages = candidateUnreadMessages.map(function (message) {
|
|
47102
47121
|
if (visibleUnreadReportedRef.current.has(message.id)) {
|
|
@@ -47117,16 +47136,17 @@ function useChatController(_ref5) {
|
|
|
47117
47136
|
var ids = visibleUnreadMessages.filter(isUnreadIncomingMessage).map(function (message) {
|
|
47118
47137
|
return message.id;
|
|
47119
47138
|
});
|
|
47120
|
-
if (!ids.length || !
|
|
47139
|
+
if (!ids.length || !currentChannel.id || !currentChannel.newMessageCount) {
|
|
47121
47140
|
return;
|
|
47122
47141
|
}
|
|
47123
47142
|
ids.forEach(function (id) {
|
|
47124
47143
|
visibleUnreadReportedRef.current.add(id);
|
|
47125
47144
|
});
|
|
47145
|
+
needsVisibleUnreadCheckRef.current = false;
|
|
47126
47146
|
registerLocallyReadUnreadMessages(ids.length);
|
|
47127
|
-
dispatch(markMessagesAsReadAC(
|
|
47147
|
+
dispatch(markMessagesAsReadAC(currentChannel.id, ids));
|
|
47128
47148
|
});
|
|
47129
|
-
}, [channel.id,
|
|
47149
|
+
}, [channel.id, dispatch, registerLocallyReadUnreadMessages]);
|
|
47130
47150
|
var timelineItems = useMemo(function () {
|
|
47131
47151
|
var unreadStartIndex = getUnreadDividerIndex(messages, unreadMessageId);
|
|
47132
47152
|
return messages.flatMap(function (message, index) {
|
|
@@ -48554,8 +48574,15 @@ function useChatController(_ref5) {
|
|
|
48554
48574
|
if (!previousUnreadScrollTo || unreadScrollTo) {
|
|
48555
48575
|
return;
|
|
48556
48576
|
}
|
|
48577
|
+
needsVisibleUnreadCheckRef.current = true;
|
|
48557
48578
|
queueVisibleUnreadCheck();
|
|
48558
48579
|
}, [queueVisibleUnreadCheck, unreadScrollTo]);
|
|
48580
|
+
useEffect(function () {
|
|
48581
|
+
if (!needsVisibleUnreadCheckRef.current || unreadScrollTo || !tabIsActive || connectionStatus !== CONNECTION_STATUS.CONNECTED) {
|
|
48582
|
+
return;
|
|
48583
|
+
}
|
|
48584
|
+
queueVisibleUnreadCheck();
|
|
48585
|
+
}, [connectionStatus, queueVisibleUnreadCheck, tabIsActive, unreadScrollTo]);
|
|
48559
48586
|
useEffect(function () {
|
|
48560
48587
|
return function () {
|
|
48561
48588
|
var _pendingWindowLoadRef3, _pendingEdgeLoadRefs$5, _pendingEdgeLoadRefs$6;
|
|
@@ -49063,6 +49090,9 @@ var MessageList = function MessageList(_ref) {
|
|
|
49063
49090
|
var _useState4 = useState(''),
|
|
49064
49091
|
stickyDate = _useState4[0],
|
|
49065
49092
|
setStickyDate = _useState4[1];
|
|
49093
|
+
var _useState5 = useState(false),
|
|
49094
|
+
isScrolling = _useState5[0],
|
|
49095
|
+
setIsScrolling = _useState5[1];
|
|
49066
49096
|
var markerBatcherRef = React__default.useRef(null);
|
|
49067
49097
|
if (!markerBatcherRef.current) {
|
|
49068
49098
|
markerBatcherRef.current = createMessageMarkerBatcher({
|
|
@@ -49551,10 +49581,16 @@ var MessageList = function MessageList(_ref) {
|
|
|
49551
49581
|
"$color": iconInactive
|
|
49552
49582
|
}))), /*#__PURE__*/React__default.createElement(Container$j, {
|
|
49553
49583
|
id: 'scrollableDiv',
|
|
49554
|
-
className: 'show-scrollbar',
|
|
49584
|
+
className: isScrolling ? 'show-scrollbar' : '',
|
|
49555
49585
|
ref: scrollRef,
|
|
49556
49586
|
stopScrolling: stopScrolling,
|
|
49557
49587
|
onDragEnter: handleDragIn,
|
|
49588
|
+
onMouseEnter: function onMouseEnter() {
|
|
49589
|
+
return setIsScrolling(true);
|
|
49590
|
+
},
|
|
49591
|
+
onMouseLeave: function onMouseLeave() {
|
|
49592
|
+
return setIsScrolling(false);
|
|
49593
|
+
},
|
|
49558
49594
|
backgroundColor: backgroundColor || themeBackgroundColor,
|
|
49559
49595
|
thumbColor: surface2
|
|
49560
49596
|
}, messages.length && messages.length > 0 ? (/*#__PURE__*/React__default.createElement(MessagesBox, {
|
|
@@ -49650,7 +49686,7 @@ var MessageList = function MessageList(_ref) {
|
|
|
49650
49686
|
}
|
|
49651
49687
|
})));
|
|
49652
49688
|
};
|
|
49653
|
-
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:
|
|
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) {
|
|
49654
49690
|
return props.backgroundColor;
|
|
49655
49691
|
}, function (props) {
|
|
49656
49692
|
return props.thumbColor;
|
|
@@ -53173,7 +53209,7 @@ var CustomTextArea = styled.textarea(_templateObject2$Q || (_templateObject2$Q =
|
|
|
53173
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) {
|
|
53174
53210
|
return props.color;
|
|
53175
53211
|
});
|
|
53176
|
-
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:
|
|
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) {
|
|
53177
53213
|
return props.thumbColor;
|
|
53178
53214
|
}, function (props) {
|
|
53179
53215
|
return props.thumbColor;
|
|
@@ -55399,7 +55435,7 @@ var MessageInputWrapper = styled.div(_templateObject12$7 || (_templateObject12$7
|
|
|
55399
55435
|
}, function (props) {
|
|
55400
55436
|
return props.borderRadius || '18px';
|
|
55401
55437
|
});
|
|
55402
|
-
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:
|
|
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) {
|
|
55403
55439
|
return props.borderRadius;
|
|
55404
55440
|
}, function (props) {
|
|
55405
55441
|
return props.backgroundColor;
|
|
@@ -56253,7 +56289,7 @@ var GroupsInCommonPopup = function GroupsInCommonPopup(_ref2) {
|
|
|
56253
56289
|
color: textSecondary
|
|
56254
56290
|
}, "Loading more...")))));
|
|
56255
56291
|
};
|
|
56256
|
-
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:
|
|
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) {
|
|
56257
56293
|
return props.thumbColor;
|
|
56258
56294
|
}, function (props) {
|
|
56259
56295
|
return props.thumbColor;
|
|
@@ -59583,6 +59619,16 @@ var Details = function Details(_ref) {
|
|
|
59583
59619
|
if (detailsContainer) {
|
|
59584
59620
|
setChannelDetailsHeight(detailsContainer.offsetHeight);
|
|
59585
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
|
+
};
|
|
59586
59632
|
}, []);
|
|
59587
59633
|
useEffect(function () {
|
|
59588
59634
|
return function () {
|
|
@@ -59835,7 +59881,7 @@ var Container$v = styled.div(_templateObject$1a || (_templateObject$1a = _tagged
|
|
|
59835
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) {
|
|
59836
59882
|
return props.borderColor;
|
|
59837
59883
|
});
|
|
59838
|
-
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:
|
|
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) {
|
|
59839
59885
|
return props.size === 'small' ? '300px' : props.size === 'medium' ? '350px' : '400px';
|
|
59840
59886
|
}, function (props) {
|
|
59841
59887
|
return props.height ? "calc(100vh - " + props.heightOffset + "px)" : '100vh';
|