@scripty/react-modules

Description

lightweight react login component.

Usage

npm install -s @scripty/react-modules

Client: Example.jsx

import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import { Login } from '@scripty/react-modules';

export const Example = () => {

    const onLoginSubmit = (data) => {
        const { username, password } = data;
        console.log(username, password);
    }

    const onRegisterSubmit = (data) => {
        const { username, password } = data;
        console.log(username, password);
    }

    const onForgotUsernameSubmit = (username) => {
        console.log(username);
    }

    const onForgotPasswordSubmit = (password) => {
        console.log(password);
    }

    return (
        <Router>
            <h2>Login</h2>
            <Login
                width={350}
                onLoginSubmit={onLoginSubmit}
                onRegisterSubmit={onRegisterSubmit}
                onForgotUsernameSubmit={onForgotUsernameSubmit}
                onForgotPasswordSubmit={onForgotPasswordSubmit}
                loginPath={'/login'}
                registerPath={'/register'}
            />
        </Router>
    );
};

Components

Name	Features
Login	Reset password, forgot password, forgot username
Registration

Login Properties

Property	Type	Default / Description
title (optional)	String	Login
width (optional)	number	100%
onLoginSubmit (required)	Function
onRegisterSubmit (optional)	Function
onForgotUsernameSubmit (optional)	Function
onForgotPasswordSubmit (optional)	Function
onPasswordReset (optional)	Function	url params :userId and :token needed. returns token, userId and new password
loginPath (optional)	String	/login
registerPath (optional)	String	/register

Registration Properties

Property	Type	Default
registerPath (optional)	String	/register
title (optional)	String	Register
onRegisterSubmit (required)	Function
children (optional)	React Children