Pass context down the tree in various ways

Usage no npm install needed!

<script type="module">
  import reactMixoutPassContext from '';


React Mixout - Pass Context

npm Build Status

For a full description of what this is please refer to the main README file of this project.

This mixout allows you to easily forward props as context.


You can install this package with the following command:

npm install react-mixout-pass-context


import React from 'react';
import mixout from 'react-mixout';
import passContext from 'react-mixout-pass-context';

class MyComponent extends React.Component {
  static contextTypes = {
    color: React.PropTypes.string,

  render() {
    return <span style={{color: this.context.color}}>Hello</span>;

// Although directly using context when props could do doesn't make sense,
// but you get the point. :D 
export default mixout(passContext('color', ({r, g, b}) => `rgb(${r},${g},${b})`))(MyComponent);

API Reference


function passContext(name: string, builder: (ownProps: any) => any): Injector;
  • name: The name context to be passed down the tree.
  • builder: Calculates the context value from the component props.


The typescript type definitions are also available and are installed via npm.


This project is licensed under the MIT license.