diff --git a/dune-project b/dune-project index 1d71c232..44a7da99 100644 --- a/dune-project +++ b/dune-project @@ -20,10 +20,9 @@ (synopsis "Bindings to ReactJS for js_of_ocaml, including JSX ppx") (depends ;; General system dependencies - (dune (and (>= 2) (< 4))) - (ocaml (and (>= 4.12.0) (< 5.0.0))) + (ocaml (>= 4.12.0)) - (js_of_ocaml (and (>= 4.0.0) (< 5.2.0))) + (js_of_ocaml (>= 4.0.0)) (gen_js_api (and (>= 1.0.8) (< 1.2.0))) (ppxlib (>= 0.23.0)) diff --git a/jsoo-react.opam b/jsoo-react.opam index 0efebbd9..a17b356e 100644 --- a/jsoo-react.opam +++ b/jsoo-react.opam @@ -7,10 +7,9 @@ license: "MIT" homepage: "https://github.com/ml-in-barcelona/jsoo-react" bug-reports: "https://github.com/ml-in-barcelona/jsoo-react/issues" depends: [ - "dune" {>= "2.7" & >= "2" & < "4"} - "ocaml" {>= "4.12.0" & < "5.0.0"} - "js_of_ocaml" {>= "4.0.0" & < "5.2.0"} - "gen_js_api" {>= "1.0.8" & < "1.2.0"} + "ocaml" {>= "4.12.0"} + "js_of_ocaml" {>= "4.0.0"} + "gen_js_api" {>= "1.0.8"} "ppxlib" {>= "0.23.0"} "webtest" {with-test} "webtest-js" {with-test} diff --git a/lib/core.mli b/lib/core.mli index 2ea9c72b..bd8e847f 100644 --- a/lib/core.mli +++ b/lib/core.mli @@ -8,7 +8,7 @@ val element_to_js : element -> Ojs.t (** Conversion function for gen_js_api *) val null : element - [@@js.custom let null = Ojs.null] +[@@js.custom let null = Ojs.null] (** A React element that will render the [null] value *) val string : string -> element [@@js.cast] @@ -61,459 +61,456 @@ let callback_to_js _ cb = cb let callback_of_js _ js = js] val create_element : 'props component -> 'props -> element - [@@js.custom - val create_element_internal : Imports.react -> 'a component -> 'a -> element - [@@js.call "createElement"] +[@@js.custom + val create_element_internal : Imports.react -> 'a component -> 'a -> element + [@@js.call "createElement"] - let create_element component props = - create_element_internal Imports.react component props] + let create_element component props = + create_element_internal Imports.react component props] val create_element_variadic : 'props component -> 'props -> element list -> element - [@@js.custom - val create_element_variadic_internal : - Imports.react - -> 'props component - -> 'props - -> (element list[@js.variadic]) - -> element - [@@js.call "createElement"] - - let create_element_variadic component props elements = - create_element_variadic_internal Imports.react component props elements] +[@@js.custom + val create_element_variadic_internal : + Imports.react + -> 'props component + -> 'props + -> (element list[@js.variadic]) + -> element + [@@js.call "createElement"] + + let create_element_variadic component props elements = + create_element_variadic_internal Imports.react component props elements] val clone_element : element -> 'props -> element - [@@js.custom - val clone_element_internal : Imports.react -> element -> 'a -> element - [@@js.call "cloneElement"] +[@@js.custom + val clone_element_internal : Imports.react -> element -> 'a -> element + [@@js.call "cloneElement"] - let clone_element element props = - clone_element_internal Imports.react element props] + let clone_element element props = + clone_element_internal Imports.react element props] val use_effect_always : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> unit - [@@js.custom - val _use_effect : - Imports.react -> (unit -> (unit -> unit) option_undefined) -> unit - [@@js.call "useEffect"] +[@@js.custom + val _use_effect : + Imports.react -> (unit -> (unit -> unit) option_undefined) -> unit + [@@js.call "useEffect"] - val _use_layout_effect : - Imports.react -> (unit -> (unit -> unit) option_undefined) -> unit - [@@js.call "useLayoutEffect"] + val _use_layout_effect : + Imports.react -> (unit -> (unit -> unit) option_undefined) -> unit + [@@js.call "useLayoutEffect"] - let use_effect_always ?(before_render = false) f = - (if before_render then _use_layout_effect else _use_effect) - Imports.react f] + let use_effect_always ?(before_render = false) f = + (if before_render then _use_layout_effect else _use_effect) Imports.react f] val use_effect_once : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> unit - [@@js.custom - val _use_effect : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a array - -> unit - [@@js.call "useEffect"] - - val _use_layout_effect : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a array - -> unit - [@@js.call "useLayoutEffect"] - - let use_effect_once ?(before_render = false) f = - (if before_render then _use_layout_effect else _use_effect) - Imports.react f [||]] +[@@js.custom + val _use_effect : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a array + -> unit + [@@js.call "useEffect"] + + val _use_layout_effect : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a array + -> unit + [@@js.call "useLayoutEffect"] + + let use_effect_once ?(before_render = false) f = + (if before_render then _use_layout_effect else _use_effect) + Imports.react f [||]] val use_effect1 : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> 'a -> unit - [@@js.custom - val _use_effect : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a array - -> unit - [@@js.call "useEffect"] - - val _use_layout_effect : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a array - -> unit - [@@js.call "useLayoutEffect"] - - let use_effect1 ?(before_render = false) f value = - (if before_render then _use_layout_effect else _use_effect) - Imports.react f [| value |]] +[@@js.custom + val _use_effect : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a array + -> unit + [@@js.call "useEffect"] + + val _use_layout_effect : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a array + -> unit + [@@js.call "useLayoutEffect"] + + let use_effect1 ?(before_render = false) f value = + (if before_render then _use_layout_effect else _use_effect) + Imports.react f [| value |]] val use_effect2 : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> 'a * 'b -> unit - [@@js.custom - val _use_effect2 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b - -> unit - [@@js.call "useEffect"] - - val _use_layout_effect2 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b - -> unit - [@@js.call "useLayoutEffect"] - - let use_effect2 ?(before_render = false) f values = - (if before_render then _use_layout_effect2 else _use_effect2) - Imports.react f values] +[@@js.custom + val _use_effect2 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b + -> unit + [@@js.call "useEffect"] + + val _use_layout_effect2 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b + -> unit + [@@js.call "useLayoutEffect"] + + let use_effect2 ?(before_render = false) f values = + (if before_render then _use_layout_effect2 else _use_effect2) + Imports.react f values] val use_effect3 : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> 'a * 'b * 'c -> unit - [@@js.custom - val _use_effect3 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c - -> unit - [@@js.call "useEffect"] - - val _use_layout_effect3 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c - -> unit - [@@js.call "useLayoutEffect"] - - let use_effect3 ?(before_render = false) f values = - (if before_render then _use_layout_effect3 else _use_effect3) - Imports.react f values] +[@@js.custom + val _use_effect3 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c + -> unit + [@@js.call "useEffect"] + + val _use_layout_effect3 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c + -> unit + [@@js.call "useLayoutEffect"] + + let use_effect3 ?(before_render = false) f values = + (if before_render then _use_layout_effect3 else _use_effect3) + Imports.react f values] val use_effect4 : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> 'a * 'b * 'c * 'd -> unit - [@@js.custom - val _use_effect4 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c * 'd - -> unit - [@@js.call "useEffect"] - - val _use_layout_effect4 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c * 'd - -> unit - [@@js.call "useLayoutEffect"] - - let use_effect4 ?(before_render = false) f values = - (if before_render then _use_layout_effect4 else _use_effect4) - Imports.react f values] +[@@js.custom + val _use_effect4 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c * 'd + -> unit + [@@js.call "useEffect"] + + val _use_layout_effect4 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c * 'd + -> unit + [@@js.call "useLayoutEffect"] + + let use_effect4 ?(before_render = false) f values = + (if before_render then _use_layout_effect4 else _use_effect4) + Imports.react f values] val use_effect5 : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> 'a * 'b * 'c * 'd * 'e -> unit - [@@js.custom - val _use_effect5 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c * 'd * 'e - -> unit - [@@js.call "useEffect"] - - val _use_layout_effect5 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c * 'd * 'e - -> unit - [@@js.call "useLayoutEffect"] - - let use_effect5 ?(before_render = false) f values = - (if before_render then _use_layout_effect5 else _use_effect5) - Imports.react f values] +[@@js.custom + val _use_effect5 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c * 'd * 'e + -> unit + [@@js.call "useEffect"] + + val _use_layout_effect5 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c * 'd * 'e + -> unit + [@@js.call "useLayoutEffect"] + + let use_effect5 ?(before_render = false) f values = + (if before_render then _use_layout_effect5 else _use_effect5) + Imports.react f values] val use_effect6 : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> 'a * 'b * 'c * 'd * 'e * 'f -> unit - [@@js.custom - val _use_effect6 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c * 'd * 'e * 'f - -> unit - [@@js.call "useEffect"] - - val _use_layout_effect6 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c * 'd * 'e * 'f - -> unit - [@@js.call "useLayoutEffect"] - - let use_effect6 ?(before_render = false) f values = - (if before_render then _use_layout_effect6 else _use_effect6) - Imports.react f values] +[@@js.custom + val _use_effect6 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c * 'd * 'e * 'f + -> unit + [@@js.call "useEffect"] + + val _use_layout_effect6 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c * 'd * 'e * 'f + -> unit + [@@js.call "useLayoutEffect"] + + let use_effect6 ?(before_render = false) f values = + (if before_render then _use_layout_effect6 else _use_effect6) + Imports.react f values] val use_effect7 : ?before_render:bool -> (unit -> (unit -> unit) option_undefined) -> 'a * 'b * 'c * 'd * 'e * 'f * 'g -> unit - [@@js.custom - val _use_effect7 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c * 'd * 'e * 'f * 'g - -> unit - [@@js.call "useEffect"] - - val _use_layout_effect7 : - Imports.react - -> (unit -> (unit -> unit) option_undefined) - -> 'a * 'b * 'c * 'd * 'e * 'f * 'g - -> unit - [@@js.call "useLayoutEffect"] - - let use_effect7 ?(before_render = false) f values = - (if before_render then _use_layout_effect7 else _use_effect7) - Imports.react f values] +[@@js.custom + val _use_effect7 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c * 'd * 'e * 'f * 'g + -> unit + [@@js.call "useEffect"] + + val _use_layout_effect7 : + Imports.react + -> (unit -> (unit -> unit) option_undefined) + -> 'a * 'b * 'c * 'd * 'e * 'f * 'g + -> unit + [@@js.call "useLayoutEffect"] + + let use_effect7 ?(before_render = false) f values = + (if before_render then _use_layout_effect7 else _use_effect7) + Imports.react f values] val use_callback1 : ('input, 'output) callback -> 'a -> ('input, 'output) callback - [@@js.custom - (* Important: we don't want to use an arrow type to represent returning callback (i.e. (Ojs.t -> Ojs.t)) as the callback - would get wrapped inside caml_js_wrap_callback_strict in the resulting code *) - val use_callback1_internal : - Imports.react - -> ('input, 'output) callback - -> 'a array - -> ('input, 'output) callback - [@@js.call "useCallback"] - - let use_callback1 callback watchlist = - use_callback1_internal Imports.react callback [| watchlist |]] +[@@js.custom + (* Important: we don't want to use an arrow type to represent returning callback (i.e. (Ojs.t -> Ojs.t)) as the callback + would get wrapped inside caml_js_wrap_callback_strict in the resulting code *) + val use_callback1_internal : + Imports.react + -> ('input, 'output) callback + -> 'a array + -> ('input, 'output) callback + [@@js.call "useCallback"] + + let use_callback1 callback watchlist = + use_callback1_internal Imports.react callback [| watchlist |]] val use_callback2 : ('input, 'output) callback -> 'a * 'b -> ('input, 'output) callback - [@@js.custom - val use_callback2_internal : - Imports.react - -> ('input, 'output) callback - -> 'a * 'b - -> ('input, 'output) callback - [@@js.call "useCallback"] +[@@js.custom + val use_callback2_internal : + Imports.react + -> ('input, 'output) callback + -> 'a * 'b + -> ('input, 'output) callback + [@@js.call "useCallback"] - let use_callback2 callback watchlist = - use_callback2_internal Imports.react callback watchlist] + let use_callback2 callback watchlist = + use_callback2_internal Imports.react callback watchlist] val use_callback3 : ('input, 'output) callback -> 'a * 'b * 'c -> ('input, 'output) callback - [@@js.custom - val use_callback3_internal : - Imports.react - -> ('input, 'output) callback - -> 'a * 'b * 'c - -> ('input, 'output) callback - [@@js.call "useCallback"] +[@@js.custom + val use_callback3_internal : + Imports.react + -> ('input, 'output) callback + -> 'a * 'b * 'c + -> ('input, 'output) callback + [@@js.call "useCallback"] - let use_callback3 callback watchlist = - use_callback3_internal Imports.react callback watchlist] + let use_callback3 callback watchlist = + use_callback3_internal Imports.react callback watchlist] val use_callback4 : ('input, 'output) callback -> 'a * 'b * 'c * 'd -> ('input, 'output) callback - [@@js.custom - val use_callback4_internal : - Imports.react - -> ('input, 'output) callback - -> 'a * 'b * 'c * 'd - -> ('input, 'output) callback - [@@js.call "useCallback"] +[@@js.custom + val use_callback4_internal : + Imports.react + -> ('input, 'output) callback + -> 'a * 'b * 'c * 'd + -> ('input, 'output) callback + [@@js.call "useCallback"] - let use_callback4 callback watchlist = - use_callback4_internal Imports.react callback watchlist] + let use_callback4 callback watchlist = + use_callback4_internal Imports.react callback watchlist] val use_callback5 : ('input, 'output) callback -> 'a * 'b * 'c * 'd * 'e -> ('input, 'output) callback - [@@js.custom - val use_callback5_internal : - Imports.react - -> ('input, 'output) callback - -> 'a * 'b * 'c * 'd * 'e - -> ('input, 'output) callback - [@@js.call "useCallback"] +[@@js.custom + val use_callback5_internal : + Imports.react + -> ('input, 'output) callback + -> 'a * 'b * 'c * 'd * 'e + -> ('input, 'output) callback + [@@js.call "useCallback"] - let use_callback5 callback watchlist = - use_callback5_internal Imports.react callback watchlist] + let use_callback5 callback watchlist = + use_callback5_internal Imports.react callback watchlist] val use_callback6 : ('input, 'output) callback -> 'a * 'b * 'c * 'd * 'e * 'f -> ('input, 'output) callback - [@@js.custom - val use_callback6_internal : - Imports.react - -> ('input, 'output) callback - -> 'a * 'b * 'c * 'd * 'e * 'f - -> ('input, 'output) callback - [@@js.call "useCallback"] +[@@js.custom + val use_callback6_internal : + Imports.react + -> ('input, 'output) callback + -> 'a * 'b * 'c * 'd * 'e * 'f + -> ('input, 'output) callback + [@@js.call "useCallback"] - let use_callback6 callback watchlist = - use_callback6_internal Imports.react callback watchlist] + let use_callback6 callback watchlist = + use_callback6_internal Imports.react callback watchlist] val use_callback7 : ('input, 'output) callback -> 'a * 'b * 'c * 'd * 'e * 'f * 'g -> ('input, 'output) callback - [@@js.custom - val use_callback7_internal : - Imports.react - -> ('input, 'output) callback - -> 'a * 'b * 'c * 'd * 'e * 'f * 'g - -> ('input, 'output) callback - [@@js.call "useCallback"] +[@@js.custom + val use_callback7_internal : + Imports.react + -> ('input, 'output) callback + -> 'a * 'b * 'c * 'd * 'e * 'f * 'g + -> ('input, 'output) callback + [@@js.call "useCallback"] - let use_callback7 callback watchlist = - use_callback7_internal Imports.react callback watchlist] + let use_callback7 callback watchlist = + use_callback7_internal Imports.react callback watchlist] val use_memo1 : (unit -> 'value) -> 'a -> 'value - [@@js.custom - val use_memo1_internal : - Imports.react -> (unit -> 'value) -> 'a array -> 'value - [@@js.call "useMemo"] +[@@js.custom + val use_memo1_internal : + Imports.react -> (unit -> 'value) -> 'a array -> 'value + [@@js.call "useMemo"] - let use_memo1 callback watchlist = - use_memo1_internal Imports.react callback [| watchlist |]] + let use_memo1 callback watchlist = + use_memo1_internal Imports.react callback [| watchlist |]] val use_memo2 : (unit -> 'value) -> 'a * 'b -> 'value - [@@js.custom - val use_memo2_internal : - Imports.react -> (unit -> 'value) -> 'a * 'b -> 'value - [@@js.call "useMemo"] +[@@js.custom + val use_memo2_internal : + Imports.react -> (unit -> 'value) -> 'a * 'b -> 'value + [@@js.call "useMemo"] - let use_memo2 callback watchlist = - use_memo2_internal Imports.react callback watchlist] + let use_memo2 callback watchlist = + use_memo2_internal Imports.react callback watchlist] val use_memo3 : (unit -> 'value) -> 'a * 'b * 'c -> 'value - [@@js.custom - val use_memo3_internal : - Imports.react -> (unit -> 'value) -> 'a * 'b * 'c -> 'value - [@@js.call "useMemo"] +[@@js.custom + val use_memo3_internal : + Imports.react -> (unit -> 'value) -> 'a * 'b * 'c -> 'value + [@@js.call "useMemo"] - let use_memo3 callback watchlist = - use_memo3_internal Imports.react callback watchlist] + let use_memo3 callback watchlist = + use_memo3_internal Imports.react callback watchlist] val use_memo4 : (unit -> 'value) -> 'a * 'b * 'c * 'd -> 'value - [@@js.custom - val use_memo4_internal : - Imports.react -> (unit -> 'value) -> 'a * 'b * 'c * 'd -> 'value - [@@js.call "useMemo"] +[@@js.custom + val use_memo4_internal : + Imports.react -> (unit -> 'value) -> 'a * 'b * 'c * 'd -> 'value + [@@js.call "useMemo"] - let use_memo4 callback watchlist = - use_memo4_internal Imports.react callback watchlist] + let use_memo4 callback watchlist = + use_memo4_internal Imports.react callback watchlist] val use_memo5 : (unit -> 'value) -> 'a * 'b * 'c * 'd * 'e -> 'value - [@@js.custom - val use_memo5_internal : - Imports.react -> (unit -> 'value) -> 'a * 'b * 'c * 'd * 'e -> 'value - [@@js.call "useMemo"] +[@@js.custom + val use_memo5_internal : + Imports.react -> (unit -> 'value) -> 'a * 'b * 'c * 'd * 'e -> 'value + [@@js.call "useMemo"] - let use_memo5 callback watchlist = - use_memo5_internal Imports.react callback watchlist] + let use_memo5 callback watchlist = + use_memo5_internal Imports.react callback watchlist] val use_memo6 : (unit -> 'value) -> 'a * 'b * 'c * 'd * 'e * 'f -> 'value - [@@js.custom - val use_memo6_internal : - Imports.react -> (unit -> 'value) -> 'a * 'b * 'c * 'd * 'e * 'f -> 'value - [@@js.call "useMemo"] +[@@js.custom + val use_memo6_internal : + Imports.react -> (unit -> 'value) -> 'a * 'b * 'c * 'd * 'e * 'f -> 'value + [@@js.call "useMemo"] - let use_memo6 callback watchlist = - use_memo6_internal Imports.react callback watchlist] + let use_memo6 callback watchlist = + use_memo6_internal Imports.react callback watchlist] val use_memo7 : (unit -> 'value) -> 'a * 'b * 'c * 'd * 'e * 'f * 'g -> 'value - [@@js.custom - val use_memo7_internal : - Imports.react - -> (unit -> 'value) - -> 'a * 'b * 'c * 'd * 'e * 'f * 'g - -> 'value - [@@js.call "useMemo"] +[@@js.custom + val use_memo7_internal : + Imports.react + -> (unit -> 'value) + -> 'a * 'b * 'c * 'd * 'e * 'f * 'g + -> 'value + [@@js.call "useMemo"] - let use_memo7 callback watchlist = - use_memo7_internal Imports.react callback watchlist] + let use_memo7 callback watchlist = + use_memo7_internal Imports.react callback watchlist] val use_state : (unit -> 'state) -> 'state * (('state -> 'state) -> unit) - [@@js.custom - let (use_state_internal : - Imports.react - -> (unit -> 'state) - -> 'state * (('state -> 'state) -> unit)) = - fun (react : Imports.react) (init : unit -> 'state) -> - let result = - Ojs.call - (Imports.react_to_js react) - "useState" - [| Ojs.fun_to_js 1 (fun _ -> Obj.magic (init ())) |] - in - (Obj.magic (Ojs.array_get result 0), Obj.magic (Ojs.array_get result 1)) - - let use_state initial = use_state_internal Imports.react initial] +[@@js.custom + let (use_state_internal : + Imports.react + -> (unit -> 'state) + -> 'state * (('state -> 'state) -> unit)) = + fun (react : Imports.react) (init : unit -> 'state) -> + let result = + Ojs.call + (Imports.react_to_js react) + "useState" + [| Ojs.fun_to_js 1 (fun _ -> Obj.magic (init ())) |] + in + (Obj.magic (Ojs.array_get result 0), Obj.magic (Ojs.array_get result 1)) + + let use_state initial = use_state_internal Imports.react initial] val use_reducer : init:(unit -> 'state) -> ('state -> 'action -> 'state) -> 'state * ('action -> unit) - [@@js.custom - let use_reducer_internal : - type state action. - Imports.react - -> init:(unit -> state) - -> (state -> action -> state) - -> state * (action -> unit) = - fun react ~init reducer -> - let any_to_js : _ -> Ojs.t = Obj.magic in - let js_to_any : Ojs.t -> _ = Obj.magic in - let result = - Ojs.call - (Imports.react_to_js react) - "useReducer" - [| Ojs.fun_to_js 2 (fun state action -> - any_to_js - (reducer - (js_to_any state : state) - (js_to_any action : action))) - ; Ojs.null - ; Ojs.fun_to_js 1 (fun _ -> any_to_js (init ())) - |] - in - Js_of_ocaml.(Js.Unsafe.get result 0, Js.Unsafe.get result 1) - - let use_reducer ~init reducer = - use_reducer_internal Imports.react ~init reducer] +[@@js.custom + let use_reducer_internal : + type state action. + Imports.react + -> init:(unit -> state) + -> (state -> action -> state) + -> state * (action -> unit) = + fun react ~init reducer -> + let any_to_js : _ -> Ojs.t = Obj.magic in + let js_to_any : Ojs.t -> _ = Obj.magic in + let result = + Ojs.call + (Imports.react_to_js react) + "useReducer" + [| Ojs.fun_to_js 2 (fun state action -> + any_to_js + (reducer (js_to_any state : state) (js_to_any action : action))) + ; Ojs.null + ; Ojs.fun_to_js 1 (fun _ -> any_to_js (init ())) + |] + in + Js_of_ocaml.(Js.Unsafe.get result 0, Js.Unsafe.get result 1) + + let use_reducer ~init reducer = + use_reducer_internal Imports.react ~init reducer] module Ref : sig type 'value t val make : unit -> 'a js_nullable t - [@@js.custom - val make_internal : Imports.react -> unit -> 'a js_nullable t - [@@js.call "createRef"] + [@@js.custom + val make_internal : Imports.react -> unit -> 'a js_nullable t + [@@js.call "createRef"] - let make () = make_internal Imports.react ()] + let make () = make_internal Imports.react ()] [@@@js.stop] @@ -527,42 +524,41 @@ module Ref : sig end val use_ref : 'value -> 'value Ref.t - [@@js.custom - val use_ref_internal : Imports.react -> 'value -> 'value Ref.t - [@@js.call "useRef"] +[@@js.custom + val use_ref_internal : Imports.react -> 'value -> 'value Ref.t + [@@js.call "useRef"] - let use_ref value = use_ref_internal Imports.react value] + let use_ref value = use_ref_internal Imports.react value] module Context : sig type 'props t val make : 'a -> 'a t - [@@js.custom - val make_internal : Imports.react -> 'a -> 'a t - [@@js.call "createContext"] + [@@js.custom + val make_internal : Imports.react -> 'a -> 'a t [@@js.call "createContext"] - let make value = make_internal Imports.react value] + let make value = make_internal Imports.react value] val provider : 'props t -> 'props component [@@js.get "Provider"] module Provider : sig val make : 'props t -> value:'props -> children:element list -> unit -> element - [@@js.custom - let make_props value = - Js_of_ocaml.Js.Unsafe.(obj [| ("value", inject value) |]) + [@@js.custom + let make_props value = + Js_of_ocaml.Js.Unsafe.(obj [| ("value", inject value) |]) - let make context ~value ~children () = - create_element_variadic (provider context) (make_props value) children] + let make context ~value ~children () = + create_element_variadic (provider context) (make_props value) children] end end val use_context : 'value Context.t -> 'value - [@@js.custom - val use_context_internal : Imports.react -> 'a Context.t -> 'a - [@@js.call "useContext"] +[@@js.custom + val use_context_internal : Imports.react -> 'a Context.t -> 'a + [@@js.call "useContext"] - let use_context ctx = use_context_internal Imports.react ctx] + let use_context ctx = use_context_internal Imports.react ctx] module Children : sig [@@@js.implem @@ -571,117 +567,115 @@ module Children : sig let children_internal = children_internal' Imports.react] val map : element list -> (element -> element) -> element - [@@js.custom - val map_internal : - Ojs.t -> element list -> (element -> element) -> element - [@@js.call "map"] + [@@js.custom + val map_internal : Ojs.t -> element list -> (element -> element) -> element + [@@js.call "map"] - let map element mapper = map_internal children_internal element mapper] + let map element mapper = map_internal children_internal element mapper] val mapi : element list -> (element -> int -> element) -> element - [@@js.custom - val mapi_internal : - Ojs.t -> element list -> (element -> int -> element) -> element - [@@js.call "map"] + [@@js.custom + val mapi_internal : + Ojs.t -> element list -> (element -> int -> element) -> element + [@@js.call "map"] - let mapi element mapper = mapi_internal children_internal element mapper] + let mapi element mapper = mapi_internal children_internal element mapper] val iter : element list -> (element -> unit) -> unit - [@@js.custom - val iter_internal : Ojs.t -> element list -> (element -> unit) -> unit - [@@js.call "forEach"] + [@@js.custom + val iter_internal : Ojs.t -> element list -> (element -> unit) -> unit + [@@js.call "forEach"] - let iter element iterator = - iter_internal children_internal element iterator] + let iter element iterator = iter_internal children_internal element iterator] val iteri : element list -> (element -> int -> unit) -> unit - [@@js.custom - val iteri_internal : - Ojs.t -> element list -> (element -> int -> unit) -> unit - [@@js.call "forEach"] + [@@js.custom + val iteri_internal : + Ojs.t -> element list -> (element -> int -> unit) -> unit + [@@js.call "forEach"] - let iteri element iterator = - iteri_internal children_internal element iterator] + let iteri element iterator = + iteri_internal children_internal element iterator] val count : element list -> int - [@@js.custom - val count_internal : Ojs.t -> element list -> int [@@js.call "count"] + [@@js.custom + val count_internal : Ojs.t -> element list -> int [@@js.call "count"] - let count element = count_internal children_internal element] + let count element = count_internal children_internal element] val only : element list -> element - [@@js.custom - val only_internal : Ojs.t -> element list -> element [@@js.call "only"] + [@@js.custom + val only_internal : Ojs.t -> element list -> element [@@js.call "only"] - let only element = only_internal children_internal element] + let only element = only_internal children_internal element] val to_array : element list -> element array - [@@js.custom - val to_array_internal : Ojs.t -> element list -> element array - [@@js.call "toArray"] + [@@js.custom + val to_array_internal : Ojs.t -> element list -> element array + [@@js.call "toArray"] - let to_array element = to_array_internal children_internal element] + let to_array element = to_array_internal children_internal element] end module Fragment : sig val make : children:element list -> ?key:string -> unit -> element - [@@js.custom - external to_component : - Ojs.t - -> < children : element Js_of_ocaml.Js.readonly_prop > Js_of_ocaml.Js.t - component - = "%identity" + [@@js.custom + external to_component : + Ojs.t + -> < children : element Js_of_ocaml.Js.readonly_prop > Js_of_ocaml.Js.t + component + = "%identity" - val fragment_internal' : Imports.react -> Ojs.t [@@js.get "Fragment"] + val fragment_internal' : Imports.react -> Ojs.t [@@js.get "Fragment"] - let fragment_internal = fragment_internal' Imports.react + let fragment_internal = fragment_internal' Imports.react - let make_props ?key () = - match key with - | Some k -> Js_of_ocaml.Js.Unsafe.(obj [| ("key", inject k) |]) - | None -> Js_of_ocaml.Js.Unsafe.(obj [||]) + let make_props ?key () = + match key with + | Some k -> Js_of_ocaml.Js.Unsafe.(obj [| ("key", inject k) |]) + | None -> Js_of_ocaml.Js.Unsafe.(obj [||]) - let make ~children ?key () = - create_element_variadic - (to_component fragment_internal) - (make_props ?key ()) children] + let make ~children ?key () = + create_element_variadic + (to_component fragment_internal) + (make_props ?key ()) children] end module StrictMode : sig val make : children:element list -> ?key:string -> unit -> element - [@@js.custom - external to_component : - Ojs.t - -> < children : element Js_of_ocaml.Js.readonly_prop > Js_of_ocaml.Js.t - component - = "%identity" + [@@js.custom + external to_component : + Ojs.t + -> < children : element Js_of_ocaml.Js.readonly_prop > Js_of_ocaml.Js.t + component + = "%identity" - val strict_mode_internal' : Imports.react -> Ojs.t [@@js.get "StrictMode"] + val strict_mode_internal' : Imports.react -> Ojs.t [@@js.get "StrictMode"] - let strict_mode_internal = strict_mode_internal' Imports.react + let strict_mode_internal = strict_mode_internal' Imports.react - let make_props ?key () = - match key with - | Some k -> Js_of_ocaml.Js.Unsafe.(obj [| ("key", inject k) |]) - | None -> Js_of_ocaml.Js.Unsafe.(obj [||]) + let make_props ?key () = + match key with + | Some k -> Js_of_ocaml.Js.Unsafe.(obj [| ("key", inject k) |]) + | None -> Js_of_ocaml.Js.Unsafe.(obj [||]) - let make ~children ?key () = - create_element_variadic - (to_component strict_mode_internal) - (make_props ?key ()) children] + let make ~children ?key () = + create_element_variadic + (to_component strict_mode_internal) + (make_props ?key ()) children] end val memo : ?compare:('props -> 'props -> bool) -> 'props component -> 'props component - [@@js.custom - val memo_internal : - Imports.react - -> 'props component - -> ('props -> 'props -> bool) option_undefined - -> 'props component - [@@js.call "memo"] +[@@js.custom + val memo_internal : + Imports.react + -> 'props component + -> ('props -> 'props -> bool) option_undefined + -> 'props component + [@@js.call "memo"] - let memo ?compare component = memo_internal Imports.react component compare] + let memo ?compare component = memo_internal Imports.react component compare] val set_display_name : 'props component -> string -> unit - [@@js.set "displayName"] +[@@js.set "displayName"] diff --git a/lib/dom.mli b/lib/dom.mli old mode 100755 new mode 100644 index 3763cfda..99d893b4 --- a/lib/dom.mli +++ b/lib/dom.mli @@ -14,45 +14,44 @@ external dom_element_to_js : dom_element -> Ojs.t = "%identity" external dom_element_of_js : Ojs.t -> dom_element = "%identity"] val unmount_component_at_node : dom_element -> bool - [@@js.custom - val unmount_component_at_node_internal : - Imports.react_dom -> dom_element -> bool - [@@js.call "unmountComponentAtNode"] +[@@js.custom + val unmount_component_at_node_internal : + Imports.react_dom -> dom_element -> bool + [@@js.call "unmountComponentAtNode"] - let unmount_component_at_node dom_element = - unmount_component_at_node_internal Imports.react_dom dom_element] + let unmount_component_at_node dom_element = + unmount_component_at_node_internal Imports.react_dom dom_element] val render : Core.element -> dom_element -> unit - [@@js.custom - val render_internal : - Imports.react_dom -> Core.element -> dom_element -> unit - [@@js.call "render"] +[@@js.custom + val render_internal : Imports.react_dom -> Core.element -> dom_element -> unit + [@@js.call "render"] - let render element dom_element = - render_internal Imports.react_dom element dom_element] + let render element dom_element = + render_internal Imports.react_dom element dom_element] val render_to_element : id:string -> Core.element -> unit - [@@js.custom - val get_element_by_id : string -> dom_element option - [@@js.global "document.getElementById"] - - let render_to_element ~id react_element = - match get_element_by_id id with - | None -> - raise - (Invalid_argument - ("ReactDOM.render_to_element : no element of id " ^ id - ^ " found in the HTML.")) - | Some element -> render react_element element] +[@@js.custom + val get_element_by_id : string -> dom_element option + [@@js.global "document.getElementById"] + + let render_to_element ~id react_element = + match get_element_by_id id with + | None -> + raise + (Invalid_argument + ("ReactDOM.render_to_element : no element of id " ^ id + ^ " found in the HTML.")) + | Some element -> render react_element element] val create_portal : Core.element -> dom_element -> Core.element - [@@js.custom - val create_portal_internal : - Imports.react_dom -> Core.element -> dom_element -> Core.element - [@@js.call "createPortal"] +[@@js.custom + val create_portal_internal : + Imports.react_dom -> Core.element -> dom_element -> Core.element + [@@js.call "createPortal"] - let create_portal element dom_element = - create_portal_internal Imports.react_dom element dom_element] + let create_portal element dom_element = + create_portal_internal Imports.react_dom element dom_element] type dom_ref = private Ojs.t @@ -82,27 +81,27 @@ val create_element : (* props has to be non-optional as otherwise gen_js_api will put an empty list and React will break *) -> Core.element list -> Core.element - [@@js.custom - val create_element_internal : - Imports.react - -> string - -> props:domProps - -> (Core.element list[@js.variadic]) - -> Core.element - [@@js.call "createElement"] - - let create_element typ ~props elts = - create_element_internal Imports.react typ ~props elts] +[@@js.custom + val create_element_internal : + Imports.react + -> string + -> props:domProps + -> (Core.element list[@js.variadic]) + -> Core.element + [@@js.call "createElement"] + + let create_element typ ~props elts = + create_element_internal Imports.react typ ~props elts] val forward_ref : ('props -> dom_ref -> Core.element) -> 'props Core.component - [@@js.custom - val forward_ref_internal : - Imports.react - -> ('props -> dom_ref -> Core.element) - -> 'props Core.component - [@@js.call "forwardRef"] - - let forward_ref renderFunc = forward_ref_internal Imports.react renderFunc] +[@@js.custom + val forward_ref_internal : + Imports.react + -> ('props -> dom_ref -> Core.element) + -> 'props Core.component + [@@js.call "forwardRef"] + + let forward_ref renderFunc = forward_ref_internal Imports.react renderFunc] type block diff --git a/lib/dom_html.ml b/lib/dom_html.ml index 2e701054..8a150b62 100644 --- a/lib/dom_html.ml +++ b/lib/dom_html.ml @@ -318,7 +318,7 @@ module Prop = struct type html_object val make_react_html_object : __html:string -> html_object - [@@js.builder] [@@js.verbatim_names]] + [@@js.builder] [@@js.verbatim_names]] let dangerouslySetInnerHTML (str : Dom.SafeString.t) = any "dangerouslySetInnerHTML" diff --git a/lib/router.ml b/lib/router.ml index f59e0c62..b30a2f01 100644 --- a/lib/router.ml +++ b/lib/router.ml @@ -1,46 +1,46 @@ (* Adapted from reason-react: https://reasonml.github.io/reason-react/docs/en/router *) module Browser = -[%js: -type history -type window + [%js: + type history + type window -val window_to_js : window -> Ojs.t + val window_to_js : window -> Ojs.t -type location + type location -val history : history option [@@js.global "history"] -val window : window option [@@js.global "window"] -val location : window -> location [@@js.get] -val pathname : location -> string [@@js.get] -val hash : location -> string [@@js.get] -val search : location -> string [@@js.get] + val history : history option [@@js.global "history"] + val window : window option [@@js.global "window"] + val location : window -> location [@@js.get] + val pathname : location -> string [@@js.get] + val hash : location -> string [@@js.get] + val search : location -> string [@@js.get] -val push_state : history -> Ojs.t -> string -> href:string -> unit + val push_state : history -> Ojs.t -> string -> href:string -> unit [@@js.call "pushState"] -val replace_state : history -> Ojs.t -> string -> href:string -> unit + val replace_state : history -> Ojs.t -> string -> href:string -> unit [@@js.call "replaceState"]] module Event = -[%js: -type t + [%js: + type t -val event : t [@@js.global "Event"] -val make_event_ie11_compatible : string -> t [@@js.new "Event"] -val create_event_non_ie8 : string -> t [@@js.global "document.createEvent"] + val event : t [@@js.global "Event"] + val make_event_ie11_compatible : string -> t [@@js.new "Event"] + val create_event_non_ie8 : string -> t [@@js.global "document.createEvent"] -val init_event_non_ie8 : t -> string -> bool -> bool -> unit + val init_event_non_ie8 : t -> string -> bool -> bool -> unit [@@js.call "initEvent"] -(* The cb is t => unit, but access is restricted for now *) -val add_event_listener : Browser.window -> string -> (unit -> unit) -> unit + (* The cb is t => unit, but access is restricted for now *) + val add_event_listener : Browser.window -> string -> (unit -> unit) -> unit [@@js.call "addEventListener"] -val remove_event_listener : Browser.window -> string -> (unit -> unit) -> unit + val remove_event_listener : Browser.window -> string -> (unit -> unit) -> unit [@@js.call "removeEventListener"] -val dispatch_event : Browser.window -> t -> unit [@@js.call "dispatchEvent"]] + val dispatch_event : Browser.window -> t -> unit [@@js.call "dispatchEvent"]] let safe_make_event eventName = if diff --git a/lib/test_utils/reactDOMTestUtils.mli b/lib/test_utils/reactDOMTestUtils.mli index 2f1e639c..38d77266 100644 --- a/lib/test_utils/reactDOMTestUtils.mli +++ b/lib/test_utils/reactDOMTestUtils.mli @@ -33,42 +33,40 @@ let node_list_to_js _f x = node_list_to_js x external unsafe_to_element : 'a Js_of_ocaml.Js.t -> element = "%identity"] val act : (unit -> unit) -> unit - [@@js.custom - val act : (unit -> undefined) -> unit - [@@js.global "__LIB__reactDOMTestUtils.act"] +[@@js.custom + val act : (unit -> undefined) -> unit + [@@js.global "__LIB__reactDOMTestUtils.act"] - let act f = - act (fun () -> - f (); - undefined)] + let act f = + act (fun () -> + f (); + undefined)] module Simulate : sig val click : element -> unit - [@@js.global "__LIB__reactDOMTestUtils.Simulate.click"] + [@@js.global "__LIB__reactDOMTestUtils.Simulate.click"] end val querySelectorAll : element -> string -> element array - [@@js.custom - val querySelectorAll : element -> string -> element node_list [@@js.call] +[@@js.custom + val querySelectorAll : element -> string -> element node_list [@@js.call] + val arrayFrom : element node_list -> element array [@@js.global "Array.from"] - val arrayFrom : element node_list -> element array - [@@js.global "Array.from"] - - let querySelectorAll element selector = - arrayFrom (querySelectorAll element selector)] + let querySelectorAll element selector = + arrayFrom (querySelectorAll element selector)] module DOM : sig val findBySelectorAndPartialTextContent : element -> string -> string -> element - [@@js.custom - let find f a = - let rec find a f n = if f a.(n) then a.(n) else find a f (n + 1) in - find a f 0 + [@@js.custom + let find f a = + let rec find a f n = if f a.(n) then a.(n) else find a f (n + 1) in + find a f 0 - val textContent : element -> string [@@js.get] - val includes : string -> string -> bool [@@js.call] + val textContent : element -> string [@@js.get] + val includes : string -> string -> bool [@@js.call] - let findBySelectorAndPartialTextContent element selector content = - querySelectorAll element selector - |> find (fun node -> textContent node |> includes content)] + let findBySelectorAndPartialTextContent element selector content = + querySelectorAll element selector + |> find (fun node -> textContent node |> includes content)] end diff --git a/ppx/test/input_reason.re b/ppx/test/input_reason.re index 13f9df79..022bfcec 100644 --- a/ppx/test/input_reason.re +++ b/ppx/test/input_reason.re @@ -33,7 +33,9 @@ module Bar = { }; }; -module type X_int = {let x: int;}; +module type X_int = { + let x: int; +}; module Func = (M: X_int) => { let x = M.x + 1; diff --git a/test/test_ml.ml b/test/test_ml.ml index 1abbc14a..e3a4ec13 100644 --- a/test/test_ml.ml +++ b/test/test_ml.ml @@ -695,7 +695,7 @@ let testChildrenMapWithIndex () = [ React.Children.mapi children (fun element index -> React.clone_element element (let open Js_of_ocaml.Js.Unsafe in - obj [| ("key", inject index); ("data-index", inject index) |])) + obj [| ("key", inject index); ("data-index", inject index) |])) ] end in withContainer (fun c ->