Core Utilities

Essential utilities for rendering, element creation, and DOM integration. These provide the foundation for React Native Web's compatibility layer.

Rendering

render

Renders a React Native Web application to a DOM container. This is the primary entry point for web applications.

function render(
  element: React.Element,
  container: DOMContainer,
  callback?: Function
): void;

Parameters:

• element - The React element to render
• container - DOM element to render into
• callback - Optional callback called after render

Usage:

import { AppRegistry } from "react-native-web";

AppRegistry.registerComponent("App", () => App);
AppRegistry.runApplication("App", {
  rootTag: document.getElementById("root"),
});

unmountComponentAtNode

Unmounts a React Native Web component from a DOM container.

function unmountComponentAtNode(container: DOMContainer): boolean;

Parameters:

• container - DOM container to unmount from

Returns: boolean - true if component was unmounted

DOM Integration

findNodeHandle

Returns the DOM node handle for a React Native component reference. Used for measuring and DOM operations.

function findNodeHandle(componentOrHandle: any): number | null;

Parameters:

• componentOrHandle - React component reference or existing handle

Returns: number | null - DOM node handle or null

Usage:

const viewRef = useRef();
const nodeHandle = findNodeHandle(viewRef.current);

unstable_createElement

Low-level element creation utility with React Native compatibility. Handles style, event, and prop normalization for web.

function unstable_createElement(
  type: string,
  props?: Object,
  ...children: any[]
): React.Element;

Parameters:

• type - Element type (string or component)
• props - Element properties
• children - Child elements

Returns: React.Element - Created React element

Note: This is an unstable API and may change in future versions.

Color Processing

processColor

Processes and normalizes color values to web-compatible formats. Handles React Native color formats and converts them for web use.

function processColor(color: ColorValue): string | null;

Parameters:

• color - Color value (string, number, or null)

Returns: string | null - Processed CSS color string or null

Usage:

const webColor = processColor('#FF0000'); // Returns '#FF0000'
const webColor2 = processColor('red'); // Returns 'red'
const webColor3 = processColor(0xFF0000); // Returns '#ff0000'

Native Modules

NativeModules

Empty object for React Native compatibility. Maintains API compatibility with React Native but contains no modules on web.

const NativeModules: {};

This is provided for compatibility with React Native code that may reference NativeModules, but will be empty on web platforms.