@reckona/mreact-compat 0.0.86 → 0.0.88

package/dist/react-default.js

@@ -0,0 +1,68 @@
+import { Component, PureComponent, } from "./class-component.js";
+import { Fragment, Activity, Profiler, Suspense, SuspenseList, StrictMode, Children, cloneElement, createElement, createErrorBoundary, createPortal, createRef, forwardRef, isValidElement, lazy, memo, } from "./element.js";
+import { createContext, renderContextConsumerToString, renderContextProviderToString, useContext, } from "./context.js";
+import { applyStreamingHydrationFragments, createRoot, createStreamingHydrationRoot, enableEventHydrationManifestReplay, enableHydrationEventReplay, flushSync, hydrateRoot, queueHydrationEvent, readEventHydrationManifest, render, unmountComponentAtNode, } from "./render.js";
+import { useCallback, useDebugValue, useDeferredValue, useEffectEvent, useEffect, useId, useImperativeHandle, useInsertionEffect, useLayoutEffect, useMemo, useOptimistic, useReducer, useRef, useState, useSyncExternalStore, use, useActionState, act, cache, cacheSignal, captureOwnerStack, renderToString, startTransition, unstable_useCacheRefresh, useTransition, version, } from "./hooks.js";
+const ReactCompat = {
+    Component,
+    PureComponent,
+    Fragment,
+    Activity,
+    Profiler,
+    Suspense,
+    SuspenseList,
+    StrictMode,
+    Children,
+    cloneElement,
+    createElement,
+    createErrorBoundary,
+    createPortal,
+    createRef,
+    forwardRef,
+    isValidElement,
+    lazy,
+    memo,
+    createContext,
+    renderContextConsumerToString,
+    renderContextProviderToString,
+    useContext,
+    applyStreamingHydrationFragments,
+    createRoot,
+    createStreamingHydrationRoot,
+    enableEventHydrationManifestReplay,
+    enableHydrationEventReplay,
+    flushSync,
+    hydrateRoot,
+    queueHydrationEvent,
+    readEventHydrationManifest,
+    render,
+    unmountComponentAtNode,
+    useCallback,
+    useDebugValue,
+    useDeferredValue,
+    useEffectEvent,
+    useEffect,
+    useId,
+    useImperativeHandle,
+    useInsertionEffect,
+    useLayoutEffect,
+    useMemo,
+    useOptimistic,
+    useReducer,
+    useRef,
+    useState,
+    useSyncExternalStore,
+    use,
+    useActionState,
+    act,
+    cache,
+    cacheSignal,
+    captureOwnerStack,
+    renderToString,
+    startTransition,
+    unstable_useCacheRefresh,
+    useTransition,
+    version,
+};
+export default ReactCompat;
+//# sourceMappingURL=react-default.js.map

package/dist/react-default.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-default.js","sourceRoot":"","sources":["../src/react-default.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,aAAa,GACd,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACL,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,YAAY,EACZ,aAAa,EACb,mBAAmB,EACnB,YAAY,EACZ,SAAS,EACT,UAAU,EACV,cAAc,EACd,IAAI,EACJ,IAAI,GACL,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,aAAa,EACb,6BAA6B,EAC7B,6BAA6B,EAC7B,UAAU,GACX,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,gCAAgC,EAChC,UAAU,EACV,4BAA4B,EAC5B,kCAAkC,EAClC,0BAA0B,EAC1B,SAAS,EACT,WAAW,EACX,mBAAmB,EACnB,0BAA0B,EAC1B,MAAM,EACN,sBAAsB,GACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EACL,WAAW,EACX,aAAa,EACb,gBAAgB,EAChB,cAAc,EACd,SAAS,EACT,KAAK,EACL,mBAAmB,EACnB,kBAAkB,EAClB,eAAe,EACf,OAAO,EACP,aAAa,EACb,UAAU,EACV,MAAM,EACN,QAAQ,EACR,oBAAoB,EACpB,GAAG,EACH,cAAc,EACd,GAAG,EACH,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,wBAAwB,EACxB,aAAa,EACb,OAAO,GACR,MAAM,YAAY,CAAC;AAEpB,MAAM,WAAW,GAAG;IAClB,SAAS;IACT,aAAa;IACb,QAAQ;IACR,QAAQ;IACR,QAAQ;IACR,QAAQ;IACR,YAAY;IACZ,UAAU;IACV,QAAQ;IACR,YAAY;IACZ,aAAa;IACb,mBAAmB;IACnB,YAAY;IACZ,SAAS;IACT,UAAU;IACV,cAAc;IACd,IAAI;IACJ,IAAI;IACJ,aAAa;IACb,6BAA6B;IAC7B,6BAA6B;IAC7B,UAAU;IACV,gCAAgC;IAChC,UAAU;IACV,4BAA4B;IAC5B,kCAAkC;IAClC,0BAA0B;IAC1B,SAAS;IACT,WAAW;IACX,mBAAmB;IACnB,0BAA0B;IAC1B,MAAM;IACN,sBAAsB;IACtB,WAAW;IACX,aAAa;IACb,gBAAgB;IAChB,cAAc;IACd,SAAS;IACT,KAAK;IACL,mBAAmB;IACnB,kBAAkB;IAClB,eAAe;IACf,OAAO;IACP,aAAa;IACb,UAAU;IACV,MAAM;IACN,QAAQ;IACR,oBAAoB;IACpB,GAAG;IACH,cAAc;IACd,GAAG;IACH,KAAK;IACL,WAAW;IACX,iBAAiB;IACjB,cAAc;IACd,eAAe;IACf,wBAAwB;IACxB,aAAa;IACb,OAAO;CACC,CAAC;AAEX,eAAe,WAAW,CAAC","sourcesContent":["import {\n  Component,\n  PureComponent,\n} from \"./class-component.js\";\nimport {\n  Fragment,\n  Activity,\n  Profiler,\n  Suspense,\n  SuspenseList,\n  StrictMode,\n  Children,\n  cloneElement,\n  createElement,\n  createErrorBoundary,\n  createPortal,\n  createRef,\n  forwardRef,\n  isValidElement,\n  lazy,\n  memo,\n} from \"./element.js\";\nimport {\n  createContext,\n  renderContextConsumerToString,\n  renderContextProviderToString,\n  useContext,\n} from \"./context.js\";\nimport {\n  applyStreamingHydrationFragments,\n  createRoot,\n  createStreamingHydrationRoot,\n  enableEventHydrationManifestReplay,\n  enableHydrationEventReplay,\n  flushSync,\n  hydrateRoot,\n  queueHydrationEvent,\n  readEventHydrationManifest,\n  render,\n  unmountComponentAtNode,\n} from \"./render.js\";\nimport {\n  useCallback,\n  useDebugValue,\n  useDeferredValue,\n  useEffectEvent,\n  useEffect,\n  useId,\n  useImperativeHandle,\n  useInsertionEffect,\n  useLayoutEffect,\n  useMemo,\n  useOptimistic,\n  useReducer,\n  useRef,\n  useState,\n  useSyncExternalStore,\n  use,\n  useActionState,\n  act,\n  cache,\n  cacheSignal,\n  captureOwnerStack,\n  renderToString,\n  startTransition,\n  unstable_useCacheRefresh,\n  useTransition,\n  version,\n} from \"./hooks.js\";\n\nconst ReactCompat = {\n  Component,\n  PureComponent,\n  Fragment,\n  Activity,\n  Profiler,\n  Suspense,\n  SuspenseList,\n  StrictMode,\n  Children,\n  cloneElement,\n  createElement,\n  createErrorBoundary,\n  createPortal,\n  createRef,\n  forwardRef,\n  isValidElement,\n  lazy,\n  memo,\n  createContext,\n  renderContextConsumerToString,\n  renderContextProviderToString,\n  useContext,\n  applyStreamingHydrationFragments,\n  createRoot,\n  createStreamingHydrationRoot,\n  enableEventHydrationManifestReplay,\n  enableHydrationEventReplay,\n  flushSync,\n  hydrateRoot,\n  queueHydrationEvent,\n  readEventHydrationManifest,\n  render,\n  unmountComponentAtNode,\n  useCallback,\n  useDebugValue,\n  useDeferredValue,\n  useEffectEvent,\n  useEffect,\n  useId,\n  useImperativeHandle,\n  useInsertionEffect,\n  useLayoutEffect,\n  useMemo,\n  useOptimistic,\n  useReducer,\n  useRef,\n  useState,\n  useSyncExternalStore,\n  use,\n  useActionState,\n  act,\n  cache,\n  cacheSignal,\n  captureOwnerStack,\n  renderToString,\n  startTransition,\n  unstable_useCacheRefresh,\n  useTransition,\n  version,\n} as const;\n\nexport default ReactCompat;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reckona/mreact-compat",
-  "version": "0.0.86",
+  "version": "0.0.88",
   "description": "React-compatible runtime implementation for mreact.",
   "keywords": [
     "compatibility",
@@ -65,6 +65,6 @@
     "access": "public"
   },
   "dependencies": {
-    "@reckona/mreact-shared": "0.0.86"
+    "@reckona/mreact-shared": "0.0.88"
   }
 }

package/src/class-component.ts

@@ -39,6 +39,10 @@ export interface ClassComponentInstance {
 
 export interface ClassComponentType {
   new (props: Record<string, unknown>): ClassComponentInstance;
+  getDerivedStateFromProps?: (
+    nextProps: Record<string, unknown>,
+    previousState: Record<string, unknown>,
+  ) => Record<string, unknown> | null;
   getDerivedStateFromError?: (error: Error) => Record<string, unknown> | null;
 }
 
@@ -170,10 +174,11 @@ export function renderClassComponentWithRuntime(
     const previousProps = instance.props;
     const snapshot = classLifecycleSnapshots.get(instance);
     const previousState = snapshot?.previousState ?? instance.state ?? {};
-    const nextState = instance.state ?? {};
 
     instanceRef.current = instance;
     installClassUpdateMethods(instance, runtime);
+    applyDerivedStateFromProps(type, instance, props, previousState);
+    const nextState = instance.state ?? {};
     const shouldSkipUpdate =
       didCommitRef.current &&
       snapshot?.force !== true &&
@@ -219,6 +224,24 @@ export function renderClassComponentWithRuntime(
   });
 }
 
+export function applyDerivedStateFromProps(
+  type: ClassComponentType,
+  instance: ClassComponentInstance,
+  nextProps: Record<string, unknown>,
+  previousState: Record<string, unknown>,
+): void {
+  const derivedState = type.getDerivedStateFromProps?.(nextProps, previousState);
+
+  if (derivedState === undefined || derivedState === null) {
+    return;
+  }
+
+  instance.state = {
+    ...instance.state,
+    ...derivedState,
+  };
+}
+
 export function recoverClassComponentError(
   type: ClassComponentType,
   instance: ClassComponentInstance,

package/src/element.ts

@@ -263,6 +263,14 @@ export const Children = {
       fn(child as Exclude<ReactCompatNode, null | undefined | boolean>, index),
     );
   },
+  forEach(
+    children: ReactCompatNode,
+    fn: (child: Exclude<ReactCompatNode, null | undefined | boolean>, index: number) => void,
+  ): void {
+    toChildArray(children).forEach((child, index) => {
+      fn(child, index);
+    });
+  },
   count(children: ReactCompatNode): number {
     if (children === null || children === undefined) {
       return 0;

package/src/fiber-reconciler.ts

@@ -27,6 +27,7 @@ import { DidCapture } from "./fiber-flags.js";
 import { mergeLanes, NoLanes } from "./fiber-lanes.js";
 import { isThenable } from "./thenable.js";
 import {
+  applyDerivedStateFromProps,
   isClassComponentType,
   type ClassComponentInstance,
   type ClassComponentType,
@@ -518,6 +519,8 @@ function beginClassComponent(
       ? unit.alternate.stateNode
       : undefined;
   const instance = currentInstance ?? new type(nextProps);
+  const previousState = instance.state ?? {};
+  applyDerivedStateFromProps(type, instance, nextProps, previousState);
   const nextState = instance.state ?? {};
 
   unit.stateNode = instance;

package/src/hooks.ts

@@ -601,15 +601,14 @@ export function useImperativeHandle<T>(
   create: () => T,
   deps?: readonly unknown[],
 ): void {
-  const handle = runWithoutDevToolsHookTracking(() => useMemo(create, deps));
-
   runWithoutDevToolsHookTracking(() =>
     useInsertionEffect(() => {
+      const handle = create();
       assignRef(ref, handle);
       return () => {
         assignRef(ref, null);
       };
-    }, [ref, handle])
+    }, deps === undefined ? undefined : [ref, ...deps])
   );
   recordDevToolsHook("useImperativeHandle", deps === undefined
     ? { kind: "imperative-handle" }
@@ -983,7 +982,9 @@ export function hasStableExternalStores(
 }
 
 export function renderToString<TProps>(
-  component: (props: TProps) => ReactCompatNode,
+  component:
+    | ((props: TProps) => ReactCompatNode)
+    | (new (props: TProps) => { render(): ReactCompatNode }),
   props?: TProps,
   options: RootRuntimeOptions = {},
 ): string {
@@ -994,7 +995,14 @@ export function renderToString<TProps>(
 
   return runWithCacheScope(createCacheScope(), () => {
     try {
-      const rendered = renderWithRootRuntime(runtime, "0", () => component(props as TProps));
+      const rendered = renderWithRootRuntime(runtime, "0", () => {
+        if (isClassComponentType(component)) {
+          const instance = new component(props as Record<string, unknown>);
+          return instance.render();
+        }
+
+        return (component as (props: TProps) => ReactCompatNode)(props as TProps);
+      });
       return typeof rendered === "string"
         ? rendered
         : renderNodeToString(rendered, runtime, "0");

package/src/index.ts

@@ -93,3 +93,4 @@ export {
   version,
 } from "./hooks.js";
 export type { StartTransition, TransitionScope } from "./hooks.js";
+export { default } from "./react-default.js";

package/src/react-default.ts

@@ -0,0 +1,133 @@
+import {
+  Component,
+  PureComponent,
+} from "./class-component.js";
+import {
+  Fragment,
+  Activity,
+  Profiler,
+  Suspense,
+  SuspenseList,
+  StrictMode,
+  Children,
+  cloneElement,
+  createElement,
+  createErrorBoundary,
+  createPortal,
+  createRef,
+  forwardRef,
+  isValidElement,
+  lazy,
+  memo,
+} from "./element.js";
+import {
+  createContext,
+  renderContextConsumerToString,
+  renderContextProviderToString,
+  useContext,
+} from "./context.js";
+import {
+  applyStreamingHydrationFragments,
+  createRoot,
+  createStreamingHydrationRoot,
+  enableEventHydrationManifestReplay,
+  enableHydrationEventReplay,
+  flushSync,
+  hydrateRoot,
+  queueHydrationEvent,
+  readEventHydrationManifest,
+  render,
+  unmountComponentAtNode,
+} from "./render.js";
+import {
+  useCallback,
+  useDebugValue,
+  useDeferredValue,
+  useEffectEvent,
+  useEffect,
+  useId,
+  useImperativeHandle,
+  useInsertionEffect,
+  useLayoutEffect,
+  useMemo,
+  useOptimistic,
+  useReducer,
+  useRef,
+  useState,
+  useSyncExternalStore,
+  use,
+  useActionState,
+  act,
+  cache,
+  cacheSignal,
+  captureOwnerStack,
+  renderToString,
+  startTransition,
+  unstable_useCacheRefresh,
+  useTransition,
+  version,
+} from "./hooks.js";
+
+const ReactCompat = {
+  Component,
+  PureComponent,
+  Fragment,
+  Activity,
+  Profiler,
+  Suspense,
+  SuspenseList,
+  StrictMode,
+  Children,
+  cloneElement,
+  createElement,
+  createErrorBoundary,
+  createPortal,
+  createRef,
+  forwardRef,
+  isValidElement,
+  lazy,
+  memo,
+  createContext,
+  renderContextConsumerToString,
+  renderContextProviderToString,
+  useContext,
+  applyStreamingHydrationFragments,
+  createRoot,
+  createStreamingHydrationRoot,
+  enableEventHydrationManifestReplay,
+  enableHydrationEventReplay,
+  flushSync,
+  hydrateRoot,
+  queueHydrationEvent,
+  readEventHydrationManifest,
+  render,
+  unmountComponentAtNode,
+  useCallback,
+  useDebugValue,
+  useDeferredValue,
+  useEffectEvent,
+  useEffect,
+  useId,
+  useImperativeHandle,
+  useInsertionEffect,
+  useLayoutEffect,
+  useMemo,
+  useOptimistic,
+  useReducer,
+  useRef,
+  useState,
+  useSyncExternalStore,
+  use,
+  useActionState,
+  act,
+  cache,
+  cacheSignal,
+  captureOwnerStack,
+  renderToString,
+  startTransition,
+  unstable_useCacheRefresh,
+  useTransition,
+  version,
+} as const;
+
+export default ReactCompat;