react-table-edit 0.9.8 → 1.0.0

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 (5) hide show
  1. package/dist/index.d.mts +50 -3
  2. package/dist/index.d.ts +50 -3
  3. package/dist/index.js +9 -8
  4. package/dist/index.mjs +8 -8
  5. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -16,7 +16,7 @@ type IFColumnSelectTable = {
16
16
  maxWidth?: number;
17
17
  minWidth?: number;
18
18
  };
19
- type Props = {
19
+ type Props$1 = {
20
20
  id?: string;
21
21
  component?: any;
22
22
  footerComponent?: any;
@@ -46,7 +46,7 @@ type Props = {
46
46
  showFooter?: boolean;
47
47
  onPaste?: any;
48
48
  };
49
- declare const SelectTable: react__default.ForwardRefExoticComponent<Props & react__default.RefAttributes<unknown>>;
49
+ declare const SelectTable: react__default.ForwardRefExoticComponent<Props$1 & react__default.RefAttributes<unknown>>;
50
50
 
51
51
  type ITextAlign = 'center' | 'left' | 'right';
52
52
  type IEditType = 'text' | 'numeric' | 'datetime' | 'selectTree' | 'date' | 'select' | 'checkbox' | 'form' | 'color';
@@ -263,6 +263,53 @@ type IFDataProps = {
263
263
  };
264
264
  declare const TabsMenuComponent: ({ buttonWidth, tabParent, tabChild, resourceCodeParent, resources, resourceCode, windowSize, renderModal }: IFDataProps) => react_jsx_runtime.JSX.Element;
265
265
 
266
+ type IFColumnSelectTableTree = {
267
+ field: string;
268
+ headerText: string;
269
+ visible?: boolean;
270
+ textAlign?: 'left' | 'right' | 'center';
271
+ type?: 'text' | 'numeric' | 'date' | 'datetime';
272
+ template?: any;
273
+ typeCondition?: any;
274
+ fraction?: number;
275
+ width?: number;
276
+ maxWidth?: number;
277
+ minWidth?: number;
278
+ };
279
+ type Props = {
280
+ id?: string;
281
+ component?: any;
282
+ footerComponent?: any;
283
+ fieldValue?: string;
284
+ fieldLabel?: string;
285
+ onChange: any;
286
+ textAlign?: 'left' | 'right' | 'center';
287
+ placeholder?: string;
288
+ invalid?: any;
289
+ loadOptions?: any;
290
+ menuWidth?: number;
291
+ width?: number;
292
+ rowData?: any;
293
+ value: any;
294
+ onKeyDown?: any;
295
+ formatOptionLabel?: any;
296
+ handleAdd?: any;
297
+ options: any[];
298
+ isMulti?: boolean;
299
+ noHeader?: boolean;
300
+ maxHeight?: number;
301
+ columns?: IFColumnSelectTableTree[];
302
+ decimalSeparator?: string;
303
+ fieldChildren?: string;
304
+ thousandSeparator?: string;
305
+ isClearable?: boolean;
306
+ isDisabled?: boolean;
307
+ showFooter?: boolean;
308
+ selectChilds?: boolean;
309
+ onPaste?: any;
310
+ };
311
+ declare const SelectTableTree: react__default.ForwardRefExoticComponent<Props & react__default.RefAttributes<unknown>>;
312
+
266
313
  interface IFDataStyleSetting {
267
314
  color: string;
268
315
  backgroundColor: string;
@@ -286,4 +333,4 @@ interface IFDataInputStyle {
286
333
  }
287
334
  declare const InputStyleComponent: (props: IFDataInputStyle) => react_jsx_runtime.JSX.Element;
288
335
 
289
- export { type FromItemsField, type IColumnTable, type ICommandItem, type IFColumnSelectTable, type IFCurrentPage, type IFCurrentPageConfig, type IFPageSize, type IFTableEditButton, type IFTableEditPaging, type IFTableEditProps, type IFTableEditSearchSetting, type IFTableEditToolbar, type IFToolbarOptions, type IHeaderColumnTable, type ISettingFormElement, type ISettingNumericElement, type ISettingSelectElement, InputStyleComponent, SelectTable, TabsMenuComponent, TableEdit as default, formartNumberic, generateUUID, isNullOrUndefined, messageBoxConfirm, messageBoxConfirm2, messageBoxConfirmDelete, messageBoxError, messageHtmlBoxConfirm, messageHtmlBoxError, notificationError, notificationSuccess, objSymbolDecimal, objSymbolThousand, roundNumber, useOnClickOutside };
336
+ export { type FromItemsField, type IColumnTable, type ICommandItem, type IFColumnSelectTable, type IFColumnSelectTableTree, type IFCurrentPage, type IFCurrentPageConfig, type IFPageSize, type IFTableEditButton, type IFTableEditPaging, type IFTableEditProps, type IFTableEditSearchSetting, type IFTableEditToolbar, type IFToolbarOptions, type IHeaderColumnTable, type ISettingFormElement, type ISettingNumericElement, type ISettingSelectElement, InputStyleComponent, SelectTable, SelectTableTree, TabsMenuComponent, TableEdit as default, formartNumberic, generateUUID, isNullOrUndefined, messageBoxConfirm, messageBoxConfirm2, messageBoxConfirmDelete, messageBoxError, messageHtmlBoxConfirm, messageHtmlBoxError, notificationError, notificationSuccess, objSymbolDecimal, objSymbolThousand, roundNumber, useOnClickOutside };
package/dist/index.d.ts CHANGED
@@ -16,7 +16,7 @@ type IFColumnSelectTable = {
16
16
  maxWidth?: number;
17
17
  minWidth?: number;
18
18
  };
19
- type Props = {
19
+ type Props$1 = {
20
20
  id?: string;
21
21
  component?: any;
22
22
  footerComponent?: any;
@@ -46,7 +46,7 @@ type Props = {
46
46
  showFooter?: boolean;
47
47
  onPaste?: any;
48
48
  };
49
- declare const SelectTable: react__default.ForwardRefExoticComponent<Props & react__default.RefAttributes<unknown>>;
49
+ declare const SelectTable: react__default.ForwardRefExoticComponent<Props$1 & react__default.RefAttributes<unknown>>;
50
50
 
51
51
  type ITextAlign = 'center' | 'left' | 'right';
52
52
  type IEditType = 'text' | 'numeric' | 'datetime' | 'selectTree' | 'date' | 'select' | 'checkbox' | 'form' | 'color';
@@ -263,6 +263,53 @@ type IFDataProps = {
263
263
  };
264
264
  declare const TabsMenuComponent: ({ buttonWidth, tabParent, tabChild, resourceCodeParent, resources, resourceCode, windowSize, renderModal }: IFDataProps) => react_jsx_runtime.JSX.Element;
265
265
 
266
+ type IFColumnSelectTableTree = {
267
+ field: string;
268
+ headerText: string;
269
+ visible?: boolean;
270
+ textAlign?: 'left' | 'right' | 'center';
271
+ type?: 'text' | 'numeric' | 'date' | 'datetime';
272
+ template?: any;
273
+ typeCondition?: any;
274
+ fraction?: number;
275
+ width?: number;
276
+ maxWidth?: number;
277
+ minWidth?: number;
278
+ };
279
+ type Props = {
280
+ id?: string;
281
+ component?: any;
282
+ footerComponent?: any;
283
+ fieldValue?: string;
284
+ fieldLabel?: string;
285
+ onChange: any;
286
+ textAlign?: 'left' | 'right' | 'center';
287
+ placeholder?: string;
288
+ invalid?: any;
289
+ loadOptions?: any;
290
+ menuWidth?: number;
291
+ width?: number;
292
+ rowData?: any;
293
+ value: any;
294
+ onKeyDown?: any;
295
+ formatOptionLabel?: any;
296
+ handleAdd?: any;
297
+ options: any[];
298
+ isMulti?: boolean;
299
+ noHeader?: boolean;
300
+ maxHeight?: number;
301
+ columns?: IFColumnSelectTableTree[];
302
+ decimalSeparator?: string;
303
+ fieldChildren?: string;
304
+ thousandSeparator?: string;
305
+ isClearable?: boolean;
306
+ isDisabled?: boolean;
307
+ showFooter?: boolean;
308
+ selectChilds?: boolean;
309
+ onPaste?: any;
310
+ };
311
+ declare const SelectTableTree: react__default.ForwardRefExoticComponent<Props & react__default.RefAttributes<unknown>>;
312
+
266
313
  interface IFDataStyleSetting {
267
314
  color: string;
268
315
  backgroundColor: string;
@@ -286,4 +333,4 @@ interface IFDataInputStyle {
286
333
  }
287
334
  declare const InputStyleComponent: (props: IFDataInputStyle) => react_jsx_runtime.JSX.Element;
288
335
 
289
- export { type FromItemsField, type IColumnTable, type ICommandItem, type IFColumnSelectTable, type IFCurrentPage, type IFCurrentPageConfig, type IFPageSize, type IFTableEditButton, type IFTableEditPaging, type IFTableEditProps, type IFTableEditSearchSetting, type IFTableEditToolbar, type IFToolbarOptions, type IHeaderColumnTable, type ISettingFormElement, type ISettingNumericElement, type ISettingSelectElement, InputStyleComponent, SelectTable, TabsMenuComponent, TableEdit as default, formartNumberic, generateUUID, isNullOrUndefined, messageBoxConfirm, messageBoxConfirm2, messageBoxConfirmDelete, messageBoxError, messageHtmlBoxConfirm, messageHtmlBoxError, notificationError, notificationSuccess, objSymbolDecimal, objSymbolThousand, roundNumber, useOnClickOutside };
336
+ export { type FromItemsField, type IColumnTable, type ICommandItem, type IFColumnSelectTable, type IFColumnSelectTableTree, type IFCurrentPage, type IFCurrentPageConfig, type IFPageSize, type IFTableEditButton, type IFTableEditPaging, type IFTableEditProps, type IFTableEditSearchSetting, type IFTableEditToolbar, type IFToolbarOptions, type IHeaderColumnTable, type ISettingFormElement, type ISettingNumericElement, type ISettingSelectElement, InputStyleComponent, SelectTable, SelectTableTree, TabsMenuComponent, TableEdit as default, formartNumberic, generateUUID, isNullOrUndefined, messageBoxConfirm, messageBoxConfirm2, messageBoxConfirmDelete, messageBoxError, messageHtmlBoxConfirm, messageHtmlBoxError, notificationError, notificationSuccess, objSymbolDecimal, objSymbolThousand, roundNumber, useOnClickOutside };
package/dist/index.js CHANGED
@@ -32,6 +32,7 @@ var Table_edit_exports = {};
32
32
  __export(Table_edit_exports, {
33
33
  InputStyleComponent: () => InputStyleComponent,
34
34
  SelectTable: () => SelectTable,
35
+ SelectTableTree: () => SelectTableTree,
35
36
  TabsMenuComponent: () => TabsMenuComponent,
36
37
  default: () => Table_edit_default,
37
38
  formartNumberic: () => formartNumberic,
@@ -1045,7 +1046,7 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
1045
1046
  e.preventDefault();
1046
1047
  },
1047
1048
  tag: "div",
1048
- style: { width: width ? width : "100%" },
1049
+ style: { width: "100%" },
1049
1050
  className: (0, import_classnames4.default)("select-table-control", { "r-select-is-disabled": isDisabled }, { "r-select-is-open": dropdownOpen }, { "r-select-is-focus": isFocus }, { "r-select-is-invalid": invalid }),
1050
1051
  children: [
1051
1052
  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "select-table-container", children: [
@@ -1108,7 +1109,7 @@ var SelectTable = (0, import_react6.forwardRef)((props, ref) => {
1108
1109
  container: component,
1109
1110
  className: "formula-dropdown icon-dropdown p-0",
1110
1111
  style: {
1111
- width: "min-content",
1112
+ width: width ? width + 2 : "min-content",
1112
1113
  position: "fixed",
1113
1114
  borderRadius: 3,
1114
1115
  zIndex: 9999
@@ -2518,8 +2519,7 @@ var SelectTableTree = (0, import_react15.forwardRef)((props, ref) => {
2518
2519
  type: "checkbox",
2519
2520
  className: "cursor-pointer",
2520
2521
  onChange: () => {
2521
- },
2522
- style: { textAlign: "center" }
2522
+ }
2523
2523
  }
2524
2524
  )
2525
2525
  ]
@@ -2612,7 +2612,7 @@ var SelectTableTree = (0, import_react15.forwardRef)((props, ref) => {
2612
2612
  ),
2613
2613
  row[fieldChildren ?? "children"] && row.expanded && row[fieldChildren ?? "children"].map((child, indexChild) => {
2614
2614
  if (checkSearch(searchTerm, child, columns ? columns : defaultColumns)) {
2615
- const isSelectedChild = isMulti ? value?.some((x) => x === child[fieldValue ?? "value"]) : value[fieldValue ?? "value"] === child[fieldValue ?? "value"];
2615
+ const isSelectedChild = value && (isMulti ? value?.some((x) => x === child[fieldValue ?? "value"]) : value[fieldValue ?? "value"] === child[fieldValue ?? "value"]);
2616
2616
  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(RenderElement, { isSelected: isSelectedChild, indexRow: indexChild, row: child, level: level + 1 }, `select-table-${indexRow}-${indexChild}`);
2617
2617
  }
2618
2618
  })
@@ -2664,7 +2664,7 @@ var SelectTableTree = (0, import_react15.forwardRef)((props, ref) => {
2664
2664
  ] }) }),
2665
2665
  options.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("tbody", { className: "r-select-gridcontent", children: options?.map((row, indexRow) => {
2666
2666
  if (checkSearch(searchTerm, row, columns ? columns : defaultColumns)) {
2667
- const isSelected = isMulti ? value?.some((x) => x === row[fieldValue ?? "value"]) : value[fieldValue ?? "value"] === row[fieldValue ?? "value"];
2667
+ const isSelected = value && (isMulti ? value?.some((x) => x === row[fieldValue ?? "value"]) : value[fieldValue ?? "value"] === row[fieldValue ?? "value"]);
2668
2668
  countDisplay++;
2669
2669
  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(RenderElement, { isSelected, indexRow, row }, `select-table-${indexRow}`);
2670
2670
  }
@@ -3139,7 +3139,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3139
3139
  options: optionsSelect,
3140
3140
  rowData: row,
3141
3141
  onChange: (val) => {
3142
- if (isMulti) {
3142
+ if (col.selectSettings?.isMulti) {
3143
3143
  row[col.field] = !isNullOrUndefined(val) ? val : [];
3144
3144
  } else {
3145
3145
  row[col.field] = !isNullOrUndefined(val) ? val[col.selectSettings?.fieldValue ?? "value"] : void 0;
@@ -3222,7 +3222,7 @@ var TableEdit = (0, import_react16.forwardRef)((props, ref) => {
3222
3222
  options: optionsSelectTree,
3223
3223
  rowData: row,
3224
3224
  onChange: (val) => {
3225
- if (isMulti) {
3225
+ if (col.selectSettings?.isMulti) {
3226
3226
  row[col.field] = !isNullOrUndefined(val) ? val : [];
3227
3227
  } else {
3228
3228
  row[col.field] = !isNullOrUndefined(val) ? val[col.selectSettings?.fieldValue ?? "value"] : void 0;
@@ -5389,6 +5389,7 @@ var Table_edit_default = table_default;
5389
5389
  0 && (module.exports = {
5390
5390
  InputStyleComponent,
5391
5391
  SelectTable,
5392
+ SelectTableTree,
5392
5393
  TabsMenuComponent,
5393
5394
  formartNumberic,
5394
5395
  generateUUID,
package/dist/index.mjs CHANGED
@@ -1009,7 +1009,7 @@ var SelectTable = forwardRef((props, ref) => {
1009
1009
  e.preventDefault();
1010
1010
  },
1011
1011
  tag: "div",
1012
- style: { width: width ? width : "100%" },
1012
+ style: { width: "100%" },
1013
1013
  className: classnames3("select-table-control", { "r-select-is-disabled": isDisabled }, { "r-select-is-open": dropdownOpen }, { "r-select-is-focus": isFocus }, { "r-select-is-invalid": invalid }),
1014
1014
  children: [
1015
1015
  /* @__PURE__ */ jsxs5("div", { className: "select-table-container", children: [
@@ -1072,7 +1072,7 @@ var SelectTable = forwardRef((props, ref) => {
1072
1072
  container: component,
1073
1073
  className: "formula-dropdown icon-dropdown p-0",
1074
1074
  style: {
1075
- width: "min-content",
1075
+ width: width ? width + 2 : "min-content",
1076
1076
  position: "fixed",
1077
1077
  borderRadius: 3,
1078
1078
  zIndex: 9999
@@ -2490,8 +2490,7 @@ var SelectTableTree = forwardRef3((props, ref) => {
2490
2490
  type: "checkbox",
2491
2491
  className: "cursor-pointer",
2492
2492
  onChange: () => {
2493
- },
2494
- style: { textAlign: "center" }
2493
+ }
2495
2494
  }
2496
2495
  )
2497
2496
  ]
@@ -2584,7 +2583,7 @@ var SelectTableTree = forwardRef3((props, ref) => {
2584
2583
  ),
2585
2584
  row[fieldChildren ?? "children"] && row.expanded && row[fieldChildren ?? "children"].map((child, indexChild) => {
2586
2585
  if (checkSearch(searchTerm, child, columns ? columns : defaultColumns)) {
2587
- const isSelectedChild = isMulti ? value?.some((x) => x === child[fieldValue ?? "value"]) : value[fieldValue ?? "value"] === child[fieldValue ?? "value"];
2586
+ const isSelectedChild = value && (isMulti ? value?.some((x) => x === child[fieldValue ?? "value"]) : value[fieldValue ?? "value"] === child[fieldValue ?? "value"]);
2588
2587
  return /* @__PURE__ */ jsx15(RenderElement, { isSelected: isSelectedChild, indexRow: indexChild, row: child, level: level + 1 }, `select-table-${indexRow}-${indexChild}`);
2589
2588
  }
2590
2589
  })
@@ -2636,7 +2635,7 @@ var SelectTableTree = forwardRef3((props, ref) => {
2636
2635
  ] }) }),
2637
2636
  options.length > 0 && /* @__PURE__ */ jsx15(Fragment18, { children: /* @__PURE__ */ jsx15("tbody", { className: "r-select-gridcontent", children: options?.map((row, indexRow) => {
2638
2637
  if (checkSearch(searchTerm, row, columns ? columns : defaultColumns)) {
2639
- const isSelected = isMulti ? value?.some((x) => x === row[fieldValue ?? "value"]) : value[fieldValue ?? "value"] === row[fieldValue ?? "value"];
2638
+ const isSelected = value && (isMulti ? value?.some((x) => x === row[fieldValue ?? "value"]) : value[fieldValue ?? "value"] === row[fieldValue ?? "value"]);
2640
2639
  countDisplay++;
2641
2640
  return /* @__PURE__ */ jsx15(RenderElement, { isSelected, indexRow, row }, `select-table-${indexRow}`);
2642
2641
  }
@@ -3111,7 +3110,7 @@ var TableEdit = forwardRef4((props, ref) => {
3111
3110
  options: optionsSelect,
3112
3111
  rowData: row,
3113
3112
  onChange: (val) => {
3114
- if (isMulti) {
3113
+ if (col.selectSettings?.isMulti) {
3115
3114
  row[col.field] = !isNullOrUndefined(val) ? val : [];
3116
3115
  } else {
3117
3116
  row[col.field] = !isNullOrUndefined(val) ? val[col.selectSettings?.fieldValue ?? "value"] : void 0;
@@ -3194,7 +3193,7 @@ var TableEdit = forwardRef4((props, ref) => {
3194
3193
  options: optionsSelectTree,
3195
3194
  rowData: row,
3196
3195
  onChange: (val) => {
3197
- if (isMulti) {
3196
+ if (col.selectSettings?.isMulti) {
3198
3197
  row[col.field] = !isNullOrUndefined(val) ? val : [];
3199
3198
  } else {
3200
3199
  row[col.field] = !isNullOrUndefined(val) ? val[col.selectSettings?.fieldValue ?? "value"] : void 0;
@@ -5360,6 +5359,7 @@ var Table_edit_default = table_default;
5360
5359
  export {
5361
5360
  InputStyleComponent,
5362
5361
  SelectTable,
5362
+ SelectTableTree,
5363
5363
  TabsMenuComponent,
5364
5364
  Table_edit_default as default,
5365
5365
  formartNumberic,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "react-table-edit",
3
3
  "license": "MIT",
4
- "version": "0.9.8",
4
+ "version": "1.0.0",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
7
7
  "types": "dist/index.d.ts",