fix

Author: yoyo837

src/Immutable.tsx

@@ -6,6 +6,8 @@ export type CompareProps<T extends React.ComponentType<any>> = (
   nextProps: Readonly<React.ComponentProps<T>>,
 ) => boolean;
 
+type ImmutableProps<T extends React.ComponentType<any>> = Omit<React.ComponentProps<T>, 'ref'>;
+
 /**
  * Create Immutable pair for `makeImmutable` and `responseImmutable`.
  */
@@ -32,24 +34,24 @@ export default function createImmutable() {
   function makeImmutable<T extends React.ComponentType<any>>(
     Component: T,
     shouldTriggerRender?: CompareProps<T>,
-  ): T {
+  ): React.ComponentType<React.ComponentProps<T>> {
     const refAble = supportRef(Component);
 
-    const ImmutableComponent = function (props: any, ref: any) {
+    const ImmutableComponent = (props: ImmutableProps<T>, ref: React.Ref<any>) => {
       const refProps = refAble ? { ref } : {};
       const renderTimesRef = React.useRef(0);
       const prevProps = React.useRef(props);
 
       // If parent has the context, we do not wrap it
       const mark = useImmutableMark();
       if (mark !== null) {
-        return <Component {...props} {...refProps} />;
+        return <Component {...(props as any)} {...refProps} />;
       }
 
       if (
         // Always trigger re-render if not provide `notTriggerRender`
         !shouldTriggerRender ||
-        shouldTriggerRender(prevProps.current, props)
+        shouldTriggerRender(prevProps.current as any, props as any)
       ) {
         renderTimesRef.current += 1;
       }
@@ -58,7 +60,7 @@ export default function createImmutable() {
 
       return (
         <ImmutableContext.Provider value={renderTimesRef.current}>
-          <Component {...props} {...refProps} />
+          <Component {...(props as any)} {...refProps} />
         </ImmutableContext.Provider>
       );
     };
@@ -67,7 +69,9 @@ export default function createImmutable() {
       ImmutableComponent.displayName = `ImmutableRoot(${Component.displayName || Component.name})`;
     }
 
-    return refAble ? React.forwardRef(ImmutableComponent) : (ImmutableComponent as any);
+    return refAble
+      ? (React.forwardRef(ImmutableComponent) as React.ComponentType<React.ComponentProps<T>>)
+      : (ImmutableComponent as unknown as React.ComponentType<React.ComponentProps<T>>);
   }
 
   /**
@@ -77,14 +81,13 @@ export default function createImmutable() {
   function responseImmutable<T extends React.ComponentType<any>>(
     Component: T,
     propsAreEqual?: CompareProps<T>,
-  ): T {
+  ): React.ComponentType<React.ComponentProps<T>> {
     const refAble = supportRef(Component);
 
-    const ImmutableComponent = function (props: any, ref: any) {
+    const ImmutableComponent = (props: ImmutableProps<T>, ref: React.Ref<any>) => {
       const refProps = refAble ? { ref } : {};
       useImmutableMark();
-
-      return <Component {...props} {...refProps} />;
+      return <Component {...(props as any)} {...refProps} />;
     };
 
     if (process.env.NODE_ENV !== 'production') {
@@ -94,8 +97,12 @@ export default function createImmutable() {
     }
 
     return refAble
-      ? React.memo(React.forwardRef(ImmutableComponent), propsAreEqual)
-      : (React.memo(ImmutableComponent, propsAreEqual) as any);
+      ? (React.memo(React.forwardRef(ImmutableComponent), propsAreEqual) as React.ComponentType<
+          React.ComponentProps<T>
+        >)
+      : (React.memo(ImmutableComponent, propsAreEqual) as unknown as React.ComponentType<
+          React.ComponentProps<T>
+        >);
   }
 
   return {