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

React components that implement Google's Material Design.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _react = _interopRequireDefault(require("react"));

var _kdsCore = require("@krowdy/kds-core");

var _icons = require("@material-ui/icons");

var _ref2 = /*#__PURE__*/_react["default"].createElement(_icons.Close, {
  fontSize: "small"
});

var _ref3 = /*#__PURE__*/_react["default"].createElement(_kdsCore.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["default"].createElement(_kdsCore.Paper, {
    className: classes.paper,
    variant: "elevation"
  }, /*#__PURE__*/_react["default"].createElement(_kdsCore.IconButton, {
    className: classes.closeButton,
    onClick: onClose,
    size: "small",
    variant: "outlined"
  }, _ref2), _ref3, /*#__PURE__*/_react["default"].createElement(_kdsCore.Button, {
    className: classes.button,
    color: "primary",
    onClick: onCreate,
    variant: "contained"
  }, "Crear una contrase\xF1a"));
};

var useStyles = (0, _kdsCore.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 = {}, (0, _defineProperty2["default"])(_paper, breakpoints.up('md'), {
      maxWidth: 324,
      right: 54,
      top: 90
    }), (0, _defineProperty2["default"])(_paper, "background", palette.common.white), (0, _defineProperty2["default"])(_paper, "maxWidth", 324), (0, _defineProperty2["default"])(_paper, "padding", spacing(1.5, 2)), (0, _defineProperty2["default"])(_paper, "position", 'fixed'), (0, _defineProperty2["default"])(_paper, "right", 16), (0, _defineProperty2["default"])(_paper, "top", 32), (0, _defineProperty2["default"])(_paper, "zIndex", zIndex.modal + 10), _paper)
  };
}, {
  name: 'PasswordNotify'
});

var _default = _react["default"].memo(PasswordNotify);

exports["default"] = _default;