import { default as React, SyntheticEvent } from 'react';
import { BUTTON_STYLE } from '../button/Button';
type TeaserButton = {
    /**
     * The text content for the button.
     */
    text?: string | React.ReactNode;
    /**
     * The button style.
     *
     * See the button styles definition for possible values.
     *
     * @default 'primary'
     */
    bsStyle?: BUTTON_STYLE;
    /**
     * Callback function for the button.
     */
    onClick?: (event: SyntheticEvent<HTMLButtonElement, MouseEvent>) => void;
    /**
     * Additional classes added to the button.
     */
    className?: string;
};
type TeaserImage = {
    /**
     * The src URL for the image.
     */
    src: string;
    /**
     * The alternate text for the image.
     */
    alt?: string;
    /**
     * Defines whether the image is on the left or right side of the component.
     *
     * Possible values are: `'left'` and `'right'`.
     */
    align?: 'left' | 'right';
    /**
     * Callback function for the image.
     */
    onClick?: VoidFunction;
    /**
     * Ratio of the transparent image placeholder.
     *
     * Possible values are `'1:1'`, `'3:1'`, `'3:2'` and `'16:9'`.
     */
    aspectRatio?: '1:1' | '3:1' | '3:2' | '16:9';
    /**
     * Additional classes added to the image wrapper.
     */
    className?: string;
};
export type TeaserProps = {
    /**
     * The headline for the teaser.
     */
    headline?: string | React.ReactNode;
    /**
     * The actual content to show e.g. some kind of text.
     */
    content?: string | React.ReactNode;
    /**
     * Defines an image to render.
     */
    image?: TeaserImage;
    /**
     * Defines a button to render with.
     */
    button?: TeaserButton;
    /**
     * Defines where the teaser content is aligned including headline and image.
     *
     * Possible values are: `'top'` and `'center'`.
     *
     * @default 'top'
     */
    verticalAlignment?: 'top' | 'center';
    /**
     * Defines how the teaser content is segmented.
     *
     * Possible values are: `'50'`, `'25:75'`, `'75:25'` and `'100'`.
     */
    segmentation?: '50' | '25:75' | '75:25' | '100';
    /**
     * Optional content for footer in case the prop "button" is not sufficient.
     */
    footer?: string | React.ReactNode;
    /**
     * Additional classes added to the wrapper.
     */
    className?: string;
};
declare const Teaser: (props: TeaserProps) => import("react/jsx-runtime").JSX.Element;
export default Teaser;
