From 35693ba4bf9da2337e11a44f5422aac651e40e0d Mon Sep 17 00:00:00 2001 From: Ryan Keairns Date: Tue, 1 Sep 2026 15:36:52 -0700 Subject: [PATCH 1/3] [EuiPopover] Round title and footer corners to match the panel Co-authored-by: Cursor --- packages/eui/src/components/popover/popover_footer.styles.ts | 4 ++++ packages/eui/src/components/popover/popover_title.styles.ts | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/packages/eui/src/components/popover/popover_footer.styles.ts b/packages/eui/src/components/popover/popover_footer.styles.ts index ca494294c417..736b08de9400 100644 --- a/packages/eui/src/components/popover/popover_footer.styles.ts +++ b/packages/eui/src/components/popover/popover_footer.styles.ts @@ -31,6 +31,10 @@ export const euiPopoverFooterStyles = (euiThemeContext: UseEuiTheme) => { : euiTheme.components.popoverFooterBorderColor }` )} + /* Match the panel radius so footer backgrounds don't square off the corners. + Avoid overflow: hidden on the panel — it clips the filter shadow and arrow. */ + ${logicalCSS('border-bottom-left-radius', euiTheme.border.radius.medium)} + ${logicalCSS('border-bottom-right-radius', euiTheme.border.radius.medium)} `, // If the popover's containing panel has padding applied, // ensure the title expands to cover that padding via negative margins diff --git a/packages/eui/src/components/popover/popover_title.styles.ts b/packages/eui/src/components/popover/popover_title.styles.ts index c47e4a6d88dd..5e14614677dd 100644 --- a/packages/eui/src/components/popover/popover_title.styles.ts +++ b/packages/eui/src/components/popover/popover_title.styles.ts @@ -24,6 +24,10 @@ export const euiPopoverTitleStyles = (euiThemeContext: UseEuiTheme) => { euiPopoverTitle: css` ${euiTitle(euiThemeContext, 'xxs')} ${logicalCSS('border-bottom', euiTheme.border.thin)} + /* Match the panel radius so title backgrounds don't square off the corners. + Avoid overflow: hidden on the panel — it clips the filter shadow and arrow. */ + ${logicalCSS('border-top-left-radius', euiTheme.border.radius.medium)} + ${logicalCSS('border-top-right-radius', euiTheme.border.radius.medium)} `, // If the popover's containing panel has padding applied, // ensure the title expands to cover that padding via negative margins From 4b91b6f426fcca51fbc1942e674419e418b9135d Mon Sep 17 00:00:00 2001 From: Ryan Keairns Date: Tue, 1 Sep 2026 15:41:15 -0700 Subject: [PATCH 2/3] [EuiPopover] Add changelog for #9985 Co-authored-by: Cursor --- packages/eui/changelogs/upcoming/9985.md | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 packages/eui/changelogs/upcoming/9985.md diff --git a/packages/eui/changelogs/upcoming/9985.md b/packages/eui/changelogs/upcoming/9985.md new file mode 100644 index 000000000000..1ef55758cff0 --- /dev/null +++ b/packages/eui/changelogs/upcoming/9985.md @@ -0,0 +1,3 @@ +**Bug fixes** + +- Fixed `EuiPopoverTitle` and `EuiPopoverFooter` backgrounds not following the popover panel's corner radius From 54e563e171202c7537cee6942d5299a4b0d33ecb Mon Sep 17 00:00:00 2001 From: Lene Gadewoll Date: Wed, 2 Sep 2026 08:21:55 +0200 Subject: [PATCH 3/3] Potential fix for pull request finding Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com> --- packages/eui/src/components/popover/popover_footer.styles.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/eui/src/components/popover/popover_footer.styles.ts b/packages/eui/src/components/popover/popover_footer.styles.ts index 736b08de9400..5520a9aeb383 100644 --- a/packages/eui/src/components/popover/popover_footer.styles.ts +++ b/packages/eui/src/components/popover/popover_footer.styles.ts @@ -37,7 +37,7 @@ export const euiPopoverFooterStyles = (euiThemeContext: UseEuiTheme) => { ${logicalCSS('border-bottom-right-radius', euiTheme.border.radius.medium)} `, // If the popover's containing panel has padding applied, - // ensure the title expands to cover that padding via negative margins + // ensure the footer expands to cover that padding via negative margins panelPaddingSizes: { none: css``, xs: css`