Snabbdom

newtype VNodeProxy e

Constructors

• VNodeProxy { children :: Array (VNodeProxy e), data :: VNodeData e, elm :: Element, sel :: String }

type VNodeData e = { attrs :: StrMap String, hook :: VNodeHookObjectProxy e, on :: VNodeEventObject e }

Attrs allows you to set attributes on DOM elements.

The event listeners module gives powerful capabilities for attaching event listeners. You can attach a function to an event on a vnode by supplying an object at on with a property corresponding to the name of the event you want to listen to. The function will be called when the event happens and will be passed the event object that belongs to it.

Hooks are a way to hook into the lifecycle of DOM nodes. Snabbdom offers a rich selection of hooks. Hooks are used both by modules to extend Snabbdom, and in normal code for executing arbitrary code at desired points in the life of a virtual node.

data VNodeEventObject :: Row Effect -> Type

toVNodeEventObject :: forall e a. StrMap (a -> Eff e Unit) -> VNodeEventObject e

Transform a StrMap representing a VNodeEventObject into its native counter part

type VNodeHookObject e = { destroy :: Maybe (VNodeProxy e -> Eff e Unit), insert :: Maybe (VNodeProxy e -> Eff e Unit), update :: Maybe (VNodeProxy e -> VNodeProxy e -> Eff e Unit) }

The insert hook is invoked once the DOM element for a vnode has been inserted into the document and the rest of the patch cycle is done. This means that you can do DOM measurements (like using getBoundingClientRect in this hook safely, knowing that no elements will be changed afterwards that could affect the position of the inserted elements.

The destroy hook is invoked on a virtual node when its DOM element is removed from the DOM or if its parent is being removed from the DOM.

The update hook is invoked whenever an element is being updated

getElementImpl :: forall e a. VNodeProxy e -> (a -> Maybe a) -> Maybe a -> Maybe Element

getElement :: forall e. VNodeProxy e -> Maybe Element

Safely get the elm from a VNode

data VNodeHookObjectProxy :: Row Effect -> Type

toVNodeHookObjectProxy :: forall e. VNodeHookObject e -> VNodeHookObjectProxy e

Transform a VNodeHookObject into its native counter part

data VDOM :: Effect

patch :: forall e. VNodeProxy e -> VNodeProxy e -> Eff (vdom :: VDOM | e) Unit

The patch function returned by init takes two arguments. The first is a DOM element or a vnode representing the current view. The second is a vnode representing the new, updated view. If a DOM element with a parent is passed, newVnode will be turned into a DOM node, and the passed element will be replaced by the created DOM node. If an old vnode is passed, Snabbdom will efficiently modify it to match the description in the new vnode. Any old vnode passed must be the resulting vnode from a previous call to patch. This is necessary since Snabbdom stores information in the vnode. This makes it possible to implement a simpler and more performant architecture. This also avoids the creation of a new old vnode tree.

patchInitial :: forall e. Element -> VNodeProxy e -> Eff (vdom :: VDOM | e) Unit

Same as patch, but patches an initial DOM Element instead.

patchInitialSelector :: forall e. String -> VNodeProxy e -> Eff (vdom :: VDOM | e) Unit

Same as patch initial, but takes a selector instead of a DOM Element.

text :: forall e. String -> VNodeProxy e

Turns a String into a VNode

h :: forall e. String -> VNodeData e -> Array (VNodeProxy e) -> VNodeProxy e

It is recommended that you use snabbdom/h to create vnodes. h accepts a tag/selector as a string, an optional data object and an optional string or array of children.

updateValueHook :: forall e. VNodeProxy e -> VNodeProxy e -> Eff e Unit

A hook that updates the value whenever it's attribute gets updated.