@box/threaded-annotations 4.11.29 → 4.12.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.
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useCallback,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),[clientRect,setClientRect]=useState(null);return{isActive,query,command,clientRect,suggestionCallbacks:useMemo(()=>({onSuggestionStart:startParams=>{setIsActive(!0),setQuery(startParams.query),setCommand(()=>startParams.command),setClientRect(()=>startParams.clientRect??null)},onSuggestionUpdate:updateParams=>{setIsActive(!0),setQuery(updateParams.query),setCommand(()=>updateParams.command),setClientRect(()=>updateParams.clientRect??null)},onSuggestionKeyDown:keyParams=>userSelectorRef.current?keyParams.event.key===`ArrowDown`?(userSelectorRef.current.selectNext(),!0):keyParams.event.key===`ArrowUp`?(userSelectorRef.current.selectPrevious(),!0):keyParams.event.key===`Enter
|
|
1
|
+
import{useCallback,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),[clientRect,setClientRect]=useState(null);return{isActive,query,command,clientRect,suggestionCallbacks:useMemo(()=>({onSuggestionStart:startParams=>{setIsActive(!0),setQuery(startParams.query),setCommand(()=>startParams.command),setClientRect(()=>startParams.clientRect??null)},onSuggestionUpdate:updateParams=>{setIsActive(!0),setQuery(updateParams.query),setCommand(()=>updateParams.command),setClientRect(()=>updateParams.clientRect??null)},onSuggestionKeyDown:keyParams=>userSelectorRef.current?keyParams.event.key===`ArrowDown`?(userSelectorRef.current.selectNext(),!0):keyParams.event.key===`ArrowUp`?(userSelectorRef.current.selectPrevious(),!0):keyParams.event.key===`Enter`&&!keyParams.event.shiftKey?(userSelectorRef.current.selectItem(),!0):!1:!1,onSuggestionExit:()=>{setIsActive(!1),setClientRect(null)}}),[userSelectorRef]),close:useCallback(()=>{setIsActive(!1),setQuery(``),setCommand(null),setClientRect(null)},[])}};export{KeyEvents,useMentionState};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{THREADED_ANNOTATIONS_PORTAL}from"../../../v2/constants.js";import{useMentionContext}from"../../mention-component/mention-context.js";import{getSubmitShortcutAriaKeyShortcuts,isSubmitShortcut}from"../../../utils/is-submit-shortcut.js";import{createSuggestionOptions}from"./editor-extensions/custom-mention/custom-mention-suggestions.js";import{MENTION_PLUGIN_KEY,normalizeMentionPastedText,normalizeMentionTextInput}from"./editor-extensions/custom-mention/mention-trigger-normalization.js";import{useMentionState}from"./editor-extensions/custom-mention/useMentionState.js";import{createMessageEditorExtensions}from"./editor-extensions/create-message-editor-extensions.js";import{useCharacterLimit}from"./hooks/useCharacterLimit.js";import{useEditorContainerState}from"./hooks/useEditorContainerState.js";import{useMentionAnchorStyle}from"./hooks/useMentionAnchorStyle.js";import{useMentionUserSelection}from"./hooks/useMentionUserSelection.js";import{MessageEditorProvider,useMessageEditorContext}from"./message-editor-context.js";import messages from"./messages.js";import{t as message_editor_module_default}from"../../../../../chunks/message-editor2.module.js";import{CharacterLimitCounter}from"./subcomponents/character-limit-counter.js";import{EditButtons}from"./subcomponents/edit-buttons.js";import{ErrorMessage}from"./subcomponents/error-message.js";import{t as MessageEditorBubbleMenu}from"../../../../../chunks/message-editor-bubble-menu.js";import{PostButton}from"./subcomponents/post-button.js";import{t as TimestampToggle}from"../../../../../chunks/timestamp-toggle.js";import{MessageEditorVariant}from"./message-editor.types.js";import{VisuallyHidden}from"@box/blueprint-web";import clsx from"clsx";import{useCallback,useEffect,useMemo,useRef}from"react";import{useIntl}from"react-intl";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import{EditorContent,useEditor,useEditorState}from"@tiptap/react";import{UserSelectorHeadless}from"@box/user-selector";var IS_APPLE_DEVICE=typeof navigator<`u`&&/Mac|iP(hone|ad|od)/.test(navigator.platform),MESSAGE_EDITOR_FOCUS_CONTROL_SELECTOR=`button, a, input, textarea, label, [role="toolbar"], [role="checkbox"], [tabindex="0"]`,getShortcutFormat=event=>{if(!(IS_APPLE_DEVICE?event.metaKey:event.ctrlKey))return null;if(event.shiftKey)return event.code===`Digit8`?`bulletList`:event.code===`Digit7`?`orderedList`:null;switch(event.key.toLowerCase()){case`b`:return`bold`;case`i`:return`italic`;case`u`:return`underline`;default:return null}},MessageEditorContent=props=>{let{autoFocus=!0,disableComponent=!1,initialContent,isFirstAnnotation=!1,isReply=!1,isRichTextEnabled=!1,maxCharacterCount,onChange,onFormatToggle,userSelectorProps,videoTimestamp}=props,userSelectorRef=useRef(null),editorContainerRef=useRef(null),editorViewportRef=useRef(null),editorRef=useRef(null),editorInstanceRef=useRef(null),postButtonRef=useRef(null),onFormatToggleRef=useRef(onFormatToggle);onFormatToggleRef.current=onFormatToggle;let onChangeRef=useRef(onChange);onChangeRef.current=onChange;let intl=useIntl(),{errorMessage,isLoading}=useMessageEditorContext(),{close:closeMentionDropdown,isActive,query,command,clientRect,suggestionCallbacks}=useMentionState(userSelectorRef),{closeAllPopovers}=useMentionContext(),placeholderText=intl.formatMessage(isReply?messages.placeholderReply:messages.placeholderAddComment),isEditVariant=props.variant===MessageEditorVariant.EDIT_MESSAGE,editor=useEditor({extensions:createMessageEditorExtensions({isRichTextEnabled,mentionSuggestion:createSuggestionOptions(MENTION_PLUGIN_KEY,`@`,suggestionCallbacks),placeholder:placeholderText}),autofocus:autoFocus,content:initialContent,editorProps:{attributes:{"aria-keyshortcuts":getSubmitShortcutAriaKeyShortcuts(),class:message_editor_module_default.editor},handleKeyDown:(view,event)=>{if(!isEditVariant&&isSubmitShortcut(event)){let postButton=postButtonRef.current;return!postButton||postButton.disabled?!1:(postButton.click(),!0)}if(isRichTextEnabled){let format=getShortcutFormat(event),editorInstance=editorInstanceRef.current;if(format&&editorInstance?.isEditable){let wasActive=editorInstance.isActive(format);queueMicrotask(()=>{if(editorInstance.isDestroyed)return;let isFormatActive=editorInstance.isActive(format);isFormatActive!==wasActive&&onFormatToggleRef.current?.(format,isFormatActive)})}}return!1},handleTextInput:normalizeMentionTextInput,transformPastedText:normalizeMentionPastedText},onCreate:({editor:editorInstance})=>{editorInstanceRef.current=editorInstance,editorRef.current=editorInstance.view.dom,autoFocus&&editorInstance.commands.focus(`end`)},onUpdate:({editor:editorInstance})=>{onChangeRef.current?.(editorInstance.isEmpty?null:editorInstance.getJSON()),closeAllPopovers?.()}},[placeholderText,isRichTextEnabled,isEditVariant]),{onUserSelected}=useMentionUserSelection(useMemo(()=>command&&editor&&!editor.isDestroyed?{command,editor}:null,[command,editor])),{exceedsSingleLine,hasScroll,isAtBottom}=useEditorContainerState(editorContainerRef,editor),{isInView:isMentionInView,style:mentionAnchorStyle}=useMentionAnchorStyle(clientRect,isActive,editorContainerRef),characterLimitState=useCharacterLimit(editor,maxCharacterCount),isEditorEmpty=useEditorState({editor,selector:()=>({isEmpty:!editor||!editor.schema||editor.isEmpty})})?.isEmpty??!0,shouldApplyEditorFullWidth=isEditVariant||!isFirstAnnotation||isFirstAnnotation&&exceedsSingleLine,disableEditor=disableComponent||isLoading,isCharacterLimitExceeded=(characterLimitState?.excess??0)>0,isPostDisabled=isEditorEmpty||disableEditor||isCharacterLimitExceeded,showCharacterLimitCounter=characterLimitState&&characterLimitState.excess>0&&shouldApplyEditorFullWidth;useEffect(()=>{editor&&editor.setEditable(!disableEditor)},[editor,disableEditor]),useEffect(()=>{if(!isCharacterLimitExceeded||!editorContainerRef.current||!initialContent)return;let innerFrameId=0,outerFrameId=requestAnimationFrame(()=>{innerFrameId=requestAnimationFrame(()=>{editorContainerRef.current?.scrollTo({top:editorContainerRef.current.scrollHeight})})});return()=>{cancelAnimationFrame(outerFrameId),cancelAnimationFrame(innerFrameId)}},[isCharacterLimitExceeded]),useEffect(()=>{!editor||initialContent===void 0||queueMicrotask(()=>{editor.isDestroyed||(editor.chain().setMeta(`addToHistory`,!1).setContent(initialContent??``,{emitUpdate:!1}).run(),onChangeRef.current?.(editor.isEmpty?null:editor.getJSON()),autoFocus&&editor.commands.focus(`end`))})},[initialContent]),useEffect(()=>{if(!isActive)return;let portalSelector=`[${Object.keys(THREADED_ANNOTATIONS_PORTAL)[0]}]`,isInsideEditorOrPortal=target=>{if(editorContainerRef.current?.contains(target))return!0;let portals=document.querySelectorAll(portalSelector);for(let portal of portals)if(portal.contains(target))return!0;return!1},handleClose=e=>{let target=e.target;!target||isInsideEditorOrPortal(target)||closeMentionDropdown()},frameId=requestAnimationFrame(()=>{document.addEventListener(`mousedown`,handleClose),document.addEventListener(`focusin`,handleClose)});return()=>{cancelAnimationFrame(frameId),document.removeEventListener(`mousedown`,handleClose),document.removeEventListener(`focusin`,handleClose)}},[closeMentionDropdown,isActive]);let handleFormatToggle=useCallback((format,isFormatActive)=>onFormatToggleRef.current?.(format,isFormatActive),[]),handleMessageEditorMouseDown=useCallback(event=>{if(disableEditor||!editor||editor.isDestroyed)return;let{target}=event;target instanceof Element&&(editorContainerRef.current?.contains(target)||editor.view.dom.contains(target)||target.closest(MESSAGE_EDITOR_FOCUS_CONTROL_SELECTOR)||editor.isFocused||editor.commands.focus(`end`))},[disableEditor,editor]),anchorElement=jsx(`div`,{className:message_editor_module_default.anchorElement,style:mentionAnchorStyle});return jsx(`div`,{"data-no-expand":!0,className:message_editor_module_default.messageEditorWrapper,children:jsxs(`div`,{className:clsx(message_editor_module_default.messageEditor,{[message_editor_module_default.editorHasScroll]:hasScroll,[message_editor_module_default.editorEditMode]:isEditVariant,[message_editor_module_default.editorError]:errorMessage||isCharacterLimitExceeded,[message_editor_module_default.editorFirstAnnotation]:!isEditVariant&&isFirstAnnotation,[message_editor_module_default.editorCharacterLimitExceeded]:isCharacterLimitExceeded}),onMouseDown:handleMessageEditorMouseDown,children:[jsxs(`div`,{ref:editorViewportRef,className:clsx(message_editor_module_default.editorViewport,{[message_editor_module_default.editorFullWidth]:shouldApplyEditorFullWidth}),children:[isRichTextEnabled&&jsx(MessageEditorBubbleMenu,{editor,menuAnchorRef:editorViewportRef,onFormatToggle:handleFormatToggle}),jsxs(`div`,{ref:editorContainerRef,className:message_editor_module_default.editorContainer,"aria-label":intl.formatMessage(messages.scrollContainerAriaLabel),children:[jsx(EditorContent,{"aria-label":intl.formatMessage(messages.editorContentAriaLabel),editor}),jsx(UserSelectorHeadless,{ref:userSelectorRef,inputElementRef:editorRef,onSelectedUserChange:onUserSelected,open:isActive,rootElement:anchorElement,value:query,...userSelectorProps,popoverContentContainerProps:{...userSelectorProps.popoverContentContainerProps,...THREADED_ANNOTATIONS_PORTAL,avoidCollisions:isMentionInView,className:clsx(message_editor_module_default.mentionListPopover,!isMentionInView&&message_editor_module_default.mentionListPopoverHidden,userSelectorProps.popoverContentContainerProps?.className)}})]}),hasScroll&&jsx(`div`,{className:clsx(message_editor_module_default.editorFade,{[message_editor_module_default.editorFadeHidden]:isAtBottom}),"aria-hidden":`true`})]}),jsx(`div`,{className:clsx(message_editor_module_default.actionsWrapper,{[message_editor_module_default.withTimestampToggle]:!!videoTimestamp}),children:jsxs(`div`,{className:clsx(message_editor_module_default.actionsWrapperInner,{[message_editor_module_default.scrolledToBottom]:isAtBottom,[message_editor_module_default.characterLimitExceeded]:isCharacterLimitExceeded}),children:[errorMessage&&jsx(ErrorMessage,{errorMessage}),characterLimitState&&characterLimitState.excess>0&&!shouldApplyEditorFullWidth&&jsx(VisuallyHidden,{role:`alert`,children:intl.formatMessage(messages.characterLimitExceeded,{excess:characterLimitState.excess})}),videoTimestamp&&jsx(TimestampToggle,{className:message_editor_module_default.timestampToggle,disabled:disableEditor,formattedTimestamp:videoTimestamp.formattedTimestamp,isPressed:videoTimestamp.isPressed,onChange:videoTimestamp.onPressedChange}),isEditVariant?jsxs(`div`,{className:message_editor_module_default.editActionsColumn,children:[showCharacterLimitCounter&&jsx(CharacterLimitCounter,{count:characterLimitState.count,excess:characterLimitState.excess,maxCount:characterLimitState.maxCount}),jsx(`div`,{className:message_editor_module_default.editActionsRow,children:jsx(EditButtons,{disabled:isPostDisabled,getEditorJsonContent:()=>editor?.getJSON(),onCancel:props.onEditCancel,onEditSuccess:props.onEditSuccess,onSave:props.onSave,onSaveError:props.onSaveError})})]}):jsxs(Fragment,{children:[showCharacterLimitCounter&&jsx(CharacterLimitCounter,{count:characterLimitState.count,excess:characterLimitState.excess,maxCount:characterLimitState.maxCount}),jsx(PostButton,{buttonRef:postButtonRef,cleanEditor:()=>editor?.chain().setMeta(`addToHistory`,!1).setContent(``,{emitUpdate:!1}).run(),disabled:isPostDisabled,getEditorJsonContent:()=>editor?.getJSON(),onPost:props.onPost,onPostError:props.onPostError,onPostSuccess:props.onPostSuccess})]})]})})]})})},MessageEditor=props=>jsx(MessageEditorProvider,{children:jsx(MessageEditorContent,{...props})});export{MessageEditor,MessageEditorVariant};
|
|
1
|
+
import{THREADED_ANNOTATIONS_PORTAL}from"../../../v2/constants.js";import{useMentionContext}from"../../mention-component/mention-context.js";import{getSubmitShortcutAriaKeyShortcuts,isSubmitShortcut}from"../../../utils/is-submit-shortcut.js";import{createSuggestionOptions}from"./editor-extensions/custom-mention/custom-mention-suggestions.js";import{MENTION_PLUGIN_KEY,normalizeMentionPastedText,normalizeMentionTextInput}from"./editor-extensions/custom-mention/mention-trigger-normalization.js";import{useMentionState}from"./editor-extensions/custom-mention/useMentionState.js";import{createMessageEditorExtensions}from"./editor-extensions/create-message-editor-extensions.js";import{useCharacterLimit}from"./hooks/useCharacterLimit.js";import{useEditorContainerState}from"./hooks/useEditorContainerState.js";import{useMentionAnchorStyle}from"./hooks/useMentionAnchorStyle.js";import{useMentionUserSelection}from"./hooks/useMentionUserSelection.js";import{MessageEditorProvider,useMessageEditorContext}from"./message-editor-context.js";import messages from"./messages.js";import{t as message_editor_module_default}from"../../../../../chunks/message-editor2.module.js";import{CharacterLimitCounter}from"./subcomponents/character-limit-counter.js";import{EditButtons}from"./subcomponents/edit-buttons.js";import{ErrorMessage}from"./subcomponents/error-message.js";import{t as MessageEditorBubbleMenu}from"../../../../../chunks/message-editor-bubble-menu.js";import{PostButton}from"./subcomponents/post-button.js";import{t as TimestampToggle}from"../../../../../chunks/timestamp-toggle.js";import{MessageEditorVariant}from"./message-editor.types.js";import{VisuallyHidden}from"@box/blueprint-web";import clsx from"clsx";import{useCallback,useEffect,useMemo,useRef}from"react";import{useIntl}from"react-intl";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import{EditorContent,useEditor,useEditorState}from"@tiptap/react";import{UserSelectorHeadless}from"@box/user-selector";var IS_APPLE_DEVICE=typeof navigator<`u`&&/Mac|iP(hone|ad|od)/.test(navigator.platform),MESSAGE_EDITOR_FOCUS_CONTROL_SELECTOR=`button, a, input, textarea, label, [role="toolbar"], [role="checkbox"], [tabindex="0"]`,getShortcutFormat=event=>{if(!(IS_APPLE_DEVICE?event.metaKey:event.ctrlKey))return null;if(event.shiftKey)return event.code===`Digit8`?`bulletList`:event.code===`Digit7`?`orderedList`:null;switch(event.key.toLowerCase()){case`b`:return`bold`;case`i`:return`italic`;case`u`:return`underline`;default:return null}},MessageEditorContent=props=>{let{autoFocus=!0,disableComponent=!1,initialContent,isFirstAnnotation=!1,isReply=!1,isRichTextEnabled=!1,maxCharacterCount,onChange,onFormatToggle,userSelectorProps,videoTimestamp}=props,userSelectorRef=useRef(null),editorContainerRef=useRef(null),editorViewportRef=useRef(null),editorRef=useRef(null),editorInstanceRef=useRef(null),postButtonRef=useRef(null),onFormatToggleRef=useRef(onFormatToggle);onFormatToggleRef.current=onFormatToggle;let onChangeRef=useRef(onChange);onChangeRef.current=onChange;let intl=useIntl(),{errorMessage,isLoading}=useMessageEditorContext(),{close:closeMentionDropdown,isActive,query,command,clientRect,suggestionCallbacks}=useMentionState(userSelectorRef),{closeAllPopovers}=useMentionContext(),placeholderText=intl.formatMessage(isReply?messages.placeholderReply:messages.placeholderAddComment),isEditVariant=props.variant===MessageEditorVariant.EDIT_MESSAGE,editor=useEditor({extensions:createMessageEditorExtensions({isRichTextEnabled,mentionSuggestion:createSuggestionOptions(MENTION_PLUGIN_KEY,`@`,suggestionCallbacks),placeholder:placeholderText}),autofocus:autoFocus,content:initialContent,editorProps:{attributes:{"aria-keyshortcuts":getSubmitShortcutAriaKeyShortcuts(),class:message_editor_module_default.editor},handleKeyDown:(view,event)=>{if(event.key===`Enter`&&event.shiftKey&&!event.isComposing)return editorInstanceRef.current?.commands.splitBlock()??!1;if(!isEditVariant&&isSubmitShortcut(event)){let postButton=postButtonRef.current;return!postButton||postButton.disabled?!1:(postButton.click(),!0)}if(isRichTextEnabled){let format=getShortcutFormat(event),editorInstance=editorInstanceRef.current;if(format&&editorInstance?.isEditable){let wasActive=editorInstance.isActive(format);queueMicrotask(()=>{if(editorInstance.isDestroyed)return;let isFormatActive=editorInstance.isActive(format);isFormatActive!==wasActive&&onFormatToggleRef.current?.(format,isFormatActive)})}}return!1},handleTextInput:normalizeMentionTextInput,transformPastedText:normalizeMentionPastedText},onCreate:({editor:editorInstance})=>{editorInstanceRef.current=editorInstance,editorRef.current=editorInstance.view.dom,autoFocus&&editorInstance.commands.focus(`end`)},onUpdate:({editor:editorInstance})=>{onChangeRef.current?.(editorInstance.isEmpty?null:editorInstance.getJSON()),closeAllPopovers?.()}},[placeholderText,isRichTextEnabled,isEditVariant]),{onUserSelected}=useMentionUserSelection(useMemo(()=>command&&editor&&!editor.isDestroyed?{command,editor}:null,[command,editor])),{exceedsSingleLine,hasScroll,isAtBottom}=useEditorContainerState(editorContainerRef,editor),{isInView:isMentionInView,style:mentionAnchorStyle}=useMentionAnchorStyle(clientRect,isActive,editorContainerRef),characterLimitState=useCharacterLimit(editor,maxCharacterCount),isEditorEmpty=useEditorState({editor,selector:()=>({isEmpty:!editor||!editor.schema||editor.isEmpty})})?.isEmpty??!0,shouldApplyEditorFullWidth=isEditVariant||!isFirstAnnotation||isFirstAnnotation&&exceedsSingleLine,disableEditor=disableComponent||isLoading,isCharacterLimitExceeded=(characterLimitState?.excess??0)>0,isPostDisabled=isEditorEmpty||disableEditor||isCharacterLimitExceeded,showCharacterLimitCounter=characterLimitState&&characterLimitState.excess>0&&shouldApplyEditorFullWidth;useEffect(()=>{editor&&editor.setEditable(!disableEditor)},[editor,disableEditor]),useEffect(()=>{if(!isCharacterLimitExceeded||!editorContainerRef.current||!initialContent)return;let innerFrameId=0,outerFrameId=requestAnimationFrame(()=>{innerFrameId=requestAnimationFrame(()=>{editorContainerRef.current?.scrollTo({top:editorContainerRef.current.scrollHeight})})});return()=>{cancelAnimationFrame(outerFrameId),cancelAnimationFrame(innerFrameId)}},[isCharacterLimitExceeded]),useEffect(()=>{!editor||initialContent===void 0||queueMicrotask(()=>{editor.isDestroyed||(editor.chain().setMeta(`addToHistory`,!1).setContent(initialContent??``,{emitUpdate:!1}).run(),onChangeRef.current?.(editor.isEmpty?null:editor.getJSON()),autoFocus&&editor.commands.focus(`end`))})},[initialContent]),useEffect(()=>{if(!isActive)return;let portalSelector=`[${Object.keys(THREADED_ANNOTATIONS_PORTAL)[0]}]`,isInsideEditorOrPortal=target=>{if(editorContainerRef.current?.contains(target))return!0;let portals=document.querySelectorAll(portalSelector);for(let portal of portals)if(portal.contains(target))return!0;return!1},handleClose=e=>{let target=e.target;!target||isInsideEditorOrPortal(target)||closeMentionDropdown()},frameId=requestAnimationFrame(()=>{document.addEventListener(`mousedown`,handleClose),document.addEventListener(`focusin`,handleClose)});return()=>{cancelAnimationFrame(frameId),document.removeEventListener(`mousedown`,handleClose),document.removeEventListener(`focusin`,handleClose)}},[closeMentionDropdown,isActive]);let handleFormatToggle=useCallback((format,isFormatActive)=>onFormatToggleRef.current?.(format,isFormatActive),[]),handleMessageEditorMouseDown=useCallback(event=>{if(disableEditor||!editor||editor.isDestroyed)return;let{target}=event;target instanceof Element&&(editorContainerRef.current?.contains(target)||editor.view.dom.contains(target)||target.closest(MESSAGE_EDITOR_FOCUS_CONTROL_SELECTOR)||editor.isFocused||editor.commands.focus(`end`))},[disableEditor,editor]),anchorElement=jsx(`div`,{className:message_editor_module_default.anchorElement,style:mentionAnchorStyle});return jsx(`div`,{"data-no-expand":!0,className:message_editor_module_default.messageEditorWrapper,children:jsxs(`div`,{className:clsx(message_editor_module_default.messageEditor,{[message_editor_module_default.editorHasScroll]:hasScroll,[message_editor_module_default.editorEditMode]:isEditVariant,[message_editor_module_default.editorError]:errorMessage||isCharacterLimitExceeded,[message_editor_module_default.editorFirstAnnotation]:!isEditVariant&&isFirstAnnotation,[message_editor_module_default.editorCharacterLimitExceeded]:isCharacterLimitExceeded}),onMouseDown:handleMessageEditorMouseDown,children:[jsxs(`div`,{ref:editorViewportRef,className:clsx(message_editor_module_default.editorViewport,{[message_editor_module_default.editorFullWidth]:shouldApplyEditorFullWidth}),children:[isRichTextEnabled&&jsx(MessageEditorBubbleMenu,{editor,menuAnchorRef:editorViewportRef,onFormatToggle:handleFormatToggle}),jsxs(`div`,{ref:editorContainerRef,className:message_editor_module_default.editorContainer,"aria-label":intl.formatMessage(messages.scrollContainerAriaLabel),children:[jsx(EditorContent,{"aria-label":intl.formatMessage(messages.editorContentAriaLabel),editor}),jsx(UserSelectorHeadless,{ref:userSelectorRef,inputElementRef:editorRef,onSelectedUserChange:onUserSelected,open:isActive,rootElement:anchorElement,value:query,...userSelectorProps,popoverContentContainerProps:{...userSelectorProps.popoverContentContainerProps,...THREADED_ANNOTATIONS_PORTAL,avoidCollisions:isMentionInView,className:clsx(message_editor_module_default.mentionListPopover,!isMentionInView&&message_editor_module_default.mentionListPopoverHidden,userSelectorProps.popoverContentContainerProps?.className)}})]}),hasScroll&&jsx(`div`,{className:clsx(message_editor_module_default.editorFade,{[message_editor_module_default.editorFadeHidden]:isAtBottom}),"aria-hidden":`true`})]}),jsx(`div`,{className:clsx(message_editor_module_default.actionsWrapper,{[message_editor_module_default.withTimestampToggle]:!!videoTimestamp}),children:jsxs(`div`,{className:clsx(message_editor_module_default.actionsWrapperInner,{[message_editor_module_default.scrolledToBottom]:isAtBottom,[message_editor_module_default.characterLimitExceeded]:isCharacterLimitExceeded}),children:[errorMessage&&jsx(ErrorMessage,{errorMessage}),characterLimitState&&characterLimitState.excess>0&&!shouldApplyEditorFullWidth&&jsx(VisuallyHidden,{role:`alert`,children:intl.formatMessage(messages.characterLimitExceeded,{excess:characterLimitState.excess})}),videoTimestamp&&jsx(TimestampToggle,{className:message_editor_module_default.timestampToggle,disabled:disableEditor,formattedTimestamp:videoTimestamp.formattedTimestamp,isPressed:videoTimestamp.isPressed,onChange:videoTimestamp.onPressedChange}),isEditVariant?jsxs(`div`,{className:message_editor_module_default.editActionsColumn,children:[showCharacterLimitCounter&&jsx(CharacterLimitCounter,{count:characterLimitState.count,excess:characterLimitState.excess,maxCount:characterLimitState.maxCount}),jsx(`div`,{className:message_editor_module_default.editActionsRow,children:jsx(EditButtons,{disabled:isPostDisabled,getEditorJsonContent:()=>editor?.getJSON(),onCancel:props.onEditCancel,onEditSuccess:props.onEditSuccess,onSave:props.onSave,onSaveError:props.onSaveError})})]}):jsxs(Fragment,{children:[showCharacterLimitCounter&&jsx(CharacterLimitCounter,{count:characterLimitState.count,excess:characterLimitState.excess,maxCount:characterLimitState.maxCount}),jsx(PostButton,{buttonRef:postButtonRef,cleanEditor:()=>editor?.chain().setMeta(`addToHistory`,!1).setContent(``,{emitUpdate:!1}).run(),disabled:isPostDisabled,getEditorJsonContent:()=>editor?.getJSON(),onPost:props.onPost,onPostError:props.onPostError,onPostSuccess:props.onPostSuccess})]})]})})]})})},MessageEditor=props=>jsx(MessageEditorProvider,{children:jsx(MessageEditorContent,{...props})});export{MessageEditor,MessageEditorVariant};
|