Added Text Input Component

Author: lfernandezs

src/components/index.ts

@@ -8,3 +8,4 @@ export { default as IconButton } from './main/IconButton';
 export { default as Checkbox } from './main/Checkbox';
 export { default as Radio } from './main/Radio';
 export { default as FormControl } from './main/FormControl';
+export { default as TextInput } from './main/TextInput';

src/components/main/TextInput/index.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { TextInput as TextInputRN } from 'react-native';
+import { useComponentPropsResolver, useStyleFromPropsResolver } from '../../../hooks';
+import type { ITextInputProps } from './types';
+
+const TextInput = ( props: ITextInputProps ) => {
+	const resolvedProps = useComponentPropsResolver( 'TextInput', props );
+	const [ style, restProps ] = useStyleFromPropsResolver( 'TextInput', resolvedProps );
+	return <TextInputRN style={style} {...restProps}/>;
+};
+
+export default TextInput;

src/components/main/TextInput/types.ts

@@ -0,0 +1,4 @@
+import type { TextInputProps } from 'react-native';
+import type { ComponentStyledProps } from '../../../core/components/types';
+
+export interface ITextInputProps extends Omit<TextInputProps, 'textAlign'>, ComponentStyledProps<'TextInput'> {}

src/core/components/types/common.ts

@@ -1,7 +1,7 @@
 import type { StyledProps } from '../../theme/types';
 
 export type ComponentName = 'Text' | 'Box' | 'Stack' | 'Button' | 'Pressable' | 'Icon' | 'Checkbox'
-| 'IconButton' | 'Radio' | 'FormControl';
+| 'IconButton' | 'Radio' | 'FormControl' | 'TextInput';
 
 export type VariantName = string;
 

src/index.tsx

@@ -15,6 +15,7 @@ export {
 	Text,
 	Checkbox,
 	Radio,
-	FormControl
+	FormControl,
+	TextInput
 } from './components';
 export { UIKitIcon };

tests/components/main/TextInput.test.js

@@ -0,0 +1,20 @@
+import { render } from '@testing-library/react-native';
+import React from 'react';
+import TextInput from '../../../src/components/main/TextInput';
+import WithThemeProvider from '../../support/withThemeProvider';
+
+const { itBehavesLike } = require( '../../support/sharedExamples' );
+
+describe( 'TextInput', () => {
+	const renderTextInput = props => render(
+		<TextInput testID='test-text-input' {...props} />,
+		{ wrapper: WithThemeProvider }
+	);
+
+	itBehavesLike( 'aStyledSystemComponent',
+		{
+			renderComponent: props => renderTextInput( props ),
+			testId: 'test-text-input',
+			omitProps: [ 'gap', 'tintColor' ]
+		} );
+} );