From c671db9fec35d4cdc0e7fe888d97bec650c0ba51 Mon Sep 17 00:00:00 2001 From: Harshal Jain Date: Tue, 20 Jan 2026 19:47:54 +0530 Subject: [PATCH] Add flexWrap to root style in Table component (#32199) * Add flexWrap to root style in Table component Resolves #32120 by adding flexWrap: 'wrap' to the table toolbar root container, preventing layout breaks when both a title and filters are present. Signed-off-by: Harshal Jain * Fix Table component layout issue with title and filters Fixed bug in Table component layout when both title and filters are present. Added flexWrap: 'wrap' to improve responsive design. Signed-off-by: HarshalJain-cs Signed-off-by: Harshal Jain * Fix Table component layout issue with title and filters Added flexWrap: 'wrap' to the root style of the Table component to prevent layout overflow and improve responsive design. Signed-off-by: Ben Lambert --------- Signed-off-by: Harshal Jain Signed-off-by: Ben Lambert Co-authored-by: Ben Lambert --- .changeset/fix-table-layout.md | 5 +++++ packages/core-components/src/components/Table/Table.tsx | 1 + 2 files changed, 6 insertions(+) create mode 100644 .changeset/fix-table-layout.md diff --git a/.changeset/fix-table-layout.md b/.changeset/fix-table-layout.md new file mode 100644 index 0000000000..6db671d1fd --- /dev/null +++ b/.changeset/fix-table-layout.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +Fixed bug in Table component where the toolbar layout would break when both a title and filters were present. diff --git a/packages/core-components/src/components/Table/Table.tsx b/packages/core-components/src/components/Table/Table.tsx index 0287cfdf40..59220abbaf 100644 --- a/packages/core-components/src/components/Table/Table.tsx +++ b/packages/core-components/src/components/Table/Table.tsx @@ -186,6 +186,7 @@ const useFilterStyles = makeStyles( display: 'flex', alignItems: 'center', justifyContent: 'space-between', + flexWrap: 'wrap', }, title: { fontWeight: theme.typography.fontWeightBold,