@arolariu/components 0.5.0 → 1.0.0

package/dist/components/ui/carousel.js

@@ -1,27 +1,31 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { mergeProps } from "@base-ui/react/merge-props";
 import embla_carousel_react from "embla-carousel-react";
 import { ArrowLeft, ArrowRight } from "lucide-react";
 import { createContext, forwardRef, useCallback, useContext, useEffect, useState } from "react";
 import { Button } from "./button.js";
 import { cn } from "../../lib/utilities.js";
+import carousel_module from "./carousel.module.js";
 const CarouselContext = /*#__PURE__*/ createContext(null);
 function useCarousel() {
     const context = useContext(CarouselContext);
     if (!context) throw new Error("useCarousel must be used within a <Carousel />");
     return context;
 }
-const Carousel = /*#__PURE__*/ forwardRef(({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }, ref)=>{
+const Carousel = /*#__PURE__*/ forwardRef(({ orientation, opts, setApi, plugins, className, children, ...props }, ref)=>{
+    const resolvedOrientation = orientation ?? (opts?.axis === "y" ? "vertical" : "horizontal");
+    const resolvedAxis = "vertical" === resolvedOrientation ? "y" : "x";
     const [carouselRef, api] = embla_carousel_react({
         ...opts,
-        axis: "horizontal" === orientation ? "x" : "y"
+        axis: resolvedAxis
     }, plugins);
     const [canScrollPrev, setCanScrollPrev] = useState(false);
     const [canScrollNext, setCanScrollNext] = useState(false);
-    const onSelect = useCallback((api)=>{
-        if (!api) return;
-        setCanScrollPrev(api.canScrollPrev());
-        setCanScrollNext(api.canScrollNext());
+    const onSelect = useCallback((emblaApi)=>{
+        if (!emblaApi) return;
+        setCanScrollPrev(emblaApi.canScrollPrev());
+        setCanScrollNext(emblaApi.canScrollNext());
     }, []);
     const scrollPrev = useCallback(()=>{
         api?.scrollPrev();
@@ -34,16 +38,27 @@ const Carousel = /*#__PURE__*/ forwardRef(({ orientation = "horizontal", opts, s
         api
     ]);
     const handleKeyDown = useCallback((event)=>{
-        if ("ArrowLeft" === event.key) {
+        if ("horizontal" === orientation) {
+            if ("ArrowLeft" === event.key) {
+                event.preventDefault();
+                scrollPrev();
+            } else if ("ArrowRight" === event.key) {
+                event.preventDefault();
+                scrollNext();
+            }
+            return;
+        }
+        if ("ArrowUp" === event.key) {
             event.preventDefault();
             scrollPrev();
-        } else if ("ArrowRight" === event.key) {
+        } else if ("ArrowDown" === event.key) {
             event.preventDefault();
             scrollNext();
         }
     }, [
-        scrollPrev,
-        scrollNext
+        orientation,
+        scrollNext,
+        scrollPrev
     ]);
     useEffect(()=>{
         if (!api || !setApi) return;
@@ -58,7 +73,8 @@ const Carousel = /*#__PURE__*/ forwardRef(({ orientation = "horizontal", opts, s
         api.on("reInit", onSelect);
         api.on("select", onSelect);
         return ()=>{
-            api?.off("select", onSelect);
+            api.off("reInit", onSelect);
+            api.off("select", onSelect);
         };
     }, [
         api,
@@ -66,19 +82,22 @@ const Carousel = /*#__PURE__*/ forwardRef(({ orientation = "horizontal", opts, s
     ]);
     return /*#__PURE__*/ jsx(CarouselContext.Provider, {
         value: {
-            carouselRef,
             api,
+            canScrollNext,
+            canScrollPrev,
+            carouselRef,
             opts,
-            orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
-            scrollPrev,
+            orientation: resolvedOrientation,
+            plugins,
             scrollNext,
-            canScrollPrev,
-            canScrollNext
+            scrollPrev,
+            setApi
         },
         children: /*#__PURE__*/ jsx("div", {
             ref: ref,
+            "data-orientation": resolvedOrientation,
             onKeyDownCapture: handleKeyDown,
-            className: cn("relative", className),
+            className: cn(carousel_module.carousel, className),
             role: "region",
             "aria-roledescription": "carousel",
             ...props,
@@ -91,10 +110,11 @@ const CarouselContent = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=
     const { carouselRef, orientation } = useCarousel();
     return /*#__PURE__*/ jsx("div", {
         ref: carouselRef,
-        className: "overflow-hidden",
+        className: carousel_module.viewport,
         children: /*#__PURE__*/ jsx("div", {
             ref: ref,
-            className: cn("flex", "horizontal" === orientation ? "-ml-4" : "-mt-4 flex-col", className),
+            "data-orientation": orientation,
+            className: cn(carousel_module.content, "vertical" === orientation && carousel_module.contentVertical, className),
             ...props
         })
     });
@@ -106,49 +126,56 @@ const CarouselItem = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>{
         ref: ref,
         role: "group",
         "aria-roledescription": "slide",
-        className: cn("min-w-0 shrink-0 grow-0 basis-full", "horizontal" === orientation ? "pl-4" : "pt-4", className),
+        "data-orientation": orientation,
+        className: cn(carousel_module.item, "vertical" === orientation && carousel_module.itemVertical, className),
         ...props
     });
 });
 CarouselItem.displayName = "CarouselItem";
-const CarouselPrevious = /*#__PURE__*/ forwardRef(({ className, variant = "outline", size = "icon", ...props }, ref)=>{
+const CarouselPrevious = /*#__PURE__*/ forwardRef(({ children, className, variant = "outline", size = "icon", ...props }, ref)=>{
     const { orientation, scrollPrev, canScrollPrev } = useCarousel();
+    const mergedProps = mergeProps({
+        onClick: scrollPrev,
+        disabled: !canScrollPrev
+    }, props);
     return /*#__PURE__*/ jsxs(Button, {
         ref: ref,
         variant: variant,
         size: size,
-        className: cn("absolute h-8 w-8 rounded-full", "horizontal" === orientation ? "top-1/2 -left-12 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className),
-        disabled: !canScrollPrev,
-        onClick: scrollPrev,
-        ...props,
+        "data-orientation": orientation,
+        className: cn(carousel_module.navigationButton, carousel_module.previousButton, className),
+        ...mergedProps,
         children: [
-            /*#__PURE__*/ jsx(ArrowLeft, {
-                className: "h-4 w-4"
+            children ?? /*#__PURE__*/ jsx(ArrowLeft, {
+                className: carousel_module.navigationIcon
             }),
             /*#__PURE__*/ jsx("span", {
-                className: "sr-only",
+                className: carousel_module.srOnly,
                 children: "Previous slide"
             })
         ]
     });
 });
 CarouselPrevious.displayName = "CarouselPrevious";
-const CarouselNext = /*#__PURE__*/ forwardRef(({ className, variant = "outline", size = "icon", ...props }, ref)=>{
+const CarouselNext = /*#__PURE__*/ forwardRef(({ children, className, variant = "outline", size = "icon", ...props }, ref)=>{
     const { orientation, scrollNext, canScrollNext } = useCarousel();
+    const mergedProps = mergeProps({
+        onClick: scrollNext,
+        disabled: !canScrollNext
+    }, props);
     return /*#__PURE__*/ jsxs(Button, {
         ref: ref,
         variant: variant,
         size: size,
-        className: cn("absolute h-8 w-8 rounded-full", "horizontal" === orientation ? "top-1/2 -right-12 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className),
-        disabled: !canScrollNext,
-        onClick: scrollNext,
-        ...props,
+        "data-orientation": orientation,
+        className: cn(carousel_module.navigationButton, carousel_module.nextButton, className),
+        ...mergedProps,
         children: [
-            /*#__PURE__*/ jsx(ArrowRight, {
-                className: "h-4 w-4"
+            children ?? /*#__PURE__*/ jsx(ArrowRight, {
+                className: carousel_module.navigationIcon
             }),
             /*#__PURE__*/ jsx("span", {
-                className: "sr-only",
+                className: carousel_module.srOnly,
                 children: "Next slide"
             })
         ]

package/dist/components/ui/carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"components/ui/carousel.js","sources":["../../../src/components/ui/carousel.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport useEmblaCarousel, {type UseEmblaCarouselType} from \"embla-carousel-react\";\r\nimport {ArrowLeft, ArrowRight} from \"lucide-react\";\r\nimport * as React from \"react\";\r\n\r\nimport {Button} from \"@/components/ui/button\";\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\ntype CarouselApi = UseEmblaCarouselType[1];\r\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\r\ntype CarouselOptions = UseCarouselParameters[0];\r\ntype CarouselPlugin = UseCarouselParameters[1];\r\n\r\ntype CarouselProps = {\r\n  opts?: CarouselOptions;\r\n  plugins?: CarouselPlugin;\r\n  orientation?: \"horizontal\" | \"vertical\";\r\n  setApi?: (api: CarouselApi) => void;\r\n};\r\n\r\ntype CarouselContextProps = {\r\n  carouselRef: ReturnType<typeof useEmblaCarousel>[0];\r\n  api: ReturnType<typeof useEmblaCarousel>[1];\r\n  scrollPrev: () => void;\r\n  scrollNext: () => void;\r\n  canScrollPrev: boolean;\r\n  canScrollNext: boolean;\r\n} & CarouselProps;\r\n\r\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\r\n\r\nfunction useCarousel() {\r\n  const context = React.useContext(CarouselContext);\r\n\r\n  if (!context) {\r\n    throw new Error(\"useCarousel must be used within a <Carousel />\");\r\n  }\r\n\r\n  return context;\r\n}\r\n\r\nconst Carousel = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement> & CarouselProps>(\r\n  ({orientation = \"horizontal\", opts, setApi, plugins, className, children, ...props}, ref) => {\r\n    const [carouselRef, api] = useEmblaCarousel(\r\n      {\r\n        ...opts,\r\n        axis: orientation === \"horizontal\" ? \"x\" : \"y\",\r\n      },\r\n      plugins,\r\n    );\r\n    const [canScrollPrev, setCanScrollPrev] = React.useState(false);\r\n    const [canScrollNext, setCanScrollNext] = React.useState(false);\r\n\r\n    const onSelect = React.useCallback((api: CarouselApi) => {\r\n      if (!api) {\r\n        return;\r\n      }\r\n\r\n      setCanScrollPrev(api.canScrollPrev());\r\n      setCanScrollNext(api.canScrollNext());\r\n    }, []);\r\n\r\n    const scrollPrev = React.useCallback(() => {\r\n      api?.scrollPrev();\r\n    }, [api]);\r\n\r\n    const scrollNext = React.useCallback(() => {\r\n      api?.scrollNext();\r\n    }, [api]);\r\n\r\n    const handleKeyDown = React.useCallback(\r\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n        if (event.key === \"ArrowLeft\") {\r\n          event.preventDefault();\r\n          scrollPrev();\r\n        } else if (event.key === \"ArrowRight\") {\r\n          event.preventDefault();\r\n          scrollNext();\r\n        }\r\n      },\r\n      [scrollPrev, scrollNext],\r\n    );\r\n\r\n    React.useEffect(() => {\r\n      if (!api || !setApi) {\r\n        return;\r\n      }\r\n\r\n      setApi(api);\r\n    }, [api, setApi]);\r\n\r\n    React.useEffect(() => {\r\n      if (!api) {\r\n        return;\r\n      }\r\n\r\n      onSelect(api);\r\n      api.on(\"reInit\", onSelect);\r\n      api.on(\"select\", onSelect);\r\n\r\n      return () => {\r\n        api?.off(\"select\", onSelect);\r\n      };\r\n    }, [api, onSelect]);\r\n\r\n    return (\r\n      <CarouselContext.Provider\r\n        value={{\r\n          carouselRef,\r\n          api,\r\n          opts,\r\n          orientation: orientation || (opts?.axis === \"y\" ? \"vertical\" : \"horizontal\"),\r\n          scrollPrev,\r\n          scrollNext,\r\n          canScrollPrev,\r\n          canScrollNext,\r\n        }}>\r\n        <div\r\n          ref={ref}\r\n          onKeyDownCapture={handleKeyDown}\r\n          className={cn(\"relative\", className)}\r\n          role='region'\r\n          aria-roledescription='carousel'\r\n          {...props}>\r\n          {children}\r\n        </div>\r\n      </CarouselContext.Provider>\r\n    );\r\n  },\r\n);\r\nCarousel.displayName = \"Carousel\";\r\n\r\nconst CarouselContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({className, ...props}, ref) => {\r\n  const {carouselRef, orientation} = useCarousel();\r\n\r\n  return (\r\n    <div\r\n      ref={carouselRef}\r\n      className='overflow-hidden'>\r\n      <div\r\n        ref={ref}\r\n        className={cn(\"flex\", orientation === \"horizontal\" ? \"-ml-4\" : \"-mt-4 flex-col\", className)}\r\n        {...props}\r\n      />\r\n    </div>\r\n  );\r\n});\r\nCarouselContent.displayName = \"CarouselContent\";\r\n\r\nconst CarouselItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({className, ...props}, ref) => {\r\n  const {orientation} = useCarousel();\r\n\r\n  return (\r\n    <div\r\n      ref={ref}\r\n      role='group'\r\n      aria-roledescription='slide'\r\n      className={cn(\"min-w-0 shrink-0 grow-0 basis-full\", orientation === \"horizontal\" ? \"pl-4\" : \"pt-4\", className)}\r\n      {...props}\r\n    />\r\n  );\r\n});\r\nCarouselItem.displayName = \"CarouselItem\";\r\n\r\nconst CarouselPrevious = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(\r\n  ({className, variant = \"outline\", size = \"icon\", ...props}, ref) => {\r\n    const {orientation, scrollPrev, canScrollPrev} = useCarousel();\r\n\r\n    return (\r\n      <Button\r\n        ref={ref}\r\n        variant={variant}\r\n        size={size}\r\n        className={cn(\r\n          \"absolute h-8 w-8 rounded-full\",\r\n          orientation === \"horizontal\" ? \"top-1/2 -left-12 -translate-y-1/2\" : \"-top-12 left-1/2 -translate-x-1/2 rotate-90\",\r\n          className,\r\n        )}\r\n        disabled={!canScrollPrev}\r\n        onClick={scrollPrev}\r\n        {...props}>\r\n        <ArrowLeft className='h-4 w-4' />\r\n        <span className='sr-only'>Previous slide</span>\r\n      </Button>\r\n    );\r\n  },\r\n);\r\nCarouselPrevious.displayName = \"CarouselPrevious\";\r\n\r\nconst CarouselNext = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(\r\n  ({className, variant = \"outline\", size = \"icon\", ...props}, ref) => {\r\n    const {orientation, scrollNext, canScrollNext} = useCarousel();\r\n\r\n    return (\r\n      <Button\r\n        ref={ref}\r\n        variant={variant}\r\n        size={size}\r\n        className={cn(\r\n          \"absolute h-8 w-8 rounded-full\",\r\n          orientation === \"horizontal\" ? \"top-1/2 -right-12 -translate-y-1/2\" : \"-bottom-12 left-1/2 -translate-x-1/2 rotate-90\",\r\n          className,\r\n        )}\r\n        disabled={!canScrollNext}\r\n        onClick={scrollNext}\r\n        {...props}>\r\n        <ArrowRight className='h-4 w-4' />\r\n        <span className='sr-only'>Next slide</span>\r\n      </Button>\r\n    );\r\n  },\r\n);\r\nCarouselNext.displayName = \"CarouselNext\";\r\n\r\nexport {Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type CarouselApi};\r\n"],"names":["CarouselContext","React","useCarousel","context","Error","Carousel","orientation","opts","setApi","plugins","className","children","props","ref","carouselRef","api","useEmblaCarousel","canScrollPrev","setCanScrollPrev","canScrollNext","setCanScrollNext","onSelect","scrollPrev","scrollNext","handleKeyDown","event","cn","CarouselContent","CarouselItem","CarouselPrevious","variant","size","Button","ArrowLeft","CarouselNext","ArrowRight"],"mappings":"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"}
+{"version":3,"file":"components/ui/carousel.js","sources":["../../../src/components/ui/carousel.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport {mergeProps} from \"@base-ui/react/merge-props\";\r\nimport useEmblaCarousel, {type UseEmblaCarouselType} from \"embla-carousel-react\";\r\nimport {ArrowLeft, ArrowRight} from \"lucide-react\";\r\nimport * as React from \"react\";\r\n\r\nimport {Button} from \"@/components/ui/button\";\r\nimport {cn} from \"@/lib/utilities\";\r\n\r\nimport styles from \"./carousel.module.css\";\r\n\r\ntype CarouselApi = NonNullable<UseEmblaCarouselType[1]>;\r\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\r\ntype CarouselOptions = UseCarouselParameters[0];\r\ntype CarouselPlugin = UseCarouselParameters[1];\r\n\r\n/**\r\n * Carousel configuration props.\r\n */\r\ntype CarouselProps = {\r\n  /**\r\n   * Embla carousel options forwarded to the underlying carousel instance.\r\n   * @default undefined\r\n   */\r\n  opts?: CarouselOptions;\r\n  /**\r\n   * Embla plugins applied to the carousel instance.\r\n   * @default undefined\r\n   */\r\n  plugins?: CarouselPlugin;\r\n  /**\r\n   * Axis orientation used for layout and keyboard navigation. This prop also\r\n   * controls Embla's internal `axis` option (`\"x\"` for horizontal and `\"y\"`\r\n   * for vertical).\r\n   * @default \"horizontal\"\r\n   */\r\n  orientation?: \"horizontal\" | \"vertical\";\r\n  /**\r\n   * Callback invoked with the initialized Embla API instance.\r\n   * @default undefined\r\n   */\r\n  setApi?: (api: CarouselApi) => void;\r\n};\r\n\r\ntype CarouselContextProps = {\r\n  carouselRef: ReturnType<typeof useEmblaCarousel>[0];\r\n  api: ReturnType<typeof useEmblaCarousel>[1];\r\n  scrollPrev: () => void;\r\n  scrollNext: () => void;\r\n  canScrollPrev: boolean;\r\n  canScrollNext: boolean;\r\n} & CarouselProps;\r\n\r\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\r\n\r\nfunction useCarousel(): CarouselContextProps {\r\n  const context = React.useContext(CarouselContext);\r\n\r\n  if (!context) {\r\n    throw new Error(\"useCarousel must be used within a <Carousel />\");\r\n  }\r\n\r\n  return context;\r\n}\r\n\r\n/**\r\n * Provides a compound carousel container powered by Embla.\r\n *\r\n * @remarks\r\n * - Renders a `<div>` element\r\n * - Built on `embla-carousel-react`\r\n * - Exposes context for content, items, and navigation controls\r\n *\r\n * @example\r\n * ```tsx\r\n * <Carousel>\r\n *   <CarouselContent>\r\n *     <CarouselItem>Slide 1</CarouselItem>\r\n *     <CarouselItem>Slide 2</CarouselItem>\r\n *   </CarouselContent>\r\n *   <CarouselPrevious />\r\n *   <CarouselNext />\r\n * </Carousel>\r\n * ```\r\n *\r\n * @param props.opts - Embla options forwarded to the carousel instance. Common\r\n * options include `loop` for infinite scrolling, `align` for slide alignment,\r\n * `slidesToScroll` to control navigation increments, `dragFree` for momentum\r\n * dragging, `duration` for transition timing, and `startIndex` for the initial\r\n * slide.\r\n * @param props.plugins - Embla plugins applied to the carousel instance.\r\n *\r\n * @example With autoplay\r\n * ```tsx\r\n * import Autoplay from \"embla-carousel-autoplay\";\r\n *\r\n * <Carousel plugins={[Autoplay({delay: 3000})]}>\r\n *   <CarouselContent>...</CarouselContent>\r\n * </Carousel>\r\n * ```\r\n *\r\n * @param props.setApi - Optional callback for advanced Embla API access after\r\n * initialization, useful for custom controls, analytics, or external state\r\n * synchronization.\r\n *\r\n * @see {@link https://www.embla-carousel.com/get-started/react/ | Embla React Docs}\r\n */\r\nconst Carousel = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement> & CarouselProps>(\r\n  ({orientation, opts, setApi, plugins, className, children, ...props}, ref) => {\r\n    // Derive axis from orientation, or orientation from opts.axis, defaulting to horizontal.\r\n    const resolvedOrientation = orientation ?? (opts?.axis === \"y\" ? \"vertical\" : \"horizontal\");\r\n    const resolvedAxis = resolvedOrientation === \"vertical\" ? \"y\" : \"x\";\r\n\r\n    const [carouselRef, api] = useEmblaCarousel(\r\n      {\r\n        ...opts,\r\n        axis: resolvedAxis,\r\n      },\r\n      plugins,\r\n    );\r\n    const [canScrollPrev, setCanScrollPrev] = React.useState(false);\r\n    const [canScrollNext, setCanScrollNext] = React.useState(false);\r\n\r\n    const onSelect = React.useCallback((emblaApi: CarouselApi) => {\r\n      if (!emblaApi) {\r\n        return;\r\n      }\r\n\r\n      setCanScrollPrev(emblaApi.canScrollPrev());\r\n      setCanScrollNext(emblaApi.canScrollNext());\r\n    }, []);\r\n\r\n    const scrollPrev = React.useCallback(() => {\r\n      api?.scrollPrev();\r\n    }, [api]);\r\n\r\n    const scrollNext = React.useCallback(() => {\r\n      api?.scrollNext();\r\n    }, [api]);\r\n\r\n    const handleKeyDown = React.useCallback(\r\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n        if (orientation === \"horizontal\") {\r\n          if (event.key === \"ArrowLeft\") {\r\n            event.preventDefault();\r\n            scrollPrev();\r\n          } else if (event.key === \"ArrowRight\") {\r\n            event.preventDefault();\r\n            scrollNext();\r\n          }\r\n\r\n          return;\r\n        }\r\n\r\n        if (event.key === \"ArrowUp\") {\r\n          event.preventDefault();\r\n          scrollPrev();\r\n        } else if (event.key === \"ArrowDown\") {\r\n          event.preventDefault();\r\n          scrollNext();\r\n        }\r\n      },\r\n      [orientation, scrollNext, scrollPrev],\r\n    );\r\n\r\n    React.useEffect(() => {\r\n      if (!api || !setApi) {\r\n        return;\r\n      }\r\n\r\n      setApi(api);\r\n    }, [api, setApi]);\r\n\r\n    React.useEffect(() => {\r\n      if (!api) {\r\n        return;\r\n      }\r\n\r\n      onSelect(api);\r\n      api.on(\"reInit\", onSelect);\r\n      api.on(\"select\", onSelect);\r\n\r\n      return () => {\r\n        api.off(\"reInit\", onSelect);\r\n        api.off(\"select\", onSelect);\r\n      };\r\n    }, [api, onSelect]);\r\n\r\n    return (\r\n      <CarouselContext.Provider\r\n        value={{\r\n          api,\r\n          canScrollNext,\r\n          canScrollPrev,\r\n          carouselRef,\r\n          opts,\r\n          orientation: resolvedOrientation,\r\n          plugins,\r\n          scrollNext,\r\n          scrollPrev,\r\n          setApi,\r\n        }}>\r\n        <div\r\n          ref={ref}\r\n          data-orientation={resolvedOrientation}\r\n          onKeyDownCapture={handleKeyDown}\r\n          className={cn(styles.carousel, className)}\r\n          role='region'\r\n          aria-roledescription='carousel'\r\n          {...props}>\r\n          {children}\r\n        </div>\r\n      </CarouselContext.Provider>\r\n    );\r\n  },\r\n);\r\nCarousel.displayName = \"Carousel\";\r\n\r\n/**\r\n * Renders the scrollable track that contains carousel slides.\r\n *\r\n * @remarks\r\n * - Renders nested `<div>` elements\r\n * - Built on Embla's viewport and track structure\r\n *\r\n * @example\r\n * ```tsx\r\n * <CarouselContent>\r\n *   <CarouselItem>Slide</CarouselItem>\r\n * </CarouselContent>\r\n * ```\r\n *\r\n * @see {@link https://www.embla-carousel.com/get-started/react/ | Embla React Docs}\r\n */\r\nconst CarouselContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({className, ...props}, ref) => {\r\n  const {carouselRef, orientation} = useCarousel();\r\n\r\n  return (\r\n    <div\r\n      ref={carouselRef}\r\n      className={styles.viewport}>\r\n      <div\r\n        ref={ref}\r\n        data-orientation={orientation}\r\n        className={cn(styles.content, orientation === \"vertical\" && styles.contentVertical, className)}\r\n        {...props}\r\n      />\r\n    </div>\r\n  );\r\n});\r\nCarouselContent.displayName = \"CarouselContent\";\r\n\r\n/**\r\n * Renders an individual carousel slide.\r\n *\r\n * @remarks\r\n * - Renders a `<div>` element\r\n * - Built on the shared carousel context for orientation-aware styling\r\n *\r\n * @example\r\n * ```tsx\r\n * <CarouselItem>Slide content</CarouselItem>\r\n * ```\r\n *\r\n * @see {@link https://www.embla-carousel.com/get-started/react/ | Embla React Docs}\r\n */\r\nconst CarouselItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({className, ...props}, ref) => {\r\n  const {orientation} = useCarousel();\r\n\r\n  return (\r\n    <div\r\n      ref={ref}\r\n      role='group'\r\n      aria-roledescription='slide'\r\n      data-orientation={orientation}\r\n      className={cn(styles.item, orientation === \"vertical\" && styles.itemVertical, className)}\r\n      {...props}\r\n    />\r\n  );\r\n});\r\nCarouselItem.displayName = \"CarouselItem\";\r\n\r\n/**\r\n * Renders the previous-slide navigation button.\r\n *\r\n * @remarks\r\n * - Renders the shared `<Button>` component\r\n * - Built on carousel context state and Embla navigation APIs\r\n * - Pass `children` to override the default `ArrowLeft` navigation icon\r\n *\r\n * @example\r\n * ```tsx\r\n * <CarouselPrevious />\r\n * ```\r\n *\r\n * @see {@link https://www.embla-carousel.com/get-started/react/ | Embla React Docs}\r\n */\r\nconst CarouselPrevious = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(\r\n  ({children, className, variant = \"outline\", size = \"icon\", ...props}, ref) => {\r\n    const {orientation, scrollPrev, canScrollPrev} = useCarousel();\r\n    const mergedProps = mergeProps<\"button\">({onClick: scrollPrev, disabled: !canScrollPrev}, props);\r\n\r\n    return (\r\n      <Button\r\n        ref={ref}\r\n        variant={variant}\r\n        size={size}\r\n        data-orientation={orientation}\r\n        className={cn(styles.navigationButton, styles.previousButton, className)}\r\n        {...mergedProps}>\r\n        {children ?? <ArrowLeft className={styles.navigationIcon} />}\r\n        <span className={styles.srOnly}>Previous slide</span>\r\n      </Button>\r\n    );\r\n  },\r\n);\r\nCarouselPrevious.displayName = \"CarouselPrevious\";\r\n\r\n/**\r\n * Renders the next-slide navigation button.\r\n *\r\n * @remarks\r\n * - Renders the shared `<Button>` component\r\n * - Built on carousel context state and Embla navigation APIs\r\n * - Pass `children` to override the default `ArrowRight` navigation icon\r\n *\r\n * @example\r\n * ```tsx\r\n * <CarouselNext />\r\n * ```\r\n *\r\n * @see {@link https://www.embla-carousel.com/get-started/react/ | Embla React Docs}\r\n */\r\nconst CarouselNext = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(\r\n  ({children, className, variant = \"outline\", size = \"icon\", ...props}, ref) => {\r\n    const {orientation, scrollNext, canScrollNext} = useCarousel();\r\n    const mergedProps = mergeProps<\"button\">({onClick: scrollNext, disabled: !canScrollNext}, props);\r\n\r\n    return (\r\n      <Button\r\n        ref={ref}\r\n        variant={variant}\r\n        size={size}\r\n        data-orientation={orientation}\r\n        className={cn(styles.navigationButton, styles.nextButton, className)}\r\n        {...mergedProps}>\r\n        {children ?? <ArrowRight className={styles.navigationIcon} />}\r\n        <span className={styles.srOnly}>Next slide</span>\r\n      </Button>\r\n    );\r\n  },\r\n);\r\nCarouselNext.displayName = \"CarouselNext\";\r\n\r\nexport {Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type CarouselApi};\r\nexport type {CarouselOptions, CarouselPlugin, CarouselProps};\r\n"],"names":["CarouselContext","React","useCarousel","context","Error","Carousel","orientation","opts","setApi","plugins","className","children","props","ref","resolvedOrientation","resolvedAxis","carouselRef","api","useEmblaCarousel","canScrollPrev","setCanScrollPrev","canScrollNext","setCanScrollNext","onSelect","emblaApi","scrollPrev","scrollNext","handleKeyDown","event","cn","styles","CarouselContent","CarouselItem","CarouselPrevious","variant","size","mergedProps","mergeProps","Button","ArrowLeft","CarouselNext","ArrowRight"],"mappings":"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"}

package/dist/components/ui/carousel.module.js

@@ -0,0 +1,17 @@
+import "./carousel_module.css";
+const carousel_module = {
+    carousel: "carousel-Kp9sWX",
+    viewport: "viewport-IbS70T",
+    content: "content-zNz62l",
+    contentVertical: "contentVertical-rLxYqe",
+    item: "item-ShUcg2",
+    itemVertical: "itemVertical-md0YJC",
+    navigationButton: "navigationButton-lmtsj2",
+    previousButton: "previousButton-dY1o3P",
+    nextButton: "nextButton-cpcq6l",
+    navigationIcon: "navigationIcon-AP0GIW",
+    srOnly: "srOnly-KHaCsg"
+};
+export default carousel_module;
+
+//# sourceMappingURL=carousel.module.js.map

package/dist/components/ui/carousel.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components/ui/carousel.module.js","sources":["../../../src/components/ui/carousel.module.css"],"sourcesContent":["// extracted by LIB_CSS_EXTRACT_LOADER\nimport \"./carousel_module.css\"\nexport default {\"carousel\":\"carousel-Kp9sWX\",\"viewport\":\"viewport-IbS70T\",\"content\":\"content-zNz62l\",\"contentVertical\":\"contentVertical-rLxYqe\",\"item\":\"item-ShUcg2\",\"itemVertical\":\"itemVertical-md0YJC\",\"navigationButton\":\"navigationButton-lmtsj2\",\"previousButton\":\"previousButton-dY1o3P\",\"nextButton\":\"nextButton-cpcq6l\",\"navigationIcon\":\"navigationIcon-AP0GIW\",\"srOnly\":\"srOnly-KHaCsg\"};"],"names":[],"mappings":";AAEA,wBAAe;IAAC,UAAW;IAAkB,UAAW;IAAkB,SAAU;IAAiB,iBAAkB;IAAyB,MAAO;IAAc,cAAe;IAAsB,kBAAmB;IAA0B,gBAAiB;IAAwB,YAAa;IAAoB,gBAAiB;IAAwB,QAAS;AAAe"}

package/dist/components/ui/carousel_module.css

@@ -0,0 +1,82 @@
+.carousel-Kp9sWX {
+  position: relative;
+}
+
+.viewport-IbS70T {
+  overflow: hidden;
+}
+
+.content-zNz62l {
+  margin-left: calc(var(--ac-space-4)*-1);
+  display: flex;
+}
+
+.contentVertical-rLxYqe {
+  margin-left: 0;
+  margin-top: calc(var(--ac-space-4)*-1);
+  flex-direction: column;
+}
+
+.item-ShUcg2 {
+  min-width: 0;
+  padding-left: var(--ac-space-4);
+  flex: 0 0 100%;
+}
+
+.itemVertical-md0YJC {
+  padding-left: 0;
+  padding-top: var(--ac-space-4);
+}
+
+.navigationButton-lmtsj2 {
+  border-radius: 999px;
+  width: 2rem;
+  height: 2rem;
+  position: absolute;
+}
+
+.navigationButton-lmtsj2[data-orientation="horizontal"] {
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.navigationButton-lmtsj2[data-orientation="vertical"] {
+  left: 50%;
+  transform: translateX(-50%)rotate(90deg);
+}
+
+.previousButton-dY1o3P[data-orientation="horizontal"] {
+  left: -3rem;
+}
+
+.nextButton-cpcq6l[data-orientation="horizontal"] {
+  right: -3rem;
+}
+
+.previousButton-dY1o3P[data-orientation="vertical"] {
+  top: -3rem;
+}
+
+.nextButton-cpcq6l[data-orientation="vertical"] {
+  bottom: -3rem;
+}
+
+.navigationIcon-AP0GIW {
+  width: 1rem;
+  height: 1rem;
+}
+
+.srOnly-KHaCsg {
+  clip: rect(0,0,0,0);
+  white-space: nowrap;
+  border: 0;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  position: absolute;
+  overflow: hidden;
+}
+
+
+/*# sourceMappingURL=carousel_module.css.map */

package/dist/components/ui/carousel_module.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["webpack://./home/runner/work/arolariu.ro/arolariu.ro/packages/components/src/components/ui/carousel.module.css","webpack://./src/components/ui/carousel.module.css"],"names":[],"mappings":"AADA;ECEE,kBAAkB;AACpB;;AAEA;EACE,gBAAgB;AAClB;;AAEA;EACE,uCAAuC;EACvC,aAAa;AACf;;AAEA;EACE,cAAc;EACd,sCAAsC;EACtC,sBAAsB;AACxB;;AAEA;EACE,YAAY;EACZ,+BAA+B;EAC/B,cAAc;AAChB;;AAEA;EACE,eAAe;EACf,8BAA8B;AAChC;;AAEA;EACE,oBAAoB;EACpB,WAAW;EACX,YAAY;EACZ,kBAAkB;AACpB;;AAEA;EACE,QAAQ;EACR,2BAA2B;AAC7B;;AAEA;EACE,SAAS;EACT,wCAAwC;AAC1C;;AAEA;EACE,WAAW;AACb;;AAEA;EACE,YAAY;AACd;;AAEA;EACE,UAAU;AACZ;;AAEA;EACE,aAAa;AACf;;AAEA;EACE,WAAW;EACX,YAAY;AACd;;AAEA;EACE,mBAAmB;EACnB,mBAAmB;EACnB,SAAS;EACT,UAAU;EACV,WAAW;EACX,YAAY;EACZ,UAAU;EACV,kBAAkB;EAClB,gBAAgB;AAClB","sourcesContent":[".carousel{position:relative}.viewport{overflow:hidden}.content{display:flex;margin-left:calc(var(--ac-space-4)*-1)}.contentVertical{flex-direction:column;margin-left:0;margin-top:calc(var(--ac-space-4)*-1)}.item{flex:0 0 100%;min-width:0;padding-left:var(--ac-space-4)}.itemVertical{padding-left:0;padding-top:var(--ac-space-4)}.navigationButton{border-radius:999px;height:2rem;position:absolute;width:2rem}.navigationButton[data-orientation=horizontal]{top:50%;transform:translateY(-50%)}.navigationButton[data-orientation=vertical]{left:50%;transform:translateX(-50%) rotate(90deg)}.previousButton[data-orientation=horizontal]{left:-3rem}.nextButton[data-orientation=horizontal]{right:-3rem}.previousButton[data-orientation=vertical]{top:-3rem}.nextButton[data-orientation=vertical]{bottom:-3rem}.navigationIcon{height:1rem;width:1rem}.srOnly{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border:0;white-space:nowrap}",".carousel {\n  position: relative;\n}\n\n.viewport {\n  overflow: hidden;\n}\n\n.content {\n  margin-left: calc(var(--ac-space-4)*-1);\n  display: flex;\n}\n\n.contentVertical {\n  margin-left: 0;\n  margin-top: calc(var(--ac-space-4)*-1);\n  flex-direction: column;\n}\n\n.item {\n  min-width: 0;\n  padding-left: var(--ac-space-4);\n  flex: 0 0 100%;\n}\n\n.itemVertical {\n  padding-left: 0;\n  padding-top: var(--ac-space-4);\n}\n\n.navigationButton {\n  border-radius: 999px;\n  width: 2rem;\n  height: 2rem;\n  position: absolute;\n}\n\n.navigationButton[data-orientation=\"horizontal\"] {\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n.navigationButton[data-orientation=\"vertical\"] {\n  left: 50%;\n  transform: translateX(-50%)rotate(90deg);\n}\n\n.previousButton[data-orientation=\"horizontal\"] {\n  left: -3rem;\n}\n\n.nextButton[data-orientation=\"horizontal\"] {\n  right: -3rem;\n}\n\n.previousButton[data-orientation=\"vertical\"] {\n  top: -3rem;\n}\n\n.nextButton[data-orientation=\"vertical\"] {\n  bottom: -3rem;\n}\n\n.navigationIcon {\n  width: 1rem;\n  height: 1rem;\n}\n\n.srOnly {\n  clip: rect(0,0,0,0);\n  white-space: nowrap;\n  border: 0;\n  width: 1px;\n  height: 1px;\n  margin: -1px;\n  padding: 0;\n  position: absolute;\n  overflow: hidden;\n}\n"],"sourceRoot":""}