React.Flux.Internal

Internal module for React.Flux

Normally you should not need to use anything in this module. This module is only needed if you have complicated interaction with third-party javascript rendering code.

Documentation

newtype ReactViewRef props

This type is for the return value of React.createClass

Constructors

ReactViewRef

Fields

• reactViewRef :: JSVal

newtype ReactElementRef

This type is for the return value of React.createElement

Constructors

ReactElementRef

Fields

• reactElementRef :: JSVal

newtype ReactThis state props

The this value during the rendering function

Constructors

ReactThis

Fields

• reactThisRef :: JSVal

newtype HandlerArg

The first parameter of an event handler registered with React.

Constructors

HandlerArg JSVal

Instances

Show HandlerArg

Methods

showsPrec :: Int -> HandlerArg -> ShowS

show :: HandlerArg -> String

showList :: [HandlerArg] -> ShowS

data PropertyOrHandler handler

Either a property or an event handler.

The combination of all properties and event handlers are used to create the javascript object passed as the second argument to React.createElement.

Constructors

ToJSVal ref => Property

Fields

• propertyName :: JSString
• propertyVal :: ref

ToJSVal ref => PropertyFromContext

Fields

• propFromThisName :: JSString
• propFromThisVal :: JSVal -> ref

  will be passed this.context

NestedProperty

Fields

• nestedPropertyName :: JSString
• nestedPropertyVals :: [PropertyOrHandler handler]

ElementProperty

Fields

• elementPropertyName :: JSString
• elementValue :: ReactElementM handler ()

CallbackPropertyWithArgumentArray

Fields

• caPropertyName :: JSString
• caFunc :: JSArray -> IO handler

CallbackPropertyWithSingleArgument

Fields

• csPropertyName :: JSString
• csFunc :: HandlerArg -> handler

Typeable props => CallbackPropertyReturningView

Fields

• cretPropertyName :: JSString
• cretArgToProp :: JSArray -> IO props
• cretView :: ReactViewRef props

Instances

Functor PropertyOrHandler

Methods

fmap :: (a -> b) -> PropertyOrHandler a -> PropertyOrHandler b

(<$) :: a -> PropertyOrHandler b -> PropertyOrHandler a

(~) * child (ReactElementM eventHandler a) => Term eventHandler [PropertyOrHandler eventHandler] (child -> ReactElementM eventHandler a)

Methods

term :: JSString -> [PropertyOrHandler eventHandler] -> child -> ReactElementM eventHandler a

property :: ToJSVal val => JSString -> val -> PropertyOrHandler handler

Create a property from anything that can be converted to a JSVal

(&=) :: ToJSVal a => JSString -> a -> PropertyOrHandler handler

Create a property for anything that can be converted to a javascript value using the ToJSVal class from the ghcjs-base package.. This is just an infix version of property.

data ReactElement eventHandler

A React element is a node or list of nodes in a virtual tree. Elements are the output of the rendering functions of classes. React takes the output of the rendering function (which is a tree of elements) and then reconciles it with the actual DOM elements in the browser. The ReactElement is a monoid, so dispite its name can represent more than one element. Multiple elements are rendered into the browser DOM as siblings.

Constructors

ForeignElement

Fields

• fName :: Either JSString (ReactViewRef Object)
• fProps :: [PropertyOrHandler eventHandler]
• fChild :: ReactElement eventHandler

Typeable props => ViewElement

Fields

• ceClass :: ReactViewRef props
• ceKey :: Maybe JSVal
• ceProps :: props
• ceChild :: ReactElement eventHandler

RawJsElement

Fields

• rawTransform :: JSVal -> [ReactElementRef] -> IO ReactElementRef

  first arg is this from render method, second argument is the rendering of rawChild

• rawChild :: ReactElement eventHandler

ChildrenPassedToView

Content JSString

Append (ReactElement eventHandler) (ReactElement eventHandler)

EmptyElement

Instances

Functor ReactElement

Methods

fmap :: (a -> b) -> ReactElement a -> ReactElement b

(<$) :: a -> ReactElement b -> ReactElement a

Monoid (ReactElement eventHandler)

Methods

mempty :: ReactElement eventHandler

mappend :: ReactElement eventHandler -> ReactElement eventHandler -> ReactElement eventHandler

mconcat :: [ReactElement eventHandler] -> ReactElement eventHandler

newtype ReactElementM eventHandler a

A writer monad for ReactElements which is used in the rendering function of all views.

do notation or the Monoid instance is used to sequence sibling elements. Child elements are specified via function application; the combinator creating an element takes the child element as a parameter. The OverloadedStrings extension is used to create plain text.

ul_ $ do li_ (b_ "Hello")
         li_ "World"
         li_ $
             ul_ (li_ "Nested" <> li_ "List")

would build something like

<ul>
  <li><b>Hello</b><li>
  <li>World</li>
  <li><ul>
    <li>Nested</li>
    <li>List</li>
  </ul></li>
</ul>

The React.Flux.DOM module contains a large number of combinators for creating HTML elements.

Constructors

ReactElementM

Fields

• runReactElementM :: Writer (ReactElement eventHandler) a

Instances

(~) * child (ReactElementM eventHandler a) => Term eventHandler [PropertyOrHandler eventHandler] (child -> ReactElementM eventHandler a)

Methods

term :: JSString -> [PropertyOrHandler eventHandler] -> child -> ReactElementM eventHandler a

Term eventHandler (ReactElementM eventHandler a) (ReactElementM eventHandler a)

Methods

term :: JSString -> ReactElementM eventHandler a -> ReactElementM eventHandler a

Monad (ReactElementM eventHandler)

Methods

(>>=) :: ReactElementM eventHandler a -> (a -> ReactElementM eventHandler b) -> ReactElementM eventHandler b

(>>) :: ReactElementM eventHandler a -> ReactElementM eventHandler b -> ReactElementM eventHandler b

return :: a -> ReactElementM eventHandler a

fail :: String -> ReactElementM eventHandler a

Functor (ReactElementM eventHandler)

Methods

fmap :: (a -> b) -> ReactElementM eventHandler a -> ReactElementM eventHandler b

(<$) :: a -> ReactElementM eventHandler b -> ReactElementM eventHandler a

Applicative (ReactElementM eventHandler)

Methods

pure :: a -> ReactElementM eventHandler a

(<*>) :: ReactElementM eventHandler (a -> b) -> ReactElementM eventHandler a -> ReactElementM eventHandler b

(*>) :: ReactElementM eventHandler a -> ReactElementM eventHandler b -> ReactElementM eventHandler b

(<*) :: ReactElementM eventHandler a -> ReactElementM eventHandler b -> ReactElementM eventHandler a

Foldable (ReactElementM eventHandler)

Methods

fold :: Monoid m => ReactElementM eventHandler m -> m

foldMap :: Monoid m => (a -> m) -> ReactElementM eventHandler a -> m

foldr :: (a -> b -> b) -> b -> ReactElementM eventHandler a -> b

foldr' :: (a -> b -> b) -> b -> ReactElementM eventHandler a -> b

foldl :: (b -> a -> b) -> b -> ReactElementM eventHandler a -> b

foldl' :: (b -> a -> b) -> b -> ReactElementM eventHandler a -> b

foldr1 :: (a -> a -> a) -> ReactElementM eventHandler a -> a

foldl1 :: (a -> a -> a) -> ReactElementM eventHandler a -> a

toList :: ReactElementM eventHandler a -> [a]

null :: ReactElementM eventHandler a -> Bool

length :: ReactElementM eventHandler a -> Int

elem :: Eq a => a -> ReactElementM eventHandler a -> Bool

maximum :: Ord a => ReactElementM eventHandler a -> a

minimum :: Ord a => ReactElementM eventHandler a -> a

sum :: Num a => ReactElementM eventHandler a -> a

product :: Num a => ReactElementM eventHandler a -> a

(~) * a () => IsString (ReactElementM eventHandler a)

Methods

fromString :: String -> ReactElementM eventHandler a

(~) * a () => Monoid (ReactElementM eventHandler a)

Methods

mempty :: ReactElementM eventHandler a

mappend :: ReactElementM eventHandler a -> ReactElementM eventHandler a -> ReactElementM eventHandler a

mconcat :: [ReactElementM eventHandler a] -> ReactElementM eventHandler a

transHandler :: (handler1 -> handler2) -> ReactElementM handler1 a -> ReactElementM handler2 a

Transform the event handler for a ReactElementM.

elemString :: String -> ReactElementM eventHandler ()

Create a text element from a string. The text content is escaped to be HTML safe. If you need to insert HTML, instead use the dangerouslySetInnerHTML property. This is an alias for fromString.

elemText :: Text -> ReactElementM eventHandler ()

Create a text element from a text value. The text content is escaped to be HTML safe.

elemJSString :: JSString -> ReactElementM eventHandler ()

Create a text element from a JSString. This is more efficient for hard-coded strings than converting from text to a JavaScript string. The string is escaped to be HTML safe.

elemShow :: Show a => a -> ReactElementM eventHandler ()

Create an element containing text which is the result of showing the argument. Note that the resulting string is then escaped to be HTML safe.

el

Arguments

:: JSString

The element name (the first argument to React.createElement).

-> [PropertyOrHandler eventHandler]

The properties to pass to the element (the second argument to React.createElement).

-> ReactElementM eventHandler a

The child elements (the third argument to React.createElement).

-> ReactElementM eventHandler a

Create a React element.

childrenPassedToView :: ReactElementM eventHandler ()

Transclude the children passed into view or viewWithKey into the current rendering. Use this where you would use this.props.children in a javascript React class.

elementToM :: a -> ReactElement eventHandler -> ReactElementM eventHandler a

Create a ReactElementM containing a given ReactElement.

mkReactElement

Arguments

:: (eventHandler -> IO ())

-> ReactThis state props

this

-> ReactElementM eventHandler ()

-> IO (ReactElementRef, [CallbackToRelease])

Execute a ReactElementM to create a javascript React element and a list of callbacks attached to nodes within the element. These callbacks will need to be released with releaseCallback once the class is re-rendered.

exportViewToJs :: Typeable props => ReactViewRef props -> (JSArray -> IO props) -> IO (CallbackToRelease, JSVal)

toJSString :: String -> String

type JSString = String