es-grid-template 1.9.61 → 1.9.63

package/es/ali-table/Grid.js

@@ -368,7 +368,7 @@ const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
     theme: theme,
     dataRowIds: dataRowIds,
     footerDataSource: footerDataSource
-  })), (bottom || pagination && !infiniteScroll) && /*#__PURE__*/React.createElement("div", {
+  })), (bottom || toolbarItemsBottom && toolbarItemsBottom.length > 0 || pagination && !infiniteScroll) && /*#__PURE__*/React.createElement("div", {
     className: classNames(`${prefix}-grid-bottom`, {})
   }, bottom, toolbarItemsBottom && toolbarItemsBottom.length > 0 && /*#__PURE__*/React.createElement("div", {
     className: classNames('ui-rc-toolbar-bottom', {

package/es/ali-table/InternalTable.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import './base-table/styles.scss';
 import type { TableProps } from "../grid-component/type";
-declare const InternalTable: <RecordType extends object>(props: TableProps<RecordType>) => JSX.Element;
+import type { BaseRecord } from "./interfaces";
+declare const InternalTable: <RecordType extends BaseRecord>(props: TableProps<RecordType>) => JSX.Element;
 export default InternalTable;

package/es/ali-table/InternalTable.js

@@ -68,6 +68,7 @@ const InternalTable = props => {
     toolbarItems,
     defaultValue,
     commandSettings,
+    headerData,
     ...rest
   } = props;
   const tableRef = useRef(null);
@@ -314,51 +315,29 @@ const InternalTable = props => {
       type: changeType,
       newState,
       prevState,
-      option,
-      field,
-      indexCol,
-      indexRow,
-      key
+      field
     } = args;
     if (changeType === 'blur') {
-      const handleChangeCallback = callbackData => {
-        const callbackRecord = callbackData;
-        Object.entries(callbackRecord).forEach(([name, value]) => {
-          setValue(name, value);
-        });
-        onSubmit(callbackRecord);
-      };
-      if (onHeaderCellChange) {
-        if (onHeaderCellChange.length > 1) {
-          onHeaderCellChange({
-            field,
-            indexCol,
-            type: 'onChange',
-            value: newState,
-            option,
-            indexRow,
-            rowData: record,
-            rowId: key,
-            // rowsData: [...dataSource],
-            rowsData: [...convertData],
-            sumValue: []
-          }, handleChangeCallback);
-        } else {
-          onHeaderCellChange({
-            field,
-            indexCol,
-            type: 'onChange',
-            option,
-            value: newState,
-            indexRow,
-            rowData: record,
-            rowId: key,
-            rowsData: [...convertData],
-            sumValue: []
-          }, handleChangeCallback);
+      // const handleChangeCallback = (callbackData: RecordType[]) => {
+      //   const callbackRecord = callbackData
 
-          // onSubmit(record)
-        }
+      //   Object.entries(callbackRecord).forEach(
+      //     ([name, value]: any) => {
+      //       setValue(name, value)
+
+      //     }
+      //   )
+
+      //   onSubmit(callbackRecord)
+
+      // }
+
+      if (onHeaderCellChange) {
+        const newObj = {
+          ...headerData,
+          [field]: newState
+        };
+        onHeaderCellChange(newObj);
       }
     }
     if (prevState && newState && prevState !== newState && changeType === 'enter') {
@@ -464,8 +443,10 @@ const InternalTable = props => {
     handleSubmit,
     onSubmit,
     triggerPaste,
+    headerEditAble,
     handleCellChange,
-    handleHeaderCellChange
+    handleHeaderCellChange,
+    headerData
   })).use(features.paginationFeature({
     pagination
   }));

package/es/ali-table/base-table/styles.js

@@ -60,7 +60,7 @@ const outerBorderStyleMixin = css(["border-top:var(--cell-border-horizontal);bor
 export const StyleTableContainer = styled.div.withConfig({
   displayName: "StyleTableContainer",
   componentId: "es-grid-template__sc-ipj1ht-0"
-})(["--row-height:34px;--color:#333;--bgcolor:white;--body-hover-bgcolor:#f5f5f5;--body-hover-color:#333;--hover-bgcolor:var(--body-hover-bgcolor,#f5f5f5);--hover-color:var(--body-hover-color);--highlight-bgcolor:#eee;--header-row-height:34px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--border-color-select:#eb4619;--cell-border:1px solid var(--border-color);--cell-border-select:1px solid var(--border-color-select);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--hover-color:#dadde1;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.use-outer-border{", ";}&.", "{.", "{border-left:0;border-right:0;td,th{border-right:0;}td.first,th.first{border-left:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),0px 0 0 0 var(--border-color);}}}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{&.use-outer-border{border-bottom:var(--header-cell-border);}.", "{border-top:0;td,th{border-bottom:0;border-top:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border:0;td,th{border-right:0;border-bottom:0;}td.lock-left{box-shadow:none;}td,th{border:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:0;border:0;}}}.", "{padding:8px;}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.auto-height{.ui-rc-grid-bottom{border-top:0;}}.ui-rc-grid-bottom{border-top:var(--cell-border-horizontal);}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, outerBorderStyleMixin, Classes.gridHorizontal, Classes.tableWrapper, Classes.tableTop, Classes.gridVertical, Classes.tableWrapper, Classes.tableTop, Classes.gridNone, Classes.tableWrapper, Classes.tableTop, Classes.tableTop, Classes.tableThemeDark);
+})(["--row-height:34px;--color:#333;--bgcolor:white;--body-hover-bgcolor:#f5f5f5;--body-hover-color:#333;--hover-bgcolor:var(--body-hover-bgcolor,#f5f5f5);--hover-color:var(--body-hover-color);--highlight-bgcolor:#eee;--header-row-height:34px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--border-color-select:#eb4619;--cell-border:1px solid var(--border-color);--cell-border-select:1px solid var(--border-color-select);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--hover-color:#dadde1;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.use-outer-border{", ";}&.", "{.", "{border-left:0;border-right:0;td,th{border-right:0;}td.first,th.first{border-left:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),0px 0 0 0 var(--border-color);}}}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{&.use-outer-border{border-bottom:var(--header-cell-border);}.", "{border-top:0;td,th{border-bottom:0;border-top:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border:0;td,th{border-right:0;border-bottom:0;}td.lock-left{box-shadow:none;}td,th{border:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:0;border:0;}}}.", "{padding:8px;}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.auto-height{.ui-rc-grid-bottom{border-top:0;}}.ui-rc-grid-bottom{border-top:var(--cell-border-horizontal);}.ui-rc-toolbar-bottom{.be-toolbar-item{.ui-rc-btn{font-size:12px;line-height:1.5}.toolbar-dropdown-button{font-size:12px;.ui-rc-btn.ui-rc-btn-default.ui-rc-btn-variant-outlined.ui-rc-btn-compact-item.ui-rc-btn-compact-first-item{border-color:#28c76f;}.ui-rc-btn.ui-rc-btn-default.ui-rc-btn-variant-outlined.ui-rc-btn-compact-item.ui-rc-btn-compact-last-item{border-color:#28c76f;.ui-rc-btn-icon{color:#28c76f;}}}}}.ui-rc-toolbar-bottom{position:relative;padding:.15rem 0.5rem;background-color:#ffffff;.toolbar-button{border-radius:3px;}.ui-rc-btn{border-radius:3px;height:28px;&.ui-rc-btn-compact-item.ui-rc-btn-compact-last-item{border-start-start-radius:0;border-end-start-radius:0;}&.ui-rc-btn-compact-item.ui-rc-btn-compact-first-item{border-start-end-radius:0;border-end-end-radius:0;}}}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, outerBorderStyleMixin, Classes.gridHorizontal, Classes.tableWrapper, Classes.tableTop, Classes.gridVertical, Classes.tableWrapper, Classes.tableTop, Classes.gridNone, Classes.tableWrapper, Classes.tableTop, Classes.tableTop, Classes.tableThemeDark);
 export const StyledArtTableWrapper = styled.div.withConfig({
   displayName: "StyledArtTableWrapper",
   componentId: "es-grid-template__sc-ipj1ht-1"

package/es/ali-table/base-table/table.d.ts

@@ -6,8 +6,8 @@ import { TableDOMHelper } from './helpers/TableDOMUtils';
 import type { ResolvedUseVirtual, VerticalRenderRange, VirtualEnum } from './interfaces';
 import type { LoadingContentWrapperProps } from './loading';
 import type { BaseTableCSSVariables } from './styles';
-import type { CommandClick, ExpandedRowRender, IFormat, IFTheme, RenderExpandIcon, RowClassName } from '../../grid-component/type';
-export type PrimaryKey = string | ((row: any) => string);
+import type { AnyObject, CommandClick, ExpandedRowRender, IFormat, IFTheme, RenderExpandIcon, RowClassName } from '../../grid-component/type';
+export type PrimaryKey<RecordType = AnyObject> = keyof RecordType | ((row: RecordType) => keyof RecordType);
 export type ColumnResizeMode = 'onChange' | 'onEnd';
 export type ExpandableConfig<RecordType> = {
     expandedRowKeys?: readonly Key[];

package/es/ali-table/base-table/utils.d.ts

@@ -1,4 +1,5 @@
 import { Subscription } from 'rxjs';
+import { ColumnTable } from '../../grid-component';
 /** styled-components 类库的版本，ali-react-table 同时支持 v3 和 v5 */
 export declare const STYLED_VERSION: string;
 export declare const STYLED_REF_PROP: string;
@@ -19,3 +20,4 @@ export declare function syncScrollLeft(elements: HTMLElement[], callback: (scrol
  */
 export declare function shallowEqual<T>(objA: T, objB: T): boolean;
 export declare function getParentElement(element: any, selector: any): any;
+export declare function getColumnsAtLevel(columns: ColumnTable[], level: number): ColumnTable[];

package/es/ali-table/base-table/utils.js

@@ -1,7 +1,6 @@
 import { asyncScheduler, BehaviorSubject, defer, fromEvent, Subscription } from 'rxjs';
 import { map, throttleTime } from 'rxjs/operators';
 import * as styledComponents from 'styled-components';
-
 /** styled-components 类库的版本，ali-react-table 同时支持 v3 和 v5 */
 export const STYLED_VERSION = styledComponents.createGlobalStyle != null ? 'v5' : 'v3';
 export const STYLED_REF_PROP = STYLED_VERSION === 'v3' ? 'innerRef' : 'ref';
@@ -151,4 +150,16 @@ export function getParentElement(element, selector) {
     }
   }
   return getParent(element, selector);
+}
+export function getColumnsAtLevel(columns, level) {
+  if (level === 0) {
+    return columns;
+  }
+  const result = [];
+  for (const column of columns) {
+    if (column.children?.length) {
+      result.push(...getColumnsAtLevel(column.children, level - 1));
+    }
+  }
+  return result;
 }

package/es/ali-table/interfaces.d.ts

@@ -1,7 +1,11 @@
 import type { ReactElement, ReactNode } from 'react';
 import type React from 'react';
 import type { ColumnTemplate, CommandItem, EditType, FilterOperator, IColumnType, IFormat, ITextAlign, TypeFilter } from '../grid-component/type';
+import type { PrimaryKey } from './base-table/table';
 export type CellProps = React.TdHTMLAttributes<HTMLTableCellElement>;
+export type BaseRecord = {
+    rowId: PrimaryKey;
+};
 export type FilterState = {
     field: any;
     key: any;

package/es/ali-table/internals.d.ts

@@ -1,9 +1,10 @@
 /// <reference types="react" />
+import type { PrimaryKey } from './base-table/table';
 import type { ArtColumn } from './interfaces';
 declare function safeRenderHeader(column: ArtColumn): import("react").ReactNode;
 declare function safeRenderHeaderContent(column: ArtColumn, t?: any): any;
 declare function safeGetValue(column: ArtColumn, record: any, rowIndex: number): any;
-declare function safeGetRowKey(primaryKey: string | ((record: any) => string), record: any, rowIndex: number): string;
+declare function safeGetRowKey(primaryKey: PrimaryKey, record: any, rowIndex: number): string;
 declare function safeGetCellProps(column: ArtColumn, record: any, rowIndex: number): import("./interfaces").CellProps;
 declare function safeRender(column: ArtColumn, record: any, rowIndex: number): any;
 export declare const internals: {

package/es/ali-table/pipeline/features/columnCustom.d.ts

@@ -71,6 +71,8 @@ export interface ColumnFeatureOptions {
     handleCellChange: any;
     handleHeaderCellChange?: any;
     dataErrors?: any[];
+    headerData?: any;
+    headerEditAble?: boolean;
 }
 export declare function columnCustom(opts: ColumnFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
 export {};