From a147fba5aa07d9eba54c0f9c9ee8f2ca60567d07 Mon Sep 17 00:00:00 2001
From: HasithDeAlwis <hasithde24@gmail.com>
Date: Tue, 19 Nov 2024 19:14:06 -0500
Subject: [PATCH] feat(shared/ui/cuhacking/components): create accordion

---
 .../components/accordion/accordion.tsx        | 56 +++++++++++++++++++
 .../cuHacking/components/accordion/index.ts   |  1 +
 2 files changed, 57 insertions(+)
 create mode 100644 libs/shared/ui/src/cuHacking/components/accordion/accordion.tsx
 create mode 100644 libs/shared/ui/src/cuHacking/components/accordion/index.ts

diff --git a/libs/shared/ui/src/cuHacking/components/accordion/accordion.tsx b/libs/shared/ui/src/cuHacking/components/accordion/accordion.tsx
new file mode 100644
index 00000000..618d8195
--- /dev/null
+++ b/libs/shared/ui/src/cuHacking/components/accordion/accordion.tsx
@@ -0,0 +1,56 @@
+import * as AccordionPrimitive from '@radix-ui/react-accordion'
+import { cn } from '@shadcn/lib/utils'
+import { ChevronDown } from 'lucide-react'
+
+import * as React from 'react'
+
+const Accordion = AccordionPrimitive.Root
+
+const AccordionItem = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
+>(({ className, ...props }, ref) => (
+  <AccordionPrimitive.Item
+    ref={ref}
+    className={cn(className)}
+    {...props}
+  />
+))
+AccordionItem.displayName = 'AccordionItem'
+
+const AccordionTrigger = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
+>(({ className, children, ...props }, ref) => (
+  <AccordionPrimitive.Header className="flex">
+    <AccordionPrimitive.Trigger
+      ref={ref}
+      className={cn(
+        'flex flex-1 items-center w-full justify-start py-0.5 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180 gap-3 text-left',
+        className,
+      )}
+      {...props}
+    >
+      <ChevronDown className="w-4 h-4 transition-transform duration-200 shrink-0" />
+      {children}
+    </AccordionPrimitive.Trigger>
+  </AccordionPrimitive.Header>
+))
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName
+
+const AccordionContent = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
+>(({ className, children, ...props }, ref) => (
+  <AccordionPrimitive.Content
+    ref={ref}
+    className="text-left overflow-hidden pl-7 text-sm transition-all w-full data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+    {...props}
+  >
+    <div className={cn('pb-2 pt-0', className)}>{children}</div>
+  </AccordionPrimitive.Content>
+))
+
+AccordionContent.displayName = AccordionPrimitive.Content.displayName
+
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger }
diff --git a/libs/shared/ui/src/cuHacking/components/accordion/index.ts b/libs/shared/ui/src/cuHacking/components/accordion/index.ts
new file mode 100644
index 00000000..28bcc74b
--- /dev/null
+++ b/libs/shared/ui/src/cuHacking/components/accordion/index.ts
@@ -0,0 +1 @@
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from './accordion'