@box/threaded-annotations 1.80.0

package/dist/chunks/mention-component.js

@@ -0,0 +1,96 @@
+import e from "../esm/lib/messages.js";
+import { THREADED_ANNOTATIONS_PORTAL as t } from "../esm/lib/v2/constants.js";
+import { useMentionContext as n } from "../esm/lib/components/mention-component/mention-context.js";
+import { Text as r } from "@box/blueprint-web";
+import { useCallback as i, useEffect as a, useRef as o, useState as s } from "react";
+import { useIntl as c } from "react-intl";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { CollaborationPopover as d } from "@box/collaboration-popover";
+import '../styles/mention-component.css';var f = { mention: "_mention_1fsj4_2" }, p = ({ mentionedUserName: p, mentionedUserId: m, mentionedUserEmail: h, authorId: g, mentionId: _ }) => {
+	let v = c(), y = o(!1), { collaborationPopoverProps: b, getAvatarUrl: x, fetchCollaboratorState: S, fetchEmail: C, openPopoverMentionId: w, openPopoverForMentionId: T, closeAllPopovers: E } = n(), [D, O] = s(!1), [k, A] = s(!1), [j, M] = s(h);
+	a(() => {
+		M(h);
+	}, [h, m]);
+	let { onSubmit: N, onClose: P } = b, F = i(async () => {
+		if (y.current) {
+			y.current = !1;
+			return;
+		}
+		if (!k && _ && m) {
+			let e = h ?? j;
+			if (!e && C) try {
+				e = await C(m), M(e);
+			} catch {}
+			let t = {
+				id: Number(m),
+				name: p,
+				email: e ?? "",
+				value: m
+			}, n = !1;
+			try {
+				n = await S?.(t) ?? !1;
+			} catch {}
+			O(n), await T?.(_, t);
+		}
+	}, [
+		y,
+		k,
+		_,
+		m,
+		p,
+		h,
+		j,
+		C,
+		S,
+		T
+	]), I = () => {
+		E?.(), P?.();
+	}, L = () => {
+		k && (y.current = !0, E?.());
+	}, R = (e, t) => {
+		E?.(), N?.(e, t);
+	};
+	a(() => {
+		A(w === _);
+	}, [_, w]);
+	let z = i((e) => {
+		e.key === "Escape" && E?.();
+	}, [E]);
+	return a(() => (window.addEventListener("keydown", z), () => window.removeEventListener("keydown", z)), [z]), /* @__PURE__ */ l(d, {
+		open: k,
+		...b,
+		anchor: /* @__PURE__ */ u(r, {
+			"data-no-expand": !0,
+			"aria-label": v.formatMessage(e.textMentionAriaLabel),
+			as: "span",
+			className: f.mention,
+			"data-author-id": g,
+			"data-component-type": "mention",
+			"data-mention-id": _,
+			"data-mentioned-user-email": h,
+			"data-mentioned-user-id": m,
+			"data-mentioned-user-name": p,
+			onClick: F,
+			onPointerDown: L,
+			variant: "bodyDefault",
+			children: ["@", p]
+		}),
+		onClose: I,
+		onSubmit: R,
+		popoverContentContainerProps: {
+			...b.popoverContentContainerProps,
+			...t,
+			avoidCollisions: !1
+		},
+		sideOffset: 0,
+		userInfo: {
+			id: m,
+			name: p,
+			email: j,
+			avatarUrl: x?.(m),
+			isCollaborator: D
+		}
+	});
+};
+p.displayName = "MentionComponent";
+export { p as t };

package/dist/chunks/message-editor.module.js

@@ -0,0 +1,12 @@
+import '../styles/message-editor.css';var e = {
+	editorDisabled: "_editorDisabled_1x42c_4",
+	editor: "_editor_1x42c_4",
+	messageEditor: "_messageEditor_1x42c_11",
+	errorMessage: "_errorMessage_1x42c_14",
+	errorText: "_errorText_1x42c_20",
+	actionsContainer: "_actionsContainer_1x42c_23",
+	editorContainer: "_editorContainer_1x42c_31",
+	editorError: "_editorError_1x42c_70",
+	anchorElement: "_anchorElement_1x42c_79"
+};
+export { e as t };

package/dist/chunks/message-editor2.module.js

@@ -0,0 +1,27 @@
+import '../styles/message-editor2.css';var e = {
+	messageEditorWrapper: "_messageEditorWrapper_1vfwf_4",
+	editActionsColumn: "_editActionsColumn_1vfwf_9",
+	editActionsRow: "_editActionsRow_1vfwf_16",
+	characterLimitCounter: "_characterLimitCounter_1vfwf_22",
+	characterLimitCounterExceeded: "_characterLimitCounterExceeded_1vfwf_25",
+	messageEditor: "_messageEditor_1vfwf_4",
+	editorEditMode: "_editorEditMode_1vfwf_43",
+	editorFirstAnnotation: "_editorFirstAnnotation_1vfwf_50",
+	editorError: "_editorError_1vfwf_50",
+	editorViewport: "_editorViewport_1vfwf_58",
+	editorContainer: "_editorContainer_1vfwf_64",
+	editor: "_editor_1vfwf_43",
+	editorFade: "_editorFade_1vfwf_110",
+	editorFadeHidden: "_editorFadeHidden_1vfwf_121",
+	editorFullWidth: "_editorFullWidth_1vfwf_124",
+	actionsWrapper: "_actionsWrapper_1vfwf_128",
+	actionsWrapperInner: "_actionsWrapperInner_1vfwf_138",
+	errorMessage: "_errorMessage_1vfwf_145",
+	errorText: "_errorText_1vfwf_154",
+	editorHasScroll: "_editorHasScroll_1vfwf_163",
+	editorCharacterLimitExceeded: "_editorCharacterLimitExceeded_1vfwf_174",
+	characterLimitExceeded: "_characterLimitExceeded_1vfwf_196",
+	scrolledToBottom: "_scrolledToBottom_1vfwf_199",
+	anchorElement: "_anchorElement_1vfwf_203"
+};
+export { e as t };

package/dist/chunks/message-footer.js

@@ -0,0 +1,42 @@
+import e from "../esm/lib/components/v2/text-message/messages.js";
+import { Button as t } from "@box/blueprint-web";
+import { useIntl as n } from "react-intl";
+import { ReadableTime as r } from "@box/readable-time";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import '../styles/message-footer.css';var o = {
+	textMessage: "_textMessage_z15h4_1",
+	contentWrapper: "_contentWrapper_z15h4_10",
+	threadedIndicator: "_threadedIndicator_z15h4_15",
+	threadedIndicatorHidden: "_threadedIndicatorHidden_z15h4_31",
+	messageContent: "_messageContent_z15h4_34",
+	annotationBadgeWrapper: "_annotationBadgeWrapper_z15h4_41",
+	messageFooter: "_messageFooter_z15h4_50",
+	readableTimeWrapper: "_readableTimeWrapper_z15h4_57",
+	replyButton: "_replyButton_z15h4_60"
+}, s = ({ createdAt: s, onReply: c }) => {
+	let l = n();
+	return /* @__PURE__ */ a("div", {
+		className: o.messageFooter,
+		children: [/* @__PURE__ */ i("div", {
+			className: o.readableTimeWrapper,
+			"data-no-expand": !0,
+			children: /* @__PURE__ */ i(r, {
+				textProps: {
+					as: "span",
+					variant: "bodySmall",
+					color: "textOnLightSecondary"
+				},
+				timestamp: s
+			})
+		}), c && /* @__PURE__ */ i(t, {
+			"aria-label": l.formatMessage(e.replyButtonAriaLabel),
+			className: o.replyButton,
+			"data-no-expand": !0,
+			size: "small",
+			variant: "quaternary",
+			onClick: c,
+			children: l.formatMessage(e.reply)
+		})]
+	});
+};
+export { o as n, s as t };

package/dist/chunks/message-header.js

@@ -0,0 +1,49 @@
+import { UserAvatarButton as e } from "../esm/lib/components/user-avatar/user-avatar.js";
+import { t } from "./delete-annotations-message-popover.js";
+import { Text as n } from "@box/blueprint-web";
+import { useState as r } from "react";
+import { ReadableTime as i } from "@box/readable-time";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import '../styles/message-header.css';var s = {
+	headerContainer: "_headerContainer_17gpl_4",
+	information: "_information_17gpl_12",
+	textContainer: "_textContainer_17gpl_19",
+	author: "_author_17gpl_27",
+	deleteAction: "_deleteAction_17gpl_33"
+}, c = ({ author: c, createdAt: l, isDeleteAllowed: u = !0, onAvatarClick: d, onDelete: f }) => {
+	let [p, m] = r(!1);
+	return /* @__PURE__ */ o("div", {
+		className: s.headerContainer,
+		children: [/* @__PURE__ */ o("div", {
+			className: s.information,
+			children: [/* @__PURE__ */ a(e, {
+				onClick: d,
+				user: c
+			}), /* @__PURE__ */ o("div", {
+				className: s.textContainer,
+				children: [/* @__PURE__ */ a(n, {
+					as: "p",
+					className: s.author,
+					color: "textOnLightDefault",
+					variant: "bodyDefaultBold",
+					children: c.name
+				}), /* @__PURE__ */ a(i, {
+					textProps: {
+						as: "span",
+						variant: "caption",
+						color: "textOnLightSecondary"
+					},
+					timestamp: l
+				})]
+			})]
+		}), u && /* @__PURE__ */ a("div", {
+			className: s.deleteAction,
+			"data-state": p ? "open" : "closed",
+			children: /* @__PURE__ */ a(t, {
+				onDelete: f,
+				onOpenChange: m
+			})
+		})]
+	});
+};
+export { c as t };

package/dist/chunks/messages-view.js

@@ -0,0 +1,83 @@
+import { ThreadViewState as e, useThreadedAnnotationsContext as t } from "../esm/lib/v2/threaded-annotations-context.js";
+import { t as n } from "./resolved-state.js";
+import { t as r } from "./show-replies-button.js";
+import { TextMessage as i } from "../esm/lib/components/v2/text-message/text-message.js";
+import { useAutoScroll as a } from "../esm/lib/components/v2/messages-view/hooks/useAutoScroll.js";
+import o from "clsx";
+import { useRef as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import '../styles/messages-view.css';var u = {
+	messagesViewWrapper: "_messagesViewWrapper_1w62w_4",
+	overflowing: "_overflowing_1w62w_9",
+	scrollable: "_scrollable_1w62w_12",
+	messagesView: "_messagesView_1w62w_4",
+	repliesContainer: "_repliesContainer_1w62w_52",
+	messagesFade: "_messagesFade_1w62w_58"
+}, d = ({ messages: d, isResolved: f = !1, resolvedBy: p, resolvedAt: m, onDelete: h, onThreadDelete: g, onAvatarClick: _, onEdit: v, onResolve: y, onUnresolve: b, annotationTarget: x, onAnnotationBadgeClick: S }) => {
+	let { viewState: C, dispatch: w, isAnnotations: T } = t(), E = s(null), D = C !== e.Collapsed, O = d.length > 2, { handleScroll: k, isOverflowing: A } = a({
+		messageCount: d.length,
+		containerRef: E,
+		enabled: T,
+		isExpanded: D
+	}), j = d[0], M = d.slice(1), N = M.length >= 1, P = M[M.length - 1], F = M.slice(0, -1), I = O && !D;
+	if (!j) return null;
+	let L = F[F.length - 1]?.author, R = F.length >= 2 ? F[F.length - 2].author : void 0, z = () => w({ type: "EXPAND" });
+	return /* @__PURE__ */ l("div", {
+		className: o(u.messagesViewWrapper, A && u.overflowing),
+		children: [/* @__PURE__ */ l("div", {
+			ref: E,
+			className: o(u.messagesView, T && u.scrollable),
+			onScroll: k,
+			children: [
+				/* @__PURE__ */ c(i, {
+					...j,
+					showThreadedIndicator: N || f,
+					isResolved: f,
+					onDelete: h,
+					onThreadDelete: g,
+					onAvatarClick: _,
+					onEdit: v,
+					onResolve: y,
+					onUnresolve: b,
+					isFirstMessage: !0,
+					annotationTarget: x,
+					onAnnotationBadgeClick: S
+				}),
+				I && L && /* @__PURE__ */ c(r, {
+					lastUser: L,
+					repliesCount: F.length,
+					secondLastUser: R,
+					onShowReplies: z
+				}),
+				D && F.length > 0 && /* @__PURE__ */ c("div", {
+					className: u.repliesContainer,
+					children: F.map((e) => /* @__PURE__ */ c(i, {
+						...e,
+						showThreadedIndicator: !0,
+						isResolved: f,
+						onDelete: h,
+						onAvatarClick: _,
+						onEdit: v,
+						onResolve: y,
+						onUnresolve: b
+					}, e.id))
+				}),
+				P && /* @__PURE__ */ c(i, {
+					...P,
+					showThreadedIndicator: f,
+					isResolved: f,
+					onDelete: h,
+					onAvatarClick: _,
+					onEdit: v,
+					onResolve: y,
+					onUnresolve: b
+				}),
+				f && p && m && /* @__PURE__ */ c(n, {
+					authorName: p,
+					createdAt: m
+				})
+			]
+		}), A && /* @__PURE__ */ c("div", { className: u.messagesFade })]
+	});
+};
+export { d as t };