import { type HTMLAttributes } from "react";
/**
 * The overlay positions relative to the `MediaContainer` component.  Most of
 * the sizes are self-explanatory, but the `middle` position will be centered
 * vertically while `center` will be centered `horizontally`.
 *
 * @remarks \@since 6.0.0 Renamed from `MediaOverlayPosition` to
 * `ResponsiveItemOverlayProps`.
 */
export type ResponsiveItemOverlayPosition = "top" | "right" | "bottom" | "left" | "middle" | "center" | "absolute-center";
/** @remarks \@since 6.0.0 */
export interface ResponsiveItemOverlayClassNameOptions {
    className?: string;
    /** @defaultValue `"bottom"` */
    position?: ResponsiveItemOverlayPosition;
}
/**
 * @remarks \@since 6.0.0
 */
export declare function responsiveItemOverlay(options?: ResponsiveItemOverlayClassNameOptions): string;
/**
 * @remarks \@since 6.0.0 Renamed from `MediaOverlayProps` to
 * `ResponsiveItemOverlayProps`.
 */
export interface ResponsiveItemOverlayProps extends HTMLAttributes<HTMLSpanElement>, ResponsiveItemOverlayClassNameOptions {
}
/**
 * **Server Component**
 *
 * @example
 * Simple Example
 * ```tsx
 * import { ResponsiveItemContainer, ResponsiveItemOverlay } from "@react-md/core";
 * import type { ReactElement } from "react";
 *
 * function Example(): ReactElement {
 *   return (
 *     <ResponsiveItemContainer>
 *       <img alt="" src="/some-image.png" />
 *       <ResponsiveItemOverlay>
 *         <Typography type="headline-5" margin="none">
 *           This appears at the bottom by default.
 *         </Typography>
 *       </ResponsiveItemOverlay>
 *     </ResponsiveItemContainer>
 *   );
 * }
 * ```
 *
 * @see {@link ResponsiveItemOverlayPosition}
 *
 * @remarks \@since 6.0.0 Renamed from `MediaOverlay` to `ResponsiveItemOverlay`
 * and renders as a `<span>` instead of a `<div>`.
 */
export declare const ResponsiveItemOverlay: import("react").ForwardRefExoticComponent<ResponsiveItemOverlayProps & import("react").RefAttributes<HTMLSpanElement>>;
