FAQ

import { Faq } from "@/components/email/faq";
import { defaultTheme } from "@/components/email/theme-default";

export function FaqDemo() {
  return (
    <Faq
      layout="boxed"
      marker="number"
      answerPosition="stacked"
      theme={{ ...defaultTheme, containerWidth: "640px" }}
    />
  );
}

import { Faq } from "@/components/email/faq";

export function FaqLayoutBoxedMarkerNumberAnswerPositionStackedExampleDemo() {
  return <Faq layout="boxed" marker="number" answerPosition="stacked" />;
}

import { Faq } from "@/components/email/faq";

export function FaqLayoutBoxedMarkerNumberAlternatingExampleDemo() {
  return <Faq layout="boxed" marker="number" alternating />;
}

import { Faq } from "@/components/email/faq";

export function FaqLayoutCollapsedMarkerIconExampleDemo() {
  return <Faq layout="collapsed" marker="icon" />;
}

import { Faq } from "@/components/email/faq";

export function FaqLayoutCollapsedMarkerNoneActionExampleDemo() {
  return (
    <Faq
      layout="collapsed"
      marker="none"
      action={{ href: "https://example.com", label: "Contact support" }}
    />
  );
}

import { Faq } from "@/components/email/faq";

export function FaqLayoutCollapsedMarkerNumberExampleDemo() {
  return <Faq layout="collapsed" marker="number" />;
}

import { Faq } from "@/components/email/faq";

export function FaqLayoutExpandedMarkerNumberExampleDemo() {
  return <Faq layout="expanded" marker="number" />;
}

import { Faq } from "@/components/email/faq";

export function FaqLayoutExpandedMarkerNoneAnswerPositionOffsetExampleDemo() {
  return <Faq layout="expanded" marker="none" answerPosition="offset" />;
}