import * as React from 'react';
import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-qC2HCInM.js';
import { A as ActionConfig } from './blocks-DL92rOxr.js';
import 'react/jsx-runtime';
import 'class-variance-authority';
import '@page-speed/pressable';
import '@opensite/hooks/usePlatformFromUrl';

/**
 * Service item configuration for accordion benefits display
 */
interface ServicesListAccordionBenefitsService {
    /**
     * Unique identifier for the service
     */
    id?: string;
    /**
     * Service title
     */
    title?: React.ReactNode;
    /**
     * Short description shown in collapsed state
     */
    shortDescription?: React.ReactNode;
    /**
     * Full description shown when expanded
     */
    fullDescription?: React.ReactNode;
    /**
     * List of benefits
     */
    benefits?: React.ReactNode[];
    /**
     * CTA button text
     */
    ctaText?: React.ReactNode;
    /**
     * CTA button URL
     */
    ctaUrl?: string;
    /**
     * CTA click handler
     */
    ctaOnClick?: () => void;
    /**
     * Additional CSS classes for the accordion item
     */
    className?: string;
}
interface ServicesListAccordionBenefitsProps {
    /**
     * Main heading content
     */
    heading?: React.ReactNode;
    /**
     * Supporting description content
     */
    description?: React.ReactNode;
    /**
     * Array of service configurations
     */
    services?: ServicesListAccordionBenefitsService[];
    /**
     * Custom slot for rendering services (overrides services array)
     */
    servicesSlot?: React.ReactNode;
    /**
     * Default expanded accordion item value
     */
    defaultValue?: string;
    /**
     * Label for the benefits section
     */
    benefitsLabel?: React.ReactNode;
    /**
     * Bottom CTA action configuration
     */
    bottomAction?: ActionConfig;
    /**
     * Custom slot for bottom CTA (overrides bottomAction)
     */
    bottomActionSlot?: React.ReactNode;
    /**
     * Additional CSS classes for the section wrapper
     */
    className?: string;
    /**
     * Additional CSS classes for the container
     */
    containerClassName?: string;
    /**
     * Additional CSS classes for the header
     */
    headerClassName?: string;
    /**
     * Additional CSS classes for the heading
     */
    headingClassName?: string;
    /**
     * Additional CSS classes for the description
     */
    descriptionClassName?: string;
    /**
     * Additional CSS classes for the accordion
     */
    accordionClassName?: string;
    /**
     * Additional CSS classes for each accordion item
     */
    accordionItemClassName?: string;
    /**
     * Additional CSS classes for the bottom CTA container
     */
    bottomActionClassName?: string;
    /**
     * Background style for the section
     */
    background?: SectionBackground;
    /**
     * Vertical spacing for the section
     */
    spacing?: SectionSpacing;
    /**
     * Optional background pattern name or URL
     */
    pattern?: PatternName | undefined;
    /**
     * Pattern overlay opacity (0-1)
     */
    patternOpacity?: number;
    /** Optional Section ID */
    sectionId?: string;
}
/**
 * ServicesListAccordionBenefits - An accordion layout with expandable service items featuring detailed benefits lists.
 * Each accordion item shows title and short description when collapsed, expanding to reveal full description,
 * benefits list with bullet points, and a CTA link. Includes a bottom CTA for custom quotes.
 * Ideal for freelancers or agencies showcasing detailed service offerings with clear value propositions.
 *
 * @example
 * ```tsx
 * <ServicesListAccordionBenefits
 *   heading="My Services"
 *   description="Click on any service to learn more"
 *   services={[
 *     { id: "1", title: "Web Dev", shortDescription: "Custom sites", fullDescription: "Full details...", benefits: ["Fast", "Secure"] }
 *   ]}
 *   bottomAction={{ label: "Get a quote", href: "/contact" }}
 *   background="white"
 *   spacing="lg"
 * />
 * ```
 */
declare function ServicesListAccordionBenefits({ sectionId, heading, description, services, servicesSlot, defaultValue, benefitsLabel, bottomAction, bottomActionSlot, className, containerClassName, headerClassName, headingClassName, descriptionClassName, accordionClassName, accordionItemClassName, bottomActionClassName, background, spacing, pattern, patternOpacity, }: ServicesListAccordionBenefitsProps): React.JSX.Element;

export { ServicesListAccordionBenefits, type ServicesListAccordionBenefitsProps };
