react-adopt

:sunglasses: React Adop - Compose render props components like a pro

🧐   Why

Render Props are the new hype of React's ecossystem, that's a fact. So, when you need to use more than one render props component together, this can be borring and generate something like a "render hell".

💡   Solution

• Small. 0.7kb minified!
• Extremelly Simple. Just a method!

React Adopt it's just a simple method that you can compose your components and return all props in a function by mapping each child prop returned by your component.

💻   Usage (demo)

Install as project dependency:

$ yarn add react-adopt

Then you can use the method to compose your components. See above an example using the awesome library react-powerplug:

import React from 'react'
import { adopt } from 'react-adopt'
import { Value } from 'react-powerplug'

const Composed = adopt({
  greet: <Value initial="Hello" />,
  name: <Value initial="John" />,
})

const App = () => (
  <Composed>
    {({ greet, name }) => (
      <div>{greet.value} {name.value}</div>
    )}
  </Composed>
)

🕺   Contribute

• Fork this repository to your own GitHub account and then clone it to your local device
• Install dependencies using Yarn: yarn install
• Make the necessary changes and ensure that the tests are passing using yarn test
• Send a pull request 🙌