jaci-ui 0.7.0 → 0.9.0

package/dist/components/carousel/carousel.cjs

@@ -0,0 +1,342 @@
+"use client";
+const require_cx = require("../../styled-system/css/cx.cjs");
+const require_carousel = require("../../styled-system/recipes/carousel.cjs");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/components/carousel/carousel.tsx
+const CarouselContext = (0, react.createContext)(null);
+function useCarouselContext() {
+	const context = (0, react.useContext)(CarouselContext);
+	if (!context) throw new Error("Carousel parts must be rendered inside Carousel.Root.");
+	return context;
+}
+const CarouselRoot = (0, react.forwardRef)(function CarouselRoot({ autoplay = false, autoplayInterval = 5e3, children, className, defaultIndex = 0, disabled = false, index, onBlur, onFocus, loop = true, onIndexChange, onKeyDown, onPointerEnter, onPointerLeave, orientation = "horizontal", pauseOnFocus = true, pauseOnHover = true, style, swipeable = true, ...props }, ref) {
+	const [uncontrolledIndex, setUncontrolledIndex] = (0, react.useState)(Math.max(0, defaultIndex));
+	const [registered, setRegistered] = (0, react.useState)(() => /* @__PURE__ */ new Set());
+	const [paused, setPaused] = (0, react.useState)(false);
+	const [focusWithin, setFocusWithin] = (0, react.useState)(false);
+	const swipeRef = (0, react.useRef)(null);
+	const isControlled = index !== void 0;
+	const indexCount = registered.size ? Math.max(...registered) + 1 : 0;
+	const currentIndex = Math.max(0, Math.min(indexCount ? indexCount - 1 : 0, index ?? uncontrolledIndex));
+	const styles = require_carousel.carousel({
+		orientation,
+		active: true
+	});
+	const setIndex = (0, react.useCallback)((nextIndex) => {
+		if (disabled || !indexCount) return;
+		const next = loop ? (nextIndex + indexCount) % indexCount : Math.max(0, Math.min(indexCount - 1, nextIndex));
+		if (!isControlled) setUncontrolledIndex(next);
+		if (next !== currentIndex) onIndexChange?.(next);
+	}, [
+		currentIndex,
+		disabled,
+		indexCount,
+		isControlled,
+		loop,
+		onIndexChange
+	]);
+	const getNextIndex = (0, react.useCallback)((direction) => currentIndex + direction, [currentIndex]);
+	const registerIndex = (0, react.useCallback)((itemIndex) => {
+		setRegistered((previous) => {
+			if (previous.has(itemIndex)) return previous;
+			const next = new Set(previous);
+			next.add(itemIndex);
+			return next;
+		});
+		return () => setRegistered((previous) => {
+			if (!previous.has(itemIndex)) return previous;
+			const next = new Set(previous);
+			next.delete(itemIndex);
+			return next;
+		});
+	}, []);
+	const onRootKeyDown = (0, react.useCallback)((event) => {
+		if (disabled) return;
+		const forward = orientation === "horizontal" ? event.key === "ArrowRight" : event.key === "ArrowDown";
+		const backward = orientation === "horizontal" ? event.key === "ArrowLeft" : event.key === "ArrowUp";
+		if (forward || backward) {
+			event.preventDefault();
+			setIndex(getNextIndex(forward ? 1 : -1));
+		} else if (event.key === "Home") {
+			event.preventDefault();
+			setIndex(0);
+		} else if (event.key === "End") {
+			event.preventDefault();
+			setIndex(indexCount - 1);
+		}
+		onKeyDown?.(event);
+	}, [
+		disabled,
+		getNextIndex,
+		indexCount,
+		onKeyDown,
+		orientation,
+		setIndex
+	]);
+	const startSwipe = (0, react.useCallback)((event) => {
+		if (!swipeable || disabled || event.pointerType === "mouse") return;
+		swipeRef.current = {
+			pointerId: event.pointerId,
+			startX: event.clientX,
+			startY: event.clientY
+		};
+		event.currentTarget.setPointerCapture?.(event.pointerId);
+	}, [disabled, swipeable]);
+	const moveSwipe = (0, react.useCallback)(() => void 0, []);
+	const endSwipe = (0, react.useCallback)((event) => {
+		const start = swipeRef.current;
+		swipeRef.current = null;
+		if (!start || start.pointerId !== event.pointerId) return;
+		const delta = orientation === "horizontal" ? event.clientX - start.startX : event.clientY - start.startY;
+		if (Math.abs(delta) < 40) return;
+		setIndex(getNextIndex(delta < 0 ? 1 : -1));
+	}, [
+		getNextIndex,
+		orientation,
+		setIndex
+	]);
+	(0, react.useEffect)(() => {
+		if (!autoplay || paused || disabled || indexCount < 2) return;
+		const interval = Number.isFinite(autoplayInterval) && autoplayInterval > 0 ? autoplayInterval : 5e3;
+		const timer = window.setInterval(() => setIndex(getNextIndex(1)), interval);
+		return () => window.clearInterval(timer);
+	}, [
+		autoplay,
+		autoplayInterval,
+		disabled,
+		getNextIndex,
+		indexCount,
+		paused,
+		setIndex
+	]);
+	const value = (0, react.useMemo)(() => ({
+		currentIndex,
+		disabled,
+		endSwipe,
+		getNextIndex,
+		indexCount,
+		loop,
+		moveSwipe,
+		onKeyDown: onRootKeyDown,
+		orientation,
+		registerIndex,
+		setIndex,
+		startSwipe,
+		styles
+	}), [
+		currentIndex,
+		disabled,
+		endSwipe,
+		getNextIndex,
+		indexCount,
+		loop,
+		moveSwipe,
+		onRootKeyDown,
+		orientation,
+		registerIndex,
+		setIndex,
+		startSwipe,
+		styles
+	]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CarouselContext.Provider, {
+		value,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("section", {
+			...props,
+			ref,
+			"aria-roledescription": "carousel",
+			className: require_cx.cx(styles.root, className),
+			"data-jaci-component": "carousel",
+			"data-orientation": orientation,
+			"data-slot": "carousel",
+			"data-state": paused ? "paused" : "running",
+			role: "region",
+			tabIndex: disabled ? -1 : 0,
+			onBlur: (event) => {
+				if (!event.currentTarget.contains(event.relatedTarget)) {
+					setFocusWithin(false);
+					if (pauseOnFocus) setPaused(false);
+				}
+				onBlur?.(event);
+			},
+			onFocus: (event) => {
+				setFocusWithin(true);
+				if (pauseOnFocus) setPaused(true);
+				onFocus?.(event);
+			},
+			onKeyDown: onRootKeyDown,
+			onPointerCancel: endSwipe,
+			onPointerDown: startSwipe,
+			onPointerEnter: (event) => {
+				if (pauseOnHover) setPaused(true);
+				onPointerEnter?.(event);
+			},
+			onPointerLeave: (event) => {
+				if (pauseOnHover && !(pauseOnFocus && focusWithin)) setPaused(false);
+				onPointerLeave?.(event);
+			},
+			onPointerMove: moveSwipe,
+			onPointerUp: endSwipe,
+			style: {
+				"--jaci-carousel-index": currentIndex,
+				...style
+			},
+			children
+		})
+	});
+});
+const CarouselViewport = (0, react.forwardRef)(function CarouselViewport({ className, ...props }, ref) {
+	const { styles } = useCarouselContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		...props,
+		ref,
+		className: require_cx.cx(styles.viewport, className),
+		"data-slot": "carousel-viewport"
+	});
+});
+const CarouselTrack = (0, react.forwardRef)(function CarouselTrack({ className, style, ...props }, ref) {
+	const { currentIndex, orientation, styles } = useCarouselContext();
+	const transform = orientation === "horizontal" ? `translateX(-${currentIndex * 100}%)` : `translateY(-${currentIndex * 100}%)`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		...props,
+		ref,
+		className: require_cx.cx(styles.track, className),
+		"data-slot": "carousel-track",
+		style: {
+			transform,
+			...style
+		}
+	});
+});
+const CarouselItem = (0, react.forwardRef)(function CarouselItem({ children, className, index, ...props }, ref) {
+	const { currentIndex, registerIndex, styles } = useCarouselContext();
+	(0, react.useEffect)(() => registerIndex(index), [index, registerIndex]);
+	const active = currentIndex === index;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		...props,
+		ref,
+		"aria-hidden": !active,
+		"aria-roledescription": "slide",
+		className: require_cx.cx(styles.item, className),
+		"data-index": index,
+		"data-jaci-component": "carousel-item",
+		"data-selected": active || void 0,
+		"data-slot": "carousel-item",
+		role: "group",
+		tabIndex: active ? 0 : -1,
+		children
+	});
+});
+function createSimpleSlot(slot) {
+	return (0, react.forwardRef)(function CarouselSlot({ className, ...props }, ref) {
+		const { styles } = useCarouselContext();
+		if (slot === "title") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+			...props,
+			ref,
+			className: require_cx.cx(styles.title, className),
+			"data-slot": `carousel-${slot}`
+		});
+		if (slot === "description") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			...props,
+			ref,
+			className: require_cx.cx(styles.description, className),
+			"data-slot": `carousel-${slot}`
+		});
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			...props,
+			ref,
+			className: require_cx.cx(styles[slot], className),
+			"data-slot": `carousel-${slot}`
+		});
+	});
+}
+const CarouselMedia = createSimpleSlot("media");
+const CarouselCaption = createSimpleSlot("caption");
+const CarouselTitle = createSimpleSlot("title");
+const CarouselDescription = createSimpleSlot("description");
+const CarouselPrevious = (0, react.forwardRef)(function CarouselPrevious({ "aria-label": ariaLabel = "Previous slide", children, className, disabled, ...props }, ref) {
+	const { disabled: contextDisabled, getNextIndex, orientation, setIndex, styles } = useCarouselContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		...props,
+		ref,
+		"aria-label": ariaLabel,
+		className: require_cx.cx(styles.control, className),
+		"data-slot": "carousel-previous",
+		disabled: disabled ?? contextDisabled,
+		onClick: () => setIndex(getNextIndex(-1)),
+		type: "button",
+		children: children ?? (orientation === "vertical" ? "↑" : "‹")
+	});
+});
+const CarouselNext = (0, react.forwardRef)(function CarouselNext({ "aria-label": ariaLabel = "Next slide", children, className, disabled, ...props }, ref) {
+	const { disabled: contextDisabled, getNextIndex, orientation, setIndex, styles } = useCarouselContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		...props,
+		ref,
+		"aria-label": ariaLabel,
+		className: require_cx.cx(styles.control, className),
+		"data-slot": "carousel-next",
+		disabled: disabled ?? contextDisabled,
+		onClick: () => setIndex(getNextIndex(1)),
+		type: "button",
+		children: children ?? (orientation === "vertical" ? "↓" : "›")
+	});
+});
+const CarouselIndicator = (0, react.forwardRef)(function CarouselIndicator({ "aria-label": ariaLabel, className, index, ...props }, ref) {
+	const { currentIndex, disabled, setIndex, styles } = useCarouselContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		...props,
+		ref,
+		"aria-label": ariaLabel ?? `Go to slide ${index + 1}`,
+		"aria-selected": currentIndex === index,
+		className: require_cx.cx(styles.indicator, className),
+		"data-selected": currentIndex === index || void 0,
+		"data-slot": "carousel-indicator",
+		disabled,
+		onClick: () => setIndex(index),
+		role: "tab",
+		type: "button"
+	});
+});
+const CarouselIndicators = (0, react.forwardRef)(function CarouselIndicators({ children, className, ...props }, ref) {
+	const { indexCount, styles } = useCarouselContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		...props,
+		ref,
+		"aria-label": "Slides",
+		className: require_cx.cx(styles.indicators, className),
+		"data-slot": "carousel-indicators",
+		role: "tablist",
+		children: children ?? Array.from({ length: indexCount }, (_, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CarouselIndicator, { index }, `indicator-${index}`))
+	});
+});
+const Carousel = {
+	Root: CarouselRoot,
+	Viewport: CarouselViewport,
+	Track: CarouselTrack,
+	Item: CarouselItem,
+	Media: CarouselMedia,
+	Caption: CarouselCaption,
+	Title: CarouselTitle,
+	Description: CarouselDescription,
+	Previous: CarouselPrevious,
+	Next: CarouselNext,
+	Indicators: CarouselIndicators,
+	Indicator: CarouselIndicator
+};
+//#endregion
+exports.Carousel = Carousel;
+exports.CarouselCaption = CarouselCaption;
+exports.CarouselDescription = CarouselDescription;
+exports.CarouselIndicator = CarouselIndicator;
+exports.CarouselIndicators = CarouselIndicators;
+exports.CarouselItem = CarouselItem;
+exports.CarouselMedia = CarouselMedia;
+exports.CarouselNext = CarouselNext;
+exports.CarouselPrevious = CarouselPrevious;
+exports.CarouselRoot = CarouselRoot;
+exports.CarouselTitle = CarouselTitle;
+exports.CarouselTrack = CarouselTrack;
+exports.CarouselViewport = CarouselViewport;
+
+//# sourceMappingURL=carousel.cjs.map

package/dist/components/carousel/carousel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.cjs","names":["carousel","cx"],"sources":["../../../src/components/carousel/carousel.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport type {\n  ComponentPropsWithoutRef,\n  CSSProperties,\n  FocusEvent,\n  KeyboardEvent,\n  PointerEvent,\n  ReactNode,\n  Ref,\n} from \"react\";\n\nimport { cx } from \"../../styled-system/css\";\nimport { carousel } from \"../../styled-system/recipes\";\n\nexport type CarouselOrientation = \"horizontal\" | \"vertical\";\n\ninterface CarouselContextValue {\n  currentIndex: number;\n  disabled: boolean;\n  getNextIndex: (direction: -1 | 1) => number;\n  indexCount: number;\n  loop: boolean;\n  onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;\n  registerIndex: (index: number) => () => void;\n  setIndex: (index: number) => void;\n  startSwipe: (event: PointerEvent<HTMLElement>) => void;\n  moveSwipe: (event: PointerEvent<HTMLElement>) => void;\n  endSwipe: (event: PointerEvent<HTMLElement>) => void;\n  orientation: CarouselOrientation;\n  styles: ReturnType<typeof carousel>;\n}\n\nconst CarouselContext = createContext<CarouselContextValue | null>(null);\n\nfunction useCarouselContext() {\n  const context = useContext(CarouselContext);\n  if (!context) throw new Error(\"Carousel parts must be rendered inside Carousel.Root.\");\n  return context;\n}\n\nexport interface CarouselRootProps extends ComponentPropsWithoutRef<\"section\"> {\n  index?: number;\n  defaultIndex?: number;\n  onIndexChange?: (index: number) => void;\n  orientation?: CarouselOrientation;\n  loop?: boolean;\n  swipeable?: boolean;\n  autoplay?: boolean;\n  autoplayInterval?: number;\n  pauseOnHover?: boolean;\n  pauseOnFocus?: boolean;\n  disabled?: boolean;\n}\n\nexport const CarouselRoot = forwardRef<HTMLElement, CarouselRootProps>(function CarouselRoot(\n  {\n    autoplay = false,\n    autoplayInterval = 5000,\n    children,\n    className,\n    defaultIndex = 0,\n    disabled = false,\n    index,\n    onBlur,\n    onFocus,\n    loop = true,\n    onIndexChange,\n    onKeyDown,\n    onPointerEnter,\n    onPointerLeave,\n    orientation = \"horizontal\",\n    pauseOnFocus = true,\n    pauseOnHover = true,\n    style,\n    swipeable = true,\n    ...props\n  },\n  ref,\n) {\n  const [uncontrolledIndex, setUncontrolledIndex] = useState(Math.max(0, defaultIndex));\n  const [registered, setRegistered] = useState<Set<number>>(() => new Set());\n  const [paused, setPaused] = useState(false);\n  const [focusWithin, setFocusWithin] = useState(false);\n  const swipeRef = useRef<{ pointerId: number; startX: number; startY: number } | null>(null);\n  const isControlled = index !== undefined;\n  const indexCount = registered.size ? Math.max(...registered) + 1 : 0;\n  const currentIndex = Math.max(\n    0,\n    Math.min(indexCount ? indexCount - 1 : 0, index ?? uncontrolledIndex),\n  );\n  const styles = carousel({ orientation, active: true });\n\n  const setIndex = useCallback(\n    (nextIndex: number) => {\n      if (disabled || !indexCount) return;\n      const next = loop\n        ? (nextIndex + indexCount) % indexCount\n        : Math.max(0, Math.min(indexCount - 1, nextIndex));\n      if (!isControlled) setUncontrolledIndex(next);\n      if (next !== currentIndex) onIndexChange?.(next);\n    },\n    [currentIndex, disabled, indexCount, isControlled, loop, onIndexChange],\n  );\n\n  const getNextIndex = useCallback((direction: -1 | 1) => currentIndex + direction, [currentIndex]);\n\n  const registerIndex = useCallback((itemIndex: number) => {\n    setRegistered((previous) => {\n      if (previous.has(itemIndex)) return previous;\n      const next = new Set(previous);\n      next.add(itemIndex);\n      return next;\n    });\n    return () =>\n      setRegistered((previous) => {\n        if (!previous.has(itemIndex)) return previous;\n        const next = new Set(previous);\n        next.delete(itemIndex);\n        return next;\n      });\n  }, []);\n\n  const onRootKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLElement>) => {\n      if (disabled) return;\n      const forward =\n        orientation === \"horizontal\" ? event.key === \"ArrowRight\" : event.key === \"ArrowDown\";\n      const backward =\n        orientation === \"horizontal\" ? event.key === \"ArrowLeft\" : event.key === \"ArrowUp\";\n      if (forward || backward) {\n        event.preventDefault();\n        setIndex(getNextIndex(forward ? 1 : -1));\n      } else if (event.key === \"Home\") {\n        event.preventDefault();\n        setIndex(0);\n      } else if (event.key === \"End\") {\n        event.preventDefault();\n        setIndex(indexCount - 1);\n      }\n      onKeyDown?.(event);\n    },\n    [disabled, getNextIndex, indexCount, onKeyDown, orientation, setIndex],\n  );\n\n  const startSwipe = useCallback(\n    (event: PointerEvent<HTMLElement>) => {\n      if (!swipeable || disabled || event.pointerType === \"mouse\") return;\n      swipeRef.current = {\n        pointerId: event.pointerId,\n        startX: event.clientX,\n        startY: event.clientY,\n      };\n      event.currentTarget.setPointerCapture?.(event.pointerId);\n    },\n    [disabled, swipeable],\n  );\n\n  const moveSwipe = useCallback(() => undefined, []);\n\n  const endSwipe = useCallback(\n    (event: PointerEvent<HTMLElement>) => {\n      const start = swipeRef.current;\n      swipeRef.current = null;\n      if (!start || start.pointerId !== event.pointerId) return;\n      const delta =\n        orientation === \"horizontal\" ? event.clientX - start.startX : event.clientY - start.startY;\n      if (Math.abs(delta) < 40) return;\n      setIndex(getNextIndex(delta < 0 ? 1 : -1));\n    },\n    [getNextIndex, orientation, setIndex],\n  );\n\n  useEffect(() => {\n    if (!autoplay || paused || disabled || indexCount < 2) return;\n    const interval =\n      Number.isFinite(autoplayInterval) && autoplayInterval > 0 ? autoplayInterval : 5000;\n    const timer = window.setInterval(() => setIndex(getNextIndex(1)), interval);\n    return () => window.clearInterval(timer);\n  }, [autoplay, autoplayInterval, disabled, getNextIndex, indexCount, paused, setIndex]);\n\n  const value = useMemo<CarouselContextValue>(\n    () => ({\n      currentIndex,\n      disabled,\n      endSwipe,\n      getNextIndex,\n      indexCount,\n      loop,\n      moveSwipe,\n      onKeyDown: onRootKeyDown,\n      orientation,\n      registerIndex,\n      setIndex,\n      startSwipe,\n      styles,\n    }),\n    [\n      currentIndex,\n      disabled,\n      endSwipe,\n      getNextIndex,\n      indexCount,\n      loop,\n      moveSwipe,\n      onRootKeyDown,\n      orientation,\n      registerIndex,\n      setIndex,\n      startSwipe,\n      styles,\n    ],\n  );\n\n  return (\n    <CarouselContext.Provider value={value}>\n      <section\n        {...props}\n        ref={ref}\n        aria-roledescription=\"carousel\"\n        className={cx(styles.root, className)}\n        data-jaci-component=\"carousel\"\n        data-orientation={orientation}\n        data-slot=\"carousel\"\n        data-state={paused ? \"paused\" : \"running\"}\n        role=\"region\"\n        tabIndex={disabled ? -1 : 0}\n        onBlur={(event: FocusEvent<HTMLElement>) => {\n          if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n            setFocusWithin(false);\n            if (pauseOnFocus) setPaused(false);\n          }\n          onBlur?.(event);\n        }}\n        onFocus={(event: FocusEvent<HTMLElement>) => {\n          setFocusWithin(true);\n          if (pauseOnFocus) {\n            setPaused(true);\n          }\n          onFocus?.(event);\n        }}\n        onKeyDown={onRootKeyDown}\n        onPointerCancel={endSwipe}\n        onPointerDown={startSwipe}\n        onPointerEnter={(event) => {\n          if (pauseOnHover) setPaused(true);\n          onPointerEnter?.(event);\n        }}\n        onPointerLeave={(event) => {\n          if (pauseOnHover && !(pauseOnFocus && focusWithin)) setPaused(false);\n          onPointerLeave?.(event);\n        }}\n        onPointerMove={moveSwipe}\n        onPointerUp={endSwipe}\n        style={{ \"--jaci-carousel-index\": currentIndex, ...style } as CSSProperties}\n      >\n        {children}\n      </section>\n    </CarouselContext.Provider>\n  );\n});\n\nexport type CarouselViewportProps = ComponentPropsWithoutRef<\"div\">;\nexport const CarouselViewport = forwardRef<HTMLDivElement, CarouselViewportProps>(\n  function CarouselViewport({ className, ...props }, ref) {\n    const { styles } = useCarouselContext();\n    return (\n      <div\n        {...props}\n        ref={ref}\n        className={cx(styles.viewport, className)}\n        data-slot=\"carousel-viewport\"\n      />\n    );\n  },\n);\n\nexport type CarouselTrackProps = ComponentPropsWithoutRef<\"div\">;\nexport const CarouselTrack = forwardRef<HTMLDivElement, CarouselTrackProps>(function CarouselTrack(\n  { className, style, ...props },\n  ref,\n) {\n  const { currentIndex, orientation, styles } = useCarouselContext();\n  const transform =\n    orientation === \"horizontal\"\n      ? `translateX(-${currentIndex * 100}%)`\n      : `translateY(-${currentIndex * 100}%)`;\n  return (\n    <div\n      {...props}\n      ref={ref}\n      className={cx(styles.track, className)}\n      data-slot=\"carousel-track\"\n      style={{ transform, ...style }}\n    />\n  );\n});\n\nexport interface CarouselItemProps extends ComponentPropsWithoutRef<\"div\"> {\n  index: number;\n}\nexport const CarouselItem = forwardRef<HTMLDivElement, CarouselItemProps>(function CarouselItem(\n  { children, className, index, ...props },\n  ref,\n) {\n  const { currentIndex, registerIndex, styles } = useCarouselContext();\n  useEffect(() => registerIndex(index), [index, registerIndex]);\n  const active = currentIndex === index;\n  return (\n    // biome-ignore lint/a11y/useSemanticElements: carousel slides use the ARIA group role.\n    <div\n      {...props}\n      ref={ref}\n      aria-hidden={!active}\n      aria-roledescription=\"slide\"\n      className={cx(styles.item, className)}\n      data-index={index}\n      data-jaci-component=\"carousel-item\"\n      data-selected={active || undefined}\n      data-slot=\"carousel-item\"\n      role=\"group\"\n      tabIndex={active ? 0 : -1}\n    >\n      {children}\n    </div>\n  );\n});\n\nfunction createSimpleSlot(slot: \"media\" | \"caption\" | \"title\" | \"description\") {\n  return forwardRef<HTMLElement, ComponentPropsWithoutRef<\"div\">>(function CarouselSlot(\n    { className, ...props },\n    ref,\n  ) {\n    const { styles } = useCarouselContext();\n    if (slot === \"title\")\n      return (\n        <h3\n          {...props}\n          ref={ref as Ref<HTMLHeadingElement>}\n          className={cx(styles.title, className)}\n          data-slot={`carousel-${slot}`}\n        />\n      );\n    if (slot === \"description\")\n      return (\n        <p\n          {...props}\n          ref={ref as Ref<HTMLParagraphElement>}\n          className={cx(styles.description, className)}\n          data-slot={`carousel-${slot}`}\n        />\n      );\n    return (\n      <div\n        {...props}\n        ref={ref as Ref<HTMLDivElement>}\n        className={cx(styles[slot], className)}\n        data-slot={`carousel-${slot}`}\n      />\n    );\n  });\n}\n\nexport const CarouselMedia = createSimpleSlot(\"media\");\nexport const CarouselCaption = createSimpleSlot(\"caption\");\nexport const CarouselTitle = createSimpleSlot(\"title\");\nexport const CarouselDescription = createSimpleSlot(\"description\");\n\nexport interface CarouselControlProps extends ComponentPropsWithoutRef<\"button\"> {\n  children?: ReactNode;\n}\nexport const CarouselPrevious = forwardRef<HTMLButtonElement, CarouselControlProps>(\n  function CarouselPrevious(\n    { \"aria-label\": ariaLabel = \"Previous slide\", children, className, disabled, ...props },\n    ref,\n  ) {\n    const {\n      disabled: contextDisabled,\n      getNextIndex,\n      orientation,\n      setIndex,\n      styles,\n    } = useCarouselContext();\n    return (\n      <button\n        {...props}\n        ref={ref}\n        aria-label={ariaLabel}\n        className={cx(styles.control, className)}\n        data-slot=\"carousel-previous\"\n        disabled={disabled ?? contextDisabled}\n        onClick={() => setIndex(getNextIndex(-1))}\n        type=\"button\"\n      >\n        {children ?? (orientation === \"vertical\" ? \"↑\" : \"‹\")}\n      </button>\n    );\n  },\n);\n\nexport const CarouselNext = forwardRef<HTMLButtonElement, CarouselControlProps>(\n  function CarouselNext(\n    { \"aria-label\": ariaLabel = \"Next slide\", children, className, disabled, ...props },\n    ref,\n  ) {\n    const {\n      disabled: contextDisabled,\n      getNextIndex,\n      orientation,\n      setIndex,\n      styles,\n    } = useCarouselContext();\n    return (\n      <button\n        {...props}\n        ref={ref}\n        aria-label={ariaLabel}\n        className={cx(styles.control, className)}\n        data-slot=\"carousel-next\"\n        disabled={disabled ?? contextDisabled}\n        onClick={() => setIndex(getNextIndex(1))}\n        type=\"button\"\n      >\n        {children ?? (orientation === \"vertical\" ? \"↓\" : \"›\")}\n      </button>\n    );\n  },\n);\n\nexport interface CarouselIndicatorProps extends ComponentPropsWithoutRef<\"button\"> {\n  index: number;\n}\nexport const CarouselIndicator = forwardRef<HTMLButtonElement, CarouselIndicatorProps>(\n  function CarouselIndicator({ \"aria-label\": ariaLabel, className, index, ...props }, ref) {\n    const { currentIndex, disabled, setIndex, styles } = useCarouselContext();\n    return (\n      <button\n        {...props}\n        ref={ref}\n        aria-label={ariaLabel ?? `Go to slide ${index + 1}`}\n        aria-selected={currentIndex === index}\n        className={cx(styles.indicator, className)}\n        data-selected={currentIndex === index || undefined}\n        data-slot=\"carousel-indicator\"\n        disabled={disabled}\n        onClick={() => setIndex(index)}\n        role=\"tab\"\n        type=\"button\"\n      />\n    );\n  },\n);\n\nexport const CarouselIndicators = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<\"div\">>(\n  function CarouselIndicators({ children, className, ...props }, ref) {\n    const { indexCount, styles } = useCarouselContext();\n    return (\n      <div\n        {...props}\n        ref={ref}\n        aria-label=\"Slides\"\n        className={cx(styles.indicators, className)}\n        data-slot=\"carousel-indicators\"\n        role=\"tablist\"\n      >\n        {children ??\n          Array.from({ length: indexCount }, (_, index) => (\n            // biome-ignore lint/suspicious/noArrayIndexKey: indicators are stable by slide index.\n            <CarouselIndicator index={index} key={`indicator-${index}`} />\n          ))}\n      </div>\n    );\n  },\n);\n\nexport const Carousel = {\n  Root: CarouselRoot,\n  Viewport: CarouselViewport,\n  Track: CarouselTrack,\n  Item: CarouselItem,\n  Media: CarouselMedia,\n  Caption: CarouselCaption,\n  Title: CarouselTitle,\n  Description: CarouselDescription,\n  Previous: CarouselPrevious,\n  Next: CarouselNext,\n  Indicators: CarouselIndicators,\n  Indicator: CarouselIndicator,\n};\n"],"mappings":"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"}

package/dist/components/carousel/carousel.d.cts

@@ -0,0 +1,44 @@
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+//#region src/components/carousel/carousel.d.ts
+type CarouselOrientation = "horizontal" | "vertical";
+interface CarouselRootProps extends ComponentPropsWithoutRef<"section"> {
+  index?: number;
+  defaultIndex?: number;
+  onIndexChange?: (index: number) => void;
+  orientation?: CarouselOrientation;
+  loop?: boolean;
+  swipeable?: boolean;
+  autoplay?: boolean;
+  autoplayInterval?: number;
+  pauseOnHover?: boolean;
+  pauseOnFocus?: boolean;
+  disabled?: boolean;
+}
+type CarouselViewportProps = ComponentPropsWithoutRef<"div">;
+type CarouselTrackProps = ComponentPropsWithoutRef<"div">;
+interface CarouselItemProps extends ComponentPropsWithoutRef<"div"> {
+  index: number;
+}
+interface CarouselControlProps extends ComponentPropsWithoutRef<"button"> {
+  children?: ReactNode;
+}
+interface CarouselIndicatorProps extends ComponentPropsWithoutRef<"button"> {
+  index: number;
+}
+declare const Carousel: {
+  Root: import("react").ForwardRefExoticComponent<CarouselRootProps & import("react").RefAttributes<HTMLElement>>;
+  Viewport: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Track: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Item: import("react").ForwardRefExoticComponent<CarouselItemProps & import("react").RefAttributes<HTMLDivElement>>;
+  Media: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+  Caption: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+  Title: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+  Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+  Previous: import("react").ForwardRefExoticComponent<CarouselControlProps & import("react").RefAttributes<HTMLButtonElement>>;
+  Next: import("react").ForwardRefExoticComponent<CarouselControlProps & import("react").RefAttributes<HTMLButtonElement>>;
+  Indicators: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Indicator: import("react").ForwardRefExoticComponent<CarouselIndicatorProps & import("react").RefAttributes<HTMLButtonElement>>;
+};
+//#endregion
+export { Carousel, CarouselControlProps, CarouselIndicatorProps, CarouselItemProps, CarouselOrientation, CarouselRootProps, CarouselTrackProps, CarouselViewportProps };
+//# sourceMappingURL=carousel.d.cts.map

package/dist/components/carousel/carousel.d.ts

@@ -0,0 +1,44 @@
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+//#region src/components/carousel/carousel.d.ts
+type CarouselOrientation = "horizontal" | "vertical";
+interface CarouselRootProps extends ComponentPropsWithoutRef<"section"> {
+  index?: number;
+  defaultIndex?: number;
+  onIndexChange?: (index: number) => void;
+  orientation?: CarouselOrientation;
+  loop?: boolean;
+  swipeable?: boolean;
+  autoplay?: boolean;
+  autoplayInterval?: number;
+  pauseOnHover?: boolean;
+  pauseOnFocus?: boolean;
+  disabled?: boolean;
+}
+type CarouselViewportProps = ComponentPropsWithoutRef<"div">;
+type CarouselTrackProps = ComponentPropsWithoutRef<"div">;
+interface CarouselItemProps extends ComponentPropsWithoutRef<"div"> {
+  index: number;
+}
+interface CarouselControlProps extends ComponentPropsWithoutRef<"button"> {
+  children?: ReactNode;
+}
+interface CarouselIndicatorProps extends ComponentPropsWithoutRef<"button"> {
+  index: number;
+}
+declare const Carousel: {
+  Root: import("react").ForwardRefExoticComponent<CarouselRootProps & import("react").RefAttributes<HTMLElement>>;
+  Viewport: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Track: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Item: import("react").ForwardRefExoticComponent<CarouselItemProps & import("react").RefAttributes<HTMLDivElement>>;
+  Media: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+  Caption: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+  Title: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+  Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+  Previous: import("react").ForwardRefExoticComponent<CarouselControlProps & import("react").RefAttributes<HTMLButtonElement>>;
+  Next: import("react").ForwardRefExoticComponent<CarouselControlProps & import("react").RefAttributes<HTMLButtonElement>>;
+  Indicators: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Indicator: import("react").ForwardRefExoticComponent<CarouselIndicatorProps & import("react").RefAttributes<HTMLButtonElement>>;
+};
+//#endregion
+export { Carousel, CarouselControlProps, CarouselIndicatorProps, CarouselItemProps, CarouselOrientation, CarouselRootProps, CarouselTrackProps, CarouselViewportProps };
+//# sourceMappingURL=carousel.d.ts.map