@ringozz/react-godot 0.1.0

package/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "@ringozz/react-godot",
+  "author": "Vladimir Davidovich",
+  "version": "0.1.0",
+  "description": "React reconciler bindings for Godot Engine via @ringozz/godot",
+  "type": "module",
+  "main": "./src/index.ts",
+  "types": "./src/index.ts",
+  "exports": {
+    ".": "./src/index.ts",
+    "./jsx-runtime": "./src/react-jsx.ts",
+    "./jsx-dev-runtime": "./src/react-jsx.ts"
+  },
+  "files": [
+    "src/"
+  ],
+  "dependencies": {
+    "react-reconciler": "^0.33.0"
+  },
+  "peerDependencies": {
+    "@ringozz/godot": "^0.1.0",
+    "react": "^19.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.0",
+    "@types/react-reconciler": "^0.33.0"
+  }
+}

package/src/index.ts

@@ -0,0 +1,58 @@
+/**********************************************************************
+ Copyright (c) Vladimir Davidovich. All rights reserved.
+***********************************************************************/
+
+import Reconciler from 'react-reconciler';
+import Constants from 'react-reconciler/constants.js';
+import type { Node } from '@ringozz/godot/Node';
+import * as FiberConfig from './react-fiber.ts';
+export * from './react-hooks.ts';
+export type * from './react-types.ts';
+
+const reconciler = Reconciler(FiberConfig);
+reconciler.injectIntoDevTools(undefined as never);
+
+export function createRoot(parent: Node) {
+  const isStrictMode = process.env.NODE_ENV === 'development';
+  const concurrentUpdatesByDefaultOverride = false;
+  const identifierPrefix = '';
+  /* eslint-disable @typescript-eslint/no-explicit-any */
+  const onUncaughtError = (reconciler as any).defaultOnUncaughtError;
+  const onCaughtError = (reconciler as any).defaultOnCaughtError;
+  const onRecoverableError = (reconciler as any).defaultOnRecoverableError;
+  const onDefaultTransitionIndicator = () => { };
+  const root = reconciler.createContainer(
+    parent,
+    Constants.ConcurrentRoot,
+    null,
+    isStrictMode,
+    concurrentUpdatesByDefaultOverride,
+    identifierPrefix,
+    onUncaughtError,
+    onCaughtError,
+    onRecoverableError,
+    onDefaultTransitionIndicator
+  );
+  return {
+    render: (component: React.ReactNode) => new Promise<void>((resolve, reject) => {
+      try {
+        reconciler.updateContainer(component, root, null, resolve);
+      } catch (e) {
+        reject(e);
+      }
+    }),
+    unmount: () => {
+      try {
+        reconciler.updateContainerSync(null, root, null);
+        reconciler.flushSyncWork();
+        return Promise.resolve();
+      } catch (e) {
+        return Promise.reject(e);
+      }
+    }
+  };
+}
+
+export function createPortal(children: React.ReactNode, container: Node, key?: string | null): React.ReactPortal {
+  return reconciler.createPortal(children, container, null, key) as unknown as React.ReactPortal;
+}

package/src/react-fiber.ts

@@ -0,0 +1,307 @@
+/**********************************************************************
+ Copyright (c) Vladimir Davidovich. All rights reserved.
+***********************************************************************/
+
+import { ClassDB } from '@ringozz/godot/ClassDB';
+import type { Node } from '@ringozz/godot/Node';
+import { Object as Instance } from '@ringozz/godot/Object';
+import { RefCounted } from '@ringozz/godot/RefCounted';
+import type Reconciler from 'react-reconciler';
+import Constants from 'react-reconciler/constants.js';
+import pkg from '../package.json' with { type: 'json' };
+import type { InstanceProps } from './react-types.ts';
+
+/* eslint-disable @typescript-eslint/no-unused-vars */
+
+export const rendererPackageName = pkg.name;
+export const rendererVersion = pkg.version;
+export const supportsMutation = true;
+export const supportsPersistence = false;
+export const supportsHydration = false;
+export const isPrimaryRenderer = true;
+
+type Type = string;
+type Props = InstanceProps & Record<string, unknown>;
+type Container = Instance;
+type TextInstance = Instance;
+type SuspenseInstance = Instance;
+type PublicInstance = Instance;
+type HostContext = unknown;
+
+const EMPTY = Object.freeze({});
+const attachments = new WeakMap<Instance, string>();
+
+export function createInstance<T extends Instance>(type: Type, props: Props, root: Container, hostContext: HostContext, internalHandle: Reconciler.OpaqueHandle): T {
+  const { attach, object, ...rest } = props;
+  if (object instanceof RefCounted)
+    object.reference();
+
+  const instance = (object ?? ClassDB.instantiate(type)) as T;
+  if (attach)
+    attachments.set(instance, attach);
+
+  commitUpdate(instance, type, EMPTY, rest, internalHandle);
+  return instance;
+}
+
+export function createTextInstance(text: string, root: Container, hostContext: HostContext, internalHandle: Reconciler.OpaqueHandle): TextInstance {
+  throw new Error('Text nodes are not supported: use a text prop, or a single string/all-string children (they are flattened into the node\'s `text` property).');
+}
+
+export const appendInitialChild = appendChild;
+
+export function finalizeInitialChildren(instance: Instance, type: Type, props: Props, root: Container, hostContext: HostContext): boolean {
+  return false;
+}
+
+export function shouldSetTextContent(type: Type, props: Props): boolean {
+  const c = props.children;
+  if (typeof c === 'string' || typeof c === 'number')
+    return true;
+  return Array.isArray(c) && c.every((v) => typeof v === 'string' || typeof v === 'number');
+}
+
+export function getRootHostContext(root: Container): HostContext | null {
+  return EMPTY;
+}
+
+export function getChildHostContext(parentHostContext: HostContext, type: Type, root: Container): HostContext {
+  return parentHostContext;
+}
+
+export function getPublicInstance(instance: Instance | TextInstance): PublicInstance {
+  return instance;
+}
+
+export function prepareForCommit(containerInfo: Container): Props | null {
+  return null;
+}
+
+export function resetAfterCommit(containerInfo: Container): void {
+}
+
+export function preparePortalMount(containerInfo: Container): void {
+  // No-op: portal children attach to their target Node via appendChildToContainer.
+  // Mirrors ReactDOM's empty implementation.
+}
+
+export const noTimeout = -1;
+export const scheduleTimeout = setTimeout;
+export const cancelTimeout = clearTimeout;
+export const supportsMicrotasks = true;
+export const scheduleMicrotask = queueMicrotask;
+
+let currentUpdatePriority = Constants.NoEventPriority;
+export function setCurrentUpdatePriority(newPriority: Reconciler.EventPriority) {
+  currentUpdatePriority = newPriority;
+}
+
+export function getCurrentUpdatePriority(): Reconciler.EventPriority {
+  return currentUpdatePriority;
+}
+
+const currentEvent = () => globalThis.window?.event;
+
+export function resolveUpdatePriority(): Reconciler.EventPriority {
+  if (currentUpdatePriority)
+    return currentUpdatePriority;
+  const event = currentEvent();
+  switch (event?.type) {
+    case 'click':
+    case 'contextmenu':
+    case 'keydown':
+    case 'keypress':
+    case 'keyup':
+    case 'pointercancel':
+    case 'pointerdown':
+    case 'pointerup':
+      return Constants.DiscreteEventPriority;
+    case 'pointerenter':
+    case 'pointerleave':
+    case 'pointermove':
+    case 'pointerout':
+    case 'pointerover':
+    case 'resize':
+    case 'wheel':
+      return Constants.ContinuousEventPriority;
+    default:
+      return Constants.DefaultEventPriority;
+  }
+}
+
+let schedulerEvent: Event | undefined = undefined;
+export function trackSchedulerEvent() {
+  schedulerEvent = currentEvent();
+}
+
+export function resolveEventType(): null | string {
+  const event = currentEvent();
+  return event && event !== schedulerEvent ? event.type : null;
+}
+
+export function resolveEventTimeStamp(): number {
+  const event = currentEvent();
+  return event && event !== schedulerEvent ? event.timeStamp : -1.1;
+}
+
+export function requestPostPaintCallback() {
+}
+
+export function resetFormInstance() {
+}
+
+export const NotPendingTransition = null;
+export const HostTransitionContext = null as never;
+
+export function shouldAttemptEagerTransition() {
+  return false;
+}
+
+export function getInstanceFromNode(node: unknown): Reconciler.Fiber | null | undefined {
+  return null;
+}
+
+export function beforeActiveInstanceBlur(): void {
+}
+
+export function afterActiveInstanceBlur(): void {
+}
+
+export function prepareScopeUpdate(scopeInstance: unknown, instance: unknown): void {
+}
+
+export function getInstanceFromScope(scopeInstance: unknown): Instance | null {
+  return null;
+}
+
+export function detachDeletedInstance(node: Instance): void {
+  node.free();
+}
+
+export function maySuspendCommit(type: Type, props: Props) {
+  return false;
+}
+
+export function preloadInstance(type: Type, props: Props) {
+  return true; // Return true to indicate it's already loaded
+}
+
+export function startSuspendingCommit() {
+}
+
+export function suspendInstance(type: Type, props: Props) {
+}
+
+export function waitForCommitToBeReady() {
+  return null;
+}
+
+export function appendChild(parentInstance: Instance, child: Instance | TextInstance): void {
+  const attached = attachments.get(child);
+  if (attached) {
+    Instance.assign(parentInstance, { [attached]: child });
+    return;
+  }
+  (parentInstance as Node).addChild(child as Node);
+}
+
+export function appendChildToContainer(container: Container, child: Instance | TextInstance): void {
+  appendChild(container, child);
+}
+
+export function insertBefore(parentInstance: Instance, child: Instance | TextInstance, beforeChild: Instance | TextInstance | SuspenseInstance): void {
+  const attached = attachments.get(child);
+  if (attached) {
+    Instance.assign(parentInstance, { [attached]: child });
+    return;
+  }
+  if ((child as Node).getParent() !== null) {
+    (parentInstance as Node).removeChild(child as Node);
+  }
+  (parentInstance as Node).addChild(child as Node);
+  (parentInstance as Node).moveChild(child as Node, (beforeChild as Node).getIndex());
+}
+
+export function insertInContainerBefore(container: Container, child: Instance | TextInstance, beforeChild: Instance | TextInstance | SuspenseInstance): void {
+  insertBefore(container, child, beforeChild);
+}
+
+export function removeChild(parentInstance: Instance, child: Instance | TextInstance | SuspenseInstance): void {
+  const attached = attachments.get(child);
+  if (attached) {
+    Instance.assign(parentInstance, { [attached]: undefined });
+    return;
+  }
+  (parentInstance as Node).removeChild(child as Node);
+}
+
+export function removeChildFromContainer(container: Container, child: Instance | TextInstance | SuspenseInstance): void {
+  removeChild(container, child);
+}
+
+export function resetTextContent(instance: Instance): void {
+  instance.set('text', undefined);
+}
+
+export function commitTextUpdate(instance: TextInstance, oldText: string, newText: string): void {
+  instance.set('text', newText);
+}
+
+export function commitMount(instance: Instance, type: Type, props: Props, internalInstanceHandle: Reconciler.OpaqueHandle): void {
+}
+
+function isEqual(a: unknown, b: unknown) {
+  if (a === b) return true;
+
+  const i1 = (a as Iterable<unknown> | undefined)?.[Symbol.iterator]?.();
+  const i2 = (b as Iterable<unknown> | undefined)?.[Symbol.iterator]?.();
+  while (i1 && i2) {
+    const n1 = i1.next();
+    const n2 = i2.next();
+    if (n1.done !== n2.done) return false;   // Different lengths
+    if (n1.done) return true;                // Both finished
+    if (n1.value !== n2.value) return false; // Values mismatch
+  }
+}
+
+export function commitUpdate(instance: Instance, type: Type, prevProps: Props, nextProps: Props, internalHandle: Reconciler.OpaqueHandle): void {
+  const { attach: attachOld, ref: refOld, children: childrenOld, ...restOld } = prevProps;
+  const { attach: attachNew, ref: refNew, children: childrenNew, ...restNew } = nextProps;
+  if (attachOld !== attachNew)
+    throw new Error(`Cannot change attachment ${attachOld} to ${attachNew}`);
+
+  const toText = (c: unknown) => Array.isArray(c) ? c.join('') : c as string;
+  if (shouldSetTextContent(type, prevProps)) restOld['text'] = toText(childrenOld);
+  if (shouldSetTextContent(type, nextProps)) restNew['text'] = toText(childrenNew);
+
+  for (const [key, oldVal] of Object.entries(restOld)) {
+    const newVal = restNew[key];
+    if (isEqual(oldVal, newVal))
+      delete restNew[key];
+    else if (newVal === undefined)
+      restNew[key] = undefined;
+  }
+
+  Instance.assign(instance, restNew);
+}
+
+export function hideInstance(instance: Instance | TextInstance): void {
+  instance.set('visible', false);
+}
+
+export const hideTextInstance = hideInstance;
+
+export function unhideInstance(instance: Instance | TextInstance): void {
+  instance.set('visible', true);
+}
+
+export const unhideTextInstance = unhideInstance;
+
+export function clearContainer(container: Container): void {
+  // No-op: Godot containers (e.g. the SceneTree root) can hold non-React
+  // children such as portal targets. The reconciler calls this on every
+  // initial mount; queue-freeing the container's children here would destroy
+  // those foreign nodes and leave React fibers referencing freed instances.
+  // React-managed children are removed by the reconciler's deletion path.
+}
+

package/src/react-hooks.ts

@@ -0,0 +1,22 @@
+/**********************************************************************
+ Copyright (c) Vladimir Davidovich. All rights reserved.
+***********************************************************************/
+
+import type { Signal } from '@ringozz/godot';
+import type React from 'react';
+import { useEffect, useRef } from 'react';
+
+export function useMutableCallback<T>(fn: T): React.RefObject<T> {
+  const ref = useRef<T>(fn);
+  useEffect(() => void (ref.current = fn), [fn]);
+  return ref;
+}
+
+export function useSignal<T extends (...args: any[]) => any>(signal: Signal<T>, handler: T): void {
+  const ref = useMutableCallback(handler);
+  useEffect(() => {
+    const fn = ((...args: any[]) => ref.current(...args)) as T;
+    signal.connect(fn);
+    return () => signal.disconnect(fn);
+  }, [signal.getObjectId(), signal.getName()]);
+}

package/src/react-jsx.ts

@@ -0,0 +1,41 @@
+/**********************************************************************
+ Copyright (c) Vladimir Davidovich. All rights reserved.
+***********************************************************************/
+
+import { jsxDEV as reactJsxDEV } from 'react/jsx-dev-runtime';
+import type * as ReactJSX from 'react/jsx-runtime';
+import { Fragment, jsx as reactJsx, jsxs as reactJsxs } from 'react/jsx-runtime';
+import type { ComponentProps, Instance } from './react-types.ts';
+import { GodotVar } from '@ringozz/godot/runtime';
+
+export function jsx(type: any, props?: any, key?: any) {
+  return reactJsx(GodotVar.isPrototypeOf(type) ? type.name : type, props, key);
+}
+
+export function jsxs(type: any, props?: any, key?: any) {
+  return reactJsxs(GodotVar.isPrototypeOf(type) ? type.name : type, props, key);
+}
+
+export function jsxDEV(type: any, props?: any, key?: any, isStatic?: any, source?: any, self?: any) {
+  return reactJsxDEV(GodotVar.isPrototypeOf(type) ? type.name : type, props, key, isStatic, source, self);
+}
+
+export { Fragment };
+
+declare module '@ringozz/react-godot/jsx-runtime' {
+  export namespace JSX {
+    interface IntrinsicElements extends ReactJSX.JSX.IntrinsicElements { }
+    interface Element extends ReactJSX.JSX.Element { }
+
+    type GodotConstructor = { new(...args: any[]): Instance } & Function;
+
+    type ElementType =
+      | ReactJSX.JSX.ElementType
+      | GodotConstructor;
+
+    type LibraryManagedAttributes<C, P> =
+      C extends GodotConstructor
+      ? ComponentProps<C>
+      : ReactJSX.JSX.LibraryManagedAttributes<C, P>;
+  }
+}

package/src/react-types.ts

@@ -0,0 +1,36 @@
+/**********************************************************************
+ Copyright (c) Vladimir Davidovich. All rights reserved.
+***********************************************************************/
+
+import type React from 'react';
+import type { Object } from '@ringozz/godot/Object';
+import type { ValueTypes } from '@ringozz/godot';
+
+type FunctionKeys<T> = { [K in keyof T]: T[K] extends Function ? K : never }[keyof T];
+type Properties<T> = Omit<T, FunctionKeys<T>>;
+type Overwrite<P, O> = Properties<P> & O;
+type Mutable<P> = { [K in keyof P]: P[K] | Readonly<P[K]> };
+type ConstructorRepresentation<T = any> = new (...args: any[]) => T;
+
+export type Instance = Object;
+
+export type InstanceProps<T extends Instance = Instance> = {
+  /** An existing instance to render instead of creating a new one. */
+  object?: T;
+  /** Attaches the element to a named property of the parent instead of adding it as a child. */
+  attach?: string;
+};
+
+type ReactProps<P> = React.PropsWithChildren<React.RefAttributes<P>>;
+
+type WidenVT<T> = {
+  [K in keyof T]: T[K] extends ValueTypes ? T[K] | number[] : T[K];
+};
+
+type ElementProps<T extends ConstructorRepresentation, P = InstanceType<T>> = Partial<
+  Overwrite<WidenVT<P>, ReactProps<P>>
+>;
+
+export type ComponentProps<T extends ConstructorRepresentation> = Mutable<
+  Overwrite<ElementProps<T>, Omit<InstanceProps<InstanceType<T>>, 'object'>>
+>;