Module
React.Spaces
- Package
- purescript-react-spaces
- Repository
- coot/purescript-react-spaces
#Space Source
data Space a props
Constructors
DomNode String (Array Props) IsDynamic SpaceM a
ReactClassNode (ReactClass props) props IsDynamic SpaceM a
ReactElementNode ReactElement a
ChildrenNode (Array ReactElement) a
Empty a
#cls Source
cls :: forall props. (ReactClass props) -> props -> SpaceM
Class without children.
#cls' Source
cls' :: forall props. (ReactClass props) -> props -> SpaceM -> SpaceM
Class with children.
#dCls' Source
dCls' :: forall props. (ReactClass props) -> props -> SpaceM -> SpaceM
Class with dynamic children.
#element Source
element :: ReactElement -> SpaceM
Single element node.
#children Source
children :: Array ReactElement -> SpaceM
Add multiple elements at once
Children can be implement using element
(as sequence_ <<< map element
)
but this will be more performant.
#elements Source
elements :: forall f. Functor f => Foldable f => f ReactElement -> SpaceM
Alias for children
.
#Propertable Source
#(!) Source
Operator alias for React.Spaces.with (left-associative / precedence 4)
Combinator which adds React.DOM.Props.Props
properties to react vDOM nodes.
div ! className "container" ! onClick clickHandler $ do text "Hello"
#withClass Source
withClass :: forall a. Propertable a => a -> String -> a
#(!.) Source
Operator alias for React.Spaces.withClass (left-associative / precedence 4)
Combinator which adds className
prop.
#withId Source
withId :: forall a. Propertable a => a -> String -> a
#(!#) Source
Operator alias for React.Spaces.withId (left-associative / precedence 4)
Combinator which adds _id
prop.
#renderIn Source
renderIn :: (Array ReactElement -> ReactElement) -> SpaceM -> ReactElement
Render SpaceM
monad inside a wrapper element.
btn :: forall eff. ReactSpec Unit Unit eff
btn = (spec unit render)
where
render this =
pure $ renderIn React.DOM.div' do
button ! className "btn" ! onClick (handleClick this) $ do
text "Click me!"
handleClick thie ev = pure unit
Add a property to a vDOM node.