Respect prefers-reduced-motion in carousel scroll buttons (#1537)

Adjust the carousel scroll behavior to respect the user's
prefers-reduced-motion setting, providing an instant scroll for users
who have indicated a preference for reduced motion.

Note that this does not solve the scroll-snapping: we need to figure out
a way to scroll instantly when `prefers-reduced-motion` is enabled. That
might require some work. So starting with this as a small improvement.

Author: oscarcarlstrom

.changeset/honest-emus-kiss.md

@@ -0,0 +1,5 @@
+---
+"@obosbbl/grunnmuren-react": patch
+---
+
+Respect prefers-reduced-motion when user clicks the prev/next buttons in the `<Carousel>` component.

packages/react/src/carousel/carousel.tsx

@@ -111,8 +111,12 @@ const Carousel = ({
     const elementWithFocusVisible =
       carouselRef.current?.querySelector(':focus-visible');
 
+    const prefersReducedMotion = window.matchMedia(
+      '(prefers-reduced-motion: reduce)',
+    ).matches;
+
     carouselItemsRef.current.children[scrollTargetIndex]?.scrollIntoView({
-      behavior: 'smooth',
+      behavior: prefersReducedMotion ? 'instant' : 'smooth',
       inline: 'start',
       block: 'nearest',
     });