@lemon-fe/kits 1.0.0-13 → 1.0.0-131

package/README.md

@@ -31,3 +31,8 @@ Build library via `father-build`,
 ```bash
 $ npm run build
 ```
+
+## Break Changes
+
+- Layout Tab 属性 key 必须，title 可选
+- Section Tab 属性 Key 必须，title 可选

package/es/components/Actions/index.d.ts

@@ -1,6 +1,6 @@
-import { ReactElement } from 'react';
+import { type ReactElement } from 'react';
 import type { CSSProperties } from 'react';
-import { ButtonProps } from 'antd';
+import { type ButtonProps } from 'antd';
 interface ActionBtn extends ButtonProps {
     text: string | ReactElement;
     onClick?: () => void;
@@ -10,16 +10,19 @@ interface ActionBtn extends ButtonProps {
      */
     action?: () => void;
     dropDown?: ({
-        text: string;
-        onClick: () => void;
+        text: string | ReactElement;
+        onClick?: () => void;
         disabled?: boolean;
-    } | null)[];
+    } | ReactElement | null)[] | ReactElement;
 }
 interface Props {
     actions: (ActionBtn | ReactElement | null)[];
     style?: CSSProperties;
     className?: string;
     prefixCls?: string;
+    /**
+     * @description 默认无限大
+     */
     maxShowCount?: number;
 }
 declare function Actions(props: Props): JSX.Element;

package/es/components/Actions/index.js

@@ -20,7 +20,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { Fragment, useState } from 'react';
+import React, { Fragment, useState, isValidElement } from 'react';
 import { Space, Dropdown, Menu, Button, Popover } from 'antd';
 import classNames from 'classnames';
 import Icons from "../Icons";
@@ -33,7 +33,7 @@ function Actions(props) {
       _props$prefixCls = props.prefixCls,
       prefixCls = _props$prefixCls === void 0 ? PREFIX_CLS : _props$prefixCls,
       _props$maxShowCount = props.maxShowCount,
-      maxShowCount = _props$maxShowCount === void 0 ? 3 : _props$maxShowCount;
+      maxShowCount = _props$maxShowCount === void 0 ? Infinity : _props$maxShowCount;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -47,13 +47,13 @@ function Actions(props) {
     style: style
   }, /*#__PURE__*/React.createElement(Space, {
     direction: "horizontal",
-    size: 12
+    size: 8
   }, visibleBtns.map(function (item, index) {
     if (item === null) {
       return item;
     }
 
-    if ( /*#__PURE__*/React.isValidElement(item)) {
+    if ( /*#__PURE__*/isValidElement(item)) {
       return /*#__PURE__*/React.createElement(Fragment, {
         key: index
       }, item);
@@ -67,7 +67,7 @@ function Actions(props) {
         action = item.action,
         rest = _objectWithoutProperties(item, _excluded);
 
-    if ( /*#__PURE__*/React.isValidElement(text)) {
+    if ( /*#__PURE__*/isValidElement(text)) {
       return /*#__PURE__*/React.createElement(Fragment, {
         key: index
       }, text);
@@ -75,49 +75,66 @@ function Actions(props) {
 
     var handleClick = onClick || action;
 
-    if (Array.isArray(dropDown)) {
-      var overlay = /*#__PURE__*/React.createElement(Menu, null, dropDown.map(function (subItem) {
-        if (subItem) {
-          return /*#__PURE__*/React.createElement(Menu.Item, {
-            onClick: function onClick() {
-              return subItem.onClick();
-            },
-            key: subItem.text,
-            disabled: subItem.disabled
-          }, subItem.text);
-        }
-      }));
+    if (dropDown !== undefined) {
+      var overlay;
+
+      if (Array.isArray(dropDown)) {
+        overlay = /*#__PURE__*/React.createElement(Menu, {
+          items: dropDown.filter(Boolean).map(function (subItem, idx) {
+            if ( /*#__PURE__*/isValidElement(subItem)) {
+              return {
+                label: subItem,
+                key: idx
+              };
+            }
+
+            var target = subItem;
+            return {
+              label: target.text,
+              key: idx,
+              disabled: target.disabled,
+              onClick: target.onClick
+            };
+          })
+        });
+      } else {
+        overlay = dropDown;
+      }
 
       if (handleClick !== undefined) {
-        return /*#__PURE__*/React.createElement(Dropdown.Button, {
+        return /*#__PURE__*/React.createElement(Dropdown.Button, _extends({
           key: text,
           disabled: disabled,
           overlay: overlay,
           onClick: handleClick,
+          trigger: ['click'],
+          overlayStyle: {
+            minWidth: 80
+          },
           buttonsRender: function buttonsRender(_ref) {
-            var _ref2 = _slicedToArray(_ref, 2),
-                leftBtn = _ref2[0],
-                _ = _ref2[1];
+            var _ref2 = _slicedToArray(_ref, 1),
+                leftBtn = _ref2[0];
 
             return [leftBtn, /*#__PURE__*/React.createElement(Button, {
-              icon: /*#__PURE__*/React.createElement(Icons.More, null)
+              icon: /*#__PURE__*/React.createElement(Icons.More, null),
+              type: rest.type,
+              key: "more"
             })];
           }
-        }, text);
+        }, rest), text);
       }
 
       return /*#__PURE__*/React.createElement(Dropdown, {
         key: text,
         disabled: disabled,
-        overlay: overlay
+        overlay: overlay,
+        trigger: ['click']
       }, /*#__PURE__*/React.createElement(Button, _extends({
         disabled: disabled,
         icon: icon
       }, rest), text, /*#__PURE__*/React.createElement(Icons.Down, {
         style: {
-          opacity: 0.7,
-          fontSize: 16,
-          verticalAlign: -3
+          opacity: 0.7
         }
       })));
     }
@@ -131,15 +148,15 @@ function Actions(props) {
   }), collapsedBtns.length > 0 ? /*#__PURE__*/React.createElement(Popover, {
     placement: "bottomRight",
     overlayClassName: "".concat(prefixCls, "-actions-popover"),
-    onVisibleChange: setVisible,
-    visible: visible,
+    onOpenChange: setVisible,
+    open: visible,
     trigger: "click",
     content: collapsedBtns.map(function (item, index) {
       if (item === null) {
         return item;
       }
 
-      if ( /*#__PURE__*/React.isValidElement(item)) {
+      if ( /*#__PURE__*/isValidElement(item)) {
         return /*#__PURE__*/React.createElement(Fragment, {
           key: index
         }, item);

package/es/components/Actions/index.less

@@ -24,11 +24,12 @@
 
     &-item {
       box-sizing: border-box;
-      width: 120px;
-      height: 38px;
+      min-width: 120px;
+      max-width: 200px;
+      height: 30px;
       padding: 0 16px;
       color: #333;
-      line-height: 38px;
+      line-height: 30px;
       list-style: none;
       cursor: pointer;
       transition: background-color 0.2s;
@@ -46,7 +47,7 @@
   }
 
   .@{ant-prefix}-btn:not(.@{ant-prefix}-btn-icon-only) {
-    min-width: 80px;
+    min-width: 60px;
 
     .@{prefixCls}-symbol-icon {
       margin-right: 8px;

package/es/components/BaseTable/Actions.js

@@ -77,8 +77,8 @@ export default function Actions(props) {
     }
 
     var key = getKey(item, idx);
-    var dropDown = item.dropDown ? item.dropDown.filter(function (item) {
-      return item !== null;
+    var dropDown = item.dropDown ? item.dropDown.filter(function (sub) {
+      return sub !== null;
     }) : [];
     return /*#__PURE__*/React.createElement("div", {
       className: classNames("".concat(prefixCls, "-item"), _defineProperty({}, "".concat(prefixCls, "-item-disabled"), item.disabled)),

package/es/components/BaseTable/VirtualBody.js

@@ -114,8 +114,8 @@ export default function VirtualList(props) {
 
     var list = [];
     var max = rows.length - 1;
-    var start = range.start,
-        end = range.end;
+    var start = range.start;
+    var end = range.end;
 
     if (end > max) {
       end = max;

package/es/components/BaseTable/index.js

@@ -168,8 +168,8 @@ function BaseTable(props, _ref) {
       return null;
     }
 
-    var style = getComputedStyle(parent);
-    var contentHeight = parent.offsetHeight - (parseFloat(style.getPropertyValue('padding-top')) || 0) - (parseFloat(style.getPropertyValue('padding-bottom')) || 0);
+    var mStyle = getComputedStyle(parent);
+    var contentHeight = parent.offsetHeight - (parseFloat(mStyle.getPropertyValue('padding-top')) || 0) - (parseFloat(mStyle.getPropertyValue('padding-bottom')) || 0);
     var nodes = [];
 
     if (tableBody.previousElementSibling !== null) {

package/es/components/BaseTable/utils.d.ts

@@ -1,4 +1,4 @@
-import { ColumnType, ColumnGroupType } from './typings';
+import type { ColumnType, ColumnGroupType } from './typings';
 export declare function isColumnType<T>(col: ColumnGroupType<T> | ColumnType<T>): col is ColumnType<T>;
 export declare function getColumnKey(col: ColumnType<any>): string | number;
 export declare function randomStr(): string;

package/es/components/DataGrid/cell-editors/Date.d.ts

@@ -1,8 +1,11 @@
 import React from 'react';
 import type { ICellEditorReactComp } from '@ag-grid-community/react';
 import type { ICellEditorParams } from '@ag-grid-community/core';
+import { type Moment } from 'moment';
 export interface DateEditorParams {
     format: string;
+    disabled?: boolean;
+    disabledDate?: (current: Moment) => boolean;
 }
-declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any> & DateEditorParams & React.RefAttributes<ICellEditorReactComp>>;
+declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any, any> & DateEditorParams & React.RefAttributes<ICellEditorReactComp>>;
 export default _default;

package/es/components/DataGrid/cell-editors/Date.js

@@ -1,3 +1,9 @@
+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; }
+
+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; }
+
+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; }
+
 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."); }
@@ -15,11 +21,13 @@ import { forwardRef, useImperativeHandle, useState } from 'react';
 import moment from 'moment';
 import { DatePicker } from 'antd';
 import EditorWrapper from "./Wrapper";
-import { editorPrefixClass } from "./utils";
+import { editorPrefixClass, navigateCell } from "./utils";
 export default /*#__PURE__*/forwardRef(function DateEditor(props, ref) {
-  var cellStartedEdit = props.cellStartedEdit,
-      _props$format = props.format,
-      format = _props$format === void 0 ? 'YYYY-MM-DD' : _props$format;
+  var _props$format = props.format,
+      format = _props$format === void 0 ? 'YYYY-MM-DD' : _props$format,
+      disabled = props.disabled,
+      api = props.api,
+      disabledDate = props.disabledDate;
 
   var _useState = useState(props.value ? moment(props.value, format) : null),
       _useState2 = _slicedToArray(_useState, 2),
@@ -27,52 +35,57 @@ export default /*#__PURE__*/forwardRef(function DateEditor(props, ref) {
       setValue = _useState2[1];
 
   var elm = useRef(null);
+  var isEdited = useRef(false);
   useEffect(function () {
-    if (cellStartedEdit) {
-      var _elm$current;
+    var _elm$current;
 
-      (_elm$current = elm.current) === null || _elm$current === void 0 ? void 0 : _elm$current.focus();
-    }
-  }, [cellStartedEdit]);
+    (_elm$current = elm.current) === null || _elm$current === void 0 ? void 0 : _elm$current.focus();
+  }, []);
 
   var getValue = function getValue() {
-    return value ? value.format(format) : '';
+    return value ? value.format(format) : null;
   };
 
   useImperativeHandle(ref, function () {
     return {
-      getValue: getValue,
-      focusIn: function focusIn() {
-        var _elm$current2;
-
-        (_elm$current2 = elm.current) === null || _elm$current2 === void 0 ? void 0 : _elm$current2.focus();
-        return true;
-      },
-      focusOut: function focusOut() {
-        var _elm$current3;
-
-        (_elm$current3 = elm.current) === null || _elm$current3 === void 0 ? void 0 : _elm$current3.blur();
-        return true;
-      }
+      getValue: getValue
     };
   });
   return /*#__PURE__*/React.createElement(EditorWrapper, null, /*#__PURE__*/React.createElement(DatePicker, {
+    onKeyDown: function onKeyDown(e) {
+      if (isEdited) {
+        navigateCell(_objectSpread(_objectSpread({}, props), {}, {
+          event: e
+        }));
+      }
+    },
     style: {
       display: 'flex',
       paddingTop: 0,
       paddingBottom: 0
     },
+    disabled: disabled,
     className: editorPrefixClass('date'),
     value: value,
     placeholder: format,
+    onOpenChange: function onOpenChange(val) {
+      if (!val) {
+        isEdited.current = true;
+      }
+    },
     onChange: function onChange(val) {
       if (val) {
         setValue(val);
       } else {
         setValue(null);
       }
+
+      requestAnimationFrame(function () {
+        api.tabToNextCell();
+      });
     },
     ref: elm,
-    bordered: false
+    bordered: false,
+    disabledDate: disabledDate
   }));
 });

package/es/components/DataGrid/cell-editors/Number.d.ts

@@ -1,9 +1,32 @@
 import React from 'react';
 import type { ICellEditorReactComp } from '@ag-grid-community/react';
 import type { ICellEditorParams } from '@ag-grid-community/core';
-export interface NumberEditorParams {
+export interface NumberEditorParams<TData = any> {
+    disabled?: boolean;
+    /**
+     * @description 最小值
+     */
     min?: number;
+    /**
+     * @description 最大值
+     */
     max?: number;
+    /**
+     * @description 空值 如果为null则可以是空值
+     * @default 0
+     */
+    emptyValue?: number | null;
+    /**
+     * @description 精度
+     */
+    precision?: number;
+    /**
+     * 可以在不使用min或者max的情况下，进行数值校验，可以用于错误提示
+     * @param newValue
+     * @param data
+     * @returns
+     */
+    isCancelAfterEnd?: (newValue: number, data: TData) => boolean;
 }
-declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any> & NumberEditorParams & React.RefAttributes<ICellEditorReactComp>>;
+declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any, any> & NumberEditorParams<any> & React.RefAttributes<ICellEditorReactComp>>;
 export default _default;

package/es/components/DataGrid/cell-editors/Number.js

@@ -1,3 +1,9 @@
+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; }
+
+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; }
+
+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; }
+
 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."); }
@@ -10,48 +16,66 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-import React, { useEffect, useRef } from 'react';
+import React, { useEffect, useMemo, useRef } from 'react';
 import { forwardRef, useImperativeHandle, useState } from 'react';
 import EditorWrapper from "./Wrapper";
-import { editorPrefixClass } from "./utils";
+import { editorPrefixClass, navigateCell } from "./utils";
 export default /*#__PURE__*/forwardRef(function NumberEditor(props, ref) {
-  var _props$value;
+  var _props$min = props.min,
+      min = _props$min === void 0 ? -99999999 : _props$min,
+      _props$max = props.max,
+      max = _props$max === void 0 ? 99999999 : _props$max,
+      emptyValue = props.emptyValue,
+      disabled = props.disabled,
+      precision = props.precision,
+      _isCancelAfterEnd = props.isCancelAfterEnd,
+      data = props.data;
+
+  var _useMemo = useMemo(function () {
+    if (props.eventKey === 'BackSpace') {
+      return ['', false];
+    }
 
-  var cellStartedEdit = props.cellStartedEdit,
-      min = props.min,
-      max = props.max;
+    if (props.charPress && /^[0-9]$/.test(props.charPress)) {
+      return [props.charPress, false];
+    }
+
+    return [props.value, true];
+  }, []),
+      _useMemo2 = _slicedToArray(_useMemo, 2),
+      defaultValue = _useMemo2[0],
+      shouldSelect = _useMemo2[1];
 
-  var _useState = useState((_props$value = props.value) !== null && _props$value !== void 0 ? _props$value : null),
+  var _useState = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null),
       _useState2 = _slicedToArray(_useState, 2),
       value = _useState2[0],
       setValue = _useState2[1];
 
   var elm = useRef(null);
+  var dirty = useRef(!!props.charPress);
   useEffect(function () {
-    if (cellStartedEdit) {
-      var _elm$current;
-
-      (_elm$current = elm.current) === null || _elm$current === void 0 ? void 0 : _elm$current.select();
+    if (elm.current === null) {
+      return;
     }
-  }, [cellStartedEdit]);
 
-  var getValue = function getValue() {
-    if (value === '' || value === null) {
-      return null;
+    elm.current.focus();
+
+    if (shouldSelect) {
+      elm.current.select();
     }
+  }, []);
 
+  var getFormatedValue = function getFormatedValue() {
     var val;
 
-    if (typeof value === 'string') {
-      val = parseFloat(value);
+    if (value === '' || value === null) {
+      val = emptyValue !== null && emptyValue !== void 0 ? emptyValue : null;
     } else {
-      val = value;
-    }
+      val = +value;
 
-    if (min !== undefined && val < min) {
-      val = min;
-    } else if (max !== undefined && val > max) {
-      val = max;
+      if (precision !== undefined) {
+        val = Math.round(val * Math.pow(10, precision)) / Math.pow(10, precision);
+      }
     }
 
     return val;
@@ -59,28 +83,65 @@ export default /*#__PURE__*/forwardRef(function NumberEditor(props, ref) {
 
   useImperativeHandle(ref, function () {
     return {
-      getValue: getValue,
-      focusIn: function focusIn() {
-        var _elm$current2;
-
-        (_elm$current2 = elm.current) === null || _elm$current2 === void 0 ? void 0 : _elm$current2.select();
-        return true;
+      getValue: function getValue() {
+        return getFormatedValue();
       },
-      focusOut: function focusOut() {
-        var _elm$current3;
+      isCancelAfterEnd: function isCancelAfterEnd() {
+        if (!dirty.current) {
+          return true;
+        }
+
+        var val = getFormatedValue();
 
-        (_elm$current3 = elm.current) === null || _elm$current3 === void 0 ? void 0 : _elm$current3.blur();
-        return true;
+        if (emptyValue === null && val === null) {
+          return false;
+        }
+
+        if (val === null || val < min || val > max) {
+          return true;
+        }
+
+        if (_isCancelAfterEnd !== undefined) {
+          return _isCancelAfterEnd(val, data);
+        }
+
+        return false;
       }
     };
   });
+  var text = useMemo(function () {
+    if (value === '' || value === null) {
+      return '';
+    }
+
+    var val;
+
+    if (typeof value !== 'number') {
+      val = +value;
+    } else {
+      val = value;
+    }
+
+    if (precision !== undefined) {
+      return Math.round(val * Math.pow(10, precision)) / Math.pow(10, precision);
+    }
+
+    return val;
+  }, [value, precision]);
   return /*#__PURE__*/React.createElement(EditorWrapper, null, /*#__PURE__*/React.createElement("input", {
     type: "number",
+    onKeyDown: function onKeyDown(e) {
+      return navigateCell(_objectSpread(_objectSpread({}, props), {}, {
+        event: e
+      }));
+    },
+    disabled: disabled,
     className: editorPrefixClass('text'),
     ref: elm,
-    value: value !== null && value !== void 0 ? value : '',
+    value: text,
     onChange: function onChange(event) {
-      return setValue(event.target.value);
+      dirty.current = true;
+      setValue(event.target.value);
     }
   }));
 });

package/es/components/DataGrid/cell-editors/Row.d.ts

@@ -0,0 +1,23 @@
+import type { MutableRefObject, ReactElement } from 'react';
+import React from 'react';
+import type { ICellEditorReactComp } from '@ag-grid-community/react';
+import type { ICellEditorParams } from '@ag-grid-community/core';
+export declare class RowEditorData<T> {
+    private data;
+    constructor(data: T);
+    getValue(): T;
+}
+export declare type RowEditorActionType = 'stop' | 'next';
+export interface RowEditorParams<T = any, K = any> {
+    suppressEnterEvent?: boolean;
+    isCancelAfterEnd?: (newValue: T, data: T) => boolean;
+    render: (val: K, data: T, params: ICellEditorParams<T, K> & {
+        ref: MutableRefObject<{
+            select?: () => void;
+            focus?: () => void;
+        } | null>;
+        onChange: (val: Partial<T>, action?: RowEditorActionType) => void;
+    }) => ReactElement | null;
+}
+declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any, any> & RowEditorParams<any, any> & React.RefAttributes<ICellEditorReactComp>>;
+export default _default;