import { jsx } from 'react/jsx-runtime';
import React__default from 'react';
import { ChevronRightIcon, ChevronDownIcon } from '@heroicons/react/24/outline';
import { cn } from '../../../utils/cn.js';
import { useCarouselContext } from './CarouselContext.js';
import { carouselTheme } from './Carousel.theme.js';

const CarouselNext = React__default.forwardRef(({ className, icon, 'aria-label': ariaLabel, ...props }, ref) => {
    const { scrollNext, canScrollNext, orientation } = useCarouselContext();
    return (jsx("button", { ref: ref, type: "button", onClick: scrollNext, disabled: !canScrollNext, "aria-label": ariaLabel || 'Next slide', className: cn(carouselTheme.button, className), ...props, children: icon ||
            (orientation === 'horizontal' ? (jsx(ChevronRightIcon, { className: carouselTheme.buttonIcon, "aria-hidden": "true" })) : (jsx(ChevronDownIcon, { className: carouselTheme.buttonIcon, "aria-hidden": "true" }))) }));
});
CarouselNext.displayName = 'Carousel.Next';

export { CarouselNext };
