From ea11f5acb9c1ceea2cf702d14acbdca52512487f Mon Sep 17 00:00:00 2001
From: "shakespeare.diy" <assistant@shakespeare.diy>
Date: Thu, 19 Feb 2026 06:48:07 -0600
Subject: [PATCH] Prevent emoji picker scroll from propagating to page

- Added onWheel event handler to stop propagation
- Fixes issue where aggressive scrolling in emoji picker scrolls the page
- Scroll events now stay contained within the emoji picker

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
---
 src/components/EmojiPicker.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/EmojiPicker.tsx b/src/components/EmojiPicker.tsx
index f6b69428..a69be125 100644
--- a/src/components/EmojiPicker.tsx
+++ b/src/components/EmojiPicker.tsx
@@ -201,7 +201,13 @@ export function EmojiPicker({ onSelect }: EmojiPickerProps) {
   const categoriesToShow = search.trim() ? filteredCategories : CATEGORIES;
 
   return (
-    <div className="flex flex-col w-[320px] h-[360px]">
+    <div 
+      className="flex flex-col w-[320px] h-[360px]"
+      onWheel={(e) => {
+        // Prevent scroll from bubbling to the page
+        e.stopPropagation();
+      }}
+    >
       {/* Search */}
       <div className="px-3 pt-3 pb-2">
         <div className="relative">