Skip to content

Commit

Permalink
Merge pull request #21 from pac-guerreiro/fix/pac-guerreiro/web-texti…
Browse files Browse the repository at this point in the history
…nput-cursor-jumps-to-start-on-type-change

fix(web)[TextInput]: cursor jumps to the start when secureTextEntry i…
  • Loading branch information
NikkiWines authored Aug 4, 2023
2 parents 1fe5266 + 1659c4d commit 04c6cbd
Showing 1 changed file with 22 additions and 10 deletions.
32 changes: 22 additions & 10 deletions packages/react-native-web/src/exports/TextInput/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -192,6 +192,15 @@ const TextInput: React.AbstractComponent<

const dimensions = React.useRef({ height: null, width: null });
const hostRef = React.useRef(null);
const prevSelection = React.useRef(null);
const prevSecureTextEntry = React.useRef(false);

React.useEffect(() => {
if (hostRef.current && prevSelection.current) {
setSelection(hostRef.current, prevSelection.current);
}
prevSecureTextEntry.current = secureTextEntry;
}, [secureTextEntry]);

const handleContentSizeChange = React.useCallback(
(hostNode) => {
Expand Down Expand Up @@ -323,18 +332,21 @@ const TextInput: React.AbstractComponent<
}

function handleSelectionChange(e) {
if (onSelectionChange) {
try {
const node = e.target;
const { selectionStart, selectionEnd } = node;
e.nativeEvent.selection = {
start: selectionStart,
end: selectionEnd
};
try {
const { selectionStart, selectionEnd } = e.target;
const selection = {
start: selectionStart,
end: selectionEnd
};
if (onSelectionChange) {
e.nativeEvent.selection = selection;
e.nativeEvent.text = e.target.value;
onSelectionChange(e);
} catch (e) {}
}
}
if (prevSecureTextEntry.current === secureTextEntry) {
prevSelection.current = selection;
}
} catch (e) {}
}

useLayoutEffect(() => {
Expand Down

0 comments on commit 04c6cbd

Please sign in to comment.