Move shared Events stuff out of React.Basic.DOM

examples/controlled-input/src/ControlledInput.purs

@@ -3,11 +3,10 @@ module ControlledInput where
 import Prelude
 
 import Data.Maybe (Maybe(..), fromMaybe, maybe)
-import Data.Nullable (toMaybe)
 import React.Basic (ReactComponent, react)
 import React.Basic.DOM as R
-import React.Basic.DOM.Events (targetValue, timeStamp)
-import React.Basic.DOM.Events as Events
+import React.Basic.DOM.Events (preventDefault, targetValue, timeStamp)
+import React.Basic.Events as Events
 
 component :: ReactComponent {}
 component = react
@@ -16,14 +15,15 @@ component = react
   , receiveProps: \_ _ _ -> pure unit
   , render: \_ state setState ->
       R.div_
-        [ R.p_ [ R.input { onChange: Events.handler (Events.preventDefault >>> Events.merge { targetValue, timeStamp }) \{ timeStamp, targetValue } ->
-                             setState \_ -> { value: fromMaybe "" (toMaybe targetValue)
-                                            , timeStamp: Just timeStamp
-                                            }
+        [ R.p_ [ R.input { onChange: Events.handler (preventDefault >>> Events.merge { targetValue, timeStamp })
+                             \{ timeStamp, targetValue } -> setState \_ ->
+                                { value: fromMaybe "" targetValue
+                                , timeStamp: Just timeStamp
+                                }
                          , value: state.value
                          }
                ]
         , R.p_ [ R.text ("Current value = " <> show state.value) ]
-        , R.p_ (maybe [] (\ts -> [R.text ("Changed at: " <> show ts)]) state.timeStamp)
+        , R.p_ [ R.text ("Changed at = " <> maybe "never" show state.timeStamp) ]
         ]
   }

generated-docs/React/Basic/DOM/Events.md

@@ -1,23 +1,6 @@
 ## Module React.Basic.DOM.Events
 
-This module defines safe event function and property accessors.
-
-#### `EventHandler`
-
-``` purescript
-type EventHandler = EffFn1 (react :: ReactFX) SyntheticEvent Unit
-```
-
-An event handler, which receives a `SyntheticEvent` and performs some
-effects in return.
-
-#### `SyntheticEvent`
-
-``` purescript
-data SyntheticEvent :: Type
-```
-
-Event data that we receive from React.
+This module defines safe DOM event function and property accessors.
 
 #### `DOMNode`
 
@@ -35,62 +18,6 @@ data DOMEvent :: Type
 
 The underlying browser Event.
 
-#### `EventFn`
-
-``` purescript
-newtype EventFn a b
-```
-
-Encapsulates a safe event operation. `EventFn`s can be composed
-to perform multiple operations.
-
-For example:
-
-```purs
-input { onChange: handler (preventDefault >>> targetValue)
-                    \value -> setState \_ -> { value }
-      }
-```
-
-##### Instances
-``` purescript
-Semigroupoid EventFn
-Category EventFn
-(IsSymbol l, RowCons l (EventFn a b) fns_rest fns, RowCons l b r_rest r, RowLacks l fns_rest, RowLacks l r_rest, Merge rest fns_rest a r_rest) => Merge (Cons l (EventFn a b) rest) fns a r
-```
-
-#### `handler`
-
-``` purescript
-handler :: forall a. EventFn SyntheticEvent a -> (a -> Eff (react :: ReactFX) Unit) -> EventHandler
-```
-
-Create an `EventHandler`, given an `EventFn` and a callback.
-
-For example:
-
-```purs
-input { onChange: handler targetValue
-                    \value -> setState \_ -> { value }
-      }
-```
-
-#### `merge`
-
-``` purescript
-merge :: forall a fns fns_list r. RowToList fns fns_list => Merge fns_list fns a r => {  | fns } -> EventFn a ({  | r })
-```
-
-Merge multiple `EventFn` operations and collect their results.
-
-For example:
-
-```purs
-input { onChange: handler (merge { targetValue, timeStamp })
-                    \{ targetValue, timeStamp } -> setState \_ -> { ... }
-      }
-```
-
 #### `bubbles`
 
 ``` purescript
@@ -184,13 +111,13 @@ target :: EventFn SyntheticEvent DOMNode
 #### `targetChecked`
 
 ``` purescript
-targetChecked :: EventFn SyntheticEvent (Nullable Boolean)
+targetChecked :: EventFn SyntheticEvent (Maybe Boolean)
 ```
 
 #### `targetValue`
 
 ``` purescript
-targetValue :: EventFn SyntheticEvent (Nullable String)
+targetValue :: EventFn SyntheticEvent (Maybe String)
 ```
 
 #### `timeStamp`
@@ -205,17 +132,4 @@ timeStamp :: EventFn SyntheticEvent Number
 type_ :: EventFn SyntheticEvent String
 ```
 
-#### `Merge`
-
-``` purescript
-class Merge (rl :: RowList) fns a r | rl -> fns, rl a -> r where
-  mergeImpl :: RLProxy rl -> {  | fns } -> EventFn a ({  | r })
-```
-
-##### Instances
-``` purescript
-Merge Nil () a ()
-(IsSymbol l, RowCons l (EventFn a b) fns_rest fns, RowCons l b r_rest r, RowLacks l fns_rest, RowLacks l r_rest, Merge rest fns_rest a r_rest) => Merge (Cons l (EventFn a b) rest) fns a r
-```
-
 

generated-docs/React/Basic/Events.md

@@ -0,0 +1,98 @@
+## Module React.Basic.Events
+
+#### `EventHandler`
+
+``` purescript
+type EventHandler = EffFn1 (react :: ReactFX) SyntheticEvent Unit
+```
+
+An event handler, which receives a `SyntheticEvent` and performs some
+effects in return.
+
+#### `SyntheticEvent`
+
+``` purescript
+data SyntheticEvent :: Type
+```
+
+Event data that we receive from React.
+
+#### `EventFn`
+
+``` purescript
+newtype EventFn a b
+```
+
+Encapsulates a safe event operation. `EventFn`s can be composed
+to perform multiple operations.
+
+For example:
+
+```purs
+input { onChange: handler (preventDefault >>> targetValue)
+                    \value -> setState \_ -> { value }
+      }
+```
+
+##### Instances
+``` purescript
+Semigroupoid EventFn
+Category EventFn
+(IsSymbol l, RowCons l (EventFn a b) fns_rest fns, RowCons l b r_rest r, RowLacks l fns_rest, RowLacks l r_rest, Merge rest fns_rest a r_rest) => Merge (Cons l (EventFn a b) rest) fns a r
+```
+
+#### `unsafeEventFn`
+
+``` purescript
+unsafeEventFn :: forall a b. (a -> b) -> EventFn a b
+```
+
+Unsafely create an `EventFn`. This function should be avoided.
+Use the helper functions specific to your platform (such as `React.Basic.DOM.Events`).
+
+#### `handler`
+
+``` purescript
+handler :: forall a. EventFn SyntheticEvent a -> (a -> Eff (react :: ReactFX) Unit) -> EventHandler
+```
+
+Create an `EventHandler`, given an `EventFn` and a callback.
+
+For example:
+
+```purs
+input { onChange: handler targetValue
+                    \value -> setState \_ -> { value }
+      }
+```
+
+#### `merge`
+
+``` purescript
+merge :: forall a fns fns_list r. RowToList fns fns_list => Merge fns_list fns a r => {  | fns } -> EventFn a ({  | r })
+```
+
+Merge multiple `EventFn` operations and collect their results.
+
+For example:
+
+```purs
+input { onChange: handler (merge { targetValue, timeStamp })
+                    \{ targetValue, timeStamp } -> setState \_ -> { ... }
+      }
+```
+
+#### `Merge`
+
+``` purescript
+class Merge (rl :: RowList) fns a r | rl -> fns, rl a -> r where
+  mergeImpl :: RLProxy rl -> {  | fns } -> EventFn a ({  | r })
+```
+
+##### Instances
+``` purescript
+Merge Nil () a ()
+(IsSymbol l, RowCons l (EventFn a b) fns_rest fns, RowCons l b r_rest r, RowLacks l fns_rest, RowLacks l r_rest, Merge rest fns_rest a r_rest) => Merge (Cons l (EventFn a b) rest) fns a r
+```
+
+

src/React/Basic/DOM.purs

@@ -8,7 +8,7 @@
 module React.Basic.DOM where
 
 import React.Basic (JSX, ReactComponent, createElement)
-import React.Basic.DOM.Events (EventHandler)
+import React.Basic.Events (EventHandler)
 import Unsafe.Coerce (unsafeCoerce)
 
 -- | Create a text node.