sceyt-chat-react-uikit 1.8.1 → 1.8.2-beta.1

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 +20 -7
  2. package/index.modern.js +20 -7
  3. package/package.json +1 -1
package/index.js CHANGED
@@ -37918,6 +37918,15 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
37918
37918
  var getFromContacts = getShowOnlyContactUsers();
37919
37919
  var user = getClient().user;
37920
37920
  var contactsMap = useSelector(contactsMapSelector);
37921
+ var titleWrapperRef = React__default.useRef(null);
37922
+ var _useState2 = React.useState(0),
37923
+ titleHeight = _useState2[0],
37924
+ setTitleHeight = _useState2[1];
37925
+ React.useEffect(function () {
37926
+ if (titleWrapperRef.current) {
37927
+ setTitleHeight(titleWrapperRef.current.offsetHeight);
37928
+ }
37929
+ }, []);
37921
37930
  var _useColor = useColors(),
37922
37931
  background = _useColor[THEME_COLORS.BACKGROUND],
37923
37932
  surface1 = _useColor[THEME_COLORS.SURFACE_1],
@@ -37926,9 +37935,9 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
37926
37935
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
37927
37936
  border = _useColor[THEME_COLORS.BORDER],
37928
37937
  accent = _useColor[THEME_COLORS.ACCENT];
37929
- var _useState2 = React.useState(false),
37930
- isScrolling = _useState2[0],
37931
- setIsScrolling = _useState2[1];
37938
+ var _useState3 = React.useState(false),
37939
+ isScrolling = _useState3[0],
37940
+ setIsScrolling = _useState3[1];
37932
37941
  var optionIdToVotes = React.useMemo(function () {
37933
37942
  var votes = {};
37934
37943
  poll.options.forEach(function (opt) {
@@ -37974,7 +37983,8 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
37974
37983
  color: textPrimary,
37975
37984
  marginBottom: '16px'
37976
37985
  }, "Vote results"), /*#__PURE__*/React__default.createElement(TitleWrapper$1, {
37977
- backgroundColor: surface1
37986
+ backgroundColor: surface1,
37987
+ ref: titleWrapperRef
37978
37988
  }, /*#__PURE__*/React__default.createElement(Question, {
37979
37989
  color: textPrimary
37980
37990
  }, poll.name)), /*#__PURE__*/React__default.createElement(OptionsList, {
@@ -37985,7 +37995,8 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
37985
37995
  },
37986
37996
  onMouseLeave: function onMouseLeave() {
37987
37997
  return setIsScrolling(false);
37988
- }
37998
+ },
37999
+ titleHeight: titleHeight
37989
38000
  }, poll.options.map(function (opt) {
37990
38001
  var _poll$voteDetails5, _poll$voteDetails5$vo;
37991
38002
  var allVotes = optionIdToVotes[opt.id] || [];
@@ -38046,7 +38057,9 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
38046
38057
  })) === null || _poll$options$find === void 0 ? void 0 : _poll$options$find.name) || ''
38047
38058
  })));
38048
38059
  };
38049
- var OptionsList = styled__default.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n max-height: 504px;\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\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) {
38060
+ 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\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) {
38061
+ return props.titleHeight;
38062
+ }, function (props) {
38050
38063
  return props.thumbColor;
38051
38064
  });
38052
38065
  var OptionBlock = styled__default.div(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteralLoose(["\n background: ", ";\n border-radius: 10px;\n border: 1px solid ", "0F; /* subtle */\n padding: 14px 16px 0 16px;\n"])), function (p) {
@@ -38073,7 +38086,7 @@ var VotedAt$1 = styled__default.div(_templateObject0$a || (_templateObject0$a =
38073
38086
  var TitleWrapper$1 = styled__default.div(_templateObject1$8 || (_templateObject1$8 = _taggedTemplateLiteralLoose(["\n margin: 0 auto;\n border-radius: 10px;\n padding: 16px;\n background: ", ";\n margin-bottom: 16px;\n"])), function (p) {
38074
38087
  return p.backgroundColor;
38075
38088
  });
38076
- var Question = styled__default.div(_templateObject10$5 || (_templateObject10$5 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.4px;\n"])), function (p) {
38089
+ var Question = styled__default.div(_templateObject10$5 || (_templateObject10$5 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.4px;\n overflow-wrap: anywhere;\n"])), function (p) {
38077
38090
  return p.color;
38078
38091
  });
38079
38092
 
package/index.modern.js CHANGED
@@ -37917,6 +37917,15 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
37917
37917
  var getFromContacts = getShowOnlyContactUsers();
37918
37918
  var user = getClient().user;
37919
37919
  var contactsMap = useSelector(contactsMapSelector);
37920
+ var titleWrapperRef = React__default.useRef(null);
37921
+ var _useState2 = useState(0),
37922
+ titleHeight = _useState2[0],
37923
+ setTitleHeight = _useState2[1];
37924
+ useEffect(function () {
37925
+ if (titleWrapperRef.current) {
37926
+ setTitleHeight(titleWrapperRef.current.offsetHeight);
37927
+ }
37928
+ }, []);
37920
37929
  var _useColor = useColors(),
37921
37930
  background = _useColor[THEME_COLORS.BACKGROUND],
37922
37931
  surface1 = _useColor[THEME_COLORS.SURFACE_1],
@@ -37925,9 +37934,9 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
37925
37934
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
37926
37935
  border = _useColor[THEME_COLORS.BORDER],
37927
37936
  accent = _useColor[THEME_COLORS.ACCENT];
37928
- var _useState2 = useState(false),
37929
- isScrolling = _useState2[0],
37930
- setIsScrolling = _useState2[1];
37937
+ var _useState3 = useState(false),
37938
+ isScrolling = _useState3[0],
37939
+ setIsScrolling = _useState3[1];
37931
37940
  var optionIdToVotes = useMemo(function () {
37932
37941
  var votes = {};
37933
37942
  poll.options.forEach(function (opt) {
@@ -37973,7 +37982,8 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
37973
37982
  color: textPrimary,
37974
37983
  marginBottom: '16px'
37975
37984
  }, "Vote results"), /*#__PURE__*/React__default.createElement(TitleWrapper$1, {
37976
- backgroundColor: surface1
37985
+ backgroundColor: surface1,
37986
+ ref: titleWrapperRef
37977
37987
  }, /*#__PURE__*/React__default.createElement(Question, {
37978
37988
  color: textPrimary
37979
37989
  }, poll.name)), /*#__PURE__*/React__default.createElement(OptionsList, {
@@ -37984,7 +37994,8 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
37984
37994
  },
37985
37995
  onMouseLeave: function onMouseLeave() {
37986
37996
  return setIsScrolling(false);
37987
- }
37997
+ },
37998
+ titleHeight: titleHeight
37988
37999
  }, poll.options.map(function (opt) {
37989
38000
  var _poll$voteDetails5, _poll$voteDetails5$vo;
37990
38001
  var allVotes = optionIdToVotes[opt.id] || [];
@@ -38045,7 +38056,9 @@ var VotesResultsPopup = function VotesResultsPopup(_ref) {
38045
38056
  })) === null || _poll$options$find === void 0 ? void 0 : _poll$options$find.name) || ''
38046
38057
  })));
38047
38058
  };
38048
- var OptionsList = styled.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n max-height: 504px;\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\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) {
38059
+ 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\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) {
38060
+ return props.titleHeight;
38061
+ }, function (props) {
38049
38062
  return props.thumbColor;
38050
38063
  });
38051
38064
  var OptionBlock = styled.div(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteralLoose(["\n background: ", ";\n border-radius: 10px;\n border: 1px solid ", "0F; /* subtle */\n padding: 14px 16px 0 16px;\n"])), function (p) {
@@ -38072,7 +38085,7 @@ var VotedAt$1 = styled.div(_templateObject0$a || (_templateObject0$a = _taggedTe
38072
38085
  var TitleWrapper$1 = styled.div(_templateObject1$8 || (_templateObject1$8 = _taggedTemplateLiteralLoose(["\n margin: 0 auto;\n border-radius: 10px;\n padding: 16px;\n background: ", ";\n margin-bottom: 16px;\n"])), function (p) {
38073
38086
  return p.backgroundColor;
38074
38087
  });
38075
- var Question = styled.div(_templateObject10$5 || (_templateObject10$5 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.4px;\n"])), function (p) {
38088
+ var Question = styled.div(_templateObject10$5 || (_templateObject10$5 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-weight: 400;\n font-size: 15px;\n line-height: 18px;\n letter-spacing: -0.4px;\n overflow-wrap: anywhere;\n"])), function (p) {
38076
38089
  return p.color;
38077
38090
  });
38078
38091
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sceyt-chat-react-uikit",
3
- "version": "1.8.1",
3
+ "version": "1.8.2-beta.1",
4
4
  "description": "Interactive React UI Components for Sceyt Chat.",
5
5
  "author": "Sceyt",
6
6
  "license": "MIT",