Skip to content

Resolve "fix: focus loose in dev build"

Mohamed Amer requested to merge 108-fix-focus-loose-in-dev-build into main

Closes #108 (closed)

I find a way to persist the updated input values without re-rendering the app which is the main cause of losing the focus by using useRef Hook.

Currently, values for TextEditor and TextAreaEditor are updated without loosing focus, also triggers onChange={(event) => handleChange(event.target.value, quad)} that update the quad with the updated value.

Considering multiline attribute in TextAreaEditor still cause an issue that is when active it always place the curoser to the start if the text after any update.

I find a way to persist the updated input values without re-rendering the app, which typically causes focus loss, by using the useRef Hook.

Currently, the values for TextEditor and TextAreaEditor are updated without losing focus. This also triggers the onChange={(event) => handleChange(event.target.value, quad)} function from roger.js, which updates the quad with the new value.

However, there is still an issue with the multiline attribute in TextAreaEditor. When it is active, the cursor always moves to the start of the text after any update.

Merge request reports