From 4392770c8e140d1678d201e665bae737612aceef Mon Sep 17 00:00:00 2001 From: Karine Brandelli Padilha Date: Thu, 1 Oct 2026 15:23:26 -0300 Subject: [PATCH 1/2] fix: table pagination left padding --- CHANGELOG.md | 4 ++++ package.json | 2 +- src/core/data-display/table/index.tsx | 4 +++- src/core/data-display/table/table-pagination.tsx | 5 ++++- 4 files changed, 12 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9fcda17b..df6d8c0a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # CHANGELOG +## v0.42.2 + +- fix the pagination footer padding its left side 24px against ~10px on the right; the toolbar now insets `footerActions` as far as the last page icon sits from the edge, 14px by default and 12px with `size='small'` + ## v0.42.1 - fix the sticky head cell of the tables painting `background.default` instead of white; `muiThemeOptions` now overrides `MuiTableCell.stickyHeader` with `neutral[50]` diff --git a/package.json b/package.json index 071ce934..ba994c92 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "flipper-ui", - "version": "0.42.1", + "version": "0.42.2", "author": "NG", "license": "MIT", "main": "dist/index.js", diff --git a/src/core/data-display/table/index.tsx b/src/core/data-display/table/index.tsx index a5156707..67d57817 100644 --- a/src/core/data-display/table/index.tsx +++ b/src/core/data-display/table/index.tsx @@ -14,9 +14,11 @@ const SMALL_SIZE_SX = { }, // the pagination cell keeps its own padding of 0, so the footer shrinks // through the toolbar instead. 8px here plus the 4px below leave the last - // icon 12px from the edge, the same inset the small cells use + // icon 12px from the edge, the same inset the small cells use — and the + // `footerActions` on the left get the same 12px '&& tfoot .MuiTablePagination-toolbar': { minHeight: '40px', + paddingLeft: '8px', paddingRight: '8px' }, // the labels are `p` elements, and their default `1em` margin is what diff --git a/src/core/data-display/table/table-pagination.tsx b/src/core/data-display/table/table-pagination.tsx index fe9ff6f8..871a5be5 100644 --- a/src/core/data-display/table/table-pagination.tsx +++ b/src/core/data-display/table/table-pagination.tsx @@ -69,7 +69,10 @@ const TablePagination = ({ ...style }} sx={{ - borderBottom: `1px solid ${gray[200]}` + borderBottom: `1px solid ${gray[200]}`, + '&& .MuiTablePagination-toolbar': { + paddingLeft: '12px' + } }} slotProps={ footerActions From 75587fff438edceeb20c185e1edf6c1cc657c04e Mon Sep 17 00:00:00 2001 From: Karine Brandelli Padilha Date: Thu, 1 Oct 2026 15:24:47 -0300 Subject: [PATCH 2/2] docs: fix table pagination padding values in changelog and comment --- CHANGELOG.md | 2 +- src/core/data-display/table/index.tsx | 3 +-- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index df6d8c0a..de4be1a1 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,7 +2,7 @@ ## v0.42.2 -- fix the pagination footer padding its left side 24px against ~10px on the right; the toolbar now insets `footerActions` as far as the last page icon sits from the edge, 14px by default and 12px with `size='small'` +- fix the pagination footer padding its left side 24px; the toolbar now pads it 12px by default and 8px with `size='small'` ## v0.42.1 diff --git a/src/core/data-display/table/index.tsx b/src/core/data-display/table/index.tsx index 67d57817..c538497a 100644 --- a/src/core/data-display/table/index.tsx +++ b/src/core/data-display/table/index.tsx @@ -14,8 +14,7 @@ const SMALL_SIZE_SX = { }, // the pagination cell keeps its own padding of 0, so the footer shrinks // through the toolbar instead. 8px here plus the 4px below leave the last - // icon 12px from the edge, the same inset the small cells use — and the - // `footerActions` on the left get the same 12px + // icon 12px from the edge, the same inset the small cells use '&& tfoot .MuiTablePagination-toolbar': { minHeight: '40px', paddingLeft: '8px',