Initial hooks implementation

bower.json

@@ -23,7 +23,8 @@
     "purescript-exceptions": "^4.0.0",
     "purescript-maybe": "^4.0.0",
     "purescript-nullable": "^4.0.0",
-    "purescript-typelevel-prelude": "^3.0.0"
+    "purescript-typelevel-prelude": "^3.0.0",
+    "purescript-tuples": "^5.1.0"
   },
   "devDependencies": {
     "purescript-console": "^4.1.0",

src/React.js

@@ -169,3 +169,9 @@ function createContext(defaultValue) {
   };
 }
 exports.createContext = createContext;
+
+exports.createElementHook = function createElementHook(fn) {
+  return function(props) {
+    return React.createElement(fn, props);
+  };
+};

src/React.purs

@@ -63,6 +63,7 @@ module React
   , ContextProvider
   , ContextConsumer
   , createContext
+  , createElementHook
   ) where
 
 import Prelude
@@ -75,6 +76,8 @@ import Prim.Row as Row
 import Type.Row (type (+))
 import Unsafe.Coerce (unsafeCoerce)
 
+import React.Hook (Hook)
+
 -- | Name of a tag.
 type TagName = String
 
@@ -463,3 +466,10 @@ type ContextConsumer a = ReactClass { children :: a -> ReactElement }
 
 -- | Create a new context provider/consumer pair given a default value.
 foreign import createContext :: forall a. a -> Context a
+
+-- | Create an element from a function using Hook.
+foreign import createElementHook
+  :: forall props
+   . ({ | props } -> Hook ReactElement)
+  -> { | props }
+  -> ReactElement

src/React/Hook.js

@@ -0,0 +1,95 @@
+'use strict';
+
+var React = require('react');
+
+exports.useState_ = function useState_(Tuple, initialState) {
+  var result = React.useState(initialState);
+
+  var state = result[0];
+
+  var setState = result[1];
+
+  var tuple = Tuple(state)(setState);
+
+  return tuple;
+};
+
+exports.useEffect_ = function useEffect_(effect, inputs) {
+  var result = inputs ? React.useEffect(effect, inputs) : React.useEffect(effect);
+
+  return result;
+};
+
+exports.useContext_ = function useContext_(context) {
+  var result = React.useContext(context);
+
+  return result;
+}
+
+exports.useReducer_ = function useReducer_(Tuple, reducer, initialState) {
+  var result = React.useReducer(reducer, initialState);
+
+  var state = result[0];
+
+  var dispatch = result[1];
+
+  var tuple = Tuple(state)(dispatch);
+
+  return tuple;
+};
+
+exports.useReducerLazy_ = function useReducerLazy_(Tuple, reducer, initialState, initialAction) {
+  var result = React.useReducer(reducer, initialState, initialAction);
+
+  var state = result[0];
+
+  var dispatch = result[1];
+
+  var tuple = Tuple(state)(dispatch);
+
+  return tuple;
+};
+
+exports.useCallback_ = function useCallback_(callback, inputs) {
+  var result = inputs ? React.useCallback(callback, inputs) : React.useCallback(callback);
+
+  return result;
+};
+
+exports.useMemo_ = function useMemo_(memo, inputs) {
+  var result = inputs ? React.useMemo(memo, inputs) : React.useMemo(memo);
+
+  return result;
+};
+
+exports.useRef_ = function useRef_(initialValue) {
+  var result = React.useRef(initialValue);
+
+  return result;
+}
+
+exports.getRef_ = function getRef_(ref) {
+  return ref.current;
+}
+
+exports.setRef_ = function setRef_(ref, value) {
+  ref.current = value;
+}
+
+exports.useImperativeMethods_ = function useImperativeMethods_(ref, imperativeMethods, inputs) {
+  var result = inputs ? React.useImperativeMethods(ref, imperativeMethods, inputs) : React.useImperativeMethods(ref, imperativeMethods);
+
+  return result;
+};
+
+exports.useMutationEffect_ = function useMutationEffect_(mutationEffect, inputs) {
+  var result = inputs ? React.useMutationEffect(mutationEffect, inputs) : React.useMutationEffect(mutationEffect);
+
+  return result;
+};
+
+exports.useLayoutEffect_ = function useLayoutEffect_(layoutEffect, inputs) {
+  var result = inputs ? React.useLayoutEffect(layoutEffect, inputs) : React.useLayoutEffect(layoutEffect);
+
+  return result;
+};