# reselect-computed

> Declaratively created computed properties for Redux and Reselect.

Latest version **0.1.2** (published 2018-06-12) · MIT license · 0 weekly downloads

## Install

```sh
npm install reselect-computed
pnpm add reselect-computed
yarn add reselect-computed
bun add reselect-computed
```

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.2 |
| Published | 2018-06-12 |
| First published | 2018-02-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 124.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Vanilla IceCream |
| Maintainers | shyam-chen |
| Keywords | Redux, Reselect |

## Links

- npm: https://www.npmjs.com/package/reselect-computed
- Repository: https://github.com/Vanilla-IceCream/reselect-computed
- Homepage: https://github.com/Vanilla-IceCream/reselect-computed#readme
- Issues: https://github.com/Vanilla-IceCream/reselect-computed/issues
- npm.io page: https://npm.io/package/reselect-computed

## Dependencies (1)

- [reselect](https://npm.io/package/reselect.md) ^3.0.1

## Recent versions

- 0.1.2 (latest) — 2018-06-12
- 0.1.1 — 2018-06-12
- 0.1.0 — 2018-02-18

## README

# reselect-computed [![Build Status](https://travis-ci.org/Vanilla-IceCream/reselect-computed.svg?branch=master)](https://travis-ci.org/Vanilla-IceCream/reselect-computed) [![Coverage Status](https://coveralls.io/repos/github/Vanilla-IceCream/reselect-computed/badge.svg?branch=master)](https://coveralls.io/github/Vanilla-IceCream/reselect-computed?branch=master)

Declaratively created computed properties for Redux and Reselect.

## Installation and Usage

### CJS or ESM

```bash
$ npm i reselect-computed -S
# or
$ yarn add reselect-computed
```

```js
// commonjs
const { bindSelectCreators } = require('reselect-computed');

// es modules
import { bindSelectCreators } from 'reselect-computed';
```

## Getting Started

```js
// types.js

// @flow

export interface ICounter {
  value: number;
}

export interface Props {
  counter: ICounter;
  actions?: Object;
  selectors?: Object;
}
```

```js
// constants.js

// @flow

import { ICounter } from './types';

export const INITIAL: ICounter = {
  value: 0,
};
```

```js
// selectors.js

// @flow

import { createSelector } from 'reselect';

import { ICounter } from './types';

export const evenOrOdd = createSelector(
  (counter: ICounter): ICounter => counter,
  ({ value }: ICounter): string => (value % 2 === 0 ? 'even' : 'odd'),
);
```

```js
// Counter.js

// @flow

import React from 'react';
import { bindActionCreators } from 'redux';
import { bindSelectCreators } from 'reselect-computed';
import { connect } from 'react-redux';
import { compose, lifecycle } from 'recompose';

import { Props } from './types';
import * as actions from './actions';
import * as selectors from './selectors';

export const Counter = ({ counter, actions, selectors }: Props): React.Element<Props> => (
  <div>
    <div className="typography">
      <button onClick={actions.increment}>Increment</button>
      <p>Clicked: {counter.value} times, value is {selectors.evenOrOdd}.</p>
    </div>

    <style jsx>{`
      .typography {
        padding: 0.25rem 0;
      }
    `}</style>
  </div>
);

export const mapStateToProps = ({ counter }) => ({
  counter,
  selectors: bindSelectCreators(selectors, counter),
});

export const mapDispatchToProps = dispatch => ({
  actions: bindActionCreators(actions, dispatch),
});

export default compose(
  connect(mapStateToProps, mapDispatchToProps),
  lifecycle({
    componentDidMount() {
      console.log('Counter is ready.');
    },
  }),
)(Counter);
```

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