@zhenliang/sheet 0.1.39 → 0.1.41

package/dist/core/table/addButton.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+export declare const AddButton: React.FC<{
+    handleAdd?: () => void;
+    handleBatchAdd?: (count: number) => void;
+}>;

package/dist/core/table/addButton.js

@@ -0,0 +1,92 @@
+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 { MoreOutlined } from "@ant-design/icons";
+import { Form, InputNumber, Popover, Button } from "antd";
+import React, { useEffect, useRef, useState } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var RowPop = function RowPop(props) {
+  var handleBatchAdd = props.handleBatchAdd;
+  var inputRef = useRef(null);
+  useEffect(function () {
+    var interval = setInterval(function () {
+      var _inputRef$current;
+      (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
+    }, 200);
+    return function () {
+      clearInterval(interval);
+    };
+  }, []);
+  return /*#__PURE__*/_jsx(Form, {
+    initialValues: {
+      count: 10
+    },
+    onFinish: function onFinish(values) {
+      handleBatchAdd && handleBatchAdd(values.count);
+    },
+    children: /*#__PURE__*/_jsx(Form.Item, {
+      style: {
+        marginBottom: 0
+      },
+      label: "\u884C\u6570",
+      name: "count",
+      children: /*#__PURE__*/_jsx(InputNumber, {
+        style: {
+          width: 100
+        },
+        ref: inputRef,
+        min: 1,
+        max: 100,
+        onClick: function onClick(e) {
+          e.nativeEvent.target.focus();
+          e.stopPropagation();
+        }
+      })
+    })
+  });
+};
+export var AddButton = function AddButton(props) {
+  var handleAdd = props.handleAdd,
+    handleBatchAdd = props.handleBatchAdd;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  if (!handleAdd && !handleBatchAdd) {
+    return null;
+  }
+  return /*#__PURE__*/_jsxs(Button, {
+    type: "dashed",
+    style: {
+      width: '100%',
+      height: 32
+    },
+    onClick: function onClick(e) {
+      handleAdd && handleAdd();
+    },
+    children: ["+ \u6DFB\u52A0", /*#__PURE__*/_jsx(Popover, {
+      open: open,
+      getPopupContainer: function getPopupContainer(node) {
+        return node.parentNode;
+      },
+      onOpenChange: setOpen,
+      trigger: ['click'],
+      destroyTooltipOnHide: true,
+      content: /*#__PURE__*/_jsx(RowPop, {
+        handleBatchAdd: handleBatchAdd
+      }),
+      children: /*#__PURE__*/_jsx(MoreOutlined, {
+        style: {
+          marginLeft: 0
+        },
+        onClick: function onClick(e) {
+          e.stopPropagation();
+        }
+      })
+    })]
+  });
+};

package/dist/core/table/index.js

@@ -1,5 +1,5 @@
 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 = ["sheetInstance", "columns", "dataSource", "rowKey", "rowSelection", "groupConfig", "onChange", "handleAdd", "draggable", "eventHandler"];
+var _excluded = ["sheetInstance", "columns", "dataSource", "rowKey", "rowSelection", "groupConfig", "onChange", "handleAdd", "handleBatchAdd", "draggable", "eventHandler"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 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; }
@@ -16,7 +16,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import { Sheet, useSetState } from "../..";
 import { GroupContext } from "../../hooks/useGroupConfig";
 import { WidthContext } from "../../hooks/useWidthConfig";
-import { Button, ConfigProvider, Empty } from 'antd';
+import { ConfigProvider, Empty } from 'antd';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { SheetEvent } from "../sheet/Event";
 import { DraggableShell } from "../shell/draggableShell";
@@ -24,6 +24,7 @@ import { TableShell } from "../shell/tableShell";
 import { GroupEvent, SelectionEvent } from "./events";
 import { formatGroupData, useGroupConfig } from "./useGroupConfig";
 import { formatSelectionData, useRowSelection } from "./useRowSelection";
+import { AddButton } from "./addButton";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var Table = function Table(_ref) {
@@ -35,6 +36,7 @@ var Table = function Table(_ref) {
     groupConfig = _ref.groupConfig,
     onChange = _ref.onChange,
     handleAdd = _ref.handleAdd,
+    handleBatchAdd = _ref.handleBatchAdd,
     draggable = _ref.draggable,
     eventHandler = _ref.eventHandler,
     args = _objectWithoutProperties(_ref, _excluded);
@@ -202,15 +204,10 @@ var Table = function Table(_ref) {
               name: key,
               handler: eventHandler === null || eventHandler === void 0 ? void 0 : eventHandler[key]
             }, key);
-          }), handleAdd ? /*#__PURE__*/_jsx(Button, {
-            type: "dashed",
-            style: {
-              width: '100%',
-              height: 32
-            },
-            onClick: handleAdd,
-            children: "+ \u6DFB\u52A0"
-          }) : null]
+          }), /*#__PURE__*/_jsx(AddButton, {
+            handleAdd: handleAdd,
+            handleBatchAdd: handleBatchAdd
+          })]
         }))
       })
     })

package/dist/core/table/useGroupConfig.js

@@ -38,13 +38,29 @@ export var useGroupConfig = function useGroupConfig(dataSource, tableGroupConfig
   }, [dataSource]);
   useEffect(function () {
     if (!hasChildren) return;
-    var rowConfig = dataSourceToRowConfig(dataSource, tableGroupConfig === null || tableGroupConfig === void 0 ? void 0 : tableGroupConfig.defaultOpen);
+    var computedRowGroup = dataSourceToRowConfig(dataSource, tableGroupConfig === null || tableGroupConfig === void 0 ? void 0 : tableGroupConfig.defaultOpen);
+    var rowConfig = computedRowGroup;
+    var _ref = tableGroupConfig || {},
+      rowGroup = _ref.rowGroup;
+    if (rowGroup) {
+      var notEqual = rowGroup.groups.length !== computedRowGroup.groups.length;
+      var notSameGroup = notEqual || rowGroup.groups.some(function (group, index) {
+        return computedRowGroup.groups[index].groupStart !== group.groupStart || computedRowGroup.groups[index].groupEnd !== group.groupEnd;
+      });
+      if (!notSameGroup) {
+        console.log(notSameGroup, rowGroup.groups, computedRowGroup);
+        rowConfig = rowGroup;
+      } else {
+        var _tableGroupConfig$onC;
+        tableGroupConfig === null || tableGroupConfig === void 0 || (_tableGroupConfig$onC = tableGroupConfig.onChange) === null || _tableGroupConfig$onC === void 0 || _tableGroupConfig$onC.call(tableGroupConfig, computedRowGroup);
+      }
+    }
     if (groupConfigRef.current) {
-      rowConfig.groups.forEach(function (_ref, index) {
+      rowConfig.groups.forEach(function (_ref2, index) {
         var _groupConfigRef$curre, _groupConfigRef$curre2;
-        var groupName = _ref.groupName,
-          newGroupStart = _ref.groupStart,
-          newGroupEnd = _ref.groupEnd;
+        var groupName = _ref2.groupName,
+          newGroupStart = _ref2.groupStart,
+          newGroupEnd = _ref2.groupEnd;
         var rowIndex = (_groupConfigRef$curre = (_groupConfigRef$curre2 = groupConfigRef.current) === null || _groupConfigRef$curre2 === void 0 ? void 0 : _groupConfigRef$curre2.groups.findIndex(function (item) {
           return item.groupName === groupName;
         })) !== null && _groupConfigRef$curre !== void 0 ? _groupConfigRef$curre : -1;
@@ -70,7 +86,9 @@ export var useGroupConfig = function useGroupConfig(dataSource, tableGroupConfig
     groupConfigRef.current = rowConfig;
   }, [dataSource.length, childrenLength, hasChildren]);
   var handleGroupChange = useCallback(function (value) {
+    var _tableGroupConfig$onC2;
     setGroupConfig(value);
+    tableGroupConfig === null || tableGroupConfig === void 0 || (_tableGroupConfig$onC2 = tableGroupConfig.onChange) === null || _tableGroupConfig$onC2 === void 0 || _tableGroupConfig$onC2.call(tableGroupConfig, value);
     groupConfigRef.current = value;
   }, [setGroupConfig]);
   var groupMap = useMemo(function () {

package/dist/example/antComponent.js

@@ -15,7 +15,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 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 { Button, Modal } from 'antd';
-import { cloneDeep, random } from 'lodash';
+import { cloneDeep, random, range } from 'lodash';
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 import { getCascaderEditor, getDateEditor, getNumberEditor, getSelectEditor } from "../core/editor";
 import Table from "../core/table";
@@ -180,7 +180,7 @@ var data = [{
   name: 'John Brown',
   date: '2020-01-01',
   open: true,
-  age: 32,
+  age: 1,
   address1: 'West Lake',
   address2: '打开对话框1',
   select: '111111',
@@ -191,7 +191,7 @@ var data = [{
   open: false,
   date: '1990-01-01',
   address2: '打开对话框2',
-  age: 40,
+  age: 2,
   select: '222222',
   address: 'London Park'
 }];
@@ -218,6 +218,7 @@ var App = function App() {
   }, [state]);
   var handleAdd = useCallback(function () {
     var _sheetInstance$curren;
+    var count = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
     var newState = cloneDeep(state);
     (_sheetInstance$curren = sheetInstance.current) === null || _sheetInstance$curren === void 0 || _sheetInstance$curren.pushToHistory({
       type: 'NewRow',
@@ -226,16 +227,25 @@ var App = function App() {
         newRow: newState.length
       }
     });
-    setState([].concat(_toConsumableArray(newState), [{
-      key: String(random()),
-      name: 'new',
-      open: false,
-      date: '1990-01-01',
-      address2: "\u6253\u5F00\u5BF9\u8BDD\u68462".concat(newState.length + 2),
-      age: 40 + newState.length,
-      select: '111111',
-      address: 'London Park'
-    }]));
+    setState([].concat(_toConsumableArray(newState), _toConsumableArray(range(0, count).map(function (a, i) {
+      return {
+        key: String(random()),
+        name: 'new',
+        open: false,
+        date: '1990-01-01',
+        address2: "\u6253\u5F00\u5BF9\u8BDD\u68462".concat(newState.length + 2 + i),
+        age: newState[newState.length - 1].age + i + 1,
+        select: '111111',
+        address: 'London Park'
+      };
+    }))));
+    setTimeout(function () {
+      var _sheetInstance$curren2, _sheetInstance$curren3;
+      console.log('select', newState.length + count - 1);
+      (_sheetInstance$curren2 = sheetInstance.current) === null || _sheetInstance$curren2 === void 0 || _sheetInstance$curren2.selectRow(newState.length + count - 1);
+      console.log('zoomTO', newState.length + count - 1);
+      (_sheetInstance$curren3 = sheetInstance.current) === null || _sheetInstance$curren3 === void 0 || _sheetInstance$curren3.zoomTo(newState.length + count - 1);
+    }, 100);
   }, [state]);
   var handleOptionsAdd = useCallback(function () {
     setOptions([].concat(_toConsumableArray(options), [{
@@ -267,6 +277,7 @@ var App = function App() {
     },
     onChange: handleChange,
     handleAdd: handleAdd,
+    handleBatchAdd: handleAdd,
     eventHandler: {
       reverse: function reverse(value) {
         // 处理 行列删除自定义事件

package/dist/type/sheetTable.d.ts

@@ -86,6 +86,7 @@ export type TableProps = {
     onContextMenu?: (event: any) => void;
     onChange: (changes: TableChange[], extChanges?: TableChange[]) => void;
     handleAdd?: () => void;
+    handleBatchAdd?: () => void;
     eventHandler?: Record<'reverse' | 'btn-click' | 'cell-edit' | 'cell-switch' | string, undefined | EventHandler>;
     boldScroll?: boolean;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zhenliang/sheet",
-  "version": "0.1.39",
+  "version": "0.1.41",
   "description": "A react library developed with dumi",
   "license": "MIT",
   "module": "dist/index.js",