@oceanbase/ui 0.2.0

package/es/TaskGraph/register.js

@@ -0,0 +1,200 @@
+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); }
+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); }
+import G6 from '@antv/g6';
+import { token } from '@oceanbase/design';
+import { findByValue } from '@oceanbase/util';
+import { toLower } from 'lodash';
+
+/**
+ * 计算字符串的长度
+ * @param {string} str 指定的字符串
+ * @return {number} 字符串长度
+ */
+var calcStrLen = function calcStrLen(str) {
+  var len = 0;
+  // eslint-disable-next-line
+  for (var i = 0; i < str.length; i++) {
+    if (str.charCodeAt(i) > 0 && str.charCodeAt(i) < 128) {
+      // eslint-disable-next-line
+      len++;
+    } else {
+      len += 2;
+    }
+  }
+  return len;
+};
+
+/**
+ * 计算显示的字符串
+ * @param {string} str 要裁剪的字符串
+ * @param {number} maxWidth 最大宽度
+ * @param {number} fontSize 字体大小
+ * @return {string} 处理后的字符串
+ */
+var fittingString = function fittingString(str, maxWidth, fontSize) {
+  var fontWidth = fontSize * 1.3; // 字号+边距
+  maxWidth *= 2; // 需要根据自己项目调整
+  var width = calcStrLen(str) * fontWidth;
+  var ellipsis = '…';
+  if (width > maxWidth) {
+    var actualLen = Math.floor((maxWidth - 10) / fontWidth);
+    var result = str.substring(0, actualLen) + ellipsis;
+    return result;
+  }
+  return str;
+};
+export default function (statusList, assetsPath) {
+  G6.registerNode('subTaskNode', {
+    drawShape: function drawShape(cfg, group) {
+      var defaultNodeWidth = 200;
+      var nodeWidth = defaultNodeWidth;
+      var offsetX = 0;
+      // 任务名
+      if (cfg.name) {
+        // 使用 ellipsisName 字段用于超长文本截断
+        var ellipsisName = fittingString(cfg.name, 180, 12);
+        var nameShape = group.addShape('text', {
+          attrs: {
+            // 使用裁剪后的 name
+            text: ellipsisName,
+            x: -30,
+            y: -5,
+            fill: token.colorText,
+            fontSize: 14,
+            fontFamily: 'SFProText-Medium'
+          }
+        });
+        var nameBBox = nameShape.getBBox();
+        nodeWidth = nameBBox.width + 100;
+        if (nodeWidth > 280) {
+          // 节点宽度最大为 280
+          nodeWidth = 280;
+        } else if (nodeWidth < 200) {
+          // 节点宽度最小为 200
+          nodeWidth = 200;
+        }
+        offsetX = -(nodeWidth - defaultNodeWidth) / 2;
+        nameShape.translate(offsetX, 0);
+      }
+      var rect = group.addShape('rect', {
+        name: 'rect',
+        attrs: {
+          x: -nodeWidth / 2,
+          y: -34,
+          width: nodeWidth,
+          height: 62,
+          radius: 30,
+          fill: '#fff',
+          lineWidth: 3,
+          shadowColor: '#e1e3e6',
+          shadowBlur: 10,
+          shadowOffsetX: 0,
+          shadowOffsetY: 10
+        }
+      });
+
+      // 状态图片
+      group.addShape('image', {
+        name: 'statusImage',
+        attrs: {
+          x: -89 + offsetX,
+          y: -23,
+          width: 42,
+          height: 42,
+          // 任务状态图标的命名需要与状态名保持一致
+          img: "".concat(assetsPath, "/task_").concat(toLower(cfg.status), ".svg")
+        }
+      });
+
+      // 任务状态
+      group.addShape('text', {
+        name: 'statusName',
+        attrs: {
+          text: findByValue(statusList, cfg.status).label,
+          x: -30 + offsetX,
+          y: 15,
+          fill: token.colorTextTertiary,
+          fontSize: 12,
+          fontFamily: 'PingFangSC-Regular'
+        }
+      });
+      var moreGroup = group.addGroup({
+        name: 'moreGroup'
+      });
+
+      // ellipsis 图片
+      moreGroup.addShape('image', {
+        attrs: {
+          // 右边距为 34
+          x: nodeWidth / 2 - 34 - 16,
+          y: 8,
+          width: 16,
+          height: 2.5,
+          cursor: 'pointer',
+          img: "".concat(assetsPath, "/icon_ellipsis.svg")
+        }
+      });
+      moreGroup.addShape('rect', {
+        attrs: {
+          x: nodeWidth / 2 - 34 - 16,
+          y: 0,
+          width: 16,
+          height: 16,
+          cursor: 'pointer',
+          fill: 'transparent'
+        }
+      });
+
+      // rect 在节点名称之后渲染，需要对 rect 进行置底操作
+      rect.toBack();
+      return rect;
+    },
+    update: function update(cfg, node) {
+      var group = node.get('group');
+      var statusImage = group.findAllByName('statusImage') && group.findAllByName('statusImage')[0];
+      var statusName = group.findAllByName('statusName') && group.findAllByName('statusName')[0];
+      // 更新状态图标
+      if (statusImage) {
+        statusImage.attr('img', "".concat(assetsPath, "/task_").concat(toLower(cfg.status), ".svg"));
+      }
+      // 更新状态文本
+      if (statusName) {
+        statusName.attr('text', findByValue(statusList, cfg.status).label);
+      }
+    }
+  }, 'single-node');
+  G6.registerEdge('subTaskEdge', {
+    curvePosition: [9 / 10, 1 / 10],
+    getShapeStyle: function getShapeStyle(cfg) {
+      var targetNodeModel = cfg.targetNode && cfg.targetNode.get('model') || {};
+      var status = targetNodeModel.status;
+      var startPoint = cfg.startPoint,
+        endPoint = cfg.endPoint;
+      var controlPoints = this.getControlPoints(cfg);
+      var points = [startPoint]; // 添加起始点
+      // 添加控制点
+      if (controlPoints) {
+        points = points.concat(controlPoints);
+      }
+      // 添加结束点
+      points.push(endPoint);
+      var path = this.getPath(points, cfg);
+      var statusColor = findByValue(statusList, status).color;
+      var style = _objectSpread(_objectSpread({}, G6.Global.defaultEdge.style), {}, {
+        path: path,
+        // 自定义结束箭头，箭头的边长为 10，夹角为 60 度
+        endArrow: {
+          path: "M".concat(10 * Math.cos(Math.PI / 6), ",").concat(10 * Math.sin(Math.PI / 6), " L0,0 L").concat(10 * Math.cos(Math.PI / 6), ",-").concat(10 * Math.sin(Math.PI / 6)),
+          fill: statusColor
+        },
+        lineWidth: 2,
+        stroke: statusColor
+      }, cfg.style);
+      return style;
+    }
+  }, 'cubic-vertical');
+}

package/es/TreeSearch/index.d.ts

@@ -0,0 +1,38 @@
+import type { DataNode } from 'antd/es/tree';
+import React from 'react';
+export interface Node {
+    originTitle?: string;
+    value?: string;
+    title?: string;
+    icon?: React.ReactNode;
+    children?: Node[];
+}
+export interface TreeNode extends Node {
+    originTitle: string;
+    key: string;
+    children?: TreeNode[];
+}
+export interface TreeSearchRef {
+    reset: () => void;
+    checkAll: () => void;
+    invertSelect: () => void;
+}
+interface IProps {
+    treeData: Node[];
+    titleRender?: (nodeData: DataNode) => React.ReactNode;
+    checkable?: boolean;
+    onChange?: (nodes: Node[]) => void;
+    width?: number | string;
+    height?: number;
+    /**
+     * 是否默认展开所有节点
+     */
+    defaultExpandAll?: boolean;
+    /** onChange 时只关注叶子节点的变化 */
+    followLeaf?: boolean;
+    /** 异步请求节点数据的回调函数 */
+    loadData?: (data: unknown) => Promise<void>;
+    searchStyle?: {};
+}
+declare const _default: React.ForwardRefExoticComponent<IProps & React.RefAttributes<TreeSearchRef>>;
+export default _default;

package/es/TreeSearch/index.js

@@ -0,0 +1,168 @@
+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; }
+import { SearchOutlined } from '@ant-design/icons';
+import { Divider, Empty, Form, Input, Tree } from '@oceanbase/design';
+import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import { deepFilter, findFromTree, getAllOptions, nodes2treeNodes, treeNode2node } from "./util";
+
+// 用户传入的树节点数据结构
+
+export default /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _ref$treeData = _ref.treeData,
+    treeData = _ref$treeData === void 0 ? [] : _ref$treeData,
+    width = _ref.width,
+    _ref$checkable = _ref.checkable,
+    checkable = _ref$checkable === void 0 ? true : _ref$checkable,
+    titleRender = _ref.titleRender,
+    onChange = _ref.onChange,
+    _ref$followLeaf = _ref.followLeaf,
+    followLeaf = _ref$followLeaf === void 0 ? true : _ref$followLeaf,
+    height = _ref.height,
+    defaultExpandAll = _ref.defaultExpandAll,
+    loadData = _ref.loadData,
+    _ref$searchStyle = _ref.searchStyle,
+    searchStyle = _ref$searchStyle === void 0 ? {} : _ref$searchStyle;
+  var memoTreeData = useMemo(function () {
+    return nodes2treeNodes(treeData);
+  }, [treeData]);
+  var _useState = useState(memoTreeData),
+    _useState2 = _slicedToArray(_useState, 2),
+    searchData = _useState2[0],
+    setSearchData = _useState2[1];
+  // 内部计算虚拟滚动的高度
+  var treeWrapperDOM = useRef(null);
+  var _useState3 = useState(height),
+    _useState4 = _slicedToArray(_useState3, 2),
+    innerHeight = _useState4[0],
+    setInnerHeight = _useState4[1];
+  var _useState5 = useState([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    checkedKeys = _useState6[0],
+    setCheckedKeys = _useState6[1];
+  var _useState7 = useState(''),
+    _useState8 = _slicedToArray(_useState7, 2),
+    searchStr = _useState8[0],
+    setSearchStr = _useState8[1];
+  var _Form$useForm = Form.useForm(),
+    _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
+    form = _Form$useForm2[0];
+  useEffect(function () {
+    if (height === undefined && treeWrapperDOM !== null && treeWrapperDOM !== void 0 && treeWrapperDOM.current) {
+      var _treeWrapperDOM$curre;
+      var containerheight = treeWrapperDOM === null || treeWrapperDOM === void 0 ? void 0 : (_treeWrapperDOM$curre = treeWrapperDOM.current) === null || _treeWrapperDOM$curre === void 0 ? void 0 : _treeWrapperDOM$curre.clientHeight;
+      setInnerHeight(containerheight);
+    }
+  }, []);
+  useEffect(function () {
+    if (!searchData || searchData.length === 0) {
+      setSearchData(memoTreeData);
+    }
+    onSearch({
+      searchKey: searchStr
+    });
+  }, [memoTreeData]);
+  var reset = function reset() {
+    form.resetFields();
+    setCheckedKeys([]);
+  };
+  var checkAll = function checkAll() {
+    var allOptions = getAllOptions(memoTreeData);
+    setCheckedKeys(allOptions.map(function (node) {
+      return node.key;
+    }));
+    onChange(allOptions);
+  };
+
+  // 反选
+  var invertSelect = function invertSelect() {
+    var allOptions = getAllOptions(memoTreeData);
+    // 收集未选择的项，用于设置反选
+    var notCheckedOptions = allOptions.filter(function (item) {
+      return !checkedKeys.includes(item.key);
+    });
+    setCheckedKeys(notCheckedOptions.map(function (item) {
+      return item.key;
+    }));
+    onChange(allOptions.filter(function (node) {
+      return !checkedKeys.includes(node.key);
+    }));
+  };
+  useImperativeHandle(ref, function () {
+    return {
+      reset: reset,
+      checkAll: checkAll,
+      invertSelect: invertSelect
+    };
+  });
+  var onSearch = function onSearch(_ref2) {
+    var searchKey = _ref2.searchKey;
+    setSearchStr(searchKey);
+    // 过滤掉所有叶子节点不匹配的
+    var next = deepFilter(memoTreeData, function (node) {
+      var titleIsStr = typeof node.title === 'string';
+      return (titleIsStr ? node.title : node.value).includes(searchKey);
+      // (!isLeaf(node) && node.children.length > 0)
+    });
+
+    setSearchData(next);
+  };
+  var onCheck = function onCheck(keys) {
+    var treeNodes = keys.map(function (key) {
+      return findFromTree(key, memoTreeData);
+    });
+    if (followLeaf) {
+      treeNodes = treeNodes.filter(function (node) {
+        return !(node !== null && node !== void 0 && node.children);
+      });
+    }
+    setCheckedKeys(treeNodes.map(function (node) {
+      return node.key;
+    }));
+    onChange(treeNodes.map(treeNode2node));
+  };
+
+  // 整体宽度 - input - divider
+  var treeHeight = innerHeight ? innerHeight - (32 + 12 * 2 + 1) : 0;
+  var defaultSearchStyle = {
+    padding: '0 12px'
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    ref: treeWrapperDOM,
+    style: {
+      width: width,
+      height: height !== null && height !== void 0 ? height : '100%'
+    }
+  }, /*#__PURE__*/React.createElement(Form, {
+    form: form,
+    onValuesChange: onSearch,
+    style: Object.assign(defaultSearchStyle, searchStyle)
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    noStyle: true,
+    name: "searchKey"
+  }, /*#__PURE__*/React.createElement(Input, {
+    "data-testid": "search",
+    prefix: /*#__PURE__*/React.createElement(SearchOutlined, null)
+  }))), /*#__PURE__*/React.createElement(Divider, {
+    style: {
+      margin: '12px 0'
+    }
+  }), searchData.length !== 0 ? /*#__PURE__*/React.createElement(Tree, {
+    height: treeHeight,
+    showIcon: true,
+    checkable: checkable,
+    blockNode: true,
+    selectable: false,
+    checkedKeys: checkedKeys,
+    onCheck: onCheck,
+    titleRender: titleRender,
+    defaultExpandAll: defaultExpandAll,
+    treeData: form.getFieldValue('searchKey') ? searchData : memoTreeData,
+    loadData: loadData
+  }) : /*#__PURE__*/React.createElement(Empty, {
+    image: Empty.PRESENTED_IMAGE_SIMPLE
+  }));
+});

package/es/TreeSearch/util.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import type { Node, TreeNode } from '.';
+/** 根据 key 判断节点是否为叶子节点 */
+export declare const isLeaf: (node: TreeNode) => boolean;
+/** 将传入格式的 node 处理为组件内需要的内容 */
+export declare const nodes2treeNodes: (nodes?: Node[], parentKey?: string) => TreeNode[];
+export declare const treeNode2node: (treeNode: TreeNode) => Node;
+export declare const deepFilter: (treeNodes: TreeNode[], cb: (treeNode: TreeNode) => boolean) => {
+    originTitle: string;
+    key: string;
+    children?: TreeNode[];
+    value?: string;
+    title?: string;
+    icon?: import("react").ReactNode;
+}[];
+/** 根据 node key 取得 node 节点 */
+export declare const findFromTree: (key: string, treeNodes: TreeNode[]) => TreeNode;
+/** 获取所有的选项
+ *  如果有子项，则获取子项，否则取本级
+ */
+export declare const getAllOptions: (treeNodes: TreeNode[]) => any;

package/es/TreeSearch/util.js

@@ -0,0 +1,111 @@
+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); }
+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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _toArray(arr) { return _arrayWithHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { omit } from 'lodash';
+var generateKey = function generateKey(values) {
+  return "".concat(values.join('$$'));
+};
+var splitKey = function splitKey(value) {
+  // todo 考虑格式错误的情况
+  var _ref = value.split('$$'),
+    _ref2 = _toArray(_ref),
+    values = _ref2.slice(0);
+  return {
+    values: values
+  };
+};
+
+/** 根据 key 判断节点是否为叶子节点 */
+export var isLeaf = function isLeaf(node) {
+  return !(node !== null && node !== void 0 && node.children);
+};
+
+/** 将传入格式的 node 处理为组件内需要的内容 */
+export var nodes2treeNodes = function nodes2treeNodes(nodes, parentKey) {
+  if (!nodes) return undefined;
+  return nodes.map(function (node) {
+    var _ref3, _node$value, _node$originTitle;
+    var values = [];
+    if (parentKey) {
+      values = _toConsumableArray(splitKey(parentKey).values);
+    }
+    var key = generateKey([].concat(_toConsumableArray(values), [(_ref3 = (_node$value = node.value) !== null && _node$value !== void 0 ? _node$value : node.originTitle) !== null && _ref3 !== void 0 ? _ref3 : node.title]));
+    var next = _objectSpread(_objectSpread({}, node), {}, {
+      key: key,
+      // 补齐 originTitle
+      originTitle: (_node$originTitle = node.originTitle) !== null && _node$originTitle !== void 0 ? _node$originTitle : node.title,
+      children: nodes2treeNodes(node.children, key)
+    });
+    return next;
+  });
+};
+export var treeNode2node = function treeNode2node(treeNode) {
+  return omit(treeNode, 'key');
+};
+export var deepFilter = function deepFilter(treeNodes, cb) {
+  var filtered = treeNodes.map(function (treeNode) {
+    var _treeNode$children;
+    var next = _objectSpread({}, treeNode);
+    // 若过滤通过，无需再关注子节点，直接全部显示
+    if (cb(treeNode)) {
+      return next;
+    }
+    // 若过滤不通过，并且有子节点，递归对子节点做过滤操作
+    if ((_treeNode$children = treeNode.children) !== null && _treeNode$children !== void 0 && _treeNode$children.length) {
+      next.children = deepFilter(treeNode.children, cb);
+    }
+    return next;
+  });
+  return filtered.filter(function (treeNode) {
+    var _treeNode$children2;
+    return (treeNode === null || treeNode === void 0 ? void 0 : (_treeNode$children2 = treeNode.children) === null || _treeNode$children2 === void 0 ? void 0 : _treeNode$children2.length) || cb(treeNode);
+  });
+};
+
+/** 根据 node key 取得 node 节点 */
+export var findFromTree = function findFromTree(key, treeNodes) {
+  var _splitKey = splitKey(key),
+    values = _splitKey.values;
+  var node;
+  var i = 0;
+  var _loop = function _loop() {
+    var value = values[i];
+    if (!node) {
+      node = treeNodes.find(function (e) {
+        return e.value === value;
+      });
+    } else {
+      var _node$children;
+      node = (_node$children = node.children) === null || _node$children === void 0 ? void 0 : _node$children.find(function (e) {
+        return e.value === value;
+      });
+    }
+  };
+  for (; i < values.length; i += 1) {
+    _loop();
+  }
+  return node;
+};
+
+/** 获取所有的选项
+ *  如果有子项，则获取子项，否则取本级
+ */
+export var getAllOptions = function getAllOptions(treeNodes) {
+  var allOptions = treeNodes.map(function (node) {
+    var _node$children2;
+    return (node === null || node === void 0 ? void 0 : (_node$children2 = node.children) === null || _node$children2 === void 0 ? void 0 : _node$children2.length) > 0 ? getAllOptions(node === null || node === void 0 ? void 0 : node.children) : node;
+  });
+  return allOptions.flat();
+};

package/es/Welcome/index.d.ts

@@ -0,0 +1,38 @@
+import type { ButtonProps } from 'antd/es/button';
+import React from 'react';
+import './index.less';
+export interface IntroduceItem {
+    image: string;
+    title: string;
+    description: string;
+}
+export interface StepItem {
+    title: string;
+    description: string;
+}
+export interface HelpItem {
+    title: string;
+    link: string;
+    isMore?: boolean;
+}
+export interface WelcomeLocale {
+    helpTitle: string;
+    defaultOperation: string;
+}
+export declare type StepType = 'default' | 'card';
+export interface WelcomeProps {
+    title: string;
+    description: string;
+    bgImage: string;
+    introduces: IntroduceItem[];
+    steps: StepItem[];
+    stepType?: StepType;
+    buttonText: string;
+    buttonProps?: ButtonProps;
+    helps: HelpItem[];
+    locale?: WelcomeLocale;
+    className?: string;
+    style?: React.CSSProperties;
+}
+declare const _default: any;
+export default _default;