Freedom.UI

type Subscription state = Query state -> Effect Unit

The type of subscription.

Hooks of events that aren't related a specific node like window events, timers and so on.

type Renderer state = { getLatestRenderedChildren :: Effect (Array (VNode state)), renderChildren :: Node -> Array (VNode state) -> Effect Unit }

The type of rendering operations.

• getLatestRenderedChildren: Get children already rendered.
• renderChildren: Patch passed children with previous rendered children.

type Operation state = { query :: Query state, renderer :: Renderer state }

The type of operations.

• query: Operations for application state.
• renderer: Operations for rendering.

type VObject state = { children :: Array (VNode state), didCreate :: Element -> Operation state -> Effect Unit, didDelete :: Element -> Operation state -> Effect Unit, didUpdate :: Element -> Operation state -> Effect Unit, fingerprint :: String, handlers :: Object (Event -> Operation state -> Effect Unit), props :: Object String, tagName :: String }

The representation of a specified tag element.

data VNode state

The type of virtual node.

Instances

• Eq (VNode state)
• Show (VNode state)
• HasKey (VNode state)

key :: forall state. String -> VNode state -> VNode state

Add a key to VNode.

renderingManually :: forall state. VNode state -> VNode state

If you want to render children manually, you should use this.

t :: forall state. String -> VNode state

Create a VNode of text.

tag :: forall state. String -> VNode state

Create a VNode of specified tag element.

kids :: forall state. Array (VNode state) -> VNode state -> VNode state

Add children.

prop :: forall state. String -> String -> VNode state -> VNode state

Add a property.

handle :: forall state. String -> (Event -> Operation state -> Effect Unit) -> VNode state -> VNode state

Bind an event handler.

didCreate :: forall state. (Element -> Operation state -> Effect Unit) -> VNode state -> VNode state

Bind didCreate lifecycle.

didUpdate :: forall state. (Element -> Operation state -> Effect Unit) -> VNode state -> VNode state

Bind didUpdate lifecycle.

didDelete :: forall state. (Element -> Operation state -> Effect Unit) -> VNode state -> VNode state

Bind didDelete lifecycle.

fingerprint :: forall state. String -> VNode state -> VNode state

Fingerprint to check equality of elements.

If it is same as previous rendered element's one, renderer skips rendering.

modifyVObject :: forall state. (VObject state -> VObject state) -> VNode state -> VNode state

The low level API for modifying a VNode of specified tag element.

newtype UI state

This is for internal. Do not use it.

createUI :: forall state. String -> (state -> VNode state) -> Query state -> Styler -> Effect (UI state)

This is for internal. Do not use it.

renderUI :: forall state. UI state -> Effect Unit

This is for internal. Do not use it.