Header menu logo Sutil

EngineHelpers Module

DOM builders such as Html, Attr, Ev and Css

Functions and values

Function or value Description

Attr

Full Usage: Attr

Returns: SutilAttrEngine

DOM attributes, which are key/value pairs for elements. For example,

Html.div [ Attr.tabIndex 0 ]

Returns: SutilAttrEngine

Css

Full Usage: Css

Returns: CssEngine<string * obj>

CSS styles. For example,

Html.div [ Attr.style [ Css.backgroundColor "red" ] ]

Returns: CssEngine<string * obj>

Ev

Full Usage: Ev

Returns: SutilEventEngine

DOM event handlers. Strictly speaking, these are attributes, but it's useful for them to have their own namespace. For example

 Html.button [
     Ev.onClick (fun _ -> console("click"))
 ]

Returns: SutilEventEngine

Html

Full Usage: Html

Returns: SutilHtmlEngine

DOM builder. For example,

Html.div [ (* children *) ]

Returns: SutilHtmlEngine

prop

Full Usage: prop

Returns: SutilAttrEngine

An alias for Attr Compatibility with code produced by https://thisfunctionaltom.github.io/Html2Feliz/

Returns: SutilAttrEngine

Type something to start searching.