@elliemae/ds-treeview 2.2.0-alpha.2 → 2.2.0-beta.0

package/cjs/parts/RadioSelectable.js

@@ -1,65 +1,51 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var RadioSelectable_exports = {};
-__export(RadioSelectable_exports, {
-  default: () => RadioSelectable_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_form = __toESM(require("@elliemae/ds-form"));
-var import_TreeViewContext = __toESM(require("../TreeViewContext"));
+'use strict';
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+var React = require('react');
+var dsForm = require('@elliemae/ds-form');
+var TreeViewContext = require('../TreeViewContext.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+
 function RadioSelectable(props) {
-  const { item, itemIndex } = props;
-  const ctx = (0, import_react.useContext)(import_TreeViewContext.default);
   const {
-    props: { onSelectionChange, isItemDisabled },
-    virtualListHelpers: { scrollToIndex },
+    item,
+    itemIndex
+  } = props;
+  const ctx = React.useContext(TreeViewContext["default"]);
+  const {
+    props: {
+      onSelectionChange,
+      isItemDisabled
+    },
+    virtualListHelpers: {
+      scrollToIndex
+    },
     uniqueTreeViewUUID,
     selectedCheckboxes,
     setSelectedCheckboxes
   } = ctx;
-  const { id } = item;
-  const onRadioChange = (0, import_react.useCallback)(() => {
-    const newSelectionHasmap = { [id]: true };
+  const {
+    id
+  } = item;
+  const onRadioChange = React.useCallback(() => {
+    const newSelectionHasmap = {
+      [id]: true
+    };
     setSelectedCheckboxes(newSelectionHasmap);
     const indexAndScrollTo = {
       scrollToItem: () => {
-        if (item.virtualIndex)
-          scrollToIndex(item.virtualIndex);
+        if (item.virtualIndex) scrollToIndex(item.virtualIndex);
       },
       itemIndex
     };
-    if (onSelectionChange)
-      onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);
+    if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);
   }, [id, setSelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);
-  const radioName = (0, import_react.useMemo)(() => `radios-${uniqueTreeViewUUID}`, [uniqueTreeViewUUID]);
-  const isDisabled = (0, import_react.useMemo)(() => isItemDisabled(item), [item, isItemDisabled]);
-  return /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSRadio, {
+  const radioName = React.useMemo(() => "radios-".concat(uniqueTreeViewUUID), [uniqueTreeViewUUID]);
+  const isDisabled = React.useMemo(() => isItemDisabled(item), [item, isItemDisabled]);
+  return /*#__PURE__*/_jsx__default["default"](dsForm.DSRadio, {
     checked: selectedCheckboxes[id] === true,
     name: radioName,
     disabled: isDisabled,
@@ -69,6 +55,5 @@ function RadioSelectable(props) {
     tabIndex: 0
   });
 }
-var RadioSelectable_default = RadioSelectable;
-module.exports = __toCommonJS(RadioSelectable_exports);
-//# sourceMappingURL=RadioSelectable.js.map
+
+module.exports = RadioSelectable;

package/cjs/parts/TreeItem.js

@@ -1,70 +1,64 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var TreeItem_exports = {};
-__export(TreeItem_exports, {
-  DragAndDropTreeItem: () => DragAndDropTreeItem,
-  TreeItem: () => TreeItem,
-  TreeListItem: () => TreeListItem,
-  TreeListItemAddonsWrapper: () => TreeListItemAddonsWrapper
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var React = require('react');
+var reactSortableHoc = require('@elliemae/react-sortable-hoc');
+var dsClassnames = require('@elliemae/ds-classnames');
+var dsIcons = require('@elliemae/ds-icons');
+var RadioSelectable = require('./RadioSelectable.js');
+var CheckboxSelectable = require('./CheckboxSelectable.js');
+var TreeViewContext = require('../TreeViewContext.js');
+var refsHelpers = require('../utils/refs-helpers.js');
+var keyboardHelpers = require('../utils/keyboard-helpers.js');
+var NestingSpace = require('./NestingSpace.js');
+var Icon = require('./Icon.js');
+var ExpandCaret = require('./ExpandCaret.js');
+var TreeItemText = require('./TreeItemText.js');
+var cssClassesConstants = require('../config/cssClassesConstants.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+const TreeListItem = dsClassnames.aggregatedClasses('li', {
+  'data-testid': cssClassesConstants.treeItemBlockName,
+  role: 'treeitem' // temp fix untill we move to styled components
+
+})(cssClassesConstants.treeItemBlockName);
+const TreeListItemAddonsWrapper = dsClassnames.aggregatedClasses('div')(cssClassesConstants.treeItemBlockName, 'addons' // temp fix untill we move to styled components
+);
+const DnDHandle = reactSortableHoc.SortableHandle(_ref => {
+  let {
+    id
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](dsIcons.GripperVertical, {
+    "data-testid": "drag-handle",
+    className: "drag-handle",
+    size: "s",
+    onMouseDown: e => {
+      // prevent focusing the drag-handle to avoid borders
+      if (e) {
+        e.preventDefault();
+      }
+    },
+    tabIndex: "0"
+  }, "".concat(id, "-drag-handle"));
 });
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_react_sortable_hoc = __toESM(require("@elliemae/react-sortable-hoc"));
-var import_ds_classnames = __toESM(require("@elliemae/ds-classnames"));
-var import_ds_icons = __toESM(require("@elliemae/ds-icons"));
-var import_RadioSelectable = __toESM(require("./RadioSelectable"));
-var import_CheckboxSelectable = __toESM(require("./CheckboxSelectable"));
-var import_TreeViewContext = __toESM(require("../TreeViewContext"));
-var import_refs_helpers = __toESM(require("../utils/refs-helpers"));
-var import_keyboard_helpers = __toESM(require("../utils/keyboard-helpers"));
-var import_NestingSpace = __toESM(require("./NestingSpace"));
-var import_Icon = __toESM(require("./Icon"));
-var import_ExpandCaret = __toESM(require("./ExpandCaret"));
-var import_TreeItemText = __toESM(require("./TreeItemText"));
-var import_cssClassesConstants = __toESM(require("../config/cssClassesConstants"));
-const TreeListItem = (0, import_ds_classnames.aggregatedClasses)("li", {
-  "data-testid": import_cssClassesConstants.treeItemBlockName,
-  role: "treeitem"
-})(import_cssClassesConstants.treeItemBlockName);
-const TreeListItemAddonsWrapper = (0, import_ds_classnames.aggregatedClasses)("div")(import_cssClassesConstants.treeItemBlockName, "addons");
-const DnDHandle = (0, import_react_sortable_hoc.SortableHandle)(({ id }) => /* @__PURE__ */ import_react.default.createElement(import_ds_icons.GripperVertical, {
-  "data-testid": "drag-handle",
-  key: `${id}-drag-handle`,
-  className: "drag-handle",
-  size: "s",
-  onMouseDown: (e) => {
-    if (e) {
-      e.preventDefault();
-    }
-  },
-  tabIndex: "0"
-}));
-const TreeItem = (props) => {
+const TreeItem = props => {
   const {
     item,
     itemIndex,
@@ -73,14 +67,26 @@ const TreeItem = (props) => {
     spaceForNestingLevel = 1.5,
     onMouseDragOverItem
   } = props;
-  const { id, node } = item;
-  const { nodeItemRef } = node.model;
-  const openFolderOnHoverTimeout = (0, import_react.useRef)(null);
-  const [isDraggingOverThis, setIsDraggingOverThis] = (0, import_react.useState)(false);
-  const onItemKeyDown = (0, import_keyboard_helpers.useOnItemKeyDown)(item);
-  const ctx = (0, import_react.useContext)(import_TreeViewContext.default);
   const {
-    props: { disableIcons, rightAddons, onItemClick, onItemFocus, rowSize, labelOverflow },
+    id,
+    node
+  } = item;
+  const {
+    nodeItemRef
+  } = node.model;
+  const openFolderOnHoverTimeout = React.useRef(null);
+  const [isDraggingOverThis, setIsDraggingOverThis] = React.useState(false);
+  const onItemKeyDown = keyboardHelpers.useOnItemKeyDown(item);
+  const ctx = React.useContext(TreeViewContext["default"]);
+  const {
+    props: {
+      disableIcons,
+      rightAddons,
+      onItemClick,
+      onItemFocus,
+      rowSize,
+      labelOverflow
+    },
     relativeMouseCord,
     withRadioChecks,
     withCheckboxChecks,
@@ -89,52 +95,61 @@ const TreeItem = (props) => {
     selectedCheckboxes,
     hoverItem,
     isDragging,
-    virtualListHelpers: { scrollToIndex },
+    virtualListHelpers: {
+      scrollToIndex
+    },
     setHoverItem,
     setSelectedItem,
     setFocusedItem
-  } = ctx;
-  const setItemRefs = (ref) => {
-    (0, import_refs_helpers.setMultipleRefs)(virtualItemRef, nodeItemRef)(ref);
+  } = ctx; // Sortable Items needs to update
+  //   - the virtual list ref (for react-virtual requirement)
+  //   - nodeItemRef which is a prop avaiable in the TreeModel nodes
+
+  const setItemRefs = ref => {
+    refsHelpers.setMultipleRefs(virtualItemRef, nodeItemRef)(ref);
   };
-  const dropPreviewClassName = (0, import_react.useMemo)(() => {
-    if (!withDragAndDrop || !relativeMouseCord || !isDraggingOverThis)
-      return "";
-    const { isBefore, isAfter, isValid } = relativeMouseCord;
-    let className = `${import_cssClassesConstants.DSTreeViewPrefix}-${import_cssClassesConstants.treeItemBlockName}${isValid ? "--valid" : "--invalid"}`;
-    if (isBefore)
-      className += "-drop-before";
-    else if (isAfter)
-      className += "-drop-after";
-    else
-      className += "-drop-in";
+
+  const dropPreviewClassName = React.useMemo(() => {
+    if (!withDragAndDrop || !relativeMouseCord || !isDraggingOverThis) return '';
+    const {
+      isBefore,
+      isAfter,
+      isValid
+    } = relativeMouseCord;
+    let className = "".concat(cssClassesConstants.DSTreeViewPrefix, "-").concat(cssClassesConstants.treeItemBlockName).concat(isValid ? '--valid' : '--invalid');
+    if (isBefore) className += '-drop-before';else if (isAfter) className += '-drop-after';else className += '-drop-in';
     return className;
   }, [withDragAndDrop, relativeMouseCord, isDraggingOverThis]);
-  const selectedClassName = (0, import_react.useMemo)(() => selectedItem?.id === item.id ? "selected" : "", [item.id, selectedItem?.id]);
-  const hoverClassName = (0, import_react.useMemo)(() => hoverItem?.id !== item.id || withDragAndDrop && isDragging ? "" : "hover", [hoverItem?.id, item.id, withDragAndDrop, isDragging]);
-  const fixedHeightClassname = (0, import_react.useMemo)(() => {
-    if (labelOverflow === "truncate") {
-      if (rowSize === "compact")
-        return `${import_cssClassesConstants.DSTreeViewPrefix}-${import_cssClassesConstants.treeItemBlockName}--fixed-height-compact`;
-      return `${import_cssClassesConstants.DSTreeViewPrefix}-${import_cssClassesConstants.treeItemBlockName}--fixed-height`;
+  const selectedClassName = React.useMemo(() => (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.id) === item.id ? 'selected' : '', [item.id, selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.id]);
+  const hoverClassName = React.useMemo(() => (hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id) !== item.id || withDragAndDrop && isDragging ? '' : 'hover', [hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id, item.id, withDragAndDrop, isDragging]);
+  const fixedHeightClassname = React.useMemo(() => {
+    if (labelOverflow === 'truncate') {
+      if (rowSize === 'compact') return "".concat(cssClassesConstants.DSTreeViewPrefix, "-").concat(cssClassesConstants.treeItemBlockName, "--fixed-height-compact");
+      return "".concat(cssClassesConstants.DSTreeViewPrefix, "-").concat(cssClassesConstants.treeItemBlockName, "--fixed-height");
     }
-    return "";
+
+    return '';
   }, [labelOverflow, rowSize]);
-  const finalClassName = (0, import_react.useMemo)(() => `${dropPreviewClassName} ${fixedHeightClassname} ${selectedClassName} ${hoverClassName}`, [dropPreviewClassName, selectedClassName, hoverClassName, fixedHeightClassname]);
-  const handleItemClick = (0, import_react.useCallback)((e) => {
+  const finalClassName = React.useMemo(() => "".concat(dropPreviewClassName, " ").concat(fixedHeightClassname, " ").concat(selectedClassName, " ").concat(hoverClassName), [dropPreviewClassName, selectedClassName, hoverClassName, fixedHeightClassname]);
+  const handleItemClick = React.useCallback(e => {
     onItemClick(item, e);
     setFocusedItem(item);
     setSelectedItem(item);
-    const itemVirtualIndex = typeof item.virtualIndex === "number" ? item.virtualIndex : -1;
+    const itemVirtualIndex = typeof item.virtualIndex === 'number' ? item.virtualIndex : -1;
     onItemFocus({
       itemIndex: itemVirtualIndex,
-      scrollToItem: (opts = { align: "start" }) => scrollToIndex(itemVirtualIndex, opts),
+      scrollToItem: function () {
+        let opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+          align: 'start'
+        };
+        return scrollToIndex(itemVirtualIndex, opts);
+      },
       item
     });
   }, [item, scrollToIndex, onItemClick, onItemFocus, setSelectedItem, setFocusedItem]);
-  return /* @__PURE__ */ import_react.default.createElement(TreeListItem, {
+  return /*#__PURE__*/jsxRuntime.jsxs(TreeListItem, {
     tabIndex: 0,
-    onMouseMove: (event) => {
+    onMouseMove: event => {
       if (withDragAndDrop && onMouseDragOverItem) {
         onMouseDragOverItem({
           event,
@@ -148,10 +163,10 @@ const TreeItem = (props) => {
     onMouseLeave: () => {
       if (withDragAndDrop) {
         setIsDraggingOverThis(false);
-        if (openFolderOnHoverTimeout?.current)
-          clearTimeout(openFolderOnHoverTimeout.current);
+        if (openFolderOnHoverTimeout !== null && openFolderOnHoverTimeout !== void 0 && openFolderOnHoverTimeout.current) clearTimeout(openFolderOnHoverTimeout.current);
       }
-      if (hoverItem?.id === item.id) {
+
+      if ((hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.id) === item.id) {
         setHoverItem(null);
       }
     },
@@ -160,32 +175,36 @@ const TreeItem = (props) => {
     },
     onClick: handleItemClick,
     ref: setItemRefs,
-    style: { ...itemWrapperStyle },
+    style: _objectSpread({}, itemWrapperStyle),
     className: finalClassName,
     "aria-expanded": !!item.isExpanded,
     "aria-selected": !!selectedCheckboxes[item.id],
     "data-id": item.id,
     "data-index": item.virtualIndex,
-    onKeyDown: onItemKeyDown
-  }, /* @__PURE__ */ import_react.default.createElement(TreeListItemAddonsWrapper, null, withDragAndDrop ? /* @__PURE__ */ import_react.default.createElement(DnDHandle, {
-    id
-  }) : null, withRadioChecks ? /* @__PURE__ */ import_react.default.createElement(import_RadioSelectable.default, {
-    item,
-    itemIndex
-  }) : null, withCheckboxChecks ? /* @__PURE__ */ import_react.default.createElement(import_CheckboxSelectable.default, {
-    item,
-    itemIndex
-  }) : null, /* @__PURE__ */ import_react.default.createElement(import_NestingSpace.NestingSpace, {
-    item,
-    spaceForNestingLevel
-  }), /* @__PURE__ */ import_react.default.createElement(import_ExpandCaret.ExpandCaret, {
-    item
-  }), !disableIcons ? /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, {
-    item
-  }) : null), /* @__PURE__ */ import_react.default.createElement(import_TreeItemText.TreeItemText, {
-    item
-  }), rightAddons && /* @__PURE__ */ import_react.default.createElement(TreeListItemAddonsWrapper, null, typeof rightAddons === "function" ? rightAddons(item) : rightAddons));
+    onKeyDown: onItemKeyDown,
+    children: [/*#__PURE__*/_jsx__default["default"](TreeListItemAddonsWrapper, {}, void 0, withDragAndDrop ? /*#__PURE__*/_jsx__default["default"](DnDHandle, {
+      id: id
+    }) : null, withRadioChecks ? /*#__PURE__*/_jsx__default["default"](RadioSelectable, {
+      item: item,
+      itemIndex: itemIndex
+    }) : null, withCheckboxChecks ? /*#__PURE__*/_jsx__default["default"](CheckboxSelectable, {
+      item: item,
+      itemIndex: itemIndex
+    }) : null, /*#__PURE__*/_jsx__default["default"](NestingSpace.NestingSpace, {
+      item: item,
+      spaceForNestingLevel: spaceForNestingLevel
+    }), /*#__PURE__*/_jsx__default["default"](ExpandCaret.ExpandCaret, {
+      item: item
+    }), !disableIcons ? /*#__PURE__*/_jsx__default["default"](Icon.Icon, {
+      item: item
+    }) : null), /*#__PURE__*/_jsx__default["default"](TreeItemText.TreeItemText, {
+      item: item
+    }), rightAddons && /*#__PURE__*/_jsx__default["default"](TreeListItemAddonsWrapper, {}, void 0, typeof rightAddons === 'function' ? rightAddons(item) : rightAddons)]
+  });
 };
-const DragAndDropTreeItem = (0, import_react_sortable_hoc.SortableElement)(TreeItem);
-module.exports = __toCommonJS(TreeItem_exports);
-//# sourceMappingURL=TreeItem.js.map
+const DragAndDropTreeItem = reactSortableHoc.SortableElement(TreeItem);
+
+exports.DragAndDropTreeItem = DragAndDropTreeItem;
+exports.TreeItem = TreeItem;
+exports.TreeListItem = TreeListItem;
+exports.TreeListItemAddonsWrapper = TreeListItemAddonsWrapper;

package/cjs/parts/TreeItemText.js

@@ -1,101 +1,108 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+var React = require('react');
+var Highlighter = require('react-highlight-words');
+var dsTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
+var dsClassnames = require('@elliemae/ds-classnames');
+var ChildrenCountDisplayer = require('./ChildrenCountDisplayer.js');
+var cssClassesConstants = require('../config/cssClassesConstants.js');
+var TreeViewContext = require('../TreeViewContext.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var Highlighter__default = /*#__PURE__*/_interopDefaultLegacy(Highlighter);
+
+const ItemContent = dsClassnames.aggregatedClasses('div')("".concat(cssClassesConstants.treeItemBlockName, "-content"));
+const ItemValue = dsClassnames.aggregatedClasses('span')(cssClassesConstants.treeItemBlockName, 'value'); // const wrapperClassName = `${DSTreeViewPrefix}-${treeItemBlockName}-content`;
+
+const classNameModifierWrapAll = "".concat(cssClassesConstants.DSTreeViewPrefix, "-").concat(cssClassesConstants.treeItemBlockName, "__value--wrap-all");
+const classNameModifierTruncate = "".concat(cssClassesConstants.DSTreeViewPrefix, "-").concat(cssClassesConstants.treeItemBlockName, "__value--truncate"); // eslint-disable-next-line react/prop-types
+
+const CustomHighlight = _ref => {
+  let {
+    children
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"]("mark", {
+    className: "tree-text-highlight",
+    "data-testid": "tree-text-highlight"
+  }, void 0, children);
 };
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var TreeItemText_exports = {};
-__export(TreeItemText_exports, {
-  TreeItemText: () => TreeItemText
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_react_highlight_words = __toESM(require("react-highlight-words"));
-var import_ds_truncated_tooltip_text = __toESM(require("@elliemae/ds-truncated-tooltip-text"));
-var import_ds_classnames = __toESM(require("@elliemae/ds-classnames"));
-var import_ChildrenCountDisplayer = __toESM(require("./ChildrenCountDisplayer"));
-var import_cssClassesConstants = __toESM(require("../config/cssClassesConstants"));
-var import_TreeViewContext = __toESM(require("../TreeViewContext"));
-const ItemContent = (0, import_ds_classnames.aggregatedClasses)("div")(`${import_cssClassesConstants.treeItemBlockName}-content`);
-const ItemValue = (0, import_ds_classnames.aggregatedClasses)("span")(import_cssClassesConstants.treeItemBlockName, "value");
-const classNameModifierWrapAll = `${import_cssClassesConstants.DSTreeViewPrefix}-${import_cssClassesConstants.treeItemBlockName}__value--wrap-all`;
-const classNameModifierTruncate = `${import_cssClassesConstants.DSTreeViewPrefix}-${import_cssClassesConstants.treeItemBlockName}__value--truncate`;
-const CustomHighlight = ({ children }) => /* @__PURE__ */ import_react.default.createElement("mark", {
-  className: "tree-text-highlight",
-  "data-testid": "tree-text-highlight"
-}, children);
+
 function TreeItemText(props) {
-  const { item } = props;
-  const ctx = (0, import_react.useContext)(import_TreeViewContext.default);
+  var _ChildrenCountDisplay, _ChildrenCountDisplay2, _ChildrenCountDisplay3, _ChildrenCountDisplay4;
+
+  const {
+    item
+  } = props;
+  const ctx = React.useContext(TreeViewContext["default"]);
   const {
-    props: { searchQuery, showChildrenAmount, labelOverflow, nameKey }
+    props: {
+      searchQuery,
+      showChildrenAmount,
+      labelOverflow,
+      nameKey
+    }
   } = ctx;
-  const Text = (0, import_react.useMemo)(() => {
+  const Text = React.useMemo(() => {
     const itemLabelText = item[nameKey];
+
     if (searchQuery) {
-      if (labelOverflow === "truncate") {
-        return /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, {
-          value: /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_react_highlight_words.default, {
-            autoEscape: true,
-            highlightTag: CustomHighlight,
-            searchWords: [searchQuery],
-            textToHighlight: itemLabelText
-          }), showChildrenAmount ? /* @__PURE__ */ import_react.default.createElement(import_ChildrenCountDisplayer.ChildrenCountDisplayer, {
-            item
-          }) : null)
+      if (labelOverflow === 'truncate') {
+        return /*#__PURE__*/_jsx__default["default"](dsTruncatedTooltipText.SimpleTruncatedTooltipText, {
+          value: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+            children: [/*#__PURE__*/_jsx__default["default"](Highlighter__default["default"], {
+              autoEscape: true,
+              highlightTag: CustomHighlight,
+              searchWords: [searchQuery],
+              textToHighlight: itemLabelText
+            }), showChildrenAmount ? _ChildrenCountDisplay || (_ChildrenCountDisplay = /*#__PURE__*/_jsx__default["default"](ChildrenCountDisplayer.ChildrenCountDisplayer, {
+              item: item
+            })) : null]
+          })
         });
       }
-      return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_react_highlight_words.default, {
-        autoEscape: true,
-        highlightTag: CustomHighlight,
-        searchWords: [searchQuery],
-        textToHighlight: itemLabelText
-      }), showChildrenAmount ? /* @__PURE__ */ import_react.default.createElement(import_ChildrenCountDisplayer.ChildrenCountDisplayer, {
-        item
-      }) : null);
+
+      return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [/*#__PURE__*/_jsx__default["default"](Highlighter__default["default"], {
+          autoEscape: true,
+          highlightTag: CustomHighlight,
+          searchWords: [searchQuery],
+          textToHighlight: itemLabelText
+        }), showChildrenAmount ? _ChildrenCountDisplay2 || (_ChildrenCountDisplay2 = /*#__PURE__*/_jsx__default["default"](ChildrenCountDisplayer.ChildrenCountDisplayer, {
+          item: item
+        })) : null]
+      });
     }
-    if (labelOverflow === "truncate") {
-      return /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, {
-        value: /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, itemLabelText, showChildrenAmount ? /* @__PURE__ */ import_react.default.createElement(import_ChildrenCountDisplayer.ChildrenCountDisplayer, {
-          item
-        }) : null)
+
+    if (labelOverflow === 'truncate') {
+      return /*#__PURE__*/_jsx__default["default"](dsTruncatedTooltipText.SimpleTruncatedTooltipText, {
+        value: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+          children: [itemLabelText, showChildrenAmount ? _ChildrenCountDisplay3 || (_ChildrenCountDisplay3 = /*#__PURE__*/_jsx__default["default"](ChildrenCountDisplayer.ChildrenCountDisplayer, {
+            item: item
+          })) : null]
+        })
       });
     }
-    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, itemLabelText, showChildrenAmount ? /* @__PURE__ */ import_react.default.createElement(import_ChildrenCountDisplayer.ChildrenCountDisplayer, {
-      item
-    }) : null);
+
+    return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+      children: [itemLabelText, showChildrenAmount ? _ChildrenCountDisplay4 || (_ChildrenCountDisplay4 = /*#__PURE__*/_jsx__default["default"](ChildrenCountDisplayer.ChildrenCountDisplayer, {
+        item: item
+      })) : null]
+    });
   }, [item, searchQuery, nameKey, showChildrenAmount, labelOverflow]);
-  let className = "";
-  if (labelOverflow === "wrap-all")
-    className += `${classNameModifierWrapAll} `;
-  if (labelOverflow === "truncate")
-    className += `${classNameModifierTruncate} `;
-  return /* @__PURE__ */ import_react.default.createElement(ItemContent, {
-    "data-testid": `${import_cssClassesConstants.treeItemBlockName}-content`
-  }, /* @__PURE__ */ import_react.default.createElement(ItemValue, {
-    className
-  }, Text));
+  let className = '';
+  if (labelOverflow === 'wrap-all') className += "".concat(classNameModifierWrapAll, " ");
+  if (labelOverflow === 'truncate') className += "".concat(classNameModifierTruncate, " ");
+  return /*#__PURE__*/_jsx__default["default"](ItemContent, {
+    "data-testid": "".concat(cssClassesConstants.treeItemBlockName, "-content")
+  }, void 0, /*#__PURE__*/_jsx__default["default"](ItemValue, {
+    className: className
+  }, void 0, Text));
 }
-module.exports = __toCommonJS(TreeItemText_exports);
-//# sourceMappingURL=TreeItemText.js.map
+
+exports.TreeItemText = TreeItemText;