fix: merge conflict resolved

Author: surajahmed

example/yarn.lock

@@ -89,7 +89,7 @@
     "release-it": "^13.5.8",
     "rollup": "^2.34.1",
     "rollup-plugin-flow": "^1.1.1",
-    "typescript": "4.2",
+    "typescript": "4.6",
     "visualize-bundle": "^1.4.0"
   },
   "peerDependencies": {
@@ -182,7 +182,6 @@
     "@react-native-aria/combobox": "^0.2.4-alpha.0",
     "@react-native-aria/focus": "^0.2.4",
     "@react-native-aria/interactions": "^0.2.2",
-    "@react-native-aria/listbox": "0.2.4-alpha.3",
     "@react-native-aria/overlays": "0.3.3-rc.0",
     "@react-native-aria/radio": "^0.2.4",
     "@react-native-aria/slider": "^0.2.5-alpha.1",

package.json

@@ -4,3 +4,5 @@ import type { CustomProps } from '../../../components/types';
 export interface InterfaceStatusBarProps extends StatusBarProps {}
 export type IStatusBarProps = InterfaceStatusBarProps &
   CustomProps<'StatusBar'>;
+
+export type IStatusBarComponentType = (props: IStatusBarProps) => JSX.Element;

src/components/basic/StatusBar/types.ts

@@ -50,6 +50,7 @@ const PinInputFiled = (
   }
   return (
     <Input
+      //@ts-ignore
       ref={mergeRefs([myRef, ref])}
       {...context}
       {...props}

src/components/composites/PinInput/PinInputField.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import Box from '../../primitives/Box';
 import { useThemeProps } from '../../../hooks';
-import type { ITagProps } from './types';
+import type { IInputComponentType, ITagProps } from './types';
 import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
 
 const Tag = ({ style, ...props }: ITagProps, ref: any) => {
@@ -13,5 +13,5 @@ const Tag = ({ style, ...props }: ITagProps, ref: any) => {
   return <Box style={style} {...resolvedProps} ref={ref} />;
 };
 
-export default React.memo(React.forwardRef(Tag));
+export default React.memo(React.forwardRef(Tag)) as IInputComponentType;
 export type { ITagProps };

src/components/composites/Tag/index.tsx

@@ -7,4 +7,6 @@ export interface InterfaceTagProps extends InterfaceBoxProps<ITagProps> {
   size?: string | number;
 }
 
+export type IInputComponentType = (props: ITagProps) => JSX.Element;
+
 export type ITagProps = InterfaceTagProps & CustomProps<'Tag'>;

src/components/composites/Tag/types.ts

@@ -180,13 +180,3 @@ export type IButtonComponentType = ((
 };
 
 export type IButtonProps = InterfaceButtonProps & CustomProps<'Button'>;
-
-// const a: IButtonProps = {
-//   size:'' ;
-// }
-// type myProps = CustomProps<'Input'>;
-// export type IInputProps = InterfaceInputProps & CustomProps<'Input'>;
-
-// const a: IButtonProps = {
-//   m
-// };

src/components/primitives/Button/types.ts

@@ -21,6 +21,7 @@ const Icon = ({ as, ...props }: IIconProps, ref?: any) => {
       ? (resolvedProps) =>
           React.cloneElement(as, {
             ...resolvedProps,
+            //@ts-ignore
             ...as.props,
           })
       : as

src/components/primitives/Icon/Icon.tsx

@@ -109,10 +109,10 @@ const InputAdvance = (
         disableFocusHandling
         ref={ref}
         variant="unstyled"
-        onFocus={(e) => {
+        onFocus={(e: any) => {
           handleFocus(true, onFocus ? () => onFocus(e) : () => {});
         }}
-        onBlur={(e) => {
+        onBlur={(e: any) => {
           handleFocus(false, onBlur ? () => onBlur(e) : () => {});
         }}
         shadow="none"

src/components/primitives/Input/InputAdvanced.tsx

@@ -1,4 +1,13 @@
 export { InputGroup } from './InputGroup';
 export { InputRightAddon, InputLeftAddon } from './InputAddons';
-export type { IInputProps } from './types';
-export { default as Input } from './Input';
+export type { IInputGroupProps, IInputProps } from './types';
+
+import InputMain from './Input';
+import type { IInputComponentType } from './types';
+
+const InputTemp: any = InputMain;
+
+// To add typings
+const Input = InputTemp as IInputComponentType;
+
+export { Input };