@krowdy/kds-auth/esm/LoginSinglePage/PasswordNotify.js

React components that implement Google's Material Design.

import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import React from 'react';
import { Paper, makeStyles, IconButton, Button, Typography } from '@krowdy/kds-core';
import { Close as CloseIcon } from '@material-ui/icons';

var _ref2 = /*#__PURE__*/React.createElement(CloseIcon, {
  fontSize: "small"
});

var _ref3 = /*#__PURE__*/React.createElement(Typography, {
  variant: "body2"
}, "\xBFTe gustar\xEDa crear una contrase\xF1a para ingresar con esta cuenta?");

var PasswordNotify = function PasswordNotify(_ref) {
  var _ref$onCreate = _ref.onCreate,
      onCreate = _ref$onCreate === void 0 ? function () {} : _ref$onCreate,
      _ref$onClose = _ref.onClose,
      onClose = _ref$onClose === void 0 ? function () {} : _ref$onClose;
  var classes = useStyles();
  return /*#__PURE__*/React.createElement(Paper, {
    className: classes.paper,
    variant: "elevation"
  }, /*#__PURE__*/React.createElement(IconButton, {
    className: classes.closeButton,
    onClick: onClose,
    size: "small",
    variant: "outlined"
  }, _ref2), _ref3, /*#__PURE__*/React.createElement(Button, {
    className: classes.button,
    color: "primary",
    onClick: onCreate,
    variant: "contained"
  }, "Crear una contrase\xF1a"));
};

var useStyles = makeStyles(function (_ref4) {
  var _paper;

  var palette = _ref4.palette,
      spacing = _ref4.spacing,
      zIndex = _ref4.zIndex,
      breakpoints = _ref4.breakpoints;
  return {
    button: {
      marginTop: spacing(1.25)
    },
    closeButton: {
      position: 'absolute',
      right: 5,
      top: 5
    },
    paper: (_paper = {}, _defineProperty(_paper, breakpoints.up('md'), {
      maxWidth: 324,
      right: 54,
      top: 90
    }), _defineProperty(_paper, "background", palette.common.white), _defineProperty(_paper, "maxWidth", 324), _defineProperty(_paper, "padding", spacing(1.5, 2)), _defineProperty(_paper, "position", 'fixed'), _defineProperty(_paper, "right", 16), _defineProperty(_paper, "top", 32), _defineProperty(_paper, "zIndex", zIndex.modal + 10), _paper)
  };
}, {
  name: 'PasswordNotify'
});
export default React.memo(PasswordNotify);