import { default as React, CSSProperties, ReactNode } from 'react';
export interface HeroProps {
    children?: ReactNode;
    className?: string;
    style?: CSSProperties;
    /**
     * Marks the hero as a dark surface (applies `surface-dark` className) so
     * descendants reading `var(--text)` pick up the light tone. Useful for
     * heroes with photo backgrounds or strongly colored fills.
     */
    dark?: boolean;
    /**
     * Background image URL — sets the hero's `background-image` to a
     * full-cover image with a soft dark overlay so foreground text stays
     * readable. Pair with `dark` if you want the typography tuned for
     * a dark surface.
     */
    backgroundImageUrl?: string;
}
interface HeroSlotProps {
    children?: ReactNode;
    className?: string;
}
interface HeroTitleProps extends HeroSlotProps {
    /** Heading level. Defaults to 1 — heroes are usually the page's primary heading. */
    as?: 'h1' | 'h2';
}
interface HeroComponent extends React.FC<HeroProps> {
    Main: React.FC<HeroSlotProps>;
    Side: React.FC<HeroSlotProps>;
    Eyebrow: React.FC<HeroSlotProps>;
    Title: React.FC<HeroTitleProps>;
    Lead: React.FC<HeroSlotProps>;
    Actions: React.FC<HeroSlotProps>;
}
export declare const Hero: HeroComponent;
export {};
//# sourceMappingURL=Hero.d.ts.map