@kdcloudjs/kdesign 1.3.2 → 1.3.5

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.
Files changed (80) hide show
  1. package/CHANGELOG.md +43 -1
  2. package/dist/kdesign-complete.less +176 -107
  3. package/dist/kdesign.css +161 -77
  4. package/dist/kdesign.css.map +1 -1
  5. package/dist/kdesign.js +3776 -2037
  6. package/dist/kdesign.js.map +1 -1
  7. package/dist/kdesign.min.css +3 -3
  8. package/dist/kdesign.min.js +8 -8
  9. package/dist/kdesign.min.js.map +1 -1
  10. package/es/_utils/usePopper.d.ts +1 -0
  11. package/es/_utils/usePopper.js +29 -25
  12. package/es/anchor/anchor.js +20 -1
  13. package/es/base-data/style/index.css +1 -0
  14. package/es/base-data/style/index.less +1 -0
  15. package/es/button/group.js +2 -1
  16. package/es/button/style/index.css +20 -19
  17. package/es/button/style/index.less +29 -27
  18. package/es/button/style/token.less +4 -4
  19. package/es/checkbox/checkbox.js +20 -12
  20. package/es/config-provider/compDefaultProps.d.ts +0 -1
  21. package/es/config-provider/compDefaultProps.js +1 -2
  22. package/es/form/Field.js +7 -6
  23. package/es/form/Form.d.ts +1 -0
  24. package/es/form/Form.js +3 -1
  25. package/es/form/interface.d.ts +1 -0
  26. package/es/menu/menu.d.ts +1 -1
  27. package/es/menu/menu.js +55 -22
  28. package/es/menu/menuItem.d.ts +1 -0
  29. package/es/menu/menuItem.js +14 -10
  30. package/es/menu/style/index.css +139 -53
  31. package/es/menu/style/index.less +101 -69
  32. package/es/menu/style/mixin.less +33 -1
  33. package/es/menu/style/token.less +4 -2
  34. package/es/menu/subMenu.d.ts +1 -1
  35. package/es/menu/subMenu.js +126 -119
  36. package/es/radio/radio.d.ts +1 -1
  37. package/es/radio/radio.js +18 -11
  38. package/es/select/select.js +33 -20
  39. package/es/style/core/reset.less +4 -4
  40. package/es/style/index.css +0 -4
  41. package/es/table/feature/useRangeSelection.d.ts +3 -0
  42. package/es/table/feature/useRangeSelection.js +10 -0
  43. package/es/table/interface.d.ts +15 -2
  44. package/es/table/table.js +14 -7
  45. package/lib/_utils/usePopper.d.ts +1 -0
  46. package/lib/_utils/usePopper.js +29 -25
  47. package/lib/anchor/anchor.js +20 -1
  48. package/lib/base-data/style/index.css +1 -0
  49. package/lib/base-data/style/index.less +1 -0
  50. package/lib/button/group.js +2 -1
  51. package/lib/button/style/index.css +20 -19
  52. package/lib/button/style/index.less +29 -27
  53. package/lib/button/style/token.less +4 -4
  54. package/lib/checkbox/checkbox.js +19 -11
  55. package/lib/config-provider/compDefaultProps.d.ts +0 -1
  56. package/lib/config-provider/compDefaultProps.js +1 -2
  57. package/lib/form/Field.js +7 -6
  58. package/lib/form/Form.d.ts +1 -0
  59. package/lib/form/Form.js +3 -1
  60. package/lib/form/interface.d.ts +1 -0
  61. package/lib/menu/menu.d.ts +1 -1
  62. package/lib/menu/menu.js +61 -26
  63. package/lib/menu/menuItem.d.ts +1 -0
  64. package/lib/menu/menuItem.js +16 -10
  65. package/lib/menu/style/index.css +139 -53
  66. package/lib/menu/style/index.less +101 -69
  67. package/lib/menu/style/mixin.less +33 -1
  68. package/lib/menu/style/token.less +4 -2
  69. package/lib/menu/subMenu.d.ts +1 -1
  70. package/lib/menu/subMenu.js +145 -142
  71. package/lib/radio/radio.d.ts +1 -1
  72. package/lib/radio/radio.js +30 -20
  73. package/lib/select/select.js +33 -20
  74. package/lib/style/core/reset.less +4 -4
  75. package/lib/style/index.css +0 -4
  76. package/lib/table/feature/useRangeSelection.d.ts +3 -0
  77. package/lib/table/feature/useRangeSelection.js +21 -0
  78. package/lib/table/interface.d.ts +15 -2
  79. package/lib/table/table.js +15 -7
  80. package/package.json +2 -2
@@ -103,7 +103,6 @@ var InternalSelect = function InternalSelect(props, ref) {
103
103
  setInitValue = _useMergedState2[1];
104
104
 
105
105
  var realChildren = Array.isArray(options) ? options : (0, _reactChildren.toArray)(children); // options配置项和默认children
106
- // console.log('real', realChildren)
107
106
 
108
107
  var innerRef = _react.default.useRef();
109
108
 
@@ -288,6 +287,7 @@ var InternalSelect = function InternalSelect(props, ref) {
288
287
  return (child === null || child === void 0 ? void 0 : child.value) === key;
289
288
  }
290
289
  })) || {};
290
+ var optionsObj = obj.props ? obj.props : obj || {};
291
291
 
292
292
  if (value !== undefined) {
293
293
  // onChange && onChange(labelInValue ? { value: key, label } : key)
@@ -304,13 +304,13 @@ var InternalSelect = function InternalSelect(props, ref) {
304
304
  (0, _splice.default)(optsArr).call(optsArr, idx, 1);
305
305
  } else {
306
306
  valArr.push(key);
307
- optsArr.push({
307
+ optsArr.push((0, _extends2.default)((0, _extends2.default)({}, optionsObj), {
308
308
  value: key,
309
309
  label: obj.props ? (_a = obj.props) === null || _a === void 0 ? void 0 : _a.children : obj.label || key
310
- });
310
+ }));
311
311
  }
312
312
 
313
- onChange && onChange(labelInValue ? optsArr : valArr);
313
+ onChange && onChange(labelInValue ? optsArr : valArr, optsArr);
314
314
 
315
315
  if (!isSelected) {
316
316
  onDeselect && onDeselect(key); // 下拉项取消选中时调用,参数为选中项的value,多选模式下生效
@@ -320,7 +320,10 @@ var InternalSelect = function InternalSelect(props, ref) {
320
320
  onChange && onChange(labelInValue ? {
321
321
  value: key,
322
322
  label: label
323
- } : key);
323
+ } : key, (0, _extends2.default)((0, _extends2.default)({}, optionsObj), {
324
+ value: key,
325
+ label: label
326
+ }));
324
327
  }
325
328
 
326
329
  onSelect && onSelect(key);
@@ -336,7 +339,10 @@ var InternalSelect = function InternalSelect(props, ref) {
336
339
  onChange && onChange(labelInValue ? {
337
340
  value: key,
338
341
  label: label
339
- } : key);
342
+ } : key, (0, _extends2.default)((0, _extends2.default)({}, optionsObj), {
343
+ value: key,
344
+ label: label
345
+ }));
340
346
  } else {
341
347
  var _multipleRef$current2 = multipleRef.current,
342
348
  _selectedVal = _multipleRef$current2.selectedVal,
@@ -350,15 +356,15 @@ var InternalSelect = function InternalSelect(props, ref) {
350
356
  } else {
351
357
  _selectedVal.push(key);
352
358
 
353
- _selectMulOpts.push({
359
+ _selectMulOpts.push((0, _extends2.default)((0, _extends2.default)({}, optionsObj), {
354
360
  value: key,
355
361
  label: obj.props ? (_c = obj.props) === null || _c === void 0 ? void 0 : _c.children : obj.label || key
356
- });
362
+ }));
357
363
  } // setInitValue([...selectedVal])
358
364
 
359
365
 
360
366
  setMulOptions((0, _toConsumableArray2.default)(_selectMulOpts));
361
- onChange && onChange(labelInValue ? _selectMulOpts : _selectedVal);
367
+ onChange && onChange(labelInValue ? _selectMulOpts : _selectedVal, _selectMulOpts);
362
368
 
363
369
  if (!isSelected) {
364
370
  onDeselect && onDeselect(key); // 下拉项取消选中时调用,参数为选中项的value,多选模式下生效
@@ -379,9 +385,9 @@ var InternalSelect = function InternalSelect(props, ref) {
379
385
 
380
386
  if ((realChildren === null || realChildren === void 0 ? void 0 : realChildren.length) !== selectedVal.length) {
381
387
  (0, _map.default)(realChildren).call(realChildren, function (child) {
382
- var _child$props = child.props,
383
- value = _child$props.value,
384
- children = _child$props.children;
388
+ var _ref = child.props || child,
389
+ value = _ref.value,
390
+ children = _ref.children;
385
391
 
386
392
  if (!(0, _includes.default)(selectedVal).call(selectedVal, value)) {
387
393
  selectedVal.push(value);
@@ -393,12 +399,12 @@ var InternalSelect = function InternalSelect(props, ref) {
393
399
  });
394
400
  setMulOptions((0, _toConsumableArray2.default)(selectMulOpts));
395
401
  } else {
396
- multipleRef.current.selectedVal = [];
397
- multipleRef.current.selectMulOpts = [];
402
+ multipleRef.current.selectedVal = selectedVal = [];
403
+ multipleRef.current.selectMulOpts = selectMulOpts = [];
398
404
  setMulOptions([]);
399
405
  }
400
406
 
401
- onChange && onChange(labelInValue ? selectMulOpts : selectedVal);
407
+ onChange && onChange(labelInValue ? selectMulOpts : selectedVal, selectMulOpts);
402
408
  }; // 筛选内容 ---可以优化,抽成hook
403
409
 
404
410
 
@@ -456,7 +462,7 @@ var InternalSelect = function InternalSelect(props, ref) {
456
462
  (0, _splice.default)(selectedVal).call(selectedVal, idx, 1);
457
463
  (0, _splice.default)(selectMulOpts).call(selectMulOpts, idx, 1);
458
464
  setMulOptions((0, _toConsumableArray2.default)(selectMulOpts));
459
- onChange && onChange(labelInValue ? selectMulOpts : selectedVal);
465
+ onChange && onChange(labelInValue ? selectMulOpts : selectedVal, selectMulOpts);
460
466
  e.stopPropagation();
461
467
  }; // 渲染后缀图标
462
468
 
@@ -520,8 +526,15 @@ var InternalSelect = function InternalSelect(props, ref) {
520
526
  return (realChildren === null || realChildren === void 0 ? void 0 : realChildren.length) === 0 && /*#__PURE__*/_react.default.createElement("div", {
521
527
  className: emptyListCls
522
528
  }, emptyContent);
523
- }; // 渲染下拉列表框
529
+ };
530
+
531
+ var isShowSearch = (0, _react.useCallback)(function () {
532
+ if (isMultiple) {
533
+ return showSearch !== null && showSearch !== void 0 ? showSearch : true;
534
+ }
524
535
 
536
+ return showSearch !== null && showSearch !== void 0 ? showSearch : false;
537
+ }, [showSearch, isMultiple]); // 渲染下拉列表框
525
538
 
526
539
  var renderContent = function renderContent() {
527
540
  var _a;
@@ -557,7 +570,7 @@ var InternalSelect = function InternalSelect(props, ref) {
557
570
  className: dropDownCls,
558
571
  style: dropDownStyle,
559
572
  ref: dropDownRef
560
- }, (showSearch || isMultiple) && /*#__PURE__*/_react.default.createElement("div", {
573
+ }, isShowSearch() && /*#__PURE__*/_react.default.createElement("div", {
561
574
  className: searchCls
562
575
  }, /*#__PURE__*/_react.default.createElement(_index.Input, {
563
576
  ref: searchRef,
@@ -679,8 +692,8 @@ var InternalSelect = function InternalSelect(props, ref) {
679
692
  var _a;
680
693
 
681
694
  if (selectRef === null || selectRef === void 0 ? void 0 : selectRef.current) {
682
- var _ref = (_a = selectRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect(),
683
- width = _ref.width;
695
+ var _ref2 = (_a = selectRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect(),
696
+ width = _ref2.width;
684
697
 
685
698
  return {
686
699
  width: (dropdownStyle === null || dropdownStyle === void 0 ? void 0 : dropdownStyle.width) || (width > 75 ? width : 75),
@@ -194,10 +194,10 @@ template {
194
194
  /**
195
195
  * Reset scrollbar style
196
196
  */
197
- ::-webkit-scrollbar {
198
- width: 10px !important;
199
- height: 10px !important;
200
- }
197
+ // ::-webkit-scrollbar {
198
+ // width: 10px !important;
199
+ // height: 10px !important;
200
+ // }
201
201
 
202
202
  ::-webkit-scrollbar-button {
203
203
  width: 0;
@@ -1779,10 +1779,6 @@ template {
1779
1779
  /**
1780
1780
  * Reset scrollbar style
1781
1781
  */
1782
- ::-webkit-scrollbar {
1783
- width: 10px !important;
1784
- height: 10px !important;
1785
- }
1786
1782
  ::-webkit-scrollbar-button {
1787
1783
  width: 0;
1788
1784
  height: 0;
@@ -0,0 +1,3 @@
1
+ import { TableRangeSelection, TablePipeline } from '../interface';
2
+ declare function useRangeSelection(pipeline: TablePipeline, rangeSelection?: TableRangeSelection): void;
3
+ export default useRangeSelection;
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
11
+
12
+ var _table = require("@kdcloudjs/table");
13
+
14
+ function useRangeSelection(pipeline, rangeSelection) {
15
+ if (rangeSelection) {
16
+ pipeline.use(_table.features.rangeSelection((0, _extends2.default)({}, rangeSelection)));
17
+ }
18
+ }
19
+
20
+ var _default = useRangeSelection;
21
+ exports.default = _default;
@@ -1,6 +1,16 @@
1
+ /// <reference types="react" />
1
2
  import { TableProps as BaseTableProps, TablePipeline as TP, ArtColumnStaticPart } from '@kdcloudjs/table';
2
- import { SortFeatureOptions, RowDetailFeatureOptions, FilterFeatureOptions, TreeModeFeatureOptions, ColumnDragOptions, ColumnResizeOptions, ContextMenuFeatureOptions } from '@kdcloudjs/table/es/table/pipeline/features';
3
- export interface TableProps extends BaseTableProps {
3
+ import { SortFeatureOptions, RowDetailFeatureOptions, FilterFeatureOptions, TreeModeFeatureOptions, ColumnDragOptions, ColumnResizeOptions, ContextMenuFeatureOptions, RangeSelectionFeatureOptions } from '@kdcloudjs/table/es/table/pipeline/features';
4
+ declare type TablePropsOfComponents = Pick<BaseTableProps, 'components'> & {
5
+ components?: {
6
+ /** 复选框 */
7
+ Checkbox?: React.ComponentType;
8
+ /** 单选框 */
9
+ Radio?: React.ComponentType;
10
+ };
11
+ };
12
+ declare type TablePropsOfExtend = Omit<BaseTableProps, 'components'>;
13
+ export interface TableProps extends TablePropsOfExtend, TablePropsOfComponents {
4
14
  rowSelection?: TableRowSelection;
5
15
  prefixCls?: string;
6
16
  rowDetail?: TableRowDetail;
@@ -11,6 +21,7 @@ export interface TableProps extends BaseTableProps {
11
21
  columnDrag?: boolean | ColumnDragOptions;
12
22
  columnResize?: boolean | ColumnResizeOptions;
13
23
  contextMenu?: IContextMenu;
24
+ rangeSelection?: TableRangeSelection;
14
25
  }
15
26
  export declare type RowSelectionType = 'checkbox' | 'radio';
16
27
  export declare type RowSelectionFixed = 'start' | 'end';
@@ -32,3 +43,5 @@ export declare type TableSort = SortFeatureOptions;
32
43
  export declare type TableTreeMode = TreeModeFeatureOptions;
33
44
  export declare type TablePipeline = TP;
34
45
  export declare type IContextMenu = boolean | ContextMenuFeatureOptions;
46
+ export declare type TableRangeSelection = RangeSelectionFeatureOptions;
47
+ export {};
@@ -51,6 +51,8 @@ var _columnDrag = _interopRequireDefault(require("./feature/columnDrag"));
51
51
 
52
52
  var _contextMenu = _interopRequireDefault(require("./feature/contextMenu"));
53
53
 
54
+ var _useRangeSelection = _interopRequireDefault(require("./feature/useRangeSelection"));
55
+
54
56
  var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
55
57
 
56
58
  function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -84,6 +86,7 @@ function Table(props) {
84
86
  getRowProps = props.getRowProps,
85
87
  getTableProps = props.getTableProps,
86
88
  contextMenu = props.contextMenu,
89
+ rangeSelection = props.rangeSelection,
87
90
  cssVariables = props.cssVariables;
88
91
 
89
92
  var _useContext = (0, _react.useContext)(_ConfigContext.default),
@@ -94,19 +97,24 @@ function Table(props) {
94
97
  var tableCls = (0, _classnames.default)(tablePrefixCls, className);
95
98
  var pipeline = (0, _table.useTablePipeline)({
96
99
  components: {
97
- Checkbox: _index.default,
98
- Radio: _index2.default
100
+ Checkbox: (components === null || components === void 0 ? void 0 : components.Checkbox) || _index.default,
101
+ Radio: (components === null || components === void 0 ? void 0 : components.Radio) || _index2.default
99
102
  }
100
103
  }).primaryKey(primaryKey === undefined ? '' : primaryKey).input({
101
104
  columns: columns,
102
105
  dataSource: dataSource
103
106
  });
107
+
108
+ if (footerDataSource) {
109
+ pipeline.footerDataSource(footerDataSource);
110
+ }
104
111
  /* -------------------------------------------------------------------------- */
105
112
 
106
113
  /* features */
107
114
 
108
115
  /* -------------------------------------------------------------------------- */
109
116
 
117
+
110
118
  (0, _rowSelection.default)(pipeline, rowSelection);
111
119
  (0, _rowDetail.default)(pipeline, rowDetail);
112
120
  (0, _filter2.default)(pipeline, filter);
@@ -116,6 +124,7 @@ function Table(props) {
116
124
  (0, _columnResize.default)(pipeline, columnResize);
117
125
  (0, _columnDrag.default)(pipeline, columnDrag);
118
126
  (0, _contextMenu.default)(pipeline, contextMenu);
127
+ (0, _useRangeSelection.default)(pipeline, rangeSelection);
119
128
  /* -------------------------------------------------------------------------- */
120
129
 
121
130
  /* after useTablePipeline, merge pipeline.getProps result */
@@ -139,18 +148,17 @@ function Table(props) {
139
148
  className: tableCls,
140
149
  style: style,
141
150
  isLoading: isLoading,
142
- components: (0, _extends2.default)({
143
- LoadingIcon: function LoadingIcon() {
151
+ components: {
152
+ LoadingIcon: (components === null || components === void 0 ? void 0 : components.LoadingIcon) || function () {
144
153
  return /*#__PURE__*/_react.default.createElement(_index3.Spin, {
145
154
  type: "container"
146
155
  });
147
156
  },
148
- EmptyContent: function EmptyContent() {
157
+ EmptyContent: (components === null || components === void 0 ? void 0 : components.EmptyContent) || function () {
149
158
  return /*#__PURE__*/_react.default.createElement(_index3.Empty, null);
150
159
  }
151
- }, components),
160
+ },
152
161
  useVirtual: useVirtual,
153
- footerDataSource: footerDataSource,
154
162
  estimatedRowHeight: estimatedRowHeight,
155
163
  emptyCellHeight: emptyCellHeight,
156
164
  hasHeader: hasHeader,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kdcloudjs/kdesign",
3
- "version": "1.3.2",
3
+ "version": "1.3.5",
4
4
  "description": "KDesign 金蝶前端react 组件库",
5
5
  "title": "kdesign",
6
6
  "keywords": [
@@ -76,7 +76,7 @@
76
76
  "@babel/runtime": "^7.10.4",
77
77
  "@babel/runtime-corejs3": "^7.11.2",
78
78
  "@babel/standalone": "^7.14.3",
79
- "@kdcloudjs/table": "^1.0.0",
79
+ "@kdcloudjs/table": "^1.1.0",
80
80
  "@popperjs/core": "^2.5.4",
81
81
  "async-validator": "^3.5.1",
82
82
  "axios": "^0.21.1",