Merged in feat/SW-1542-carousel-functionality (pull request #1311)

feat(SW-1542): Carousel component

* feat(SW-1542): add Embla Carousel component and use in CarouselCards

* fix(SW-1542): remove max-width constraint for card on ipad

* fix(SW-1542): Add padding to start page content container

* refactor(SW-1542): Improve Embla Carousel type imports

* refactor(SW-1542): Remove unnecessary carousel wrapper div

* refactor(SW-1542): Modularize Carousel component structure

* refactor(SW-1542): Remove carousel dots display

* feat(SW-1542): Add carousel dots navigation

* refactor(SW-1542): Update Carousel component styling and types

* refactor(SW-1542): Remove uneeded useCallback from Carousel navigation methods

* refactor(SW-1542): Modify CarouselContextProps type to exclude className

* refactor(SW-1542): Optimize React imports in Carousel components

* refactor(SW-1542): Consolidate Carousel component and remove CarouselRoot

* refactor(SW-1542): Update Carousel navigation methods to use function-based scroll checks

* refactor(SW-1542): Add explicit children prop support to CarouselContent component

* refactor(SW-1542): Add children prop support to CarouselItem component


Approved-by: Christian Andolf

components/Carousel/types.ts

@@ -0,0 +1,34 @@
+/**
+ * Must be imported from the core package.
+ * @see https://www.embla-carousel.com/api/methods/#typescript
+ */
+import type { EmblaCarouselType } from "embla-carousel"
+import type useEmblaCarousel from "embla-carousel-react"
+import type { PropsWithChildren } from "react"
+
+export type CarouselApi = EmblaCarouselType
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>
+type CarouselOptions = UseCarouselParameters[0]
+type CarouselPlugin = UseCarouselParameters[1]
+
+export interface CarouselProps extends PropsWithChildren {
+  opts?: CarouselOptions
+  plugins?: CarouselPlugin
+  setApi?: (api: CarouselApi) => void
+  className?: string
+}
+
+export interface CarouselContextProps extends Omit<CarouselProps, "className"> {
+  carouselRef: ReturnType<typeof useEmblaCarousel>[0]
+  api: ReturnType<typeof useEmblaCarousel>[1]
+  scrollPrev: () => void
+  scrollNext: () => void
+  canScrollPrev: () => boolean
+  canScrollNext: () => boolean
+  selectedIndex: number
+}
+
+export interface CarouselButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  className?: string
+}