@kep-platform/basic-component 0.0.50 → 0.0.52

Sign up to get free protection for your applications and to get access to all the features.
@@ -14,7 +14,7 @@ export declare const Column: import("styled-components/dist/types").IStyledCompo
14
14
  title?: React.ReactNode;
15
15
  index?: number | undefined;
16
16
  itemRender?: ListItemRender | undefined;
17
- } & Omit<React.HtmlHTMLAttributes<HTMLLIElement>, "title">, Omit<ColumnType, "dataIndex" | "render"> & {
17
+ } & Omit<React.HtmlHTMLAttributes<HTMLLIElement>, "title">, Omit<ColumnType, "render" | "dataIndex"> & {
18
18
  key: React.Key;
19
19
  title?: React.ReactNode;
20
20
  index?: number | undefined;
@@ -17,5 +17,5 @@ export declare function Popup(props: {
17
17
  trigger?: TriggerType;
18
18
  content?: ReactNode;
19
19
  onVisibleChange?: (visible: boolean) => void;
20
- }): React.JSX.Element | undefined;
20
+ }): string | number | boolean | React.JSX.Element | Iterable<React.ReactNode> | null | undefined;
21
21
  export default PopupBox;
@@ -8,6 +8,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
8
8
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
9
9
  import { useClickOutsize } from '@kep-platform/hooks';
10
10
  import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
11
+ import ReactDOM from 'react-dom';
11
12
  import styled, { css } from 'styled-components';
12
13
  var PopupBox = styled('div').withConfig({
13
14
  shouldForwardProp: function shouldForwardProp(prop) {
@@ -16,6 +17,13 @@ var PopupBox = styled('div').withConfig({
16
17
  })(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background-color: var(--kep-platform-color-bg-base);\n padding: var(--kep-platform-padding-xs);\n border-radius: var(--kep-platform-border-radius-sm);\n position: fixed;\n box-shadow: var(--kep-platform-box-shadow);\n z-index: 999;\n ", ";\n"])), function (props) {
17
18
  if (props.visible) return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n left: ", "px;\n top: ", "px;\n "])), props.left || -999, props.top || -999);else return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n left: -9999px;\n top: -9999px;\n "])));
18
19
  });
20
+ var popupContainerId = 'popupContainer';
21
+ var popupContainer = document.getElementById(popupContainerId);
22
+ if (!popupContainer) {
23
+ popupContainer = document.createElement('div');
24
+ popupContainer.id = popupContainerId;
25
+ document.body.appendChild(popupContainer);
26
+ }
19
27
  export function Popup(props) {
20
28
  var children = props.children,
21
29
  _props$trigger = props.trigger,
@@ -70,12 +78,14 @@ export function Popup(props) {
70
78
  if (typeof outerVisible === 'boolean') setVisible(outerVisible);
71
79
  }, [outerVisible]);
72
80
  if ( /*#__PURE__*/React.isValidElement(children)) {
73
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PopupBox, {
81
+ return /*#__PURE__*/React.createElement(React.Fragment, null, popupContainer && /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(PopupBox, {
74
82
  left: pos.left,
75
83
  top: pos.top,
76
84
  visible: visible,
77
85
  ref: popupBox
78
- }, content), /*#__PURE__*/React.cloneElement(children, mergeProps));
86
+ }, content), popupContainer), /*#__PURE__*/React.cloneElement(children, mergeProps));
87
+ } else {
88
+ return children;
79
89
  }
80
90
  }
81
91
  export default PopupBox;
@@ -18,6 +18,7 @@ export type TableProps = {
18
18
  pagination?: Pagination | false;
19
19
  empty?: ReactNode;
20
20
  rowSelection?: RowSelection;
21
+ multiple?: boolean;
21
22
  };
22
- export default function Table({ columns, dataSource, rowKey, scroll, onChange, headerRender, pagination: outerPagination, empty, rowSelection, }: TableProps): React.JSX.Element;
23
+ export default function Table({ columns, dataSource, rowKey, scroll, onChange, headerRender, pagination: outerPagination, empty, rowSelection, multiple, }: TableProps): React.JSX.Element;
23
24
  export {};
@@ -163,7 +163,8 @@ export default function Table(_ref3) {
163
163
  outerPagination = _ref3.pagination,
164
164
  _ref3$empty = _ref3.empty,
165
165
  empty = _ref3$empty === void 0 ? /*#__PURE__*/React.createElement(React.Fragment, null) : _ref3$empty,
166
- rowSelection = _ref3.rowSelection;
166
+ rowSelection = _ref3.rowSelection,
167
+ multiple = _ref3.multiple;
167
168
  var _useState = useState(null),
168
169
  _useState2 = _slicedToArray(_useState, 2),
169
170
  sorterController = _useState2[0],
@@ -195,13 +196,16 @@ export default function Table(_ref3) {
195
196
  }
196
197
  }, [rowSelection]);
197
198
  var formatedColumns = useMemo(function () {
198
- if (rowSelection) {
199
+ if (rowSelection && multiple) {
199
200
  return [{
200
201
  key: 'selectRow',
201
202
  dataIndex: 'selectRow',
202
203
  title: /*#__PURE__*/React.createElement("input", {
203
204
  type: "checkbox",
204
205
  checked: selectedRows.length === dataSource.length,
206
+ onClick: function onClick(e) {
207
+ e.stopPropagation();
208
+ },
205
209
  onChange: function onChange(e) {
206
210
  if (e.target.checked) {
207
211
  var _rowSelection$onSelec;
@@ -264,7 +268,7 @@ export default function Table(_ref3) {
264
268
  } else {
265
269
  return columns;
266
270
  }
267
- }, [columns, rowSelection, dataSource, selectedRows]);
271
+ }, [columns, rowSelection, dataSource, selectedRows, multiple]);
268
272
  var titleRowData = useMemo(function () {
269
273
  var data = {};
270
274
  formatedColumns.forEach(function (column) {
@@ -292,7 +296,7 @@ export default function Table(_ref3) {
292
296
  });
293
297
  });
294
298
  return data;
295
- }, [formatedColumns, _onChange2, sorterController, setSorterController, rowSelection, filterValues, setFilterValues]);
299
+ }, [formatedColumns, sorterController, filterValues]);
296
300
  var boxShadowBox = useRef(null);
297
301
  var headerColumns = useMemo(function () {
298
302
  return formatedColumns.map(function (column) {
@@ -367,7 +371,43 @@ export default function Table(_ref3) {
367
371
  }, formatedDataSource.map(function (rowData, index) {
368
372
  if (rowData) return /*#__PURE__*/React.createElement(TableBodyRow, {
369
373
  key: rowData[rowKey],
370
- isActive: selectedRows.includes(rowData)
374
+ isActive: selectedRows.includes(rowData),
375
+ onClick: function onClick(e) {
376
+ var _rowSelection$onSelec5;
377
+ if (!rowSelection) return;
378
+ var rows;
379
+ var selected;
380
+ if (multiple) {
381
+ if (selectedRows.includes(rowData)) {
382
+ rows = selectedRows.filter(function (row) {
383
+ return row[rowKey] !== rowData[rowKey];
384
+ });
385
+ selected = false;
386
+ setSelectedRows(rows);
387
+ } else {
388
+ rows = [].concat(_toConsumableArray(selectedRows), [rowData]);
389
+ selected = true;
390
+ setSelectedRows(rows);
391
+ }
392
+ } else {
393
+ if (selectedRows.includes(rowData)) {
394
+ rows = [];
395
+ selected = false;
396
+ setSelectedRows(rows);
397
+ } else {
398
+ rows = [rowData];
399
+ selected = true;
400
+ setSelectedRows(rows);
401
+ }
402
+ }
403
+ (_rowSelection$onSelec5 = rowSelection.onSelect) === null || _rowSelection$onSelec5 === void 0 || _rowSelection$onSelec5.call(rowSelection, rows.map(function (row) {
404
+ return row[rowKey];
405
+ }), {
406
+ type: 'row',
407
+ selected: selected,
408
+ nativeEvent: e
409
+ });
410
+ }
371
411
  }, /*#__PURE__*/React.createElement(Columns, {
372
412
  rowIndex: index,
373
413
  rowData: rowData,
@@ -15,6 +15,15 @@ export declare class ViewPortWindowStore extends WindowStore {
15
15
  transform: string;
16
16
  transformOrigin: string;
17
17
  transition: string;
18
+ } | {
19
+ left: string;
20
+ top: string;
21
+ width: string;
22
+ height: string;
23
+ zIndex: number;
24
+ transformOrigin: string;
25
+ transition: string;
26
+ transform?: undefined;
18
27
  } | {
19
28
  left: string;
20
29
  top: string;
@@ -70,10 +70,10 @@ export var ViewPortWindowStore = /*#__PURE__*/function (_WindowStore) {
70
70
  return {
71
71
  left: this.fullscreenPos.left + 'px',
72
72
  top: this.fullscreenPos.top + 'px',
73
- width: this.fullscreenPos.width * this.viewPortStore.scale + 'px',
74
- height: this.fullscreenPos.height * this.viewPortStore.scale + 'px',
73
+ width: this.fullscreenPos.width + 'px',
74
+ height: this.fullscreenPos.height + 'px',
75
+ // transform: `scale(${1 / this.viewPortStore.scale})`,
75
76
  zIndex: this.zIndex,
76
- transform: "scale(".concat(1 / this.viewPortStore.scale, ")"),
77
77
  transformOrigin: 'left top',
78
78
  transition: 'width height 0.5s ease-out'
79
79
  };
@@ -157,6 +157,7 @@ export var ViewPortWindowStore = /*#__PURE__*/function (_WindowStore) {
157
157
  value: function fullscreenWindow(func) {
158
158
  this.resetState();
159
159
  this.fullscreen = true;
160
+ this.viewPortStore.scale = 1;
160
161
  func === null || func === void 0 || func();
161
162
  this.fullscreenPos = this.viewPortStore.viewPortRect;
162
163
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kep-platform/basic-component",
3
- "version": "0.0.50",
3
+ "version": "0.0.52",
4
4
  "description": "A react library developed with dumi",
5
5
  "license": "MIT",
6
6
  "module": "dist/index.js",
@@ -47,7 +47,7 @@
47
47
  },
48
48
  "dependencies": {
49
49
  "@ant-design/icons": "^5.3.7",
50
- "@kep-platform/hooks": "^0.0.50",
50
+ "@kep-platform/hooks": "^0.0.52",
51
51
  "color": "^4.2.3",
52
52
  "rc-pagination": "^4.1.0"
53
53
  },
@@ -87,5 +87,5 @@
87
87
  "authors": [
88
88
  "less-step-jss 1599925910@qq.com"
89
89
  ],
90
- "gitHead": "27794473fb736fc66e4a87b05a5c21c67c1165dc"
90
+ "gitHead": "76a464cda0951e66bccbed12b9374d6358338950"
91
91
  }