@box/threaded-annotations 1.92.1 → 1.93.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/chunks/delete-confirmation-popover.js +7 -7
- package/dist/chunks/threaded-annotations2.js +4 -3
- package/dist/esm/lib/components/v2/message-header/message-header.js +1 -1
- package/dist/esm/lib/components/v2/text-message/subcomponents/message-renderer.js +11 -10
- package/dist/esm/lib/components/v2/text-message/text-message.js +1 -0
- package/dist/styles/delete-confirmation-popover.css +1 -1
- package/dist/styles/threaded-annotations2.css +1 -1
- package/dist/types/lib/v2/test-utils/interaction-utils.d.ts +2 -0
- package/package.json +12 -12
|
@@ -7,13 +7,13 @@ import '../styles/delete-confirmation-popover.css';var c = {
|
|
|
7
7
|
deletePopover: "_deletePopover_1c8ll_2",
|
|
8
8
|
footer: "_footer_1c8ll_6"
|
|
9
9
|
}, l = {
|
|
10
|
-
headerContainer: "
|
|
11
|
-
information: "
|
|
12
|
-
textContainer: "
|
|
13
|
-
author: "
|
|
14
|
-
optionsMenu: "
|
|
15
|
-
deletePopoverAnchorWrapper: "
|
|
16
|
-
deletePopoverAnchor: "
|
|
10
|
+
headerContainer: "_headerContainer_1qllz_4",
|
|
11
|
+
information: "_information_1qllz_12",
|
|
12
|
+
textContainer: "_textContainer_1qllz_19",
|
|
13
|
+
author: "_author_1qllz_27",
|
|
14
|
+
optionsMenu: "_optionsMenu_1qllz_34",
|
|
15
|
+
deletePopoverAnchorWrapper: "_deletePopoverAnchorWrapper_1qllz_53",
|
|
16
|
+
deletePopoverAnchor: "_deletePopoverAnchor_1qllz_53"
|
|
17
17
|
}, u = ({ hasReplies: u = !1, isAnnotation: d = !1, open: f, onOpenChange: p, onConfirm: m, onCancel: h }) => {
|
|
18
18
|
let g = a();
|
|
19
19
|
return /* @__PURE__ */ o("div", {
|
|
@@ -7,9 +7,9 @@ import s from "clsx";
|
|
|
7
7
|
import { useCallback as c, useEffect as l, useMemo as u, useRef as d } from "react";
|
|
8
8
|
import { jsx as f, jsxs as p } from "react/jsx-runtime";
|
|
9
9
|
import '../styles/threaded-annotations2.css';var m = {
|
|
10
|
-
threadedAnnotations: "
|
|
11
|
-
expandable: "
|
|
12
|
-
annotations: "
|
|
10
|
+
threadedAnnotations: "_threadedAnnotations_1ujic_1",
|
|
11
|
+
expandable: "_expandable_1ujic_10",
|
|
12
|
+
annotations: "_annotations_1ujic_18"
|
|
13
13
|
}, h = ({ messages: r, isResolved: h = !1, resolvedBy: g, resolvedAt: _, maxCharacterCount: v, onDelete: y, onThreadDelete: b, onAvatarClick: x, onCopyLink: S, onEdit: C, onEditError: w, onResolve: T, onUnresolve: E, onPost: D, onPostError: O, userSelectorProps: k, onEditorOpenChange: A, annotationTarget: j, onAnnotationBadgeClick: M, originalContentDeleted: N }) => {
|
|
14
14
|
let { viewState: P, dispatch: F, editingMessageId: I, replyMention: L, isReplyDisabled: R, isAnnotations: z } = i(), B = d(null), V = P !== n.Collapsed, H = r.length > 2, U = P === n.Collapsed && (H || !R && !h);
|
|
15
15
|
l(() => {
|
|
@@ -43,6 +43,7 @@ import '../styles/threaded-annotations2.css';var m = {
|
|
|
43
43
|
}) : /* @__PURE__ */ p("div", {
|
|
44
44
|
ref: B,
|
|
45
45
|
className: s(m.threadedAnnotations, U && m.expandable, z && m.annotations),
|
|
46
|
+
"data-thread-expandable": U ? !0 : void 0,
|
|
46
47
|
onClick: U ? q : void 0,
|
|
47
48
|
children: [/* @__PURE__ */ f(a, {
|
|
48
49
|
messages: r,
|
|
@@ -19,8 +19,8 @@ var h = ({ author: h, canResolve: g = !1, isResolved: _ = !1, canEdit: v = !0, c
|
|
|
19
19
|
onClick: S,
|
|
20
20
|
user: h
|
|
21
21
|
}), /* @__PURE__ */ d("div", {
|
|
22
|
-
"data-no-expand": !0,
|
|
23
22
|
className: n.textContainer,
|
|
23
|
+
"data-message-author": !0,
|
|
24
24
|
children: /* @__PURE__ */ d(s, {
|
|
25
25
|
as: "p",
|
|
26
26
|
className: n.author,
|
|
@@ -44,31 +44,32 @@ var o = /((?:(?:ht|f)tps?:\/\/)[\w.-]+(?::\d+)?(?:\/[\w\-.~+/#?&%=:[\]@!$'()*;,]
|
|
|
44
44
|
mentionedUserName: t.attrs.mentionedUserName,
|
|
45
45
|
mentionId: t.attrs.mentionId
|
|
46
46
|
}, i);
|
|
47
|
-
}, p = (
|
|
47
|
+
}, p = (e) => {
|
|
48
|
+
e.currentTarget.closest("[data-thread-expandable]") && e.preventDefault();
|
|
49
|
+
}, m = ({ node: e, index: i, paragraphIndex: o, intl: s }) => {
|
|
48
50
|
let c = `text-${e.text.substring(0, 20)}-${o}-${i}`, l = d(e.text);
|
|
49
51
|
return /* @__PURE__ */ a(r, {
|
|
50
52
|
"aria-label": s.formatMessage(t.textMessageAriaLabel),
|
|
51
53
|
as: "span",
|
|
52
54
|
color: "textOnLightDefault",
|
|
53
55
|
variant: "bodyDefault",
|
|
54
|
-
"data-no-expand": !0,
|
|
55
|
-
style: { cursor: "auto" },
|
|
56
56
|
children: l.map((e, t) => e.type === "url" ? /* @__PURE__ */ a(n, {
|
|
57
57
|
href: e.value,
|
|
58
58
|
inheritFont: !0,
|
|
59
59
|
rel: "noopener noreferrer",
|
|
60
60
|
target: "_blank",
|
|
61
|
+
onClick: p,
|
|
61
62
|
children: e.value
|
|
62
63
|
}, `${c}-segment-${t}`) : e.value)
|
|
63
64
|
}, c);
|
|
64
|
-
},
|
|
65
|
+
}, h = ({ content: e, paragraphIndex: t, intl: n }) => e.map((e, r) => {
|
|
65
66
|
switch (e.type) {
|
|
66
67
|
case "mention": return f({
|
|
67
68
|
node: e,
|
|
68
69
|
index: r,
|
|
69
70
|
paragraphIndex: t
|
|
70
71
|
});
|
|
71
|
-
case "text": return
|
|
72
|
+
case "text": return m({
|
|
72
73
|
node: e,
|
|
73
74
|
index: r,
|
|
74
75
|
paragraphIndex: t,
|
|
@@ -76,23 +77,23 @@ var o = /((?:(?:ht|f)tps?:\/\/)[\w.-]+(?::\d+)?(?:\/[\w\-.~+/#?&%=:[\]@!$'()*;,]
|
|
|
76
77
|
});
|
|
77
78
|
default: return [];
|
|
78
79
|
}
|
|
79
|
-
}),
|
|
80
|
+
}), g = ({ paragraph: e, index: t, intl: n }) => {
|
|
80
81
|
let i = e.content || [], o = `paragraph-${t}`;
|
|
81
82
|
return /* @__PURE__ */ a(r, {
|
|
82
83
|
as: "p",
|
|
83
84
|
variant: "bodyDefault",
|
|
84
|
-
children: i.length > 0 ?
|
|
85
|
+
children: i.length > 0 ? h({
|
|
85
86
|
content: i,
|
|
86
87
|
paragraphIndex: t,
|
|
87
88
|
intl: n
|
|
88
89
|
}) : /* @__PURE__ */ a("br", {})
|
|
89
90
|
}, o);
|
|
90
|
-
},
|
|
91
|
+
}, _ = ({ messageObject: e }) => {
|
|
91
92
|
let t = i(), { content: n } = e;
|
|
92
|
-
return !n && n.length === 0 ? null : n.map((e, n) =>
|
|
93
|
+
return !n && n.length === 0 ? null : n.map((e, n) => g({
|
|
93
94
|
paragraph: e,
|
|
94
95
|
index: n,
|
|
95
96
|
intl: t
|
|
96
97
|
}));
|
|
97
98
|
};
|
|
98
|
-
export {
|
|
99
|
+
export { _ as MessageRenderer };
|
|
@@ -58,6 +58,7 @@ var m = ({ id: m, author: h, message: g, createdAt: _, updatedAt: v, permissions
|
|
|
58
58
|
})
|
|
59
59
|
}) : /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f("div", {
|
|
60
60
|
className: o.rendererWrapper,
|
|
61
|
+
"data-message-body": !0,
|
|
61
62
|
children: /* @__PURE__ */ f(c, { messageObject: g })
|
|
62
63
|
}), /* @__PURE__ */ f(s, {
|
|
63
64
|
createdAt: _,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._deletePopover_1c8ll_2{width:17rem;margin:0}._deletePopover_1c8ll_2 ._footer_1c8ll_6{gap:var(--space-2);justify-content:flex-end;display:flex}.
|
|
1
|
+
._deletePopover_1c8ll_2{width:17rem;margin:0}._deletePopover_1c8ll_2 ._footer_1c8ll_6{gap:var(--space-2);justify-content:flex-end;display:flex}._headerContainer_1qllz_4{gap:var(--space-4);justify-content:space-between;align-items:center;width:100%;display:flex;position:relative}._headerContainer_1qllz_4 ._information_1qllz_12{gap:var(--space-2);justify-content:flex-start;align-items:center;width:100%;display:flex}._headerContainer_1qllz_4 ._information_1qllz_12 ._textContainer_1qllz_19{word-break:break-all;overflow-wrap:break-word;width:fit-content;min-width:0;max-width:100%;overflow:hidden}._headerContainer_1qllz_4 ._information_1qllz_12 ._textContainer_1qllz_19 ._author_1qllz_27{-webkit-line-clamp:1;-webkit-box-orient:vertical;width:fit-content;display:-webkit-box;overflow:hidden}._headerContainer_1qllz_4 ._optionsMenu_1qllz_34{gap:var(--space-1);opacity:0;align-items:center;transition:opacity .1s;display:flex;position:relative}[data-message-wrapper]:hover ._headerContainer_1qllz_4 ._optionsMenu_1qllz_34,[data-message-wrapper]:focus-within ._headerContainer_1qllz_4 ._optionsMenu_1qllz_34{opacity:1}@media (pointer:coarse),(hover:none){._headerContainer_1qllz_4 ._optionsMenu_1qllz_34{opacity:1}}._headerContainer_1qllz_4 ._optionsMenu_1qllz_34[data-state=open]{opacity:1}._headerContainer_1qllz_4 ._deletePopoverAnchorWrapper_1qllz_53{width:0;height:0;position:absolute;bottom:0;right:0}._headerContainer_1qllz_4 ._deletePopoverAnchor_1qllz_53{pointer-events:none;width:1px;height:1px;position:absolute;top:100%;right:0}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._threadedAnnotations_1ujic_1{padding:var(--space-3) var(--space-4) var(--space-4) var(--space-3);background-color:var(--surface-surface);border:var(--border-1) solid var(--gray-10);border-radius:var(--radius-6);flex-direction:column;gap:1.125rem;display:flex}._threadedAnnotations_1ujic_1._expandable_1ujic_10{cursor:pointer}._threadedAnnotations_1ujic_1._expandable_1ujic_10 [data-message-body],._threadedAnnotations_1ujic_1._expandable_1ujic_10 [data-message-author]{cursor:pointer;-webkit-user-select:none;user-select:none}._threadedAnnotations_1ujic_1._expandable_1ujic_10:not(._annotations_1ujic_18):hover{background-color:var(--surface-surface-hover);--avatar-border-color:var(--surface-surface-hover);--fade-bg:var(--surface-surface-hover)}
|
|
@@ -6,4 +6,6 @@ export declare const pasteInContentEditable: (canvasElement: HTMLElement, user:
|
|
|
6
6
|
export declare const openMoreOptionsMenu: (user: ReturnType<typeof userEvent.setup>, canvas: ReturnType<typeof within>, authorName: string) => Promise<void>;
|
|
7
7
|
export declare const clickReplyOnMessage: (user: ReturnType<typeof userEvent.setup>, canvas: ReturnType<typeof within>, authorName: string) => Promise<void>;
|
|
8
8
|
export declare const clickThreadBackground: (canvas: ReturnType<typeof within>) => void;
|
|
9
|
+
export declare const clickMessageText: (canvas: ReturnType<typeof within>) => void;
|
|
10
|
+
export declare const clickAuthorName: (canvas: ReturnType<typeof within>, authorName: string) => void;
|
|
9
11
|
export declare const selectUserByEmail: (user: ReturnType<typeof userEvent.setup>, identifier: string) => Promise<void>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@box/threaded-annotations",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.93.0",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE",
|
|
5
5
|
"dependencies": {
|
|
6
6
|
"@tanstack/react-virtual": "^3.10.8",
|
|
@@ -16,23 +16,23 @@
|
|
|
16
16
|
"uuid": "^9.0.1"
|
|
17
17
|
},
|
|
18
18
|
"peerDependencies": {
|
|
19
|
-
"@box/blueprint-web": "^14.36.
|
|
20
|
-
"@box/blueprint-web-assets": "^4.120.
|
|
21
|
-
"@box/collaboration-popover": "^1.62.
|
|
22
|
-
"@box/readable-time": "^1.41.
|
|
23
|
-
"@box/user-selector": "^1.76.
|
|
19
|
+
"@box/blueprint-web": "^14.36.1",
|
|
20
|
+
"@box/blueprint-web-assets": "^4.120.3",
|
|
21
|
+
"@box/collaboration-popover": "^1.62.25",
|
|
22
|
+
"@box/readable-time": "^1.41.25",
|
|
23
|
+
"@box/user-selector": "^1.76.25",
|
|
24
24
|
"clsx": "^1.2.1",
|
|
25
25
|
"react": "^18.0.0",
|
|
26
26
|
"react-dom": "^18.0.0",
|
|
27
27
|
"react-intl": "^6.4.2"
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|
|
30
|
-
"@box/blueprint-web": "^14.36.
|
|
31
|
-
"@box/blueprint-web-assets": "^4.120.
|
|
32
|
-
"@box/eslint-plugin-blueprint": "1.2.
|
|
33
|
-
"@box/readable-time": "^1.41.
|
|
34
|
-
"@box/storybook-utils": "^0.19.
|
|
35
|
-
"@box/user-selector": "^1.76.
|
|
30
|
+
"@box/blueprint-web": "^14.36.1",
|
|
31
|
+
"@box/blueprint-web-assets": "^4.120.3",
|
|
32
|
+
"@box/eslint-plugin-blueprint": "1.2.4",
|
|
33
|
+
"@box/readable-time": "^1.41.25",
|
|
34
|
+
"@box/storybook-utils": "^0.19.18",
|
|
35
|
+
"@box/user-selector": "^1.76.25",
|
|
36
36
|
"react": "^18.0.0",
|
|
37
37
|
"react-dom": "^18.0.0"
|
|
38
38
|
},
|