import * as React from 'react';
import { O as OptixFlowConfig } from './blocks-BmrJXeAA.js';
import 'class-variance-authority';
import './button-variants-OIpPF9yW.js';
import 'class-variance-authority/types';

interface FeatureNumberedCardsChecklistItem {
    /**
     * Checklist item content
     */
    content?: React.ReactNode;
    /**
     * Icon element (overrides default check icon)
     */
    icon?: React.ReactNode;
    /**
     * Icon name for dynamic icon loading
     */
    iconName?: string;
    /**
     * Additional CSS classes for the item
     */
    className?: string;
}
interface FeatureNumberedCardsItem {
    /**
     * Feature title content
     */
    title?: React.ReactNode;
    /**
     * Feature description content
     */
    description?: React.ReactNode;
    /**
     * Image source URL
     */
    image?: string;
    /**
     * Image alt text
     */
    imageAlt?: string;
    /**
     * Image element or ReactNode (overrides image)
     */
    imageSlot?: React.ReactNode;
    /**
     * Checklist items (can be strings or FeatureNumberedCardsChecklistItem objects)
     */
    checklistItems?: (string | FeatureNumberedCardsChecklistItem)[];
    /**
     * Custom slot for checklist (overrides checklistItems)
     */
    checklistSlot?: React.ReactNode;
    /**
     * Additional CSS classes for the card
     */
    className?: string;
    /**
     * Additional CSS classes for the content area
     */
    contentClassName?: string;
    /**
     * Additional CSS classes for the image wrapper
     */
    imageWrapperClassName?: string;
}
interface FeatureNumberedCardsProps {
    /**
     * Array of numbered feature cards
     */
    features?: FeatureNumberedCardsItem[];
    /**
     * Custom slot for rendering features (overrides features array)
     */
    featuresSlot?: React.ReactNode;
    /**
     * Additional CSS classes for the section
     */
    className?: string;
    /**
     * Additional CSS classes for the container
     */
    containerClassName?: string;
    /**
     * Additional CSS classes for the cards wrapper
     */
    cardsWrapperClassName?: string;
    /**
     * Additional CSS classes for each card
     */
    cardClassName?: string;
    /**
     * Additional CSS classes for the title
     */
    titleClassName?: string;
    /**
     * Additional CSS classes for the description
     */
    descriptionClassName?: string;
    /**
     * Additional CSS classes for the checklist
     */
    checklistClassName?: string;
    /**
     * Additional CSS classes for the number badge
     */
    badgeClassName?: string;
    /**
     * OptixFlow image optimization configuration
     */
    optixFlowConfig?: OptixFlowConfig;
}
/**
 * Feature Numbered Cards - Stacked feature cards with numbered badges and
 * images, featuring checklists.
 *
 * Layout: Vertical stack of bordered cards with numbered badges and side images.
 * Key features: Numbered badges, checklist items, alternating image positions.
 * Best for: Payment features, security highlights, step-by-step processes.
 *
 * @example
 * ```tsx
 * <FeatureNumberedCards
 *   features={[
 *     {
 *       title: "Secure Payments",
 *       description: "Process payments securely with our gateway.",
 *       image: "/payments.jpg",
 *       checklistItems: ["SSL encryption", "Stripe integration"]
 *     },
 *   ]}
 * />
 * ```
 */
declare function FeatureNumberedCards({ features, featuresSlot, className, containerClassName, cardsWrapperClassName, cardClassName, titleClassName, descriptionClassName, checklistClassName, badgeClassName, optixFlowConfig, }: FeatureNumberedCardsProps): React.JSX.Element;

export { FeatureNumberedCards, type FeatureNumberedCardsProps };
