import { type Variants } from 'motion/react';
import { type ComponentPropsWithoutRef, type CSSProperties } from 'react';
import { type CssLength } from '../../../utils/css';
type CutoutCardPlacement = 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';
type CutoutCardCssProperties = CSSProperties & Record<`--cutout-card-${string}`, string | number | undefined>;
export type CutoutCardContextValue = {
    hovered: boolean;
    setHovered: (nextHovered: boolean) => void;
};
export type CutoutContentStaggerVariants = {
    container: Variants;
    item: Variants;
};
export declare const cutoutCardSurfaceShadowClassName: string;
export declare const cutoutCardSurfaceClassName: string;
export declare const useCutoutCard: () => CutoutCardContextValue;
export declare const useOptionalCutoutCard: () => CutoutCardContextValue | null;
export declare const useCutoutContentStaggerVariants: () => CutoutContentStaggerVariants;
export type CutoutCardProps = Omit<ComponentPropsWithoutRef<'article'>, 'style'> & {
    defaultHovered?: boolean;
    hovered?: boolean;
    onHoveredChange?: (hovered: boolean) => void;
    radius?: CssLength;
    style?: CutoutCardCssProperties;
    trackPointerHover?: boolean;
    width?: CssLength;
};
export declare const CutoutCard: ({ children, className, defaultHovered, hovered: hoveredProp, onBlur, onFocus, onHoveredChange, onPointerEnter, onPointerLeave, radius, style, trackPointerHover, width, ...props }: CutoutCardProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCardMediaProps = Omit<ComponentPropsWithoutRef<'div'>, 'style'> & {
    height?: CssLength;
    style?: CutoutCardCssProperties;
};
export declare const CutoutCardMedia: ({ className, height, style, ...props }: CutoutCardMediaProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCardImageProps = Omit<ComponentPropsWithoutRef<'img'>, 'alt'> & {
    alt: string;
};
export declare const CutoutCardImage: ({ alt, className, decoding, loading, ...props }: CutoutCardImageProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCardOverlayProps = Omit<ComponentPropsWithoutRef<'div'>, 'style'> & {
    opacity?: number;
    style?: CutoutCardCssProperties;
};
export declare const CutoutCardOverlay: ({ className, opacity, style, ...props }: CutoutCardOverlayProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCardContentProps = ComponentPropsWithoutRef<'div'>;
export declare const CutoutCardContent: ({ className, ...props }: CutoutCardContentProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCardFooterProps = ComponentPropsWithoutRef<'div'>;
export declare const CutoutCardFooter: ({ className, ...props }: CutoutCardFooterProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCornerProps = Omit<ComponentPropsWithoutRef<'svg'>, 'children'> & {
    size?: number | string;
};
export declare const CutoutCorner: ({ className, focusable, size, viewBox, ...props }: CutoutCornerProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCardInsetLabelProps = ComponentPropsWithoutRef<'div'> & {
    placement?: CutoutCardPlacement;
};
export declare const CutoutCardInsetLabel: ({ className, placement, ...props }: CutoutCardInsetLabelProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCardPinProps = ComponentPropsWithoutRef<'div'> & {
    placement?: CutoutCardPlacement;
};
export declare const CutoutCardPin: ({ className, placement, ...props }: CutoutCardPinProps) => import("react/jsx-runtime").JSX.Element;
export type CutoutCardActionProps = ComponentPropsWithoutRef<'div'> & {
    placement?: CutoutCardPlacement;
    revealOnHover?: boolean;
};
export declare const CutoutCardAction: ({ className, placement, revealOnHover, ...props }: CutoutCardActionProps) => import("react/jsx-runtime").JSX.Element;
export type { CutoutCardPlacement };