@@ -58,7 +58,7 @@ let useWindowWidth: unit => int = %raw(
5858 }
5959 return null;
6060 }
61- ` // Empty array ensures that effect is only run on mount and unmount
61+ `
6262)
6363
6464/* The module for interacting with the imperative CodeMirror API */
@@ -112,7 +112,7 @@ module CM = {
112112 @bs. send
113113 external setGutterMarker : (t , int , string , Dom .element ) => unit = "setGutterMarker"
114114
115- @bs. send external clearGutter : (t , string ) => unit = ""
115+ @bs. send external clearGutter : (t , string ) => unit = "clearGutter "
116116
117117 type markPos = {
118118 line : int ,
@@ -211,7 +211,8 @@ module Error = {
211211
212212module GutterMarker = {
213213 // Note: this is not a React component
214- let make = (~rowCol : (int , int ), ~kind : Error .kind , ~wrapper : Dom .element , ()): Dom .element => { // row, col
214+ let make = (~rowCol : (int , int ), ~kind : Error .kind , ()): Dom .element => {
215+ // row, col
215216 open DomUtil
216217
217218 let marker = createElement ("div" )
@@ -269,7 +270,7 @@ let updateErrors = (~state: state, ~onMarkerFocus=?, ~onMarkerFocusLeave=?, ~cm:
269270 open DomUtil
270271 open Error
271272
272- let marker = GutterMarker .make (~rowCol = (e .row , e .column ), ~kind = e .kind , ~ wrapper , ())
273+ let marker = GutterMarker .make (~rowCol = (e .row , e .column ), ~kind = e .kind , ())
273274
274275 wrapper -> appendChild (marker )
275276
@@ -361,13 +362,13 @@ let make = // props relevant for the react wrapper
361362 ~lineWrapping = false ,
362363): React .element => {
363364 let inputElement = React .useRef (Js .Nullable .null )
364- let cmRef : React .Ref . t <option <CM .t >> = React .useRef (None )
365+ let cmRef : React .ref <option <CM .t >> = React .useRef (None )
365366 let cmStateRef = React .useRef ({marked : []})
366367
367368 let windowWidth = useWindowWidth ()
368369
369370 React .useEffect0 (() =>
370- switch inputElement -> React . Ref .current -> Js .Nullable .toOption {
371+ switch inputElement .current -> Js .Nullable .toOption {
371372 | Some (input ) =>
372373 let options = CM .Options .t (
373374 ~theme = "material" ,
@@ -399,14 +400,14 @@ let make = // props relevant for the react wrapper
399400 // so we need to set the initial value imperatively
400401 cm -> CM .setValue (value )
401402
402- React . Ref . setCurrent ( cmRef , Some (cm ) )
403+ cmRef . current = Some (cm )
403404
404405 let cleanup = () => {
405406 /* Js.log2("cleanup", options->CM.Options.mode); */
406407
407408 // This will destroy the CM instance
408409 cm -> CM .toTextArea
409- React . Ref . setCurrent ( cmRef , None )
410+ cmRef . current = None
410411 }
411412
412413 Some (cleanup )
@@ -428,12 +429,12 @@ let make = // props relevant for the react wrapper
428429 By checking if the local state of the CM instance is different
429430 to the input value, we can sync up both states accordingly
430431 */
431- switch cmRef -> React . Ref .current {
432+ switch cmRef .current {
432433 | Some (cm ) =>
433434 if CM .getValue (cm ) === value {
434435 ()
435436 } else {
436- let state = cmStateRef -> React . Ref .current
437+ let state = cmStateRef .current
437438 cm -> CM .operation (() =>
438439 updateErrors (~onMarkerFocus ?, ~onMarkerFocusLeave ?, ~state , ~cm , errors )
439440 )
@@ -454,8 +455,8 @@ let make = // props relevant for the react wrapper
454455 })-> Js .Array2 .joinWith (";" )
455456
456457 React .useEffect1 (() => {
457- let state = cmStateRef -> React . Ref .current
458- switch cmRef -> React . Ref .current {
458+ let state = cmStateRef .current
459+ switch cmRef .current {
459460 | Some (cm ) =>
460461 cm -> CM .operation (() =>
461462 updateErrors (~onMarkerFocus ?, ~onMarkerFocusLeave ?, ~state , ~cm , errors )
@@ -470,7 +471,7 @@ let make = // props relevant for the react wrapper
470471 a codemirror instance, or the window has been resized.
471472 */
472473 React .useEffect2 (() => {
473- switch cmRef -> React . Ref .current {
474+ switch cmRef .current {
474475 | Some (cm ) => cm -> CM .refresh
475476 | None => ()
476477 }
0 commit comments