Function RichTextInput

packages/shared/src/components/fields/RichTextInput.tsx:172–1131

(
  {
    className = {},
    inputId,
    footer,
    textareaProps = {},
    submitCopy,
    submitButtonVariant = ButtonVariant.Float,
    showUserAvatar,
    isUpdatingDraft,
    header,
    isLoading,
    disabledSubmit,
    maxInputLength,
    onClose,
    postId,
    sourceId,
    onSubmit,
    onValueUpdate,
    initialContent = '',
    enabledCommand = {},
    editCommentId,
    parentCommentId,
    mentionSuggestions,
    allowBlockFormatting = true,
    minHeightClassName = 'min-h-[8rem]',
    markdownToHtml = markdownToHtmlBasic,
    hideToolbar = false,
    toolbarPosition = 'top',
    toolbarLeading,
    toolbarRightActions,
    stackToolbarLeading = false,
    hideMarkdownToggle = false,
    hideMarkdownHeader = false,
    hideFooter = false,
    onMarkdownModeChange,
  }: RichTextInputProps,
  ref: ForwardedRef<RichTextInputRef>,
)

}

function RichTextInput(
  {
    className = {},
    inputId,
    footer,
    textareaProps = {},
    submitCopy,
    submitButtonVariant = ButtonVariant.Float,
    showUserAvatar,
    isUpdatingDraft,
    header,
    isLoading,
    disabledSubmit,
    maxInputLength,
    onClose,
    postId,
    sourceId,
    onSubmit,
    onValueUpdate,
    initialContent = '',
    enabledCommand = {},
    editCommentId,
    parentCommentId,
    mentionSuggestions,
    allowBlockFormatting = true,
    minHeightClassName = 'min-h-[8rem]',
    markdownToHtml = markdownToHtmlBasic,
    hideToolbar = false,
    toolbarPosition = 'top',
    toolbarLeading,
    toolbarRightActions,
    stackToolbarLeading = false,
    hideMarkdownToggle = false,
    hideMarkdownHeader = false,
    hideFooter = false,
    onMarkdownModeChange,
  }: RichTextInputProps,
  ref: ForwardedRef<RichTextInputRef>,
): ReactElement {
  const shouldShowSubmit = !!submitCopy;
  const { user } = useAuthContext();
  const { displayToast } = useToastNotification();
  const { parentSelector } = usePopupSelector();
  const toolbarRef = useRef<RichTextToolbarRef>(null);
  const editorContainerRef = useRef<HTMLDivElement>(null);
  const editorRef = useRef<Editor | null>(null);
  const markdownTextareaRef = useRef<HTMLTextAreaElement>(null);
  const scrollContainerRef = useRef<HTMLDivElement>(null);
  const scrollOffsetRef = useRef(0);
  const shouldRestoreScrollRef = useRef(false);
  const pendingFocusRef = useRef(false);
  const dirtyRef = useRef(false);
  const isSyncingRef = useRef(false);
  const inputRef = useRef('');
  const [offset, setOffset] = useState([0, 0]);
  const [isMarkdownMode, setIsMarkdownMode] = useState(false);
  const [submitShortcut, setSubmitShortcut] = useState('Ctrl + Enter');
  useEffect(() => {