v2.1.2

• Adds React v18 to the peer dependency range (#81 @browniebroke)

v2.1.1

• Adds React v17 to the peer dependency range (#69 @karlhorky)

v2.1.0

• Lowers React peer dependency requirement to 16.3 (#59)
• Removes dependency on shallowequal by utilizing PureComponent from React v16 (#60)

Thanks @realityking!

v2.0.0

• Renames componentWillMount method to UNSAFE_componentWillMount to silence warnings from React v16.9 (#58). This is a breaking change; the library now has a peer dependency on React v16.9. Older versions of React are incompatible.

v1.2.0

• Removes the dependency on exenv (#52 )

v1.1.0

• Removes the dependency on fbjs (#27)

v1.0.2

• Fixes prototype chain to descend from Component (#14, #16)

v1.0.1

• Fixes server-side memory leak (#9, #10)

v1.0.0

Breaking Changes

• We now require React 0.13+.
• React Side Effect is now a higher-order component (originally suggested in #4, although the API is different from #5). This lets you specify a custom render function (#1). We drop the support for mixing in methods, because you do anything you like inside the passed component.
• We now check whether you're on server or on client so you don't have to. The change callback will no longer be executed on the server. We expose canUseDOM as a static property on the generated component so you can monkeypatch it in your tests.
• Instead of letting you hold the state in a local variables for server rendering, and a handleChange(propsList) function, you now must provide two functions: reducePropsToState(propsList): state and handleStateChangeOnClient(state). This makes the existing patterns used in React Document Title and React Helmet easier to implement, and gives you server rendering support for free.
• There is also a new, optional mapStateOnServer function you may specify for advanced cases. See README for more details on the new API.

What's It Look Like Now?

Example: BodyStyle.js

import { Component, Children, PropTypes } from 'react';
import withSideEffect from 'react-side-effect';

class BodyStyle extends Component {
  render() {
    return Children.only(this.props.children);
  }
}

BodyStyle.propTypes = {
  style: PropTypes.object.isRequired
};

function reducePropsToState(propsList) {
  var style = {};
  propsList.forEach(function (props) {
    Object.assign(style, props.style);
  });
  return style;
}

function handleStateChangeOnClient(style) {
  for (var key in style) {
    document.style[key] = style[key];
  }
}

export default withSideEffect(
  reducePropsToState,
  handleStateChangeOnClient
)(BodyStyle);

Example: DocumentTitle.js

import React, { Children, Component, PropTypes } from 'react';
import withSideEffect from 'react-side-effect';

class DocumentTitle extends Component {
  render: function render() {
    if (this.props.children) {
      return Children.only(this.props.children);
    } else {
      return null;
    }
  }
}

DocumentTitle.propTypes = {
  title: PropTypes.string.isRequired
};

function reducePropsToState(propsList) {
  var innermostProps = propsList[propsList.length - 1];
  if (innermostProps) {
    return innermostProps.title;
  }
}

function handleStateChangeOnClient(title) {
  document.title = title || '';
}

export default withSideEffect(
  reducePropsToState,
  handleStateChangeOnClient
)(DocumentTitle);

v0.3.2

• Use invariant and shallowEqual from fbjs