react-table-edit 1.2.41 → 1.2.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +67 -57
  2. package/dist/index.mjs +67 -57
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -145,11 +145,11 @@ var messageHtmlBoxError = (t, message, title = "Important", btnCancel = "Ok") =>
145
145
  };
146
146
  var messageBoxConfirmDelete = (t, handle, data) => {
147
147
  MySwal.fire({
148
- title: t("Confirm"),
149
- text: t("Do you want to delete item?"),
148
+ title: t("reactTableEdit.Confirm"),
149
+ text: t("reactTableEdit.Do you want to delete item?"),
150
150
  allowOutsideClick: false,
151
151
  showCancelButton: true,
152
- confirmButtonText: t("Delete"),
152
+ confirmButtonText: t("reactTableEdit.Delete"),
153
153
  cancelButtonText: t("Cancel"),
154
154
  customClass: {
155
155
  confirmButton: "btn btn-primary",
@@ -214,11 +214,11 @@ var notificationSuccess = (param) => {
214
214
  var messageBoxConfirm2 = async (t, data, data2, message) => {
215
215
  return new Promise((resolve) => {
216
216
  MySwal.fire({
217
- title: t("Confirm"),
217
+ title: t("reactTableEdit.Confirm"),
218
218
  text: t(message),
219
219
  allowOutsideClick: false,
220
220
  showCancelButton: true,
221
- confirmButtonText: t("Ok"),
221
+ confirmButtonText: t("reactTableEdit.Ok"),
222
222
  cancelButtonText: t("Cancel"),
223
223
  customClass: {
224
224
  confirmButton: "btn btn-primary",
@@ -646,10 +646,10 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
646
646
  showFooter,
647
647
  footerComponent,
648
648
  formatSetting,
649
- allowCreate,
650
649
  onOpenMenu,
651
650
  onCloseMenu,
652
- onPaste
651
+ onPaste,
652
+ allowCreate
653
653
  } = props;
654
654
  const selectTableRef = (0, import_react6.useRef)();
655
655
  const selectMenuTableRef = (0, import_react6.useRef)();
@@ -660,6 +660,7 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
660
660
  const [isLoading, setIsLoading] = (0, import_react6.useState)(false);
661
661
  const [searchTerm, setSearchTerm] = (0, import_react6.useState)("");
662
662
  const [optionsLoad, setOptionsLoad] = (0, import_react6.useState)();
663
+ const [haveCreateNew, setHaveCreateNew] = (0, import_react6.useState)(false);
663
664
  const { t } = (0, import_react_i18next3.useTranslation)();
664
665
  const isSelectedAll = (0, import_react6.useMemo)(() => {
665
666
  return isMulti === true && (optionsLoad ? optionsLoad : options).length > 0 && value?.length >= (optionsLoad ? optionsLoad : options).length;
@@ -679,7 +680,10 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
679
680
  };
680
681
  const handChange = (val) => {
681
682
  if (val && val.isCreated) {
682
- options.push({ ...val, [fieldLabel ?? "label"]: val[fieldLabel ?? "label"], isCreated: void 0 });
683
+ const newVal = { ...val, [fieldLabel ?? "label"]: val.valueCreate, isCreated: void 0 };
684
+ options.unshift(newVal);
685
+ onChange(newVal);
686
+ return;
683
687
  }
684
688
  onChange(val);
685
689
  };
@@ -732,7 +736,7 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
732
736
  const listKeyUse = ["Escape", "Space", "Enter", "Tab", "NumpadEnter", "ArrowDown", "ArrowUp", "F9"];
733
737
  const handleOnKeyDown = (e) => {
734
738
  let key = "";
735
- if (onKeyDown && (!dropdownOpen || !listKeyUse.includes(e.code) || (e.code === "Enter" || e.code === "Tab" || e.code === "NumpadEnter" || e.code === "Space") && !(optionsLoad ? optionsLoad : options)[indexFocus] || (e.code === "ArrowDown" || e.code === "ArrowUp") && (optionsLoad?.length ?? 0) === 0 && options.length === 0 || e.code === "Escape" && !(isClearable && value && !isDisabled))) {
739
+ if (onKeyDown && (!dropdownOpen || !listKeyUse.includes(e.code) || (e.code === "Enter" || e.code === "Tab" || e.code === "NumpadEnter" || e.code === "Space") && !((optionsLoad ? optionsLoad : options)[indexFocus] || haveCreateNew) || (e.code === "ArrowDown" || e.code === "ArrowUp") && (optionsLoad?.length ?? 0) === 0 && options.length === 0 || e.code === "Escape" && !(isClearable && value && !isDisabled))) {
736
740
  key = onKeyDown(e);
737
741
  }
738
742
  let flag = false;
@@ -741,11 +745,16 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
741
745
  handleAdd();
742
746
  flag = true;
743
747
  } else if (e.code === "Space") {
744
- const newItem = (optionsLoad ? optionsLoad : options)[indexFocus];
748
+ let newItem;
749
+ if (haveCreateNew && indexFocus === 0) {
750
+ newItem = { valueCreate: searchTerm, [fieldValue ?? "value"]: searchTerm, [fieldLabel ?? "label"]: `${t("reactTableEdit.Create")} '${searchTerm}'`, isCreated: true };
751
+ } else {
752
+ newItem = (optionsLoad ? optionsLoad : options)[indexFocus];
753
+ }
745
754
  if (dropdownOpen && newItem) {
746
- if ((optionsLoad ? optionsLoad : options)[indexFocus]) {
747
- handChange((optionsLoad ? optionsLoad : options)[indexFocus]);
748
- }
755
+ handChange(newItem);
756
+ handleOpenClose();
757
+ flag = true;
749
758
  }
750
759
  if (!searchTerm) {
751
760
  handleOpenClose();
@@ -758,14 +767,19 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
758
767
  flag = true;
759
768
  }
760
769
  } else if (e.code === "Enter" || e.code === "Tab" || e.code === "NumpadEnter") {
761
- const newItem = (optionsLoad ? optionsLoad : options)[indexFocus];
770
+ let newItem;
771
+ if (haveCreateNew && indexFocus === 0) {
772
+ newItem = { valueCreate: searchTerm, [fieldValue ?? "value"]: searchTerm, [fieldLabel ?? "label"]: `${t("reactTableEdit.Create")} '${searchTerm}'`, isCreated: true };
773
+ } else {
774
+ newItem = (optionsLoad ? optionsLoad : options)[indexFocus];
775
+ }
762
776
  if (dropdownOpen && newItem) {
763
777
  handChange(newItem);
764
778
  handleOpenClose();
765
779
  flag = true;
766
780
  }
767
781
  } else if (e.code === "ArrowDown") {
768
- if (dropdownOpen && ((optionsLoad?.length ?? 0) > 0 || options.length > 0)) {
782
+ if (dropdownOpen && ((optionsLoad?.length ?? 0) > 0 || options.length > 0 || haveCreateNew)) {
769
783
  let newIndex = 0;
770
784
  if (indexFocus >= 0) {
771
785
  newIndex = indexFocus + 1;
@@ -785,7 +799,7 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
785
799
  flag = true;
786
800
  }
787
801
  } else if (e.code === "ArrowUp") {
788
- if (dropdownOpen && ((optionsLoad?.length ?? 0) > 0 || options.length > 0)) {
802
+ if (dropdownOpen && ((optionsLoad?.length ?? 0) > 0 || options.length > 0 || haveCreateNew)) {
789
803
  let newIndex = 0;
790
804
  if (indexFocus >= 0) {
791
805
  newIndex = indexFocus - 1;
@@ -888,15 +902,14 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
888
902
  setIsLoading(false);
889
903
  setOptionsLoad(rs);
890
904
  };
891
- (0, import_react6.useEffect)(() => {
892
- if ((optionsLoad?.length ?? 0) === 0 && allowCreate && !isMulti && searchTerm) {
893
- setOptionsLoad([{ [fieldLabel ?? "label"]: `Create "${searchTerm}"`, [fieldValue ?? "value"]: searchTerm, isCreated: true }]);
894
- }
895
- }, [optionsLoad]);
896
905
  (0, import_react6.useEffect)(() => {
897
906
  if (!searchTerm) {
898
907
  setOptionsLoad(void 0);
908
+ } else if (allowCreate && !(optionsLoad ? optionsLoad : options)?.find((x) => x[fieldLabel ?? "label"] === searchTerm)) {
909
+ setHaveCreateNew(true);
910
+ return;
899
911
  }
912
+ setHaveCreateNew(false);
900
913
  }, [searchTerm]);
901
914
  const checkOverflow = (indexRow, indexCol) => {
902
915
  const element = document.getElementById(`select-${id}-${indexRow}-${indexCol}`);
@@ -1046,12 +1059,15 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
1046
1059
  return renderHeaderCol(col, index);
1047
1060
  })
1048
1061
  ] }) }),
1049
- (optionsLoad ? optionsLoad : options)?.length > 0 && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("tbody", { className: "r-select-gridcontent", children: (optionsLoad ? optionsLoad : options)?.map((row, indexRow) => {
1050
- const isSelected = isMulti && value?.some((x) => x[fieldValue ?? "value"] === row[fieldValue ?? "value"]);
1051
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RenderElement, { isSelected: isSelected ?? false, indexRow, row }, `select-table-${indexRow}`);
1052
- }) }) })
1062
+ (optionsLoad ? optionsLoad : options) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("tbody", { className: "r-select-gridcontent", children: [
1063
+ haveCreateNew && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RenderElement, { isSelected: false, indexRow: 0, row: { valueCreate: searchTerm, [fieldValue ?? "value"]: searchTerm, [fieldLabel ?? "label"]: `${t("reactTableEdit.Create")} '${searchTerm}'`, isCreated: true } }),
1064
+ (optionsLoad ? optionsLoad : options)?.map((row, indexRow) => {
1065
+ const isSelected = isMulti && value?.some((x) => x[fieldValue ?? "value"] === row[fieldValue ?? "value"]);
1066
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RenderElement, { isSelected: isSelected ?? false, indexRow: indexRow + (haveCreateNew ? 1 : 0), row }, `select-table-${indexRow}`);
1067
+ })
1068
+ ] }) })
1053
1069
  ] }),
1054
- ((optionsLoad ? optionsLoad : options)?.length ?? 0) === 0 && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "r-no-data", children: [
1070
+ ((optionsLoad ? optionsLoad : options)?.length ?? 0) === 0 && !haveCreateNew && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "r-no-data", children: [
1055
1071
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [
1056
1072
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("ellipse", { fill: "#f5f5f5", cx: "32", cy: "33", rx: "32", ry: "7" }),
1057
1073
  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("g", { fillRule: "nonzero", stroke: "#d9d9d9", children: [
@@ -1059,11 +1075,11 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
1059
1075
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z", fill: "#fafafa" })
1060
1076
  ] })
1061
1077
  ] }) }),
1062
- t("No data available.")
1078
+ t("reactTableEdit.No data available.")
1063
1079
  ] }),
1064
1080
  isLoading && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "r-no-data", children: [
1065
1081
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_reactstrap4.Spinner, { className: "me-1", children: " " }),
1066
- t("Loading...")
1082
+ t("reactTableEdit.Loading...")
1067
1083
  ] })
1068
1084
  ] });
1069
1085
  };
@@ -1123,13 +1139,7 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
1123
1139
  } else {
1124
1140
  clearTimeout(timeOutElement);
1125
1141
  timeOutElement = setTimeout(() => {
1126
- const arr = [];
1127
- options.forEach((row) => {
1128
- if (checkSearch(val.target.value, row, columns ? columns : defaultColumns)) {
1129
- arr.push(row);
1130
- }
1131
- });
1132
- setOptionsLoad(arr);
1142
+ setOptionsLoad(options.filter((row) => checkSearch(val.target.value, row, columns ? columns : defaultColumns)));
1133
1143
  }, 500);
1134
1144
  }
1135
1145
  }
@@ -1186,7 +1196,7 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
1186
1196
  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: (0, import_classnames4.default)("r-select-footer", { "d-none": !(showFooter === true || handleAdd) }), children: [
1187
1197
  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_reactstrap4.Button, { outline: true, color: "primary", onClick: handleAdd, className: (0, import_classnames4.default)("r-btn d-flex align-items-center", { "d-none": !handleAdd }), children: [
1188
1198
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_becoxy_icons2.Plus, { className: "me-50", fontSize: 16 }),
1189
- t("AddNew"),
1199
+ t("reactTableEdit.AddNew"),
1190
1200
  " (F9)"
1191
1201
  ] }),
1192
1202
  footerComponent ? footerComponent() : null
@@ -1625,7 +1635,7 @@ var EditForm = (0, import_react8.forwardRef)((props, ref) => {
1625
1635
  closeMenu();
1626
1636
  }
1627
1637
  },
1628
- children: t("Clear")
1638
+ children: t("reactTableEdit.Clear")
1629
1639
  }
1630
1640
  ),
1631
1641
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
@@ -1640,7 +1650,7 @@ var EditForm = (0, import_react8.forwardRef)((props, ref) => {
1640
1650
  closeMenu();
1641
1651
  }
1642
1652
  },
1643
- children: t("Save")
1653
+ children: t("reactTableEdit.Save")
1644
1654
  }
1645
1655
  )
1646
1656
  ] }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_jsx_runtime7.Fragment, {})
@@ -1847,7 +1857,7 @@ var SidebarSetColumn = (props) => {
1847
1857
  const renderFooterButtons = () => {
1848
1858
  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react10.Fragment, { children: [
1849
1859
  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_reactstrap7.Button, { color: "primary", onClick: handleSubmit, className: "me-1", children: t("Confirm") }),
1850
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_reactstrap7.Button, { color: "secondary", onClick: handleCancel, outline: true, children: t("Close") })
1860
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_reactstrap7.Button, { color: "secondary", onClick: handleCancel, outline: true, children: t("reactTableEdit.Close") })
1851
1861
  ] });
1852
1862
  };
1853
1863
  const visibleTemplate = (item, index) => {
@@ -2138,12 +2148,12 @@ var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOpt
2138
2148
  },
2139
2149
  menuWidth: 90,
2140
2150
  width: 90,
2141
- placeholder: t("Select")
2151
+ placeholder: t("reactTableEdit.Select")
2142
2152
  }
2143
2153
  ) }),
2144
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { style: { display: "inline", marginLeft: 10, fontSize: 13 }, children: t("pagerDropDown") })
2154
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { style: { display: "inline", marginLeft: 10, fontSize: 13 }, children: t("reactTableEdit.pagerDropDown") })
2145
2155
  ] }),
2146
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "r-parentmsgbar", children: t("totalItemsInfo", { page: currentPage, countPage, totalItem }) })
2156
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "r-parentmsgbar", children: t("reactTableEdit.totalItemsInfo", { page: currentPage, countPage, totalItem }) })
2147
2157
  ] }) });
2148
2158
  };
2149
2159
 
@@ -2845,10 +2855,10 @@ var SelectTableTree = (0, import_react15.forwardRef)((props, ref) => {
2845
2855
  /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: (0, import_classnames13.default)("r-select-footer", { "d-none": !(showFooter === true || handleAdd || isMulti) }), children: [
2846
2856
  /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_reactstrap10.Button, { outline: true, color: "primary", onClick: handleAdd, className: (0, import_classnames13.default)("r-btn d-flex align-items-center", { "d-none": !handleAdd }), children: [
2847
2857
  /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_becoxy_icons6.Plus, { className: "me-50", fontSize: 16 }),
2848
- t("AddNew"),
2858
+ t("reactTableEdit.AddNew"),
2849
2859
  " (F9)"
2850
2860
  ] }),
2851
- isMulti && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "ms-50 text-primary h-100 d-flex align-items-center", onClick: handleAdd, children: t("countSelected", { item: value?.length ?? 0 }) }),
2861
+ isMulti && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "ms-50 text-primary h-100 d-flex align-items-center", onClick: handleAdd, children: t("reactTableEdit.countSelected", { item: value?.length ?? 0 }) }),
2852
2862
  footerComponent ? footerComponent() : null
2853
2863
  ] })
2854
2864
  ] })
@@ -3059,7 +3069,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3059
3069
  style: { width: "230px" },
3060
3070
  value: searchSetting?.searchTerm !== void 0 ? searchSetting?.searchTerm : searchTerm,
3061
3071
  setSearchTerm: searchSetting?.setSearchTerm ? searchSetting?.setSearchTerm : setSearchTerm,
3062
- placeholder: t("Search"),
3072
+ placeholder: t("reactTableEdit.Search"),
3063
3073
  onKeyPress: handleKeyPress
3064
3074
  }
3065
3075
  ) }) });
@@ -3184,7 +3194,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3184
3194
  columns: col.selectSettings?.columns,
3185
3195
  isClearable: col.selectSettings?.isClearable ?? false,
3186
3196
  formatSetting,
3187
- placeholder: t("Select"),
3197
+ placeholder: t("reactTableEdit.Select"),
3188
3198
  loadOptions: col.selectSettings?.loadOptions,
3189
3199
  handleAdd: col.selectSettings?.handAddNew ? (e) => col.selectSettings?.handAddNew(e, indexRow, row) : void 0,
3190
3200
  isMulti: col.selectSettings?.isMulti,
@@ -3271,7 +3281,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3271
3281
  columns: col.selectSettings?.columns,
3272
3282
  isClearable: col.selectSettings?.isClearable ?? false,
3273
3283
  formatSetting,
3274
- placeholder: t("Select"),
3284
+ placeholder: t("reactTableEdit.Select"),
3275
3285
  onOpenMenu: () => {
3276
3286
  if (col.selectSettings?.onOpenMenu) {
3277
3287
  col.selectSettings?.onOpenMenu(row, col, indexRow);
@@ -3741,7 +3751,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3741
3751
  column.callback(rs, currenRowIndex + indexRow);
3742
3752
  }
3743
3753
  } else {
3744
- notificationError(t("PasteExcelNotExist", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3754
+ notificationError(t("reactTableEdit.PasteExcelNotExist", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3745
3755
  }
3746
3756
  } else {
3747
3757
  if (column.editType === "date") {
@@ -3756,7 +3766,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3756
3766
  column.callback(date, currenRowIndex + indexRow);
3757
3767
  }
3758
3768
  } else {
3759
- notificationError(t("PasteExcelIncorrectFormat", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3769
+ notificationError(t("reactTableEdit.PasteExcelIncorrectFormat", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3760
3770
  }
3761
3771
  } else if (column.editType === "numeric") {
3762
3772
  const number = Number(stringData);
@@ -3770,7 +3780,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3770
3780
  column.callback(number, currenRowIndex + indexRow);
3771
3781
  }
3772
3782
  } else {
3773
- notificationError(t("PasteExcelIncorrectFormat", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3783
+ notificationError(t("reactTableEdit.PasteExcelIncorrectFormat", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3774
3784
  }
3775
3785
  } else {
3776
3786
  if (column.onPaste) {
@@ -3883,7 +3893,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3883
3893
  onCopy: (e) => {
3884
3894
  if (!editDisable && (e.target.nodeName === "DIV" || e.target.nodeName === "TD")) {
3885
3895
  navigator.clipboard.writeText(JSON.stringify(row));
3886
- notificationSuccess(t("CopySuccessful"));
3896
+ notificationSuccess(t("reactTableEdit.CopySuccessful"));
3887
3897
  e.stopPropagation();
3888
3898
  }
3889
3899
  },
@@ -3895,7 +3905,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3895
3905
  dataSource[indexRow][fieldKey] = defaultValue[fieldKey];
3896
3906
  }
3897
3907
  changeDataSource(dataSource);
3898
- notificationSuccess(t("PasteSuccessful"));
3908
+ notificationSuccess(t("reactTableEdit.PasteSuccessful"));
3899
3909
  }).catch((ex) => {
3900
3910
  alert(ex);
3901
3911
  });
@@ -4101,15 +4111,15 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
4101
4111
  const renderToolbarBottom = () => {
4102
4112
  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { id: "table_custom_bottom_toolbar", className: "r-toolbar r-toolbar-bottom", role: "toolbar", "aria-disabled": "false", "aria-haspopup": "false", "aria-orientation": "horizontal", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "r-toolbar-items", children: [
4103
4113
  /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "r-toolbar-left", children: [
4104
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || addDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "success", outline: true, onClick: handleAdd, className: "d-flex", children: t("Add item") }) }),
4114
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || addDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "success", outline: true, onClick: handleAdd, className: "d-flex", children: t("reactTableEdit.Add item") }) }),
4105
4115
  (indexFocus ?? -1) > -1 ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
4106
4116
  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.duplicateDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "success", outline: true, onClick: () => {
4107
4117
  handleDuplicate(dataSource[indexFocus ?? -1], indexFocus ?? -1);
4108
- }, className: "d-flex", children: t("Duplicate") }) }),
4109
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.insertBeforeDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "success", outline: true, onClick: handleInsertBefore, className: "d-flex", children: t("Insert item before") }) }),
4110
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.insertAfterDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "success", outline: true, onClick: handleInsertAfter, className: "d-flex", children: t("Insert item after") }) })
4118
+ }, className: "d-flex", children: t("reactTableEdit.Duplicate") }) }),
4119
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.insertBeforeDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "success", outline: true, onClick: handleInsertBefore, className: "d-flex", children: t("reactTableEdit.Insert item before") }) }),
4120
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.insertAfterDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "success", outline: true, onClick: handleInsertAfter, className: "d-flex", children: t("reactTableEdit.Insert item after") }) })
4111
4121
  ] }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children: " " }),
4112
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || buttonSetting?.deleteAllDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "primary", outline: true, onClick: handleDeleteAll, className: "d-flex", children: t("Delete all item") }) }),
4122
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_classnames14.default)("r-toolbar-item", { "d-none": editDisable || buttonSetting?.deleteAllDisable }), "aria-disabled": "false", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_reactstrap11.Button, { color: "primary", outline: true, onClick: handleDeleteAll, className: "d-flex", children: t("reactTableEdit.Delete all item") }) }),
4113
4123
  toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
4114
4124
  return item.align === "left" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-left-${index}`) : "";
4115
4125
  })
package/dist/index.mjs CHANGED
@@ -89,11 +89,11 @@ var messageHtmlBoxError = (t, message, title = "Important", btnCancel = "Ok") =>
89
89
  };
90
90
  var messageBoxConfirmDelete = (t, handle, data) => {
91
91
  MySwal.fire({
92
- title: t("Confirm"),
93
- text: t("Do you want to delete item?"),
92
+ title: t("reactTableEdit.Confirm"),
93
+ text: t("reactTableEdit.Do you want to delete item?"),
94
94
  allowOutsideClick: false,
95
95
  showCancelButton: true,
96
- confirmButtonText: t("Delete"),
96
+ confirmButtonText: t("reactTableEdit.Delete"),
97
97
  cancelButtonText: t("Cancel"),
98
98
  customClass: {
99
99
  confirmButton: "btn btn-primary",
@@ -158,11 +158,11 @@ var notificationSuccess = (param) => {
158
158
  var messageBoxConfirm2 = async (t, data, data2, message) => {
159
159
  return new Promise((resolve) => {
160
160
  MySwal.fire({
161
- title: t("Confirm"),
161
+ title: t("reactTableEdit.Confirm"),
162
162
  text: t(message),
163
163
  allowOutsideClick: false,
164
164
  showCancelButton: true,
165
- confirmButtonText: t("Ok"),
165
+ confirmButtonText: t("reactTableEdit.Ok"),
166
166
  cancelButtonText: t("Cancel"),
167
167
  customClass: {
168
168
  confirmButton: "btn btn-primary",
@@ -608,10 +608,10 @@ var SelectTable = forwardRef((props, ref) => {
608
608
  showFooter,
609
609
  footerComponent,
610
610
  formatSetting,
611
- allowCreate,
612
611
  onOpenMenu,
613
612
  onCloseMenu,
614
- onPaste
613
+ onPaste,
614
+ allowCreate
615
615
  } = props;
616
616
  const selectTableRef = useRef();
617
617
  const selectMenuTableRef = useRef();
@@ -622,6 +622,7 @@ var SelectTable = forwardRef((props, ref) => {
622
622
  const [isLoading, setIsLoading] = useState2(false);
623
623
  const [searchTerm, setSearchTerm] = useState2("");
624
624
  const [optionsLoad, setOptionsLoad] = useState2();
625
+ const [haveCreateNew, setHaveCreateNew] = useState2(false);
625
626
  const { t } = useTranslation3();
626
627
  const isSelectedAll = useMemo(() => {
627
628
  return isMulti === true && (optionsLoad ? optionsLoad : options).length > 0 && value?.length >= (optionsLoad ? optionsLoad : options).length;
@@ -641,7 +642,10 @@ var SelectTable = forwardRef((props, ref) => {
641
642
  };
642
643
  const handChange = (val) => {
643
644
  if (val && val.isCreated) {
644
- options.push({ ...val, [fieldLabel ?? "label"]: val[fieldLabel ?? "label"], isCreated: void 0 });
645
+ const newVal = { ...val, [fieldLabel ?? "label"]: val.valueCreate, isCreated: void 0 };
646
+ options.unshift(newVal);
647
+ onChange(newVal);
648
+ return;
645
649
  }
646
650
  onChange(val);
647
651
  };
@@ -694,7 +698,7 @@ var SelectTable = forwardRef((props, ref) => {
694
698
  const listKeyUse = ["Escape", "Space", "Enter", "Tab", "NumpadEnter", "ArrowDown", "ArrowUp", "F9"];
695
699
  const handleOnKeyDown = (e) => {
696
700
  let key = "";
697
- if (onKeyDown && (!dropdownOpen || !listKeyUse.includes(e.code) || (e.code === "Enter" || e.code === "Tab" || e.code === "NumpadEnter" || e.code === "Space") && !(optionsLoad ? optionsLoad : options)[indexFocus] || (e.code === "ArrowDown" || e.code === "ArrowUp") && (optionsLoad?.length ?? 0) === 0 && options.length === 0 || e.code === "Escape" && !(isClearable && value && !isDisabled))) {
701
+ if (onKeyDown && (!dropdownOpen || !listKeyUse.includes(e.code) || (e.code === "Enter" || e.code === "Tab" || e.code === "NumpadEnter" || e.code === "Space") && !((optionsLoad ? optionsLoad : options)[indexFocus] || haveCreateNew) || (e.code === "ArrowDown" || e.code === "ArrowUp") && (optionsLoad?.length ?? 0) === 0 && options.length === 0 || e.code === "Escape" && !(isClearable && value && !isDisabled))) {
698
702
  key = onKeyDown(e);
699
703
  }
700
704
  let flag = false;
@@ -703,11 +707,16 @@ var SelectTable = forwardRef((props, ref) => {
703
707
  handleAdd();
704
708
  flag = true;
705
709
  } else if (e.code === "Space") {
706
- const newItem = (optionsLoad ? optionsLoad : options)[indexFocus];
710
+ let newItem;
711
+ if (haveCreateNew && indexFocus === 0) {
712
+ newItem = { valueCreate: searchTerm, [fieldValue ?? "value"]: searchTerm, [fieldLabel ?? "label"]: `${t("reactTableEdit.Create")} '${searchTerm}'`, isCreated: true };
713
+ } else {
714
+ newItem = (optionsLoad ? optionsLoad : options)[indexFocus];
715
+ }
707
716
  if (dropdownOpen && newItem) {
708
- if ((optionsLoad ? optionsLoad : options)[indexFocus]) {
709
- handChange((optionsLoad ? optionsLoad : options)[indexFocus]);
710
- }
717
+ handChange(newItem);
718
+ handleOpenClose();
719
+ flag = true;
711
720
  }
712
721
  if (!searchTerm) {
713
722
  handleOpenClose();
@@ -720,14 +729,19 @@ var SelectTable = forwardRef((props, ref) => {
720
729
  flag = true;
721
730
  }
722
731
  } else if (e.code === "Enter" || e.code === "Tab" || e.code === "NumpadEnter") {
723
- const newItem = (optionsLoad ? optionsLoad : options)[indexFocus];
732
+ let newItem;
733
+ if (haveCreateNew && indexFocus === 0) {
734
+ newItem = { valueCreate: searchTerm, [fieldValue ?? "value"]: searchTerm, [fieldLabel ?? "label"]: `${t("reactTableEdit.Create")} '${searchTerm}'`, isCreated: true };
735
+ } else {
736
+ newItem = (optionsLoad ? optionsLoad : options)[indexFocus];
737
+ }
724
738
  if (dropdownOpen && newItem) {
725
739
  handChange(newItem);
726
740
  handleOpenClose();
727
741
  flag = true;
728
742
  }
729
743
  } else if (e.code === "ArrowDown") {
730
- if (dropdownOpen && ((optionsLoad?.length ?? 0) > 0 || options.length > 0)) {
744
+ if (dropdownOpen && ((optionsLoad?.length ?? 0) > 0 || options.length > 0 || haveCreateNew)) {
731
745
  let newIndex = 0;
732
746
  if (indexFocus >= 0) {
733
747
  newIndex = indexFocus + 1;
@@ -747,7 +761,7 @@ var SelectTable = forwardRef((props, ref) => {
747
761
  flag = true;
748
762
  }
749
763
  } else if (e.code === "ArrowUp") {
750
- if (dropdownOpen && ((optionsLoad?.length ?? 0) > 0 || options.length > 0)) {
764
+ if (dropdownOpen && ((optionsLoad?.length ?? 0) > 0 || options.length > 0 || haveCreateNew)) {
751
765
  let newIndex = 0;
752
766
  if (indexFocus >= 0) {
753
767
  newIndex = indexFocus - 1;
@@ -850,15 +864,14 @@ var SelectTable = forwardRef((props, ref) => {
850
864
  setIsLoading(false);
851
865
  setOptionsLoad(rs);
852
866
  };
853
- useEffect3(() => {
854
- if ((optionsLoad?.length ?? 0) === 0 && allowCreate && !isMulti && searchTerm) {
855
- setOptionsLoad([{ [fieldLabel ?? "label"]: `Create "${searchTerm}"`, [fieldValue ?? "value"]: searchTerm, isCreated: true }]);
856
- }
857
- }, [optionsLoad]);
858
867
  useEffect3(() => {
859
868
  if (!searchTerm) {
860
869
  setOptionsLoad(void 0);
870
+ } else if (allowCreate && !(optionsLoad ? optionsLoad : options)?.find((x) => x[fieldLabel ?? "label"] === searchTerm)) {
871
+ setHaveCreateNew(true);
872
+ return;
861
873
  }
874
+ setHaveCreateNew(false);
862
875
  }, [searchTerm]);
863
876
  const checkOverflow = (indexRow, indexCol) => {
864
877
  const element = document.getElementById(`select-${id}-${indexRow}-${indexCol}`);
@@ -1008,12 +1021,15 @@ var SelectTable = forwardRef((props, ref) => {
1008
1021
  return renderHeaderCol(col, index);
1009
1022
  })
1010
1023
  ] }) }),
1011
- (optionsLoad ? optionsLoad : options)?.length > 0 && !isLoading && /* @__PURE__ */ jsx5(Fragment6, { children: /* @__PURE__ */ jsx5("tbody", { className: "r-select-gridcontent", children: (optionsLoad ? optionsLoad : options)?.map((row, indexRow) => {
1012
- const isSelected = isMulti && value?.some((x) => x[fieldValue ?? "value"] === row[fieldValue ?? "value"]);
1013
- return /* @__PURE__ */ jsx5(RenderElement, { isSelected: isSelected ?? false, indexRow, row }, `select-table-${indexRow}`);
1014
- }) }) })
1024
+ (optionsLoad ? optionsLoad : options) && !isLoading && /* @__PURE__ */ jsx5(Fragment6, { children: /* @__PURE__ */ jsxs5("tbody", { className: "r-select-gridcontent", children: [
1025
+ haveCreateNew && /* @__PURE__ */ jsx5(RenderElement, { isSelected: false, indexRow: 0, row: { valueCreate: searchTerm, [fieldValue ?? "value"]: searchTerm, [fieldLabel ?? "label"]: `${t("reactTableEdit.Create")} '${searchTerm}'`, isCreated: true } }),
1026
+ (optionsLoad ? optionsLoad : options)?.map((row, indexRow) => {
1027
+ const isSelected = isMulti && value?.some((x) => x[fieldValue ?? "value"] === row[fieldValue ?? "value"]);
1028
+ return /* @__PURE__ */ jsx5(RenderElement, { isSelected: isSelected ?? false, indexRow: indexRow + (haveCreateNew ? 1 : 0), row }, `select-table-${indexRow}`);
1029
+ })
1030
+ ] }) })
1015
1031
  ] }),
1016
- ((optionsLoad ? optionsLoad : options)?.length ?? 0) === 0 && !isLoading && /* @__PURE__ */ jsxs5("div", { className: "r-no-data", children: [
1032
+ ((optionsLoad ? optionsLoad : options)?.length ?? 0) === 0 && !haveCreateNew && !isLoading && /* @__PURE__ */ jsxs5("div", { className: "r-no-data", children: [
1017
1033
  /* @__PURE__ */ jsx5("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxs5("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [
1018
1034
  /* @__PURE__ */ jsx5("ellipse", { fill: "#f5f5f5", cx: "32", cy: "33", rx: "32", ry: "7" }),
1019
1035
  /* @__PURE__ */ jsxs5("g", { fillRule: "nonzero", stroke: "#d9d9d9", children: [
@@ -1021,11 +1037,11 @@ var SelectTable = forwardRef((props, ref) => {
1021
1037
  /* @__PURE__ */ jsx5("path", { d: "M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z", fill: "#fafafa" })
1022
1038
  ] })
1023
1039
  ] }) }),
1024
- t("No data available.")
1040
+ t("reactTableEdit.No data available.")
1025
1041
  ] }),
1026
1042
  isLoading && /* @__PURE__ */ jsxs5("div", { className: "r-no-data", children: [
1027
1043
  /* @__PURE__ */ jsx5(Spinner, { className: "me-1", children: " " }),
1028
- t("Loading...")
1044
+ t("reactTableEdit.Loading...")
1029
1045
  ] })
1030
1046
  ] });
1031
1047
  };
@@ -1085,13 +1101,7 @@ var SelectTable = forwardRef((props, ref) => {
1085
1101
  } else {
1086
1102
  clearTimeout(timeOutElement);
1087
1103
  timeOutElement = setTimeout(() => {
1088
- const arr = [];
1089
- options.forEach((row) => {
1090
- if (checkSearch(val.target.value, row, columns ? columns : defaultColumns)) {
1091
- arr.push(row);
1092
- }
1093
- });
1094
- setOptionsLoad(arr);
1104
+ setOptionsLoad(options.filter((row) => checkSearch(val.target.value, row, columns ? columns : defaultColumns)));
1095
1105
  }, 500);
1096
1106
  }
1097
1107
  }
@@ -1148,7 +1158,7 @@ var SelectTable = forwardRef((props, ref) => {
1148
1158
  /* @__PURE__ */ jsxs5("div", { className: classnames3("r-select-footer", { "d-none": !(showFooter === true || handleAdd) }), children: [
1149
1159
  /* @__PURE__ */ jsxs5(Button, { outline: true, color: "primary", onClick: handleAdd, className: classnames3("r-btn d-flex align-items-center", { "d-none": !handleAdd }), children: [
1150
1160
  /* @__PURE__ */ jsx5(Plus, { className: "me-50", fontSize: 16 }),
1151
- t("AddNew"),
1161
+ t("reactTableEdit.AddNew"),
1152
1162
  " (F9)"
1153
1163
  ] }),
1154
1164
  footerComponent ? footerComponent() : null
@@ -1587,7 +1597,7 @@ var EditForm = forwardRef2((props, ref) => {
1587
1597
  closeMenu();
1588
1598
  }
1589
1599
  },
1590
- children: t("Clear")
1600
+ children: t("reactTableEdit.Clear")
1591
1601
  }
1592
1602
  ),
1593
1603
  /* @__PURE__ */ jsx7(
@@ -1602,7 +1612,7 @@ var EditForm = forwardRef2((props, ref) => {
1602
1612
  closeMenu();
1603
1613
  }
1604
1614
  },
1605
- children: t("Save")
1615
+ children: t("reactTableEdit.Save")
1606
1616
  }
1607
1617
  )
1608
1618
  ] }) : /* @__PURE__ */ jsx7(Fragment9, {})
@@ -1809,7 +1819,7 @@ var SidebarSetColumn = (props) => {
1809
1819
  const renderFooterButtons = () => {
1810
1820
  return /* @__PURE__ */ jsxs10(Fragment11, { children: [
1811
1821
  /* @__PURE__ */ jsx10(Button3, { color: "primary", onClick: handleSubmit, className: "me-1", children: t("Confirm") }),
1812
- /* @__PURE__ */ jsx10(Button3, { color: "secondary", onClick: handleCancel, outline: true, children: t("Close") })
1822
+ /* @__PURE__ */ jsx10(Button3, { color: "secondary", onClick: handleCancel, outline: true, children: t("reactTableEdit.Close") })
1813
1823
  ] });
1814
1824
  };
1815
1825
  const visibleTemplate = (item, index) => {
@@ -2100,12 +2110,12 @@ var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOpt
2100
2110
  },
2101
2111
  menuWidth: 90,
2102
2112
  width: 90,
2103
- placeholder: t("Select")
2113
+ placeholder: t("reactTableEdit.Select")
2104
2114
  }
2105
2115
  ) }),
2106
- /* @__PURE__ */ jsx11("span", { style: { display: "inline", marginLeft: 10, fontSize: 13 }, children: t("pagerDropDown") })
2116
+ /* @__PURE__ */ jsx11("span", { style: { display: "inline", marginLeft: 10, fontSize: 13 }, children: t("reactTableEdit.pagerDropDown") })
2107
2117
  ] }),
2108
- /* @__PURE__ */ jsx11("div", { className: "r-parentmsgbar", children: t("totalItemsInfo", { page: currentPage, countPage, totalItem }) })
2118
+ /* @__PURE__ */ jsx11("div", { className: "r-parentmsgbar", children: t("reactTableEdit.totalItemsInfo", { page: currentPage, countPage, totalItem }) })
2109
2119
  ] }) });
2110
2120
  };
2111
2121
 
@@ -2815,10 +2825,10 @@ var SelectTableTree = forwardRef3((props, ref) => {
2815
2825
  /* @__PURE__ */ jsxs14("div", { className: classnames8("r-select-footer", { "d-none": !(showFooter === true || handleAdd || isMulti) }), children: [
2816
2826
  /* @__PURE__ */ jsxs14(Button5, { outline: true, color: "primary", onClick: handleAdd, className: classnames8("r-btn d-flex align-items-center", { "d-none": !handleAdd }), children: [
2817
2827
  /* @__PURE__ */ jsx15(Plus3, { className: "me-50", fontSize: 16 }),
2818
- t("AddNew"),
2828
+ t("reactTableEdit.AddNew"),
2819
2829
  " (F9)"
2820
2830
  ] }),
2821
- isMulti && /* @__PURE__ */ jsx15("div", { className: "ms-50 text-primary h-100 d-flex align-items-center", onClick: handleAdd, children: t("countSelected", { item: value?.length ?? 0 }) }),
2831
+ isMulti && /* @__PURE__ */ jsx15("div", { className: "ms-50 text-primary h-100 d-flex align-items-center", onClick: handleAdd, children: t("reactTableEdit.countSelected", { item: value?.length ?? 0 }) }),
2822
2832
  footerComponent ? footerComponent() : null
2823
2833
  ] })
2824
2834
  ] })
@@ -3029,7 +3039,7 @@ var TableEdit = forwardRef4((props, ref) => {
3029
3039
  style: { width: "230px" },
3030
3040
  value: searchSetting?.searchTerm !== void 0 ? searchSetting?.searchTerm : searchTerm,
3031
3041
  setSearchTerm: searchSetting?.setSearchTerm ? searchSetting?.setSearchTerm : setSearchTerm,
3032
- placeholder: t("Search"),
3042
+ placeholder: t("reactTableEdit.Search"),
3033
3043
  onKeyPress: handleKeyPress
3034
3044
  }
3035
3045
  ) }) });
@@ -3154,7 +3164,7 @@ var TableEdit = forwardRef4((props, ref) => {
3154
3164
  columns: col.selectSettings?.columns,
3155
3165
  isClearable: col.selectSettings?.isClearable ?? false,
3156
3166
  formatSetting,
3157
- placeholder: t("Select"),
3167
+ placeholder: t("reactTableEdit.Select"),
3158
3168
  loadOptions: col.selectSettings?.loadOptions,
3159
3169
  handleAdd: col.selectSettings?.handAddNew ? (e) => col.selectSettings?.handAddNew(e, indexRow, row) : void 0,
3160
3170
  isMulti: col.selectSettings?.isMulti,
@@ -3241,7 +3251,7 @@ var TableEdit = forwardRef4((props, ref) => {
3241
3251
  columns: col.selectSettings?.columns,
3242
3252
  isClearable: col.selectSettings?.isClearable ?? false,
3243
3253
  formatSetting,
3244
- placeholder: t("Select"),
3254
+ placeholder: t("reactTableEdit.Select"),
3245
3255
  onOpenMenu: () => {
3246
3256
  if (col.selectSettings?.onOpenMenu) {
3247
3257
  col.selectSettings?.onOpenMenu(row, col, indexRow);
@@ -3711,7 +3721,7 @@ var TableEdit = forwardRef4((props, ref) => {
3711
3721
  column.callback(rs, currenRowIndex + indexRow);
3712
3722
  }
3713
3723
  } else {
3714
- notificationError(t("PasteExcelNotExist", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3724
+ notificationError(t("reactTableEdit.PasteExcelNotExist", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3715
3725
  }
3716
3726
  } else {
3717
3727
  if (column.editType === "date") {
@@ -3726,7 +3736,7 @@ var TableEdit = forwardRef4((props, ref) => {
3726
3736
  column.callback(date, currenRowIndex + indexRow);
3727
3737
  }
3728
3738
  } else {
3729
- notificationError(t("PasteExcelIncorrectFormat", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3739
+ notificationError(t("reactTableEdit.PasteExcelIncorrectFormat", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3730
3740
  }
3731
3741
  } else if (column.editType === "numeric") {
3732
3742
  const number = Number(stringData);
@@ -3740,7 +3750,7 @@ var TableEdit = forwardRef4((props, ref) => {
3740
3750
  column.callback(number, currenRowIndex + indexRow);
3741
3751
  }
3742
3752
  } else {
3743
- notificationError(t("PasteExcelIncorrectFormat", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3753
+ notificationError(t("reactTableEdit.PasteExcelIncorrectFormat", { index: currenRowIndex + indexRow + 1, field: t(column.headerText ?? ""), value: stringData }));
3744
3754
  }
3745
3755
  } else {
3746
3756
  if (column.onPaste) {
@@ -3853,7 +3863,7 @@ var TableEdit = forwardRef4((props, ref) => {
3853
3863
  onCopy: (e) => {
3854
3864
  if (!editDisable && (e.target.nodeName === "DIV" || e.target.nodeName === "TD")) {
3855
3865
  navigator.clipboard.writeText(JSON.stringify(row));
3856
- notificationSuccess(t("CopySuccessful"));
3866
+ notificationSuccess(t("reactTableEdit.CopySuccessful"));
3857
3867
  e.stopPropagation();
3858
3868
  }
3859
3869
  },
@@ -3865,7 +3875,7 @@ var TableEdit = forwardRef4((props, ref) => {
3865
3875
  dataSource[indexRow][fieldKey] = defaultValue[fieldKey];
3866
3876
  }
3867
3877
  changeDataSource(dataSource);
3868
- notificationSuccess(t("PasteSuccessful"));
3878
+ notificationSuccess(t("reactTableEdit.PasteSuccessful"));
3869
3879
  }).catch((ex) => {
3870
3880
  alert(ex);
3871
3881
  });
@@ -4071,15 +4081,15 @@ var TableEdit = forwardRef4((props, ref) => {
4071
4081
  const renderToolbarBottom = () => {
4072
4082
  return /* @__PURE__ */ jsx16("div", { id: "table_custom_bottom_toolbar", className: "r-toolbar r-toolbar-bottom", role: "toolbar", "aria-disabled": "false", "aria-haspopup": "false", "aria-orientation": "horizontal", children: /* @__PURE__ */ jsxs15("div", { className: "r-toolbar-items", children: [
4073
4083
  /* @__PURE__ */ jsxs15("div", { className: "r-toolbar-left", children: [
4074
- /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || addDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "success", outline: true, onClick: handleAdd, className: "d-flex", children: t("Add item") }) }),
4084
+ /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || addDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "success", outline: true, onClick: handleAdd, className: "d-flex", children: t("reactTableEdit.Add item") }) }),
4075
4085
  (indexFocus ?? -1) > -1 ? /* @__PURE__ */ jsxs15(Fragment21, { children: [
4076
4086
  /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.duplicateDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "success", outline: true, onClick: () => {
4077
4087
  handleDuplicate(dataSource[indexFocus ?? -1], indexFocus ?? -1);
4078
- }, className: "d-flex", children: t("Duplicate") }) }),
4079
- /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.insertBeforeDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "success", outline: true, onClick: handleInsertBefore, className: "d-flex", children: t("Insert item before") }) }),
4080
- /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.insertAfterDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "success", outline: true, onClick: handleInsertAfter, className: "d-flex", children: t("Insert item after") }) })
4088
+ }, className: "d-flex", children: t("reactTableEdit.Duplicate") }) }),
4089
+ /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.insertBeforeDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "success", outline: true, onClick: handleInsertBefore, className: "d-flex", children: t("reactTableEdit.Insert item before") }) }),
4090
+ /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || addDisable || buttonSetting?.insertAfterDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "success", outline: true, onClick: handleInsertAfter, className: "d-flex", children: t("reactTableEdit.Insert item after") }) })
4081
4091
  ] }) : /* @__PURE__ */ jsx16(Fragment21, { children: " " }),
4082
- /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || buttonSetting?.deleteAllDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "primary", outline: true, onClick: handleDeleteAll, className: "d-flex", children: t("Delete all item") }) }),
4092
+ /* @__PURE__ */ jsx16("div", { className: classnames9("r-toolbar-item", { "d-none": editDisable || buttonSetting?.deleteAllDisable }), "aria-disabled": "false", children: /* @__PURE__ */ jsx16(Button6, { color: "primary", outline: true, onClick: handleDeleteAll, className: "d-flex", children: t("reactTableEdit.Delete all item") }) }),
4083
4093
  toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
4084
4094
  return item.align === "left" ? /* @__PURE__ */ jsx16("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-left-${index}`) : "";
4085
4095
  })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-table-edit",
3
- "version": "1.2.41",
3
+ "version": "1.2.43",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",