sceyt-chat-react-uikit 1.6.5-beta.1 → 1.6.5-beta.2

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 CHANGED
@@ -34837,7 +34837,8 @@ var DetailsTab = function DetailsTab(_ref) {
34837
34837
  var _useColor = useColors(),
34838
34838
  accentColor = _useColor[THEME_COLORS.ACCENT],
34839
34839
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
34840
- borderThemeColor = _useColor[THEME_COLORS.BORDER];
34840
+ borderThemeColor = _useColor[THEME_COLORS.BORDER],
34841
+ backgroundColor = _useColor[THEME_COLORS.BACKGROUND];
34841
34842
  var dispatch = reactRedux.useDispatch();
34842
34843
  var isDirectChannel = channel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
34843
34844
  var showMembers = !isDirectChannel && checkActionPermission('getMembers');
@@ -34864,7 +34865,8 @@ var DetailsTab = function DetailsTab(_ref) {
34864
34865
  borderColor: borderColor || borderThemeColor,
34865
34866
  fontSize: tabItemsFontSize,
34866
34867
  lineHeight: tabItemsLineHeight,
34867
- minWidth: tabItemsMinWidth
34868
+ minWidth: tabItemsMinWidth,
34869
+ backgroundColor: backgroundColor
34868
34870
  }, Object.keys(channelDetailsTabs).map(function (key) {
34869
34871
  if (key === 'member') {
34870
34872
  if (showMembers) {
@@ -34936,8 +34938,10 @@ var DetailsTab = function DetailsTab(_ref) {
34936
34938
  })));
34937
34939
  };
34938
34940
  var Container$r = styled__default.div(_templateObject$R || (_templateObject$R = _taggedTemplateLiteralLoose(["\n //border-top: 1px solid ", ";\n"])), colors.gray1);
34939
- var DetailsTabHeader = styled__default.div(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n padding: 0 20px;\n border-bottom: 1px solid ", ";\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) {
34941
+ var DetailsTabHeader = styled__default.div(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n padding: 0 20px;\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) {
34940
34942
  return props.borderColor;
34943
+ }, function (props) {
34944
+ return props.backgroundColor || 'transparent';
34941
34945
  }, function (props) {
34942
34946
  return props.fontSize || '15px';
34943
34947
  }, function (props) {
package/index.modern.js CHANGED
@@ -34814,7 +34814,8 @@ var DetailsTab = function DetailsTab(_ref) {
34814
34814
  var _useColor = useColors(),
34815
34815
  accentColor = _useColor[THEME_COLORS.ACCENT],
34816
34816
  textSecondary = _useColor[THEME_COLORS.TEXT_SECONDARY],
34817
- borderThemeColor = _useColor[THEME_COLORS.BORDER];
34817
+ borderThemeColor = _useColor[THEME_COLORS.BORDER],
34818
+ backgroundColor = _useColor[THEME_COLORS.BACKGROUND];
34818
34819
  var dispatch = useDispatch();
34819
34820
  var isDirectChannel = channel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
34820
34821
  var showMembers = !isDirectChannel && checkActionPermission('getMembers');
@@ -34841,7 +34842,8 @@ var DetailsTab = function DetailsTab(_ref) {
34841
34842
  borderColor: borderColor || borderThemeColor,
34842
34843
  fontSize: tabItemsFontSize,
34843
34844
  lineHeight: tabItemsLineHeight,
34844
- minWidth: tabItemsMinWidth
34845
+ minWidth: tabItemsMinWidth,
34846
+ backgroundColor: backgroundColor
34845
34847
  }, Object.keys(channelDetailsTabs).map(function (key) {
34846
34848
  if (key === 'member') {
34847
34849
  if (showMembers) {
@@ -34913,8 +34915,10 @@ var DetailsTab = function DetailsTab(_ref) {
34913
34915
  })));
34914
34916
  };
34915
34917
  var Container$r = styled.div(_templateObject$R || (_templateObject$R = _taggedTemplateLiteralLoose(["\n //border-top: 1px solid ", ";\n"])), colors.gray1);
34916
- var DetailsTabHeader = styled.div(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n padding: 0 20px;\n border-bottom: 1px solid ", ";\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) {
34918
+ var DetailsTabHeader = styled.div(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n overflow-x: auto;\n overflow-y: hidden;\n padding: 0 20px;\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) {
34917
34919
  return props.borderColor;
34920
+ }, function (props) {
34921
+ return props.backgroundColor || 'transparent';
34918
34922
  }, function (props) {
34919
34923
  return props.fontSize || '15px';
34920
34924
  }, function (props) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sceyt-chat-react-uikit",
3
- "version": "1.6.5-beta.1",
3
+ "version": "1.6.5-beta.2",
4
4
  "description": "Interactive React UI Components for Sceyt Chat.",
5
5
  "author": "Sceyt",
6
6
  "license": "MIT",