@tomino/dynamic-form-semantic-ui
Version:
Semantic UI form renderer based on dynamic form generation
75 lines • 4.5 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const common_1 = require("../../common");
const semantic_ui_react_1 = require("semantic-ui-react");
const helpers_1 = require("../../helpers");
const margined = common_1.css `
margin-top: 12px;
`;
const centered = common_1.css `
text-align: center;
`;
const errorLabel = common_1.css `
margin-left: 12px !important;
`;
exports.SignatureReject = props => {
const { allowComment, handlers, formElement, owner, reason } = props;
const [password, setPassword] = React.useState('');
const [error, setError] = React.useState('');
const [rejectModalOpen, setRejectModalOpen] = React.useState(false);
const [loading, setLoading] = React.useState(false);
return (React.createElement(semantic_ui_react_1.Modal, { open: rejectModalOpen, trigger: React.createElement(semantic_ui_react_1.Button, { icon: "ban", content: "Reject", labelPosition: "left", onClick: () => handlers.validateForm(null) && setRejectModalOpen(true), color: "red", floated: allowComment ? 'right' : null }), size: "small" },
React.createElement(semantic_ui_react_1.Header, { icon: "ban", content: "Reject Signature" }),
React.createElement(semantic_ui_react_1.Modal.Content, null,
React.createElement("div", null,
React.createElement("p", null, formElement.props.submit
? `Do you wish to reject this form? Upon rejecting, you will no longer be able to
make any changes, the form will be automatically submitted and process will
advance to a next state.`
: `Do you wish to reject this form? Upon rejecting, you will no longer be able to
make any changes. To make further changes to the form, you will need to withdraw your rejection.`),
reason && (React.createElement(semantic_ui_react_1.Message, { icon: "comment outline", header: "You left a comment", content: reason })),
React.createElement("form", { className: centered },
React.createElement("label", { htmlFor: "password" },
React.createElement("b", null, "Please provide your password to reject this form:")),
' ',
React.createElement("br", null),
React.createElement(semantic_ui_react_1.Input, { className: margined, type: "password", icon: "lock", autoComplete: "password", value: password, onChange: e => setPassword(e.currentTarget.value) }),
error && React.createElement(semantic_ui_react_1.Label, { color: "red", content: error, className: errorLabel })))),
React.createElement(semantic_ui_react_1.Modal.Actions, null,
!loading && (React.createElement(semantic_ui_react_1.Button, { onClick: () => setRejectModalOpen(false), loading: loading },
React.createElement(semantic_ui_react_1.Icon, { name: "remove" }),
" Cancel")),
React.createElement(semantic_ui_react_1.Button, { color: "red", loading: loading, onClick: async () => {
if (loading) {
return;
}
if (password) {
setLoading(true);
setError('');
const rejection = (await handlers.sign({
owner,
props,
context,
args: {
source: helpers_1.valueSource(formElement),
reject: true,
password,
reason,
submit: formElement.props && !!formElement.props.submit
}
}));
helpers_1.setValue(props, context, rejection);
}
else {
setError('Please provide password');
}
} },
React.createElement(semantic_ui_react_1.Icon, { name: "ban" }),
' ',
formElement.props && formElement.props.submit ? 'Reject and Submit' : 'Reject'))));
};
exports.SignatureReject.displayName = 'RejectSignature';
//# sourceMappingURL=signature_reject.js.map