SheetRegister

SheetRegister component allows you to register multiple sheets in one place. This is especially useful when you have many sheets in your app.

import {SheetRegister} from 'react-native-actions-sheet';
import ExampleSheet from 'example-sheet.tsx';
export const Sheets = () => {
  return <SheetRegister sheets={{'example-sheet': ExampleSheet}} />;
};

In App.tsx import Sheets component and wrap your app in SheetProvider.

import {SheetProvider} from 'react-native-actions-sheet';
import {Sheets} from 'sheets.tsx';
function App() {
  return (
    <SheetProvider>
      <Sheets />
      {
        // your app components
      }
    </SheetProvider>
  );
}

The way we were registering sheets earlier felt a bit hacky so this new way is much cleaner and easier to manage when you have many sheets in the app.

Props

sheets

An object containing the sheets to register. The key is the sheet ID and the value is the sheet component.