React-Manatea

TL;DR

Bindings of manatea for React

Table of Contents

1. infuse
2. Infuser
3. useInfuser

infuse

import React from 'react';
import { orderCup } from 'manatea';
import { infuse } from 'react-manatea';

// Defining a cup
const timer = orderCup(0);

const Timer = infuse(timer)(({ tea: time }) => <div>Time: {time}</div>);

Infuser

import React from 'react';
import { orderCup } from 'manatea';
import { Infuser } from 'react-manatea';

// Defining a cup
const timer = orderCup(0);

const Timer = () => (
  <Infuser cup={timer}>{({ tea: time }) => <div>Time: {time}</div>}</Infuser>
);

useInfuser

import React, { useInfuser } from 'react';
import { orderCup } from 'manatea';
import { useInfuser } from 'react-manatea';

// Defining a cup
const timer = orderCup(0);

const Timer = () => {
  const [time, setTime] = useInfuser(timer);
  return <div>Time: {time}</div>;
};