Saaj UI

Portal

A component that renders its children into a different part of the app. Useful for creating modal dialogs, tooltips, or other overlaying elements.

Installation

npx saaj add Portal

Setup

Wrap your app with PortalProvider component.

app/_layout.tsx
import { PortalProvider } from '@/components/Portal';
 
export default function RootLayout() {
  return (
    <PortalProvider>
      {/* Your app */}
    </PortalProvider>
  )
}

Usage

MyComponent.tsx
import React from 'react';
import { View } from 'react-native';
 
import { Portal } from '@/components/Portal';
 
export function MyComponent() {
 
    return (
        <View>
            <Portal>
                {/* Your portal content */}
            </Portal>
        </View>
    )
}

Previous

Popup

Next

Radio Group

On this page