// @flow
/*
  DOCUMENTATION: https://orbit.kiwi/components/modal/
*/
import * as React from "react";

import type { Globals } from "../common/common.js.flow";
import typeof ModalSectionType from "./ModalSection";
import typeof ModalHeaderType from "./ModalHeader";
import typeof ModalFooterType from "./ModalFooter";

export type State = {|
  scrolled: boolean,
  loaded: boolean,
  fixedClose: boolean,
  fullyScrolled: boolean,
  modalWidth: number,
  footerHeight: number,
  hasModalSection: boolean,
|};

type Size = "extraSmall" | "small" | "normal" | "large" | "extraLarge";

export type onClose = (
  ev: SyntheticKeyboardEvent<HTMLDivElement> | SyntheticEvent<HTMLButtonElement> | MouseEvent,
) => void | Promise<any>;

export type Props = {|
  +size?: Size,
  +children: React.Node,
  +autoFocus?: boolean,
  +lockScrolling?: boolean,
  +scrollingElementRef?:
    | ((instance: HTMLElement | null) => void)
    | {| current: HTMLElement | null |},
  +onClose?: onClose,
  +fixedFooter?: boolean,
  +isMobileFullPage?: boolean,
  +preventOverlayClose?: boolean,
  +hasCloseButton?: boolean,
  +mobileHeader?: boolean,
  +disableAnimation?: boolean,
  ...Globals,
|};

export type Instance = {|
  getScrollPosition: () => number | null,
  setScrollPosition: (value: number) => void,
  modalBody: {| current: HTMLElement | null |},
  modalContent: {| current: HTMLElement | null |},
|};

declare export default React.AbstractComponent<Props, Instance>;

declare export var ModalHeader: ModalHeaderType;
declare export var ModalSection: ModalSectionType;
declare export var ModalFooter: ModalFooterType;