es-grid-template 1.7.47 → 1.7.48

package/es/table-component/body/EditableCell.js

@@ -283,6 +283,7 @@ const EditableCell = props => {
         });
       case 'time':
         const timeFormat = getDatepickerFormat(editType, cellFormat);
+        const time = value ? dayjs(value, timeFormat) : null;
         const maxTimeValue = !isEmpty(column.maxTime) ? dayjs(column.maxTime).format(timeFormat) : null;
         const minTimeValue = !isEmpty(column.minTime) ? dayjs(column.minTime).format(timeFormat) : null;
 
@@ -297,7 +298,10 @@ const EditableCell = props => {
           },
           placeholder: t ? t(column.placeholder ?? 'Select') : column.placeholder ?? 'Select',
           maxDate: maxTime,
-          minDate: minTime,
+          minDate: minTime
+          // value={time}
+          ,
+          defaultValue: time,
           disabled: isDisable(column, record) ?? false,
           style: {
             width: '100%',
@@ -308,7 +312,35 @@ const EditableCell = props => {
           "data-tooltip-content": message,
           "data-tooltip-id": `${id}-tooltip-error`,
           autoFocus: column.field === startCell?.colId,
-          defaultOpen: column.field === startCell?.colId
+          defaultOpen: column.field === startCell?.colId,
+          onChange: (newDate, dateString) => {
+            // const newDateValue = dateString ? moment(convertDayjsToDate(dateString as string, dateFormat)).format() : null
+            onChange(dateString);
+            setTimeout(() => {
+              // @ts-ignore
+              dateTimePickerRef.current?.focus();
+            }, 0);
+          },
+          onBlur: () => {
+            const formState = getValues();
+            const itemState = getValues(dataIndex);
+            // @ts-ignore
+            const prevState = record[dataIndex];
+            const newState = itemState;
+            if (prevState !== newState) {
+              handleCellChange?.({
+                key: key,
+                field: column.field ?? column.field,
+                record: formState,
+                prevState,
+                newState,
+                option: newState,
+                indexCol,
+                indexRow,
+                type: 'blur'
+              });
+            }
+          }
         });
       case 'selectTable':
         const rr = selectColumns ?? [];

package/lib/table-component/body/EditableCell.js

@@ -285,6 +285,7 @@ const EditableCell = props => {
         });
       case 'time':
         const timeFormat = (0, _utils.getDatepickerFormat)(editType, cellFormat);
+        const time = value ? (0, _dayjs.default)(value, timeFormat) : null;
         const maxTimeValue = !(0, _utils.isEmpty)(column.maxTime) ? (0, _dayjs.default)(column.maxTime).format(timeFormat) : null;
         const minTimeValue = !(0, _utils.isEmpty)(column.minTime) ? (0, _dayjs.default)(column.minTime).format(timeFormat) : null;
 
@@ -299,7 +300,10 @@ const EditableCell = props => {
           },
           placeholder: t ? t(column.placeholder ?? 'Select') : column.placeholder ?? 'Select',
           maxDate: maxTime,
-          minDate: minTime,
+          minDate: minTime
+          // value={time}
+          ,
+          defaultValue: time,
           disabled: (0, _utils.isDisable)(column, record) ?? false,
           style: {
             width: '100%',
@@ -310,7 +314,35 @@ const EditableCell = props => {
           "data-tooltip-content": message,
           "data-tooltip-id": `${id}-tooltip-error`,
           autoFocus: column.field === startCell?.colId,
-          defaultOpen: column.field === startCell?.colId
+          defaultOpen: column.field === startCell?.colId,
+          onChange: (newDate, dateString) => {
+            // const newDateValue = dateString ? moment(convertDayjsToDate(dateString as string, dateFormat)).format() : null
+            onChange(dateString);
+            setTimeout(() => {
+              // @ts-ignore
+              dateTimePickerRef.current?.focus();
+            }, 0);
+          },
+          onBlur: () => {
+            const formState = getValues();
+            const itemState = getValues(dataIndex);
+            // @ts-ignore
+            const prevState = record[dataIndex];
+            const newState = itemState;
+            if (prevState !== newState) {
+              handleCellChange?.({
+                key: key,
+                field: column.field ?? column.field,
+                record: formState,
+                prevState,
+                newState,
+                option: newState,
+                indexCol,
+                indexRow,
+                type: 'blur'
+              });
+            }
+          }
         });
       case 'selectTable':
         const rr = selectColumns ?? [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "es-grid-template",
-  "version": "1.7.47",
+  "version": "1.7.48",
   "description": "es-grid-template",
   "keywords": [
     "react",