@tomino/dynamic-form-semantic-ui/dist/mjs/semantic/signature/signature_reject.js

Semantic UI form renderer based on dynamic form generation

import * as React from 'react';
import { css } from '../../common';
import { Modal, Header, Button, Icon, Input, Label, Message } from 'semantic-ui-react';
import { setValue, valueSource } from '../../helpers';
const margined = css `
  margin-top: 12px;
`;
const centered = css `
  text-align: center;
`;
const errorLabel = css `
  margin-left: 12px !important;
`;
export const 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(Modal, { open: rejectModalOpen, trigger: React.createElement(Button, { icon: "ban", content: "Reject", labelPosition: "left", onClick: () => handlers.validateForm(null) && setRejectModalOpen(true), color: "red", floated: allowComment ? 'right' : null }), size: "small" },
        React.createElement(Header, { icon: "ban", content: "Reject Signature" }),
        React.createElement(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(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(Input, { className: margined, type: "password", icon: "lock", autoComplete: "password", value: password, onChange: e => setPassword(e.currentTarget.value) }),
                    error && React.createElement(Label, { color: "red", content: error, className: errorLabel })))),
        React.createElement(Modal.Actions, null,
            !loading && (React.createElement(Button, { onClick: () => setRejectModalOpen(false), loading: loading },
                React.createElement(Icon, { name: "remove" }),
                " Cancel")),
            React.createElement(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: valueSource(formElement),
                                reject: true,
                                password,
                                reason,
                                submit: formElement.props && !!formElement.props.submit
                            }
                        }));
                        setValue(props, context, rejection);
                    }
                    else {
                        setError('Please provide password');
                    }
                } },
                React.createElement(Icon, { name: "ban" }),
                ' ',
                formElement.props && formElement.props.submit ? 'Reject and Submit' : 'Reject'))));
};
SignatureReject.displayName = 'RejectSignature';
//# sourceMappingURL=signature_reject.js.map