dune-react 0.0.8 → 0.0.10

package/dist/components/puck-block/cta-sections/promo-section-1/promo-section.js

@@ -2,100 +2,115 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { CompoundContainer } from "../../../puck-base/container.js";
 import { CompoundBadge } from "../../../puck-base/badge.js";
 import { CompoundButton } from "../../../puck-base/button.js";
+import { CompoundImage } from "../../../puck-base/image.js";
 import { cn } from "../../../../utils/css-utils.js";
 const PromoSection = ({
-  padding,
-  sectionStyle,
-  backgroundColor,
   heading,
   description,
   image,
   imagePosition = "right",
   buttons,
-  badge
+  badge,
+  styles
 }) => {
   if (imagePosition === "background") {
-    return /* @__PURE__ */ jsx(CompoundContainer, { padding, sectionStyle, backgroundColor, children: /* @__PURE__ */ jsxs("div", { className: "relative flex min-h-[400px] items-center overflow-hidden rounded-2xl", children: [
-      (image == null ? void 0 : image.src) && /* @__PURE__ */ jsx(
-        "img",
-        {
-          src: image.src,
-          alt: image.alt ?? "",
-          className: "absolute inset-0 h-full w-full object-cover"
-        }
-      ),
-      /* @__PURE__ */ jsx("div", { className: "bg-foreground/50 absolute inset-0" }),
-      /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex max-w-xl flex-col gap-6 p-8 md:p-16", children: [
-        badge && /* @__PURE__ */ jsx(
-          CompoundBadge,
-          {
-            label: badge.label,
-            variant: badge.variant,
-            url: badge.url
-          }
-        ),
-        /* @__PURE__ */ jsx("h2", { className: "text-background text-3xl font-bold tracking-tight md:text-5xl", children: heading }),
-        description && /* @__PURE__ */ jsx("p", { className: "text-background/80 text-lg", children: description }),
-        Array.isArray(buttons) && buttons.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-4", children: buttons.map(
-          (button, index) => button.label ? /* @__PURE__ */ jsx(
-            CompoundButton,
+    return /* @__PURE__ */ jsx(
+      CompoundContainer,
+      {
+        padding: styles == null ? void 0 : styles.padding,
+        sectionStyle: styles == null ? void 0 : styles.sectionStyle,
+        backgroundColor: styles == null ? void 0 : styles.backgroundColor,
+        children: /* @__PURE__ */ jsxs("div", { className: "relative flex min-h-[400px] items-center overflow-hidden rounded-2xl [&>span]:h-full [&>span]:w-full", children: [
+          (image == null ? void 0 : image.src) && /* @__PURE__ */ jsx(
+            CompoundImage,
             {
-              label: button.label,
-              url: button.url,
-              variant: button.variant,
-              size: button.size,
-              icon: button.icon
-            },
-            index
-          ) : null
-        ) })
-      ] })
-    ] }) });
+              src: image.src,
+              alt: image.alt ?? "",
+              className: "h-full w-full object-cover"
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "bg-foreground/50 absolute inset-0" }),
+          /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex max-w-xl flex-col gap-6 p-8 md:p-16", children: [
+            badge && /* @__PURE__ */ jsx(
+              CompoundBadge,
+              {
+                label: badge.label,
+                variant: badge.variant,
+                url: badge.url
+              }
+            ),
+            /* @__PURE__ */ jsx("h2", { className: "text-background text-3xl font-bold tracking-tight md:text-5xl", children: heading }),
+            description && /* @__PURE__ */ jsx("p", { className: "text-background/80 text-lg", children: description }),
+            Array.isArray(buttons) && buttons.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-4", children: buttons.map(
+              (button, index) => button.label ? /* @__PURE__ */ jsx(
+                CompoundButton,
+                {
+                  label: button.label,
+                  url: button.url,
+                  variant: button.variant,
+                  size: button.size,
+                  icon: button.icon
+                },
+                index
+              ) : null
+            ) })
+          ] })
+        ] })
+      }
+    );
   }
-  return /* @__PURE__ */ jsx(CompoundContainer, { padding, sectionStyle, backgroundColor, children: /* @__PURE__ */ jsxs(
-    "div",
+  return /* @__PURE__ */ jsx(
+    CompoundContainer,
     {
-      className: cn(
-        "grid grid-cols-1 items-center gap-10 lg:grid-cols-2",
-        imagePosition === "left" && "lg:[&>*:first-child]:order-2"
-      ),
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
-          badge && /* @__PURE__ */ jsx(
-            CompoundBadge,
-            {
-              label: badge.label,
-              variant: badge.variant,
-              url: badge.url
-            }
+      padding: styles == null ? void 0 : styles.padding,
+      sectionStyle: styles == null ? void 0 : styles.sectionStyle,
+      backgroundColor: styles == null ? void 0 : styles.backgroundColor,
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "grid grid-cols-1 items-center gap-10 lg:grid-cols-2",
+            imagePosition === "left" && "lg:[&>*:first-child]:order-2"
           ),
-          /* @__PURE__ */ jsx("h2", { className: "text-3xl font-bold tracking-tight md:text-5xl", children: heading }),
-          description && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-lg", children: description }),
-          Array.isArray(buttons) && buttons.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-4", children: buttons.map(
-            (button, index) => button.label ? /* @__PURE__ */ jsx(
-              CompoundButton,
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
+              badge && /* @__PURE__ */ jsx(
+                CompoundBadge,
+                {
+                  label: badge.label,
+                  variant: badge.variant,
+                  url: badge.url
+                }
+              ),
+              /* @__PURE__ */ jsx("h2", { className: "text-3xl font-bold tracking-tight md:text-5xl", children: heading }),
+              description && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-lg", children: description }),
+              Array.isArray(buttons) && buttons.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-4", children: buttons.map(
+                (button, index) => button.label ? /* @__PURE__ */ jsx(
+                  CompoundButton,
+                  {
+                    label: button.label,
+                    url: button.url,
+                    variant: button.variant,
+                    size: button.size,
+                    icon: button.icon
+                  },
+                  index
+                ) : null
+              ) })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "bg-muted aspect-[4/3] overflow-hidden rounded-xl [&>span]:h-full [&>span]:w-full", children: (image == null ? void 0 : image.src) && /* @__PURE__ */ jsx(
+              CompoundImage,
               {
-                label: button.label,
-                url: button.url,
-                variant: button.variant,
-                size: button.size,
-                icon: button.icon
-              },
-              index
-            ) : null
-          ) })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "bg-muted aspect-[4/3] overflow-hidden rounded-xl", children: (image == null ? void 0 : image.src) && /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: image.src,
-            alt: image.alt ?? "",
-            className: "h-full w-full object-cover"
-          }
-        ) })
-      ]
+                src: image.src,
+                alt: image.alt ?? "",
+                className: "h-full w-full object-cover"
+              }
+            ) })
+          ]
+        }
+      )
     }
-  ) });
+  );
 };
 export {
   PromoSection

package/dist/components/puck-block/cta-sections/props.d.ts

@@ -0,0 +1,47 @@
+type CtaVariant = "banner-cta-1" | "cta-1" | "gradient-cta-1" | "newsletter-signup-1" | "promo-section-1";
+type CtaPadding = {
+    top?: "none" | "small" | "medium" | "large";
+    bottom?: "none" | "small" | "medium" | "large";
+};
+type CtaSectionStyle = "default" | "dark" | "muted" | "inverted" | "custom";
+type CtaBadge = {
+    label: string;
+    url?: string;
+    variant?: "default" | "secondary" | "destructive" | "outline";
+};
+type CtaButton = {
+    label: string;
+    url?: string;
+    variant?: "default" | "secondary" | "outline" | "ghost" | "link" | "destructive";
+    size?: "default" | "sm" | "lg" | "icon";
+    icon?: string;
+};
+type CtaImage = {
+    src: string;
+    alt?: string;
+};
+type CtaSectionProps = {
+    variant?: CtaVariant;
+    badge?: CtaBadge;
+    heading?: string;
+    description?: string;
+    buttons?: CtaButton[];
+    alignContent?: "start" | "center" | "end";
+    spacing?: "tight" | "normal" | "relaxed";
+    layout?: "contained" | "full-bleed";
+    displayText?: string;
+    placeholder?: string;
+    image?: CtaImage;
+    imagePosition?: "left" | "right" | "background";
+    styles?: {
+        padding?: CtaPadding;
+        sectionStyle?: CtaSectionStyle;
+        backgroundColor?: string;
+        className?: string;
+        gradientFrom?: string;
+        gradientTo?: string;
+        backgroundCSS?: string;
+        textColor?: string;
+        visualVariant?: "primary" | "dark" | "gradient";
+    };
+};

package/dist/components/puck-block/faq-sections/accordion-1/accordion.d.ts

@@ -1,13 +1,15 @@
 import { CompoundContainerProps } from "@/components/puck-base/container";
 export interface AccordionProps {
-    padding?: CompoundContainerProps["padding"];
-    sectionStyle?: CompoundContainerProps["sectionStyle"];
-    backgroundColor?: string;
     heading?: string;
     description?: string;
     items?: Array<{
         title: string;
         content: string;
     }>;
+    styles?: {
+        padding?: CompoundContainerProps["padding"];
+        sectionStyle?: CompoundContainerProps["sectionStyle"];
+        backgroundColor?: string;
+    };
 }
-export declare const Accordion: ({ padding, sectionStyle, backgroundColor, heading, description, items, }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Accordion: ({ heading, description, items, styles, }: AccordionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/puck-block/faq-sections/accordion-1/accordion.js

@@ -4,43 +4,49 @@ import { useState } from "react";
 import { cn } from "../../../../utils/css-utils.js";
 import { CompoundContainer } from "../../../puck-base/container.js";
 const Accordion = ({
-  padding,
-  sectionStyle,
-  backgroundColor,
   heading,
   description,
-  items = []
+  items = [],
+  styles
 }) => {
   const [openIndex, setOpenIndex] = useState(null);
-  return /* @__PURE__ */ jsxs(CompoundContainer, { padding, sectionStyle, backgroundColor, children: [
-    /* @__PURE__ */ jsxs("div", { className: "mb-12 max-w-2xl", children: [
-      heading && /* @__PURE__ */ jsx("h2", { className: "text-foreground text-3xl font-bold tracking-tight md:text-4xl", children: heading }),
-      description && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mt-4 text-lg", children: description })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "divide-border max-w-3xl divide-y", children: items.map((item, i) => /* @__PURE__ */ jsxs("div", { children: [
-      /* @__PURE__ */ jsxs(
-        "button",
-        {
-          onClick: () => setOpenIndex(openIndex === i ? null : i),
-          className: "flex w-full items-center justify-between py-4 text-left",
-          children: [
-            /* @__PURE__ */ jsx("span", { className: "text-foreground font-medium", children: item.title }),
-            /* @__PURE__ */ jsx(
-              "span",
-              {
-                className: cn(
-                  "text-muted-foreground transition-transform",
-                  openIndex === i && "rotate-45"
-                ),
-                children: "+"
-              }
-            )
-          ]
-        }
-      ),
-      openIndex === i && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground pb-4 leading-relaxed", children: item.content })
-    ] }, i)) })
-  ] });
+  return /* @__PURE__ */ jsxs(
+    CompoundContainer,
+    {
+      padding: styles == null ? void 0 : styles.padding,
+      sectionStyle: styles == null ? void 0 : styles.sectionStyle,
+      backgroundColor: styles == null ? void 0 : styles.backgroundColor,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "mb-12 max-w-2xl", children: [
+          heading && /* @__PURE__ */ jsx("h2", { className: "text-foreground text-3xl font-bold tracking-tight md:text-4xl", children: heading }),
+          description && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mt-4 text-lg", children: description })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "divide-border max-w-3xl divide-y", children: items.map((item, i) => /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setOpenIndex(openIndex === i ? null : i),
+              className: "flex w-full items-center justify-between py-4 text-left",
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "text-foreground font-medium", children: item.title }),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: cn(
+                      "text-muted-foreground transition-transform",
+                      openIndex === i && "rotate-45"
+                    ),
+                    children: "+"
+                  }
+                )
+              ]
+            }
+          ),
+          openIndex === i && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground pb-4 leading-relaxed", children: item.content })
+        ] }, i)) })
+      ]
+    }
+  );
 };
 export {
   Accordion

package/dist/components/puck-block/faq-sections/accordion-1/index.js

@@ -1,5 +1,5 @@
-import { paddingDefaults, backgroundColor, sectionStyle, padding } from "../../../puck-base/core/fields.js";
 import { Accordion } from "./accordion.js";
+import { createStylesDefaults, createStylesField } from "../../../puck-base/core/styles.js";
 const conf = {
   fields: {
     heading: { type: "text", contentEditable: true },
@@ -11,9 +11,7 @@ const conf = {
       arrayFields: { title: { type: "text" }, content: { type: "textarea" } },
       defaultItemProps: { title: "Question?", content: "Answer here." }
     },
-    padding,
-    sectionStyle,
-    backgroundColor
+    styles: createStylesField()
   },
   defaultProps: {
     heading: "Frequently Asked Questions",
@@ -32,7 +30,7 @@ const conf = {
         content: "Yes, you can cancel your subscription at any time."
       }
     ],
-    padding: paddingDefaults
+    styles: createStylesDefaults()
   },
   render: Accordion
 };

package/dist/components/puck-block/faq-sections/faq-1/faq.d.ts

@@ -1,15 +1,17 @@
 import { CompoundContainerProps } from "@/components/puck-base/container";
 import { CompoundContentProps } from "@/components/puck-base/content";
 export interface FaqProps extends CompoundContentProps {
-    padding?: CompoundContainerProps["padding"];
-    sectionStyle?: CompoundContainerProps["sectionStyle"];
-    backgroundColor?: string;
     layout?: "single-col" | "two-col";
-    type?: "single" | "multiple";
-    collapsible?: "true" | "false";
-    faqs: {
+    expandMode?: "single" | "multiple";
+    collapsible?: boolean;
+    items: {
         question: string;
         answer: string;
     }[];
+    styles?: {
+        padding?: CompoundContainerProps["padding"];
+        sectionStyle?: CompoundContainerProps["sectionStyle"];
+        backgroundColor?: string;
+    };
 }
-export declare const Faq: ({ padding, sectionStyle, backgroundColor, layout, badge, heading, description, buttons, type, collapsible, faqs, }: FaqProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Faq: ({ layout, badge, heading, description, buttons, expandMode, collapsible, items, styles, }: FaqProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/puck-block/faq-sections/faq-1/faq.js

@@ -5,58 +5,64 @@ import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from "..
 import { CompoundContainer } from "../../../puck-base/container.js";
 import { CompoundContent } from "../../../puck-base/content.js";
 const Faq = ({
-  padding,
-  sectionStyle,
-  backgroundColor,
   layout = "two-col",
   badge,
   heading,
   description,
   buttons,
-  type = "single",
-  collapsible = "true",
-  faqs
-}) => /* @__PURE__ */ jsx(CompoundContainer, { padding, sectionStyle, backgroundColor, children: /* @__PURE__ */ jsxs(
-  "div",
+  expandMode = "single",
+  collapsible = true,
+  items,
+  styles
+}) => /* @__PURE__ */ jsx(
+  CompoundContainer,
   {
-    className: cn("grid gap-10", {
-      "items-center lg:grid-cols-1": layout === "single-col",
-      "lg:grid-cols-2": layout === "two-col"
-    }),
-    children: [
-      /* @__PURE__ */ jsx(
-        CompoundContent,
-        {
-          badge,
-          heading,
-          description,
-          buttons,
-          alignContent: layout === "single-col" ? "center" : "start"
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        Accordion,
-        {
-          type,
-          collapsible: collapsible === "true",
-          className: "w-full",
-          children: faqs.map((faq, index) => /* @__PURE__ */ jsxs(
-            AccordionItem,
+    padding: styles == null ? void 0 : styles.padding,
+    sectionStyle: styles == null ? void 0 : styles.sectionStyle,
+    backgroundColor: styles == null ? void 0 : styles.backgroundColor,
+    children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn("grid gap-10", {
+          "items-center lg:grid-cols-1": layout === "single-col",
+          "lg:grid-cols-2": layout === "two-col"
+        }),
+        children: [
+          /* @__PURE__ */ jsx(
+            CompoundContent,
             {
-              value: "index-" + index,
-              ref: registerOverlayPortal,
-              children: [
-                /* @__PURE__ */ jsx(AccordionTrigger, { children: faq.question }),
-                /* @__PURE__ */ jsx(AccordionContent, { children: faq.answer })
-              ]
-            },
-            index
-          ))
-        }
-      )
-    ]
+              badge,
+              heading,
+              description,
+              buttons,
+              alignContent: layout === "single-col" ? "center" : "start"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Accordion,
+            {
+              type: expandMode,
+              collapsible,
+              className: "w-full",
+              children: items.map((faq, index) => /* @__PURE__ */ jsxs(
+                AccordionItem,
+                {
+                  value: "index-" + index,
+                  ref: registerOverlayPortal,
+                  children: [
+                    /* @__PURE__ */ jsx(AccordionTrigger, { children: faq.question }),
+                    /* @__PURE__ */ jsx(AccordionContent, { children: faq.answer })
+                  ]
+                },
+                index
+              ))
+            }
+          )
+        ]
+      }
+    )
   }
-) });
+);
 export {
   Faq
 };

package/dist/components/puck-block/faq-sections/faq-1/index.js

@@ -1,9 +1,10 @@
-import { paddingDefaults, backgroundColor, sectionStyle, padding, contentFields } from "../../../puck-base/core/fields.js";
+import { contentFields } from "../../../puck-base/core/fields.js";
 import { Faq } from "./faq.js";
+import { createStylesDefaults, createStylesField } from "../../../puck-base/core/styles.js";
 const conf = {
   fields: {
     ...contentFields,
-    type: {
+    expandMode: {
       type: "radio",
       label: "answer display",
       options: [
@@ -12,15 +13,14 @@ const conf = {
       ]
     },
     collapsible: {
-      // TODO: would be good to have boolean values
       type: "radio",
       label: "can close answers",
       options: [
-        { label: "yes", value: "true" },
-        { label: "no", value: "false" }
+        { label: "yes", value: true },
+        { label: "no", value: false }
       ]
     },
-    faqs: {
+    items: {
       type: "array",
       max: 20,
       getItemSummary: (item, index = 0) => {
@@ -45,9 +45,7 @@ const conf = {
         { label: "two Column", value: "two-col" }
       ]
     },
-    padding,
-    sectionStyle,
-    backgroundColor
+    styles: createStylesField()
   },
   defaultProps: {
     badge: {
@@ -64,19 +62,19 @@ const conf = {
         variant: "secondary"
       }
     ],
-    type: "single",
-    collapsible: "true",
-    faqs: [
+    expandMode: "single",
+    collapsible: true,
+    items: [
       {
         question: "Question",
         answer: "Answer"
       }
     ],
     layout: "two-col",
-    padding: paddingDefaults
+    styles: createStylesDefaults()
   },
   resolveFields: (data, params) => {
-    if (data.props.type === "multiple") {
+    if (data.props.expandMode === "multiple") {
       const { collapsible, ...newFields } = params.fields;
       return newFields;
     }

package/dist/components/puck-block/faq-sections/faq-2/faq-2.d.ts

@@ -0,0 +1,18 @@
+import { CompoundContainerProps } from "@/components/puck-base/container";
+import { CompoundImageProps } from "@/components/puck-base/image";
+export interface Faq2Item {
+    question: string;
+    answer: string;
+}
+export interface Faq2Props {
+    heading?: string;
+    items?: Faq2Item[];
+    image?: CompoundImageProps;
+    imagePosition?: "left" | "right";
+    styles?: {
+        padding?: CompoundContainerProps["padding"];
+        sectionStyle?: CompoundContainerProps["sectionStyle"];
+        backgroundColor?: string;
+    };
+}
+export declare const Faq2: ({ heading, items, image, imagePosition, styles, }: Faq2Props) => import("react/jsx-runtime").JSX.Element;

package/dist/components/puck-block/faq-sections/faq-2/faq-2.js

@@ -0,0 +1,54 @@
+"use client";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { CompoundContainer } from "../../../puck-base/container.js";
+import { CompoundImage } from "../../../puck-base/image.js";
+import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from "../../../shadcn/accordion.js";
+const Faq2 = ({
+  heading,
+  items = [],
+  image,
+  imagePosition = "right",
+  styles
+}) => {
+  const imageCol = /* @__PURE__ */ jsx("div", { className: "hidden lg:block lg:sticky lg:top-8 aspect-square overflow-hidden rounded-3xl", children: /* @__PURE__ */ jsx(
+    CompoundImage,
+    {
+      src: (image == null ? void 0 : image.src) ?? "",
+      alt: (image == null ? void 0 : image.alt) ?? "",
+      className: "h-full w-full object-cover"
+    }
+  ) });
+  const accordionCol = /* @__PURE__ */ jsx(Accordion, { type: "single", collapsible: true, className: "flex flex-col gap-3", children: items.map((item, i) => /* @__PURE__ */ jsxs(
+    AccordionItem,
+    {
+      value: `faq2-${i}`,
+      className: "border-0 bg-foreground/[0.047] rounded-3xl px-6",
+      children: [
+        /* @__PURE__ */ jsx(AccordionTrigger, { className: "text-base font-medium hover:no-underline py-5 text-left", children: item.question }),
+        /* @__PURE__ */ jsx(AccordionContent, { className: "text-muted-foreground pb-5 text-sm leading-relaxed", children: item.answer })
+      ]
+    },
+    i
+  )) });
+  return /* @__PURE__ */ jsx(
+    CompoundContainer,
+    {
+      padding: styles == null ? void 0 : styles.padding,
+      sectionStyle: styles == null ? void 0 : styles.sectionStyle,
+      backgroundColor: styles == null ? void 0 : styles.backgroundColor,
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-10", children: [
+        heading && /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx("h2", { className: "text-foreground font-serif text-3xl font-semibold tracking-tight md:text-4xl lg:text-5xl", children: heading }) }),
+        /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-12 lg:grid-cols-2 lg:items-start lg:gap-16", children: imagePosition === "left" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          imageCol,
+          accordionCol
+        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          accordionCol,
+          imageCol
+        ] }) })
+      ] })
+    }
+  );
+};
+export {
+  Faq2
+};