@elliemae/ds-treeview 2.3.0-alpha.1 → 2.3.0-alpha.10

package/{types → dist/types}/react-desc-prop-types.d.ts

@@ -13,7 +13,7 @@ export declare namespace DSTreeviewT {
     interface SimpleItem {
         [key: string]: unknown;
         name: string;
-        children: SimpleItem[];
+        children?: SimpleItem[];
         id: StringOrNum;
     }
     interface Item extends SimpleItem {
@@ -27,9 +27,19 @@ export declare namespace DSTreeviewT {
         matchesSearchQuery?: boolean;
         nodeItemRef?: React.RefObject<HTMLLIElement>;
         model: TreeModel.Node<Item>['model'];
-        node: TreeModel.Node<Item>;
+        node: TreeModel.Node<Item> & {
+            parent?: TreeModel.Node<Item>;
+        };
         nodePath: TreeModel.Node<Item>[];
     }
+    interface DndItem {
+        uid: string;
+        depth: number;
+        realIndex: number;
+        childrenCount: number;
+        parentId: string | null;
+        original: SimpleItem;
+    }
     interface Actions {
         toggleExpandAll: (isExpand: boolean) => Promise<DSTreeviewT.Item[]>;
         scrollTo: DSTreeviewT.ScrollToFunc;
@@ -50,6 +60,7 @@ export declare namespace DSTreeviewT {
         fluid: boolean;
         isMultiSelect: boolean;
         isSingleSelect: boolean;
+        getIsDropValid: (active: DndItem, over: DndItem, dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside') => boolean;
         restrictDragAndDrop: boolean;
         showChildrenAmount: boolean;
         sortable: boolean;
@@ -62,7 +73,7 @@ export declare namespace DSTreeviewT {
             item: Item;
         }) => void;
         onVisibleItemsChange: (newVisibleItems: Item[]) => void;
-        onOrderChange: (newData: Item[], oldData: Item[], draggedItem: Item) => void;
+        onOrderChange: (newData: SimpleItem[], oldData: SimpleItem[], draggedItem: DndItem) => void;
         onSelectionChange: (selection: SelectionItems, item: Item, meta: {
             scrollToItem: ScrollToItemFunc;
             itemIndex: number;
@@ -124,6 +135,9 @@ export declare const TreeViewPropTypes: {
     isLoading: {
         deprecated: import("react-desc").PropTypesDescValidator;
     };
+    getIsDropValid: {
+        deprecated: import("react-desc").PropTypesDescValidator;
+    };
     restrictDragAndDrop: {
         deprecated: import("react-desc").PropTypesDescValidator;
     };

package/{types → dist/types}/sharedTypes.d.ts

@@ -19,22 +19,15 @@ export declare namespace DSTreeviewInternalsT {
     interface CTX {
         props: DSTreeviewT.Props;
         visibleItems: DSTreeviewT.Item[];
+        flattenedItems: DSTreeviewT.DndItem[];
         withRadioChecks: boolean;
         withCheckboxChecks: boolean;
         withDragAndDrop: boolean;
-        relativeMouseCord: MouseCoord;
-        setRelativeMouseCord: StateSetter<MouseCoord>;
         triggerTreeRerender: () => void;
         tree?: TreeModel;
         treeRoot?: TreeModel.Node<DSTreeviewT.Item>;
         virtualListHelpers: ReturnType<typeof useVirtual>;
         virtualListRef?: React.MutableRefObject<HTMLUListElement | undefined>;
-        isDragging: boolean;
-        setIsDragging: StateSetter<boolean>;
-        isKeyboardDragging: boolean;
-        setIsKeyboardDragging: StateSetter<boolean>;
-        draggedItem: DSTreeviewT.Item | null;
-        setDraggedItem: StateSetter<DSTreeviewT.Item | null>;
         uniqueTreeViewUUID: string;
         selectedItem: DSTreeviewT.Item | null;
         setSelectedItem: StateSetter<DSTreeviewT.Item | null>;

package/{types → dist/types}/utils/keyboard-helpers.d.ts

@@ -1,5 +1,6 @@
 import type { DSTreeviewT } from '../react-desc-prop-types';
 import type { DSTreeviewInternalsT } from '../sharedTypes';
-export declare const useOnItemKeyDown: (item: DSTreeviewT.Item) => (e: React.KeyboardEvent<HTMLLIElement>) => void;
+import { SortableItemContextType } from '../hoc/SortableItemContext';
+export declare const useOnItemKeyDown: (item: DSTreeviewT.Item, draggableProps: SortableItemContextType['draggableProps']) => (e: React.KeyboardEvent<HTMLLIElement>) => void;
 export declare const useGlobalKeyboardListener: (func: (e: KeyboardEvent) => void) => void;
 export declare const useGlobalToggleAllExpandShortcut: (treeRoot: DSTreeviewT.Item['node'], triggerTreeRerender: () => void, setLatestToggledItem: DSTreeviewInternalsT.CTX['setLatestToggledItem'], updateUserExpandedState: DSTreeviewInternalsT.CTX['updateUserExpandedState']) => void;

package/{types → dist/types}/utils/refs-helpers.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
-declare type GenericMergeableRef = null | undefined | React.MutableRefObject<unknown> | ((ref: HTMLElement) => void);
+declare type GenericMergeableRef = null | undefined | React.MutableRefObject<unknown> | ((ref: HTMLElement) => void) | false;
 export declare const setMultipleRefs: (...refs: GenericMergeableRef[]) => (ref: HTMLElement) => void;
 export {};

package/{types → dist/types}/utils/tree-helpers.d.ts

@@ -7,7 +7,9 @@ export declare const walkAllNodeChildren: (node: DSTreeviewT.Item['node'], callb
 export declare const getNodeById: (treeRoot: DSTreeviewT.Item['node'], id: DSTreeviewT.StringOrNum) => TreeModel.Node<DSTreeviewT.Item>;
 export declare const cloneNode: (tree: TreeModel, node: DSTreeviewT.Item) => TreeModel.Node<DSTreeviewT.Item>;
 export declare const itemsShareSameParent: (items?: DSTreeviewT.Item[]) => boolean;
-export declare const getItemsParentNode: (items?: DSTreeviewT.Item[], skipSameParentCheck?: boolean) => TreeModel.Node<DSTreeviewT.Item>;
+export declare const getItemsParentNode: (items?: DSTreeviewT.Item[], skipSameParentCheck?: boolean) => TreeModel.Node<DSTreeviewT.Item> & {
+    parent?: TreeModel.Node<DSTreeviewT.Item> | undefined;
+};
 export declare const getNodeMatchesSearchQuery: (node: DSTreeviewT.Item['node'], searchQuery?: string) => boolean;
 export declare const getChildrenMatchesSearchQuery: (parentNode: DSTreeviewT.Item['node'], searchQuery?: string) => boolean;
 /**
@@ -22,4 +24,5 @@ export declare const getChildrenMatchesSearchQuery: (parentNode: DSTreeviewT.Ite
  */
 export declare const enrichNodeModelInPlace: (node: TreeModel.Node<DSTreeviewT.SimpleItem>, searchQuery?: string, selection?: DSTreeviewT.SelectionItems | null, expanded?: DSTreeviewT.ExpandedItems | null) => void;
 export declare const focusItem: (item: DSTreeviewT.Item | null) => void;
+export declare const flattenTreeForDnD: (data: DSTreeviewT.SimpleItem[], shouldDescend?: (datum: DSTreeviewT.SimpleItem) => boolean) => DSTreeviewT.DndItem[];
 export {};

package/{types → dist/types}/utils/useTree.d.ts

@@ -5,6 +5,7 @@ export declare const useTree: (data: DSTreeviewT.SimpleItem[], props: DSTreeview
     setExpandedGroups: DSTreeviewInternalsT.StateSetter<DSTreeviewT.ExpandedItems>;
 }) => {
     visibleItems: DSTreeviewT.Item[];
+    flattenedItems: DSTreeviewT.DndItem[];
     tree: TreeModel;
     treeRoot: TreeModel.Node<DSTreeviewT.Item>;
     rerenderItems: {};

package/package.json

@@ -1,187 +1,206 @@
 {
   "name": "@elliemae/ds-treeview",
-  "version": "2.3.0-alpha.1",
+  "version": "2.3.0-alpha.10",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Tree View",
-  "module": "./esm/index.js",
-  "main": "./cjs/index.js",
-  "types": "./types/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "module": "./dist/esm/index.js",
+  "main": "./dist/cjs/index.js",
+  "types": "./dist/types/index.d.ts",
   "exports": {
     ".": {
-      "import": "./esm/index.js",
-      "require": "./cjs/index.js"
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js"
     },
     "./utils/useTree": {
-      "import": "./esm/utils/useTree.js",
-      "require": "./cjs/utils/useTree.js"
+      "import": "./dist/esm/utils/useTree.js",
+      "require": "./dist/cjs/utils/useTree.js"
     },
     "./utils/useInstanceRefActions": {
-      "import": "./esm/utils/useInstanceRefActions.js",
-      "require": "./cjs/utils/useInstanceRefActions.js"
-    },
-    "./utils/useDnDHelpers": {
-      "import": "./esm/utils/useDnDHelpers.js",
-      "require": "./cjs/utils/useDnDHelpers.js"
+      "import": "./dist/esm/utils/useInstanceRefActions.js",
+      "require": "./dist/cjs/utils/useInstanceRefActions.js"
     },
     "./utils/tree-helpers": {
-      "import": "./esm/utils/tree-helpers.js",
-      "require": "./cjs/utils/tree-helpers.js"
+      "import": "./dist/esm/utils/tree-helpers.js",
+      "require": "./dist/cjs/utils/tree-helpers.js"
     },
     "./utils/string-helpers": {
-      "import": "./esm/utils/string-helpers.js",
-      "require": "./cjs/utils/string-helpers.js"
+      "import": "./dist/esm/utils/string-helpers.js",
+      "require": "./dist/cjs/utils/string-helpers.js"
     },
     "./utils/selectable-helper": {
-      "import": "./esm/utils/selectable-helper.js",
-      "require": "./cjs/utils/selectable-helper.js"
+      "import": "./dist/esm/utils/selectable-helper.js",
+      "require": "./dist/cjs/utils/selectable-helper.js"
     },
     "./utils/refs-helpers": {
-      "import": "./esm/utils/refs-helpers.js",
-      "require": "./cjs/utils/refs-helpers.js"
+      "import": "./dist/esm/utils/refs-helpers.js",
+      "require": "./dist/cjs/utils/refs-helpers.js"
     },
     "./utils/object-helpers": {
-      "import": "./esm/utils/object-helpers.js",
-      "require": "./cjs/utils/object-helpers.js"
+      "import": "./dist/esm/utils/object-helpers.js",
+      "require": "./dist/cjs/utils/object-helpers.js"
     },
     "./utils/keyboard-helpers": {
-      "import": "./esm/utils/keyboard-helpers.js",
-      "require": "./cjs/utils/keyboard-helpers.js"
+      "import": "./dist/esm/utils/keyboard-helpers.js",
+      "require": "./dist/cjs/utils/keyboard-helpers.js"
     },
     "./utils/group-expands-helpers": {
-      "import": "./esm/utils/group-expands-helpers.js",
-      "require": "./cjs/utils/group-expands-helpers.js"
-    },
-    "./utils/dnd-helpers": {
-      "import": "./esm/utils/dnd-helpers.js",
-      "require": "./cjs/utils/dnd-helpers.js"
+      "import": "./dist/esm/utils/group-expands-helpers.js",
+      "require": "./dist/cjs/utils/group-expands-helpers.js"
     },
     "./utils/array-helpers": {
-      "import": "./esm/utils/array-helpers.js",
-      "require": "./cjs/utils/array-helpers.js"
+      "import": "./dist/esm/utils/array-helpers.js",
+      "require": "./dist/cjs/utils/array-helpers.js"
     },
     "./TreeViewContext": {
-      "import": "./esm/TreeViewContext.js",
-      "require": "./cjs/TreeViewContext.js"
+      "import": "./dist/esm/TreeViewContext.js",
+      "require": "./dist/cjs/TreeViewContext.js"
     },
     "./TreeView": {
-      "import": "./esm/TreeView.js",
-      "require": "./cjs/TreeView.js"
+      "import": "./dist/esm/TreeView.js",
+      "require": "./dist/cjs/TreeView.js"
     },
     "./sharedTypes": {
-      "import": "./esm/sharedTypes.js",
-      "require": "./cjs/sharedTypes.js"
+      "import": "./dist/esm/sharedTypes.js",
+      "require": "./dist/cjs/sharedTypes.js"
     },
     "./related-components/TreeViewSearchBar": {
-      "import": "./esm/related-components/TreeViewSearchBar.js",
-      "require": "./cjs/related-components/TreeViewSearchBar.js"
+      "import": "./dist/esm/related-components/TreeViewSearchBar.js",
+      "require": "./dist/cjs/related-components/TreeViewSearchBar.js"
     },
     "./react-desc-prop-types": {
-      "import": "./esm/react-desc-prop-types.js",
-      "require": "./cjs/react-desc-prop-types.js"
+      "import": "./dist/esm/react-desc-prop-types.js",
+      "require": "./dist/cjs/react-desc-prop-types.js"
     },
     "./plugins/virtualization/TreeVirtualizationPlugin": {
-      "import": "./esm/plugins/virtualization/TreeVirtualizationPlugin.js",
-      "require": "./cjs/plugins/virtualization/TreeVirtualizationPlugin.js"
+      "import": "./dist/esm/plugins/virtualization/TreeVirtualizationPlugin.js",
+      "require": "./dist/cjs/plugins/virtualization/TreeVirtualizationPlugin.js"
     },
     "./plugins/virtualization": {
-      "import": "./esm/plugins/virtualization/index.js",
-      "require": "./cjs/plugins/virtualization/index.js"
+      "import": "./dist/esm/plugins/virtualization/index.js",
+      "require": "./dist/cjs/plugins/virtualization/index.js"
     },
     "./plugins/tree/TreeDataPlugin": {
-      "import": "./esm/plugins/tree/TreeDataPlugin.js",
-      "require": "./cjs/plugins/tree/TreeDataPlugin.js"
+      "import": "./dist/esm/plugins/tree/TreeDataPlugin.js",
+      "require": "./dist/cjs/plugins/tree/TreeDataPlugin.js"
     },
     "./plugins/tree": {
-      "import": "./esm/plugins/tree/index.js",
-      "require": "./cjs/plugins/tree/index.js"
+      "import": "./dist/esm/plugins/tree/index.js",
+      "require": "./dist/cjs/plugins/tree/index.js"
     },
     "./plugins/toolbar/TreeToolbarPlugin": {
-      "import": "./esm/plugins/toolbar/TreeToolbarPlugin.js",
-      "require": "./cjs/plugins/toolbar/TreeToolbarPlugin.js"
+      "import": "./dist/esm/plugins/toolbar/TreeToolbarPlugin.js",
+      "require": "./dist/cjs/plugins/toolbar/TreeToolbarPlugin.js"
     },
     "./plugins/toolbar": {
-      "import": "./esm/plugins/toolbar/index.js",
-      "require": "./cjs/plugins/toolbar/index.js"
+      "import": "./dist/esm/plugins/toolbar/index.js",
+      "require": "./dist/cjs/plugins/toolbar/index.js"
     },
     "./plugins/selectable/SelectablePluginTree": {
-      "import": "./esm/plugins/selectable/SelectablePluginTree.js",
-      "require": "./cjs/plugins/selectable/SelectablePluginTree.js"
+      "import": "./dist/esm/plugins/selectable/SelectablePluginTree.js",
+      "require": "./dist/cjs/plugins/selectable/SelectablePluginTree.js"
     },
     "./plugins/selectable": {
-      "import": "./esm/plugins/selectable/index.js",
-      "require": "./cjs/plugins/selectable/index.js"
+      "import": "./dist/esm/plugins/selectable/index.js",
+      "require": "./dist/cjs/plugins/selectable/index.js"
     },
     "./plugins/searchable/SearchableTreePlugin": {
-      "import": "./esm/plugins/searchable/SearchableTreePlugin.js",
-      "require": "./cjs/plugins/searchable/SearchableTreePlugin.js"
+      "import": "./dist/esm/plugins/searchable/SearchableTreePlugin.js",
+      "require": "./dist/cjs/plugins/searchable/SearchableTreePlugin.js"
     },
     "./plugins/searchable": {
-      "import": "./esm/plugins/searchable/index.js",
-      "require": "./cjs/plugins/searchable/index.js"
+      "import": "./dist/esm/plugins/searchable/index.js",
+      "require": "./dist/cjs/plugins/searchable/index.js"
     },
     "./plugins/roving/TreeRovingPlugin": {
-      "import": "./esm/plugins/roving/TreeRovingPlugin.js",
-      "require": "./cjs/plugins/roving/TreeRovingPlugin.js"
+      "import": "./dist/esm/plugins/roving/TreeRovingPlugin.js",
+      "require": "./dist/cjs/plugins/roving/TreeRovingPlugin.js"
     },
     "./plugins/roving": {
-      "import": "./esm/plugins/roving/index.js",
-      "require": "./cjs/plugins/roving/index.js"
+      "import": "./dist/esm/plugins/roving/index.js",
+      "require": "./dist/cjs/plugins/roving/index.js"
     },
     "./plugins": {
-      "import": "./esm/plugins/index.js",
-      "require": "./cjs/plugins/index.js"
+      "import": "./dist/esm/plugins/index.js",
+      "require": "./dist/cjs/plugins/index.js"
     },
     "./plugins/dnd/TreeDndPlugin": {
-      "import": "./esm/plugins/dnd/TreeDndPlugin.js",
-      "require": "./cjs/plugins/dnd/TreeDndPlugin.js"
+      "import": "./dist/esm/plugins/dnd/TreeDndPlugin.js",
+      "require": "./dist/cjs/plugins/dnd/TreeDndPlugin.js"
     },
     "./plugins/dnd": {
-      "import": "./esm/plugins/dnd/index.js",
-      "require": "./cjs/plugins/dnd/index.js"
+      "import": "./dist/esm/plugins/dnd/index.js",
+      "require": "./dist/cjs/plugins/dnd/index.js"
     },
     "./parts/TreeList": {
-      "import": "./esm/parts/TreeList.js",
-      "require": "./cjs/parts/TreeList.js"
+      "import": "./dist/esm/parts/TreeList.js",
+      "require": "./dist/cjs/parts/TreeList.js"
     },
     "./parts/TreeItemText": {
-      "import": "./esm/parts/TreeItemText.js",
-      "require": "./cjs/parts/TreeItemText.js"
+      "import": "./dist/esm/parts/TreeItemText.js",
+      "require": "./dist/cjs/parts/TreeItemText.js"
     },
     "./parts/TreeItem": {
-      "import": "./esm/parts/TreeItem.js",
-      "require": "./cjs/parts/TreeItem.js"
+      "import": "./dist/esm/parts/TreeItem.js",
+      "require": "./dist/cjs/parts/TreeItem.js"
     },
     "./parts/RadioSelectable": {
-      "import": "./esm/parts/RadioSelectable.js",
-      "require": "./cjs/parts/RadioSelectable.js"
+      "import": "./dist/esm/parts/RadioSelectable.js",
+      "require": "./dist/cjs/parts/RadioSelectable.js"
     },
     "./parts/NestingSpace": {
-      "import": "./esm/parts/NestingSpace.js",
-      "require": "./cjs/parts/NestingSpace.js"
+      "import": "./dist/esm/parts/NestingSpace.js",
+      "require": "./dist/cjs/parts/NestingSpace.js"
     },
     "./parts/Icon": {
-      "import": "./esm/parts/Icon.js",
-      "require": "./cjs/parts/Icon.js"
+      "import": "./dist/esm/parts/Icon.js",
+      "require": "./dist/cjs/parts/Icon.js"
     },
     "./parts/ExpandCaret": {
-      "import": "./esm/parts/ExpandCaret.js",
-      "require": "./cjs/parts/ExpandCaret.js"
+      "import": "./dist/esm/parts/ExpandCaret.js",
+      "require": "./dist/cjs/parts/ExpandCaret.js"
+    },
+    "./parts/DropIndicator": {
+      "import": "./dist/esm/parts/DropIndicator.js",
+      "require": "./dist/cjs/parts/DropIndicator.js"
+    },
+    "./parts/DnDHandle": {
+      "import": "./dist/esm/parts/DnDHandle.js",
+      "require": "./dist/cjs/parts/DnDHandle.js"
     },
     "./parts/ChildrenCountDisplayer": {
-      "import": "./esm/parts/ChildrenCountDisplayer.js",
-      "require": "./cjs/parts/ChildrenCountDisplayer.js"
+      "import": "./dist/esm/parts/ChildrenCountDisplayer.js",
+      "require": "./dist/cjs/parts/ChildrenCountDisplayer.js"
     },
     "./parts/CheckboxSelectable": {
-      "import": "./esm/parts/CheckboxSelectable.js",
-      "require": "./cjs/parts/CheckboxSelectable.js"
+      "import": "./dist/esm/parts/CheckboxSelectable.js",
+      "require": "./dist/cjs/parts/CheckboxSelectable.js"
+    },
+    "./hoc/WithDnDSortableItemContext": {
+      "import": "./dist/esm/hoc/WithDnDSortableItemContext.js",
+      "require": "./dist/cjs/hoc/WithDnDSortableItemContext.js"
+    },
+    "./hoc/WithConditionalDnDContext": {
+      "import": "./dist/esm/hoc/WithConditionalDnDContext.js",
+      "require": "./dist/cjs/hoc/WithConditionalDnDContext.js"
+    },
+    "./hoc/SortableItemContext": {
+      "import": "./dist/esm/hoc/SortableItemContext.js",
+      "require": "./dist/cjs/hoc/SortableItemContext.js"
+    },
+    "./hoc/DnDTreeContext": {
+      "import": "./dist/esm/hoc/DnDTreeContext.js",
+      "require": "./dist/cjs/hoc/DnDTreeContext.js"
     },
     "./config/useTreeview": {
-      "import": "./esm/config/useTreeview.js",
-      "require": "./cjs/config/useTreeview.js"
+      "import": "./dist/esm/config/useTreeview.js",
+      "require": "./dist/cjs/config/useTreeview.js"
     },
     "./config/cssClassesConstants": {
-      "import": "./esm/config/cssClassesConstants.js",
-      "require": "./cjs/config/cssClassesConstants.js"
+      "import": "./dist/esm/config/cssClassesConstants.js",
+      "require": "./dist/cjs/config/cssClassesConstants.js"
     }
   },
   "sideEffects": [
@@ -193,33 +212,25 @@
     "url": "https://git.elliemae.io/platform-ui/dimsum.git"
   },
   "engines": {
-    "npm": ">=7",
-    "node": ">=14"
+    "pnpm": ">=6",
+    "node": ">=16"
   },
   "author": "ICE MT",
-  "scripts": {
-    "test:e2e": "../../../node_modules/pui-e2e-test-sdk/node_modules/.bin/wdio run ../../../wdio.conf.js",
-    "test:reports": "../../../node_modules/pui-e2e-test-sdk/node_modules/.bin/allure open",
-    "prebuild": "exit 0",
-    "predev": "exit 0",
-    "dev": "cross-env NODE_ENV=development && node ../../scripts/build/build.js -w",
-    "build": "node ../../scripts/build/build.js"
-  },
   "publishConfig": {
     "access": "public",
-    "directory": "dist",
-    "generateSubmodules": true
+    "typeSafety": false
   },
   "dependencies": {
-    "@elliemae/ds-button": "2.3.0-alpha.1",
-    "@elliemae/ds-circular-progress-indicator": "2.3.0-alpha.1",
-    "@elliemae/ds-classnames": "2.3.0-alpha.1",
-    "@elliemae/ds-form": "2.3.0-alpha.1",
-    "@elliemae/ds-icons": "2.3.0-alpha.1",
-    "@elliemae/ds-props-helpers": "2.3.0-alpha.1",
-    "@elliemae/ds-shared": "2.3.0-alpha.1",
-    "@elliemae/ds-truncated-tooltip-text": "2.3.0-alpha.1",
-    "@elliemae/ds-utilities": "2.3.0-alpha.1",
+    "@elliemae/ds-button": "2.3.0-alpha.10",
+    "@elliemae/ds-circular-progress-indicator": "2.3.0-alpha.10",
+    "@elliemae/ds-classnames": "2.3.0-alpha.10",
+    "@elliemae/ds-drag-and-drop": "2.3.0-alpha.10",
+    "@elliemae/ds-form": "2.3.0-alpha.10",
+    "@elliemae/ds-icons": "2.3.0-alpha.10",
+    "@elliemae/ds-props-helpers": "2.3.0-alpha.10",
+    "@elliemae/ds-shared": "2.3.0-alpha.10",
+    "@elliemae/ds-truncated-tooltip-text": "2.3.0-alpha.10",
+    "@elliemae/ds-utilities": "2.3.0-alpha.10",
     "@elliemae/react-sortable-hoc": "^1.0.0",
     "react-desc": "~4.1.3",
     "react-highlight-words": "~0.17.0",
@@ -236,5 +247,13 @@
     "react": "~17.0.2",
     "react-dom": "^17.0.2",
     "styled-components": "^5.3.3"
+  },
+  "scripts": {
+    "test:e2e": "../../../node_modules/pui-e2e-test-sdk/node_modules/.bin/wdio run ../../../wdio.conf.js",
+    "test:reports": "../../../node_modules/pui-e2e-test-sdk/node_modules/.bin/allure open",
+    "prebuild": "exit 0",
+    "predev": "exit 0",
+    "dev": "cross-env NODE_ENV=development && node ../../scripts/build/build.js -w",
+    "build": "node ../../scripts/build/build.js"
   }
 }

package/cjs/TreeView.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/TreeView.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React, { WeakValidationMap } from 'react';\n\nimport { describe } from 'react-desc';\nimport { TreeViewPropTypes } from './react-desc-prop-types';\nimport TreeViewContext from './TreeViewContext';\nimport { TreeDnD, TreeDndPlugin } from './plugins/dnd';\nimport { useTreeview } from './config/useTreeview';\nimport { TreeList } from './parts/TreeList';\nimport type { DSTreeviewT } from './react-desc-prop-types';\nexport function TreeView(props: DSTreeviewT.Props) {\n  const { plugins } = props;\n\n  const { ctx } = useTreeview(props);\n\n  return (\n    <TreeViewContext.Provider value={ctx}>\n      {plugins?.includes(TreeDndPlugin) ? <TreeDnD /> : <TreeList />}\n    </TreeViewContext.Provider>\n  );\n}\n\nTreeView.propTypes = TreeViewPropTypes as WeakValidationMap<unknown>;\nconst TreeViewWithSchema = describe(TreeView);\nTreeViewWithSchema.propTypes = TreeViewPropTypes;\n\nexport { TreeViewWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAyC;AAEzC,wBAAyB;AACzB,mCAAkC;AAClC,6BAA4B;AAC5B,iBAAuC;AACvC,yBAA4B;AAC5B,sBAAyB;AAElB,kBAAkB,OAA0B;AACjD,QAAM,EAAE,YAAY;AAEpB,QAAM,EAAE,QAAQ,oCAAY;AAE5B,SACE,mDAAC,+BAAgB,UAAjB;AAAA,IAA0B,OAAO;AAAA,KAC9B,SAAS,SAAS,4BAAiB,mDAAC,oBAAD,QAAc,mDAAC,0BAAD;AAAA;AAKxD,SAAS,YAAY;AACrB,MAAM,qBAAqB,gCAAS;AACpC,mBAAmB,YAAY;",
-  "names": []
-}

package/cjs/TreeViewContext.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/TreeViewContext.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable no-unused-vars */\nimport { createContext, createRef } from 'react';\nimport type { DSTreeviewT } from './react-desc-prop-types';\nimport type { DSTreeviewInternalsT } from './sharedTypes';\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nfunction noop<T extends unknown[]>(..._args: T): void {}\n\nexport const defaultProps = {\n  plugins: [],\n  selection: {},\n  instanceRef: createRef(),\n  isItemDisabled: () => false,\n  disableIcons: false,\n  fluid: false,\n  isMultiSelect: false,\n  isSingleSelect: false,\n  restrictDragAndDrop: false,\n  showChildrenAmount: false,\n  sortable: false,\n  isLoading: false,\n  highlightOnlyQuery: false,\n  onItemClick: noop,\n  onItemFocus: noop,\n  onVisibleItemsChange: noop,\n  onOrderChange: noop,\n  onSelectionChange: noop,\n  onExpandChange: noop,\n  onInstanceRefInitialized: noop,\n  rowSize: 'normal',\n  labelOverflow: 'wrap',\n  noItemsPlaceholder: 'No items found',\n  nameKey: 'name',\n  width: '100%',\n  height: '100%',\n  groupIcon: null,\n  itemIcon: null,\n  searchQuery: '',\n  // workaround on the typings over the fact that\n  // when we instantiate the context we can't have all the props\n  // we only have a part of them but the final typings will include missing props\n  // this is safe to do because\n  // we will \"mergeWithDefaults\" + \"validatePropTypes\" when we do instantiate the context\n} as unknown as DSTreeviewT.Props;\n\nexport const defaultRelativeMouseCoord = {\n  isBefore: false,\n  isAfter: false,\n  isValid: true,\n  item: null,\n  x: null,\n  y: null,\n  relativeElementDOMRect: null,\n  relativeElementIndex: null,\n};\n\nconst defaultContext: DSTreeviewInternalsT.CTX = {\n  props: defaultProps,\n  visibleItems: [],\n  withRadioChecks: false,\n  withCheckboxChecks: false,\n  withDragAndDrop: false,\n  relativeMouseCord: defaultRelativeMouseCoord,\n  setRelativeMouseCord: noop,\n  triggerTreeRerender: noop,\n  tree: undefined,\n  treeRoot: undefined,\n  virtualListHelpers: {\n    virtualItems: [],\n    totalSize: 0,\n    scrollToOffset: noop,\n    scrollToIndex: noop,\n  },\n  virtualListRef: undefined,\n  isDragging: false,\n  setIsDragging: noop,\n  isKeyboardDragging: false,\n  setIsKeyboardDragging: noop,\n  draggedItem: null,\n  setDraggedItem: noop,\n  uniqueTreeViewUUID: '',\n  selectedItem: null,\n  setSelectedItem: noop,\n  focusedItem: null,\n  setFocusedItem: noop,\n  selectedCheckboxes: {},\n  setSelectedCheckboxes: noop,\n  expandedGroups: {},\n  setExpandedGroups: noop,\n  latestToggledItem: null,\n  setLatestToggledItem: noop,\n  hoverItem: null,\n  setHoverItem: noop,\n  handleExpandGroup: noop,\n  updateUserExpandedState: noop,\n};\n\n/** Context for cross component communication */\nconst TreeViewContext = createContext(defaultContext);\n\nexport default TreeViewContext;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAyC;AAKzC,iBAAsC,OAAgB;AAAA;AAE/C,MAAM,eAAe;AAAA,EAC1B,SAAS;AAAA,EACT,WAAW;AAAA,EACX,aAAa;AAAA,EACb,gBAAgB,MAAM;AAAA,EACtB,cAAc;AAAA,EACd,OAAO;AAAA,EACP,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,qBAAqB;AAAA,EACrB,oBAAoB;AAAA,EACpB,UAAU;AAAA,EACV,WAAW;AAAA,EACX,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,0BAA0B;AAAA,EAC1B,SAAS;AAAA,EACT,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU;AAAA,EACV,aAAa;AAAA;AAQR,MAAM,4BAA4B;AAAA,EACvC,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,MAAM;AAAA,EACN,GAAG;AAAA,EACH,GAAG;AAAA,EACH,wBAAwB;AAAA,EACxB,sBAAsB;AAAA;AAGxB,MAAM,iBAA2C;AAAA,EAC/C,OAAO;AAAA,EACP,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,iBAAiB;AAAA,EACjB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,oBAAoB;AAAA,IAClB,cAAc;AAAA,IACd,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,eAAe;AAAA;AAAA,EAEjB,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,uBAAuB;AAAA,EACvB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,uBAAuB;AAAA,EACvB,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,WAAW;AAAA,EACX,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,yBAAyB;AAAA;AAI3B,MAAM,kBAAkB,gCAAc;AAEtC,IAAO,0BAAQ;",
-  "names": []
-}

package/cjs/config/useTreeview.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/config/useTreeview.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport { useState, useRef, useEffect, useMemo, useCallback } from 'react';\nimport { useVirtual } from 'react-virtual';\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { TreeViewPropTypes } from '../react-desc-prop-types';\nimport { defaultRelativeMouseCoord, defaultProps } from '../TreeViewContext';\nimport { TreeDndPlugin } from '../plugins/dnd';\nimport { useTree } from '../utils/useTree';\nimport { useNotifyExpandedChange, toggleItemExpand } from '../utils/group-expands-helpers';\nimport { useInstanceRefActions } from '../utils/useInstanceRefActions';\nimport { useGlobalToggleAllExpandShortcut } from '../utils/keyboard-helpers';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\nimport type { DSTreeviewInternalsT } from '../sharedTypes';\n\ntype UseTreeviewT = (props: DSTreeviewT.Props) => { ctx: DSTreeviewInternalsT.CTX };\n\nexport const useTreeview: UseTreeviewT = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault<DSTreeviewT.Props>(props, defaultProps);\n  useValidateTypescriptPropTypes<DSTreeviewT.Props>(propsWithDefault, TreeViewPropTypes);\n  const defaultActions = {\n    actions: {\n      toggleExpandAll: () => {},\n      scrollTo: () => {},\n      setSelectedItemByVirtualIndex: () => {},\n      setFocusedItemByVirtualIndex: () => {},\n    },\n  } as unknown as DSTreeviewT.InstanceRef;\n  const treeRef = useRef(defaultActions);\n  const {\n    data,\n    plugins,\n    onOrderChange,\n    isMultiSelect,\n    isSingleSelect,\n    instanceRef,\n    selection,\n    onInstanceRefInitialized,\n  } = propsWithDefault;\n  const [isDragging, setIsDragging] = useState(false);\n  const [isKeyboardDragging, setIsKeyboardDragging] = useState(false);\n  const [relativeMouseCord, setRelativeMouseCord] =\n    useState<DSTreeviewInternalsT.MouseCoord>(defaultRelativeMouseCoord);\n  const [uniqueTreeViewUUID] = useState(uuidv4());\n  const [draggedItem, setDraggedItem] = useState<DSTreeviewT.Item | null>(null);\n  const [hoverItem, setHoverItem] = useState<DSTreeviewT.Item | null>(null);\n  const [latestToggledItem, setLatestToggledItem] = useState<DSTreeviewT.Item | null>(null);\n  const [selectedItem, setSelectedItem] = useState<DSTreeviewT.Item | null>(null);\n  const [focusedItem, setFocusedItem] = useState<DSTreeviewT.Item | null>(null);\n  const [selectedCheckboxes, setSelectedCheckboxes] = useState({\n    ...selection,\n  });\n  const [expandedGroups, setExpandedGroups] = useState<DSTreeviewT.ExpandedItems>({});\n  const { visibleItems, tree, treeRoot, triggerTreeRerender, updateUserExpandedState } = useTree(\n    data,\n    propsWithDefault,\n    {\n      setExpandedGroups,\n    },\n  );\n\n  const virtualListRef = useRef<HTMLUListElement>();\n  // estimateSize should not be really required given what was stated on\n  // https://github.com/tannerlinsley/react-virtual/issues/23\n\n  const virtualListHelpers = useVirtual({\n    size: visibleItems.length,\n    parentRef: virtualListRef,\n    overscan: 15,\n  });\n\n  const withDragAndDrop = !!(plugins?.includes(TreeDndPlugin) && onOrderChange);\n  const withRadioChecks = isSingleSelect && !isMultiSelect;\n  const withCheckboxChecks = !isSingleSelect && isMultiSelect;\n\n  const handleExpandGroup = useCallback(toggleItemExpand, []);\n\n  const ctx: DSTreeviewInternalsT.CTX = useMemo(\n    () => ({\n      props: propsWithDefault,\n      setRelativeMouseCord,\n      relativeMouseCord,\n      virtualListHelpers,\n      virtualListRef,\n      tree,\n      treeRoot,\n      visibleItems,\n      triggerTreeRerender,\n      isDragging,\n      setIsDragging,\n      isKeyboardDragging,\n      setIsKeyboardDragging,\n      draggedItem,\n      setDraggedItem,\n      withRadioChecks,\n      withCheckboxChecks,\n      withDragAndDrop,\n      uniqueTreeViewUUID,\n      selectedCheckboxes,\n      setSelectedCheckboxes,\n      selectedItem,\n      setSelectedItem,\n      expandedGroups,\n      setExpandedGroups,\n      latestToggledItem,\n      setLatestToggledItem,\n      focusedItem,\n      setFocusedItem,\n      hoverItem,\n      setHoverItem,\n      handleExpandGroup,\n      updateUserExpandedState,\n    }),\n    [\n      draggedItem,\n      expandedGroups,\n      focusedItem,\n      handleExpandGroup,\n      hoverItem,\n      isDragging,\n      isKeyboardDragging,\n      latestToggledItem,\n      propsWithDefault,\n      relativeMouseCord,\n      selectedCheckboxes,\n      selectedItem,\n      tree,\n      treeRoot,\n      triggerTreeRerender,\n      uniqueTreeViewUUID,\n      virtualListHelpers,\n      visibleItems,\n      withCheckboxChecks,\n      withDragAndDrop,\n      withRadioChecks,\n      updateUserExpandedState,\n    ],\n  );\n  // this hooks can't use the context because the context provider doesn't wrap this\n  // as such we manually pass the second parameter as fit\n  if (instanceRef) instanceRef.current = treeRef.current;\n  useInstanceRefActions(treeRef.current, ctx);\n  useGlobalToggleAllExpandShortcut(treeRoot, triggerTreeRerender, setLatestToggledItem, updateUserExpandedState);\n  useNotifyExpandedChange(propsWithDefault, ctx);\n\n  // this is an horrible hack.\n  // this is required because there is no \"on rendered\" react-way to check if every children has finished rendering\n  // this should be working for now, in the future we may want to review this for a better solution\n  useEffect(() => {\n    setTimeout(() => onInstanceRefInitialized(treeRef), 100);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return useMemo(() => ({ ctx }), [ctx]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": []
-}

package/cjs/parts/TreeItem.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/parts/TreeItem.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useContext, useState, useMemo, useRef, useCallback } from 'react';\nimport { SortableElement, SortableHandle } from '@elliemae/react-sortable-hoc';\n\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { GripperVertical } from '@elliemae/ds-icons';\n\nimport RadioSelectable from './RadioSelectable';\nimport CheckboxSelectable from './CheckboxSelectable';\nimport TreeViewContext from '../TreeViewContext';\nimport { setMultipleRefs } from '../utils/refs-helpers';\nimport { useOnItemKeyDown } from '../utils/keyboard-helpers';\nimport { NestingSpace } from './NestingSpace';\nimport { Icon } from './Icon';\nimport { ExpandCaret } from './ExpandCaret';\nimport { TreeItemText } from './TreeItemText';\nimport { DSTreeViewPrefix, treeItemBlockName } from '../config/cssClassesConstants';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\n\nexport const TreeListItem = aggregatedClasses('li', {\n  'data-testid': treeItemBlockName,\n  role: 'treeitem',\n  // temp fix untill we move to styled components\n})(treeItemBlockName) as unknown as React.ComponentType<React.ComponentProps<'li'>>;\n\nexport const TreeListItemAddonsWrapper = aggregatedClasses('div')(\n  treeItemBlockName,\n  'addons',\n  // temp fix untill we move to styled components\n) as unknown as React.ComponentType;\n\nconst DnDHandle = SortableHandle(({ id }: { id: DSTreeviewT.StringOrNum }) => (\n  <GripperVertical\n    data-testid=\"drag-handle\"\n    key={`${id}-drag-handle`}\n    className=\"drag-handle\"\n    size=\"s\"\n    onMouseDown={(e: React.MouseEvent) => {\n      // prevent focusing the drag-handle to avoid borders\n      if (e) {\n        e.preventDefault();\n      }\n    }}\n    tabIndex=\"0\"\n  />\n));\ninterface PropsT {\n  item: DSTreeviewT.Item;\n  itemIndex: number;\n  virtualItemRef: React.RefObject<HTMLLIElement>;\n  itemWrapperStyle?: { [key: string]: unknown };\n  spaceForNestingLevel?: number;\n  onMouseDragOverItem?: (opts: {\n    event: React.MouseEvent<HTMLLIElement>;\n    item: DSTreeviewT.Item;\n    itemIndex: number;\n    setIsDraggingOverThis: React.Dispatch<React.SetStateAction<boolean>>;\n    openFolderOnHoverTimeout: React.MutableRefObject<NodeJS.Timeout | null>;\n  }) => void;\n}\nexport const TreeItem = (props: PropsT): JSX.Element => {\n  const {\n    item,\n    itemIndex,\n    itemWrapperStyle = {},\n    virtualItemRef,\n    spaceForNestingLevel = 1.5,\n    onMouseDragOverItem,\n  } = props;\n  const { id, node } = item;\n  const { nodeItemRef } = node.model;\n  const openFolderOnHoverTimeout = useRef<NodeJS.Timeout | null>(null);\n\n  const [isDraggingOverThis, setIsDraggingOverThis] = useState(false);\n  const onItemKeyDown = useOnItemKeyDown(item);\n\n  const ctx = useContext(TreeViewContext);\n  const {\n    props: { disableIcons, rightAddons, onItemClick, onItemFocus, rowSize, labelOverflow },\n    relativeMouseCord,\n    withRadioChecks,\n    withCheckboxChecks,\n    withDragAndDrop,\n    selectedItem,\n    selectedCheckboxes,\n    hoverItem,\n    isDragging,\n    virtualListHelpers: { scrollToIndex },\n    setHoverItem,\n    setSelectedItem,\n    setFocusedItem,\n  } = ctx;\n\n  // Sortable Items needs to update\n  //   - the virtual list ref (for react-virtual requirement)\n  //   - nodeItemRef which is a prop avaiable in the TreeModel nodes\n  const setItemRefs: React.LegacyRef<HTMLLIElement> | undefined = (ref: HTMLLIElement) => {\n    setMultipleRefs(virtualItemRef, nodeItemRef)(ref);\n  };\n\n  const dropPreviewClassName = useMemo(() => {\n    if (!withDragAndDrop || !relativeMouseCord || !isDraggingOverThis) return '';\n    const { isBefore, isAfter, isValid } = relativeMouseCord;\n    let className = `${DSTreeViewPrefix}-${treeItemBlockName}${isValid ? '--valid' : '--invalid'}`;\n\n    if (isBefore) className += '-drop-before';\n    else if (isAfter) className += '-drop-after';\n    else className += '-drop-in';\n    return className;\n  }, [withDragAndDrop, relativeMouseCord, isDraggingOverThis]);\n\n  const selectedClassName = useMemo(\n    () => (selectedItem?.id === item.id ? 'selected' : ''),\n    [item.id, selectedItem?.id],\n  );\n  const hoverClassName = useMemo(\n    () => (hoverItem?.id !== item.id || (withDragAndDrop && isDragging) ? '' : 'hover'),\n    [hoverItem?.id, item.id, withDragAndDrop, isDragging],\n  );\n  const fixedHeightClassname = useMemo(() => {\n    if (labelOverflow === 'truncate') {\n      if (rowSize === 'compact') return `${DSTreeViewPrefix}-${treeItemBlockName}--fixed-height-compact`;\n      return `${DSTreeViewPrefix}-${treeItemBlockName}--fixed-height`;\n    }\n    return '';\n  }, [labelOverflow, rowSize]);\n\n  const finalClassName = useMemo(\n    () => `${dropPreviewClassName} ${fixedHeightClassname} ${selectedClassName} ${hoverClassName}`,\n    [dropPreviewClassName, selectedClassName, hoverClassName, fixedHeightClassname],\n  );\n\n  const handleItemClick = useCallback(\n    (e: React.MouseEvent<HTMLLIElement>) => {\n      onItemClick(item, e);\n      setFocusedItem(item);\n      setSelectedItem(item);\n      const itemVirtualIndex = typeof item.virtualIndex === 'number' ? item.virtualIndex : -1;\n      onItemFocus({\n        itemIndex: itemVirtualIndex,\n        scrollToItem: (opts = { align: 'start' }) => scrollToIndex(itemVirtualIndex, opts),\n        item,\n      });\n    },\n    [item, scrollToIndex, onItemClick, onItemFocus, setSelectedItem, setFocusedItem],\n  );\n\n  return (\n    <TreeListItem\n      tabIndex={0}\n      onMouseMove={(event) => {\n        if (withDragAndDrop && onMouseDragOverItem) {\n          onMouseDragOverItem({\n            event,\n            item,\n            itemIndex,\n            setIsDraggingOverThis,\n            openFolderOnHoverTimeout,\n          });\n        }\n      }}\n      onMouseLeave={() => {\n        if (withDragAndDrop) {\n          setIsDraggingOverThis(false);\n          if (openFolderOnHoverTimeout?.current) clearTimeout(openFolderOnHoverTimeout.current);\n        }\n        if (hoverItem?.id === item.id) {\n          setHoverItem(null);\n        }\n      }}\n      onMouseEnter={() => {\n        setHoverItem(item);\n      }}\n      onClick={handleItemClick}\n      ref={setItemRefs}\n      style={{ ...itemWrapperStyle }}\n      className={finalClassName}\n      aria-expanded={!!item.isExpanded}\n      aria-selected={!!selectedCheckboxes[item.id]}\n      data-id={item.id}\n      data-index={item.virtualIndex}\n      onKeyDown={onItemKeyDown}\n    >\n      <TreeListItemAddonsWrapper>\n        {withDragAndDrop ? <DnDHandle id={id} /> : null}\n        {withRadioChecks ? <RadioSelectable item={item} itemIndex={itemIndex} /> : null}\n        {withCheckboxChecks ? <CheckboxSelectable item={item} itemIndex={itemIndex} /> : null}\n        <NestingSpace item={item} spaceForNestingLevel={spaceForNestingLevel} />\n        <ExpandCaret item={item} />\n        {!disableIcons ? <Icon item={item} /> : null}\n      </TreeListItemAddonsWrapper>\n      <TreeItemText item={item} />\n      {rightAddons && (\n        <TreeListItemAddonsWrapper>\n          {typeof rightAddons === 'function' ? rightAddons(item) : rightAddons}\n        </TreeListItemAddonsWrapper>\n      )}\n    </TreeListItem>\n  );\n};\n\nexport const DragAndDropTreeItem = SortableElement(TreeItem);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": []
-}

package/cjs/parts/TreeList.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/parts/TreeList.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useContext } from 'react';\nimport { SortableContainer } from '@elliemae/react-sortable-hoc';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';\n\nimport TreeViewContext from '../TreeViewContext';\nimport { DSTreeViewPrefix, treeListBlockName } from '../config/cssClassesConstants';\nimport { TreeItem, DragAndDropTreeItem } from './TreeItem';\n\nimport type { DSTreeviewT } from '../react-desc-prop-types';\n\nexport const treeListNoItemsBn = `${treeListBlockName}-no-items`;\nexport const TreeListNoItems = aggregatedClasses('div', {\n  'data-testid': treeListNoItemsBn,\n})(treeListNoItemsBn) as unknown as React.ComponentType<React.ComponentProps<'div'>>;\n\n// React.ComponentProps<'ul'> uses LegacyRef typings that existed pre-hook era\n// we omit the LegacyRef typings in favor of hook-era typings\ninterface UlProps extends Omit<React.ComponentProps<'ul'>, 'ref'> {\n  ref: React.MutableRefObject<HTMLUListElement | undefined> | undefined;\n}\nexport const TreeListWrapper = aggregatedClasses('ul', {\n  'data-testid': treeListBlockName,\n  role: 'tree',\n})(treeListBlockName, null, ({ rowSize }: { rowSize: 'normal' | 'compact' }) => ({\n  [`rowsize-${rowSize}`]: rowSize,\n})) as unknown as React.ComponentType<UlProps>;\n\nconst compactRowClass = `${DSTreeViewPrefix}-tv-row-size-compact`;\nconst normaRowClass = `${DSTreeViewPrefix}-tv-row-size-normal`;\n\ninterface PropsT {\n  onMouseDragOverItem?: (opts: {\n    event: React.MouseEvent<HTMLLIElement>;\n    item: DSTreeviewT.Item;\n    itemIndex: number;\n    setIsDraggingOverThis: React.Dispatch<React.SetStateAction<boolean>>;\n    openFolderOnHoverTimeout: React.MutableRefObject<NodeJS.Timeout | null>;\n  }) => void;\n}\n\nexport const TreeList = (props: PropsT) => {\n  const { onMouseDragOverItem } = props;\n  const ctx = useContext(TreeViewContext);\n  const {\n    virtualListRef,\n    virtualListHelpers,\n    visibleItems,\n    withDragAndDrop,\n    props: { width, height, rowSize, noItemsPlaceholder, isLoading },\n  } = ctx;\n  const { totalSize, virtualItems } = virtualListHelpers;\n  const className = `${rowSize === 'compact' ? `${compactRowClass}` : `${normaRowClass}`}`;\n\n  return (\n    <TreeListWrapper\n      ref={virtualListRef}\n      className={className}\n      style={{\n        height: `${typeof height === 'number' ? `${height}px` : height}`,\n        width: `${typeof width === 'number' ? `${width}px` : width}`,\n        overflow: 'auto',\n      }}\n    >\n      {isLoading ? (\n        <div\n          style={{\n            width: '100%',\n            height: '100%',\n            display: 'flex',\n            alignItems: 'center',\n            justifyContent: 'center',\n          }}\n        >\n          <DSCircularProgressIndicator size=\"xl\" loading={isLoading} showLabel waiting={false} showTooltip={false} />\n        </div>\n      ) : null}\n      {!isLoading && virtualItems.length === 0 ? <TreeListNoItems>{noItemsPlaceholder}</TreeListNoItems> : null}\n      {!isLoading && virtualItems.length !== 0 ? (\n        <div\n          style={{\n            height: `${totalSize}px`,\n            width: '100%',\n            position: 'relative',\n          }}\n        >\n          {virtualItems.map((virtualItem) => {\n            const { index, measureRef, start } = virtualItem;\n            const item = visibleItems[index];\n            item.virtualIndex = index;\n            const { id } = item;\n\n            const style = {\n              position: 'absolute',\n              top: 0,\n              left: 0,\n              width: '100%',\n              transform: `translateY(${start}px)`,\n            };\n\n            const listItemProps = {\n              key: `DS-TreeView-List-Item-${id}`,\n              virtualItemRef: measureRef,\n              index, // this is consumed by the DnD HOC\n              itemIndex: index,\n              item,\n              itemWrapperStyle: style,\n            };\n\n            if (withDragAndDrop)\n              return <DragAndDropTreeItem {...listItemProps} onMouseDragOverItem={onMouseDragOverItem} />;\n            return <TreeItem {...listItemProps} />;\n          })}\n        </div>\n      ) : null}\n    </TreeListWrapper>\n  );\n};\ntype SortablePropsT = PropsT & {\n  disableAnimation?: boolean;\n  getContainer: (element: React.ReactElement<unknown>) => HTMLElement | Promise<HTMLElement>;\n};\nexport const DragAndDropTreeList = SortableContainer<SortablePropsT>(TreeList);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkC;AAClC,gCAAkC;AAClC,2BAAkC;AAClC,4CAA4C;AAE5C,6BAA4B;AAC5B,iCAAoD;AACpD,sBAA8C;AAIvC,MAAM,oBAAoB,GAAG;AAC7B,MAAM,kBAAkB,4CAAkB,OAAO;AAAA,EACtD,eAAe;AAAA,GACd;AAOI,MAAM,kBAAkB,4CAAkB,MAAM;AAAA,EACrD,eAAe;AAAA,EACf,MAAM;AAAA,GACL,8CAAmB,MAAM,CAAC,EAAE,cAAkD;AAAA,GAC9E,WAAW,YAAY;AAAA;AAG1B,MAAM,kBAAkB,GAAG;AAC3B,MAAM,gBAAgB,GAAG;AAYlB,MAAM,WAAW,CAAC,UAAkB;AACzC,QAAM,EAAE,wBAAwB;AAChC,QAAM,MAAM,6BAAW;AACvB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,OAAO,QAAQ,SAAS,oBAAoB;AAAA,MACnD;AACJ,QAAM,EAAE,WAAW,iBAAiB;AACpC,QAAM,YAAY,GAAG,YAAY,YAAY,GAAG,oBAAoB,GAAG;AAEvE,SACE,mDAAC,iBAAD;AAAA,IACE,KAAK;AAAA,IACL;AAAA,IACA,OAAO;AAAA,MACL,QAAQ,GAAG,OAAO,WAAW,WAAW,GAAG,aAAa;AAAA,MACxD,OAAO,GAAG,OAAO,UAAU,WAAW,GAAG,YAAY;AAAA,MACrD,UAAU;AAAA;AAAA,KAGX,YACC,mDAAC,OAAD;AAAA,IACE,OAAO;AAAA,MACL,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA;AAAA,KAGlB,mDAAC,mEAAD;AAAA,IAA6B,MAAK;AAAA,IAAK,SAAS;AAAA,IAAW,WAAS;AAAA,IAAC,SAAS;AAAA,IAAO,aAAa;AAAA,QAElG,MACH,CAAC,aAAa,aAAa,WAAW,IAAI,mDAAC,iBAAD,MAAkB,sBAAwC,MACpG,CAAC,aAAa,aAAa,WAAW,IACrC,mDAAC,OAAD;AAAA,IACE,OAAO;AAAA,MACL,QAAQ,GAAG;AAAA,MACX,OAAO;AAAA,MACP,UAAU;AAAA;AAAA,KAGX,aAAa,IAAI,CAAC,gBAAgB;AACjC,UAAM,EAAE,OAAO,YAAY,UAAU;AACrC,UAAM,OAAO,aAAa;AAC1B,SAAK,eAAe;AACpB,UAAM,EAAE,OAAO;AAEf,UAAM,QAAQ;AAAA,MACZ,UAAU;AAAA,MACV,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO;AAAA,MACP,WAAW,cAAc;AAAA;AAG3B,UAAM,gBAAgB;AAAA,MACpB,KAAK,yBAAyB;AAAA,MAC9B,gBAAgB;AAAA,MAChB;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA,kBAAkB;AAAA;AAGpB,QAAI;AACF,aAAO,mDAAC,qCAAD;AAAA,WAAyB;AAAA,QAAe;AAAA;AACjD,WAAO,mDAAC,0BAAD;AAAA,SAAc;AAAA;AAAA,QAGvB;AAAA;AAQH,MAAM,sBAAsB,iDAAkC;",
-  "names": []
-}