// Type definitions for agate/ThumbnailItem

import { ItemProps as agate_Item_ItemProps } from "@enact/agate/Item";
import * as React from "react";
import { SlottableProps as ui_Slottable_SlottableProps } from "@enact/ui/Slottable";

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 ThumbnailItemBaseProps extends agate_Item_ItemProps {
  /**
   * The main content displayed with the thumbnail.
   */
  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:
 * *  `thumbnailItem`  - The root component class
 * *  `content`  - The content component class
 * *  `subContent`  - The subContent component class
 * *  `roundThumbnail`  - Applied when  `roundThumbnail="true"`
 * *  `thumbnail`  - The thumbnail component class
 */
  css?: object;
  /**
   * Applies  `selected`  className.
   */
  selected?: boolean;
  /**
   * Nodes to be inserted before  `children` .
   */
  slotBefore?: React.ReactNode;
  /**
   * String value used to determine which thumbnail will appear on a specific screenSize.
   */
  src?: string;
  /**
   * The thumbnail type.
   */
  type?: "normal" | "styled";
}
/**
 * A stateless, unfocusable item that can display a thumbnail.
 */

export class ThumbnailItemBase extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ThumbnailItemBaseProps>
> {}

export interface ThumbnailItemProps
  extends Merge<ThumbnailItemBaseProps, ui_Slottable_SlottableProps> {}
/**
 * A stateless, unfocusable item that can display a thumbnail.
 */

export class ThumbnailItem extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ThumbnailItemProps>
> {}

export default ThumbnailItem;
