From 4f79da9732d22bf244110eff7fd257be3dfb0e61 Mon Sep 17 00:00:00 2001 From: Gauthier Fiorentino Date: Mon, 31 Aug 2026 17:34:01 +0200 Subject: [PATCH 1/2] fix(Table): Remove non-color variants from colorVariants Namely "sm", "lg" and "multiline" --- src/Table.tsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/Table.tsx b/src/Table.tsx index 7a67b7a84..5079d4ea7 100644 --- a/src/Table.tsx +++ b/src/Table.tsx @@ -31,7 +31,14 @@ export namespace TableProps { type ExtractColorVariant = FrClassName extends `fr-table--${infer AccentColor}` ? Exclude< AccentColor, - "no-scroll" | "no-caption" | "caption-bottom" | "layout-fixed" | "bordered" + | "no-scroll" + | "no-caption" + | "caption-bottom" + | "layout-fixed" + | "bordered" + | "multiline" + | "sm" + | "lg" > : never; From 364a4fd9e3368f6bc33287ad269474bd3550e822 Mon Sep 17 00:00:00 2001 From: Gauthier Fiorentino Date: Mon, 31 Aug 2026 19:20:33 +0200 Subject: [PATCH 2/2] feat(Table): Add multiline support --- src/Table.tsx | 6 +++++- stories/Table.stories.tsx | 5 +++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/src/Table.tsx b/src/Table.tsx index 5079d4ea7..7cc4e3025 100644 --- a/src/Table.tsx +++ b/src/Table.tsx @@ -23,6 +23,8 @@ export type TableProps = { noCaption?: boolean; /** Default: false */ bottomCaption?: boolean; + /** Default: false */ + multiline?: boolean; style?: CSSProperties; colorVariant?: TableProps.ColorVariant; }; @@ -58,6 +60,7 @@ export const Table = memo( fixed = false, noCaption = false, bottomCaption = false, + multiline = false, colorVariant, className, style, @@ -84,7 +87,8 @@ export const Table = memo( "fr-table--no-scroll": noScroll, "fr-table--layout-fixed": fixed, "fr-table--no-caption": noCaption, - "fr-table--caption-bottom": bottomCaption + "fr-table--caption-bottom": bottomCaption, + "fr-table--multiline": multiline }, colorVariant !== undefined && `fr-table--${colorVariant}` ), diff --git a/stories/Table.stories.tsx b/stories/Table.stories.tsx index aaa936ee1..22fc056a0 100644 --- a/stories/Table.stories.tsx +++ b/stories/Table.stories.tsx @@ -37,6 +37,11 @@ const { meta, getStory } = getStoryFactory({ "description": "Move caption to bottom", "type": { "name": "boolean" } }, + "multiline": { + "description": + "Allow the browser to split cell text on multiple lines to avoid scrolling", + "type": { "name": "boolean" } + }, "colorVariant": { "options": (() => { const options = [