React Native

import { SirenProvider } from '@sirenapp/react-native-inbox';

function App() {
  return (
    <SirenProvider config={{
      userToken: 'your_user_token',
      recipientId: 'your_recipient_id',
    }}>
      {/* Your app */}
    </SirenProvider>
  );
}

import { SirenInboxIcon } from '@sirenapp/react-native-inbox';

<SirenInboxIcon 
  darkMode={false}
  onPress={() => setShowInbox(true)}
/>

import { SirenInbox } from '@sirenapp/react-native-inbox';

<SirenInbox
  darkMode={false}
  headerProps={{
    title: 'Notifications',
    showBackButton: true,
    onBackPress: () => setShowInbox(false)
  }}
/>

type Theme = {
  dark: {
    colors?: {
      primaryColor?: string;
      textColor?: string;
      // ...other colors
    };
    // ...other theme props
  };
  light: {
    // ...same as dark
  };
};

const { 
  markAsReadById, 
  deleteById,
  markAllAsViewed 
} = useSiren();

import React from 'react';
import { View } from 'react-native';
import { 
  SirenProvider, 
  SirenInbox, 
  SirenInboxIcon 
} from '@sirenapp/react-native-inbox';

function App() {
  const [showInbox, setShowInbox] = React.useState(false);
  
  return (
    <SirenProvider config={{
      userToken: 'your_token',
      recipientId: 'your_id',
    }}>
      <View style={{ flex: 1 }}>
        <SirenInboxIcon onPress={() => setShowInbox(true)} />
        {showInbox && (
          <SirenInbox
            headerProps={{
              title: 'Notifications',
              showBackButton: true,
              onBackPress: () => setShowInbox(false)
            }}
          />
        )}
      </View>
    </SirenProvider>
  );
}

export default App;