@vtx/components 4.0.0-beta.1 → 4.0.0-beta.11

package/lib/vtx-tree/index.js

@@ -16,7 +16,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _index = require("./style/index");
 var _vtxProvider = require("../vtx-provider");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["showSearch", "treeData", "searchPlaceholder", "renderMenuList", "fieldNames", "titleClassName", "expandAction"];
+var _excluded = ["showSearch", "treeData", "searchPlaceholder", "renderMenuList", "fieldNames", "titleClassName", "expandAction", "maxButtonCount"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -38,16 +38,16 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
 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; }
-var getParentKey = function getParentKey(key, tree) {
-  var parentKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+var getParentKey = function getParentKey(keyValue, key, tree) {
+  var parentKey = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
   var _iterator = _createForOfIteratorHelper(tree),
     _step;
   try {
     for (_iterator.s(); !(_step = _iterator.n()).done;) {
       var node = _step.value;
-      if (node.key === key) return parentKey;
+      if (node[keyValue] === key) return parentKey;
       if (node.children) {
-        var found = getParentKey(key, node.children, node.key);
+        var found = getParentKey(keyValue, key, node.children, node[keyValue]);
         if (found !== undefined) return found;
       }
     }
@@ -71,6 +71,8 @@ var VtxTree = exports.VtxTree = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     titleClassName = propsAll.titleClassName,
     _propsAll$expandActio = propsAll.expandAction,
     expandAction = _propsAll$expandActio === void 0 ? 'click' : _propsAll$expandActio,
+    _propsAll$maxButtonCo = propsAll.maxButtonCount,
+    maxButtonCount = _propsAll$maxButtonCo === void 0 ? 3 : _propsAll$maxButtonCo,
     props = _objectWithoutProperties(propsAll, _excluded);
   var _useContext = (0, _react.useContext)(_vtxProvider.VtxProvider),
     getPrefixCls = _useContext.getPrefixCls;
@@ -101,12 +103,12 @@ var VtxTree = exports.VtxTree = /*#__PURE__*/(0, _react.forwardRef)(function (pr
   var dataList = (0, _react.useMemo)(function () {
     var dataList = [];
     var titleKey = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.title) || 'title';
+    var keyName = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.key) || 'key';
     var generateList = function generateList(data) {
       for (var i = 0; i < data.length; i++) {
         var node = data[i];
-        var key = node.key;
         dataList.push({
-          key: key,
+          key: node[keyName],
           title: node[titleKey]
         });
         if (node.children) {
@@ -149,6 +151,7 @@ var VtxTree = exports.VtxTree = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     var newTreeData = (0, _utils2.parseTreeData)(treeData, {
       renderNode: function renderNode(item) {
         var titleKey = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.title) || 'title';
+        var keyName = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.key) || 'key';
         var strTitle = item[titleKey] || '';
         var index = strTitle.indexOf(searchValue);
         var beforeStr = strTitle.substring(0, index);
@@ -164,7 +167,7 @@ var VtxTree = exports.VtxTree = /*#__PURE__*/(0, _react.forwardRef)(function (pr
           className: className,
           children: strTitle
         });
-        return _objectSpread(_objectSpread({}, item), {}, _defineProperty(_defineProperty(_defineProperty({}, titleKey, title), "key", item.key), "strTitle", strTitle));
+        return _objectSpread(_objectSpread({}, item), {}, _defineProperty(_defineProperty(_defineProperty({}, titleKey, title), keyName, item[keyName]), "strTitle", strTitle));
       },
       filterNode: function filterNode(item) {
         return item.strTitle.indexOf(searchValue) > -1;
@@ -176,7 +179,7 @@ var VtxTree = exports.VtxTree = /*#__PURE__*/(0, _react.forwardRef)(function (pr
       var _props$onExpand2;
       var newExpandedKeys = dataList.map(function (item) {
         if (item.title.indexOf(value) > -1) {
-          return getParentKey(item.key, treeData);
+          return getParentKey((fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.key) || 'key', item.key, treeData);
         }
         return null;
       }).filter(function (item, i, self) {
@@ -198,17 +201,15 @@ var VtxTree = exports.VtxTree = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     };
   });
   (0, _react.useEffect)(function () {
-    var _treeRef$current2;
     var resizeObserver = new ResizeObserver(function () {
-      var _treeRef$current;
-      setHeight(treeRef === null || treeRef === void 0 || (_treeRef$current = treeRef.current) === null || _treeRef$current === void 0 ? void 0 : _treeRef$current.offsetHeight);
+      setHeight(treeRef.current.offsetHeight);
     });
     if (treeRef.current) {
-      resizeObserver.observe(treeRef === null || treeRef === void 0 ? void 0 : treeRef.current, {
+      resizeObserver.observe(treeRef.current, {
         box: 'border-box'
       });
     }
-    setHeight(treeRef === null || treeRef === void 0 || (_treeRef$current2 = treeRef.current) === null || _treeRef$current2 === void 0 ? void 0 : _treeRef$current2.offsetHeight);
+    setHeight(treeRef.current.offsetHeight);
     return function () {
       resizeObserver.disconnect();
     };
@@ -260,6 +261,21 @@ var VtxTree = exports.VtxTree = /*#__PURE__*/(0, _react.forwardRef)(function (pr
       setSelectedKeys(newSelectedKeys);
     }
   };
+  var renderMenuIcon = function renderMenuIcon(arr, nodeData) {
+    return arr.map(function (item) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
+        title: item.label,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "".concat(prefixCls, "-menu-item-icon"),
+          onClick: function onClick(e) {
+            e.stopPropagation();
+            item.onClick && item.onClick(nodeData);
+          },
+          children: item.icon
+        })
+      }, item.label);
+    });
+  };
   return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: (0, _classnames.default)("".concat(prefixCls, "-wraaper"), hashId),
     children: [showSearch && /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Input, {
@@ -295,28 +311,54 @@ var VtxTree = exports.VtxTree = /*#__PURE__*/(0, _react.forwardRef)(function (pr
           var titleKey = (fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.title) || 'title';
           var title = nodeData[titleKey];
           if (renderMenuList) {
-            var menuList = renderMenuList(nodeData);
+            var menuList = renderMenuList(nodeData).filter(function (item) {
+              return item.visible;
+            });
+            var arr = [];
+            if (menuList.length > maxButtonCount) {
+              arr = arr.concat(renderMenuIcon(menuList.slice(0, maxButtonCount - 1), nodeData));
+              arr.push( /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Dropdown, {
+                placement: "bottom",
+                menu: {
+                  items: menuList.slice(maxButtonCount - 1).map(function (item) {
+                    return {
+                      key: item.label,
+                      label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+                        className: "".concat(prefixCls, "-menu-item-label"),
+                        children: [item.icon, item.label]
+                      })
+                    };
+                  }),
+                  onClick: function onClick(obj) {
+                    var key = obj.key,
+                      domEvent = obj.domEvent;
+                    domEvent.stopPropagation();
+                    var temp = menuList.find(function (v) {
+                      return v.label == key;
+                    });
+                    (temp === null || temp === void 0 ? void 0 : temp.onClick) && temp.onClick(nodeData);
+                  }
+                },
+                trigger: ['click'],
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                  className: "".concat(prefixCls, "-menu-item-icon"),
+                  onClick: function onClick(e) {
+                    e.stopPropagation();
+                  },
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.EllipsisOutlined, {})
+                })
+              }));
+            } else {
+              arr = arr.concat(renderMenuIcon(menuList, nodeData));
+            }
             return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               className: (0, _classnames.default)("".concat(prefixCls, "-menu-wrap"), hashId),
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
                 children: title
               }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                 className: (0, _classnames.default)("".concat(prefixCls, "-menu-list"), hashId),
-                children: menuList.filter(function (item) {
-                  return item.visible;
-                }).map(function (item) {
-                  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
-                    title: item.label,
-                    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-                      className: (0, _classnames.default)("".concat(prefixCls, "-menu-item-icon"), hashId),
-                      onClick: function onClick(e) {
-                        e.stopPropagation();
-                        // eslint-disable-next-line @typescript-eslint/no-unused-expressions
-                        item.onClick && item.onClick(nodeData);
-                      },
-                      children: item.icon
-                    })
-                  }, item.label);
+                children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+                  children: [arr, " "]
                 })
               })]
             });
@@ -333,7 +375,7 @@ VtxTree.propTypes = {
   treeData: _propTypes.default.array,
   selectedKeys: _propTypes.default.array,
   defaultSelectedKeys: _propTypes.default.array,
-  expandedKeys: _propTypes.default.bool,
+  expandedKeys: _propTypes.default.array,
   onExpand: _propTypes.default.func,
   multiple: _propTypes.default.bool,
   autoExpandParent: _propTypes.default.bool,
@@ -341,7 +383,11 @@ VtxTree.propTypes = {
   searchPlaceholder: _propTypes.default.string,
   renderMenuList: _propTypes.default.func,
   titleClassName: _propTypes.default.func,
-  fieldNames: _propTypes.default.array,
+  fieldNames: _propTypes.default.shape({
+    title: _propTypes.default.string,
+    key: _propTypes.default.string,
+    children: _propTypes.default.string
+  }),
   defaultExpandAll: _propTypes.default.bool,
   expandAction: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool])
 };

package/lib/vtx-tree-select/index.js

@@ -65,6 +65,10 @@ var VtxTreeSelect = exports.VtxTreeSelect = function VtxTreeSelect(_ref) {
   var size = (0, _ahooks.useSize)(ref);
   var keyNodesMapping = (0, _react.useMemo)(function () {
     var keyNodesMapping = {};
+    // 建议：添加树数据有效性检查
+    if (!treeData || !Array.isArray(treeData)) {
+      return keyNodesMapping;
+    }
     (function genNodes(nodes) {
       nodes.map(function (item) {
         var children = item.children,

package/lib/vtx-upload/FilePreview.js

@@ -8,6 +8,7 @@ var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _antd = require("antd");
 var _vtxProvider = require("../vtx-provider");
+var _vtxModal = _interopRequireDefault(require("../vtx-modal"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
@@ -82,7 +83,7 @@ function Preview(props) {
     timer && clearTimeout(timer);
     onCancel();
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Modal, _objectSpread(_objectSpread({}, modalProps), {}, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_vtxModal.default, _objectSpread(_objectSpread({}, modalProps), {}, {
     children: [type == 'file' ? /*#__PURE__*/(0, _jsxRuntime.jsx)("iframe", {
       src: url,
       style: {