@elliemae/ds-treeview 2.0.1 → 2.1.0-rc.0

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 (167) hide show
  1. package/cjs/TreeView.js +5 -103
  2. package/cjs/TreeViewContext.js +44 -47
  3. package/cjs/config/useTreeview.js +137 -0
  4. package/cjs/index.js +1 -7
  5. package/cjs/parts/CheckboxSelectable.js +7 -9
  6. package/cjs/parts/ExpandCaret.js +17 -11
  7. package/cjs/parts/Icon.js +4 -0
  8. package/cjs/parts/NestingSpace.js +15 -22
  9. package/cjs/parts/RadioSelectable.js +7 -9
  10. package/cjs/parts/TreeItem.js +16 -13
  11. package/cjs/parts/TreeList.js +6 -4
  12. package/cjs/plugins/dnd/TreeDndPlugin.js +1 -1
  13. package/cjs/react-desc-prop-types.js +28 -27
  14. package/cjs/related-components/TreeViewSearchBar.js +9 -1
  15. package/cjs/{deprecated/plugins/selectable/helper.js → sharedTypes.js} +0 -0
  16. package/cjs/utils/dnd-helpers.js +2 -4
  17. package/cjs/utils/group-expands-helpers.js +34 -8
  18. package/cjs/utils/keyboard-helpers.js +64 -60
  19. package/cjs/utils/object-helpers.js +25 -7
  20. package/cjs/utils/refs-helpers.js +2 -2
  21. package/cjs/utils/selectable-helper.js +2 -2
  22. package/cjs/utils/tree-helpers.js +42 -27
  23. package/cjs/utils/useDnDHelpers.js +107 -100
  24. package/cjs/utils/useInstanceRefActions.js +3 -2
  25. package/cjs/utils/useTree.js +27 -8
  26. package/esm/TreeView.js +6 -103
  27. package/esm/TreeViewContext.js +44 -47
  28. package/esm/config/useTreeview.js +129 -0
  29. package/esm/index.js +0 -8
  30. package/esm/parts/CheckboxSelectable.js +7 -9
  31. package/esm/parts/ExpandCaret.js +17 -11
  32. package/esm/parts/Icon.js +4 -0
  33. package/esm/parts/NestingSpace.js +15 -21
  34. package/esm/parts/RadioSelectable.js +7 -9
  35. package/esm/parts/TreeItem.js +16 -13
  36. package/esm/parts/TreeList.js +6 -4
  37. package/esm/plugins/dnd/TreeDndPlugin.js +1 -1
  38. package/esm/react-desc-prop-types.js +28 -27
  39. package/esm/related-components/TreeViewSearchBar.js +9 -1
  40. package/esm/{deprecated/plugins/selectable/helper.js → sharedTypes.js} +0 -0
  41. package/esm/utils/dnd-helpers.js +2 -4
  42. package/esm/utils/group-expands-helpers.js +34 -9
  43. package/esm/utils/keyboard-helpers.js +62 -58
  44. package/esm/utils/object-helpers.js +25 -7
  45. package/esm/utils/refs-helpers.js +2 -2
  46. package/esm/utils/selectable-helper.js +2 -2
  47. package/esm/utils/tree-helpers.js +42 -27
  48. package/esm/utils/useDnDHelpers.js +107 -100
  49. package/esm/utils/useInstanceRefActions.js +3 -2
  50. package/esm/utils/useTree.js +27 -8
  51. package/package.json +17 -128
  52. package/types/TreeView.d.ts +4 -148
  53. package/types/TreeViewContext.d.ts +4 -106
  54. package/types/config/useTreeview.d.ts +7 -0
  55. package/types/index.d.ts +0 -1
  56. package/types/parts/CheckboxSelectable.d.ts +5 -6
  57. package/types/parts/ChildrenCountDisplayer.d.ts +6 -6
  58. package/types/parts/ExpandCaret.d.ts +6 -6
  59. package/types/parts/Icon.d.ts +7 -5
  60. package/types/parts/NestingSpace.d.ts +3 -8
  61. package/types/parts/RadioSelectable.d.ts +5 -6
  62. package/types/parts/TreeItem.d.ts +22 -14
  63. package/types/parts/TreeItemText.d.ts +5 -5
  64. package/types/parts/TreeList.d.ts +22 -9
  65. package/types/react-desc-prop-types.d.ts +124 -43
  66. package/types/related-components/TreeViewSearchBar.d.ts +14 -11
  67. package/types/sharedTypes.d.ts +54 -0
  68. package/types/utils/array-helpers.d.ts +2 -2
  69. package/types/utils/dnd-helpers.d.ts +26 -25
  70. package/types/utils/group-expands-helpers.d.ts +13 -10
  71. package/types/utils/keyboard-helpers.d.ts +5 -3
  72. package/types/utils/object-helpers.d.ts +6 -2
  73. package/types/utils/refs-helpers.d.ts +4 -1
  74. package/types/utils/selectable-helper.d.ts +7 -3
  75. package/types/utils/string-helpers.d.ts +1 -1
  76. package/types/utils/tree-helpers.d.ts +25 -11
  77. package/types/utils/useDnDHelpers.d.ts +23 -3
  78. package/types/utils/useInstanceRefActions.d.ts +3 -3
  79. package/types/utils/useTree.d.ts +8 -7
  80. package/cjs/deprecated/TreeView.js +0 -72
  81. package/cjs/deprecated/__testUtils__/utils.js +0 -89
  82. package/cjs/deprecated/index.js +0 -27
  83. package/cjs/deprecated/plugins/dnd/TreeDndPlugin.js +0 -119
  84. package/cjs/deprecated/plugins/dnd/index.js +0 -9
  85. package/cjs/deprecated/plugins/dnd/renderers/DraggableItem.js +0 -67
  86. package/cjs/deprecated/plugins/dnd/renderers/DroppableList.js +0 -181
  87. package/cjs/deprecated/plugins/dnd/utils.js +0 -157
  88. package/cjs/deprecated/plugins/index.js +0 -21
  89. package/cjs/deprecated/plugins/roving/TreeRovingPlugin.js +0 -109
  90. package/cjs/deprecated/plugins/roving/index.js +0 -9
  91. package/cjs/deprecated/plugins/searchable/SearchableTreePlugin.js +0 -109
  92. package/cjs/deprecated/plugins/searchable/index.js +0 -9
  93. package/cjs/deprecated/plugins/searchable/utils.js +0 -7
  94. package/cjs/deprecated/plugins/selectable/SelectablePluginTree.js +0 -290
  95. package/cjs/deprecated/plugins/selectable/index.js +0 -9
  96. package/cjs/deprecated/plugins/selectable/utils.js +0 -19
  97. package/cjs/deprecated/plugins/toolbar/TreeToolbarPlugin.js +0 -128
  98. package/cjs/deprecated/plugins/toolbar/index.js +0 -9
  99. package/cjs/deprecated/plugins/tree/TreeDataPlugin.js +0 -281
  100. package/cjs/deprecated/plugins/tree/index.js +0 -9
  101. package/cjs/deprecated/plugins/tree/useExpandTreeState.js +0 -143
  102. package/cjs/deprecated/plugins/tree/utils.js +0 -43
  103. package/cjs/deprecated/plugins/tree/walkTreeStrategy.js +0 -60
  104. package/cjs/deprecated/plugins/virtualization/TreeVirtualizationPlugin.js +0 -209
  105. package/cjs/deprecated/plugins/virtualization/index.js +0 -9
  106. package/cjs/deprecated/renderers.js +0 -76
  107. package/cjs/prop-types.js +0 -61
  108. package/esm/deprecated/TreeView.js +0 -61
  109. package/esm/deprecated/__testUtils__/utils.js +0 -79
  110. package/esm/deprecated/index.js +0 -14
  111. package/esm/deprecated/plugins/dnd/TreeDndPlugin.js +0 -110
  112. package/esm/deprecated/plugins/dnd/index.js +0 -1
  113. package/esm/deprecated/plugins/dnd/renderers/DraggableItem.js +0 -59
  114. package/esm/deprecated/plugins/dnd/renderers/DroppableList.js +0 -172
  115. package/esm/deprecated/plugins/dnd/utils.js +0 -139
  116. package/esm/deprecated/plugins/index.js +0 -7
  117. package/esm/deprecated/plugins/roving/TreeRovingPlugin.js +0 -96
  118. package/esm/deprecated/plugins/roving/index.js +0 -1
  119. package/esm/deprecated/plugins/searchable/SearchableTreePlugin.js +0 -99
  120. package/esm/deprecated/plugins/searchable/index.js +0 -1
  121. package/esm/deprecated/plugins/searchable/utils.js +0 -3
  122. package/esm/deprecated/plugins/selectable/SelectablePluginTree.js +0 -280
  123. package/esm/deprecated/plugins/selectable/index.js +0 -1
  124. package/esm/deprecated/plugins/selectable/utils.js +0 -15
  125. package/esm/deprecated/plugins/toolbar/TreeToolbarPlugin.js +0 -114
  126. package/esm/deprecated/plugins/toolbar/index.js +0 -1
  127. package/esm/deprecated/plugins/tree/TreeDataPlugin.js +0 -269
  128. package/esm/deprecated/plugins/tree/index.js +0 -1
  129. package/esm/deprecated/plugins/tree/useExpandTreeState.js +0 -135
  130. package/esm/deprecated/plugins/tree/utils.js +0 -28
  131. package/esm/deprecated/plugins/tree/walkTreeStrategy.js +0 -56
  132. package/esm/deprecated/plugins/virtualization/TreeVirtualizationPlugin.js +0 -197
  133. package/esm/deprecated/plugins/virtualization/index.js +0 -1
  134. package/esm/deprecated/renderers.js +0 -59
  135. package/esm/prop-types.js +0 -46
  136. package/types/deprecated/TreeView.d.ts +0 -8
  137. package/types/deprecated/__testUtils__/utils.d.ts +0 -72
  138. package/types/deprecated/index.d.ts +0 -2
  139. package/types/deprecated/plugins/dnd/TreeDndPlugin.d.ts +0 -1
  140. package/types/deprecated/plugins/dnd/index.d.ts +0 -1
  141. package/types/deprecated/plugins/dnd/renderers/DraggableItem.d.ts +0 -3
  142. package/types/deprecated/plugins/dnd/renderers/DroppableList.d.ts +0 -6
  143. package/types/deprecated/plugins/dnd/tests/TreeDndPlugin.test.d.ts +0 -0
  144. package/types/deprecated/plugins/dnd/utils.d.ts +0 -28
  145. package/types/deprecated/plugins/index.d.ts +0 -7
  146. package/types/deprecated/plugins/roving/TreeRovingPlugin.d.ts +0 -1
  147. package/types/deprecated/plugins/roving/index.d.ts +0 -1
  148. package/types/deprecated/plugins/searchable/SearchableTreePlugin.d.ts +0 -1
  149. package/types/deprecated/plugins/searchable/index.d.ts +0 -1
  150. package/types/deprecated/plugins/searchable/utils.d.ts +0 -1
  151. package/types/deprecated/plugins/selectable/SelectablePluginTree.d.ts +0 -1
  152. package/types/deprecated/plugins/selectable/helper.d.ts +0 -0
  153. package/types/deprecated/plugins/selectable/index.d.ts +0 -1
  154. package/types/deprecated/plugins/selectable/tests/SelectablePluginTree.test.d.ts +0 -1
  155. package/types/deprecated/plugins/selectable/utils.d.ts +0 -1
  156. package/types/deprecated/plugins/toolbar/TreeToolbarPlugin.d.ts +0 -1
  157. package/types/deprecated/plugins/toolbar/index.d.ts +0 -1
  158. package/types/deprecated/plugins/tree/TreeDataPlugin.d.ts +0 -1
  159. package/types/deprecated/plugins/tree/index.d.ts +0 -1
  160. package/types/deprecated/plugins/tree/tests/TreeDataPlugin.test.d.ts +0 -1
  161. package/types/deprecated/plugins/tree/useExpandTreeState.d.ts +0 -14
  162. package/types/deprecated/plugins/tree/utils.d.ts +0 -8
  163. package/types/deprecated/plugins/tree/walkTreeStrategy.d.ts +0 -9
  164. package/types/deprecated/plugins/virtualization/TreeVirtualizationPlugin.d.ts +0 -1
  165. package/types/deprecated/plugins/virtualization/index.d.ts +0 -1
  166. package/types/deprecated/renderers.d.ts +0 -19
  167. package/types/prop-types.d.ts +0 -26
@@ -1,128 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- require('core-js/modules/esnext.async-iterator.filter.js');
6
- require('core-js/modules/esnext.iterator.constructor.js');
7
- require('core-js/modules/esnext.iterator.filter.js');
8
- require('core-js/modules/esnext.async-iterator.for-each.js');
9
- require('core-js/modules/esnext.iterator.for-each.js');
10
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
11
- var _jsx = require('@babel/runtime/helpers/jsx');
12
- var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
13
- var React = require('react');
14
- var dsIcons = require('@elliemae/ds-icons');
15
- var Button = require('@elliemae/ds-button');
16
- var dsUtilities = require('@elliemae/ds-utilities');
17
- var createInstancePlugin = require('@elliemae/ds-shared/createDataInstance/createInstancePlugin');
18
- var ToolbarProvider = require('@elliemae/ds-shared/toolbar/ToolbarProvider');
19
- var FocusGroupContext = require('@elliemae/ds-shared/FocusGroup/FocusGroupContext');
20
- var jsxRuntime = require('react/jsx-runtime');
21
-
22
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
23
-
24
- var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
25
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
26
- var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
27
- var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
28
- var createInstancePlugin__default = /*#__PURE__*/_interopDefaultLegacy(createInstancePlugin);
29
- var ToolbarProvider__default = /*#__PURE__*/_interopDefaultLegacy(ToolbarProvider);
30
- var FocusGroupContext__default = /*#__PURE__*/_interopDefaultLegacy(FocusGroupContext);
31
-
32
- const _excluded = ["onMouseEnter", "onMouseLeave", "extraParams", "renderToolbar", "isItemFocused", "icon", "rowSize"];
33
-
34
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
35
-
36
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
37
-
38
- const ToolbarDisclosure = props => {
39
- const {
40
- onMouseEnter,
41
- onMouseLeave,
42
- extraParams,
43
- renderToolbar,
44
- isItemFocused,
45
- icon = /*#__PURE__*/_jsx__default["default"](dsIcons.MoreOptionsVert, {
46
- color: ['brand-primary', 800]
47
- }),
48
- rowSize
49
- } = props,
50
- rest = _objectWithoutProperties__default["default"](props, _excluded);
51
-
52
- const toolbarContext = React.useContext(ToolbarProvider.ToolbarContext);
53
- const ref = React.useRef(null);
54
-
55
- const show = () => {
56
- if (ref.current) {
57
- const toolbar = renderToolbar(_objectSpread(_objectSpread({
58
- onCloseToolbar: toolbarContext.hide
59
- }, extraParams), {}, {
60
- size: rowSize
61
- }));
62
- toolbarContext.show({
63
- reference: ref.current,
64
- renderer: toolbar
65
- });
66
- }
67
- };
68
-
69
- const hide = e => {
70
- toolbarContext.hide(e);
71
- };
72
-
73
- return /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], _objectSpread(_objectSpread({}, rest), {}, {
74
- buttonType: "text",
75
- className: "toolbar-trigger",
76
- icon: icon,
77
- innerRef: ref,
78
- onClick: show,
79
- onMouseEnter: dsUtilities.runAll(show, onMouseEnter),
80
- onMouseLeave: dsUtilities.runAll(hide, onMouseLeave),
81
- tabIndex: isItemFocused ? 0 : -1
82
- }));
83
- };
84
-
85
- const TriggerFormatter = (value, extraParams, instance) => {
86
- const {
87
- props: {
88
- onShowToolbar,
89
- onCloseToolbar,
90
- renderToolbar,
91
- rowSize
92
- }
93
- } = instance.getInstance();
94
- return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
95
- children: [value, /*#__PURE__*/_jsx__default["default"](ToolbarDisclosure, {
96
- isItemFocused: extraParams.isItemFocused,
97
- onClose: onCloseToolbar,
98
- onShow: onShowToolbar,
99
- renderToolbar: renderToolbar,
100
- rowSize: rowSize
101
- })]
102
- });
103
- };
104
-
105
- const TreeToolbarPlugin = createInstancePlugin__default["default"]('tree-toolbar', {
106
- itemRenderer: TriggerFormatter,
107
-
108
- renderers(renderers) {
109
- const List = React.useMemo(() => {
110
- const Component = renderers.list; // eslint-disable-next-line react/display-name
111
-
112
- return props => {
113
- const focusContext = React.useContext(FocusGroupContext__default["default"]);
114
- return /*#__PURE__*/_jsx__default["default"](ToolbarProvider__default["default"], {
115
- onHide: (state, e) => {
116
- if (e && e.type === 'keydown' && focusContext) focusContext.focus();
117
- }
118
- }, void 0, /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread({}, props)));
119
- };
120
- }, []);
121
- return _objectSpread(_objectSpread({}, renderers), {}, {
122
- list: List
123
- });
124
- }
125
-
126
- });
127
-
128
- exports.TreeToolbarPlugin = TreeToolbarPlugin;
@@ -1,9 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var TreeToolbarPlugin = require('./TreeToolbarPlugin.js');
6
-
7
-
8
-
9
- exports.TreeToolbarPlugin = TreeToolbarPlugin.TreeToolbarPlugin;
@@ -1,281 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _jsx = require('@babel/runtime/helpers/jsx');
6
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
7
- require('core-js/modules/esnext.async-iterator.some.js');
8
- require('core-js/modules/esnext.iterator.constructor.js');
9
- require('core-js/modules/esnext.iterator.some.js');
10
- require('core-js/modules/web.dom-collections.iterator.js');
11
- require('core-js/modules/esnext.async-iterator.find.js');
12
- require('core-js/modules/esnext.iterator.find.js');
13
- require('core-js/modules/esnext.async-iterator.filter.js');
14
- require('core-js/modules/esnext.iterator.filter.js');
15
- require('core-js/modules/esnext.async-iterator.for-each.js');
16
- require('core-js/modules/esnext.iterator.for-each.js');
17
- var React = require('react');
18
- var dsUtilities = require('@elliemae/ds-utilities');
19
- var Button = require('@elliemae/ds-button');
20
- var dsIcons = require('@elliemae/ds-icons');
21
- var dsClassnames = require('@elliemae/ds-classnames');
22
- var createInstancePlugin = require('@elliemae/ds-shared/createDataInstance/createInstancePlugin');
23
- var walkTreeStrategy = require('./walkTreeStrategy.js');
24
- var utils = require('./utils.js');
25
- var renderers = require('../../renderers.js');
26
- var useExpandTreeState = require('./useExpandTreeState.js');
27
-
28
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
29
-
30
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
31
- var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
32
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
33
- var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
34
- var createInstancePlugin__default = /*#__PURE__*/_interopDefaultLegacy(createInstancePlugin);
35
-
36
- var _ArrowheadDown, _ArrowheadRight;
37
-
38
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
39
-
40
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
41
- const ItemContent = dsClassnames.aggregatedClasses('div')("".concat(renderers.treeItemBlockName, "-content"));
42
- const ItemValue = dsClassnames.aggregatedClasses('span')(renderers.treeItemBlockName, 'value');
43
-
44
- const noop = () => null;
45
-
46
- const getItemNestingLeftPadding = (level, opts) => {
47
- const {
48
- spaceForNestingLevel,
49
- isChild
50
- } = _objectSpread({
51
- spaceForNestingLevel: 1.5
52
- }, opts);
53
-
54
- const groupLeftPadding = spaceForNestingLevel * (level - 1);
55
- return isChild ? "".concat(groupLeftPadding + spaceForNestingLevel - 0.1, "em") : "".concat(groupLeftPadding, "em");
56
- };
57
-
58
- const itemRenderer = (value, itemProps, instance) => {
59
- const {
60
- record
61
- } = itemProps;
62
- const {
63
- props: {
64
- showChildrenAmount = false,
65
- labelRenderer,
66
- onItemClick = noop
67
- }
68
- } = instance.getInstance(); // eslint-disable-next-line react-hooks/rules-of-hooks
69
-
70
- const handleItemClick = React.useCallback(e => {
71
- onItemClick(record.data, e);
72
- }, [record.data, onItemClick]);
73
- const amountChildren = Number(utils.getItemChildrenLength(record));
74
- const renderedLabel = dsUtilities.isFunction(labelRenderer) && labelRenderer(value, itemProps) || value;
75
- return /*#__PURE__*/_jsx__default["default"](ItemContent, {
76
- "data-testid": "".concat(renderers.treeItemBlockName, "-content"),
77
- onClick: handleItemClick
78
- }, void 0, /*#__PURE__*/_jsx__default["default"](ItemValue, {}, void 0, renderedLabel, showChildrenAmount && record.isGroup && " (".concat(amountChildren, ")")));
79
- };
80
-
81
- itemRenderer.order = 100;
82
- const TreePluginList = createInstancePlugin__default["default"]('tree-data', {
83
- state: useExpandTreeState.useExpandTreeState,
84
- recordIterator: opts => {
85
- const shouldWalkChildren = record => {
86
- const {
87
- state: {
88
- expandedAll
89
- },
90
- decorators
91
- } = opts.instance.getInstance();
92
- const shouldWalk = decorators.shouldWalkChildren.some(decorator => decorator(record, opts.instance));
93
- if (shouldWalk) return true;
94
- if (expandedAll === true) return true;
95
- return !record.parentNode.id || record.parentNode.expanded;
96
- };
97
-
98
- walkTreeStrategy.walkTreeStrategy(_objectSpread(_objectSpread({}, opts), {}, {
99
- shouldWalkChildren
100
- }));
101
- },
102
-
103
- getItemProps(props, instance, _ref) {
104
- let {
105
- record
106
- } = _ref;
107
- const {
108
- nestingLevel
109
- } = record;
110
- const {
111
- actions: {
112
- _toggleExpand
113
- },
114
- props: {
115
- itemIcon,
116
- groupIcon,
117
- spaceForNestingLevel = 1.5
118
- }
119
- } = instance.getInstance(); // eslint-disable-next-line react-hooks/rules-of-hooks
120
-
121
- const handleExpandRow = React.useCallback(() => _toggleExpand(record.data), [record.data]);
122
- const icon = record.isGroup ? groupIcon : itemIcon;
123
- const itemNestingLeftPadding = getItemNestingLeftPadding(nestingLevel || record.nestingLevel, {
124
- isChild: !record.isGroup,
125
- spaceForNestingLevel
126
- });
127
-
128
- const expandAddon = record.isGroup && /*#__PURE__*/_jsx__default["default"](Button__default["default"], {
129
- buttonType: "text",
130
- className: "expandable-arrow",
131
- "data-testid": "tree-item-expand-toggle",
132
- icon: record.expanded ? _ArrowheadDown || (_ArrowheadDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadDown, {
133
- "data-testid": "ic-arrow-head-down"
134
- })) : _ArrowheadRight || (_ArrowheadRight = /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadRight, {
135
- "data-testid": "ic-arrow-head-right"
136
- })),
137
- onClick: e => {
138
- // Avoid item selection on caret click (just expand/hide)
139
- e.stopPropagation();
140
- handleExpandRow(e);
141
- },
142
- size: "s",
143
- tabIndex: -1 // eslint-disable-next-line max-lines
144
-
145
- }, "".concat(record.id, "-expand-addon"));
146
-
147
- const iconAddon = icon && /*#__PURE__*/React__default["default"].cloneElement(icon, {
148
- 'data-testid': record.isGroup ? 'tree-item-group-icon' : 'tree-item-icon',
149
- className: dsUtilities.cx(icon.props.className, 'tree-item-icon')
150
- });
151
-
152
- const spaceAddon = /*#__PURE__*/_jsx__default["default"]("div", {
153
- "data-testid": "tree-item-nested-space",
154
- style: {
155
- width: itemNestingLeftPadding
156
- }
157
- }, "".concat(record.id, "-space-addon"));
158
-
159
- return _objectSpread(_objectSpread({}, props), {}, {
160
- 'data-id': record.id,
161
- 'data-parentid': utils.getParentId(record),
162
- 'aria-expanded': !!record.expanded,
163
- leftAddons: [...(props.leftAddons || []), spaceAddon, expandAddon, iconAddon]
164
- });
165
- },
166
-
167
- record: (record, instance) => {
168
- const {
169
- state: {
170
- expanded,
171
- expandedAll
172
- }
173
- } = instance.getInstance();
174
- const isParentExpanded = !record.parentNode.id || record.parentNode.expanded; // eslint-disable-next-line no-param-reassign
175
-
176
- if (expandedAll === true) record.expanded = true; // eslint-disable-next-line no-param-reassign
177
- else if (expandedAll === false) record.expanded = false; // eslint-disable-next-line no-param-reassign
178
- else record.expanded = isParentExpanded && !!expanded[record.id];
179
- return isParentExpanded && record;
180
- },
181
-
182
- hotKeys(instance) {
183
- function handleExpand(_ref2) {
184
- let {
185
- index
186
- } = _ref2;
187
- const {
188
- records,
189
- actions: {
190
- _toggleExpand
191
- }
192
- } = instance.getInstance();
193
- const record = records[index];
194
- if (record && record.data.children.length > 0) _toggleExpand(record.data);
195
- }
196
-
197
- function handleCollapse(_ref3) {
198
- let {
199
- index
200
- } = _ref3;
201
- const {
202
- records,
203
- actions: {
204
- collapse
205
- }
206
- } = instance.getInstance();
207
- const record = records[index];
208
-
209
- if (record && record.expanded) {
210
- collapse(record);
211
- }
212
- }
213
-
214
- function handleExpandAll() {
215
- const {
216
- actions: {
217
- toggleExpandAll
218
- }
219
- } = instance.getInstance();
220
- const active = document.activeElement;
221
- toggleExpandAll().then(() => {
222
- const {
223
- records
224
- } = instance.getInstance();
225
- const itemToFocus = records.find( // eslint-disable-next-line eqeqeq
226
- record => record.id == active.dataset.id);
227
-
228
- if (itemToFocus) {
229
- // eslint-disable-next-line no-unused-expressions
230
- // eslint-disable-next-line mdx/no-unused-expressions
231
- utils.findItemOnDocument(itemToFocus.id) ? utils.findItemOnDocument(itemToFocus.id).focus() : utils.findItemOnDocument(records[0].id).focus();
232
- } else {
233
- utils.getListFromDocument().scrollTo(0, 0);
234
- setTimeout(() => {
235
- utils.findItemOnDocument(records[0].id).focus();
236
- }, 200);
237
- }
238
- });
239
- }
240
-
241
- return [{
242
- key: 'right',
243
- handler: handleExpand
244
- }, {
245
- key: 'shift+=',
246
- handler: handleExpand
247
- }, {
248
- key: '-',
249
- handler: handleCollapse
250
- }, {
251
- key: 'enter',
252
- handler: _ref4 => {
253
- let {
254
- index
255
- } = _ref4;
256
- const {
257
- records,
258
- actions: {
259
- select
260
- }
261
- } = instance.getInstance();
262
- const record = records[index];
263
- select(record);
264
- }
265
- }, {
266
- key: 'left',
267
- handler: handleCollapse
268
- }, {
269
- key: '/',
270
- handler: handleCollapse
271
- }, {
272
- key: 'shift+8',
273
- allowDocumentHandler: true,
274
- handler: handleExpandAll
275
- }];
276
- },
277
-
278
- itemRenderer
279
- });
280
-
281
- exports.TreePluginList = TreePluginList;
@@ -1,9 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var TreeDataPlugin = require('./TreeDataPlugin.js');
6
-
7
-
8
-
9
- exports.TreePluginList = TreeDataPlugin.TreePluginList;
@@ -1,143 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
6
- require('core-js/modules/web.dom-collections.iterator.js');
7
- require('core-js/modules/esnext.async-iterator.filter.js');
8
- require('core-js/modules/esnext.iterator.constructor.js');
9
- require('core-js/modules/esnext.iterator.filter.js');
10
- require('core-js/modules/esnext.async-iterator.for-each.js');
11
- require('core-js/modules/esnext.iterator.for-each.js');
12
- var React = require('react');
13
- var dsUtilities = require('@elliemae/ds-utilities');
14
- var walkTreeStrategy = require('./walkTreeStrategy.js');
15
-
16
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
17
-
18
- var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
19
-
20
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
21
-
22
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
23
-
24
- const toggleExpandAllAsync = (expand, data) => new Promise(resolve => {
25
- const nextState = {};
26
-
27
- if (expand) {
28
- walkTreeStrategy.walkTreeStrategy({
29
- data,
30
- cb: node => {
31
- if (node.isGroup) nextState[node.id] = true;
32
- }
33
- });
34
- }
35
-
36
- resolve(nextState);
37
- });
38
-
39
- const useExpandTreeState = instance => {
40
- const {
41
- originalData,
42
- props: {
43
- searchQuery,
44
- expandedRows: expandedItemsProp = {},
45
- itemKey = 'id',
46
- onExpand,
47
- onExpandChange,
48
- onExpandAll,
49
- onToggleExpand,
50
- onCollapse
51
- }
52
- } = instance;
53
- const expandedState = dsUtilities.useExpandState({
54
- items: originalData,
55
- itemKey,
56
- expanded: expandedItemsProp,
57
- onExpand,
58
- onExpandChange,
59
- onExpandAll,
60
- onToggleExpand,
61
- onCollapse
62
- });
63
- const totalExpandableRecords = React.useRef(0);
64
- const [expandedAll, setExpandAll] = React.useState(false);
65
- React.useEffect(() => {
66
- totalExpandableRecords.current = 0;
67
- walkTreeStrategy.walkTreeStrategy({
68
- data: originalData,
69
- cb: node => {
70
- if (node.isGroup) totalExpandableRecords.current += 1;
71
- }
72
- });
73
- }, [originalData]);
74
- React.useEffect(() => {
75
- const currLength = Object.keys(expandedState.state.expanded || {}).length;
76
- let isExpandedAll;
77
- if (currLength === 0) isExpandedAll = false;else if (totalExpandableRecords.current !== currLength) isExpandedAll = 'mixed';else if (currLength === totalExpandableRecords.current) isExpandedAll = true;
78
- setExpandAll(isExpandedAll);
79
- }, [expandedState.state.expanded, originalData]);
80
-
81
- const toggleExpand = (item, opts) => {
82
- const {
83
- expandAllChildren
84
- } = opts || {};
85
- expandedState.setExpanded(prevState => {
86
- const nextExpandState = _objectSpread({}, prevState);
87
-
88
- const nextState = !prevState[item[itemKey]];
89
- if (nextState) nextExpandState[item[itemKey]] = true;else delete nextExpandState[item[itemKey]];
90
-
91
- if (expandAllChildren) {
92
- walkTreeStrategy.walkTreeStrategy({
93
- data: item.children,
94
- cb: node => {
95
- if (node.isGroup) {
96
- if (nextState) nextExpandState[node.id] = true;else delete nextExpandState[node.id];
97
- }
98
- }
99
- });
100
- }
101
-
102
- if (onExpandChange) {
103
- onExpandChange(nextExpandState, item);
104
- }
105
-
106
- return nextExpandState;
107
- });
108
- };
109
-
110
- const handleToggleExpand = (item, opts) => {
111
- if (dsUtilities.isFunction(onToggleExpand)) {
112
- onToggleExpand(item);
113
- } else {
114
- toggleExpand(item, opts);
115
- }
116
- };
117
-
118
- const toggleExpandAll = expanded => {
119
- let nextExpanded = true; // if no param is passed, keep toggle behavior
120
-
121
- if (typeof expandedAll === 'boolean') nextExpanded = !expandedAll;
122
- if (typeof expanded !== 'undefined') nextExpanded = expanded;
123
- setExpandAll(nextExpanded);
124
- return toggleExpandAllAsync(nextExpanded, originalData).then(nextState => expandedState.setExpanded(nextState));
125
- };
126
-
127
- React.useEffect(() => {
128
- if (searchQuery && (!expandedAll || expandedAll === 'mixed')) toggleExpandAll(true);
129
- }, [searchQuery]); // eslint-disable-next-line max-lines
130
-
131
- return {
132
- state: _objectSpread(_objectSpread({}, expandedState.state), {}, {
133
- expandedAll
134
- }),
135
- actions: _objectSpread(_objectSpread({}, expandedState.actions), {}, {
136
- toggleExpandAll,
137
- toggleExpand,
138
- _toggleExpand: handleToggleExpand
139
- })
140
- };
141
- };
142
-
143
- exports.useExpandTreeState = useExpandTreeState;
@@ -1,43 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- require('core-js/modules/esnext.async-iterator.find.js');
6
- require('core-js/modules/esnext.iterator.constructor.js');
7
- require('core-js/modules/esnext.iterator.find.js');
8
- var get = require('lodash/get');
9
-
10
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
-
12
- var get__default = /*#__PURE__*/_interopDefaultLegacy(get);
13
-
14
- const getParentId = record => get__default["default"](record, ['parentNode', 'id']);
15
- const findItemOnDocument = id => document.querySelector("[data-id=\"".concat(id, "\"]"));
16
- const getListFromDocument = () => document.querySelector("[data-testid=\"tree-list\"]");
17
- const getParentChildren = function (record) {
18
- let childrenKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'children';
19
- return get__default["default"](record, ['parentNode', 'data', childrenKey]);
20
- };
21
- const getItemLabel = function (record) {
22
- let nameKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'name';
23
- return get__default["default"](record, ['data', nameKey]);
24
- };
25
- const getItemChildren = function (record) {
26
- let childrenKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'children';
27
- return get__default["default"](record, ['data', childrenKey]);
28
- };
29
- const getItemChildrenLength = function (record) {
30
- let childrenKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'children';
31
- const children = get__default["default"](record, ['data', childrenKey]);
32
- return children && children.length;
33
- };
34
- const findItemById = (records, id) => records.find(record => String(record.id) === id);
35
-
36
- exports.findItemById = findItemById;
37
- exports.findItemOnDocument = findItemOnDocument;
38
- exports.getItemChildren = getItemChildren;
39
- exports.getItemChildrenLength = getItemChildrenLength;
40
- exports.getItemLabel = getItemLabel;
41
- exports.getListFromDocument = getListFromDocument;
42
- exports.getParentChildren = getParentChildren;
43
- exports.getParentId = getParentId;
@@ -1,60 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- require('core-js/modules/web.dom-collections.iterator.js');
6
-
7
- function getPath(parentNode, index, childrenKey) {
8
- if (!parentNode) return [index];
9
- return [...parentNode.path, childrenKey, index];
10
- }
11
-
12
- function walkTreeStrategy(_ref) {
13
- let {
14
- data,
15
- childrenKey = 'children',
16
- level = 0,
17
- getId = item => item.id,
18
- parentNode,
19
- shouldWalkChildren = () => true,
20
- cb
21
- } = _ref;
22
-
23
- // eslint-disable-next-line no-plusplus
24
- for (let i = 0; i < data.length; i++) {
25
- const currLevel = level + 1;
26
- const item = data[i];
27
- if (!item) throw new Error('no item received, invalid tree walking strategy!');
28
- const children = item[childrenKey];
29
- const {
30
- isGroup
31
- } = item;
32
- const node = {
33
- index: i,
34
- id: getId(item),
35
- data: item,
36
- path: getPath(parentNode, i, childrenKey),
37
- isGroup: children && !!children.length || isGroup,
38
- nestingLevel: currLevel,
39
- parentNode: parentNode || {
40
- isGroup: true,
41
- data: {
42
- children: data
43
- }
44
- }
45
- };
46
- cb(node);
47
-
48
- if (shouldWalkChildren(node) && children && children.length) {
49
- walkTreeStrategy({
50
- data: children,
51
- level: currLevel,
52
- parentNode: node,
53
- shouldWalkChildren,
54
- cb
55
- });
56
- }
57
- }
58
- }
59
-
60
- exports.walkTreeStrategy = walkTreeStrategy;