@box/threaded-annotations 4.1.8 → 4.1.10

package/dist/chunks/threaded-annotations2.js

@@ -1,87 +1 @@
-import { THREADED_ANNOTATIONS_PORTAL as e } from "../esm/lib/v2/constants.js";
-import { MessageEditor as t } from "../esm/lib/components/v2/message-editor/message-editor.js";
-import { ThreadViewState as n, ThreadedAnnotationsProvider as r, useThreadedAnnotationsContext as i } from "../esm/lib/v2/threaded-annotations-context.js";
-import { t as a } from "./messages-view.js";
-import { buildMentionContent as o } from "../esm/lib/v2/utils/build-mention-content.js";
-import s from "clsx";
-import { useCallback as c, useEffect as l, useMemo as u, useRef as d } from "react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
-import '../styles/threaded-annotations2.css';var m = {
-	threadedAnnotations: "_threadedAnnotations_16hhz_1",
-	expandable: "_expandable_16hhz_10",
-	annotations: "_annotations_16hhz_18",
-	highlighted: "_highlighted_16hhz_18"
-}, 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, isHighlighted: P = !1, autoFocusReplyEditor: F = !0 }) => {
-	let { viewState: I, dispatch: L, editingMessageId: R, replyMention: z, isReplyDisabled: B, isAnnotations: V } = i(), H = d(null), U = I !== n.Collapsed, W = r.length > 2, G = I === n.Collapsed && (W || !B && !h);
-	l(() => {
-		R && !r.some((e) => e.id === R) && L({ type: "CLEAR_EDIT" });
-	}, [
-		R,
-		r,
-		L
-	]), l(() => {
-		A?.(U);
-	}, [U, A]), l(() => {
-		if (!U) return;
-		let t = `[${Object.keys(e)[0]}]`, n = (e) => {
-			let n = e.target;
-			H.current?.contains(n) || document.querySelector(t)?.contains(n) || L({ type: "COLLAPSE" });
-		};
-		return document.addEventListener("mousedown", n), () => document.removeEventListener("mousedown", n);
-	}, [U, L]);
-	let K = r.length === 0, q = c(() => L({ type: "CLEAR_MENTION" }), [L]), J = u(() => z ? o(z) : null, [z]), Y = c((e) => {
-		if (!G) return;
-		let t = e.target;
-		!e.currentTarget.contains(t) || t.closest("[data-no-expand]") || L({ type: "EXPAND" });
-	}, [G, L]);
-	return V && K ? /* @__PURE__ */ f(t, {
-		isFirstAnnotation: !0,
-		maxCharacterCount: v,
-		onPost: D,
-		onPostError: O,
-		onPostSuccess: q,
-		userSelectorProps: k
-	}) : /* @__PURE__ */ p("div", {
-		ref: H,
-		className: s(m.threadedAnnotations, G && m.expandable, V && m.annotations, P && m.highlighted),
-		"data-thread-expandable": G ? !0 : void 0,
-		"data-thread-highlighted": P ? !0 : void 0,
-		onClick: G ? Y : void 0,
-		children: [/* @__PURE__ */ f(a, {
-			messages: r,
-			isResolved: h,
-			resolvedBy: g,
-			resolvedAt: _,
-			maxCharacterCount: v,
-			onDelete: y,
-			onThreadDelete: b,
-			onAvatarClick: x,
-			onCopyLink: S,
-			onEdit: C,
-			onEditError: w,
-			onResolve: T,
-			onUnresolve: E,
-			userSelectorProps: k,
-			annotationTarget: j,
-			onAnnotationBadgeClick: M,
-			originalContentDeleted: N
-		}), I === n.Composing && /* @__PURE__ */ f(t, {
-			autoFocus: F,
-			initialContent: J,
-			maxCharacterCount: v,
-			onPost: D,
-			onPostError: O,
-			onPostSuccess: q,
-			isReply: !0,
-			userSelectorProps: k
-		})]
-	});
-}, g = (e) => /* @__PURE__ */ f(r, {
-	defaultExpanded: e.defaultExpanded || e.messages.length === 0,
-	isReplyDisabled: e.isReplyDisabled || e.isResolved,
-	isEditDisabled: e.isEditDisabled || e.isResolved,
-	isAnnotations: e.isAnnotations,
-	collapsed: e.collapsed,
-	children: /* @__PURE__ */ f(h, { ...e })
-});
-export { g as t };
+import{THREADED_ANNOTATIONS_PORTAL}from"../esm/lib/v2/constants.js";import{MessageEditor}from"../esm/lib/components/v2/message-editor/message-editor.js";import{ThreadViewState,ThreadedAnnotationsProvider,useThreadedAnnotationsContext}from"../esm/lib/v2/threaded-annotations-context.js";import{t as MessagesView}from"./messages-view.js";import{buildMentionContent}from"../esm/lib/v2/utils/build-mention-content.js";import clsx from"clsx";import{useCallback,useEffect,useMemo,useRef}from"react";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/threaded-annotations2.css';var threaded_annotations_module_default={threadedAnnotations:`_threadedAnnotations_16hhz_1`,expandable:`_expandable_16hhz_10`,annotations:`_annotations_16hhz_18`,highlighted:`_highlighted_16hhz_18`},ThreadedAnnotationsContent=({messages:messageList,isResolved=!1,resolvedBy,resolvedAt,maxCharacterCount,onDelete,onThreadDelete,onAvatarClick,onCopyLink,onEdit,onEditError,onResolve,onUnresolve,onPost,onPostError,userSelectorProps,onEditorOpenChange,annotationTarget,onAnnotationBadgeClick,originalContentDeleted,isHighlighted=!1,autoFocusReplyEditor=!0})=>{let{viewState,dispatch,editingMessageId,replyMention,isReplyDisabled,isAnnotations}=useThreadedAnnotationsContext(),containerRef=useRef(null),isExpanded=viewState!==ThreadViewState.Collapsed,hasHiddenReplies=messageList.length>2,isExpandable=viewState===ThreadViewState.Collapsed&&(hasHiddenReplies||!isReplyDisabled&&!isResolved);useEffect(()=>{editingMessageId&&!messageList.some(message=>message.id===editingMessageId)&&dispatch({type:`CLEAR_EDIT`})},[editingMessageId,messageList,dispatch]),useEffect(()=>{onEditorOpenChange?.(isExpanded)},[isExpanded,onEditorOpenChange]),useEffect(()=>{if(!isExpanded)return;let portalSelector=`[${Object.keys(THREADED_ANNOTATIONS_PORTAL)[0]}]`,handleClickOutside=e=>{let target=e.target;containerRef.current?.contains(target)||document.querySelector(portalSelector)?.contains(target)||dispatch({type:`COLLAPSE`})};return document.addEventListener(`mousedown`,handleClickOutside),()=>document.removeEventListener(`mousedown`,handleClickOutside)},[isExpanded,dispatch]);let hasNoMessages=messageList.length===0,handleClearMention=useCallback(()=>dispatch({type:`CLEAR_MENTION`}),[dispatch]),initialReplyContent=useMemo(()=>replyMention?buildMentionContent(replyMention):null,[replyMention]),handleClick=useCallback(e=>{if(!isExpandable)return;let target=e.target;!e.currentTarget.contains(target)||target.closest(`[data-no-expand]`)||dispatch({type:`EXPAND`})},[isExpandable,dispatch]);return isAnnotations&&hasNoMessages?jsx(MessageEditor,{isFirstAnnotation:!0,maxCharacterCount,onPost,onPostError,onPostSuccess:handleClearMention,userSelectorProps}):jsxs(`div`,{ref:containerRef,className:clsx(threaded_annotations_module_default.threadedAnnotations,isExpandable&&threaded_annotations_module_default.expandable,isAnnotations&&threaded_annotations_module_default.annotations,isHighlighted&&threaded_annotations_module_default.highlighted),"data-thread-expandable":isExpandable?!0:void 0,"data-thread-highlighted":isHighlighted?!0:void 0,onClick:isExpandable?handleClick:void 0,children:[jsx(MessagesView,{messages:messageList,isResolved,resolvedBy,resolvedAt,maxCharacterCount,onDelete,onThreadDelete,onAvatarClick,onCopyLink,onEdit,onEditError,onResolve,onUnresolve,userSelectorProps,annotationTarget,onAnnotationBadgeClick,originalContentDeleted}),viewState===ThreadViewState.Composing&&jsx(MessageEditor,{autoFocus:autoFocusReplyEditor,initialContent:initialReplyContent,maxCharacterCount,onPost,onPostError,onPostSuccess:handleClearMention,isReply:!0,userSelectorProps})]})},ThreadedAnnotations=props=>jsx(ThreadedAnnotationsProvider,{defaultExpanded:props.defaultExpanded||props.messages.length===0,isReplyDisabled:props.isReplyDisabled||props.isResolved,isEditDisabled:props.isEditDisabled||props.isResolved,isAnnotations:props.isAnnotations,collapsed:props.collapsed,children:jsx(ThreadedAnnotationsContent,{...props})});export{ThreadedAnnotations as t};

package/dist/chunks/timestamp-toggle.js

@@ -1,36 +1 @@
-import e from "../esm/lib/components/v2/message-editor/messages.js";
-import { Checkbox as t, Text as n } from "@box/blueprint-web";
-import r from "clsx";
-import { useCallback as i } from "react";
-import { useIntl as a } from "react-intl";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Play as c } from "@box/blueprint-web-assets/icons/MediumFilled";
-import '../styles/timestamp-toggle.css';var l = {
-	timestampToggle: "_timestampToggle_11uz9_1",
-	timestampToggleDisabled: "_timestampToggleDisabled_11uz9_8",
-	label: "_label_11uz9_20"
-}, u = ({ className: u, disabled: d, formattedTimestamp: f, isPressed: p, onChange: m }) => {
-	let h = a(), g = i((e) => {
-		m(e === !0);
-	}, [m]), _ = /* @__PURE__ */ s(n, {
-		as: "span",
-		className: l.label,
-		color: "textOnLightSecondary",
-		variant: "bodyDefaultSemibold",
-		children: [/* @__PURE__ */ o(c, {
-			color: "currentColor",
-			height: 16,
-			width: 16
-		}), f]
-	});
-	return /* @__PURE__ */ o(t.Item, {
-		"aria-label": h.formatMessage(e.timestampToggleLabel),
-		checked: p,
-		className: r(l.timestampToggle, { [l.timestampToggleDisabled]: d }, u),
-		disabled: d,
-		label: _,
-		onCheckedChange: g,
-		value: "video-timestamp"
-	});
-};
-export { u as t };
+import messages from"../esm/lib/components/v2/message-editor/messages.js";import{Checkbox,Text}from"@box/blueprint-web";import clsx from"clsx";import{useCallback}from"react";import{useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import{Play}from"@box/blueprint-web-assets/icons/MediumFilled";import '../styles/timestamp-toggle.css';var timestamp_toggle_module_default={timestampToggle:`_timestampToggle_11uz9_1`,timestampToggleDisabled:`_timestampToggleDisabled_11uz9_8`,label:`_label_11uz9_20`},TimestampToggle=({className,disabled,formattedTimestamp,isPressed,onChange})=>{let intl=useIntl(),handleCheckedChange=useCallback(nextChecked=>{onChange(nextChecked===!0)},[onChange]),label=jsxs(Text,{as:`span`,className:timestamp_toggle_module_default.label,color:`textOnLightSecondary`,variant:`bodyDefaultSemibold`,children:[jsx(Play,{color:`currentColor`,height:16,width:16}),formattedTimestamp]});return jsx(Checkbox.Item,{"aria-label":intl.formatMessage(messages.timestampToggleLabel),checked:isPressed,className:clsx(timestamp_toggle_module_default.timestampToggle,{[timestamp_toggle_module_default.timestampToggleDisabled]:disabled},className),disabled,label,onCheckedChange:handleCheckedChange,value:`video-timestamp`})};export{TimestampToggle as t};

package/dist/chunks/virtualized-messages.js

@@ -1,30 +1 @@
-import { t as e } from "./text-message.js";
-import { jsx as t } from "react/jsx-runtime";
-import '../styles/virtualized-messages.css';var n = {
-	messagesView: "_messagesView_h8l31_29",
-	moreRepliesButton: "_moreRepliesButton_h8l31_39",
-	repliesContainer: "_repliesContainer_h8l31_42",
-	threadIndicator: "_threadIndicator_h8l31_49",
-	virtualizedMessages: "_virtualizedMessages_h8l31_54",
-	messageWrapper: "_messageWrapper_h8l31_59",
-	singleMessageWrapper: "_singleMessageWrapper_h8l31_93"
-}, r = ({ messages: r, totalSize: i, virtualItems: a, measureElement: o, onDelete: s, onAvatarClick: c, isDeleteAllowed: l }) => /* @__PURE__ */ t("div", {
-	className: n.virtualizedMessages,
-	style: { height: `${i}px` },
-	children: a.map((i) => {
-		let a = r[i.index], u = `message-${i.index}-${a.id}`;
-		return /* @__PURE__ */ t("div", {
-			ref: o,
-			className: n.messageWrapper,
-			"data-index": i.index,
-			style: { transform: `translateY(${i.start}px)` },
-			children: /* @__PURE__ */ t(e, {
-				textMessageData: a,
-				isDeleteAllowed: l,
-				onAvatarClick: c,
-				onDelete: s
-			})
-		}, u);
-	})
-});
-export { n, r as t };
+import{t as TextMessage}from"./text-message.js";import{jsx}from"react/jsx-runtime";import '../styles/virtualized-messages.css';var messages_view_module_default={messagesView:`_messagesView_h8l31_29`,moreRepliesButton:`_moreRepliesButton_h8l31_39`,repliesContainer:`_repliesContainer_h8l31_42`,threadIndicator:`_threadIndicator_h8l31_49`,virtualizedMessages:`_virtualizedMessages_h8l31_54`,messageWrapper:`_messageWrapper_h8l31_59`,singleMessageWrapper:`_singleMessageWrapper_h8l31_93`},VirtualizedMessages=({messages,totalSize,virtualItems,measureElement,onDelete,onAvatarClick,isDeleteAllowed})=>jsx(`div`,{className:messages_view_module_default.virtualizedMessages,style:{height:`${totalSize}px`},children:virtualItems.map(virtualItem=>{let reply=messages[virtualItem.index],key=`message-${virtualItem.index}-${reply.id}`;return jsx(`div`,{ref:measureElement,className:messages_view_module_default.messageWrapper,"data-index":virtualItem.index,style:{transform:`translateY(${virtualItem.start}px)`},children:jsx(TextMessage,{textMessageData:reply,isDeleteAllowed,onAvatarClick,onDelete})},key)})});export{messages_view_module_default as n,VirtualizedMessages as t};

package/dist/esm/index.js

@@ -1,8 +1 @@
-import "./lib/document-node-types.js";
-import { MentionContextProvider as e, useMentionContext as t } from "./lib/components/mention-component/mention-context.js";
-import { t as n } from "../chunks/threaded-annotations.js";
-import { MessageEditor as r } from "./lib/components/v2/message-editor/message-editor.js";
-import { AnnotationBadgeType as i } from "./lib/v2/types/annotation-badge-types.js";
-import { t as a } from "../chunks/threaded-annotations2.js";
-import { serializeMentionMarkup as o } from "./lib/v2/utils/serialize-mention-markup.js";
-export { i as AnnotationBadgeType, e as MentionContextProvider, r as MessageEditorV2, n as ThreadedAnnotations, a as ThreadedAnnotationsV2, o as serializeMentionMarkup, t as useMentionContext };
+import"./lib/document-node-types.js";import{MentionContextProvider,useMentionContext}from"./lib/components/mention-component/mention-context.js";import{t as ThreadedAnnotations}from"../chunks/threaded-annotations.js";import{MessageEditor}from"./lib/components/v2/message-editor/message-editor.js";import{AnnotationBadgeType}from"./lib/v2/types/annotation-badge-types.js";import{t as ThreadedAnnotations$1}from"../chunks/threaded-annotations2.js";import{serializeMentionMarkup}from"./lib/v2/utils/serialize-mention-markup.js";export{AnnotationBadgeType,MentionContextProvider,MessageEditor as MessageEditorV2,ThreadedAnnotations,ThreadedAnnotations$1 as ThreadedAnnotationsV2,serializeMentionMarkup,useMentionContext};

package/dist/esm/lib/components/mention-component/mention-component.js

@@ -1,2 +1 @@
-import { t as e } from "../../../../chunks/mention-component.js";
-export { e as MentionComponent };
+import{t as MentionComponent}from"../../../../chunks/mention-component.js";export{MentionComponent};

package/dist/esm/lib/components/mention-component/mention-context.js

@@ -1,26 +1 @@
-import { createContext as e, useCallback as t, useContext as n, useMemo as r, useState as i } from "react";
-import { jsx as a } from "react/jsx-runtime";
-var o = /*#__PURE__*/ e(void 0), s = ({ value: e, children: n }) => {
-	let [s, c] = i(null), l = t(async (e, t) => {
-		requestAnimationFrame(() => {
-			c(e);
-		});
-	}, []), u = t(() => {
-		c(null);
-	}, []), d = r(() => ({
-		...e,
-		openPopoverMentionId: s,
-		openPopoverForMentionId: l,
-		closeAllPopovers: u
-	}), [
-		e,
-		s,
-		l,
-		u
-	]);
-	return /* @__PURE__ */ a(o.Provider, {
-		value: d,
-		children: n
-	});
-}, c = () => n(o) ?? {};
-export { s as MentionContextProvider, c as useMentionContext };
+import{createContext,useCallback,useContext,useMemo,useState}from"react";import{jsx}from"react/jsx-runtime";var MentionContext=createContext(void 0),MentionContextProvider=({value,children})=>{let[openPopoverMentionId,setOpenPopoverMentionId]=useState(null),openPopoverForMentionId=useCallback(async(mentionId,user)=>{requestAnimationFrame(()=>{setOpenPopoverMentionId(mentionId)})},[]),closeAllPopovers=useCallback(()=>{setOpenPopoverMentionId(null)},[]),mergedValue=useMemo(()=>({...value,openPopoverMentionId,openPopoverForMentionId,closeAllPopovers}),[value,openPopoverMentionId,openPopoverForMentionId,closeAllPopovers]);return jsx(MentionContext.Provider,{value:mergedValue,children})},useMentionContext=()=>useContext(MentionContext)??{};export{MentionContextProvider,useMentionContext};

package/dist/esm/lib/components/message-editor/editor-extensions/custom-mention/custom-mention-suggestions.js

@@ -1,23 +1 @@
-import { t as e } from "../../../../../../chunks/dist.js";
-var t = (t, n, r) => ({
-	char: n,
-	pluginKey: new e(t),
-	allowSpaces: !0,
-	allow: (e) => {
-		let { from: t, to: n } = e.range, r = e.state.doc.textBetween(t + 1, n, null, ""), i = r.startsWith(" "), a = r.includes("  ");
-		return !i && !a;
-	},
-	render: () => ({
-		onStart: (e) => {
-			r?.onSuggestionStart(e);
-		},
-		onUpdate: (e) => {
-			r?.onSuggestionUpdate(e);
-		},
-		onKeyDown: (e) => e.event.key === "Escape" ? (r?.onSuggestionExit(), !0) : r?.onSuggestionKeyDown(e) ?? !1,
-		onExit: () => {
-			r?.onSuggestionExit();
-		}
-	})
-});
-export { t as createSuggestionOptions };
+import{t as PluginKey}from"../../../../../../chunks/dist.js";var createSuggestionOptions=(pluginKeyName,char,callbacks)=>({char,pluginKey:new PluginKey(pluginKeyName),allowSpaces:!0,allow:props=>{let{from,to}=props.range,text=props.state.doc.textBetween(from+1,to,null,``),isSpaceFirstCharacter=text.startsWith(` `),hasDoubleSpace=text.includes(`  `);return!isSpaceFirstCharacter&&!hasDoubleSpace},render:()=>({onStart:props=>{callbacks?.onSuggestionStart(props)},onUpdate:props=>{callbacks?.onSuggestionUpdate(props)},onKeyDown:props=>props.event.key===`Escape`?(callbacks?.onSuggestionExit(),!0):callbacks?.onSuggestionKeyDown(props)??!1,onExit:()=>{callbacks?.onSuggestionExit()}})});export{createSuggestionOptions};

package/dist/esm/lib/components/message-editor/editor-extensions/custom-mention/custom-mention.js

@@ -1,59 +1 @@
-import { t as e } from "../../../../../../chunks/mention-component.js";
-import { jsx as t } from "react/jsx-runtime";
-import { NodeViewWrapper as n, ReactNodeViewRenderer as r } from "@tiptap/react";
-import { mergeAttributes as i } from "@tiptap/core";
-import a from "@tiptap/extension-mention";
-var o = ({ node: r }) => {
-	let { mentionedUserName: i, mentionedUserId: a, mentionedUserEmail: o, mentionId: s } = r.attrs;
-	return /* @__PURE__ */ t(n, {
-		as: "span",
-		children: /* @__PURE__ */ t(e, {
-			mentionedUserEmail: o,
-			mentionedUserId: a,
-			mentionedUserName: i,
-			mentionId: s
-		})
-	});
-}, s = a.extend({
-	addAttributes() {
-		return {
-			mentionedUserId: {
-				default: null,
-				parseHTML: (e) => e.getAttribute("data-mentioned-user-id"),
-				renderHTML: (e) => e.mentionedUserId ? { "data-mentioned-user-id": e.mentionedUserId } : {}
-			},
-			mentionedUserName: {
-				default: null,
-				parseHTML: (e) => e.getAttribute("data-mentioned-user-name"),
-				renderHTML: (e) => e.mentionedUserName ? { "data-mentioned-user-name": e.mentionedUserName } : {}
-			},
-			mentionedUserEmail: {
-				default: null,
-				parseHTML: (e) => e.getAttribute("data-mentioned-user-email"),
-				renderHTML: (e) => e.mentionedUserEmail ? { "data-mentioned-user-email": e.mentionedUserEmail } : {}
-			},
-			mentionId: {
-				default: null,
-				parseHTML: (e) => e.getAttribute("data-mention-id"),
-				renderHTML: (e) => ({ "data-mention-id": e.mentionId })
-			}
-		};
-	},
-	addNodeView() {
-		return r(o);
-	},
-	renderHTML({ HTMLAttributes: e, node: t }) {
-		return [
-			"span",
-			i(this.options.HTMLAttributes, e, {
-				"data-component-type": "mention",
-				"data-mentioned-user-id": t.attrs.mentionedUserId,
-				"data-mentioned-user-name": t.attrs.mentionedUserName,
-				"data-mentioned-user-email": t.attrs.mentionedUserEmail,
-				"data-mention-id": t.attrs.mentionId
-			}),
-			`@${t.attrs.mentionedUserName}`
-		];
-	}
-});
-export { s as CustomMention };
+import{t as MentionComponent}from"../../../../../../chunks/mention-component.js";import{jsx}from"react/jsx-runtime";import{NodeViewWrapper,ReactNodeViewRenderer}from"@tiptap/react";import{mergeAttributes}from"@tiptap/core";import Mention from"@tiptap/extension-mention";var MentionNodeView=({node})=>{let{mentionedUserName,mentionedUserId,mentionedUserEmail,mentionId}=node.attrs;return jsx(NodeViewWrapper,{as:`span`,children:jsx(MentionComponent,{mentionedUserEmail,mentionedUserId,mentionedUserName,mentionId})})},CustomMention=Mention.extend({addAttributes(){return{mentionedUserId:{default:null,parseHTML:element=>element.getAttribute(`data-mentioned-user-id`),renderHTML:attributes=>attributes.mentionedUserId?{"data-mentioned-user-id":attributes.mentionedUserId}:{}},mentionedUserName:{default:null,parseHTML:element=>element.getAttribute(`data-mentioned-user-name`),renderHTML:attributes=>attributes.mentionedUserName?{"data-mentioned-user-name":attributes.mentionedUserName}:{}},mentionedUserEmail:{default:null,parseHTML:element=>element.getAttribute(`data-mentioned-user-email`),renderHTML:attributes=>attributes.mentionedUserEmail?{"data-mentioned-user-email":attributes.mentionedUserEmail}:{}},mentionId:{default:null,parseHTML:element=>element.getAttribute(`data-mention-id`),renderHTML:attributes=>({"data-mention-id":attributes.mentionId})}}},addNodeView(){return ReactNodeViewRenderer(MentionNodeView)},renderHTML({HTMLAttributes,node}){return[`span`,mergeAttributes(this.options.HTMLAttributes,HTMLAttributes,{"data-component-type":`mention`,"data-mentioned-user-id":node.attrs.mentionedUserId,"data-mentioned-user-name":node.attrs.mentionedUserName,"data-mentioned-user-email":node.attrs.mentionedUserEmail,"data-mention-id":node.attrs.mentionId}),`@${node.attrs.mentionedUserName}`]}});export{CustomMention};

package/dist/esm/lib/components/message-editor/editor-extensions/custom-mention/useMentionState.js

@@ -1,24 +1 @@
-import { useMemo as e, useState as t } from "react";
-var n = /* @__PURE__ */ function(e) {
-	return e.ARROW_DOWN = "ArrowDown", e.ARROW_UP = "ArrowUp", e.ENTER = "Enter", e;
-}({}), r = (n) => {
-	let [r, i] = t(!1), [a, o] = t(""), [s, c] = t(null);
-	return {
-		isActive: r,
-		query: a,
-		command: s,
-		suggestionCallbacks: e(() => ({
-			onSuggestionStart: (e) => {
-				i(!0), o(e.query), c(() => e.command);
-			},
-			onSuggestionUpdate: (e) => {
-				o(e.query), c(() => e.command);
-			},
-			onSuggestionKeyDown: (e) => n.current ? e.event.key === "ArrowDown" ? (n.current.selectNext(), !0) : e.event.key === "ArrowUp" ? (n.current.selectPrevious(), !0) : e.event.key === "Enter" ? (n.current.selectItem(), !0) : !1 : !1,
-			onSuggestionExit: () => {
-				i(!1);
-			}
-		}), [n])
-	};
-};
-export { n as KeyEvents, r as useMentionState };
+import{useMemo,useState}from"react";var KeyEvents=function(KeyEvents){return KeyEvents.ARROW_DOWN=`ArrowDown`,KeyEvents.ARROW_UP=`ArrowUp`,KeyEvents.ENTER=`Enter`,KeyEvents}({}),useMentionState=userSelectorRef=>{let[isActive,setIsActive]=useState(!1),[query,setQuery]=useState(``),[command,setCommand]=useState(null);return{isActive,query,command,suggestionCallbacks:useMemo(()=>({onSuggestionStart:startParams=>{setIsActive(!0),setQuery(startParams.query),setCommand(()=>startParams.command)},onSuggestionUpdate:updateParams=>{setQuery(updateParams.query),setCommand(()=>updateParams.command)},onSuggestionKeyDown:keyParams=>userSelectorRef.current?keyParams.event.key===`ArrowDown`?(userSelectorRef.current.selectNext(),!0):keyParams.event.key===`ArrowUp`?(userSelectorRef.current.selectPrevious(),!0):keyParams.event.key===`Enter`?(userSelectorRef.current.selectItem(),!0):!1:!1,onSuggestionExit:()=>{setIsActive(!1)}}),[userSelectorRef])}};export{KeyEvents,useMentionState};

package/dist/esm/lib/components/message-editor/editor-extensions/custom-paragraph.js

@@ -1,13 +1 @@
-import { Text as e } from "@box/blueprint-web";
-import { jsx as t } from "react/jsx-runtime";
-import { NodeViewContent as n, NodeViewWrapper as r, ReactNodeViewRenderer as i } from "@tiptap/react";
-import a from "@tiptap/extension-paragraph";
-var o = () => /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(e, {
-	as: "div",
-	color: "textOnLightDefault",
-	variant: "bodyDefault",
-	children: /* @__PURE__ */ t(n, {})
-}) }), s = a.extend({ addNodeView() {
-	return i(o);
-} });
-export { s as CustomParagraph };
+import{Text}from"@box/blueprint-web";import{jsx}from"react/jsx-runtime";import{NodeViewContent,NodeViewWrapper,ReactNodeViewRenderer}from"@tiptap/react";import Paragraph from"@tiptap/extension-paragraph";var ParagraphComponent=()=>jsx(NodeViewWrapper,{children:jsx(Text,{as:`div`,color:`textOnLightDefault`,variant:`bodyDefault`,children:jsx(NodeViewContent,{})})}),CustomParagraph=Paragraph.extend({addNodeView(){return ReactNodeViewRenderer(ParagraphComponent)}});export{CustomParagraph};

package/dist/esm/lib/components/message-editor/editor-extensions/custom-placeholder/custom-placeholder-utils.js

@@ -1,26 +1 @@
-var e = /* @__PURE__ */ function(e) {
-	return e.Placeholder = "placeholder", e;
-}({}), t = 1, n = (e) => {
-	let { content: t, paragraphNumber: n } = s(e);
-	n === 1 && t.length === 0 && e.commands.setContent([{ type: "placeholder" }], { emitUpdate: !1 });
-}, r = (e, t) => {
-	let n = e.getJSON(), r = i(n, t);
-	o(n) !== o(r) && e.commands.setContent(r, { emitUpdate: !0 });
-}, i = (e, t) => {
-	let n = Array.isArray(t) ? t : [t];
-	return a(e, (e) => !n.includes(e.type));
-}, a = (e, t) => {
-	if (!e.content) return e;
-	let n = e.content?.filter(t).map((e) => a(e, t)) || [];
-	return {
-		...e,
-		content: n
-	};
-}, o = (e) => e.content ? e.content.reduce((e, n) => e + t + o(n), 0) : 0, s = (e) => {
-	let t = e.getJSON().content || [];
-	return {
-		content: t.flatMap((e) => e.content || []),
-		paragraphNumber: t.length
-	};
-};
-export { e as EditorContentType, n as addPlaceholderToContent, r as deleteNode, a as filterContent, s as getEditorContent, i as removeContentOfType };
+var EditorContentType=function(EditorContentType){return EditorContentType.Placeholder=`placeholder`,EditorContentType}({}),NODE_INCREMENT=1,addPlaceholderToContent=editor=>{let{content,paragraphNumber}=getEditorContent(editor);paragraphNumber===1&&content.length===0&&editor.commands.setContent([{type:`placeholder`}],{emitUpdate:!1})},deleteNode=(editor,nodeType)=>{let content=editor.getJSON(),contentWithoutNode=removeContentOfType(content,nodeType);calculateNodesNumber(content)!==calculateNodesNumber(contentWithoutNode)&&editor.commands.setContent(contentWithoutNode,{emitUpdate:!0})},removeContentOfType=(content,type)=>{let typesToRemove=Array.isArray(type)?type:[type];return filterContent(content,childContent=>!typesToRemove.includes(childContent.type))},filterContent=(content,predicate)=>{if(!content.content)return content;let filteredChildren=content.content?.filter(predicate).map(child=>filterContent(child,predicate))||[];return{...content,content:filteredChildren}},calculateNodesNumber=content=>content.content?content.content.reduce((acc,childContent)=>acc+NODE_INCREMENT+calculateNodesNumber(childContent),0):0,getEditorContent=editor=>{let editorContent=editor.getJSON().content||[];return{content:editorContent.flatMap(contentItem=>contentItem.content||[]),paragraphNumber:editorContent.length}};export{EditorContentType,addPlaceholderToContent,deleteNode,filterContent,getEditorContent,removeContentOfType};

package/dist/esm/lib/components/message-editor/editor-extensions/custom-placeholder/custom-placeholder.js

@@ -1,2 +1 @@
-import { t as e } from "../../../../../../chunks/custom-placeholder.js";
-export { e as CustomPlaceholder };
+import{t as CustomPlaceholder}from"../../../../../../chunks/custom-placeholder.js";export{CustomPlaceholder};

package/dist/esm/lib/components/message-editor/error-message.js

@@ -1,17 +1 @@
-import { t as e } from "../../../../chunks/message-editor.module.js";
-import { Text as t } from "@box/blueprint-web";
-import { AlertBadge as n } from "@box/blueprint-web-assets/icons/Fill";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-var a = ({ errorMessage: a }) => /* @__PURE__ */ i("div", {
-	className: e.errorMessage,
-	children: [/* @__PURE__ */ r(n, {
-		color: "var(--icon-icon-destructive-on-light)",
-		height: 16,
-		width: 16
-	}), /* @__PURE__ */ r(t, {
-		as: "span",
-		className: e.errorText,
-		children: a
-	})]
-});
-export { a as ErrorMessage };
+import{t as message_editor_module_default}from"../../../../chunks/message-editor.module.js";import{Text}from"@box/blueprint-web";import{AlertBadge}from"@box/blueprint-web-assets/icons/Fill";import{jsx,jsxs}from"react/jsx-runtime";var ErrorMessage=({errorMessage})=>jsxs(`div`,{className:message_editor_module_default.errorMessage,children:[jsx(AlertBadge,{color:`var(--icon-icon-destructive-on-light)`,height:16,width:16}),jsx(Text,{as:`span`,className:message_editor_module_default.errorText,children:errorMessage})]});export{ErrorMessage};

package/dist/esm/lib/components/message-editor/hooks/useMessageEditor.js

@@ -1,69 +1 @@
-import { useMentionContext as e } from "../../mention-component/mention-context.js";
-import { t } from "../../../../../chunks/message-editor.module.js";
-import { CustomMention as n } from "../editor-extensions/custom-mention/custom-mention.js";
-import { createSuggestionOptions as r } from "../editor-extensions/custom-mention/custom-mention-suggestions.js";
-import { useMentionState as i } from "../editor-extensions/custom-mention/useMentionState.js";
-import { CustomParagraph as a } from "../editor-extensions/custom-paragraph.js";
-import { addPlaceholderToContent as o } from "../editor-extensions/custom-placeholder/custom-placeholder-utils.js";
-import { t as s } from "../../../../../chunks/custom-placeholder.js";
-import { useCallback as c, useRef as l, useState as u } from "react";
-import { useEditor as d } from "@tiptap/react";
-import f from "@tiptap/extension-document";
-import p from "@tiptap/extension-text";
-import { v4 as m } from "uuid";
-var h = () => {
-	let h = l(null), g = l(null), [_, v] = u(!0), { isActive: y, query: b, command: x, suggestionCallbacks: S } = i(h), { closeAllPopovers: C, openPopoverForMentionId: w, fetchCollaboratorState: T } = e(), E = d({
-		shouldRerenderOnTransaction: !0,
-		extensions: [
-			f,
-			a,
-			p,
-			s,
-			...[{
-				char: "@",
-				pluginKey: "mentionAt"
-			}, {
-				char: "＠",
-				pluginKey: "mentionAtJapanese"
-			}].map(({ char: e, pluginKey: t }) => n.extend({ name: "mention" }).configure({ suggestion: r(t, e, S) }))
-		],
-		autofocus: !0,
-		editorProps: { attributes: { class: t.editor } },
-		onCreate: ({ editor: e }) => {
-			g.current = e.view.dom;
-		},
-		onUpdate: ({ editor: e }) => {
-			v(e.isEmpty || e.getText().trim() === ""), C?.();
-		}
-	});
-	return {
-		editor: E,
-		editorRef: g,
-		isEditorEmpty: _,
-		isActive: y,
-		query: b,
-		userSelectorRef: h,
-		cleanEditor: c(() => {
-			E && requestAnimationFrame(() => {
-				E.isDestroyed || (E.commands.setContent("", { emitUpdate: !1 }), o(E), v(!0));
-			});
-		}, [E]),
-		getEditorJsonContent: c(() => E ? E.getJSON() : null, [E]),
-		handleUserSelected: c(async (e) => {
-			if (x) {
-				let t = m();
-				x({
-					mentionedUserName: e.name,
-					mentionedUserId: e.id.toString(),
-					mentionedUserEmail: e.email,
-					mentionId: t
-				}), (await T?.(e) ?? !1) || w?.(t, e);
-			}
-		}, [
-			x,
-			w,
-			T
-		])
-	};
-};
-export { h as useMessageEditor };
+import{useMentionContext}from"../../mention-component/mention-context.js";import{t as message_editor_module_default}from"../../../../../chunks/message-editor.module.js";import{CustomMention}from"../editor-extensions/custom-mention/custom-mention.js";import{createSuggestionOptions}from"../editor-extensions/custom-mention/custom-mention-suggestions.js";import{useMentionState}from"../editor-extensions/custom-mention/useMentionState.js";import{CustomParagraph}from"../editor-extensions/custom-paragraph.js";import{addPlaceholderToContent}from"../editor-extensions/custom-placeholder/custom-placeholder-utils.js";import{t as CustomPlaceholder}from"../../../../../chunks/custom-placeholder.js";import{useCallback,useRef,useState}from"react";import{useEditor}from"@tiptap/react";import Document from"@tiptap/extension-document";import Text from"@tiptap/extension-text";import{v4}from"uuid";var useMessageEditor=()=>{let userSelectorRef=useRef(null),editorRef=useRef(null),[isEditorEmpty,setIsEditorEmpty]=useState(!0),{isActive,query,command,suggestionCallbacks}=useMentionState(userSelectorRef),{closeAllPopovers,openPopoverForMentionId,fetchCollaboratorState}=useMentionContext(),editor=useEditor({shouldRerenderOnTransaction:!0,extensions:[Document,CustomParagraph,Text,CustomPlaceholder,...[{char:`@`,pluginKey:`mentionAt`},{char:`＠`,pluginKey:`mentionAtJapanese`}].map(({char,pluginKey})=>CustomMention.extend({name:`mention`}).configure({suggestion:createSuggestionOptions(pluginKey,char,suggestionCallbacks)}))],autofocus:!0,editorProps:{attributes:{class:message_editor_module_default.editor}},onCreate:({editor:editorInstance})=>{editorRef.current=editorInstance.view.dom},onUpdate:({editor:editorInstance})=>{setIsEditorEmpty(editorInstance.isEmpty||editorInstance.getText().trim()===``),closeAllPopovers?.()}});return{editor,editorRef,isEditorEmpty,isActive,query,userSelectorRef,cleanEditor:useCallback(()=>{editor&&requestAnimationFrame(()=>{editor.isDestroyed||(editor.commands.setContent(``,{emitUpdate:!1}),addPlaceholderToContent(editor),setIsEditorEmpty(!0))})},[editor]),getEditorJsonContent:useCallback(()=>editor?editor.getJSON():null,[editor]),handleUserSelected:useCallback(async user=>{if(command){let mentionId=v4();command({mentionedUserName:user.name,mentionedUserId:user.id.toString(),mentionedUserEmail:user.email,mentionId}),(await fetchCollaboratorState?.(user)??!1)||openPopoverForMentionId?.(mentionId,user)}},[command,openPopoverForMentionId,fetchCollaboratorState])}};export{useMessageEditor};

package/dist/esm/lib/components/message-editor/hooks/useMessagePost.js

@@ -1,35 +1 @@
-import { useMentionContext as e } from "../../mention-component/mention-context.js";
-import { getErrorMessage as t } from "../../../utils/getErrorMessage.js";
-import { useState as n } from "react";
-var r = ({ onPost: r, onPostError: i, onPostSuccess: a, defaultErrorMessage: o = null, cleanEditor: s, getEditorJsonContent: c, onCancel: l }) => {
-	let [u, d] = n(!1), [f, p] = n(null), { closeAllPopovers: m } = e();
-	return {
-		isLoading: u,
-		errorMessage: f,
-		handlePost: async () => {
-			let e = c();
-			try {
-				d(!0), p(null);
-				let t = r(e), n = t instanceof Promise ? await t : t;
-				a?.(n), s(), l(!1);
-			} catch (e) {
-				let n = i?.(e);
-				if (o) {
-					p(o);
-					return;
-				}
-				if (n) {
-					p(n);
-					return;
-				}
-				p(t(e));
-			} finally {
-				d(!1), m?.();
-			}
-		},
-		clearError: () => {
-			p(null);
-		}
-	};
-};
-export { r as useMessagePost };
+import{useMentionContext}from"../../mention-component/mention-context.js";import{getErrorMessage}from"../../../utils/getErrorMessage.js";import{useState}from"react";var useMessagePost=({onPost,onPostError,onPostSuccess,defaultErrorMessage=null,cleanEditor,getEditorJsonContent,onCancel})=>{let[isLoading,setIsLoading]=useState(!1),[errorMessage,setErrorMessage]=useState(null),{closeAllPopovers}=useMentionContext();return{isLoading,errorMessage,handlePost:async()=>{let content=getEditorJsonContent();try{setIsLoading(!0),setErrorMessage(null);let result=onPost(content),response=result instanceof Promise?await result:result;onPostSuccess?.(response),cleanEditor(),onCancel(!1)}catch(error){let callbackErrorMessage=onPostError?.(error);if(defaultErrorMessage){setErrorMessage(defaultErrorMessage);return}if(callbackErrorMessage){setErrorMessage(callbackErrorMessage);return}setErrorMessage(getErrorMessage(error))}finally{setIsLoading(!1),closeAllPopovers?.()}},clearError:()=>{setErrorMessage(null)}}};export{useMessagePost};

package/dist/esm/lib/components/message-editor/message-editor-actions.js

@@ -1,29 +1 @@
-import { t as e } from "../../../../chunks/message-editor.module.js";
-import t from "./messages.js";
-import { Button as n } from "@box/blueprint-web";
-import { useIntl as r } from "react-intl";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-var o = ({ onCancel: o, onPost: s, isLoading: c = !1, disableCancel: l = !1, disablePost: u = !1 }) => {
-	let d = r();
-	return /* @__PURE__ */ a("div", {
-		className: e.actionsContainer,
-		children: [/* @__PURE__ */ i(n, {
-			"aria-label": d.formatMessage(t.cancelButtonAriaLabel),
-			disabled: l,
-			onClick: () => o(!0),
-			size: "small",
-			variant: "secondary",
-			children: d.formatMessage(t.postCancel)
-		}), /* @__PURE__ */ i(n, {
-			"aria-label": d.formatMessage(t.postButtonAriaLabel),
-			disabled: u,
-			loading: c,
-			loadingAriaLabel: d.formatMessage(t.postLoading),
-			onClick: s,
-			size: "small",
-			variant: "primary",
-			children: d.formatMessage(t.post)
-		})]
-	});
-};
-export { o as MessageEditorActions };
+import{t as message_editor_module_default}from"../../../../chunks/message-editor.module.js";import messages from"./messages.js";import{Button}from"@box/blueprint-web";import{useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";var MessageEditorActions=({onCancel,onPost,isLoading=!1,disableCancel=!1,disablePost=!1})=>{let intl=useIntl();return jsxs(`div`,{className:message_editor_module_default.actionsContainer,children:[jsx(Button,{"aria-label":intl.formatMessage(messages.cancelButtonAriaLabel),disabled:disableCancel,onClick:()=>onCancel(!0),size:`small`,variant:`secondary`,children:intl.formatMessage(messages.postCancel)}),jsx(Button,{"aria-label":intl.formatMessage(messages.postButtonAriaLabel),disabled:disablePost,loading:isLoading,loadingAriaLabel:intl.formatMessage(messages.postLoading),onClick:onPost,size:`small`,variant:`primary`,children:intl.formatMessage(messages.post)})]})};export{MessageEditorActions};

package/dist/esm/lib/components/message-editor/message-editor-context.js

@@ -1,7 +1 @@
-import { createContext as e, useContext as t } from "react";
-import { jsx as n } from "react/jsx-runtime";
-var r = /*#__PURE__*/ e(void 0), i = ({ value: e, children: t }) => /* @__PURE__ */ n(r.Provider, {
-	value: e,
-	children: t
-}), a = () => t(r) ?? {};
-export { i as MessageEditorContextProvider, a as useMessageEditorContext };
+import{createContext,useContext}from"react";import{jsx}from"react/jsx-runtime";var MessageEditorContext=createContext(void 0),MessageEditorContextProvider=({value,children})=>jsx(MessageEditorContext.Provider,{value,children}),useMessageEditorContext=()=>useContext(MessageEditorContext)??{};export{MessageEditorContextProvider,useMessageEditorContext};

package/dist/esm/lib/components/message-editor/message-editor.js

@@ -1,74 +1 @@
-import { t as e } from "../../../../chunks/message-editor.module.js";
-import { ErrorMessage as t } from "./error-message.js";
-import { MessageEditorContextProvider as n } from "./message-editor-context.js";
-import r from "./messages.js";
-import { useMessageEditor as i } from "./hooks/useMessageEditor.js";
-import { useMessagePost as a } from "./hooks/useMessagePost.js";
-import { MessageEditorActions as o } from "./message-editor-actions.js";
-import { getMessageEditorState as s } from "./utils/getMessageEditorState.js";
-import c from "clsx";
-import { useEffect as l } from "react";
-import { useIntl as u } from "react-intl";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import { UserSelectorHeadless as p } from "@box/user-selector";
-import { EditorContent as m } from "@tiptap/react";
-var h = ({ messageCount: h, onPost: g, onCancel: _, onPostError: v, onPostSuccess: y, disableCancel: b = !1, disablePost: x = !1, disableComponent: S = !1, defaultErrorMessage: C = "", userSelectorProps: w }) => {
-	let T = u(), { editor: E, editorRef: D, isEditorEmpty: O, isActive: k, query: A, userSelectorRef: j, handleUserSelected: M, cleanEditor: N, getEditorJsonContent: P } = i(), { isLoading: F, errorMessage: I, handlePost: L } = a({
-		onPost: g,
-		onPostError: v,
-		onPostSuccess: y,
-		defaultErrorMessage: C,
-		cleanEditor: N,
-		getEditorJsonContent: P,
-		onCancel: _
-	}), { disableEditor: R, isPostDisabled: z, isCancelDisabled: B } = s({
-		disablePost: x,
-		disableCancel: b,
-		disableComponent: S,
-		isEditorEmpty: O,
-		isLoading: F
-	});
-	l(() => {
-		E && E.setOptions({ editable: !R });
-	}, [E, R]);
-	let V = /* @__PURE__ */ d("div", { className: e.anchorElement });
-	return E ? /* @__PURE__ */ d(n, {
-		value: { messageCount: h },
-		children: /* @__PURE__ */ f("div", {
-			className: e.messageEditor,
-			children: [
-				/* @__PURE__ */ f("div", {
-					className: c(e.editorContainer, {
-						[e.editorError]: I,
-						[e.editorDisabled]: R
-					}),
-					children: [/* @__PURE__ */ d(m, {
-						"aria-label": T.formatMessage(r.editorContentAriaLabel),
-						editor: E
-					}), /* @__PURE__ */ d(p, {
-						ref: j,
-						inputElementRef: D,
-						onSelectedUserChange: M,
-						open: k,
-						rootElement: V,
-						value: A,
-						...w,
-						popoverContentContainerProps: {
-							...w.popoverContentContainerProps,
-							avoidCollisions: !1
-						}
-					})]
-				}),
-				I && /* @__PURE__ */ d(t, { errorMessage: I }),
-				/* @__PURE__ */ d(o, {
-					disableCancel: B,
-					disablePost: z,
-					isLoading: F,
-					onCancel: _,
-					onPost: L
-				})
-			]
-		})
-	}) : null;
-};
-export { h as MessageEditor };
+import{t as message_editor_module_default}from"../../../../chunks/message-editor.module.js";import{ErrorMessage}from"./error-message.js";import{MessageEditorContextProvider}from"./message-editor-context.js";import messages from"./messages.js";import{useMessageEditor}from"./hooks/useMessageEditor.js";import{useMessagePost}from"./hooks/useMessagePost.js";import{MessageEditorActions}from"./message-editor-actions.js";import{getMessageEditorState}from"./utils/getMessageEditorState.js";import clsx from"clsx";import{useEffect}from"react";import{useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import{UserSelectorHeadless}from"@box/user-selector";import{EditorContent}from"@tiptap/react";var MessageEditor=({messageCount,onPost,onCancel,onPostError,onPostSuccess,disableCancel=!1,disablePost=!1,disableComponent=!1,defaultErrorMessage=``,userSelectorProps})=>{let intl=useIntl(),{editor,editorRef,isEditorEmpty,isActive,query,userSelectorRef,handleUserSelected,cleanEditor,getEditorJsonContent}=useMessageEditor(),{isLoading,errorMessage,handlePost}=useMessagePost({onPost,onPostError,onPostSuccess,defaultErrorMessage,cleanEditor,getEditorJsonContent,onCancel}),{disableEditor,isPostDisabled,isCancelDisabled}=getMessageEditorState({disablePost,disableCancel,disableComponent,isEditorEmpty,isLoading});useEffect(()=>{editor&&editor.setOptions({editable:!disableEditor})},[editor,disableEditor]);let anchorElement=jsx(`div`,{className:message_editor_module_default.anchorElement});return editor?jsx(MessageEditorContextProvider,{value:{messageCount},children:jsxs(`div`,{className:message_editor_module_default.messageEditor,children:[jsxs(`div`,{className:clsx(message_editor_module_default.editorContainer,{[message_editor_module_default.editorError]:errorMessage,[message_editor_module_default.editorDisabled]:disableEditor}),children:[jsx(EditorContent,{"aria-label":intl.formatMessage(messages.editorContentAriaLabel),editor}),jsx(UserSelectorHeadless,{ref:userSelectorRef,inputElementRef:editorRef,onSelectedUserChange:handleUserSelected,open:isActive,rootElement:anchorElement,value:query,...userSelectorProps,popoverContentContainerProps:{...userSelectorProps.popoverContentContainerProps,avoidCollisions:!1}})]}),errorMessage&&jsx(ErrorMessage,{errorMessage}),jsx(MessageEditorActions,{disableCancel:isCancelDisabled,disablePost:isPostDisabled,isLoading,onCancel,onPost:handlePost})]})}):null};export{MessageEditor};