From ee77d4879e5ef8e4bc9dc9ec45ab10ad8369b8c2 Mon Sep 17 00:00:00 2001 From: Saad Najmi Date: Fri, 13 Jan 2023 11:54:04 -0800 Subject: [PATCH] ScrollView and TextInput ViewConfig refactor --- Libraries/Components/ScrollView/ScrollView.js | 16 +-- .../ScrollView/ScrollViewNativeComponent.js | 4 + .../TextInput/RCTTextInputViewConfig.js | 16 ++- Libraries/Components/TextInput/TextInput.js | 106 +++++++++--------- 4 files changed, 72 insertions(+), 70 deletions(-) diff --git a/Libraries/Components/ScrollView/ScrollView.js b/Libraries/Components/ScrollView/ScrollView.js index c3cb5e1d34..973bf0eb91 100644 --- a/Libraries/Components/ScrollView/ScrollView.js +++ b/Libraries/Components/ScrollView/ScrollView.js @@ -370,20 +370,6 @@ type IOSProps = $ReadOnly<{| | 'never' | 'always' ), - /** - * Experimental: specifies how much to adjust the content view by when using - * the keyboard to scroll. This value adjusts the content's horizontal offset. - * - * @platform macos - */ - horizontalLineScroll?: number, // [macOS] - /** - * Experimental: specifies how much to adjust the content view by when using - * the keyboard to scroll. This value adjusts the content's vertical offset. - * - * @platform macos - */ - verticalLineScroll?: number, // [macOS] |}>; type AndroidProps = $ReadOnly<{| @@ -500,7 +486,7 @@ export type Props = $ReadOnly<{| */ invertStickyHeaders?: ?boolean, /** - * Reverses the direction of scroll. Uses native inversion on macOS and scale transforms of -1 elsewhere + * Reverses the direction of scroll. Uses native inversion on macOS and scale transforms of -1 elsewhere // [macOS] */ inverted?: ?boolean, // [macOS] /** diff --git a/Libraries/Components/ScrollView/ScrollViewNativeComponent.js b/Libraries/Components/ScrollView/ScrollViewNativeComponent.js index ec2166b7f2..879d3aa17f 100644 --- a/Libraries/Components/ScrollView/ScrollViewNativeComponent.js +++ b/Libraries/Components/ScrollView/ScrollViewNativeComponent.js @@ -146,6 +146,10 @@ const RCTScrollViewViewConfig = onMomentumScrollBegin: true, onScrollToTop: true, onScroll: true, + // [macOS + onInvertedDidChange: true, + onPreferredScrollerStyleDidChange: true, + // macOS] }), }, }; diff --git a/Libraries/Components/TextInput/RCTTextInputViewConfig.js b/Libraries/Components/TextInput/RCTTextInputViewConfig.js index af06286783..4acd36ae8f 100644 --- a/Libraries/Components/TextInput/RCTTextInputViewConfig.js +++ b/Libraries/Components/TextInput/RCTTextInputViewConfig.js @@ -131,7 +131,6 @@ const RCTTextInputViewConfig = { blurOnSubmit: true, mostRecentEventCount: true, scrollEnabled: true, - hideVerticalScrollIndicator: true, selectionColor: {process: require('../../StyleSheet/processColor')}, contextMenuHidden: true, secureTextEntry: true, @@ -143,13 +142,20 @@ const RCTTextInputViewConfig = { autoCapitalize: true, keyboardAppearance: true, passwordRules: true, - grammarCheck: true, // [macOS] spellCheck: true, selectTextOnFocus: true, text: true, clearTextOnFocus: true, showSoftInputOnFocus: true, autoFocus: true, + // [macOS + clearTextOnSubmit: true, + grammarCheck: true, + hideVerticalScrollIndicator: true, + pastedTypes: true, + submitKeyEvents: true, + tooltip: true, + // macOS] ...ConditionallyIgnoredEventHandlers({ onChange: true, onSelectionChange: true, @@ -158,6 +164,12 @@ const RCTTextInputViewConfig = { onChangeSync: true, onKeyPressSync: true, onTextInput: true, + // [macOS + onPaste: true, + onAutoCorrectChange: true, + onSpellCheckChange: true, + onGrammarCheckChange: true, + // macOS] }), }, }; diff --git a/Libraries/Components/TextInput/TextInput.js b/Libraries/Components/TextInput/TextInput.js index 78d5da8970..11f00e9098 100644 --- a/Libraries/Components/TextInput/TextInput.js +++ b/Libraries/Components/TextInput/TextInput.js @@ -327,21 +327,6 @@ type IOSProps = $ReadOnly<{| */ scrollEnabled?: ?boolean, - // [macOS - /** - * If `true`, hide vertical scrollbar on the underlying multiline scrollview - * The default value is `false`. - * @platform macos - */ - hideVerticalScrollIndicator?: ?boolean, - - /** - * If `false`, disables grammar-check. - * @platform macos - */ - grammarCheck?: ?boolean, - // macOS] - /** * If `false`, disables spell-check style (i.e. red underlines). * The default value is inherited from `autoCorrect`. @@ -370,10 +355,26 @@ export type SubmitKeyEvent = $ReadOnly<{| type MacOSProps = $ReadOnly<{| /** * If `true`, clears the text field synchronously before `onSubmitEditing` is emitted. + * * @platform macos */ clearTextOnSubmit?: ?boolean, + /** + * If `false`, disables grammar-check. + * + * @platform macos + */ + grammarCheck?: ?boolean, + + /** + * If `true`, hide vertical scrollbar on the underlying multiline scrollview + * The default value is `false`. + * + * @platform macos + */ + hideVerticalScrollIndicator?: ?boolean, + /** * Fired when a supported element is pasted * @@ -381,6 +382,36 @@ type MacOSProps = $ReadOnly<{| */ onPaste?: (event: PasteEvent) => void, + /** + * Callback that is called when the text input's autoCorrect setting changes. + * This will be called with + * `{ nativeEvent: { enabled } }`. + * Does only work with 'multiline={true}'. + * + * @platform macos + */ + onAutoCorrectChange?: ?(e: SettingChangeEvent) => mixed, + + /** + * Callback that is called when the text input's spellCheck setting changes. + * This will be called with + * `{ nativeEvent: { enabled } }`. + * Does only work with 'multiline={true}'. + * + * @platform macos + */ + onSpellCheckChange?: ?(e: SettingChangeEvent) => mixed, + + /** + * Callback that is called when the text input's grammarCheck setting changes. + * This will be called with + * `{ nativeEvent: { enabled } }`. + * Does only work with 'multiline={true}'. + * + * @platform macos + */ + onGrammarCheckChange?: ?(e: SettingChangeEvent) => mixed, + /** * Enables Paste support for certain types of pasted types * @@ -399,6 +430,13 @@ type MacOSProps = $ReadOnly<{| * @platform macos */ submitKeyEvents?: ?$ReadOnlyArray, + + /** + * Specifies the tooltip. + * + * @platform macos + */ + tooltip?: ?string, |}>; // macOS] @@ -717,38 +755,6 @@ export type Props = $ReadOnly<{| */ onChangeText?: ?(text: string) => mixed, - // [macOS - /** - * Callback that is called when the text input's autoCorrect setting changes. - * This will be called with - * `{ nativeEvent: { enabled } }`. - * Does only work with 'multiline={true}'. - * - * @platform macos - */ - onAutoCorrectChange?: ?(e: SettingChangeEvent) => mixed, - - /** - * Callback that is called when the text input's spellCheck setting changes. - * This will be called with - * `{ nativeEvent: { enabled } }`. - * Does only work with 'multiline={true}'. - * - * @platform macos - */ - onSpellCheckChange?: ?(e: SettingChangeEvent) => mixed, - - /** - * Callback that is called when the text input's grammarCheck setting changes. - * This will be called with - * `{ nativeEvent: { enabled } }`. - * Does only work with 'multiline={true}'. - * - * @platform macos - */ - onGrammarCheckChange?: ?(e: SettingChangeEvent) => mixed, - // macOS] - /** * DANGER: this API is not stable and will change in the future. * @@ -921,12 +927,6 @@ export type Props = $ReadOnly<{| */ style?: ?TextStyleProp, - // [macOS - /* - * Specifies the tooltip. - */ - tooltip?: ?string, // macOS ] - /** * The value to show for the text input. `TextInput` is a controlled * component, which means the native value will be forced to match this