import React, { useCallback } from "react";

import classNames from "classnames";

import Popup from "@enact/sandstone/Popup";

import css from "./TFullPopup.module.less";

export default function TFullPopup({
  noAnimation = false,
  noAutoDismiss = false,
  onClose,
  onHide,
  open,
  position = "fullscreen",
  scrimType = "translucent",
  spotlightRestrict,
  spotlightId,
  className,
  children,
}) {
  const _onClose = useCallback(() => {
    if (onClose) {
      onClose();
    }
  }, [onClose]);

  const _onHide = useCallback(() => {
    if (onHide) {
      onHide();
    }
  }, [onHide]);

  return (
    <Popup
      spotlightId={spotlightId}
      noAnimation={noAnimation}
      noAutoDismiss={noAutoDismiss}
      onClose={_onClose}
      onHide={_onHide}
      open={open}
      position={position}
      scrimType={scrimType}
      spotlightRestrict={spotlightRestrict}
      className={classNames(css.tFullPopup, className && className)}
    >
      {children}
    </Popup>
  );
}
