elements library

Helper functions to build common HTML5 elements.

Classes

Node

Represents an HTML node.

NodeBuilder

Helper class to build nodes.

Renderer<T>

An object that can render a DOM tree into another representation, i.e. a String.

SelfClosingNode

Represents a self-closing tag, i.e. <br>.

StringRenderer

Renders a DOM tree into a HTML string.

TextNode

Represents a text node.

Functions

a({String? href, String? rel, String? target, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

abbr({String? title, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

address({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

area({String? alt, Iterable<num>? coordinates, String? download, String? href, String? hreflang, String? media, String? nohref, String? rel, String? shape, String? target, String? type, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

article({dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

aside({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

audio({bool? autoplay, bool? controls, bool? loop, bool? muted, String? preload, String? src, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

b({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

base({String? href, String? target, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

bdi({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

bdo({String? dir, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

blockquote({String? cite, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

body({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

br() → Node

button({bool? autofocus, bool? disabled, dynamic form, String? formaction, String? formenctype, String? formmethod, bool? formnovalidate, String? formtarget, String? name, String? type, String? value, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

canvas({num? height, num? width, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

caption({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

cite({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

code({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

col({num? span, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

colgroup({num? span, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

datalist({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

dd({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

del({String? cite, String? datetime, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

details({bool? open, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

dfn({String? title, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

dialog({bool? open, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

div({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

dl({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

dt({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

em({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

embed({num? height, String? src, String? type, num? width, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

fieldset({bool? disabled, String? form, String? name, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

figcaption({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

figure({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

footer({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

form({String? accept, String? acceptCharset, String? action, bool? autocomplete, String? enctype, String? method, String? name, bool? novalidate, String? target, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

h(String tagName, [Map<String, dynamic> attributes = const {}, Iterable<Node> children = const []]) → Node

Shorthand function to generate a new Node.

h1({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

h2({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

h3({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

h4({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

h5({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

h6({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

head({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

header({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

hr() → Node

html({String? manifest, String? xmlns, String? lang, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

i({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

iframe({num? height, String? name, dynamic sandbox, String? src, String? srcdoc, num? width, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

img({String? alt, String? crossorigin, num? height, String? ismap, String? longdesc, dynamic sizes, String? src, String? srcset, String? usemap, num? width, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

input({String? accept, String? alt, bool? autocomplete, bool? autofocus, bool? checked, String? dirname, bool? disabled, String? form, String? formaction, String? formenctype, String? method, String? formnovalidate, String? formtarget, num? height, String? list, dynamic max, num? maxlength, dynamic min, bool? multiple, String? name, String? pattern, String? placeholder, bool? readonly, bool? required, num? size, String? src, num? step, String? type, String? value, num? width, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

ins({String? cite, String? datetime, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

kbd({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

keygen({bool? autofocus, String? challenge, bool? disabled, String? from, String? keytype, String? name, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

label({String? for_, String? form, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

legend({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

li({num? value, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

link({String? crossorigin, String? href, String? hreflang, String? media, String? rel, dynamic sizes, String? target, String? type, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

main({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

map({String? name, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

mark({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

menu({String? label, String? type, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

menuitem({bool? checked, dynamic command, bool? default_, bool? disabled, String? icon, String? label, String? radiogroup, String? type, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

meta({String? charset, String? content, String? httpEquiv, String? name, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

nav({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

noscript({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

object({String? data, String? form, num? height, String? name, String? type, String? usemap, num? width, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

ol({bool? reversed, num? start, String? type, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

optgroup({bool? disabled, String? label, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

option({bool? disabled, String? label, bool? selected, String? value, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

output({String? for_, String? form, String? name, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

p({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

param({String? name, dynamic value, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

picture({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

pre({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

progress({num? max, num? value, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

q({String? cite, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

rebuild(NodeBuilder transform(NodeBuilder), {bool selfClosing = false}) → Node Function(Node)

Returns a function that rebuilds an arbitrary Node by applying the transform to it.

rebuildRecursive(Node f(Node)) → Node Function(Node)

Applies f to all children of this node, recursively.

rp({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

rt({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

ruby({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

s({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

samp({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

script({bool? async, String? charset, bool? defer, String? src, String? type, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

section({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

select({bool? autofocus, bool? disabled, String? form, bool? multiple, bool? required, num? size, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

small({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

source({String? src, String? srcset, String? media, dynamic sizes, String? type, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

span({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

strong({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

style({String? media, bool? scoped, String? type, String? id, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

sub({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

summary({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

sup({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

table({bool? sortable, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

tbody({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

td({num? colspan, dynamic headers, num? rowspan, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

text(String text) → Node

textarea({bool? autofocus, num? cols, String? dirname, bool? disabled, String? form, num? maxlength, String? name, String? placeholder, bool? readonly, bool? required, num? rows, String? wrap, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

tfoot({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

th({String? abbr, num? colspan, dynamic headers, num? rowspan, String? scope, dynamic sorted, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

thead({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

time({String? datetime, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

title({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

tr({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

track({bool? default_, String? kind, String? label, String? src, String? srclang, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}}) → Node

u({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

ul({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

var_({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

video({bool? autoplay, bool? controls, num? height, bool? loop, bool? muted, String? poster, String? preload, String? src, num? width, String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node

wbr({String? id, dynamic className, dynamic style, Map<String, dynamic> p = const {}, Map<String, dynamic> props = const {}, Iterable<Node> c = const [], Iterable<Node> children = const []}) → Node