Module

React

Package
purescript-react
Repository
purescript-contrib/purescript-react

This module defines foreign types and functions which wrap React's functionality.

#TagName Source

type TagName = String

Name of a tag.

#ReactElement Source

data ReactElement :: Type

A virtual DOM node, or component.

Instances

#ReactComponent Source

data ReactComponent :: Type

A mounted react component

#ReactThis Source

data ReactThis :: Type -> Type -> Type

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

#EventHandler Source

data EventHandler :: Type -> Type

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

#Read Source

data Read :: Effect

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

#Write Source

data Write :: Effect

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

#Disallowed Source

type Disallowed = () :: Row Effect

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

#ReadWrite Source

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

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

#ReadOnly Source

type ReadOnly = (read :: Read)

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

#ReactState Source

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).

#ReactProps Source

data ReactProps :: Effect

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

#ReactRefs Source

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).

#Refs Source

data Refs :: Type

The type of refs objects.

#Event Source

data Event :: Type

The type of DOM events.

#MouseEvent Source

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

The type of mouse events.

#KeyboardEvent Source

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.

#EventHandlerContext Source

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

A function which handles events.

#Render Source

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

A render function.

#GetInitialState Source

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

A get initial state function.

#ComponentWillMount Source

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

A component will mount function.

#ComponentDidMount Source

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

A component did mount function.

#ComponentDidCatch Source

type ComponentDidCatch props state eff = ReactThis props state -> Error -> { componentStack :: String } -> Eff (props :: ReactProps, refs :: ReactRefs ReadOnly, state :: ReactState ReadWrite | eff) Unit

#ComponentWillReceiveProps Source

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.

#ShouldComponentUpdate Source

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.

#ComponentWillUpdate Source

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.

#ComponentDidUpdate Source

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.

#ComponentWillUnmount Source

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

A component will unmount function.

#ReactSpec Source

type ReactSpec props state render eff = { componentDidCatch :: Maybe (ComponentDidCatch 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 render eff, shouldComponentUpdate :: ShouldComponentUpdate props state eff }

A specification of a component.

#spec Source

spec :: forall eff render state props. ReactRender render => state -> Render props state render eff -> ReactSpec props state render eff

Create a component specification with a provided state.

#spec' Source

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

Create a component specification with a get initial state function.

#ReactClass Source

data ReactClass :: Type -> Type

React class for components.

#getProps Source

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

Read the component props.

#getRefs Source

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

Read the component refs.

#Ref Source

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 Source

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 Source

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 Source

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

Read the component children property.

#writeState Source

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

Write the component state.

#writeStateWithCallback Source

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 Source

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

Read the component state.

#transformState Source

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 Source

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

#createClassStateless Source

createClassStateless :: forall render props. ReactRender render => (props -> render) -> ReactClass props

Create a stateless React class. When using a non anonymous function the displayName will be the capitalized name of the function, e.g.

helloWorld = createClassStatelesss helloWorldCls
   where
     helloWorldCls props = ...

Then the displayName will be set up to HelloWorldCls

#createClassStateless' Source

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

Create a stateless React class with children access.

#forceUpdate Source

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

Force render of a react component.

#forceUpdateCb Source

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

Force render and then run an Eff computation.

#handle Source

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

Create an event handler.

#createElement Source

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 Source

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 Source

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 Source

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 Source

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

Create a factory from a React class.

#Children Source

data Children :: Type

Internal representation for the children elements passed to a component

#childrenToArray Source

childrenToArray :: Children -> Array ReactElement

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

#preventDefault Source

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

#stopPropagation Source

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