# @dac-software/react-loader

> This is react loader component. It can be applied to react projects. Library uses react, react hooks, typescript, css written in SASS preprocessor.

Latest version **1.0.0** (published 2020-06-24) · 0 weekly downloads

## Install

```sh
npm install @dac-software/react-loader
pnpm add @dac-software/react-loader
yarn add @dac-software/react-loader
bun add @dac-software/react-loader
```

## Health

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

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2020-06-24 |
| First published | 2019-08-26 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 13.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | dac-software |

## Links

- npm: https://www.npmjs.com/package/@dac-software/react-loader
- npm.io page: https://npm.io/package/@dac-software/react-loader

## Recent versions

- 1.0.0 (latest) — 2020-06-24
- 1.0.0-mvp — 2020-01-30
- 0.0.4 — 2019-08-30
- 0.0.3 — 2019-08-29
- 0.0.2 — 2019-08-27
- 0.0.1 — 2019-08-26

## README

# React Loader

This is react loader component. It can be applied to react projects.
Library uses react, react hooks, typescript, css written in SASS preprocessor.

Developing bundler is webpack.

Build production build made as simple tsc compilation with asset files copies provided

## Requirements

- nodejs v10 +
- npm v6.9.0 +

## Installation:

Installing dependencies
```bash
npm install
```

Build production library files
```bash
npm run build
```

##Development

Running dev server in standalone mode
```bash
npm run start
```

Running dev mode through bundler in other project.
Project should be linked by npm.

```bash
npm run build:dev
```
\* build dev emmits files into dist/esm/Loader

Running tests
```bash
npm run test
```

####Codestyle

We are in consonance with **standardjs**.

Validation codestyle:

```bash
npm run codestyle-check-typescript
```

Automatic fix:

```bash
npm run codestyle-typescript-fix
```

####CI (bitbucket pipelines)

Checks codestyles and run tests

##Compilation summary
| | ```npm start``` - (standalone dev) | ```npm run build:dev``` (imported as esm in higher bundler) | ```npm run build``` (production build)
|---|---|---|---|
|key dist files|none|dist/esm/Loader.js|dist/esm/Loader.js
|css extraction|no| dist/esm/Loader.css| dist/esm/Loader.css
|files extraction|no|no (copied)|no (copied)
##App configuration

React Loader **requires** four props: 
- loadingTimeout - type: number (set time to display error message in milliseconds)
- style - type: object (set loader's background and z-index)
    - backgroundImagePath - type: string (import image with e6 modules and pass result of import as path) 
    - zIndexValue - type: number (set CSS z-index property)
- loaderSwitcher - type: boolean (switch on/off component )
- errorMessage - type: string (text of error message)



Example :

```jsx

import Loader from '@dac-software/react-loader'
import bg from './Background/bg-image.jpg'

<Loader 
    loadingTimeout={5000}
    style={{backgroundImagePath: bg, zIndex: 999}}
     loaderSwitcher={true}
     errorMessage='error'
 />

```

## NPM publishing:

1) Optional update typings in Loader.d.ts file
2) Increase version in package.json
3) Npm login with proper username and password
    ```bash
    npm login
    ```
4) Npm publish (command will trigger prepare npm method which should build files to dist directory)
    ```bash
    npm publish --access=public
    ```

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