Files
Claude-Code-Workflow/ccw/frontend/src/components/ui/Collapsible.tsx
catlog22 b36a46d59d fix(ui): prevent dropdown truncation in Collapsible content
Apply overflow-hidden only when collapsible is closed, allowing
dropdown menus to overflow properly when expanded.
2026-03-02 11:19:28 +08:00

25 lines
846 B
TypeScript

import * as React from "react";
import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
import { cn } from "@/lib/utils";
const Collapsible = CollapsiblePrimitive.Root;
const CollapsibleTrigger = CollapsiblePrimitive.Trigger;
const CollapsibleContent = React.forwardRef<
React.ElementRef<typeof CollapsiblePrimitive.Content>,
React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>
>(({ className, ...props }, ref) => (
<CollapsiblePrimitive.Content
ref={ref}
className={cn(
"transition-all data-[state=closed]:overflow-hidden data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
className
)}
{...props}
/>
));
CollapsibleContent.displayName = CollapsiblePrimitive.Content.displayName;
export { Collapsible, CollapsibleTrigger, CollapsibleContent };