@elliemae/ds-treeview 3.4.2 → 3.4.3

package/dist/esm/parts/TreeItem.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useContext, useMemo, useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useContext, useMemo, useCallback } from "react";
 import { aggregatedClasses } from "@elliemae/ds-classnames";
 import RadioSelectable from "./RadioSelectable";
 import CheckboxSelectable from "./CheckboxSelectable";
@@ -19,7 +20,10 @@ const TreeListItem = aggregatedClasses("li", {
   "data-testid": treeItemBlockName,
   role: "treeitem"
 })(treeItemBlockName);
-const TreeListItemAddonsWrapper = aggregatedClasses("div")(treeItemBlockName, "addons");
+const TreeListItemAddonsWrapper = aggregatedClasses("div")(
+  treeItemBlockName,
+  "addons"
+);
 const TreeItem = (props) => {
   const {
     item,
@@ -49,7 +53,11 @@ const TreeItem = (props) => {
   } = ctx;
   const itemLabelText = item[nameKey];
   const setItemRefs = (ref) => {
-    setMultipleRefs(virtualItemRef, !isDragOverlay && nodeItemRef, !isDragOverlay && draggableProps && draggableProps.setNodeRef)(ref);
+    setMultipleRefs(
+      virtualItemRef,
+      !isDragOverlay && nodeItemRef,
+      !isDragOverlay && draggableProps && draggableProps.setNodeRef
+    )(ref);
   };
   const dropIndicatorPosition = draggableProps && draggableProps.shouldShowDropIndicatorPosition && draggableProps.dropIndicatorPosition;
   const isDropIndicatorPositionInside = dropIndicatorPosition === DropIndicatorPosition.Inside;
@@ -63,8 +71,14 @@ const TreeItem = (props) => {
     return "";
   }, [isDropIndicatorPositionInside, isDropValid]);
   const dragOverlayClassName = useMemo(() => isDragOverlay ? "drag-overlay" : "", [isDragOverlay]);
-  const selectedClassName = useMemo(() => selectedItem?.id === item.id && !isDragOverlay ? "selected" : "", [isDragOverlay, item.id, selectedItem?.id]);
-  const hoverClassName = useMemo(() => !isDragOverlay && hoverItem?.id === item.id && !isDragging ? "hover" : "", [isDragOverlay, hoverItem?.id, item.id, isDragging]);
+  const selectedClassName = useMemo(
+    () => selectedItem?.id === item.id && !isDragOverlay ? "selected" : "",
+    [isDragOverlay, item.id, selectedItem?.id]
+  );
+  const hoverClassName = useMemo(
+    () => !isDragOverlay && hoverItem?.id === item.id && !isDragging ? "hover" : "",
+    [isDragOverlay, hoverItem?.id, item.id, isDragging]
+  );
   const fixedHeightClassname = useMemo(() => {
     if (labelOverflow === "truncate") {
       if (rowSize === "compact")
@@ -78,28 +92,34 @@ const TreeItem = (props) => {
       return `${DSTreeViewPrefix}-${treeItemBlockName}--dragging`;
     return "";
   }, [isDragging]);
-  const finalClassName = useMemo(() => `${dropPreviewClassName} ${fixedHeightClassname} ${selectedClassName} ${hoverClassName} ${dragOverlayClassName} ${isDraggingClassname}`, [
-    dropPreviewClassName,
-    fixedHeightClassname,
-    selectedClassName,
-    hoverClassName,
-    dragOverlayClassName,
-    isDraggingClassname
-  ]);
-  const handleItemClick = useCallback((e) => {
-    onItemClick(item, e);
-    setFocusedItem(item);
-    setSelectedItem(item);
-    const itemVirtualIndex = typeof item.virtualIndex === "number" ? item.virtualIndex : -1;
-    onItemFocus({
-      itemIndex: itemVirtualIndex,
-      scrollToItem: (opts = { align: "start" }) => scrollToIndex(itemVirtualIndex, opts),
-      item
-    });
-  }, [item, scrollToIndex, onItemClick, onItemFocus, setSelectedItem, setFocusedItem]);
+  const finalClassName = useMemo(
+    () => `${dropPreviewClassName} ${fixedHeightClassname} ${selectedClassName} ${hoverClassName} ${dragOverlayClassName} ${isDraggingClassname}`,
+    [
+      dropPreviewClassName,
+      fixedHeightClassname,
+      selectedClassName,
+      hoverClassName,
+      dragOverlayClassName,
+      isDraggingClassname
+    ]
+  );
+  const handleItemClick = useCallback(
+    (e) => {
+      onItemClick(item, e);
+      setFocusedItem(item);
+      setSelectedItem(item);
+      const itemVirtualIndex = typeof item.virtualIndex === "number" ? item.virtualIndex : -1;
+      onItemFocus({
+        itemIndex: itemVirtualIndex,
+        scrollToItem: (opts = { align: "start" }) => scrollToIndex(itemVirtualIndex, opts),
+        item
+      });
+    },
+    [item, scrollToIndex, onItemClick, onItemFocus, setSelectedItem, setFocusedItem]
+  );
   const childrenLength = useMemo(() => children?.length ?? 0, [children]);
   const ariaLabel = `${itemLabelText}${showChildrenAmount && childrenLength > 0 ? `, ${childrenLength} Items` : ""}`;
-  return /* @__PURE__ */ React2.createElement(TreeListItem, {
+  return /* @__PURE__ */ jsxs(TreeListItem, {
     tabIndex: 0,
     onMouseLeave: () => {
       if (hoverItem?.id === item.id) {
@@ -119,29 +139,46 @@ const TreeItem = (props) => {
     "aria-label": ariaLabel,
     "data-id": item.id,
     "data-index": item.virtualIndex,
-    onKeyDown: onItemKeyDown
-  }, /* @__PURE__ */ React2.createElement(TreeListItemAddonsWrapper, null, withDragAndDrop ? /* @__PURE__ */ React2.createElement(DnDHandle, {
-    id,
-    isDragOverlay
-  }) : null, withRadioChecks && !isDragOverlay ? /* @__PURE__ */ React2.createElement(RadioSelectable, {
-    item,
-    itemIndex
-  }) : null, withCheckboxChecks && !isDragOverlay ? /* @__PURE__ */ React2.createElement(CheckboxSelectable, {
-    item,
-    itemIndex
-  }) : null, !isDragOverlay && /* @__PURE__ */ React2.createElement(NestingSpace, {
-    item,
-    spaceForNestingLevel
-  }), !isDragOverlay && /* @__PURE__ */ React2.createElement(ExpandCaret, {
-    item
-  }), !disableIcons ? /* @__PURE__ */ React2.createElement(Icon, {
-    item
-  }) : null), /* @__PURE__ */ React2.createElement(TreeItemText, {
-    item
-  }), rightAddons && /* @__PURE__ */ React2.createElement(TreeListItemAddonsWrapper, null, typeof rightAddons === "function" ? rightAddons(item) : rightAddons), /* @__PURE__ */ React2.createElement(DropIndicator, {
-    dropIndicatorPosition,
-    isDropValid
-  }));
+    onKeyDown: onItemKeyDown,
+    children: [
+      /* @__PURE__ */ jsxs(TreeListItemAddonsWrapper, {
+        children: [
+          withDragAndDrop ? /* @__PURE__ */ jsx(DnDHandle, {
+            id,
+            isDragOverlay
+          }) : null,
+          withRadioChecks && !isDragOverlay ? /* @__PURE__ */ jsx(RadioSelectable, {
+            item,
+            itemIndex
+          }) : null,
+          withCheckboxChecks && !isDragOverlay ? /* @__PURE__ */ jsx(CheckboxSelectable, {
+            item,
+            itemIndex
+          }) : null,
+          !isDragOverlay && /* @__PURE__ */ jsx(NestingSpace, {
+            item,
+            spaceForNestingLevel
+          }),
+          !isDragOverlay && /* @__PURE__ */ jsx(ExpandCaret, {
+            item
+          }),
+          !disableIcons ? /* @__PURE__ */ jsx(Icon, {
+            item
+          }) : null
+        ]
+      }),
+      /* @__PURE__ */ jsx(TreeItemText, {
+        item
+      }),
+      rightAddons && /* @__PURE__ */ jsx(TreeListItemAddonsWrapper, {
+        children: typeof rightAddons === "function" ? rightAddons(item) : rightAddons
+      }),
+      /* @__PURE__ */ jsx(DropIndicator, {
+        dropIndicatorPosition,
+        isDropValid
+      })
+    ]
+  });
 };
 var TreeItem_default = withDnDSortableItemContext(TreeItem);
 export {

package/dist/esm/parts/TreeItem.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/TreeItem.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useContext, useMemo, useCallback } from 'react';\n\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\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';\nimport { DnDHandle } from './DnDHandle';\nimport { withDnDSortableItemContext } from '../hoc/WithDnDSortableItemContext';\nimport { DropIndicatorPosition, SortableItemContext } from '../hoc/SortableItemContext';\nimport DropIndicator from './DropIndicator';\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\ninterface PropsT {\n  item: DSTreeviewT.Item;\n  itemIndex: number;\n  isDragOverlay?: boolean;\n  virtualItemRef?: React.RefObject<HTMLLIElement>;\n  itemWrapperStyle?: { [key: string]: unknown };\n  spaceForNestingLevel?: number;\n}\nexport const TreeItem = (props: PropsT): JSX.Element => {\n  const {\n    item,\n    itemIndex,\n    itemWrapperStyle = {},\n    virtualItemRef,\n    spaceForNestingLevel = 1.5,\n    isDragOverlay = false,\n  } = props;\n  const { id, node, children } = item;\n  const { nodeItemRef } = node.model;\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const onItemKeyDown = useOnItemKeyDown(item, draggableProps);\n\n  const ctx = useContext(TreeViewContext);\n  const {\n    props: { disableIcons, rightAddons, onItemClick, onItemFocus, rowSize, labelOverflow, nameKey, showChildrenAmount },\n    withRadioChecks,\n    withCheckboxChecks,\n    withDragAndDrop,\n    selectedItem,\n    selectedCheckboxes,\n    hoverItem,\n    virtualListHelpers: { scrollToIndex },\n    setHoverItem,\n    setSelectedItem,\n    setFocusedItem,\n  } = ctx;\n  const itemLabelText = item[nameKey] as DSTreeviewT.Item['name'];\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  //   - the drag and drop node reference\n  const setItemRefs: React.LegacyRef<HTMLLIElement> | undefined = (ref: HTMLLIElement) => {\n    setMultipleRefs(\n      virtualItemRef,\n      !isDragOverlay && nodeItemRef,\n      !isDragOverlay && draggableProps && draggableProps.setNodeRef,\n    )(ref);\n  };\n\n  const dropIndicatorPosition =\n    draggableProps && draggableProps.shouldShowDropIndicatorPosition && draggableProps.dropIndicatorPosition;\n\n  const isDropIndicatorPositionInside = dropIndicatorPosition === DropIndicatorPosition.Inside;\n\n  const isDragging = draggableProps && draggableProps.isDragging;\n\n  const isDropValid = draggableProps && draggableProps.isDropValid;\n\n  const dropPreviewClassName = useMemo(() => {\n    if (isDropIndicatorPositionInside) {\n      const className = `${DSTreeViewPrefix}-${treeItemBlockName}${isDropValid ? '--valid' : '--invalid'}-drop-in`;\n      return className;\n    }\n    return '';\n  }, [isDropIndicatorPositionInside, isDropValid]);\n\n  const dragOverlayClassName = useMemo(() => (isDragOverlay ? 'drag-overlay' : ''), [isDragOverlay]);\n\n  const selectedClassName = useMemo(\n    () => (selectedItem?.id === item.id && !isDragOverlay ? 'selected' : ''),\n    [isDragOverlay, item.id, selectedItem?.id],\n  );\n  const hoverClassName = useMemo(\n    () => (!isDragOverlay && hoverItem?.id === item.id && !isDragging ? 'hover' : ''),\n    [isDragOverlay, hoverItem?.id, item.id, 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 isDraggingClassname = useMemo(() => {\n    if (isDragging) return `${DSTreeViewPrefix}-${treeItemBlockName}--dragging`;\n    return '';\n  }, [isDragging]);\n\n  const finalClassName = useMemo(\n    () =>\n      `${dropPreviewClassName} ${fixedHeightClassname} ${selectedClassName} ${hoverClassName} ${dragOverlayClassName} ${isDraggingClassname}`,\n    [\n      dropPreviewClassName,\n      fixedHeightClassname,\n      selectedClassName,\n      hoverClassName,\n      dragOverlayClassName,\n      isDraggingClassname,\n    ],\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  const childrenLength = useMemo(() => children?.length ?? 0, [children]);\n\n  const ariaLabel = `${itemLabelText}${showChildrenAmount && childrenLength > 0 ? `, ${childrenLength} Items` : ''}`;\n\n  return (\n    <TreeListItem\n      tabIndex={0}\n      onMouseLeave={() => {\n        if (hoverItem?.id === item.id) {\n          setHoverItem(null);\n        }\n      }}\n      onMouseEnter={() => {\n        setHoverItem(item);\n      }}\n      onClick={handleItemClick}\n      onBlur={() => setFocusedItem(null)}\n      ref={setItemRefs}\n      style={{ ...itemWrapperStyle }}\n      className={finalClassName}\n      aria-expanded={!!item.isExpanded}\n      aria-selected={!!selectedCheckboxes[item.id]}\n      aria-label={ariaLabel}\n      data-id={item.id}\n      data-index={item.virtualIndex}\n      onKeyDown={onItemKeyDown}\n    >\n      <TreeListItemAddonsWrapper>\n        {withDragAndDrop ? <DnDHandle id={id} isDragOverlay={isDragOverlay} /> : null}\n        {withRadioChecks && !isDragOverlay ? <RadioSelectable item={item} itemIndex={itemIndex} /> : null}\n        {withCheckboxChecks && !isDragOverlay ? <CheckboxSelectable item={item} itemIndex={itemIndex} /> : null}\n        {!isDragOverlay && <NestingSpace item={item} spaceForNestingLevel={spaceForNestingLevel} />}\n        {!isDragOverlay && <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      <DropIndicator dropIndicatorPosition={dropIndicatorPosition} isDropValid={isDropValid} />\n    </TreeListItem>\n  );\n};\n\nexport default withDnDSortableItemContext(TreeItem);\n"],
-  "mappings": "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",
+  "mappings": "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",
   "names": []
 }

package/dist/esm/parts/TreeItemText.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useMemo, useContext } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useContext } from "react";
 import Highlighter from "react-highlight-words";
 import { SimpleTruncatedTooltipText } from "@elliemae/ds-truncated-tooltip-text";
 import { aggregatedClasses } from "@elliemae/ds-classnames";
@@ -10,10 +11,11 @@ const ItemContent = aggregatedClasses("div")(`${treeItemBlockName}-content`);
 const ItemValue = aggregatedClasses("span")(treeItemBlockName, "value");
 const classNameModifierWrapAll = `${DSTreeViewPrefix}-${treeItemBlockName}__value--wrap-all`;
 const classNameModifierTruncate = `${DSTreeViewPrefix}-${treeItemBlockName}__value--truncate`;
-const CustomHighlight = ({ children }) => /* @__PURE__ */ React2.createElement("mark", {
+const CustomHighlight = ({ children }) => /* @__PURE__ */ jsx("mark", {
   className: "tree-text-highlight",
-  "data-testid": "tree-text-highlight"
-}, children);
+  "data-testid": "tree-text-highlight",
+  children
+});
 const TreeItemText = (props) => {
   const { item } = props;
   const ctx = useContext(TreeViewContext);
@@ -24,47 +26,69 @@ const TreeItemText = (props) => {
     const itemLabelText = item[nameKey];
     if (searchQuery) {
       if (labelOverflow === "truncate") {
-        return /* @__PURE__ */ React2.createElement(SimpleTruncatedTooltipText, {
-          value: /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(Highlighter, {
+        return /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, {
+          value: /* @__PURE__ */ jsxs(Fragment, {
+            children: [
+              /* @__PURE__ */ jsx(Highlighter, {
+                autoEscape: true,
+                highlightTag: CustomHighlight,
+                searchWords: [searchQuery],
+                textToHighlight: itemLabelText
+              }),
+              showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, {
+                item
+              }) : null
+            ]
+          })
+        });
+      }
+      return /* @__PURE__ */ jsxs(Fragment, {
+        children: [
+          /* @__PURE__ */ jsx(Highlighter, {
             autoEscape: true,
             highlightTag: CustomHighlight,
             searchWords: [searchQuery],
             textToHighlight: itemLabelText
-          }), showChildrenAmount ? /* @__PURE__ */ React2.createElement(ChildrenCountDisplayer, {
+          }),
+          showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, {
             item
-          }) : null)
-        });
-      }
-      return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(Highlighter, {
-        autoEscape: true,
-        highlightTag: CustomHighlight,
-        searchWords: [searchQuery],
-        textToHighlight: itemLabelText
-      }), showChildrenAmount ? /* @__PURE__ */ React2.createElement(ChildrenCountDisplayer, {
-        item
-      }) : null);
+          }) : null
+        ]
+      });
     }
     if (labelOverflow === "truncate") {
-      return /* @__PURE__ */ React2.createElement(SimpleTruncatedTooltipText, {
-        value: /* @__PURE__ */ React2.createElement(React2.Fragment, null, itemLabelText, showChildrenAmount ? /* @__PURE__ */ React2.createElement(ChildrenCountDisplayer, {
-          item
-        }) : null)
+      return /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, {
+        value: /* @__PURE__ */ jsxs(Fragment, {
+          children: [
+            itemLabelText,
+            showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, {
+              item
+            }) : null
+          ]
+        })
       });
     }
-    return /* @__PURE__ */ React2.createElement(React2.Fragment, null, itemLabelText, showChildrenAmount ? /* @__PURE__ */ React2.createElement(ChildrenCountDisplayer, {
-      item
-    }) : null);
+    return /* @__PURE__ */ jsxs(Fragment, {
+      children: [
+        itemLabelText,
+        showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, {
+          item
+        }) : null
+      ]
+    });
   }, [item, searchQuery, nameKey, showChildrenAmount, labelOverflow]);
   let className = "";
   if (labelOverflow === "wrap-all")
     className += `${classNameModifierWrapAll} `;
   if (labelOverflow === "truncate")
     className += `${classNameModifierTruncate} `;
-  return /* @__PURE__ */ React2.createElement(ItemContent, {
-    "data-testid": `${treeItemBlockName}-content`
-  }, /* @__PURE__ */ React2.createElement(ItemValue, {
-    className
-  }, Text));
+  return /* @__PURE__ */ jsx(ItemContent, {
+    "data-testid": `${treeItemBlockName}-content`,
+    children: /* @__PURE__ */ jsx(ItemValue, {
+      className,
+      children: Text
+    })
+  });
 };
 export {
   TreeItemText

package/dist/esm/parts/TreeItemText.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/TreeItemText.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useMemo, useContext } from 'react';\nimport Highlighter from 'react-highlight-words';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\n\nimport { ChildrenCountDisplayer } from './ChildrenCountDisplayer';\nimport { DSTreeViewPrefix, treeItemBlockName } from '../config/cssClassesConstants';\n\nimport TreeViewContext from '../TreeViewContext';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\n\nconst ItemContent = aggregatedClasses('div')(`${treeItemBlockName}-content`) as unknown as React.ComponentType<\n  React.ComponentProps<'div'>\n>;\nconst ItemValue = aggregatedClasses('span')(treeItemBlockName, 'value') as unknown as React.ComponentType<\n  React.ComponentProps<'span'>\n>;\n\n// const wrapperClassName = `${DSTreeViewPrefix}-${treeItemBlockName}-content`;\nconst classNameModifierWrapAll = `${DSTreeViewPrefix}-${treeItemBlockName}__value--wrap-all`;\nconst classNameModifierTruncate = `${DSTreeViewPrefix}-${treeItemBlockName}__value--truncate`;\n\n// eslint-disable-next-line react/prop-types\nconst CustomHighlight = ({ children }: { children: React.ReactNode }) => (\n  <mark className=\"tree-text-highlight\" data-testid=\"tree-text-highlight\">\n    {children}\n  </mark>\n);\ninterface PropsT {\n  item: DSTreeviewT.Item;\n}\nexport const TreeItemText = (props: PropsT): JSX.Element => {\n  const { item } = props;\n  const ctx = useContext(TreeViewContext);\n  const {\n    props: { searchQuery, showChildrenAmount, labelOverflow, nameKey },\n  } = ctx;\n\n  const Text = useMemo(() => {\n    const itemLabelText = item[nameKey] as DSTreeviewT.Item['name'];\n    if (searchQuery) {\n      if (labelOverflow === 'truncate') {\n        return (\n          <SimpleTruncatedTooltipText\n            value={\n              <>\n                <Highlighter\n                  autoEscape\n                  highlightTag={CustomHighlight}\n                  searchWords={[searchQuery]}\n                  textToHighlight={itemLabelText}\n                />\n                {showChildrenAmount ? <ChildrenCountDisplayer item={item} /> : null}\n              </>\n            }\n          />\n        );\n      }\n      return (\n        <>\n          <Highlighter\n            autoEscape\n            highlightTag={CustomHighlight}\n            searchWords={[searchQuery]}\n            textToHighlight={itemLabelText}\n          />\n          {showChildrenAmount ? <ChildrenCountDisplayer item={item} /> : null}\n        </>\n      );\n    }\n    if (labelOverflow === 'truncate') {\n      return (\n        <SimpleTruncatedTooltipText\n          value={\n            <>\n              {itemLabelText}\n              {showChildrenAmount ? <ChildrenCountDisplayer item={item} /> : null}\n            </>\n          }\n        />\n      );\n    }\n    return (\n      <>\n        {itemLabelText}\n        {showChildrenAmount ? <ChildrenCountDisplayer item={item} /> : null}\n      </>\n    );\n  }, [item, searchQuery, nameKey, showChildrenAmount, labelOverflow]);\n\n  let className = '';\n  if (labelOverflow === 'wrap-all') className += `${classNameModifierWrapAll} `;\n  if (labelOverflow === 'truncate') className += `${classNameModifierTruncate} `;\n\n  return (\n    <ItemContent data-testid={`${treeItemBlockName}-content`}>\n      <ItemValue className={className}>{Text}</ItemValue>\n    </ItemContent>\n  );\n};\n"],
-  "mappings": "AAAA;ACCA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAGA,MAAM,cAAc,kBAAkB,KAAK,EAAE,GAAG,2BAA2B;AAG3E,MAAM,YAAY,kBAAkB,MAAM,EAAE,mBAAmB,OAAO;AAKtE,MAAM,2BAA2B,GAAG,oBAAoB;AACxD,MAAM,4BAA4B,GAAG,oBAAoB;AAGzD,MAAM,kBAAkB,CAAC,EAAE,eACzB,qCAAC;AAAA,EAAK,WAAU;AAAA,EAAsB,eAAY;AAAA,GAC/C,QACH;AAKK,MAAM,eAAe,CAAC,UAA+B;AAC1D,QAAM,EAAE,SAAS;AACjB,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,aAAa,oBAAoB,eAAe;AAAA,MACvD;AAEJ,QAAM,OAAO,QAAQ,MAAM;AACzB,UAAM,gBAAgB,KAAK;AAC3B,QAAI,aAAa;AACf,UAAI,kBAAkB,YAAY;AAChC,eACE,qCAAC;AAAA,UACC,OACE,4DACE,qCAAC;AAAA,YACC,YAAU;AAAA,YACV,cAAc;AAAA,YACd,aAAa,CAAC,WAAW;AAAA,YACzB,iBAAiB;AAAA,WACnB,GACC,qBAAqB,qCAAC;AAAA,YAAuB;AAAA,WAAY,IAAK,IACjE;AAAA,SAEJ;AAAA,MAEJ;AACA,aACE,4DACE,qCAAC;AAAA,QACC,YAAU;AAAA,QACV,cAAc;AAAA,QACd,aAAa,CAAC,WAAW;AAAA,QACzB,iBAAiB;AAAA,OACnB,GACC,qBAAqB,qCAAC;AAAA,QAAuB;AAAA,OAAY,IAAK,IACjE;AAAA,IAEJ;AACA,QAAI,kBAAkB,YAAY;AAChC,aACE,qCAAC;AAAA,QACC,OACE,4DACG,eACA,qBAAqB,qCAAC;AAAA,UAAuB;AAAA,SAAY,IAAK,IACjE;AAAA,OAEJ;AAAA,IAEJ;AACA,WACE,4DACG,eACA,qBAAqB,qCAAC;AAAA,MAAuB;AAAA,KAAY,IAAK,IACjE;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,SAAS,oBAAoB,aAAa,CAAC;AAElE,MAAI,YAAY;AAChB,MAAI,kBAAkB;AAAY,iBAAa,GAAG;AAClD,MAAI,kBAAkB;AAAY,iBAAa,GAAG;AAElD,SACE,qCAAC;AAAA,IAAY,eAAa,GAAG;AAAA,KAC3B,qCAAC;AAAA,IAAU;AAAA,KAAuB,IAAK,CACzC;AAEJ;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAgB,SAAS,kBAAkB;AAC3C,OAAO,iBAAiB;AACxB,SAAS,kCAAkC;AAC3C,SAAS,yBAAyB;AAElC,SAAS,8BAA8B;AACvC,SAAS,kBAAkB,yBAAyB;AAEpD,OAAO,qBAAqB;AAG5B,MAAM,cAAc,kBAAkB,KAAK,EAAE,GAAG,2BAA2B;AAG3E,MAAM,YAAY,kBAAkB,MAAM,EAAE,mBAAmB,OAAO;AAKtE,MAAM,2BAA2B,GAAG,oBAAoB;AACxD,MAAM,4BAA4B,GAAG,oBAAoB;AAGzD,MAAM,kBAAkB,CAAC,EAAE,SAAS,MAClC,oBAAC;AAAA,EAAK,WAAU;AAAA,EAAsB,eAAY;AAAA,EAC/C;AAAA,CACH;AAKK,MAAM,eAAe,CAAC,UAA+B;AAC1D,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,aAAa,oBAAoB,eAAe,QAAQ;AAAA,EACnE,IAAI;AAEJ,QAAM,OAAO,QAAQ,MAAM;AACzB,UAAM,gBAAgB,KAAK;AAC3B,QAAI,aAAa;AACf,UAAI,kBAAkB,YAAY;AAChC,eACE,oBAAC;AAAA,UACC,OACE;AAAA,YACE;AAAA,kCAAC;AAAA,gBACC,YAAU;AAAA,gBACV,cAAc;AAAA,gBACd,aAAa,CAAC,WAAW;AAAA,gBACzB,iBAAiB;AAAA,eACnB;AAAA,cACC,qBAAqB,oBAAC;AAAA,gBAAuB;AAAA,eAAY,IAAK;AAAA;AAAA,WACjE;AAAA,SAEJ;AAAA,MAEJ;AACA,aACE;AAAA,QACE;AAAA,8BAAC;AAAA,YACC,YAAU;AAAA,YACV,cAAc;AAAA,YACd,aAAa,CAAC,WAAW;AAAA,YACzB,iBAAiB;AAAA,WACnB;AAAA,UACC,qBAAqB,oBAAC;AAAA,YAAuB;AAAA,WAAY,IAAK;AAAA;AAAA,OACjE;AAAA,IAEJ;AACA,QAAI,kBAAkB,YAAY;AAChC,aACE,oBAAC;AAAA,QACC,OACE;AAAA,UACG;AAAA;AAAA,YACA,qBAAqB,oBAAC;AAAA,cAAuB;AAAA,aAAY,IAAK;AAAA;AAAA,SACjE;AAAA,OAEJ;AAAA,IAEJ;AACA,WACE;AAAA,MACG;AAAA;AAAA,QACA,qBAAqB,oBAAC;AAAA,UAAuB;AAAA,SAAY,IAAK;AAAA;AAAA,KACjE;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,SAAS,oBAAoB,aAAa,CAAC;AAElE,MAAI,YAAY;AAChB,MAAI,kBAAkB;AAAY,iBAAa,GAAG;AAClD,MAAI,kBAAkB;AAAY,iBAAa,GAAG;AAElD,SACE,oBAAC;AAAA,IAAY,eAAa,GAAG;AAAA,IAC3B,8BAAC;AAAA,MAAU;AAAA,MAAuB;AAAA,KAAK;AAAA,GACzC;AAEJ;",
   "names": []
 }

package/dist/esm/parts/TreeList.js

@@ -1,5 +1,6 @@
 import * as React from "react";
-import React2, { useContext } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useContext } from "react";
 import { aggregatedClasses } from "@elliemae/ds-classnames";
 import { DSCircularProgressIndicator } from "@elliemae/ds-circular-progress-indicator";
 import TreeViewContext from "../TreeViewContext";
@@ -30,59 +31,68 @@ const TreeListComp = () => {
   const { totalSize, virtualItems } = virtualListHelpers;
   const className = `${rowSize === "compact" ? `${compactRowClass}` : `${normaRowClass}`}`;
   const { visibleItems } = useContext(DnDTreeContext);
-  return /* @__PURE__ */ React2.createElement(TreeListWrapper, {
+  return /* @__PURE__ */ jsxs(TreeListWrapper, {
     ref: virtualListRef,
     className,
     style: {
       height: `${typeof height === "number" ? `${height}px` : height}`,
       width: `${typeof width === "number" ? `${width}px` : width}`,
       overflow: "auto"
-    }
-  }, isLoading ? /* @__PURE__ */ React2.createElement("div", {
-    style: {
-      width: "100%",
-      height: "100%",
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center"
-    }
-  }, /* @__PURE__ */ React2.createElement(DSCircularProgressIndicator, {
-    size: "xl",
-    loading: isLoading,
-    showLabel: true,
-    waiting: false,
-    showTooltip: false
-  })) : null, !isLoading && virtualItems.length === 0 ? /* @__PURE__ */ React2.createElement(TreeListNoItems, null, noItemsPlaceholder) : null, !isLoading && virtualItems.length !== 0 ? /* @__PURE__ */ React2.createElement("div", {
-    style: {
-      height: `${totalSize}px`,
-      width: "100%",
-      position: "relative"
-    }
-  }, virtualItems.map((virtualItem) => {
-    const { index, measureRef, start } = virtualItem;
-    const item = (visibleItems || flattenedVisibleItems)[index];
-    if (!item)
-      return null;
-    item.virtualIndex = index;
-    const { id } = item;
-    const style = {
-      position: "absolute",
-      top: `${start}px`,
-      left: 0,
-      width: "100%"
-    };
-    const listItemProps = {
-      key: `DS-TreeView-List-Item-${id}`,
-      virtualItemRef: measureRef,
-      index,
-      itemIndex: index,
-      item,
-      itemWrapperStyle: style
-    };
-    return /* @__PURE__ */ React2.createElement(TreeItem, {
-      ...listItemProps
-    });
-  })) : null);
+    },
+    children: [
+      isLoading ? /* @__PURE__ */ jsx("div", {
+        style: {
+          width: "100%",
+          height: "100%",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center"
+        },
+        children: /* @__PURE__ */ jsx(DSCircularProgressIndicator, {
+          size: "xl",
+          loading: isLoading,
+          showLabel: true,
+          waiting: false,
+          showTooltip: false
+        })
+      }) : null,
+      !isLoading && virtualItems.length === 0 ? /* @__PURE__ */ jsx(TreeListNoItems, {
+        children: noItemsPlaceholder
+      }) : null,
+      !isLoading && virtualItems.length !== 0 ? /* @__PURE__ */ jsx("div", {
+        style: {
+          height: `${totalSize}px`,
+          width: "100%",
+          position: "relative"
+        },
+        children: virtualItems.map((virtualItem) => {
+          const { index, measureRef, start } = virtualItem;
+          const item = (visibleItems || flattenedVisibleItems)[index];
+          if (!item)
+            return null;
+          item.virtualIndex = index;
+          const { id } = item;
+          const style = {
+            position: "absolute",
+            top: `${start}px`,
+            left: 0,
+            width: "100%"
+          };
+          const listItemProps = {
+            key: `DS-TreeView-List-Item-${id}`,
+            virtualItemRef: measureRef,
+            index,
+            itemIndex: index,
+            item,
+            itemWrapperStyle: style
+          };
+          return /* @__PURE__ */ jsx(TreeItem, {
+            ...listItemProps
+          });
+        })
+      }) : null
+    ]
+  });
 };
 const TreeList = withConditionalDnDRowContext(TreeListComp);
 export {

package/dist/esm/parts/TreeList.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/TreeList.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext } from 'react';\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 from './TreeItem';\n\nimport type { DSTreeviewT } from '../react-desc-prop-types';\nimport { withConditionalDnDRowContext } from '../hoc/WithConditionalDnDContext';\nimport { DnDTreeContext } from '../hoc/DnDTreeContext';\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\nconst TreeListComp: React.ComponentType<PropsT> = () => {\n  const ctx = useContext(TreeViewContext);\n  const {\n    virtualListRef,\n    virtualListHelpers,\n    visibleItems: flattenedVisibleItems,\n    props: { width, height, rowSize, noItemsPlaceholder, isLoading },\n  } = ctx;\n  const { totalSize, virtualItems } = virtualListHelpers;\n  const className = `${rowSize === 'compact' ? `${compactRowClass}` : `${normaRowClass}`}`;\n\n  const { visibleItems } = useContext(DnDTreeContext);\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 || flattenedVisibleItems)[index];\n            if (!item) return null;\n            item.virtualIndex = index;\n            const { id } = item;\n\n            const style = {\n              position: 'absolute',\n              top: `${start}px`,\n              left: 0,\n              width: '100%',\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            return <TreeItem {...listItemProps} />;\n          })}\n        </div>\n      ) : null}\n    </TreeListWrapper>\n  );\n};\n\nexport const TreeList = withConditionalDnDRowContext(TreeListComp);\n"],
-  "mappings": "AAAA;ACCA;AACA;AACA;AAEA;AACA;AACA;AAGA;AACA;AAEO,MAAM,oBAAoB,GAAG;AAC7B,MAAM,kBAAkB,kBAAkB,OAAO;AAAA,EACtD,eAAe;AACjB,CAAC,EAAE,iBAAiB;AAOb,MAAM,kBAAkB,kBAAkB,MAAM;AAAA,EACrD,eAAe;AAAA,EACf,MAAM;AACR,CAAC,EAAE,mBAAmB,MAAM,CAAC,EAAE,cAAkD;AAAA,EAC/E,CAAC,WAAW,YAAY;AAC1B,EAAE;AAEF,MAAM,kBAAkB,GAAG;AAC3B,MAAM,gBAAgB,GAAG;AAYzB,MAAM,eAA4C,MAAM;AACtD,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,OAAO,EAAE,OAAO,QAAQ,SAAS,oBAAoB;AAAA,MACnD;AACJ,QAAM,EAAE,WAAW,iBAAiB;AACpC,QAAM,YAAY,GAAG,YAAY,YAAY,GAAG,oBAAoB,GAAG;AAEvE,QAAM,EAAE,iBAAiB,WAAW,cAAc;AAElD,SACE,qCAAC;AAAA,IACC,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,IACZ;AAAA,KAEC,YACC,qCAAC;AAAA,IACC,OAAO;AAAA,MACL,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,IAClB;AAAA,KAEA,qCAAC;AAAA,IAA4B,MAAK;AAAA,IAAK,SAAS;AAAA,IAAW,WAAS;AAAA,IAAC,SAAS;AAAA,IAAO,aAAa;AAAA,GAAO,CAC3G,IACE,MACH,CAAC,aAAa,aAAa,WAAW,IAAI,qCAAC,uBAAiB,kBAAmB,IAAqB,MACpG,CAAC,aAAa,aAAa,WAAW,IACrC,qCAAC;AAAA,IACC,OAAO;AAAA,MACL,QAAQ,GAAG;AAAA,MACX,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,KAEC,aAAa,IAAI,CAAC,gBAAgB;AACjC,UAAM,EAAE,OAAO,YAAY,UAAU;AACrC,UAAM,OAAQ,iBAAgB,uBAAuB;AACrD,QAAI,CAAC;AAAM,aAAO;AAClB,SAAK,eAAe;AACpB,UAAM,EAAE,OAAO;AAEf,UAAM,QAAQ;AAAA,MACZ,UAAU;AAAA,MACV,KAAK,GAAG;AAAA,MACR,MAAM;AAAA,MACN,OAAO;AAAA,IACT;AAEA,UAAM,gBAAgB;AAAA,MACpB,KAAK,yBAAyB;AAAA,MAC9B,gBAAgB;AAAA,MAChB;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA,kBAAkB;AAAA,IACpB;AAEA,WAAO,qCAAC;AAAA,MAAU,GAAG;AAAA,KAAe;AAAA,EACtC,CAAC,CACH,IACE,IACN;AAEJ;AAEO,MAAM,WAAW,6BAA6B,YAAY;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAgB,kBAAkB;AAClC,SAAS,yBAAyB;AAClC,SAAS,mCAAmC;AAE5C,OAAO,qBAAqB;AAC5B,SAAS,kBAAkB,yBAAyB;AACpD,OAAO,cAAc;AAGrB,SAAS,oCAAoC;AAC7C,SAAS,sBAAsB;AAExB,MAAM,oBAAoB,GAAG;AAC7B,MAAM,kBAAkB,kBAAkB,OAAO;AAAA,EACtD,eAAe;AACjB,CAAC,EAAE,iBAAiB;AAOb,MAAM,kBAAkB,kBAAkB,MAAM;AAAA,EACrD,eAAe;AAAA,EACf,MAAM;AACR,CAAC,EAAE,mBAAmB,MAAM,CAAC,EAAE,QAAQ,OAA0C;AAAA,EAC/E,CAAC,WAAW,YAAY;AAC1B,EAAE;AAEF,MAAM,kBAAkB,GAAG;AAC3B,MAAM,gBAAgB,GAAG;AAYzB,MAAM,eAA4C,MAAM;AACtD,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,OAAO,EAAE,OAAO,QAAQ,SAAS,oBAAoB,UAAU;AAAA,EACjE,IAAI;AACJ,QAAM,EAAE,WAAW,aAAa,IAAI;AACpC,QAAM,YAAY,GAAG,YAAY,YAAY,GAAG,oBAAoB,GAAG;AAEvE,QAAM,EAAE,aAAa,IAAI,WAAW,cAAc;AAElD,SACE,qBAAC;AAAA,IACC,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,IACZ;AAAA,IAEC;AAAA,kBACC,oBAAC;AAAA,QACC,OAAO;AAAA,UACL,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,gBAAgB;AAAA,QAClB;AAAA,QAEA,8BAAC;AAAA,UAA4B,MAAK;AAAA,UAAK,SAAS;AAAA,UAAW,WAAS;AAAA,UAAC,SAAS;AAAA,UAAO,aAAa;AAAA,SAAO;AAAA,OAC3G,IACE;AAAA,MACH,CAAC,aAAa,aAAa,WAAW,IAAI,oBAAC;AAAA,QAAiB;AAAA,OAAmB,IAAqB;AAAA,MACpG,CAAC,aAAa,aAAa,WAAW,IACrC,oBAAC;AAAA,QACC,OAAO;AAAA,UACL,QAAQ,GAAG;AAAA,UACX,OAAO;AAAA,UACP,UAAU;AAAA,QACZ;AAAA,QAEC,uBAAa,IAAI,CAAC,gBAAgB;AACjC,gBAAM,EAAE,OAAO,YAAY,MAAM,IAAI;AACrC,gBAAM,QAAQ,gBAAgB,uBAAuB;AACrD,cAAI,CAAC;AAAM,mBAAO;AAClB,eAAK,eAAe;AACpB,gBAAM,EAAE,GAAG,IAAI;AAEf,gBAAM,QAAQ;AAAA,YACZ,UAAU;AAAA,YACV,KAAK,GAAG;AAAA,YACR,MAAM;AAAA,YACN,OAAO;AAAA,UACT;AAEA,gBAAM,gBAAgB;AAAA,YACpB,KAAK,yBAAyB;AAAA,YAC9B,gBAAgB;AAAA,YAChB;AAAA,YACA,WAAW;AAAA,YACX;AAAA,YACA,kBAAkB;AAAA,UACpB;AAEA,iBAAO,oBAAC;AAAA,YAAU,GAAG;AAAA,WAAe;AAAA,QACtC,CAAC;AAAA,OACH,IACE;AAAA;AAAA,GACN;AAEJ;AAEO,MAAM,WAAW,6BAA6B,YAAY;",
   "names": []
 }

package/dist/esm/plugins/dnd/TreeDndPlugin.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/dnd/TreeDndPlugin.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const TreeDndPlugin = 'tree-dnd';\n"],
-  "mappings": "AAAA;ACAO,MAAM,gBAAgB;",
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,gBAAgB;",
   "names": []
 }

package/dist/esm/plugins/dnd/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/dnd/index.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './TreeDndPlugin';\n"],
-  "mappings": "AAAA;ACAA;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;",
   "names": []
 }

package/dist/esm/plugins/index.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/plugins/index.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './dnd';\n"],
-  "mappings": "AAAA;ACAA;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;",
   "names": []
 }

package/dist/esm/react-desc-prop-types.js

@@ -1,14 +1,18 @@
 import * as React from "react";
 import { PropTypes } from "@elliemae/ds-utilities";
 const TreeViewPropTypes = {
-  data: PropTypes.arrayOf(PropTypes.shape({
-    children: PropTypes.arrayOf(PropTypes.object),
-    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    isGroup: PropTypes.oneOfType([PropTypes.oneOf([void 0, null]), PropTypes.bool]),
-    name: PropTypes.string,
-    node: PropTypes.object
-  })).description("data to populate tree view").isRequired,
-  plugins: PropTypes.tuple([PropTypes.oneOf(["tree-dnd"])]).description("only accepted value is TreeDndPlugin constant\nother legacy plugins are now supported via different props").defaultValue([]),
+  data: PropTypes.arrayOf(
+    PropTypes.shape({
+      children: PropTypes.arrayOf(PropTypes.object),
+      id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+      isGroup: PropTypes.oneOfType([PropTypes.oneOf([void 0, null]), PropTypes.bool]),
+      name: PropTypes.string,
+      node: PropTypes.object
+    })
+  ).description("data to populate tree view").isRequired,
+  plugins: PropTypes.tuple([PropTypes.oneOf(["tree-dnd"])]).description(
+    "only accepted value is TreeDndPlugin constant\nother legacy plugins are now supported via different props"
+  ).defaultValue([]),
   selection: PropTypes.object.description("pre selected items").defaultValue({}),
   expanded: PropTypes.object.description("control what items are expanded").defaultValue(void 0),
   instanceRef: PropTypes.shape({

package/dist/esm/react-desc-prop-types.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport TreeModel from 'tree-model';\nimport { useVirtual } from 'react-virtual';\nexport declare namespace DSTreeviewT {\n  export type StringOrNum = string | number;\n  export type SelectionState = boolean | 'mixed';\n  export type SelectionItems = Record<StringOrNum, SelectionState>;\n  export type ScrollToFunc = ReturnType<typeof useVirtual>['scrollToIndex'];\n  export type ScrollToItemOptions = Parameters<ReturnType<typeof useVirtual>['scrollToIndex']>[1];\n  export type ScrollToItemFunc = (options: ScrollToItemOptions) => void;\n  export type ExpandedItems = Record<StringOrNum, true>; // { [id]:true } -> e.g. {1:true; 2:true} // false are not listed\n  export interface SimpleItem {\n    [key: string]: unknown;\n    name: string;\n    children?: SimpleItem[];\n    id: StringOrNum;\n  }\n\n  export interface Item extends SimpleItem {\n    children: Item[];\n    treeDepth?: number;\n    virtualIndex?: number;\n    isChecked?: boolean | 'mixed';\n    isGroup?: boolean;\n    isExpanded?: boolean;\n    childrenMatchesSearchQuery?: boolean;\n    matchesSearchQuery?: boolean;\n    nodeItemRef?: React.RefObject<HTMLLIElement>;\n    model: TreeModel.Node<Item>['model'];\n    node: TreeModel.Node<Item> & { parent?: TreeModel.Node<Item> };\n    nodePath: TreeModel.Node<Item>[];\n  }\n\n  export interface DndItem {\n    uid: string;\n    depth: number;\n    realIndex: number;\n    childrenCount: number;\n    parentId: string | null;\n    original: DSTreeviewT.Item;\n  }\n\n  export interface Actions {\n    toggleExpandAll: (isExpand: boolean) => Promise<DSTreeviewT.Item[]>;\n    scrollTo: DSTreeviewT.ScrollToFunc;\n    setSelectedItemByVirtualIndex: (index: number) => void;\n    setFocusedItemByVirtualIndex: (\n      index: number,\n      scrollOpts: DSTreeviewT.ScrollToItemOptions & { withScroll?: boolean },\n    ) => void;\n  }\n  export interface InstanceRef {\n    actions: Actions;\n  }\n\n  export interface DefaultProps {\n    plugins: string[];\n    selection: SelectionItems;\n    instanceRef: React.MutableRefObject<InstanceRef>;\n    isItemDisabled: (item: Item) => boolean;\n    disableIcons: boolean;\n    isMultiSelect: boolean;\n    isSingleSelect: boolean;\n    getIsDropValid: (\n      active: DndItem,\n      over: DndItem,\n      dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside',\n    ) => boolean;\n    showChildrenAmount: boolean;\n    isLoading: boolean;\n    highlightOnlyQuery: boolean;\n    onItemClick: (item: Item, e: React.MouseEvent<HTMLLIElement>) => void;\n    onItemFocus: (meta: { scrollToItem: ScrollToItemFunc; itemIndex: number; item: Item }) => void;\n    onVisibleItemsChange: (newVisibleItems: Item[]) => void;\n    onOrderChange: (newData: SimpleItem[], oldData: SimpleItem[], draggedItem: DndItem) => void;\n    onSelectionChange: (\n      selection: SelectionItems,\n      item: Item,\n      meta: { scrollToItem: ScrollToItemFunc; itemIndex: number },\n    ) => void;\n    onExpandChange: (expandedHashmap: ExpandedItems, itemToggled: Item | null | undefined) => void;\n    onInstanceRefInitialized: (instanceRef: React.MutableRefObject<InstanceRef>) => void;\n    rowSize: 'normal' | 'compact';\n    labelOverflow: 'wrap' | 'wrap-all' | 'truncate';\n    noItemsPlaceholder: string;\n    nameKey: string;\n    width: StringOrNum;\n    height: StringOrNum;\n    groupIcon: JSX.Element | null;\n    itemIcon: JSX.Element | null;\n    searchQuery: string;\n  }\n  export interface PropsOptional {\n    expanded: ExpandedItems;\n    rightAddons: ((item: Item) => React.ReactNode | React.ReactNode[]) | JSX.Element;\n  }\n  export interface PropsRequired {\n    data: Item[];\n  }\n  export interface Props extends DefaultProps, PropsOptional, PropsRequired {}\n}\n\nexport const TreeViewPropTypes = {\n  data: PropTypes.arrayOf(\n    PropTypes.shape({\n      children: PropTypes.arrayOf(PropTypes.object),\n      id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n      isGroup: PropTypes.oneOfType([PropTypes.oneOf([undefined, null]), PropTypes.bool]),\n      name: PropTypes.string,\n      node: PropTypes.object,\n    }),\n  ).description('data to populate tree view').isRequired,\n  plugins: PropTypes.tuple([PropTypes.oneOf(['tree-dnd'])])\n    .description(\n      'only accepted value is TreeDndPlugin constant\\nother legacy plugins are now supported via different props',\n    )\n    .defaultValue([]),\n  selection: PropTypes.object.description('pre selected items').defaultValue({}),\n  expanded: PropTypes.object.description('control what items are expanded').defaultValue(undefined),\n  instanceRef: PropTypes.shape({\n    current: PropTypes.oneOfType([\n      PropTypes.oneOf([null, undefined]),\n      PropTypes.shape({\n        actions: PropTypes.shape({\n          toggleExpandAll: PropTypes.func,\n          scrollTo: PropTypes.func,\n        }).description('').isRequired,\n      }),\n    ]),\n  }).description('instance ref'),\n  isItemDisabled: PropTypes.func\n    .description('Function that receives an item, and returns whether that item should be disabled')\n    .defaultValue('() => false'),\n  disableIcons: PropTypes.bool.description('disable icons').defaultValue(false),\n  isMultiSelect: PropTypes.bool.description('whether the tree view is multi select or not').defaultValue(false),\n  isSingleSelect: PropTypes.bool.description('wheter the tree view is single select or not').defaultValue(false),\n  isLoading: PropTypes.bool.description('wheter the tree should show the loading state or not').defaultValue(false),\n  getIsDropValid: PropTypes.func\n    .description(\"Function that returns true if the drop is valid and false if it's not\")\n    .defaultValue('() => true'),\n  showChildrenAmount: PropTypes.bool.description('whether to show the amount of children or not').defaultValue(false),\n  onItemClick: PropTypes.func.description('function executed when clicking on an item').defaultValue('() => {}'),\n  onItemFocus: PropTypes.func.description('function executed when focusing on an item').defaultValue('() => {}'),\n  onVisibleItemsChange: PropTypes.func\n    .description('function executed when the visible items change')\n    .defaultValue('() => {}'),\n  onOrderChange: PropTypes.func.description('function executed when the items order changes').defaultValue('() => {}'),\n  onSelectionChange: PropTypes.func\n    .description('function executed when the selection changes')\n    .defaultValue('() => {}'),\n  onExpandChange: PropTypes.func.description('function executed when expanding an item').defaultValue('() => {}'),\n  onInstanceRefInitialized: PropTypes.func\n    .description('function executed when instanceRef has terminated instanciation')\n    .defaultValue('() => {}'),\n  rowSize: PropTypes.oneOf(['normal', 'compact']).description('size of the row').defaultValue('normal'),\n  labelOverflow: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate'])\n    .description('label truncation preference')\n    .defaultValue('wrap'),\n  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).description('components width').defaultValue('100%'),\n  height: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\n    .description('components height')\n    .defaultValue('100%'),\n  groupIcon: PropTypes.node.description('icon for groups'),\n  itemIcon: PropTypes.node.description('icon for items'),\n  searchQuery: PropTypes.string.description('search query value'),\n  noItemsPlaceholder: PropTypes.string\n    .description('message to be shown when there are no items in the treeview to be displayed')\n    .defaultValue('No items found'),\n  nameKey: PropTypes.string.description('property key to identifier for items labels').defaultValue('name'),\n  highlightOnlyQuery: PropTypes.bool.description('whether to highlight results or not').defaultValue(false),\n};\n"],
-  "mappings": "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",
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,iBAAiB;AAsGnB,MAAM,oBAAoB;AAAA,EAC/B,MAAM,UAAU;AAAA,IACd,UAAU,MAAM;AAAA,MACd,UAAU,UAAU,QAAQ,UAAU,MAAM;AAAA,MAC5C,IAAI,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC;AAAA,MAC5D,SAAS,UAAU,UAAU,CAAC,UAAU,MAAM,CAAC,QAAW,IAAI,CAAC,GAAG,UAAU,IAAI,CAAC;AAAA,MACjF,MAAM,UAAU;AAAA,MAChB,MAAM,UAAU;AAAA,IAClB,CAAC;AAAA,EACH,EAAE,YAAY,4BAA4B,EAAE;AAAA,EAC5C,SAAS,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EACrD;AAAA,IACC;AAAA,EACF,EACC,aAAa,CAAC,CAAC;AAAA,EAClB,WAAW,UAAU,OAAO,YAAY,oBAAoB,EAAE,aAAa,CAAC,CAAC;AAAA,EAC7E,UAAU,UAAU,OAAO,YAAY,iCAAiC,EAAE,aAAa,MAAS;AAAA,EAChG,aAAa,UAAU,MAAM;AAAA,IAC3B,SAAS,UAAU,UAAU;AAAA,MAC3B,UAAU,MAAM,CAAC,MAAM,MAAS,CAAC;AAAA,MACjC,UAAU,MAAM;AAAA,QACd,SAAS,UAAU,MAAM;AAAA,UACvB,iBAAiB,UAAU;AAAA,UAC3B,UAAU,UAAU;AAAA,QACtB,CAAC,EAAE,YAAY,EAAE,EAAE;AAAA,MACrB,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC,EAAE,YAAY,cAAc;AAAA,EAC7B,gBAAgB,UAAU,KACvB,YAAY,kFAAkF,EAC9F,aAAa,aAAa;AAAA,EAC7B,cAAc,UAAU,KAAK,YAAY,eAAe,EAAE,aAAa,KAAK;AAAA,EAC5E,eAAe,UAAU,KAAK,YAAY,8CAA8C,EAAE,aAAa,KAAK;AAAA,EAC5G,gBAAgB,UAAU,KAAK,YAAY,8CAA8C,EAAE,aAAa,KAAK;AAAA,EAC7G,WAAW,UAAU,KAAK,YAAY,sDAAsD,EAAE,aAAa,KAAK;AAAA,EAChH,gBAAgB,UAAU,KACvB,YAAY,uEAAuE,EACnF,aAAa,YAAY;AAAA,EAC5B,oBAAoB,UAAU,KAAK,YAAY,+CAA+C,EAAE,aAAa,KAAK;AAAA,EAClH,aAAa,UAAU,KAAK,YAAY,4CAA4C,EAAE,aAAa,UAAU;AAAA,EAC7G,aAAa,UAAU,KAAK,YAAY,4CAA4C,EAAE,aAAa,UAAU;AAAA,EAC7G,sBAAsB,UAAU,KAC7B,YAAY,iDAAiD,EAC7D,aAAa,UAAU;AAAA,EAC1B,eAAe,UAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,UAAU;AAAA,EACnH,mBAAmB,UAAU,KAC1B,YAAY,8CAA8C,EAC1D,aAAa,UAAU;AAAA,EAC1B,gBAAgB,UAAU,KAAK,YAAY,0CAA0C,EAAE,aAAa,UAAU;AAAA,EAC9G,0BAA0B,UAAU,KACjC,YAAY,iEAAiE,EAC7E,aAAa,UAAU;AAAA,EAC1B,SAAS,UAAU,MAAM,CAAC,UAAU,SAAS,CAAC,EAAE,YAAY,iBAAiB,EAAE,aAAa,QAAQ;AAAA,EACpG,eAAe,UAAU,MAAM,CAAC,QAAQ,YAAY,UAAU,CAAC,EAC5D,YAAY,6BAA6B,EACzC,aAAa,MAAM;AAAA,EACtB,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,EAAE,YAAY,kBAAkB,EAAE,aAAa,MAAM;AAAA,EACpH,QAAQ,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,EAC7D,YAAY,mBAAmB,EAC/B,aAAa,MAAM;AAAA,EACtB,WAAW,UAAU,KAAK,YAAY,iBAAiB;AAAA,EACvD,UAAU,UAAU,KAAK,YAAY,gBAAgB;AAAA,EACrD,aAAa,UAAU,OAAO,YAAY,oBAAoB;AAAA,EAC9D,oBAAoB,UAAU,OAC3B,YAAY,6EAA6E,EACzF,aAAa,gBAAgB;AAAA,EAChC,SAAS,UAAU,OAAO,YAAY,6CAA6C,EAAE,aAAa,MAAM;AAAA,EACxG,oBAAoB,UAAU,KAAK,YAAY,qCAAqC,EAAE,aAAa,KAAK;AAC1G;",
   "names": []
 }

package/dist/esm/related-components/TreeViewSearchBar.js

@@ -1,9 +1,9 @@
 import * as React from "react";
-import React2 from "react";
+import { jsx } from "react/jsx-runtime";
 import { DSNavSearchBox } from "@elliemae/ds-form";
 function TreeViewSearchBar(props) {
   const { handleChange, onNext, onPrevious, onClear, currentResultIndex, totalResults, value } = props;
-  return /* @__PURE__ */ React2.createElement(DSNavSearchBox, {
+  return /* @__PURE__ */ jsx(DSNavSearchBox, {
     onChange: (v) => {
       handleChange({ target: { value: v } });
     },