@elliemae/ds-data-table 2.0.0-rc.9 → 2.0.2

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 (116) hide show
  1. package/cjs/DataTable.js +2 -2
  2. package/cjs/addons/Columns/ColumnExpand/ColumnExpand.js +2 -2
  3. package/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +2 -2
  4. package/cjs/addons/Editables/TextEditableCell/TextEditableCell.js +16 -0
  5. package/cjs/addons/Filters/Components/CurrencyRangeFilter/index.js +6 -3
  6. package/cjs/addons/Filters/Components/DateSwitcherFilter/index.js +4 -1
  7. package/cjs/addons/Filters/Components/NumberRangeFilter/index.js +6 -3
  8. package/cjs/addons/Filters/Components/SelectFilter/BaseSelectFilter.js +3 -3
  9. package/cjs/addons/Pagination/Pagination.js +2 -2
  10. package/cjs/configs/useTableColsWithAddons.js +2 -2
  11. package/cjs/exported-related/EditableCell.js +11 -5
  12. package/cjs/exported-related/FilterPopover.js +3 -3
  13. package/cjs/exported-related/RowRenderer/DefaultRowContentRenderer.js +2 -2
  14. package/cjs/exported-related/RowRenderer/index.js +2 -2
  15. package/cjs/exported-related/RowRenderer/useRowRendererProperties.js +2 -2
  16. package/cjs/parts/Cells/Cell.js +2 -2
  17. package/cjs/parts/DnDHandle.js +2 -2
  18. package/cjs/parts/Filters/index.js +2 -2
  19. package/cjs/parts/Headers/HeaderCell.js +2 -2
  20. package/cjs/parts/Headers/HeaderResizer.js +2 -2
  21. package/cjs/parts/Headers/useHeaderCellHandlers.js +2 -2
  22. package/cjs/parts/HoC/withConditionalDnDColumnContext.js +22 -5
  23. package/cjs/parts/HoC/withConditionalDnDRowContext.js +4 -4
  24. package/cjs/parts/HoC/withConditionalDnDSortableContext.js +2 -2
  25. package/cjs/parts/HoC/withDnDSortableColumnContext.js +2 -2
  26. package/cjs/parts/HoC/withDnDSortableRowContext.js +2 -2
  27. package/cjs/parts/RowVariants/index.js +2 -2
  28. package/cjs/parts/Rows.js +2 -2
  29. package/cjs/parts/SortableHeaderCell.js +2 -2
  30. package/cjs/parts/TableContent.js +2 -2
  31. package/cjs/prop-types.js +2 -2
  32. package/cjs/redux/reducers/headersReducers/logic.js +2 -2
  33. package/cjs/styled.js +16 -11
  34. package/esm/DataTable.js +2 -2
  35. package/esm/addons/Columns/ColumnExpand/ColumnExpand.js +2 -2
  36. package/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +2 -2
  37. package/esm/addons/Editables/TextEditableCell/TextEditableCell.js +16 -0
  38. package/esm/addons/Filters/Components/CurrencyRangeFilter/index.js +6 -3
  39. package/esm/addons/Filters/Components/DateSwitcherFilter/index.js +4 -1
  40. package/esm/addons/Filters/Components/NumberRangeFilter/index.js +6 -3
  41. package/esm/addons/Filters/Components/SelectFilter/BaseSelectFilter.js +3 -3
  42. package/esm/addons/Pagination/Pagination.js +2 -2
  43. package/esm/configs/useTableColsWithAddons.js +2 -2
  44. package/esm/exported-related/EditableCell.js +11 -5
  45. package/esm/exported-related/FilterPopover.js +3 -3
  46. package/esm/exported-related/RowRenderer/DefaultRowContentRenderer.js +2 -2
  47. package/esm/exported-related/RowRenderer/index.js +2 -2
  48. package/esm/exported-related/RowRenderer/useRowRendererProperties.js +2 -2
  49. package/esm/parts/Cells/Cell.js +2 -2
  50. package/esm/parts/DnDHandle.js +2 -2
  51. package/esm/parts/Filters/index.js +2 -2
  52. package/esm/parts/Headers/HeaderCell.js +2 -2
  53. package/esm/parts/Headers/HeaderResizer.js +2 -2
  54. package/esm/parts/Headers/useHeaderCellHandlers.js +2 -2
  55. package/esm/parts/HoC/withConditionalDnDColumnContext.js +21 -4
  56. package/esm/parts/HoC/withConditionalDnDRowContext.js +3 -3
  57. package/esm/parts/HoC/withConditionalDnDSortableContext.js +2 -2
  58. package/esm/parts/HoC/withDnDSortableColumnContext.js +2 -2
  59. package/esm/parts/HoC/withDnDSortableRowContext.js +2 -2
  60. package/esm/parts/RowVariants/index.js +2 -2
  61. package/esm/parts/Rows.js +2 -2
  62. package/esm/parts/SortableHeaderCell.js +2 -2
  63. package/esm/parts/TableContent.js +2 -2
  64. package/esm/prop-types.js +2 -2
  65. package/esm/redux/reducers/headersReducers/logic.js +2 -2
  66. package/esm/styled.js +16 -11
  67. package/package.json +18 -81
  68. package/types/styled.d.ts +3 -1
  69. package/cjs/helpers/dndkit/hierarchy/customCollisionDetection.js +0 -89
  70. package/cjs/helpers/dndkit/hierarchy/getHierarchyKeyboardCoordinates.js +0 -143
  71. package/cjs/helpers/dndkit/hierarchy/types.js +0 -2
  72. package/cjs/helpers/dndkit/hierarchy/useHierarchyActionHandlers.js +0 -55
  73. package/cjs/helpers/dndkit/hierarchy/useHierarchyAnnouncements.js +0 -36
  74. package/cjs/helpers/dndkit/hierarchy/useHierarchyDndkitConfig.js +0 -111
  75. package/cjs/helpers/dndkit/hierarchy/useHierarchyPreviewHandlers.js +0 -87
  76. package/cjs/helpers/dndkit/tree/customCollisionDetection.js +0 -118
  77. package/cjs/helpers/dndkit/tree/getTreeKeyboardCoordinates.js +0 -134
  78. package/cjs/helpers/dndkit/tree/types.js +0 -2
  79. package/cjs/helpers/dndkit/tree/useTreeActionHandlers.js +0 -75
  80. package/cjs/helpers/dndkit/tree/useTreeAnnouncements.js +0 -55
  81. package/cjs/helpers/dndkit/tree/useTreeDndkitConfig.js +0 -141
  82. package/cjs/helpers/dndkit/tree/useTreePreviewHandlers.js +0 -54
  83. package/cjs/helpers/dndkit/types.js +0 -2
  84. package/cjs/helpers/dndkit/utilities.js +0 -52
  85. package/esm/helpers/dndkit/hierarchy/customCollisionDetection.js +0 -85
  86. package/esm/helpers/dndkit/hierarchy/getHierarchyKeyboardCoordinates.js +0 -135
  87. package/esm/helpers/dndkit/hierarchy/types.js +0 -1
  88. package/esm/helpers/dndkit/hierarchy/useHierarchyActionHandlers.js +0 -51
  89. package/esm/helpers/dndkit/hierarchy/useHierarchyAnnouncements.js +0 -32
  90. package/esm/helpers/dndkit/hierarchy/useHierarchyDndkitConfig.js +0 -105
  91. package/esm/helpers/dndkit/hierarchy/useHierarchyPreviewHandlers.js +0 -83
  92. package/esm/helpers/dndkit/tree/customCollisionDetection.js +0 -114
  93. package/esm/helpers/dndkit/tree/getTreeKeyboardCoordinates.js +0 -126
  94. package/esm/helpers/dndkit/tree/types.js +0 -1
  95. package/esm/helpers/dndkit/tree/useTreeActionHandlers.js +0 -71
  96. package/esm/helpers/dndkit/tree/useTreeAnnouncements.js +0 -51
  97. package/esm/helpers/dndkit/tree/useTreeDndkitConfig.js +0 -135
  98. package/esm/helpers/dndkit/tree/useTreePreviewHandlers.js +0 -50
  99. package/esm/helpers/dndkit/types.js +0 -1
  100. package/esm/helpers/dndkit/utilities.js +0 -47
  101. package/types/helpers/dndkit/hierarchy/customCollisionDetection.d.ts +0 -3
  102. package/types/helpers/dndkit/hierarchy/getHierarchyKeyboardCoordinates.d.ts +0 -3
  103. package/types/helpers/dndkit/hierarchy/types.d.ts +0 -66
  104. package/types/helpers/dndkit/hierarchy/useHierarchyActionHandlers.d.ts +0 -2
  105. package/types/helpers/dndkit/hierarchy/useHierarchyAnnouncements.d.ts +0 -3
  106. package/types/helpers/dndkit/hierarchy/useHierarchyDndkitConfig.d.ts +0 -3
  107. package/types/helpers/dndkit/hierarchy/useHierarchyPreviewHandlers.d.ts +0 -2
  108. package/types/helpers/dndkit/tree/customCollisionDetection.d.ts +0 -4
  109. package/types/helpers/dndkit/tree/getTreeKeyboardCoordinates.d.ts +0 -3
  110. package/types/helpers/dndkit/tree/types.d.ts +0 -82
  111. package/types/helpers/dndkit/tree/useTreeActionHandlers.d.ts +0 -2
  112. package/types/helpers/dndkit/tree/useTreeAnnouncements.d.ts +0 -4
  113. package/types/helpers/dndkit/tree/useTreeDndkitConfig.d.ts +0 -3
  114. package/types/helpers/dndkit/tree/useTreePreviewHandlers.d.ts +0 -2
  115. package/types/helpers/dndkit/types.d.ts +0 -20
  116. package/types/helpers/dndkit/utilities.d.ts +0 -7
@@ -1,141 +0,0 @@
1
- 'use strict';
2
-
3
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
4
- require('core-js/modules/web.dom-collections.iterator.js');
5
- require('core-js/modules/esnext.async-iterator.map.js');
6
- require('core-js/modules/esnext.iterator.map.js');
7
- require('core-js/modules/esnext.async-iterator.for-each.js');
8
- require('core-js/modules/esnext.iterator.constructor.js');
9
- require('core-js/modules/esnext.iterator.for-each.js');
10
- require('core-js/modules/esnext.async-iterator.filter.js');
11
- require('core-js/modules/esnext.iterator.filter.js');
12
- var React = require('react');
13
- var core = require('@dnd-kit/core');
14
- var sortable = require('@dnd-kit/sortable');
15
- var useTreePreviewHandlers = require('./useTreePreviewHandlers.js');
16
- var getTreeKeyboardCoordinates = require('./getTreeKeyboardCoordinates.js');
17
- var utilities = require('../utilities.js');
18
- var useTreeActionHandlers = require('./useTreeActionHandlers.js');
19
- var customCollisionDetection = require('./customCollisionDetection.js');
20
- var useTreeAnnouncements = require('./useTreeAnnouncements.js');
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
-
26
- 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; }
27
-
28
- 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; }
29
- // if second parameter is true, the space will be done on the horizontal axis
30
-
31
- const adjustTranslate = function (_ref) {
32
- let {
33
- transform
34
- } = _ref;
35
- let isHorizontalDnD = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
36
-
37
- const newTransform = _objectSpread({}, transform);
38
-
39
- if (isHorizontalDnD) {
40
- newTransform.x = transform.x + 25;
41
- } else {
42
- newTransform.x = transform.x + 15;
43
- }
44
-
45
- return newTransform;
46
- };
47
-
48
- const measuring = {
49
- droppable: {
50
- strategy: core.MeasuringStrategy.BeforeDragging
51
- }
52
- };
53
-
54
- const useTreeDndkitConfig = _ref2 => {
55
- var _visibleItemsDictiona, _visibleItemsDictiona2;
56
-
57
- let {
58
- flattenedItems,
59
- visibleItems: preVisibleItems,
60
- isHorizontalDnD = false,
61
- isExpandable = false,
62
- onReorder,
63
- maxDragAndDropLevel
64
- } = _ref2;
65
- const [activeId, setActiveId] = React.useState(null);
66
- const [overId, setOverId] = React.useState(null);
67
- const [dropIndicatorPosition, setDropIndicatorPosition] = React.useState(null);
68
- const [lastPosition, setLastPosition] = React.useState(null); // Remove activeId's children
69
-
70
- const visibleItems = React.useMemo(() => utilities.removeChildrenOf(preVisibleItems, activeId), [preVisibleItems, activeId]); // Sorted ids for the library
71
-
72
- const sortedIds = React.useMemo(() => visibleItems.map(item => item.uid), [visibleItems]);
73
- /**
74
- * Dictionary from UID to ITEM
75
- * This dictionary is computed since on every DnD move, I need to know the
76
- * depth of a particular row, so O(1) per DnD move instead of O(#ITEMS)
77
- */
78
-
79
- const visibleItemsDictionary = React.useMemo(() => {
80
- // Using plain for to achieve O(#ITEMS) performance
81
- const dictionary = {};
82
- visibleItems.forEach(item => {
83
- dictionary[item.uid] = item;
84
- });
85
- return dictionary;
86
- }, [visibleItems]);
87
- const modifiers = React.useMemo(() => [options => adjustTranslate(options, isHorizontalDnD)], [isHorizontalDnD]);
88
- const sensorContext = React.useRef({
89
- items: visibleItems,
90
- dropIndicatorPosition,
91
- setDropIndicatorPosition
92
- });
93
- React.useEffect(() => {
94
- sensorContext.current = {
95
- items: visibleItems,
96
- dropIndicatorPosition,
97
- setDropIndicatorPosition
98
- };
99
- }, [visibleItems, dropIndicatorPosition, setDropIndicatorPosition]);
100
- const coordinateGetter = React.useMemo(() => getTreeKeyboardCoordinates.getTreeKeyboardCoordinates(sensorContext, isHorizontalDnD, maxDragAndDropLevel), [sensorContext, isHorizontalDnD, maxDragAndDropLevel]);
101
- const sensors = core.useSensors(core.useSensor(core.PointerSensor), core.useSensor(core.KeyboardSensor, {
102
- coordinateGetter
103
- })); // where is the activeItem being positioned (depth and parent)
104
-
105
- const projected = React.useMemo(() => overId ? utilities.getProjection(visibleItems, visibleItemsDictionary, overId, dropIndicatorPosition, isExpandable) : null, [overId, visibleItems, visibleItemsDictionary, dropIndicatorPosition, isExpandable]);
106
- const dragPreviewHandlers = useTreePreviewHandlers.useTreePreviewHandlers({
107
- setActiveId,
108
- setOverId,
109
- setDropIndicatorPosition
110
- });
111
- const dragActionHandlers = useTreeActionHandlers.useTreeActionHandlers(_objectSpread(_objectSpread({}, dragPreviewHandlers), {}, {
112
- onReorder,
113
- projected,
114
- flattenedItems,
115
- dropIndicatorPosition
116
- }));
117
- const announcements = useTreeAnnouncements.useTreeAnnouncements(visibleItemsDictionary, dropIndicatorPosition);
118
- const dndContextProps = React.useMemo(() => _objectSpread({
119
- announcements,
120
- modifiers,
121
- sensors,
122
- measuring,
123
- collisionDetection: customCollisionDetection.customCollisionDetection(activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition)
124
- }, dragActionHandlers), [announcements, modifiers, sensors, dragActionHandlers, visibleItemsDictionary, setDropIndicatorPosition, activeId, maxDragAndDropLevel, lastPosition, setLastPosition]);
125
- const sortableContextProps = React.useMemo(() => ({
126
- items: sortedIds,
127
- strategy: isHorizontalDnD ? sortable.horizontalListSortingStrategy : sortable.verticalListSortingStrategy
128
- }), [sortedIds, isHorizontalDnD]);
129
- return {
130
- dndContextProps,
131
- sortableContextProps,
132
- activeId,
133
- activeIndex: (_visibleItemsDictiona = (_visibleItemsDictiona2 = visibleItemsDictionary[activeId]) === null || _visibleItemsDictiona2 === void 0 ? void 0 : _visibleItemsDictiona2.realIndex) !== null && _visibleItemsDictiona !== void 0 ? _visibleItemsDictiona : -1,
134
- overId,
135
- depth: projected ? projected.depth : 0,
136
- dropIndicatorPosition,
137
- visibleItems
138
- };
139
- };
140
-
141
- module.exports = useTreeDndkitConfig;
@@ -1,54 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var SortableItemContext = require('../../../parts/HoC/SortableItemContext.js');
7
-
8
- const useTreePreviewHandlers = _ref => {
9
- let {
10
- setOverId,
11
- setActiveId,
12
- setDropIndicatorPosition
13
- } = _ref;
14
- const resetState = React.useCallback(() => {
15
- setOverId(null);
16
- setActiveId(null);
17
- document.body.style.setProperty('cursor', '');
18
- }, [setOverId, setActiveId]);
19
- const handlePreviewDragStart = React.useCallback(_ref2 => {
20
- let {
21
- active: {
22
- id
23
- }
24
- } = _ref2;
25
- setActiveId(id);
26
- setOverId(id);
27
- setDropIndicatorPosition(SortableItemContext.DropIndicatorPosition.Inside);
28
- document.body.style.setProperty('cursor', 'grabbing');
29
- }, [setActiveId, setDropIndicatorPosition, setOverId]);
30
- const handlePreviewDragMove = React.useCallback(() => null, []);
31
- const handlePreviewDragOver = React.useCallback(_ref3 => {
32
- var _over$id;
33
-
34
- let {
35
- over
36
- } = _ref3;
37
- setOverId((_over$id = over === null || over === void 0 ? void 0 : over.id) !== null && _over$id !== void 0 ? _over$id : null);
38
- }, [setOverId]);
39
- const handlePreviewDragEnd = React.useCallback(() => {
40
- resetState();
41
- }, [resetState]);
42
- const handlePreviewDragCancel = React.useCallback(() => {
43
- resetState();
44
- }, [resetState]);
45
- return {
46
- handlePreviewDragStart,
47
- handlePreviewDragMove,
48
- handlePreviewDragOver,
49
- handlePreviewDragEnd,
50
- handlePreviewDragCancel
51
- };
52
- };
53
-
54
- exports.useTreePreviewHandlers = useTreePreviewHandlers;
@@ -1,2 +0,0 @@
1
- 'use strict';
2
-
@@ -1,52 +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
- var SortableItemContext = require('../../parts/HoC/SortableItemContext.js');
9
-
10
- const getMinDepth = item => {
11
- if (item) return item.depth;
12
- return 0;
13
- };
14
-
15
- const getProjection = (items, visibleItemsDictionary, overId, dropIndicatorPosition, isExpandable) => {
16
- const overItemIndex = visibleItemsDictionary[overId].realIndex;
17
- const previousItem = items[overItemIndex];
18
- const nextItem = items[overItemIndex + 1];
19
-
20
- if (dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.Inside && isExpandable) {
21
- return {
22
- depth: visibleItemsDictionary[overId].depth + 1,
23
- parentId: overId
24
- };
25
- }
26
-
27
- if (dropIndicatorPosition === SortableItemContext.DropIndicatorPosition.Before) {
28
- return {
29
- depth: getMinDepth(previousItem),
30
- parentId: previousItem.parentId
31
- };
32
- }
33
-
34
- return {
35
- depth: getMinDepth(nextItem),
36
- parentId: nextItem === null || nextItem === void 0 ? void 0 : nextItem.parentId
37
- };
38
- };
39
- const removeChildrenOf = (items, id) => {
40
- const excludeParentIds = [id];
41
- return items.filter(item => {
42
- if (item.parentId !== null && excludeParentIds.includes(item.parentId)) {
43
- excludeParentIds.push(item.uid);
44
- return false;
45
- }
46
-
47
- return true;
48
- });
49
- };
50
-
51
- exports.getProjection = getProjection;
52
- exports.removeChildrenOf = removeChildrenOf;
@@ -1,85 +0,0 @@
1
- import 'core-js/modules/esnext.async-iterator.filter.js';
2
- import 'core-js/modules/esnext.iterator.constructor.js';
3
- import 'core-js/modules/esnext.iterator.filter.js';
4
- import 'core-js/modules/esnext.async-iterator.find.js';
5
- import 'core-js/modules/esnext.iterator.find.js';
6
- import 'core-js/modules/esnext.async-iterator.for-each.js';
7
- import 'core-js/modules/esnext.iterator.for-each.js';
8
- import { DATA_TESTID } from '../../../configs/constants.js';
9
- import 'core-js/modules/web.dom-collections.iterator.js';
10
- import 'core-js/modules/esnext.async-iterator.reduce.js';
11
- import 'core-js/modules/esnext.iterator.reduce.js';
12
- import 'react';
13
- import 'react-virtual';
14
- import '../../../configs/useRowFlattenization.js';
15
- import '@babel/runtime/helpers/esm/defineProperty';
16
- import 'core-js/modules/esnext.async-iterator.map.js';
17
- import 'core-js/modules/esnext.iterator.map.js';
18
- import '@babel/runtime/helpers/esm/jsx';
19
- import '@elliemae/ds-icons';
20
- import 'styled-components';
21
- import '../../../styled.js';
22
- import 'react/jsx-runtime';
23
- import '@elliemae/ds-form';
24
- import '../../../parts/TableContent.js';
25
- import '@elliemae/ds-grid';
26
- import '@elliemae/ds-circular-progress-indicator';
27
- import '@elliemae/ds-system';
28
- import '@elliemae/ds-button';
29
- import '../../../DataTableContext.js';
30
- import '../../../parts/Row.js';
31
- import '../../../parts/Footer.js';
32
- import '../../../parts/HoC/SortableItemContext.js';
33
-
34
- const customCollisionDetection = (activeId, activeParent, dndItems) => _ref => {
35
- var _document$querySelect, _document$querySelect2;
36
-
37
- let {
38
- droppableContainers,
39
- collisionRect
40
- } = _ref;
41
- const entriesWithSameParent = droppableContainers.filter(_ref2 => {
42
- var _dndItems$find;
43
-
44
- let {
45
- id
46
- } = _ref2;
47
- return ((_dndItems$find = dndItems.find(item => item.id === id)) === null || _dndItems$find === void 0 ? void 0 : _dndItems$find.parentId) === activeParent;
48
- });
49
- const dragOverlayRect = (_document$querySelect = (_document$querySelect2 = document.querySelector("[data-testid=\"".concat(DATA_TESTID.DATA_TABLE_COLUMN_DRAG_OVERLAY, "\"]"))) === null || _document$querySelect2 === void 0 ? void 0 : _document$querySelect2.getBoundingClientRect()) !== null && _document$querySelect !== void 0 ? _document$querySelect : {
50
- width: 150
51
- };
52
- const originalContainer = entriesWithSameParent.find(_ref3 => {
53
- let {
54
- id
55
- } = _ref3;
56
- return id === activeId;
57
- });
58
- const originalRect = originalContainer.rect.current;
59
-
60
- if (originalRect.offsetLeft <= collisionRect.offsetLeft && collisionRect.offsetLeft <= originalRect.offsetLeft + originalRect.width) {
61
- return originalContainer.id;
62
- }
63
-
64
- const isLeft = collisionRect.offsetLeft <= originalRect.offsetLeft + dragOverlayRect.width / 2 + 5;
65
- let match = null; // If going to the left, search the closest offset left
66
- // Otherwise, get the closest offset right
67
-
68
- const collisionPoint = collisionRect.offsetLeft + dragOverlayRect.width / 2;
69
- entriesWithSameParent.forEach(entry => {
70
- const {
71
- rect: {
72
- current: rect
73
- }
74
- } = entry;
75
- const offsetRight = rect.offsetLeft + rect.width;
76
- if (!match) match = entry;else if (isLeft && Math.abs(collisionPoint - rect.offsetLeft) <= Math.abs(collisionPoint - match.rect.current.offsetLeft)) {
77
- match = entry;
78
- } else if (!isLeft && Math.abs(collisionPoint - offsetRight) <= Math.abs(collisionPoint - match.rect.current.offsetLeft - match.rect.current.width)) {
79
- match = entry;
80
- }
81
- });
82
- return match === null ? null : match.id;
83
- };
84
-
85
- export { customCollisionDetection };
@@ -1,135 +0,0 @@
1
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
2
- import 'core-js/modules/esnext.async-iterator.find.js';
3
- import 'core-js/modules/esnext.iterator.constructor.js';
4
- import 'core-js/modules/esnext.iterator.find.js';
5
- import 'core-js/modules/esnext.async-iterator.for-each.js';
6
- import 'core-js/modules/esnext.iterator.for-each.js';
7
- import 'core-js/modules/esnext.async-iterator.filter.js';
8
- import 'core-js/modules/esnext.iterator.filter.js';
9
- import { KeyboardCode, getViewRect, closestCorners } from '@dnd-kit/core';
10
- import { DATA_TESTID } from '../../../configs/constants.js';
11
- import 'core-js/modules/web.dom-collections.iterator.js';
12
- import 'core-js/modules/esnext.async-iterator.reduce.js';
13
- import 'core-js/modules/esnext.iterator.reduce.js';
14
- import 'react';
15
- import 'react-virtual';
16
- import '../../../configs/useRowFlattenization.js';
17
- import 'core-js/modules/esnext.async-iterator.map.js';
18
- import 'core-js/modules/esnext.iterator.map.js';
19
- import '@babel/runtime/helpers/esm/jsx';
20
- import '@elliemae/ds-icons';
21
- import 'styled-components';
22
- import '../../../styled.js';
23
- import 'react/jsx-runtime';
24
- import '@elliemae/ds-form';
25
- import '../../../parts/TableContent.js';
26
- import '@elliemae/ds-grid';
27
- import '@elliemae/ds-circular-progress-indicator';
28
- import '@elliemae/ds-system';
29
- import '@elliemae/ds-button';
30
- import '../../../DataTableContext.js';
31
- import '../../../parts/Row.js';
32
- import '../../../parts/Footer.js';
33
- import '../../../parts/HoC/SortableItemContext.js';
34
-
35
- 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; }
36
-
37
- 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(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; }
38
- const directions = [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];
39
- const vertical = [KeyboardCode.Up, KeyboardCode.Down];
40
-
41
- const getHorizontalKeyboardCoordinates = _ref => {
42
- var _document$querySelect, _document$querySelect2;
43
-
44
- let {
45
- items,
46
- active,
47
- over,
48
- event,
49
- currentCoordinates,
50
- droppableContainers,
51
- collisionRect
52
- } = _ref;
53
- if (vertical.includes(event.code)) return undefined;
54
- const activeItem = items.find(item => item.id === active.id);
55
- const overRect = over.rect;
56
- const layoutRects = []; // Get the reacheable rects depending on the arrow key pressed
57
-
58
- droppableContainers.forEach(container => {
59
- if (container !== null && container !== void 0 && container.disabled || !overRect) {
60
- return;
61
- }
62
-
63
- const node = container === null || container === void 0 ? void 0 : container.node.current;
64
-
65
- if (!node) {
66
- return;
67
- }
68
-
69
- const itemParent = items.find(item => item.id === container.id).parentId;
70
- if (itemParent !== activeItem.parentId) return;
71
- const rect = getViewRect(node);
72
-
73
- if (event.code === KeyboardCode.Left && collisionRect.left > rect.right - 10) {
74
- layoutRects.push(container);
75
- } else if (event.code === KeyboardCode.Right && collisionRect.left < rect.left) {
76
- layoutRects.push(container);
77
- }
78
- });
79
- const dragOverlayRect = (_document$querySelect = (_document$querySelect2 = document.querySelector("[data-testid=\"".concat(DATA_TESTID.DATA_TABLE_COLUMN_DRAG_OVERLAY, "\"]"))) === null || _document$querySelect2 === void 0 ? void 0 : _document$querySelect2.getBoundingClientRect()) !== null && _document$querySelect !== void 0 ? _document$querySelect : {
80
- width: 150,
81
- left: 0
82
- };
83
- const closestId = closestCorners({
84
- droppableContainers: layoutRects,
85
- collisionRect,
86
- active
87
- });
88
- if (!closestId) return undefined;
89
- const closestRect = getViewRect(droppableContainers.get(closestId).node.current);
90
- const activeRect = getViewRect(droppableContainers.get(active.id).node.current);
91
- return _objectSpread(_objectSpread({}, currentCoordinates), {}, {
92
- x: closestRect.left + (closestRect.width - dragOverlayRect.width) / 2 + (closestRect.offsetLeft < activeRect.left ? -1 : 1)
93
- });
94
- };
95
-
96
- const getHierarchyKeyboardCoordinates = (context, isHorizontalDnD) => (event, _ref2) => {
97
- let {
98
- currentCoordinates,
99
- context: {
100
- active,
101
- over,
102
- collisionRect,
103
- droppableContainers
104
- }
105
- } = _ref2;
106
-
107
- if (directions.includes(event.code)) {
108
- event.preventDefault();
109
-
110
- if (!collisionRect) {
111
- return undefined;
112
- }
113
-
114
- const {
115
- current: {
116
- items
117
- }
118
- } = context;
119
- const args = {
120
- items,
121
- active,
122
- over,
123
- event,
124
- currentCoordinates,
125
- droppableContainers,
126
- collisionRect
127
- };
128
- if (isHorizontalDnD) return getHorizontalKeyboardCoordinates(args);
129
- return undefined;
130
- }
131
-
132
- return undefined;
133
- };
134
-
135
- export { getHierarchyKeyboardCoordinates };
@@ -1 +0,0 @@
1
-
@@ -1,51 +0,0 @@
1
- import { useCallback } from 'react';
2
-
3
- const useHierarchyActionHandlers = _ref => {
4
- let {
5
- handlePreviewDragStart,
6
- handlePreviewDragMove,
7
- handlePreviewDragOver,
8
- handlePreviewDragEnd,
9
- handlePreviewDragCancel,
10
- onReorder,
11
- dndItems
12
- } = _ref;
13
- const onDragStart = useCallback(e => {
14
- handlePreviewDragStart(e);
15
- }, [handlePreviewDragStart]);
16
- const onDragMove = useCallback(e => {
17
- handlePreviewDragMove(e);
18
- }, [handlePreviewDragMove]);
19
- const onDragOver = useCallback(e => {
20
- handlePreviewDragOver(e);
21
- }, [handlePreviewDragOver]);
22
- const onDragEnd = useCallback(e => {
23
- handlePreviewDragEnd(e);
24
- const {
25
- active,
26
- over
27
- } = e;
28
- if (!over) return;
29
-
30
- if (active.id !== over.id) {
31
- const activeIndex = dndItems.findIndex(item => item.id === active.id);
32
- const overIndex = dndItems.findIndex(item => item.id === over.id);
33
- onReorder(dndItems[activeIndex], {
34
- targetIndex: overIndex,
35
- fromIndex: activeIndex
36
- });
37
- }
38
- }, [handlePreviewDragEnd, dndItems, onReorder]);
39
- const onDragCancel = useCallback(e => {
40
- handlePreviewDragCancel(e);
41
- }, [handlePreviewDragCancel]);
42
- return {
43
- onDragStart,
44
- onDragMove,
45
- onDragOver,
46
- onDragEnd,
47
- onDragCancel
48
- };
49
- };
50
-
51
- export { useHierarchyActionHandlers };
@@ -1,32 +0,0 @@
1
- import { useCallback } from 'react';
2
-
3
- const useHierarchyAnnouncements = visibleItemsDictionary => {
4
- const onDragStart = useCallback(id => "Picked up draggable item from position ".concat(visibleItemsDictionary[id].index + 1, "."), [visibleItemsDictionary]);
5
- const onDragMove = useCallback((id, overId) => {
6
- if (overId) {
7
- const overIndex = visibleItemsDictionary[overId].index + 1;
8
- return "Draggable item was moved to position ".concat(overIndex, ".");
9
- }
10
-
11
- return "Draggable item is no longer over a droppable area.";
12
- }, [visibleItemsDictionary]);
13
- const onDragOver = onDragMove;
14
- const onDragEnd = useCallback((id, overId) => {
15
- if (overId) {
16
- const overIndex = visibleItemsDictionary[overId].index + 1;
17
- return "Draggable item was dropped over position ".concat(overIndex, ".");
18
- }
19
-
20
- return "Draggable item was dropped at it's original position.";
21
- }, [visibleItemsDictionary]);
22
- const onDragCancel = useCallback(id => "Dragging was cancelled. Draggable item from position ".concat(visibleItemsDictionary[id].index + 1, " was dropped at it's initial position."), [visibleItemsDictionary]);
23
- return {
24
- onDragStart,
25
- onDragOver,
26
- onDragMove,
27
- onDragEnd,
28
- onDragCancel
29
- };
30
- };
31
-
32
- export { useHierarchyAnnouncements };
@@ -1,105 +0,0 @@
1
- import 'core-js/modules/esnext.async-iterator.filter.js';
2
- import 'core-js/modules/esnext.iterator.filter.js';
3
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
4
- import 'core-js/modules/web.dom-collections.iterator.js';
5
- import 'core-js/modules/esnext.async-iterator.map.js';
6
- import 'core-js/modules/esnext.iterator.map.js';
7
- import 'core-js/modules/esnext.async-iterator.find.js';
8
- import 'core-js/modules/esnext.iterator.constructor.js';
9
- import 'core-js/modules/esnext.iterator.find.js';
10
- import 'core-js/modules/esnext.async-iterator.for-each.js';
11
- import 'core-js/modules/esnext.iterator.for-each.js';
12
- import { useState, useMemo, useRef, useEffect } from 'react';
13
- import { MeasuringStrategy, useSensors, useSensor, PointerSensor, KeyboardSensor } from '@dnd-kit/core';
14
- import { useHierarchyActionHandlers } from './useHierarchyActionHandlers.js';
15
- import { useHierarchyPreviewHandlers } from './useHierarchyPreviewHandlers.js';
16
- import { getHierarchyKeyboardCoordinates } from './getHierarchyKeyboardCoordinates.js';
17
- import { customCollisionDetection } from './customCollisionDetection.js';
18
- import { useHierarchyAnnouncements } from './useHierarchyAnnouncements.js';
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(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
- // if second parameter is true, the space will be done on the horizontal axis
24
-
25
- const adjustTranslate = function (_ref) {
26
- let {
27
- transform
28
- } = _ref;
29
- let isHorizontalDnD = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
30
-
31
- const newTransform = _objectSpread({}, transform);
32
-
33
- if (isHorizontalDnD) {
34
- newTransform.y = transform.y + 15;
35
- } else {
36
- newTransform.y = transform.y - 35;
37
- }
38
-
39
- return newTransform;
40
- };
41
-
42
- const measuring = {
43
- droppable: {
44
- strategy: MeasuringStrategy.Always
45
- }
46
- };
47
-
48
- const useHierarchyDndkitConfig = _ref2 => {
49
- let {
50
- flattenedItems,
51
- isHorizontalDnD = false,
52
- onReorder
53
- } = _ref2;
54
- const [activeId, setActiveId] = useState(null);
55
- const [overId, setOverId] = useState(null);
56
- const dndItems = useMemo(() => flattenedItems.map(_ref3 => {
57
- let [item] = _ref3;
58
- return item;
59
- }), [flattenedItems]);
60
- const activeItem = useMemo(() => dndItems.find(item => item.id === activeId), [activeId, dndItems]);
61
- const itemsDictionary = useMemo(() => {
62
- const dictionary = {};
63
- dndItems.forEach(item => {
64
- dictionary[item.id] = item;
65
- });
66
- return dictionary;
67
- }, [dndItems]);
68
- const modifiers = useMemo(() => [options => adjustTranslate(options, isHorizontalDnD)], [isHorizontalDnD]);
69
- const sensorContext = useRef({
70
- items: dndItems
71
- });
72
- useEffect(() => {
73
- sensorContext.current = {
74
- items: dndItems
75
- };
76
- }, [dndItems]);
77
- const coordinateGetter = useMemo(() => getHierarchyKeyboardCoordinates(sensorContext, isHorizontalDnD), [isHorizontalDnD]);
78
- const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, {
79
- coordinateGetter
80
- }));
81
- const dragPreviewHandlers = useHierarchyPreviewHandlers({
82
- setActiveId,
83
- setOverId
84
- });
85
- const dragActionHandlers = useHierarchyActionHandlers(_objectSpread(_objectSpread({}, dragPreviewHandlers), {}, {
86
- dndItems,
87
- onReorder
88
- }));
89
- const announcements = useHierarchyAnnouncements(itemsDictionary);
90
- const dndContextProps = useMemo(() => _objectSpread({
91
- announcements,
92
- modifiers,
93
- sensors,
94
- measuring,
95
- collisionDetection: customCollisionDetection(activeId, activeItem === null || activeItem === void 0 ? void 0 : activeItem.parentId, dndItems)
96
- }, dragActionHandlers), [announcements, modifiers, sensors, activeId, activeItem === null || activeItem === void 0 ? void 0 : activeItem.parentId, dndItems, dragActionHandlers]);
97
- return {
98
- dndContextProps,
99
- activeId,
100
- overId,
101
- activeIndex: activeId ? activeItem.index : -1
102
- };
103
- };
104
-
105
- export { useHierarchyDndkitConfig as default };