fix: updated typescript

Author: surajahmed

package.json

@@ -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",

src/components/basic/StatusBar/types.ts

@@ -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/composites/Alert/types.tsx

@@ -1,8 +1,9 @@
 import type { MutableRefObject } from 'react';
-import type { IBoxProps, IIconProps } from '../../primitives';
+import type { InterfaceBoxProps } from '../../../components/primitives/Box';
+import type { IIconProps } from '../../primitives';
 import type { CustomProps, VariantType } from '../../types';
 
-export interface InterfaceAlertProps extends IBoxProps<IAlertProps> {
+export interface InterfaceAlertProps extends InterfaceBoxProps<IAlertProps> {
   /** The status of the alert
    *  @default info
    */

src/components/composites/AspectRatio/types.ts

@@ -1,8 +1,8 @@
-import type { IBoxProps } from '../../primitives/Box';
+import type { InterfaceBoxProps } from '../../primitives/Box';
 import type { CustomProps, ResponsiveValue } from '../../../components/types';
 
 export interface InterfaceAspectRatioProps
-  extends IBoxProps<IAspectRatioProps> {
+  extends InterfaceBoxProps<IAspectRatioProps> {
   /**
    * The aspect ratio of the container. Some examples are `16/9`, `16/10`, `9/16`, `4/3`
    * @default 4/3

src/components/composites/Avatar/types.tsx

@@ -1,10 +1,10 @@
-import type { IBoxProps } from '../../primitives/Box';
+import type { InterfaceBoxProps } from '../../primitives/Box';
 import type { ImageSourcePropType } from 'react-native';
 import type { MutableRefObject } from 'react';
 import type { CustomProps, ResponsiveValue } from '../../../components/types';
 import type { ISizes } from '../../../theme/base/sizes';
 
-export interface InterfaceAvatarProps extends IBoxProps<IAvatarProps> {
+export interface InterfaceAvatarProps extends InterfaceBoxProps<IAvatarProps> {
   /**
    * The image source of the avatar.
    */
@@ -20,7 +20,8 @@ export interface InterfaceAvatarProps extends IBoxProps<IAvatarProps> {
   wrapperRef?: MutableRefObject<any>;
 }
 
-export interface IAvatarBadgeProps extends IBoxProps<IAvatarBadgeProps> {}
+export interface IAvatarBadgeProps
+  extends InterfaceBoxProps<IAvatarBadgeProps> {}
 
 export interface IAvatarGroupProps extends IAvatarProps {
   /**

src/components/composites/Badge/types.tsx

@@ -1,7 +1,7 @@
 import type { CustomProps, VariantType } from '../../types';
-import type { IBoxProps } from '../../primitives';
+import type { InterfaceBoxProps } from '../../primitives/Box';
 
-export interface InterfaceBadgeProps extends IBoxProps<IBadgeProps> {
+export interface InterfaceBadgeProps extends InterfaceBoxProps<IBadgeProps> {
   /**
    * The style variant of the badge.
    * @default subtle

src/components/composites/Card/types.ts

@@ -1,5 +1,5 @@
 import type { CustomProps } from '../../../components/types/utils';
-import type { IBoxProps } from '../../primitives';
+import type { InterfaceBoxProps } from '../../primitives/Box';
 
-export interface InterfaceCardProps extends IBoxProps<ICardProps> {}
+export interface InterfaceCardProps extends InterfaceBoxProps<ICardProps> {}
 export type ICardProps = InterfaceCardProps & CustomProps<'Card'>;

src/components/composites/PinInput/PinInputField.tsx

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

src/components/composites/Tag/index.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/types.ts

@@ -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'>;