@aloudata/aloudata-design 0.1.0-beta.3 → 0.2.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -0
- package/es/Button/demo/Icon/index.js +0 -3
- package/es/Button/demo/basic/index.js +1 -4
- package/es/Dropdown/demo/button/index.js +1 -1
- package/es/Empty/index.d.ts +8 -0
- package/es/Empty/index.js +57 -0
- package/es/Empty/style/index.d.ts +1 -0
- package/es/Empty/style/index.js +1 -0
- package/es/Empty/style/index.less +23 -0
- package/es/Icon/iconfont/demo_index.html +26 -3
- package/es/Icon/iconfont/iconfont.css +7 -3
- package/es/Icon/iconfont/iconfont.js +1 -1
- package/es/Icon/iconfont/iconfont.json +7 -0
- package/es/Icon/iconfont/iconfont.ttf +0 -0
- package/es/Icon/iconfont/iconfont.woff +0 -0
- package/es/Icon/iconfont/iconfont.woff2 +0 -0
- package/es/Icon/index.less +2 -2
- package/es/Input/components/Group/index.d.ts +0 -1
- package/es/Input/components/Password/index.d.ts +0 -1
- package/es/Menu/Divider.d.ts +0 -1
- package/es/Menu/style/index.less +4 -0
- package/es/Navigator/components/Menu/index.d.ts +19 -0
- package/es/Navigator/components/Menu/index.js +187 -0
- package/es/Navigator/demo/basic/index.d.ts +4 -0
- package/es/Navigator/demo/basic/index.js +45 -0
- package/es/Navigator/demo/basic/index.less +3 -0
- package/es/Navigator/demo/example/index.d.ts +4 -0
- package/es/Navigator/demo/example/index.js +153 -0
- package/es/Navigator/demo/example/index.less +10 -0
- package/es/Navigator/demo/logo.png +0 -0
- package/es/Navigator/demo/menuWithFooter/index.d.ts +4 -0
- package/es/Navigator/demo/menuWithFooter/index.js +73 -0
- package/es/Navigator/demo/menuWithFooter/index.less +3 -0
- package/es/Navigator/demo/subMenu/index.d.ts +4 -0
- package/es/Navigator/demo/subMenu/index.js +71 -0
- package/es/Navigator/demo/subMenu/index.less +3 -0
- package/es/Navigator/index.d.ts +41 -0
- package/es/Navigator/index.js +45 -0
- package/es/Navigator/style/index.d.ts +2 -0
- package/es/Navigator/style/index.js +2 -0
- package/es/Navigator/style/index.less +224 -0
- package/es/Select/OptionsList/OptionItem/RenderTooltip.js +2 -3
- package/es/Select/OptionsList/Options.d.ts +2 -2
- package/es/Select/OptionsList/index.js +1 -1
- package/es/Select/Selector/index.d.ts +2 -2
- package/es/Select/Selector/index.js +9 -6
- package/es/Select/demo/single/index.d.ts +1 -0
- package/es/Select/demo/single/index.js +4 -1
- package/es/Select/demo/single/index.less +5 -0
- package/es/Select/interface.d.ts +1 -2
- package/es/Select/style/index.less +2 -10
- package/es/Table/demo/basic/createData.d.ts +9 -0
- package/es/Table/demo/basic/createData.js +18 -0
- package/es/Table/demo/basic/index.d.ts +2 -0
- package/es/Table/demo/basic/index.js +64 -0
- package/es/Table/demo/editCell/index.d.ts +2 -0
- package/es/Table/demo/editCell/index.js +39 -0
- package/es/Table/demo/renderHeaderRight/index.d.ts +2 -0
- package/es/Table/demo/renderHeaderRight/index.js +37 -0
- package/es/Table/demo/rowSelect/index.d.ts +2 -0
- package/es/Table/demo/rowSelect/index.js +40 -0
- package/es/Table/demo/virtualList/index.d.ts +2 -0
- package/es/Table/demo/virtualList/index.js +88 -0
- package/es/Table/index.d.ts +5 -0
- package/es/Table/index.js +201 -0
- package/es/Table/interface.d.ts +14 -0
- package/es/Table/interface.js +1 -0
- package/es/Table/style/index.d.ts +2 -0
- package/es/Table/style/index.js +2 -0
- package/es/Table/style/index.less +111 -0
- package/es/Tooltip/index.d.ts +1 -0
- package/es/Tooltip/index.js +3 -1
- package/es/index.d.ts +2 -0
- package/es/index.js +3 -1
- package/es/style/themes/default/index.less +1 -1
- package/es/style/themes/default/{themeColor.less → themeColor.module.less} +0 -0
- package/es/style/themes/default/themeColor.module.less.d.ts +108 -0
- package/lib/Button/demo/Icon/index.js +0 -3
- package/lib/Button/demo/basic/index.js +1 -4
- package/lib/Dropdown/demo/button/index.js +1 -1
- package/lib/Empty/index.d.ts +8 -0
- package/lib/Empty/index.js +71 -0
- package/lib/Empty/style/index.d.ts +1 -0
- package/lib/Empty/style/index.js +3 -0
- package/lib/Empty/style/index.less +23 -0
- package/lib/Icon/iconfont/demo_index.html +26 -3
- package/lib/Icon/iconfont/iconfont.css +7 -3
- package/lib/Icon/iconfont/iconfont.js +1 -1
- package/lib/Icon/iconfont/iconfont.json +7 -0
- package/lib/Icon/iconfont/iconfont.ttf +0 -0
- package/lib/Icon/iconfont/iconfont.woff +0 -0
- package/lib/Icon/iconfont/iconfont.woff2 +0 -0
- package/lib/Icon/index.less +2 -2
- package/lib/Input/components/Group/index.d.ts +0 -1
- package/lib/Input/components/Password/index.d.ts +0 -1
- package/lib/Menu/Divider.d.ts +0 -1
- package/lib/Menu/style/index.less +4 -0
- package/lib/Navigator/components/Menu/index.d.ts +19 -0
- package/lib/Navigator/components/Menu/index.js +205 -0
- package/lib/Navigator/demo/basic/index.d.ts +4 -0
- package/lib/Navigator/demo/basic/index.js +62 -0
- package/lib/Navigator/demo/basic/index.less +3 -0
- package/lib/Navigator/demo/example/index.d.ts +4 -0
- package/lib/Navigator/demo/example/index.js +179 -0
- package/lib/Navigator/demo/example/index.less +10 -0
- package/lib/Navigator/demo/logo.png +0 -0
- package/lib/Navigator/demo/menuWithFooter/index.d.ts +4 -0
- package/lib/Navigator/demo/menuWithFooter/index.js +92 -0
- package/lib/Navigator/demo/menuWithFooter/index.less +3 -0
- package/lib/Navigator/demo/subMenu/index.d.ts +4 -0
- package/lib/Navigator/demo/subMenu/index.js +88 -0
- package/lib/Navigator/demo/subMenu/index.less +3 -0
- package/lib/Navigator/index.d.ts +41 -0
- package/lib/Navigator/index.js +64 -0
- package/lib/Navigator/style/index.d.ts +2 -0
- package/lib/Navigator/style/index.js +5 -0
- package/lib/Navigator/style/index.less +224 -0
- package/lib/Select/OptionsList/OptionItem/RenderTooltip.js +3 -5
- package/lib/Select/OptionsList/Options.d.ts +2 -2
- package/lib/Select/OptionsList/index.js +1 -1
- package/lib/Select/Selector/index.d.ts +2 -2
- package/lib/Select/Selector/index.js +11 -8
- package/lib/Select/demo/single/index.d.ts +1 -0
- package/lib/Select/demo/single/index.js +5 -1
- package/lib/Select/demo/single/index.less +5 -0
- package/lib/Select/interface.d.ts +1 -2
- package/lib/Select/style/index.less +2 -10
- package/lib/Table/demo/basic/createData.d.ts +9 -0
- package/lib/Table/demo/basic/createData.js +23 -0
- package/lib/Table/demo/basic/index.d.ts +2 -0
- package/lib/Table/demo/basic/index.js +80 -0
- package/lib/Table/demo/editCell/index.d.ts +2 -0
- package/lib/Table/demo/editCell/index.js +54 -0
- package/lib/Table/demo/renderHeaderRight/index.d.ts +2 -0
- package/lib/Table/demo/renderHeaderRight/index.js +52 -0
- package/lib/Table/demo/rowSelect/index.d.ts +2 -0
- package/lib/Table/demo/rowSelect/index.js +55 -0
- package/lib/Table/demo/virtualList/index.d.ts +2 -0
- package/lib/Table/demo/virtualList/index.js +103 -0
- package/lib/Table/index.d.ts +5 -0
- package/lib/Table/index.js +225 -0
- package/lib/Table/interface.d.ts +14 -0
- package/lib/Table/interface.js +5 -0
- package/lib/Table/style/index.d.ts +2 -0
- package/lib/Table/style/index.js +5 -0
- package/lib/Table/style/index.less +111 -0
- package/lib/Tooltip/index.d.ts +1 -0
- package/lib/Tooltip/index.js +3 -1
- package/lib/index.d.ts +2 -0
- package/lib/index.js +16 -0
- package/lib/style/themes/default/index.less +1 -1
- package/lib/style/themes/default/{themeColor.less → themeColor.module.less} +0 -0
- package/lib/style/themes/default/themeColor.module.less.d.ts +108 -0
- package/package.json +13 -5
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
+
|
|
3
|
+
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."); }
|
|
4
|
+
|
|
5
|
+
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); }
|
|
6
|
+
|
|
7
|
+
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; }
|
|
8
|
+
|
|
9
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
10
|
+
|
|
11
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
12
|
+
|
|
13
|
+
import React from 'react';
|
|
14
|
+
import { Table } from '@aloudata/aloudata-design';
|
|
15
|
+
import { makeData } from '../basic/createData';
|
|
16
|
+
var columns = [{
|
|
17
|
+
Header: 'First Name',
|
|
18
|
+
accessor: 'firstName',
|
|
19
|
+
width: 150
|
|
20
|
+
}, {
|
|
21
|
+
Header: 'Last Name',
|
|
22
|
+
accessor: 'lastName'
|
|
23
|
+
}, {
|
|
24
|
+
Header: 'Age',
|
|
25
|
+
accessor: 'age'
|
|
26
|
+
}, {
|
|
27
|
+
Header: 'Visits',
|
|
28
|
+
accessor: 'visits'
|
|
29
|
+
}, {
|
|
30
|
+
Header: 'Status',
|
|
31
|
+
accessor: 'status'
|
|
32
|
+
}, {
|
|
33
|
+
Header: 'Profile Progress',
|
|
34
|
+
accessor: 'progress'
|
|
35
|
+
}];
|
|
36
|
+
export default (function () {
|
|
37
|
+
var _React$useState = React.useState([]),
|
|
38
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
39
|
+
data = _React$useState2[0],
|
|
40
|
+
setData = _React$useState2[1];
|
|
41
|
+
|
|
42
|
+
var _React$useState3 = React.useState(false),
|
|
43
|
+
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
44
|
+
loading = _React$useState4[0],
|
|
45
|
+
setLoading = _React$useState4[1];
|
|
46
|
+
|
|
47
|
+
var _React$useState5 = React.useState(true),
|
|
48
|
+
_React$useState6 = _slicedToArray(_React$useState5, 2),
|
|
49
|
+
hasNextPage = _React$useState6[0],
|
|
50
|
+
setHasNextPage = _React$useState6[1];
|
|
51
|
+
|
|
52
|
+
var _React$useState7 = React.useState(1),
|
|
53
|
+
_React$useState8 = _slicedToArray(_React$useState7, 2),
|
|
54
|
+
currentPage = _React$useState8[0],
|
|
55
|
+
setCurrentPage = _React$useState8[1];
|
|
56
|
+
|
|
57
|
+
var pageSize = 10;
|
|
58
|
+
|
|
59
|
+
var loadMoreItems = function loadMoreItems() {
|
|
60
|
+
return new Promise(function (resolve) {
|
|
61
|
+
setLoading(true);
|
|
62
|
+
setTimeout(function () {
|
|
63
|
+
var newData = makeData(pageSize * currentPage);
|
|
64
|
+
setCurrentPage(currentPage + 1);
|
|
65
|
+
setLoading(false);
|
|
66
|
+
|
|
67
|
+
if (newData.length > 100) {
|
|
68
|
+
setHasNextPage(false);
|
|
69
|
+
} else {
|
|
70
|
+
setData(newData);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
resolve();
|
|
74
|
+
}, 1000);
|
|
75
|
+
});
|
|
76
|
+
};
|
|
77
|
+
|
|
78
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
79
|
+
className: "ald-input-demo"
|
|
80
|
+
}, /*#__PURE__*/React.createElement(Table, {
|
|
81
|
+
columns: columns,
|
|
82
|
+
scrollY: 450,
|
|
83
|
+
loading: loading,
|
|
84
|
+
data: data,
|
|
85
|
+
loadMore: loadMoreItems,
|
|
86
|
+
hasNextPage: hasNextPage
|
|
87
|
+
}));
|
|
88
|
+
});
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { ReactElement } from 'react';
|
|
2
|
+
import './style';
|
|
3
|
+
import { ITableProps } from './interface';
|
|
4
|
+
declare function Table<T extends Record<string, unknown>>({ columns, data, total, renderHeaderLeft, renderHeaderRight, scrollY, onRowSelected, loadMore, hasNextPage, loading, }: ITableProps<T>): ReactElement;
|
|
5
|
+
export default Table;
|
|
@@ -0,0 +1,201 @@
|
|
|
1
|
+
var _excluded = ["style"],
|
|
2
|
+
_excluded2 = ["style"];
|
|
3
|
+
|
|
4
|
+
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; }
|
|
5
|
+
|
|
6
|
+
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; }
|
|
7
|
+
|
|
8
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
9
|
+
|
|
10
|
+
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."); }
|
|
11
|
+
|
|
12
|
+
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); }
|
|
13
|
+
|
|
14
|
+
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; }
|
|
15
|
+
|
|
16
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
17
|
+
|
|
18
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
19
|
+
|
|
20
|
+
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; }
|
|
21
|
+
|
|
22
|
+
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; }
|
|
23
|
+
|
|
24
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
25
|
+
|
|
26
|
+
// @ts-nocheck
|
|
27
|
+
import React, { useCallback, useMemo } from 'react';
|
|
28
|
+
import { useTable, useBlockLayout, useRowSelect } from 'react-table';
|
|
29
|
+
import usePrefixCls from '../_utils/hooks/usePrefixCls';
|
|
30
|
+
import { FixedSizeList } from 'react-window';
|
|
31
|
+
import InfiniteLoader from 'react-window-infinite-loader';
|
|
32
|
+
import classnames from 'classnames';
|
|
33
|
+
import './style';
|
|
34
|
+
import Icon from '../Icon';
|
|
35
|
+
import Empty from '../Empty';
|
|
36
|
+
var DEFAULT_ROW_HEIGHT = 40;
|
|
37
|
+
|
|
38
|
+
function Table(_ref) {
|
|
39
|
+
var columns = _ref.columns,
|
|
40
|
+
data = _ref.data,
|
|
41
|
+
total = _ref.total,
|
|
42
|
+
renderHeaderLeft = _ref.renderHeaderLeft,
|
|
43
|
+
renderHeaderRight = _ref.renderHeaderRight,
|
|
44
|
+
scrollY = _ref.scrollY,
|
|
45
|
+
onRowSelected = _ref.onRowSelected,
|
|
46
|
+
_ref$loadMore = _ref.loadMore,
|
|
47
|
+
loadMore = _ref$loadMore === void 0 ? function () {} : _ref$loadMore,
|
|
48
|
+
hasNextPage = _ref.hasNextPage,
|
|
49
|
+
loading = _ref.loading;
|
|
50
|
+
var newColumns = useMemo(function () {
|
|
51
|
+
return columns.map(function (column) {
|
|
52
|
+
// @ts-ignore
|
|
53
|
+
if (column.Cell) {
|
|
54
|
+
return _objectSpread(_objectSpread({}, column), {}, {
|
|
55
|
+
// @ts-ignore
|
|
56
|
+
Cell: function Cell(instance) {
|
|
57
|
+
// eslint-disable-next-line
|
|
58
|
+
return column.Cell(instance.row.original);
|
|
59
|
+
}
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
return column;
|
|
64
|
+
});
|
|
65
|
+
}, [columns]);
|
|
66
|
+
|
|
67
|
+
var _useTable = useTable({
|
|
68
|
+
columns: newColumns,
|
|
69
|
+
data: data
|
|
70
|
+
}, useBlockLayout, useRowSelect),
|
|
71
|
+
getTableProps = _useTable.getTableProps,
|
|
72
|
+
getTableBodyProps = _useTable.getTableBodyProps,
|
|
73
|
+
headerGroups = _useTable.headerGroups,
|
|
74
|
+
rows = _useTable.rows,
|
|
75
|
+
prepareRow = _useTable.prepareRow;
|
|
76
|
+
|
|
77
|
+
var _React$useState = React.useState(null),
|
|
78
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
79
|
+
selectedRowId = _React$useState2[0],
|
|
80
|
+
setSelectedRowId = _React$useState2[1];
|
|
81
|
+
|
|
82
|
+
var prefixCls = usePrefixCls('blockTable');
|
|
83
|
+
|
|
84
|
+
function getTbodyStyle() {
|
|
85
|
+
if (scrollY) {
|
|
86
|
+
return {
|
|
87
|
+
height: "".concat(scrollY, "px")
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
return {};
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
var onRowClick = useCallback(function (row) {
|
|
95
|
+
if (!onRowSelected) {
|
|
96
|
+
return;
|
|
97
|
+
} // @ts-ignore
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
setSelectedRowId(row.id);
|
|
101
|
+
onRowSelected(row.original);
|
|
102
|
+
}, [onRowSelected]);
|
|
103
|
+
var itemCount = hasNextPage ? data.length + 1 : data.length;
|
|
104
|
+
var loadMoreItems = loading ? function () {} : loadMore;
|
|
105
|
+
|
|
106
|
+
var isItemLoaded = function isItemLoaded(index) {
|
|
107
|
+
return !hasNextPage || index < data.length;
|
|
108
|
+
};
|
|
109
|
+
|
|
110
|
+
var RenderRow = function RenderRow(_ref2) {
|
|
111
|
+
var index = _ref2.index,
|
|
112
|
+
style = _ref2.style;
|
|
113
|
+
|
|
114
|
+
if (!isItemLoaded(index)) {
|
|
115
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
116
|
+
style: style,
|
|
117
|
+
className: classnames("".concat(prefixCls, "-loading"))
|
|
118
|
+
}, /*#__PURE__*/React.createElement(Icon, {
|
|
119
|
+
type: "waiting",
|
|
120
|
+
size: 16
|
|
121
|
+
}), "Loading");
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
var row = rows[index];
|
|
125
|
+
prepareRow(row);
|
|
126
|
+
|
|
127
|
+
var _row$getRowProps = row.getRowProps(),
|
|
128
|
+
rowStyle = _row$getRowProps.style,
|
|
129
|
+
rowProps = _objectWithoutProperties(_row$getRowProps, _excluded);
|
|
130
|
+
|
|
131
|
+
return /*#__PURE__*/React.createElement("div", _objectSpread(_objectSpread({}, rowProps), {}, {
|
|
132
|
+
style: _objectSpread(_objectSpread({}, style), {}, {
|
|
133
|
+
display: rowStyle === null || rowStyle === void 0 ? void 0 : rowStyle.display
|
|
134
|
+
}),
|
|
135
|
+
className: classnames("".concat(prefixCls, "-row"), _defineProperty({}, "".concat(prefixCls, "-row-selected"), row.id === selectedRowId)),
|
|
136
|
+
onClick: function onClick() {
|
|
137
|
+
return onRowClick(row);
|
|
138
|
+
}
|
|
139
|
+
}), row.cells.map(function (cell) {
|
|
140
|
+
return /*#__PURE__*/React.createElement("div", _objectSpread(_objectSpread({}, cell.getCellProps()), {}, {
|
|
141
|
+
className: classnames("".concat(prefixCls, "-cell"))
|
|
142
|
+
}), cell.render('Cell'));
|
|
143
|
+
}));
|
|
144
|
+
};
|
|
145
|
+
|
|
146
|
+
var renderHeader = function renderHeader(len) {
|
|
147
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
148
|
+
className: classnames("".concat(prefixCls, "-header"))
|
|
149
|
+
}, renderHeaderLeft ? renderHeaderLeft() : /*#__PURE__*/React.createElement("span", {
|
|
150
|
+
className: classnames("".concat(prefixCls, "-header-left"))
|
|
151
|
+
}, "\u5171", total || len, "\u6761"), /*#__PURE__*/React.createElement("div", {
|
|
152
|
+
className: classnames("".concat(prefixCls, "-header-right"))
|
|
153
|
+
}, renderHeaderRight ? renderHeaderRight() : null));
|
|
154
|
+
};
|
|
155
|
+
|
|
156
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
157
|
+
className: prefixCls
|
|
158
|
+
}, renderHeader(data.length), /*#__PURE__*/React.createElement("div", _objectSpread({}, getTableProps()), /*#__PURE__*/React.createElement("div", {
|
|
159
|
+
className: classnames("".concat(prefixCls, "-thead"))
|
|
160
|
+
}, headerGroups.map(function (headerGroup) {
|
|
161
|
+
var _headerGroup$getHeade = headerGroup.getHeaderGroupProps(),
|
|
162
|
+
style = _headerGroup$getHeade.style,
|
|
163
|
+
headerGroupProps = _objectWithoutProperties(_headerGroup$getHeade, _excluded2);
|
|
164
|
+
|
|
165
|
+
return /*#__PURE__*/React.createElement("div", _objectSpread(_objectSpread({}, headerGroupProps), {}, {
|
|
166
|
+
style: {
|
|
167
|
+
display: style === null || style === void 0 ? void 0 : style.display
|
|
168
|
+
},
|
|
169
|
+
className: classnames("".concat(prefixCls, "-row"))
|
|
170
|
+
}), headerGroup.headers.map(function (column) {
|
|
171
|
+
return /*#__PURE__*/React.createElement("div", _objectSpread(_objectSpread({}, column.getHeaderProps()), {}, {
|
|
172
|
+
className: classnames("".concat(prefixCls, "-cell"))
|
|
173
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
174
|
+
className: classnames("".concat(prefixCls, "-dragBar"))
|
|
175
|
+
}), column.render('Header'));
|
|
176
|
+
}));
|
|
177
|
+
})), /*#__PURE__*/React.createElement("div", _objectSpread(_objectSpread({}, getTableBodyProps()), {}, {
|
|
178
|
+
className: classnames("".concat(prefixCls, "-tbody"), _defineProperty({}, "".concat(prefixCls, "-tbody-scroll"), !loadMoreItems)),
|
|
179
|
+
style: getTbodyStyle()
|
|
180
|
+
}), !loading && !rows.length && /*#__PURE__*/React.createElement(Empty, {
|
|
181
|
+
description: "\u5F53\u524D\u65E0\u6570\u636E"
|
|
182
|
+
}), /*#__PURE__*/React.createElement(InfiniteLoader, {
|
|
183
|
+
isItemLoaded: isItemLoaded,
|
|
184
|
+
itemCount: itemCount,
|
|
185
|
+
loadMoreItems: loadMoreItems
|
|
186
|
+
}, function (_ref3) {
|
|
187
|
+
var onItemsRendered = _ref3.onItemsRendered,
|
|
188
|
+
ref = _ref3.ref;
|
|
189
|
+
return /*#__PURE__*/React.createElement(FixedSizeList, {
|
|
190
|
+
itemCount: itemCount,
|
|
191
|
+
onItemsRendered: onItemsRendered,
|
|
192
|
+
height: scrollY || data.length * DEFAULT_ROW_HEIGHT,
|
|
193
|
+
itemSize: DEFAULT_ROW_HEIGHT,
|
|
194
|
+
width: "100%",
|
|
195
|
+
ref: ref,
|
|
196
|
+
className: classnames("".concat(prefixCls, "-list"))
|
|
197
|
+
}, RenderRow);
|
|
198
|
+
}))));
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
export default Table;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { Column } from 'react-table';
|
|
3
|
+
export interface ITableProps<T extends object> {
|
|
4
|
+
columns: Column<T>[];
|
|
5
|
+
data: T[];
|
|
6
|
+
total?: number;
|
|
7
|
+
scrollY?: number;
|
|
8
|
+
onRowSelected?: (row: T) => void;
|
|
9
|
+
loadMore?: (startIndex: number, stopIndex: number) => void | Promise<void>;
|
|
10
|
+
hasNextPage: boolean;
|
|
11
|
+
loading: boolean;
|
|
12
|
+
renderHeaderLeft: () => React.ReactNode;
|
|
13
|
+
renderHeaderRight: () => React.ReactNode;
|
|
14
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
@import '../../style/index.less';
|
|
2
|
+
|
|
3
|
+
@ald-prefix:ant;
|
|
4
|
+
@ald-iconfont-css-prefix:anticon;
|
|
5
|
+
@table-row-height:40px;
|
|
6
|
+
.@{ald-prefix}-blockTable {
|
|
7
|
+
&-thead {
|
|
8
|
+
.@{ald-prefix}-blockTable-cell {
|
|
9
|
+
position: relative;
|
|
10
|
+
color: @NL50;
|
|
11
|
+
// border: 1px solid red;
|
|
12
|
+
|
|
13
|
+
.@{ald-prefix}-blockTable-dragBar {
|
|
14
|
+
display: inline-block;
|
|
15
|
+
background: blue;
|
|
16
|
+
width: 1px;
|
|
17
|
+
height: 12px;
|
|
18
|
+
position: absolute;
|
|
19
|
+
top: 50%;
|
|
20
|
+
left: 0;
|
|
21
|
+
transform: translateY(-50%);
|
|
22
|
+
z-index: 1;
|
|
23
|
+
touch-action: none;
|
|
24
|
+
background-color: @NL95;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
&:first-child {
|
|
28
|
+
.@{ald-prefix}-blockTable-dragBar {
|
|
29
|
+
display: none;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
&-tbody {
|
|
36
|
+
overflow: hidden;
|
|
37
|
+
|
|
38
|
+
&-scroll {
|
|
39
|
+
overflow-y: scroll;
|
|
40
|
+
overflow-y: overlay;
|
|
41
|
+
}
|
|
42
|
+
.@{ald-prefix}-blockTable-row {
|
|
43
|
+
&:hover {
|
|
44
|
+
background-color: @NL97;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
&-selected {
|
|
48
|
+
background-color: @BBG97;
|
|
49
|
+
|
|
50
|
+
&:hover {
|
|
51
|
+
background-color: @BBG97;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&:last-of-type {
|
|
56
|
+
.@{ald-prefix}-blockTable-cell {
|
|
57
|
+
border-bottom: 1px solid transparent;
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
&-row {
|
|
64
|
+
max-width: 100%;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
&-cell {
|
|
68
|
+
padding: 0 12px;
|
|
69
|
+
height: @table-row-height;
|
|
70
|
+
line-height: @table-row-height;
|
|
71
|
+
border-bottom: 1px solid @NL95;
|
|
72
|
+
text-align: left;
|
|
73
|
+
color: @NL0;
|
|
74
|
+
overflow: hidden;
|
|
75
|
+
white-space: nowrap;
|
|
76
|
+
text-overflow: ellipsis;
|
|
77
|
+
flex-grow: 1;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
&-loading {
|
|
81
|
+
text-align: center;
|
|
82
|
+
line-height: @table-row-height;
|
|
83
|
+
color: @NL80;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
&-header {
|
|
87
|
+
display: flex;
|
|
88
|
+
justify-content: space-between;
|
|
89
|
+
padding: 0 10px;
|
|
90
|
+
align-items: center;
|
|
91
|
+
margin-bottom: 24px;
|
|
92
|
+
|
|
93
|
+
&-left {
|
|
94
|
+
font-weight: 500;
|
|
95
|
+
font-size: 14px;
|
|
96
|
+
color: @NL0;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
&-right {
|
|
100
|
+
display: flex;
|
|
101
|
+
height: 28px;
|
|
102
|
+
align-items: center;
|
|
103
|
+
font-size: 14px;
|
|
104
|
+
color: @NL0;
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
&-list {
|
|
109
|
+
overflow: overlay !important;
|
|
110
|
+
}
|
|
111
|
+
}
|
package/es/Tooltip/index.d.ts
CHANGED
package/es/Tooltip/index.js
CHANGED
|
@@ -14,6 +14,7 @@ export default function Tooltip(props) {
|
|
|
14
14
|
mouseLeaveDelay = props.mouseLeaveDelay,
|
|
15
15
|
getPopupContainer = props.getPopupContainer,
|
|
16
16
|
destroyTooltipOnHide = props.destroyTooltipOnHide,
|
|
17
|
+
getTooltipContainer = props.getTooltipContainer,
|
|
17
18
|
overlayClassName = props.overlayClassName;
|
|
18
19
|
return /*#__PURE__*/React.createElement(AntdTooltip, {
|
|
19
20
|
title: title,
|
|
@@ -26,6 +27,7 @@ export default function Tooltip(props) {
|
|
|
26
27
|
mouseEnterDelay: mouseEnterDelay,
|
|
27
28
|
mouseLeaveDelay: mouseLeaveDelay,
|
|
28
29
|
getPopupContainer: getPopupContainer,
|
|
29
|
-
destroyTooltipOnHide: destroyTooltipOnHide
|
|
30
|
+
destroyTooltipOnHide: destroyTooltipOnHide,
|
|
31
|
+
getTooltipContainer: getTooltipContainer
|
|
30
32
|
}, children);
|
|
31
33
|
}
|
package/es/index.d.ts
CHANGED
|
@@ -6,3 +6,5 @@ export { default as Input } from './Input';
|
|
|
6
6
|
export { default as Tabs } from './Tabs';
|
|
7
7
|
export { default as Tooltip } from './Tooltip';
|
|
8
8
|
export { default as Select } from './Select';
|
|
9
|
+
export { default as Table } from './Table';
|
|
10
|
+
export { default as Navigator } from './Navigator';
|
package/es/index.js
CHANGED
|
@@ -5,4 +5,6 @@ export { default as Menu } from './Menu';
|
|
|
5
5
|
export { default as Input } from './Input';
|
|
6
6
|
export { default as Tabs } from './Tabs';
|
|
7
7
|
export { default as Tooltip } from './Tooltip';
|
|
8
|
-
export { default as Select } from './Select';
|
|
8
|
+
export { default as Select } from './Select';
|
|
9
|
+
export { default as Table } from './Table';
|
|
10
|
+
export { default as Navigator } from './Navigator';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@import './themeColor.less';
|
|
1
|
+
@import './themeColor.module.less';
|
|
2
2
|
@font-family:sans-serif,-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol','Noto Color Emoji';
|
|
3
3
|
@ald-prefix: 'ald';
|
|
4
4
|
|
|
File without changes
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
// This file is automatically generated.
|
|
2
|
+
// Please do not change this file!
|
|
3
|
+
interface CssExports {
|
|
4
|
+
'B10': string;
|
|
5
|
+
'B20': string;
|
|
6
|
+
'B30': string;
|
|
7
|
+
'B40': string;
|
|
8
|
+
'B50': string;
|
|
9
|
+
'B60': string;
|
|
10
|
+
'B70': string;
|
|
11
|
+
'B80': string;
|
|
12
|
+
'B90': string;
|
|
13
|
+
'B95': string;
|
|
14
|
+
'B98': string;
|
|
15
|
+
'BBG10': string;
|
|
16
|
+
'BBG15': string;
|
|
17
|
+
'BBG20': string;
|
|
18
|
+
'BBG30': string;
|
|
19
|
+
'BBG40': string;
|
|
20
|
+
'BBG50': string;
|
|
21
|
+
'BBG60': string;
|
|
22
|
+
'BBG70': string;
|
|
23
|
+
'BBG80': string;
|
|
24
|
+
'BBG90': string;
|
|
25
|
+
'BBG95': string;
|
|
26
|
+
'BBG97': string;
|
|
27
|
+
'BBG98': string;
|
|
28
|
+
'BG0': string;
|
|
29
|
+
'BG10': string;
|
|
30
|
+
'BG100': string;
|
|
31
|
+
'BG20': string;
|
|
32
|
+
'BG30': string;
|
|
33
|
+
'BG40': string;
|
|
34
|
+
'BG50': string;
|
|
35
|
+
'BG60': string;
|
|
36
|
+
'BG70': string;
|
|
37
|
+
'BG80': string;
|
|
38
|
+
'BG90': string;
|
|
39
|
+
'BG95': string;
|
|
40
|
+
'BG97': string;
|
|
41
|
+
'BLACK': string;
|
|
42
|
+
'IMAGE_HOLDER': string;
|
|
43
|
+
'MATE': string;
|
|
44
|
+
'ND0': string;
|
|
45
|
+
'ND10': string;
|
|
46
|
+
'ND20': string;
|
|
47
|
+
'ND30': string;
|
|
48
|
+
'ND40': string;
|
|
49
|
+
'ND50': string;
|
|
50
|
+
'ND60': string;
|
|
51
|
+
'ND70': string;
|
|
52
|
+
'ND80': string;
|
|
53
|
+
'ND90': string;
|
|
54
|
+
'ND95': string;
|
|
55
|
+
'ND97': string;
|
|
56
|
+
'NL0': string;
|
|
57
|
+
'NL10': string;
|
|
58
|
+
'NL20': string;
|
|
59
|
+
'NL30': string;
|
|
60
|
+
'NL40': string;
|
|
61
|
+
'NL50': string;
|
|
62
|
+
'NL60': string;
|
|
63
|
+
'NL70': string;
|
|
64
|
+
'NL80': string;
|
|
65
|
+
'NL90': string;
|
|
66
|
+
'NL95': string;
|
|
67
|
+
'NL97': string;
|
|
68
|
+
'SA10': string;
|
|
69
|
+
'SA20': string;
|
|
70
|
+
'SA30': string;
|
|
71
|
+
'SA40': string;
|
|
72
|
+
'SA50': string;
|
|
73
|
+
'SA60': string;
|
|
74
|
+
'SA70': string;
|
|
75
|
+
'SA80': string;
|
|
76
|
+
'SA90': string;
|
|
77
|
+
'SA95': string;
|
|
78
|
+
'SA98': string;
|
|
79
|
+
'SB10': string;
|
|
80
|
+
'SB20': string;
|
|
81
|
+
'SB30': string;
|
|
82
|
+
'SB40': string;
|
|
83
|
+
'SB50': string;
|
|
84
|
+
'SB60': string;
|
|
85
|
+
'SB70': string;
|
|
86
|
+
'SB80': string;
|
|
87
|
+
'SB90': string;
|
|
88
|
+
'SB95': string;
|
|
89
|
+
'SB98': string;
|
|
90
|
+
'SC10': string;
|
|
91
|
+
'SC20': string;
|
|
92
|
+
'SC30': string;
|
|
93
|
+
'SC40': string;
|
|
94
|
+
'SC50': string;
|
|
95
|
+
'SC60': string;
|
|
96
|
+
'SC70': string;
|
|
97
|
+
'SC80': string;
|
|
98
|
+
'SC90': string;
|
|
99
|
+
'SC95': string;
|
|
100
|
+
'SC98': string;
|
|
101
|
+
'SHADOW_ACTIONSHEET': string;
|
|
102
|
+
'SHADOW_CARD': string;
|
|
103
|
+
'SHADOW_NOTIFICATION': string;
|
|
104
|
+
'SHADOW_OPTION': string;
|
|
105
|
+
'WHITE': string;
|
|
106
|
+
}
|
|
107
|
+
export const cssExports: CssExports;
|
|
108
|
+
export default cssExports;
|
|
@@ -20,9 +20,6 @@ var _default = function _default() {
|
|
|
20
20
|
className: "ald-button-demo"
|
|
21
21
|
}, /*#__PURE__*/_react.default.createElement(_aloudataDesign.Button, {
|
|
22
22
|
type: "primary",
|
|
23
|
-
style: {
|
|
24
|
-
width: '300px'
|
|
25
|
-
},
|
|
26
23
|
icon: /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
27
24
|
type: "add",
|
|
28
25
|
size: 20
|
|
@@ -54,11 +54,8 @@ var _default = function _default() {
|
|
|
54
54
|
value: "large"
|
|
55
55
|
}, "Large")), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_aloudataDesign.Button, {
|
|
56
56
|
type: "primary",
|
|
57
|
-
style: {
|
|
58
|
-
width: '300px'
|
|
59
|
-
},
|
|
60
57
|
size: size
|
|
61
|
-
}, "Primary Button
|
|
58
|
+
}, "Primary Button"), /*#__PURE__*/_react.default.createElement(_aloudataDesign.Button, {
|
|
62
59
|
type: "danger",
|
|
63
60
|
size: size
|
|
64
61
|
}, "danger Button"), /*#__PURE__*/_react.default.createElement(_aloudataDesign.Button, {
|
|
@@ -169,7 +169,7 @@ var _default = function _default() {
|
|
|
169
169
|
}, "topRight")))), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(DropdownButton, {
|
|
170
170
|
overlay: menu,
|
|
171
171
|
icon: isIcon && /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
172
|
-
type: "
|
|
172
|
+
type: "arrow_drop_down"
|
|
173
173
|
}),
|
|
174
174
|
loading: loading,
|
|
175
175
|
disabled: disabled,
|