@makeen.io/material-ui-kit/distr/molecules/ConfirmationDialog/ConfirmationDialog.js

Makeen UI components kit. Based on material-ui.

import _extends from "@babel/runtime/helpers/extends";import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";function _templateObject5() {var data = _taggedTemplateLiteral(["\n  padding: 24px 16px;\n  font-size: 15px;\n  line-height: 20px;\n  color: ", ";\n"]);_templateObject5 = function _templateObject5() {return data;};return data;}function _templateObject4() {var data = _taggedTemplateLiteral(["\n  margin: 0;\n  padding: 0;\n  // color: ", ";\n  color: #c5cee0;\n"]);_templateObject4 = function _templateObject4() {return data;};return data;}function _templateObject3() {var data = _taggedTemplateLiteral(["\n  font-size: 18px;\n  font-weight: bold;\n"]);_templateObject3 = function _templateObject3() {return data;};return data;}function _templateObject2() {var data = _taggedTemplateLiteral(["\n  display: flex;\n  padding: ", "px;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: flex-start;\n"]);_templateObject2 = function _templateObject2() {return data;};return data;}function _templateObject() {var data = _taggedTemplateLiteral(["\n  padding: 8px 24px;\n"]);_templateObject = function _templateObject() {return data;};return data;}import React from "react";
import { Dialog, DialogContent, DialogTitle, IconButton, Typography } from "@material-ui/core";
import DialogActions from "@material-ui/core/DialogActions";
import { Close as CloseIcon } from "@material-ui/icons";
import { Button } from "../../atoms";
import styled from "styled-components";
var DialogActionsWrapper = styled(DialogActions)(_templateObject());


var StyledDialogTitle = styled(DialogTitle)(_templateObject2(),

function (_ref) {var theme = _ref.theme;return theme.spacing(2);});




var StyledDialogTitleTypography = styled(Typography)(_templateObject3());



var StyledDialogTitleCloseButton = styled(IconButton)(_templateObject4(),


function (_ref2) {var theme = _ref2.theme;return theme.palette.grey[500];});


var StyledDialogContent = styled(DialogContent)(_templateObject5(),



function (_ref3) {var theme = _ref3.theme;return theme.palette.text.secondary;});

var CancelButton = function CancelButton(_ref4) {var cancelText = _ref4.cancelText,palette = _ref4.palette,onCancel = _ref4.onCancel,buttonTheme = _ref4.buttonTheme;return /*#__PURE__*/React.createElement(Button, { size: "medium", palette: palette, buttonTheme: buttonTheme, onClick: onCancel }, cancelText);};
var ConfirmButton = function ConfirmButton(_ref5) {var confirmText = _ref5.confirmText,palette = _ref5.palette,onConfirm = _ref5.onConfirm,buttonTheme = _ref5.buttonTheme;return /*#__PURE__*/React.createElement(Button, { size: "medium", palette: palette, buttonTheme: buttonTheme, onClick: onConfirm }, confirmText);};
var ConfirmationDialog = function ConfirmationDialog(_ref6) {var title = _ref6.title,confirmText = _ref6.confirmText,confirmColor = _ref6.confirmColor,cancelText = _ref6.cancelText,children = _ref6.children,onCancel = _ref6.onCancel,onConfirm = _ref6.onConfirm,onClose = _ref6.onClose,otherProps = _objectWithoutProperties(_ref6, ["title", "confirmText", "confirmColor", "cancelText", "children", "onCancel", "onConfirm", "onClose"]);return /*#__PURE__*/React.createElement(Dialog, _extends({ maxWidth: "sm", fullWidth: true, onClose: onClose }, otherProps), /*#__PURE__*/
  React.createElement(StyledDialogTitle, { disableTypography: true }, /*#__PURE__*/
  React.createElement(StyledDialogTitleTypography, { variant: "h6" }, title), /*#__PURE__*/
  React.createElement(StyledDialogTitleCloseButton, { "aria-label": "close", onClick: function onClick(e) {return onClose && onClose(e, "backdropClick");} }, /*#__PURE__*/
  React.createElement(CloseIcon, null))), /*#__PURE__*/
  React.createElement(StyledDialogContent, { dividers: true }, children), /*#__PURE__*/
  React.createElement(DialogActionsWrapper, null, /*#__PURE__*/
  React.createElement(CancelButton, { cancelText: cancelText, palette: "control", buttonTheme: "outline", onCancel: onCancel }), /*#__PURE__*/
  React.createElement(ConfirmButton, { confirmText: confirmText, palette: confirmColor || "danger", buttonTheme: "light", onConfirm: onConfirm })));};
export default ConfirmationDialog;
//# sourceMappingURL=ConfirmationDialog.js.map