// Type definitions for agate/ImageItem

import { ImageItemProps as ui_ImageItem_ImageItemProps } from "@enact/ui/ImageItem";
import * as React from "react";
import { MarqueeControllerProps as ui_Marquee_MarqueeControllerProps } from "@enact/ui/Marquee";
import { SkinnableProps as agate_Skinnable_SkinnableProps } from "@enact/agate/Skinnable";
import { SpottableProps as spotlight_Spottable_SpottableProps } from "@enact/spotlight/Spottable";

type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
type Merge<M, N> = Omit<M, Extract<keyof M, keyof N>> & N;

export interface ImageItemBaseProps extends ui_ImageItem_ImageItemProps {
  /**
 * Sets the position for caption.
Available positions: 'below' (default) and 'overlay'.
 */
  captionPosition?: "below" | "overlay";
  /**
   * The caption displayed with the image.
   */
  children?: React.ReactNode;
  /**
 * Customizes the component by mapping the supplied collection of CSS class names to the
corresponding internal elements and states of this component.
 * 
 * The following classes are supported:
 * *  `imageItem`  - The root component class
 * *  `caption`  - The caption component class
 * *  `horizontal`  - Applied when  `orientation="horizontal"`
 * *  `image`  - The image component class
 * *  `vertical`  - Applied when  `orientation="vertical"`
 */
  css?: object;
  /**
   * Disables the  `ImageItem` .
   */
  disabled?: boolean;
  /**
   * The layout orientation of the component.
   */
  orientation?: "horizontal" | "vertical";
  /**
 * String value or Object of values used to determine which image will appear on a specific
screenSize.
 */
  src?: string | object;
}
/**
 * An Agate styled ImageItem.
 */

export class ImageItemBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ImageItemBaseProps>
> {}

export interface ImageItemDecoratorProps
  extends Merge<
    Merge<ui_Marquee_MarqueeControllerProps, agate_Skinnable_SkinnableProps>,
    spotlight_Spottable_SpottableProps
  > {}
export function ImageItemDecorator<P>(
  Component: React.ComponentType<P> | string
): React.ComponentType<P & ImageItemDecoratorProps>;

export interface ImageItemProps
  extends Merge<ImageItemBaseProps, ImageItemDecoratorProps> {}
/**
 * An Agate styled ImageItem with built-in support for marqueed text, and Spotlight focus.
 */

export class ImageItem extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ImageItemProps>
> {}

export default ImageItem;
