# @casbah/strapi-react-auth

> React auth forms for Strapi 4

Latest version **0.0.1** (published 2022-07-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install @casbah/strapi-react-auth
pnpm add @casbah/strapi-react-auth
yarn add @casbah/strapi-react-auth
bun add @casbah/strapi-react-auth
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.1 |
| Published | 2022-07-21 |
| First published | 2022-07-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 53.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Exposure |
| Maintainers | alexey13, nadya.sytchova, francesco.lorenzetti, dmitry.exposure, exposure-digitaladmin |

## Links

- npm: https://www.npmjs.com/package/@casbah/strapi-react-auth
- npm.io page: https://npm.io/package/@casbah/strapi-react-auth

## Recent versions

- 0.0.1 (latest) — 2022-07-21

## README

# Strapi React Auth

Register, Login, Forgot, Reset forms connected to strapi backend.

## Install

```bash
npm i @casbah/strapi-react-auth
```

## Usage

```tsx
import React from 'react';
import ReactDOM from 'react-dom';
import { Link } from 'react-router-dom';
import Forms from '@casbah/strapi-react-auth';

ReactDOM.render(
  <React.StrictMode>
    <>
      <Forms.Login
        strapiUrl="http://localhost:1337"
        components={{ link: Link }}
      />
      <Forms.Register
        strapiUrl="http://localhost:1337"
        components={{ link: Link }}
      />
      <Forms.Forgot
        strapiUrl="http://localhost:1337"
        components={{ link: Link }}
      />
      <Forms.Reset
        strapiUrl="http://localhost:1337"
        components={{ link: Link }}
      />
    </>
  </React.StrictMode>,
  document.getElementById('root')
);
```

## Api

```ts
interface IRegisterProps {
  localization?: {
    passwordLabel?: string;
    passwordMinError?: string;
    emailLabel?: string;
    emailError?: string;
    buttonText?: string;
    successMessage?: string;
    requiredError?: string;
    loginLinkUrl?: string;
    loginLinkLabel?: string;
  };
  strapiUrl: string;
  components: {
    link: any;
  };
  onSubmit?: (user: IStrapiUser) => any;
}

interface ILoginProps {
  localization?: {
    passwordLabel?: string;
    passwordMinError?: string;
    emailLabel?: string;
    emailError?: string;
    buttonText?: string;
    successMessage?: string;
    requiredError?: string;
    forgotLinkUrl?: string;
    forgotLinkLabel?: string;
    registerLinkUrl?: string;
    registerLinkLabel?: string;
  };
  strapiUrl: string;
  components: {
    link: any;
  };
  onSubmit?: (user: IStrapiUser) => any;
}

interface IForgotProps {
  localization?: {
    emailLabel?: string;
    emailError?: string;
    buttonText?: string;
    successMessage?: string;
    requiredError?: string;
    loginLinkUrl?: string;
    loginLinkLabel?: string;
  };
  strapiUrl: string;
  components: {
    link: any;
  };
}

interface IResetProps {
  localization?: {
    passwordLabel?: string;
    passwordConfirmationLabel?: string;
    passwordMinError?: string;
    passwordMismatchError?: string;
    codeLabel?: string;
    codeError?: string;
    buttonText?: string;
    successMessage?: string;
    requiredError?: string;
    loginLinkUrl?: string;
    loginLinkLabel?: string;
  };
  strapiUrl: string;
  onSubmit?: () => any;
  components: {
    link: any;
  };
}
```

## Link component

Each form requires a router link component. Used by mui link component.

---
_Source: https://npm.io/package/@casbah/strapi-react-auth · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._