@magicbell/magicbell-react
Version:
React components for building a notification inbox for your app
23 lines • 1.25 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = NotificationInboxContent;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
const react_1 = require("react");
const index_js_1 = tslib_1.__importDefault(require("../NotificationList/index.js"));
/**
* Component that renders an infinite scroll list of notifications, or error
* messages if the list can't be fetched.
*
* @example
* <NotificationInboxContent
* store={notifications}
* onNotificationClick={openTicket}
* height={500} />
*/
function NotificationInboxContent({ onNotificationClick, store, height, NotificationItem, }) {
// we use a refSetter so that the height observer is reattached on a ref change
const [contentRef, setContentRef] = (0, react_1.useState)(null);
return ((0, jsx_runtime_1.jsx)("div", { ref: setContentRef, css: { width: '100%', height: height ?? '100%', overflow: 'auto' }, children: contentRef ? ((0, jsx_runtime_1.jsx)(index_js_1.default, { scrollableTarget: contentRef, notifications: store, onItemClick: onNotificationClick, queryParams: store.context, ListItem: NotificationItem })) : null }));
}
//# sourceMappingURL=NotificationInboxContent.js.map