import { define } from 'hybrids';
import React from 'react';
import ReactDOM from 'react-dom';
import Counter from './Counter';

function reactify(fn) {
  return (host) => {
    const Component = fn(host);
    return (host, target) => ReactDOM.render(Component, target);
  }
}

const ReactCounter = {
  count: 0,
  render: reactify(({ count }) => 
    <Counter count={count} />
  ),
};

define('react-counter', ReactCounter);