UNPKG

@mantine/notifications

Version:

Mantine notifications system

1 lines 7.86 kB
{"version":3,"file":"notifications.store.mjs","names":[],"sources":["../src/notifications.store.ts"],"sourcesContent":["import { NotificationProps } from '@mantine/core';\nimport { randomId } from '@mantine/hooks';\nimport { createStore, MantineStore, useStore } from '@mantine/store';\n\nexport type NotificationPosition =\n | 'top-left'\n | 'top-right'\n | 'top-center'\n | 'bottom-left'\n | 'bottom-right'\n | 'bottom-center';\n\nexport interface NotificationData\n extends Omit<NotificationProps, 'onClose'>, Record<`data-${string}`, any> {\n /** Notification id, can be used to close or update notification */\n id?: string;\n\n /** Position of the notification, if not set, the position is determined based on `position` prop on Notifications component */\n position?: NotificationPosition;\n\n /** Notification message, required for all notifications */\n message: React.ReactNode;\n\n /** Display priority. Higher numbers are shown before lower ones when the number of\n * active notifications exceeds `limit`. Notifications with equal priority keep insertion\n * order (FIFO). @default 0 */\n priority?: number;\n\n /** Determines whether notification should be closed automatically,\n * number is auto close timeout in ms, overrides `autoClose` from `Notifications`\n * */\n autoClose?: boolean | number;\n\n /** Determines whether notification can be closed with close button, drag or horizontal scroll swipe, `true` by default */\n allowClose?: boolean;\n\n /** Called when notification closes */\n onClose?: (props: NotificationData) => void;\n\n /** Called when notification opens */\n onOpen?: (props: NotificationData) => void;\n}\n\nexport interface NotificationsState {\n notifications: NotificationData[];\n queue: NotificationData[];\n defaultPosition: NotificationPosition;\n limit: number;\n}\n\nexport type NotificationsStore = MantineStore<NotificationsState>;\n\ninterface SequencedNotificationData extends NotificationData {\n __sequence?: number;\n}\n\nlet notificationSequence = 0;\n\nfunction getDistributedNotifications(\n data: SequencedNotificationData[],\n defaultPosition: NotificationPosition,\n limit: number\n) {\n const queue: NotificationData[] = [];\n const notifications: NotificationData[] = [];\n const groups = new Map<string, SequencedNotificationData[]>();\n\n for (const item of data) {\n const position = item.position || defaultPosition;\n const group = groups.get(position);\n if (group) {\n group.push(item);\n } else {\n groups.set(position, [item]);\n }\n }\n\n for (const group of groups.values()) {\n group.sort(\n (a, b) => (b.priority ?? 0) - (a.priority ?? 0) || (a.__sequence ?? 0) - (b.__sequence ?? 0)\n );\n group.forEach((item, index) => {\n if (index < limit) {\n notifications.push(item);\n } else {\n queue.push(item);\n }\n });\n }\n\n return { notifications, queue };\n}\n\nexport const createNotificationsStore = () =>\n createStore<NotificationsState>({\n notifications: [],\n queue: [],\n defaultPosition: 'bottom-right',\n limit: 5,\n });\n\nexport const notificationsStore = createNotificationsStore();\nexport const useNotifications = (store: NotificationsStore = notificationsStore) => useStore(store);\n\nexport function updateNotificationsState(\n store: NotificationsStore,\n update: (notifications: NotificationData[]) => NotificationData[]\n) {\n const state = store.getState();\n const notifications = update([...state.notifications, ...state.queue]);\n\n for (const item of notifications as SequencedNotificationData[]) {\n if (item.__sequence === undefined) {\n item.__sequence = notificationSequence;\n notificationSequence += 1;\n }\n }\n\n const updated = getDistributedNotifications(notifications, state.defaultPosition, state.limit);\n\n store.setState({\n notifications: updated.notifications,\n queue: updated.queue,\n limit: state.limit,\n defaultPosition: state.defaultPosition,\n });\n}\n\nexport function showNotification(\n notification: NotificationData,\n store: NotificationsStore = notificationsStore\n) {\n const id = notification.id || randomId();\n\n updateNotificationsState(store, (notifications) => {\n if (notification.id && notifications.some((n) => n.id === notification.id)) {\n return notifications;\n }\n\n return [...notifications, { ...notification, id }];\n });\n\n return id;\n}\n\nexport function hideNotification(id: string, store: NotificationsStore = notificationsStore) {\n updateNotificationsState(store, (notifications) =>\n notifications.filter((notification) => {\n if (notification.id === id) {\n notification.onClose?.(notification);\n return false;\n }\n\n return true;\n })\n );\n\n return id;\n}\n\nexport function updateNotification(\n notification: NotificationData,\n store: NotificationsStore = notificationsStore\n) {\n updateNotificationsState(store, (notifications) =>\n notifications.map((item) => {\n if (item.id === notification.id) {\n return { ...item, ...notification };\n }\n\n return item;\n })\n );\n\n return notification.id;\n}\n\nexport function cleanNotifications(store: NotificationsStore = notificationsStore) {\n updateNotificationsState(store, () => []);\n}\n\nexport function cleanNotificationsQueue(store: NotificationsStore = notificationsStore) {\n const { defaultPosition, limit } = store.getState();\n updateNotificationsState(\n store,\n (notifications) =>\n getDistributedNotifications(notifications, defaultPosition, limit).notifications\n );\n}\n\nexport const notifications = {\n show: showNotification,\n hide: hideNotification,\n update: updateNotification,\n clean: cleanNotifications,\n cleanQueue: cleanNotificationsQueue,\n updateState: updateNotificationsState,\n} as const;\n"],"mappings":";;;;AAwDA,IAAI,uBAAuB;AAE3B,SAAS,4BACP,MACA,iBACA,OACA;CACA,MAAM,QAA4B,CAAC;CACnC,MAAM,gBAAoC,CAAC;CAC3C,MAAM,yBAAS,IAAI,IAAyC;CAE5D,KAAK,MAAM,QAAQ,MAAM;EACvB,MAAM,WAAW,KAAK,YAAY;EAClC,MAAM,QAAQ,OAAO,IAAI,QAAQ;EACjC,IAAI,OACF,MAAM,KAAK,IAAI;OAEf,OAAO,IAAI,UAAU,CAAC,IAAI,CAAC;CAE/B;CAEA,KAAK,MAAM,SAAS,OAAO,OAAO,GAAG;EACnC,MAAM,MACH,GAAG,OAAO,EAAE,YAAY,MAAM,EAAE,YAAY,OAAO,EAAE,cAAc,MAAM,EAAE,cAAc,EAC5F;EACA,MAAM,SAAS,MAAM,UAAU;GAC7B,IAAI,QAAQ,OACV,cAAc,KAAK,IAAI;QAEvB,MAAM,KAAK,IAAI;EAEnB,CAAC;CACH;CAEA,OAAO;EAAE;EAAe;CAAM;AAChC;AAEA,MAAa,iCACX,YAAgC;CAC9B,eAAe,CAAC;CAChB,OAAO,CAAC;CACR,iBAAiB;CACjB,OAAO;AACT,CAAC;AAEH,MAAa,qBAAqB,yBAAyB;AAC3D,MAAa,oBAAoB,QAA4B,uBAAuB,SAAS,KAAK;AAElG,SAAgB,yBACd,OACA,QACA;CACA,MAAM,QAAQ,MAAM,SAAS;CAC7B,MAAM,gBAAgB,OAAO,CAAC,GAAG,MAAM,eAAe,GAAG,MAAM,KAAK,CAAC;CAErE,KAAK,MAAM,QAAQ,eACjB,IAAI,KAAK,eAAe,KAAA,GAAW;EACjC,KAAK,aAAa;EAClB,wBAAwB;CAC1B;CAGF,MAAM,UAAU,4BAA4B,eAAe,MAAM,iBAAiB,MAAM,KAAK;CAE7F,MAAM,SAAS;EACb,eAAe,QAAQ;EACvB,OAAO,QAAQ;EACf,OAAO,MAAM;EACb,iBAAiB,MAAM;CACzB,CAAC;AACH;AAEA,SAAgB,iBACd,cACA,QAA4B,oBAC5B;CACA,MAAM,KAAK,aAAa,MAAM,SAAS;CAEvC,yBAAyB,QAAQ,kBAAkB;EACjD,IAAI,aAAa,MAAM,cAAc,MAAM,MAAM,EAAE,OAAO,aAAa,EAAE,GACvE,OAAO;EAGT,OAAO,CAAC,GAAG,eAAe;GAAE,GAAG;GAAc;EAAG,CAAC;CACnD,CAAC;CAED,OAAO;AACT;AAEA,SAAgB,iBAAiB,IAAY,QAA4B,oBAAoB;CAC3F,yBAAyB,QAAQ,kBAC/B,cAAc,QAAQ,iBAAiB;EACrC,IAAI,aAAa,OAAO,IAAI;GAC1B,aAAa,UAAU,YAAY;GACnC,OAAO;EACT;EAEA,OAAO;CACT,CAAC,CACH;CAEA,OAAO;AACT;AAEA,SAAgB,mBACd,cACA,QAA4B,oBAC5B;CACA,yBAAyB,QAAQ,kBAC/B,cAAc,KAAK,SAAS;EAC1B,IAAI,KAAK,OAAO,aAAa,IAC3B,OAAO;GAAE,GAAG;GAAM,GAAG;EAAa;EAGpC,OAAO;CACT,CAAC,CACH;CAEA,OAAO,aAAa;AACtB;AAEA,SAAgB,mBAAmB,QAA4B,oBAAoB;CACjF,yBAAyB,aAAa,CAAC,CAAC;AAC1C;AAEA,SAAgB,wBAAwB,QAA4B,oBAAoB;CACtF,MAAM,EAAE,iBAAiB,UAAU,MAAM,SAAS;CAClD,yBACE,QACC,kBACC,4BAA4B,eAAe,iBAAiB,KAAK,CAAC,CAAC,aACvE;AACF;AAEA,MAAa,gBAAgB;CAC3B,MAAM;CACN,MAAM;CACN,QAAQ;CACR,OAAO;CACP,YAAY;CACZ,aAAa;AACf"}