component.js

const Component = (props) => {
  return <div props1={props.props1} props2={props.props2}>{props.children}</div> 
}
// lub alternatywnie    
const Component = ({ children, ...props}) => {
  return <div {...props}>{props.children}</div> 
}

// no i nasz HOC - higher order component, przyjmuje style i component i zwraca nam nowy component
// easy

const withStyle = (style, Component) => (props) => <Component style={style} {...props} />

component.re

/* nasz przykladowy Component */

module Component = {
  let make = (~props1, ~props2, /*iles tam propsow jakie chcesz*/ children) => {
    
    ... /* tu robimy jakis tam component */
    render: (_self) => {
       <div props1=props1 props2=props2> children </div>
  }
}
  
let withStyle = (style, Component) => {
   /* i tu sie pjawia problem
      component to jest modul z funkcja make
      teraz jak chce zrobic nowy component to jak mam przekazac mu propsy?
   */
   /* trzeba recznie przekazac kazde property co nie? */
   let make = (~props1, ~props2, children) => {
     ...
     render: (_self) => <div style=style props1=props1 props2=props2> children </div>
   }
   /* nawet nie wiem czy to dziala ale zalozmy ze da sie tak dynamicznie stworzyc component */
   make
}