import React from 'react';
import { ThemeOverrideProps } from '@xsolla/xui-core';

type GameCardSize = "lg" | "md" | "sm";
type GameCardImageRatio = "16:9" | "1:1" | "2:3" | "3:2" | "4:3" | "9:16" | "custom";
type GameCardLayout = "horizontal" | "vertical";
type GameCardPlatform = "mobile" | "desktop";
interface GameCardProps extends ThemeOverrideProps {
    /** Game artwork image URL. When omitted, a placeholder is rendered. */
    image?: string;
    /** Game title */
    title: string;
    /** Game subtitle (e.g., genre tags) */
    subtitle?: string;
    /** Size variant of the card */
    size?: GameCardSize;
    /** Aspect ratio of the image area (default "16:9") */
    imageRatio?: GameCardImageRatio;
    /** Custom width for the image area when imageRatio is "custom" */
    customImageWidth?: number;
    /** Custom height for the image area when imageRatio is "custom" */
    customImageHeight?: number;
    /** Custom badge element displayed above tags on the image (top-left corner) */
    badge?: React.ReactNode;
    /** Custom content for top-left corner tags */
    tagsTopLeft?: React.ReactNode;
    /** Custom content for top-right corner tags */
    tagsTopRight?: React.ReactNode;
    /** Custom content for bottom-left corner tags */
    tagsBottomLeft?: React.ReactNode;
    /** Custom content for bottom-right corner tags */
    tagsBottomRight?: React.ReactNode;
    /** Custom trailing content (button, price, etc.) - overrides buttonText if provided */
    trailing?: React.ReactNode;
    /** Button label text (used if trailing is not provided) */
    buttonText?: string;
    /** Button click handler (used if trailing is not provided) */
    onButtonClick?: () => void;
    /** Whether the button is disabled (used if trailing is not provided) */
    buttonDisabled?: boolean;
    /** Footer layout direction (default "horizontal") */
    layout?: GameCardLayout;
    /** Platform variant affecting footer spacing (default "mobile") */
    platform?: GameCardPlatform;
    /** When true, hides the footer (title/subtitle/button area) entirely. Useful for image-only cards like XWP presets. */
    hideFooter?: boolean;
    /** Hover overlay content rendered at the bottom of the image area on hover */
    hoverContent?: React.ReactNode;
    /** Card click handler */
    onPress?: () => void;
    /** Alt text for game image */
    imageAlt?: string;
    /** Custom className for the container */
    className?: string;
    testID?: string;
}

declare const GameCard: React.FC<GameCardProps>;

export { GameCard, type GameCardImageRatio, type GameCardLayout, type GameCardPlatform, type GameCardProps, type GameCardSize };