@codefast/ui 0.3.9 → 0.3.11-canary.0

package/dist/components/card.js

@@ -1 +1,53 @@
-import{jsx as t}from"react/jsx-runtime";import{cn as a}from"@codefast/tailwind-variants";function r({className:r,...o}){return t("div",{className:a("bg-card text-card-foreground flex flex-col gap-6 overflow-auto rounded-xl border py-6 shadow-sm",r),"data-slot":"card",...o})}function o({className:r,...o}){return t("div",{className:a("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-[data-slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",r),"data-slot":"card-header",...o})}function e({children:r,className:o,...e}){return t("div",{className:a("leading-none font-semibold",o),"data-slot":"card-title",...e,children:r})}function d({className:r,...o}){return t("div",{className:a("text-muted-foreground text-sm",r),"data-slot":"card-description",...o})}function n({className:r,...o}){return t("div",{className:a("px-6",r),"data-slot":"card-content",...o})}function s({className:r,...o}){return t("div",{className:a("flex items-center px-6 [.border-t]:pt-6",r),"data-slot":"card-footer",...o})}function i({className:r,...o}){return t("div",{className:a("col-start-2 row-span-2 row-start-1 self-start justify-self-end",r),"data-slot":"card-action",...o})}export{r as Card,i as CardAction,n as CardContent,d as CardDescription,s as CardFooter,o as CardHeader,e as CardTitle};
+import { jsx } from "react/jsx-runtime";
+import { cn } from "@codefast/tailwind-variants";
+function Card({ className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn("flex flex-col gap-6 overflow-auto rounded-xl border bg-card py-6 text-card-foreground shadow-sm", className),
+        "data-slot": "card",
+        ...props
+    });
+}
+function CardHeader({ className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-[data-slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6", className),
+        "data-slot": "card-header",
+        ...props
+    });
+}
+function CardTitle({ children, className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn("leading-none font-semibold", className),
+        "data-slot": "card-title",
+        ...props,
+        children: children
+    });
+}
+function CardDescription({ className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn("text-sm text-muted-foreground", className),
+        "data-slot": "card-description",
+        ...props
+    });
+}
+function CardContent({ className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn("px-6", className),
+        "data-slot": "card-content",
+        ...props
+    });
+}
+function CardFooter({ className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn("flex items-center px-6 [.border-t]:pt-6", className),
+        "data-slot": "card-footer",
+        ...props
+    });
+}
+function CardAction({ className, ...props }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className),
+        "data-slot": "card-action",
+        ...props
+    });
+}
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/components/carousel.cjs

@@ -1,2 +1,211 @@
+"use strict";
 "use client";
-"use strict";const __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return __webpack_require__.d(a,{a:a}),a},__webpack_require__.d=(e,a)=>{for(var t in a)__webpack_require__.o(a,t)&&!__webpack_require__.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:a[t]})},__webpack_require__.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CarouselPrevious:()=>CarouselPrevious,Carousel:()=>Carousel,createCarouselScope:()=>createCarouselScope,CarouselContent:()=>CarouselContent,CarouselItem:()=>CarouselItem,CarouselNext:()=>CarouselNext});const jsx_runtime_namespaceObject=require("react/jsx-runtime"),external_embla_carousel_react_namespaceObject=require("embla-carousel-react");var external_embla_carousel_react_default=__webpack_require__.n(external_embla_carousel_react_namespaceObject);const external_lucide_react_namespaceObject=require("lucide-react"),external_react_namespaceObject=require("react"),external_button_cjs_namespaceObject=require("./button.cjs"),tailwind_variants_namespaceObject=require("@codefast/tailwind-variants"),react_context_namespaceObject=require("@radix-ui/react-context"),CAROUSEL_NAME="Carousel",[createCarouselContext,createCarouselScope]=(0,react_context_namespaceObject.createContextScope)(CAROUSEL_NAME),[CarouselContextProvider,useCarouselContext]=createCarouselContext(CAROUSEL_NAME);function Carousel({__scopeCarousel:e,children:a,className:t,opts:r,orientation:s,plugins:_,setApi:c,...o}){let[n,l]=external_embla_carousel_react_default()({...r,axis:"vertical"===s?"y":"x"},_),[u,i]=(0,external_react_namespaceObject.useState)(!1),[p,x]=(0,external_react_namespaceObject.useState)(!1),b=(0,external_react_namespaceObject.useCallback)(e=>{e&&(i(e.canScrollPrev()),x(e.canScrollNext()))},[]),m=(0,external_react_namespaceObject.useCallback)(()=>{l?.scrollPrev()},[l]),C=(0,external_react_namespaceObject.useCallback)(()=>{l?.scrollNext()},[l]),j=(0,external_react_namespaceObject.useCallback)(e=>{"ArrowLeft"===e.key?(e.preventDefault(),m()):"ArrowRight"===e.key&&(e.preventDefault(),C())},[m,C]);return(0,external_react_namespaceObject.useEffect)(()=>{l&&c&&c(l)},[l,c]),(0,external_react_namespaceObject.useEffect)(()=>{if(l)return queueMicrotask(()=>{b(l)}),l.on("reInit",b),l.on("select",b),()=>{l.off("select",b)}},[l,b]),(0,jsx_runtime_namespaceObject.jsx)(CarouselContextProvider,{api:l,canScrollNext:p,canScrollPrev:u,carouselRef:n,opts:r,orientation:s??(r?.axis==="y"?"vertical":"horizontal"),scope:e,scrollNext:C,scrollPrev:m,children:(0,jsx_runtime_namespaceObject.jsx)("div",{className:(0,tailwind_variants_namespaceObject.cn)("relative",t),"data-slot":"carousel",onKeyDownCapture:j,...o,children:a})})}const CAROUSEL_CONTENT_NAME="CarouselContent";function CarouselContent({__scopeCarousel:e,className:a,classNames:t,...r}){let{carouselRef:s,orientation:_}=useCarouselContext("CarouselContent",e);return(0,jsx_runtime_namespaceObject.jsx)("div",{ref:s,className:(0,tailwind_variants_namespaceObject.cn)("overflow-hidden",t?.wrapper),"data-slot":"carousel-content",children:(0,jsx_runtime_namespaceObject.jsx)("div",{className:(0,tailwind_variants_namespaceObject.cn)("flex","horizontal"===_?"-ml-4":"-mt-4 flex-col",t?.content,a),...r})})}const CAROUSEL_ITEM_NAME="CarouselItem";function CarouselItem({__scopeCarousel:e,className:a,...t}){let{orientation:r}=useCarouselContext("CarouselItem",e);return(0,jsx_runtime_namespaceObject.jsx)("div",{"aria-roledescription":"slide",className:(0,tailwind_variants_namespaceObject.cn)("min-w-0 shrink-0 grow-0 basis-full","horizontal"===r?"pl-4":"pt-4",a),"data-slot":"carousel-item",role:"group",...t})}const CAROUSEL_PREVIOUS_NAME="CarouselPrevious";function CarouselPrevious({__scopeCarousel:e,className:a,size:t="icon",variant:r="outline",...s}){let{canScrollPrev:_,orientation:c,scrollPrev:o}=useCarouselContext("CarouselPrevious",e);return(0,jsx_runtime_namespaceObject.jsxs)(external_button_cjs_namespaceObject.Button,{"aria-label":"Previous slide",className:(0,tailwind_variants_namespaceObject.cn)("absolute size-8 shadow-none","horizontal"===c?"top-1/2 -left-12 -translate-y-1/2":"-top-12 left-1/2 -translate-x-1/2 rotate-90",a),"data-slot":"carousel-previous",disabled:!_,size:t,variant:r,onClick:o,...s,children:[(0,jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ArrowLeftIcon,{}),(0,jsx_runtime_namespaceObject.jsx)("span",{className:"sr-only",children:"Previous slide"})]})}const CAROUSEL_NEXT_NAME="CarouselNext";function CarouselNext({__scopeCarousel:e,className:a,size:t="icon",variant:r="outline",...s}){let{canScrollNext:_,orientation:c,scrollNext:o}=useCarouselContext("CarouselNext",e);return(0,jsx_runtime_namespaceObject.jsxs)(external_button_cjs_namespaceObject.Button,{"aria-label":"Next slide",className:(0,tailwind_variants_namespaceObject.cn)("absolute size-8 shadow-none","horizontal"===c?"top-1/2 -right-12 -translate-y-1/2":"-bottom-12 left-1/2 -translate-x-1/2 rotate-90",a),"data-slot":"carousel-next",disabled:!_,size:t,variant:r,onClick:o,...s,children:[(0,jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ArrowRightIcon,{}),(0,jsx_runtime_namespaceObject.jsx)("span",{className:"sr-only",children:"Next slide"})]})}for(var __webpack_i__ in exports.Carousel=__webpack_exports__.Carousel,exports.CarouselContent=__webpack_exports__.CarouselContent,exports.CarouselItem=__webpack_exports__.CarouselItem,exports.CarouselNext=__webpack_exports__.CarouselNext,exports.CarouselPrevious=__webpack_exports__.CarouselPrevious,exports.createCarouselScope=__webpack_exports__.createCarouselScope,__webpack_exports__)-1===["Carousel","CarouselContent","CarouselItem","CarouselNext","CarouselPrevious","createCarouselScope"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.n = (module)=>{
+        var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
+        __webpack_require__.d(getter, {
+            a: getter
+        });
+        return getter;
+    };
+})();
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    CarouselPrevious: ()=>CarouselPrevious,
+    Carousel: ()=>Carousel,
+    createCarouselScope: ()=>createCarouselScope,
+    CarouselContent: ()=>CarouselContent,
+    CarouselItem: ()=>CarouselItem,
+    CarouselNext: ()=>CarouselNext
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const tailwind_variants_namespaceObject = require("@codefast/tailwind-variants");
+const react_context_namespaceObject = require("@radix-ui/react-context");
+const external_embla_carousel_react_namespaceObject = require("embla-carousel-react");
+var external_embla_carousel_react_default = /*#__PURE__*/ __webpack_require__.n(external_embla_carousel_react_namespaceObject);
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_react_namespaceObject = require("react");
+const external_button_cjs_namespaceObject = require("./button.cjs");
+const CAROUSEL_NAME = "Carousel";
+const [createCarouselContext, createCarouselScope] = (0, react_context_namespaceObject.createContextScope)(CAROUSEL_NAME);
+const [CarouselContextProvider, useCarouselContext] = createCarouselContext(CAROUSEL_NAME);
+function Carousel({ __scopeCarousel, children, className, opts, orientation, plugins, setApi, ...props }) {
+    const [carouselRef, api] = external_embla_carousel_react_default()({
+        ...opts,
+        axis: "vertical" === orientation ? "y" : "x"
+    }, plugins);
+    const [canScrollPrevious, setCanScrollPrevious] = (0, external_react_namespaceObject.useState)(false);
+    const [canScrollNext, setCanScrollNext] = (0, external_react_namespaceObject.useState)(false);
+    const onSelect = (0, external_react_namespaceObject.useCallback)((carouselApi)=>{
+        if (!carouselApi) return;
+        setCanScrollPrevious(carouselApi.canScrollPrev());
+        setCanScrollNext(carouselApi.canScrollNext());
+    }, []);
+    const scrollPrevious = (0, external_react_namespaceObject.useCallback)(()=>{
+        api?.scrollPrev();
+    }, [
+        api
+    ]);
+    const scrollNext = (0, external_react_namespaceObject.useCallback)(()=>{
+        api?.scrollNext();
+    }, [
+        api
+    ]);
+    const handleKeyDown = (0, external_react_namespaceObject.useCallback)((event)=>{
+        if ("ArrowLeft" === event.key) {
+            event.preventDefault();
+            scrollPrevious();
+        } else if ("ArrowRight" === event.key) {
+            event.preventDefault();
+            scrollNext();
+        }
+    }, [
+        scrollPrevious,
+        scrollNext
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!api || !setApi) return;
+        setApi(api);
+    }, [
+        api,
+        setApi
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!api) return;
+        queueMicrotask(()=>{
+            onSelect(api);
+        });
+        api.on("reInit", onSelect);
+        api.on("select", onSelect);
+        return ()=>{
+            api.off("select", onSelect);
+        };
+    }, [
+        api,
+        onSelect
+    ]);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CarouselContextProvider, {
+        api: api,
+        canScrollNext: canScrollNext,
+        canScrollPrev: canScrollPrevious,
+        carouselRef: carouselRef,
+        opts: opts,
+        orientation: orientation ?? (opts?.axis === "y" ? "vertical" : "horizontal"),
+        scope: __scopeCarousel,
+        scrollNext: scrollNext,
+        scrollPrev: scrollPrevious,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+            className: (0, tailwind_variants_namespaceObject.cn)("relative", className),
+            "data-slot": "carousel",
+            onKeyDownCapture: handleKeyDown,
+            ...props,
+            children: children
+        })
+    });
+}
+const CAROUSEL_CONTENT_NAME = "CarouselContent";
+function CarouselContent({ __scopeCarousel, className, classNames, ...props }) {
+    const { carouselRef, orientation } = useCarouselContext(CAROUSEL_CONTENT_NAME, __scopeCarousel);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: carouselRef,
+        className: (0, tailwind_variants_namespaceObject.cn)("overflow-hidden", classNames?.wrapper),
+        "data-slot": "carousel-content",
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+            className: (0, tailwind_variants_namespaceObject.cn)("flex", "horizontal" === orientation ? "-ml-4" : "-mt-4 flex-col", classNames?.content, className),
+            ...props
+        })
+    });
+}
+const CAROUSEL_ITEM_NAME = "CarouselItem";
+function CarouselItem({ __scopeCarousel, className, ...props }) {
+    const { orientation } = useCarouselContext(CAROUSEL_ITEM_NAME, __scopeCarousel);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        "aria-roledescription": "slide",
+        className: (0, tailwind_variants_namespaceObject.cn)("min-w-0 shrink-0 grow-0 basis-full", "horizontal" === orientation ? "pl-4" : "pt-4", className),
+        "data-slot": "carousel-item",
+        role: "group",
+        ...props
+    });
+}
+const CAROUSEL_PREVIOUS_NAME = "CarouselPrevious";
+function CarouselPrevious({ __scopeCarousel, className, size = "icon", variant = "outline", ...props }) {
+    const { canScrollPrev, orientation, scrollPrev } = useCarouselContext(CAROUSEL_PREVIOUS_NAME, __scopeCarousel);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_button_cjs_namespaceObject.Button, {
+        "aria-label": "Previous slide",
+        className: (0, tailwind_variants_namespaceObject.cn)("absolute size-8 shadow-none", "horizontal" === orientation ? "top-1/2 -left-12 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className),
+        "data-slot": "carousel-previous",
+        disabled: !canScrollPrev,
+        size: size,
+        variant: variant,
+        onClick: scrollPrev,
+        ...props,
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ArrowLeftIcon, {}),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                className: "sr-only",
+                children: "Previous slide"
+            })
+        ]
+    });
+}
+const CAROUSEL_NEXT_NAME = "CarouselNext";
+function CarouselNext({ __scopeCarousel, className, size = "icon", variant = "outline", ...props }) {
+    const { canScrollNext, orientation, scrollNext } = useCarouselContext(CAROUSEL_NEXT_NAME, __scopeCarousel);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_button_cjs_namespaceObject.Button, {
+        "aria-label": "Next slide",
+        className: (0, tailwind_variants_namespaceObject.cn)("absolute size-8 shadow-none", "horizontal" === orientation ? "top-1/2 -right-12 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className),
+        "data-slot": "carousel-next",
+        disabled: !canScrollNext,
+        size: size,
+        variant: variant,
+        onClick: scrollNext,
+        ...props,
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ArrowRightIcon, {}),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                className: "sr-only",
+                children: "Next slide"
+            })
+        ]
+    });
+}
+exports.Carousel = __webpack_exports__.Carousel;
+exports.CarouselContent = __webpack_exports__.CarouselContent;
+exports.CarouselItem = __webpack_exports__.CarouselItem;
+exports.CarouselNext = __webpack_exports__.CarouselNext;
+exports.CarouselPrevious = __webpack_exports__.CarouselPrevious;
+exports.createCarouselScope = __webpack_exports__.createCarouselScope;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "Carousel",
+    "CarouselContent",
+    "CarouselItem",
+    "CarouselNext",
+    "CarouselPrevious",
+    "createCarouselScope"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/carousel.d.ts

@@ -1,7 +1,7 @@
+import type { Scope } from "@radix-ui/react-context";
 import type { UseEmblaCarouselType } from "embla-carousel-react";
 import type { ComponentProps, JSX } from "react";
 import useEmblaCarousel from "embla-carousel-react";
-import type { Scope } from "@radix-ui/react-context";
 import { Button } from "./button";
 type ScopedProps<P> = P & {
     __scopeCarousel?: Scope;

package/dist/components/carousel.js

@@ -1,2 +1,152 @@
 "use client";
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import r from"embla-carousel-react";import{ArrowLeftIcon as o,ArrowRightIcon as l}from"lucide-react";import{useCallback as a,useEffect as s,useState as i}from"react";import{Button as n}from"./button.js";import{cn as c}from"@codefast/tailwind-variants";import{createContextScope as u}from"@radix-ui/react-context";let d="Carousel",[m,f]=u(d),[p,v]=m(d);function x({__scopeCarousel:t,children:o,className:l,opts:n,orientation:u,plugins:d,setApi:m,...f}){let[v,x]=r({...n,axis:"vertical"===u?"y":"x"},d),[h,C]=i(!1),[N,b]=i(!1),w=a(e=>{e&&(C(e.canScrollPrev()),b(e.canScrollNext()))},[]),y=a(()=>{x?.scrollPrev()},[x]),z=a(()=>{x?.scrollNext()},[x]),P=a(e=>{"ArrowLeft"===e.key?(e.preventDefault(),y()):"ArrowRight"===e.key&&(e.preventDefault(),z())},[y,z]);return s(()=>{x&&m&&m(x)},[x,m]),s(()=>{if(x)return queueMicrotask(()=>{w(x)}),x.on("reInit",w),x.on("select",w),()=>{x.off("select",w)}},[x,w]),e(p,{api:x,canScrollNext:N,canScrollPrev:h,carouselRef:v,opts:n,orientation:u??(n?.axis==="y"?"vertical":"horizontal"),scope:t,scrollNext:z,scrollPrev:y,children:e("div",{className:c("relative",l),"data-slot":"carousel",onKeyDownCapture:P,...f,children:o})})}function h({__scopeCarousel:t,className:r,classNames:o,...l}){let{carouselRef:a,orientation:s}=v("CarouselContent",t);return e("div",{ref:a,className:c("overflow-hidden",o?.wrapper),"data-slot":"carousel-content",children:e("div",{className:c("flex","horizontal"===s?"-ml-4":"-mt-4 flex-col",o?.content,r),...l})})}function C({__scopeCarousel:t,className:r,...o}){let{orientation:l}=v("CarouselItem",t);return e("div",{"aria-roledescription":"slide",className:c("min-w-0 shrink-0 grow-0 basis-full","horizontal"===l?"pl-4":"pt-4",r),"data-slot":"carousel-item",role:"group",...o})}function N({__scopeCarousel:r,className:l,size:a="icon",variant:s="outline",...i}){let{canScrollPrev:u,orientation:d,scrollPrev:m}=v("CarouselPrevious",r);return t(n,{"aria-label":"Previous slide",className:c("absolute size-8 shadow-none","horizontal"===d?"top-1/2 -left-12 -translate-y-1/2":"-top-12 left-1/2 -translate-x-1/2 rotate-90",l),"data-slot":"carousel-previous",disabled:!u,size:a,variant:s,onClick:m,...i,children:[e(o,{}),e("span",{className:"sr-only",children:"Previous slide"})]})}function b({__scopeCarousel:r,className:o,size:a="icon",variant:s="outline",...i}){let{canScrollNext:u,orientation:d,scrollNext:m}=v("CarouselNext",r);return t(n,{"aria-label":"Next slide",className:c("absolute size-8 shadow-none","horizontal"===d?"top-1/2 -right-12 -translate-y-1/2":"-bottom-12 left-1/2 -translate-x-1/2 rotate-90",o),"data-slot":"carousel-next",disabled:!u,size:a,variant:s,onClick:m,...i,children:[e(l,{}),e("span",{className:"sr-only",children:"Next slide"})]})}export{x as Carousel,h as CarouselContent,C as CarouselItem,b as CarouselNext,N as CarouselPrevious,f as createCarouselScope};
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "@codefast/tailwind-variants";
+import { createContextScope } from "@radix-ui/react-context";
+import embla_carousel_react from "embla-carousel-react";
+import { ArrowLeftIcon, ArrowRightIcon } from "lucide-react";
+import { useCallback, useEffect, useState } from "react";
+import { Button } from "./button.js";
+const CAROUSEL_NAME = "Carousel";
+const [createCarouselContext, createCarouselScope] = createContextScope(CAROUSEL_NAME);
+const [CarouselContextProvider, useCarouselContext] = createCarouselContext(CAROUSEL_NAME);
+function Carousel({ __scopeCarousel, children, className, opts, orientation, plugins, setApi, ...props }) {
+    const [carouselRef, api] = embla_carousel_react({
+        ...opts,
+        axis: "vertical" === orientation ? "y" : "x"
+    }, plugins);
+    const [canScrollPrevious, setCanScrollPrevious] = useState(false);
+    const [canScrollNext, setCanScrollNext] = useState(false);
+    const onSelect = useCallback((carouselApi)=>{
+        if (!carouselApi) return;
+        setCanScrollPrevious(carouselApi.canScrollPrev());
+        setCanScrollNext(carouselApi.canScrollNext());
+    }, []);
+    const scrollPrevious = useCallback(()=>{
+        api?.scrollPrev();
+    }, [
+        api
+    ]);
+    const scrollNext = useCallback(()=>{
+        api?.scrollNext();
+    }, [
+        api
+    ]);
+    const handleKeyDown = useCallback((event)=>{
+        if ("ArrowLeft" === event.key) {
+            event.preventDefault();
+            scrollPrevious();
+        } else if ("ArrowRight" === event.key) {
+            event.preventDefault();
+            scrollNext();
+        }
+    }, [
+        scrollPrevious,
+        scrollNext
+    ]);
+    useEffect(()=>{
+        if (!api || !setApi) return;
+        setApi(api);
+    }, [
+        api,
+        setApi
+    ]);
+    useEffect(()=>{
+        if (!api) return;
+        queueMicrotask(()=>{
+            onSelect(api);
+        });
+        api.on("reInit", onSelect);
+        api.on("select", onSelect);
+        return ()=>{
+            api.off("select", onSelect);
+        };
+    }, [
+        api,
+        onSelect
+    ]);
+    return /*#__PURE__*/ jsx(CarouselContextProvider, {
+        api: api,
+        canScrollNext: canScrollNext,
+        canScrollPrev: canScrollPrevious,
+        carouselRef: carouselRef,
+        opts: opts,
+        orientation: orientation ?? (opts?.axis === "y" ? "vertical" : "horizontal"),
+        scope: __scopeCarousel,
+        scrollNext: scrollNext,
+        scrollPrev: scrollPrevious,
+        children: /*#__PURE__*/ jsx("div", {
+            className: cn("relative", className),
+            "data-slot": "carousel",
+            onKeyDownCapture: handleKeyDown,
+            ...props,
+            children: children
+        })
+    });
+}
+const CAROUSEL_CONTENT_NAME = "CarouselContent";
+function CarouselContent({ __scopeCarousel, className, classNames, ...props }) {
+    const { carouselRef, orientation } = useCarouselContext(CAROUSEL_CONTENT_NAME, __scopeCarousel);
+    return /*#__PURE__*/ jsx("div", {
+        ref: carouselRef,
+        className: cn("overflow-hidden", classNames?.wrapper),
+        "data-slot": "carousel-content",
+        children: /*#__PURE__*/ jsx("div", {
+            className: cn("flex", "horizontal" === orientation ? "-ml-4" : "-mt-4 flex-col", classNames?.content, className),
+            ...props
+        })
+    });
+}
+const CAROUSEL_ITEM_NAME = "CarouselItem";
+function CarouselItem({ __scopeCarousel, className, ...props }) {
+    const { orientation } = useCarouselContext(CAROUSEL_ITEM_NAME, __scopeCarousel);
+    return /*#__PURE__*/ jsx("div", {
+        "aria-roledescription": "slide",
+        className: cn("min-w-0 shrink-0 grow-0 basis-full", "horizontal" === orientation ? "pl-4" : "pt-4", className),
+        "data-slot": "carousel-item",
+        role: "group",
+        ...props
+    });
+}
+const CAROUSEL_PREVIOUS_NAME = "CarouselPrevious";
+function CarouselPrevious({ __scopeCarousel, className, size = "icon", variant = "outline", ...props }) {
+    const { canScrollPrev, orientation, scrollPrev } = useCarouselContext(CAROUSEL_PREVIOUS_NAME, __scopeCarousel);
+    return /*#__PURE__*/ jsxs(Button, {
+        "aria-label": "Previous slide",
+        className: cn("absolute size-8 shadow-none", "horizontal" === orientation ? "top-1/2 -left-12 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className),
+        "data-slot": "carousel-previous",
+        disabled: !canScrollPrev,
+        size: size,
+        variant: variant,
+        onClick: scrollPrev,
+        ...props,
+        children: [
+            /*#__PURE__*/ jsx(ArrowLeftIcon, {}),
+            /*#__PURE__*/ jsx("span", {
+                className: "sr-only",
+                children: "Previous slide"
+            })
+        ]
+    });
+}
+const CAROUSEL_NEXT_NAME = "CarouselNext";
+function CarouselNext({ __scopeCarousel, className, size = "icon", variant = "outline", ...props }) {
+    const { canScrollNext, orientation, scrollNext } = useCarouselContext(CAROUSEL_NEXT_NAME, __scopeCarousel);
+    return /*#__PURE__*/ jsxs(Button, {
+        "aria-label": "Next slide",
+        className: cn("absolute size-8 shadow-none", "horizontal" === orientation ? "top-1/2 -right-12 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className),
+        "data-slot": "carousel-next",
+        disabled: !canScrollNext,
+        size: size,
+        variant: variant,
+        onClick: scrollNext,
+        ...props,
+        children: [
+            /*#__PURE__*/ jsx(ArrowRightIcon, {}),
+            /*#__PURE__*/ jsx("span", {
+                className: "sr-only",
+                children: "Next slide"
+            })
+        ]
+    });
+}
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, createCarouselScope };