aboutsummaryrefslogtreecommitdiff
path: root/src/View/Form
diff options
context:
space:
mode:
Diffstat (limited to 'src/View/Form')
-rw-r--r--src/View/Form/Autocomplete.ml36
1 files changed, 20 insertions, 16 deletions
diff --git a/src/View/Form/Autocomplete.ml b/src/View/Form/Autocomplete.ml
index 537316d..324a834 100644
--- a/src/View/Form/Autocomplete.ml
+++ b/src/View/Form/Autocomplete.ml
@@ -1,11 +1,8 @@
let search s xs =
- if s == "" then
- [| |]
- else
- let results = Js.Array.filter (Js.String.includes s) xs in
- if Js.Array.length results == 1 && results.(0) == s then [| |] else results
+ let results = Js.Array.filter (Js.String.includes s) xs in
+ if Js.Array.length results == 1 && results.(0) == s then [| |] else results
-let render_completion on_select entries =
+let render_completion render_entry on_select entries =
H.div
[| HA.class_ "g-Autocomplete__Completion" |]
(entries
@@ -13,11 +10,14 @@ let render_completion on_select entries =
H.button
[| HA.class_ "g-Autocomplete__Entry"
; HA.type_ "button"
- ; HE.on_click (fun _ -> on_select c)
+ ; HE.on_click (fun e ->
+ let () = Event.stop_propagation e in
+ let () = Event.prevent_default e in
+ on_select c)
|]
- [| H.text c |]))
+ (render_entry c)))
-let create id label values on_input attrs =
+let create attrs id values render_entry on_input =
let completion =
H.div [| |] [| |]
@@ -26,6 +26,7 @@ let create id label values on_input attrs =
let update_completion target value =
let entries = search value values in
Element.mount_on completion (render_completion
+ render_entry
(fun selected ->
let () = Element.set_value target selected in
let () = Element.remove_children completion in
@@ -33,15 +34,13 @@ let create id label values on_input attrs =
entries)
in
+ let hide_completion () =
+ Element.mount_on completion (H.text "")
+ in
+
H.div
[| HA.class_ "g-Autocomplete" |]
- [| H.div
- [| HA.class_ "g-Form__Label" |]
- [| H.label
- [| HA.for_ id |]
- [| H.text label |]
- |]
- ; H.input
+ [| H.input
(Js.Array.concat
[| HA.id id
; HA.class_ "g-Autocomplete__Input"
@@ -55,6 +54,11 @@ let create id label values on_input attrs =
let value = Element.value target in
let () = update_completion target value in
on_input value)
+ ; HE.on_blur (fun _ ->
+ let _ = Js.Global.setTimeout
+ (fun _ -> hide_completion ())
+ 100
+ in ())
|]
attrs)
[| |]