@synerise/ds-table 0.60.3 → 0.60.4

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 (6) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/ColumnSortMenu/SortRenderer.d.ts +2 -2
  3. package/dist/ColumnSortMenu/SortRenderer.js +32 -24
  4. package/dist/TableHeader/TableSelection.d.ts +6 -5
  5. package/dist/TableHeader/TableSelection.js +41 -35
  6. package/package.json +23 -23
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [0.60.4](https://github.com/synerise/synerise-design/compare/@synerise/ds-table@0.60.3...@synerise/ds-table@0.60.4) (2024-11-28)
7
+
8
+ **Note:** Version bump only for package @synerise/ds-table
9
+
10
+
11
+
12
+
13
+
6
14
  ## [0.60.3](https://github.com/synerise/synerise-design/compare/@synerise/ds-table@0.60.2...@synerise/ds-table@0.60.3) (2024-11-22)
7
15
 
8
16
  **Note:** Version bump only for package @synerise/ds-table
package/dist/ColumnSortMenu/SortRenderer.d.ts CHANGED
@@ -1,11 +1,11 @@
1
1
  import React from 'react';
2
2
  import { DSColumnType, OnSortFn } from '../Table.types';
3
3
  import { SortStateAPI } from './useSortState';
4
- interface SortRendererProps<T> {
4
+ type SortRendererProps<T> = {
5
5
  sortStateApi: SortStateAPI;
6
6
  column: DSColumnType<T>;
7
7
  onSort?: OnSortFn;
8
- }
8
+ };
9
9
  export declare const CommonRenderer: <T extends unknown>({ column, sortStateApi }: SortRendererProps<T>) => React.JSX.Element;
10
10
  export declare const StringRenderer: <T extends unknown>({ column, sortStateApi }: SortRendererProps<T>) => React.JSX.Element;
11
11
  export {};
package/dist/ColumnSortMenu/SortRenderer.js CHANGED
@@ -22,6 +22,35 @@ export var CommonRenderer = function CommonRenderer(_ref) {
22
22
  isDropdownVisible = _useState[0],
23
23
  setIsDropdownVisible = _useState[1];
24
24
  var locale = useTableLocaleContext();
25
+ var menuDataSource = [{
26
+ key: 'ascend',
27
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
28
+ component: /*#__PURE__*/React.createElement(SortAscendingM, null)
29
+ }),
30
+ suffixel: /*#__PURE__*/React.createElement(CheckIcon, {
31
+ isActive: columnSortOrder === 'ascend'
32
+ }),
33
+ text: locale.columnSortAscend
34
+ }, {
35
+ key: 'descend',
36
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
37
+ component: /*#__PURE__*/React.createElement(SortDescendingM, null)
38
+ }),
39
+ suffixel: /*#__PURE__*/React.createElement(CheckIcon, {
40
+ isActive: columnSortOrder === 'descend'
41
+ }),
42
+ text: locale.columnSortDescend
43
+ }];
44
+ if (columnSortOrder) {
45
+ menuDataSource.push({
46
+ key: 'null',
47
+ type: 'danger',
48
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
49
+ component: /*#__PURE__*/React.createElement(Close2M, null)
50
+ }),
51
+ text: locale.columnSortClear
52
+ });
53
+ }
25
54
  return /*#__PURE__*/React.createElement(Dropdown, {
26
55
  onVisibleChange: function onVisibleChange(isVisible) {
27
56
  if (isVisible !== isDropdownVisible) {
@@ -40,30 +69,9 @@ export var CommonRenderer = function CommonRenderer(_ref) {
40
69
  },
41
70
  style: {
42
71
  width: 220
43
- }
44
- }, /*#__PURE__*/React.createElement(Menu.Item, {
45
- key: "ascend",
46
- prefixel: /*#__PURE__*/React.createElement(Icon, {
47
- component: /*#__PURE__*/React.createElement(SortAscendingM, null)
48
- }),
49
- suffixel: /*#__PURE__*/React.createElement(CheckIcon, {
50
- isActive: columnSortOrder === 'ascend'
51
- })
52
- }, locale.columnSortAscend), /*#__PURE__*/React.createElement(Menu.Item, {
53
- key: "descend",
54
- prefixel: /*#__PURE__*/React.createElement(Icon, {
55
- component: /*#__PURE__*/React.createElement(SortDescendingM, null)
56
- }),
57
- suffixel: /*#__PURE__*/React.createElement(CheckIcon, {
58
- isActive: columnSortOrder === 'descend'
59
- })
60
- }, locale.columnSortDescend), !!columnSortOrder && /*#__PURE__*/React.createElement(Menu.Item, {
61
- key: "null",
62
- type: "danger",
63
- prefixel: /*#__PURE__*/React.createElement(Icon, {
64
- component: /*#__PURE__*/React.createElement(Close2M, null)
65
- })
66
- }, locale.columnSortClear)))
72
+ },
73
+ dataSource: menuDataSource
74
+ }))
67
75
  }, /*#__PURE__*/React.createElement(S.ToggleButton, {
68
76
  isVisible: isDropdownVisible,
69
77
  type: "ghost",
package/dist/TableHeader/TableSelection.d.ts CHANGED
@@ -1,7 +1,8 @@
1
- import type { ReactElement, ReactText } from 'react';
2
- import { Props } from './TableSelection.types';
3
- declare function TableSelection<T extends {
1
+ import React from 'react';
2
+ import type { ReactText } from 'react';
3
+ import type { Props } from './TableSelection.types';
4
+ declare const TableSelection: <T extends {
4
5
  key: ReactText;
5
- children?: T[];
6
- }>({ dataSource, dataSourceFull, selection, rowKey, locale, childrenColumnName, }: Props<T>): ReactElement | null;
6
+ children?: T[] | undefined;
7
+ }>({ dataSource, dataSourceFull, selection, rowKey, locale, childrenColumnName, }: Props<T>) => React.JSX.Element | null;
7
8
  export default TableSelection;
package/dist/TableHeader/TableSelection.js CHANGED
@@ -1,6 +1,10 @@
1
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
2
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
3
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
4
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
5
+ function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
1
6
  import React, { useCallback, useMemo } from 'react';
2
7
  import Dropdown from '@synerise/ds-dropdown';
3
- import Menu from '@synerise/ds-menu';
4
8
  import Button from '@synerise/ds-button';
5
9
  import Tooltip from '@synerise/ds-tooltip';
6
10
  import Icon, { OptionVerticalM } from '@synerise/ds-icon';
@@ -8,9 +12,7 @@ import * as S from '../Table.styles';
8
12
  import { SELECTION_ALL, SELECTION_INVERT } from '../Table';
9
13
  import { useRowKey } from '../hooks/useRowKey';
10
14
  import { isRecordSelectable } from '../utils';
11
-
12
- // @ts-ignore
13
- function TableSelection(_ref) {
15
+ var TableSelection = function TableSelection(_ref) {
14
16
  var dataSource = _ref.dataSource,
15
17
  dataSourceFull = _ref.dataSourceFull,
16
18
  selection = _ref.selection,
@@ -172,6 +174,37 @@ function TableSelection(_ref) {
172
174
  return allSelectableRecordsCount === selectedKeysInDataSourceCount;
173
175
  }, [isEmpty, selection, isShowingSubset, dataSource, allSelectableRecordsCount, childrenColumnName, getRowKey]);
174
176
  var selectionTooltipTitle = !allSelected ? locale == null ? void 0 : locale.selectAllTooltip : locale == null ? void 0 : locale.unselectAll;
177
+ var menuDataSource = useMemo(function () {
178
+ var _selection$selections;
179
+ return selection == null || (_selection$selections = selection.selections) == null ? void 0 : _selection$selections.filter(Boolean).map(function (selectionMenuElement) {
180
+ switch (selectionMenuElement) {
181
+ case SELECTION_ALL:
182
+ {
183
+ return !allSelected ? {
184
+ onClick: selectAll,
185
+ text: locale == null ? void 0 : locale.selectAll
186
+ } : {
187
+ onClick: unselectAll,
188
+ text: locale == null ? void 0 : locale.unselectAll
189
+ };
190
+ }
191
+ case SELECTION_INVERT:
192
+ {
193
+ return {
194
+ onClick: selectInvert,
195
+ text: locale == null ? void 0 : locale.selectInvert
196
+ };
197
+ }
198
+ default:
199
+ {
200
+ var sel = selectionMenuElement;
201
+ return _objectSpread({}, sel, {
202
+ text: sel.label
203
+ });
204
+ }
205
+ }
206
+ });
207
+ }, [allSelected, locale == null ? void 0 : locale.selectAll, locale == null ? void 0 : locale.selectInvert, locale == null ? void 0 : locale.unselectAll, selectAll, selectInvert, selection == null ? void 0 : selection.selections, unselectAll]);
175
208
  return selection != null && selection.selectedRowKeys ? /*#__PURE__*/React.createElement(S.Selection, {
176
209
  "data-popup-container": true
177
210
  }, /*#__PURE__*/React.createElement(Tooltip, {
@@ -191,36 +224,9 @@ function TableSelection(_ref) {
191
224
  })), (selection == null ? void 0 : selection.selections) && /*#__PURE__*/React.createElement(Dropdown, {
192
225
  disabled: isEmpty || allSelectableRecordsCount === 0,
193
226
  trigger: ['click'],
194
- overlay: /*#__PURE__*/React.createElement(S.SelectionMenu, null, selection == null ? void 0 : selection.selections.filter(Boolean).map(function (selectionMenuElement) {
195
- switch (selectionMenuElement) {
196
- case SELECTION_ALL:
197
- {
198
- return !allSelected ? /*#__PURE__*/React.createElement(Menu.Item, {
199
- onClick: selectAll
200
- }, locale == null ? void 0 : locale.selectAll) : /*#__PURE__*/React.createElement(Menu.Item, {
201
- onClick: unselectAll
202
- }, locale == null ? void 0 : locale.unselectAll);
203
- }
204
- case SELECTION_INVERT:
205
- {
206
- return /*#__PURE__*/React.createElement(Menu.Item, {
207
- onClick: selectInvert
208
- }, locale == null ? void 0 : locale.selectInvert);
209
- }
210
- default:
211
- {
212
- var sel = selectionMenuElement;
213
- return (
214
- /*#__PURE__*/
215
- // eslint-disable-next-line react/jsx-handler-names
216
- React.createElement(Menu.Item, {
217
- key: sel.key,
218
- onClick: sel.onClick
219
- }, sel.label)
220
- );
221
- }
222
- }
223
- }))
227
+ overlay: /*#__PURE__*/React.createElement(S.SelectionMenu, {
228
+ dataSource: menuDataSource
229
+ })
224
230
  }, /*#__PURE__*/React.createElement(Tooltip, {
225
231
  title: locale == null ? void 0 : locale.selectionOptionsTooltip
226
232
  }, /*#__PURE__*/React.createElement(Button, {
@@ -229,5 +235,5 @@ function TableSelection(_ref) {
229
235
  }, /*#__PURE__*/React.createElement(Icon, {
230
236
  component: /*#__PURE__*/React.createElement(OptionVerticalM, null)
231
237
  }))))) : null;
232
- }
238
+ };
233
239
  export default TableSelection;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-table",
3
- "version": "0.60.3",
3
+ "version": "0.60.4",
4
4
  "description": "Table UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "synerise/synerise-design",
@@ -34,30 +34,30 @@
34
34
  ],
35
35
  "types": "dist/index.d.ts",
36
36
  "dependencies": {
37
- "@synerise/ds-alert": "^0.8.38",
38
- "@synerise/ds-badge": "^0.8.19",
39
- "@synerise/ds-button": "^0.21.19",
40
- "@synerise/ds-button-group": "^0.7.23",
41
- "@synerise/ds-checkbox": "^0.12.17",
42
- "@synerise/ds-column-manager": "^0.13.3",
37
+ "@synerise/ds-alert": "^0.8.39",
38
+ "@synerise/ds-badge": "^0.8.20",
39
+ "@synerise/ds-button": "^0.21.20",
40
+ "@synerise/ds-button-group": "^0.7.24",
41
+ "@synerise/ds-checkbox": "^0.12.18",
42
+ "@synerise/ds-column-manager": "^0.13.4",
43
43
  "@synerise/ds-data-format": "^0.6.1",
44
- "@synerise/ds-dropdown": "^0.18.24",
44
+ "@synerise/ds-dropdown": "^0.18.25",
45
45
  "@synerise/ds-flag": "^0.5.3",
46
- "@synerise/ds-icon": "^0.67.0",
47
- "@synerise/ds-input": "^0.24.14",
46
+ "@synerise/ds-icon": "^0.67.1",
47
+ "@synerise/ds-input": "^0.24.15",
48
48
  "@synerise/ds-loader": "^0.3.22",
49
- "@synerise/ds-menu": "^0.20.6",
50
- "@synerise/ds-modal": "^0.17.51",
51
- "@synerise/ds-pagination": "^0.7.71",
52
- "@synerise/ds-result": "^0.7.14",
53
- "@synerise/ds-scrollbar": "^0.11.19",
54
- "@synerise/ds-search": "^0.9.19",
55
- "@synerise/ds-select": "^0.16.26",
56
- "@synerise/ds-skeleton": "^0.6.18",
57
- "@synerise/ds-status": "^0.6.33",
58
- "@synerise/ds-tags": "^0.10.18",
59
- "@synerise/ds-tooltip": "^0.14.49",
60
- "@synerise/ds-typography": "^0.16.6",
49
+ "@synerise/ds-menu": "^0.20.7",
50
+ "@synerise/ds-modal": "^0.17.52",
51
+ "@synerise/ds-pagination": "^0.7.72",
52
+ "@synerise/ds-result": "^0.7.15",
53
+ "@synerise/ds-scrollbar": "^0.11.20",
54
+ "@synerise/ds-search": "^0.9.20",
55
+ "@synerise/ds-select": "^0.16.27",
56
+ "@synerise/ds-skeleton": "^0.6.19",
57
+ "@synerise/ds-status": "^0.6.34",
58
+ "@synerise/ds-tags": "^0.10.19",
59
+ "@synerise/ds-tooltip": "^0.14.50",
60
+ "@synerise/ds-typography": "^0.16.7",
61
61
  "@synerise/ds-utils": "^0.31.2",
62
62
  "@types/react-window": "^1.8.5",
63
63
  "classnames": "2.3.2",
@@ -77,5 +77,5 @@
77
77
  "react-intl": ">=3.12.0 <= 6.8",
78
78
  "styled-components": "5.0.1"
79
79
  },
80
- "gitHead": "e9897e5ecb13a9c022f5ed002db76e4ab78318c5"
80
+ "gitHead": "4a56ee7ef816c22341ce704154dc7aa65b7d1dcc"
81
81
  }