# @artezio/observable-react

> Heigh-ordered-component was designed to work together with @artezio/observable. Read about @artezio/observable here [README](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/observable/README.md).

Latest version **1.0.8** (published 2019-12-24) · MIT license · 0 weekly downloads

## Install

```sh
npm install @artezio/observable-react
pnpm add @artezio/observable-react
yarn add @artezio/observable-react
bun add @artezio/observable-react
```

## 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.0.8 |
| Published | 2019-12-24 |
| First published | 2019-12-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 11.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 9 |
| Maintainers | daniil_yakovenko, kluiko |

## Links

- npm: https://www.npmjs.com/package/@artezio/observable-react
- Repository: https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/observable-react
- npm.io page: https://npm.io/package/@artezio/observable-react

## Dependencies (1)

- [hoist-non-react-statics](https://npm.io/package/hoist-non-react-statics.md) ^3.3.0

## Recent versions

- 1.0.8 (latest) — 2019-12-24
- 1.0.7 — 2019-12-23
- 1.0.4 — 2019-12-23
- 1.0.3 — 2019-12-20
- 1.0.2 — 2019-12-20
- 1.0.1 — 2019-12-18

## README

# **@artezio/observable-react**

Heigh-ordered-component was designed to work together with @artezio/observable. Read about @artezio/observable here [README](https://github.com/Artezio/SURVEYBUILDER/tree/master/packages/observable/README.md).

This HOC subscribes on every observable model that is passed to the component and puts it to the state. Observable models are substituted by models from the state, other props are passed through the HOC without changes. When models changed HOC does setState and pass new objects to the component and it will cause rerender.

# Installation
Using npm:
>$ npm install @artezio/observable-react

Using yarn:
>$ yarn add @artezio/observable-react

Library has peer dependency which you should know about. Install it with following command: 

>$ npm install @artezio/observable

# Using example

```TSX
import { useObservableModel } from '@artezio/observable-react';

class MyComponent {
    render() {
        const { model } = this.props;
        return <div>Hello, my name is {model.name}</div>
    }
}

export default useObservableModel(MyComponent);
```

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