react-table-edit 1.4.35 → 1.4.36
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.
- package/dist/component/select-table/index.d.ts +1 -0
- package/dist/component/type/index.d.ts +3 -1
- package/dist/index.d.ts +3 -0
- package/dist/index.js +12 -12
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +12 -12
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -17821,7 +17821,7 @@ const TextInput = (props) => {
|
|
|
17821
17821
|
|
|
17822
17822
|
const defaultMaxHeight$1 = 250;
|
|
17823
17823
|
const SelectTable = forwardRef((props, ref) => {
|
|
17824
|
-
const { id, menuWidth, width, invalid, placeholder, textAlign, options, columns, value, fieldValue, fieldLabel, maxHeight, isClearable, component, isMulti, noHeader, isDisabled, showFooter, formatSetting, allowCreate, onPaste, onChange, handleAdd, onKeyDown, onOpenMenu, loadOptions, onCloseMenu, footerComponent, formatOptionLabel } = props;
|
|
17824
|
+
const { id, menuWidth, width, invalid, placeholder, textAlign, options, columns, value, fieldValue, fieldLabel, maxHeight, isClearable, component, isMulti, noHeader, isDisabled, showFooter, formatSetting, allowCreate, onPaste, onChange, handleAdd, onKeyDown, onOpenMenu, loadOptions, onCloseMenu, footerComponent, formatOptionLabel, compareFunction } = props;
|
|
17825
17825
|
const selectTableRef = useRef(null);
|
|
17826
17826
|
const selectMenuTableRef = useRef(null);
|
|
17827
17827
|
const inputRef = useRef(null);
|
|
@@ -17860,7 +17860,7 @@ const SelectTable = forwardRef((props, ref) => {
|
|
|
17860
17860
|
};
|
|
17861
17861
|
useEffect(() => {
|
|
17862
17862
|
if (dropdownOpen && value && !isMulti && selectMenuTableRef) {
|
|
17863
|
-
const index = (optionsLoad ? optionsLoad : options)?.findIndex((
|
|
17863
|
+
const index = (optionsLoad ? optionsLoad : options)?.findIndex((row) => (compareFunction ? compareFunction(row) : row[fieldValue ?? 'value'] === value[fieldValue ?? 'value']));
|
|
17864
17864
|
if (index >= 0) {
|
|
17865
17865
|
selectMenuTableRef.current.scrollTo({ top: (index - 1) * 30 });
|
|
17866
17866
|
}
|
|
@@ -17967,7 +17967,7 @@ const SelectTable = forwardRef((props, ref) => {
|
|
|
17967
17967
|
newIndex = indexFocus + 1;
|
|
17968
17968
|
}
|
|
17969
17969
|
else if (value) {
|
|
17970
|
-
newIndex = (optionsLoad ? optionsLoad : options)?.findIndex((
|
|
17970
|
+
newIndex = (optionsLoad ? optionsLoad : options)?.findIndex((row) => (compareFunction ? compareFunction(row) : row[fieldValue ?? 'value'] === value[fieldValue ?? 'value'])) + 1;
|
|
17971
17971
|
}
|
|
17972
17972
|
if (newIndex < (optionsLoad ? optionsLoad : options).length) {
|
|
17973
17973
|
setIndexFocus(newIndex);
|
|
@@ -17991,7 +17991,7 @@ const SelectTable = forwardRef((props, ref) => {
|
|
|
17991
17991
|
newIndex = indexFocus - 1;
|
|
17992
17992
|
}
|
|
17993
17993
|
else if (value) {
|
|
17994
|
-
newIndex = (optionsLoad ? optionsLoad : options)?.findIndex((
|
|
17994
|
+
newIndex = (optionsLoad ? optionsLoad : options)?.findIndex((row) => (compareFunction ? compareFunction(row) : row[fieldValue ?? 'value'] === value[fieldValue ?? 'value'])) - 1;
|
|
17995
17995
|
}
|
|
17996
17996
|
if (newIndex >= 0) {
|
|
17997
17997
|
setIndexFocus(newIndex);
|
|
@@ -18087,9 +18087,9 @@ const SelectTable = forwardRef((props, ref) => {
|
|
|
18087
18087
|
};
|
|
18088
18088
|
const RenderElement = React__default.memo((props) => {
|
|
18089
18089
|
const { indexRow, row, isSelected, level = 0 } = props;
|
|
18090
|
-
return (jsxs("tr", { id: `row-select-table-${indexRow}`, style: { paddingLeft: 10 * level }, className: classNames$2('r-select-row', { 'last-row': indexRow === (optionsLoad ? optionsLoad : options).length - 1 }, { 'fisrt-row': indexRow === 0 }), children: [isMulti && jsx("td", { className: classNames$2(`r-select-rowcell`, { 'r-select-move': indexFocus === indexRow, 'r-select-active': !isMulti && value && value[fieldValue ?? 'value'] === row[fieldValue ?? 'value'] }), style: { width: 40, textAlign: 'center', padding: 0, paddingBottom: 6 }, onClick: (e) => {
|
|
18090
|
+
return (jsxs("tr", { id: `row-select-table-${indexRow}`, style: { paddingLeft: 10 * level }, className: classNames$2('r-select-row', { 'last-row': indexRow === (optionsLoad ? optionsLoad : options).length - 1 }, { 'fisrt-row': indexRow === 0 }), children: [isMulti && jsx("td", { className: classNames$2(`r-select-rowcell`, { 'r-select-move': indexFocus === indexRow, 'r-select-active': !isMulti && value && (compareFunction ? compareFunction(row) : value[fieldValue ?? 'value'] === row[fieldValue ?? 'value']) }), style: { width: 40, textAlign: 'center', padding: 0, paddingBottom: 6 }, onClick: (e) => {
|
|
18091
18091
|
if (isMulti) {
|
|
18092
|
-
const index = value?.findIndex((x) => x[fieldValue ?? 'value'] === row[fieldValue ?? 'value']);
|
|
18092
|
+
const index = value?.findIndex((x) => (compareFunction ? compareFunction(row) : x[fieldValue ?? 'value'] === row[fieldValue ?? 'value']));
|
|
18093
18093
|
if (index > -1) {
|
|
18094
18094
|
value?.splice(index, 1);
|
|
18095
18095
|
handChange([...value]);
|
|
@@ -18118,14 +18118,14 @@ const SelectTable = forwardRef((props, ref) => {
|
|
|
18118
18118
|
}
|
|
18119
18119
|
return (jsxs(Fragment, { children: [col.visible !== false && jsx("td", { id: `select-${id}-${indexRow}-${indexCol}`,
|
|
18120
18120
|
// ref={refRow}
|
|
18121
|
-
className: classNames$2(`r-select-rowcell`, { 'r-select-move': indexFocus === indexRow, 'r-select-active': !isMulti && value && value[fieldValue ?? 'value'] === row[fieldValue ?? 'value'] }), style: {
|
|
18121
|
+
className: classNames$2(`r-select-rowcell`, { 'r-select-move': indexFocus === indexRow, 'r-select-active': !isMulti && value && (compareFunction ? compareFunction(row) : value[fieldValue ?? 'value'] === row[fieldValue ?? 'value']) }), style: {
|
|
18122
18122
|
minWidth: col.minWidth,
|
|
18123
18123
|
width: col.width,
|
|
18124
18124
|
maxWidth: col.maxWidth,
|
|
18125
18125
|
textAlign: col.textAlign ? col.textAlign : 'left'
|
|
18126
18126
|
}, onClick: (e) => {
|
|
18127
18127
|
if (isMulti) {
|
|
18128
|
-
const index = value?.findIndex((x) => x[fieldValue ?? 'value'] === row[fieldValue ?? 'value']);
|
|
18128
|
+
const index = value?.findIndex((x) => (compareFunction ? compareFunction(row) : x[fieldValue ?? 'value'] === row[fieldValue ?? 'value']));
|
|
18129
18129
|
if (index > -1) {
|
|
18130
18130
|
value?.splice(index, 1);
|
|
18131
18131
|
handChange([...value]);
|
|
@@ -18170,7 +18170,7 @@ const SelectTable = forwardRef((props, ref) => {
|
|
|
18170
18170
|
}, readOnly: true, className: classNames$2('cursor-pointer', { 'd-none': !isMulti }), style: { textAlign: 'center', marginTop: 6 } }) }) }), (columns ? columns : defaultColumns).map((col, index) => {
|
|
18171
18171
|
return (renderHeaderCol(col, index));
|
|
18172
18172
|
})] }) }), ((optionsLoad ? optionsLoad : options) && !isLoading) && jsx(Fragment$1, { children: jsxs("tbody", { className: 'r-select-gridcontent', children: [haveCreateNew && jsx(RenderElement, { isSelected: false, indexRow: 0, row: { valueCreate: searchTerm, [fieldValue ?? "value"]: searchTerm, [fieldLabel ?? "label"]: `${t('Create')} '${searchTerm}'`, isCreated: true } }), (optionsLoad ? optionsLoad : options)?.map((row, indexRow) => {
|
|
18173
|
-
const isSelected = isMulti && value?.some((x) => x[fieldValue ?? 'value'] === row[fieldValue ?? 'value']);
|
|
18173
|
+
const isSelected = isMulti && value?.some((x) => (compareFunction ? compareFunction(row) : x[fieldValue ?? 'value'] === row[fieldValue ?? 'value']));
|
|
18174
18174
|
return (jsx(RenderElement, { isSelected: isSelected ?? false, indexRow: indexRow + (haveCreateNew ? 1 : 0), row: row }, `select-table-${indexRow}`));
|
|
18175
18175
|
})] }) })] }), ((((optionsLoad ? optionsLoad : options)?.length ?? 0) === 0) && !haveCreateNew && !isLoading) && jsxs("div", { className: "r-no-data", children: [jsx("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: jsxs("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [jsx("ellipse", { fill: "#f5f5f5", cx: "32", cy: "33", rx: "32", ry: "7" }), jsxs("g", { fillRule: "nonzero", stroke: "#d9d9d9", children: [jsx("path", { d: "M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" }), 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" })] })] }) }), t('No data available.')] }), isLoading && jsxs("div", { className: "r-no-data", children: [jsx(Spinner$1, { className: "me-1", children: " " }), t('Loading...')] })] }));
|
|
18176
18176
|
};
|
|
@@ -42912,10 +42912,10 @@ const TableEdit = forwardRef((props, ref) => {
|
|
|
42912
42912
|
optionsSelect = col.selectSettings?.options ? (col.selectSettings?.validateOption ? col.selectSettings?.options.filter((item) => col.selectSettings?.validateOption(item, row)) : col.selectSettings?.options) : [];
|
|
42913
42913
|
}
|
|
42914
42914
|
if (col.selectSettings?.isMulti) {
|
|
42915
|
-
valueSelect = optionsSelect.filter((x) => row[col.field].some((y) => x[col.selectSettings?.fieldValue ?? 'value'] === y));
|
|
42915
|
+
valueSelect = optionsSelect.filter((x) => row[col.field].some((y) => col.selectSettings?.compareFunction ? col.selectSettings.compareFunction(x, row) : x[col.selectSettings?.fieldValue ?? 'value'] === y));
|
|
42916
42916
|
}
|
|
42917
42917
|
else {
|
|
42918
|
-
valueSelect = (!isNullOrUndefined(row[col.field]) && row[col.field] !== '') ? optionsSelect?.find((val) => val[col.selectSettings?.fieldValue ?? 'value'] === row[col.field]) : '';
|
|
42918
|
+
valueSelect = (!isNullOrUndefined(row[col.field]) && row[col.field] !== '') ? optionsSelect?.find((val) => col.selectSettings?.compareFunction ? col.selectSettings.compareFunction(val, row) : val[col.selectSettings?.fieldValue ?? 'value'] === row[col.field]) : '';
|
|
42919
42919
|
if (!valueSelect && col.selectSettings?.defaultValue) {
|
|
42920
42920
|
valueSelect = col.selectSettings?.defaultValue(row);
|
|
42921
42921
|
}
|
|
@@ -42945,7 +42945,7 @@ const TableEdit = forwardRef((props, ref) => {
|
|
|
42945
42945
|
col.callback(val, indexRow, row);
|
|
42946
42946
|
}
|
|
42947
42947
|
handleDataChange(row, col, indexRow);
|
|
42948
|
-
}, fieldValue: col.selectSettings?.fieldValue, fieldLabel: col.selectSettings?.fieldLabel, component: gridRef, columns: col.selectSettings?.columns, isClearable: col.selectSettings?.isClearable ?? false, formatSetting: formatSetting, placeholder: t('Select'), loadOptions: col.selectSettings?.loadOptions, handleAdd: col.selectSettings?.handAddNew ? (e) => col.selectSettings?.handAddNew(e, indexRow, row) : undefined, isMulti: col.selectSettings?.isMulti, noHeader: col.selectSettings?.noHeader, showFooter: col.selectSettings?.showFooter, formatOptionLabel: col.selectSettings?.formatOptionLabel, footerComponent: col.selectSettings?.footerComponent, invalid: (col.validate && !isNullOrUndefined(col.validate(row[col.field], row))), maxHeight: col.selectSettings?.heightPopup ? Number(col.selectSettings?.heightPopup) : undefined, menuWidth: col.selectSettings?.widthPopup ? Number(col.selectSettings?.widthPopup) : undefined, textAlign: col.textAlign ?? 'left', allowCreate: col.selectSettings?.allowCreate, onKeyDown: (e) => {
|
|
42948
|
+
}, fieldValue: col.selectSettings?.fieldValue, fieldLabel: col.selectSettings?.fieldLabel, component: gridRef, columns: col.selectSettings?.columns, isClearable: col.selectSettings?.isClearable ?? false, formatSetting: formatSetting, placeholder: t('Select'), loadOptions: col.selectSettings?.loadOptions, handleAdd: col.selectSettings?.handAddNew ? (e) => col.selectSettings?.handAddNew(e, indexRow, row) : undefined, isMulti: col.selectSettings?.isMulti, noHeader: col.selectSettings?.noHeader, showFooter: col.selectSettings?.showFooter, formatOptionLabel: col.selectSettings?.formatOptionLabel, footerComponent: col.selectSettings?.footerComponent, invalid: (col.validate && !isNullOrUndefined(col.validate(row[col.field], row))), maxHeight: col.selectSettings?.heightPopup ? Number(col.selectSettings?.heightPopup) : undefined, menuWidth: col.selectSettings?.widthPopup ? Number(col.selectSettings?.widthPopup) : undefined, textAlign: col.textAlign ?? 'left', allowCreate: col.selectSettings?.allowCreate, compareFunction: (e) => col.selectSettings?.compareFunction?.(e, row), onKeyDown: (e) => {
|
|
42949
42949
|
return checkKeyDown(e, row, col, indexRow + 1, indexCol + 1);
|
|
42950
42950
|
}, onOpenMenu: () => {
|
|
42951
42951
|
if (col.selectSettings?.onOpenMenu) {
|