import * as React from 'react';
import {PropsWithChildren} from "react";

export type MediaOverlaySkin = 'none' | 'gradient' | 'dark';

export interface MediaOverlayProps {
  media: React.ReactNode;
  skin?: MediaOverlaySkin;
  hoverSkin?: MediaOverlaySkin;
  dataHook?: string;
  hovered?: boolean;
  onClick?(): void;
  removeRoundedBorders?: boolean;
  className?: string;
}

export type MediaOverlayContentVisible = 'default' | 'hover' | 'always';
export type MediaOverlayContentPlacement =
  | 'top-start'
  | 'top-end'
  | 'middle'
  | 'bottom-end'
  | 'bottom-start';

export interface MediaOverlayContentProps {
  visible?: MediaOverlayContentVisible;
  placement?: MediaOverlayContentPlacement;
}

export default class MediaOverlay extends React.PureComponent<PropsWithChildren<MediaOverlayProps>> {
  static Content: React.FC<PropsWithChildren<MediaOverlayContentProps>>;
  static DragHandle: React.FC;
}