Change the Position of the Notification Inbox

Learn how to change the default position of the floating notification inbox

The notification inbox position is powered by the popper library. You can use placement property on the FloatingNotificationInbox component to position the notification inbox relative to the bell.

React
import React from 'react';
import MagicBell, { FloatingNotificationInbox } from '@magicbell/magicbell-react';

export default function Notifications() {
  const distanceAlongRef = 16;
  const distanceAwayFromRef = 32;

  return (
    
      {(props) => (
        
      )}
    
  );
}