lib/form/validated-form.js
/**
 * A utility wrapper over Reactstrap Input component thats uses react-hook-form data to
 * show error message and error/validated styles.
 * This component can be used with ValidatedForm
 *
 * @param ValidatedInputProps
 * @returns JSX.Element
 */
A utility wrapper over Reactstrap Input component thats uses react-hook-form data to
show error message and error/validated styles.
This component can be used with ValidatedForm


A utility wrapper over Reactstrap Input component thats uses react - hook - form data to show error message and error / validated styles . This component can be used with ValidatedForm
function ValidatedInput(_a) {
    var { name, id = name, register, error, isTouched, isDirty, validate, children, className, onChange, onBlur } = _a, attributes = (0, tslib_1.__rest)(_a, ["name", "id", "register", "error", "isTouched", "isDirty", "validate", "children", "className", "onChange", "onBlur"]);
    if (!register) {
        return (react_1.default.createElement(reactstrap_1.Input, Object.assign({ name: name, id: id, className: className, onChange: onChange, onBlur: onBlur }, attributes), children));
    }
    className = className || '';
    className = isTouched ? `${className} is-touched` : className;
    className = isDirty ? `${className} is-dirty` : className;
    const { name: registeredName, onBlur: onBlurValidate, onChange: onChangeValidate, ref } = register(name, validate);
    return (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(reactstrap_1.Input, Object.assign({ name: registeredName, id: id, valid: isTouched && !error, invalid: !!error, innerRef: ref, className: className, onChange: e => {
                void onChangeValidate(e);
                onChange && onChange(e);
            }, onBlur: e => {
                void onBlurValidate(e);
                onBlur && onBlur(e);
            } }, attributes), children),
        error && react_1.default.createElement(reactstrap_1.FormFeedback, null, error.message)));
}
function ValidatedInput ( _a ) { var { name , id = name , register , error , isTouched , isDirty , validate , children , className , onChange , onBlur } = _a , attributes = ( 0 , tslib_1 . __rest ) ( _a , [ "name" , "id" , "register" , "error" , "isTouched" , "isDirty" , "validate" , "children" , "className" , "onChange" , "onBlur" ] ) ; if ( ! register ) { return ( react_1 . default . createElement ( reactstrap_1 . Input , Object . assign ( { name : name , id : id , className : className , onChange : onChange , onBlur : onBlur } , attributes ) , children ) ) ; } className = className || '' ; className = isTouched ? ` ${ className } ` : className ; className = isDirty ? ` ${ className } ` : className ; const { name : registeredName , onBlur : onBlurValidate , onChange : onChangeValidate , ref } = register ( name , validate ) ; return ( react_1 . default . createElement ( react_1 . default . Fragment , null , react_1 . default . createElement ( reactstrap_1 . Input , Object . assign ( { name : registeredName , id : id , valid : isTouched && ! error , invalid : ! ! error , innerRef : ref , className : className , onChange : e => { void onChangeValidate ( e ) ; onChange && onChange ( e ) ; } , onBlur : e => { void onBlurValidate ( e ) ; onBlur && onBlur ( e ) ; } } , attributes ) , children ) , error && react_1 . default . createElement ( reactstrap_1 . FormFeedback , null , error . message ) ) ) ; }
A utility wrapper over Reactstrap Input component thats uses react-hook-form data to
 show error message and error/validated styles.
A utility wrapper over Reactstrap Input component thats uses react - hook - form data to show error message and error / validated styles .