@notificationapi/react 0.0.5 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/api.js +20 -0
- package/dist/assets/BellOutlined.js +57 -0
- package/dist/assets/Inbox.js +6197 -0
- package/dist/assets/Notification.js +3971 -0
- package/dist/assets/Preferences.js +2035 -0
- package/dist/assets/PurePanel.js +66 -0
- package/dist/assets/button.js +832 -0
- package/dist/assets/colors.js +9478 -0
- package/dist/assets/index.js +269 -0
- package/dist/assets/index2.js +652 -0
- package/dist/assets/index3.js +8257 -0
- package/dist/components/Notifications/Inbox.js +10 -0
- package/dist/components/Notifications/InboxHeader.js +51 -0
- package/dist/components/Notifications/Notification.js +9 -0
- package/dist/components/Notifications/NotificationCounter.js +9 -0
- package/dist/components/Notifications/NotificationFeed.js +46 -0
- package/dist/components/Notifications/NotificationLauncher.js +111 -0
- package/dist/components/Notifications/NotificationPopup.js +12 -0
- package/dist/components/Notifications/UnreadBadge.js +29 -0
- package/dist/components/Notifications/index.js +10 -0
- package/dist/components/Preferences/NotificationPreferencesInline.js +7 -0
- package/dist/components/Preferences/NotificationPreferencesPopup.js +1465 -0
- package/dist/components/Preferences/PreferenceGroup.js +8 -0
- package/dist/components/Preferences/Preferences.js +12 -0
- package/dist/components/Preferences/index.js +6 -0
- package/dist/components/Provider/index.js +168 -0
- package/dist/main.js +14 -33390
- package/package.json +3 -2
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { jsxs as t, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { I as r, T as s, R as d } from "../../assets/index3.js";
|
|
3
|
+
import { P as c } from "../../assets/index.js";
|
|
4
|
+
import { B as a } from "../../assets/button.js";
|
|
5
|
+
import { _ as m } from "../../assets/colors.js";
|
|
6
|
+
import * as n from "react";
|
|
7
|
+
var f = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M924.8 625.7l-65.5-56c3.1-19 4.7-38.4 4.7-57.8s-1.6-38.8-4.7-57.8l65.5-56a32.03 32.03 0 009.3-35.2l-.9-2.6a443.74 443.74 0 00-79.7-137.9l-1.8-2.1a32.12 32.12 0 00-35.1-9.5l-81.3 28.9c-30-24.6-63.5-44-99.7-57.6l-15.7-85a32.05 32.05 0 00-25.8-25.7l-2.7-.5c-52.1-9.4-106.9-9.4-159 0l-2.7.5a32.05 32.05 0 00-25.8 25.7l-15.8 85.4a351.86 351.86 0 00-99 57.4l-81.9-29.1a32 32 0 00-35.1 9.5l-1.8 2.1a446.02 446.02 0 00-79.7 137.9l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.3 56.6c-3.1 18.8-4.6 38-4.6 57.1 0 19.2 1.5 38.4 4.6 57.1L99 625.5a32.03 32.03 0 00-9.3 35.2l.9 2.6c18.1 50.4 44.9 96.9 79.7 137.9l1.8 2.1a32.12 32.12 0 0035.1 9.5l81.9-29.1c29.8 24.5 63.1 43.9 99 57.4l15.8 85.4a32.05 32.05 0 0025.8 25.7l2.7.5a449.4 449.4 0 00159 0l2.7-.5a32.05 32.05 0 0025.8-25.7l15.7-85a350 350 0 0099.7-57.6l81.3 28.9a32 32 0 0035.1-9.5l1.8-2.1c34.8-41.1 61.6-87.5 79.7-137.9l.9-2.6c4.5-12.3.8-26.3-9.3-35zM788.3 465.9c2.5 15.1 3.8 30.6 3.8 46.1s-1.3 31-3.8 46.1l-6.6 40.1 74.7 63.9a370.03 370.03 0 01-42.6 73.6L721 702.8l-31.4 25.8c-23.9 19.6-50.5 35-79.3 45.8l-38.1 14.3-17.9 97a377.5 377.5 0 01-85 0l-17.9-97.2-37.8-14.5c-28.5-10.8-55-26.2-78.7-45.7l-31.4-25.9-93.4 33.2c-17-22.9-31.2-47.6-42.6-73.6l75.5-64.5-6.5-40c-2.4-14.9-3.7-30.3-3.7-45.5 0-15.3 1.2-30.6 3.7-45.5l6.5-40-75.5-64.5c11.3-26.1 25.6-50.7 42.6-73.6l93.4 33.2 31.4-25.9c23.7-19.5 50.2-34.9 78.7-45.7l37.9-14.3 17.9-97.2c28.1-3.2 56.8-3.2 85 0l17.9 97 38.1 14.3c28.7 10.8 55.4 26.2 79.3 45.8l31.4 25.8 92.8-32.9c17 22.9 31.2 47.6 42.6 73.6L781.8 426l6.5 39.9zM512 326c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm79.2 255.2A111.6 111.6 0 01512 614c-29.9 0-58-11.7-79.2-32.8A111.6 111.6 0 01400 502c0-29.9 11.7-58 32.8-79.2C454 401.6 482.1 390 512 390c29.9 0 58 11.6 79.2 32.8A111.6 111.6 0 01624 502c0 29.9-11.7 58-32.8 79.2z" } }] }, name: "setting", theme: "outlined" }, p = function(i, o) {
|
|
8
|
+
return /* @__PURE__ */ n.createElement(r, m({}, i, {
|
|
9
|
+
ref: o,
|
|
10
|
+
icon: f
|
|
11
|
+
}));
|
|
12
|
+
}, g = /* @__PURE__ */ n.forwardRef(p);
|
|
13
|
+
const R = (l) => /* @__PURE__ */ t(
|
|
14
|
+
"div",
|
|
15
|
+
{
|
|
16
|
+
style: {
|
|
17
|
+
display: "flex",
|
|
18
|
+
justifyContent: "space-between",
|
|
19
|
+
paddingRight: 5
|
|
20
|
+
},
|
|
21
|
+
children: [
|
|
22
|
+
/* @__PURE__ */ e(s.Text, { strong: !0, children: "Notifications" }),
|
|
23
|
+
/* @__PURE__ */ t("div", { children: [
|
|
24
|
+
/* @__PURE__ */ e(c, { content: "Resolve all", children: /* @__PURE__ */ e(
|
|
25
|
+
a,
|
|
26
|
+
{
|
|
27
|
+
icon: /* @__PURE__ */ e(d, {}),
|
|
28
|
+
size: "small",
|
|
29
|
+
type: "text",
|
|
30
|
+
onClick: () => {
|
|
31
|
+
l.markAsArchived("ALL");
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
) }),
|
|
35
|
+
/* @__PURE__ */ e(c, { content: "Notification Preferences", children: /* @__PURE__ */ e(
|
|
36
|
+
a,
|
|
37
|
+
{
|
|
38
|
+
icon: /* @__PURE__ */ e(g, {}),
|
|
39
|
+
size: "small",
|
|
40
|
+
type: "text",
|
|
41
|
+
onClick: () => {
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
) })
|
|
45
|
+
] })
|
|
46
|
+
]
|
|
47
|
+
}
|
|
48
|
+
);
|
|
49
|
+
export {
|
|
50
|
+
R as InboxHeader
|
|
51
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { UnreadBadge as r } from "./UnreadBadge.js";
|
|
3
|
+
const N = (o) => {
|
|
4
|
+
const t = o.counting || "COUNT_UNOPENED_NOTIFICATIONS";
|
|
5
|
+
return /* @__PURE__ */ n(r, { ...o, count: t });
|
|
6
|
+
};
|
|
7
|
+
export {
|
|
8
|
+
N as NotificationCounter
|
|
9
|
+
};
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { useContext as o, useEffect as r } from "react";
|
|
3
|
+
import { F as g, I as l } from "../../assets/Inbox.js";
|
|
4
|
+
import { NotificationAPIContext as f } from "../Provider/index.js";
|
|
5
|
+
const h = (i) => {
|
|
6
|
+
const e = {
|
|
7
|
+
imageShape: i.imageShape || "circle",
|
|
8
|
+
pagination: i.pagination || "INFINITE_SCROLL",
|
|
9
|
+
pageSize: i.pageSize || 10,
|
|
10
|
+
pagePosition: i.pagePosition || "top",
|
|
11
|
+
style: i.style || {},
|
|
12
|
+
filter: i.filter || g.ALL,
|
|
13
|
+
infiniteScrollHeight: i.infiniteScrollHeight ? i.infiniteScrollHeight : window.innerHeight * 0.75
|
|
14
|
+
}, t = o(f);
|
|
15
|
+
return t ? (r(() => {
|
|
16
|
+
t.markAsOpened();
|
|
17
|
+
const a = setInterval(() => {
|
|
18
|
+
t.markAsOpened();
|
|
19
|
+
}, 5e3);
|
|
20
|
+
return () => clearInterval(a);
|
|
21
|
+
}, []), /* @__PURE__ */ n(
|
|
22
|
+
"div",
|
|
23
|
+
{
|
|
24
|
+
style: {
|
|
25
|
+
padding: 12,
|
|
26
|
+
boxSizing: "border-box",
|
|
27
|
+
background: "#fff",
|
|
28
|
+
...i.style
|
|
29
|
+
},
|
|
30
|
+
children: /* @__PURE__ */ n(
|
|
31
|
+
l,
|
|
32
|
+
{
|
|
33
|
+
maxHeight: e.infiniteScrollHeight,
|
|
34
|
+
pagination: e.pagination,
|
|
35
|
+
filter: e.filter,
|
|
36
|
+
imageShape: e.imageShape,
|
|
37
|
+
pageSize: e.pageSize,
|
|
38
|
+
pagePosition: e.pagePosition
|
|
39
|
+
}
|
|
40
|
+
)
|
|
41
|
+
}
|
|
42
|
+
)) : null;
|
|
43
|
+
};
|
|
44
|
+
export {
|
|
45
|
+
h as NotificationFeed
|
|
46
|
+
};
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { I as a } from "../../assets/Inbox.js";
|
|
3
|
+
import { UnreadBadge as f } from "./UnreadBadge.js";
|
|
4
|
+
import { useContext as r } from "react";
|
|
5
|
+
import { NotificationAPIContext as g } from "../Provider/index.js";
|
|
6
|
+
import { P as u } from "../../assets/index.js";
|
|
7
|
+
import { B as h } from "../../assets/button.js";
|
|
8
|
+
import { R as d } from "../../assets/BellOutlined.js";
|
|
9
|
+
var l = /* @__PURE__ */ ((t) => (t.TOP_LEFT = "top-left", t.TOP_RIGHT = "top-right", t.BOTTOM_LEFT = "bottom-left", t.BOTTOM_RIGHT = "bottom-right", t))(l || {});
|
|
10
|
+
const S = (t) => {
|
|
11
|
+
const e = {
|
|
12
|
+
buttonWidth: t.buttonWidth || 40,
|
|
13
|
+
buttonHeight: t.buttonHeight || 40,
|
|
14
|
+
popupWidth: t.popupWidth || 400,
|
|
15
|
+
popupHeight: t.popupHeight || 600,
|
|
16
|
+
buttonIconSize: t.buttonIconSize || (t.buttonWidth ? t.buttonWidth / 2 : 20),
|
|
17
|
+
imageShape: t.imageShape || "circle",
|
|
18
|
+
pagination: t.pagination || "INFINITE_SCROLL",
|
|
19
|
+
pageSize: t.pageSize || 10,
|
|
20
|
+
pagePosition: t.pagePosition || "top",
|
|
21
|
+
style: {
|
|
22
|
+
zIndex: 999,
|
|
23
|
+
...t.style
|
|
24
|
+
},
|
|
25
|
+
unreadBadgeProps: t.unreadBadgeProps ?? {},
|
|
26
|
+
offsetX: t.offsetX || 16,
|
|
27
|
+
offsetY: t.offsetY || 16,
|
|
28
|
+
position: t.position || "BOTTOM_RIGHT",
|
|
29
|
+
count: t.count || "COUNT_UNOPENED_NOTIFICATIONS",
|
|
30
|
+
filter: t.filter || "ALL"
|
|
31
|
+
}, o = r(g);
|
|
32
|
+
return o ? /* @__PURE__ */ i(
|
|
33
|
+
"div",
|
|
34
|
+
{
|
|
35
|
+
style: {
|
|
36
|
+
position: "fixed",
|
|
37
|
+
right: e.offsetX,
|
|
38
|
+
bottom: e.offsetY,
|
|
39
|
+
...e.style
|
|
40
|
+
},
|
|
41
|
+
children: /* @__PURE__ */ i(
|
|
42
|
+
u,
|
|
43
|
+
{
|
|
44
|
+
autoAdjustOverflow: !0,
|
|
45
|
+
trigger: "click",
|
|
46
|
+
content: /* @__PURE__ */ i(
|
|
47
|
+
a,
|
|
48
|
+
{
|
|
49
|
+
maxHeight: 500,
|
|
50
|
+
pagination: e.pagination,
|
|
51
|
+
filter: e.filter,
|
|
52
|
+
imageShape: e.imageShape,
|
|
53
|
+
pageSize: e.pageSize,
|
|
54
|
+
pagePosition: e.pagePosition
|
|
55
|
+
}
|
|
56
|
+
),
|
|
57
|
+
arrow: !1,
|
|
58
|
+
overlayStyle: {
|
|
59
|
+
padding: "0 16px",
|
|
60
|
+
minWidth: e.popupWidth
|
|
61
|
+
},
|
|
62
|
+
onOpenChange: (n) => {
|
|
63
|
+
n && o.markAsOpened();
|
|
64
|
+
},
|
|
65
|
+
children: /* @__PURE__ */ i(
|
|
66
|
+
"div",
|
|
67
|
+
{
|
|
68
|
+
style: {
|
|
69
|
+
display: "inline-block"
|
|
70
|
+
},
|
|
71
|
+
children: /* @__PURE__ */ i(
|
|
72
|
+
f,
|
|
73
|
+
{
|
|
74
|
+
...t.unreadBadgeProps,
|
|
75
|
+
style: {
|
|
76
|
+
top: 5,
|
|
77
|
+
right: 5
|
|
78
|
+
},
|
|
79
|
+
count: e.count,
|
|
80
|
+
children: /* @__PURE__ */ i(
|
|
81
|
+
h,
|
|
82
|
+
{
|
|
83
|
+
icon: /* @__PURE__ */ i(
|
|
84
|
+
d,
|
|
85
|
+
{
|
|
86
|
+
style: {
|
|
87
|
+
fontSize: e.buttonIconSize
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
),
|
|
91
|
+
style: {
|
|
92
|
+
width: e.buttonWidth,
|
|
93
|
+
height: e.buttonHeight
|
|
94
|
+
},
|
|
95
|
+
shape: "circle",
|
|
96
|
+
type: "default"
|
|
97
|
+
}
|
|
98
|
+
)
|
|
99
|
+
}
|
|
100
|
+
)
|
|
101
|
+
}
|
|
102
|
+
)
|
|
103
|
+
}
|
|
104
|
+
)
|
|
105
|
+
}
|
|
106
|
+
) : null;
|
|
107
|
+
};
|
|
108
|
+
export {
|
|
109
|
+
S as NotificationLauncher,
|
|
110
|
+
l as Position
|
|
111
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import "react/jsx-runtime";
|
|
2
|
+
import { F as s, N as F } from "../../assets/Inbox.js";
|
|
3
|
+
import "./UnreadBadge.js";
|
|
4
|
+
import "../Provider/index.js";
|
|
5
|
+
import "react";
|
|
6
|
+
import "../../assets/index.js";
|
|
7
|
+
import "../../assets/button.js";
|
|
8
|
+
import "../../assets/BellOutlined.js";
|
|
9
|
+
export {
|
|
10
|
+
s as Filter,
|
|
11
|
+
F as NotificationPopup
|
|
12
|
+
};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { jsx as N } from "react/jsx-runtime";
|
|
2
|
+
import { useContext as r } from "react";
|
|
3
|
+
import { NotificationAPIContext as i } from "../Provider/index.js";
|
|
4
|
+
import { B as I } from "../../assets/index2.js";
|
|
5
|
+
var c = /* @__PURE__ */ ((e) => (e.COUNT_UNOPENED_NOTIFICATIONS = "COUNT_UNOPENED_NOTIFICATIONS", e.COUNT_UNARCHIVED_NOTIFICATIONS = "COUNT_UNARCHIVED_NOTIFICATIONS", e))(c || {});
|
|
6
|
+
const d = (e) => {
|
|
7
|
+
const o = r(i);
|
|
8
|
+
return /* @__PURE__ */ N(
|
|
9
|
+
I,
|
|
10
|
+
{
|
|
11
|
+
count: ((n) => e.count === "COUNT_UNOPENED_NOTIFICATIONS" || e.count === void 0 ? n.filter((t) => !t.opened && !t.seen).length : e.count === "COUNT_UNARCHIVED_NOTIFICATIONS" ? n.filter(
|
|
12
|
+
(t) => !t.archived && !t.clicked && !t.replied && !t.actioned1 && !t.actioned2
|
|
13
|
+
).length : n.filter(e.count).length)((o == null ? void 0 : o.notifications) || []),
|
|
14
|
+
color: e.color,
|
|
15
|
+
overflowCount: e.overflowCount,
|
|
16
|
+
dot: e.dot,
|
|
17
|
+
showZero: e.showZero,
|
|
18
|
+
size: e.size,
|
|
19
|
+
style: {
|
|
20
|
+
...e.style
|
|
21
|
+
},
|
|
22
|
+
children: e.children
|
|
23
|
+
}
|
|
24
|
+
);
|
|
25
|
+
};
|
|
26
|
+
export {
|
|
27
|
+
c as COUNT_TYPE,
|
|
28
|
+
d as UnreadBadge
|
|
29
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { NotificationFeed as i } from "./NotificationFeed.js";
|
|
2
|
+
import { N as e } from "../../assets/Inbox.js";
|
|
3
|
+
import { NotificationLauncher as a } from "./NotificationLauncher.js";
|
|
4
|
+
import { NotificationCounter as p } from "./NotificationCounter.js";
|
|
5
|
+
export {
|
|
6
|
+
p as NotificationCounter,
|
|
7
|
+
i as NotificationFeed,
|
|
8
|
+
a as NotificationLauncher,
|
|
9
|
+
e as NotificationPopup
|
|
10
|
+
};
|