funda-ui 3.8.821 → 3.9.14

package/Tree/index.js

@@ -11,433 +11,6 @@
 return /******/ (() => { // webpackBootstrap
 /******/ 	var __webpack_modules__ = ({
 
-/***/ 109:
-/***/ (function(module, exports, __webpack_require__) {
-
-/* module decorator */ module = __webpack_require__.nmd(module);
-var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;function _typeof2(obj) { "@babel/helpers - typeof"; return _typeof2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof2(obj); }
-(function webpackUniversalModuleDefinition(root, factory) {
-  if (( false ? 0 : _typeof2(exports)) === 'object' && ( false ? 0 : _typeof2(module)) === 'object') module.exports = factory(__webpack_require__(787));else if (true) !(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__(787)], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
-		__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
-		(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),
-		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));else {}
-})(this, function (__WEBPACK_EXTERNAL_MODULE__787__) {
-  return (/******/function () {
-      // webpackBootstrap
-      /******/
-      "use strict";
-
-      /******/
-      var __webpack_modules__ = {
-        /***/787: /***/function _(module) {
-          module.exports = __WEBPACK_EXTERNAL_MODULE__787__;
-
-          /***/
-        }
-
-        /******/
-      };
-      /************************************************************************/
-      /******/ // The module cache
-      /******/
-      var __webpack_module_cache__ = {};
-      /******/
-      /******/ // The require function
-      /******/
-      function __nested_webpack_require_1471__(moduleId) {
-        /******/ // Check if module is in cache
-        /******/var cachedModule = __webpack_module_cache__[moduleId];
-        /******/
-        if (cachedModule !== undefined) {
-          /******/return cachedModule.exports;
-          /******/
-        }
-        /******/ // Create a new module (and put it into the cache)
-        /******/
-        var module = __webpack_module_cache__[moduleId] = {
-          /******/ // no module.id needed
-          /******/ // no module.loaded needed
-          /******/exports: {}
-          /******/
-        };
-        /******/
-        /******/ // Execute the module function
-        /******/
-        __webpack_modules__[moduleId](module, module.exports, __nested_webpack_require_1471__);
-        /******/
-        /******/ // Return the exports of the module
-        /******/
-        return module.exports;
-        /******/
-      }
-      /******/
-      /************************************************************************/
-      /******/ /* webpack/runtime/compat get default export */
-      /******/
-      (function () {
-        /******/ // getDefaultExport function for compatibility with non-harmony modules
-        /******/__nested_webpack_require_1471__.n = function (module) {
-          /******/var getter = module && module.__esModule ? /******/function () {
-            return module['default'];
-          } : /******/function () {
-            return module;
-          };
-          /******/
-          __nested_webpack_require_1471__.d(getter, {
-            a: getter
-          });
-          /******/
-          return getter;
-          /******/
-        };
-        /******/
-      })();
-      /******/
-      /******/ /* webpack/runtime/define property getters */
-      /******/
-      (function () {
-        /******/ // define getter functions for harmony exports
-        /******/__nested_webpack_require_1471__.d = function (exports, definition) {
-          /******/for (var key in definition) {
-            /******/if (__nested_webpack_require_1471__.o(definition, key) && !__nested_webpack_require_1471__.o(exports, key)) {
-              /******/Object.defineProperty(exports, key, {
-                enumerable: true,
-                get: definition[key]
-              });
-              /******/
-            }
-            /******/
-          }
-          /******/
-        };
-        /******/
-      })();
-      /******/
-      /******/ /* webpack/runtime/hasOwnProperty shorthand */
-      /******/
-      (function () {
-        /******/__nested_webpack_require_1471__.o = function (obj, prop) {
-          return Object.prototype.hasOwnProperty.call(obj, prop);
-        };
-        /******/
-      })();
-      /******/
-      /******/ /* webpack/runtime/make namespace object */
-      /******/
-      (function () {
-        /******/ // define __esModule on exports
-        /******/__nested_webpack_require_1471__.r = function (exports) {
-          /******/if (typeof Symbol !== 'undefined' && Symbol.toStringTag) {
-            /******/Object.defineProperty(exports, Symbol.toStringTag, {
-              value: 'Module'
-            });
-            /******/
-          }
-          /******/
-          Object.defineProperty(exports, '__esModule', {
-            value: true
-          });
-          /******/
-        };
-        /******/
-      })();
-      /******/
-      /************************************************************************/
-      var __webpack_exports__ = {};
-      // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
-      (function () {
-        __nested_webpack_require_1471__.r(__webpack_exports__);
-        /* harmony export */
-        __nested_webpack_require_1471__.d(__webpack_exports__, {
-          /* harmony export */"default": function _default() {
-            return __WEBPACK_DEFAULT_EXPORT__;
-          }
-          /* harmony export */
-        });
-        /* harmony import */
-        var react__WEBPACK_IMPORTED_MODULE_0__ = __nested_webpack_require_1471__(787);
-        /* harmony import */
-        var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__nested_webpack_require_1471__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-        function _typeof(obj) {
-          "@babel/helpers - typeof";
-
-          return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
-            return typeof obj;
-          } : function (obj) {
-            return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
-          }, _typeof(obj);
-        }
-        var _excluded = ["wrapperClassName", "itemSelectedClassName", "disabled", "required", "value", "label", "name", "id", "checked", "indeterminate", "style", "tabIndex", "onChange", "onBlur", "onFocus"];
-        function _extends() {
-          _extends = Object.assign ? Object.assign.bind() : function (target) {
-            for (var i = 1; i < arguments.length; i++) {
-              var source = arguments[i];
-              for (var key in source) {
-                if (Object.prototype.hasOwnProperty.call(source, key)) {
-                  target[key] = source[key];
-                }
-              }
-            }
-            return target;
-          };
-          return _extends.apply(this, arguments);
-        }
-        function ownKeys(object, enumerableOnly) {
-          var keys = Object.keys(object);
-          if (Object.getOwnPropertySymbols) {
-            var symbols = Object.getOwnPropertySymbols(object);
-            enumerableOnly && (symbols = symbols.filter(function (sym) {
-              return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            })), keys.push.apply(keys, symbols);
-          }
-          return keys;
-        }
-        function _objectSpread(target) {
-          for (var i = 1; i < arguments.length; i++) {
-            var source = null != arguments[i] ? arguments[i] : {};
-            i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
-              _defineProperty(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;
-        }
-        function _defineProperty(obj, key, value) {
-          key = _toPropertyKey(key);
-          if (key in obj) {
-            Object.defineProperty(obj, key, {
-              value: value,
-              enumerable: true,
-              configurable: true,
-              writable: true
-            });
-          } else {
-            obj[key] = value;
-          }
-          return obj;
-        }
-        function _toPropertyKey(arg) {
-          var key = _toPrimitive(arg, "string");
-          return _typeof(key) === "symbol" ? key : String(key);
-        }
-        function _toPrimitive(input, hint) {
-          if (_typeof(input) !== "object" || input === null) return input;
-          var prim = input[Symbol.toPrimitive];
-          if (prim !== undefined) {
-            var res = prim.call(input, hint || "default");
-            if (_typeof(res) !== "object") return res;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-          }
-          return (hint === "string" ? String : Number)(input);
-        }
-        function _slicedToArray(arr, i) {
-          return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
-        }
-        function _nonIterableRest() {
-          throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-        }
-        function _unsupportedIterableToArray(o, minLen) {
-          if (!o) return;
-          if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-          var n = Object.prototype.toString.call(o).slice(8, -1);
-          if (n === "Object" && o.constructor) n = o.constructor.name;
-          if (n === "Map" || n === "Set") return Array.from(o);
-          if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-        }
-        function _arrayLikeToArray(arr, len) {
-          if (len == null || len > arr.length) len = arr.length;
-          for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-          return arr2;
-        }
-        function _iterableToArrayLimit(arr, i) {
-          var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
-          if (null != _i) {
-            var _s,
-              _e,
-              _x,
-              _r,
-              _arr = [],
-              _n = !0,
-              _d = !1;
-            try {
-              if (_x = (_i = _i.call(arr)).next, 0 === i) {
-                if (Object(_i) !== _i) return;
-                _n = !1;
-              } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
-            } catch (err) {
-              _d = !0, _e = err;
-            } finally {
-              try {
-                if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
-              } finally {
-                if (_d) throw _e;
-              }
-            }
-            return _arr;
-          }
-        }
-        function _arrayWithHoles(arr) {
-          if (Array.isArray(arr)) return arr;
-        }
-        function _objectWithoutProperties(source, excluded) {
-          if (source == null) return {};
-          var target = _objectWithoutPropertiesLoose(source, excluded);
-          var key, i;
-          if (Object.getOwnPropertySymbols) {
-            var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-            for (i = 0; i < sourceSymbolKeys.length; i++) {
-              key = sourceSymbolKeys[i];
-              if (excluded.indexOf(key) >= 0) continue;
-              if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-              target[key] = source[key];
-            }
-          }
-          return target;
-        }
-        function _objectWithoutPropertiesLoose(source, excluded) {
-          if (source == null) return {};
-          var target = {};
-          var sourceKeys = Object.keys(source);
-          var key, i;
-          for (i = 0; i < sourceKeys.length; i++) {
-            key = sourceKeys[i];
-            if (excluded.indexOf(key) >= 0) continue;
-            target[key] = source[key];
-          }
-          return target;
-        }
-        var Checkbox = /*#__PURE__*/(0, react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(function (props, _ref) {
-          var wrapperClassName = props.wrapperClassName,
-            itemSelectedClassName = props.itemSelectedClassName,
-            disabled = props.disabled,
-            required = props.required,
-            value = props.value,
-            label = props.label,
-            name = props.name,
-            id = props.id,
-            checked = props.checked,
-            indeterminate = props.indeterminate,
-            style = props.style,
-            tabIndex = props.tabIndex,
-            onChange = props.onChange,
-            onBlur = props.onBlur,
-            onFocus = props.onFocus,
-            attributes = _objectWithoutProperties(props, _excluded);
-          var uniqueID = (0, react__WEBPACK_IMPORTED_MODULE_0__.useId)();
-          var idRes = id || uniqueID;
-          var rootRef = (0, react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
-          var valRef = (0, react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
-          var _useState = (0, react__WEBPACK_IMPORTED_MODULE_0__.useState)( false || false),
-            _useState2 = _slicedToArray(_useState, 2),
-            val = _useState2[0],
-            setVal = _useState2[1]; // Avoid the error "react checkbox changing an uncontrolled input to be controlled"
-
-          function handleFocus(event) {
-            var _rootRef$current;
-            (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.classList.add('focus');
-
-            //
-            onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
-          }
-          function handleChange(event) {
-            var _rootRef$current2;
-            var _val = event.target.checked;
-            setVal(_val);
-
-            //----
-            //remove focus style
-            (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
-
-            //
-            if (typeof onChange === 'function') {
-              onChange(event, _val);
-            }
-          }
-          function handleBlur(event) {
-            var _rootRef$current3;
-            //----
-            //remove focus style
-            (_rootRef$current3 = rootRef.current) === null || _rootRef$current3 === void 0 ? void 0 : _rootRef$current3.classList.remove('focus');
-
-            //
-            onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
-          }
-          (0, react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
-            // default value
-            setVal(checked);
-
-            // Set a checkbox to indeterminate state
-            if (typeof indeterminate !== 'undefined') {
-              valRef.current.indeterminate = indeterminate;
-            }
-          }, [checked, indeterminate]);
-          return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react__WEBPACK_IMPORTED_MODULE_0___default().Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
-            className: "".concat(wrapperClassName || wrapperClassName === '' ? wrapperClassName : "mb-3 position-relative", " ").concat(val ? itemSelectedClassName || 'item-selected' : ''),
-            ref: rootRef
-          }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
-            className: "form-check"
-          }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("input", _extends({
-            ref: function ref(node) {
-              valRef.current = node;
-              if (typeof _ref === 'function') {
-                _ref(node);
-              } else if (_ref) {
-                _ref.current = node;
-              }
-            },
-            tabIndex: tabIndex || 0,
-            type: "checkbox",
-            className: "form-check-input",
-            id: "label-".concat(idRes)
-
-            // Don't use "name", it's just a container to display the label
-            ,
-
-            "data-name": name !== null && name !== void 0 && name.match(/(\[.*?\])/gi) ? "".concat(name.split('[')[0], "-label[]") : "".concat(name, "-label"),
-            "data-checkbox": true,
-            "data-checked": val,
-            disabled: disabled || null,
-            required: required || null,
-            onChange: handleChange,
-            onFocus: handleFocus,
-            onBlur: handleBlur,
-            defaultValue: value || '',
-            checked: val // component status will not change if defaultChecked is used
-            ,
-
-            style: _objectSpread({
-              cursor: 'pointer'
-            }, style)
-          }, attributes)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("input", _extends({
-            type: "hidden",
-            id: idRes,
-            name: name,
-            value: val ? value || '' : '' // do not use `defaultValue`
-          }, attributes)), label ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react__WEBPACK_IMPORTED_MODULE_0___default().Fragment, null, typeof label === 'string' ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", {
-            htmlFor: "label-".concat(idRes),
-            className: "form-check-label",
-            dangerouslySetInnerHTML: {
-              __html: "".concat(label)
-            }
-          }) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", {
-            htmlFor: "label-".concat(idRes),
-            className: "form-check-label"
-          }, label)) : null)));
-        });
-        /* harmony default export */
-        var __WEBPACK_DEFAULT_EXPORT__ = Checkbox;
-      })();
-
-      /******/
-      return __webpack_exports__;
-      /******/
-    }()
-  );
-});
-
-/***/ }),
-
 /***/ 426:
 /***/ ((module) => {
 
@@ -567,16 +140,13 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__787__;
 /******/ 		}
 /******/ 		// Create a new module (and put it into the cache)
 /******/ 		var module = __webpack_module_cache__[moduleId] = {
-/******/ 			id: moduleId,
-/******/ 			loaded: false,
+/******/ 			// no module.id needed
+/******/ 			// no module.loaded needed
 /******/ 			exports: {}
 /******/ 		};
 /******/ 	
 /******/ 		// Execute the module function
-/******/ 		__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-/******/ 	
-/******/ 		// Flag the module as loaded
-/******/ 		module.loaded = true;
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
 /******/ 	
 /******/ 		// Return the exports of the module
 /******/ 		return module.exports;
@@ -623,15 +193,6 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__787__;
 /******/ 		};
 /******/ 	})();
 /******/ 	
-/******/ 	/* webpack/runtime/node module decorator */
-/******/ 	(() => {
-/******/ 		__webpack_require__.nmd = (module) => {
-/******/ 			module.paths = [];
-/******/ 			if (!module.children) module.children = [];
-/******/ 			return module;
-/******/ 		};
-/******/ 	})();
-/******/ 	
 /************************************************************************/
 var __webpack_exports__ = {};
 // This entry need to be wrapped in an IIFE because it need to be in strict mode.
@@ -648,9 +209,6 @@ __webpack_require__.d(__webpack_exports__, {
 // EXTERNAL MODULE: external {"root":"React","commonjs2":"react","commonjs":"react","amd":"react"}
 var external_root_React_commonjs2_react_commonjs_react_amd_react_ = __webpack_require__(787);
 var external_root_React_commonjs2_react_commonjs_react_amd_react_default = /*#__PURE__*/__webpack_require__.n(external_root_React_commonjs2_react_commonjs_react_amd_react_);
-// EXTERNAL MODULE: ../Checkbox/dist/cjs/index.js
-var cjs = __webpack_require__(109);
-var cjs_default = /*#__PURE__*/__webpack_require__.n(cjs);
 // EXTERNAL MODULE: ./src/utils/dom.js
 var dom = __webpack_require__(426);
 ;// CONCATENATED MODULE: ./src/init-height.tsx
@@ -692,6 +250,57 @@ var initAsyncItems = /*#__PURE__*/function () {
   };
 }();
 
+;// CONCATENATED MODULE: ./src/tree-utils.ts
+function tree_utils_typeof(obj) { "@babel/helpers - typeof"; return tree_utils_typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, tree_utils_typeof(obj); }
+var removeItemOnce = function removeItemOnce(arr, key) {
+  return arr.filter(function (item) {
+    return item.key !== key;
+  });
+};
+var activeClass = function activeClass(el, mode) {
+  var classname = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'active';
+  if (mode === 'add') {
+    el.classList.add(classname);
+  } else {
+    el.classList.remove(classname);
+  }
+};
+var deepClone = function deepClone(obj) {
+  if (Array.isArray(obj)) {
+    return obj.map(function (item) {
+      return deepClone(item);
+    });
+  } else if (tree_utils_typeof(obj) === 'object' && obj !== null) {
+    var clone = {};
+    for (var key in obj) {
+      if (obj.hasOwnProperty(key)) {
+        clone[key] = deepClone(obj[key]);
+      }
+    }
+    return clone;
+  } else {
+    return obj;
+  }
+};
+var flatOriginalData = function flatOriginalData(data) {
+  var result = [];
+  var iterate = function iterate(obj) {
+    if (!obj) {
+      return;
+    }
+    obj.forEach(function (item) {
+      result.push(item);
+      if (item.children) {
+        iterate(item.children);
+      }
+
+      // delete current item children
+      delete item.children;
+    });
+  };
+  iterate(data);
+  return result;
+};
 ;// CONCATENATED MODULE: ./src/TreeList.tsx
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -701,6 +310,9 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 
+// HAS CHECKBOX
+
+
 
 
 function TreeList(props) {
@@ -765,11 +377,6 @@ function TreeList(props) {
     fill: "currentColor",
     d: "M437.026,134.798c16.52-16.52,16.52-43.304,0-59.824c-16.519-16.511-43.304-16.52-59.823,0c-16.52,16.52-16.503,43.295,0,59.815C393.722,151.309,420.507,151.309,437.026,134.798z"
   }))));
-  var removeItemOnce = function removeItemOnce(arr, key) {
-    return arr.filter(function (item) {
-      return item.key !== key;
-    });
-  };
   var formatCheckboxControlVal = function formatCheckboxControlVal(el) {
     var _el$dataset$name;
     return {
@@ -801,7 +408,7 @@ function TreeList(props) {
     //---
     _parentsLi.forEach(function (node) {
       var _checkboxes = (0,dom.getChildren)(node, '[type="checkbox"]');
-      var parentKey = _checkboxes[0].dataset.key;
+      var parentKey = typeof _checkboxes[0] === 'undefined' ? '' : _checkboxes[0].dataset.key;
 
       //
       var _checkedLengthCalcArr = [];
@@ -835,14 +442,6 @@ function TreeList(props) {
     });
     return [checkedData, printData];
   };
-  var activeClass = function activeClass(el, mode) {
-    var classname = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'active';
-    if (mode === 'add') {
-      el.classList.add(classname);
-    } else {
-      el.classList.remove(classname);
-    }
-  };
   var closeChild = function closeChild(hyperlink, ul) {
     if (ul.length === 0) return;
     activeClass(hyperlink, 'remove');
@@ -949,6 +548,74 @@ function TreeList(props) {
       return arrow ? arrow : /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement((external_root_React_commonjs2_react_commonjs_react_amd_react_default()).Fragment, null, customIcon, loadingIcon);
     }
   }
+  function checkedAct(el, val) {
+    if (el === null) return;
+    var _curKey = el.dataset.key;
+    var _checkedData = getCheckedData;
+    var _res = getCheckedPrint;
+
+    // STEP 1:
+    // Current checkbox
+    //-----------
+    if (val === true) {
+      _res.push(formatCheckboxControlVal(el));
+      setCheckboxIndeterminateData(_checkedData, _curKey, false);
+      setCheckboxCheckedData(_checkedData, _curKey, true);
+    } else {
+      setCheckboxCheckedData(_checkedData, _curKey, false);
+      _res = removeItemOnce(_res, _curKey);
+    }
+
+    // STEP 2:
+    // All child checkboxes
+    //-----------
+    [].slice.call((0,dom.getChildren)(el.closest('li'), '[type="checkbox"]')).forEach(function (node) {
+      if (val === true) {
+        if (node.dataset.key !== _curKey) {
+          setCheckboxIndeterminateData(_checkedData, node.dataset.key, false);
+          setCheckboxCheckedData(_checkedData, node.dataset.key, true);
+          _res.push(formatCheckboxControlVal(node));
+        }
+      } else {
+        setCheckboxCheckedData(_checkedData, node.dataset.key, false);
+        _res = removeItemOnce(_res, node.dataset.key);
+      }
+    });
+
+    // STEP 3:
+    // ALl parent checkboxes
+    //-----------
+    var _setCheckboxIndetermi = setCheckboxIndeterminateStatus(_checkedData, _res, el),
+      _setCheckboxIndetermi2 = _slicedToArray(_setCheckboxIndetermi, 2),
+      updatedCheckedData = _setCheckboxIndetermi2[0],
+      updatedPrintData = _setCheckboxIndetermi2[1];
+    var _updatedCheckedData = updatedCheckedData;
+    var _updatedPrintData = updatedPrintData;
+
+    // STEP 4:
+    // Update checked data
+    //-----------
+    updategetCheckedData(_updatedCheckedData);
+
+    // STEP 5:
+    // Array deduplication
+    //-----------
+    _updatedPrintData = _updatedPrintData.filter(function (item, index, self) {
+      return index === self.findIndex(function (t) {
+        return t.key === item.key;
+      });
+    });
+
+    // STEP 6:
+    // Update checked print
+    //-----------
+    updateCheckedPrint(_updatedPrintData);
+
+    // STEP 7:
+    // callback
+    //----------- 
+    onCheck === null || onCheck === void 0 ? void 0 : onCheck(_updatedPrintData);
+  }
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
     // Activate current item
     //=====================
@@ -1032,89 +699,33 @@ function TreeList(props) {
         "data-key": item.key
       }, arrowGenerator()) : '', /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("span", {
         className: "checkbox-trigger"
-      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement((cjs_default()), {
-        wrapperClassName: "",
+      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
+        className: "form-check__wrapper"
+      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", {
+        className: "form-check d-inline-block"
+      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("input", {
+        type: "checkbox",
+        className: "form-check-input ".concat((_filter$ = getCheckedData.filter(function (cur) {
+          return cur.key === item.key;
+        })[0]) !== null && _filter$ !== void 0 && _filter$.indeterminate ? 'indeterminate' : ''),
         name: "checkbox-".concat(checkboxNamePrefix, "-").concat(item.key),
         tabIndex: -1,
+        "data-name": "checkbox-".concat(checkboxNamePrefix, "-").concat(item.key),
         "data-key": item.key,
         "data-link": item.link,
         value: item.slug,
-        indeterminate: (_filter$ = getCheckedData.filter(function (cur) {
-          return cur.key === item.key;
-        })[0]) === null || _filter$ === void 0 ? void 0 : _filter$.indeterminate,
         checked: (_filter$2 = getCheckedData.filter(function (cur) {
           return cur.key === item.key;
         })[0]) === null || _filter$2 === void 0 ? void 0 : _filter$2.checked,
-        onChange: function onChange(e, val) {
-          var _curKey = e.target.dataset.key;
-          var _checkedData = getCheckedData;
-          var _res = getCheckedPrint;
-
-          // STEP 1:
-          // Current checkbox
-          //-----------
-          if (val === true) {
-            _res.push(formatCheckboxControlVal(e.target));
-            setCheckboxIndeterminateData(_checkedData, _curKey, false);
-            setCheckboxCheckedData(_checkedData, _curKey, true);
-          } else {
-            setCheckboxCheckedData(_checkedData, _curKey, false);
-            _res = removeItemOnce(_res, _curKey);
-          }
-
-          // STEP 2:
-          // All child checkboxes
-          //-----------
-          [].slice.call((0,dom.getChildren)(e.target.closest('li'), '[type="checkbox"]')).forEach(function (node) {
-            if (val === true) {
-              if (node.dataset.key !== _curKey) {
-                setCheckboxIndeterminateData(_checkedData, node.dataset.key, false);
-                setCheckboxCheckedData(_checkedData, node.dataset.key, true);
-                _res.push(formatCheckboxControlVal(node));
-              }
-            } else {
-              setCheckboxCheckedData(_checkedData, node.dataset.key, false);
-              _res = removeItemOnce(_res, node.dataset.key);
-            }
-          });
-
-          // STEP 3:
-          // ALl parent checkboxes
-          //-----------
-          var _setCheckboxIndetermi = setCheckboxIndeterminateStatus(_checkedData, _res, e.target),
-            _setCheckboxIndetermi2 = _slicedToArray(_setCheckboxIndetermi, 2),
-            updatedCheckedData = _setCheckboxIndetermi2[0],
-            updatedPrintData = _setCheckboxIndetermi2[1];
-          var _updatedCheckedData = updatedCheckedData;
-          var _updatedPrintData = updatedPrintData;
-
-          // STEP 4:
-          // Update checked data
-          //-----------
-          updategetCheckedData(_updatedCheckedData);
-
-          // STEP 5:
-          // Array deduplication
-          //-----------
-          _updatedPrintData = _updatedPrintData.filter(function (item, index, self) {
-            return index === self.findIndex(function (t) {
-              return t.key === item.key;
-            });
-          });
-
-          // STEP 6:
-          // Update checked print
-          //-----------
-          updateCheckedPrint(_updatedPrintData);
-
-          // STEP 7:
-          // callback
-          //----------- 
-          onCheck === null || onCheck === void 0 ? void 0 : onCheck(_updatedPrintData);
+        onChange: function onChange(e) {
+          var _filter$3;
+          checkedAct(e.target, !((_filter$3 = getCheckedData.filter(function (cur) {
+            return cur.key === item.key;
+          })[0]) !== null && _filter$3 !== void 0 && _filter$3.checked));
         }
-      })), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("a", {
+      })))), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("a", {
         tabIndex: -1,
-        className: item.active ? "nav-link active ".concat(_async, " ").concat(item.selected ? 'selected' : '') : "nav-link ".concat(_async, " ").concat(item.selected ? 'selected' : ''),
+        className: "nav-link ".concat(_async, " ").concat(item.selected ? 'selected' : '', " ").concat(item.active ? 'active' : ''),
         href: item.link === '#' ? "".concat(item.link, "-").concat(i) : item.link,
         "aria-expanded": "false",
         onClick: handleSelect,
@@ -1183,6 +794,7 @@ function src_arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 
 
+
 var Tree = function Tree(props) {
   var id = props.id,
     checkable = props.checkable,
@@ -1196,6 +808,7 @@ var Tree = function Tree(props) {
     treeClassName = props.treeClassName,
     childClassName = props.childClassName,
     data = props.data,
+    retrieveData = props.retrieveData,
     onSelect = props.onSelect,
     onCollapse = props.onCollapse,
     onCheck = props.onCheck;
@@ -1204,16 +817,20 @@ var Tree = function Tree(props) {
   var rootRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
   var _useState = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(null),
     _useState2 = src_slicedToArray(_useState, 2),
-    val = _useState2[0],
-    setVal = _useState2[1];
+    list = _useState2[0],
+    setList = _useState2[1];
   var _useState3 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)([]),
     _useState4 = src_slicedToArray(_useState3, 2),
-    checkedPrint = _useState4[0],
-    setCheckedPrint = _useState4[1];
+    flatList = _useState4[0],
+    setFlatList = _useState4[1];
   var _useState5 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)([]),
     _useState6 = src_slicedToArray(_useState5, 2),
-    checkedData = _useState6[0],
-    setCheckedData = _useState6[1];
+    checkedPrint = _useState6[0],
+    setCheckedPrint = _useState6[1];
+  var _useState7 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)([]),
+    _useState8 = src_slicedToArray(_useState7, 2),
+    checkedData = _useState8[0],
+    setCheckedData = _useState8[1];
   var expandClassName = "".concat(showLine ? 'show-line' : '', " ").concat(disableArrow ? 'hide-arrow' : '', " ").concat(disableCollapse ? 'collapse-disabled' : '', " ").concat(lineStyle ? "line--".concat(lineStyle) : '', " ").concat(checkable ? 'has-checkbox' : '');
   var updateTreeData = function updateTreeData(list, key, children) {
     return list ? list.map(function (node) {
@@ -1278,6 +895,33 @@ var Tree = function Tree(props) {
     }));
     return _fetchData.apply(this, arguments);
   }
+  function updateShowProp(obj, retrieveData) {
+    var val = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : undefined;
+    obj.forEach(function (item, index) {
+      if (retrieveData.length === 0) {
+        item.show = true;
+      } else {
+        if (typeof val !== 'undefined') {
+          item.show = val;
+        } else {
+          var _item$title;
+          if (retrieveData.map(function (v) {
+            var _v$title;
+            return (_v$title = v.title) === null || _v$title === void 0 ? void 0 : _v$title.toLowerCase();
+          }).includes((_item$title = item.title) === null || _item$title === void 0 ? void 0 : _item$title.toLowerCase())) {
+            item.show = true;
+          } else {
+            item.show = false;
+          }
+        }
+      }
+
+      //
+      if (item.children) {
+        updateShowProp(item.children, retrieveData, val);
+      }
+    });
+  }
   function addKey(obj, depth, init) {
     obj.forEach(function (item, index) {
       item.key = "".concat(depth, "-").concat(index).substring(1);
@@ -1307,6 +951,7 @@ var Tree = function Tree(props) {
         return [{
           key: item.key,
           checked: item.checked === true,
+          show: true,
           indeterminate: false
         }].concat(_toConsumableArray(prevState));
       });
@@ -1318,15 +963,29 @@ var Tree = function Tree(props) {
   function initDefaultValue(key) {
     var fetch = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
     var firstRender = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    var retrieveData = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
     if (firstRender) {
       addKey(data, '', 0);
-      setVal(data);
+
+      // filter showing items
+      if (Array.isArray(retrieveData)) {
+        updateShowProp(data, retrieveData);
+      } else {
+        updateShowProp(data, retrieveData, true);
+      }
 
       // Initialize default value of checkboxes 
       if (checkable) {
         initCheckboxesVal(data);
         initCheckboxesData(data);
       }
+
+      // update list
+      setList(data);
+
+      // update retrive list
+      var _clone = deepClone(data);
+      setFlatList(flatOriginalData(_clone));
       return;
     }
     if (fetch && src_typeof(fetch.fetchFuncAsync) === 'object') {
@@ -1336,11 +995,17 @@ var Tree = function Tree(props) {
         var _childrenData = response;
         if (_childrenData.length > 0) {
           // add children to node
-          var _newData = updateTreeData(val, key ? key : '', _childrenData);
+          var _newData = updateTreeData(list, key ? key : '', _childrenData);
 
           // update data
           addKey(_newData, '', 0);
-          setVal(_newData);
+
+          // filter showing items
+          if (Array.isArray(retrieveData)) {
+            updateShowProp(_newData, retrieveData);
+          } else {
+            updateShowProp(_newData, retrieveData, true);
+          }
 
           // Initialize default value of checkboxes 
           if (checkable) {
@@ -1349,11 +1014,19 @@ var Tree = function Tree(props) {
                 return [{
                   key: newitem.key,
                   checked: newitem.checked === true,
+                  show: true,
                   indeterminate: false
                 }].concat(_toConsumableArray(prevState));
               });
             });
           }
+
+          // update list
+          setList(_newData);
+
+          // update retrive list
+          var _clone2 = deepClone(_newData);
+          setFlatList(flatOriginalData(_clone2));
         }
 
         // loading status
@@ -1376,9 +1049,18 @@ var Tree = function Tree(props) {
       });
     }
   }
+  function filterRetriveData(flatData, retrieveData) {
+    return flatData.filter(function (item) {
+      var _item$title2;
+      return retrieveData.map(function (v) {
+        var _v$title2;
+        return (_v$title2 = v.title) === null || _v$title2 === void 0 ? void 0 : _v$title2.toLowerCase();
+      }).includes((_item$title2 = item.title) === null || _item$title2 === void 0 ? void 0 : _item$title2.toLowerCase());
+    });
+  }
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
-    initDefaultValue(null, null, true);
-  }, [data]);
+    initDefaultValue(null, null, true, retrieveData);
+  }, [data, retrieveData]);
   return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement((external_root_React_commonjs2_react_commonjs_react_amd_react_default()).Fragment, null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("nav", {
     tabIndex: 0,
     id: idRes,
@@ -1393,7 +1075,7 @@ var Tree = function Tree(props) {
     disableCollapse: disableCollapse,
     arrow: arrow,
     arrowIcons: arrowIcons,
-    data: val,
+    data: Array.isArray(retrieveData) && retrieveData.length > 0 ? filterRetriveData(flatList, retrieveData) : list,
     childClassName: childClassName || 'tree-diagram-default-nav',
     onSelect: onSelect,
     onCollapse: onCollapse,