package incr_dom_interactive

  1. Overview
  2. Docs

Module Incr_dom_interactive.Primitives

type 'a primitive = ?attrs:Incr_dom_interactive__.Import.Vdom.Attr.t list -> ?id:string -> unit -> 'a t

id lets you specify a value for the "id" attribute of the DOM node. It doesn't affect the behavior of this library (unless you accidentally create two nodes with the same id), but it might be useful if you want to refer to the node elsewhere.

val text : ?init:string -> string primitive
val text_area : ?init:string -> string primitive
module Button_state : sig ... end
val button : text:string -> Button_state.t primitive
val disabled_button : text:string -> unit primitive
val dropdown_exn : options:(string * 'a) list -> ?init:int -> 'a primitive

options is a list of tuples (label, value). label is what will be displayed to the user in the dropdown. value is what will be produced by the Interactive.t when that option is selected by the user.

init is the 0-based index of the option which is initially selected. It defaults to 0.

Raises when options is empty or init >= List.length options.

val dropdown_with_blank_exn : options:(string * 'a) list -> ?init:int -> 'a option primitive

dropdown_with_blank_exn is a wrapper around dropdown_exn which adds a blank option to the dropdown that produces None. It is otherwise the same as dropdown_exn.

If you don't provide a value for init, the initial value for the dropdown will be the blank option which produces None.

Raises when init >= List.length options.

val checkbox : ?init:bool -> bool primitive
val nodes : Incr_dom_interactive__.Import.Vdom.Node.t list -> unit t
val message : string -> unit t
val line_break : unit t
val create : init:'a -> render: (inject:('a -> Incr_dom_interactive__.Import.Vdom.Event.t) -> value:'a Incr_dom.Incr.t -> Incr_dom_interactive__.Import.Vdom.Node.t list Incr_dom.Incr.t) -> 'a t

create allows you to create your own primitives. init is the initial value of the Interactive.t. inject is how the users of your primitive tell it what to do with new values. In your event handler, you should call it and supply the new value of the primitive.

You should use value to determine the value of your primitive. For example, if your primitive is a checkbox, you should do this:

  let render ~inject ~value =
    let open Incr.Let_syntax in
    let%map is_checked = value in
    let node =
      if is_checked
      then (* ... create a [Node.t] representing a checked checkbox ... *)
      else (* ... create a [Node.t] representing an unchecked checkbox ... *)
    in
    ...

You should not use init to determine the value. value will initially be the same as init, but it might be different if the field is modified, then stops being rendered, then is rendered again. In this case, we want the user's input to be preserved. But if you use init to fill in the initial value, the user's input will be discarded in this case.

For an example, check the implementation of Primitives.text.

val default_text_attrs : Incr_dom_interactive__.Import.Vdom.Attr.t list
val default_text_area_attrs : Incr_dom_interactive__.Import.Vdom.Attr.t list
val default_button_attrs : Incr_dom_interactive__.Import.Vdom.Attr.t list
val default_dropdown_attrs : Incr_dom_interactive__.Import.Vdom.Attr.t list
val bootstrap_text_attrs : Incr_dom_interactive__.Import.Vdom.Attr.t list
val bootstrap_text_area_attrs : Incr_dom_interactive__.Import.Vdom.Attr.t list
val bootstrap_button_attrs : Incr_dom_interactive__.Import.Vdom.Attr.t list
val bootstrap_dropdown_attrs : Incr_dom_interactive__.Import.Vdom.Attr.t list