Move event.preventDefault() into the case statements. This allows chi…

…ldren components to handle onKeyDown events.
BelkacemYerfa · May 15, 2024 · 7e6d69d · 7e6d69d
1 parent 70ed258
commit 7e6d69d
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/src/registry/default/extension/carousel.tsx b/src/registry/default/extension/carousel.tsx
@@ -105,10 +105,10 @@ const Carousel = forwardRef<
 
     const handleKeyDown = useCallback(
       (event: React.KeyboardEvent<HTMLDivElement>) => {
-        event.preventDefault();
         if (!emblaMainApi) return;
         switch (event.key) {
           case "ArrowLeft":
+            event.preventDefault();
             if (orientation === "horizontal") {
               if (direction === "rtl") {
                 ScrollNext();
@@ -118,6 +118,7 @@ const Carousel = forwardRef<
             }
             break;
           case "ArrowRight":
+            event.preventDefault();
             if (orientation === "horizontal") {
               if (direction === "rtl") {
                 ScrollPrev();
@@ -127,11 +128,13 @@ const Carousel = forwardRef<
             }
             break;
           case "ArrowUp":
+            event.preventDefault();
             if (orientation === "vertical") {
               ScrollPrev();
             }
             break;
           case "ArrowDown":
+            event.preventDefault();
             if (orientation === "vertical") {
               ScrollNext();
             }