CarouselContent() — ui Function Reference

Architecture documentation for the CarouselContent() function in carousel.tsx from the ui codebase.

Function tsx DocumentationAtlas ContentSourcing calls 1

Entity Profile

DocumentationAtlas→ ContentSourcing→ CarouselContent() — ui Function Reference

Dependency Diagram

graph TD
  7f5337ab_edff_ce65_7bec_42693646df58["CarouselContent()"]
  f09ac3f5_020b_59bc_6922_56c2fb7083da["carousel.tsx"]
  7f5337ab_edff_ce65_7bec_42693646df58 -->|defined in| f09ac3f5_020b_59bc_6922_56c2fb7083da
  728b40a8_1519_1d4c_4336_b5b50e759783["useCarousel()"]
  7f5337ab_edff_ce65_7bec_42693646df58 -->|calls| 728b40a8_1519_1d4c_4336_b5b50e759783
  style 7f5337ab_edff_ce65_7bec_42693646df58 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/base/ui-rtl/carousel.tsx lines 134–153

function CarouselContent({ className, ...props }: React.ComponentProps<"div">) {
  const { carouselRef, orientation } = useCarousel()

  return (
    <div
      ref={carouselRef}
      className="overflow-hidden"
      data-slot="carousel-content"
    >
      <div
        className={cn(
          "flex",
          orientation === "horizontal" ? "-ms-4" : "-mt-4 flex-col",
          className
        )}
        {...props}
      />
    </div>
  )
}