@kep-platform/basic-component 0.0.2 → 0.0.6

package/dist/Table/Table.js

@@ -0,0 +1,243 @@
+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); }
+var _excluded = ["render"];
+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 _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; }
+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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import CaretDownOutlined from '@ant-design/icons/CaretDownOutlined';
+import CaretUpOutlined from '@ant-design/icons/CaretUpOutlined';
+import React, { useCallback, useMemo, useRef, useState } from 'react';
+import styled from 'styled-components';
+import { BoxShadowBox } from "../BoxShadowBox";
+import { Column, Columns } from "../Columns";
+import { DefaultColumnWidth } from "../Columns/Columns";
+import { Col, Row } from "../Grid";
+import { List, ListItem } from "../List";
+import { Pagination } from "../Pagination";
+import { Space } from "../Space";
+var TableContainer = styled.div.withConfig({
+  displayName: "TableContainer",
+  componentId: "basic-component-347b__sc-12r61fm-0"
+})([""]);
+var TableTitle = styled.h5.withConfig({
+  displayName: "TableTitle",
+  componentId: "basic-component-347b__sc-12r61fm-1"
+})(["font-weight:600;padding:var(--kep-platform-padding-sm);"]);
+var TableToolbar = styled.div.withConfig({
+  displayName: "TableToolbar",
+  componentId: "basic-component-347b__sc-12r61fm-2"
+})(["text-align:right;padding:var(--kep-platform-padding-sm);"]);
+var TableHeaderRow = styled(Columns).withConfig({
+  displayName: "TableHeaderRow",
+  componentId: "basic-component-347b__sc-12r61fm-3"
+})(["border-bottom:var(--kep-platform-line-width) solid var(--kep-platform-color-table-border);& ", "{background-color:var(--kep-platform-header-bg);font-weight:600;position:sticky;&:not(:last-child):after{content:'';width:1px;height:calc(100% - 2 * var(--kep-platform-padding-xs));position:absolute;top:var(--kep-platform-padding-xs);right:0;background-color:var(--kep-platform-color-border-secondary);}}"], Column);
+var TableBody = styled(List).withConfig({
+  displayName: "TableBody",
+  componentId: "basic-component-347b__sc-12r61fm-4"
+})([""]);
+var TableBodyRow = styled(ListItem).withConfig({
+  displayName: "TableBodyRow",
+  componentId: "basic-component-347b__sc-12r61fm-5"
+})([""]);
+var TableContent = styled.div.withConfig({
+  displayName: "TableContent",
+  componentId: "basic-component-347b__sc-12r61fm-6"
+})(["position:relative;overflow:auto;border-radius:var(--kep-platform-border-radius);box-shadow:var(--kep-platform-box-shadow-tertiary);"]);
+var SortIconList = styled(List).withConfig({
+  displayName: "SortIconList",
+  componentId: "basic-component-347b__sc-12r61fm-7"
+})([""]);
+var SortIconListItem = styled(ListItem).withConfig({
+  displayName: "SortIconListItem",
+  componentId: "basic-component-347b__sc-12r61fm-8"
+})(["height:10px;line-height:10px;font-size:10px;cursor:pointer;user-select:none;color:", ";"], function (props) {
+  return props.active ? 'var(--kep-platform-color-primary)' : 'currentColor';
+});
+var SortIconGroup = function SortIconGroup(_ref) {
+  var sorter = _ref.sorter,
+    onSorterChange = _ref.onSorterChange,
+    hidden = _ref.hidden;
+  var onSortIconGroupClickHandler = useCallback(function () {
+    switch (sorter) {
+      case 'desc':
+        onSorterChange === null || onSorterChange === void 0 || onSorterChange();
+        break;
+      case 'asc':
+        onSorterChange === null || onSorterChange === void 0 || onSorterChange('desc');
+        break;
+      default:
+        onSorterChange === null || onSorterChange === void 0 || onSorterChange('asc');
+    }
+  }, [sorter, onSorterChange]);
+  return /*#__PURE__*/React.createElement(SortIconList, {
+    direction: "column",
+    onClick: onSortIconGroupClickHandler,
+    hidden: hidden
+  }, /*#__PURE__*/React.createElement(SortIconListItem, {
+    active: sorter === 'asc'
+  }, /*#__PURE__*/React.createElement(CaretUpOutlined, null)), /*#__PURE__*/React.createElement(SortIconListItem, {
+    active: sorter === 'desc'
+  }, /*#__PURE__*/React.createElement(CaretDownOutlined, null)));
+};
+var ColumnTitle = styled.div.withConfig({
+  displayName: "ColumnTitle",
+  componentId: "basic-component-347b__sc-12r61fm-9"
+})([""]);
+var ColumnTitleController = function ColumnTitleController(_ref2) {
+  var onSorterChange = _ref2.onSorterChange,
+    title = _ref2.title,
+    sorterType = _ref2.sorterType,
+    hasSorter = _ref2.hasSorter;
+  return /*#__PURE__*/React.createElement(ColumnTitle, null, /*#__PURE__*/React.createElement(Space, {
+    size: "small"
+  }, title, /*#__PURE__*/React.createElement(SortIconGroup, {
+    sorter: sorterType,
+    onSorterChange: onSorterChange,
+    hidden: !hasSorter
+  })));
+};
+function sortObjectsByProperty(objects, property, sorterType, func) {
+  var sorterOffset = sorterType === 'asc' ? 1 : sorterType === 'desc' ? -1 : 0;
+  if (sorterOffset === 0) return objects;
+  var sorterFunc = func || function (a, b) {
+    if (typeof a[property] === 'number' && typeof b[property] === 'number') {
+      return a[property] - b[property];
+    } else if (typeof a[property] === 'string' && typeof b[property] === 'string') {
+      return a[property].localeCompare(b[property]);
+    } else {
+      return 0;
+    }
+  };
+  switch (sorterOffset) {
+    case 1:
+      return objects.slice().sort(sorterFunc);
+    case -1:
+      return objects.slice().sort(sorterFunc).reverse();
+  }
+}
+export default function Table(_ref3) {
+  var columns = _ref3.columns,
+    dataSource = _ref3.dataSource,
+    rowKey = _ref3.rowKey,
+    actions = _ref3.actions,
+    title = _ref3.title,
+    scroll = _ref3.scroll,
+    _onChange2 = _ref3.onChange,
+    headerRender = _ref3.headerRender,
+    _ref3$pagination = _ref3.pagination,
+    pagination = _ref3$pagination === void 0 ? {
+      current: 1,
+      pageSize: 10
+    } : _ref3$pagination;
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    sorterController = _useState2[0],
+    setSorterController = _useState2[1];
+  var titleRowData = useMemo(function () {
+    var data = {};
+    columns.forEach(function (column) {
+      var dataIndex = column.dataIndex;
+      data[dataIndex] = /*#__PURE__*/React.createElement(ColumnTitleController, {
+        column: column,
+        onSorterChange: function onSorterChange(sorter) {
+          var key = column.key;
+          _onChange2 === null || _onChange2 === void 0 || _onChange2(undefined, _defineProperty({}, key, sorter), undefined);
+          setSorterController({
+            columnKey: column.key,
+            sorterType: sorter
+          });
+        },
+        title: (headerRender === null || headerRender === void 0 ? void 0 : headerRender(column)) || column.title,
+        sorterType: (sorterController === null || sorterController === void 0 ? void 0 : sorterController.columnKey) === column.key ? sorterController === null || sorterController === void 0 ? void 0 : sorterController.sorterType : undefined,
+        hasSorter: !!column.sorter
+      });
+    });
+    return data;
+  }, [columns, _onChange2, sorterController, setSorterController]);
+  var boxShadowBox = useRef(null);
+  var headerColumns = useMemo(function () {
+    return columns.map(function (column) {
+      var render = column.render,
+        rest = _objectWithoutProperties(column, _excluded);
+      console.log('exclude render', render);
+      return rest;
+    });
+  }, [columns]);
+  var scrollLeftOffset = useMemo(function () {
+    return columns.reduce(function (pre, current) {
+      return pre + (current.hideInTable ? 0 : current.fixed === 'left' ? current.width || DefaultColumnWidth : 0);
+    }, 0);
+  }, [columns]);
+  var formatedDataSource = useMemo(function () {
+    if (sorterController && sorterController.sorterType !== undefined) {
+      var sortedColumn = columns.find(function (column) {
+        return column.key === sorterController.columnKey;
+      });
+      var sorterFunc = typeof (sortedColumn === null || sortedColumn === void 0 ? void 0 : sortedColumn.sorter) === 'function' ? sortedColumn.sorter : undefined;
+      return sortObjectsByProperty(dataSource, sorterController.columnKey, sorterController.sorterType, sorterFunc);
+    }
+    return dataSource;
+  }, [sorterController, dataSource, columns]);
+  return /*#__PURE__*/React.createElement(TableContainer, null, /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
+    span: 8
+  }, /*#__PURE__*/React.createElement(TableTitle, null, title)), /*#__PURE__*/React.createElement(Col, {
+    span: 16
+  }, /*#__PURE__*/React.createElement(TableToolbar, null, /*#__PURE__*/React.createElement(Space, null, actions === null || actions === void 0 ? void 0 : actions.map(function (element) {
+    if ( /*#__PURE__*/React.isValidElement(element)) {
+      var action = element;
+      return /*#__PURE__*/React.cloneElement(action, {
+        size: 'default'
+      });
+    } else {
+      return element;
+    }
+  }))))), /*#__PURE__*/React.createElement(TableContent, {
+    onScroll: function onScroll(e) {
+      var tableContainer = e.target;
+      if (boxShadowBox.current) {
+        if (tableContainer.scrollLeft === 0) {
+          boxShadowBox.current.style.opacity = '0';
+        } else {
+          boxShadowBox.current.style.opacity = '1';
+        }
+        boxShadowBox.current.style.left = tableContainer.scrollLeft + scrollLeftOffset + 'px';
+      }
+    }
+  }, scroll && /*#__PURE__*/React.createElement(BoxShadowBox, {
+    ref: boxShadowBox,
+    width: "10px",
+    height: "100%",
+    offsetLeft: "-999px"
+  }), /*#__PURE__*/React.createElement(TableHeaderRow, {
+    columns: headerColumns,
+    rowData: titleRowData,
+    isFlex: !scroll
+  }), /*#__PURE__*/React.createElement(TableBody, {
+    direction: "column"
+  }, formatedDataSource.map(function (rowData) {
+    return /*#__PURE__*/React.createElement(TableBodyRow, {
+      key: rowData[rowKey]
+    }, /*#__PURE__*/React.createElement(Columns, {
+      rowData: rowData,
+      columns: columns,
+      isFlex: !scroll
+    }));
+  }))), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Pagination, _extends({}, pagination, {
+    total: pagination.total || dataSource.length,
+    justifyContent: "right",
+    onChange: function onChange(current, pageSize) {
+      _onChange2 === null || _onChange2 === void 0 || _onChange2({
+        current: current,
+        pageSize: pageSize
+      });
+    }
+  })));
+}

package/dist/Table/index.d.ts

@@ -0,0 +1 @@
+export { default as Table, type TableProps } from './Table';

package/dist/Table/index.js

@@ -0,0 +1 @@
+export { default as Table } from "./Table";

package/dist/Tag/Tag.d.ts

@@ -0,0 +1,7 @@
+import React, { ReactNode } from 'react';
+export type TagProps = {
+    children: ReactNode;
+    color: string;
+};
+declare const Tag: React.FC<TagProps>;
+export default Tag;

package/dist/Tag/Tag.js

@@ -0,0 +1,16 @@
+var _excluded = ["children"];
+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; }
+import React from 'react';
+import styled from 'styled-components';
+import theme from "../__consts/theme";
+var StyledTag = styled.span.withConfig({
+  displayName: "StyledTag",
+  componentId: "basic-component-347b__sc-14fuyeq-0"
+})(["background-color:", ";color:1px soild ", ";"], theme.defaultTagBackgroundColor, theme.defaultTagColor);
+var Tag = function Tag(_ref) {
+  var children = _ref.children,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(StyledTag, rest, children);
+};
+export default Tag;

package/dist/Tree/BOMTree.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/Tree/BOMTree.js

@@ -0,0 +1,111 @@
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { GlobalStyles, Tree } from "./..";
+import React, { useState } from 'react';
+import styled from 'styled-components';
+var Title = styled.div.withConfig({
+  displayName: "Title",
+  componentId: "basic-component-347b__sc-klaw2r-0"
+})(["width:100%;text-align:center;"]);
+export default (function () {
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedKeys = _useState2[0],
+    setSelectedKeys = _useState2[1];
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    expandedKeys = _useState4[0],
+    setExpandedKeys = _useState4[1];
+  var treeData = [{
+    key: '1',
+    title: 'jss',
+    count: 1,
+    children: [{
+      key: '4',
+      title: 'skjdfkljasklfjkljdsklajfkl就是要长一的点点滴滴的点点滴滴哒哒哒哒哒哒哒哒哒哒哒哒哒哒',
+      children: []
+    }, {
+      key: '5',
+      title: 567,
+      children: []
+    }, {
+      key: '6',
+      title: 789,
+      children: []
+    }]
+  }, {
+    key: '2121212121212',
+    title: '2',
+    count: 1,
+    children: []
+  }, {
+    key: '3',
+    title: 'jss',
+    name: 'jss',
+    children: [],
+    count: 2
+  }, {
+    key: '10',
+    title: 'jss',
+    name: 'jss',
+    children: [],
+    count: 2
+  }, {
+    key: '20',
+    title: '3',
+    children: [],
+    count: 2
+  }];
+  var columns = [{
+    key: 'key',
+    title: '键值',
+    dataIndex: 'key',
+    align: 'center',
+    width: 400,
+    fixed: 'left'
+  }, {
+    key: 'name',
+    title: '姓名',
+    dataIndex: 'name',
+    align: 'center'
+  }, {
+    key: 'count',
+    title: '数量',
+    dataIndex: 'count',
+    align: 'center'
+  }];
+  var contextMenuRender = function contextMenuRender(node) {
+    return [{
+      key: 'delete',
+      label: "\u5220\u9664 node".concat(node.key)
+    }, {
+      key: 'add',
+      label: '新增'
+    }, {
+      key: 'edit',
+      label: '编辑'
+    }];
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(GlobalStyles, {
+    $css: []
+  }), /*#__PURE__*/React.createElement(Tree, {
+    title: /*#__PURE__*/React.createElement(Title, null, "\u6807\u8BC6"),
+    titleWidth: 400,
+    contextMenuRender: contextMenuRender,
+    treeData: treeData,
+    columns: columns,
+    selectedKeys: selectedKeys,
+    expandedKeys: expandedKeys,
+    onSelect: function onSelect(selectedKeys) {
+      return setSelectedKeys(selectedKeys);
+    },
+    onExpand: function onExpand(expandedKeys) {
+      return setExpandedKeys(expandedKeys);
+    },
+    groupBy: "count"
+  }));
+});

package/dist/Tree/MainProperties.d.ts

@@ -0,0 +1,12 @@
+import React, { ReactNode } from 'react';
+export declare const MainArea: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HtmlHTMLAttributes<HTMLDivElement> | keyof import("../Flex").FlexItemProps> & import("../Flex").FlexItemProps & React.HtmlHTMLAttributes<HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+type MainPropertyProps = {
+    mainWidth?: number;
+    main: ReactNode;
+    property?: ReactNode;
+    isFlex: boolean;
+};
+export declare const MainProperty: React.FC<MainPropertyProps>;
+export {};

package/dist/Tree/MainProperties.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import styled from 'styled-components';
+import { Flex, FlexItem } from "../Flex";
+export var MainArea = styled(FlexItem).withConfig({
+  displayName: "MainArea",
+  componentId: "basic-component-347b__sc-u1pspr-0"
+})(["overflow:hidden;position:sticky;left:0;z-index:20;align-self:stretch;display:flex;align-items:center;border-right:var(--kep-platform-line-width) var(--kep-platform-line-type) var(--kep-platform-color-border-secondary);border-bottom:var(--kep-platform-line-width) var(--kep-platform-line-type) var(--kep-platform-color-border-secondary);"]);
+var PropertiesArea = styled(FlexItem).withConfig({
+  displayName: "PropertiesArea",
+  componentId: "basic-component-347b__sc-u1pspr-1"
+})([""]);
+/* 有属性就渲染属性，没有属性就不处理 */
+export var MainProperty = function MainProperty(_ref) {
+  var mainWidth = _ref.mainWidth,
+    main = _ref.main,
+    property = _ref.property,
+    isFlex = _ref.isFlex;
+  if (property) return /*#__PURE__*/React.createElement(Flex, null, /*#__PURE__*/React.createElement(MainArea, {
+    width: mainWidth
+  }, main), /*#__PURE__*/React.createElement(PropertiesArea, {
+    flex: isFlex ? 1 : undefined
+  }, property));else return main;
+};

package/dist/Tree/Tree.d.ts

@@ -0,0 +1,20 @@
+import React, { Key, ReactNode } from 'react';
+export type TreeProps = {
+    treeData: TreeNodeType[];
+    expandedKeys?: Key[];
+    selectedKeys?: Key[];
+    fieldNames?: TreeFieldNames;
+    multiple?: boolean;
+    columns?: ColumnType[];
+    titleRender?: ((node: TreeNodeType) => ReactNode | null) | null | undefined;
+    onExpand?: onExpandHandler;
+    onSelect?: onSelectHandler;
+    contextMenuRender: (node: TreeNodeType) => MenuItem[];
+    titleWidth?: number;
+    title?: ReactNode;
+    isFlex?: boolean;
+    bordered?: boolean;
+    groupBy?: string | null;
+};
+declare const Tree: React.FC<TreeProps>;
+export default Tree;