@lemon-fe/kits 1.0.0-22 → 1.0.0-24

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

@@ -0,0 +1,8 @@
+import type { ICellEditorReactComp } from '@ag-grid-community/react';
+import type { ICellEditorParams } from '@ag-grid-community/core';
+import { type ForwardedRef, type ReactElement } from 'react';
+export interface CombinationEditorParams<T = any> {
+    render: (props: ICellEditorParams<T>, ref: ForwardedRef<ICellEditorReactComp>) => ReactElement | null;
+}
+declare const _default: import("react").ForwardRefExoticComponent<ICellEditorParams<any, any> & CombinationEditorParams<any> & import("react").RefAttributes<ICellEditorReactComp>>;
+export default _default;

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

@@ -0,0 +1,25 @@
+var _excluded = ["render"];
+
+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 _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; }
+
+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; }
+
+import { forwardRef } from 'react';
+import { useGridStore } from "../hooks";
+export default /*#__PURE__*/forwardRef(function CombinationEditor(props, ref) {
+  var render = props.render,
+      restProps = _objectWithoutProperties(props, _excluded);
+
+  var context = useGridStore(function (state) {
+    return state.context;
+  });
+  return render(_objectSpread(_objectSpread({}, restProps), {}, {
+    context: context
+  }), ref);
+});

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

@@ -1,9 +1,14 @@
-/// <reference types="react" />
+import React, { MutableRefObject, ReactElement } from 'react';
 import type { ICellEditorReactComp } from '@ag-grid-community/react';
 import type { ICellEditorParams } from '@ag-grid-community/core';
-import type { EditableRender } from '../typings';
-export interface CustomEditorParams {
-    render: EditableRender<any>;
+export interface CustomEditorParams<T = any, K = any> {
+    render: (val: K, data: T, params: ICellEditorParams<T, K> & {
+        ref: MutableRefObject<{
+            select?: () => void;
+            focus?: () => void;
+        } | null>;
+        onChange: (val: Partial<T>, action?: 'stop' | 'next') => void;
+    }) => ReactElement | null;
 }
-declare const _default: import("react").ForwardRefExoticComponent<ICellEditorParams<any, any> & CustomEditorParams & import("react").RefAttributes<ICellEditorReactComp>>;
+declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any> & CustomEditorParams<any, any> & React.RefAttributes<ICellEditorReactComp>>;
 export default _default;

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

@@ -1,25 +1,80 @@
-var _excluded = ["render"];
-
 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 _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; }
+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 _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; }
+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; }
 
-import { forwardRef } from 'react';
+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; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { useEffect, useRef } from 'react';
+import { get } from 'lodash';
+import { forwardRef, useImperativeHandle, useState } from 'react';
+import EditorWrapper from "./Wrapper";
 import { useGridStore } from "../hooks";
 export default /*#__PURE__*/forwardRef(function CustomEditor(props, ref) {
-  var render = props.render,
-      restProps = _objectWithoutProperties(props, _excluded);
+  var api = props.api,
+      cellStartedEdit = props.cellStartedEdit,
+      stopEditing = props.stopEditing,
+      data = props.data,
+      render = props.render,
+      field = props.colDef.field;
+
+  var _useState = useState(data),
+      _useState2 = _slicedToArray(_useState, 2),
+      value = _useState2[0],
+      setValue = _useState2[1];
 
   var context = useGridStore(function (state) {
     return state.context;
   });
-  return render(_objectSpread(_objectSpread({}, restProps), {}, {
-    context: context
-  }), ref);
+  var elm = useRef(null);
+  useEffect(function () {
+    if (cellStartedEdit && elm.current !== null) {
+      if (elm.current.select !== undefined) {
+        elm.current.select();
+      } else if (elm.current.focus !== undefined) {
+        elm.current.focus();
+      }
+    }
+  }, [cellStartedEdit]);
+  useImperativeHandle(ref, function () {
+    return {
+      getValue: function getValue() {
+        return value;
+      }
+    };
+  });
+
+  var handleChange = function handleChange(val, action) {
+    setValue(val);
+
+    if (action !== undefined) {
+      requestAnimationFrame(function () {
+        switch (action) {
+          case 'stop':
+            stopEditing();
+            break;
+
+          case 'next':
+            api.tabToNextCell();
+        }
+      });
+    }
+  };
+
+  return /*#__PURE__*/React.createElement(EditorWrapper, null, render(field ? get(value, field) : null, data, _objectSpread(_objectSpread({}, props), {}, {
+    context: context,
+    ref: elm,
+    onChange: handleChange
+  })));
 });

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

@@ -1,7 +1,10 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 import type { ICellEditorReactComp } from '@ag-grid-community/react';
 import type { ICellEditorParams } from '@ag-grid-community/core';
 import type { SelectProps } from 'antd/lib/select';
-export declare type SelectEditorParams = Pick<SelectProps, 'disabled' | 'options' | 'fieldNames' | 'virtual' | 'showSearch' | 'listHeight' | 'listItemHeight' | 'allowClear' | 'mode' | 'labelInValue'>;
+export declare type SelectEditorParams = Pick<SelectProps<any, {
+    label: ReactNode;
+    value?: string | number | null | boolean;
+}>, 'disabled' | 'options' | 'fieldNames' | 'virtual' | 'showSearch' | 'listHeight' | 'listItemHeight' | 'allowClear' | 'mode' | 'labelInValue'>;
 declare const _default: React.ForwardRefExoticComponent<ICellEditorParams<any, any> & SelectEditorParams & React.RefAttributes<ICellEditorReactComp>>;
 export default _default;

package/es/components/DataGrid/index.js

@@ -70,7 +70,7 @@ import { ColumnsToolPanelModule } from "./modules/column-tool-panel";
 import { SideBarModule } from "./modules/side-bar";
 import { ServerSideRowModelModule } from "./modules/server-side-row-model";
 import { ClientSideRowModelModule } from "./modules/client-side-row-model";
-import { Spin, Pagination } from 'antd';
+import { Spin, Pagination, Empty } from 'antd';
 import { prefix, getColField, isColumnType, withSyncRender, ColMethod, Store, Selection, columnTypes } from "./utils";
 import HeaderRenderer from "./HeaderRenderer";
 import CellRenderer from "./CellRenderer";
@@ -81,7 +81,7 @@ import NumberEditor from "./cell-editors/Number";
 import SelectEditor from "./cell-editors/Select";
 import Custom from "./cell-editors/Custom";
 import EditorWrapper from "./cell-editors/Wrapper";
-import empty from "./empty.png";
+import Combination from "./cell-editors/Combination";
 export { AgGridReact } from '@ag-grid-community/react';
 ModuleRegistry.registerModules([ClientSideRowModelModule, RowGroupingModule, InfiniteRowModelModule, ClipboardModule, MenuModule, SideBarModule, ColumnsToolPanelModule, ServerSideRowModelModule], false);
 var defaultColDef = {
@@ -367,17 +367,27 @@ var DataGrid = /*#__PURE__*/function (_Component) {
             var id = getColField(item);
 
             if (id !== undefined) {
-              descriptor[id] = rules.map(function (rule) {
-                var validator = rule.validator,
-                    restRule = _objectWithoutProperties(rule, _excluded);
-
-                return _objectSpread(_objectSpread({}, restRule), {}, {
-                  asyncValidator: validator ? function (mRule, value, _, record) {
-                    return validator(mRule, value, record);
-                  } : undefined,
-                  validator: undefined
+              var path = id.split('.');
+              var node = {};
+
+              for (var i = path.length - 1; i >= 0; i -= 1) {
+                node = _defineProperty({}, path[i], i === path.length - 1 ? rules.map(function (rule) {
+                  var validator = rule.validator,
+                      restRule = _objectWithoutProperties(rule, _excluded);
+
+                  return _objectSpread(_objectSpread({}, restRule), {}, {
+                    asyncValidator: validator ? function (mRule, value, _, record) {
+                      return validator(mRule, value, record);
+                    } : undefined,
+                    validator: undefined
+                  });
+                }) : {
+                  type: 'object',
+                  fields: node
                 });
-              });
+              }
+
+              Object.assign(descriptor, node);
             }
           }
 
@@ -533,9 +543,9 @@ var DataGrid = /*#__PURE__*/function (_Component) {
             if (_typeof(editable) === 'object') {
               var _type = editable.type,
                   params = editable.params,
-                  _render = editable.render,
                   valueSetter = editable.valueSetter;
               _opts.editable = true;
+              _opts.cellEditorParams = params;
               _opts.cellClassRules = _defineProperty({}, prefix('editor-cell'), function () {
                 return true;
               });
@@ -563,17 +573,14 @@ var DataGrid = /*#__PURE__*/function (_Component) {
               switch (_type) {
                 case 'text':
                   _opts.cellEditor = TextEditor;
-                  _opts.cellEditorParams = params;
                   break;
 
                 case 'number':
                   _opts.cellEditor = NumberEditor;
-                  _opts.cellEditorParams = params;
                   break;
 
                 case 'date':
                   _opts.cellEditor = DateEditor;
-                  _opts.cellEditorParams = params;
 
                   _opts.suppressKeyboardEvent = function (_ref2) {
                     var editing = _ref2.editing,
@@ -590,7 +597,6 @@ var DataGrid = /*#__PURE__*/function (_Component) {
 
                 case 'select':
                   _opts.cellEditor = SelectEditor;
-                  _opts.cellEditorParams = params;
 
                   _opts.suppressKeyboardEvent = function (_ref3) {
                     var editing = _ref3.editing,
@@ -605,13 +611,19 @@ var DataGrid = /*#__PURE__*/function (_Component) {
 
                   break;
 
+                case 'combination':
+                  _opts.cellEditor = Combination;
+                  break;
+
                 case 'custom':
-                  if (_render !== undefined) {
-                    _opts.cellEditor = Custom;
-                    _opts.cellEditorParams = _objectSpread(_objectSpread({}, params), {}, {
-                      render: _render
-                    });
-                  }
+                  _opts.cellEditor = Custom;
+
+                  _opts.valueSetter = function (mParams) {
+                    Object.assign(mParams.data, mParams.newValue);
+                    return true;
+                  };
+
+                  break;
 
                 default:
               }
@@ -853,11 +865,7 @@ var DataGrid = /*#__PURE__*/function (_Component) {
   }, {
     key: "NoRowsOverlay",
     value: function NoRowsOverlay() {
-      return /*#__PURE__*/React.createElement("div", {
-        className: prefix('empty')
-      }, /*#__PURE__*/React.createElement("img", {
-        src: empty
-      }), /*#__PURE__*/React.createElement("div", null, "\u6682\u65E0\u6570\u636E"));
+      return /*#__PURE__*/React.createElement(Empty, null);
     }
   }, {
     key: "getMainMenuItems",

package/es/components/DataGrid/index.less

@@ -190,18 +190,6 @@
     transform: rotate(135deg);
   }
 
-  &-empty {
-    display: inline-block;
-    text-align: center;
-    color: rgba(51, 51, 51, 0.533);
-
-    & > img {
-      width: 120px;
-      height: 120px;
-      vertical-align: top;
-    }
-  }
-
   &-spin {
     position: absolute;
     top: 0;
@@ -360,4 +348,8 @@
     color: var(--ag-foreground-color);
     opacity: 0.75;
   }
+
+  .ag-overlay-no-rows-wrapper .@{ant-prefix}-empty-description {
+    color: rgba(51, 51, 51, 0.533);
+  }
 }

package/es/components/DataGrid/typings.d.ts

@@ -1,18 +1,33 @@
-import type { AgGridReactProps, ICellEditorReactComp } from '@ag-grid-community/react';
-import type { ColDef, ColGroupDef, ICellEditorParams, ICellRendererParams, IHeaderParams } from '@ag-grid-community/core';
+import type { AgGridReactProps } from '@ag-grid-community/react';
+import type { ColDef, ColGroupDef, ICellRendererParams, IHeaderParams } from '@ag-grid-community/core';
 import type { RuleItem } from 'async-validator/dist-types/interface';
-import type { ForwardedRef, ReactElement, ReactNode } from 'react';
+import type { ReactElement, ReactNode } from 'react';
 export type { ColDef, ColGroupDef, ColumnState, GridApi, ICellEditorParams, ICellRendererParams, } from '@ag-grid-community/core';
+export type { AgGridReactProps, ICellEditorReactComp } from '@ag-grid-community/react';
+import type { TextEditorParams } from './cell-editors/Text';
+import type { NumberEditorParams } from './cell-editors/Number';
+import type { DateEditorParams } from './cell-editors/Date';
+import type { SelectEditorParams } from './cell-editors/Select';
+import type { CustomEditorParams } from './cell-editors/Custom';
+import type { CombinationEditorParams } from './cell-editors/Combination';
 export type { TextEditorParams } from './cell-editors/Text';
 export type { NumberEditorParams } from './cell-editors/Number';
 export type { DateEditorParams } from './cell-editors/Date';
 export type { SelectEditorParams } from './cell-editors/Select';
+export type { CombinationEditorParams } from './cell-editors/Combination';
+export type { CustomEditorParams } from './cell-editors/Custom';
 export declare type GetRowKey<T> = string | ((data: T) => string);
 export declare type PathType = string | (string | number)[];
 export declare type ValidateRule<T> = Pick<RuleItem, 'required' | 'message' | 'pattern' | 'min' | 'max' | 'len' | 'type'> & {
     validator?: (rule: any, val: any, record: T) => void | Promise<void>;
 };
-export declare type EditableRender<T> = (params: ICellEditorParams<T>, ref: ForwardedRef<ICellEditorReactComp>) => ReactElement | null;
+export declare type EditableParams<T extends {
+    type: string;
+    params?: any;
+}, K> = T & {
+    rules?: ValidateRule<K>[];
+    valueSetter?: (val: any, data: K) => Partial<K>;
+};
 export interface ColumnType<TData> extends Omit<ColDef<TData>, 'editable'> {
     title?: ReactNode | ((params: IHeaderParams) => ReactNode);
     dataIndex?: PathType;
@@ -25,19 +40,31 @@ export interface ColumnType<TData> extends Omit<ColDef<TData>, 'editable'> {
     /**
      * @description
      * @en cell renderer. it should be a pure function, do not use the state from the closure but from cellContext
-     * @zh 单元格渲染函数. 建议是一个纯函数，不使用闭包中的状态变量，而是通过cellContext引入
+     * @zh 单元格渲染函数. 需要是一个纯函数，不使用外部组件的状态变量，而是通过context引入
      */
     render?: (val: any, record: TData, index: number, params: ICellRendererParams) => ReactElement | string | number | null;
     /**
      * @description 可编辑单元格
      */
-    editable?: boolean | {
-        type?: string;
-        params?: any;
-        rules?: ValidateRule<TData>[];
-        render?: EditableRender<TData>;
-        valueSetter?: (val: any, data: TData) => Partial<TData>;
-    };
+    editable?: boolean | EditableParams<{
+        type: 'text';
+        params?: TextEditorParams;
+    }, TData> | EditableParams<{
+        type: 'number';
+        params?: NumberEditorParams;
+    }, TData> | EditableParams<{
+        type: 'date';
+        params?: DateEditorParams;
+    }, TData> | EditableParams<{
+        type: 'select';
+        params?: SelectEditorParams;
+    }, TData> | EditableParams<{
+        type: 'combination';
+        params?: CombinationEditorParams<TData>;
+    }, TData> | EditableParams<{
+        type: 'custom';
+        params?: CustomEditorParams<TData>;
+    }, TData>;
 }
 export interface ColumnGroupType<T> extends Omit<ColGroupDef<T>, 'children'> {
     title?: string | number;

package/es/init.js

@@ -7,10 +7,11 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 
 import React from 'react';
-import { message, Modal, Select, ConfigProvider, Result, Button, version, DatePicker, Cascader, TreeSelect } from 'antd';
+import { message, Modal, Select, ConfigProvider, Result, Button, version, DatePicker, Cascader, TreeSelect, Empty } from 'antd';
 import { config } from '@lemon-fe/hooks';
 import PageLoading from "./components/PageLoading";
 import Icons from "./components/Icons";
+import empty from "./styles/empty.png";
 var Tip = Icons.Tip,
     Down = Icons.Down,
     BigTip = Icons.BigTip,
@@ -95,15 +96,28 @@ export default function init() {
       marginRight: -1,
       pointerEvents: 'none'
     }
-  }); //@ts-ignore
+  });
+  Empty.defaultProps = {
+    image: empty
+  }; //@ts-ignore
 
   Select.defaultProps = {
+    notFoundContent: /*#__PURE__*/React.createElement(Empty, {
+      imageStyle: {
+        height: 60
+      }
+    }),
     suffixIcon: version >= '4.18.9' ? node : function () {
       return node;
     }
   }; //@ts-ignore
 
   TreeSelect.defaultProps = {
+    notFoundContent: /*#__PURE__*/React.createElement(Empty, {
+      imageStyle: {
+        height: 60
+      }
+    }),
     suffixIcon: version >= '4.18.9' ? node : function () {
       return node;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/kits",
-  "version": "1.0.0-22",
+  "version": "1.0.0-24",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",