Skip to content

Commit 84341e4

Browse files
committed
[TextInput] Export TI State's focusInput/blurInput
[These two functions](https://github.com/microsoft/react-native-macos/blob/9ea059c33143e6766582a1f682e4f144e00cc740/packages/react-native/Libraries/Components/TextInput/TextInputState.js#L60C1-L70C2) are used to [properly handle onFocus\onBlur for TextInput implementations](https://github.com/microsoft/react-native-macos/blob/9ea059c33143e6766582a1f682e4f144e00cc740/packages/react-native/Libraries/Components/TextInput/TextInput.js#L1623C1-L1635C5), specifically they are used to track the currently focused TextInput control and as such cause [focusTextInput](https://github.com/microsoft/react-native-macos/blob/9ea059c33143e6766582a1f682e4f144e00cc740/packages/react-native/Libraries/Components/TextInput/TextInputState.js#L106C1-L106C48) and [blurTextInput](https://github.com/microsoft/react-native-macos/blob/9ea059c33143e6766582a1f682e4f144e00cc740/packages/react-native/Libraries/Components/TextInput/TextInputState.js#L143C1-L143C69) to skip native focus\blur calls if the JS side thinks the control in question is already focused\blurred. In other words, if someone wants to build a custom `<TextInput>` from the ground up, they can't expect `focusTextInput`, `blurTextInput`, and `currentlyFocusedInput` (the last one which is especially already used in a bunch of places in the framework) to work properly. This change exports the necessary `focusInput` and `blurInput` out of [TextInput](https://github.com/microsoft/react-native-macos/blob/9ea059c33143e6766582a1f682e4f144e00cc740/packages/react-native/Libraries/Components/TextInput/TextInput.js#L2041C1-L2048C3) statics.
1 parent 9ea059c commit 84341e4

3 files changed

Lines changed: 20 additions & 0 deletions

File tree

packages/react-native/Libraries/Components/TextInput/TextInput.d.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1089,6 +1089,22 @@ interface TextInputState {
10891089
* noop if it wasn't focused
10901090
*/
10911091
blurTextInput(textField?: HostInstance): void;
1092+
1093+
// [macOS
1094+
/**
1095+
* @param textField ref of the text field that was focused
1096+
* Call on custom implementations of TextInput to notify the control was focused
1097+
* noop if it was already focused
1098+
*/
1099+
onTextInputFocus(textField?: HostInstance): void;
1100+
1101+
/**
1102+
* @param textField ref of the text field that was blurred
1103+
* Call on custom implementations of TextInput to notify the control was blurred
1104+
* noop if it wasn't focused
1105+
*/
1106+
onTextInputBlur(textField?: HostInstance): void;
1107+
// macOS]
10921108
}
10931109

10941110
/**

packages/react-native/Libraries/Components/TextInput/TextInput.flow.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1255,6 +1255,8 @@ export type TextInputComponentStatics = $ReadOnly<{|
12551255
currentlyFocusedField: () => ?number,
12561256
focusTextInput: (textField: ?HostInstance) => void,
12571257
blurTextInput: (textField: ?HostInstance) => void,
1258+
onTextInputFocus: (textField: ?HostInstance) => void, // [macOS]
1259+
onTextInputBlur: (textField: ?HostInstance) => void, // [macOS]
12581260
|}>,
12591261
|}>;
12601262

packages/react-native/Libraries/Components/TextInput/TextInput.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2045,6 +2045,8 @@ ExportedForwardRef.State = {
20452045
currentlyFocusedField: TextInputState.currentlyFocusedField,
20462046
focusTextInput: TextInputState.focusTextInput,
20472047
blurTextInput: TextInputState.blurTextInput,
2048+
onTextInputFocus: TextInputState.focusInput, // [macOS]
2049+
onTextInputBlur: TextInputState.blurInput, // [macOS]
20482050
};
20492051

20502052
export type TextInputComponentStatics = $ReadOnly<{|

0 commit comments

Comments
 (0)