React

type TagName = String

Name of a tag.

data ReactElement :: Type

A virtual DOM node, or component.

data ReactComponent :: Type

A mounted react component

data ReactThis :: Type -> Type -> Type

A reference to a component, essentially React's this.

data EventHandler :: Type -> Type

An event handler. The type argument represents the type of the event.

data Read :: Effect

This phantom type indicates that read access to a resource is allowed.

data Write :: Effect

This phantom type indicates that write access to a resource is allowed.

type Disallowed = () :: Row Effect

An access synonym which indicates that neither read nor write access are allowed.

type ReadWrite = (read :: Read, write :: Write)

An access synonym which indicates that both read and write access are allowed.

type ReadOnly = (read :: Read)

An access synonym which indicates that reads are allowed but writes are not.

data ReactState :: Row Effect -> Effect

This effect indicates that a computation may read or write the component state.

The first type argument is a row of access types (Read, Write).

data ReactProps :: Effect

This effect indicates that a computation may read the component props.

data ReactRefs :: Row Effect -> Effect

This effect indicates that a computation may read the component refs.

The first type argument is a row of access types (Read, Write).

data Refs :: Type

The type of refs objects.

data Event :: Type

The type of DOM events.

type MouseEvent = { pageX :: Number, pageY :: Number }

The type of mouse events.

type KeyboardEvent = { altKey :: Boolean, charCode :: Int, ctrlKey :: Boolean, key :: String, keyCode :: Int, locale :: String, location :: Int, metaKey :: Boolean, repeat :: Boolean, shiftKey :: Boolean, which :: Int }

The type of keyboard events.

type EventHandlerContext eff props state result = Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadWrite | eff) result

A function which handles events.

type Render props state eff = ReactThis props state -> Eff (props :: ReactProps, refs :: ReactRefs Disallowed, state :: ReactState ReadOnly | eff) ReactElement

A render function.

type GetInitialState props state eff = ReactThis props state -> Eff (props :: ReactProps, refs :: ReactRefs Disallowed, state :: ReactState Disallowed | eff) state

A get initial state function.

type ComponentWillMount props state eff = ReactThis props state -> Eff (props :: ReactProps, refs :: ReactRefs Disallowed, state :: ReactState ReadWrite | eff) Unit

A component will mount function.

type ComponentDidMount props state eff = ReactThis props state -> Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadWrite | eff) Unit

A component did mount function.

type ComponentWillReceiveProps props state eff = ReactThis props state -> props -> Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadWrite | eff) Unit

A component will receive props function.

type ShouldComponentUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadWrite | eff) Boolean

A should component update function.

type ComponentWillUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadWrite | eff) Unit

A component will update function.

type ComponentDidUpdate props state eff = ReactThis props state -> props -> state -> Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadOnly | eff) Unit

A component did update function.

type ComponentWillUnmount props state eff = ReactThis props state -> Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadOnly | eff) Unit

A component will unmount function.

type ReactSpec props state eff = { componentDidMount :: ComponentDidMount props state eff, componentDidUpdate :: ComponentDidUpdate props state eff, componentWillMount :: ComponentWillMount props state eff, componentWillReceiveProps :: ComponentWillReceiveProps props state eff, componentWillUnmount :: ComponentWillUnmount props state eff, componentWillUpdate :: ComponentWillUpdate props state eff, displayName :: String, getInitialState :: GetInitialState props state eff, render :: Render props state eff, shouldComponentUpdate :: ShouldComponentUpdate props state eff }

A specification of a component.

spec :: forall eff state props. state -> Render props state eff -> ReactSpec props state eff

Create a component specification with a provided state.

spec' :: forall eff state props. GetInitialState props state eff -> Render props state eff -> ReactSpec props state eff

Create a component specification with a get initial state function.

data ReactClass :: Type -> Type

React class for components.

getProps :: forall eff state props. ReactThis props state -> Eff (props :: ReactProps | eff) props

Read the component props.

getRefs :: forall eff access state props. ReactThis props state -> Eff (refs :: ReactRefs (read :: Read | access) | eff) Refs

Read the component refs.

data Ref :: Type

Ref type. You can store Ref types on Refs object (which in corresponds to this.refs). Use ReactDOM.refToNode if you want to store a DOM.Node.Types.Node

readRef :: forall eff access state props. ReactThis props state -> String -> Eff (refs :: ReactRefs (read :: Read | access) | eff) (Maybe Ref)

Read named ref from Refs.

writeRef :: forall eff access state props. ReactThis props state -> String -> Nullable Ref -> Eff (refs :: ReactRefs (write :: Write | access) | eff) Unit

Write a Ref to Refs

getChildren :: forall eff state props. ReactThis props state -> Eff (props :: ReactProps | eff) (Array ReactElement)

Read the component children property.

writeState :: forall eff access state props. ReactThis props state -> state -> Eff (state :: ReactState (write :: Write | access) | eff) state

Write the component state.

writeStateWithCallback :: forall eff access state props. ReactThis props state -> state -> Eff (state :: ReactState (write :: Write | access) | eff) Unit -> Eff (state :: ReactState (write :: Write | access) | eff) state

Write the component state with a callback.

readState :: forall eff access state props. ReactThis props state -> Eff (state :: ReactState (read :: Read | access) | eff) state

Read the component state.

transformState :: forall eff state props. ReactThis props state -> (state -> state) -> Eff (state :: ReactState ReadWrite | eff) Unit

Transform the component state by applying a function.

createClass :: forall eff state props. ReactSpec props state eff -> ReactClass props

Create a React class from a specification.

createClassStateless :: forall props. (props -> ReactElement) -> ReactClass props

Create a stateless React class.

createClassStateless' :: forall props. (props -> Array ReactElement -> ReactElement) -> ReactClass props

Create a stateless React class with children access.

forceUpdate :: forall state props eff. ReactThis props state -> Eff eff Unit

Force render of a react component.

forceUpdateCb :: forall state props eff. ReactThis props state -> Eff eff Unit -> Eff eff Unit

Force render and then run an Eff computation.

handle :: forall result state props ev eff. (ev -> EventHandlerContext eff props state result) -> EventHandler ev

Create an event handler.

createElement :: forall props. ReactClass props -> props -> Array ReactElement -> ReactElement

Create an element from a React class spreading the children array. Used when the children are known up front.

createElementDynamic :: forall props. ReactClass props -> props -> Array ReactElement -> ReactElement

Create an element from a React class passing the children array. Used for a dynamic array of children.

createElementTagName :: forall props. TagName -> props -> Array ReactElement -> ReactElement

Create an element from a tag name spreading the children array. Used when the children are known up front.

createElementTagNameDynamic :: forall props. TagName -> props -> Array ReactElement -> ReactElement

Create an element from a tag name passing the children array. Used for a dynamic array of children.

createFactory :: forall props. ReactClass props -> props -> ReactElement

Create a factory from a React class.

data Children :: Type

Internal representation for the children elements passed to a component

childrenToArray :: Children -> Array ReactElement

Internal conversion function from children elements to an array of React elements

preventDefault :: forall a eff. Event -> Eff eff a

stopPropagation :: forall a eff. Event -> Eff eff a