@rio-cloud/rio-uikit 0.16.3 → 0.16.4-beta.10

package/lib/es/components/assetTree/Tree.js

@@ -1,683 +1,432 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.excludeFromList = exports["default"] = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _isNil = _interopRequireDefault(require("lodash/fp/isNil"));
-var _isEmpty = _interopRequireDefault(require("lodash/fp/isEmpty"));
-var _isEqual = _interopRequireDefault(require("lodash/fp/isEqual"));
-var _map = _interopRequireDefault(require("lodash/fp/map"));
-var _find = _interopRequireDefault(require("lodash/fp/find"));
-var _orderBy = _interopRequireDefault(require("lodash/fp/orderBy"));
-var _isObject = _interopRequireDefault(require("lodash/fp/isObject"));
-var _debounce = _interopRequireDefault(require("lodash/fp/debounce"));
-var _cond = _interopRequireDefault(require("lodash/fp/cond"));
-var _without = _interopRequireDefault(require("lodash/fp/without"));
-var _countBy = _interopRequireDefault(require("lodash/fp/countBy"));
-var _getOr = _interopRequireDefault(require("lodash/fp/getOr"));
-var _flow = _interopRequireDefault(require("lodash/fp/flow"));
-var _filter = _interopRequireDefault(require("lodash/fp/filter"));
-var _size = _interopRequireDefault(require("lodash/fp/size"));
-var _stubTrue = _interopRequireDefault(require("lodash/fp/stubTrue"));
-var _omit = _interopRequireDefault(require("lodash/fp/omit"));
-var _negate = _interopRequireDefault(require("lodash/fp/negate"));
-var _keys = _interopRequireDefault(require("lodash/fp/keys"));
-var _TreeSearch = _interopRequireDefault(require("./TreeSearch"));
-var _TreeSelectAll = _interopRequireDefault(require("./TreeSelectAll"));
-var _TreeSummary = _interopRequireDefault(require("./TreeSummary"));
-var _TreeNodeContainer = _interopRequireDefault(require("./TreeNodeContainer"));
-var _TreeNode = _interopRequireDefault(require("./TreeNode"));
-var _TreeLeafList = _interopRequireDefault(require("./TreeLeafList"));
-var _TreeNothingFound = _interopRequireDefault(require("./TreeNothingFound"));
-var _TreeOptions = _interopRequireDefault(require("./TreeOptions"));
-var _TreeRoot = _interopRequireDefault(require("./TreeRoot"));
-var _TypeCounter = _interopRequireDefault(require("./TypeCounter"));
-var _searchNormalized = require("../../utils/searchNormalized");
-var _excluded = ["groups", "items", "selectedGroups", "selectedItems", "onSelectionChange", "hasMultiselect", "showRadioButtons", "hideSearch", "hideTreeHead", "summary", "hideSummary", "search", "searchPlaceholder", "onSearchChange", "className", "scrollHeight", "expandedGroups", "onExpandGroupsChange", "showEmptyGroups", "treeOptions"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-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) { (0, _defineProperty2["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; } /* eslint-disable no-use-before-define */
-var SEARCH_DEBOUNCE = 100;
-var otherwise = _stubTrue["default"];
-var notEqual = (0, _negate["default"])(_isEqual["default"]);
-var notEmpty = (0, _negate["default"])(_isEmpty["default"]);
-var Divider = function Divider() {
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: 'TreeSelectAllDivider bg-light width-2 height-15 ' + 'margin-top-2 margin-bottom-0 margin-left-10 margin-right-10'
-  });
-};
-var isNameObject = function isNameObject(item) {
-  return (0, _isObject["default"])(item.name);
-};
-var getFullName = function getFullName(item) {
-  return "".concat(item.name.firstName, " ").concat(item.name.lastName);
-};
-var getName = function getName(item) {
-  return isNameObject(item) ? getFullName(item) : item.name;
-};
-var getLowerCaseName = function getLowerCaseName(item) {
-  return (0, _getOr["default"])('', 'name')(item).toLowerCase();
-};
-var getLowerCaseLastName = function getLowerCaseLastName(item) {
-  return (0, _getOr["default"])('', 'name.lastName')(item).toLowerCase();
-};
-var orderByName = (0, _orderBy["default"])([function (item) {
-  return isNameObject(item) ? getLowerCaseLastName(item) : getLowerCaseName(item);
-}], ['asc']);
-var filterEmptyGroups = (0, _filter["default"])(function (group) {
-  return notEmpty(group.items);
-});
-var filterAssetByType = function filterAssetByType() {
-  var types = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  return (0, _filter["default"])(function (asset) {
-    return types.includes(asset.type);
-  });
-};
-var sortGroupsByName = function sortGroupsByName(groups) {
-  var fixedGroups = {};
-  var sortableGroups = {};
-  (0, _map["default"])(function (group) {
-    if (group.position === 'last') {
-      fixedGroups[group.id] = _objectSpread({}, group);
-    } else {
-      sortableGroups[group.id] = _objectSpread({}, group);
-    }
-  })(groups);
-  var sortedGroups = orderByName(sortableGroups);
-  return (0, _isEmpty["default"])(fixedGroups) ? sortedGroups : _objectSpread(_objectSpread({}, sortedGroups), fixedGroups);
-};
-var sortGroupItemsByName = function sortGroupItemsByName(groups) {
-  var sortedGroups = {};
-  (0, _map["default"])(function (group) {
-    sortedGroups[group.id] = _objectSpread(_objectSpread({}, group), {}, {
-      items: orderByName(group.items)
-    });
-  })(groups);
-  return sortedGroups;
-};
-var getMappedItemsToGroups = function getMappedItemsToGroups(groups, items) {
-  var mappedGroups = {};
-
-  // build an object for listing the groups by id
-  groups.forEach(function (group) {
-    mappedGroups[group.id] = _objectSpread(_objectSpread({}, group), {}, {
-      items: []
-    });
-  });
-  items.forEach(function (item) {
-    // add items to the respective group
-    var groupIds = item.groupIds || [];
-    groupIds.forEach(function (groupId) {
-      var mappedGroup = mappedGroups[groupId];
-      if (mappedGroup) {
-        mappedGroup.items.push(item);
-      }
-    });
-  });
-  return mappedGroups;
-};
-var filterByName = function filterByName(searchValue) {
-  return function (item) {
-    if (searchValue) {
-      return (0, _searchNormalized.searchNormalized)(getName(item), searchValue);
-    }
-    return true;
-  };
-};
-var filterOutByItemId = function filterOutByItemId(list) {
-  return function (item) {
-    return !list.includes(item.id);
-  };
-};
-var containsItemById = function containsItemById(list) {
-  return function (item) {
-    return list.includes(item.id);
-  };
-};
-var getFlatItems = function getFlatItems(items, searchValue) {
-  return (0, _flow["default"])((0, _filter["default"])(filterByName(searchValue)), orderByName)(items);
-};
-var getListIds = function getListIds(list) {
-  return list.map(function (listItem) {
-    return listItem.id;
-  });
-};
-var excludeFromList = function excludeFromList(list, itemId) {
-  return list.filter(function (item) {
-    return item !== itemId;
-  });
-};
-exports.excludeFromList = excludeFromList;
-var getAssetTypeCounts = function getAssetTypeCounts(items) {
-  return (0, _countBy["default"])(function (item) {
-    return item.type;
-  }, items);
-};
-var debounceFn = function debounceFn(fn) {
-  return (0, _debounce["default"])(SEARCH_DEBOUNCE, fn);
-};
-var filterProps = (0, _omit["default"])(['expandedGroups', 'onExpandGroupsChange', 'onSearchChange', 'onSelectionChange', 'treeOptions']);
-var customCompare = function customCompare(prevProps, nextProps) {
-  return (0, _isEqual["default"])(filterProps(prevProps), filterProps(nextProps));
-};
-var assetCounted = function assetCounted(payload) {
-  return {
-    type: 'assetCounted',
-    payload: payload
-  };
-};
-var allCheckedChanged = function allCheckedChanged(payload) {
-  return {
-    type: 'allCheckedChanged',
-    payload: payload
-  };
-};
-var searchValueChanged = function searchValueChanged(payload) {
-  return {
-    type: 'searchValueChanged',
-    payload: payload
-  };
-};
-var flatItemsChanged = function flatItemsChanged(payload) {
-  return {
-    type: 'flatItemsChanged',
-    payload: payload
-  };
-};
-var groupedItemsChanged = function groupedItemsChanged(payload) {
-  return {
-    type: 'groupedItemsChanged',
-    payload: payload
-  };
-};
-var typeFilterChanged = function typeFilterChanged(payload) {
-  return {
-    type: 'typeFilterChanged',
-    payload: payload
-  };
-};
-var visibleTypeCountersChanged = function visibleTypeCountersChanged(payload) {
-  return {
-    type: 'visibleTypeCountersChanged',
-    payload: payload
-  };
-};
-var emptyGroupsChanged = function emptyGroupsChanged(payload) {
-  return {
-    type: 'emptyGroupsChanged',
-    payload: payload
-  };
-};
-var treeReducer = function treeReducer(state, action) {
-  switch (action.type) {
-    case 'assetCounted':
-      return _objectSpread(_objectSpread({}, state), {}, {
-        assetCounts: action.payload
-      });
-    case 'allCheckedChanged':
-      return _objectSpread(_objectSpread({}, state), {}, {
-        allChecked: action.payload
-      });
-    case 'searchValueChanged':
-      return _objectSpread(_objectSpread({}, state), {}, {
-        searchValue: action.payload,
-        allChecked: false
-      });
-    case 'flatItemsChanged':
-      return _objectSpread(_objectSpread({}, state), {}, {
-        flatItems: action.payload
-      });
-    case 'groupedItemsChanged':
-      return _objectSpread(_objectSpread({}, state), {}, {
-        groupedItems: action.payload
-      });
-    case 'typeFilterChanged':
-      return _objectSpread(_objectSpread({}, state), {}, {
-        typeFilter: action.payload
-      });
-    case 'visibleTypeCountersChanged':
-      return _objectSpread(_objectSpread({}, state), {}, {
-        visibleTypeCounters: action.payload
-      });
-    case 'emptyGroupsChanged':
-      return _objectSpread(_objectSpread({}, state), {}, {
-        emptyGroups: action.payload
-      });
-    default:
-      throw new Error();
-  }
-};
-var Tree = /*#__PURE__*/_react["default"].memo(function (props) {
-  var groups = props.groups,
-    items = props.items,
-    selectedGroups = props.selectedGroups,
-    selectedItems = props.selectedItems,
-    onSelectionChange = props.onSelectionChange,
-    hasMultiselect = props.hasMultiselect,
-    showRadioButtons = props.showRadioButtons,
-    hideSearch = props.hideSearch,
-    hideTreeHead = props.hideTreeHead,
-    summary = props.summary,
-    hideSummary = props.hideSummary,
-    search = props.search,
-    searchPlaceholder = props.searchPlaceholder,
-    onSearchChange = props.onSearchChange,
-    className = props.className,
-    scrollHeight = props.scrollHeight,
-    expandedGroups = props.expandedGroups,
-    onExpandGroupsChange = props.onExpandGroupsChange,
-    showEmptyGroups = props.showEmptyGroups,
-    treeOptions = props.treeOptions,
-    remainingProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
-  var _useReducer = (0, _react.useReducer)(treeReducer, {
-      groupedItems: [],
-      flatItems: [],
-      allChecked: false,
-      searchValue: '',
-      assetCounts: {},
-      typeFilter: [],
-      visibleTypeCounters: [],
-      emptyGroups: []
-    }),
-    _useReducer2 = (0, _slicedToArray2["default"])(_useReducer, 2),
-    state = _useReducer2[0],
-    dispatch = _useReducer2[1];
-  var treeRef = (0, _react.useRef)();
-  var previousItems = (0, _react.useRef)();
-  var previousGroups = (0, _react.useRef)();
-  var previousSearchValue = (0, _react.useRef)('');
-  var internalExpandedGroups = (0, _react.useRef)(expandedGroups);
-  (0, _react.useEffect)(function () {
-    // Update Tree when items or groups have changed
-    if (notEqual(previousItems.current, items) || notEqual(previousGroups.current, groups)) {
-      previousItems.current = items;
-      previousGroups.current = groups;
-      var typeCounts = getAssetTypeCounts(items);
-      dispatch(assetCounted(typeCounts));
-      var allChecked = checkAllSelected({
-        items: items,
-        groups: groups,
-        selectedItems: selectedItems,
-        selectedGroups: selectedGroups
-      }, state.flatItems);
-      dispatch(allCheckedChanged(allChecked));
-
-      // Get the distinct asset types from the asset list that is passed into the component
-      // to know which asset type counter to render
-      dispatch(visibleTypeCountersChanged(Object.keys(typeCounts)));
-      makeTree(groups, items);
-    }
-  }, [items, groups]);
-  var debouncedMakeTree = debounceFn(function (losGroupos, losItems) {
-    return makeTree(losGroupos, losItems);
-  });
-  (0, _react.useEffect)(function () {
-    // To prevent executing the effect on first render, use a ref to check previous render values
-    if (notEqual(previousSearchValue.current, state.searchValue)) {
-      debouncedMakeTree(groups, items);
-      previousSearchValue.current = state.searchValue;
-    }
-  }, [state.searchValue]);
-  (0, _react.useEffect)(function () {
-    return makeTree(groups, items);
-  }, [state.typeFilter]);
-
-  // Update tree when empty groups are toggled from outside
-  (0, _react.useEffect)(function () {
-    return makeTree(groups, items);
-  }, [showEmptyGroups]);
-
-  // Update "select all" state from outside when groups are selected outside programatically
-  // without using the "select all" checkbox
-  (0, _react.useEffect)(function () {
-    var numOfAllGroups = (0, _size["default"])(groups);
-    var numOfSelectedGroups = (0, _size["default"])(selectedGroups);
-    if (numOfSelectedGroups !== numOfAllGroups && state.allChecked) {
-      dispatch(allCheckedChanged(false));
-    } else if (numOfSelectedGroups === numOfAllGroups && !state.allChecked) {
-      dispatch(allCheckedChanged(true));
-    }
-  }, [selectedGroups]);
-  var checkAllSelected = function checkAllSelected(updatedProps, flatItems) {
-    var updatedItems = updatedProps.items,
-      updatedGroups = updatedProps.groups,
-      updatedSelectedItems = updatedProps.selectedItems,
-      updatedSelectedGroups = updatedProps.selectedGroups;
-    if (!hasGroups() && (0, _isEmpty["default"])(updatedSelectedItems) || hasNoSearchAndGroups() && (0, _isEmpty["default"])(updatedSelectedGroups) || hasSearchAndGroups() && (0, _isEmpty["default"])(updatedSelectedItems)) {
-      return false;
-    }
-    if (hasNoSearchAndGroups()) {
-      var unselectedGroups = (0, _filter["default"])(filterOutByItemId(updatedSelectedGroups))(updatedGroups);
-      return (0, _isEmpty["default"])(unselectedGroups);
-    } else if (hasSearchAndGroups()) {
-      var unselectedSearchItems = (0, _filter["default"])(filterOutByItemId(updatedSelectedItems))(flatItems);
-      return (0, _isEmpty["default"])(unselectedSearchItems);
-    }
-    var unselectedItems = updatedItems.filter(filterOutByItemId(updatedSelectedItems));
-    return (0, _isEmpty["default"])(unselectedItems);
-  };
-  var handleToggleNode = function handleToggleNode(nodeId) {
-    var newExpandedNodes = internalExpandedGroups.current.includes(nodeId) ? internalExpandedGroups.current.filter(function (item) {
-      return item !== nodeId;
-    }) : [].concat((0, _toConsumableArray2["default"])(internalExpandedGroups.current), [nodeId]);
-
-    // Performance improvement to skip on render cycle and change "open" class directly
-    if (internalExpandedGroups.current.includes(nodeId)) {
-      getNodeContainerDomElementById(nodeId).classList.remove('open');
-    } else {
-      getNodeContainerDomElementById(nodeId).classList.add('open');
-    }
-    internalExpandedGroups.current = newExpandedNodes;
-    onExpandGroupsChange(newExpandedNodes);
-  };
-  var getNodeContainerDomElementById = function getNodeContainerDomElementById(nodeId) {
-    return treeRef.current.querySelector(".TreeNodeContainer[data-id=\"".concat(nodeId, "\"]"));
-  };
-  var selectAllSearchResultItems = function selectAllSearchResultItems(shouldSelect) {
-    return selectAllFlatItems(shouldSelect);
-  };
-  var handeSelectAll = function handeSelectAll(shouldSelect, isIndeterminate) {
-    var shouldSelectAll = shouldSelect && !isIndeterminate;
-    dispatch(allCheckedChanged(shouldSelectAll));
-    (0, _cond["default"])([[hasNoSearchAndGroups, function () {
-      return selectAllGroups(shouldSelectAll);
-    }], [hasSearchAndGroups, function () {
-      return selectAllSearchResultItems(shouldSelectAll);
-    }], [otherwise, function () {
-      return selectAllFlatItems(shouldSelectAll);
-    }]])();
-  };
-  var selectAllGroups = function selectAllGroups(shouldSelect) {
-    return respondSelection([], shouldSelect ? getListIds(groups) : []);
-  };
-  var selectAllFlatItems = function selectAllFlatItems(shouldSelect) {
-    return respondSelection(shouldSelect ? getListIds(state.flatItems) : [], []);
-  };
-  var respondSelection = function respondSelection(updatedSelectedItems, updatedSelectedGroups) {
-    onSelectionChange({
-      items: updatedSelectedItems,
-      groups: updatedSelectedGroups
-    });
-  };
-  var handleGroupSelection = function handleGroupSelection(group, isIndeterminate) {
-    var groupId = group.id;
-    var isSelected = selectedGroups.includes(groupId);
-    var shouldSelectGroup = !isSelected && !isIndeterminate;
-
-    // handle group selection
-    var newSelectedGroups = shouldSelectGroup ? [].concat((0, _toConsumableArray2["default"])(selectedGroups), [groupId]) : excludeFromList(selectedGroups, groupId);
-
-    // deselect all items of a node since they will be selected inherently via the group itself
-    var itemsInGroup = (0, _find["default"])(function (entry) {
-      return entry.id === groupId;
-    })(state.groupedItems);
-    var itemIdsOfGroup = (0, _map["default"])(function (item) {
-      return item.id;
-    })(itemsInGroup.items);
-    var updatedSelectedItems = (0, _without["default"])(itemIdsOfGroup, selectedItems);
-
-    // check if all groups are selected to change the state of TreeSelectAll
-    var groupAmount = groups.length;
-    var emptyGroupAmount = showEmptyGroups ? 0 : state.emptyGroups.length;
-    var totalGroupAmount = groupAmount - emptyGroupAmount;
-    var areAllGroupsChecked = totalGroupAmount === newSelectedGroups.length;
-    dispatch(allCheckedChanged(areAllGroupsChecked));
-    respondSelection(updatedSelectedItems, newSelectedGroups);
-  };
-  var handleSearchChange = function handleSearchChange(updatedSearchValue) {
-    onSearchChange(updatedSearchValue);
-    dispatch(searchValueChanged(updatedSearchValue));
-  };
-  var hasGroups = function hasGroups() {
-    return groups && notEmpty(groups);
-  };
-  var hasSearchAndGroups = function hasSearchAndGroups() {
-    return hasInternalSearchValue() && hasGroups();
-  };
-  var hasNoSearchAndGroups = function hasNoSearchAndGroups() {
-    return !hasInternalSearchValue() && hasGroups();
-  };
-  var setFlatItemList = function setFlatItemList(updtedItems, searchValue) {
-    var flatItems = getFlatItems(updtedItems, searchValue);
-    dispatch(assetCounted(getAssetTypeCounts(flatItems)));
-    dispatch(flatItemsChanged(flatItems));
-  };
-  var setGroupedItemList = function setGroupedItemList(groupsToProcess, itemsToProcess, considerEmptyGroups) {
-    // Map items to groups with filtered items
-    var mappedItemsToGroups = getMappedItemsToGroups(groupsToProcess, itemsToProcess);
-    var newGroupedItems = (0, _flow["default"])(sortGroupsByName, sortGroupItemsByName)(mappedItemsToGroups);
-    var groupedItems = considerEmptyGroups ? newGroupedItems : filterEmptyGroups(newGroupedItems);
-
-    // Keep the empty groups in memory for later access in select all, without re-iterating on every
-    // group selection
-    var emptyGroups = (0, _filter["default"])(function (group) {
-      return (0, _isEmpty["default"])(group.items);
-    })(newGroupedItems);
-    dispatch(emptyGroupsChanged(emptyGroups));
-    dispatch(assetCounted(getAssetTypeCounts(items)));
-    dispatch(groupedItemsChanged(groupedItems));
-  };
-  var makeTree = function makeTree(updatedGroups, updatedItems) {
-    var internalSearchValue = state.searchValue;
-    var internalTypeFilter = state.typeFilter;
-    var groupsToProcess = updatedGroups;
-    var itemsToProcess = updatedItems;
-    var hasGroupList = function hasGroupList(groupList) {
-      return groupList && notEmpty(groupList);
-    };
-    var hasNoInternalSearchAndGroups = function hasNoInternalSearchAndGroups() {
-      return (0, _isEmpty["default"])(internalSearchValue) && hasGroupList(groupsToProcess);
-    };
-    var hasInternalSearchAndGroups = function hasInternalSearchAndGroups() {
-      return notEmpty(internalSearchValue) && hasGroupList(groupsToProcess);
-    };
-    var filteredItems = (0, _isEmpty["default"])(internalTypeFilter) ? itemsToProcess : filterAssetByType(internalTypeFilter)(itemsToProcess);
-    var setGroupedItems = function setGroupedItems() {
-      return setGroupedItemList(groupsToProcess, filteredItems, showEmptyGroups);
-    };
-    var setFlatItems = function setFlatItems() {
-      return setFlatItemList(filteredItems, internalSearchValue);
-    };
-    (0, _cond["default"])([[hasNoInternalSearchAndGroups, setGroupedItems], [hasInternalSearchAndGroups, setFlatItems], [otherwise, setFlatItems]])();
-  };
-  var renderTree = function renderTree() {
-    var groupedItems = state.groupedItems;
-    if ((0, _isEmpty["default"])(groupedItems)) {
-      return /*#__PURE__*/_react["default"].createElement(_TreeNothingFound["default"], null);
-    }
-    var result = (0, _map["default"])(function (group) {
-      var groupId = group.id;
-      var groupItems = group.items;
-      var isOpen = expandedGroups.includes(groupId);
-      var numSelectedGroupItems = (0, _filter["default"])(containsItemById(selectedItems))(groupItems).length;
-      var isGroupSelected = selectedGroups.includes(groupId);
-      var isIndeterminate = !isGroupSelected && numSelectedGroupItems > 0;
-      return /*#__PURE__*/_react["default"].createElement(_TreeNodeContainer["default"], {
-        key: groupId,
-        groupId: groupId,
-        isOpen: isOpen
-      }, /*#__PURE__*/_react["default"].createElement(_TreeNode["default"], {
-        node: group,
-        hasMultiselect: hasMultiselect,
-        onToggleNode: handleToggleNode,
-        onSelect: handleGroupSelection,
-        isSelected: isGroupSelected,
-        isIndeterminate: isIndeterminate
-      }), /*#__PURE__*/_react["default"].createElement(_TreeLeafList["default"], {
-        leafList: groupItems,
-        hasMultiselect: hasMultiselect,
-        showRadioButtons: showRadioButtons,
-        selectedItems: selectedItems,
-        selectedGroups: selectedGroups,
-        onSelectionChange: respondSelection
-      }));
-    })(groupedItems);
-    return result;
-  };
-  var renderFlatList = function renderFlatList() {
-    var flatItems = state.flatItems;
-    var hasLeafs = (0, _isEmpty["default"])(flatItems);
-    var getLeafs = function getLeafs() {
-      return /*#__PURE__*/_react["default"].createElement(_TreeLeafList["default"], {
-        leafList: flatItems,
-        hasMultiselect: hasMultiselect,
-        showRadioButtons: showRadioButtons,
-        selectedItems: selectedItems,
-        selectedGroups: selectedGroups,
-        onSelectionChange: respondSelection
-      });
-    };
-    return /*#__PURE__*/_react["default"].createElement(_TreeNodeContainer["default"], {
-      isOpen: true
-    }, hasLeafs ? /*#__PURE__*/_react["default"].createElement(_TreeNothingFound["default"], null) : getLeafs());
-  };
-  var hasExternalGroups = notEmpty(groups);
-  var hasInternalSearchValue = function hasInternalSearchValue() {
-    return notEmpty(state.searchValue);
-  };
-  var hasSelectedAllItems = function hasSelectedAllItems() {
-    return (0, _isEqual["default"])((0, _size["default"])(selectedItems), (0, _size["default"])(state.flatItems));
-  };
-  var hasPartialySelectedItems = function hasPartialySelectedItems() {
-    return notEmpty(selectedItems) && !hasSelectedAllItems();
-  };
-  var hasSelectedAllGroups = function hasSelectedAllGroups() {
-    var emptyGroupAmount = showEmptyGroups ? 0 : state.emptyGroups.length;
-    return (0, _isEqual["default"])((0, _size["default"])(selectedGroups), (0, _size["default"])(groups) - emptyGroupAmount);
-  };
-  var hasPartialySelectedGroups = function hasPartialySelectedGroups() {
-    return hasExternalGroups && notEmpty(selectedGroups) && !hasSelectedAllGroups();
-  };
-  var hasSearchAndNoItems = hasInternalSearchValue() && (0, _isEmpty["default"])(state.flatItems);
-  var hasSearchAndNoGroups = hasInternalSearchValue() && (0, _isEmpty["default"])(state.groupedItems) && hasExternalGroups;
-  var hideSelectAll = hasSearchAndNoItems || hasSearchAndNoGroups;
-  var isIndeterminate = hasPartialySelectedGroups() || hasPartialySelectedItems();
-  var treeClassNames = (0, _classnames["default"])('Tree', className);
-  var treeHeadClasses = (0, _classnames["default"])('TreeHead', 'display-flex align-items-center', 'padding-15');
-  var shouldRenderTree = function shouldRenderTree() {
-    return hasGroups() && !hasInternalSearchValue();
-  };
-  var content = (0, _cond["default"])([[shouldRenderTree, function () {
-    return renderTree();
-  }], [otherwise, function () {
-    return renderFlatList();
-  }]])();
-  var handleFilterByType = function handleFilterByType(type) {
-    var currentTypeFilter = new Set(state.typeFilter);
-    if (currentTypeFilter.has(type)) {
-      currentTypeFilter["delete"](type);
-    } else {
-      currentTypeFilter.add(type);
-    }
-    dispatch(typeFilterChanged((0, _toConsumableArray2["default"])(currentTypeFilter)));
-  };
-  var isClickable = (0, _size["default"])((0, _keys["default"])(state.assetCounts)) > 1;
-  var isFilterActive = notEmpty(state.typeFilter);
-  var showTreeHead = !hideTreeHead;
-  var showSelectAll = !hideSelectAll;
-  var showSearch = !hideSearch;
-  var showSummary = !hideSummary;
-  var hasCustomSearch = !(0, _isNil["default"])(search);
-  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, remainingProps, {
-    className: treeClassNames,
-    ref: treeRef
-  }), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "TreeHeader"
-  }, showSearch && !hasCustomSearch && /*#__PURE__*/_react["default"].createElement(_TreeSearch["default"], {
-    value: state.searchValue,
-    onChange: handleSearchChange,
-    placeholder: searchPlaceholder
-  }), hasCustomSearch && search, showTreeHead && /*#__PURE__*/_react["default"].createElement("div", {
-    className: treeHeadClasses
-  }, showSelectAll && /*#__PURE__*/_react["default"].createElement(_TreeSelectAll["default"], {
-    isChecked: state.allChecked,
-    isEnabled: hasMultiselect,
-    isIndeterminate: isIndeterminate,
-    onSelect: handeSelectAll
-  }), showSelectAll && hasMultiselect && showSummary && /*#__PURE__*/_react["default"].createElement(Divider, null), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "display-flex justify-content-between align-items-center width-100pct"
-  }, showSummary ? summary || /*#__PURE__*/_react["default"].createElement(_TreeSummary["default"], null, (0, _map["default"])(function (typeCounter) {
-    return /*#__PURE__*/_react["default"].createElement(_TypeCounter["default"], {
-      key: typeCounter,
-      type: typeCounter,
-      icon: "".concat(typeCounter),
-      value: state.assetCounts[typeCounter],
-      onClick: handleFilterByType,
-      isActive: state.typeFilter.includes(typeCounter),
-      hasFilter: isFilterActive,
-      enableActivity: isClickable
-    });
-  })(state.visibleTypeCounters)) : null, /*#__PURE__*/_react["default"].createElement(_TreeOptions["default"], {
-    treeOptions: treeOptions
-  })))), /*#__PURE__*/_react["default"].createElement(_TreeRoot["default"], {
-    maxHeight: scrollHeight
-  }, content));
-}, customCompare);
-Tree.displayName = 'Tree';
-Tree.defaultProps = {
-  hasMultiselect: true,
-  showRadioButtons: false,
-  hideSearch: false,
-  hideSummary: false,
-  showEmptyGroups: true,
-  selectedGroups: [],
-  selectedItems: [],
-  onSelectionChange: function onSelectionChange() {},
-  onExpandGroupsChange: function onExpandGroupsChange() {},
-  onSearchChange: function onSearchChange() {},
-  searchPlaceholder: 'Type here to filter by name',
-  treeOptions: [],
-  groups: []
-};
-Tree.propTypes = {
-  groups: _propTypes["default"].arrayOf(_propTypes["default"].shape({
-    id: _propTypes["default"].string.isRequired,
-    name: _propTypes["default"].string.isRequired,
-    icon: _propTypes["default"].string,
-    className: _propTypes["default"].string
-  })),
-  items: _propTypes["default"].arrayOf(_propTypes["default"].shape({
-    id: _propTypes["default"].string.isRequired,
-    name: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].shape({
-      firstName: _propTypes["default"].string,
-      lastName: _propTypes["default"].string.isRequired
-    })]).isRequired,
-    info: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node]),
-    type: _propTypes["default"].string.isRequired,
-    groupIds: _propTypes["default"].arrayOf(_propTypes["default"].string),
-    className: _propTypes["default"].string
-  })),
-  selectedGroups: _propTypes["default"].arrayOf(_propTypes["default"].string),
-  selectedItems: _propTypes["default"].arrayOf(_propTypes["default"].string),
-  onSelectionChange: _propTypes["default"].func,
-  hasMultiselect: _propTypes["default"].bool,
-  showRadioButtons: _propTypes["default"].bool,
-  hideSearch: _propTypes["default"].bool,
-  summary: _propTypes["default"].node,
-  hideSummary: _propTypes["default"].bool,
-  hideTreeHead: _propTypes["default"].bool,
-  // This defines a custom search component.
-  search: _propTypes["default"].node,
-  searchPlaceholder: _propTypes["default"].string,
-  onSearchChange: _propTypes["default"].func,
-  className: _propTypes["default"].string,
-  scrollHeight: _propTypes["default"].number,
-  expandedGroups: _propTypes["default"].arrayOf(_propTypes["default"].string),
-  onExpandGroupsChange: _propTypes["default"].func,
-  showEmptyGroups: _propTypes["default"].bool,
-  treeOptions: _propTypes["default"].arrayOf(_propTypes["default"].node)
-};
-var _default = Tree;
-exports["default"] = _default;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.excludeFromList = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+/* eslint-disable no-use-before-define */
+const react_1 = tslib_1.__importStar(require("react"));
+const prop_types_1 = tslib_1.__importDefault(require("prop-types"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const isNil_1 = tslib_1.__importDefault(require("lodash/fp/isNil"));
+const isEmpty_1 = tslib_1.__importDefault(require("lodash/fp/isEmpty"));
+const isEqual_1 = tslib_1.__importDefault(require("lodash/fp/isEqual"));
+const map_1 = tslib_1.__importDefault(require("lodash/fp/map"));
+const find_1 = tslib_1.__importDefault(require("lodash/fp/find"));
+const orderBy_1 = tslib_1.__importDefault(require("lodash/fp/orderBy"));
+const isObject_1 = tslib_1.__importDefault(require("lodash/fp/isObject"));
+const debounce_1 = tslib_1.__importDefault(require("lodash/fp/debounce"));
+const cond_1 = tslib_1.__importDefault(require("lodash/fp/cond"));
+const without_1 = tslib_1.__importDefault(require("lodash/fp/without"));
+const countBy_1 = tslib_1.__importDefault(require("lodash/fp/countBy"));
+const getOr_1 = tslib_1.__importDefault(require("lodash/fp/getOr"));
+const flow_1 = tslib_1.__importDefault(require("lodash/fp/flow"));
+const filter_1 = tslib_1.__importDefault(require("lodash/fp/filter"));
+const size_1 = tslib_1.__importDefault(require("lodash/fp/size"));
+const stubTrue_1 = tslib_1.__importDefault(require("lodash/fp/stubTrue"));
+const omit_1 = tslib_1.__importDefault(require("lodash/fp/omit"));
+const negate_1 = tslib_1.__importDefault(require("lodash/fp/negate"));
+const keys_1 = tslib_1.__importDefault(require("lodash/fp/keys"));
+const TreeSearch_1 = tslib_1.__importDefault(require("./TreeSearch"));
+const TreeSelectAll_1 = tslib_1.__importDefault(require("./TreeSelectAll"));
+const TreeSummary_1 = tslib_1.__importDefault(require("./TreeSummary"));
+const TreeNodeContainer_1 = tslib_1.__importDefault(require("./TreeNodeContainer"));
+const TreeNode_1 = tslib_1.__importDefault(require("./TreeNode"));
+const TreeLeafList_1 = tslib_1.__importDefault(require("./TreeLeafList"));
+const TreeNothingFound_1 = tslib_1.__importDefault(require("./TreeNothingFound"));
+const TreeOptions_1 = tslib_1.__importDefault(require("./TreeOptions"));
+const TreeRoot_1 = tslib_1.__importDefault(require("./TreeRoot"));
+const TypeCounter_1 = tslib_1.__importDefault(require("./TypeCounter"));
+const searchNormalized_1 = require("../../utils/searchNormalized");
+const SEARCH_DEBOUNCE = 100;
+const otherwise = stubTrue_1.default;
+const notEqual = (0, negate_1.default)(isEqual_1.default);
+const notEmpty = (0, negate_1.default)(isEmpty_1.default);
+const Divider = () => (0, jsx_runtime_1.jsx)("div", { className: 'TreeSelectDivider bg-light padding-left-1 height-10 margin-top-2 margin-x-10' });
+const isNameObject = item => (0, isObject_1.default)(item.name);
+const getFullName = item => `${item.name.firstName} ${item.name.lastName}`;
+const getName = item => (isNameObject(item) ? getFullName(item) : item.name);
+const getLowerCaseName = item => (0, getOr_1.default)('', 'name')(item).toLowerCase();
+const getLowerCaseLastName = item => (0, getOr_1.default)('', 'name.lastName')(item).toLowerCase();
+const orderByName = (0, orderBy_1.default)([item => (isNameObject(item) ? getLowerCaseLastName(item) : getLowerCaseName(item))], ['asc']);
+const filterEmptyGroups = (0, filter_1.default)(group => notEmpty(group.items));
+const filterAssetByType = (types = []) => (0, filter_1.default)(asset => types.includes(asset.type));
+const sortGroupsByName = groups => {
+    const fixedGroups = {};
+    const sortableGroups = {};
+    (0, map_1.default)(group => {
+        if (group.position === 'last') {
+            fixedGroups[group.id] = Object.assign({}, group);
+        }
+        else {
+            sortableGroups[group.id] = Object.assign({}, group);
+        }
+    })(groups);
+    const sortedGroups = orderByName(sortableGroups);
+    return (0, isEmpty_1.default)(fixedGroups) ? sortedGroups : Object.assign(Object.assign({}, sortedGroups), fixedGroups);
+};
+const sortGroupItemsByName = groups => {
+    const sortedGroups = {};
+    (0, map_1.default)(group => {
+        sortedGroups[group.id] = Object.assign(Object.assign({}, group), { items: orderByName(group.items) });
+    })(groups);
+    return sortedGroups;
+};
+const getMappedItemsToGroups = (groups, items) => {
+    const mappedGroups = {};
+    // build an object for listing the groups by id
+    groups.forEach(group => {
+        mappedGroups[group.id] = Object.assign(Object.assign({}, group), { items: [] });
+    });
+    items.forEach(item => {
+        // add items to the respective group
+        const groupIds = item.groupIds || [];
+        groupIds.forEach(groupId => {
+            const mappedGroup = mappedGroups[groupId];
+            if (mappedGroup) {
+                mappedGroup.items.push(item);
+            }
+        });
+    });
+    return mappedGroups;
+};
+const filterByName = searchValue => item => {
+    if (searchValue) {
+        return (0, searchNormalized_1.searchNormalized)(getName(item), searchValue);
+    }
+    return true;
+};
+const filterOutByItemId = list => item => !list.includes(item.id);
+const containsItemById = list => item => list.includes(item.id);
+const getFlatItems = (items, searchValue) => (0, flow_1.default)((0, filter_1.default)(filterByName(searchValue)), orderByName)(items);
+const getListIds = list => list.map(listItem => listItem.id);
+const excludeFromList = (list, itemId) => list.filter(item => item !== itemId);
+exports.excludeFromList = excludeFromList;
+const getAssetTypeCounts = items => (0, countBy_1.default)(item => item.type, items);
+const debounceFn = fn => (0, debounce_1.default)(SEARCH_DEBOUNCE, fn);
+const filterProps = (0, omit_1.default)([
+    'expandedGroups',
+    'onExpandGroupsChange',
+    'onSearchChange',
+    'onSelectionChange',
+    'treeOptions',
+]);
+const customCompare = (prevProps, nextProps) => (0, isEqual_1.default)(filterProps(prevProps), filterProps(nextProps));
+const assetCounted = payload => ({ type: 'assetCounted', payload });
+const allCheckedChanged = payload => ({ type: 'allCheckedChanged', payload });
+const searchValueChanged = payload => ({ type: 'searchValueChanged', payload });
+const flatItemsChanged = payload => ({ type: 'flatItemsChanged', payload });
+const groupedItemsChanged = payload => ({ type: 'groupedItemsChanged', payload });
+const typeFilterChanged = payload => ({ type: 'typeFilterChanged', payload });
+const visibleTypeCountersChanged = payload => ({ type: 'visibleTypeCountersChanged', payload });
+const emptyGroupsChanged = payload => ({ type: 'emptyGroupsChanged', payload });
+const treeReducer = (state, action) => {
+    switch (action.type) {
+        case 'assetCounted':
+            return Object.assign(Object.assign({}, state), { assetCounts: action.payload });
+        case 'allCheckedChanged':
+            return Object.assign(Object.assign({}, state), { allChecked: action.payload });
+        case 'searchValueChanged':
+            return Object.assign(Object.assign({}, state), { searchValue: action.payload, allChecked: false });
+        case 'flatItemsChanged':
+            return Object.assign(Object.assign({}, state), { flatItems: action.payload });
+        case 'groupedItemsChanged':
+            return Object.assign(Object.assign({}, state), { groupedItems: action.payload });
+        case 'typeFilterChanged':
+            return Object.assign(Object.assign({}, state), { typeFilter: action.payload });
+        case 'visibleTypeCountersChanged':
+            return Object.assign(Object.assign({}, state), { visibleTypeCounters: action.payload });
+        case 'emptyGroupsChanged':
+            return Object.assign(Object.assign({}, state), { emptyGroups: action.payload });
+        default:
+            throw new Error();
+    }
+};
+const Tree = react_1.default.memo(props => {
+    const { groups, items, selectedGroups, selectedItems, onSelectionChange, hasMultiselect, showRadioButtons, hideSearch, hideTreeHead, summary, hideSummary, search, searchPlaceholder, onSearchChange, className, scrollHeight, expandedGroups, onExpandGroupsChange, showEmptyGroups, treeOptions } = props, remainingProps = tslib_1.__rest(props, ["groups", "items", "selectedGroups", "selectedItems", "onSelectionChange", "hasMultiselect", "showRadioButtons", "hideSearch", "hideTreeHead", "summary", "hideSummary", "search", "searchPlaceholder", "onSearchChange", "className", "scrollHeight", "expandedGroups", "onExpandGroupsChange", "showEmptyGroups", "treeOptions"]);
+    const [state, dispatch] = (0, react_1.useReducer)(treeReducer, {
+        groupedItems: [],
+        flatItems: [],
+        allChecked: false,
+        searchValue: '',
+        assetCounts: {},
+        typeFilter: [],
+        visibleTypeCounters: [],
+        emptyGroups: [],
+    });
+    const treeRef = (0, react_1.useRef)();
+    const previousItems = (0, react_1.useRef)();
+    const previousGroups = (0, react_1.useRef)();
+    const previousSearchValue = (0, react_1.useRef)('');
+    const internalExpandedGroups = (0, react_1.useRef)(expandedGroups);
+    (0, react_1.useEffect)(() => {
+        // Update Tree when items or groups have changed
+        if (notEqual(previousItems.current, items) || notEqual(previousGroups.current, groups)) {
+            previousItems.current = items;
+            previousGroups.current = groups;
+            const typeCounts = getAssetTypeCounts(items);
+            dispatch(assetCounted(typeCounts));
+            const allChecked = checkAllSelected({ items, groups, selectedItems, selectedGroups }, state.flatItems);
+            dispatch(allCheckedChanged(allChecked));
+            // Get the distinct asset types from the asset list that is passed into the component
+            // to know which asset type counter to render
+            dispatch(visibleTypeCountersChanged(Object.keys(typeCounts)));
+            makeTree(groups, items);
+        }
+    }, [items, groups]);
+    const debouncedMakeTree = debounceFn((losGroupos, losItems) => makeTree(losGroupos, losItems));
+    (0, react_1.useEffect)(() => {
+        // To prevent executing the effect on first render, use a ref to check previous render values
+        if (notEqual(previousSearchValue.current, state.searchValue)) {
+            debouncedMakeTree(groups, items);
+            previousSearchValue.current = state.searchValue;
+        }
+    }, [state.searchValue]);
+    (0, react_1.useEffect)(() => makeTree(groups, items), [state.typeFilter]);
+    // Update tree when empty groups are toggled from outside
+    (0, react_1.useEffect)(() => makeTree(groups, items), [showEmptyGroups]);
+    // Update "select all" state from outside when groups are selected outside programatically
+    // without using the "select all" checkbox
+    (0, react_1.useEffect)(() => {
+        const numOfAllGroups = (0, size_1.default)(groups);
+        const numOfSelectedGroups = (0, size_1.default)(selectedGroups);
+        if (numOfSelectedGroups !== numOfAllGroups && state.allChecked) {
+            dispatch(allCheckedChanged(false));
+        }
+        else if (numOfSelectedGroups === numOfAllGroups && !state.allChecked) {
+            dispatch(allCheckedChanged(true));
+        }
+    }, [selectedGroups]);
+    const checkAllSelected = (updatedProps, flatItems) => {
+        const { items: updatedItems, groups: updatedGroups, selectedItems: updatedSelectedItems, selectedGroups: updatedSelectedGroups, } = updatedProps;
+        if ((!hasGroups() && (0, isEmpty_1.default)(updatedSelectedItems)) ||
+            (hasNoSearchAndGroups() && (0, isEmpty_1.default)(updatedSelectedGroups)) ||
+            (hasSearchAndGroups() && (0, isEmpty_1.default)(updatedSelectedItems))) {
+            return false;
+        }
+        if (hasNoSearchAndGroups()) {
+            const unselectedGroups = (0, filter_1.default)(filterOutByItemId(updatedSelectedGroups))(updatedGroups);
+            return (0, isEmpty_1.default)(unselectedGroups);
+        }
+        else if (hasSearchAndGroups()) {
+            const unselectedSearchItems = (0, filter_1.default)(filterOutByItemId(updatedSelectedItems))(flatItems);
+            return (0, isEmpty_1.default)(unselectedSearchItems);
+        }
+        const unselectedItems = updatedItems.filter(filterOutByItemId(updatedSelectedItems));
+        return (0, isEmpty_1.default)(unselectedItems);
+    };
+    const handleToggleNode = nodeId => {
+        const newExpandedNodes = internalExpandedGroups.current.includes(nodeId)
+            ? internalExpandedGroups.current.filter(item => item !== nodeId)
+            : [...internalExpandedGroups.current, nodeId];
+        // Performance improvement to skip on render cycle and change "open" class directly
+        if (internalExpandedGroups.current.includes(nodeId)) {
+            getNodeContainerDomElementById(nodeId).classList.remove('open');
+        }
+        else {
+            getNodeContainerDomElementById(nodeId).classList.add('open');
+        }
+        internalExpandedGroups.current = newExpandedNodes;
+        onExpandGroupsChange(newExpandedNodes);
+    };
+    const getNodeContainerDomElementById = nodeId => {
+        return treeRef.current.querySelector(`.TreeNodeContainer[data-id="${nodeId}"]`);
+    };
+    const selectAllSearchResultItems = shouldSelect => selectAllFlatItems(shouldSelect);
+    const handeSelectAll = (shouldSelect, isIndeterminate) => {
+        const shouldSelectAll = shouldSelect && !isIndeterminate;
+        dispatch(allCheckedChanged(shouldSelectAll));
+        (0, cond_1.default)([
+            [hasNoSearchAndGroups, () => selectAllGroups(shouldSelectAll)],
+            [hasSearchAndGroups, () => selectAllSearchResultItems(shouldSelectAll)],
+            [otherwise, () => selectAllFlatItems(shouldSelectAll)],
+        ])();
+    };
+    const selectAllGroups = shouldSelect => respondSelection([], shouldSelect ? getListIds(groups) : []);
+    const selectAllFlatItems = shouldSelect => respondSelection(shouldSelect ? getListIds(state.flatItems) : [], []);
+    const respondSelection = (updatedSelectedItems, updatedSelectedGroups) => {
+        onSelectionChange({ items: updatedSelectedItems, groups: updatedSelectedGroups });
+    };
+    const handleGroupSelection = (group, isIndeterminate) => {
+        const groupId = group.id;
+        const isSelected = selectedGroups.includes(groupId);
+        const shouldSelectGroup = !isSelected && !isIndeterminate;
+        // handle group selection
+        const newSelectedGroups = shouldSelectGroup
+            ? [...selectedGroups, groupId]
+            : (0, exports.excludeFromList)(selectedGroups, groupId);
+        // deselect all items of a node since they will be selected inherently via the group itself
+        const itemsInGroup = (0, find_1.default)(entry => entry.id === groupId)(state.groupedItems);
+        const itemIdsOfGroup = (0, map_1.default)(item => item.id)(itemsInGroup.items);
+        const updatedSelectedItems = (0, without_1.default)(itemIdsOfGroup, selectedItems);
+        // check if all groups are selected to change the state of TreeSelectAll
+        const groupAmount = groups.length;
+        const emptyGroupAmount = showEmptyGroups ? 0 : state.emptyGroups.length;
+        const totalGroupAmount = groupAmount - emptyGroupAmount;
+        const areAllGroupsChecked = totalGroupAmount === newSelectedGroups.length;
+        dispatch(allCheckedChanged(areAllGroupsChecked));
+        respondSelection(updatedSelectedItems, newSelectedGroups);
+    };
+    const handleSearchChange = updatedSearchValue => {
+        onSearchChange(updatedSearchValue);
+        dispatch(searchValueChanged(updatedSearchValue));
+    };
+    const hasGroups = () => groups && notEmpty(groups);
+    const hasSearchAndGroups = () => hasInternalSearchValue() && hasGroups();
+    const hasNoSearchAndGroups = () => !hasInternalSearchValue() && hasGroups();
+    const setFlatItemList = (updtedItems, searchValue) => {
+        const flatItems = getFlatItems(updtedItems, searchValue);
+        dispatch(assetCounted(getAssetTypeCounts(flatItems)));
+        dispatch(flatItemsChanged(flatItems));
+    };
+    const setGroupedItemList = (groupsToProcess, itemsToProcess, considerEmptyGroups) => {
+        // Map items to groups with filtered items
+        const mappedItemsToGroups = getMappedItemsToGroups(groupsToProcess, itemsToProcess);
+        const newGroupedItems = (0, flow_1.default)(sortGroupsByName, sortGroupItemsByName)(mappedItemsToGroups);
+        const groupedItems = considerEmptyGroups ? newGroupedItems : filterEmptyGroups(newGroupedItems);
+        // Keep the empty groups in memory for later access in select all, without re-iterating on every
+        // group selection
+        const emptyGroups = (0, filter_1.default)(group => (0, isEmpty_1.default)(group.items))(newGroupedItems);
+        dispatch(emptyGroupsChanged(emptyGroups));
+        dispatch(assetCounted(getAssetTypeCounts(items)));
+        dispatch(groupedItemsChanged(groupedItems));
+    };
+    const makeTree = (updatedGroups, updatedItems) => {
+        const internalSearchValue = state.searchValue;
+        const internalTypeFilter = state.typeFilter;
+        const groupsToProcess = updatedGroups;
+        const itemsToProcess = updatedItems;
+        const hasGroupList = groupList => groupList && notEmpty(groupList);
+        const hasNoInternalSearchAndGroups = () => (0, isEmpty_1.default)(internalSearchValue) && hasGroupList(groupsToProcess);
+        const hasInternalSearchAndGroups = () => notEmpty(internalSearchValue) && hasGroupList(groupsToProcess);
+        const filteredItems = (0, isEmpty_1.default)(internalTypeFilter)
+            ? itemsToProcess
+            : filterAssetByType(internalTypeFilter)(itemsToProcess);
+        const setGroupedItems = () => setGroupedItemList(groupsToProcess, filteredItems, showEmptyGroups);
+        const setFlatItems = () => setFlatItemList(filteredItems, internalSearchValue);
+        (0, cond_1.default)([
+            [hasNoInternalSearchAndGroups, setGroupedItems],
+            [hasInternalSearchAndGroups, setFlatItems],
+            [otherwise, setFlatItems],
+        ])();
+    };
+    const renderTree = () => {
+        const { groupedItems } = state;
+        if ((0, isEmpty_1.default)(groupedItems)) {
+            return (0, jsx_runtime_1.jsx)(TreeNothingFound_1.default, {});
+        }
+        const result = (0, map_1.default)(group => {
+            const groupId = group.id;
+            const groupItems = group.items;
+            const isOpen = expandedGroups.includes(groupId);
+            const numSelectedGroupItems = (0, filter_1.default)(containsItemById(selectedItems))(groupItems).length;
+            const isGroupSelected = selectedGroups.includes(groupId);
+            const isIndeterminate = !isGroupSelected && numSelectedGroupItems > 0;
+            return ((0, jsx_runtime_1.jsxs)(TreeNodeContainer_1.default, Object.assign({ groupId: groupId, isOpen: isOpen }, { children: [(0, jsx_runtime_1.jsx)(TreeNode_1.default, { node: group, hasMultiselect: hasMultiselect, onToggleNode: handleToggleNode, onSelect: handleGroupSelection, isSelected: isGroupSelected, isIndeterminate: isIndeterminate }), (0, jsx_runtime_1.jsx)(TreeLeafList_1.default, { leafList: groupItems, hasMultiselect: hasMultiselect, showRadioButtons: showRadioButtons, selectedItems: selectedItems, selectedGroups: selectedGroups, onSelectionChange: respondSelection })] }), groupId));
+        })(groupedItems);
+        return result;
+    };
+    const renderFlatList = () => {
+        const { flatItems } = state;
+        const hasLeafs = (0, isEmpty_1.default)(flatItems);
+        const getLeafs = () => ((0, jsx_runtime_1.jsx)(TreeLeafList_1.default, { leafList: flatItems, hasMultiselect: hasMultiselect, showRadioButtons: showRadioButtons, selectedItems: selectedItems, selectedGroups: selectedGroups, onSelectionChange: respondSelection }));
+        return (0, jsx_runtime_1.jsx)(TreeNodeContainer_1.default, Object.assign({ isOpen: true }, { children: hasLeafs ? (0, jsx_runtime_1.jsx)(TreeNothingFound_1.default, {}) : getLeafs() }));
+    };
+    const hasExternalGroups = notEmpty(groups);
+    const hasInternalSearchValue = () => notEmpty(state.searchValue);
+    const hasSelectedAllItems = () => (0, isEqual_1.default)((0, size_1.default)(selectedItems), (0, size_1.default)(state.flatItems));
+    const hasPartialySelectedItems = () => notEmpty(selectedItems) && !hasSelectedAllItems();
+    const hasSelectedAllGroups = () => {
+        const emptyGroupAmount = showEmptyGroups ? 0 : state.emptyGroups.length;
+        return (0, isEqual_1.default)((0, size_1.default)(selectedGroups), (0, size_1.default)(groups) - emptyGroupAmount);
+    };
+    const hasPartialySelectedGroups = () => hasExternalGroups && notEmpty(selectedGroups) && !hasSelectedAllGroups();
+    const hasSearchAndNoItems = hasInternalSearchValue() && (0, isEmpty_1.default)(state.flatItems);
+    const hasSearchAndNoGroups = hasInternalSearchValue() && (0, isEmpty_1.default)(state.groupedItems) && hasExternalGroups;
+    const hideSelectAll = hasSearchAndNoItems || hasSearchAndNoGroups;
+    const isIndeterminate = hasPartialySelectedGroups() || hasPartialySelectedItems();
+    const treeClassNames = (0, classnames_1.default)('Tree', className);
+    const treeHeadClasses = (0, classnames_1.default)('TreeHead', 'display-flex align-items-center', 'padding-15');
+    const shouldRenderTree = () => hasGroups() && !hasInternalSearchValue();
+    const content = (0, cond_1.default)([
+        [shouldRenderTree, () => renderTree()],
+        [otherwise, () => renderFlatList()],
+    ])();
+    const handleFilterByType = type => {
+        const currentTypeFilter = new Set(state.typeFilter);
+        if (currentTypeFilter.has(type)) {
+            currentTypeFilter.delete(type);
+        }
+        else {
+            currentTypeFilter.add(type);
+        }
+        dispatch(typeFilterChanged([...currentTypeFilter]));
+    };
+    const isClickable = (0, size_1.default)((0, keys_1.default)(state.assetCounts)) > 1;
+    const isFilterActive = notEmpty(state.typeFilter);
+    const showTreeHead = !hideTreeHead;
+    const showSelectAll = !hideSelectAll;
+    const showSearch = !hideSearch;
+    const showSummary = !hideSummary;
+    const hasCustomSearch = !(0, isNil_1.default)(search);
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, remainingProps, { className: treeClassNames, ref: treeRef }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'TreeHeader' }, { children: [showSearch && !hasCustomSearch && ((0, jsx_runtime_1.jsx)(TreeSearch_1.default, { value: state.searchValue, onChange: handleSearchChange, placeholder: searchPlaceholder })), hasCustomSearch && search, showTreeHead && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: treeHeadClasses }, { children: [showSelectAll && ((0, jsx_runtime_1.jsx)(TreeSelectAll_1.default, { isChecked: state.allChecked, isEnabled: hasMultiselect, isIndeterminate: isIndeterminate, onSelect: handeSelectAll })), showSelectAll && hasMultiselect && showSummary && (0, jsx_runtime_1.jsx)(Divider, {}), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'display-flex justify-content-between align-items-center width-100pct' }, { children: [showSummary
+                                        ? summary || ((0, jsx_runtime_1.jsx)(TreeSummary_1.default, { children: (0, map_1.default)(typeCounter => ((0, jsx_runtime_1.jsx)(TypeCounter_1.default, { type: typeCounter, icon: `${typeCounter}`, value: state.assetCounts[typeCounter], onClick: handleFilterByType, isActive: state.typeFilter.includes(typeCounter), hasFilter: isFilterActive, enableActivity: isClickable }, typeCounter)))(state.visibleTypeCounters) }))
+                                        : null, (0, jsx_runtime_1.jsx)(TreeOptions_1.default, { treeOptions: treeOptions })] }))] })))] })), (0, jsx_runtime_1.jsx)(TreeRoot_1.default, Object.assign({ maxHeight: scrollHeight }, { children: content }))] })));
+}, customCompare);
+Tree.displayName = 'Tree';
+Tree.defaultProps = {
+    hasMultiselect: true,
+    showRadioButtons: false,
+    hideSearch: false,
+    hideSummary: false,
+    showEmptyGroups: true,
+    selectedGroups: [],
+    selectedItems: [],
+    onSelectionChange: () => { },
+    onExpandGroupsChange: () => { },
+    onSearchChange: () => { },
+    searchPlaceholder: 'Type here to filter by name',
+    treeOptions: [],
+    groups: [],
+};
+Tree.propTypes = {
+    groups: prop_types_1.default.arrayOf(prop_types_1.default.shape({
+        id: prop_types_1.default.string.isRequired,
+        name: prop_types_1.default.string.isRequired,
+        icon: prop_types_1.default.string,
+        className: prop_types_1.default.string,
+    })),
+    items: prop_types_1.default.arrayOf(prop_types_1.default.shape({
+        id: prop_types_1.default.string.isRequired,
+        name: prop_types_1.default.oneOfType([
+            prop_types_1.default.string,
+            prop_types_1.default.shape({
+                firstName: prop_types_1.default.string,
+                lastName: prop_types_1.default.string.isRequired,
+            }),
+        ]).isRequired,
+        info: prop_types_1.default.oneOfType([prop_types_1.default.string, prop_types_1.default.node]),
+        type: prop_types_1.default.string.isRequired,
+        groupIds: prop_types_1.default.arrayOf(prop_types_1.default.string),
+        className: prop_types_1.default.string,
+    })),
+    selectedGroups: prop_types_1.default.arrayOf(prop_types_1.default.string),
+    selectedItems: prop_types_1.default.arrayOf(prop_types_1.default.string),
+    onSelectionChange: prop_types_1.default.func,
+    hasMultiselect: prop_types_1.default.bool,
+    showRadioButtons: prop_types_1.default.bool,
+    hideSearch: prop_types_1.default.bool,
+    summary: prop_types_1.default.node,
+    hideSummary: prop_types_1.default.bool,
+    hideTreeHead: prop_types_1.default.bool,
+    // This defines a custom search component.
+    search: prop_types_1.default.node,
+    searchPlaceholder: prop_types_1.default.string,
+    onSearchChange: prop_types_1.default.func,
+    className: prop_types_1.default.string,
+    scrollHeight: prop_types_1.default.number,
+    expandedGroups: prop_types_1.default.arrayOf(prop_types_1.default.string),
+    onExpandGroupsChange: prop_types_1.default.func,
+    showEmptyGroups: prop_types_1.default.bool,
+    treeOptions: prop_types_1.default.arrayOf(prop_types_1.default.node),
+};
+exports.default = Tree;