// Client/Server Component // "use client" // uncomment when required for: hooks, event handlers, browser APIs /** * @name FAQ 05 * @description A numbered FAQ layout with large index numbers. * Creates a strong visual hierarchy and easy reference points. * * @slots faq, faq-container, faq-header, faq-heading, faq-description, * faq-list, faq-item, faq-number, faq-content, faq-question, faq-answer * @variant numbered * * @registryDependencies * @dependencies */ import * as React from "react" import { cn } from "@/registry/lib/utils" // ============================================================================ // TYPES // ============================================================================ interface FaqItemConfig { /** Unique identifier for list key */ id: string /** Question text */ question: string /** Answer text */ answer: string } interface Faq05Props { /** Section heading */ heading?: string /** Section description */ description?: string /** Array of FAQ items */ faqs?: FaqItemConfig[] /** Additional CSS classes */ className?: string /** Multi-instance safety: base for generating DOM ids */ idBase?: string } // ============================================================================ // DEFAULT DATA // ============================================================================ const DEFAULT_FAQS: FaqItemConfig[] = [ { id: "faq-payment", question: "What payment methods do you accept?", answer: "We accept all major credit cards (Visa, MasterCard, American Express), PayPal, and bank transfers for annual plans. All payments are processed securely through our payment provider with industry-standard encryption.", }, { id: "faq-cancel", question: "Can I cancel my subscription at any time?", answer: "Yes, you can cancel your subscription at any time from your account settings. Your access will continue until the end of your current billing period, and you won't be charged again.", }, { id: "faq-trial", question: "Do you offer a free trial?", answer: "Yes, we offer a 14-day free trial on all plans. No credit card required to start. You'll have full access to all features during the trial period to evaluate if our platform is right for you.", }, { id: "faq-support", question: "How do I get support?", answer: "We offer 24/7 support through our help center, email, and live chat. Pro and Enterprise customers also get access to priority support with faster response times and dedicated account managers.", }, { id: "faq-upgrade", question: "Can I upgrade or downgrade my plan?", answer: "Absolutely! You can change your plan at any time from your account settings. When upgrading, you'll be charged the prorated difference. When downgrading, the new rate applies at your next billing cycle.", }, ] // ============================================================================ // COMPONENT // ============================================================================ function Faq05({ heading = "Frequently asked questions", description = "Everything you need to know about our platform and services.", faqs = DEFAULT_FAQS, className, idBase, }: Faq05Props) { const headingId = `${idBase ?? "faq-05"}-heading` return (

{/* Header */}

{heading}

{description && (

{description}

)}

{/* FAQ List */}

{faqs.map((faq, index) => (

{/* Number */} {/* Content */}

{faq.question}

{faq.answer}

))}

) } export default Faq05 export { Faq05, type Faq05Props, type FaqItemConfig }