diff options
| author | Mohamed Bassem <me@mbassem.com> | 2024-04-19 00:09:27 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-04-19 00:09:27 +0100 |
| commit | e0999f701cd1834c3d940113cd8dd5247c5fe95f (patch) | |
| tree | c4169a564ecd3f933e711bcc8ef7db20532174ea /apps/web/components/ui/collapsible.tsx | |
| parent | deba31ee010f785a9739fd4df8a64a3056c9593d (diff) | |
| download | karakeep-e0999f701cd1834c3d940113cd8dd5247c5fe95f.tar.zst | |
feature: Nested lists (#110). Fixes #62
* feature: Add support for nested lists
* prevent moving the parent to a subtree
Diffstat (limited to 'apps/web/components/ui/collapsible.tsx')
| -rw-r--r-- | apps/web/components/ui/collapsible.tsx | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/apps/web/components/ui/collapsible.tsx b/apps/web/components/ui/collapsible.tsx new file mode 100644 index 00000000..43f40402 --- /dev/null +++ b/apps/web/components/ui/collapsible.tsx @@ -0,0 +1,55 @@ +"use client"; + +import { cn } from "@/lib/utils"; +import * as CollapsiblePrimitive from "@radix-ui/react-collapsible"; +import { ChevronRight, Triangle } from "lucide-react"; + +const Collapsible = CollapsiblePrimitive.Root; + +const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger; + +const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent; + +function CollapsibleTriggerTriangle({ + open, + className, +}: { + open: boolean; + className?: string; +}) { + return ( + <CollapsibleTrigger asChild> + <Triangle + className={cn( + "fill-foreground", + !open ? "rotate-90" : "rotate-180", + className, + )} + /> + </CollapsibleTrigger> + ); +} + +function CollapsibleTriggerChevron({ + open, + className, +}: { + open: boolean; + className?: string; +}) { + return ( + <CollapsibleTrigger asChild> + <ChevronRight + className={cn(!open ? "rotate-0" : "rotate-90", className)} + /> + </CollapsibleTrigger> + ); +} + +export { + Collapsible, + CollapsibleTrigger, + CollapsibleContent, + CollapsibleTriggerTriangle, + CollapsibleTriggerChevron, +}; |
