@capillarytech/blaze-ui 5.23.3-beta.3 → 5.23.3-beta.4

package/CapMultiSelectWithTree/index.js

@@ -1,37 +1,32 @@
-var _excluded = ["treeData"];
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import { Tree, Icon, Popover, Tooltip, Spin } from 'antd';
-import classNames from 'classnames';
-import debounce from 'lodash/debounce';
-import difference from 'lodash/difference';
-import includes from 'lodash/includes';
-import intersection from 'lodash/intersection';
-import isEmpty from 'lodash/isEmpty';
-import isEqual from 'lodash/isEqual';
-import omit from 'lodash/omit';
-import union from 'lodash/union';
-import without from 'lodash/without';
-import PropTypes from 'prop-types';
-import React from 'react';
-import CapButton from "../CapButton";
-import CapHeader from "../CapHeader";
-import CapIcon from "../CapIcon";
-import CapInput from "../CapInput";
-import CapLabel from "../CapLabel";
-import CapRow from "../CapRow";
-import CapTooltip from "../CapTooltip";
-import LocaleHoc from "../LocaleHoc";
-import * as styledVars from "../styles/_variables";
-import "./styles.scss";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-var {
-  Search
-} = CapInput;
-var clsPrefix = 'cap-multi-tree-select-v2';
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { Tree, Tooltip, Icon, Popover, Spin } from "antd";
+import classNames from "classnames";
+import debounce from "lodash/debounce";
+import difference from "lodash/difference";
+import includes from "lodash/includes";
+import intersection from "lodash/intersection";
+import isEmpty from "lodash/isEmpty";
+import isEqual from "lodash/isEqual";
+import omit from "lodash/omit";
+import union from "lodash/union";
+import without from "lodash/without";
+import PropTypes from "prop-types";
+import React from "react";
+import CapButton from "../CapButton/index.js";
+import CapHeader from "../CapHeader/index.js";
+import CapIcon from "../CapIcon/index.js";
+import InputFinal from "../CapInput/index.js";
+import CapLabelWithStatic from "../CapLabel/index.js";
+import CapRow from "../CapRow/index.js";
+import CapTooltip from "../CapTooltip/index.js";
+import LocaleHoc from "../LocaleHoc/index.js";
+import { CAP_G06 } from "../styles/_variables.js";
+import './styles.css';/* empty css            */
+const { Search } = InputFinal;
+const clsPrefix = "cap-multi-tree-select-v2";
 function getObject(array, key, value) {
-  var o;
-  array == null || array.some(function iter(a) {
+  let o;
+  array == null ? void 0 : array.some(function iter(a) {
     if (String(a[key]) === String(value)) {
       o = a;
       return true;
@@ -40,13 +35,13 @@ function getObject(array, key, value) {
   });
   return o;
 }
-var getDataValuesInTree = (data, searchValue, searchKey, isMatching) => data.reduce((acc, item) => {
+const getDataValuesInTree = (data, searchValue, searchKey, isMatching) => data.reduce((acc, item) => {
   if (item.children) {
-    var isParentMatching = isMatching || item.key !== 'select-all-common' && !item.isCategory && !!(!searchValue || item[searchKey].toLowerCase().indexOf(searchValue.toLowerCase()) > -1);
-    var temp = getDataValuesInTree(item.children, searchValue, searchKey, isParentMatching);
+    const isParentMatching = isMatching || item.key !== "select-all-common" && !item.isCategory && !!(!searchValue || item[searchKey].toLowerCase().indexOf(searchValue.toLowerCase()) > -1);
+    const temp = getDataValuesInTree(item.children, searchValue, searchKey, isParentMatching);
     if (temp.length > 0) {
       acc.push(item.key);
-      var newAcc = union(acc, temp);
+      const newAcc = union(acc, temp);
       return newAcc;
     }
     return acc;
@@ -56,30 +51,30 @@ var getDataValuesInTree = (data, searchValue, searchKey, isMatching) => data.red
   }
   return acc;
 }, []);
-var getAllParents = (keys, dataListObject) => keys.reduce((acc, key) => {
+const getAllParents = (keys, dataListObject) => keys.reduce((acc, key) => {
   if (dataListObject[key] && dataListObject[key].children) {
     acc.push(key);
   }
   return acc;
 }, []);
-var getAllChildren = (key, dataListObject) => {
-  var obj = dataListObject[key];
-  var allChildren = [];
+const getAllChildren = (key, dataListObject) => {
+  const obj = dataListObject[key];
+  let allChildren = [];
   if (obj.children > 0) {
-    for (var i = 0; i < obj.children; i += 1) {
+    for (let i = 0; i < obj.children; i += 1) {
       allChildren.push(obj.childrenKeys[i]);
-      var children = getAllChildren(obj.childrenKeys[i], dataListObject);
+      const children = getAllChildren(obj.childrenKeys[i], dataListObject);
       allChildren = union(allChildren, children);
     }
   }
   return allChildren;
 };
-var getParentKey = (key, tree) => {
-  var parentKey;
-  for (var i = 0; i < tree.length; i += 1) {
-    var node = tree[i];
+const getParentKey = (key, tree) => {
+  let parentKey;
+  for (let i = 0; i < tree.length; i += 1) {
+    const node = tree[i];
     if (node.children) {
-      if (node.children.some(item => item.key === key)) {
+      if (node.children.some((item) => item.key === key)) {
         parentKey = node.key;
       } else if (getParentKey(key, node.children)) {
         parentKey = getParentKey(key, node.children);
@@ -88,11 +83,11 @@ var getParentKey = (key, tree) => {
   }
   return parentKey;
 };
-var getExpandedKeys = (appliedKeys, treeData, dataList) => {
-  var expandedKeys = dataList.map(item => {
+const getExpandedKeys = (appliedKeys, treeData, dataList) => {
+  const expandedKeys = dataList.map((item) => {
     if (includes(appliedKeys, item.key)) {
-      var parentKey = getParentKey(item.key, treeData);
-      if (typeof parentKey === 'undefined') {
+      const parentKey = getParentKey(item.key, treeData);
+      if (typeof parentKey === "undefined") {
         return item.key;
       }
       return parentKey;
@@ -101,24 +96,17 @@ var getExpandedKeys = (appliedKeys, treeData, dataList) => {
   });
   return expandedKeys.filter((item, i, self) => item && self.indexOf(item) === i);
 };
-var replaceChildrenWithParent = _ref => {
-  var {
-    data,
-    arr
-  } = _ref;
+const replaceChildrenWithParent = ({ data, arr }) => {
   if (data.children && data.children.length > 0) {
-    var present = [];
-    data.children.forEach(item => {
-      var res = replaceChildrenWithParent({
-        data: item,
-        arr
-      });
+    const present = [];
+    data.children.forEach((item) => {
+      const res = replaceChildrenWithParent({ data: item, arr });
       if (res) {
         present.push(res);
       }
     });
     if (present.length === data.children.length && !data.isCategory) {
-      data.children.forEach(child => {
+      data.children.forEach((child) => {
         arr.splice(arr.indexOf(child.key), 1);
       });
       arr.push(data.key);
@@ -128,15 +116,15 @@ var replaceChildrenWithParent = _ref => {
   }
   return arr.includes(data.key);
 };
-var getSelectedKeysFromAppliedKeys = (appliedKeys, dataListObject) => {
-  var selectedKeys = [];
+const getSelectedKeysFromAppliedKeys = (appliedKeys, dataListObject) => {
+  let selectedKeys = [];
   if (appliedKeys) {
-    var parents = getAllParents(appliedKeys, dataListObject);
-    appliedKeys.forEach(currentKey => {
+    const parents = getAllParents(appliedKeys, dataListObject);
+    appliedKeys.forEach((currentKey) => {
       if (parents.indexOf(currentKey) > -1) {
-        var allChildren = getAllChildren(currentKey, dataListObject);
-        var allParents = getAllParents(allChildren, dataListObject);
-        var finalSelectedKeys = difference(allChildren, allParents);
+        const allChildren = getAllChildren(currentKey, dataListObject);
+        const allParents = getAllParents(allChildren, dataListObject);
+        const finalSelectedKeys = difference(allChildren, allParents);
         selectedKeys = union(selectedKeys, finalSelectedKeys);
       } else {
         selectedKeys.push(currentKey);
@@ -149,7 +137,7 @@ class CapMultiSelectWithTree extends React.Component {
   constructor(props) {
     super(props);
     this.renderTreeNodes = (data, searchValue, searchKey, isMatching, parentKey, currentCheckedKeys) => {
-      var {
+      const {
         showSelectedCountByParent,
         moreText,
         treeData,
@@ -159,10 +147,10 @@ class CapMultiSelectWithTree extends React.Component {
         selectedText,
         showLeafNodeSelectionCount = false
       } = this.props;
-      var selectedParentKey;
-      for (var i = 0; i < treeData.length; i++) {
+      let selectedParentKey;
+      for (let i = 0; i < treeData.length; i++) {
         if (treeData[i].children) {
-          for (var j = 0; j < treeData[i].children.length; j++) {
+          for (let j = 0; j < treeData[i].children.length; j++) {
             if (treeData[i].children[j].checked) {
               selectedParentKey = treeData[i].key;
               break;
@@ -171,138 +159,111 @@ class CapMultiSelectWithTree extends React.Component {
           if (selectedParentKey) break;
         }
       }
-      var {
-        selectedKeys
-      } = this.state;
-
-      // Helper function to count selected leaf nodes
-      var countSelectedLeafNodes = item => {
-        var _item$children;
-        if (!(item != null && item.children)) {
-          return selectedKeys.includes(item == null ? void 0 : item.key) ? 1 : 0;
+      const { selectedKeys: selectedKeys2 } = this.state;
+      const countSelectedLeafNodes = (item) => {
+        var _a;
+        if (!(item == null ? void 0 : item.children)) {
+          return selectedKeys2.includes(item == null ? void 0 : item.key) ? 1 : 0;
         }
-        return item == null || (_item$children = item.children) == null ? void 0 : _item$children.reduce((sum, child) => sum + countSelectedLeafNodes(child), 0);
+        return (_a = item == null ? void 0 : item.children) == null ? void 0 : _a.reduce((sum, child) => sum + countSelectedLeafNodes(child), 0);
       };
-      var nodes = (data || []).reduce((acc, item) => {
+      const nodes = (data || []).reduce((acc, item) => {
         if (!isEmpty(item.children)) {
-          var finalParentKey = parentKey || item.key;
-          var isParentMatching = isMatching || item.key !== 'select-all-common' && !item.isCategory && !!(!searchValue || item[searchKey].toLowerCase().indexOf(searchValue.toLowerCase()) > -1);
-          var temp = this.renderTreeNodes(item.children, searchValue, searchKey, isParentMatching, item.key !== 'select-all-common' ? item.key : undefined, currentCheckedKeys);
-          var childrenMap = {};
-          var selectedCount = 0;
-          item.children.forEach(child => {
+          const finalParentKey = parentKey || item.key;
+          const isParentMatching = isMatching || item.key !== "select-all-common" && !item.isCategory && !!(!searchValue || item[searchKey].toLowerCase().indexOf(searchValue.toLowerCase()) > -1);
+          const temp = this.renderTreeNodes(
+            item.children,
+            searchValue,
+            searchKey,
+            isParentMatching,
+            item.key !== "select-all-common" ? item.key : void 0,
+            currentCheckedKeys
+          );
+          const childrenMap = {};
+          let selectedCount = 0;
+          item.children.forEach((child) => {
             childrenMap[child.key] = true;
           });
-          selectedKeys.forEach(key => {
+          selectedKeys2.forEach((key) => {
             if (childrenMap[key]) {
               selectedCount++;
             }
           });
-          var selectedLeafNodes = countSelectedLeafNodes(item);
+          const selectedLeafNodes = countSelectedLeafNodes(item);
           if (temp.length > 0) {
-            acc.push(/*#__PURE__*/_jsx(Tree.TreeNode, {
-              checkable: !this.props.disableParentCategorySelection,
-              dataRef: item,
-              className: classNames(item.className, {
-                'item-category': item.isCategory,
-                'not-category': !item.isCategory,
-                'parent-contains-info-icon': item.info,
-                'is-liability-owner': item.isLiabilityOwner
-              }),
-              disableCheckbox: enableSingleParentSelection && finalParentKey && selectedParentKey && selectedParentKey !== finalParentKey,
-              title: /*#__PURE__*/_jsxs("div", {
-                className: "multi-select-title",
-                children: [/*#__PURE__*/_jsx("div", {
-                  className: "multi-select-main-title",
-                  title: item.title,
-                  children: item.title
-                }), showLeafNodeSelectionCount && selectedLeafNodes > 0 && (item == null ? void 0 : item.key) !== 'select-all-common' ? /*#__PURE__*/_jsxs("span", {
-                  className: "leaf-node-selected-text-for-parent",
-                  children: [selectedLeafNodes, " ", selectedText]
-                }) : showSelectedCountByParent && selectedCount > 0 ? /*#__PURE__*/_jsxs("span", {
-                  className: "selected-text-for-parent",
-                  children: [selectedCount, " ", moreText]
-                }) : /*#__PURE__*/_jsx(_Fragment, {}), item.info && /*#__PURE__*/_jsx("span", {
-                  className: "info-tooltip",
-                  children: /*#__PURE__*/_jsx(Tooltip, {
-                    placement: "right",
-                    title: item.info,
-                    children: /*#__PURE__*/_jsx(CapIcon, {
-                      className: "info-icon",
-                      type: "info-circle-o"
-                    })
-                  })
-                })]
-              }),
-              children: temp
-            }, item.key));
+            acc.push(
+              /* @__PURE__ */ jsx(
+                Tree.TreeNode,
+                {
+                  checkable: !this.props.disableParentCategorySelection,
+                  dataRef: item,
+                  className: classNames(item.className, {
+                    "item-category": item.isCategory,
+                    "not-category": !item.isCategory,
+                    "parent-contains-info-icon": item.info,
+                    "is-liability-owner": item.isLiabilityOwner
+                  }),
+                  disableCheckbox: enableSingleParentSelection && finalParentKey && selectedParentKey && selectedParentKey !== finalParentKey,
+                  title: /* @__PURE__ */ jsxs("div", { className: "multi-select-title", children: [
+                    /* @__PURE__ */ jsx("div", { className: "multi-select-main-title", title: item.title, children: item.title }),
+                    showLeafNodeSelectionCount && selectedLeafNodes > 0 && (item == null ? void 0 : item.key) !== "select-all-common" ? /* @__PURE__ */ jsxs("span", { className: "leaf-node-selected-text-for-parent", children: [
+                      selectedLeafNodes,
+                      " ",
+                      selectedText
+                    ] }) : showSelectedCountByParent && selectedCount > 0 ? /* @__PURE__ */ jsxs("span", { className: "selected-text-for-parent", children: [
+                      selectedCount,
+                      " ",
+                      moreText
+                    ] }) : /* @__PURE__ */ jsx(Fragment, {}),
+                    item.info && /* @__PURE__ */ jsx("span", { className: "info-tooltip", children: /* @__PURE__ */ jsx(Tooltip, { placement: "right", title: item.info, children: /* @__PURE__ */ jsx(CapIcon, { className: "info-icon", type: "info-circle-o" }) }) })
+                  ] }),
+                  children: temp
+                },
+                item.key
+              )
+            );
           }
           return acc;
         }
         if (isMatching || !searchValue || item[searchKey].toLowerCase().indexOf(searchValue.toLowerCase()) > -1) {
-          acc.push(/*#__PURE__*/_jsx(Tree.TreeNode, _extends({}, item, {
-            className: classNames('child-node', {
-              'contains-info-icon': item.info,
-              'is-liability-owner': item.isLiabilityOwner
-            }),
-            disableCheckbox: disableParentCategorySelection && currentCheckedKeys && currentCheckedKeys.length >= maxValuesToSelect && !currentCheckedKeys.includes(item.key) || enableSingleParentSelection && parentKey && selectedParentKey && selectedParentKey !== parentKey,
-            title: /*#__PURE__*/_jsxs("div", {
-              className: "multi-select-title",
-              children: [disableParentCategorySelection && currentCheckedKeys && currentCheckedKeys.length >= maxValuesToSelect && !currentCheckedKeys.includes(item.key) ? /*#__PURE__*/_jsx(CapTooltip, {
-                overlayStyle: {
-                  zIndex: 10003
-                },
-                mouseLeaveDelay: 0.5,
-                placement: "bottom",
-                title: this.props.disableCheckboxTooltipMessage,
-                children: /*#__PURE__*/_jsx("div", {
-                  className: "multi-select-main-title",
-                  title: item.title,
-                  children: item.title
-                })
-              }) : /*#__PURE__*/_jsx("div", {
-                className: "multi-select-main-title",
-                title: item.title,
-                children: item.title
-              }), item.info && /*#__PURE__*/_jsx("span", {
-                className: "info-tooltip",
-                children: /*#__PURE__*/_jsx(Tooltip, {
-                  placement: "right",
-                  title: item.info,
-                  children: /*#__PURE__*/_jsx(Icon, {
-                    className: "info-icon",
-                    type: "info-circle-o"
-                  })
-                })
-              })]
-            })
-          })));
+          acc.push(
+            /* @__PURE__ */ jsx(
+              Tree.TreeNode,
+              {
+                ...item,
+                className: classNames("child-node", {
+                  "contains-info-icon": item.info,
+                  "is-liability-owner": item.isLiabilityOwner
+                }),
+                disableCheckbox: disableParentCategorySelection && currentCheckedKeys && currentCheckedKeys.length >= maxValuesToSelect && !currentCheckedKeys.includes(item.key) || enableSingleParentSelection && parentKey && selectedParentKey && selectedParentKey !== parentKey,
+                title: /* @__PURE__ */ jsxs("div", { className: "multi-select-title", children: [
+                  disableParentCategorySelection && currentCheckedKeys && currentCheckedKeys.length >= maxValuesToSelect && !currentCheckedKeys.includes(item.key) ? /* @__PURE__ */ jsx(
+                    CapTooltip,
+                    {
+                      overlayStyle: { zIndex: 10003 },
+                      mouseLeaveDelay: 0.5,
+                      placement: "bottom",
+                      title: this.props.disableCheckboxTooltipMessage,
+                      children: /* @__PURE__ */ jsx("div", { className: "multi-select-main-title", title: item.title, children: item.title })
+                    }
+                  ) : /* @__PURE__ */ jsx("div", { className: "multi-select-main-title", title: item.title, children: item.title }),
+                  item.info && /* @__PURE__ */ jsx("span", { className: "info-tooltip", children: /* @__PURE__ */ jsx(Tooltip, { placement: "right", title: item.info, children: /* @__PURE__ */ jsx(Icon, { className: "info-icon", type: "info-circle-o" }) }) })
+                ] })
+              }
+            )
+          );
         }
         return acc;
       }, []);
       return nodes;
     };
-    this.getStoreHelPTextMessage = (message, className) => /*#__PURE__*/_jsx(CapRow, {
-      className: className,
-      children: /*#__PURE__*/_jsx(CapHeader, {
-        title: message == null ? void 0 : message.header,
-        description: message == null ? void 0 : message.description,
-        size: "regular"
-      })
-    });
-    // Getting the titles of selected values to show on hover. Currently implemented for store filter
-    this.getSelectedValuesTitles = appliedKeyObjects => {
-      if (appliedKeyObjects != null && appliedKeyObjects.length) {
-        return /*#__PURE__*/_jsx(CapRow, {
-          className: classNames(clsPrefix + "-store-tooltip-preview"),
-          children: appliedKeyObjects == null ? void 0 : appliedKeyObjects.map((value, index) => /*#__PURE__*/_jsxs(CapLabel, {
-            className: "tooltip-title",
-            type: "label23",
-            children: [value == null ? void 0 : value.title, index !== (appliedKeyObjects == null ? void 0 : appliedKeyObjects.length) - 1 && ',']
-          }, (value == null ? void 0 : value.title) || index))
-        });
-      } else {
-        /*#__PURE__*/_jsx(_Fragment, {});
+    this.getStoreHelPTextMessage = (message, className) => /* @__PURE__ */ jsx(CapRow, { className, children: /* @__PURE__ */ jsx(CapHeader, { title: message == null ? void 0 : message.header, description: message == null ? void 0 : message.description, size: "regular" }) });
+    this.getSelectedValuesTitles = (appliedKeyObjects) => {
+      if (appliedKeyObjects == null ? void 0 : appliedKeyObjects.length) {
+        return /* @__PURE__ */ jsx(CapRow, { className: classNames(`${clsPrefix}-store-tooltip-preview`), children: appliedKeyObjects == null ? void 0 : appliedKeyObjects.map((value, index) => /* @__PURE__ */ jsxs(CapLabelWithStatic, { className: "tooltip-title", type: "label23", children: [
+          value == null ? void 0 : value.title,
+          index !== (appliedKeyObjects == null ? void 0 : appliedKeyObjects.length) - 1 && ","
+        ] }, (value == null ? void 0 : value.title) || index)) });
       }
     };
     this.dataList = [];
@@ -312,49 +273,58 @@ class CapMultiSelectWithTree extends React.Component {
     if (props.enableDebouncedSearch) {
       this.debouncedSearch = debounce(this.onSearch, 200);
     }
-    var _selectedKeys = getSelectedKeysFromAppliedKeys(props.appliedKeys, this.dataListObject);
+    const selectedKeys = getSelectedKeysFromAppliedKeys(props.appliedKeys, this.dataListObject);
     this.state = {
       visible: false,
-      expandedKeys: props.expandedKeys || (props.appliedKeys && props.appliedKeys.length > 0 ? union(getExpandedKeys(props.appliedKeys, props.treeData, this.dataList), ['select-all-common']) : ['select-all-common']),
+      expandedKeys: props.expandedKeys || (props.appliedKeys && props.appliedKeys.length > 0 ? union(getExpandedKeys(props.appliedKeys, props.treeData, this.dataList), [
+        "select-all-common"
+      ]) : ["select-all-common"]),
       autoExpandParent: true,
-      searchValue: '',
-      externalSearchValue: '',
-      selectedKeys: _selectedKeys
+      searchValue: "",
+      externalSearchValue: "",
+      selectedKeys
     };
-    ['hide', 'togglePopoverVisibility', 'onSearch', 'onCheck', 'clearSearch', 'applySelect', 'onPopoverClick', 'onExpand', 'onDebouncedSearch'].forEach(fn => {
+    [
+      "hide",
+      "togglePopoverVisibility",
+      "onSearch",
+      "onCheck",
+      "clearSearch",
+      "applySelect",
+      "onPopoverClick",
+      "onExpand",
+      "onDebouncedSearch"
+    ].forEach((fn) => {
       this[fn] = this[fn].bind(this);
     });
   }
   componentWillReceiveProps(nextProps) {
-    var {
-      externalSearchValue
-    } = this.state;
-    var {
-      appliedKeys
-    } = this.props;
+    const { externalSearchValue } = this.state;
+    const { appliedKeys } = this.props;
     if (!isEqual(appliedKeys, nextProps.appliedKeys)) {
-      var selectedKeys = getSelectedKeysFromAppliedKeys(nextProps.appliedKeys, this.dataListObject);
+      const selectedKeys = getSelectedKeysFromAppliedKeys(
+        nextProps.appliedKeys,
+        this.dataListObject
+      );
       this.setState({
         selectedKeys,
-        expandedKeys: nextProps.appliedKeys && nextProps.appliedKeys.length > 0 ? union(getExpandedKeys(nextProps.appliedKeys, nextProps.treeData, this.dataList), ['select-all-common']) : ['select-all-common']
+        expandedKeys: nextProps.appliedKeys && nextProps.appliedKeys.length > 0 ? union(getExpandedKeys(nextProps.appliedKeys, nextProps.treeData, this.dataList), [
+          "select-all-common"
+        ]) : ["select-all-common"]
       });
     }
     this.dataList = [];
     this.dataListObject = {};
     this.allChildrenCount = 0;
-    var treeDataForList = externalSearchValue && nextProps.searchedTreeData.length ? nextProps.searchedTreeData : nextProps.treeData;
+    const treeDataForList = externalSearchValue && nextProps.searchedTreeData.length ? nextProps.searchedTreeData : nextProps.treeData;
     this.generateList(treeDataForList);
     if (!this.props.searchedTreeData.length && nextProps.searchedTreeData.length) {
-      var expandedKeys = [nextProps.searchedTreeData[0].key];
-      this.setState({
-        expandedKeys
-      });
+      const expandedKeys = [nextProps.searchedTreeData[0].key];
+      this.setState({ expandedKeys });
     }
   }
   onExpand(expandedKeys) {
-    var {
-      expandedKeysHandler
-    } = this.props;
+    const { expandedKeysHandler } = this.props;
     expandedKeysHandler && expandedKeysHandler(expandedKeys);
     this.setState({
       expandedKeys,
@@ -362,15 +332,15 @@ class CapMultiSelectWithTree extends React.Component {
     });
   }
   onDebouncedSearch(e) {
-    var searchValue = e.target.value;
+    const searchValue = e.target.value;
     this.setState({
       searchValue
     });
     this.debouncedSearch(null, searchValue);
   }
   onSearch(e, searchVal) {
-    var searchValue = searchVal === '' || searchVal ? searchVal : e.target.value;
-    var {
+    const searchValue = searchVal === "" || searchVal ? searchVal : e.target.value;
+    const {
       treeData,
       searchKey,
       expandedKeysHandler,
@@ -378,46 +348,40 @@ class CapMultiSelectWithTree extends React.Component {
       onSearch: onExternalSearchProp,
       isStoreFilter = false
     } = this.props;
-    var {
-      selectedKeys
-    } = this.state;
+    const { selectedKeys } = this.state;
     if (isExternalSearch) {
-      this.setState({
-        externalSearchValue: searchValue
-      });
+      this.setState({ externalSearchValue: searchValue });
       if (isStoreFilter && (searchValue == null ? void 0 : searchValue.length) > 2 || !isStoreFilter) {
         onExternalSearchProp(searchValue);
       }
-      var expandedKeys = [];
+      let expandedKeys = [];
       if (!searchValue) {
-        expandedKeys = selectedKeys && selectedKeys.length > 0 ? union(getExpandedKeys(selectedKeys, treeData, this.dataList), ['select-all-common']) : ['select-all-common'];
+        expandedKeys = selectedKeys && selectedKeys.length > 0 ? union(getExpandedKeys(selectedKeys, treeData, this.dataList), ["select-all-common"]) : ["select-all-common"];
       }
-      this.setState({
-        expandedKeys
-      });
+      this.setState({ expandedKeys });
     } else {
-      var _expandedKeys = [];
+      let expandedKeys = [];
       if (searchValue) {
-        _expandedKeys = this.dataList.map(item => {
+        expandedKeys = this.dataList.map((item) => {
           if (item[searchKey].toLowerCase().indexOf(searchValue.toLowerCase()) > -1) {
-            var parentKey = getParentKey(item.key, treeData);
-            if (typeof parentKey === 'undefined') {
+            const parentKey = getParentKey(item.key, treeData);
+            if (typeof parentKey === "undefined") {
               return item.key;
             }
             return parentKey;
           }
           return null;
         });
-        _expandedKeys = _expandedKeys.filter((item, i, self) => item && self.indexOf(item) === i);
+        expandedKeys = expandedKeys.filter((item, i, self) => item && self.indexOf(item) === i);
       } else {
-        _expandedKeys = selectedKeys && selectedKeys.length > 0 ? union(getExpandedKeys(selectedKeys, treeData, this.dataList), ['select-all-common']) : ['select-all-common'];
+        expandedKeys = selectedKeys && selectedKeys.length > 0 ? union(getExpandedKeys(selectedKeys, treeData, this.dataList), ["select-all-common"]) : ["select-all-common"];
       }
-      expandedKeysHandler && expandedKeysHandler(_expandedKeys);
-      this.setState(prevState => ({
-        expandedKeys: _expandedKeys,
+      expandedKeysHandler && expandedKeysHandler(expandedKeys);
+      this.setState((prevState) => ({
+        expandedKeys,
         searchValue,
         autoExpandParent: true,
-        selectedKeys: without(prevState.selectedKeys, 'select-all-common')
+        selectedKeys: without(prevState.selectedKeys, "select-all-common")
       }));
     }
   }
@@ -427,98 +391,78 @@ class CapMultiSelectWithTree extends React.Component {
     }
   }
   onCheck(selectedKeys, info) {
-    var clonedSelectedKeys = [...selectedKeys];
-    var alreadySelectedKeys = [...this.state.selectedKeys];
-    var {
-      searchValue,
-      externalSearchValue
-    } = this.state;
-    var {
-      treeData,
-      searchKey,
-      defaultKeys = []
-    } = this.props;
-    var currentKey = info.node.props.eventKey;
-    var updatedSelectedKeys;
+    const clonedSelectedKeys = [...selectedKeys];
+    const alreadySelectedKeys = [...this.state.selectedKeys];
+    const { searchValue, externalSearchValue } = this.state;
+    const { treeData, searchKey, defaultKeys = [] } = this.props;
+    const currentKey = info.node.props.eventKey;
+    let updatedSelectedKeys;
     if (!searchValue && !externalSearchValue) {
-      if (currentKey === 'select-all-common') {
-        var allParents = getAllParents(selectedKeys, this.dataListObject);
-        var _finalSelectedKeys = difference(selectedKeys, allParents);
-        if (_finalSelectedKeys.length === 1 && _finalSelectedKeys[0] === 'select-all-common') {
-          _finalSelectedKeys = [];
+      if (currentKey === "select-all-common") {
+        const allParents = getAllParents(selectedKeys, this.dataListObject);
+        let finalSelectedKeys2 = difference(selectedKeys, allParents);
+        if (finalSelectedKeys2.length === 1 && finalSelectedKeys2[0] === "select-all-common") {
+          finalSelectedKeys2 = [];
         }
-        updatedSelectedKeys = without(_finalSelectedKeys, 'select-all-common');
-        this.setState({
-          selectedKeys: updatedSelectedKeys
-        });
+        updatedSelectedKeys = without(finalSelectedKeys2, "select-all-common");
+        this.setState({ selectedKeys: updatedSelectedKeys });
       } else {
-        var parentKeys = getAllParents([currentKey], this.dataListObject);
+        const parentKeys = getAllParents([currentKey], this.dataListObject);
         if (info.checked) {
           if (parentKeys.length > 0) {
-            var allChildren = getAllChildren(currentKey, this.dataListObject);
-            var _allParents = getAllParents(allChildren, this.dataListObject);
-            var _finalSelectedKeys2 = difference(allChildren, _allParents);
-            updatedSelectedKeys = union(alreadySelectedKeys, _finalSelectedKeys2);
-            this.setState({
-              selectedKeys: union(updatedSelectedKeys, defaultKeys)
-            });
+            const allChildren = getAllChildren(currentKey, this.dataListObject);
+            const allParents = getAllParents(allChildren, this.dataListObject);
+            const finalSelectedKeys2 = difference(allChildren, allParents);
+            updatedSelectedKeys = union(alreadySelectedKeys, finalSelectedKeys2);
+            this.setState({ selectedKeys: union(updatedSelectedKeys, defaultKeys) });
           } else {
             alreadySelectedKeys.push(currentKey);
             updatedSelectedKeys = alreadySelectedKeys;
-            this.setState({
-              selectedKeys: union(updatedSelectedKeys, defaultKeys)
-            });
+            this.setState({ selectedKeys: union(updatedSelectedKeys, defaultKeys) });
           }
         } else if (parentKeys.length > 0) {
-          var _allChildren = getAllChildren(currentKey, this.dataListObject);
-          finalSelectedKeys = difference(alreadySelectedKeys, _allChildren);
+          const allChildren = getAllChildren(currentKey, this.dataListObject);
+          finalSelectedKeys = difference(alreadySelectedKeys, allChildren);
           updatedSelectedKeys = finalSelectedKeys;
-          this.setState({
-            selectedKeys: union(updatedSelectedKeys, defaultKeys)
-          });
+          this.setState({ selectedKeys: union(updatedSelectedKeys, defaultKeys) });
         } else {
           updatedSelectedKeys = without(alreadySelectedKeys, currentKey);
-          this.setState({
-            selectedKeys: union(updatedSelectedKeys, defaultKeys)
-          });
+          this.setState({ selectedKeys: union(updatedSelectedKeys, defaultKeys) });
         }
       }
       return updatedSelectedKeys;
     }
-    var finalSelectedKeys = union(alreadySelectedKeys, clonedSelectedKeys);
-    if (currentKey === 'select-all-common' && !info.checked) {
-      var allValuesInCurrentTree = getDataValuesInTree(treeData, searchValue, searchKey);
+    let finalSelectedKeys = union(alreadySelectedKeys, clonedSelectedKeys);
+    if (currentKey === "select-all-common" && !info.checked) {
+      const allValuesInCurrentTree = getDataValuesInTree(treeData, searchValue, searchKey);
       finalSelectedKeys = difference(finalSelectedKeys, allValuesInCurrentTree);
     } else {
-      var _allParents2 = getAllParents(selectedKeys, this.dataListObject);
-      finalSelectedKeys = difference(finalSelectedKeys, _allParents2);
+      const allParents = getAllParents(selectedKeys, this.dataListObject);
+      finalSelectedKeys = difference(finalSelectedKeys, allParents);
       if (!info.checked) {
         finalSelectedKeys = without(finalSelectedKeys, currentKey);
-        var _allValuesInCurrentTree = getDataValuesInTree(treeData, searchValue, searchKey);
-        var _allChildren2 = getAllChildren(currentKey, this.dataListObject);
-        finalSelectedKeys = difference(finalSelectedKeys, intersection(_allValuesInCurrentTree, _allChildren2));
+        const allValuesInCurrentTree = getDataValuesInTree(treeData, searchValue, searchKey);
+        const allChildren = getAllChildren(currentKey, this.dataListObject);
+        finalSelectedKeys = difference(
+          finalSelectedKeys,
+          intersection(allValuesInCurrentTree, allChildren)
+        );
       }
     }
-    if (finalSelectedKeys.length === 1 && finalSelectedKeys[0] === 'select-all-common') {
+    if (finalSelectedKeys.length === 1 && finalSelectedKeys[0] === "select-all-common") {
       finalSelectedKeys = [];
     }
-    updatedSelectedKeys = without(finalSelectedKeys, 'select-all-common');
-    this.setState({
-      selectedKeys: updatedSelectedKeys
-    });
+    updatedSelectedKeys = without(finalSelectedKeys, "select-all-common");
+    this.setState({ selectedKeys: updatedSelectedKeys });
     return updatedSelectedKeys;
   }
   togglePopoverVisibility(visible) {
-    var {
-      appliedKeys,
-      treeData,
-      expandedKeysHandler
-    } = this.props;
+    const { appliedKeys, treeData, expandedKeysHandler } = this.props;
     this.setState({
       visible
     });
     if (visible) {
-      var expandedKeys = appliedKeys && appliedKeys.length > 0 ? union(getExpandedKeys(appliedKeys, treeData, this.dataList), ['select-all-common']) : ['select-all-common'];
+      const expandedKeys = appliedKeys && appliedKeys.length > 0 ? union(getExpandedKeys(appliedKeys, treeData, this.dataList), ["select-all-common"]) : ["select-all-common"];
       expandedKeysHandler && expandedKeysHandler(expandedKeys);
       this.setState({
         expandedKeys
@@ -526,13 +470,13 @@ class CapMultiSelectWithTree extends React.Component {
     }
   }
   hide() {
-    var {
+    const {
       appliedKeys,
       treeData,
       expandedKeysHandler,
       resetSelectedKeysOnHide = false
     } = this.props;
-    var expandedKeys = appliedKeys && appliedKeys.length > 0 ? union(getExpandedKeys(appliedKeys, treeData, this.dataList), ['select-all-common']) : ['select-all-common'];
+    const expandedKeys = appliedKeys && appliedKeys.length > 0 ? union(getExpandedKeys(appliedKeys, treeData, this.dataList), ["select-all-common"]) : ["select-all-common"];
     expandedKeysHandler && expandedKeysHandler(expandedKeys);
     if (resetSelectedKeysOnHide) {
       this.setState({
@@ -550,52 +494,42 @@ class CapMultiSelectWithTree extends React.Component {
     }
   }
   applySelect() {
-    var {
-      treeData,
-      includeTreeData,
-      expandedKeysHandler
-    } = this.props;
-    var {
-      selectedKeys
-    } = this.state;
-    var formattedKeys = without(selectedKeys, 'select-all-common');
-    treeData.forEach(data => {
+    const { treeData, includeTreeData, expandedKeysHandler } = this.props;
+    const { selectedKeys } = this.state;
+    const formattedKeys = without(selectedKeys, "select-all-common");
+    treeData.forEach((data) => {
       if (this.props.replaceChildrenWithParent) {
-        this.props.replaceChildrenWithParent({
-          data,
-          arr: formattedKeys
-        });
+        this.props.replaceChildrenWithParent({ data, arr: formattedKeys });
       } else {
-        replaceChildrenWithParent({
-          data,
-          arr: formattedKeys
-        });
+        replaceChildrenWithParent({ data, arr: formattedKeys });
       }
     });
-    var expandedKeys = formattedKeys && formattedKeys.length > 0 ? union(getExpandedKeys(formattedKeys, treeData, this.dataList), ['select-all-common']) : ['select-all-common'];
+    const expandedKeys = formattedKeys && formattedKeys.length > 0 ? union(getExpandedKeys(formattedKeys, treeData, this.dataList), ["select-all-common"]) : ["select-all-common"];
     expandedKeysHandler && expandedKeysHandler(expandedKeys);
-    this.setState({
-      visible: false,
-      autoExpandParent: true,
-      expandedKeys
-    }, () => {
-      this.props.onSelect(formattedKeys, includeTreeData && treeData); // passing treeData for a use-case in promo-ui. To be removed going further.
-    });
+    this.setState(
+      {
+        visible: false,
+        autoExpandParent: true,
+        expandedKeys
+      },
+      () => {
+        this.props.onSelect(formattedKeys, includeTreeData && treeData);
+      }
+    );
   }
   generateList(data, parentKey) {
     if (data) {
-      for (var i = 0; i < data.length; i += 1) {
-        var node = data[i];
-        var {
-          key
-        } = node;
-        var obj = _extends({}, node, {
+      for (let i = 0; i < data.length; i += 1) {
+        const node = data[i];
+        const { key } = node;
+        const obj = {
+          ...node,
           parent: parentKey || false,
           children: node.children && node.children.length || 0
-        });
-        var childrenKeys = [];
+        };
+        const childrenKeys = [];
         if (obj.children) {
-          for (var j = 0; j < obj.children; j += 1) {
+          for (let j = 0; j < obj.children; j += 1) {
             childrenKeys.push(node.children[j].key);
           }
         } else {
@@ -611,11 +545,11 @@ class CapMultiSelectWithTree extends React.Component {
     }
   }
   clearSearch() {
-    this.onSearch(null, '');
+    this.onSearch(null, "");
   }
   render() {
-    var _treeDataWithSelectAl;
-    var {
+    var _a, _b;
+    const {
       placeholder,
       searchPlaceholder,
       selectorClassName,
@@ -656,7 +590,7 @@ class CapMultiSelectWithTree extends React.Component {
       hideParentCheckboxes = false,
       showLeafNodeSelectionCount = false
     } = this.props;
-    var {
+    const {
       visible,
       searchValue,
       selectedKeys,
@@ -664,318 +598,319 @@ class CapMultiSelectWithTree extends React.Component {
       autoExpandParent,
       externalSearchValue
     } = this.state;
-    var _this$props = this.props,
-      {
-        treeData
-      } = _this$props,
-      rest = _objectWithoutPropertiesLoose(_this$props, _excluded);
-    var newProps = omit(rest, ['onSelect', 'treeData']);
-
-    // Calculate total selected leaf nodes across all tree data
-    var getTotalSelectedLeafNodes = data => {
+    const { treeData, ...rest } = this.props;
+    const newProps = omit(rest, ["onSelect", "treeData"]);
+    const getTotalSelectedLeafNodes = (data) => {
       return data == null ? void 0 : data.reduce((sum, item) => {
-        if (!(item != null && item.children)) {
+        if (!(item == null ? void 0 : item.children)) {
           return sum + (selectedKeys.includes(item == null ? void 0 : item.key) ? 1 : 0);
         }
         return sum + getTotalSelectedLeafNodes(item == null ? void 0 : item.children);
       }, 0);
     };
-    var treeDataWithSelectAll = [{
-      title: searchValue ? selectAllSearchResultsText : selectAllText,
-      key: 'select-all-common',
-      className: 'select-all-tree',
-      children: treeData
-    }];
-    if (!((_treeDataWithSelectAl = treeDataWithSelectAll[0]) != null && (_treeDataWithSelectAl = _treeDataWithSelectAl.children) != null && _treeDataWithSelectAl.length)) treeDataWithSelectAll = [];
+    let treeDataWithSelectAll = [
+      {
+        title: searchValue ? selectAllSearchResultsText : selectAllText,
+        key: "select-all-common",
+        className: "select-all-tree",
+        children: treeData
+      }
+    ];
+    if (!((_b = (_a = treeDataWithSelectAll[0]) == null ? void 0 : _a.children) == null ? void 0 : _b.length)) treeDataWithSelectAll = [];
     if (isExternalSearch) {
       treeDataWithSelectAll = externalSearchValue ? searchedTreeData : treeData;
     }
-    var triggerLeftContent = '';
-    var triggerRightContent = '';
-    var _selectedValuesTitles = '';
+    let triggerLeftContent = "";
+    let triggerRightContent = "";
+    let _selectedValuesTitles = "";
     if (appliedKeys && appliedKeys.length > 0) {
-      // Getting the titles of selected values to show on hover. Currently implemented for store filter
-      appliedKeyObjects == null || appliedKeyObjects.forEach(value => {
-        _selectedValuesTitles += (value == null ? void 0 : value.title) + ",";
+      appliedKeyObjects == null ? void 0 : appliedKeyObjects.forEach((value) => {
+        _selectedValuesTitles += `${value == null ? void 0 : value.title},`;
       });
       if (!isExternalSearch && appliedKeys.length === this.allChildrenCount) {
-        triggerLeftContent = 'All selected';
+        triggerLeftContent = "All selected";
       } else {
-        var obj = getObject(treeData, 'key', appliedKeys[0]);
+        const obj = getObject(treeData, "key", appliedKeys[0]);
         if (obj) {
           triggerLeftContent = obj.title;
-        }
-        // if 1st id is not present in treeData,
-        // check in appliedKeysObjects(which is array of objects containing ids and labels)
-        else if (getObject(appliedKeyObjects, 'id', appliedKeys[0])) {
-          triggerLeftContent = getObject(appliedKeyObjects, 'id', appliedKeys[0]).title;
+        } else if (getObject(appliedKeyObjects, "id", appliedKeys[0])) {
+          triggerLeftContent = getObject(appliedKeyObjects, "id", appliedKeys[0]).title;
         } else {
-          triggerLeftContent = '';
+          triggerLeftContent = "";
         }
         if (showLeafNodeSelectionCount) {
-          var totalLeafNodesSelected = getTotalSelectedLeafNodes(treeData);
+          const totalLeafNodesSelected = getTotalSelectedLeafNodes(treeData);
           if (totalLeafNodesSelected > 1) {
-            triggerRightContent = "+ " + (totalLeafNodesSelected - 1) + " " + moreText;
+            triggerRightContent = `+ ${totalLeafNodesSelected - 1} ${moreText}`;
           }
         } else {
           if ((appliedKeys == null ? void 0 : appliedKeys.length) > 1) {
-            triggerRightContent = "+ " + ((appliedKeys == null ? void 0 : appliedKeys.length) - 1) + " " + moreText;
+            triggerRightContent = `+ ${(appliedKeys == null ? void 0 : appliedKeys.length) - 1} ${moreText}`;
           }
         }
       }
     }
-    var formattedKeys = without(this.state.selectedKeys, 'select-all-common');
-    treeData.forEach(data => {
+    const formattedKeys = without(this.state.selectedKeys, "select-all-common");
+    treeData.forEach((data) => {
       if (this.props.replaceChildrenWithParent) {
-        this.props.replaceChildrenWithParent({
-          data,
-          arr: formattedKeys
-        });
+        this.props.replaceChildrenWithParent({ data, arr: formattedKeys });
       } else {
-        replaceChildrenWithParent({
-          data,
-          arr: formattedKeys
-        });
+        replaceChildrenWithParent({ data, arr: formattedKeys });
       }
     });
-    var disableApplyButton = isEmpty(selectedKeys) && isEmpty(appliedKeys) || minValuesToSelect && formattedKeys.length < minValuesToSelect || maxValuesToSelect && formattedKeys.length > maxValuesToSelect;
-    var popwidth = this.node ? this.node.offsetWidth + "px" : '100%';
-    var currentCheckedKeys = [...selectedKeys];
-    var currentValues = getDataValuesInTree(treeDataWithSelectAll, searchValue, searchKey);
+    const disableApplyButton = isEmpty(selectedKeys) && isEmpty(appliedKeys) || minValuesToSelect && formattedKeys.length < minValuesToSelect || maxValuesToSelect && formattedKeys.length > maxValuesToSelect;
+    const popwidth = this.node ? `${this.node.offsetWidth}px` : "100%";
+    let currentCheckedKeys = [...selectedKeys];
+    const currentValues = getDataValuesInTree(treeDataWithSelectAll, searchValue, searchKey);
     currentCheckedKeys = intersection(currentCheckedKeys, currentValues);
-    var totalSelectedLeafNodes = getTotalSelectedLeafNodes(treeData);
-    var treeNodes = this.renderTreeNodes(treeDataWithSelectAll, searchValue, searchKey, null, null, currentCheckedKeys);
-    var appliedKeyMap = {};
-    var disableSelectFilterButton = true;
-    appliedKeys.forEach(appliedKey => {
+    const totalSelectedLeafNodes = getTotalSelectedLeafNodes(treeData);
+    const treeNodes = this.renderTreeNodes(
+      treeDataWithSelectAll,
+      searchValue,
+      searchKey,
+      null,
+      null,
+      currentCheckedKeys
+    );
+    const appliedKeyMap = {};
+    let disableSelectFilterButton = true;
+    appliedKeys.forEach((appliedKey) => {
       appliedKeyMap[appliedKey] = true;
     });
-    for (var i = 0; i < selectedKeys.length; i++) {
+    for (let i = 0; i < selectedKeys.length; i++) {
       if (!appliedKeyMap[selectedKeys[i]]) {
         disableSelectFilterButton = false;
         break;
       }
     }
     disableSelectFilterButton = isEmpty(selectedKeys) && isEmpty(appliedKeys) || selectedKeys.length === appliedKeys.length && disableSelectFilterButton || maxValuesToSelect && selectedKeys.length > maxValuesToSelect || minValuesToSelect && selectedKeys.length < minValuesToSelect;
-    return /*#__PURE__*/_jsx(CapTooltip, {
-      overlayClassName: "tooltip",
-      title: isStoreFilter && hasStoreUploaded && storeUploadsText,
-      children: /*#__PURE__*/_jsx("div", {
-        className: classNames(clsPrefix),
-        children: /*#__PURE__*/_jsx(Popover, {
-          visible: !disabled && visible,
-          onVisibleChange: this.togglePopoverVisibility,
-          trigger: "click",
-          overlayClassName: classNames(clsPrefix + "-popover", popoverClassName, {
-            'select-all-disabled': disableSelectAll,
-            'hide-parent-checkboxes': hideParentCheckboxes
-          }),
-          overlayStyle: {
-            width: popwidth
-          },
-          placement: "bottom",
-          onClick: this.onPopoverClick,
-          getPopupContainer: getPopupContainer,
-          content: showLoader ? /*#__PURE__*/_jsx("div", {
-            className: "showing-spinner",
-            children: /*#__PURE__*/_jsx(Spin, {})
-          }) : /*#__PURE__*/_jsxs("div", {
-            children: [!disableSearch && /*#__PURE__*/_jsx("div", {
-              className: "search-input",
-              children: /*#__PURE__*/_jsx(Search, {
-                focusOnMount: true,
-                alwaysShowFocus: true,
-                value: isExternalSearch ? externalSearchValue : searchValue,
-                onClear: this.clearSearch,
-                placeholder: searchPlaceholder,
-                onChange: enableDebouncedSearch ? this.onDebouncedSearch : this.onSearch
-              })
-            }), externalSearchValue && showProductSearchLoader ? /*#__PURE__*/_jsx("div", {
-              className: "showing-spinner",
-              style: {
-                marginTop: '72px'
-              },
-              children: /*#__PURE__*/_jsx(Spin, {})
-            }) : /*#__PURE__*/_jsxs(_Fragment, {
-              children: [' ', isStoreFilter && isExternalSearch && (externalSearchValue == null ? void 0 : externalSearchValue.length) < 3 ? this.getStoreHelPTextMessage(helpTextMsg == null ? void 0 : helpTextMsg.instructionMessage, classNames(clsPrefix + "-no-results")) : treeNodes && treeNodes.length > 0 && /*#__PURE__*/_jsx(Tree, _extends({
-                checkable: true,
-                onCheck: (keys, info) => {
-                  var finalSelectedKeys = this.onCheck(keys, info);
-                  this.props.onChange && this.props.onChange(finalSelectedKeys, info);
-                },
-                checkedKeys: currentCheckedKeys,
-                selectedKeys: currentCheckedKeys,
-                multiple: true,
-                onExpand: this.onExpand,
-                expandedKeys: expandedKeys,
-                autoExpandParent: autoExpandParent
-              }, newProps, {
-                children: treeNodes
-              })), !(treeNodes && treeNodes.length > 0) && /*#__PURE__*/_jsxs("div", {
-                className: classNames(clsPrefix + "-no-results"),
-                children: [isStoreFilter && ((searchValue == null ? void 0 : searchValue.length) > 2 || externalSearchValue.length > 2) && this.getStoreHelPTextMessage(helpTextMsg == null ? void 0 : helpTextMsg.infoMessage), !isStoreFilter && /*#__PURE__*/_jsxs(_Fragment, {
-                  children: [/*#__PURE__*/_jsx(CapIcon, {
-                    style: {
-                      color: styledVars.CAP_G06
+    return /* @__PURE__ */ jsx(
+      CapTooltip,
+      {
+        overlayClassName: "tooltip",
+        title: isStoreFilter && hasStoreUploaded && storeUploadsText,
+        children: /* @__PURE__ */ jsx("div", { className: classNames(clsPrefix), children: /* @__PURE__ */ jsx(
+          Popover,
+          {
+            visible: !disabled && visible,
+            onVisibleChange: this.togglePopoverVisibility,
+            trigger: "click",
+            overlayClassName: classNames(`${clsPrefix}-popover`, popoverClassName, {
+              "select-all-disabled": disableSelectAll,
+              "hide-parent-checkboxes": hideParentCheckboxes
+            }),
+            overlayStyle: { width: popwidth },
+            placement: "bottom",
+            onClick: this.onPopoverClick,
+            getPopupContainer,
+            content: showLoader ? /* @__PURE__ */ jsx("div", { className: "showing-spinner", children: /* @__PURE__ */ jsx(Spin, {}) }) : /* @__PURE__ */ jsxs("div", { children: [
+              !disableSearch && /* @__PURE__ */ jsx("div", { className: "search-input", children: /* @__PURE__ */ jsx(
+                Search,
+                {
+                  focusOnMount: true,
+                  alwaysShowFocus: true,
+                  value: isExternalSearch ? externalSearchValue : searchValue,
+                  onClear: this.clearSearch,
+                  placeholder: searchPlaceholder,
+                  onChange: enableDebouncedSearch ? this.onDebouncedSearch : this.onSearch
+                }
+              ) }),
+              externalSearchValue && showProductSearchLoader ? /* @__PURE__ */ jsx("div", { className: "showing-spinner", style: { marginTop: "72px" }, children: /* @__PURE__ */ jsx(Spin, {}) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                " ",
+                isStoreFilter && isExternalSearch && (externalSearchValue == null ? void 0 : externalSearchValue.length) < 3 ? this.getStoreHelPTextMessage(
+                  helpTextMsg == null ? void 0 : helpTextMsg.instructionMessage,
+                  classNames(`${clsPrefix}-no-results`)
+                ) : treeNodes && treeNodes.length > 0 && /* @__PURE__ */ jsx(
+                  Tree,
+                  {
+                    checkable: true,
+                    onCheck: (keys, info) => {
+                      const finalSelectedKeys = this.onCheck(keys, info);
+                      this.props.onChange && this.props.onChange(finalSelectedKeys, info);
+                    },
+                    checkedKeys: currentCheckedKeys,
+                    selectedKeys: currentCheckedKeys,
+                    multiple: true,
+                    onExpand: this.onExpand,
+                    expandedKeys,
+                    autoExpandParent,
+                    ...newProps,
+                    children: treeNodes
+                  }
+                ),
+                !(treeNodes && treeNodes.length > 0) && /* @__PURE__ */ jsxs("div", { className: classNames(`${clsPrefix}-no-results`), children: [
+                  isStoreFilter && ((searchValue == null ? void 0 : searchValue.length) > 2 || externalSearchValue.length > 2) && this.getStoreHelPTextMessage(helpTextMsg == null ? void 0 : helpTextMsg.infoMessage),
+                  !isStoreFilter && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(CapIcon, { style: { color: CAP_G06 }, type: "alert" }),
+                    /* @__PURE__ */ jsx("div", { className: classNames(`${clsPrefix}-no-results-text`), children: noResultsFoundText })
+                  ] })
+                ] }),
+                this.props.showClearAll ? /* @__PURE__ */ jsx("div", { className: "clear-all", children: /* @__PURE__ */ jsx("span", { onClick: this.props.onClearAll, children: this.props.clearAllText }) }) : /* @__PURE__ */ jsx(Fragment, {}),
+                this.props.showSelect && /* @__PURE__ */ jsx(Fragment, { children: formattedKeys.length > 0 ? /* @__PURE__ */ jsx(
+                  CapButton,
+                  {
+                    type: "primary",
+                    className: "select-dropdown",
+                    disabled: disableSelectFilterButton,
+                    onClick: () => {
+                      this.props.onSelect();
+                      this.hide();
+                    },
+                    children: this.props.selectText
+                  }
+                ) : /* @__PURE__ */ jsx(
+                  CapTooltip,
+                  {
+                    placement: "bottom",
+                    title: this.props.disableSelectTooltipMessage,
+                    children: /* @__PURE__ */ jsx("span", { className: "button-disabled-tooltip-wrapper", children: /* @__PURE__ */ jsx(
+                      CapButton,
+                      {
+                        type: "primary",
+                        className: "select-dropdown",
+                        disabled: disableSelectFilterButton,
+                        onClick: () => {
+                          this.props.onSelect();
+                          this.hide();
+                        },
+                        children: this.props.selectText
+                      }
+                    ) })
+                  }
+                ) }),
+                this.props.showClose ? /* @__PURE__ */ jsx(
+                  CapButton,
+                  {
+                    type: "default",
+                    onClick: () => {
+                      this.props.onClose();
+                      this.hide();
                     },
-                    type: "alert"
-                  }), /*#__PURE__*/_jsx("div", {
-                    className: classNames(clsPrefix + "-no-results-text"),
-                    children: noResultsFoundText
-                  })]
-                })]
-              }), this.props.showClearAll ? /*#__PURE__*/_jsx("div", {
-                className: "clear-all",
-                children: /*#__PURE__*/_jsx("span", {
-                  onClick: this.props.onClearAll,
-                  children: this.props.clearAllText
-                })
-              }) : /*#__PURE__*/_jsx(_Fragment, {}), this.props.showSelect && /*#__PURE__*/_jsx(_Fragment, {
-                children: formattedKeys.length > 0 ? /*#__PURE__*/_jsx(CapButton, {
-                  type: "primary",
-                  className: "select-dropdown",
-                  disabled: disableSelectFilterButton,
-                  onClick: () => {
-                    this.props.onSelect();
-                    this.hide();
-                  },
-                  children: this.props.selectText
-                }) : /*#__PURE__*/_jsx(CapTooltip, {
-                  placement: "bottom",
-                  title: this.props.disableSelectTooltipMessage,
-                  children: /*#__PURE__*/_jsx("span", {
-                    className: "button-disabled-tooltip-wrapper",
-                    children: /*#__PURE__*/_jsx(CapButton, {
+                    children: this.props.closeText
+                  }
+                ) : /* @__PURE__ */ jsx(Fragment, {})
+              ] }),
+              treeNodes && treeNodes.length > 0 && /* @__PURE__ */ jsxs("div", { className: "options", children: [
+                /* @__PURE__ */ jsxs("div", { children: [
+                  showSelectButtonToolTip && formattedKeys.length > maxValuesToSelect ? /* @__PURE__ */ jsx(
+                    Popover,
+                    {
+                      placement: "topLeft",
+                      content: selectTooltipText,
+                      overlayClassName: "select-button-popover",
+                      children: /* @__PURE__ */ jsx(
+                        CapButton,
+                        {
+                          className: `${width && width < "260px" && "small-button"}`,
+                          type: "primary",
+                          onClick: this.applySelect,
+                          disabled: disableApplyButton,
+                          children: selectText
+                        }
+                      )
+                    }
+                  ) : /* @__PURE__ */ jsx(
+                    CapButton,
+                    {
+                      className: classNames({
+                        "small-button": width && width < "260px"
+                      }),
                       type: "primary",
-                      className: "select-dropdown",
-                      disabled: disableSelectFilterButton,
+                      onClick: this.applySelect,
+                      disabled: disableApplyButton,
+                      children: selectText
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    CapButton,
+                    {
+                      className: classNames("cancel-button", {
+                        "small-button": width && width < "260px"
+                      }),
+                      type: "flat",
                       onClick: () => {
-                        this.props.onSelect();
+                        this.props.onClose();
                         this.hide();
                       },
-                      children: this.props.selectText
-                    })
-                  })
-                })
-              }), this.props.showClose ? /*#__PURE__*/_jsx(CapButton, {
-                type: "default",
-                onClick: () => {
-                  this.props.onClose();
-                  this.hide();
-                },
-                children: this.props.closeText
-              }) : /*#__PURE__*/_jsx(_Fragment, {})]
-            }), treeNodes && treeNodes.length > 0 && /*#__PURE__*/_jsxs("div", {
-              className: "options",
-              children: [/*#__PURE__*/_jsxs("div", {
-                children: [showSelectButtonToolTip && formattedKeys.length > maxValuesToSelect ? /*#__PURE__*/_jsx(Popover, {
-                  placement: "topLeft",
-                  content: selectTooltipText,
-                  overlayClassName: "select-button-popover",
-                  children: /*#__PURE__*/_jsx(CapButton, {
-                    className: "" + (width && width < '260px' && 'small-button'),
-                    type: "primary",
-                    onClick: this.applySelect,
-                    disabled: disableApplyButton,
-                    children: selectText
-                  })
-                }) : /*#__PURE__*/_jsx(CapButton, {
-                  className: classNames({
-                    'small-button': width && width < '260px'
-                  }),
-                  type: "primary",
-                  onClick: this.applySelect,
-                  disabled: disableApplyButton,
-                  children: selectText
-                }), /*#__PURE__*/_jsx(CapButton, {
-                  className: classNames('cancel-button', {
-                    'small-button': width && width < '260px'
-                  }),
-                  type: "flat",
-                  onClick: () => {
-                    this.props.onClose();
-                    this.hide();
-                  },
-                  children: closeText
-                })]
-              }), /*#__PURE__*/_jsx("div", {
-                style: {
-                  display: 'flex',
-                  alignItems: 'center'
+                      children: closeText
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    style: {
+                      fontSize: "12px"
+                      // color: disableSelectFilterButton
+                      //   ? "#F34F56"
+                      //   : "#333333",
+                    },
+                    children: showLeafNodeSelectionCount ? `${totalSelectedLeafNodes} ${selectedText}` : disableParentCategorySelection ? `${formattedKeys && formattedKeys.length}/${maxValuesToSelect} ${selectedText}` : `${formattedKeys && formattedKeys.length} ${selectedText}`
+                  }
+                ) })
+              ] })
+            ] }),
+            children: /* @__PURE__ */ jsxs(
+              "div",
+              {
+                ref: (node) => {
+                  this.node = node;
                 },
-                children: /*#__PURE__*/_jsx("span", {
-                  style: {
-                    fontSize: '12px'
-                    // color: disableSelectFilterButton
-                    //   ? "#F34F56"
-                    //   : "#333333",
-                  },
-                  children: showLeafNodeSelectionCount ? totalSelectedLeafNodes + " " + selectedText : disableParentCategorySelection ? (formattedKeys && formattedKeys.length) + "/" + maxValuesToSelect + " " + selectedText : (formattedKeys && formattedKeys.length) + " " + selectedText
-                })
-              })]
-            })]
-          }),
-          children: /*#__PURE__*/_jsxs("div", {
-            ref: node => {
-              this.node = node;
-            },
-            style: {
-              width: width || '100%'
-            },
-            className: classNames(clsPrefix + "-selection", selectorClassName, {
-              selected: triggerLeftContent,
-              open: visible && !disabled,
-              triggerClassName,
-              disabled
-            }),
-            children: [/*#__PURE__*/_jsx("span", {
-              className: classNames(clsPrefix + "-left-content", {
-                placeholder: title || !triggerLeftContent,
-                disabled
-              }),
-              title: triggerLeftContent,
-              children: isStoreFilter || isSupplementaryProgram ? /*#__PURE__*/_jsx(CapTooltip, {
-                placement: "bottom",
-                title: this.getSelectedValuesTitles(appliedKeyObjects),
-                children: title || triggerLeftContent || placeholder
-              }) : title || triggerLeftContent || placeholder
-            }), showSelectedFilterCount ? /*#__PURE__*/_jsx("span", {
-              className: "items-selected",
-              children: appliedKeys.length > 0 && /*#__PURE__*/_jsx("div", {
-                className: clsPrefix + "-items-selected",
-                children: appliedKeys.length
-              })
-            }) : /*#__PURE__*/_jsx(_Fragment, {}), /*#__PURE__*/_jsxs("span", {
-              style: {
-                display: 'inline-flex',
-                alignItems: 'center'
-              },
-              children: [isStoreFilter || isSupplementaryProgram ? /*#__PURE__*/_jsx(CapTooltip, {
-                placement: "bottom",
-                title: this.getSelectedValuesTitles(appliedKeyObjects),
-                children: title ? '' : triggerRightContent
-              }) : title ? '' : triggerRightContent, disabled ? /*#__PURE__*/_jsx(CapIcon, {
-                type: "chevron-down",
-                style: {
-                  color: styledVars.CAP_G06
-                }
-              }) : /*#__PURE__*/_jsx(CapIcon, {
-                type: "chevron-down"
-              })]
-            })]
-          })
-        })
-      })
-    });
+                style: { width: width || "100%" },
+                className: classNames(`${clsPrefix}-selection`, selectorClassName, {
+                  selected: triggerLeftContent,
+                  open: visible && !disabled,
+                  triggerClassName,
+                  disabled
+                }),
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: classNames(`${clsPrefix}-left-content`, {
+                        placeholder: title || !triggerLeftContent,
+                        disabled
+                      }),
+                      title: triggerLeftContent,
+                      children: isStoreFilter || isSupplementaryProgram ? /* @__PURE__ */ jsx(
+                        CapTooltip,
+                        {
+                          placement: "bottom",
+                          title: this.getSelectedValuesTitles(appliedKeyObjects),
+                          children: title || triggerLeftContent || placeholder
+                        }
+                      ) : title || triggerLeftContent || placeholder
+                    }
+                  ),
+                  showSelectedFilterCount ? /* @__PURE__ */ jsx("span", { className: "items-selected", children: appliedKeys.length > 0 && /* @__PURE__ */ jsx("div", { className: `${clsPrefix}-items-selected`, children: appliedKeys.length }) }) : /* @__PURE__ */ jsx(Fragment, {}),
+                  /* @__PURE__ */ jsxs("span", { style: { display: "inline-flex", alignItems: "center" }, children: [
+                    isStoreFilter || isSupplementaryProgram ? /* @__PURE__ */ jsx(
+                      CapTooltip,
+                      {
+                        placement: "bottom",
+                        title: this.getSelectedValuesTitles(appliedKeyObjects),
+                        children: title ? "" : triggerRightContent
+                      }
+                    ) : title ? "" : triggerRightContent,
+                    disabled ? /* @__PURE__ */ jsx(CapIcon, { type: "chevron-down", style: { color: CAP_G06 } }) : /* @__PURE__ */ jsx(CapIcon, { type: "chevron-down" })
+                  ] })
+                ]
+              }
+            )
+          }
+        ) })
+      }
+    );
   }
 }
 CapMultiSelectWithTree.defaultProps = {
-  searchKey: 'title',
+  searchKey: "title",
   getPopupContainer: () => document.body,
   showSelectButtonToolTip: false,
   appliedKeys: [],
   searchedTreeData: [],
-  onClose: () => {}
+  onClose: () => {
+  }
 };
 CapMultiSelectWithTree.propTypes = {
   onSelect: PropTypes.func,
@@ -1033,6 +968,9 @@ CapMultiSelectWithTree.propTypes = {
   showLeafNodeSelectionCount: PropTypes.bool,
   resetSelectedKeysOnHide: PropTypes.bool
 };
-export default LocaleHoc(CapMultiSelectWithTree, {
-  key: 'CapMultiSelectWithTree'
-});
+const CapMultiSelectWithTree$1 = LocaleHoc(CapMultiSelectWithTree, {
+  key: "CapMultiSelectWithTree"
+});
+export {
+  CapMultiSelectWithTree$1 as default
+};