@synerise/ds-table 0.45.36 → 0.46.0

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.46.0](https://github.com/synerise/synerise-design/compare/@synerise/ds-table@0.45.37...@synerise/ds-table@0.46.0) (2023-03-13)
+
+
+### Features
+
+* **table:** adds formatting for numbers in table title ([7c6bb72](https://github.com/synerise/synerise-design/commit/7c6bb7242de71ec4c1d1cfbc9c50f6df2eefacb9))
+
+
+
+
+
+## [0.45.37](https://github.com/synerise/synerise-design/compare/@synerise/ds-table@0.45.36...@synerise/ds-table@0.45.37) (2023-03-09)
+
+**Note:** Version bump only for package @synerise/ds-table
+
+
+
+
+
 ## [0.45.36](https://github.com/synerise/synerise-design/compare/@synerise/ds-table@0.45.35...@synerise/ds-table@0.45.36) (2023-03-08)
 
 **Note:** Version bump only for package @synerise/ds-table

package/dist/TableHeader/TableHeader.js

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import Tooltip from '@synerise/ds-tooltip';
+import { useDataFormat } from '@synerise/ds-data-format';
 import * as S from '../Table.styles';
 import FilterTrigger from '../FilterTrigger/FilterTrigger';
 import TableSelection from './TableSelection';
@@ -26,6 +27,10 @@ var TableHeader = function TableHeader(_ref) {
       locale = _ref.locale,
       renderSelectionTitle = _ref.renderSelectionTitle,
       hideTitlePart = _ref.hideTitlePart;
+
+  var _useDataFormat = useDataFormat(),
+      formatValue = _useDataFormat.formatValue;
+
   var titleRef = React.useRef(null);
 
   var _React$useState = React.useState(false),
@@ -53,7 +58,7 @@ var TableHeader = function TableHeader(_ref) {
       dataSource: dataSource,
       selection: selection,
       locale: locale
-    }), renderSelectionTitle ? renderSelectionTitle(selection, filters) : /*#__PURE__*/React.createElement(S.TitleContainer, null, /*#__PURE__*/React.createElement(S.TitlePart, null, /*#__PURE__*/React.createElement("strong", null, selectedRows), " ", /*#__PURE__*/React.createElement("span", null, locale.selected))), itemsMenu) : /*#__PURE__*/React.createElement(S.Left, {
+    }), renderSelectionTitle ? renderSelectionTitle(selection, filters) : /*#__PURE__*/React.createElement(S.TitleContainer, null, /*#__PURE__*/React.createElement(S.TitlePart, null, /*#__PURE__*/React.createElement("strong", null, formatValue(selectedRows)), " ", /*#__PURE__*/React.createElement("span", null, locale.selected))), itemsMenu) : /*#__PURE__*/React.createElement(S.Left, {
       "data-testid": "ds-table-title"
     }, selection && /*#__PURE__*/React.createElement(TableSelection, {
       rowKey: rowKey,
@@ -69,8 +74,8 @@ var TableHeader = function TableHeader(_ref) {
       ref: titleRef
     }, title)) : /*#__PURE__*/React.createElement("strong", {
       ref: titleRef
-    }, title)), !hideTitlePart && /*#__PURE__*/React.createElement(S.TitleSeparator, null)), !hideTitlePart && /*#__PURE__*/React.createElement(S.TitlePart, null, /*#__PURE__*/React.createElement("strong", null, dataSource.length), " ", /*#__PURE__*/React.createElement("span", null, locale.pagination.items))));
-  }, [dataSource, titleRef, filters, isTitleTruncated, itemsMenu, locale, renderSelectionTitle, rowKey, selectedRows, selection, title, hideTitlePart]);
+    }, title)), !hideTitlePart && /*#__PURE__*/React.createElement(S.TitleSeparator, null)), !hideTitlePart && /*#__PURE__*/React.createElement(S.TitlePart, null, /*#__PURE__*/React.createElement("strong", null, formatValue(dataSource.length)), " ", /*#__PURE__*/React.createElement("span", null, locale.pagination.items))));
+  }, [selection, dataSource, itemsMenu, locale, selectedRows, rowKey, renderSelectionTitle, filters, formatValue, title, isTitleTruncated, hideTitlePart]);
   return /*#__PURE__*/React.createElement(S.Header, {
     withBorderTop: withBorderTop
   }, renderLeftSide, /*#__PURE__*/React.createElement(S.Right, null, headerButton, filters == null ? void 0 : filters.map(function (filter) {

package/dist/TableHeader/TableLimit/TableLimit.js

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import Alert from '@synerise/ds-alert';
+import { useDataFormat } from '@synerise/ds-data-format';
 import * as S from './TableLimit.styles';
 // eslint-disable-next-line import/prefer-default-export
 export function TableLimit(_ref) {
@@ -7,6 +8,10 @@ export function TableLimit(_ref) {
       locale = _ref.locale,
       itemsMenu = _ref.itemsMenu,
       selection = _ref.selection;
+
+  var _useDataFormat = useDataFormat(),
+      formatValue = _useDataFormat.formatValue;
+
   var selectedRows = React.useMemo(function () {
     return (selection == null ? void 0 : selection.selectedRowKeys.length) || 0;
   }, [selection]);
@@ -19,7 +24,7 @@ export function TableLimit(_ref) {
   var selected = React.useMemo(function () {
     var _locale$pagination, _locale$pagination2;
 
-    return selectedRows > 0 ? /*#__PURE__*/React.createElement(S.Title, null, /*#__PURE__*/React.createElement("strong", null, selectedRows), " ", locale.selected, " / ", total + " " + ((_locale$pagination = locale.pagination) == null ? void 0 : _locale$pagination.items)) : /*#__PURE__*/React.createElement(S.Title, null, /*#__PURE__*/React.createElement("strong", null, total), " ", (_locale$pagination2 = locale.pagination) == null ? void 0 : _locale$pagination2.items);
-  }, [locale.pagination, locale.selected, selectedRows, total]);
+    return selectedRows > 0 ? /*#__PURE__*/React.createElement(S.Title, null, /*#__PURE__*/React.createElement("strong", null, formatValue(selectedRows)), " ", locale.selected, " /", ' ', formatValue(total) + " " + ((_locale$pagination = locale.pagination) == null ? void 0 : _locale$pagination.items)) : /*#__PURE__*/React.createElement(S.Title, null, /*#__PURE__*/React.createElement("strong", null, formatValue(total)), " ", (_locale$pagination2 = locale.pagination) == null ? void 0 : _locale$pagination2.items);
+  }, [formatValue, locale.pagination, locale.selected, selectedRows, total]);
   return /*#__PURE__*/React.createElement(S.TableLimit, null, selected, limitReachedInfo, selectedRows > 0 && /*#__PURE__*/React.createElement(S.ItemsMenu, null, itemsMenu));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-table",
-  "version": "0.45.36",
+  "version": "0.46.0",
   "description": "Table UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "synerise/synerise-design",
@@ -37,6 +37,7 @@
     "@synerise/ds-button-group": "^0.6.19",
     "@synerise/ds-checkbox": "^0.11.29",
     "@synerise/ds-column-manager": "^0.10.57",
+    "@synerise/ds-data-format": "^0.2.0",
     "@synerise/ds-dropdown": "^0.17.56",
     "@synerise/ds-flag": "^0.4.0",
     "@synerise/ds-icon": "^0.54.0",
@@ -46,7 +47,7 @@
     "@synerise/ds-pagination": "^0.7.19",
     "@synerise/ds-search": "^0.8.42",
     "@synerise/ds-search-bar": "^0.6.26",
-    "@synerise/ds-select": "^0.15.0",
+    "@synerise/ds-select": "^0.15.1",
     "@synerise/ds-skeleton": "^0.2.29",
     "@synerise/ds-status": "^0.5.57",
     "@synerise/ds-tags": "^0.7.13",
@@ -66,5 +67,5 @@
     "antd": "^4",
     "react": ">=16.9.0 < 17.0.0"
   },
-  "gitHead": "55d4a4dfa9230bea883b887e4457ca86f8509d83"
+  "gitHead": "6afa5b44013a3aaffc07b2b05ce2b5af2e76fd28"
 }