import { objectWithoutProperties as _objectWithoutProperties, taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
import { keyframes, jsx } from '@emotion/core';
import React__default from 'react';
import _pt from 'prop-types';
import colors from '../../theme/colors.esm.js';
import { DisableReachStyleCheck } from '../../utils/helpers/DisableReachStyleCheck.esm.js';
import { DialogOverlay } from '../../../node_modules/@reach/dialog/dist/dialog.esm.esm.js';
import { hexToRGBA } from '../../utils/helpers/hexToRgb.esm.js';

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n    0% {\n       background-color: transparent;\n     }\n   \n     100% {\n       background-color: ", ";\n     }\n   "]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

var buildFadeIn = function buildFadeIn(color) {
  return keyframes(_templateObject(), color);
};

var fadeMap = {
  info: buildFadeIn(hexToRGBA(colors.purple[50], 0.75)),
  success: buildFadeIn(hexToRGBA(colors.green[50], 0.75)),
  warn: buildFadeIn(hexToRGBA(colors.orange[50], 0.75)),
  error: buildFadeIn(hexToRGBA(colors.red[50], 0.75)),
  neutral: buildFadeIn(hexToRGBA(colors.grey[50], 0.75))
};

var overlayCss = function overlayCss(theme) {
  return {
    background: "hsla(0, 0%, 0%, 0.33)",
    position: "fixed",
    top: 0,
    right: 0,
    bottom: 0,
    left: 0,
    overflow: "auto",
    zIndex: theme.zIndices.modals
  };
};

var Modal = function Modal(_ref) {
  var _ref$type = _ref.type,
      type = _ref$type === void 0 ? "info" : _ref$type,
      initialFocusRef = _ref.initialFocusRef,
      isOpen = _ref.isOpen,
      onDismiss = _ref.onDismiss,
      children = _ref.children,
      props = _objectWithoutProperties(_ref, ["type", "initialFocusRef", "isOpen", "onDismiss", "children"]);

  return jsx(React__default.Fragment, null, jsx(DisableReachStyleCheck, {
    reachComponent: "dialog"
  }), jsx(DialogOverlay, {
    initialFocusRef: initialFocusRef,
    isOpen: isOpen,
    onDismiss: onDismiss,
    css: function css(theme) {
      return [overlayCss(theme), {
        animation: "".concat(fadeMap[type], " 0.5s ease forwards")
      }];
    }
  }, React__default.cloneElement(children, props)));
};
Modal.propTypes = {
  type: _pt.oneOf(["success", "info", "warn", "error", "neutral"])
};
Modal.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "Modal",
  "props": {
    "type": {
      "defaultValue": {
        "value": "\"info\"",
        "computed": false
      },
      "required": false
    }
  }
};

if (typeof STORYBOOK_REACT_CLASSES !== "undefined") {
  STORYBOOK_REACT_CLASSES["src/components/Modal/Modal.tsx"] = {
    name: "Modal",
    docgenInfo: Modal.__docgenInfo,
    path: "src/components/Modal/Modal.tsx"
  };
}

export { Modal };
//# sourceMappingURL=Modal.esm.js.map
