Module `Dream_html`Source

Constructing HTML. Detailed explanation in https://github.com/yawaramin/dream-html.

Let's adapt the example from the Dream home page:

let hello who =
    let open Dream_html in
    let open HTML in
    html [] [
      body [] [
        h1 [] [txt "Hello, %s!" who];
      ];
    ]

  let () =
    Dream.run
    @@ Dream.logger
    @@ Dream.router [Dream.get "/" (fun _ -> Dream_html.respond (hello "world"))]

More examples shown below.

Note that the version of this library installed on your device may have outdated documentation strings. To view the latest documentation, please visit the repository page.

Core types

These are the types of the final values which get rendered.

Sourcetype attr

E.g. id="toast".

Sourcetype node

Either a tag, a comment, or text data in the markup.

Output

Sourceval to_string : node -> string

Sourceval to_xml : node -> string

Same as to_string but render void tags as XML-style self-closing tags.

since 3.3.0.

Sourceval pp : Format.formatter -> node -> unit

Sourceval pp_xml : Format.formatter -> node -> unit

Same as pp but render void tags as XML-style self-closing tags.

since 3.3.0.

Source

val respond : 
  ?status:[< Dream.status ] ->
  ?code:int ->
  ?headers:(string * string) list ->
  node ->
  Dream.response Dream.promise

Source

val send : 
  ?text_or_binary:[< Dream.text_or_binary ] ->
  ?end_of_message:[< Dream.end_of_message ] ->
  Dream.websocket ->
  node ->
  unit Dream.promise

Type-safe wrapper for Dream.send.

since 3.2.0.

Sourceval set_body : Dream.response -> node -> unit

Type-safe wrapper for Dream.set_body. Sets the body to the given node and sets the Content-Type header to text/html.

Sourceval write : Dream.stream -> node -> unit Dream.promise

Type-safe wrapper for Dream.write.

Constructing nodes and attributes

Sourcetype 'a to_attr = 'a -> attr

Attributes can be created from typed values.

Sourcetype 'a string_attr = ('a, unit, string, attr) format4 -> 'a

Special handling for string-value attributes so they can use format strings i.e. string interpolation.

Sourcetype std_tag = attr list -> node list -> node

A 'standard' tag with attributes and children.

Sourcetype void_tag = attr list -> node

A 'void element': https://developer.mozilla.org/en-US/docs/Glossary/Void_element with no children.

Sourcetype 'a text_tag = attr list -> ('a, unit, string, node) format4 -> 'a

Tags which can have attributes but can contain only text. The text can be formatted.

Sourceval attr : string -> attr

attr name is a new attribute which does not carry any payload. E.g.

let required = attr "required"

since 0.1.0.

Sourceval string_attr : string -> ?raw:bool -> _ string_attr

string_attr name fmt is a new string-valued attribute which allows formatting i.e. string interpolation of the value. Note, the fmt argument is required due to the value restriction.

parameter raw
(default false) whether to inject the raw text or to escape it. Note that Dream does not support escaping inline JavaScript nor CSS, so neither does dream-html: https://github.com/aantron/dream/tree/master/example/7-template#security.

Sourceval uri_attr : string -> _ string_attr

Convenience for attributes whose values should be URIs. Takes care of both URI-encoding and attribute escaping, as recommended in https://cheatsheetseries.owasp.org/cheatsheets/Cross_Site_Scripting_Prevention_Cheat_Sheet.html#common-mistake.

Examples

a [href "/blog?tags=iamsafe\"></a><script>alert('Pwned')</script>"] [txt "Tags: tag1 | tag2"]
  ==>
  <a href="/blog?tags=iamsafe%22%3E%3C/a%3E%3Cscript%3Ealert('Pwned')%3C/script%3E">Tags: tag1 | tag2</a>

  a [href "/foo?a=1&b=2 3&c=4<5&d=6>5"] [txt "Test"]
  ==>
  <a href="/foo?a=1&amp;b=2%203&amp;c=4%3C5&amp;d=6%3E5">Test</a>

Sourceval bool_attr : string -> bool to_attr

Sourceval float_attr : string -> float to_attr

Sourceval int_attr : string -> int to_attr

Sourceval std_tag : string -> std_tag

Sourceval void_tag : string -> void_tag

Sourceval text_tag : string -> ?raw:bool -> _ text_tag

Build a tag which can contain only text.

parameter raw
(default false) whether to inject the raw text or to escape it. Note that Dream does not support escaping inline JavaScript nor CSS, so neither does dream-html: https://github.com/aantron/dream/tree/master/example/7-template#security.

Sourceval txt : ?raw:bool -> ('a, unit, string, node) format4 -> 'a

A text node inside the DOM e.g. the 'hi' in <b>hi</b>. Allows string interpolation using the same formatting features as Printf.sprintf:

b [] [txt "Hello, %s!" name]

Or without interpolation:

b [] [txt "Bold of you."]

HTML-escapes the text value. You can use the ~raw param to bypass escaping:

let user_input = "<script>alert('I like HTML injection')</script>" in
  txt ~raw:true "%s" user_input

Sourceval comment : string -> node

A comment that will be embedded in the rendered HTML, i.e. . The text is HTML-escaped.

Sourceval csrf_tag : Dream.request -> node

Convenience to add a CSRF token generated by Dream into your form. Type-safe wrapper for Dream.csrf_tag.

form
    [action "/foo"]
    [csrf_tag req; input [name "bar"]; input [type_ "submit"]]

Accessors for tags

Sourceval (+@) : node -> attr -> node

Add an attribute to a tag.

let toast msg = p [id "toast"] [txt "%s" msg]
  let toast_oob = toast "ok." +@ Hx.swap_oob "true"

raises Invalid_argument
if the node is not a tag (i.e. if it is a text or comment node).

since 0.0.3.

Sourceval (-@) : node -> string -> node

Remove an attribute from a tag.

raises Invalid_argument
if the node is not a tag (i.e. if it is a text or comment node).

since 0.0.3.

Sourceval (.@[]) : node -> string -> string

Get the value of an existing attribute.

let toast = p [id "toast"] [txt "OK."]
  let toast_id = toast.@["id"]

raises Invalid_argument
if the node is not a tag (i.e. if it is a text or comment node).

raises Not_found
if the tag does not have the given attribute.

since 0.0.3.

Sourceval is_null : node -> bool

Get whether a node is null (empty) or not. Useful for conditional rendering of UIs when you are passed in a node and you don't know if it's empty or not.

since 1.2.0.

Sourceval is_null_ : attr -> bool

Get whether an attribute is null (empty) or not.

since 1.2.0.

Standard attributes and tags

Sourcemodule HTML : sig ... end

All standard HTML attributes and tags. Some attributes and tags have the same name, e.g. style. To disambiguate them, attributes have a _ (underscore) suffix.

Sourcemodule SVG : sig ... end

Sourcemodule MathML : sig ... end

ARIA support

Sourcemodule Aria : sig ... end

https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/

htmx support

Sourcemodule Hx : sig ... end

htmx support https://htmx.org/reference/

Live reload support

Sourcemodule Livereload : sig ... end

Live reload script injection and handling. Adapted from Dream.livereload middleware. This version is not a middleware so it's not as plug-and-play as that, but on the other hand it's much simpler to implement because it uses type-safe dream-html nodes rather than parsing and printing raw HTML. See below for the 3-step process to use it.

package dream-html

Module Dream_htmlSource