@cerberus-design/react/dist/components/carousel/carousel.js

The Cerberus Design React component library.

import { jsxs, jsx } from 'react/jsx-runtime';
import { Show } from '../show/show.js';
import { For } from '../for/for.js';
import { CarouselParts } from './parts.js';

function CarouselEl(props) {
  const { showIndicators = false, children, ...rootProps } = props;
  return /* @__PURE__ */ jsxs(CarouselParts.Root, { ...rootProps, children: [
    children,
    /* @__PURE__ */ jsx(Show, { when: showIndicators, children: /* @__PURE__ */ jsx(CarouselParts.IndicatorGroup, { children: /* @__PURE__ */ jsx(For, { each: Array.from({ length: props.slideCount ?? 0 }), children: (_, idx) => /* @__PURE__ */ jsx(CarouselParts.Indicator, { index: idx }, idx) }) }) })
  ] });
}
const Carousel = {
  Root: CarouselEl,
  ItemGroup: CarouselParts.ItemGroup,
  Item: CarouselParts.Item,
  Control: CarouselParts.Control,
  PrevTrigger: CarouselParts.PrevTrigger,
  NextTrigger: CarouselParts.NextTrigger
};

export { Carousel };