es-grid-template 1.4.1 → 1.4.3

package/es/grid-component/EditableCell.js

@@ -52,6 +52,7 @@ const EditableCell = props => {
     indexRow,
     indexCol,
     cellEditing,
+    // errors,
     ...restProps
   } = props;
   const {
@@ -59,7 +60,8 @@ const EditableCell = props => {
     control,
     getValues,
     handleCellChange,
-    getRowKey
+    getRowKey,
+    errors
   } = useContext(TableContext);
   const datePickerRef = React.useRef(null);
   const dateTimePickerRef = React.useRef(null);
@@ -86,7 +88,10 @@ const EditableCell = props => {
       validateOption,
       options: propsOptions
     } = column.editSelectSettings || {};
-    const isInvalid = false;
+    const isInvalid = column.field ? errors[column.field] : false;
+
+    // const message = errors && column.field && errors[column.field] ? errors[column.field].message : ''
+    const message = isInvalid?.message;
     const keySelect = checkFieldKey(column?.editSelectSettings?.fieldKey);
     const selectOptions = typeof propsOptions === 'function' ? propsOptions(record, column.dataIndex) : propsOptions;
     const options = validateOption ? validateOption(record, column.dataIndex) : selectOptions ?? [];
@@ -151,7 +156,10 @@ const EditableCell = props => {
               datePickerRef.current?.focus();
             }, 0);
           },
-          popupClassName: 'be-popup-container'
+          popupClassName: 'be-popup-container',
+          status: isInvalid ? 'error' : undefined,
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'datetime':
         return /*#__PURE__*/React.createElement(DatePicker
@@ -204,7 +212,10 @@ const EditableCell = props => {
               });
             }
           },
-          popupClassName: 'be-popup-container'
+          popupClassName: 'be-popup-container',
+          status: isInvalid ? 'error' : undefined,
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'month':
       case 'quarter':
@@ -227,7 +238,10 @@ const EditableCell = props => {
           disabled: isDisable(column, record) ?? false,
           maxDate: maxDateValue1,
           minDate: minDateValue1,
-          popupClassName: 'be-popup-container'
+          popupClassName: 'be-popup-container',
+          status: isInvalid ? 'error' : undefined,
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'week':
         const weekFormat = getDatepickerFormat(editType, cellFormat);
@@ -244,7 +258,10 @@ const EditableCell = props => {
           disabled: isDisable(column, record) ?? false,
           maxDate: maxWeekValue,
           minDate: minWeekValue,
-          popupClassName: 'be-popup-container'
+          popupClassName: 'be-popup-container',
+          status: isInvalid ? 'error' : undefined,
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'time':
         const timeFormat = getDatepickerFormat(editType, cellFormat);
@@ -268,7 +285,10 @@ const EditableCell = props => {
             width: '100%',
             height: '100%'
           },
-          popupClassName: 'be-popup-container'
+          popupClassName: 'be-popup-container',
+          status: isInvalid ? 'error' : undefined,
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'selectTable':
         const rr = selectColumns ?? [];
@@ -373,7 +393,9 @@ const EditableCell = props => {
           fieldNames: fieldNames ? fieldNames : {
             value: keySelect,
             label: inputKey ?? 'label'
-          }
+          },
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'select':
         let valueSelect = value;
@@ -429,7 +451,9 @@ const EditableCell = props => {
           fieldNames: fieldNames ? fieldNames : {
             value: keySelect,
             label: inputKey ?? 'label'
-          }
+          },
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'asyncSelect':
         let valueAsyncSelect = value;
@@ -524,7 +548,9 @@ const EditableCell = props => {
           fieldNames: fieldNames ? fieldNames : {
             value: keySelect,
             label: inputKey ?? 'label'
-          }
+          },
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'treeSelect':
         // let valueTreeSelect
@@ -595,7 +621,9 @@ const EditableCell = props => {
             });
           },
           popupClassName: 'be-popup-container',
-          status: isInvalid ? 'error' : undefined
+          status: isInvalid ? 'error' : undefined,
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
       case 'checkbox':
         return /*#__PURE__*/React.createElement("div", {
@@ -816,7 +844,9 @@ const EditableCell = props => {
                 type: 'blur'
               });
             }
-          }
+          },
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         }));
       default:
         return /*#__PURE__*/React.createElement(Input, {
@@ -876,9 +906,10 @@ const EditableCell = props => {
             });
             // }
           },
-          onChange: onChange
-
-          // invalid={isInvalid}
+          onChange: onChange,
+          status: isInvalid ? 'error' : undefined,
+          "data-tooltip-content": message,
+          "data-tooltip-id": "tooltip-form-error"
         });
     }
   };

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

@@ -4,5 +4,6 @@ import type { GridTableProps } from "./type";
 import 'dayjs/locale/es';
 import 'dayjs/locale/vi';
 import './styles.scss';
+export declare const SELECTION_COLUMN: {};
 declare const InternalTable: <RecordType extends object>(props: GridTableProps<RecordType>) => React.JSX.Element;
 export default InternalTable;