ianstormtaylor / react-values

A set of tiny React components for handling state with render props.
https://git.io/react-values
MIT License
1.02k stars 39 forks source link

Add connected values #32

Closed ianstormtaylor closed 5 years ago

ianstormtaylor commented 5 years ago

This adds the ability to create "connected" values, by using the create{Type}Value factories instead of the <{Type}Value> components directly. The factories return a connected version of each of the components, that is synced across any place it is rendered in the React tree.

This will render a self-contained value:

import { NumberValue } from 'react-values'

<NumberValue defaultValue={42}>
  {({ value, increment, decrement }) => (
    ...
  )}
</NumberValue>

Whereas, this will create and render a connected number value, which is synced across any place it is rendered in the tree.

import { createNumberValue } from 'react-values'

const ConnectedNumberValue = createNumberValue(42)

<ConnectedNumberValue>
  {({ value, increment, decrement }) => (
    ...
  )}
</ConnectedNumberValue>

Fixes #30 Fixes #31