Fix how we render TextField children (#2369)

Author: ethanshar

src/components/picker/index.tsx

@@ -248,7 +248,7 @@ const Picker = React.forwardRef((props: PickerProps, ref) => {
       );
     } else if (fieldType === PickerFieldTypes.settings) {
       return (
-        <View row spread>
+        <View flex row spread>
           <Text text70 style={labelStyle}>
             {others.label}
           </Text>

src/incubator/TextField/index.tsx

@@ -130,7 +130,7 @@ const TextField = (props: InternalTextFieldProps) => {
         <View style={[paddings, fieldStyle]} row centerV centerH={centered}>
           {/* <View row centerV> */}
           {leadingAccessoryClone}
-          <View flex={!centered} flexG={centered} /* flex row */>
+          {children || <View flex={!centered} flexG={centered} /* flex row */>
             {floatingPlaceholder && (
               <FloatingPlaceholder
                 placeholder={placeholder}
@@ -142,19 +142,17 @@ const TextField = (props: InternalTextFieldProps) => {
                 testID={`${props.testID}.floatingPlaceholder`}
               />
             )}
-            {children || (
-              <Input
-                placeholderTextColor={hidePlaceholder ? 'transparent' : placeholderTextColor}
-                {...others}
-                style={[typographyStyle, colorStyle, others.style]}
-                onFocus={onFocus}
-                onBlur={onBlur}
-                onChangeText={onChangeText}
-                placeholder={placeholder}
-                hint={hint}
-              />
-            )}
-          </View>
+            <Input
+              placeholderTextColor={hidePlaceholder ? 'transparent' : placeholderTextColor}
+              {...others}
+              style={[typographyStyle, colorStyle, others.style]}
+              onFocus={onFocus}
+              onBlur={onBlur}
+              onChangeText={onChangeText}
+              placeholder={placeholder}
+              hint={hint}
+            />
+          </View>}
           {trailingAccessory}
           {/* </View> */}
         </View>