// @flow
import type { Node } from 'react';
import type { PopperArrowProps } from 'react-popper';

export type PopperPlacement =
  | 'auto-start'
  | 'auto'
  | 'auto-end'
  | 'top-start'
  | 'top'
  | 'top-end'
  | 'right-start'
  | 'right'
  | 'right-end'
  | 'bottom-end'
  | 'bottom'
  | 'bottom-start'
  | 'left-end'
  | 'left'
  | 'left-start';

export type ReferenceProps = {|
  'aria-describedby': string,
|};

type ReferenceArgs = {|
  ref: (?mixed) => void,
  referenceProps: ReferenceProps,
|};

type ChildrenArgs = {|
  ref: (?HTMLElement) => void,
  style: $Shape<CSSStyleDeclaration>,
  placement: PopperPlacement,
  arrowProps: PopperArrowProps,
  popperId: string,
|};

export type PopperProps = {|
  reference: (ReferenceArgs) => Node,
  placement: PopperPlacement,
  children: (ChildrenArgs) => Node,
  isVisible?: boolean,
|};
