"use client";
"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
function _export(target, all) {
    for(var name in all)Object.defineProperty(target, name, {
        enumerable: true,
        get: all[name]
    });
}
_export(exports, {
    Carousel: function() {
        return Carousel;
    },
    CarouselContent: function() {
        return CarouselContent;
    },
    CarouselIdentifier: function() {
        return CarouselIdentifier;
    },
    CarouselItem: function() {
        return CarouselItem;
    },
    CarouselNext: function() {
        return CarouselNext;
    },
    CarouselPrevious: function() {
        return CarouselPrevious;
    },
    Dot: function() {
        return Dot;
    },
    useCarousel: function() {
        return useCarousel;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
const _emblacarouselreact = /*#__PURE__*/ _interop_require_default(require("embla-carousel-react"));
const _css = require("../utils/css");
const _lucidereact = require("lucide-react");
const _button = require("../button/button");
function _interop_require_default(obj) {
    return obj && obj.__esModule ? obj : {
        default: obj
    };
}
function _getRequireWildcardCache(nodeInterop) {
    if (typeof WeakMap !== "function") return null;
    var cacheBabelInterop = new WeakMap();
    var cacheNodeInterop = new WeakMap();
    return (_getRequireWildcardCache = function(nodeInterop) {
        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
    })(nodeInterop);
}
function _interop_require_wildcard(obj, nodeInterop) {
    if (!nodeInterop && obj && obj.__esModule) {
        return obj;
    }
    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
        return {
            default: obj
        };
    }
    var cache = _getRequireWildcardCache(nodeInterop);
    if (cache && cache.has(obj)) {
        return cache.get(obj);
    }
    var newObj = {
        __proto__: null
    };
    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
    for(var key in obj){
        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
            if (desc && (desc.get || desc.set)) {
                Object.defineProperty(newObj, key, desc);
            } else {
                newObj[key] = obj[key];
            }
        }
    }
    newObj.default = obj;
    if (cache) {
        cache.set(obj, newObj);
    }
    return newObj;
}
const CarouselContext = /*#__PURE__*/ _react.createContext(null);
function useCarousel() {
    const context = _react.useContext(CarouselContext);
    if (!context) {
        throw new Error("useCarousel must be used within a <Carousel />");
    }
    return context;
}
const Carousel = /*#__PURE__*/ _react.forwardRef(({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }, ref)=>{
    const [carouselRef, api] = (0, _emblacarouselreact.default)({
        ...opts,
        axis: orientation === "horizontal" ? "x" : "y"
    }, plugins);
    const [canScrollPrev, setCanScrollPrev] = _react.useState(false);
    const [canScrollNext, setCanScrollNext] = _react.useState(false);
    const [selectedIndex, setSelectedIndex] = _react.useState(props.initIndex || 0);
    const [scrollSnaps, setScrollSnaps] = _react.useState([]);
    const onSelect = _react.useCallback((api)=>{
        if (!api) {
            return;
        }
        // console.log("selected", api.scrollSnapList());
        if (scrollSnaps.length === 0) {
            setScrollSnaps(api.scrollSnapList());
        }
        setSelectedIndex(api.selectedScrollSnap());
        setCanScrollPrev(api.canScrollPrev());
        setCanScrollNext(api.canScrollNext());
    }, [
        scrollSnaps
    ]);
    const scrollPrev = _react.useCallback(()=>{
        api?.scrollPrev();
    }, [
        api
    ]);
    const scrollNext = _react.useCallback(()=>{
        api?.scrollNext();
    }, [
        api
    ]);
    const handleKeyDown = _react.useCallback((event)=>{
        if (event.key === "ArrowLeft") {
            event.preventDefault();
            scrollPrev();
        } else if (event.key === "ArrowRight") {
            event.preventDefault();
            scrollNext();
        }
    }, [
        scrollPrev,
        scrollNext
    ]);
    _react.useEffect(()=>{
        if (!api || !setApi) {
            return;
        }
        setApi(api);
    }, [
        api,
        setApi
    ]);
    _react.useEffect(()=>{
        if (!api) {
            return;
        }
        onSelect(api);
        api.on("reInit", onSelect);
        api.on("select", onSelect);
        if (props.initIndex) {
            api.scrollTo(props.initIndex);
        }
        return ()=>{
            api?.off("select", onSelect);
        };
    }, [
        api,
        onSelect
    ]);
    return /*#__PURE__*/ (0, _jsxruntime.jsx)(CarouselContext.Provider, {
        value: {
            carouselRef,
            api: api,
            opts,
            orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
            scrollPrev,
            scrollNext,
            canScrollPrev,
            canScrollNext,
            selectedIndex,
            scrollSnaps
        },
        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
            ref: ref,
            onKeyDownCapture: handleKeyDown,
            className: (0, _css.cn)("orderly-relative", className),
            role: "region",
            "aria-roledescription": "carousel",
            ...props,
            children: children
        })
    });
});
Carousel.displayName = "Carousel";
const CarouselContent = /*#__PURE__*/ _react.forwardRef(({ className, ...props }, ref)=>{
    const { carouselRef, orientation } = useCarousel();
    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
        ref: carouselRef,
        className: "orderly-overflow-hidden",
        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
            ref: ref,
            className: (0, _css.cn)("orderly-flex", orientation === "horizontal" ? "orderly--ml-4" : "orderly--mt-4 orderly-flex-col", className),
            ...props
        })
    });
});
CarouselContent.displayName = "CarouselContent";
const CarouselItem = /*#__PURE__*/ _react.forwardRef(({ className, ...props }, ref)=>{
    const { orientation } = useCarousel();
    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
        ref: ref,
        role: "group",
        "aria-roledescription": "slide",
        className: (0, _css.cn)("orderly-min-w-0 orderly-shrink-0 orderly-grow-0 orderly-basis-full", orientation === "horizontal" ? "orderly-pl-4" : "orderly-pt-4", className),
        ...props
    });
});
CarouselItem.displayName = "CarouselItem";
const CarouselPrevious = /*#__PURE__*/ _react.forwardRef(({ className, variant = "contained", size = "icon", ...props }, ref)=>{
    const { orientation, scrollPrev, canScrollPrev } = useCarousel();
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_button.Button, {
        // @ts-ignore
        ref: ref,
        variant: variant,
        size: size,
        className: (0, _css.cn)("orderly-absolute  orderly-h-8 orderly-w-8 orderly-rounded-full", orientation === "horizontal" ? "orderly--left-12 orderly-top-1/2 orderly--translate-y-1/2" : "orderly--top-12 orderly-left-1/2 orderly--translate-x-1/2 orderly-rotate-90", className),
        disabled: !canScrollPrev,
        onClick: scrollPrev,
        ...props,
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_lucidereact.ChevronLeft, {
                size: 20
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                className: "orderly-sr-only",
                children: "Previous slide"
            })
        ]
    });
});
CarouselPrevious.displayName = "CarouselPrevious";
const CarouselNext = /*#__PURE__*/ _react.forwardRef(({ className, variant = "contained", size = "icon", ...props }, ref)=>{
    const { orientation, scrollNext, canScrollNext } = useCarousel();
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_button.Button, {
        // @ts-ignore
        ref: ref,
        variant: variant,
        size: size,
        className: (0, _css.cn)("orderly-absolute orderly-h-8 orderly-w-8 orderly-rounded-full", orientation === "horizontal" ? "orderly--right-12 orderly-top-1/2 orderly--translate-y-1/2" : "orderly--bottom-12 orderly-left-1/2 orderly--translate-x-1/2 orderly-rotate-90", className),
        disabled: !canScrollNext,
        onClick: scrollNext,
        ...props,
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_lucidereact.ChevronRight, {
                size: 20
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                className: "orderly-sr-only",
                children: "Next slide"
            })
        ]
    });
});
CarouselNext.displayName = "CarouselNext";
const CarouselIdentifier = (props)=>{
    const { scrollSnaps, selectedIndex } = useCarousel();
    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
        className: (0, _css.cn)("orderly-flex orderly-gap-1", props.className),
        children: scrollSnaps.map((_, index)=>{
            return /*#__PURE__*/ (0, _jsxruntime.jsx)(Dot, {
                index: index,
                active: index === selectedIndex,
                onClick: props.onClick,
                className: props.dotClassName,
                activeClassName: props.dotActiveClassName
            }, index);
        })
    });
};
CarouselIdentifier.displayName = "CarouselIdentifier";
const Dot = ({ index, active, onClick, className, activeClassName })=>{
    const activedClassName = activeClassName || "orderly-bg-primary";
    return /*#__PURE__*/ (0, _jsxruntime.jsx)("button", {
        onClick: ()=>onClick?.(index),
        className: (0, _css.cn)("orderly-w-2 orderly-h-2 orderly-rounded-full orderly-bg-white/30", className, active && `active ${activedClassName}`)
    });
};

//# sourceMappingURL=carousel.js.map