chakra-ui/dist/esm/AlertDialog/index.js

Responsive and accessible React UI components built with React and Emotion

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";

/** @jsx jsx */
import { jsx } from "@emotion/core";
import { ModalTransition } from "../Modal/components";
import { AlertDialogContent, AlertDialogOverlay } from "./components";

var AlertDialog = function AlertDialog(_ref) {
  var isOpen = _ref.isOpen,
      onClose = _ref.onClose,
      children = _ref.children,
      _ref$size = _ref.size,
      size = _ref$size === void 0 ? "md" : _ref$size,
      isCentered = _ref.isCentered,
      leastDestructiveRef = _ref.leastDestructiveRef,
      rest = _objectWithoutProperties(_ref, ["isOpen", "onClose", "children", "size", "isCentered", "leastDestructiveRef"]);

  var centeredProps = {
    display: "flex",
    alignItems: "center",
    justifyContent: "center"
  };
  return jsx(ModalTransition, {
    isOpen: isOpen
  }, function (styles) {
    return jsx(AlertDialogOverlay, _extends({
      leastDestructiveRef: leastDestructiveRef,
      css: _extends({
        opacity: styles.opacity
      }, isCentered && {
        display: "flex",
        alignItems: "center",
        justifyContent: "center"
      }),
      onDismiss: onClose
    }, isCentered && centeredProps), jsx(AlertDialogContent, _extends({
      maxWidth: size,
      rounded: "md",
      transform: "translate3d(0px, ".concat(styles.y, "px, 0px)")
    }, !isCentered && {
      top: 40,
      mx: "auto"
    }, rest), children));
  });
};

export default AlertDialog;
export * from "./components";