use-dom

Run web-only libraries in Expo apps by rendering them in webviews on native and as-is on web. DOM components allow web code to run verbatim in a webview on native platforms while rendering as-is on web. This enables using web-only libraries like recharts , react-syntax-highlighter , or any React web library in your Expo app without modification. Use DOM components when you need: Avoid DOM components when: Create a new file with the 'use dom'; directive at the top: Every DOM component receives a special dom prop for webview configuration. Always type it in your props: Pass async functions as props to expose native functionality to the DOM component: DOM components can use any web library: CSS imports must be in the DOM component file since they run in isolated context: Or use inline styles / CSS-in-JS: The expo-router component and router API work inside DOM components: These hooks don't work directly in DOM components because they need synchronous access to native routing state: Solution: Read these values in the native parent and pass as props: Check if code is running in a DOM component: Prefer requiring assets instead of using the public directory: Import and use DOM components like regular components: On web, the dom prop is ignored since no webview is needed. - Supports any React web library (recharts, react-syntax-highlighter, canvas, WebGL) without modification by...