diff --git a/src/components/Table/Table.scss b/src/components/Table/Table.scss index 27de484..32f9312 100644 --- a/src/components/Table/Table.scss +++ b/src/components/Table/Table.scss @@ -16,10 +16,20 @@ $block: '.#{variables.$ns}styled-table'; @include mixins.text-subheader-1(); } + &_size { + &_s { + --_--cell-padding: 7px var(--g-spacing-2) 6px; + } + + &_m { + --_--cell-padding: 11px var(--g-spacing-2) 10px; + } + } + &__cell, &__header-cell, &__footer-cell { - padding: 11px var(--g-spacing-2) 10px; + padding: var(--_--cell-padding); border-block-end: 1px solid var(--g-color-line-generic); } } diff --git a/src/components/Table/Table.tsx b/src/components/Table/Table.tsx index f16092d..fb5c82e 100644 --- a/src/components/Table/Table.tsx +++ b/src/components/Table/Table.tsx @@ -4,11 +4,15 @@ import {BaseTable} from '../BaseTable'; import type {BaseTableProps} from '../BaseTable'; import {b} from './Table.classname'; +import type {TableSize} from './types'; import './Table.scss'; export interface TableProps - extends BaseTableProps {} + extends BaseTableProps { + /** Table size */ + size?: TableSize; +} export const Table = React.forwardRef( ( @@ -18,6 +22,7 @@ export const Table = React.forwardRef( footerCellClassName: footerCellClassNameProp, headerCellClassName: headerCellClassNameProp, headerClassName, + size = 'm', ...props }: TableProps, ref: React.Ref, @@ -49,7 +54,7 @@ export const Table = React.forwardRef( return (