An open API service indexing awesome lists of open source software.

https://github.com/astrocoders/reason-epitath

CPS sugar usage for React Render Props composition in ReasonML
https://github.com/astrocoders/reason-epitath

react reasonml render-props

Last synced: about 1 year ago
JSON representation

CPS sugar usage for React Render Props composition in ReasonML

Awesome Lists containing this project

README

          

## bs-epitath demo

Read the article https://medium.com/astrocoders/render-props-composition-for-reasonml-is-here-b9c004ca9fcb

## Running

```
npm install
```

```
npm start
```

```reason
module StateConfig = {
type state = string;
};
/* ReContainers is from https://github.com/Astrocoders/recontainers/ */
module State = ReContainers.WithState.Make(StateConfig);

let component = ReasonReact.statelessComponent("App");

let make = _children => {
...component,
render: _self => {
let%Epitath emailState = children =>
...children ;


{ReasonReact.string("Meet Epitath")}


{ReasonReact.string("Email")}

emailState.send(Set(ReactEvent.Form.target(event)##value))
}
/>

{ReasonReact.string(emailState.state)}


{
/* Combine as many as you want. Use even in the middle of JSX! */

let%Epitath passwordState = children =>
...children ;

<>
{ReasonReact.string("Password")}

passwordState.send(
Set(ReactEvent.Form.target(event)##value),
)
}
/>

{ReasonReact.string(passwordState.state)}


>;
}
;
},
};
```

# Next Steps

Maybe change
```reason
let%Epitath passwordState = children =>
...children ;
```

to
```reason
let%Epitath passwordState = ;
```