sceyt-chat-react-uikit 1.6.7-beta.17 → 1.6.7-beta.18

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 +16 -20
  2. package/index.modern.js +16 -20
  3. package/package.json +1 -1
package/index.js CHANGED
@@ -19242,7 +19242,7 @@ var DeletedAvatarWrapper = styled__default(SvgDeletedUserAvatar)(_templateObject
19242
19242
  return props.color;
19243
19243
  });
19244
19244
 
19245
- var _templateObject$4, _templateObject2$4, _templateObject3$3, _templateObject4$3, _templateObject5$2, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject0$1, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1;
19245
+ var _templateObject$4, _templateObject2$4, _templateObject3$3, _templateObject4$3, _templateObject5$2, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject0$1, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1;
19246
19246
  var ChannelMessageText = function ChannelMessageText(_ref) {
19247
19247
  var isTypingOrRecording = _ref.isTypingOrRecording,
19248
19248
  textPrimary = _ref.textPrimary,
@@ -19257,7 +19257,7 @@ var ChannelMessageText = function ChannelMessageText(_ref) {
19257
19257
  typingOrRecording = _ref.typingOrRecording,
19258
19258
  channel = _ref.channel,
19259
19259
  isDirectChannel = _ref.isDirectChannel;
19260
- return /*#__PURE__*/React__default.createElement("div", null, isTypingOrRecording && (/*#__PURE__*/React__default.createElement(TypingIndicator, null, !isDirectChannel && /*#__PURE__*/React__default.createElement(Points, {
19260
+ return /*#__PURE__*/React__default.createElement(MessageTextContainer, null, isTypingOrRecording && (/*#__PURE__*/React__default.createElement(TypingIndicator, null, !isDirectChannel && /*#__PURE__*/React__default.createElement(Points, {
19261
19261
  color: textPrimary
19262
19262
  }, ":"), typingOrRecording.isTyping ? 'typing' : 'recording', "...")), !isTypingOrRecording && (draftMessageText ? (/*#__PURE__*/React__default.createElement(DraftMessageText, {
19263
19263
  color: textSecondary
@@ -19614,6 +19614,7 @@ var UnreadCount = styled__default.span(_templateObject17$1 || (_templateObject17
19614
19614
  var PinnedIconWrapper = styled__default.span(_templateObject18$1 || (_templateObject18$1 = _taggedTemplateLiteralLoose(["\n & > svg {\n color: ", ";\n }\n"])), function (props) {
19615
19615
  return props.color;
19616
19616
  });
19617
+ var MessageTextContainer = styled__default.div(_templateObject19$1 || (_templateObject19$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-end;\n gap: 4px;\n"])));
19617
19618
 
19618
19619
  var _templateObject$5, _templateObject2$5;
19619
19620
  var SearchInputContainer = styled__default.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n max-width: ", ";\n box-sizing: border-box;\n padding: ", ";\n\n & ", " {\n ", ";\n }\n"])), function (props) {
@@ -24280,8 +24281,7 @@ function ReactionsPopup(_ref) {
24280
24281
  backgroundSections = _useColor[THEME_COLORS.BACKGROUND_SECTIONS],
24281
24282
  textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
24282
24283
  surface1 = _useColor[THEME_COLORS.SURFACE_1],
24283
- backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED],
24284
- surface2 = _useColor[THEME_COLORS.SURFACE_2];
24284
+ backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED];
24285
24285
  var popupRef = React.useRef(null);
24286
24286
  var scoresRef = React.useRef(null);
24287
24287
  var reactions = reactRedux.useSelector(reactionsListSelector, reactRedux.shallowEqual);
@@ -24395,8 +24395,7 @@ function ReactionsPopup(_ref) {
24395
24395
  },
24396
24396
  onMouseLeave: function onMouseLeave() {
24397
24397
  return setIsScrolling(false);
24398
- },
24399
- thumbColor: surface2
24398
+ }
24400
24399
  }, /*#__PURE__*/React__default.createElement(ReactionScoresList, {
24401
24400
  borderBottom: reactionsDetailsPopupHeaderItemsStyle !== 'bubbles'
24402
24401
  }, /*#__PURE__*/React__default.createElement(ReactionScoreItem, {
@@ -24432,8 +24431,7 @@ function ReactionsPopup(_ref) {
24432
24431
  },
24433
24432
  onMouseLeave: function onMouseLeave() {
24434
24433
  return setIsScrolling(false);
24435
- },
24436
- thumbColor: surface2
24434
+ }
24437
24435
  }, reactions.map(function (reaction) {
24438
24436
  return /*#__PURE__*/React__default.createElement(ReactionItem$1, {
24439
24437
  key: reaction.id,
@@ -24492,22 +24490,18 @@ var Container$d = styled__default.div(_templateObject$q || (_templateObject$q =
24492
24490
  }, function (props) {
24493
24491
  return props.backgroundColor;
24494
24492
  });
24495
- var UserNamePresence$1 = styled__default.div(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteralLoose(["\n width: 100%;\n margin-left: 12px;\n"])));
24496
- var MemberName$1 = styled__default.h3(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose(["\n margin: 0;\n max-width: calc(100% - 47px);\n font-weight: 500;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n color: ", ";\n & > span {\n color: ", ";\n }\n"])), function (props) {
24493
+ var UserNamePresence$1 = styled__default.div(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteralLoose(["\n width: calc(100% - 70px);\n margin-left: 12px;\n"])));
24494
+ var MemberName$1 = styled__default.h3(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose(["\n margin: 0;\n max-width: calc(100% - 7px);\n font-weight: 500;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n color: ", ";\n & > span {\n color: ", ";\n }\n"])), function (props) {
24497
24495
  return props.color;
24498
24496
  }, function (props) {
24499
24497
  return props.color;
24500
24498
  });
24501
- var ReactionsList = styled__default.ul(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n overflow: ", ";\n overflow-x: hidden;\n list-style: none;\n transition: all 0.2s;\n height: ", ";\n calc(100% - 57px);\n\n &.show-scrollbar {\n overflow-x: hidden;\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) {
24499
+ var ReactionsList = styled__default.ul(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n overflow: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n list-style: none;\n transition: all 0.2s;\n height: ", ";\n\n &::-webkit-scrollbar {\n display: none;\n }\n &::-webkit-scrollbar-thumb {\n display: none;\n }\n &::-webkit-scrollbar-track {\n display: none;\n }\n"])), function (props) {
24502
24500
  return !props.popupHeight && 'hidden';
24503
24501
  }, function (props) {
24504
24502
  return "calc(100% - " + (props.scoresHeight || 57) + "px)";
24505
- }, function (props) {
24506
- return props.thumbColor;
24507
- });
24508
- var ReactionScoresCont = styled__default.div(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n max-width: 100%;\n overflow-y: auto;\n &.show-scrollbar {\n overflow-x: hidden;\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) {
24509
- return props.thumbColor;
24510
24503
  });
24504
+ var ReactionScoresCont = styled__default.div(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n max-width: 100%;\n overflow: auto;\n overflow-y: hidden;\n\n &::-webkit-scrollbar {\n display: none;\n }\n &::-webkit-scrollbar-thumb {\n display: none;\n }\n &::-webkit-scrollbar-track {\n display: none;\n }\n"])));
24511
24505
  var ReactionScoresList = styled__default.div(_templateObject6$a || (_templateObject6$a = _taggedTemplateLiteralLoose(["\n display: flex;\n padding: 2px 8px 0;\n"])));
24512
24506
  var TabKey = styled__default.span(_templateObject7$9 || (_templateObject7$9 = _taggedTemplateLiteralLoose([""])));
24513
24507
  var ReactionScoreItem = styled__default.div(_templateObject8$9 || (_templateObject8$9 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n white-space: nowrap;\n padding: ", ";\n font-weight: 500;\n font-size: 13px;\n color: ", ";\n margin-bottom: -1px;\n cursor: pointer;\n & > span {\n position: relative;\n padding: ", ";\n border-radius: 16px;\n height: 30px;\n box-sizing: border-box;\n font-family: Inter, sans-serif;\n font-style: normal;\n font-weight: 600;\n font-size: 14px;\n line-height: ", ";\n background-color: ", ";\n color: ", ";\n ", "\n\n & ", " {\n font-family:\n apple color emoji,\n segoe ui emoji,\n noto color emoji,\n android emoji,\n emojisymbols,\n emojione mozilla,\n twemoji mozilla,\n segoe ui symbol;\n margin-right: 4px;\n font-size: 15px;\n }\n }\n"])), function (props) {
@@ -33822,7 +33816,7 @@ var RecordingAnimation = function RecordingAnimation(_ref2) {
33822
33816
  }));
33823
33817
  };
33824
33818
 
33825
- var _templateObject$I, _templateObject2$D, _templateObject3$w, _templateObject4$r, _templateObject5$n, _templateObject6$j, _templateObject7$h, _templateObject8$f, _templateObject9$d, _templateObject0$c, _templateObject1$8, _templateObject10$5, _templateObject11$5, _templateObject12$4, _templateObject13$3, _templateObject14$2, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1, _templateObject27$1, _templateObject28$1, _templateObject29$1, _templateObject30$1, _templateObject31$1, _templateObject32$1, _templateObject33$1, _templateObject34$1;
33819
+ var _templateObject$I, _templateObject2$D, _templateObject3$w, _templateObject4$r, _templateObject5$n, _templateObject6$j, _templateObject7$h, _templateObject8$f, _templateObject9$d, _templateObject0$c, _templateObject1$8, _templateObject10$5, _templateObject11$5, _templateObject12$4, _templateObject13$3, _templateObject14$2, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$2, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1, _templateObject27$1, _templateObject28$1, _templateObject29$1, _templateObject30$1, _templateObject31$1, _templateObject32$1, _templateObject33$1, _templateObject34$1;
33826
33820
  function AutoFocusPlugin(_ref) {
33827
33821
  var messageForReply = _ref.messageForReply;
33828
33822
  var _useLexicalComposerCo = LexicalComposerContext.useLexicalComposerContext(),
@@ -35471,7 +35465,7 @@ var AudioCont = styled__default.div(_templateObject15$2 || (_templateObject15$2
35471
35465
  var ChosenAttachments = styled__default.div(_templateObject16$2 || (_templateObject16$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: 16px 16px 14px;\n overflow-x: auto;\n\n & ", " {\n width: 100%;\n height: 100%;\n border-radius: 4px;\n object-fit: cover;\n }\n\n & ", " {\n width: 240px;\n padding: 5px 12px;\n border-radius: 8px;\n height: 50px;\n }\n"])), AttachmentImg$1, AttachmentFile$1);
35472
35466
  var TypingIndicator$1 = styled__default.div(_templateObject17$2 || (_templateObject17$2 = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 100%;\n left: 16px;\n"])));
35473
35467
  var TypingIndicatorCont = styled__default.div(_templateObject18$2 || (_templateObject18$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-bottom: 12px;\n gap: 4px;\n"])));
35474
- var TypingFrom = styled__default.h5(_templateObject19$1 || (_templateObject19$1 = _taggedTemplateLiteralLoose(["\n margin: 0 4px 0 0;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n letter-spacing: -0.2px;\n color: ", ";\n"])), function (props) {
35468
+ var TypingFrom = styled__default.h5(_templateObject19$2 || (_templateObject19$2 = _taggedTemplateLiteralLoose(["\n margin: 0 4px 0 0;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n letter-spacing: -0.2px;\n color: ", ";\n"])), function (props) {
35475
35469
  return props.color;
35476
35470
  });
35477
35471
  var sizeAnimation = styled.keyframes(_templateObject20$1 || (_templateObject20$1 = _taggedTemplateLiteralLoose(["\n 0% {\n width: 2px;\n height: 2px;\n opacity: 0.4;\n }\n 50% {\n width: 2px;\n height: 2px;\n opacity: 0.4;\n }\n 100% {\n width: 6px;\n height: 6px;\n opacity: 1;\n }\n"])));
@@ -37243,7 +37237,9 @@ var VoiceItem = function VoiceItem(_ref) {
37243
37237
  type: 'audio/mpeg'
37244
37238
  })));
37245
37239
  };
37246
- var FileIconCont$1 = styled__default.span(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: inline-flex;\n circle {\n fill: ", ";\n }\n"])), function (props) {
37240
+ var FileIconCont$1 = styled__default.span(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: inline-flex;\n fill: ", ";\n rect {\n fill: ", ";\n }\n"])), function (props) {
37241
+ return props.fill || 'transparent';
37242
+ }, function (props) {
37247
37243
  return props.fill || 'transparent';
37248
37244
  });
37249
37245
  var FileHoverIconCont$1 = styled__default.span(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: none;\n fill: ", ";\n rect {\n fill: ", ";\n }\n"])), function (props) {
@@ -37449,7 +37445,7 @@ var DetailsTab = function DetailsTab(_ref) {
37449
37445
  })));
37450
37446
  };
37451
37447
  var Container$r = styled__default.div(_templateObject$S || (_templateObject$S = _taggedTemplateLiteralLoose(["\n min-height: calc(100vh - 64px);\n"])));
37452
- var DetailsTabHeader = styled__default.div(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n border-bottom: 1px solid ", ";\n background-color: ", ";\n display: flex;\n justify-content: center;\n position: sticky;\n top: 0;\n z-index: 12;\n /* width */\n &::-webkit-scrollbar {\n width: 0;\n height: 0;\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: transparent;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n /* Handle on hover */\n &::-webkit-scrollbar-thumb:hover {\n background: transparent;\n }\n button {\n position: relative;\n border: none;\n background: transparent;\n outline: none;\n height: 44px;\n text-transform: capitalize;\n font-style: normal;\n font-weight: 500;\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n min-width: ", ";\n cursor: pointer;\n }\n\n & span {\n position: relative;\n display: inline-flex;\n align-items: center;\n height: 100%;\n }\n\n & .active span {\n color: ", ";\n\n &:after {\n content: '';\n width: 100%;\n border-radius: 2px;\n height: 2px;\n background-color: ", ";\n position: absolute;\n top: calc(100% - 1px);\n left: 0;\n }\n }\n"])), function (props) {
37448
+ var DetailsTabHeader = styled__default.div(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n border-bottom: 1px solid ", ";\n background-color: ", ";\n display: flex;\n justify-content: space-between;\n position: sticky;\n top: 0;\n z-index: 12;\n /* width */\n &::-webkit-scrollbar {\n width: 0;\n height: 0;\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: transparent;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n /* Handle on hover */\n &::-webkit-scrollbar-thumb:hover {\n background: transparent;\n }\n button {\n position: relative;\n border: none;\n background: transparent;\n outline: none;\n height: 44px;\n text-transform: capitalize;\n font-style: normal;\n font-weight: 500;\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n min-width: ", ";\n cursor: pointer;\n }\n\n & span {\n position: relative;\n display: inline-flex;\n align-items: center;\n height: 100%;\n }\n\n & .active span {\n color: ", ";\n\n &:after {\n content: '';\n width: 100%;\n border-radius: 2px;\n height: 2px;\n background-color: ", ";\n position: absolute;\n top: calc(100% - 1px);\n left: 0;\n }\n }\n"])), function (props) {
37453
37449
  return props.borderColor;
37454
37450
  }, function (props) {
37455
37451
  return props.backgroundColor || 'transparent';
package/index.modern.js CHANGED
@@ -19219,7 +19219,7 @@ var DeletedAvatarWrapper = styled(SvgDeletedUserAvatar)(_templateObject4$2 || (_
19219
19219
  return props.color;
19220
19220
  });
19221
19221
 
19222
- var _templateObject$4, _templateObject2$4, _templateObject3$3, _templateObject4$3, _templateObject5$2, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject0$1, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1;
19222
+ var _templateObject$4, _templateObject2$4, _templateObject3$3, _templateObject4$3, _templateObject5$2, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject0$1, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1;
19223
19223
  var ChannelMessageText = function ChannelMessageText(_ref) {
19224
19224
  var isTypingOrRecording = _ref.isTypingOrRecording,
19225
19225
  textPrimary = _ref.textPrimary,
@@ -19234,7 +19234,7 @@ var ChannelMessageText = function ChannelMessageText(_ref) {
19234
19234
  typingOrRecording = _ref.typingOrRecording,
19235
19235
  channel = _ref.channel,
19236
19236
  isDirectChannel = _ref.isDirectChannel;
19237
- return /*#__PURE__*/React__default.createElement("div", null, isTypingOrRecording && (/*#__PURE__*/React__default.createElement(TypingIndicator, null, !isDirectChannel && /*#__PURE__*/React__default.createElement(Points, {
19237
+ return /*#__PURE__*/React__default.createElement(MessageTextContainer, null, isTypingOrRecording && (/*#__PURE__*/React__default.createElement(TypingIndicator, null, !isDirectChannel && /*#__PURE__*/React__default.createElement(Points, {
19238
19238
  color: textPrimary
19239
19239
  }, ":"), typingOrRecording.isTyping ? 'typing' : 'recording', "...")), !isTypingOrRecording && (draftMessageText ? (/*#__PURE__*/React__default.createElement(DraftMessageText, {
19240
19240
  color: textSecondary
@@ -19591,6 +19591,7 @@ var UnreadCount = styled.span(_templateObject17$1 || (_templateObject17$1 = _tag
19591
19591
  var PinnedIconWrapper = styled.span(_templateObject18$1 || (_templateObject18$1 = _taggedTemplateLiteralLoose(["\n & > svg {\n color: ", ";\n }\n"])), function (props) {
19592
19592
  return props.color;
19593
19593
  });
19594
+ var MessageTextContainer = styled.div(_templateObject19$1 || (_templateObject19$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-end;\n gap: 4px;\n"])));
19594
19595
 
19595
19596
  var _templateObject$5, _templateObject2$5;
19596
19597
  var SearchInputContainer = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n max-width: ", ";\n box-sizing: border-box;\n padding: ", ";\n\n & ", " {\n ", ";\n }\n"])), function (props) {
@@ -24257,8 +24258,7 @@ function ReactionsPopup(_ref) {
24257
24258
  backgroundSections = _useColor[THEME_COLORS.BACKGROUND_SECTIONS],
24258
24259
  textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
24259
24260
  surface1 = _useColor[THEME_COLORS.SURFACE_1],
24260
- backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED],
24261
- surface2 = _useColor[THEME_COLORS.SURFACE_2];
24261
+ backgroundHovered = _useColor[THEME_COLORS.BACKGROUND_HOVERED];
24262
24262
  var popupRef = useRef(null);
24263
24263
  var scoresRef = useRef(null);
24264
24264
  var reactions = useSelector(reactionsListSelector, shallowEqual);
@@ -24372,8 +24372,7 @@ function ReactionsPopup(_ref) {
24372
24372
  },
24373
24373
  onMouseLeave: function onMouseLeave() {
24374
24374
  return setIsScrolling(false);
24375
- },
24376
- thumbColor: surface2
24375
+ }
24377
24376
  }, /*#__PURE__*/React__default.createElement(ReactionScoresList, {
24378
24377
  borderBottom: reactionsDetailsPopupHeaderItemsStyle !== 'bubbles'
24379
24378
  }, /*#__PURE__*/React__default.createElement(ReactionScoreItem, {
@@ -24409,8 +24408,7 @@ function ReactionsPopup(_ref) {
24409
24408
  },
24410
24409
  onMouseLeave: function onMouseLeave() {
24411
24410
  return setIsScrolling(false);
24412
- },
24413
- thumbColor: surface2
24411
+ }
24414
24412
  }, reactions.map(function (reaction) {
24415
24413
  return /*#__PURE__*/React__default.createElement(ReactionItem$1, {
24416
24414
  key: reaction.id,
@@ -24469,22 +24467,18 @@ var Container$d = styled.div(_templateObject$q || (_templateObject$q = _taggedTe
24469
24467
  }, function (props) {
24470
24468
  return props.backgroundColor;
24471
24469
  });
24472
- var UserNamePresence$1 = styled.div(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteralLoose(["\n width: 100%;\n margin-left: 12px;\n"])));
24473
- var MemberName$1 = styled.h3(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose(["\n margin: 0;\n max-width: calc(100% - 47px);\n font-weight: 500;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n color: ", ";\n & > span {\n color: ", ";\n }\n"])), function (props) {
24470
+ var UserNamePresence$1 = styled.div(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteralLoose(["\n width: calc(100% - 70px);\n margin-left: 12px;\n"])));
24471
+ var MemberName$1 = styled.h3(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose(["\n margin: 0;\n max-width: calc(100% - 7px);\n font-weight: 500;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.2px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n color: ", ";\n & > span {\n color: ", ";\n }\n"])), function (props) {
24474
24472
  return props.color;
24475
24473
  }, function (props) {
24476
24474
  return props.color;
24477
24475
  });
24478
- var ReactionsList = styled.ul(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n overflow: ", ";\n overflow-x: hidden;\n list-style: none;\n transition: all 0.2s;\n height: ", ";\n calc(100% - 57px);\n\n &.show-scrollbar {\n overflow-x: hidden;\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) {
24476
+ var ReactionsList = styled.ul(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n overflow: ", ";\n overflow-y: auto;\n overflow-x: hidden;\n list-style: none;\n transition: all 0.2s;\n height: ", ";\n\n &::-webkit-scrollbar {\n display: none;\n }\n &::-webkit-scrollbar-thumb {\n display: none;\n }\n &::-webkit-scrollbar-track {\n display: none;\n }\n"])), function (props) {
24479
24477
  return !props.popupHeight && 'hidden';
24480
24478
  }, function (props) {
24481
24479
  return "calc(100% - " + (props.scoresHeight || 57) + "px)";
24482
- }, function (props) {
24483
- return props.thumbColor;
24484
- });
24485
- var ReactionScoresCont = styled.div(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n max-width: 100%;\n overflow-y: auto;\n &.show-scrollbar {\n overflow-x: hidden;\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) {
24486
- return props.thumbColor;
24487
24480
  });
24481
+ var ReactionScoresCont = styled.div(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n max-width: 100%;\n overflow: auto;\n overflow-y: hidden;\n\n &::-webkit-scrollbar {\n display: none;\n }\n &::-webkit-scrollbar-thumb {\n display: none;\n }\n &::-webkit-scrollbar-track {\n display: none;\n }\n"])));
24488
24482
  var ReactionScoresList = styled.div(_templateObject6$a || (_templateObject6$a = _taggedTemplateLiteralLoose(["\n display: flex;\n padding: 2px 8px 0;\n"])));
24489
24483
  var TabKey = styled.span(_templateObject7$9 || (_templateObject7$9 = _taggedTemplateLiteralLoose([""])));
24490
24484
  var ReactionScoreItem = styled.div(_templateObject8$9 || (_templateObject8$9 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n white-space: nowrap;\n padding: ", ";\n font-weight: 500;\n font-size: 13px;\n color: ", ";\n margin-bottom: -1px;\n cursor: pointer;\n & > span {\n position: relative;\n padding: ", ";\n border-radius: 16px;\n height: 30px;\n box-sizing: border-box;\n font-family: Inter, sans-serif;\n font-style: normal;\n font-weight: 600;\n font-size: 14px;\n line-height: ", ";\n background-color: ", ";\n color: ", ";\n ", "\n\n & ", " {\n font-family:\n apple color emoji,\n segoe ui emoji,\n noto color emoji,\n android emoji,\n emojisymbols,\n emojione mozilla,\n twemoji mozilla,\n segoe ui symbol;\n margin-right: 4px;\n font-size: 15px;\n }\n }\n"])), function (props) {
@@ -33799,7 +33793,7 @@ var RecordingAnimation = function RecordingAnimation(_ref2) {
33799
33793
  }));
33800
33794
  };
33801
33795
 
33802
- var _templateObject$I, _templateObject2$D, _templateObject3$w, _templateObject4$r, _templateObject5$n, _templateObject6$j, _templateObject7$h, _templateObject8$f, _templateObject9$d, _templateObject0$c, _templateObject1$8, _templateObject10$5, _templateObject11$5, _templateObject12$4, _templateObject13$3, _templateObject14$2, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1, _templateObject27$1, _templateObject28$1, _templateObject29$1, _templateObject30$1, _templateObject31$1, _templateObject32$1, _templateObject33$1, _templateObject34$1;
33796
+ var _templateObject$I, _templateObject2$D, _templateObject3$w, _templateObject4$r, _templateObject5$n, _templateObject6$j, _templateObject7$h, _templateObject8$f, _templateObject9$d, _templateObject0$c, _templateObject1$8, _templateObject10$5, _templateObject11$5, _templateObject12$4, _templateObject13$3, _templateObject14$2, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$2, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25$1, _templateObject26$1, _templateObject27$1, _templateObject28$1, _templateObject29$1, _templateObject30$1, _templateObject31$1, _templateObject32$1, _templateObject33$1, _templateObject34$1;
33803
33797
  function AutoFocusPlugin(_ref) {
33804
33798
  var messageForReply = _ref.messageForReply;
33805
33799
  var _useLexicalComposerCo = useLexicalComposerContext(),
@@ -35448,7 +35442,7 @@ var AudioCont = styled.div(_templateObject15$2 || (_templateObject15$2 = _tagged
35448
35442
  var ChosenAttachments = styled.div(_templateObject16$2 || (_templateObject16$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n padding: 16px 16px 14px;\n overflow-x: auto;\n\n & ", " {\n width: 100%;\n height: 100%;\n border-radius: 4px;\n object-fit: cover;\n }\n\n & ", " {\n width: 240px;\n padding: 5px 12px;\n border-radius: 8px;\n height: 50px;\n }\n"])), AttachmentImg$1, AttachmentFile$1);
35449
35443
  var TypingIndicator$1 = styled.div(_templateObject17$2 || (_templateObject17$2 = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 100%;\n left: 16px;\n"])));
35450
35444
  var TypingIndicatorCont = styled.div(_templateObject18$2 || (_templateObject18$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-bottom: 12px;\n gap: 4px;\n"])));
35451
- var TypingFrom = styled.h5(_templateObject19$1 || (_templateObject19$1 = _taggedTemplateLiteralLoose(["\n margin: 0 4px 0 0;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n letter-spacing: -0.2px;\n color: ", ";\n"])), function (props) {
35445
+ var TypingFrom = styled.h5(_templateObject19$2 || (_templateObject19$2 = _taggedTemplateLiteralLoose(["\n margin: 0 4px 0 0;\n font-weight: 400;\n font-size: 13px;\n line-height: 16px;\n letter-spacing: -0.2px;\n color: ", ";\n"])), function (props) {
35452
35446
  return props.color;
35453
35447
  });
35454
35448
  var sizeAnimation = keyframes(_templateObject20$1 || (_templateObject20$1 = _taggedTemplateLiteralLoose(["\n 0% {\n width: 2px;\n height: 2px;\n opacity: 0.4;\n }\n 50% {\n width: 2px;\n height: 2px;\n opacity: 0.4;\n }\n 100% {\n width: 6px;\n height: 6px;\n opacity: 1;\n }\n"])));
@@ -37220,7 +37214,9 @@ var VoiceItem = function VoiceItem(_ref) {
37220
37214
  type: 'audio/mpeg'
37221
37215
  })));
37222
37216
  };
37223
- var FileIconCont$1 = styled.span(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: inline-flex;\n circle {\n fill: ", ";\n }\n"])), function (props) {
37217
+ var FileIconCont$1 = styled.span(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: inline-flex;\n fill: ", ";\n rect {\n fill: ", ";\n }\n"])), function (props) {
37218
+ return props.fill || 'transparent';
37219
+ }, function (props) {
37224
37220
  return props.fill || 'transparent';
37225
37221
  });
37226
37222
  var FileHoverIconCont$1 = styled.span(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: none;\n fill: ", ";\n rect {\n fill: ", ";\n }\n"])), function (props) {
@@ -37426,7 +37422,7 @@ var DetailsTab = function DetailsTab(_ref) {
37426
37422
  })));
37427
37423
  };
37428
37424
  var Container$r = styled.div(_templateObject$S || (_templateObject$S = _taggedTemplateLiteralLoose(["\n min-height: calc(100vh - 64px);\n"])));
37429
- var DetailsTabHeader = styled.div(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n border-bottom: 1px solid ", ";\n background-color: ", ";\n display: flex;\n justify-content: center;\n position: sticky;\n top: 0;\n z-index: 12;\n /* width */\n &::-webkit-scrollbar {\n width: 0;\n height: 0;\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: transparent;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n /* Handle on hover */\n &::-webkit-scrollbar-thumb:hover {\n background: transparent;\n }\n button {\n position: relative;\n border: none;\n background: transparent;\n outline: none;\n height: 44px;\n text-transform: capitalize;\n font-style: normal;\n font-weight: 500;\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n min-width: ", ";\n cursor: pointer;\n }\n\n & span {\n position: relative;\n display: inline-flex;\n align-items: center;\n height: 100%;\n }\n\n & .active span {\n color: ", ";\n\n &:after {\n content: '';\n width: 100%;\n border-radius: 2px;\n height: 2px;\n background-color: ", ";\n position: absolute;\n top: calc(100% - 1px);\n left: 0;\n }\n }\n"])), function (props) {
37425
+ var DetailsTabHeader = styled.div(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n border-bottom: 1px solid ", ";\n background-color: ", ";\n display: flex;\n justify-content: space-between;\n position: sticky;\n top: 0;\n z-index: 12;\n /* width */\n &::-webkit-scrollbar {\n width: 0;\n height: 0;\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: transparent;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: transparent;\n }\n\n /* Handle on hover */\n &::-webkit-scrollbar-thumb:hover {\n background: transparent;\n }\n button {\n position: relative;\n border: none;\n background: transparent;\n outline: none;\n height: 44px;\n text-transform: capitalize;\n font-style: normal;\n font-weight: 500;\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n min-width: ", ";\n cursor: pointer;\n }\n\n & span {\n position: relative;\n display: inline-flex;\n align-items: center;\n height: 100%;\n }\n\n & .active span {\n color: ", ";\n\n &:after {\n content: '';\n width: 100%;\n border-radius: 2px;\n height: 2px;\n background-color: ", ";\n position: absolute;\n top: calc(100% - 1px);\n left: 0;\n }\n }\n"])), function (props) {
37430
37426
  return props.borderColor;
37431
37427
  }, function (props) {
37432
37428
  return props.backgroundColor || 'transparent';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sceyt-chat-react-uikit",
3
- "version": "1.6.7-beta.17",
3
+ "version": "1.6.7-beta.18",
4
4
  "description": "Interactive React UI Components for Sceyt Chat.",
5
5
  "author": "Sceyt",
6
6
  "license": "MIT",