"async" recurstion

const passProps = (props, component) => {
  return {
    type: 'LOCAL_STATE',
    props,
    component
  }
}

const getElementWithLocalState = ({ clicked = false }) => {
  
  return passProps(props, (update, props) => {
    const onClick = () => {
      update({ clicked: true })
    }
    
    return document.createTextNode(props.clicked ? 'clicked!' : 'not clicked')
  })
}

//API:
// When this function is called first time, "renderer" should see that it does not return DOM and than it should take returned function
// and call it with update argument, which is a function that gets new props as argument 


//renderer.js

const replaceElement = (oldEl, newEl) => {
  oldEl.parentNode.replaceChild(newEl, oldEl)
}

const createElementUpdate = (rootEl, path, componentFn) => {
  return (state) => {
    let element = getElementByPath(path, rootEl)
    let updateFn = createElementUpdate(rootEl, path, componentFn)
    replaceElement(element, componentFn(updateFn, state))
  }
}

let maybeDom = getElementWithLocalState({})

if (maybeDom['type'] == 'LOCAL_STATE') {
  let updateFn = createElementUpdate(document.body, [ 0 ], maybeDom.component)
  dom = maybeDom.component(updateFn, maybeDom['props'])

} else {
  let dom = maybeDom

}

document.body.appendChild(dom)