Liberate Props from React

Author: ajnsit

src/Concur/Core/Props.purs

@@ -0,0 +1,46 @@
+module Concur.Core.Props where
+
+import Control.Applicative (pure)
+import Data.Function ((<<<))
+import Data.Functor (class Functor)
+import Data.Unit (Unit, unit)
+import Effect (Effect)
+
+data Props p a
+  = PrimProp p
+  | Handler ((a -> Effect Unit) -> p)
+
+instance functorProps :: Functor (Props p) where
+  map _ (PrimProp p) = PrimProp p
+  map f (Handler h) = Handler \k -> h (k <<< f)
+
+-- | Internal. Do not use. Use unsafeMkProp, or unsafeMkPropHandler instead.
+mkProp
+  :: forall p a
+  . (a -> Effect Unit)
+  -> Props p a
+  -> p
+mkProp _ (PrimProp a) = a
+mkProp h (Handler f) = f h
+
+-- | Use `handleProp` to handle an event manually
+handleProp
+  :: forall p a b
+  .  (a -> Effect Unit)
+  -> Props p a
+  -> Props p b
+handleProp _ (PrimProp p) = PrimProp p
+handleProp f (Handler g) = PrimProp (g f)
+
+-- | Use this to filter the output of an event handler prop.
+-- | For example, to only handle the enter key - `filterProp isEnterEvent onKeyDown`
+filterProp ::
+  forall p a.
+  (a -> Boolean) ->
+  Props p a ->
+  Props p a
+filterProp _ p@(PrimProp _) = p
+filterProp ok (Handler g) = Handler \h ->
+  (g \a -> if ok a
+      then h a
+      else pure unit)

src/Concur/React.purs

@@ -5,8 +5,9 @@ import Prelude
 import Concur.Core (mkLeafWidget, wrapViewEvent)
 import Concur.Core.Discharge (discharge, dischargePartialEffect)
 import Concur.Core.LiftWidget (class LiftWidget, liftWidget)
+import Concur.Core.Props (mkProp)
 import Concur.Core.Types (Widget)
-import Concur.React.Props (Props, mkProp)
+import Concur.React.Props (ReactProps)
 import Control.MultiAlternative (class MultiAlternative, orr)
 import Control.ShiftMap (class ShiftMap, shiftMap)
 import Data.Either (Either(..))
@@ -32,7 +33,7 @@ el ::
   forall m a.
   ShiftMap (Widget HTML) m =>
   NodeTag ->
-  Array (Props a) ->
+  Array (ReactProps a) ->
   m a ->
   m a
 el e props = shiftMap (\f w -> wrapViewEvent (\h v ->
@@ -43,7 +44,7 @@ elLeaf ::
   forall m a.
   LiftWidget HTML m =>
   LeafTag ->
-  Array (Props a) ->
+  Array (ReactProps a) ->
   m a
 elLeaf e props = liftWidget $ mkLeafWidget \h ->
   [e (map (mkProp h) props)]
@@ -54,7 +55,7 @@ el' ::
   ShiftMap (Widget HTML) m =>
   MultiAlternative m =>
   NodeTag ->
-  Array (Props a) ->
+  Array (ReactProps a) ->
   Array (m a) ->
   m a
 el' e props = el e props <<< orr

src/Concur/React/DOM.purs

@@ -5,24 +5,24 @@ import Prelude hiding (div,map,sub)
 import Concur.Core.LiftWidget (class LiftWidget, liftWidget)
 import Concur.Core.Types (Widget, display)
 import Concur.React (HTML, el, el', elLeaf)
-import Concur.React.Props (Props)
+import Concur.React.Props (ReactProps)
 import Control.MultiAlternative (class MultiAlternative)
 import Control.ShiftMap (class ShiftMap)
 import React.DOM as D
 
 -- Wrappers for all DOM elements from purescript-react
 -- TODO: Generate these mechanically somehow
 type El1
-  = forall m a. ShiftMap (Widget HTML) m => Array (Props a) -> m a -> m a
+  = forall m a. ShiftMap (Widget HTML) m => Array (ReactProps a) -> m a -> m a
 
 type El
-  = forall m a. MultiAlternative m => ShiftMap (Widget HTML) m => Array (Props a) -> Array (m a) -> m a
+  = forall m a. MultiAlternative m => ShiftMap (Widget HTML) m => Array (ReactProps a) -> Array (m a) -> m a
 
 type El'
   = forall m a. MultiAlternative m => ShiftMap (Widget HTML) m => Array (m a) -> m a
 
 type ElLeaf
-  = forall m a. LiftWidget HTML m => Array (Props a) -> m a
+  = forall m a. LiftWidget HTML m => Array (ReactProps a) -> m a
 
 type ElLeaf'
   = forall m a. LiftWidget HTML m => m a