es-grid-template 1.7.37 → 1.7.38

package/es/table-component/ContextMenu.d.ts

@@ -1,6 +1,5 @@
-import * as React from "react";
-import type { ContextInfo } from "./type";
-import type { ContextMenuItem } from "./type";
+import * as React from 'react';
+import type { ContextInfo, ContextMenuItem } from './type';
 export declare const findItemByKey: (array: any[], key: string, value: any) => any;
 type Props<RecordType> = {
     rowData: RecordType | null;

package/es/table-component/ContextMenu.js

@@ -1,6 +1,6 @@
-import * as React from "react";
+import * as React from 'react';
 // import type { MenuProps } from "antd";
-import { Dropdown, Menu } from "antd";
+import { Dropdown, Menu } from 'antd';
 export const findItemByKey = (array, key, value) => {
   for (let i = 0; i < array.length; i++) {
     const item = array[i];

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

@@ -1,9 +1,9 @@
-import React from 'react';
-import 'react-resizable/css/styles.css';
-import 'dayjs/locale/es';
-import 'dayjs/locale/vi';
-import './style.scss';
-import type { TableProps } from './type';
+import React from "react";
+import "react-resizable/css/styles.css";
+import "dayjs/locale/es";
+import "dayjs/locale/vi";
+import "./style.scss";
+import type { TableProps } from "./type";
 export declare const SELECTION_COLUMN: {};
 declare const InternalTable: <RecordType extends object>(props: TableProps<RecordType>) => React.JSX.Element;
 export default InternalTable;

package/es/table-component/InternalTable.js

@@ -1,10 +1,10 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import customParseFormat from 'dayjs/plugin/customParseFormat';
-import React, { Fragment, useState } from 'react';
-import 'react-resizable/css/styles.css';
-import dayjs from 'dayjs';
-import 'dayjs/locale/es';
-import 'dayjs/locale/vi';
+import customParseFormat from "dayjs/plugin/customParseFormat";
+import React, { Fragment, useState } from "react";
+import "react-resizable/css/styles.css";
+import dayjs from "dayjs";
+import "dayjs/locale/es";
+import "dayjs/locale/vi";
 
 // import en from "rc-master-ui/es/date-picker/locale/en_US"
 // import vi from "rc-master-ui/es/date-picker/locale/vi_VN"
@@ -20,11 +20,10 @@ import "./style.scss";
 // import withReactContent from "sweetalert2-react-content"
 // import { Tooltip } from "react-tooltip"
 
-import { faker } from '@faker-js/faker';
+import { faker } from "@faker-js/faker";
 import useMergedState from "rc-util/es/hooks/useMergedState";
 // import InfiniteTable from './table/InfiniteTable'
 // import GridEdit from './table/GridEdit'
-import Grid from "./table/Grid";
 // import { Group } from 'becoxy-icons'
 
 // import { Tooltip } from 'react-tooltip'
@@ -37,7 +36,9 @@ getAllRowKey, getDiffent2Array, getFixedFields, getInvisibleColumns, groupArrayB
 // import GridEdit from './table/GridEdit'
 import { convertToTanStackColumns } from "./hook/useColumns";
 import { convertColumns } from "./hook/convert";
-import { Modal } from 'antd';
+import { Modal } from "antd";
+import Grid from "./table/Grid";
+
 // import { columns111 } from '../test-2/columns'
 
 dayjs.extend(customParseFormat);
@@ -53,7 +54,7 @@ const InternalTable = props => {
     t,
     columns: propsColumns,
     // columns,
-    lang,
+    // lang,
     locale,
     dataSource,
     editAble,
@@ -68,16 +69,16 @@ const InternalTable = props => {
     // expandable,
     // contextMenuItems: propContextMenuItems,
     // contextMenuHidden,
-    contextMenuClick,
-    contextMenuOpen,
+    // contextMenuClick,
+    // contextMenuOpen,
     height,
     ...rest
   } = props;
   const id = React.useMemo(() => {
     return faker.string.alpha(20);
   }, []);
-  const rowKey = 'rowId';
-  const prefix = 'ui-rc';
+  const rowKey = "rowId";
+  const prefix = "ui-rc";
   const getWindowSize = () => {
     const {
       innerWidth,
@@ -93,9 +94,9 @@ const InternalTable = props => {
     const handleWindowResize = () => {
       setWindowSize(getWindowSize());
     };
-    window.addEventListener('resize', handleWindowResize);
+    window.addEventListener("resize", handleWindowResize);
     return () => {
-      window.removeEventListener('resize', handleWindowResize);
+      window.removeEventListener("resize", handleWindowResize);
     };
   }, []);
 
@@ -156,8 +157,8 @@ const InternalTable = props => {
   }, [dataSource]);
   const columnPinning = React.useMemo(() => {
     return {
-      left: getFixedFields(columns, 'left'),
-      right: getFixedFields(columns, 'right')
+      left: getFixedFields(columns, "left"),
+      right: getFixedFields(columns, "right")
     };
   }, [columns]);
 
@@ -185,7 +186,7 @@ const InternalTable = props => {
     value: undefined
   });
   const triggerChangeColumns = (cols, keys, type) => {
-    if (type === 'cellClick') {
+    if (type === "cellClick") {
       setColumns(cols);
     } else {
       const aa = flatColumns2(columns).map(it => it.field);
@@ -294,7 +295,9 @@ const InternalTable = props => {
     // onContextMenu={onContextMenu}
     // contextMenuItems={contextMenuItems}
     ,
-    editAble: editAble,
+    editAble: isFullScreen ? false : editAble
+    // editAble={editAble}
+    ,
     triggerChangeColumns: triggerChangeColumns,
     setExpanded: setExpanded,
     isFullScreen: isFullScreen,
@@ -309,27 +312,27 @@ const InternalTable = props => {
     footer: null,
     centered: true,
     closable: true,
-    width: '100%',
+    width: "100%",
     style: {
-      maxWidth: '100%',
-      height: '100%'
-    },
-    onClose: () => setIsFullScreen(false),
+      maxWidth: "100%",
+      height: "100%"
+    }
+    // onClose={() => setIsFullScreen(false)}
+    ,
     onCancel: () => setIsFullScreen(false)
-
     // destroyOnClose
     ,
     styles: {
       content: {
-        height: '100vh',
+        height: "100vh",
         borderRadius: 0,
-        padding: '15px 10px'
+        padding: "15px 10px"
       },
       wrapper: {
         zIndex: 1050
       }
     },
-    destroyOnClose: true
+    destroyOnHidden: true
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       paddingTop: 40

package/es/table-component/TableContainer.d.ts

@@ -1,8 +1,8 @@
-import type { Dispatch, SetStateAction } from 'react';
-import React from 'react';
-import type { ColumnDef, Table } from '@tanstack/react-table';
-import type { ColumnsTable, TableProps } from './type';
-type TableContainerProps<T> = Omit<TableProps<T>, 'columns'> & {
+import type { Dispatch, SetStateAction } from "react";
+import React from "react";
+import type { ColumnDef, Table } from "@tanstack/react-table";
+import type { ColumnsTable, TableProps } from "./type";
+type TableContainerProps<T> = Omit<TableProps<T>, "columns"> & {
     table: Table<T>;
     prefix: string;
     id: string;

package/es/table-component/TableContainer.js

@@ -1,26 +1,25 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 // import type { Dispatch, SetStateAction } from "react";
 
-import React from 'react';
+import React from "react";
 // import TableHead from './header/TableHead'
 // import { sumSize } from './hook/utils'
 
 // import { useVirtualizer } from '@tanstack/react-virtual'
 
-import classNames from 'classnames';
+import classNames from "classnames";
 // import TableBody from './body/TableBody'
 import { TableContext } from "./useContext";
-import Pagination from 'rc-master-ui/es/pagination';
-import { Toolbar } from 'rc-master-ui';
-import { Maximize, Minimize } from 'becoxy-icons';
+import Pagination from "rc-master-ui/es/pagination";
+import { Toolbar } from "rc-master-ui";
+import { Maximize, Minimize } from "becoxy-icons";
 import { ColumnsChoose } from "./ColumnsChoose";
 // import TableFooter from './footer/TableFooter'
 // import TableBody from './body/TableBody'
-import { numericFormatter } from 'react-numeric-component';
-// import ComponentSpinner from '../grid-component/LoadingSpinner'
+import { numericFormatter } from "react-numeric-component";
 import TableWrapper from "./table/TableWrapper";
 import { sumSize } from "./hook/utils";
-import { useVirtualizer } from '@tanstack/react-virtual';
+import { useVirtualizer } from "@tanstack/react-virtual";
 const TableContainer = props => {
   const {
     t,
@@ -101,7 +100,7 @@ const TableContainer = props => {
     //   return element?.getBoundingClientRect().width;
     // },
 
-    measureElement: typeof window !== 'undefined' && navigator.userAgent.indexOf('Firefox') === -1 ? element => element?.getBoundingClientRect().height : undefined,
+    measureElement: typeof window !== "undefined" && navigator.userAgent.indexOf("Firefox") === -1 ? element => element?.getBoundingClientRect().height : undefined,
     overscan: 1 //how many columns to render on each side off screen each way (adjust this for performance)
   });
   const virtualColumns = columnVirtualizer.getVirtualItems();
@@ -138,49 +137,49 @@ const TableContainer = props => {
     className: classNames(`${prefix}-grid-top-toolbar`, {})
   }, /*#__PURE__*/React.createElement("div", {
     style: {
-      display: 'flex',
-      justifyContent: 'space-between',
-      alignItems: 'center',
-      gap: '.75rem'
+      display: "flex",
+      justifyContent: "space-between",
+      alignItems: "center",
+      gap: ".75rem"
     }
   }, toolbarItems && toolbarItems?.length > 0 && /*#__PURE__*/React.createElement("div", {
     style: {
       flex: 1,
-      overflow: 'hidden'
+      overflow: "hidden"
     }
   }, /*#__PURE__*/React.createElement(Toolbar, {
-    items: (toolbarItems ?? []).filter(it => it.position !== 'Bottom'),
-    mode: 'scroll'
+    items: (toolbarItems ?? []).filter(it => it.position !== "Bottom"),
+    mode: "scroll"
   })), fullScreen !== false && (isFullScreen ? /*#__PURE__*/React.createElement(Minimize, {
     fontSize: 16,
     onClick: () => {
       setIsFullScreen(!isFullScreen);
     },
     "data-tooltip-id": `${id}-tooltip-content`,
-    "data-tooltip-content": t ? t('Minimized') : 'Minimized'
+    "data-tooltip-content": t ? t("Minimized") : "Minimized"
   }) : /*#__PURE__*/React.createElement(Maximize, {
     fontSize: 16,
     onClick: () => {
       setIsFullScreen(!isFullScreen);
     },
     "data-tooltip-id": `${id}-tooltip-content`,
-    "data-tooltip-content": t ? t('Full screen') : 'Full screen'
+    "data-tooltip-content": t ? t("Full screen") : "Full screen"
   })), /*#__PURE__*/React.createElement("div", {
     style: {
-      display: 'flex',
-      justifyContent: 'space-between',
-      alignItems: 'center',
-      gap: '.75rem'
+      display: "flex",
+      justifyContent: "space-between",
+      alignItems: "center",
+      gap: ".75rem"
     }
-  }, pagination && pagination.onChange && pagination?.position && pagination?.position[0] === 'topRight' && /*#__PURE__*/React.createElement(Pagination, _extends({
+  }, pagination && pagination.onChange && pagination?.position && pagination?.position[0] === "topRight" && /*#__PURE__*/React.createElement(Pagination, _extends({
     showSizeChanger: true,
     responsive: true,
-    size: 'small',
-    rootClassName: 'top-pagination',
+    size: "small",
+    rootClassName: "top-pagination",
     showTotal: (totalItems, range) =>
     // @ts-ignore
-    `${range[0]}-${range[1]} / ${totalItems} ${t ? t(pagination?.locale?.items ?? 'items') : 'items'}`
-  }, pagination)), typeof actionTemplate === 'function' ? actionTemplate() : actionTemplate, showColumnChoose && /*#__PURE__*/React.createElement(ColumnsChoose, {
+    `${range[0]}-${range[1]} / ${totalItems} ${t ? t(pagination?.locale?.items ?? "items") : "items"}`
+  }, pagination)), typeof actionTemplate === "function" ? actionTemplate() : actionTemplate, showColumnChoose && /*#__PURE__*/React.createElement(ColumnsChoose, {
     columnHidden: columnHidden,
     columns: columns,
     originColumns: propsColumns,
@@ -240,18 +239,18 @@ const TableContainer = props => {
   }, pagination && !infiniteScroll && /*#__PURE__*/React.createElement(Pagination
   // style={{padding: '0.75rem 1rem'}}
   , _extends({}, pagination, {
-    rootClassName: 'pagination-template',
+    rootClassName: "pagination-template",
     showSizeChanger: true,
     responsive: true,
-    size: 'small',
+    size: "small",
     total: pagination.total,
     pageSize: pagination.onChange ? pagination.pageSize : table.getState().pagination.pageSize,
     showTotal: (totalItems, range) => `${numericFormatter((range[0] ?? 0).toString(), {
-      thousandSeparator: '.'
+      thousandSeparator: "."
     })}-${numericFormatter((range[1] ?? 0).toString(), {
-      thousandSeparator: '.'
+      thousandSeparator: "."
     })} / ${numericFormatter((totalItems ?? 0).toString(), {
-      thousandSeparator: '.'
+      thousandSeparator: "."
     })} items`,
     pageSizeOptions: [20, 50, 100, 1000, 10000],
     onChange: (page, pageSize1) => {

package/es/table-component/TableContainerEdit.d.ts

@@ -2,7 +2,7 @@ import type { Dispatch, SetStateAction } from "react";
 import React from "react";
 import type { ColumnDef, Table } from "@tanstack/react-table";
 import type { ColumnsTable, TableProps } from "./type";
-type TableContainerProps<T> = Omit<TableProps<T>, 'columns'> & {
+type TableContainerProps<T> = Omit<TableProps<T>, "columns"> & {
     table: Table<T>;
     prefix: string;
     id: string;