# troublete-elements-redux

> Redux behavior binding for polymer elements.

Latest version **1.0.0** (published 2017-05-14) · GPL-2.0 license · 0 weekly downloads

## Install

```sh
npm install troublete-elements-redux
pnpm add troublete-elements-redux
yarn add troublete-elements-redux
bun add troublete-elements-redux
```

## 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.0 |
| Published | 2017-05-14 |
| First published | 2017-05-14 |
| Weekly downloads | 0 |
| License | GPL-2.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Willi Eßer |
| Maintainers | troublete |
| Keywords | Polymer, webcomponent, behavior, redux, troublete, troublete-elements |

## Links

- npm: https://www.npmjs.com/package/troublete-elements-redux
- Repository: https://github.com/troublete/troublete-elements-redux
- Homepage: https://github.com/troublete/troublete-elements-redux#readme
- Issues: https://github.com/troublete/troublete-elements-redux/issues
- npm.io page: https://npm.io/package/troublete-elements-redux

## Dependencies (2)

- [redux](https://npm.io/package/redux.md) ~3.6
- [@polymer/polymer](https://npm.io/package/@polymer/polymer.md) ~1.2.5-npm-test.2

## Recent versions

- 1.0.0 (latest) — 2017-05-14

## README

# Troublete Elements: Redux

A small redux behavior binding for Polymer, optimized for observing and propgating simple property changes.
It is created for small applications that don't have a complex or multi-dimmensional state.

## Install

```
$ npm i -S troublete-elements-redux
```

## Setup

The polymer behavior factory is located in the `te-redux.html` file. Since the purpose of the behavior is to be as modular as possible, it is necessary to setup
a little structure to be able to really use the binding. 

First and formost it is necessary to create a wrapper integration (like shown in the example file `te-redux-integation-demo.html`). The integration MUST contain
a redux reducer specification, a redux store creation & the factory call of the behavior to be used later in components.

After the setup of the frame integration, simple add an `html-import` to your component as shown in the example file `te-redux-demo.html`.

After that you'll be able, so easy listen to state changes or propagate them.

## API

Since the behavior uses the polymer event backbone to handle state changes here explained how you can `listen` and `dispatch` state changes.

### listen

Listening itself is pretty straight forward, it is possible to add a listener to the `listeners` property of your polymer component. 
For a specific property change in the form of `state-change:[PROPERTY_NAME]`, e.g. for a property with the key `name` the event name would be `state-change:name`.

### dispatch

Also the dispatching is pretty simple, the behavior comes with a handy method called `publish`.

* *publish([PROPERTY_NAME], [NEW_PROPERTY_VALUE])*
    - PROPERTY_NAME (String)
    - PROPERTY_VALUE (object)

Calling the method in a function will cause a state change and set the new property value. 
(!) It isn't possible to set a "new" property, which isn't registered in the state. The behavior will in this case throw an error.

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