From 9f43bd7081bc7f6455e68914b11b59b0609397fe Mon Sep 17 00:00:00 2001
From: Katja Lutz <mail@katjalutz.ch>
Date: Fri, 24 Jun 2022 16:01:21 +0200
Subject: [PATCH] feat: implement alignCenter option for Accordion component

---
 src/components/Accordion.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/components/Accordion.tsx b/src/components/Accordion.tsx
index 14e8a53..a5cda17 100644
--- a/src/components/Accordion.tsx
+++ b/src/components/Accordion.tsx
@@ -4,18 +4,24 @@ import Collapsible from "./Collapsible";
 const createAccordion = (defaultItem: number | null = 0) => {
   const [item, setItem] = createSignal(defaultItem);
   const AccordionItem: FlowComponent<{
+    alignCenter?: boolean;
     label?: JSX.Element;
     item?: number;
     activeTitleColor?: string;
   }> = (p) => {
-    const props = mergeProps({ item: Math.random() }, p);
+    const props = mergeProps({ alignCenter: true, item: Math.random() }, p);
 
     return (
       <Collapsible
         class="border-b-0 last:border-b first:rounded-t last:rounded-b"
         value={item() === props.item}
         label={
-          <div class="flex justify-center items-center gap-2">
+          <div
+            classList={{
+              "flex  items-center gap-2": true,
+              "justify-center": props.alignCenter,
+            }}
+          >
             {props.label}
           </div>
         }