es-grid-template 1.2.6 → 1.2.8

package/lib/grid-component/ColumnsChoose.js

@@ -545,7 +545,8 @@ const ColumnsChoose = props => {
     trigger: "click",
     open: clicked,
     onOpenChange: handleClickChange,
-    arrow: false
+    arrow: false,
+    zIndex: 1065
   }, /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
     arrow: false,
     title: 'Cài đặt'

package/lib/grid-component/ContextMenu.js

@@ -104,7 +104,8 @@ const ContextMenu = props => {
           items: contextMenuItems,
           style: {
             minWidth: 200,
-            maxHeight: pos.viewportHeight - 20
+            maxHeight: pos.viewportHeight - 20,
+            width: 'fit-content'
           },
           rootClassName: 'popup-context-menu',
           onClick: e => {

package/lib/grid-component/EditableCell.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { ColumnEditType, IFormat } from "./type";
+import type { ColumnTable, IFormat } from "./type";
 import type { EditType } from "rc-master-ui";
 interface EditableCellProps<DataType> extends React.HTMLAttributes<HTMLElement> {
     t?: any;
@@ -10,7 +10,7 @@ interface EditableCellProps<DataType> extends React.HTMLAttributes<HTMLElement>
     record: DataType;
     index: number;
     format?: IFormat;
-    column: ColumnEditType<DataType>;
+    column: ColumnTable<DataType>;
     indexRow: number;
     indexCol: number;
     rowKey: any;

package/lib/grid-component/EditableCell.js

@@ -268,15 +268,15 @@ const EditableCell = props => {
         const columnsTable = rr.map(colSelect => {
           return {
             title: colSelect.headerTemplate ? colSelect.headerTemplate : t ? t(colSelect.headerText) : colSelect.headerText,
-            dataIndex: colSelect.dataIndex,
+            dataIndex: colSelect.field ?? colSelect.dataIndex,
             key: colSelect.dataIndex,
             render: colSelect.template ? (text, recd, ind) => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, colSelect.template?.({
               value: text,
               rowData: recd,
               column: colSelect,
-              field: colSelect.dataIndex,
+              field: colSelect.field,
               index: ind,
-              [colSelect.dataIndex]: text
+              [colSelect.field]: text
             })) : undefined,
             width: colSelect.width,
             ellipsis: true,
@@ -324,8 +324,9 @@ const EditableCell = props => {
             width: '100%',
             height: '100%'
           },
-          defaultOpen: column.field === cellEditing?.column.field,
-          autoFocus: true,
+          defaultOpen: column.field === cellEditing?.column.field
+          // autoFocus={true}
+          ,
           placeholder: t ? t('Select') : 'Select',
           allowClear: column.isClearable ?? false,
           maxTagCount: 'responsive',
@@ -398,8 +399,10 @@ const EditableCell = props => {
           showSearch: true,
           mode: isMulti || selectMode === 'checkbox' ? 'multiple' : undefined,
           valueSelectAble: true,
-          defaultOpen: column.field === cellEditing?.column.field,
-          autoFocus: true,
+          defaultOpen: column.field === cellEditing?.column.field
+          // autoFocus={true}
+          ,
+
           style: {
             width: '100%',
             height: '100%'
@@ -449,8 +452,9 @@ const EditableCell = props => {
             });
           },
           showSearch: true,
-          defaultOpen: column.field === cellEditing?.column.field,
-          autoFocus: true,
+          defaultOpen: column.field === cellEditing?.column.field
+          // autoFocus={true}
+          ,
           mode: isMulti || selectMode === 'checkbox' ? 'multiple' : undefined,
           valueSelectAble: true,
           style: {
@@ -529,8 +533,9 @@ const EditableCell = props => {
           treeData: newTreeData,
           placeholder: t ? t('Select') : 'Select',
           treeDefaultExpandAll: true,
-          defaultOpen: column.field === cellEditing?.column.field,
-          autoFocus: true,
+          defaultOpen: column.field === cellEditing?.column.field
+          // autoFocus={true}
+          ,
           virtual: true,
           allowClear: true
           // maxTagTextLength={column?.editSelectSettings?.showItems}

package/lib/grid-component/InternalTable.js

@@ -22,7 +22,10 @@ var _useColumns = _interopRequireDefault(require("./hooks/useColumns"));
 require("./styles.scss");
 var _columns = require("./hooks/columns");
 var _Group = _interopRequireDefault(require("./table/Group"));
+var _sweetalert = _interopRequireDefault(require("sweetalert2"));
+var _sweetalert2ReactContent = _interopRequireDefault(require("sweetalert2-react-content"));
 _dayjs.default.extend(_customParseFormat.default);
+const MySwal = (0, _sweetalert2ReactContent.default)(_sweetalert.default);
 
 // const ASCEND = 'ascend';
 // const DESCEND = 'descend';
@@ -80,6 +83,8 @@ const InternalTable = props => {
     groupAble,
     groupSetting,
     groupColumns,
+    commandClick,
+    commandSettings,
     ...rest
   } = props;
   const rowKey = _react.default.useMemo(() => {
@@ -205,6 +210,126 @@ const InternalTable = props => {
     // setMergedData(newData)
     onDataChange?.(newData);
   };
+  const triggerCommandClick = args => {
+    const {
+      id,
+      rowId,
+      rowData,
+      index
+    } = args;
+    const tmpData = [...dataSource];
+    if (id === 'DELETE') {
+      // bật modal confirm
+      if (commandSettings && commandSettings.confirmDialog) {
+        MySwal.fire({
+          title: t ? t('Confirm') : 'Confirm',
+          text: t ? t('Do you want to delete item?') : 'Do you want to delete item?',
+          // icon: 'warning',
+          allowOutsideClick: false,
+          showCancelButton: true,
+          confirmButtonText: t ? t('Delete') : 'Delete',
+          cancelButtonText: t ? t('Cancel') : 'Cancel',
+          customClass: {
+            confirmButton: 'be-button btn-primary',
+            cancelButton: 'be-button btn-danger ms-1'
+          },
+          buttonsStyling: false
+        }).then(async result => {
+          if (result.value) {
+            if (!commandSettings || commandSettings && commandSettings.client !== false) {
+              // client
+
+              // kiểm tra dòng hiện tại có parent
+
+              let newData = [];
+              if (rowData?.parentId) {
+                const parent = (0, _hooks.findItemByKey)(dataSource, rowKey, rowData.parentId);
+                const childData = parent?.children ? [...parent.children] : [];
+                const findIndex = childData.findIndex(obj => obj[rowKey] === rowData[rowKey]);
+                childData.splice(Number(findIndex), 1);
+                const newRowData = {
+                  ...parent,
+                  children: childData
+                };
+                // const newDataSource =  updateArrayByKey(tmpData, newRowData, rowKey as string)
+                newData = (0, _hooks.updateArrayByKey)(tmpData, newRowData, rowKey);
+              } else {
+                tmpData.splice(Number(index), 1);
+                newData = [...tmpData];
+              }
+              if (commandClick) {
+                commandClick({
+                  id,
+                  rowId: rowData.rowId,
+                  rowData,
+                  index,
+                  // rows: [...tmpData]
+                  rows: [...newData]
+                });
+              }
+            } else {
+              // server ~~ không làm gì
+              if (commandClick) {
+                commandClick({
+                  id,
+                  rowId: rowData.rowId,
+                  rowData,
+                  index,
+                  rows: [...dataSource]
+                });
+              }
+            }
+          } else if (result.dismiss === MySwal.DismissReason.cancel) {}
+        });
+      } else {
+        // -------------------
+
+        if (!commandSettings || commandSettings && commandSettings.client !== false) {
+          // client
+
+          let newData2 = [];
+          if (rowData?.parentId) {
+            const parent = (0, _hooks.findItemByKey)(dataSource, rowKey, rowData.parentId);
+            const childData = parent?.children ? [...parent.children] : [];
+            const findIndex = childData.findIndex(obj => obj[rowKey] === rowData[rowKey]);
+            childData.splice(Number(findIndex), 1);
+            const newRowData = {
+              ...parent,
+              children: childData
+            };
+            newData2 = (0, _hooks.updateArrayByKey)(tmpData, newRowData, rowKey);
+          } else {
+            tmpData.splice(Number(index), 1);
+            newData2 = [...tmpData];
+          }
+          if (commandClick) {
+            commandClick({
+              id,
+              rowId,
+              rowData,
+              index,
+              rows: [...newData2]
+            });
+          }
+        } else {
+          // server
+          if (commandClick) {
+            commandClick({
+              id,
+              rowId,
+              rowData,
+              index,
+              rows: [...dataSource]
+            });
+          }
+        }
+      }
+    } else {
+      if (commandClick) {
+        commandClick(args);
+      }
+    }
+  };
   const triggerPaste = (pastedRows, pastedColumnsArray, newData) => {
     const handlePasteCallback = callbackData => {
       const newDataUpdate = (0, _hooks.updateData)(dataSource, callbackData, rowKey);
@@ -260,7 +385,8 @@ const InternalTable = props => {
     clickHeaderToSort: clickHeaderToSort,
     groupSetting: groupSetting,
     groupAble: groupAble,
-    groupColumns: groupColumns
+    groupColumns: groupColumns,
+    commandClick: triggerCommandClick
   }));
 };
 var _default = exports.default = InternalTable;

package/lib/grid-component/TableGrid.js

@@ -20,6 +20,7 @@ var _pagination = _interopRequireDefault(require("rc-master-ui/es/pagination"));
 var _LoadingSpinner = _interopRequireDefault(require("./LoadingSpinner"));
 var _ColumnsChoose = require("./ColumnsChoose");
 var _useMergedState = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
+var _AdvanceFilter = _interopRequireDefault(require("./AdvanceFilter"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 // import {ConfigProvider} from "antd";
@@ -112,6 +113,7 @@ const TableGrid = props => {
     recordDoubleClick,
     toolbarItems,
     showColumnChoose,
+    showAdvanceFilter,
     onFilter,
     selectionSettings,
     rowSelection,
@@ -403,7 +405,8 @@ const TableGrid = props => {
         style: {
           display: 'flex',
           justifyContent: 'space-between',
-          alignItems: 'center'
+          alignItems: 'center',
+          gap: '.75rem'
         }
       }, groupAble && groupToolbar?.(), toolbarItems && toolbarItems?.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
         style: {
@@ -420,7 +423,8 @@ const TableGrid = props => {
         style: {
           display: 'flex',
           justifyContent: 'space-between',
-          alignItems: 'center'
+          alignItems: 'center',
+          gap: '.75rem'
         }
       }, pagination && pagination.onChange && pagination?.position && pagination?.position[0] === 'topRight' && /*#__PURE__*/_react.default.createElement(_pagination.default, (0, _extends2.default)({
         showSizeChanger: true,
@@ -435,6 +439,11 @@ const TableGrid = props => {
         t: t,
         columnsGroup: groupColumns,
         triggerChangeColumns: triggerChangeColumns
+      }), showAdvanceFilter && /*#__PURE__*/_react.default.createElement(_AdvanceFilter.default, {
+        columns: columns,
+        t: t
+        // columnsGroup={groupColumns}
+        // triggerChangeColumns={triggerChangeColumns}
       }))));
     },
     expandable: {

package/lib/grid-component/checkbox-control/index.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+type OptionType = {
+    value: any;
+    label: string;
+    [key: string]: any;
+};
+type Props<T> = {
+    options: T[];
+    value: any[];
+    onChange?: (value: any[]) => void;
+};
+declare const CheckboxControl: <T extends OptionType>(props: Props<T>) => React.JSX.Element;
+export default CheckboxControl;

package/lib/grid-component/checkbox-control/index.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _rcMasterUi = require("rc-master-ui");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const CheckboxControl = props => {
+  const {
+    options,
+    value,
+    onChange
+  } = props;
+  const selected = (0, _react.useMemo)(() => {
+    return value ? value : [];
+  }, [value]);
+  const list = (0, _react.useMemo)(() => {
+    return options ? options : [];
+  }, [options]);
+  const onChangeValue = val => {
+    const findIndex = selected.findIndex(it => it === val);
+    if (findIndex > -1) {
+      const newVal = selected.filter(it => it !== val);
+      onChange?.(newVal);
+    } else {
+      const newVal = [...selected, val];
+      onChange?.(newVal);
+    }
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "d-flex flex-column gap-50",
+    style: {}
+  }, list.map((it, index) => {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: index,
+      className: "d-flex align-items-center"
+    }, /*#__PURE__*/_react.default.createElement(_rcMasterUi.Checkbox, {
+      checked: selected.includes(it.value),
+      type: "checkbox",
+      className: "cursor-pointer me-50",
+      onChange: () => onChangeValue(it.value)
+    }), /*#__PURE__*/_react.default.createElement("span", null, it.label));
+  }));
+};
+var _default = exports.default = CheckboxControl;

package/lib/grid-component/hooks/columns/index.d.ts

@@ -1,9 +1,9 @@
-import type { ColumnType, IFormat } from "../../type";
+import type { ColumnTable, ColumnType, IFormat } from "../../type";
 import React from "react";
 import type { TableLocale } from "rc-master-ui/lib/table/interface";
 import type { ColumnsTable } from "../../type";
 export declare function flatColumns<RecordType>(columns: ColumnsTable<RecordType>, parentKey?: string): ColumnsTable<RecordType>;
 export declare function flatColumns2<RecordType>(columns: ColumnsTable<RecordType>): ColumnsTable<RecordType>;
 export declare const getValueCell: <T>(column: ColumnType<T>, value: any, format?: IFormat) => any;
-export declare const renderContent: (column: any, value: any, record: any, index: number, format?: IFormat) => React.JSX.Element;
+export declare const renderContent: (column: ColumnTable, value: any, record: any, index: number, format?: IFormat) => React.JSX.Element;
 export declare const renderFilter: <RecordType>(column: ColumnType<RecordType>, selectedKeys: string[], setSelectedKeys: any, confirm: any, visible: boolean, searchValue: string, setSearchValue: any, dataSourceFilter: any[], buddhistLocale: any, locale?: TableLocale, t?: any) => React.JSX.Element;

package/lib/grid-component/hooks/columns/index.js

@@ -130,7 +130,12 @@ exports.getValueCell = getValueCell;
 const renderContent = (column, value, record, index, format) => {
   const cellValue = value instanceof Date ? (0, _utils.getDateString)(column, value) : value;
   const content = getValueCell(column, cellValue, format);
-  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, column?.template ? typeof column.template === "function" ? column.template(value, record, index) : column.template : content);
+  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, column?.template ? typeof column.template === "function" ? column.template({
+    value,
+    index,
+    rowData: record,
+    field: column.field
+  }) : column.template : content);
 };
 exports.renderContent = renderContent;
 const renderFilter = (column, selectedKeys, setSelectedKeys, confirm, visible, searchValue, setSearchValue, dataSourceFilter, buddhistLocale, locale, t) => {
@@ -377,8 +382,9 @@ const renderFilter = (column, selectedKeys, setSelectedKeys, confirm, visible, s
         className: 'mb-1'
       }, /*#__PURE__*/_react.default.createElement(_rcMasterUi.Select
       // options={translateOption(numberOperator, t)}
+      // options={find ? options : column.source ?? []}
       , {
-        options: find ? options : column.source ?? [],
+        options: column.source ? column.source : options ?? [],
         style: {
           width: '100%',
           marginBottom: 8

package/lib/grid-component/hooks/useColumns.js

@@ -175,7 +175,10 @@ const useColumns = config => {
           // title: () => (<span>{t ? t(col.columnGroupText ?? col.headerText ?? col.title) : col.columnGroupText ?? col.headerText ?? col.title}</span>),
           ellipsis: col.ellipsis !== false,
           align: col.textAlign ?? col.align,
-          fixed: col.frozen ? col.frozen.toLowerCase() : col.fixed
+          fixed: col.fixedType ?? col.fixed,
+          isSummary: col.isSummary ?? col.haveSum,
+          hidden: col.hidden ?? col.visible === false
+          // hidden: true
         };
         if (transformedColumn.children && transformedColumn.children?.length) {
           return {
@@ -280,7 +283,7 @@ const useColumns = config => {
             }
             return (0, _columns.renderContent)(col, value, record, rowIndex, format);
           },
-          hidden: groupSetting && groupSetting.hiddenColumnGroup === false ? col.hidden : groupAble && groupColumns && groupColumns.includes(col.field) ? true : col.hidden
+          hidden: groupSetting && groupSetting.hiddenColumnGroup === false ? transformedColumn.hidden : groupAble && groupColumns && groupColumns.includes(col.field) ? true : transformedColumn.hidden
         };
       });
     };

package/lib/grid-component/hooks/utils.d.ts

@@ -1,7 +1,7 @@
 import type * as React from "react";
 import dayjs from "dayjs";
 import type { EditType, IColumnType, TypeFilter } from "rc-master-ui";
-import type { ColumnEditType, ColumnsType, ColumnTable, GetRowKey } from "../type";
+import type { ColumnsType, ColumnTable, GetRowKey } from "../type";
 import type { SelectionSettings } from "../type";
 import type { AnyObject } from "../type";
 import type { Key } from "react";
@@ -26,8 +26,8 @@ export declare const customWeekStartEndFormat: (value: any, weekFormat: string)
 export declare const getTypeFilter: (col: ColumnTable<any>) => TypeFilter;
 export declare const updateArrayByKey: (arr: any[], element: any, key: string) => any[];
 export declare const getDateString: <T>(column: ColumnTable<T>, value: any) => string;
-export declare const getEditType: <T>(column: ColumnEditType<T>, rowData?: any) => EditType;
-export declare const isDisable: <T>(column: ColumnEditType<T>, rowData?: any) => boolean;
+export declare const getEditType: <T>(column: ColumnTable<T>, rowData?: any) => EditType;
+export declare const isDisable: <T>(column: ColumnTable<T>, rowData?: any) => boolean;
 export declare const checkFieldKey: (key: string | undefined) => string;
 export declare const convertLabelToTitle: (data: any[]) => any[];
 export declare const convertArrayWithIndent: (inputArray: any[], parentIndent?: number) => any[];
@@ -64,8 +64,9 @@ export declare function addRows8(arr: any, n: number): {
 };
 export declare const transformColumns: <RecordType>(cols: ColumnsTable<RecordType>, convertColumns: any[], t?: any) => ColumnsTable<RecordType>;
 export declare const transformColumns1: <RecordType>(cols: ColumnsTable<RecordType>, sortMultiple?: boolean) => ColumnsTable<RecordType>;
-export declare const removeColumns: <RecordType>(columns: ColumnsTable<RecordType>, groupColumns: string[]) => ColumnsTable<RecordType>;
+export declare const removeColumns: <RecordType>(columns: ColumnTable<RecordType>[], groupColumns: string[]) => ColumnsTable<RecordType>;
 export declare const convertFlatColumn: (array: ColumnsTable) => ColumnsTable[];
 export declare const convertColumns: <RecordType>(cols: ColumnsTable<RecordType>) => ColumnsTable<RecordType>;
 export declare const checkChild: (inputArray: any[]) => boolean;
-export declare const isEditable: <RecordType>(column: ColumnEditType, rowData: RecordType) => boolean | ((rowData: any) => boolean);
+export declare const isEditable: <RecordType>(column: ColumnTable, rowData: RecordType) => boolean | ((rowData: any) => boolean);
+export declare const isArraysEqual: (arr1: any[], arr2: any[]) => boolean;

package/lib/grid-component/hooks/utils.js

@@ -10,7 +10,7 @@ exports.customWeekStartEndFormat = exports.countItemsBeforeIndex = exports.conve
 exports.findAllChildrenKeys = findAllChildrenKeys;
 exports.getFirstSelectCell = exports.getEditType = exports.getDefaultValue = exports.getDatepickerFormat = exports.getDateString = exports.getColumnsVisible = exports.getAllVisibleKeys = exports.genPresets = exports.flattenData = exports.flattenArray = exports.findItemByKey = void 0;
 exports.getHiddenParentKeys = getHiddenParentKeys;
-exports.updateData = exports.updateColumnsByGroup = exports.updateColumns = exports.updateArrayByKey = exports.transformColumns1 = exports.transformColumns = exports.totalFixedWidth = exports.sumDataByField = exports.removeColumns = exports.parseBooleanToValue = exports.newGuid = exports.isObjEmpty = exports.isNullOrUndefined = exports.isNameColor = exports.isEmpty = exports.isEditable = exports.isDisable = exports.isColor = exports.getVisibleColumnKeys = exports.getTypeFilter = exports.getTemplate = exports.getRowsPasteIndex = exports.getRowNumber = exports.getLastSelectCell = void 0;
+exports.updateData = exports.updateColumnsByGroup = exports.updateColumns = exports.updateArrayByKey = exports.transformColumns1 = exports.transformColumns = exports.totalFixedWidth = exports.sumDataByField = exports.removeColumns = exports.parseBooleanToValue = exports.newGuid = exports.isObjEmpty = exports.isNullOrUndefined = exports.isNameColor = exports.isEmpty = exports.isEditable = exports.isDisable = exports.isColor = exports.isArraysEqual = exports.getVisibleColumnKeys = exports.getTypeFilter = exports.getTemplate = exports.getRowsPasteIndex = exports.getRowNumber = exports.getLastSelectCell = void 0;
 var _dayjs = _interopRequireDefault(require("dayjs"));
 var _moment = _interopRequireDefault(require("moment/moment"));
 var _uuid = require("uuid");
@@ -760,7 +760,7 @@ const removeColumns = (columns, groupColumns) => {
     const newCol = {
       ...column
     };
-    if (newCol.children) {
+    if (newCol?.children && newCol?.children.length > 0) {
       newCol.children = removeColumns(newCol.children, groupColumns);
     }
     return newCol;
@@ -795,7 +795,7 @@ const convertColumns = cols => {
       // title: () => (<span>{t ? t(col.columnGroupText ?? col.headerText ?? col.title) : col.columnGroupText ?? col.headerText ?? col.title}</span>),
       ellipsis: col.ellipsis !== false,
       align: col.textAlign ?? col.align,
-      fixed: col.frozen ? col.frozen.toLowerCase() : col.fixed
+      fixed: col.fixedType ?? col.fixed
     };
     if (transformedColumn.children && transformedColumn.children?.length) {
       return {
@@ -839,4 +839,11 @@ const isEditable = (column, rowData) => {
   }
   return column?.editEnable;
 };
-exports.isEditable = isEditable;
+exports.isEditable = isEditable;
+const isArraysEqual = (arr1, arr2) => {
+  if (arr1.length !== arr2.length) {
+    return false;
+  }
+  return arr1.every((element, index) => element === arr2[index]);
+};
+exports.isArraysEqual = isArraysEqual;

package/lib/grid-component/styles.scss

@@ -205,6 +205,8 @@ $fontFamily: "Montserrat",Helvetica,Arial,serif !default;
         border-bottom: 1px solid $tableBorderColor;
         //background: #fff;
         font-weight: 500;
+        //line-height: 23px;
+        //height: 40px;
       }
     }
 
@@ -336,10 +338,18 @@ $fontFamily: "Montserrat",Helvetica,Arial,serif !default;
 .#{$prefix}-table-wrapper {
 
   .#{$prefix}-table.#{$prefix}-table-small {
-    .#{$prefix}-table-selection-column{
-      //padding: 8px 8px;
-      //padding: 6px 8px;
+    .ui-rc-table-thead {
+      >tr >th.#{$prefix}-table-selection-column{
+        //padding-block: 7px;
+        padding: 0;
+        //padding: 6px 8px;
+      }
     }
+    //.#{$prefix}-table-selection-column{
+    //  padding-block: 7px;
+    //  padding: 0;
+    //  //padding: 6px 8px;
+    //}
   }
 
   &.grid-editable {