@elliemae/ds-treeview 2.3.0-next.13 → 2.3.0-next.17

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 (8) hide show
  1. package/cjs/TreeViewContext.js +2 -1
  2. package/cjs/parts/DnDHandle.js +1 -1
  3. package/cjs/parts/TreeItem.js +6 -2
  4. package/esm/TreeViewContext.js +2 -1
  5. package/esm/parts/DnDHandle.js +1 -1
  6. package/esm/parts/TreeItem.js +6 -2
  7. package/package.json +10 -10
  8. package/types/parts/DnDHandle.d.ts +4 -2
package/cjs/TreeViewContext.js CHANGED
@@ -70,7 +70,8 @@ const defaultContext = {
70
70
  virtualItems: [],
71
71
  totalSize: 0,
72
72
  scrollToOffset: noop,
73
- scrollToIndex: noop
73
+ scrollToIndex: noop,
74
+ measure: noop
74
75
  },
75
76
  virtualListRef: undefined,
76
77
  uniqueTreeViewUUID: '',
package/cjs/parts/DnDHandle.js CHANGED
@@ -37,7 +37,7 @@ const DnDHandle = _ref => {
37
37
  id: "".concat(id, "-drag-handle"),
38
38
  key: "".concat(id, "-drag-handle"),
39
39
  className: "drag-handle ".concat(isDragging ? '' : 'focuseable'),
40
- color: ['brand-primary', '800'],
40
+ color: isDragging ? ['neutral', '080'] : ['brand-primary', '800'],
41
41
  size: "s",
42
42
  tabIndex: 0
43
43
  }));
package/cjs/parts/TreeItem.js CHANGED
@@ -107,7 +107,7 @@ const TreeItem = props => {
107
107
  }, [isDropIndicatorPositionInside, isDropValid]);
108
108
  const dragOverlayClassName = React.useMemo(() => isDragOverlay ? 'drag-overlay' : '', [isDragOverlay]);
109
109
  const selectedClassName = React.useMemo(() => (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.id) === item.id && !isDragOverlay ? 'selected' : '', [isDragOverlay, item.id, selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.id]);
110
- const hoverClassName = React.useMemo(() => !isDragOverlay && ((hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id) === item.id || isDragging) ? 'hover' : '', [isDragOverlay, hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id, item.id, isDragging]);
110
+ const hoverClassName = React.useMemo(() => !isDragOverlay && (hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id) === item.id && !isDragging ? 'hover' : '', [isDragOverlay, hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id, item.id, isDragging]);
111
111
  const fixedHeightClassname = React.useMemo(() => {
112
112
  if (labelOverflow === 'truncate') {
113
113
  if (rowSize === 'compact') return "".concat(cssClassesConstants.DSTreeViewPrefix, "-").concat(cssClassesConstants.treeItemBlockName, "--fixed-height-compact");
@@ -116,7 +116,11 @@ const TreeItem = props => {
116
116
 
117
117
  return '';
118
118
  }, [labelOverflow, rowSize]);
119
- const finalClassName = React.useMemo(() => "".concat(dropPreviewClassName, " ").concat(fixedHeightClassname, " ").concat(selectedClassName, " ").concat(hoverClassName, " ").concat(dragOverlayClassName), [dropPreviewClassName, selectedClassName, hoverClassName, fixedHeightClassname, dragOverlayClassName]);
119
+ const isDraggingClassname = React.useMemo(() => {
120
+ if (isDragging) return "".concat(cssClassesConstants.DSTreeViewPrefix, "-").concat(cssClassesConstants.treeItemBlockName, "--dragging");
121
+ return '';
122
+ }, [isDragging]);
123
+ const finalClassName = React.useMemo(() => "".concat(dropPreviewClassName, " ").concat(fixedHeightClassname, " ").concat(selectedClassName, " ").concat(hoverClassName, " ").concat(dragOverlayClassName, " ").concat(isDraggingClassname), [dropPreviewClassName, fixedHeightClassname, selectedClassName, hoverClassName, dragOverlayClassName, isDraggingClassname]);
120
124
  const handleItemClick = React.useCallback(e => {
121
125
  onItemClick(item, e);
122
126
  setFocusedItem(item);
package/esm/TreeViewContext.js CHANGED
@@ -66,7 +66,8 @@ const defaultContext = {
66
66
  virtualItems: [],
67
67
  totalSize: 0,
68
68
  scrollToOffset: noop,
69
- scrollToIndex: noop
69
+ scrollToIndex: noop,
70
+ measure: noop
70
71
  },
71
72
  virtualListRef: undefined,
72
73
  uniqueTreeViewUUID: '',
package/esm/parts/DnDHandle.js CHANGED
@@ -29,7 +29,7 @@ const DnDHandle = _ref => {
29
29
  id: "".concat(id, "-drag-handle"),
30
30
  key: "".concat(id, "-drag-handle"),
31
31
  className: "drag-handle ".concat(isDragging ? '' : 'focuseable'),
32
- color: ['brand-primary', '800'],
32
+ color: isDragging ? ['neutral', '080'] : ['brand-primary', '800'],
33
33
  size: "s",
34
34
  tabIndex: 0
35
35
  }));
package/esm/parts/TreeItem.js CHANGED
@@ -98,7 +98,7 @@ const TreeItem = props => {
98
98
  }, [isDropIndicatorPositionInside, isDropValid]);
99
99
  const dragOverlayClassName = useMemo(() => isDragOverlay ? 'drag-overlay' : '', [isDragOverlay]);
100
100
  const selectedClassName = useMemo(() => (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.id) === item.id && !isDragOverlay ? 'selected' : '', [isDragOverlay, item.id, selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.id]);
101
- const hoverClassName = useMemo(() => !isDragOverlay && ((hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id) === item.id || isDragging) ? 'hover' : '', [isDragOverlay, hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id, item.id, isDragging]);
101
+ const hoverClassName = useMemo(() => !isDragOverlay && (hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id) === item.id && !isDragging ? 'hover' : '', [isDragOverlay, hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id, item.id, isDragging]);
102
102
  const fixedHeightClassname = useMemo(() => {
103
103
  if (labelOverflow === 'truncate') {
104
104
  if (rowSize === 'compact') return "".concat(DSTreeViewPrefix, "-").concat(treeItemBlockName, "--fixed-height-compact");
@@ -107,7 +107,11 @@ const TreeItem = props => {
107
107
 
108
108
  return '';
109
109
  }, [labelOverflow, rowSize]);
110
- const finalClassName = useMemo(() => "".concat(dropPreviewClassName, " ").concat(fixedHeightClassname, " ").concat(selectedClassName, " ").concat(hoverClassName, " ").concat(dragOverlayClassName), [dropPreviewClassName, selectedClassName, hoverClassName, fixedHeightClassname, dragOverlayClassName]);
110
+ const isDraggingClassname = useMemo(() => {
111
+ if (isDragging) return "".concat(DSTreeViewPrefix, "-").concat(treeItemBlockName, "--dragging");
112
+ return '';
113
+ }, [isDragging]);
114
+ const finalClassName = useMemo(() => "".concat(dropPreviewClassName, " ").concat(fixedHeightClassname, " ").concat(selectedClassName, " ").concat(hoverClassName, " ").concat(dragOverlayClassName, " ").concat(isDraggingClassname), [dropPreviewClassName, fixedHeightClassname, selectedClassName, hoverClassName, dragOverlayClassName, isDraggingClassname]);
111
115
  const handleItemClick = useCallback(e => {
112
116
  onItemClick(item, e);
113
117
  setFocusedItem(item);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-treeview",
3
- "version": "2.3.0-next.13",
3
+ "version": "2.3.0-next.17",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Tree View",
6
6
  "module": "./esm/index.js",
@@ -227,15 +227,15 @@
227
227
  "generateSubmodules": true
228
228
  },
229
229
  "dependencies": {
230
- "@elliemae/ds-button": "2.3.0-next.13",
231
- "@elliemae/ds-circular-progress-indicator": "2.3.0-next.13",
232
- "@elliemae/ds-classnames": "2.3.0-next.13",
233
- "@elliemae/ds-form": "2.3.0-next.13",
234
- "@elliemae/ds-icons": "2.3.0-next.13",
235
- "@elliemae/ds-props-helpers": "2.3.0-next.13",
236
- "@elliemae/ds-shared": "2.3.0-next.13",
237
- "@elliemae/ds-truncated-tooltip-text": "2.3.0-next.13",
238
- "@elliemae/ds-utilities": "2.3.0-next.13",
230
+ "@elliemae/ds-button": "2.3.0-next.17",
231
+ "@elliemae/ds-circular-progress-indicator": "2.3.0-next.17",
232
+ "@elliemae/ds-classnames": "2.3.0-next.17",
233
+ "@elliemae/ds-form": "2.3.0-next.17",
234
+ "@elliemae/ds-icons": "2.3.0-next.17",
235
+ "@elliemae/ds-props-helpers": "2.3.0-next.17",
236
+ "@elliemae/ds-shared": "2.3.0-next.17",
237
+ "@elliemae/ds-truncated-tooltip-text": "2.3.0-next.17",
238
+ "@elliemae/ds-utilities": "2.3.0-next.17",
239
239
  "@elliemae/react-sortable-hoc": "^1.0.0",
240
240
  "react-desc": "~4.1.3",
241
241
  "react-highlight-words": "~0.17.0",
package/types/parts/DnDHandle.d.ts CHANGED
@@ -1,6 +1,8 @@
1
1
  /// <reference types="react" />
2
2
  import { DSTreeviewT } from '../react-desc-prop-types';
3
- export declare const DnDHandle: ({ id, isDragOverlay }: {
3
+ interface DnDHandleProps {
4
4
  id: DSTreeviewT.StringOrNum;
5
5
  isDragOverlay: boolean;
6
- }) => JSX.Element;
6
+ }
7
+ export declare const DnDHandle: ({ id, isDragOverlay }: DnDHandleProps) => JSX.Element;
8
+ export {};