@levo-so/blocks 0.1.59 → 0.1.61

package/src/blocks/tabs/tab-1.tsx

@@ -1,30 +1,29 @@
 import {
+  AccordionContent,
+  AccordionItem,
+  AccordionRoot,
+  AccordionTrigger,
   Box,
+  Button,
   Container,
   Heading,
-  Section,
-  Typography,
+  Icon,
   type ILevoBlockBaseProps,
-  TabsRoot,
+  Media,
+  Section,
+  TabsContent,
   TabsList,
+  TabsRoot,
   TabsTrigger,
-  TabsContent,
-  AccordionRoot,
-  AccordionItem,
-  AccordionTrigger,
-  AccordionContent,
-  Icon,
-  Media,
-  Button,
+  Typography,
 } from "@levo-so/studio";
-import React, { useState } from "react";
+import type React from "react";
+import { useState } from "react";
 
-import { type ITab1Content } from "./tab-1.schema";
+import type { ITab1Content } from "./tab-1.schema";
 
 const Tab1: React.FC<ILevoBlockBaseProps<ITab1Content>> = ({ content }) => {
-  const [activeIndexes, setActiveIndexes] = useState<{ [key: number]: number }>(
-    {},
-  );
+  const [activeIndexes, setActiveIndexes] = useState<{ [key: number]: number }>({});
 
   const handleValueChange = (tabIndex: number, value: string | undefined) => {
     if (typeof value === "string") {
@@ -69,45 +68,40 @@ const Tab1: React.FC<ILevoBlockBaseProps<ITab1Content>> = ({ content }) => {
                     elementKey={`tabs.${index}.faqs_levoGroup`}
                     data-levo_group
                     defaultValue="0"
-                    onValueChange={(value: string) =>
-                      handleValueChange(index, value)
-                    }
+                    onValueChange={(value: string) => handleValueChange(index, value)}
                   >
-                    {(content.tabs[index]?.faqs ?? []).map(
-                      (_: any, faqIndex: number) => (
-                        <AccordionItem
-                          value={faqIndex.toString()}
-                          key={faqIndex}
-                          elementKey={`tabs.${index}.faqs.${faqIndex}.wrapper`}
-                          data-levo_group_item
-                        >
-                          <AccordionTrigger
-                            elementKey={`tabs.${index}.faqs.${faqIndex}.trigger`}
-                          >
-                            <Box
-                              elementKey={`tabs.${index}.faqs.${faqIndex}.iconQuestionWrapper`}
-                            >
-                              <Icon
-                                elementKey={`tabs.${index}.faqs.${faqIndex}.triggerIcon`}
-                              />
-                              <Typography
-                                elementKey={`tabs.${index}.faqs.${faqIndex}.question`}
-                              />
-                            </Box>
-                          </AccordionTrigger>
-                          <AccordionContent
-                            elementKey={`tabs.${index}.faqs.${faqIndex}.content`}
+                    {(content.tabs[index]?.faqs ?? []).map((_: any, faqIndex: number) => (
+                      <AccordionItem
+                        value={faqIndex.toString()}
+                        key={faqIndex}
+                        elementKey={`tabs.${index}.faqs.${faqIndex}.wrapper`}
+                        data-levo_group_item
+                      >
+                        <AccordionTrigger elementKey={`tabs.${index}.faqs.${faqIndex}.trigger`}>
+                          <Box elementKey={`tabs.${index}.faqs.${faqIndex}.iconQuestionWrapper`}>
+                            <Icon elementKey={`tabs.${index}.faqs.${faqIndex}.triggerIcon`} />
+                            <Heading elementKey={`tabs.${index}.faqs.${faqIndex}.question`} />
+                          </Box>
+                        </AccordionTrigger>
+                        <AccordionContent elementKey={`tabs.${index}.faqs.${faqIndex}.content`}>
+                          <Typography elementKey={`tabs.${index}.faqs.${faqIndex}.answer`} />
+                          <Box
+                            elementKey={`tabs.${index}.faqs.${faqIndex}.ctas_levoGroup`}
+                            data-levo_group
                           >
-                            <Typography
-                              elementKey={`tabs.${index}.faqs.${faqIndex}.answer`}
-                            />
-                            <Button
-                              elementKey={`tabs.${index}.faqs.${faqIndex}.cta`}
-                            />
-                          </AccordionContent>
-                        </AccordionItem>
-                      ),
-                    )}
+                            {(content?.tabs?.[index]?.faqs?.[faqIndex]?.ctas ?? []).map(
+                              (_, ctaIndex) => (
+                                <Button
+                                  key={`tabs.${index}.faqs.${faqIndex}.ctas.${ctaIndex}.cta`}
+                                  elementKey={`tabs.${index}.faqs.${faqIndex}.ctas.${ctaIndex}.cta`}
+                                  data-levo_group_item
+                                />
+                              ),
+                            )}
+                          </Box>
+                        </AccordionContent>
+                      </AccordionItem>
+                    ))}
                   </AccordionRoot>
                 </Box>
                 <Media