Fix TypeScript compatibility with @types/react-dom@19

React 19's type definitions removed the deprecated hydrate, render, and
unmountComponentAtNode APIs. Added a LegacyReactDOM interface to provide
types for these methods that still exist at runtime for React 16/17
compatibility.

Also removes unnecessary eslint-disable directives and fixes
ReactElement type parameter warnings.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: justin808

packages/react-on-rails/src/ClientRenderer.ts

@@ -174,7 +174,6 @@ function unmountAllComponents(): void {
         root.unmount();
       } else {
         // React 16-17 legacy API
-        // eslint-disable-next-line @typescript-eslint/no-deprecated
         unmountComponentAtNode(domNode);
       }
     } catch (error) {

packages/react-on-rails/src/reactApis.cts

@@ -4,6 +4,14 @@ import * as ReactDOM from 'react-dom';
 import type { ReactElement } from 'react';
 import type { RenderReturnType } from './types/index.ts' with { 'resolution-mode': 'import' };
 
+// Type for legacy React DOM APIs (React 16/17) that were removed from @types/react-dom@19
+// These are only used at runtime when supportsRootApi is false
+interface LegacyReactDOM {
+  hydrate(element: ReactElement, container: Element): void;
+  render(element: ReactElement, container: Element): RenderReturnType;
+  unmountComponentAtNode(container: Element): boolean;
+}
+
 const reactMajorVersion = Number(ReactDOM.version?.split('.')[0]) || 16;
 
 // TODO: once we require React 18, we can remove this and inline everything guarded by it.
@@ -29,12 +37,14 @@ if (supportsRootApi) {
 
 type HydrateOrRenderType = (domNode: Element, reactElement: ReactElement) => RenderReturnType;
 
-/* eslint-disable @typescript-eslint/no-deprecated,@typescript-eslint/no-non-null-assertion,react/no-deprecated --
- * while we need to support React 16
- */
+// Cast ReactDOM to include legacy APIs for React 16/17 compatibility
+// These methods exist at runtime but are removed from @types/react-dom@19
+const legacyReactDOM = ReactDOM as unknown as LegacyReactDOM;
+
+/* eslint-disable @typescript-eslint/no-non-null-assertion -- reactDomClient is always defined when supportsRootApi is true */
 export const reactHydrate: HydrateOrRenderType = supportsRootApi
   ? reactDomClient!.hydrateRoot
-  : (domNode, reactElement) => ReactDOM.hydrate(reactElement, domNode);
+  : (domNode, reactElement) => legacyReactDOM.hydrate(reactElement, domNode);
 
 export function reactRender(domNode: Element, reactElement: ReactElement): RenderReturnType {
   if (supportsRootApi) {
@@ -43,14 +53,13 @@ export function reactRender(domNode: Element, reactElement: ReactElement): Rende
     return root;
   }
 
-  // eslint-disable-next-line react/no-render-return-value
-  return ReactDOM.render(reactElement, domNode);
+  return legacyReactDOM.render(reactElement, domNode);
 }
 
-export const unmountComponentAtNode: typeof ReactDOM.unmountComponentAtNode = supportsRootApi
+export const unmountComponentAtNode = supportsRootApi
   ? // not used if we use root API
     () => false
-  : ReactDOM.unmountComponentAtNode;
+  : (container: Element) => legacyReactDOM.unmountComponentAtNode(container);
 
 export const ensureReactUseAvailable = () => {
   if (!('use' in React) || typeof React.use !== 'function') {

packages/react-on-rails/src/types/index.ts

@@ -125,9 +125,9 @@ interface ServerRenderResult {
   error?: Error;
 }
 
-type CreateReactOutputSyncResult = ServerRenderResult | ReactElement<unknown>;
+type CreateReactOutputSyncResult = ServerRenderResult | ReactElement;
 
-type CreateReactOutputAsyncResult = Promise<string | ServerRenderHashRenderedHtml | ReactElement<unknown>>;
+type CreateReactOutputAsyncResult = Promise<string | ServerRenderHashRenderedHtml | ReactElement>;
 
 type CreateReactOutputResult = CreateReactOutputSyncResult | CreateReactOutputAsyncResult;