@szum-tech/design-system
Version:
Szum-Tech design system with tailwindcss support
3 lines (2 loc) • 3.34 kB
JavaScript
"use client";
import {a as a$2}from'../../chunk-M7WD2A7J.js';import'../../chunk-RLQVCUZA.js';import'../../chunk-FLOFQPVA.js';import {a as a$1}from'../../chunk-JUNHRB4B.js';import*as a from'react';import I from'embla-carousel-react';import {cva}from'class-variance-authority';import {jsx,jsxs}from'react/jsx-runtime';import {ArrowLeft,ArrowRight}from'lucide-react';var v=a.createContext(null);function l(){let e=a.useContext(v);if(!e)throw new Error("useCarousel must be used within a <Carousel />");return e}var d=cva("relative",{variants:{orientation:{horizontal:"",vertical:""}},defaultVariants:{orientation:"horizontal"}}),R=cva("flex",{variants:{orientation:{horizontal:"-ml-4",vertical:"-mt-4 flex-col"}},defaultVariants:{orientation:"horizontal"}}),b=cva("min-w-0 shrink-0 grow-0 basis-full",{variants:{orientation:{horizontal:"pl-4",vertical:"pt-4"}},defaultVariants:{orientation:"horizontal"}});function G({orientation:e="horizontal",opts:t,setApi:r,plugins:n,className:u,children:c,...m}){let[S,o]=I({...t,axis:e==="horizontal"?"x":"y"},n),[g,w]=a.useState(false),[E,k]=a.useState(false),i=a.useCallback(s=>{s&&(w(s.canScrollPrev()),k(s.canScrollNext()));},[]),x=a.useCallback(()=>{o?.scrollPrev();},[o]),P=a.useCallback(()=>{o?.scrollNext();},[o]),A=a.useCallback(s=>{s.key==="ArrowLeft"?(s.preventDefault(),x()):s.key==="ArrowRight"&&(s.preventDefault(),P());},[x,P]);return a.useEffect(()=>{!o||!r||r(o);},[o,r]),a.useEffect(()=>{if(o)return i(o),o.on("reInit",i),o.on("select",i),()=>{o?.off("reInit",i),o?.off("select",i);}},[o,i]),jsx(v.Provider,{value:{carouselRef:S,api:o,opts:t,orientation:e||(t?.axis==="y"?"vertical":"horizontal"),scrollPrev:x,scrollNext:P,canScrollPrev:g,canScrollNext:E},children:jsx("div",{onKeyDownCapture:A,className:d({orientation:e,className:u}),role:"region","aria-roledescription":"carousel","data-slot":"carousel",...m,children:c})})}function Y({className:e,...t}){let{carouselRef:r,orientation:n}=l();return jsx("div",{ref:r,className:"overflow-hidden","data-slot":"carousel-content",children:jsx("div",{className:R({orientation:n,className:e}),...t})})}function eo({className:e,...t}){let{orientation:r}=l();return jsx("div",{role:"group","aria-roledescription":"slide","data-slot":"carousel-item",className:a$1(b({orientation:r,className:e})),...t})}function io({className:e,variant:t="outline",size:r="icon",...n}){let{orientation:u,scrollPrev:c,canScrollPrev:m}=l();return jsxs(a$2,{"data-slot":"carousel-previous",variant:t,size:r,className:a$1("absolute size-8 rounded-full",u==="horizontal"?"top-1/2 -left-12 -translate-y-1/2":"-top-12 left-1/2 -translate-x-1/2 rotate-90",e),disabled:!m,onClick:c,...n,children:[jsx(ArrowLeft,{}),jsx("span",{className:"sr-only",children:"Previous slide"})]})}function xo({className:e,variant:t="outline",size:r="icon",...n}){let{orientation:u,scrollNext:c,canScrollNext:m}=l();return jsxs(a$2,{"data-slot":"carousel-next",variant:t,size:r,className:a$1("absolute size-8 rounded-full",u==="horizontal"?"top-1/2 -right-12 -translate-y-1/2":"-bottom-12 left-1/2 -translate-x-1/2 rotate-90",e),disabled:!m,onClick:c,...n,children:[jsx(ArrowRight,{}),jsx("span",{className:"sr-only",children:"Next slide"})]})}export{G as Carousel,Y as CarouselContent,v as CarouselContext,eo as CarouselItem,xo as CarouselNext,io as CarouselPrevious,l as useCarousel};