react-table-edit 1.2.18 → 1.2.20

package/dist/index.d.mts

@@ -18,6 +18,7 @@ type IFColumnSelectTable = {
 };
 type IFTableSelectFormat = {
     dateFormat?: string;
+    datetimeFormat?: string;
     decimalSeparator?: string;
     thousandSeparator?: string;
     colorNegative?: string;
@@ -40,6 +41,7 @@ type Props$1 = {
     rowData?: any;
     value: any;
     onKeyDown?: any;
+    onOpenMenu?: any;
     formatOptionLabel?: any;
     handleAdd?: any;
     options: any[];
@@ -99,6 +101,7 @@ type ISettingSelectElement = {
     validateOption?: any;
     optionsField?: string;
     columns?: IFColumnSelectTable[];
+    onOpenMenu?: any;
 };
 type ISettingNumericElement = {
     min?: number;
@@ -170,6 +173,7 @@ type IFTableEditSearchSetting = {
 };
 type IFTableEditFormat = {
     dateFormat?: string;
+    datetimeFormat?: string;
     decimalSeparator?: string;
     thousandSeparator?: string;
     colorNegative?: string;
@@ -267,6 +271,7 @@ declare const generateUUID: () => string;
  */
 declare const formartNumberic: (str: string | number, decimalSeparator: string, thousandSeparator: string, fraction?: number, isDone?: boolean, haveNegative?: boolean) => string;
 declare const roundNumber: (num: number, fraction: number) => number;
+declare const formatDateTime: (data: any, format?: string) => string;
 
 type IFDataProps = {
     buttonWidth?: number;
@@ -330,6 +335,7 @@ type Props = {
     showFooter?: boolean;
     selectChilds?: boolean;
     formatSetting?: IFTableTreeSelectFormat;
+    onOpenMenu?: any;
     onPaste?: any;
 };
 declare const SelectTableTree: react__default.ForwardRefExoticComponent<Props & react__default.RefAttributes<unknown>>;
@@ -357,4 +363,4 @@ interface IFDataInputStyle {
 }
 declare const InputStyleComponent: (props: IFDataInputStyle) => react_jsx_runtime.JSX.Element;
 
-export { type FromItemsField, type IColumnTable, type ICommandItem, type IFColumnSelectTable, type IFColumnSelectTableTree, type IFCurrentPage, type IFCurrentPageConfig, type IFPageSize, type IFTableEditButton, type IFTableEditFormat, type IFTableEditPaging, type IFTableEditProps, type IFTableEditSearchSetting, type IFTableEditToolbar, type IFTableSelectFormat, type IFTableTreeSelectFormat, type IFToolbarOptions, type IHeaderColumnTable, type ISettingFormElement, type ISettingNumericElement, type ISettingSelectElement, InputStyleComponent, SelectTable, SelectTableTree, TabsMenuComponent, checkDecimalSeparator, checkThousandSeparator, TableEdit as default, formartNumberic, generateUUID, isNullOrUndefined, messageBoxConfirm, messageBoxConfirm2, messageBoxConfirmDelete, messageBoxError, messageHtmlBoxConfirm, messageHtmlBoxError, notificationError, notificationSuccess, roundNumber, useOnClickOutside };
+export { type FromItemsField, type IColumnTable, type ICommandItem, type IFColumnSelectTable, type IFColumnSelectTableTree, type IFCurrentPage, type IFCurrentPageConfig, type IFPageSize, type IFTableEditButton, type IFTableEditFormat, type IFTableEditPaging, type IFTableEditProps, type IFTableEditSearchSetting, type IFTableEditToolbar, type IFTableSelectFormat, type IFTableTreeSelectFormat, type IFToolbarOptions, type IHeaderColumnTable, type ISettingFormElement, type ISettingNumericElement, type ISettingSelectElement, InputStyleComponent, SelectTable, SelectTableTree, TabsMenuComponent, checkDecimalSeparator, checkThousandSeparator, TableEdit as default, formartNumberic, formatDateTime, generateUUID, isNullOrUndefined, messageBoxConfirm, messageBoxConfirm2, messageBoxConfirmDelete, messageBoxError, messageHtmlBoxConfirm, messageHtmlBoxError, notificationError, notificationSuccess, roundNumber, useOnClickOutside };

package/dist/index.d.ts

@@ -18,6 +18,7 @@ type IFColumnSelectTable = {
 };
 type IFTableSelectFormat = {
     dateFormat?: string;
+    datetimeFormat?: string;
     decimalSeparator?: string;
     thousandSeparator?: string;
     colorNegative?: string;
@@ -40,6 +41,7 @@ type Props$1 = {
     rowData?: any;
     value: any;
     onKeyDown?: any;
+    onOpenMenu?: any;
     formatOptionLabel?: any;
     handleAdd?: any;
     options: any[];
@@ -99,6 +101,7 @@ type ISettingSelectElement = {
     validateOption?: any;
     optionsField?: string;
     columns?: IFColumnSelectTable[];
+    onOpenMenu?: any;
 };
 type ISettingNumericElement = {
     min?: number;
@@ -170,6 +173,7 @@ type IFTableEditSearchSetting = {
 };
 type IFTableEditFormat = {
     dateFormat?: string;
+    datetimeFormat?: string;
     decimalSeparator?: string;
     thousandSeparator?: string;
     colorNegative?: string;
@@ -267,6 +271,7 @@ declare const generateUUID: () => string;
  */
 declare const formartNumberic: (str: string | number, decimalSeparator: string, thousandSeparator: string, fraction?: number, isDone?: boolean, haveNegative?: boolean) => string;
 declare const roundNumber: (num: number, fraction: number) => number;
+declare const formatDateTime: (data: any, format?: string) => string;
 
 type IFDataProps = {
     buttonWidth?: number;
@@ -330,6 +335,7 @@ type Props = {
     showFooter?: boolean;
     selectChilds?: boolean;
     formatSetting?: IFTableTreeSelectFormat;
+    onOpenMenu?: any;
     onPaste?: any;
 };
 declare const SelectTableTree: react__default.ForwardRefExoticComponent<Props & react__default.RefAttributes<unknown>>;
@@ -357,4 +363,4 @@ interface IFDataInputStyle {
 }
 declare const InputStyleComponent: (props: IFDataInputStyle) => react_jsx_runtime.JSX.Element;
 
-export { type FromItemsField, type IColumnTable, type ICommandItem, type IFColumnSelectTable, type IFColumnSelectTableTree, type IFCurrentPage, type IFCurrentPageConfig, type IFPageSize, type IFTableEditButton, type IFTableEditFormat, type IFTableEditPaging, type IFTableEditProps, type IFTableEditSearchSetting, type IFTableEditToolbar, type IFTableSelectFormat, type IFTableTreeSelectFormat, type IFToolbarOptions, type IHeaderColumnTable, type ISettingFormElement, type ISettingNumericElement, type ISettingSelectElement, InputStyleComponent, SelectTable, SelectTableTree, TabsMenuComponent, checkDecimalSeparator, checkThousandSeparator, TableEdit as default, formartNumberic, generateUUID, isNullOrUndefined, messageBoxConfirm, messageBoxConfirm2, messageBoxConfirmDelete, messageBoxError, messageHtmlBoxConfirm, messageHtmlBoxError, notificationError, notificationSuccess, roundNumber, useOnClickOutside };
+export { type FromItemsField, type IColumnTable, type ICommandItem, type IFColumnSelectTable, type IFColumnSelectTableTree, type IFCurrentPage, type IFCurrentPageConfig, type IFPageSize, type IFTableEditButton, type IFTableEditFormat, type IFTableEditPaging, type IFTableEditProps, type IFTableEditSearchSetting, type IFTableEditToolbar, type IFTableSelectFormat, type IFTableTreeSelectFormat, type IFToolbarOptions, type IHeaderColumnTable, type ISettingFormElement, type ISettingNumericElement, type ISettingSelectElement, InputStyleComponent, SelectTable, SelectTableTree, TabsMenuComponent, checkDecimalSeparator, checkThousandSeparator, TableEdit as default, formartNumberic, formatDateTime, generateUUID, isNullOrUndefined, messageBoxConfirm, messageBoxConfirm2, messageBoxConfirmDelete, messageBoxError, messageHtmlBoxConfirm, messageHtmlBoxError, notificationError, notificationSuccess, roundNumber, useOnClickOutside };

package/dist/index.js

@@ -38,6 +38,7 @@ __export(src_exports, {
   checkThousandSeparator: () => checkThousandSeparator,
   default: () => src_default,
   formartNumberic: () => formartNumberic,
+  formatDateTime: () => formatDateTime,
   generateUUID: () => generateUUID,
   isNullOrUndefined: () => isNullOrUndefined,
   messageBoxConfirm: () => messageBoxConfirm,
@@ -356,9 +357,20 @@ var roundNumber = (num, fraction) => {
   const result = Math.round(num * base) / base;
   return result;
 };
-
-// src/component/table/index.tsx
-var import_moment3 = __toESM(require("moment"));
+var formatDateTime = (data, format = "dd/MM/yyyy") => {
+  if (!data) {
+    return "";
+  }
+  const date = new Date(data);
+  const map = {
+    dd: String(date.getDate()).padStart(2, "0"),
+    MM: String(date.getMonth() + 1).padStart(2, "0"),
+    yyyy: date.getFullYear(),
+    HH: String(date.getHours()).padStart(2, "0"),
+    mm: String(date.getMinutes()).padStart(2, "0")
+  };
+  return format.replace(/dd|MM|yyyy|HH|mm/g, (match) => map[match]);
+};
 
 // src/component/edit-form/index.tsx
 var import_react8 = require("react");
@@ -604,7 +616,6 @@ var import_react6 = __toESM(require("react"));
 var import_reactstrap4 = require("reactstrap");
 var import_react_i18next3 = require("react-i18next");
 var import_classnames4 = __toESM(require("classnames"));
-var import_moment = __toESM(require("moment"));
 var import_becoxy_icons2 = require("becoxy-icons");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 var defaultMaxHeight = 250;
@@ -636,6 +647,7 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
     footerComponent,
     formatSetting,
     allowCreate,
+    onOpenMenu,
     onPaste
   } = props;
   const selectTableRef = (0, import_react6.useRef)();
@@ -695,6 +707,11 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
       setIndexFocus(0);
     }
   }, [searchTerm]);
+  (0, import_react6.useEffect)(() => {
+    if (dropdownOpen && onOpenMenu) {
+      onOpenMenu();
+    }
+  }, [dropdownOpen]);
   const handleOpenClose = () => {
     setSearchTerm("");
     if (dropdownOpen) {
@@ -927,9 +944,9 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
             if (col.type === "numeric" || col.typeCondition && col.typeCondition(row) === "numeric") {
               valueDisplay = formartNumberic(row[col.field], formatSetting?.decimalSeparator ?? ".", formatSetting?.thousandSeparator ?? ",", col.fraction ?? 0, true, false) ?? 0;
             } else if (col.type === "date") {
-              valueDisplay = valueDisplay ? (0, import_moment.default)(valueDisplay).format("DD/MM/yyyy") : "";
+              valueDisplay = valueDisplay ? formatDateTime(valueDisplay, formatSetting?.dateFormat) : "";
             } else if (col.type === "datetime") {
-              valueDisplay = valueDisplay ? (0, import_moment.default)(valueDisplay).format("DD/MM/yyyy HH:mm") : "";
+              valueDisplay = valueDisplay ? formatDateTime(valueDisplay, formatSetting?.dateFormat ?? "DD/MM/yyyy HH:mm") : "";
             }
             return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react6.Fragment, { children: [
               col.visible !== false && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
@@ -2276,7 +2293,6 @@ var import_react15 = __toESM(require("react"));
 var import_reactstrap10 = require("reactstrap");
 var import_react_i18next11 = require("react-i18next");
 var import_classnames13 = __toESM(require("classnames"));
-var import_moment2 = __toESM(require("moment"));
 var import_becoxy_icons6 = require("becoxy-icons");
 var import_jsx_runtime15 = require("react/jsx-runtime");
 var defaultMaxHeight2 = 250;
@@ -2308,6 +2324,7 @@ var SelectTableTree = (0, import_react15.forwardRef)((props, ref) => {
     selectChilds,
     footerComponent,
     formatSetting,
+    onOpenMenu,
     onPaste
   } = props;
   const selectTableRef = (0, import_react15.useRef)();
@@ -2330,6 +2347,11 @@ var SelectTableTree = (0, import_react15.forwardRef)((props, ref) => {
   const isSelectedAll = (0, import_react15.useMemo)(() => {
     return isMulti === true && options.length > 0 && areAllItemsSelected(value, options, fieldValue ?? "value");
   }, [options, value]);
+  (0, import_react15.useEffect)(() => {
+    if (dropdownOpen && onOpenMenu) {
+      onOpenMenu();
+    }
+  }, [dropdownOpen]);
   const defaultColumns = [
     {
       headerText: "Name",
@@ -2551,9 +2573,9 @@ var SelectTableTree = (0, import_react15.forwardRef)((props, ref) => {
               if (col.type === "numeric" || col.typeCondition && col.typeCondition(row) === "numeric") {
                 valueDisplay = formartNumberic(row[col.field], formatSetting?.decimalSeparator ?? ".", formatSetting?.thousandSeparator ?? ",", col.fraction ?? 0, true) ?? 0;
               } else if (col.type === "date") {
-                valueDisplay = valueDisplay ? (0, import_moment2.default)(valueDisplay).format("DD/MM/yyyy") : "";
+                valueDisplay = valueDisplay ? formatDateTime(valueDisplay, formatSetting?.dateFormat) : "";
               } else if (col.type === "datetime") {
-                valueDisplay = valueDisplay ? (0, import_moment2.default)(valueDisplay).format("DD/MM/yyyy HH:mm") : "";
+                valueDisplay = valueDisplay ? formatDateTime(valueDisplay, formatSetting?.dateFormat ?? "DD/MM/yyyy HH:mm") : "";
               }
               return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react15.Fragment, { children: [
                 col.visible !== false && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
@@ -3053,7 +3075,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
           {
             id: `${idTable}-col${indexCol + 1}-row${indexRow + 1}`,
             style: { textAlign: col.textAlign, height: 29 },
-            value: row[col.field] ? (0, import_moment3.default)(row[col.field]).format("yyyy-MM-DD") : row[col.field],
+            value: row[col.field] ? formatDateTime(row[col.field], "yyyy-MM-dd") : row[col.field],
             onChange: (val) => {
               row[col.field] = val.target.value;
               if (col.callback) {
@@ -3082,7 +3104,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
           {
             id: `${idTable}-col${indexCol + 1}-row${indexRow + 1}`,
             style: { textAlign: col.textAlign, height: 29 },
-            value: row[col.field] ? (0, import_moment3.default)(row[col.field]).format("yyyy-MM-DD HH:MM") : row[col.field],
+            value: row[col.field] ? formatDateTime(row[col.field], "yyyy-MM-dd HH:mm") : row[col.field],
             onChange: (val) => {
               row[col.field] = val.target.value;
               if (col.callback) {
@@ -3161,6 +3183,11 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
               if (checkKeyDown(e, row, col, indexRow + 1, indexCol + 1)) {
               }
             },
+            onOpenMenu: () => {
+              if (col.selectSettings?.onOpenMenu) {
+                col.selectSettings?.onOpenMenu(row, col, indexRow);
+              }
+            },
             onPaste: (e) => {
               if (toolbarSetting?.showBottomToolbar && !editDisable && !addDisable) {
                 pasteDataFromExcel(indexRow, indexCol, e);
@@ -3227,6 +3254,11 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
                 isClearable: col.selectSettings?.isClearable ?? false,
                 formatSetting,
                 placeholder: t("Select"),
+                onOpenMenu: () => {
+                  if (col.selectSettings?.onOpenMenu) {
+                    col.selectSettings?.onOpenMenu(row, col, indexRow);
+                  }
+                },
                 loadOptions: col.selectSettings?.loadOptions,
                 handleAdd: col.selectSettings?.handAddNew ? (e) => col.selectSettings?.handAddNew(e, indexRow, row) : void 0,
                 fieldChildren: col.selectSettings?.fieldChild ?? "children",
@@ -3939,9 +3971,9 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
       if (col.editType === "numeric" || col.editTypeCondition && col.editTypeCondition(row) === "numeric") {
         value = formartNumberic(row[col.field], formatSetting?.decimalSeparator ?? ",", formatSetting?.thousandSeparator ?? ".", col.numericSettings?.fraction, true, false) ?? 0;
       } else if (col.editType === "date") {
-        value = value ? (0, import_moment3.default)(value).format("DD/MM/yyyy") : "";
+        value = value ? formatDateTime(value, formatSetting?.dateFormat) : "";
       } else if (col.editType === "datetime") {
-        value = value ? (0, import_moment3.default)(value).format("DD/MM/yyyy HH:mm") : "";
+        value = value ? formatDateTime(value, formatSetting?.dateFormat ?? "DD/MM/yyyy HH:mm") : "";
       }
       const typeDis = !editDisable && (indexFocus === indexRow || col.editType === "checkbox") && (!col.disabledCondition || !col.disabledCondition(row)) ? col.editEnable ? 1 : col.template ? 2 : 3 : col.template ? 2 : 3;
       const errorMessage = typeDis === 1 || col.field === "" || !col.validate ? "" : col.validate(row[col.field], row);
@@ -5348,6 +5380,7 @@ var src_default = table_default;
   checkDecimalSeparator,
   checkThousandSeparator,
   formartNumberic,
+  formatDateTime,
   generateUUID,
   isNullOrUndefined,
   messageBoxConfirm,

package/dist/index.mjs

@@ -301,9 +301,20 @@ var roundNumber = (num, fraction) => {
   const result = Math.round(num * base) / base;
   return result;
 };
-
-// src/component/table/index.tsx
-import moment3 from "moment";
+var formatDateTime = (data, format = "dd/MM/yyyy") => {
+  if (!data) {
+    return "";
+  }
+  const date = new Date(data);
+  const map = {
+    dd: String(date.getDate()).padStart(2, "0"),
+    MM: String(date.getMonth() + 1).padStart(2, "0"),
+    yyyy: date.getFullYear(),
+    HH: String(date.getHours()).padStart(2, "0"),
+    mm: String(date.getMinutes()).padStart(2, "0")
+  };
+  return format.replace(/dd|MM|yyyy|HH|mm/g, (match) => map[match]);
+};
 
 // src/component/edit-form/index.tsx
 import { forwardRef as forwardRef2, useEffect as useEffect4, useRef as useRef2, useState as useState3 } from "react";
@@ -567,7 +578,6 @@ import {
 } from "reactstrap";
 import { useTranslation as useTranslation3 } from "react-i18next";
 import classnames3 from "classnames";
-import moment from "moment";
 import { Plus } from "becoxy-icons";
 import { Fragment as Fragment6, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var defaultMaxHeight = 250;
@@ -599,6 +609,7 @@ var SelectTable = forwardRef((props, ref) => {
     footerComponent,
     formatSetting,
     allowCreate,
+    onOpenMenu,
     onPaste
   } = props;
   const selectTableRef = useRef();
@@ -658,6 +669,11 @@ var SelectTable = forwardRef((props, ref) => {
       setIndexFocus(0);
     }
   }, [searchTerm]);
+  useEffect3(() => {
+    if (dropdownOpen && onOpenMenu) {
+      onOpenMenu();
+    }
+  }, [dropdownOpen]);
   const handleOpenClose = () => {
     setSearchTerm("");
     if (dropdownOpen) {
@@ -890,9 +906,9 @@ var SelectTable = forwardRef((props, ref) => {
             if (col.type === "numeric" || col.typeCondition && col.typeCondition(row) === "numeric") {
               valueDisplay = formartNumberic(row[col.field], formatSetting?.decimalSeparator ?? ".", formatSetting?.thousandSeparator ?? ",", col.fraction ?? 0, true, false) ?? 0;
             } else if (col.type === "date") {
-              valueDisplay = valueDisplay ? moment(valueDisplay).format("DD/MM/yyyy") : "";
+              valueDisplay = valueDisplay ? formatDateTime(valueDisplay, formatSetting?.dateFormat) : "";
             } else if (col.type === "datetime") {
-              valueDisplay = valueDisplay ? moment(valueDisplay).format("DD/MM/yyyy HH:mm") : "";
+              valueDisplay = valueDisplay ? formatDateTime(valueDisplay, formatSetting?.dateFormat ?? "DD/MM/yyyy HH:mm") : "";
             }
             return /* @__PURE__ */ jsxs5(Fragment5, { children: [
               col.visible !== false && /* @__PURE__ */ jsx5(
@@ -2247,7 +2263,6 @@ import {
 } from "reactstrap";
 import { useTranslation as useTranslation11 } from "react-i18next";
 import classnames8 from "classnames";
-import moment2 from "moment";
 import { ChevronRight as ChevronRight3, Plus as Plus3 } from "becoxy-icons";
 import { Fragment as Fragment19, jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
 var defaultMaxHeight2 = 250;
@@ -2279,6 +2294,7 @@ var SelectTableTree = forwardRef3((props, ref) => {
     selectChilds,
     footerComponent,
     formatSetting,
+    onOpenMenu,
     onPaste
   } = props;
   const selectTableRef = useRef3();
@@ -2301,6 +2317,11 @@ var SelectTableTree = forwardRef3((props, ref) => {
   const isSelectedAll = useMemo2(() => {
     return isMulti === true && options.length > 0 && areAllItemsSelected(value, options, fieldValue ?? "value");
   }, [options, value]);
+  useEffect8(() => {
+    if (dropdownOpen && onOpenMenu) {
+      onOpenMenu();
+    }
+  }, [dropdownOpen]);
   const defaultColumns = [
     {
       headerText: "Name",
@@ -2522,9 +2543,9 @@ var SelectTableTree = forwardRef3((props, ref) => {
               if (col.type === "numeric" || col.typeCondition && col.typeCondition(row) === "numeric") {
                 valueDisplay = formartNumberic(row[col.field], formatSetting?.decimalSeparator ?? ".", formatSetting?.thousandSeparator ?? ",", col.fraction ?? 0, true) ?? 0;
               } else if (col.type === "date") {
-                valueDisplay = valueDisplay ? moment2(valueDisplay).format("DD/MM/yyyy") : "";
+                valueDisplay = valueDisplay ? formatDateTime(valueDisplay, formatSetting?.dateFormat) : "";
               } else if (col.type === "datetime") {
-                valueDisplay = valueDisplay ? moment2(valueDisplay).format("DD/MM/yyyy HH:mm") : "";
+                valueDisplay = valueDisplay ? formatDateTime(valueDisplay, formatSetting?.dateFormat ?? "DD/MM/yyyy HH:mm") : "";
               }
               return /* @__PURE__ */ jsxs14(Fragment18, { children: [
                 col.visible !== false && /* @__PURE__ */ jsxs14(
@@ -3024,7 +3045,7 @@ var TableEdit = forwardRef4((props, ref) => {
           {
             id: `${idTable}-col${indexCol + 1}-row${indexRow + 1}`,
             style: { textAlign: col.textAlign, height: 29 },
-            value: row[col.field] ? moment3(row[col.field]).format("yyyy-MM-DD") : row[col.field],
+            value: row[col.field] ? formatDateTime(row[col.field], "yyyy-MM-dd") : row[col.field],
             onChange: (val) => {
               row[col.field] = val.target.value;
               if (col.callback) {
@@ -3053,7 +3074,7 @@ var TableEdit = forwardRef4((props, ref) => {
           {
             id: `${idTable}-col${indexCol + 1}-row${indexRow + 1}`,
             style: { textAlign: col.textAlign, height: 29 },
-            value: row[col.field] ? moment3(row[col.field]).format("yyyy-MM-DD HH:MM") : row[col.field],
+            value: row[col.field] ? formatDateTime(row[col.field], "yyyy-MM-dd HH:mm") : row[col.field],
             onChange: (val) => {
               row[col.field] = val.target.value;
               if (col.callback) {
@@ -3132,6 +3153,11 @@ var TableEdit = forwardRef4((props, ref) => {
               if (checkKeyDown(e, row, col, indexRow + 1, indexCol + 1)) {
               }
             },
+            onOpenMenu: () => {
+              if (col.selectSettings?.onOpenMenu) {
+                col.selectSettings?.onOpenMenu(row, col, indexRow);
+              }
+            },
             onPaste: (e) => {
               if (toolbarSetting?.showBottomToolbar && !editDisable && !addDisable) {
                 pasteDataFromExcel(indexRow, indexCol, e);
@@ -3198,6 +3224,11 @@ var TableEdit = forwardRef4((props, ref) => {
                 isClearable: col.selectSettings?.isClearable ?? false,
                 formatSetting,
                 placeholder: t("Select"),
+                onOpenMenu: () => {
+                  if (col.selectSettings?.onOpenMenu) {
+                    col.selectSettings?.onOpenMenu(row, col, indexRow);
+                  }
+                },
                 loadOptions: col.selectSettings?.loadOptions,
                 handleAdd: col.selectSettings?.handAddNew ? (e) => col.selectSettings?.handAddNew(e, indexRow, row) : void 0,
                 fieldChildren: col.selectSettings?.fieldChild ?? "children",
@@ -3910,9 +3941,9 @@ var TableEdit = forwardRef4((props, ref) => {
       if (col.editType === "numeric" || col.editTypeCondition && col.editTypeCondition(row) === "numeric") {
         value = formartNumberic(row[col.field], formatSetting?.decimalSeparator ?? ",", formatSetting?.thousandSeparator ?? ".", col.numericSettings?.fraction, true, false) ?? 0;
       } else if (col.editType === "date") {
-        value = value ? moment3(value).format("DD/MM/yyyy") : "";
+        value = value ? formatDateTime(value, formatSetting?.dateFormat) : "";
       } else if (col.editType === "datetime") {
-        value = value ? moment3(value).format("DD/MM/yyyy HH:mm") : "";
+        value = value ? formatDateTime(value, formatSetting?.dateFormat ?? "DD/MM/yyyy HH:mm") : "";
       }
       const typeDis = !editDisable && (indexFocus === indexRow || col.editType === "checkbox") && (!col.disabledCondition || !col.disabledCondition(row)) ? col.editEnable ? 1 : col.template ? 2 : 3 : col.template ? 2 : 3;
       const errorMessage = typeDis === 1 || col.field === "" || !col.validate ? "" : col.validate(row[col.field], row);
@@ -5319,6 +5350,7 @@ export {
   checkThousandSeparator,
   src_default as default,
   formartNumberic,
+  formatDateTime,
   generateUUID,
   isNullOrUndefined,
   messageBoxConfirm,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-table-edit",
-  "version": "1.2.18",
+  "version": "1.2.20",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
@@ -25,9 +25,7 @@
     "@hookform/resolvers": "^2.8.10",
     "@types/react-resizable": "^3.0.7",
     "becoxy-icons": "1.8.1",
-    "bootstrap": "5.1.0",
     "classnames": "2.3.1",
-    "moment": "^2.29.3",
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
     "react-hook-form": "7.43.9",