# samjs-components

> ### installation ```sh yarn add samjs-components ```

Latest version **1.1.0** (published 2018-03-30) · MIT license · 0 weekly downloads

## Install

```sh
npm install samjs-components
pnpm add samjs-components
yarn add samjs-components
bun add samjs-components
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.0 |
| Published | 2018-03-30 |
| First published | 2018-03-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 66.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | sam_vh |

## Links

- npm: https://www.npmjs.com/package/samjs-components
- Repository: https://github.com/SamVanHoof/SamJS
- npm.io page: https://npm.io/package/samjs-components

## Recent versions

- 1.1.0 (latest) — 2018-03-30
- 1.0.13 — 2018-03-21
- 1.0.12 — 2018-03-21
- 1.0.11 — 2018-03-21
- 1.0.10 — 2018-03-16
- 1.0.9 — 2018-03-16
- 1.0.8 — 2018-03-16
- 1.0.7 — 2018-03-16
- 1.0.6 — 2018-03-16
- 1.0.4 — 2018-03-16
- 1.0.3 — 2018-03-16
- 1.0.2 — 2018-03-16
- 1.0.1 — 2018-03-16
- 1.0.0 — 2018-03-16

## README

# Sam.js - Seriously Awesome Modules

### installation
```sh
yarn add samjs-components
```

## Cookie Toaster - Makes tasty cookies for React.

### use
In your root component:
```js
import { CookieToaster } from 'samjs-components'
...
<CookieToaster />
...
```

To modify the css you can use the following structure:
```scss
.cookie-toaster { // or cookie-toaster-modal, cookie-toaster-top
   // topmost div
  .cookie-container {
    // inner content

    h1{
      // title css
    }

    p{
      // text css
    }

    a{
      // link css
    }

    button {
      // button css
    }
  }
}
```

### components
- CookieToaster
- CookieToasterTop
- CookieToasterModal

### props
- title: String, title (duh)
- text: String, content
- btnAcceptText: String, button label
- btnDeclineText: String, button label
- accept: function, callback to handle accept
- decline: function, callback to handle decline
- popped: Boolean, set this property in your localstorage to track if cookie has been shown for the user
- linkUrl: String, a url
- linkText: String, the text to display for the link
- type: 'top', 'bottom', or 'modal'

### localStorage
 - cookieHasPopped: cookie has been shown


## NetworkUtils (by Anton) - ALPHA - Handles your Fetch calls like a boss.

### use
In your root component:
```js
import { NetworkUtils } from 'samjs-components'
...
NetworkUtils.get(myRoute, myExtraHeaders).then(() => {
  //Do awesome stuff
});
...
```
### params
- route: API endpoint (e.g.: 'users/login')
- extraHeaders: an array of headers you want to include
- body: the body of your request

### methods
- get: route string, array of headers
- post: route string, body, array of headers
- put: route string, body, array of headers
- delete: route string

### session handling for OAuth
You should have your OAuth token available in localStorage with the key 'session'.
 ```js
...
localStorage.setItem('session', '<myToken>');
...
```

### define your API host
Set your API host in your env file as 'REACT_APP_API_HOST'.
This enables you to easily switch between environements without having to change any params for the NetworkUtils module.

---
_Source: https://npm.io/package/samjs-components · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._