@axa-fr/react-toolkit-loader

Default

Installation

npm i @axa-fr/react-toolkit-loader

Import

import Loader from '@axa-fr/react-toolkit-loader';
import '@axa-fr/react-toolkit-loader/dist/af-spinner.css';

Use

The text attribute is optionnal. If you pass it to the component it will be displayed under the loader. If not, the message will be calculated based on the mode you're using.

mode	Associated message
get	Chargement en cours
post	Sauvegarde en cours
delete	Suppression en cours
update	Mise à jour en cours
error	Une erreur est survenue lors du chargement du composant

<Loader mode="get" text="Chargement en cours">
  <div>
    <h1>Title Child</h1>
    <span>Here your child component</span>
  </div>
</Loader>
...
<Loader mode="update">
  <div>
    <h1>Title Child</h1>
    <span>Here your child component</span>
  </div>
</Loader>