@mezzanine-ui/react 0.9.0 → 0.9.1

package/Table/TableBody.js

@@ -22,7 +22,7 @@ const TableBody = forwardRef(function TableBody(props, ref) {
     const currentStartCount = (paginationOptions === null || paginationOptions === void 0 ? void 0 : paginationOptions.pageSize) && currentPage ? ((paginationOptions.pageSize) * (currentPage - 1)) : 0;
     const currentEndCount = (paginationOptions === null || paginationOptions === void 0 ? void 0 : paginationOptions.pageSize) && currentPage && total ? (Math.min(((paginationOptions.pageSize) * currentPage), total)) : 0;
     const currentDataSource = pagination && !disableAutoSlicing ? (dataSource.slice(currentStartCount, currentEndCount)) : dataSource;
-    return (jsxs("div", Object.assign({}, rest, { ref: composedRefs, className: cx(tableClasses.body, className), onScroll: tableBody.onScroll, role: "rowgroup" }, { children: [currentDataSource.length ? currentDataSource.map((rowData) => (jsx(TableBodyRow, { className: rowClassName, rowData: rowData }, (rowData.key || rowData.id)))) : (jsx(Empty, Object.assign({}, restEmptyProps, { className: cx(tableClasses.bodyEmpty, emptyComponentClassName), fullHeight: emptyComponentFullHeight }, { children: emptyComponentChildren }), void 0)),
+    return (jsxs("div", Object.assign({}, rest, { ref: composedRefs, className: cx(tableClasses.body, className), onScroll: tableBody.onScroll, role: "rowgroup" }, { children: [currentDataSource.length ? currentDataSource.map((rowData, index) => (jsx(TableBodyRow, { className: rowClassName, rowData: rowData, rowIndex: index }, (rowData.key || rowData.id)))) : (jsx(Empty, Object.assign({}, restEmptyProps, { className: cx(tableClasses.bodyEmpty, emptyComponentClassName), fullHeight: emptyComponentFullHeight }, { children: emptyComponentChildren }), void 0)),
             (fetchMore === null || fetchMore === void 0 ? void 0 : fetchMore.isFetching) ? (jsx("div", Object.assign({ className: tableClasses.bodyFetchMore }, { children: jsx(Loading, { loading: true }, void 0) }), void 0)) : null,
             jsx("div", Object.assign({ ref: scrollElement.ref, onMouseDown: scrollElement.onMouseDown, onMouseUp: scrollElement.onMouseUp, onMouseEnter: scrollElement.onMouseEnter, onMouseLeave: scrollElement.onMouseLeave, role: "button", style: scrollElement.style, tabIndex: -1 }, { children: jsx("div", { style: {
                         width: `${scrollBarSize}px`,

package/Table/TableBodyRow.d.ts

@@ -6,6 +6,7 @@ export interface TableBodyRowProps extends NativeElementPropsWithoutKeyAndRef<'d
      * table body row dataSource
      */
     rowData: TableDataSource;
+    rowIndex: number;
 }
 declare const TableBodyRow: import("react").ForwardRefExoticComponent<TableBodyRowProps & import("react").RefAttributes<HTMLDivElement>>;
 export default TableBodyRow;

package/Table/TableBodyRow.js

@@ -12,7 +12,7 @@ import AccordionDetails from '../Accordion/AccordionDetails.js';
 import cx from 'clsx';
 
 const TableBodyRow = forwardRef(function TableBodyRow(props, ref) {
-    const { className, rowData, ...rest } = props;
+    const { className, rowData, rowIndex, ...rest } = props;
     const { rowSelection, expanding, } = useContext(TableContext) || {};
     const { columns, } = useContext(TableDataContext) || {};
     /** Feature rowSelection */
@@ -31,11 +31,11 @@ const TableBodyRow = forwardRef(function TableBodyRow(props, ref) {
                     [tableClasses.bodyRowHighlight]: selected || expanded,
                 }, className), role: "row" }, { children: [rowSelection ? (jsx(TableRowSelection, { role: "gridcell", rowKey: (rowData.key || rowData.id), setChecked: (status) => setSelected(status), showDropdownIcon: false }, void 0)) : null,
                     expanding ? (jsx(TableExpandable, { expandable: isExpandable, expanded: expanded, role: "gridcell", setExpanded: setExpanded, onExpand: (status) => { var _a; return (_a = expanding.onExpand) === null || _a === void 0 ? void 0 : _a.call(expanding, rowData, status); } }, void 0)) : null,
-                    (columns !== null && columns !== void 0 ? columns : []).map((column, index) => {
+                    (columns !== null && columns !== void 0 ? columns : []).map((column) => {
                         var _a, _b, _c, _d;
                         const ellipsis = !!(get(rowData, column.dataIndex)) && ((_a = column.ellipsis) !== null && _a !== void 0 ? _a : true);
                         const tooltipTitle = ((_c = (_b = column.renderTooltipTitle) === null || _b === void 0 ? void 0 : _b.call(column, rowData)) !== null && _c !== void 0 ? _c : get(rowData, column.dataIndex));
-                        return (jsx("div", Object.assign({ className: cx(tableClasses.bodyRowCellWrapper, column.bodyClassName), style: getColumnStyle(column) }, { children: jsx(TableEditRenderWrapper, Object.assign({}, column, { rowData: rowData }, { children: jsx(TableCell, Object.assign({ ellipsis: ellipsis, forceShownTooltipWhenHovered: column.forceShownTooltipWhenHovered, style: getCellStyle(column), tooltipTitle: tooltipTitle }, { children: ((_d = column.render) === null || _d === void 0 ? void 0 : _d.call(column, column, rowData, index)) || get(rowData, column.dataIndex) }), void 0) }), void 0) }), `${column.dataIndex}-${column.title}`));
+                        return (jsx("div", Object.assign({ className: cx(tableClasses.bodyRowCellWrapper, column.bodyClassName), style: getColumnStyle(column) }, { children: jsx(TableEditRenderWrapper, Object.assign({}, column, { rowData: rowData }, { children: jsx(TableCell, Object.assign({ ellipsis: ellipsis, forceShownTooltipWhenHovered: column.forceShownTooltipWhenHovered, style: getCellStyle(column), tooltipTitle: tooltipTitle }, { children: ((_d = column.render) === null || _d === void 0 ? void 0 : _d.call(column, column, rowData, rowIndex)) || get(rowData, column.dataIndex) }), void 0) }), void 0) }), `${column.dataIndex}-${column.title}`));
                     })] }), void 0),
             renderedExpandedContent ? (jsx(Fragment$1, { children: typeof renderedExpandedContent === 'string' ? (jsx(AccordionDetails, Object.assign({ className: expanding.className, expanded: expanded }, { children: renderedExpandedContent }), void 0)) : (jsx(Fragment$1, { children: renderedExpandedContent.dataSource.length > 0 ? (jsx(AccordionDetails, Object.assign({ className: cx(expanding.className, tableClasses.bodyRowExpandedTableWrapper), expanded: expanded }, { children: jsx(TableExpandedTable, { renderedExpandedContent: renderedExpandedContent }, void 0) }), void 0)) : null }, void 0)) }, void 0)) : null] }, void 0));
 });

package/Table/TableExpandedTable.js

@@ -10,7 +10,7 @@ import cx from 'clsx';
 const TableExpandedTable = forwardRef(function TableExpandedTable(props, ref) {
     const { renderedExpandedContent, } = props;
     const { columns, } = useContext(TableDataContext) || {};
-    return (jsx("div", Object.assign({ className: tableClasses.bodyRowExpandedTable }, { children: renderedExpandedContent.dataSource.map((source) => {
+    return (jsx("div", Object.assign({ className: tableClasses.bodyRowExpandedTable }, { children: renderedExpandedContent.dataSource.map((source, sourceIndex) => {
             var _a;
             return (jsxs("div", Object.assign({ ref: ref, className: cx(tableClasses.bodyRow, tableClasses.bodyRowExpandedTableRow), role: "row" }, { children: [jsx(TableExpandable, { showIcon: false }, void 0),
                     ((_a = (renderedExpandedContent.columns || columns)) !== null && _a !== void 0 ? _a : [])
@@ -18,7 +18,7 @@ const TableExpandedTable = forwardRef(function TableExpandedTable(props, ref) {
                         var _a, _b, _c, _d;
                         const ellipsis = !!(get(source, column.dataIndex)) && ((_a = column.ellipsis) !== null && _a !== void 0 ? _a : true);
                         const tooltipTitle = ((_c = (_b = column.renderTooltipTitle) === null || _b === void 0 ? void 0 : _b.call(column, source)) !== null && _c !== void 0 ? _c : get(source, column.dataIndex));
-                        return (jsx("div", Object.assign({ className: cx(tableClasses.bodyRowCellWrapper, column.bodyClassName), style: getColumnStyle((columns !== null && columns !== void 0 ? columns : [])[index]) }, { children: jsx(TableCell, Object.assign({ ellipsis: ellipsis, forceShownTooltipWhenHovered: column.forceShownTooltipWhenHovered, style: getCellStyle((columns !== null && columns !== void 0 ? columns : [])[index]), tooltipTitle: tooltipTitle || '' }, { children: ((_d = column.render) === null || _d === void 0 ? void 0 : _d.call(column, column, source, index)) || get(source, column.dataIndex) }), void 0) }), `${column.dataIndex}-${index}`));
+                        return (jsx("div", Object.assign({ className: cx(tableClasses.bodyRowCellWrapper, column.bodyClassName), style: getColumnStyle((columns !== null && columns !== void 0 ? columns : [])[index]) }, { children: jsx(TableCell, Object.assign({ ellipsis: ellipsis, forceShownTooltipWhenHovered: column.forceShownTooltipWhenHovered, style: getCellStyle((columns !== null && columns !== void 0 ? columns : [])[index]), tooltipTitle: tooltipTitle || '' }, { children: ((_d = column.render) === null || _d === void 0 ? void 0 : _d.call(column, column, source, sourceIndex)) || get(source, column.dataIndex) }), void 0) }), `${column.dataIndex}-${index}`));
                     })] }), (source.key || source.id)));
         }) }), void 0));
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mezzanine-ui/react",
-  "version": "0.9.0",
+  "version": "0.9.1",
   "description": "React components for mezzanine-ui",
   "author": "Mezzanine",
   "repository": {