wip

.changeset/rare-fishes-speak.md

@@ -0,0 +1,5 @@
+---
+"react-fast-hoc": patch
+---
+
+Fix `wrapIntoProxy` type issue

.gitignore

@@ -37,3 +37,4 @@ yarn-error.log*
 
 **/lib
 /packages/react-fast-hoc/README.md
+**/*.tsbuildinfo

packages/react-fast-hoc/package.json

@@ -20,9 +20,9 @@
   "types": "./lib/index.d.ts",
   "module": "./lib/esm/index.mjs",
   "scripts": {
-    "test": "vitest run",
+    "test": "vitest run && tsc --project tsconfig.node.json",
     "test:watch": "vitest watch",
-    "typecheck": "tsc --noEmit --diagnostics",
+    "typecheck": "tsc --noEmit",
     "lint": "pnpm typecheck",
     "build:collect-readme": "cpx ../../README.md .",
     "build": "pnpm build:collect-readme & rollup -c"

packages/react-fast-hoc/src/handlers/rewriteCall.ts

@@ -1,6 +1,6 @@
 import type React from "react";
 
-type ComponentArgs = [props: object, ref: React.Ref<unknown>];
+type ComponentArgs = [props: Record<any, unknown>, ref: React.Ref<unknown>];
 
 export class RewriteCall implements ProxyHandler<Function> {
   constructor(

packages/react-fast-hoc/src/index.test.ts

@@ -2,8 +2,8 @@ import { cleanup, render } from "@testing-library/react";
 import { Objects } from "hotscript";
 import React, { createElement, forwardRef, memo } from "react";
 import { Function } from "ts-toolbelt";
-import { afterEach, describe, expect, test, vi } from "vitest";
-import { createTransformProps } from ".";
+import { afterEach, describe, expect, expectTypeOf, test, vi } from "vitest";
+import { createTransformProps, transformProps, wrapIntoProxy } from ".";
 
 const identityProps = <T>(props: T) => props;
 
@@ -131,7 +131,7 @@ describe("transformProps", () => {
   // test("works with unloaded lazy", async () => {
   //   const Cmp = vi.fn(Component);
   //   const Lazy = React.lazy(() => Promise.resolve({ default: Cmp }));
-  
+
   //   console.log(Lazy._payload._result.toString());
   //   console.log(Lazy._init.toString());
   //   render(
@@ -150,3 +150,30 @@ describe("transformProps", () => {
   //   });
   // });
 });
+
+describe.skip("type tests", () => {
+  expectTypeOf(() =>
+    transformProps(
+      {} as React.ForwardRefExoticComponent<{
+        ref?: React.Ref<number>;
+      }>,
+      identityProps
+    )
+  )
+    .returns.parameter(0)
+    .toEqualTypeOf<{
+      ref?: React.Ref<number>;
+    }>();
+
+  expectTypeOf(() =>
+    wrapIntoProxy({})(
+      {} as React.ForwardRefExoticComponent<{
+        ref?: React.Ref<number>;
+      }>
+    )
+  )
+    .returns.parameter(0)
+    .toEqualTypeOf<{
+      ref?: React.Ref<number>;
+    }>();
+});

packages/react-fast-hoc/src/index.ts

@@ -1,6 +1,8 @@
 export * from "./createHoc";
 export * from "./createTransformProps";
 export * from "./handlers";
+export { isRef } from "./internals";
 export * from "./transformProps";
 export type * from "./type";
 export * from "./wrapIntoHoc";
+

packages/react-fast-hoc/src/internals.ts

@@ -2,6 +2,11 @@ import type { ReactNode, Ref } from "react";
 import type { HocTransformer, MimicToNewComponentHandler } from "./handlers";
 import { isClassComponent, toFunctional, type Get } from "./toFunctional";
 
+export const isRef = <T = unknown>(maybeRef: unknown): maybeRef is Ref<T> =>
+  maybeRef === null ||
+  typeof maybeRef === "function" ||
+  (!!maybeRef && typeof maybeRef === "object" && "current" in maybeRef);
+
 export const wrapPropsTransformer =
   <T extends object, R extends object>(transformer: (arg: T) => R) =>
   (args: [Omit<T, "ref">, Get<T, "ref">]) => {
@@ -10,23 +15,20 @@ export const wrapPropsTransformer =
     // so wrapping it into props transform hoc has overhead
     const props = Object.assign(Object.create(null), _props);
 
-    const isRealRef =
-      ref === null ||
-      typeof ref === "function" ||
-      (ref && typeof ref === "object" && "current" in ref);
-    if (isRealRef) {
+    const hasRef = isRef(ref);
+    if (hasRef) {
       (props as any).ref = ref;
     }
 
     type RealProps = T & { ref: Get<T, "ref"> };
 
     const resultProps = transformer(props as RealProps);
-    const resultRef = isRealRef && "ref" in resultProps && resultProps["ref"];
-    if (isRealRef) {
+    const resultRef = "ref" in resultProps && resultProps["ref"];
+    if ("ref" in resultProps) {
       delete (resultProps as R & { ref?: unknown }).ref;
     }
 
-    return [resultProps, isRealRef && resultRef ? resultRef : ref] as const;
+    return [resultProps, hasRef && isRef(resultRef) ? resultRef : ref] as const;
   };
 
 const REACT_MEMO_TYPE = Symbol.for("react.memo");

packages/react-fast-hoc/src/wrapIntoHoc.ts

@@ -8,7 +8,7 @@ import type { PropsBase, WrappedComponent } from "./type";
  */
 export const wrapIntoProxy =
   (proxy: ProxyHandler<Function>) =>
-  <T extends React.ComponentType>(Component: T) =>
+  <T extends React.ComponentType<any>>(Component: T) =>
     wrapComponentIntoHoc(
       Component,
       proxy as HocTransformer,

packages/react-fast-hoc/tsconfig.json

@@ -1,5 +1,13 @@
 {
   "extends": "tsconfig/react-library.json",
   "include": ["./src"],
-  "exclude": ["dist", "lib", "build", "node_modules"]
+  "exclude": [
+    "**/*.test.*",
+    "**/*.spec.*",
+    "__tests__",
+    "dist",
+    "lib",
+    "build",
+    "node_modules"
+  ]
 }

packages/react-fast-hoc/tsconfig.node.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "module": "ESNext",
+    "noEmit": true,
+    "moduleResolution": "Node",
+    "rootDir": ".",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["./src", "./typeTests"],
+  "extends": "tsconfig/react-library.json"
+}