collapsible

1"use client"
2 
3import * as React from "react"
4 
5import { Collapsible as CollapsiblePrimitive } from "@ark-ui/react/collapsible"
6 
7import { cn } from "@/lib/utils"
8 
9const Collapsible = CollapsiblePrimitive.Root
10 
11const CollapsibleContent = React.forwardRef<
12  React.ElementRef<typeof CollapsiblePrimitive.Content>,
13  CollapsiblePrimitive.ContentProps
14>(({ className, ...props }, ref) => (
15  <CollapsiblePrimitive.Content
16    ref={ref}
17    className={cn(
18      "overflow-hidden transition-all data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down",
19      className
20    )}
21    {...props}
22  />
23))
24CollapsibleContent.displayName = "CollapsibleContent"
25 
26const CollapsibleContext = CollapsiblePrimitive.Context
27 
28const CollapsibleIndicator = CollapsiblePrimitive.Indicator
29 
30const CollapsibleTrigger = CollapsiblePrimitive.Trigger
31 
32export {
33  Collapsible,
34  CollapsibleContent,
35  CollapsibleContext,
36  CollapsibleIndicator,
37  CollapsibleTrigger,
38}