react-with-direction/src/DirectionProvider.jsx

// This component provides a string to React context that is consumed by the
// withDirection higher-order component. We can use this to give access to
// the current layout direction for components to use.

import PropTypes from 'prop-types';
import React from 'react';
import { forbidExtraProps } from 'airbnb-prop-types';
import brcast from 'brcast';
import brcastShape from './proptypes/brcast';
import directionPropType from './proptypes/direction';
import { DIRECTIONS, CHANNEL } from './constants';

const propTypes = forbidExtraProps({
  children: PropTypes.node.isRequired,
  direction: directionPropType.isRequired,
});

const childContextTypes = {
  [CHANNEL]: brcastShape,
};

export { DIRECTIONS };

export default class DirectionProvider extends React.Component {
  constructor(props) {
    super(props);
    this.broadcast = brcast(props.direction);
  }

  getChildContext() {
    return {
      [CHANNEL]: this.broadcast,
    };
  }

  componentWillReceiveProps(nextProps) {
    if (this.props.direction !== nextProps.direction) {
      this.broadcast.setState(nextProps.direction);
    }
  }

  render() {
    const { children, direction } = this.props;
    return (
      <div dir={direction}>
        {React.Children.only(children)}
      </div>
    );
  }
}

DirectionProvider.propTypes = propTypes;
DirectionProvider.childContextTypes = childContextTypes;