Module

React.Basic.Events

#EventHandler

type EventHandler = EffectFn1 SyntheticEvent Unit

An event handler, which receives a SyntheticEvent and performs some effects in return.

#SyntheticEvent

data SyntheticEvent :: Type

Event data that we receive from React.

#EventFn

newtype EventFn a b

Encapsulates a safe event operation. EventFns can be composed to perform multiple operations.

For example:

input { onChange: handler (preventDefault >>> targetValue)
                    \value -> setState \_ -> { value }
      }

Instances

#unsafeEventFn

unsafeEventFn :: forall a b. (a -> b) -> EventFn a b

Unsafely create an EventFn. This function should be avoided as it can allow a SyntheticEvent to escape its scope. Accessing a React event's properties is only valid in a synchronous event callback.

Instead, use the helper functions specific to your platform, such as React.Basic.DOM.Events.

#handler

handler :: forall a. EventFn SyntheticEvent a -> (a -> Effect Unit) -> EventHandler

Create an EventHandler, given an EventFn and a callback.

For example:

input { onChange: handler targetValue
                    \value -> setState \_ -> { value }
      }

#handler_

handler_ :: Effect Unit -> EventHandler

Create an EventHandler which discards the SyntheticEvent.

For example:

input { onChange: handler_ (setState \_ -> { value })
      }

#merge

merge :: forall a fns fns_list r. RowToList fns fns_list => Merge fns_list fns a r => Record fns -> EventFn a (Record r)

Merge multiple EventFn operations and collect their results.

For example:

input { onChange: handler (merge { targetValue, timeStamp })
                    \{ targetValue, timeStamp } -> setState \_ -> { ... }
      }

#Merge

class Merge (rl :: RowList Type) fns a r | rl -> fns, rl a -> r where

Members

Instances

Modules