MujocoProvider

WASM module lifecycle provider

The outermost wrapper that loads the MuJoCo WASM module and provides it to all children.

Usage

import { MujocoProvider } from "mujoco-react";

function App() {
  return (
    <MujocoProvider>
      <MujocoCanvas config={config}>
        {/* ... */}
      </MujocoCanvas>
    </MujocoProvider>
  );
}

Props

children · React.ReactNode · required

Child components that need access to MuJoCo.

onError · (error: Error) => void

Called if the WASM module fails to load.

useMujocoWasm Hook

Access the WASM module status from any child component:

import { useMujocoWasm } from "mujoco-react";

function LoadingIndicator() {
  const { mujoco, status, error } = useMujocoWasm();

  if (status === "pending") return <div>Loading WASM...</div>;
  if (status === "error") return <div>Error: {error}</div>;
  // mujoco is now available
  return null;
}

Return Value

Field	Type	Description
mujoco	MujocoModule | null	The raw WASM module, or null while pending
status	'pending' | 'error'	Current lifecycle state (absent once loaded)
error	string | null	Error message if loading failed

Notes

• Must wrap any component that uses MujocoCanvas or mujoco-react hooks
• The WASM module is loaded once on mount. The embedded binary in mujoco-js is ~2MB.
• Loading typically takes 1-3 seconds on first visit; subsequent visits use the browser cache