SutilHtmlEngine (Sutil)

SutilHtmlEngine Type

Namespace: Sutil
Assembly: Sutil.dll
Base Type: HtmlEngine<SutilElement>

Functions for building DOM elements. Note that not all members are documented here, only a few specialized augmentations over the class Feliz.HtmlEngine In theory, every HTML element should be an inherited member of SutilHtmlEngine, in the form

     // Create div with float value as a child text node
     member _.div (value: float)

     // Create div with float value as a child text node
     member _.div (value: int)

     // Create div with SutilElement value as a child element
     member _.div (value: SutilElement)

     // Create div with string value as child text node
     member _.div (value: string)

     // Create div with multiple child SutilElements.
     // Not all SutilElements are DOM elements; they may be attribute-setters, or event-listeners
     member _.div (children: seq<SutilElement>)

Multiple items
val float: value: 'T -> float (requires member op_Explicit)

--------------------
type float = System.Double

--------------------
type float<'Measure> = float

Multiple items
val int: value: 'T -> int (requires member op_Explicit)

--------------------
type int = int32

--------------------
type int<'Measure> = int

Multiple items
val string: value: 'T -> string

--------------------
type string = System.String

Multiple items
val seq: sequence: 'T seq -> 'T seq

--------------------
type 'T seq = System.Collections.Generic.IEnumerable<'T>

Example

 open Sutil

 let view() =
     Html.div [
         Html.h1 "Hello"
         Html.p "world"
     ]

val view: unit -> 'a

Constructors

Constructor	Description
`SutilHtmlEngine()` Full Usage: `SutilHtmlEngine()` Returns: `SutilHtmlEngine`	Returns: `SutilHtmlEngine`

Instance members

Instance member	Description
`this.ac cls children` Full Usage: `this.ac cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.app xs` Full Usage: `this.app xs` Parameters: xs : `SutilElement seq` Returns: `SutilElement`	xs : `SutilElement seq` Returns: `SutilElement`
`this.articlec cls children` Full Usage: `this.articlec cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.asidec cls children` Full Usage: `this.asidec cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.body xs` Full Usage: `this.body xs` Parameters: xs : `SutilElement seq` Returns: `SutilElement`	xs : `SutilElement seq` Returns: `SutilElement`
`this.buttonc cls children` Full Usage: `this.buttonc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.ddc cls children` Full Usage: `this.ddc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.div v` Full Usage: `this.div v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.div v` Full Usage: `this.div v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.div v` Full Usage: `this.div v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.divc cls children` Full Usage: `this.divc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.dlc cls children` Full Usage: `this.dlc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.dtc cls children` Full Usage: `this.dtc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.footerc cls children` Full Usage: `this.footerc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.fragment v` Full Usage: `this.fragment v` Parameters: v : `IObservable<SutilElement>` Returns: `SutilElement`	v : `IObservable<SutilElement>` Returns: `SutilElement`
`this.h1 v` Full Usage: `this.h1 v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.h1 v` Full Usage: `this.h1 v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.h1 v` Full Usage: `this.h1 v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.h1c cls children` Full Usage: `this.h1c cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.h2 v` Full Usage: `this.h2 v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.h2 v` Full Usage: `this.h2 v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.h2 v` Full Usage: `this.h2 v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.h2c cls children` Full Usage: `this.h2c cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.h3 v` Full Usage: `this.h3 v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.h3 v` Full Usage: `this.h3 v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.h3 v` Full Usage: `this.h3 v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.h3c cls children` Full Usage: `this.h3c cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.h4 v` Full Usage: `this.h4 v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.h4 v` Full Usage: `this.h4 v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.h4 v` Full Usage: `this.h4 v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.h4c cls children` Full Usage: `this.h4c cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.h5 v` Full Usage: `this.h5 v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.h5 v` Full Usage: `this.h5 v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.h5 v` Full Usage: `this.h5 v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.h5c cls children` Full Usage: `this.h5c cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.h6 v` Full Usage: `this.h6 v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.h6 v` Full Usage: `this.h6 v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.h6 v` Full Usage: `this.h6 v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.h6c cls children` Full Usage: `this.h6c cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.headerc cls children` Full Usage: `this.headerc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.hrc cls children` Full Usage: `this.hrc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.ic cls children` Full Usage: `this.ic cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.imgc cls children` Full Usage: `this.imgc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.inputc cls children` Full Usage: `this.inputc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.labelc cls children` Full Usage: `this.labelc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.lic cls children` Full Usage: `this.lic cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.navc cls children` Full Usage: `this.navc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.olc cls children` Full Usage: `this.olc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.parent selector xs` Full Usage: `this.parent selector xs` Parameters: selector : `string` xs : `SutilElement seq` Returns: `SutilElement`	selector : `string` xs : `SutilElement seq` Returns: `SutilElement`
`this.parse html` Full Usage: `this.parse html` Parameters: html : `string` Returns: `SutilElement`	html : `string` Returns: `SutilElement`
`this.pc cls children` Full Usage: `this.pc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.sectionc cls children` Full Usage: `this.sectionc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.span v` Full Usage: `this.span v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.span v` Full Usage: `this.span v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.span v` Full Usage: `this.span v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.spanc cls children` Full Usage: `this.spanc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.tablec cls children` Full Usage: `this.tablec cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.tbodyc cls children` Full Usage: `this.tbodyc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.td v` Full Usage: `this.td v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.td v` Full Usage: `this.td v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.td v` Full Usage: `this.td v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.tdc cls children` Full Usage: `this.tdc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.text v` Full Usage: `this.text v` Parameters: v : `IObservable<float>` Returns: `SutilElement`	v : `IObservable<float>` Returns: `SutilElement`
`this.text v` Full Usage: `this.text v` Parameters: v : `IObservable<int>` Returns: `SutilElement`	v : `IObservable<int>` Returns: `SutilElement`
`this.text v` Full Usage: `this.text v` Parameters: v : `IObservable<string>` Returns: `SutilElement`	v : `IObservable<string>` Returns: `SutilElement`
`this.theadc cls children` Full Usage: `this.theadc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.trc cls children` Full Usage: `this.trc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`
`this.ulc cls children` Full Usage: `this.ulc cls children` Parameters: cls : `string` children : `SutilElement seq` Returns: `SutilElement`	cls : `string` children : `SutilElement seq` Returns: `SutilElement`