@lemon-fe/kits 1.0.0-46 → 1.0.0-47

package/es/components/DataGrid/context/GridStore.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { Store } from '../utils';
+declare const GridStoreContext: import("react").Context<Store<any>>;
+export default GridStoreContext;

package/es/components/DataGrid/context/GridStore.js

@@ -0,0 +1,4 @@
+import { createContext } from 'react';
+import { Store } from "../utils";
+var GridStoreContext = /*#__PURE__*/createContext(new Store({}));
+export default GridStoreContext;

package/es/components/DataGrid/hooks.js

@@ -12,9 +12,9 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import { useContext, useEffect, useRef, useState } from 'react';
 import shallowEqual from 'shallowequal';
-import GridContext from "./GridContext";
+import GridStoreContext from "./context/GridStore";
 export function useGridStore(getter) {
-  var store = useContext(GridContext);
+  var store = useContext(GridStoreContext);
   var ref = useRef(getter);
   ref.current = getter;
 

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

@@ -1,19 +1,12 @@
 import React, { Component } from 'react';
-import type { ColDef, ColGroupDef } from '@ag-grid-community/core';
-import { GridApi } from '@ag-grid-community/core';
-import type { ColType, DataGridProps } from './typings';
+import type { ColDef } from '@ag-grid-community/core';
+import { GridApi, ColumnApi } from '@ag-grid-community/core';
+import type { ColType, DataGridProps, DataGridState } from './typings';
 import EditorWrapper from './cell-editors/Wrapper';
-export default class DataGrid<TData> extends Component<DataGridProps<TData>, {
-    colDefs: (ColDef<TData> | ColGroupDef<TData>)[];
-    pagination: boolean;
-    page: number;
-    pageSize: number;
-    total: number;
-    loading: boolean;
-}> {
+export default class DataGrid<TData> extends Component<DataGridProps<TData>, DataGridState<TData>> {
     api: GridApi<any>;
+    columnApi: ColumnApi;
     private selected;
-    private columnApi;
     private store;
     private dataSource;
     private validator;

package/es/components/DataGrid/index.js

@@ -70,7 +70,7 @@ import { ModuleRegistry, GridApi, ColumnApi } from '@ag-grid-community/core';
 import { InfiniteRowModelModule } from '@ag-grid-community/infinite-row-model';
 import { get, set } from 'lodash';
 import Scheme from 'async-validator';
-import GridContext from "./GridContext";
+import GridStoreContext from "./context/GridStore";
 import { RowGroupingModule } from "./modules/row-grouping";
 import { ClipboardModule } from "./modules/clipboard";
 import { MenuModule } from "./modules/menu";
@@ -80,9 +80,9 @@ import { ServerSideRowModelModule } from "./modules/server-side-row-model";
 import { ClientSideRowModelModule } from "./modules/client-side-row-model";
 import { Spin, Pagination, Empty } from 'antd';
 import { prefix, getColField, isColumn, withSyncRender, Store, Selection, columnTypes } from "./utils";
-import HeaderRenderer from "./HeaderRenderer";
-import CellRenderer from "./CellRenderer";
-import Actions from "./Actions";
+import HeaderRenderer from "./renderer/HeaderRenderer";
+import CellRenderer from "./renderer/CellRenderer";
+import Actions from "./renderer/Actions";
 import DateEditor from "./cell-editors/Date";
 import TextEditor from "./cell-editors/Text";
 import NumberEditor from "./cell-editors/Number";
@@ -118,10 +118,10 @@ var DataGrid = /*#__PURE__*/function (_Component) {
 
     _defineProperty(_assertThisInitialized(_this), "api", new GridApi());
 
-    _defineProperty(_assertThisInitialized(_this), "selected", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "columnApi", new ColumnApi());
 
+    _defineProperty(_assertThisInitialized(_this), "selected", void 0);
+
     _defineProperty(_assertThisInitialized(_this), "store", void 0);
 
     _defineProperty(_assertThisInitialized(_this), "dataSource", []);
@@ -277,7 +277,8 @@ var DataGrid = /*#__PURE__*/function (_Component) {
     }, _this.getPagination());
     _this.store = new Store({
       errors: new Map(),
-      context: props.context
+      context: props.context,
+      grid: _assertThisInitialized(_this)
     });
     var _props$rowSelection = props.rowSelection;
     _props$rowSelection = _props$rowSelection === void 0 ? {} : _props$rowSelection;
@@ -1059,7 +1060,7 @@ var DataGrid = /*#__PURE__*/function (_Component) {
           total = _this$state2.total,
           loading = _this$state2.loading;
       var mPage = _typeof(pagination) === 'object' ? pagination : {};
-      return /*#__PURE__*/React.createElement(GridContext.Provider, {
+      return /*#__PURE__*/React.createElement(GridStoreContext.Provider, {
         value: this.store
       }, /*#__PURE__*/React.createElement("div", {
         className: "ag-theme-lemon ".concat(prefix()),

package/es/components/DataGrid/index.less

@@ -19,6 +19,10 @@
     margin-right: 4px;
   }
 
+  &-cell-align-center {
+    text-align: center;
+  }
+
   &-editable-cell {
     padding-right: 0;
     padding-left: 0;
@@ -179,8 +183,8 @@
   }
 
   .ag-cell:not(.ag-cell-wrap-text) &-editor {
-    text-overflow: ellipsis;
     white-space: nowrap;
+    text-overflow: ellipsis;
   }
 
   &-cell-error {
@@ -200,8 +204,8 @@
     bottom: 0;
     left: 0;
     display: flex;
-    justify-content: center;
     align-items: center;
+    justify-content: center;
     background-color: rgba(255, 255, 255, 0.6);
   }
 }
@@ -257,8 +261,8 @@
   }
 
   .ag-cell-inline-editing {
-    background-color: transparent;
     height: calc(var(--ag-row-height) - 1px);
+    background-color: transparent;
   }
 
   .ag-ltr
@@ -341,10 +345,10 @@
   .ag-column-drop-vertical-empty-message {
     display: flex;
     align-items: center;
-    border: dashed 1px;
-    border-color: var(--ag-border-color);
     margin: calc(var(--ag-grid-size) * 2);
     padding: calc(var(--ag-grid-size) * 2);
+    border: dashed 1px;
+    border-color: var(--ag-border-color);
   }
 
   .ag-column-drop-empty-message {

package/es/components/DataGrid/{Actions.d.ts → renderer/Actions.d.ts}

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { RowActionsType } from './typings';
+import type { RowActionsType } from '../typings';
 interface Props<T> {
     actions: RowActionsType<T>;
     data: T;

package/es/components/DataGrid/{Actions.js → renderer/Actions.js}

@@ -14,8 +14,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import React, { useEffect, useRef, useState } from 'react';
 import classNames from 'classnames';
-import Icons from "../Icons";
-import { prefixClassName } from "../utils";
+import Icons from "../../Icons";
+import { prefixClassName } from "../../utils";
 import { Popover } from 'antd';
 var prefix = prefixClassName('grid-operator');
 

package/es/components/DataGrid/renderer/CellIndexRenderer.d.ts

@@ -0,0 +1,2 @@
+import type { ICellRendererParams } from '@ag-grid-community/core';
+export default function CellIndexRender<TData>(props: ICellRendererParams<TData>): number | null;

package/es/components/DataGrid/renderer/CellIndexRenderer.js

@@ -0,0 +1,46 @@
+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(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 { useContext, useEffect, useState } from 'react';
+import GridStoreContext from "../context/GridStore";
+export default function CellIndexRender(props) {
+  var node = props.node;
+
+  var _useState = useState(node.rowIndex),
+      _useState2 = _slicedToArray(_useState, 2),
+      index = _useState2[0],
+      setIndex = _useState2[1];
+
+  var store = useContext(GridStoreContext);
+  useEffect(function () {
+    var handler = function handler(evt) {
+      setIndex(evt.node.rowIndex);
+    };
+
+    node.addEventListener('rowIndexChanged', handler);
+    return function () {
+      node.removeEventListener('rowIndexChanged', handler);
+    };
+  }, []);
+
+  if (index === null) {
+    return null;
+  }
+
+  var _ref = store.getState(),
+      grid = _ref.grid;
+
+  var _grid$state = grid.state,
+      page = _grid$state.page,
+      pageSize = _grid$state.pageSize;
+  return (page - 1) * pageSize + index + 1;
+}

package/es/components/DataGrid/{CellRenderer.d.ts → renderer/CellRenderer.d.ts}

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import type { ICellRendererParams } from '@ag-grid-community/core';
-import type { ColType } from './typings';
+import type { ColType } from '../typings';
 export default function CellRenderer<TData>(props: ICellRendererParams<TData> & Exclude<Pick<ColType<TData>, 'render'>, undefined>): JSX.Element;

package/es/components/DataGrid/{CellRenderer.js → renderer/CellRenderer.js}

@@ -23,9 +23,9 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 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 React from 'react';
-import { useGridStore } from "./hooks";
-import { prefix } from "./utils";
-import EditorWrapper from "./cell-editors/Wrapper";
+import { useGridStore } from "../hooks";
+import { prefix } from "../utils";
+import EditorWrapper from "../cell-editors/Wrapper";
 export default function CellRenderer(props) {
   var _ref, _restProps$valueForma;
 

package/es/components/DataGrid/{HeaderRenderer.d.ts → renderer/HeaderRenderer.d.ts}

@@ -1,6 +1,6 @@
 import { type ReactNode } from 'react';
 import type { IHeaderParams } from '@ag-grid-community/core';
-import type { ColType } from './typings';
+import type { ColType } from '../typings';
 export default function HeaderRenderer<TData>(props: IHeaderParams<TData> & Pick<ColType<TData>, 'title'> & {
     children?: ReactNode;
 }): JSX.Element;

package/es/components/DataGrid/{HeaderRenderer.js → renderer/HeaderRenderer.js}

@@ -14,7 +14,7 @@ import React, { useContext } from 'react';
 import { CaretUpOutlined, CaretDownOutlined } from '@ant-design/icons';
 import classNames from 'classnames';
 import { ConfigProvider } from 'antd';
-import { useGridStore } from "./hooks";
+import { useGridStore } from "../hooks";
 
 function Sort(props) {
   var value = props.value;

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

@@ -7,6 +7,7 @@ import type { NumberEditorParams } from './cell-editors/Number';
 import type { DateEditorParams } from './cell-editors/Date';
 import type { SelectEditorParams } from './cell-editors/Select';
 import type { RowEditorParams } from './cell-editors/Row';
+import type DataGrid from './index';
 export type { TextEditorParams } from './cell-editors/Text';
 export type { NumberEditorParams } from './cell-editors/Number';
 export type { DateEditorParams } from './cell-editors/Date';
@@ -73,9 +74,18 @@ export declare type SortType = {
     field: string;
     order: SortOrder;
 };
+export declare type DataGridState<TData> = {
+    colDefs: (ColDef<TData> | ColGroupDef<TData>)[];
+    pagination: boolean;
+    page: number;
+    pageSize: number;
+    total: number;
+    loading: boolean;
+};
 export declare type GridStore = {
     errors: Map<string, Map<string, string[]>>;
     context?: any;
+    grid: DataGrid<any>;
 };
 export interface RowAction<T> {
     /**

package/es/components/DataGrid/utils.js

@@ -26,6 +26,7 @@ import { Subject } from '@lemon-fe/utils';
 import { get as _get, set as _set } from 'lodash';
 import moment from 'moment';
 import { prefixClassName } from "../utils";
+import CellIndexRender from "./renderer/CellIndexRenderer";
 export var prefix = prefixClassName('grid');
 export function isColumn(col) {
   return col.children === undefined;
@@ -255,5 +256,12 @@ export var columnTypes = {
     headerClass: 'ag-right-aligned-header',
     cellClass: 'ag-right-aligned-cell',
     width: 120
+  },
+  index: {
+    headerName: '序号',
+    cellRenderer: CellIndexRender,
+    width: 45,
+    suppressMenu: true,
+    cellClass: prefix('cell-align-center')
   }
 };

package/es/index.d.ts

@@ -31,7 +31,8 @@ export { default as Dropdown } from './components/Dropdown';
 export { default as SelectView } from './components/SelectView';
 export { default as DataGrid } from './components/DataGrid';
 export * from './components/DataGrid/typings';
-export type { ColDef, ColGroupDef, ColumnState, GridApi, GridOptions, ICellEditorParams, ICellRendererParams, IHeaderParams, RowDataUpdatedEvent, CellValueChangedEvent, NavigateToNextCellParams, TabToNextCellParams, } from '@ag-grid-community/core';
+export type { ColDef, ColGroupDef, ColumnState, GridOptions, GridReadyEvent, ICellEditorParams, ICellRendererParams, IHeaderParams, RowDataUpdatedEvent, CellValueChangedEvent, NavigateToNextCellParams, TabToNextCellParams, } from '@ag-grid-community/core';
+export { GridApi, ColumnApi } from '@ag-grid-community/core';
 export * from '@ag-grid-community/react';
 export { default as BasicLayout } from './layouts/BasicLayout';
 export { default as BlankLayout } from './layouts/BlankLayout';

package/es/index.js

@@ -26,6 +26,7 @@ export { default as Dropdown } from "./components/Dropdown";
 export { default as SelectView } from "./components/SelectView";
 export { default as DataGrid } from "./components/DataGrid";
 export * from "./components/DataGrid/typings";
+export { GridApi, ColumnApi } from '@ag-grid-community/core';
 export * from '@ag-grid-community/react';
 export { default as BasicLayout } from "./layouts/BasicLayout";
 export { default as BlankLayout } from "./layouts/BlankLayout";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/kits",
-  "version": "1.0.0-46",
+  "version": "1.0.0-47",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",
@@ -69,14 +69,13 @@
     "@types/react-router": "^5.0.0",
     "@types/react-router-dom": "^5.0.0",
     "@types/shallowequal": "^1.1.1",
-    "@umijs/fabric": "^2.8.1",
+    "@umijs/fabric": "^2.14.1",
     "@umijs/test": "^3.0.5",
     "dumi": "^1.1.0",
     "father": "^4.0.7",
     "gh-pages": "^3.0.0",
     "husky": "^8.0.1",
     "lint-staged": "^10.0.7",
-    "prettier": "^2.2.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   }

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

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import { Store } from './utils';
-declare const GridContext: import("react").Context<Store<any>>;
-export default GridContext;

package/es/components/DataGrid/GridContext.js

@@ -1,4 +0,0 @@
-import { createContext } from 'react';
-import { Store } from "./utils";
-var GridContext = /*#__PURE__*/createContext(new Store({}));
-export default GridContext;