Added feature for passing a custom container component (patch included)

[ahansson89]

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch react-native-otp-inputs@7.4.0 for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-otp-inputs/src/index.tsx b/node_modules/react-native-otp-inputs/src/index.tsx
index 7fd9e45..16a7b5f 100644
--- a/node_modules/react-native-otp-inputs/src/index.tsx
+++ b/node_modules/react-native-otp-inputs/src/index.tsx
@@ -20,6 +20,7 @@ import {
   TextStyle,
   View,
   ViewStyle,
+  
 } from 'react-native';
 
 import { fillOtpCode } from './helpers';
@@ -39,6 +40,7 @@ type Props = TextInputProps & {
   defaultValue?: string;
   handleChange: (otpCode: string) => void;
   inputContainerStyles?: StyleProp<ViewStyle>;
+  containerComponent?: React.ComponentType<any>;
   inputStyles?: StyleProp<TextStyle>;
   isRTL?: boolean;
   numberOfInputs: number;
@@ -75,6 +77,7 @@ const OtpInputs = forwardRef<OtpInputsRef, Props>(
       selectTextOnFocus = true,
       style,
       testIDPrefix = 'otpInput',
+      containerComponent: ContainerComponent = React.Fragment,
       ...restProps
     },
     ref,
@@ -244,7 +247,8 @@ const OtpInputs = forwardRef<OtpInputsRef, Props>(
         }
 
         return (
-          <OtpInput
+          <ContainerComponent>
+            <OtpInput
             accessible
             accessibilityLabel={`${testIDPrefix}-${inputIndex}`}
             autoCapitalize={autoCapitalize}
@@ -272,7 +276,8 @@ const OtpInputs = forwardRef<OtpInputsRef, Props>(
             selectTextOnFocus={selectTextOnFocus}
             testID={`${testIDPrefix}-${inputIndex}`}
             {...restProps}
-          />
+          /></ContainerComponent>
+          
         );
       });
     };

This issue body was partially generated by patch-package.