@coko/client
Version:
Client side common code for coko apps
88 lines (87 loc) • 4.62 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _toolkit = require("../../toolkit");
var _common = require("../common");
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
var Wrapper = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
var SubmitButton = (0, _styledComponents["default"])(_common.Button)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 100%;\n"])));
var Footer = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: ", ";\n margin-top: ", ";\n"])), function (props) {
return props.showForgotPassword ? 'space-between' : 'flex-end';
}, (0, _toolkit.grid)(4));
var ForgotPassword = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n > a {\n color: ", ";\n }\n"])), function (props) {
return props.theme.colorText;
});
var AlternativeAction = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n font-weight: bold;\n\n > a {\n color: ", ";\n }\n"])), function (props) {
return props.theme.colorText;
});
var AuthenticationForm = function AuthenticationForm(props) {
var alternativeActionLabel = props.alternativeActionLabel,
alternativeActionLink = props.alternativeActionLink,
className = props.className,
children = props.children,
errorMessage = props.errorMessage,
forgotPasswordUrl = props.forgotPasswordUrl,
hasError = props.hasError,
loading = props.loading,
onSubmit = props.onSubmit,
showForgotPassword = props.showForgotPassword,
submitButtonLabel = props.submitButtonLabel;
return /*#__PURE__*/_react["default"].createElement(Wrapper, {
className: className
}, /*#__PURE__*/_react["default"].createElement(_common.Form, {
layout: "vertical",
onFinish: onSubmit,
ribbonMessage: errorMessage,
submissionStatus: hasError ? 'error' : null
}, children, /*#__PURE__*/_react["default"].createElement(SubmitButton, {
htmlType: "submit",
loading: loading,
type: "primary"
}, submitButtonLabel)), !!alternativeActionLabel && /*#__PURE__*/_react["default"].createElement(Footer, {
showForgotPassword: showForgotPassword
}, showForgotPassword && /*#__PURE__*/_react["default"].createElement(ForgotPassword, null, /*#__PURE__*/_react["default"].createElement(_common.CokoLink, {
to: forgotPasswordUrl
}, "Forgot your password?")), /*#__PURE__*/_react["default"].createElement(AlternativeAction, null, /*#__PURE__*/_react["default"].createElement(_common.CokoLink, {
to: alternativeActionLink
}, alternativeActionLabel))));
};
AuthenticationForm.propTypes = {
/** Function to run on form submit */
onSubmit: _propTypes["default"].func.isRequired,
/** Text displayed at bottom right */
alternativeActionLabel: _propTypes["default"].string,
/** Link to redirect to when clicking on alternative action */
alternativeActionLink: _propTypes["default"].string,
/** Error message to display when `hasError` is true */
errorMessage: _propTypes["default"].string,
/** Link to redirect to when clicking on "forgot password" */
forgotPasswordUrl: _propTypes["default"].string,
/** Controls whether there is an incoming error from __outside__ the form. (eg. from a failed server response) */
hasError: _propTypes["default"].bool,
/** Control waiting for response status */
loading: _propTypes["default"].bool,
/** Show / hide "forgot password" */
showForgotPassword: _propTypes["default"].bool,
/** Text displayed inside submit button */
submitButtonLabel: _propTypes["default"].string
};
AuthenticationForm.defaultProps = {
alternativeActionLabel: null,
alternativeActionLink: null,
errorMessage: null,
forgotPasswordUrl: '/request-password-reset',
hasError: false,
loading: false,
showForgotPassword: false,
submitButtonLabel: 'Submit'
};
var _default = AuthenticationForm;
exports["default"] = _default;