@liveblocks/react-ui 2.14.0 → 2.15.0
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/_private/index.d.mts +24 -22
- package/dist/_private/index.d.ts +24 -22
- package/dist/_private/index.js +1 -0
- package/dist/_private/index.js.map +1 -1
- package/dist/_private/index.mjs +1 -0
- package/dist/_private/index.mjs.map +1 -1
- package/dist/components/Comment.js +358 -256
- package/dist/components/Comment.js.map +1 -1
- package/dist/components/Comment.mjs +334 -232
- package/dist/components/Comment.mjs.map +1 -1
- package/dist/components/Composer.js +308 -225
- package/dist/components/Composer.js.map +1 -1
- package/dist/components/Composer.mjs +288 -206
- package/dist/components/Composer.mjs.map +1 -1
- package/dist/components/HistoryVersionSummary.js +28 -32
- package/dist/components/HistoryVersionSummary.js.map +1 -1
- package/dist/components/HistoryVersionSummary.mjs +27 -31
- package/dist/components/HistoryVersionSummary.mjs.map +1 -1
- package/dist/components/HistoryVersionSummaryList.js +11 -9
- package/dist/components/HistoryVersionSummaryList.js.map +1 -1
- package/dist/components/HistoryVersionSummaryList.mjs +10 -8
- package/dist/components/HistoryVersionSummaryList.mjs.map +1 -1
- package/dist/components/InboxNotification.js +202 -143
- package/dist/components/InboxNotification.js.map +1 -1
- package/dist/components/InboxNotification.mjs +180 -121
- package/dist/components/InboxNotification.mjs.map +1 -1
- package/dist/components/InboxNotificationList.js +19 -14
- package/dist/components/InboxNotificationList.js.map +1 -1
- package/dist/components/InboxNotificationList.mjs +17 -12
- package/dist/components/InboxNotificationList.mjs.map +1 -1
- package/dist/components/Thread.js +104 -86
- package/dist/components/Thread.js.map +1 -1
- package/dist/components/Thread.mjs +93 -75
- package/dist/components/Thread.mjs.map +1 -1
- package/dist/components/internal/Attachment.js +161 -113
- package/dist/components/internal/Attachment.js.map +1 -1
- package/dist/components/internal/Attachment.mjs +150 -102
- package/dist/components/internal/Attachment.mjs.map +1 -1
- package/dist/components/internal/Attribution.js +15 -13
- package/dist/components/internal/Attribution.js.map +1 -1
- package/dist/components/internal/Attribution.mjs +15 -13
- package/dist/components/internal/Attribution.mjs.map +1 -1
- package/dist/components/internal/Avatar.js +27 -20
- package/dist/components/internal/Avatar.js.map +1 -1
- package/dist/components/internal/Avatar.mjs +23 -16
- package/dist/components/internal/Avatar.mjs.map +1 -1
- package/dist/components/internal/Button.js +5 -4
- package/dist/components/internal/Button.js.map +1 -1
- package/dist/components/internal/Button.mjs +4 -3
- package/dist/components/internal/Button.mjs.map +1 -1
- package/dist/components/internal/Dropdown.js +27 -19
- package/dist/components/internal/Dropdown.js.map +1 -1
- package/dist/components/internal/Dropdown.mjs +26 -18
- package/dist/components/internal/Dropdown.mjs.map +1 -1
- package/dist/components/internal/Emoji.js +4 -3
- package/dist/components/internal/Emoji.js.map +1 -1
- package/dist/components/internal/Emoji.mjs +3 -2
- package/dist/components/internal/Emoji.mjs.map +1 -1
- package/dist/components/internal/EmojiPicker.js +96 -72
- package/dist/components/internal/EmojiPicker.js.map +1 -1
- package/dist/components/internal/EmojiPicker.mjs +90 -66
- package/dist/components/internal/EmojiPicker.mjs.map +1 -1
- package/dist/components/internal/Icon.js +5 -4
- package/dist/components/internal/Icon.js.map +1 -1
- package/dist/components/internal/Icon.mjs +5 -4
- package/dist/components/internal/Icon.mjs.map +1 -1
- package/dist/components/internal/InboxNotificationThread.js +53 -38
- package/dist/components/internal/InboxNotificationThread.js.map +1 -1
- package/dist/components/internal/InboxNotificationThread.mjs +53 -38
- package/dist/components/internal/InboxNotificationThread.mjs.map +1 -1
- package/dist/components/internal/List.js +8 -6
- package/dist/components/internal/List.js.map +1 -1
- package/dist/components/internal/List.mjs +6 -4
- package/dist/components/internal/List.mjs.map +1 -1
- package/dist/components/internal/Room.js +8 -6
- package/dist/components/internal/Room.js.map +1 -1
- package/dist/components/internal/Room.mjs +7 -5
- package/dist/components/internal/Room.mjs.map +1 -1
- package/dist/components/internal/Tooltip.js +49 -33
- package/dist/components/internal/Tooltip.js.map +1 -1
- package/dist/components/internal/Tooltip.mjs +46 -30
- package/dist/components/internal/Tooltip.mjs.map +1 -1
- package/dist/components/internal/User.js +8 -6
- package/dist/components/internal/User.js.map +1 -1
- package/dist/components/internal/User.mjs +7 -5
- package/dist/components/internal/User.mjs.map +1 -1
- package/dist/components.js +12 -29
- package/dist/components.js.map +1 -1
- package/dist/components.mjs +6 -5
- package/dist/components.mjs.map +1 -1
- package/dist/config.js +16 -12
- package/dist/config.js.map +1 -1
- package/dist/config.mjs +13 -9
- package/dist/config.mjs.map +1 -1
- package/dist/icons/ArrowDown.js +7 -6
- package/dist/icons/ArrowDown.js.map +1 -1
- package/dist/icons/ArrowDown.mjs +7 -6
- package/dist/icons/ArrowDown.mjs.map +1 -1
- package/dist/icons/ArrowUp.js +7 -6
- package/dist/icons/ArrowUp.js.map +1 -1
- package/dist/icons/ArrowUp.mjs +7 -6
- package/dist/icons/ArrowUp.mjs.map +1 -1
- package/dist/icons/Attachment.js +7 -6
- package/dist/icons/Attachment.js.map +1 -1
- package/dist/icons/Attachment.mjs +7 -6
- package/dist/icons/Attachment.mjs.map +1 -1
- package/dist/icons/Bold.js +7 -6
- package/dist/icons/Bold.js.map +1 -1
- package/dist/icons/Bold.mjs +7 -6
- package/dist/icons/Bold.mjs.map +1 -1
- package/dist/icons/Check.js +7 -6
- package/dist/icons/Check.js.map +1 -1
- package/dist/icons/Check.mjs +7 -6
- package/dist/icons/Check.mjs.map +1 -1
- package/dist/icons/Code.js +7 -6
- package/dist/icons/Code.js.map +1 -1
- package/dist/icons/Code.mjs +7 -6
- package/dist/icons/Code.mjs.map +1 -1
- package/dist/icons/Cross.js +12 -8
- package/dist/icons/Cross.js.map +1 -1
- package/dist/icons/Cross.mjs +12 -8
- package/dist/icons/Cross.mjs.map +1 -1
- package/dist/icons/Delete.js +7 -6
- package/dist/icons/Delete.js.map +1 -1
- package/dist/icons/Delete.mjs +7 -6
- package/dist/icons/Delete.mjs.map +1 -1
- package/dist/icons/Edit.js +7 -6
- package/dist/icons/Edit.js.map +1 -1
- package/dist/icons/Edit.mjs +7 -6
- package/dist/icons/Edit.mjs.map +1 -1
- package/dist/icons/Ellipsis.js +21 -16
- package/dist/icons/Ellipsis.js.map +1 -1
- package/dist/icons/Ellipsis.mjs +21 -16
- package/dist/icons/Ellipsis.mjs.map +1 -1
- package/dist/icons/Emoji.js +25 -18
- package/dist/icons/Emoji.js.map +1 -1
- package/dist/icons/Emoji.mjs +25 -18
- package/dist/icons/Emoji.mjs.map +1 -1
- package/dist/icons/EmojiAdd.js +28 -20
- package/dist/icons/EmojiAdd.js.map +1 -1
- package/dist/icons/EmojiAdd.mjs +28 -20
- package/dist/icons/EmojiAdd.mjs.map +1 -1
- package/dist/icons/Italic.js +7 -6
- package/dist/icons/Italic.js.map +1 -1
- package/dist/icons/Italic.mjs +7 -6
- package/dist/icons/Italic.mjs.map +1 -1
- package/dist/icons/Mention.js +12 -8
- package/dist/icons/Mention.js.map +1 -1
- package/dist/icons/Mention.mjs +12 -8
- package/dist/icons/Mention.mjs.map +1 -1
- package/dist/icons/Resolve.js +14 -10
- package/dist/icons/Resolve.js.map +1 -1
- package/dist/icons/Resolve.mjs +14 -10
- package/dist/icons/Resolve.mjs.map +1 -1
- package/dist/icons/Resolved.js +16 -12
- package/dist/icons/Resolved.js.map +1 -1
- package/dist/icons/Resolved.mjs +16 -12
- package/dist/icons/Resolved.mjs.map +1 -1
- package/dist/icons/Restore.js +12 -8
- package/dist/icons/Restore.js.map +1 -1
- package/dist/icons/Restore.mjs +12 -8
- package/dist/icons/Restore.mjs.map +1 -1
- package/dist/icons/Search.js +7 -6
- package/dist/icons/Search.js.map +1 -1
- package/dist/icons/Search.mjs +7 -6
- package/dist/icons/Search.mjs.map +1 -1
- package/dist/icons/Send.js +7 -6
- package/dist/icons/Send.js.map +1 -1
- package/dist/icons/Send.mjs +7 -6
- package/dist/icons/Send.mjs.map +1 -1
- package/dist/icons/Spinner.js +8 -7
- package/dist/icons/Spinner.js.map +1 -1
- package/dist/icons/Spinner.mjs +8 -7
- package/dist/icons/Spinner.mjs.map +1 -1
- package/dist/icons/Strikethrough.js +7 -6
- package/dist/icons/Strikethrough.js.map +1 -1
- package/dist/icons/Strikethrough.mjs +7 -6
- package/dist/icons/Strikethrough.mjs.map +1 -1
- package/dist/icons/Warning.js +14 -10
- package/dist/icons/Warning.js.map +1 -1
- package/dist/icons/Warning.mjs +14 -10
- package/dist/icons/Warning.mjs.map +1 -1
- package/dist/icons/index.js +42 -0
- package/dist/icons/index.js.map +1 -0
- package/dist/icons/index.mjs +19 -0
- package/dist/icons/index.mjs.map +1 -0
- package/dist/index.d.mts +14 -12
- package/dist/index.d.ts +14 -12
- package/dist/overrides.js +65 -36
- package/dist/overrides.js.map +1 -1
- package/dist/overrides.mjs +59 -12
- package/dist/overrides.mjs.map +1 -1
- package/dist/primitives/Comment/index.js +75 -66
- package/dist/primitives/Comment/index.js.map +1 -1
- package/dist/primitives/Comment/index.mjs +71 -62
- package/dist/primitives/Comment/index.mjs.map +1 -1
- package/dist/primitives/Composer/contexts.js +11 -11
- package/dist/primitives/Composer/index.js +343 -284
- package/dist/primitives/Composer/index.js.map +1 -1
- package/dist/primitives/Composer/index.mjs +262 -203
- package/dist/primitives/Composer/index.mjs.map +1 -1
- package/dist/primitives/Composer/utils.js +20 -21
- package/dist/primitives/Composer/utils.js.map +1 -1
- package/dist/primitives/Composer/utils.mjs +4 -5
- package/dist/primitives/Composer/utils.mjs.map +1 -1
- package/dist/primitives/EmojiPicker/contexts.js +3 -3
- package/dist/primitives/EmojiPicker/index.js +160 -142
- package/dist/primitives/EmojiPicker/index.js.map +1 -1
- package/dist/primitives/EmojiPicker/index.mjs +122 -104
- package/dist/primitives/EmojiPicker/index.mjs.map +1 -1
- package/dist/primitives/FileSize.js +9 -7
- package/dist/primitives/FileSize.js.map +1 -1
- package/dist/primitives/FileSize.mjs +7 -5
- package/dist/primitives/FileSize.mjs.map +1 -1
- package/dist/primitives/Timestamp.js +12 -10
- package/dist/primitives/Timestamp.js.map +1 -1
- package/dist/primitives/Timestamp.mjs +7 -5
- package/dist/primitives/Timestamp.mjs.map +1 -1
- package/dist/primitives/index.d.mts +24 -23
- package/dist/primitives/index.d.ts +24 -23
- package/dist/primitives/internal/Emoji.js +7 -5
- package/dist/primitives/internal/Emoji.js.map +1 -1
- package/dist/primitives/internal/Emoji.mjs +6 -4
- package/dist/primitives/internal/Emoji.mjs.map +1 -1
- package/dist/shared.js +2 -7
- package/dist/shared.js.map +1 -1
- package/dist/shared.mjs +2 -7
- package/dist/shared.mjs.map +1 -1
- package/dist/slate/plugins/auto-links.mjs +1 -1
- package/dist/slate/plugins/custom-links.mjs +1 -1
- package/dist/slate/plugins/mentions.mjs +1 -1
- package/dist/utils/Persist.js +19 -18
- package/dist/utils/Persist.js.map +1 -1
- package/dist/utils/Persist.mjs +7 -6
- package/dist/utils/Persist.mjs.map +1 -1
- package/dist/utils/Portal.js +5 -4
- package/dist/utils/Portal.js.map +1 -1
- package/dist/utils/Portal.mjs +4 -3
- package/dist/utils/Portal.mjs.map +1 -1
- package/dist/utils/use-controllable-state.js +5 -5
- package/dist/utils/use-index.js +7 -7
- package/dist/utils/use-initial.js +2 -2
- package/dist/utils/use-interval.js +4 -4
- package/dist/utils/use-latest.js +3 -3
- package/dist/utils/use-observable.js +2 -2
- package/dist/utils/use-refs.js +2 -2
- package/dist/utils/use-rerender.js +2 -2
- package/dist/utils/use-visible.js +24 -2
- package/dist/utils/use-visible.js.map +1 -1
- package/dist/utils/use-visible.mjs +23 -2
- package/dist/utils/use-visible.mjs.map +1 -1
- package/dist/utils/use-window-focus.js +2 -2
- package/dist/utils/use-window-focus.js.map +1 -1
- package/dist/utils/use-window-focus.mjs +1 -1
- package/dist/utils/use-window-focus.mjs.map +1 -1
- package/dist/version.js +2 -2
- package/dist/version.js.map +1 -1
- package/dist/version.mjs +2 -2
- package/dist/version.mjs.map +1 -1
- package/package.json +10 -25
- package/dist/utils/use-id.js +0 -29
- package/dist/utils/use-id.js.map +0 -1
- package/dist/utils/use-id.mjs +0 -27
- package/dist/utils/use-id.mjs.map +0 -1
- package/dist/utils/use-layout-effect.js +0 -8
- package/dist/utils/use-layout-effect.js.map +0 -1
- package/dist/utils/use-layout-effect.mjs +0 -6
- package/dist/utils/use-layout-effect.mjs.map +0 -1
- package/dist/utils/use-transition.js +0 -16
- package/dist/utils/use-transition.js.map +0 -1
- package/dist/utils/use-transition.mjs +0 -14
- package/dist/utils/use-transition.mjs.map +0 -1
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { classNames } from '../../utils/class-names.mjs';
|
|
3
3
|
|
|
4
4
|
const ICON_WIDTH = 20;
|
|
5
5
|
const ICON_HEIGHT = 20;
|
|
6
6
|
function Icon({ children, className, ...props }) {
|
|
7
|
-
return /* @__PURE__ */
|
|
7
|
+
return /* @__PURE__ */ jsx("svg", {
|
|
8
8
|
xmlns: "http://www.w3.org/2000/svg",
|
|
9
9
|
width: ICON_WIDTH,
|
|
10
10
|
height: ICON_HEIGHT,
|
|
@@ -16,8 +16,9 @@ function Icon({ children, className, ...props }) {
|
|
|
16
16
|
strokeLinejoin: "round",
|
|
17
17
|
role: "presentation",
|
|
18
18
|
className: classNames("lb-icon", className),
|
|
19
|
-
...props
|
|
20
|
-
|
|
19
|
+
...props,
|
|
20
|
+
children
|
|
21
|
+
});
|
|
21
22
|
}
|
|
22
23
|
|
|
23
24
|
export { ICON_HEIGHT, ICON_WIDTH, Icon };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.mjs","sources":["../../../src/components/internal/Icon.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\
|
|
1
|
+
{"version":3,"file":"Icon.mjs","sources":["../../../src/components/internal/Icon.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport const ICON_WIDTH = 20;\nexport const ICON_HEIGHT = 20;\n\nexport function Icon({ children, className, ...props }: ComponentProps<\"svg\">) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={ICON_WIDTH}\n height={ICON_HEIGHT}\n viewBox={`0 0 ${ICON_WIDTH} ${ICON_HEIGHT}`}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={1.5}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n role=\"presentation\"\n className={classNames(\"lb-icon\", className)}\n {...props}\n >\n {children}\n </svg>\n );\n}\n"],"names":[],"mappings":";;;AAIO,MAAM,UAAa,GAAA,GAAA;AACnB,MAAM,WAAc,GAAA,GAAA;AAEpB,SAAS,IAAK,CAAA,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,OAAgC,EAAA;AAC7E,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,KAAM,EAAA,4BAAA;AAAA,IACN,KAAO,EAAA,UAAA;AAAA,IACP,MAAQ,EAAA,WAAA;AAAA,IACR,OAAA,EAAS,OAAO,UAAc,CAAA,CAAA,EAAA,WAAA,CAAA,CAAA;AAAA,IAC9B,IAAK,EAAA,MAAA;AAAA,IACL,MAAO,EAAA,cAAA;AAAA,IACP,WAAa,EAAA,GAAA;AAAA,IACb,aAAc,EAAA,OAAA;AAAA,IACd,cAAe,EAAA,OAAA;AAAA,IACf,IAAK,EAAA,cAAA;AAAA,IACL,SAAA,EAAW,UAAW,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,IACzC,GAAG,KAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
3
4
|
var core = require('@liveblocks/core');
|
|
4
|
-
var React = require('react');
|
|
5
5
|
var overrides = require('../../overrides.js');
|
|
6
6
|
var index = require('../../primitives/Comment/index.js');
|
|
7
7
|
var classNames = require('../../utils/class-names.js');
|
|
@@ -19,47 +19,62 @@ function InboxNotificationComment({
|
|
|
19
19
|
...props
|
|
20
20
|
}) {
|
|
21
21
|
const $ = overrides.useOverrides(overrides$1);
|
|
22
|
-
return /* @__PURE__ */
|
|
22
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
23
23
|
className: classNames.classNames(
|
|
24
24
|
"lb-root lb-inbox-notification-comment lb-comment",
|
|
25
25
|
className
|
|
26
26
|
),
|
|
27
|
-
...props
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
27
|
+
...props,
|
|
28
|
+
children: [
|
|
29
|
+
showHeader && /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
30
|
+
className: "lb-comment-header",
|
|
31
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(User.User, {
|
|
32
|
+
className: "lb-comment-author",
|
|
33
|
+
userId: comment.userId
|
|
34
|
+
})
|
|
35
|
+
}),
|
|
36
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
37
|
+
className: "lb-comment-content",
|
|
38
|
+
children: comment.body ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
39
|
+
children: [
|
|
40
|
+
/* @__PURE__ */ jsxRuntime.jsx(index.Body, {
|
|
41
|
+
className: "lb-comment-body",
|
|
42
|
+
body: comment.body,
|
|
43
|
+
components: {
|
|
44
|
+
Mention: Comment.CommentMention,
|
|
45
|
+
Link: Comment.CommentNonInteractiveLink
|
|
46
|
+
}
|
|
47
|
+
}),
|
|
48
|
+
showReactions && comment.reactions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
49
|
+
className: "lb-comment-reactions",
|
|
50
|
+
children: comment.reactions.map((reaction) => /* @__PURE__ */ jsxRuntime.jsx(Comment.CommentNonInteractiveReaction, {
|
|
51
|
+
reaction,
|
|
52
|
+
overrides: overrides$1,
|
|
53
|
+
disabled: true
|
|
54
|
+
}, reaction.emoji))
|
|
55
|
+
}),
|
|
56
|
+
showAttachments && comment.attachments.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
57
|
+
className: "lb-comment-attachments",
|
|
58
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
59
|
+
className: "lb-attachments",
|
|
60
|
+
children: comment.attachments.map((attachment) => /* @__PURE__ */ jsxRuntime.jsx(Comment.CommentNonInteractiveFileAttachment, {
|
|
61
|
+
attachment,
|
|
62
|
+
overrides: overrides$1,
|
|
63
|
+
roomId: comment.roomId
|
|
64
|
+
}, attachment.id))
|
|
65
|
+
})
|
|
66
|
+
}) : null
|
|
67
|
+
]
|
|
68
|
+
}) : /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
69
|
+
className: "lb-comment-body",
|
|
70
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("p", {
|
|
71
|
+
className: "lb-comment-deleted",
|
|
72
|
+
children: $.COMMENT_DELETED
|
|
73
|
+
})
|
|
74
|
+
})
|
|
75
|
+
})
|
|
76
|
+
]
|
|
77
|
+
});
|
|
63
78
|
}
|
|
64
79
|
function findLastCommentWithMentionedId(comments, mentionedId) {
|
|
65
80
|
if (!comments.length) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InboxNotificationThread.js","sources":["../../../src/components/internal/InboxNotificationThread.tsx"],"sourcesContent":["import type {\n BaseMetadata,\n CommentData,\n InboxNotificationThreadData,\n ThreadData,\n} from \"@liveblocks/core\";\nimport { getMentionedIdsFromCommentBody } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\nimport React from \"react\";\n\nimport {\n type CommentOverrides,\n type GlobalOverrides,\n useOverrides,\n} from \"../../overrides\";\nimport * as CommentPrimitive from \"../../primitives/Comment\";\nimport { classNames } from \"../../utils/class-names\";\nimport {\n CommentMention,\n CommentNonInteractiveFileAttachment,\n CommentNonInteractiveLink,\n CommentNonInteractiveReaction,\n} from \"../Comment\";\nimport { User } from \"./User\";\n\ntype InboxNotificationThreadCommentsContents = {\n type: \"comments\";\n unread: boolean;\n comments: CommentData[];\n userIds: string[];\n date: Date;\n};\n\ntype InboxNotificationThreadMentionContents = {\n type: \"mention\";\n unread: boolean;\n comments: CommentData[];\n userIds: string[];\n date: Date;\n};\n\nexport const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;\n\ntype InboxNotificationThreadContents =\n | InboxNotificationThreadCommentsContents\n | InboxNotificationThreadMentionContents;\n\ninterface InboxNotificationCommentProps extends ComponentProps<\"div\"> {\n comment: CommentData;\n showHeader?: boolean;\n showAttachments?: boolean;\n showReactions?: boolean;\n overrides?: Partial<GlobalOverrides & CommentOverrides>;\n}\n\nexport function InboxNotificationComment({\n comment,\n showHeader = true,\n showAttachments = true,\n showReactions = true,\n overrides,\n className,\n ...props\n}: InboxNotificationCommentProps) {\n const $ = useOverrides(overrides);\n\n return (\n <div\n className={classNames(\n \"lb-root lb-inbox-notification-comment lb-comment\",\n className\n )}\n {...props}\n >\n {showHeader && (\n <div className=\"lb-comment-header\">\n <User className=\"lb-comment-author\" userId={comment.userId} />\n </div>\n )}\n <div className=\"lb-comment-content\">\n {comment.body ? (\n <>\n <CommentPrimitive.Body\n className=\"lb-comment-body\"\n body={comment.body}\n components={{\n Mention: CommentMention,\n Link: CommentNonInteractiveLink,\n }}\n />\n {showReactions && comment.reactions.length > 0 && (\n <div className=\"lb-comment-reactions\">\n {comment.reactions.map((reaction) => (\n <CommentNonInteractiveReaction\n key={reaction.emoji}\n reaction={reaction}\n overrides={overrides}\n disabled\n />\n ))}\n </div>\n )}\n {showAttachments && comment.attachments.length > 0 ? (\n <div className=\"lb-comment-attachments\">\n <div className=\"lb-attachments\">\n {comment.attachments.map((attachment) => (\n <CommentNonInteractiveFileAttachment\n key={attachment.id}\n attachment={attachment}\n overrides={overrides}\n roomId={comment.roomId}\n />\n ))}\n </div>\n </div>\n ) : null}\n </>\n ) : (\n <div className=\"lb-comment-body\">\n <p className=\"lb-comment-deleted\">{$.COMMENT_DELETED}</p>\n </div>\n )}\n </div>\n </div>\n );\n}\n\n/**\n * Find the last comment with a mention for the given user ID,\n * unless the comment was created by the user themselves.\n */\nfunction findLastCommentWithMentionedId(\n comments: CommentData[],\n mentionedId: string\n) {\n if (!comments.length) {\n return;\n }\n\n for (let i = comments.length - 1; i >= 0; i--) {\n const comment = comments[i]!;\n\n if (comment.userId === mentionedId) {\n continue;\n }\n\n if (comment.body) {\n const mentionedIds = getMentionedIdsFromCommentBody(comment.body);\n\n if (mentionedIds.includes(mentionedId)) {\n return comment;\n }\n }\n }\n\n return;\n}\n\nfunction getUserIdsFromComments(comments: CommentData[]) {\n return Array.from(new Set(comments.map((comment) => comment.userId)));\n}\n\nexport function generateInboxNotificationThreadContents(\n inboxNotification: InboxNotificationThreadData,\n thread: ThreadData<BaseMetadata>,\n userId: string\n): InboxNotificationThreadContents {\n const unreadComments = thread.comments.filter((comment) => {\n if (!comment.body) {\n return false;\n }\n\n return inboxNotification.readAt\n ? comment.createdAt > inboxNotification.readAt &&\n comment.createdAt <= inboxNotification.notifiedAt\n : comment.createdAt <= inboxNotification.notifiedAt;\n });\n\n // If the thread is read, show the last comments.\n if (unreadComments.length === 0) {\n const lastComments = thread.comments\n .filter((comment) => comment.body)\n .slice(-INBOX_NOTIFICATION_THREAD_MAX_COMMENTS);\n\n return {\n type: \"comments\",\n unread: false,\n comments: lastComments,\n userIds: getUserIdsFromComments(lastComments),\n date: inboxNotification.notifiedAt,\n };\n }\n\n const commentWithMention = findLastCommentWithMentionedId(\n unreadComments,\n userId\n );\n\n // If the thread contains one or more mentions for the current user, show the last comment with a mention.\n if (commentWithMention) {\n return {\n type: \"mention\",\n unread: true,\n comments: [commentWithMention],\n userIds: [commentWithMention.userId],\n date: commentWithMention.createdAt,\n };\n }\n\n const lastUnreadComments = unreadComments.slice(\n -INBOX_NOTIFICATION_THREAD_MAX_COMMENTS\n );\n\n // Otherwise, show the last unread comments.\n return {\n type: \"comments\",\n unread: true,\n comments: lastUnreadComments,\n userIds: getUserIdsFromComments(unreadComments),\n date: inboxNotification.notifiedAt,\n };\n}\n"],"names":["overrides","useOverrides","classNames","User","CommentPrimitive.Body","CommentMention","CommentNonInteractiveLink","CommentNonInteractiveReaction","CommentNonInteractiveFileAttachment","getMentionedIdsFromCommentBody"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"InboxNotificationThread.js","sources":["../../../src/components/internal/InboxNotificationThread.tsx"],"sourcesContent":["import type {\n BaseMetadata,\n CommentData,\n InboxNotificationThreadData,\n ThreadData,\n} from \"@liveblocks/core\";\nimport { getMentionedIdsFromCommentBody } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\n\nimport {\n type CommentOverrides,\n type GlobalOverrides,\n useOverrides,\n} from \"../../overrides\";\nimport * as CommentPrimitive from \"../../primitives/Comment\";\nimport { classNames } from \"../../utils/class-names\";\nimport {\n CommentMention,\n CommentNonInteractiveFileAttachment,\n CommentNonInteractiveLink,\n CommentNonInteractiveReaction,\n} from \"../Comment\";\nimport { User } from \"./User\";\n\ntype InboxNotificationThreadCommentsContents = {\n type: \"comments\";\n unread: boolean;\n comments: CommentData[];\n userIds: string[];\n date: Date;\n};\n\ntype InboxNotificationThreadMentionContents = {\n type: \"mention\";\n unread: boolean;\n comments: CommentData[];\n userIds: string[];\n date: Date;\n};\n\nexport const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;\n\ntype InboxNotificationThreadContents =\n | InboxNotificationThreadCommentsContents\n | InboxNotificationThreadMentionContents;\n\ninterface InboxNotificationCommentProps extends ComponentProps<\"div\"> {\n comment: CommentData;\n showHeader?: boolean;\n showAttachments?: boolean;\n showReactions?: boolean;\n overrides?: Partial<GlobalOverrides & CommentOverrides>;\n}\n\nexport function InboxNotificationComment({\n comment,\n showHeader = true,\n showAttachments = true,\n showReactions = true,\n overrides,\n className,\n ...props\n}: InboxNotificationCommentProps) {\n const $ = useOverrides(overrides);\n\n return (\n <div\n className={classNames(\n \"lb-root lb-inbox-notification-comment lb-comment\",\n className\n )}\n {...props}\n >\n {showHeader && (\n <div className=\"lb-comment-header\">\n <User className=\"lb-comment-author\" userId={comment.userId} />\n </div>\n )}\n <div className=\"lb-comment-content\">\n {comment.body ? (\n <>\n <CommentPrimitive.Body\n className=\"lb-comment-body\"\n body={comment.body}\n components={{\n Mention: CommentMention,\n Link: CommentNonInteractiveLink,\n }}\n />\n {showReactions && comment.reactions.length > 0 && (\n <div className=\"lb-comment-reactions\">\n {comment.reactions.map((reaction) => (\n <CommentNonInteractiveReaction\n key={reaction.emoji}\n reaction={reaction}\n overrides={overrides}\n disabled\n />\n ))}\n </div>\n )}\n {showAttachments && comment.attachments.length > 0 ? (\n <div className=\"lb-comment-attachments\">\n <div className=\"lb-attachments\">\n {comment.attachments.map((attachment) => (\n <CommentNonInteractiveFileAttachment\n key={attachment.id}\n attachment={attachment}\n overrides={overrides}\n roomId={comment.roomId}\n />\n ))}\n </div>\n </div>\n ) : null}\n </>\n ) : (\n <div className=\"lb-comment-body\">\n <p className=\"lb-comment-deleted\">{$.COMMENT_DELETED}</p>\n </div>\n )}\n </div>\n </div>\n );\n}\n\n/**\n * Find the last comment with a mention for the given user ID,\n * unless the comment was created by the user themselves.\n */\nfunction findLastCommentWithMentionedId(\n comments: CommentData[],\n mentionedId: string\n) {\n if (!comments.length) {\n return;\n }\n\n for (let i = comments.length - 1; i >= 0; i--) {\n const comment = comments[i]!;\n\n if (comment.userId === mentionedId) {\n continue;\n }\n\n if (comment.body) {\n const mentionedIds = getMentionedIdsFromCommentBody(comment.body);\n\n if (mentionedIds.includes(mentionedId)) {\n return comment;\n }\n }\n }\n\n return;\n}\n\nfunction getUserIdsFromComments(comments: CommentData[]) {\n return Array.from(new Set(comments.map((comment) => comment.userId)));\n}\n\nexport function generateInboxNotificationThreadContents(\n inboxNotification: InboxNotificationThreadData,\n thread: ThreadData<BaseMetadata>,\n userId: string\n): InboxNotificationThreadContents {\n const unreadComments = thread.comments.filter((comment) => {\n if (!comment.body) {\n return false;\n }\n\n return inboxNotification.readAt\n ? comment.createdAt > inboxNotification.readAt &&\n comment.createdAt <= inboxNotification.notifiedAt\n : comment.createdAt <= inboxNotification.notifiedAt;\n });\n\n // If the thread is read, show the last comments.\n if (unreadComments.length === 0) {\n const lastComments = thread.comments\n .filter((comment) => comment.body)\n .slice(-INBOX_NOTIFICATION_THREAD_MAX_COMMENTS);\n\n return {\n type: \"comments\",\n unread: false,\n comments: lastComments,\n userIds: getUserIdsFromComments(lastComments),\n date: inboxNotification.notifiedAt,\n };\n }\n\n const commentWithMention = findLastCommentWithMentionedId(\n unreadComments,\n userId\n );\n\n // If the thread contains one or more mentions for the current user, show the last comment with a mention.\n if (commentWithMention) {\n return {\n type: \"mention\",\n unread: true,\n comments: [commentWithMention],\n userIds: [commentWithMention.userId],\n date: commentWithMention.createdAt,\n };\n }\n\n const lastUnreadComments = unreadComments.slice(\n -INBOX_NOTIFICATION_THREAD_MAX_COMMENTS\n );\n\n // Otherwise, show the last unread comments.\n return {\n type: \"comments\",\n unread: true,\n comments: lastUnreadComments,\n userIds: getUserIdsFromComments(unreadComments),\n date: inboxNotification.notifiedAt,\n };\n}\n"],"names":["overrides","useOverrides","jsxs","classNames","jsx","User","Fragment","CommentPrimitive.Body","CommentMention","CommentNonInteractiveLink","CommentNonInteractiveReaction","CommentNonInteractiveFileAttachment","getMentionedIdsFromCommentBody"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
1
2
|
import { getMentionedIdsFromCommentBody } from '@liveblocks/core';
|
|
2
|
-
import React__default from 'react';
|
|
3
3
|
import { useOverrides } from '../../overrides.mjs';
|
|
4
4
|
import { Body as CommentBody } from '../../primitives/Comment/index.mjs';
|
|
5
5
|
import { classNames } from '../../utils/class-names.mjs';
|
|
@@ -17,47 +17,62 @@ function InboxNotificationComment({
|
|
|
17
17
|
...props
|
|
18
18
|
}) {
|
|
19
19
|
const $ = useOverrides(overrides);
|
|
20
|
-
return /* @__PURE__ */
|
|
20
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
21
21
|
className: classNames(
|
|
22
22
|
"lb-root lb-inbox-notification-comment lb-comment",
|
|
23
23
|
className
|
|
24
24
|
),
|
|
25
|
-
...props
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
25
|
+
...props,
|
|
26
|
+
children: [
|
|
27
|
+
showHeader && /* @__PURE__ */ jsx("div", {
|
|
28
|
+
className: "lb-comment-header",
|
|
29
|
+
children: /* @__PURE__ */ jsx(User, {
|
|
30
|
+
className: "lb-comment-author",
|
|
31
|
+
userId: comment.userId
|
|
32
|
+
})
|
|
33
|
+
}),
|
|
34
|
+
/* @__PURE__ */ jsx("div", {
|
|
35
|
+
className: "lb-comment-content",
|
|
36
|
+
children: comment.body ? /* @__PURE__ */ jsxs(Fragment, {
|
|
37
|
+
children: [
|
|
38
|
+
/* @__PURE__ */ jsx(CommentBody, {
|
|
39
|
+
className: "lb-comment-body",
|
|
40
|
+
body: comment.body,
|
|
41
|
+
components: {
|
|
42
|
+
Mention: CommentMention,
|
|
43
|
+
Link: CommentNonInteractiveLink
|
|
44
|
+
}
|
|
45
|
+
}),
|
|
46
|
+
showReactions && comment.reactions.length > 0 && /* @__PURE__ */ jsx("div", {
|
|
47
|
+
className: "lb-comment-reactions",
|
|
48
|
+
children: comment.reactions.map((reaction) => /* @__PURE__ */ jsx(CommentNonInteractiveReaction, {
|
|
49
|
+
reaction,
|
|
50
|
+
overrides,
|
|
51
|
+
disabled: true
|
|
52
|
+
}, reaction.emoji))
|
|
53
|
+
}),
|
|
54
|
+
showAttachments && comment.attachments.length > 0 ? /* @__PURE__ */ jsx("div", {
|
|
55
|
+
className: "lb-comment-attachments",
|
|
56
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
57
|
+
className: "lb-attachments",
|
|
58
|
+
children: comment.attachments.map((attachment) => /* @__PURE__ */ jsx(CommentNonInteractiveFileAttachment, {
|
|
59
|
+
attachment,
|
|
60
|
+
overrides,
|
|
61
|
+
roomId: comment.roomId
|
|
62
|
+
}, attachment.id))
|
|
63
|
+
})
|
|
64
|
+
}) : null
|
|
65
|
+
]
|
|
66
|
+
}) : /* @__PURE__ */ jsx("div", {
|
|
67
|
+
className: "lb-comment-body",
|
|
68
|
+
children: /* @__PURE__ */ jsx("p", {
|
|
69
|
+
className: "lb-comment-deleted",
|
|
70
|
+
children: $.COMMENT_DELETED
|
|
71
|
+
})
|
|
72
|
+
})
|
|
73
|
+
})
|
|
74
|
+
]
|
|
75
|
+
});
|
|
61
76
|
}
|
|
62
77
|
function findLastCommentWithMentionedId(comments, mentionedId) {
|
|
63
78
|
if (!comments.length) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InboxNotificationThread.mjs","sources":["../../../src/components/internal/InboxNotificationThread.tsx"],"sourcesContent":["import type {\n BaseMetadata,\n CommentData,\n InboxNotificationThreadData,\n ThreadData,\n} from \"@liveblocks/core\";\nimport { getMentionedIdsFromCommentBody } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\nimport React from \"react\";\n\nimport {\n type CommentOverrides,\n type GlobalOverrides,\n useOverrides,\n} from \"../../overrides\";\nimport * as CommentPrimitive from \"../../primitives/Comment\";\nimport { classNames } from \"../../utils/class-names\";\nimport {\n CommentMention,\n CommentNonInteractiveFileAttachment,\n CommentNonInteractiveLink,\n CommentNonInteractiveReaction,\n} from \"../Comment\";\nimport { User } from \"./User\";\n\ntype InboxNotificationThreadCommentsContents = {\n type: \"comments\";\n unread: boolean;\n comments: CommentData[];\n userIds: string[];\n date: Date;\n};\n\ntype InboxNotificationThreadMentionContents = {\n type: \"mention\";\n unread: boolean;\n comments: CommentData[];\n userIds: string[];\n date: Date;\n};\n\nexport const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;\n\ntype InboxNotificationThreadContents =\n | InboxNotificationThreadCommentsContents\n | InboxNotificationThreadMentionContents;\n\ninterface InboxNotificationCommentProps extends ComponentProps<\"div\"> {\n comment: CommentData;\n showHeader?: boolean;\n showAttachments?: boolean;\n showReactions?: boolean;\n overrides?: Partial<GlobalOverrides & CommentOverrides>;\n}\n\nexport function InboxNotificationComment({\n comment,\n showHeader = true,\n showAttachments = true,\n showReactions = true,\n overrides,\n className,\n ...props\n}: InboxNotificationCommentProps) {\n const $ = useOverrides(overrides);\n\n return (\n <div\n className={classNames(\n \"lb-root lb-inbox-notification-comment lb-comment\",\n className\n )}\n {...props}\n >\n {showHeader && (\n <div className=\"lb-comment-header\">\n <User className=\"lb-comment-author\" userId={comment.userId} />\n </div>\n )}\n <div className=\"lb-comment-content\">\n {comment.body ? (\n <>\n <CommentPrimitive.Body\n className=\"lb-comment-body\"\n body={comment.body}\n components={{\n Mention: CommentMention,\n Link: CommentNonInteractiveLink,\n }}\n />\n {showReactions && comment.reactions.length > 0 && (\n <div className=\"lb-comment-reactions\">\n {comment.reactions.map((reaction) => (\n <CommentNonInteractiveReaction\n key={reaction.emoji}\n reaction={reaction}\n overrides={overrides}\n disabled\n />\n ))}\n </div>\n )}\n {showAttachments && comment.attachments.length > 0 ? (\n <div className=\"lb-comment-attachments\">\n <div className=\"lb-attachments\">\n {comment.attachments.map((attachment) => (\n <CommentNonInteractiveFileAttachment\n key={attachment.id}\n attachment={attachment}\n overrides={overrides}\n roomId={comment.roomId}\n />\n ))}\n </div>\n </div>\n ) : null}\n </>\n ) : (\n <div className=\"lb-comment-body\">\n <p className=\"lb-comment-deleted\">{$.COMMENT_DELETED}</p>\n </div>\n )}\n </div>\n </div>\n );\n}\n\n/**\n * Find the last comment with a mention for the given user ID,\n * unless the comment was created by the user themselves.\n */\nfunction findLastCommentWithMentionedId(\n comments: CommentData[],\n mentionedId: string\n) {\n if (!comments.length) {\n return;\n }\n\n for (let i = comments.length - 1; i >= 0; i--) {\n const comment = comments[i]!;\n\n if (comment.userId === mentionedId) {\n continue;\n }\n\n if (comment.body) {\n const mentionedIds = getMentionedIdsFromCommentBody(comment.body);\n\n if (mentionedIds.includes(mentionedId)) {\n return comment;\n }\n }\n }\n\n return;\n}\n\nfunction getUserIdsFromComments(comments: CommentData[]) {\n return Array.from(new Set(comments.map((comment) => comment.userId)));\n}\n\nexport function generateInboxNotificationThreadContents(\n inboxNotification: InboxNotificationThreadData,\n thread: ThreadData<BaseMetadata>,\n userId: string\n): InboxNotificationThreadContents {\n const unreadComments = thread.comments.filter((comment) => {\n if (!comment.body) {\n return false;\n }\n\n return inboxNotification.readAt\n ? comment.createdAt > inboxNotification.readAt &&\n comment.createdAt <= inboxNotification.notifiedAt\n : comment.createdAt <= inboxNotification.notifiedAt;\n });\n\n // If the thread is read, show the last comments.\n if (unreadComments.length === 0) {\n const lastComments = thread.comments\n .filter((comment) => comment.body)\n .slice(-INBOX_NOTIFICATION_THREAD_MAX_COMMENTS);\n\n return {\n type: \"comments\",\n unread: false,\n comments: lastComments,\n userIds: getUserIdsFromComments(lastComments),\n date: inboxNotification.notifiedAt,\n };\n }\n\n const commentWithMention = findLastCommentWithMentionedId(\n unreadComments,\n userId\n );\n\n // If the thread contains one or more mentions for the current user, show the last comment with a mention.\n if (commentWithMention) {\n return {\n type: \"mention\",\n unread: true,\n comments: [commentWithMention],\n userIds: [commentWithMention.userId],\n date: commentWithMention.createdAt,\n };\n }\n\n const lastUnreadComments = unreadComments.slice(\n -INBOX_NOTIFICATION_THREAD_MAX_COMMENTS\n );\n\n // Otherwise, show the last unread comments.\n return {\n type: \"comments\",\n unread: true,\n comments: lastUnreadComments,\n userIds: getUserIdsFromComments(unreadComments),\n date: inboxNotification.notifiedAt,\n };\n}\n"],"names":["React","CommentPrimitive.Body"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"InboxNotificationThread.mjs","sources":["../../../src/components/internal/InboxNotificationThread.tsx"],"sourcesContent":["import type {\n BaseMetadata,\n CommentData,\n InboxNotificationThreadData,\n ThreadData,\n} from \"@liveblocks/core\";\nimport { getMentionedIdsFromCommentBody } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\n\nimport {\n type CommentOverrides,\n type GlobalOverrides,\n useOverrides,\n} from \"../../overrides\";\nimport * as CommentPrimitive from \"../../primitives/Comment\";\nimport { classNames } from \"../../utils/class-names\";\nimport {\n CommentMention,\n CommentNonInteractiveFileAttachment,\n CommentNonInteractiveLink,\n CommentNonInteractiveReaction,\n} from \"../Comment\";\nimport { User } from \"./User\";\n\ntype InboxNotificationThreadCommentsContents = {\n type: \"comments\";\n unread: boolean;\n comments: CommentData[];\n userIds: string[];\n date: Date;\n};\n\ntype InboxNotificationThreadMentionContents = {\n type: \"mention\";\n unread: boolean;\n comments: CommentData[];\n userIds: string[];\n date: Date;\n};\n\nexport const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;\n\ntype InboxNotificationThreadContents =\n | InboxNotificationThreadCommentsContents\n | InboxNotificationThreadMentionContents;\n\ninterface InboxNotificationCommentProps extends ComponentProps<\"div\"> {\n comment: CommentData;\n showHeader?: boolean;\n showAttachments?: boolean;\n showReactions?: boolean;\n overrides?: Partial<GlobalOverrides & CommentOverrides>;\n}\n\nexport function InboxNotificationComment({\n comment,\n showHeader = true,\n showAttachments = true,\n showReactions = true,\n overrides,\n className,\n ...props\n}: InboxNotificationCommentProps) {\n const $ = useOverrides(overrides);\n\n return (\n <div\n className={classNames(\n \"lb-root lb-inbox-notification-comment lb-comment\",\n className\n )}\n {...props}\n >\n {showHeader && (\n <div className=\"lb-comment-header\">\n <User className=\"lb-comment-author\" userId={comment.userId} />\n </div>\n )}\n <div className=\"lb-comment-content\">\n {comment.body ? (\n <>\n <CommentPrimitive.Body\n className=\"lb-comment-body\"\n body={comment.body}\n components={{\n Mention: CommentMention,\n Link: CommentNonInteractiveLink,\n }}\n />\n {showReactions && comment.reactions.length > 0 && (\n <div className=\"lb-comment-reactions\">\n {comment.reactions.map((reaction) => (\n <CommentNonInteractiveReaction\n key={reaction.emoji}\n reaction={reaction}\n overrides={overrides}\n disabled\n />\n ))}\n </div>\n )}\n {showAttachments && comment.attachments.length > 0 ? (\n <div className=\"lb-comment-attachments\">\n <div className=\"lb-attachments\">\n {comment.attachments.map((attachment) => (\n <CommentNonInteractiveFileAttachment\n key={attachment.id}\n attachment={attachment}\n overrides={overrides}\n roomId={comment.roomId}\n />\n ))}\n </div>\n </div>\n ) : null}\n </>\n ) : (\n <div className=\"lb-comment-body\">\n <p className=\"lb-comment-deleted\">{$.COMMENT_DELETED}</p>\n </div>\n )}\n </div>\n </div>\n );\n}\n\n/**\n * Find the last comment with a mention for the given user ID,\n * unless the comment was created by the user themselves.\n */\nfunction findLastCommentWithMentionedId(\n comments: CommentData[],\n mentionedId: string\n) {\n if (!comments.length) {\n return;\n }\n\n for (let i = comments.length - 1; i >= 0; i--) {\n const comment = comments[i]!;\n\n if (comment.userId === mentionedId) {\n continue;\n }\n\n if (comment.body) {\n const mentionedIds = getMentionedIdsFromCommentBody(comment.body);\n\n if (mentionedIds.includes(mentionedId)) {\n return comment;\n }\n }\n }\n\n return;\n}\n\nfunction getUserIdsFromComments(comments: CommentData[]) {\n return Array.from(new Set(comments.map((comment) => comment.userId)));\n}\n\nexport function generateInboxNotificationThreadContents(\n inboxNotification: InboxNotificationThreadData,\n thread: ThreadData<BaseMetadata>,\n userId: string\n): InboxNotificationThreadContents {\n const unreadComments = thread.comments.filter((comment) => {\n if (!comment.body) {\n return false;\n }\n\n return inboxNotification.readAt\n ? comment.createdAt > inboxNotification.readAt &&\n comment.createdAt <= inboxNotification.notifiedAt\n : comment.createdAt <= inboxNotification.notifiedAt;\n });\n\n // If the thread is read, show the last comments.\n if (unreadComments.length === 0) {\n const lastComments = thread.comments\n .filter((comment) => comment.body)\n .slice(-INBOX_NOTIFICATION_THREAD_MAX_COMMENTS);\n\n return {\n type: \"comments\",\n unread: false,\n comments: lastComments,\n userIds: getUserIdsFromComments(lastComments),\n date: inboxNotification.notifiedAt,\n };\n }\n\n const commentWithMention = findLastCommentWithMentionedId(\n unreadComments,\n userId\n );\n\n // If the thread contains one or more mentions for the current user, show the last comment with a mention.\n if (commentWithMention) {\n return {\n type: \"mention\",\n unread: true,\n comments: [commentWithMention],\n userIds: [commentWithMention.userId],\n date: commentWithMention.createdAt,\n };\n }\n\n const lastUnreadComments = unreadComments.slice(\n -INBOX_NOTIFICATION_THREAD_MAX_COMMENTS\n );\n\n // Otherwise, show the last unread comments.\n return {\n type: \"comments\",\n unread: true,\n comments: lastUnreadComments,\n userIds: getUserIdsFromComments(unreadComments),\n date: inboxNotification.notifiedAt,\n };\n}\n"],"names":["CommentPrimitive.Body"],"mappings":"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"}
|
|
@@ -1,17 +1,18 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
3
4
|
var reactSlot = require('@radix-ui/react-slot');
|
|
4
|
-
var
|
|
5
|
+
var react = require('react');
|
|
5
6
|
var overrides = require('../../overrides.js');
|
|
6
7
|
var classNames = require('../../utils/class-names.js');
|
|
7
8
|
var intl = require('../../utils/intl.js');
|
|
8
9
|
|
|
9
|
-
const List =
|
|
10
|
+
const List = react.forwardRef(
|
|
10
11
|
({ values, formatRemaining, truncate, locale, className, asChild, ...props }, forwardedRef) => {
|
|
11
12
|
const Component = asChild ? reactSlot.Slot : "span";
|
|
12
13
|
const $ = overrides.useOverrides();
|
|
13
14
|
const formatRemainingWithDefault = formatRemaining ?? $.LIST_REMAINING;
|
|
14
|
-
const formattedList =
|
|
15
|
+
const formattedList = react.useMemo(() => {
|
|
15
16
|
const elements = truncate && truncate < values.length - 1 ? [
|
|
16
17
|
...values.slice(0, truncate),
|
|
17
18
|
formatRemainingWithDefault(values.length - truncate)
|
|
@@ -22,11 +23,12 @@ const List = React.forwardRef(
|
|
|
22
23
|
(part) => part.type === "element" ? elements.shift() : part.value
|
|
23
24
|
);
|
|
24
25
|
}, [formatRemainingWithDefault, locale, truncate, values]);
|
|
25
|
-
return /* @__PURE__ */
|
|
26
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, {
|
|
26
27
|
className: classNames.classNames("lb-list", className),
|
|
27
28
|
...props,
|
|
28
|
-
ref: forwardedRef
|
|
29
|
-
|
|
29
|
+
ref: forwardedRef,
|
|
30
|
+
children: formattedList
|
|
31
|
+
});
|
|
30
32
|
}
|
|
31
33
|
);
|
|
32
34
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.js","sources":["../../../src/components/internal/List.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { ReactNode } from \"react\";\nimport
|
|
1
|
+
{"version":3,"file":"List.js","sources":["../../../src/components/internal/List.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport type { ComponentPropsWithSlot } from \"../../types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { listFormat } from \"../../utils/intl\";\n\nexport interface ListProps extends ComponentPropsWithSlot<\"span\"> {\n values: ReactNode[];\n formatRemaining?: (amount: number) => string;\n truncate?: number;\n locale?: string;\n}\n\nexport const List = forwardRef<HTMLSpanElement, ListProps>(\n (\n { values, formatRemaining, truncate, locale, className, asChild, ...props },\n forwardedRef\n ) => {\n const Component = asChild ? Slot : \"span\";\n const $ = useOverrides();\n const formatRemainingWithDefault = formatRemaining ?? $.LIST_REMAINING;\n const formattedList = useMemo(() => {\n const elements =\n truncate && truncate < values.length - 1\n ? [\n ...values.slice(0, truncate),\n formatRemainingWithDefault(values.length - truncate),\n ]\n : [...values];\n const placeholders = Array(elements.length).fill(\".\");\n const parts = listFormat(locale).formatToParts(placeholders);\n\n return parts.map((part) =>\n part.type === \"element\" ? elements.shift() : part.value\n );\n }, [formatRemainingWithDefault, locale, truncate, values]);\n\n return (\n <Component\n className={classNames(\"lb-list\", className)}\n {...props}\n ref={forwardedRef}\n >\n {formattedList}\n </Component>\n );\n }\n);\n"],"names":["forwardRef","Slot","useOverrides","useMemo","listFormat","jsx","classNames"],"mappings":";;;;;;;;;AAgBO,MAAM,IAAO,GAAAA,gBAAA;AAAA,EAClB,CACE,EAAE,MAAA,EAAQ,eAAiB,EAAA,QAAA,EAAU,QAAQ,SAAW,EAAA,OAAA,EAAA,GAAY,KAAM,EAAA,EAC1E,YACG,KAAA;AACH,IAAM,MAAA,SAAA,GAAY,UAAUC,cAAO,GAAA,MAAA,CAAA;AACnC,IAAA,MAAM,IAAIC,sBAAa,EAAA,CAAA;AACvB,IAAM,MAAA,0BAAA,GAA6B,mBAAmB,CAAE,CAAA,cAAA,CAAA;AACxD,IAAM,MAAA,aAAA,GAAgBC,cAAQ,MAAM;AAClC,MAAA,MAAM,QACJ,GAAA,QAAA,IAAY,QAAW,GAAA,MAAA,CAAO,SAAS,CACnC,GAAA;AAAA,QACE,GAAG,MAAA,CAAO,KAAM,CAAA,CAAA,EAAG,QAAQ,CAAA;AAAA,QAC3B,0BAAA,CAA2B,MAAO,CAAA,MAAA,GAAS,QAAQ,CAAA;AAAA,OACrD,GACA,CAAC,GAAG,MAAM,CAAA,CAAA;AAChB,MAAA,MAAM,eAAe,KAAM,CAAA,QAAA,CAAS,MAAM,CAAA,CAAE,KAAK,GAAG,CAAA,CAAA;AACpD,MAAA,MAAM,KAAQ,GAAAC,eAAA,CAAW,MAAM,CAAA,CAAE,cAAc,YAAY,CAAA,CAAA;AAE3D,MAAA,OAAO,KAAM,CAAA,GAAA;AAAA,QAAI,CAAC,SAChB,IAAK,CAAA,IAAA,KAAS,YAAY,QAAS,CAAA,KAAA,KAAU,IAAK,CAAA,KAAA;AAAA,OACpD,CAAA;AAAA,OACC,CAAC,0BAAA,EAA4B,MAAQ,EAAA,QAAA,EAAU,MAAM,CAAC,CAAA,CAAA;AAEzD,IAAA,uBACGC,cAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAA,EAAWC,qBAAW,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MACzC,GAAG,KAAA;AAAA,MACJ,GAAK,EAAA,YAAA;AAAA,MAEJ,QAAA,EAAA,aAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
1
2
|
import { Slot } from '@radix-ui/react-slot';
|
|
2
|
-
import
|
|
3
|
+
import { forwardRef, useMemo } from 'react';
|
|
3
4
|
import { useOverrides } from '../../overrides.mjs';
|
|
4
5
|
import { classNames } from '../../utils/class-names.mjs';
|
|
5
6
|
import { listFormat } from '../../utils/intl.mjs';
|
|
@@ -20,11 +21,12 @@ const List = forwardRef(
|
|
|
20
21
|
(part) => part.type === "element" ? elements.shift() : part.value
|
|
21
22
|
);
|
|
22
23
|
}, [formatRemainingWithDefault, locale, truncate, values]);
|
|
23
|
-
return /* @__PURE__ */
|
|
24
|
+
return /* @__PURE__ */ jsx(Component, {
|
|
24
25
|
className: classNames("lb-list", className),
|
|
25
26
|
...props,
|
|
26
|
-
ref: forwardedRef
|
|
27
|
-
|
|
27
|
+
ref: forwardedRef,
|
|
28
|
+
children: formattedList
|
|
29
|
+
});
|
|
28
30
|
}
|
|
29
31
|
);
|
|
30
32
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.mjs","sources":["../../../src/components/internal/List.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { ReactNode } from \"react\";\nimport
|
|
1
|
+
{"version":3,"file":"List.mjs","sources":["../../../src/components/internal/List.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport type { ComponentPropsWithSlot } from \"../../types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { listFormat } from \"../../utils/intl\";\n\nexport interface ListProps extends ComponentPropsWithSlot<\"span\"> {\n values: ReactNode[];\n formatRemaining?: (amount: number) => string;\n truncate?: number;\n locale?: string;\n}\n\nexport const List = forwardRef<HTMLSpanElement, ListProps>(\n (\n { values, formatRemaining, truncate, locale, className, asChild, ...props },\n forwardedRef\n ) => {\n const Component = asChild ? Slot : \"span\";\n const $ = useOverrides();\n const formatRemainingWithDefault = formatRemaining ?? $.LIST_REMAINING;\n const formattedList = useMemo(() => {\n const elements =\n truncate && truncate < values.length - 1\n ? [\n ...values.slice(0, truncate),\n formatRemainingWithDefault(values.length - truncate),\n ]\n : [...values];\n const placeholders = Array(elements.length).fill(\".\");\n const parts = listFormat(locale).formatToParts(placeholders);\n\n return parts.map((part) =>\n part.type === \"element\" ? elements.shift() : part.value\n );\n }, [formatRemainingWithDefault, locale, truncate, values]);\n\n return (\n <Component\n className={classNames(\"lb-list\", className)}\n {...props}\n ref={forwardedRef}\n >\n {formattedList}\n </Component>\n );\n }\n);\n"],"names":[],"mappings":";;;;;;;AAgBO,MAAM,IAAO,GAAA,UAAA;AAAA,EAClB,CACE,EAAE,MAAA,EAAQ,eAAiB,EAAA,QAAA,EAAU,QAAQ,SAAW,EAAA,OAAA,EAAA,GAAY,KAAM,EAAA,EAC1E,YACG,KAAA;AACH,IAAM,MAAA,SAAA,GAAY,UAAU,IAAO,GAAA,MAAA,CAAA;AACnC,IAAA,MAAM,IAAI,YAAa,EAAA,CAAA;AACvB,IAAM,MAAA,0BAAA,GAA6B,mBAAmB,CAAE,CAAA,cAAA,CAAA;AACxD,IAAM,MAAA,aAAA,GAAgB,QAAQ,MAAM;AAClC,MAAA,MAAM,QACJ,GAAA,QAAA,IAAY,QAAW,GAAA,MAAA,CAAO,SAAS,CACnC,GAAA;AAAA,QACE,GAAG,MAAA,CAAO,KAAM,CAAA,CAAA,EAAG,QAAQ,CAAA;AAAA,QAC3B,0BAAA,CAA2B,MAAO,CAAA,MAAA,GAAS,QAAQ,CAAA;AAAA,OACrD,GACA,CAAC,GAAG,MAAM,CAAA,CAAA;AAChB,MAAA,MAAM,eAAe,KAAM,CAAA,QAAA,CAAS,MAAM,CAAA,CAAE,KAAK,GAAG,CAAA,CAAA;AACpD,MAAA,MAAM,KAAQ,GAAA,UAAA,CAAW,MAAM,CAAA,CAAE,cAAc,YAAY,CAAA,CAAA;AAE3D,MAAA,OAAO,KAAM,CAAA,GAAA;AAAA,QAAI,CAAC,SAChB,IAAK,CAAA,IAAA,KAAS,YAAY,QAAS,CAAA,KAAA,KAAU,IAAK,CAAA,KAAA;AAAA,OACpD,CAAA;AAAA,OACC,CAAC,0BAAA,EAA4B,MAAQ,EAAA,QAAA,EAAU,MAAM,CAAC,CAAA,CAAA;AAEzD,IAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,MACC,SAAA,EAAW,UAAW,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,MACzC,GAAG,KAAA;AAAA,MACJ,GAAK,EAAA,YAAA;AAAA,MAEJ,QAAA,EAAA,aAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -1,20 +1,22 @@
|
|
|
1
|
-
'use client';
|
|
2
1
|
'use strict';
|
|
3
2
|
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var react = require('@liveblocks/react');
|
|
5
|
-
var
|
|
5
|
+
var react$1 = require('react');
|
|
6
6
|
var classNames = require('../../utils/class-names.js');
|
|
7
7
|
|
|
8
|
+
"use client";
|
|
8
9
|
function Room({ roomId, className, ...props }) {
|
|
9
10
|
const { info, isLoading } = react.useRoomInfo(roomId);
|
|
10
|
-
const resolvedRoomName =
|
|
11
|
+
const resolvedRoomName = react$1.useMemo(() => {
|
|
11
12
|
return info?.name ?? roomId;
|
|
12
13
|
}, [info?.name, roomId]);
|
|
13
|
-
return /* @__PURE__ */
|
|
14
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", {
|
|
14
15
|
className: classNames.classNames("lb-name lb-room", className),
|
|
15
16
|
"data-loading": isLoading ? "" : void 0,
|
|
16
|
-
...props
|
|
17
|
-
|
|
17
|
+
...props,
|
|
18
|
+
children: isLoading ? null : resolvedRoomName
|
|
19
|
+
});
|
|
18
20
|
}
|
|
19
21
|
|
|
20
22
|
exports.Room = Room;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Room.js","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport
|
|
1
|
+
{"version":3,"file":"Room.js","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n const { info, isLoading } = useRoomInfo(roomId);\n const resolvedRoomName = useMemo(() => {\n return info?.name ?? roomId;\n }, [info?.name, roomId]);\n\n return (\n <span\n className={classNames(\"lb-name lb-room\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedRoomName}\n </span>\n );\n}\n"],"names":["useRoomInfo","useMemo","jsx","classNames"],"mappings":";;;;;;;AAAA,YAAA,CAAA;AAYO,SAAS,IAAK,CAAA,EAAE,MAAQ,EAAA,SAAA,EAAA,GAAc,OAAoB,EAAA;AAC/D,EAAA,MAAM,EAAE,IAAA,EAAM,SAAU,EAAA,GAAIA,kBAAY,MAAM,CAAA,CAAA;AAC9C,EAAM,MAAA,gBAAA,GAAmBC,gBAAQ,MAAM;AACrC,IAAA,OAAO,MAAM,IAAQ,IAAA,MAAA,CAAA;AAAA,GACpB,EAAA,CAAC,IAAM,EAAA,IAAA,EAAM,MAAM,CAAC,CAAA,CAAA;AAEvB,EAAA,uBACGC,cAAA,CAAA,MAAA,EAAA;AAAA,IACC,SAAA,EAAWC,qBAAW,CAAA,iBAAA,EAAmB,SAAS,CAAA;AAAA,IAClD,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,IAC9B,GAAG,KAAA;AAAA,IAEH,sBAAY,IAAO,GAAA,gBAAA;AAAA,GACtB,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,18 +1,20 @@
|
|
|
1
|
-
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { useRoomInfo } from '@liveblocks/react';
|
|
3
|
-
import
|
|
3
|
+
import { useMemo } from 'react';
|
|
4
4
|
import { classNames } from '../../utils/class-names.mjs';
|
|
5
5
|
|
|
6
|
+
"use client";
|
|
6
7
|
function Room({ roomId, className, ...props }) {
|
|
7
8
|
const { info, isLoading } = useRoomInfo(roomId);
|
|
8
9
|
const resolvedRoomName = useMemo(() => {
|
|
9
10
|
return info?.name ?? roomId;
|
|
10
11
|
}, [info?.name, roomId]);
|
|
11
|
-
return /* @__PURE__ */
|
|
12
|
+
return /* @__PURE__ */ jsx("span", {
|
|
12
13
|
className: classNames("lb-name lb-room", className),
|
|
13
14
|
"data-loading": isLoading ? "" : void 0,
|
|
14
|
-
...props
|
|
15
|
-
|
|
15
|
+
...props,
|
|
16
|
+
children: isLoading ? null : resolvedRoomName
|
|
17
|
+
});
|
|
16
18
|
}
|
|
17
19
|
|
|
18
20
|
export { Room };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Room.mjs","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport
|
|
1
|
+
{"version":3,"file":"Room.mjs","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n const { info, isLoading } = useRoomInfo(roomId);\n const resolvedRoomName = useMemo(() => {\n return info?.name ?? roomId;\n }, [info?.name, roomId]);\n\n return (\n <span\n className={classNames(\"lb-name lb-room\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedRoomName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;AAAA,YAAA,CAAA;AAYO,SAAS,IAAK,CAAA,EAAE,MAAQ,EAAA,SAAA,EAAA,GAAc,OAAoB,EAAA;AAC/D,EAAA,MAAM,EAAE,IAAA,EAAM,SAAU,EAAA,GAAI,YAAY,MAAM,CAAA,CAAA;AAC9C,EAAM,MAAA,gBAAA,GAAmB,QAAQ,MAAM;AACrC,IAAA,OAAO,MAAM,IAAQ,IAAA,MAAA,CAAA;AAAA,GACpB,EAAA,CAAC,IAAM,EAAA,IAAA,EAAM,MAAM,CAAC,CAAA,CAAA;AAEvB,EAAA,uBACG,GAAA,CAAA,MAAA,EAAA;AAAA,IACC,SAAA,EAAW,UAAW,CAAA,iBAAA,EAAmB,SAAS,CAAA;AAAA,IAClD,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,IAC9B,GAAG,KAAA;AAAA,IAEH,sBAAY,IAAO,GAAA,gBAAA;AAAA,GACtB,CAAA,CAAA;AAEJ;;;;"}
|