Skip to content
This repository has been archived by the owner on Sep 10, 2022. It is now read-only.

Releases: acdlite/recompose

Observable utilities

16 Jun 05:54
Compare
Choose a tag to compare

The main feature in this release is the addition of a suite of observable utilities, including mapPropsStream and componentFromStream. These are ported over from rx-recompose, which is now deprecated. Unlike rx-recompose, these utilities are compatible with any observable or stream-like library.

#196

Other changes

Return of lifecycle()

16 May 23:38
Compare
Choose a tag to compare

lifecycle() has returned. It now has essentially the same API as React.createClass(), except you don't specify a render method, and it returns a higher-order component rather than a component. See API docs here: https://github.com/acdlite/recompose/blob/master/docs/API.md#lifecycle

Loose mode has also been enabled when compiling the library for npm. This fixes some issues with older versions of IE.

rx-recompose: Bugfix for multiple observers

15 May 07:12
Compare
Choose a tag to compare

Fixes a bug in createComponent (and therefore mapPropsStream, too) where only the most recent observer receives prop updates. Thanks @gregmuellegger for diagnosing the issue. #158

v0.18.0

10 May 21:54
Compare
Choose a tag to compare

mapPropsOnChange -> withPropsOnChange

This helper was renamed to better describe how it works.

Prune API

Some helpers were removed. These may be added back, in some form, in a future version. Until then, you can use the lifecycle methods of a React class.

  • doOnReceiveProps
  • lifecycle

UMD bundle

A UMD bundle is now built via Webpack on each npm release. It can be accessed via npmcdn: https://npmcdn.com/[email protected]/build/Recompose.min.js

There's also a base JSFiddle that's handy for playing with the different helpers: https://jsfiddle.net/acdlite/69z2wepo/41596/

rx-recompose: Improved API

27 Apr 23:51
Compare
Choose a tag to compare
  • New module: createComponent maps a stream of owner props to a stream of React nodes.
  • observeProps is now called mapPropsStream
  • observeProps used to allow you to return an object of streams, which it would convert into a stream of objects. This form caused too much confusion, in my experience, so it's been removed in favor of explicit calls to combineLatest.
  • createEventHandler now returns an object with stream and handler, where the handler pushes new values onto the stream. Previously, it returns a function that was both a handler and a stream. This new form is akin to mailboxes in Elm.

Refer to the README for full info.

Remove currying and add withHandlers helper

11 Apr 18:07
Compare
Choose a tag to compare

Remove currying

Currying wasn't really buying us much, and it was adding an extra layer of confusion for people new to the library. Helpers are now functions that return higher-order components

const EnhancedComponent = helper(a, b, c)(BaseComponent)

which means they retain their composability.

The following form will no longer work:

// No longer works!
const EnhancedComponent = helper(a, b, c, BaseComponent)

To aid in the transition, helpers will print a warning to the console if you call them with too many arguments.

withHandlers

withHandlers(
  handlerCreators: {
    [handlerName: string]: (props: Object) => Function
  }
): HigherOrderComponent

Takes an object map of handler creators. These are higher-order functions that accept a set of props and return a function handler:

This allows the handler to access the current props via closure, without needing to change its signature.

Handlers are passed to the base component as immutable props, whose identities are preserved across renders. This avoids a common pitfall where functional components create handlers inside the body of the function, which results in a new handler on every render and breaks downstream shouldComponentUpdate() optimizations that rely on prop equality.

Usage example:

const enhanceForm = compose(
  withState('value', 'updateValue', ''),
  withHandlers({
    onChange: props => event => {
      props.updateValue(event.target.value)
    },
    onSubmit: props => event => {
      event.preventDefault()
      submitForm(props.value)
    }
  })
)

const Form = enhanceForm(
  ({ value, onChange, onSubmit }) =>
    <form onSubmit={onSubmit}>
      <label>Value
        <input type="text" value={value} onChange={onChange} />
      </label>
    </form>
)

This replaces withAttachedProps, which has been removed.

React 15 compatibility

08 Apr 17:36
Compare
Choose a tag to compare

Yay! Thanks @billyjanitsch for the speedy PR.

Upgrade to lodash 4

04 Feb 19:53
Compare
Choose a tag to compare

Upgrades Recompose's lodash dependency to v4.

Thanks @chrisui for the PR!

v0.13.0

18 Dec 02:50
Compare
Choose a tag to compare

withAttachedProps()

(actually added in 0.12, forgot to update release notes)

withAttachedProps(
  createChildProps: (getProps: () => Object) => Object,
  BaseComponent: ReactElementType
): ReactElementType

Note: The name of this helper will likely change to avoid confusion.

The first parameter createChildProps() is a function which accepts a function getProps(), which returns the current owner props. The props returned by createChildProps() are immutable and do not change throughout the lifecycle of the component.

Bugfix

Fixed bug with renderComponent() #84

v0.11.0

18 Nov 20:06
Compare
Choose a tag to compare

nest()

nest(...Components: Array<ReactElementType>): ReactElementType

Composes components by nesting each one inside the previous. For example:

// Given components A, B, and C
const ABC = nest(A, B, C)
<ABC pass="through">Child</ABC>

// Effectively the same as
<A pass="through">
  <B pass="through">
    <C pass="through">
      Child
    </C>
  </B>
</A>