@synerise/ds-table 0.49.0 → 0.49.1

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.49.1](https://github.com/synerise/synerise-design/compare/@synerise/ds-table@0.49.0...@synerise/ds-table@0.49.1) (2024-04-17)
+
+
+### Bug Fixes
+
+* **table:** avatar label cell styles ([2602587](https://github.com/synerise/synerise-design/commit/2602587d1afc2a1b4bef67d1aed712c6ed6e2507))
+
+
+
+
+
 # [0.49.0](https://github.com/synerise/synerise-design/compare/@synerise/ds-table@0.48.6...@synerise/ds-table@0.49.0) (2024-04-17)
 
 

package/dist/Cell/AvatarLabel/AvatarLabel.d.ts

@@ -1,3 +1,3 @@
 import { AvatarLabelProps } from './AvatarLabel.types';
-declare const AvatarLabel: ({ avatar, avatarAction, avatarLink, title, labels, icon, textSize, ellipsis, maxWidth, avatarSize, loader, }: AvatarLabelProps) => JSX.Element;
+declare const AvatarLabel: ({ avatar, avatarAction, avatarLink, title, labels, icon, ellipsis, maxWidth, avatarSize, loader, }: AvatarLabelProps) => JSX.Element;
 export default AvatarLabel;

package/dist/Cell/AvatarLabel/AvatarLabel.js

@@ -11,8 +11,6 @@ var AvatarLabel = function AvatarLabel(_ref) {
       title = _ref.title,
       labels = _ref.labels,
       icon = _ref.icon,
-      _ref$textSize = _ref.textSize,
-      textSize = _ref$textSize === void 0 ? 'default' : _ref$textSize,
       ellipsis = _ref.ellipsis,
       maxWidth = _ref.maxWidth,
       avatarSize = _ref.avatarSize,
@@ -37,14 +35,14 @@ var AvatarLabel = function AvatarLabel(_ref) {
     hasEllipsis: ellipsis,
     maxWidth: maxWidth,
     avatarSize: avatarSize
-  }), title), labels == null ? void 0 : labels.map(function (label) {
+  }), title), (labels == null ? void 0 : labels.length) && /*#__PURE__*/React.createElement(S.Labels, {
+    ellipsis: Boolean(ellipsis),
+    maxWidth: maxWidth
+  }, labels == null ? void 0 : labels.map(function (label) {
     return /*#__PURE__*/React.createElement(S.Label, {
-      key: uuid(),
-      textSize: textSize,
-      ellipsis: Boolean(ellipsis),
-      maxWidth: maxWidth
+      key: uuid()
     }, label);
-  }), loader && /*#__PURE__*/React.createElement(S.Loader, null, loader)));
+  })), loader && /*#__PURE__*/React.createElement(S.Loader, null, loader)));
   return /*#__PURE__*/React.createElement(S.AvatarLabel, {
     onClick: avatarAction
   }, avatarLink ? /*#__PURE__*/React.createElement(S.AvatarLink, {

package/dist/Cell/AvatarLabel/AvatarLabel.styles.d.ts

@@ -17,10 +17,10 @@ export declare const Title: import("styled-components").StyledComponent<({ size,
     maxWidth: number | undefined;
     avatarSize?: string | undefined;
 }, never>;
-export declare const Label: import("styled-components").StyledComponent<"span", any, {
-    textSize: 'small' | 'default';
+export declare const Labels: import("styled-components").StyledComponent<"span", any, {
     ellipsis: boolean;
     maxWidth: number | undefined;
 }, never>;
+export declare const Label: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const Icon: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Loader: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/Cell/AvatarLabel/AvatarLabel.styles.js

@@ -15,34 +15,36 @@ export var Avatar = styled.div.withConfig({
 export var Description = styled.div.withConfig({
   displayName: "AvatarLabelstyles__Description",
   componentId: "sc-1485c9p-2"
-})(["display:flex;min-width:0;flex-direction:column;align-items:flex-start;justify-content:center;"]);
+})(["display:flex;min-width:0;flex-direction:column;align-items:flex-start;justify-content:center;max-height:40px;overflow:hidden;"]);
 export var AvatarLink = styled.a.withConfig({
   displayName: "AvatarLabelstyles__AvatarLink",
   componentId: "sc-1485c9p-3"
-})(["display:flex;min-width:0;&:hover,&:active,&:focus{text-decoration:none;}"]);
+})(["display:flex;min-width:0;color:inherit;&:hover,&:active,&:focus{text-decoration:none;color:inherit;}"]);
 export var Title = styled(Text).withConfig({
   displayName: "AvatarLabelstyles__Title",
   componentId: "sc-1485c9p-4"
-})(["font-size:14px;line-height:20px;font-weight:500;color:", ";", ";"], function (props) {
+})(["font-size:14px;line-height:20px;color:", ";font-weight:500;", ";"], function (props) {
   return props.theme.palette['grey-700'];
 }, function (props) {
   return Boolean(props.ellipsis) && css(["max-width:", ";"], props.maxWidth ? props.maxWidth + "px" : '100%');
 });
-export var Label = styled.span.withConfig({
-  displayName: "AvatarLabelstyles__Label",
+export var Labels = styled.span.withConfig({
+  displayName: "AvatarLabelstyles__Labels",
   componentId: "sc-1485c9p-5"
-})(["font-size:13px;line-height:1.38;color:", ";font-weight:400;margin-top:", ";", ";"], function (props) {
+})(["font-size:13px;line-height:1.38;font-weight:400;color:", ";", ";"], function (props) {
   return props.theme.palette['grey-700'];
-}, function (props) {
-  return props.textSize === 'default' ? '4px' : '0px';
 }, function (props) {
   return props.ellipsis && css(["text-overflow:ellipsis;overflow:hidden;max-width:", ";"], props.maxWidth ? props.maxWidth + "px" : '100%');
 });
+export var Label = styled.span.withConfig({
+  displayName: "AvatarLabelstyles__Label",
+  componentId: "sc-1485c9p-6"
+})([""]);
 export var Icon = styled.div.withConfig({
   displayName: "AvatarLabelstyles__Icon",
-  componentId: "sc-1485c9p-6"
+  componentId: "sc-1485c9p-7"
 })(["margin-right:8px;"]);
 export var Loader = styled.div.withConfig({
   displayName: "AvatarLabelstyles__Loader",
-  componentId: "sc-1485c9p-7"
+  componentId: "sc-1485c9p-8"
 })([""]);

package/dist/ColumnSortMenu/replaceSortButtons.js

@@ -4,7 +4,7 @@ var createReplaceButtonsPortal = function createReplaceButtonsPortal(columnTitle
   return function () {
     var _columnTitleElement$p;
 
-    var sortContainerElem = columnTitleElement == null ? void 0 : (_columnTitleElement$p = columnTitleElement.parentElement) == null ? void 0 : _columnTitleElement$p.nextSibling;
+    var sortContainerElem = columnTitleElement == null || (_columnTitleElement$p = columnTitleElement.parentElement) == null ? void 0 : _columnTitleElement$p.nextSibling;
 
     if (!sortContainerElem) {
       return null;

package/dist/DefaultTable/DefaultTable.js

@@ -101,8 +101,8 @@ function DefaultTable(props) {
   }, {});
   var selectedRecords = React.useMemo(function () {
     if (selection) {
-      var _ref3 = selection,
-          selectedRowKeys = _ref3.selectedRowKeys;
+      var _ref4 = selection,
+          selectedRowKeys = _ref4.selectedRowKeys;
       var selectedRows = [];
       dataSource && dataSource.forEach(function (row) {
         var key = getRowKey(row);
@@ -127,11 +127,11 @@ function DefaultTable(props) {
     return [];
   }, [dataSource, getRowKey, selection]);
   var renderRowSelection = React.useCallback(function (key, record) {
-    var _ref4 = selection,
-        selectedRowKeys = _ref4.selectedRowKeys,
-        limit = _ref4.limit,
-        independentSelectionExpandedRows = _ref4.independentSelectionExpandedRows,
-        onChange = _ref4.onChange;
+    var _ref5 = selection,
+        selectedRowKeys = _ref5.selectedRowKeys,
+        limit = _ref5.limit,
+        independentSelectionExpandedRows = _ref5.independentSelectionExpandedRows,
+        onChange = _ref5.onChange;
     return /*#__PURE__*/React.createElement(RowSelectionColumn, {
       rowKey: rowKey,
       record: record,
@@ -171,7 +171,7 @@ function DefaultTable(props) {
       }, decoratedComponents) // @ts-ignore
       ,
       rowSelection: selection && _objectSpread({}, selection, {
-        selections: selection == null ? void 0 : (_selection$selections = selection.selections) == null ? void 0 : _selection$selections.filter(Boolean),
+        selections: selection == null || (_selection$selections = selection.selections) == null ? void 0 : _selection$selections.filter(Boolean),
         columnWidth: 64,
         renderCell: renderRowSelection
       })

package/dist/GroupTable/GroupTableBody/GroupTableBody.js

@@ -30,7 +30,7 @@ function GroupTableBody(_ref) {
   var selectedRowsNumber = React.useMemo(function () {
     var _selection$selectedRo;
 
-    return (selection == null ? void 0 : (_selection$selectedRo = selection.selectedRowKeys) == null ? void 0 : _selection$selectedRo.filter(function (key) {
+    return (selection == null || (_selection$selectedRo = selection.selectedRowKeys) == null ? void 0 : _selection$selectedRo.filter(function (key) {
       return allRowKeys.includes(key);
     }).length) || 0;
   }, [allRowKeys, selection]);

package/dist/InfiniteScroll/OuterListElement.js

@@ -40,10 +40,10 @@ var OuterListElement = function OuterListElement(containerRef, isSticky) {
 
     var onWheelHandler = function onWheelHandler(event) {
       if (header) {
-        var _event$currentTarget, _event$currentTarget$;
+        var _event$currentTarget;
 
         header.scrollTo({
-          left: (_event$currentTarget = event.currentTarget) == null ? void 0 : (_event$currentTarget$ = _event$currentTarget.parentElement) == null ? void 0 : _event$currentTarget$.scrollLeft
+          left: (_event$currentTarget = event.currentTarget) == null || (_event$currentTarget = _event$currentTarget.parentElement) == null ? void 0 : _event$currentTarget.scrollLeft
         });
       }
 
@@ -52,9 +52,9 @@ var OuterListElement = function OuterListElement(containerRef, isSticky) {
 
     if (isSticky) {
       // uses native browser scroll
-      var _ref2 = style || {},
-          height = _ref2.height,
-          rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
+      var _ref3 = style || {},
+          height = _ref3.height,
+          rest = _objectWithoutPropertiesLoose(_ref3, _excluded);
 
       return /*#__PURE__*/React.createElement("div", {
         ref: ref,

package/dist/Table.js

@@ -91,7 +91,7 @@ function DSTable(props) {
       showTotal: function showTotal(total, range) {
         var _tableLocale$paginati, _tableLocale$paginati2;
 
-        return !hideTitlePart ? /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("strong", null, formatValue(range[0])), "-", /*#__PURE__*/React.createElement("strong", null, formatValue(range[1])), " of", ' ', /*#__PURE__*/React.createElement("strong", null, formatValue(total)), ' ', grouped ? tableLocale == null ? void 0 : (_tableLocale$paginati = tableLocale.pagination) == null ? void 0 : _tableLocale$paginati.groups : tableLocale == null ? void 0 : (_tableLocale$paginati2 = tableLocale.pagination) == null ? void 0 : _tableLocale$paginati2.items) : /*#__PURE__*/React.createElement("div", {
+        return !hideTitlePart ? /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("strong", null, formatValue(range[0])), "-", /*#__PURE__*/React.createElement("strong", null, formatValue(range[1])), " of", ' ', /*#__PURE__*/React.createElement("strong", null, formatValue(total)), ' ', grouped ? tableLocale == null || (_tableLocale$paginati = tableLocale.pagination) == null ? void 0 : _tableLocale$paginati.groups : tableLocale == null || (_tableLocale$paginati2 = tableLocale.pagination) == null ? void 0 : _tableLocale$paginati2.items) : /*#__PURE__*/React.createElement("div", {
           style: {
             width: '150px'
           }

package/dist/TreeTable/TreeTable.js

@@ -22,11 +22,11 @@ function TreeTable(props) {
   }, []);
   var RenderCell = React.useCallback( // eslint-disable-next-line @typescript-eslint/no-explicit-any
   function (cell) {
-    var _cell$children$, _cell$children$$props, _cell$children$$props2, _cell$children$$props3, _cell$children$$props4;
+    var _cell$children$;
 
-    var indentLevel = (_cell$children$ = cell.children[0]) == null ? void 0 : (_cell$children$$props = _cell$children$.props) == null ? void 0 : (_cell$children$$props2 = _cell$children$$props.children[0]) == null ? void 0 : (_cell$children$$props3 = _cell$children$$props2.props) == null ? void 0 : (_cell$children$$props4 = _cell$children$$props3.className.split(' ').find(function (value) {
+    var indentLevel = (_cell$children$ = cell.children[0]) == null || (_cell$children$ = _cell$children$.props) == null || (_cell$children$ = _cell$children$.children[0]) == null || (_cell$children$ = _cell$children$.props) == null || (_cell$children$ = _cell$children$.className.split(' ').find(function (value) {
       return value.includes('indent-level-');
-    })) == null ? void 0 : _cell$children$$props4.split('-').pop();
+    })) == null ? void 0 : _cell$children$.split('-').pop();
 
     if (indentLevel === undefined) {
       return /*#__PURE__*/React.createElement("td", {

package/dist/VirtualTable/VirtualTable.js

@@ -136,7 +136,7 @@ var VirtualTable = function VirtualTable(props, forwardedRef) {
     if (listRef.current && infiniteScroll != null && (_infiniteScroll$prevP = infiniteScroll.prevPage) != null && _infiniteScroll$prevP.hasMore) {
       listRef.current.scrollTo(INFINITE_LOADED_ITEM_HEIGHT);
     }
-  }, [listRef, infiniteScroll == null ? void 0 : (_infiniteScroll$prevP2 = infiniteScroll.prevPage) == null ? void 0 : _infiniteScroll$prevP2.hasMore]);
+  }, [listRef, infiniteScroll == null || (_infiniteScroll$prevP2 = infiniteScroll.prevPage) == null ? void 0 : _infiniteScroll$prevP2.hasMore]);
   useImperativeHandle(forwardedRef, function () {
     return {
       virtualListRef: listRef,
@@ -187,8 +187,8 @@ var VirtualTable = function VirtualTable(props, forwardedRef) {
 
   function getSelectedRecords() {
     if (selection) {
-      var _ref = selection,
-          selectedRowKeys = _ref.selectedRowKeys;
+      var _ref2 = selection,
+          selectedRowKeys = _ref2.selectedRowKeys;
       var selectedRows = [];
       allData.forEach(function (row) {
         var key = getRowKey(row);
@@ -214,11 +214,11 @@ var VirtualTable = function VirtualTable(props, forwardedRef) {
   }
 
   var renderRowSelection = useCallback(function (key, record) {
-    var _ref2 = selection,
-        selectedRowKeys = _ref2.selectedRowKeys,
-        limit = _ref2.limit,
-        independentSelectionExpandedRows = _ref2.independentSelectionExpandedRows,
-        onChange = _ref2.onChange;
+    var _ref3 = selection,
+        selectedRowKeys = _ref3.selectedRowKeys,
+        limit = _ref3.limit,
+        independentSelectionExpandedRows = _ref3.independentSelectionExpandedRows,
+        onChange = _ref3.onChange;
     return /*#__PURE__*/React.createElement(RowSelectionColumn, {
       rowKey: rowKey,
       record: record,
@@ -239,13 +239,13 @@ var VirtualTable = function VirtualTable(props, forwardedRef) {
     }, !!rowStar && rowStarColumn].concat(columns));
   }, [selection, renderRowSelection, rowStar, rowStarColumn, columns]);
   var mergedColumns = useMemo(function () {
-    var widthColumnCount = virtualColumns.filter(function (_ref3) {
-      var width = _ref3.width;
+    var widthColumnCount = virtualColumns.filter(function (_ref4) {
+      var width = _ref4.width;
       return !width;
     }).length;
     var rowWidth = tableWidth || initialWidth;
-    var definedWidth = virtualColumns.reduce(function (total, _ref4) {
-      var width = _ref4.width;
+    var definedWidth = virtualColumns.reduce(function (total, _ref5) {
+      var width = _ref5.width;
       var widthInPx = calculatePixels(width) || 0;
       return total + widthInPx;
     }, 0);
@@ -315,9 +315,9 @@ var VirtualTable = function VirtualTable(props, forwardedRef) {
 
     return [].concat(fixedLeft, remaining, fixedRight);
   }, [virtualColumns, tableWidth, initialWidth]);
-  var listInnerElementType = forwardRef(function (_ref5, innerElementRef) {
-    var style = _ref5.style,
-        rest = _objectWithoutPropertiesLoose(_ref5, _excluded);
+  var listInnerElementType = forwardRef(function (_ref6, innerElementRef) {
+    var style = _ref6.style,
+        rest = _objectWithoutPropertiesLoose(_ref6, _excluded);
 
     return /*#__PURE__*/React.createElement(S.InnerListElement, _extends({
       ref: innerElementRef,
@@ -403,9 +403,9 @@ var VirtualTable = function VirtualTable(props, forwardedRef) {
       var listHeight = data.length * cellHeight - scroll.y + infiniteLoaderItemHeight;
       var listMaxScroll = stickyScrollThreshold && infiniteScroll != null && infiniteScroll.maxScroll ? (infiniteScroll == null ? void 0 : infiniteScroll.maxScroll) - stickyScrollThreshold : listHeight;
 
-      var handleListScroll = function handleListScroll(_ref6) {
-        var scrollOffset = _ref6.scrollOffset,
-            scrollDirection = _ref6.scrollDirection;
+      var handleListScroll = function handleListScroll(_ref7) {
+        var scrollOffset = _ref7.scrollOffset,
+            scrollDirection = _ref7.scrollDirection;
 
         if (loading || listMaxScroll <= 0) {
           return;
@@ -528,8 +528,8 @@ var VirtualTable = function VirtualTable(props, forwardedRef) {
     key: "relative-container",
     ref: containerRef
   }, /*#__PURE__*/React.createElement(ResizeObserver, {
-    onResize: function onResize(_ref7) {
-      var offsetWidth = _ref7.offsetWidth;
+    onResize: function onResize(_ref8) {
+      var offsetWidth = _ref8.offsetWidth;
       setTableWidth(offsetWidth);
     }
   }, /*#__PURE__*/React.createElement(DSTable, _extends({}, props, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-table",
-  "version": "0.49.0",
+  "version": "0.49.1",
   "description": "Table UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "synerise/synerise-design",
@@ -38,7 +38,7 @@
     "@synerise/ds-button": "^0.19.7",
     "@synerise/ds-button-group": "^0.6.47",
     "@synerise/ds-checkbox": "^0.11.63",
-    "@synerise/ds-column-manager": "^0.11.42",
+    "@synerise/ds-column-manager": "^0.11.43",
     "@synerise/ds-data-format": "^0.4.8",
     "@synerise/ds-dropdown": "^0.17.105",
     "@synerise/ds-flag": "^0.4.3",
@@ -79,5 +79,5 @@
   "devDependencies": {
     "@testing-library/react": "10.0.1"
   },
-  "gitHead": "9ac88a61f9511ed9862372e63079aab27bb7511b"
+  "gitHead": "2b3ed7503dacc36c207049a5a3e81bfe190de0be"
 }