import React, { ReactElement } from 'react';
import Element from '../Element/Element';
import { CreateProps } from '../../types/utils/CreateProps';
import { SupportedHeadlineColor } from '../Typography/Headline/Headline';
import { SupportedTagName } from '../Typography/Typography';
import Breadcrumb from '../Breadcrumb/Breadcrumb';
import { SupportedColor as BackgroundSupportedColor } from '../Element/Element';
declare type HeroBannerLayoutProps = CreateProps<{
    /** Breadcrumb component with all required props */
    breadcrumb?: typeof Breadcrumb | ReactElement;
    /** Component or Text of heading */
    heading: ReactElement | string;
    /** Component or Text of description */
    description?: ReactElement | string;
    /** Image or component (of the product) to be shown on the right side of the banner */
    image?: ReactElement | string;
    /**  Image alt text, fallbacks src */
    imageAlt?: string;
    /** Background image */
    backgroundImageUrl?: string;
    /** Background color */
    backgroundColor?: BackgroundSupportedColor;
    /** Color of heading and description text */
    color?: SupportedHeadlineColor;
    /** TagName of Headline */
    headlineTagName?: SupportedTagName;
    /** Component or text of bottom component */
    bottomContent?: ReactElement | string;
    /** HTML tag name: div, span, h1 etc */
    tagName?: keyof JSX.IntrinsicElements;
}, typeof Element, 'occupyVerticalSpace' | 'tagName'>;
export declare type HeroBannerLayoutAttributes = HeroBannerLayoutProps;
declare const HeroBannerLayout: React.FunctionComponent<HeroBannerLayoutProps>;
export default HeroBannerLayout;