@synerise/ds-sidebar-object 0.6.164 → 0.6.166

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 (4) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/Elements/DropdownOverlay/DropdownOverlay.js +20 -14
  3. package/dist/Elements/Header/Header.js +64 -46
  4. package/package.json +13 -13
package/CHANGELOG.md CHANGED
@@ -3,6 +3,22 @@
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.6.166](https://github.com/Synerise/synerise-design/compare/@synerise/ds-sidebar-object@0.6.165...@synerise/ds-sidebar-object@0.6.166) (2024-12-04)
7
+
8
+ **Note:** Version bump only for package @synerise/ds-sidebar-object
9
+
10
+
11
+
12
+
13
+
14
+ ## [0.6.165](https://github.com/Synerise/synerise-design/compare/@synerise/ds-sidebar-object@0.6.164...@synerise/ds-sidebar-object@0.6.165) (2024-11-29)
15
+
16
+ **Note:** Version bump only for package @synerise/ds-sidebar-object
17
+
18
+
19
+
20
+
21
+
6
22
  ## [0.6.164](https://github.com/Synerise/synerise-design/compare/@synerise/ds-sidebar-object@0.6.163...@synerise/ds-sidebar-object@0.6.164) (2024-11-28)
7
23
 
8
24
  **Note:** Version bump only for package @synerise/ds-sidebar-object
package/dist/Elements/DropdownOverlay/DropdownOverlay.js CHANGED
@@ -1,4 +1,4 @@
1
- import React, { useRef } from 'react';
1
+ import React, { useMemo, useRef } from 'react';
2
2
  import Dropdown from '@synerise/ds-dropdown';
3
3
  import Menu from '@synerise/ds-menu';
4
4
  import Icon, { Add3M, FolderM, SearchM } from '@synerise/ds-icon';
@@ -27,6 +27,22 @@ var DropdownOverlay = function DropdownOverlay(_ref) {
27
27
  useOnClickOutside(ref, function () {
28
28
  onDropdownOutsideClick && onDropdownOutsideClick();
29
29
  });
30
+ var menuDataSource = useMemo(function () {
31
+ return filteredData == null ? void 0 : filteredData.map(function (item) {
32
+ return {
33
+ key: item[foldersIdKey] + "-" + item.id,
34
+ onClick: function onClick() {
35
+ return onFolderSelect(item);
36
+ },
37
+ checked: parentFolder[foldersIdKey] === item[foldersIdKey],
38
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
39
+ component: /*#__PURE__*/React.createElement(FolderM, null)
40
+ }),
41
+ highlight: searchValue,
42
+ text: item[foldersDisplayKey]
43
+ };
44
+ });
45
+ }, [filteredData, foldersDisplayKey, foldersIdKey, onFolderSelect, parentFolder, searchValue]);
30
46
  return /*#__PURE__*/React.createElement(DropdownWrapper, {
31
47
  ref: ref
32
48
  }, /*#__PURE__*/React.createElement(Dropdown.SearchInput, {
@@ -41,19 +57,9 @@ var DropdownOverlay = function DropdownOverlay(_ref) {
41
57
  autofocus: true
42
58
  }), /*#__PURE__*/React.createElement(MenuWrapper, {
43
59
  withBottomAction: !!onAddFolderClick
44
- }, (filteredData == null ? void 0 : filteredData.length) > 0 ? /*#__PURE__*/React.createElement(Menu, null, filteredData == null ? void 0 : filteredData.map(function (item) {
45
- return /*#__PURE__*/React.createElement(Menu.Item, {
46
- key: item[foldersIdKey] + "-" + item.id,
47
- onClick: function onClick() {
48
- return onFolderSelect(item);
49
- },
50
- checked: parentFolder[foldersIdKey] === item[foldersIdKey],
51
- prefixel: /*#__PURE__*/React.createElement(Icon, {
52
- component: /*#__PURE__*/React.createElement(FolderM, null)
53
- }),
54
- highlight: searchValue
55
- }, item[foldersDisplayKey]);
56
- })) : /*#__PURE__*/React.createElement(Result, {
60
+ }, (filteredData == null ? void 0 : filteredData.length) > 0 ? /*#__PURE__*/React.createElement(Menu, {
61
+ dataSource: menuDataSource
62
+ }) : /*#__PURE__*/React.createElement(Result, {
57
63
  type: "no-results"
58
64
  })), onAddFolderClick && /*#__PURE__*/React.createElement(Dropdown.BottomAction, {
59
65
  onClickAction: function onClickAction() {
package/dist/Elements/Header/Header.js CHANGED
@@ -3,7 +3,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
3
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
4
  function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
5
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); }
6
- import React, { useState, useRef } from 'react';
6
+ import React, { useState, useRef, useMemo } from 'react';
7
7
  import Typography from '@synerise/ds-typography';
8
8
  import Drawer from '@synerise/ds-drawer';
9
9
  import Button from '@synerise/ds-button';
@@ -66,6 +66,67 @@ var Header = function Header(_ref) {
66
66
  };
67
67
  var renderMenu = !!(onEdit || onDelete || onDuplicate || onMove || onId);
68
68
  var renderMenuDivider = !!((onEdit || onDelete || onDuplicate || onMove) && onId);
69
+ var menuDataSource = useMemo(function () {
70
+ var menuItems = [];
71
+ onEdit && menuItems.push({
72
+ onClick: function onClick() {
73
+ setDropdownVisible(!dropdownVisible);
74
+ onEdit(inputObject);
75
+ },
76
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
77
+ component: /*#__PURE__*/React.createElement(EditM, null)
78
+ }),
79
+ text: texts.editIcon
80
+ });
81
+ onDuplicate && menuItems.push({
82
+ onClick: function onClick() {
83
+ setDropdownVisible(!dropdownVisible);
84
+ onDuplicate(inputObject);
85
+ },
86
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
87
+ component: /*#__PURE__*/React.createElement(DuplicateM, null)
88
+ }),
89
+ text: texts.duplicateIcon
90
+ });
91
+ onMove && menuItems.push({
92
+ onClick: function onClick() {
93
+ setDropdownVisible(!dropdownVisible);
94
+ onMove(inputObject);
95
+ },
96
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
97
+ component: /*#__PURE__*/React.createElement(FolderM, null)
98
+ }),
99
+ text: texts.moveIcon
100
+ });
101
+ onDelete && menuItems.push({
102
+ onClick: function onClick() {
103
+ setDropdownVisible(!dropdownVisible);
104
+ onDelete(inputObject);
105
+ },
106
+ type: 'danger',
107
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
108
+ component: /*#__PURE__*/React.createElement(TrashM, null)
109
+ }),
110
+ text: texts.deleteIcon
111
+ });
112
+ renderMenuDivider && menuItems.push({
113
+ type: 'divider'
114
+ });
115
+ onId && menuItems.push({
116
+ onClick: function onClick() {
117
+ setDropdownVisible(!dropdownVisible);
118
+ onId(inputObject);
119
+ },
120
+ style: {
121
+ padding: '0 12px'
122
+ },
123
+ prefixel: /*#__PURE__*/React.createElement(Icon, {
124
+ component: /*#__PURE__*/React.createElement(CopyClipboardM, null)
125
+ }),
126
+ text: "ID: " + inputObject[inputObjectIdKey]
127
+ });
128
+ return menuItems;
129
+ }, [dropdownVisible, inputObject, inputObjectIdKey, onDelete, onDuplicate, onEdit, onId, onMove, renderMenuDivider, texts.deleteIcon, texts.duplicateIcon, texts.editIcon, texts.moveIcon]);
69
130
  var renderActionButtons = function renderActionButtons(typesOfButtons) {
70
131
  if (typesOfButtons === ButtonVariant.WITH_NAVIGATION) {
71
132
  return /*#__PURE__*/React.createElement(React.Fragment, null, onArrowUp && /*#__PURE__*/React.createElement(S.ButtonWrapper, null, /*#__PURE__*/React.createElement(Button, {
@@ -91,52 +152,9 @@ var Header = function Header(_ref) {
91
152
  asDropdownMenu: true,
92
153
  style: {
93
154
  width: '100%'
94
- }
95
- }, onEdit && /*#__PURE__*/React.createElement(Menu.Item, {
96
- onClick: function onClick() {
97
- setDropdownVisible(!dropdownVisible);
98
- onEdit(inputObject);
99
- },
100
- prefixel: /*#__PURE__*/React.createElement(Icon, {
101
- component: /*#__PURE__*/React.createElement(EditM, null)
102
- })
103
- }, texts.editIcon), onDuplicate && /*#__PURE__*/React.createElement(Menu.Item, {
104
- onClick: function onClick() {
105
- setDropdownVisible(!dropdownVisible);
106
- onDuplicate(inputObject);
107
- },
108
- prefixel: /*#__PURE__*/React.createElement(Icon, {
109
- component: /*#__PURE__*/React.createElement(DuplicateM, null)
110
- })
111
- }, texts.duplicateIcon), onMove && /*#__PURE__*/React.createElement(Menu.Item, {
112
- onClick: function onClick() {
113
- setDropdownVisible(!dropdownVisible);
114
- onMove(inputObject);
115
- },
116
- prefixel: /*#__PURE__*/React.createElement(Icon, {
117
- component: /*#__PURE__*/React.createElement(FolderM, null)
118
- })
119
- }, texts.moveIcon), onDelete && /*#__PURE__*/React.createElement(Menu.Item, {
120
- onClick: function onClick() {
121
- setDropdownVisible(!dropdownVisible);
122
- onDelete(inputObject);
123
- },
124
- type: "danger",
125
- prefixel: /*#__PURE__*/React.createElement(Icon, {
126
- component: /*#__PURE__*/React.createElement(TrashM, null)
127
- })
128
- }, texts.deleteIcon), renderMenuDivider && /*#__PURE__*/React.createElement(Menu.Divider, null), onId && /*#__PURE__*/React.createElement(Menu.Item, {
129
- onClick: function onClick() {
130
- setDropdownVisible(!dropdownVisible);
131
- onId(inputObject);
132
- },
133
- style: {
134
- padding: '0 12px'
135
155
  },
136
- prefixel: /*#__PURE__*/React.createElement(Icon, {
137
- component: /*#__PURE__*/React.createElement(CopyClipboardM, null)
138
- })
139
- }, "ID: " + inputObject[inputObjectIdKey])))
156
+ dataSource: menuDataSource
157
+ }))
140
158
  }, /*#__PURE__*/React.createElement(S.ButtonWrapper, {
141
159
  "data-testid": "sidebar-object-dropdown-menu-trigger"
142
160
  }, /*#__PURE__*/React.createElement(Button, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-sidebar-object",
3
- "version": "0.6.164",
3
+ "version": "0.6.166",
4
4
  "description": "SidebarObject UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -34,18 +34,18 @@
34
34
  ],
35
35
  "types": "dist/index.d.ts",
36
36
  "dependencies": {
37
- "@synerise/ds-button": "^0.21.20",
38
- "@synerise/ds-description": "^0.4.3",
37
+ "@synerise/ds-button": "^0.22.0",
38
+ "@synerise/ds-description": "^0.4.5",
39
39
  "@synerise/ds-drawer": "^0.6.31",
40
- "@synerise/ds-dropdown": "^0.18.25",
41
- "@synerise/ds-icon": "^0.67.1",
42
- "@synerise/ds-inline-edit": "^0.9.2",
43
- "@synerise/ds-menu": "^0.20.7",
44
- "@synerise/ds-result": "^0.7.15",
45
- "@synerise/ds-scrollbar": "^0.11.20",
46
- "@synerise/ds-subtle-form": "^0.9.137",
47
- "@synerise/ds-tabs": "^0.17.8",
48
- "@synerise/ds-typography": "^0.16.7",
40
+ "@synerise/ds-dropdown": "^0.18.27",
41
+ "@synerise/ds-icon": "^0.68.0",
42
+ "@synerise/ds-inline-edit": "^0.9.4",
43
+ "@synerise/ds-menu": "^0.20.9",
44
+ "@synerise/ds-result": "^0.7.17",
45
+ "@synerise/ds-scrollbar": "^0.11.21",
46
+ "@synerise/ds-subtle-form": "^0.9.139",
47
+ "@synerise/ds-tabs": "^0.17.10",
48
+ "@synerise/ds-typography": "^0.16.9",
49
49
  "@synerise/ds-utils": "^0.31.2"
50
50
  },
51
51
  "peerDependencies": {
@@ -54,5 +54,5 @@
54
54
  "react": ">=16.9.0 <= 17.0.2",
55
55
  "styled-components": "^5.0.1"
56
56
  },
57
- "gitHead": "4a56ee7ef816c22341ce704154dc7aa65b7d1dcc"
57
+ "gitHead": "03c0625fb7b5baaa35f6633a425fb803469b6a20"
58
58
  }