From 5eafaa3973e8b14808d9ed33b8843ca14ce46566 Mon Sep 17 00:00:00 2001
From: Rajat Saxena <hi@sub.rajatsaxena.dev>
Date: Thu, 12 Nov 2026 11:17:06 +0530
Subject: [PATCH 1/2] fix(email-blocks): keep popovers within the viewport

Cap PopoverContent to the height Radix reports is left on screen and
scroll the overflow, so long lists such as the contact filter menu no
longer run off the edge.
---
 .changeset/email-blocks-popover-height.md           | 5 +++++
 packages/email-blocks/src/components/ui/popover.tsx | 4 +++-
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/email-blocks-popover-height.md

diff --git a/.changeset/email-blocks-popover-height.md b/.changeset/email-blocks-popover-height.md
new file mode 100644
index 00000000..26e178c8
--- /dev/null
+++ b/.changeset/email-blocks-popover-height.md
@@ -0,0 +1,5 @@
+---
+"@sendlit/email-blocks": patch
+---
+
+Popovers now stay on screen. They are capped to the space left in the viewport and scroll, so a long list such as the contact filter menu no longer runs off the edge.
diff --git a/packages/email-blocks/src/components/ui/popover.tsx b/packages/email-blocks/src/components/ui/popover.tsx
index a4b3d1c0..ad1b2e1f 100644
--- a/packages/email-blocks/src/components/ui/popover.tsx
+++ b/packages/email-blocks/src/components/ui/popover.tsx
@@ -19,6 +19,8 @@ function PopoverContent({
   sideOffset = 4,
   ...props
 }: React.ComponentProps<typeof PopoverPrimitive.Content>) {
+  // Capped to the room left on screen, so a long list scrolls instead of
+  // running off the edge.
   return (
     <PopoverPrimitive.Portal>
       <PopoverPrimitive.Content
@@ -26,7 +28,7 @@ function PopoverContent({
         align={align}
         sideOffset={sideOffset}
         className={cn(
-          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
+          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 max-h-[var(--radix-popover-content-available-height)] overflow-y-auto origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
           className,
         )}
         {...props}

From bc0d212e7266df62ebebfbc0ae6172171fd3f5d6 Mon Sep 17 00:00:00 2001
From: Rajat Saxena <hi@sub.rajatsaxena.dev>
Date: Thu, 12 Nov 2026 11:19:51 +0530
Subject: [PATCH 2/2] fix(email-blocks): cap the filter builder's popovers, not
 the shadcn primitive

PopoverContent is stock shadcn and, like upstream, leaves height to the
content. Restore it and cap the contact filter builder's segment and
filter popovers at the call site instead, so a future shadcn add can't
overwrite the fix.
---
 .changeset/email-blocks-popover-height.md            |  2 +-
 packages/email-blocks/src/components/ui/popover.tsx  |  4 +---
 packages/email-blocks/src/contact-filter-builder.tsx | 10 ++++++++--
 3 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/.changeset/email-blocks-popover-height.md b/.changeset/email-blocks-popover-height.md
index 26e178c8..ae0dce0d 100644
--- a/.changeset/email-blocks-popover-height.md
+++ b/.changeset/email-blocks-popover-height.md
@@ -2,4 +2,4 @@
 "@sendlit/email-blocks": patch
 ---
 
-Popovers now stay on screen. They are capped to the space left in the viewport and scroll, so a long list such as the contact filter menu no longer runs off the edge.
+The contact filter builder's segment and filter popovers now stay on screen. They are capped to the space left in the viewport and scroll, so a long list of filters no longer runs off the edge.
diff --git a/packages/email-blocks/src/components/ui/popover.tsx b/packages/email-blocks/src/components/ui/popover.tsx
index ad1b2e1f..a4b3d1c0 100644
--- a/packages/email-blocks/src/components/ui/popover.tsx
+++ b/packages/email-blocks/src/components/ui/popover.tsx
@@ -19,8 +19,6 @@ function PopoverContent({
   sideOffset = 4,
   ...props
 }: React.ComponentProps<typeof PopoverPrimitive.Content>) {
-  // Capped to the room left on screen, so a long list scrolls instead of
-  // running off the edge.
   return (
     <PopoverPrimitive.Portal>
       <PopoverPrimitive.Content
@@ -28,7 +26,7 @@ function PopoverContent({
         align={align}
         sideOffset={sideOffset}
         className={cn(
-          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 max-h-[var(--radix-popover-content-available-height)] overflow-y-auto origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
+          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
           className,
         )}
         {...props}
diff --git a/packages/email-blocks/src/contact-filter-builder.tsx b/packages/email-blocks/src/contact-filter-builder.tsx
index e19a63af..9bf05033 100644
--- a/packages/email-blocks/src/contact-filter-builder.tsx
+++ b/packages/email-blocks/src/contact-filter-builder.tsx
@@ -463,7 +463,10 @@ export function ContactFilterBuilder({
               <span className="sr-only">{segmentTriggerSrLabel}</span>
             </Button>
           </PopoverTrigger>
-          <PopoverContent align="start" className="w-80 p-2">
+          <PopoverContent
+            align="start"
+            className="w-80 p-2 max-h-[var(--radix-popover-content-available-height)] overflow-y-auto"
+          >
             <div className="px-2 py-2">
               <p className="text-sm font-semibold">{segmentsHeading}</p>
               <p className="mt-1 text-xs text-muted-foreground">
@@ -533,7 +536,10 @@ export function ContactFilterBuilder({
               {filtersButtonLabel}
             </Button>
           </PopoverTrigger>
-          <PopoverContent align="start" className="w-80">
+          <PopoverContent
+            align="start"
+            className="w-80 max-h-[var(--radix-popover-content-available-height)] overflow-y-auto"
+          >
             {!activeDefinition ? (
               <div className="space-y-1">
                 <p