react-table-edit 1.5.23 → 1.5.24
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/table/gourp-col.d.ts +5 -3
- package/dist/component/table/header.d.ts +4 -2
- package/dist/component/table-view/content.d.ts +4 -2
- package/dist/index.js +11 -11
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +11 -11
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -36777,9 +36777,9 @@ const FooterCol = ({ col, indexCol, dataSource, objWidthFix, formatSetting }) =>
|
|
|
36777
36777
|
}, children: jsx("div", { className: "r-footer-div", children: col.haveSum === true && col.type === "numeric" && (jsx(Fragment$1, { children: Number(sumValue) >= 0 ? (jsx(Fragment$1, { children: formartNumberic(sumValue, formatSetting?.decimalSeparator ?? ",", formatSetting?.thousandSeparator ?? ".", col.numericSettings?.fraction, true, false) })) : (jsx("div", { style: { color: formatSetting?.colorNegative ?? "red" }, children: `${formatSetting?.prefixNegative ?? "-"}${formartNumberic(sumValue, formatSetting?.decimalSeparator ?? ",", formatSetting?.thousandSeparator ?? ".", col.numericSettings?.fraction, true, false)}${formatSetting?.suffixNegative ?? ""}` })) })) }) })) }, `summarycell-${indexCol}`));
|
|
36778
36778
|
};
|
|
36779
36779
|
|
|
36780
|
-
const RenderColGroup = ({ contentColumns,
|
|
36780
|
+
const RenderColGroup = ({ contentColumns, groupSetting }) => (jsx("colgroup", { children: contentColumns.map((col, index) => {
|
|
36781
36781
|
return (col.visible !== false &&
|
|
36782
|
-
(visibleGroupColumn || !groupColumns?.includes(col.field)) && (jsx("col", { style: {
|
|
36782
|
+
(groupSetting?.visibleGroupColumn || !groupSetting?.groupColumns?.includes(col.field)) && (jsx("col", { style: {
|
|
36783
36783
|
width: typeof col.width === 'number' ? `${col.width}px` : col.width || undefined,
|
|
36784
36784
|
minWidth: typeof col.minWidth === 'number' ? `${col.minWidth}px` : col.minWidth || undefined,
|
|
36785
36785
|
maxWidth: typeof col.maxWidth === 'number' ? `${col.maxWidth}px` : col.maxWidth || undefined
|
|
@@ -38958,7 +38958,7 @@ const DateRangeFilterComponent = ({ fieldFilter, filterBy, handleSave }) => {
|
|
|
38958
38958
|
};
|
|
38959
38959
|
|
|
38960
38960
|
const HeaderTableCol = (props) => {
|
|
38961
|
-
const { selectEnable, dataSource, setSelectedRows, col, indexCol, indexParent, objHeaderWidthFixLeft, objHeaderWidthFixRight, totalCount, selectedRows, columns, orderBy, changeFilter, filterBy, changeOrder, allowFiltering, allowSorting, container, fisrtObjWidthFixRight, lastObjWidthFixLeft, setContentColumns, formatSetting, optionsFilter, idTable, isMulti,
|
|
38961
|
+
const { selectEnable, dataSource, setSelectedRows, col, indexCol, indexParent, objHeaderWidthFixLeft, objHeaderWidthFixRight, totalCount, selectedRows, columns, orderBy, changeFilter, filterBy, changeOrder, allowFiltering, allowSorting, container, fisrtObjWidthFixRight, lastObjWidthFixLeft, setContentColumns, formatSetting, optionsFilter, idTable, isMulti, groupSetting } = props;
|
|
38962
38962
|
const { t } = useTranslation();
|
|
38963
38963
|
const headerRef = useRef(null);
|
|
38964
38964
|
const order = orderBy.find((item) => item.key === col.field);
|
|
@@ -38977,7 +38977,7 @@ const HeaderTableCol = (props) => {
|
|
|
38977
38977
|
const checkOverflow = () => {
|
|
38978
38978
|
return headerRef.current && headerRef.current.scrollHeight > headerRef.current.clientHeight;
|
|
38979
38979
|
};
|
|
38980
|
-
return (jsx(Fragment, { children: col.visible !== false && (visibleGroupColumn || !groupColumns?.includes(col.field)) && (jsx(Resizable, { className: "r-resize", width: typeof col.width === 'number' ? col.width : Number((col.width ?? '').replaceAll(new RegExp(`[^0-9]`, 'g'), '')), height: 0, onResize: handleResize, draggableOpts: { enableUserSelectHack: true }, children: jsx("th", { rowSpan: col.rowspan !== 1 ? col.rowspan : 1, colSpan: col.columns?.filter((x) => x.visible !== false)?.length ?? 1, className: classNames$1(`r-headercell fix-${col.fixedType}`, { 'fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'cell-fixed': col.fixedType }), style: {
|
|
38980
|
+
return (jsx(Fragment, { children: col.visible !== false && (groupSetting?.visibleGroupColumn || !groupSetting?.groupColumns?.includes(col.field)) && (jsx(Resizable, { className: "r-resize", width: typeof col.width === 'number' ? col.width : Number((col.width ?? '').replaceAll(new RegExp(`[^0-9]`, 'g'), '')), height: 0, onResize: handleResize, draggableOpts: { enableUserSelectHack: true }, children: jsx("th", { rowSpan: col.rowspan !== 1 ? col.rowspan : 1, colSpan: col.columns?.filter((x) => x.visible !== false)?.length ?? 1, className: classNames$1(`r-headercell fix-${col.fixedType}`, { 'fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'cell-fixed': col.fixedType }), style: {
|
|
38981
38981
|
top: `${indexParent * 42}px`,
|
|
38982
38982
|
left: col.fixedType === 'left' ? objHeaderWidthFixLeft[`${indexParent}-${indexCol ?? 0}`] : undefined,
|
|
38983
38983
|
right: col.fixedType === 'right' ? objHeaderWidthFixRight[`${indexParent}-${indexCol ?? 0}`] : undefined
|
|
@@ -68643,7 +68643,7 @@ const UnExpandAllIcon = ({ className, color = '#7F7F7F', size = 24, onClick, sty
|
|
|
68643
68643
|
};
|
|
68644
68644
|
|
|
68645
68645
|
const RenderContentCol = (props) => {
|
|
68646
|
-
const { col, indexCol, indexRow, isSelected, row, zeroVisiable,
|
|
68646
|
+
const { col, indexCol, indexRow, isSelected, row, zeroVisiable, groupSetting, formatSetting, idTable, fisrtObjWidthFixRight, lastObjWidthFixLeft, objWidthFixLeft, objWidthFixRight, selectedRows, selectEnable, setSelectedRows, fieldKey, isMulti } = props;
|
|
68647
68647
|
const cellId = `content-${idTable}-row${indexRow}col-${indexCol}`;
|
|
68648
68648
|
const checkOverflow = () => {
|
|
68649
68649
|
const element = document.getElementById(cellId);
|
|
@@ -68713,7 +68713,7 @@ const RenderContentCol = (props) => {
|
|
|
68713
68713
|
}, children: displayText }) }), checkOverflow() && (jsx(UncontrolledTooltip, { className: "r-tooltip", autohide: false, target: cellId, placement: "top", children: jsx("div", { style: { color: textColor }, children: displayText }) }))] }));
|
|
68714
68714
|
}
|
|
68715
68715
|
};
|
|
68716
|
-
return (jsx(Fragment$1, { children: col.visible !== false && (visibleGroupColumn || !groupColumns?.includes(col.field)) && (jsx("td", { className: classNames$1(`r-rowcell fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'r-active': isSelected }), style: {
|
|
68716
|
+
return (jsx(Fragment$1, { children: col.visible !== false && (groupSetting?.visibleGroupColumn || !groupSetting?.groupColumns?.includes(col.field)) && (jsx("td", { className: classNames$1(`r-rowcell fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'r-active': isSelected }), style: {
|
|
68717
68717
|
left: col.fixedType === 'left' ? objWidthFixLeft[indexCol] : undefined,
|
|
68718
68718
|
right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined
|
|
68719
68719
|
}, onClick: (e) => {
|
|
@@ -69035,16 +69035,16 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
|
|
|
69035
69035
|
sumValue = '';
|
|
69036
69036
|
}
|
|
69037
69037
|
}
|
|
69038
|
-
return (jsx("td", { className: "r-rowcell r-cell-sum-group", children: jsx("div", { className: "r-rowcell-div", style: { justifyContent: colSum.textAlign ? colSum.textAlign : 'left' }, children: (haveSum || colSum.haveSum === true) && Number(sumValue) < 0 ? jsxs("div", { style: { color: formatSetting?.colorNegative ?? 'red' }, children: [" ", `${formatSetting?.prefixNegative ?? '-'}${sumValue}${formatSetting?.suffixNegative ?? ''}`] }) : sumValue }) }, `group-sum-cell-${level}-${indexRow}-${indexCol}`));
|
|
69038
|
+
return (jsx("td", { className: "r-rowcell r-cell-sum-group", children: jsx("div", { className: "r-rowcell-div", style: { justifyContent: colSum.textAlign ? colSum.textAlign : 'left' }, children: (haveSum || colSum.haveSum === true) && Number(sumValue) < 0 ? (jsxs("div", { style: { color: formatSetting?.colorNegative ?? 'red' }, children: [" ", `${formatSetting?.prefixNegative ?? '-'}${sumValue}${formatSetting?.suffixNegative ?? ''}`] })) : (sumValue) }) }, `group-sum-cell-${level}-${indexRow}-${indexCol}`));
|
|
69039
69039
|
})] }), expand && jsx(RenderContent, { datas: row.children, level: level + 1 })] }, `row-${level}-${indexRow}`));
|
|
69040
69040
|
}
|
|
69041
69041
|
else {
|
|
69042
69042
|
const isSelected = selectedRows?.some((x) => x[fieldKey] === row[fieldKey]);
|
|
69043
|
-
return (jsx("tr", { "aria-rowindex": indexRow + 1, role: "row", className: "r-row", children: contentColumns.map((column, indexCol) => (jsx(RenderContentCol, { idTable: idTable, col: column, fieldKey: fieldKey, objWidthFixLeft: objWidthFixLeft, objWidthFixRight: objWidthFixRight, fisrtObjWidthFixRight: fisrtObjWidthFixRight, lastObjWidthFixLeft: lastObjWidthFixLeft, isMulti: isMutil ?? false, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, formatSetting: formatSetting, indexCol: indexCol, indexRow: indexRow, isSelected: isSelected, row: row, zeroVisiable: zeroVisiable,
|
|
69043
|
+
return (jsx("tr", { "aria-rowindex": indexRow + 1, role: "row", className: "r-row", children: contentColumns.map((column, indexCol) => (jsx(RenderContentCol, { idTable: idTable, col: column, fieldKey: fieldKey, objWidthFixLeft: objWidthFixLeft, objWidthFixRight: objWidthFixRight, fisrtObjWidthFixRight: fisrtObjWidthFixRight, lastObjWidthFixLeft: lastObjWidthFixLeft, isMulti: isMutil ?? false, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, formatSetting: formatSetting, indexCol: indexCol, indexRow: indexRow, isSelected: isSelected, row: row, zeroVisiable: zeroVisiable, groupSetting: groupSetting }, indexCol))) }, `row-content-${indexRow}`));
|
|
69044
69044
|
}
|
|
69045
69045
|
}) }));
|
|
69046
69046
|
};
|
|
69047
|
-
return (jsxs("div", { className: "r-table-edit r-virtualized-table", children: [jsxs("div", { className: "r-grid", children: [toolbarSetting?.showTopToolbar && jsx(RenderToolbarTop, { toolbarTopOption: toolbarTopOption }), headerComponent && headerComponent(), jsxs("div", { ref: gridRef, className: "r-gridtable", style: { height: `${height ? `${height}px` : 'auto'}` }, children: [jsxs("table", { role: "presentation", style: { width: '100%' }, children: [jsx(RenderColGroup, { contentColumns: contentColumns,
|
|
69047
|
+
return (jsxs("div", { className: "r-table-edit r-virtualized-table", children: [jsxs("div", { className: "r-grid", children: [toolbarSetting?.showTopToolbar && jsx(RenderToolbarTop, { toolbarTopOption: toolbarTopOption }), headerComponent && headerComponent(), jsxs("div", { ref: gridRef, className: "r-gridtable", style: { height: `${height ? `${height}px` : 'auto'}` }, children: [jsxs("table", { role: "presentation", style: { width: '100%' }, children: [jsx(RenderColGroup, { contentColumns: contentColumns, groupSetting: groupSetting }), jsx("thead", { className: "r-gridheader", role: "rowgroup", children: headerColumns.map((rowColumn, indexParent) => {
|
|
69048
69048
|
return (jsx("tr", { className: "r-row", role: "row", children: rowColumn.map((col, index) => (jsx(HeaderTableCol, { col: col, idTable: idTable ?? '', dataSource: dataSource, indexCol: index, indexParent: indexParent, isMulti: isMulti ?? false, objHeaderWidthFixLeft: objHeaderWidthFixLeft, objHeaderWidthFixRight: objHeaderWidthFixRight, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, container: gridRef, filterBy: filterBy, orderBy: orderBy, optionsFilter: querySetting.optionsFilter, allowFiltering: querySetting.allowFiltering, allowSorting: querySetting.allowSorting, formatSetting: formatSetting, changeFilter: (val) => {
|
|
69049
69049
|
setFilterBy([...val]);
|
|
69050
69050
|
if (querySetting?.changeFilter) {
|
|
@@ -69055,7 +69055,7 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
|
|
|
69055
69055
|
if (querySetting?.changeOrder) {
|
|
69056
69056
|
querySetting.changeOrder(val);
|
|
69057
69057
|
}
|
|
69058
|
-
}, columns: contentColumns,
|
|
69058
|
+
}, columns: contentColumns, groupSetting: groupSetting, setContentColumns: setContentColumns, fisrtObjWidthFixRight: fisrtObjWidthFixRight, lastObjWidthFixLeft: lastObjWidthFixLeft, totalCount: dataSource?.length ?? 0 }, `header-${indexParent}-${index}`))) }, `header-${-indexParent}`));
|
|
69059
69059
|
}) }), jsx("tbody", { className: "r-gridcontent", role: "rowgroup", children: jsx(RenderContent, { datas: viewData }) }), jsx("tfoot", { className: "r-gridfoot", children: (columnsAggregate?.length ?? 0) > 0 && (jsx("tr", { className: "r-row", children: contentColumns.map((col, indexCol) => {
|
|
69060
69060
|
if (col.visible === false || (!groupSetting?.visibleGroupColumn && groupColumns.includes(col.field))) {
|
|
69061
69061
|
return;
|
|
@@ -69074,7 +69074,7 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
|
|
|
69074
69074
|
left: col.fixedType === 'left' ? objWidthFixLeft[indexCol] : undefined,
|
|
69075
69075
|
right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined,
|
|
69076
69076
|
textAlign: col.textAlign ? col.textAlign : 'left'
|
|
69077
|
-
}, children: jsx("div", { className: "r-footer-div", children: (item || col.haveSum === true) && Number(sumValue) < 0 ? jsxs("div", { style: { color: formatSetting?.colorNegative ?? 'red' }, children: [" ", `${formatSetting?.prefixNegative ?? '-'}${sumValue}${formatSetting?.suffixNegative ?? ''}`] }) : sumValue }) }, `summarycell-${indexCol}`));
|
|
69077
|
+
}, children: jsx("div", { className: "r-footer-div", children: (item || col.haveSum === true) && Number(sumValue) < 0 ? (jsxs("div", { style: { color: formatSetting?.colorNegative ?? 'red' }, children: [" ", `${formatSetting?.prefixNegative ?? '-'}${sumValue}${formatSetting?.suffixNegative ?? ''}`] })) : (sumValue) }) }, `summarycell-${indexCol}`));
|
|
69078
69078
|
}) })) })] }), (viewData.length ?? 0) === 0 && !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 && (jsx("div", { className: "r-loading-overlay", children: jsxs("div", { className: "r-loading", children: [jsx(Spinner$1, { className: "me-1" }), t('Loading...')] }) }))] })] }), pagingSetting?.allowPaging && (jsx(PagingComponent, { gridRef: gridRef, onChangePage: onChangePage, pageSize: pagingSetting?.pageSize ?? 0, currentPage: pagingSetting?.currentPage ?? 0, pageOptions: pagingSetting?.pageOptions ?? [20, 30, 50, 100], totalItem: pagingSetting?.totalItem ?? 0, onChangePageSize: onChangePageSize })), jsx(SettingColumn, { gridRef: gridRef, handleSidebar: () => {
|
|
69079
69079
|
setOpenPopupSetupColumn(!openPopupSetupColumn);
|
|
69080
69080
|
}, settingColumns: settingColumns, openSidebar: openPopupSetupColumn, column: [...contentColumns], resetDefaultColumns: resetDefaultColumns, setColumn: (newColumns) => {
|