Fix compat types

compat/src/index.d.ts

@@ -1,7 +1,7 @@
 import * as _hooks from '../../hooks';
 import * as preact from '../../src';
 import { JSXInternal } from '../../src/jsx'
-import { ForwardFn } from './internal';
+import * as _internal from './internal';
 import * as _Suspense from './suspense';
 
 // export default React;
@@ -43,6 +43,7 @@ declare namespace React {
 	export import lazy = _Suspense.lazy;
 
 	// Compat
+	export import ForwardFn = _internal.ForwardFn;
 	export const version: string;
 
 	export function createPortal(vnode: preact.VNode, container: Element): preact.VNode<any>;
@@ -57,13 +58,13 @@ declare namespace React {
 	export function isValidElement(element: any): boolean;
 	export function findDOMNode(component: preact.Component): Element | null;
 
-	export class PureComponent<P = {}, S = {}> extends preact.Component {
+	export abstract class PureComponent<P = {}, S = {}> extends preact.Component {
 		isPureReactComponent: boolean;
 	}
 
 	export function memo<P = {}>(component: preact.FunctionalComponent<P>, comparer?: (prev: P, next: P) => boolean): preact.FunctionComponent<P>;
 
-	export function forwardRef<P = {}>(fn: ForwardFn<P, any>): preact.FunctionalComponent<P>;
+	export function forwardRef<R, P = {}>(fn: _internal.ForwardFn<P, R>): preact.FunctionalComponent<P>;
 
 	export function unstable_batchedUpdates(callback: (arg?: any) => void, arg?: any): void;
 

compat/src/internal.d.ts

@@ -1,4 +1,4 @@
-import { Ref } from '../..';
+import { Ref, ComponentChild } from '../..';
 import {
 	Component as PreactComponent,
 	VNode as PreactVNode,
@@ -28,7 +28,7 @@ export interface VNode<T = any> extends PreactVNode<T> {
 }
 
 export interface ForwardFn<P = {}, T = any> {
-	(props: P, ref: Ref<T>): VNode;
+	(props: P, ref: Ref<T>): ComponentChild;
 	displayName?: string;
 }
 

compat/src/suspense.d.ts

@@ -1,4 +1,4 @@
-import { Component } from '../../src';
+import { Component, ComponentChild } from '../../src';
 
 //
 // Suspense/lazy
@@ -10,4 +10,6 @@ export interface SuspenseProps {
   fallback: preact.ComponentChildren;
 }
 
-export class Suspense extends Component<SuspenseProps> {}
+export class Suspense extends Component<SuspenseProps> {
+	render(): ComponentChild;
+}

compat/test/ts/forward-ref.tsx

@@ -0,0 +1,21 @@
+import * as React from '../../src';
+
+const MyInput: React.ForwardFn<{ id: string }, { focus(): void }> = (props, ref) => {
+  const inputRef = React.useRef<HTMLInputElement>()
+
+  React.useImperativeHandle(ref, () => ({
+    focus: () => {
+      if (inputRef.current) {
+        inputRef.current.focus()
+      }
+    }
+  }))
+
+  return <input {...props} ref={inputRef} />
+}
+
+export const foo = React.forwardRef(MyInput)
+
+export const Bar = React.forwardRef<HTMLDivElement, { children: any }>((props, ref) => {
+	return <div ref={ref}>{props.children}</div>
+})

hooks/src/index.d.ts

@@ -1,4 +1,4 @@
-import { PreactContext } from "../..";
+import { PreactContext, Ref as PreactRef } from "../..";
 
 type Inputs = ReadonlyArray<unknown>;
 
@@ -74,7 +74,7 @@ type CreateHandle = () => object;
  * ref.current
  * @param inputs If present, effect will only activate if the values in the list change (using ===).
  */
-export function useImperativeHandle<T>(ref: Ref<T>, create: CreateHandle, inputs?: Inputs): void;
+export function useImperativeHandle<T, R extends T>(ref: PreactRef<T>, create: () => R, inputs?: Inputs): void;
 
 /**
  * Accepts a function that contains imperative, possibly effectful code.