tkh44/render prop composer.md

## render prop composer.md

      
    Raw
  

              render prop composer.md
            
          
    I was looking for a better way to compose multiple render prop based components.
https://codesandbox.io/s/pm04m73n2x
const h = React.createElement;

const id = x => x;

const basicRenderCb = (result, Next) => // Next is the next component in the list.
  h(Next, result);

const L = [
  // Component, propsTransformer, customRenderCallback: (result, NextComponent) => React.Element
  [A, id, basicRenderCb],
  [B, id, basicRenderCb],
  [C, id, basicRenderCb]
];

const Y = (C1, [C2, pt, rt]) => p =>
  h(C2, pt(p), x => rt(x, C1));

const build = (...list) =>
  list.reverse().reduce(Y, M);

const R = build(...L);

render(
  <R name="⓵" />,
  document.getElementById("root")
);