Differential D8001 Diff 27104 native/account/registration/registration-text-input.react.js

Changeset View

Standalone View

native/account/registration/registration-text-input.react.js

// @flow		// @flow

import * as React from 'react';		import * as React from 'react';
import { TextInput } from 'react-native';		import { TextInput } from 'react-native';

import { useStyles, useColors } from '../../themes/colors.js';		import {
		useStyles,
		useColors,
		useKeyboardAppearance,
		} from '../../themes/colors.js';

type Props = React.ElementConfig<typeof TextInput>;		type Props = React.ElementConfig<typeof TextInput>;

function ForwardedRegistrationTextInput(props: Props, ref): React.Node {		function ForwardedRegistrationTextInput(props: Props, ref): React.Node {
const { onFocus, onBlur, style, placeholderTextColor, ...rest } = props;		const {
		onFocus,
		onBlur,
		style,
		placeholderTextColor,
		keyboardAppearance,
		...rest
		} = props;

const [focused, setFocused] = React.useState(false);		const [focused, setFocused] = React.useState(false);
const ourOnFocus = React.useCallback(		const ourOnFocus = React.useCallback(
event => {		event => {
setFocused(true);		setFocused(true);
onFocus?.(event);		onFocus?.(event);
},		},
[onFocus],		[onFocus],
Show All 14 Lines	() =>
: [styles.textInput, style],		: [styles.textInput, style],
[focused, styles.textInput, styles.focusedTextInput, style],		[focused, styles.textInput, styles.focusedTextInput, style],
);		);

const colors = useColors();		const colors = useColors();
const ourPlaceholderTextColor =		const ourPlaceholderTextColor =
placeholderTextColor ?? colors.panelSecondaryForegroundBorder;		placeholderTextColor ?? colors.panelSecondaryForegroundBorder;

		const themeKeyboardAppearance = useKeyboardAppearance();
		const ourKeyboardAppearance = keyboardAppearance ?? themeKeyboardAppearance;

return (		return (
<TextInput		<TextInput
{...rest}		{...rest}
style={ourStyle}		style={ourStyle}
placeholderTextColor={ourPlaceholderTextColor}		placeholderTextColor={ourPlaceholderTextColor}
onFocus={ourOnFocus}		onFocus={ourOnFocus}
onBlur={ourOnBlur}		onBlur={ourOnBlur}
		keyboardAppearance={ourKeyboardAppearance}
ref={ref}		ref={ref}
/>		/>
);		);
}		}

const unboundStyles = {		const unboundStyles = {
textInput: {		textInput: {
color: 'panelForegroundLabel',		color: 'panelForegroundLabel',
Show All 24 Lines