feat(Table): remove bottom border from last row (#88)

Co-authored-by: alx-chernigin <[email protected]>
gravity-ui · Nov 15, 2024 · 30e73b5 · 30e73b5
1 parent 27091eb
commit 30e73b5
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 0 deletions.
diff --git a/src/components/Table/Table.scss b/src/components/Table/Table.scss
@@ -32,4 +32,10 @@ $block: '.#{variables.$ns}styled-table';
         padding: var(--_--cell-padding);
         border-block-end: 1px solid var(--g-color-line-generic);
     }
+
+    &__row:last-of-type {
+        #{$block}__cell {
+            border-block-end: none;
+        }
+    }
 }
diff --git a/src/components/Table/Table.tsx b/src/components/Table/Table.tsx
@@ -21,6 +21,7 @@ export const Table = React.forwardRef(
             cellClassName: cellClassNameProp,
             footerCellClassName: footerCellClassNameProp,
             headerCellClassName: headerCellClassNameProp,
+            rowClassName: rowClassNameProp,
             headerClassName,
             size = 'm',
             ...props
@@ -51,6 +52,14 @@ export const Table = React.forwardRef(
             return b('footer-cell', footerCellClassNameProp);
         }, [footerCellClassNameProp]);
 
+        const rowClassName: TableProps<TData>['rowClassName'] = React.useMemo(() => {
+            if (typeof rowClassNameProp === 'function') {
+                return (...args) => b('row', rowClassNameProp(...args));
+            }
+
+            return b('row', rowClassNameProp);
+        }, [rowClassNameProp]);
+
         return (
             <BaseTable
                 ref={ref}
@@ -59,6 +68,7 @@ export const Table = React.forwardRef(
                 footerCellClassName={footerCellClassName}
                 headerCellClassName={headerCellClassName}
                 headerClassName={b('header', headerClassName)}
+                rowClassName={rowClassName}
                 {...props}
             />
         );