@magicbell/magicbell-react
Version:
React components for building a notification inbox for your app
29 lines (28 loc) • 1.09 kB
TypeScript
import { Placement } from '@floating-ui/react';
import React from 'react';
import { NotificationInboxProps } from '../NotificationInbox/index.js';
import { NotificationListItem } from '../NotificationList/NotificationList.js';
export interface Props extends NotificationInboxProps {
isOpen: boolean;
toggle?: () => void;
launcherRef: React.RefObject<Element>;
placement?: Placement;
offset?: number | {
mainAxis?: number;
crossAxis?: number;
};
arrowPadding?: number;
width?: number;
closeOnClickOutside?: boolean;
closeOnNotificationClick?: boolean;
hideArrow?: boolean;
NotificationItem?: NotificationListItem;
layout?: string[];
}
/**
* Notification inbox in a popover.
*
* @example
* <FloatingNotificationInbox height={400} toggle={() => void} isOpen />
*/
export default function FloatingNotificationInbox({ launcherRef, isOpen, toggle, placement, offset, arrowPadding, width, onNotificationClick, closeOnClickOutside, closeOnNotificationClick, hideArrow, layout, ...inboxProps }: Props): React.JSX.Element;