@sybilion/uilib 1.3.33 → 1.3.36

package/dist/esm/components/ui/Chat/ChatChrome/ChatChrome.js

@@ -14,7 +14,7 @@ import { filterToTextAttachments, isAttachmentsDropzoneEnabled, buildAcceptAttr
 import { extractChatAttachmentItems } from '../chatAttachmentExtract.js';
 import S from './ChatChrome.styl.js';
 
-function ChatChrome({ showResizeHandle, resizeHandle, onClose, isEmpty, renderPresets, messages, onQuickReply, suppressedQuickReplyKeys, isLoading, scriptContinueLabel, onScriptContinue, renderMessageChart, showBranchActionsRow, showSyntheticBranchButtons, unusedBranchKeys, isScriptComplete, onGenerateDashboard, generatingDashboard, onGenerateDashboardClick, showInlinePresets, isLastMessageFromUser, scrollRef, effectiveScopeId, onPromptSubmit, onChatDeleted, promptPrefill, footerClassName, emptyState, allowedAttachments, allowPdfAttachments = false, onAttachmentsDropped, }) {
+function ChatChrome({ showResizeHandle, resizeHandle, onClose, isEmpty, renderPresets, messages, onQuickReply, suppressedQuickReplyKeys, isLoading, scriptContinueLabel, onScriptContinue, renderMessageChart, showBranchActionsRow, showSyntheticBranchButtons, unusedBranchKeys, isScriptComplete, onGenerateDashboard, generatingDashboard, onGenerateDashboardClick, showInlinePresets, isLastMessageFromUser, scrollRef, effectiveScopeId, onPromptSubmit, onChatDeleted, promptPrefill, footerClassName, emptyState, allowedAttachments, allowPdfAttachments = false, onAttachmentsDropped, slashCommandItems, promptPlaceholder, }) {
     const filteredAllowedAttachments = useMemo(() => filterToTextAttachments(allowedAttachments), [allowedAttachments]);
     const attachmentsDropzoneEnabled = isAttachmentsDropzoneEnabled(allowedAttachments, allowPdfAttachments);
     const attachmentAccept = useMemo(() => buildAcceptAttr(filteredAllowedAttachments, allowPdfAttachments), [filteredAllowedAttachments, allowPdfAttachments]);
@@ -80,7 +80,7 @@ function ChatChrome({ showResizeHandle, resizeHandle, onClose, isEmpty, renderPr
                                                     })
                                                     : null, isScriptComplete &&
                                                     onGenerateDashboard &&
-                                                    !generatingDashboard ? (jsxs(Button, { type: "button", variant: "default", size: "lg", disabled: isLoading, onClick: onGenerateDashboardClick, children: [jsx(ChartLineIcon, {}), "Generate Dashboard"] })) : null] })), showInlinePresets && renderPresets('inline'), isLoading && isLastMessageFromUser && (jsx(TextShimmer, { duration: 1, spread: 5, className: S.loader, children: "Thinking..." }))] }) })), jsxs("div", { className: cn(S.footer, footerClassName), children: [isEmpty ? (jsx("div", { className: S.notice, children: "Forecast Assistant can make mistakes." })) : null, jsx(Chat.Prompt, { onSubmit: handlePromptSubmitWithAttachments, disabled: promptBusy, attachments: pendingAttachments, onRemoveAttachment: handleRemoveAttachment, prefillMessage: promptPrefill ?? undefined, attachmentAccept: attachmentsDropzoneEnabled ? attachmentAccept : undefined, onAttachmentFiles: attachmentsDropzoneEnabled ? handleAttachmentFiles : undefined })] })] })] })] }));
+                                                    !generatingDashboard ? (jsxs(Button, { type: "button", variant: "default", size: "lg", disabled: isLoading, onClick: onGenerateDashboardClick, children: [jsx(ChartLineIcon, {}), "Generate Dashboard"] })) : null] })), showInlinePresets && renderPresets('inline'), isLoading && isLastMessageFromUser && (jsx(TextShimmer, { duration: 1, spread: 5, className: S.loader, children: "Thinking..." }))] }) })), jsxs("div", { className: cn(S.footer, footerClassName), children: [isEmpty ? (jsx("div", { className: S.notice, children: "Forecast Assistant can make mistakes." })) : null, jsx(Chat.Prompt, { onSubmit: handlePromptSubmitWithAttachments, disabled: promptBusy, attachments: pendingAttachments, onRemoveAttachment: handleRemoveAttachment, prefillMessage: promptPrefill ?? undefined, placeholder: promptPlaceholder, slashCommandItems: slashCommandItems, attachmentAccept: attachmentsDropzoneEnabled ? attachmentAccept : undefined, onAttachmentFiles: attachmentsDropzoneEnabled ? handleAttachmentFiles : undefined })] })] })] })] }));
 }
 
 export { ChatChrome };

package/dist/esm/components/ui/Chat/ChatPrompt/ChatPrompt.helpers.js

@@ -1,6 +1,19 @@
 /** Keep in sync with `ChatPrompt.styl` `INPUT_MAX_HEIGHT` / `min-height`. */
 const PROMPT_INPUT_MAX_HEIGHT_PX = 200;
 const PROMPT_INPUT_MIN_HEIGHT_PX = 40;
+/** ProseMirror `view.dom` exists only after TipTap mounts `<EditorContent />`; accessing `.view` can throw earlier. */
+function chatPromptSafeEditorDom(editor) {
+    if (!editor || editor.isDestroyed)
+        return null;
+    try {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const dom = editor.view?.dom;
+        return dom instanceof HTMLElement ? dom : null;
+    }
+    catch {
+        return null;
+    }
+}
 function chatPromptTextareaFloorPx(cs) {
     const padY = (Number.parseFloat(cs.paddingTop) || 0) +
         (Number.parseFloat(cs.paddingBottom) || 0);
@@ -10,12 +23,13 @@ function chatPromptTextareaFloorPx(cs) {
         : Number.parseFloat(cs.lineHeight) || fs * 1.25;
     return Math.max(PROMPT_INPUT_MIN_HEIGHT_PX, Math.ceil(linePx + padY));
 }
-/** Autosizing textarea inside flex shells: empty → floor only; typed → collapse measure + clamp. */
-function syncChatPromptTextareaHeight(el, message) {
+/** Same sizing rules for TipTap `.ProseMirror` root (`text` mirrors doc plain text length for empty-state). */
+function syncChatPromptComposerHeight(el, text) {
     const floor = chatPromptTextareaFloorPx(getComputedStyle(el));
     el.style.overflowY = 'hidden';
     let contentHeight;
-    if (message === '') {
+    const empty = text.trim() === '';
+    if (empty) {
         contentHeight = floor;
     }
     else {
@@ -28,4 +42,4 @@ function syncChatPromptTextareaHeight(el, message) {
         contentHeight > PROMPT_INPUT_MAX_HEIGHT_PX ? 'auto' : 'hidden';
 }
 
-export { PROMPT_INPUT_MAX_HEIGHT_PX, PROMPT_INPUT_MIN_HEIGHT_PX, chatPromptTextareaFloorPx, syncChatPromptTextareaHeight };
+export { PROMPT_INPUT_MAX_HEIGHT_PX, PROMPT_INPUT_MIN_HEIGHT_PX, chatPromptSafeEditorDom, chatPromptTextareaFloorPx, syncChatPromptComposerHeight };

package/dist/esm/components/ui/Chat/ChatPrompt/ChatPrompt.js

@@ -1,60 +1,47 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import cn from 'classnames';
-import { useState, useRef, useLayoutEffect, useEffect } from 'react';
-import useEvent from '../../../../hooks/useEvent.js';
-import { PaperclipIcon, SendHorizontalIcon } from 'lucide-react';
-import { Button } from '../../Button/Button.js';
-import { Input } from '../../Input/Input.js';
-import { syncChatPromptTextareaHeight } from './ChatPrompt.helpers.js';
+import { useRef, useCallback } from 'react';
 import S from './ChatPrompt.styl.js';
 import { ChatPromptAttachments } from './ChatPromptAttachments.js';
+import { ChatPromptComposer } from './ChatPromptComposer.js';
+import { useChatPromptEditor } from './useChatPromptEditor.js';
 
-function ChatPrompt({ onSubmit, placeholder, className, footer, prefillMessage, attachments = [], onRemoveAttachment, disabled = false, attachmentAccept, onAttachmentFiles, }) {
-    const [message, setMessage] = useState('');
-    const inputRef = useRef(null);
-    const fileInputRef = useRef(null);
-    const showAttachButton = Boolean(attachmentAccept && onAttachmentFiles);
-    useLayoutEffect(() => {
-        const el = inputRef.current;
-        if (!el)
-            return;
-        syncChatPromptTextareaHeight(el, message);
-    }, [message]);
-    useEffect(() => {
-        if (prefillMessage != null && prefillMessage !== '') {
-            setMessage(prefillMessage);
-        }
-    }, [prefillMessage]);
-    const handleSubmit = (e) => {
-        const trimmedMessage = message.trim();
-        const hasAttachments = attachments.length > 0;
-        if (trimmedMessage || hasAttachments) {
-            e.preventDefault();
-            onSubmit(trimmedMessage, hasAttachments ? attachments : undefined);
-            setMessage('');
-        }
-    };
-    const handleFileInputChange = (e) => {
-        const files = Array.from(e.target.files ?? []);
-        e.target.value = '';
-        if (files.length > 0) {
-            onAttachmentFiles?.(files);
-        }
-    };
-    useEvent({
-        event: 'keydown',
-        callback: (e) => {
-            if (e.key === 'Enter' && !(e.metaKey || e.shiftKey || e.ctrlKey)) {
-                e.preventDefault();
-                handleSubmit(e);
-                setMessage('');
-            }
-        },
+function ChatPrompt({ onSubmit, placeholder, className, footer, prefillMessage, slashCommandItems, attachments = [], onRemoveAttachment, disabled = false, attachmentAccept, onAttachmentFiles, }) {
+    const attachmentsCount = attachments.length;
+    const emitSubmitRef = useRef(() => { });
+    const { editor, trimmedMessage, resetAfterSend, handleComposerKeyDown } = useChatPromptEditor({
+        disabled,
+        placeholder,
+        slashCommandItems,
+        prefillMessage,
+        attachmentsCount,
+        onEnterSubmit: () => emitSubmitRef.current(),
     });
-    return (jsxs("form", { onSubmit: handleSubmit, className: cn(S.root, className), children: [jsx(ChatPromptAttachments, { attachments: attachments, onRemove: index => onRemoveAttachment?.(index), disabled: disabled }), jsxs("div", { className: S.composer, children: [showAttachButton ? (jsxs(Fragment, { children: [jsx("input", { ref: fileInputRef, type: "file", accept: attachmentAccept, multiple: true, className: S.fileInput, disabled: disabled, onChange: handleFileInputChange }), jsx(Button, { type: "button", variant: "ghost", icon: true, size: "sm", className: S.attachButton, "aria-label": "Attach file", disabled: disabled, onClick: e => {
-                                    e.preventDefault();
-                                    fileInputRef.current?.click();
-                                }, children: jsx(PaperclipIcon, { size: 16 }) })] })) : null, jsx(Input, { ref: inputRef, type: "textarea", rows: 1, value: message, onChange: e => setMessage(e.target.value), placeholder: placeholder || 'Type a message...', className: cn(S.input) }), jsx("div", { className: S.submitColumn, children: jsx(Button, { type: "submit", size: "sm", disabled: disabled || (!message.trim() && attachments.length === 0), children: jsx(SendHorizontalIcon, { size: 16 }) }) })] }), footer] }));
+    const emitSubmitAndClear = useCallback(() => {
+        if (!editor)
+            return;
+        if (!trimmedMessage && attachmentsCount === 0)
+            return;
+        const msg = trimmedMessage;
+        resetAfterSend();
+        onSubmit(msg, attachmentsCount > 0 ? attachments : undefined);
+    }, [
+        attachments,
+        attachmentsCount,
+        editor,
+        onSubmit,
+        resetAfterSend,
+        trimmedMessage,
+    ]);
+    emitSubmitRef.current = emitSubmitAndClear;
+    const handleSubmitForm = useCallback((e) => {
+        e?.preventDefault();
+        emitSubmitAndClear();
+    }, [emitSubmitAndClear]);
+    if (!editor) {
+        return null;
+    }
+    return (jsxs("form", { onSubmit: handleSubmitForm, className: cn(S.root, className), children: [jsx(ChatPromptAttachments, { attachments: attachments, onRemove: index => onRemoveAttachment?.(index), disabled: disabled }), jsx(ChatPromptComposer, { editor: editor, disabled: disabled, trimmedMessage: trimmedMessage, attachments: attachments, attachmentAccept: attachmentAccept, onAttachmentFiles: onAttachmentFiles, onComposerKeyDown: handleComposerKeyDown }), footer] }));
 }
 
 export { ChatPrompt };

package/dist/esm/components/ui/Chat/ChatPrompt/ChatPrompt.styl.js

@@ -1,7 +1,7 @@
 import styleInject from 'style-inject';
 
-var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatPrompt_root__5G5bq{align-items:stretch;display:flex;flex-direction:column;gap:var(--p-2);padding:var(--p-6);padding-top:var(--p-5);position:relative}.ChatPrompt_composer__H3c3N{align-items:flex-end;display:flex;flex-direction:row;gap:var(--p-3);position:relative;width:100%}.ChatPrompt_fileInput__xdgPn{display:none}.ChatPrompt_attachButton__gi-qF{align-self:flex-end;flex-shrink:0}.ChatPrompt_input__QPKBV{border:none;border-radius:0!important;flex:1;max-height:200px;min-height:40px;min-width:0;overflow-y:auto;padding:var(--p-2) 0 0!important;resize:none}.ChatPrompt_input__QPKBV,.ChatPrompt_input__QPKBV:focus{box-shadow:none!important}.ChatPrompt_submitColumn__0rY1R{align-items:center;display:flex;flex-direction:column;flex-shrink:0;justify-content:flex-end}.ChatPrompt_submitColumn__0rY1R>button:focus{box-shadow:0 0 0 2px var(--brand-color-500)!important}.ChatPrompt_submitColumn__0rY1R>button:first-child{border:none;position:relative;transition:all .2s}.ChatPrompt_submitColumn__0rY1R>button:first-child:focus{transform:scale(1.2)}.ChatPrompt_submitColumn__0rY1R>button:first-child:before{bottom:-100%;content:\"\";left:-100%;position:absolute;right:-100%;top:-100%}.ChatPrompt_attachments__KG-fG{display:flex;flex-wrap:wrap;gap:var(--p-2);margin-bottom:var(--p-2)}.ChatPrompt_attachmentItem__QJk7J{flex:1 1 300px;max-width:300px;min-width:0}";
-var S = {"root":"ChatPrompt_root__5G5bq","composer":"ChatPrompt_composer__H3c3N","fileInput":"ChatPrompt_fileInput__xdgPn","attachButton":"ChatPrompt_attachButton__gi-qF","input":"ChatPrompt_input__QPKBV","submitColumn":"ChatPrompt_submitColumn__0rY1R","attachments":"ChatPrompt_attachments__KG-fG","attachmentItem":"ChatPrompt_attachmentItem__QJk7J"};
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatPrompt_root__5G5bq{align-items:stretch;display:flex;flex-direction:column;gap:var(--p-2);padding:var(--p-6);padding-top:var(--p-5);position:relative}.ChatPrompt_composer__H3c3N{align-items:flex-end;display:flex;flex-direction:row;gap:var(--p-3);position:relative;width:100%}.ChatPrompt_fileInput__xdgPn{display:none}.ChatPrompt_attachButton__gi-qF{align-self:flex-end;flex-shrink:0}.ChatPrompt_editorWrap__Q7gat{align-self:stretch;flex:1;min-width:0}.ChatPrompt_editorMount__Phh4D{background:transparent;border:none;border-radius:0!important;box-shadow:none!important;display:flex;flex:1;flex-direction:column;max-height:200px;min-height:40px;min-width:0;padding:0!important}.ChatPrompt_editorMount__Phh4D:focus-within{box-shadow:none!important}.ChatPrompt_editorMount__Phh4D .ProseMirror{border:none!important;box-shadow:none!important;flex:1;margin:0;max-height:200px!important;min-height:40px!important;outline:none!important;overflow-x:hidden!important;overflow-y:auto!important;padding:var(--p-2) 0 0!important;resize:none!important;white-space:pre-wrap;word-break:break-word}.ChatPrompt_editorMount__Phh4D .ProseMirror p.is-empty:before{color:var(--muted-foreground);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.ChatPrompt_submitColumn__0rY1R{align-items:center;display:flex;flex-direction:column;flex-shrink:0;justify-content:flex-end}.ChatPrompt_submitColumn__0rY1R>button:focus{box-shadow:0 0 0 2px var(--brand-color-500)!important}.ChatPrompt_submitColumn__0rY1R>button:first-child{border:none;position:relative;transition:all .2s}.ChatPrompt_submitColumn__0rY1R>button:first-child:focus{transform:scale(1.2)}.ChatPrompt_submitColumn__0rY1R>button:first-child:before{bottom:-100%;content:\"\";left:-100%;position:absolute;right:-100%;top:-100%}.ChatPrompt_attachments__KG-fG{display:flex;flex-wrap:wrap;gap:var(--p-2);margin-bottom:var(--p-2)}.ChatPrompt_attachmentItem__QJk7J{flex:1 1 300px;max-width:300px;min-width:0}";
+var S = {"root":"ChatPrompt_root__5G5bq","composer":"ChatPrompt_composer__H3c3N","fileInput":"ChatPrompt_fileInput__xdgPn","attachButton":"ChatPrompt_attachButton__gi-qF","editorWrap":"ChatPrompt_editorWrap__Q7gat","editorMount":"ChatPrompt_editorMount__Phh4D","submitColumn":"ChatPrompt_submitColumn__0rY1R","attachments":"ChatPrompt_attachments__KG-fG","attachmentItem":"ChatPrompt_attachmentItem__QJk7J"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/components/ui/Chat/ChatPrompt/ChatPromptComposer.js

@@ -0,0 +1,25 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useRef, useCallback } from 'react';
+import { EditorContent } from '@tiptap/react';
+import { PaperclipIcon, SendHorizontalIcon } from 'lucide-react';
+import { Button } from '../../Button/Button.js';
+import S from './ChatPrompt.styl.js';
+
+function ChatPromptComposer({ editor, disabled, trimmedMessage, attachments, attachmentAccept, onAttachmentFiles, onComposerKeyDown, }) {
+    const fileInputRef = useRef(null);
+    const showAttachButton = Boolean(attachmentAccept && onAttachmentFiles);
+    const handleFileInputChange = useCallback((e) => {
+        const files = Array.from(e.target.files ?? []);
+        e.target.value = '';
+        if (files.length > 0) {
+            onAttachmentFiles?.(files);
+        }
+    }, [onAttachmentFiles]);
+    const canSubmit = Boolean(trimmedMessage || attachments.length > 0);
+    return (jsxs("div", { className: S.composer, children: [showAttachButton ? (jsxs(Fragment, { children: [jsx("input", { ref: fileInputRef, type: "file", accept: attachmentAccept, multiple: true, className: S.fileInput, disabled: disabled, onChange: handleFileInputChange }), jsx(Button, { type: "button", variant: "ghost", icon: true, size: "sm", className: S.attachButton, "aria-label": "Attach file", disabled: disabled, onClick: e => {
+                            e.preventDefault();
+                            fileInputRef.current?.click();
+                        }, children: jsx(PaperclipIcon, { size: 16 }) })] })) : null, jsx("div", { className: S.editorWrap, onKeyDown: onComposerKeyDown, children: jsx(EditorContent, { editor: editor, className: S.editorMount }) }), jsx("div", { className: S.submitColumn, children: jsx(Button, { type: "submit", size: "sm", disabled: disabled || !canSubmit, children: jsx(SendHorizontalIcon, { size: 16 }) }) })] }));
+}
+
+export { ChatPromptComposer };

package/dist/esm/components/ui/Chat/ChatPrompt/chatPromptDoc.js

@@ -0,0 +1,17 @@
+const CHAT_PROMPT_EMPTY_DOC = {
+    type: 'doc',
+    content: [{ type: 'paragraph' }],
+};
+function chatPromptParagraphDoc(text) {
+    return {
+        type: 'doc',
+        content: [
+            {
+                type: 'paragraph',
+                content: text ? [{ type: 'text', text }] : [],
+            },
+        ],
+    };
+}
+
+export { CHAT_PROMPT_EMPTY_DOC, chatPromptParagraphDoc };

package/dist/esm/components/ui/Chat/ChatPrompt/useChatPromptEditor.js

@@ -0,0 +1,163 @@
+import { useRef, useCallback, useMemo, useState, useEffect, useLayoutEffect } from 'react';
+import { DEFAULT_CHAT_SLASH_ITEMS } from '../../../../tiptap/slash-mention/defaultChatSlashItems.js';
+import { createSlashMentionExtension } from '../../../../tiptap/slash-mention/createSlashMentionExtension.js';
+import { Placeholder } from '@tiptap/extensions';
+import { useEditor } from '@tiptap/react';
+import StarterKit from '@tiptap/starter-kit';
+import { chatPromptSafeEditorDom, syncChatPromptComposerHeight } from './ChatPrompt.helpers.js';
+import { CHAT_PROMPT_EMPTY_DOC, chatPromptParagraphDoc } from './chatPromptDoc.js';
+
+function useChatPromptEditor({ disabled, placeholder, slashCommandItems, prefillMessage, attachmentsCount = 0, onEnterSubmit, }) {
+    const slashOpenRef = useRef(false);
+    const suggestionActiveUpdater = useCallback((active) => {
+        slashOpenRef.current = active;
+    }, []);
+    const slashFinger = JSON.stringify(slashCommandItems ?? null);
+    const slashItemsStable = useMemo(() => {
+        return slashCommandItems ?? DEFAULT_CHAT_SLASH_ITEMS;
+    }, [slashCommandItems, slashFinger]);
+    const placeholderText = useMemo(() => {
+        if (placeholder === undefined || placeholder === null) {
+            return 'Type a message…';
+        }
+        const t = String(placeholder).trim();
+        return t === '' ? 'Type a message…' : t;
+    }, [placeholder]);
+    const ariaLabelComposer = useMemo(() => {
+        if (placeholder === undefined || placeholder === null)
+            return 'Message';
+        const t = String(placeholder).trim();
+        return t === '' ? 'Message' : t;
+    }, [placeholder]);
+    const extensions = useMemo(() => {
+        const exts = [
+            StarterKit.configure({
+                heading: false,
+                bulletList: false,
+                orderedList: false,
+                blockquote: false,
+                codeBlock: false,
+                horizontalRule: false,
+            }),
+            Placeholder.configure({
+                placeholder: placeholderText,
+                showOnlyWhenEditable: true,
+                showOnlyCurrent: false,
+            }),
+        ];
+        if (slashItemsStable.length > 0) {
+            exts.push(createSlashMentionExtension({
+                items: slashItemsStable,
+                onSuggestionUiActiveChange: suggestionActiveUpdater,
+            }));
+        }
+        return exts;
+    }, [slashItemsStable, placeholderText, suggestionActiveUpdater]);
+    const [plainDraft, setPlainDraft] = useState('');
+    const editorDomRef = useRef(null);
+    const bindEditorDom = useCallback(({ editor }) => {
+        setPlainDraft(editor.getText());
+        queueMicrotask(() => {
+            const dom = chatPromptSafeEditorDom(editor);
+            if (!dom)
+                return;
+            editorDomRef.current = dom;
+            syncChatPromptComposerHeight(dom, editor.getText());
+        });
+    }, []);
+    const trimmedMessage = plainDraft.trim();
+    const editor = useEditor({
+        extensions,
+        content: CHAT_PROMPT_EMPTY_DOC,
+        editable: !disabled,
+        immediatelyRender: true,
+        editorProps: {
+            attributes: {
+                spellcheck: 'true',
+                'aria-label': ariaLabelComposer,
+            },
+        },
+        onTransaction: ({ editor: ed }) => {
+            const dom = chatPromptSafeEditorDom(ed);
+            if (dom) {
+                syncChatPromptComposerHeight(dom, ed.getText());
+            }
+            setPlainDraft(ed.getText());
+        },
+        onCreate: bindEditorDom,
+    }, [extensions, disabled, bindEditorDom, ariaLabelComposer]);
+    useEffect(() => {
+        if (!editor)
+            return;
+        editor.setEditable(!disabled);
+    }, [editor, disabled]);
+    useEffect(() => {
+        if (!editor)
+            return;
+        const bind = () => {
+            editorDomRef.current = chatPromptSafeEditorDom(editor);
+        };
+        bind();
+        let rafId = null;
+        if (typeof window !== 'undefined') {
+            rafId = window.requestAnimationFrame(bind);
+        }
+        return () => {
+            if (rafId != null)
+                cancelAnimationFrame(rafId);
+        };
+    }, [editor]);
+    useEffect(() => {
+        if (!editor || prefillMessage == null || prefillMessage === '')
+            return;
+        editor.commands.setContent(chatPromptParagraphDoc(prefillMessage));
+        const t = editor.getText();
+        setPlainDraft(t);
+        queueMicrotask(() => {
+            const dom = chatPromptSafeEditorDom(editor);
+            if (dom)
+                syncChatPromptComposerHeight(dom, t);
+        });
+    }, [editor, prefillMessage]);
+    useLayoutEffect(() => {
+        if (!editor)
+            return;
+        const dom = chatPromptSafeEditorDom(editor);
+        if (!dom)
+            return;
+        syncChatPromptComposerHeight(dom, plainDraft);
+    }, [editor, plainDraft]);
+    const onEnterSubmitRef = useRef(onEnterSubmit);
+    onEnterSubmitRef.current = onEnterSubmit;
+    const resetAfterSend = useCallback(() => {
+        if (!editor)
+            return;
+        editor.commands.clearContent();
+        queueMicrotask(() => {
+            const dom = chatPromptSafeEditorDom(editor);
+            if (dom)
+                syncChatPromptComposerHeight(dom, '');
+        });
+        setPlainDraft('');
+    }, [editor]);
+    const handleComposerKeyDown = useCallback((e) => {
+        if (!(e.key === 'Enter' && !e.shiftKey && !e.metaKey && !e.ctrlKey))
+            return;
+        if (!editorDomRef.current?.contains(e.target))
+            return;
+        if (slashOpenRef.current)
+            return;
+        if (!trimmedMessage && attachmentsCount === 0)
+            return;
+        e.preventDefault();
+        onEnterSubmitRef.current();
+    }, [attachmentsCount, trimmedMessage]);
+    return {
+        editor,
+        trimmedMessage,
+        resetAfterSend,
+        handleComposerKeyDown,
+    };
+}
+
+export { useChatPromptEditor };

package/dist/esm/components/ui/Tooltip/Tooltip.styl.js

@@ -1,6 +1,6 @@
 import styleInject from 'style-inject';
 
-var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.Tooltip_tooltipContent__b3pS-{backdrop-filter:blur(10px);background-color:var(--popover);border:1px solid var(--border);border-radius:var(--p-3);box-shadow:0 10px 15px -3px rgba(0,0,0,.1);color:var(--popover-foreground);font-size:12px;padding:6px 12px;text-wrap:balance;transform-origin:var(--radix-tooltip-content-transform-origin);width:-moz-fit-content;width:fit-content;word-break:break-word;z-index:50}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open],.Tooltip_tooltipContent__b3pS-[data-state=instant-open],.Tooltip_tooltipContent__b3pS-[data-state=open]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=closed]{animation:Tooltip_fade-out__UOBET .1s ease-in,Tooltip_zoom-out__fodOk .1s ease-in}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open][data-side=bottom],.Tooltip_tooltipContent__b3pS-[data-state=instant-open][data-side=bottom],.Tooltip_tooltipContent__b3pS-[data-state=open][data-side=bottom]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out,Tooltip_slide-in-from-top-2__8uuS- .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open][data-side=left],.Tooltip_tooltipContent__b3pS-[data-state=instant-open][data-side=left],.Tooltip_tooltipContent__b3pS-[data-state=open][data-side=left]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out,Tooltip_slide-in-from-right-2__Uu79F .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open][data-side=right],.Tooltip_tooltipContent__b3pS-[data-state=instant-open][data-side=right],.Tooltip_tooltipContent__b3pS-[data-state=open][data-side=right]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out,Tooltip_slide-in-from-left-2__23kHm .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open][data-side=top],.Tooltip_tooltipContent__b3pS-[data-state=instant-open][data-side=top],.Tooltip_tooltipContent__b3pS-[data-state=open][data-side=top]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out,Tooltip_slide-in-from-bottom-2__O-Aa8 .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=closed][data-side=bottom],.Tooltip_tooltipContent__b3pS-[data-state=closed][data-side=left],.Tooltip_tooltipContent__b3pS-[data-state=closed][data-side=right],.Tooltip_tooltipContent__b3pS-[data-state=closed][data-side=top]{animation:Tooltip_fade-out__UOBET .1s ease-in,Tooltip_zoom-out__fodOk .1s ease-in}.Tooltip_tooltipContent__b3pS-.Tooltip_tooltipContentOverTrigger__VQAU3[data-state=delayed-open],.Tooltip_tooltipContent__b3pS-.Tooltip_tooltipContentOverTrigger__VQAU3[data-state=instant-open],.Tooltip_tooltipContent__b3pS-.Tooltip_tooltipContentOverTrigger__VQAU3[data-state=open]{animation:Tooltip_fade-in__ZQqZv .15s ease-out}.Tooltip_tooltipContent__b3pS-.Tooltip_tooltipContentOverTrigger__VQAU3[data-state=closed]{animation:Tooltip_fade-out__UOBET .1s ease-in}.Tooltip_tooltipContentOverTrigger__VQAU3{box-sizing:border-box;height:auto}.Tooltip_tooltipArrow__87DVL{background-color:var(--popover);border-bottom:1px solid var(--border);border-left-width:1px;border-left:0 solid var(--border);border-radius:2px;border-right:1px solid var(--border);border-top-width:1px;border-top:0 solid var(--border);fill:var(--popover);height:10px;transform:translateY(calc(-50% + .5px)) rotate(45deg);width:10px;z-index:50}@keyframes Tooltip_fade-in__ZQqZv{0%{opacity:0}to{opacity:1}}@keyframes Tooltip_fade-out__UOBET{0%{opacity:1}to{opacity:0}}@keyframes Tooltip_zoom-in__SbWQb{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes Tooltip_zoom-out__fodOk{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes Tooltip_slide-in-from-top-2__8uuS-{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes Tooltip_slide-in-from-right-2__Uu79F{0%{opacity:0;transform:translateX(.5rem)}to{opacity:1;transform:translateX(0)}}@keyframes Tooltip_slide-in-from-left-2__23kHm{0%{opacity:0;transform:translateX(-.5rem)}to{opacity:1;transform:translateX(0)}}@keyframes Tooltip_slide-in-from-bottom-2__O-Aa8{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}";
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.Tooltip_tooltipContent__b3pS-{backdrop-filter:blur(10px);background-color:var(--popover);border:1px solid var(--border);border-radius:var(--p-3);box-shadow:0 10px 15px -3px rgba(0,0,0,.1);color:var(--popover-foreground);font-size:12px;min-width:100%;padding:6px 12px;text-wrap:balance;transform-origin:var(--radix-tooltip-content-transform-origin);width:-moz-fit-content;width:fit-content;word-break:break-word;z-index:50}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open],.Tooltip_tooltipContent__b3pS-[data-state=instant-open],.Tooltip_tooltipContent__b3pS-[data-state=open]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=closed]{animation:Tooltip_fade-out__UOBET .1s ease-in,Tooltip_zoom-out__fodOk .1s ease-in}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open][data-side=bottom],.Tooltip_tooltipContent__b3pS-[data-state=instant-open][data-side=bottom],.Tooltip_tooltipContent__b3pS-[data-state=open][data-side=bottom]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out,Tooltip_slide-in-from-top-2__8uuS- .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open][data-side=left],.Tooltip_tooltipContent__b3pS-[data-state=instant-open][data-side=left],.Tooltip_tooltipContent__b3pS-[data-state=open][data-side=left]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out,Tooltip_slide-in-from-right-2__Uu79F .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open][data-side=right],.Tooltip_tooltipContent__b3pS-[data-state=instant-open][data-side=right],.Tooltip_tooltipContent__b3pS-[data-state=open][data-side=right]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out,Tooltip_slide-in-from-left-2__23kHm .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=delayed-open][data-side=top],.Tooltip_tooltipContent__b3pS-[data-state=instant-open][data-side=top],.Tooltip_tooltipContent__b3pS-[data-state=open][data-side=top]{animation:Tooltip_fade-in__ZQqZv .15s ease-out,Tooltip_zoom-in__SbWQb .15s ease-out,Tooltip_slide-in-from-bottom-2__O-Aa8 .15s ease-out}.Tooltip_tooltipContent__b3pS-[data-state=closed][data-side=bottom],.Tooltip_tooltipContent__b3pS-[data-state=closed][data-side=left],.Tooltip_tooltipContent__b3pS-[data-state=closed][data-side=right],.Tooltip_tooltipContent__b3pS-[data-state=closed][data-side=top]{animation:Tooltip_fade-out__UOBET .1s ease-in,Tooltip_zoom-out__fodOk .1s ease-in}.Tooltip_tooltipContent__b3pS-.Tooltip_tooltipContentOverTrigger__VQAU3[data-state=delayed-open],.Tooltip_tooltipContent__b3pS-.Tooltip_tooltipContentOverTrigger__VQAU3[data-state=instant-open],.Tooltip_tooltipContent__b3pS-.Tooltip_tooltipContentOverTrigger__VQAU3[data-state=open]{animation:Tooltip_fade-in__ZQqZv .15s ease-out}.Tooltip_tooltipContent__b3pS-.Tooltip_tooltipContentOverTrigger__VQAU3[data-state=closed]{animation:Tooltip_fade-out__UOBET .1s ease-in}.Tooltip_tooltipContentOverTrigger__VQAU3{box-sizing:border-box;height:auto}.Tooltip_tooltipArrow__87DVL{background-color:var(--popover);border-bottom:1px solid var(--border);border-left-width:1px;border-left:0 solid var(--border);border-radius:2px;border-right:1px solid var(--border);border-top-width:1px;border-top:0 solid var(--border);fill:var(--popover);height:10px;transform:translateY(calc(-50% + .5px)) rotate(45deg);width:10px;z-index:50}@keyframes Tooltip_fade-in__ZQqZv{0%{opacity:0}to{opacity:1}}@keyframes Tooltip_fade-out__UOBET{0%{opacity:1}to{opacity:0}}@keyframes Tooltip_zoom-in__SbWQb{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes Tooltip_zoom-out__fodOk{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes Tooltip_slide-in-from-top-2__8uuS-{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes Tooltip_slide-in-from-right-2__Uu79F{0%{opacity:0;transform:translateX(.5rem)}to{opacity:1;transform:translateX(0)}}@keyframes Tooltip_slide-in-from-left-2__23kHm{0%{opacity:0;transform:translateX(-.5rem)}to{opacity:1;transform:translateX(0)}}@keyframes Tooltip_slide-in-from-bottom-2__O-Aa8{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}";
 var S = {"tooltipContent":"Tooltip_tooltipContent__b3pS-","fade-in":"Tooltip_fade-in__ZQqZv","zoom-in":"Tooltip_zoom-in__SbWQb","fade-out":"Tooltip_fade-out__UOBET","zoom-out":"Tooltip_zoom-out__fodOk","slide-in-from-top-2":"Tooltip_slide-in-from-top-2__8uuS-","slide-in-from-right-2":"Tooltip_slide-in-from-right-2__Uu79F","slide-in-from-left-2":"Tooltip_slide-in-from-left-2__23kHm","slide-in-from-bottom-2":"Tooltip_slide-in-from-bottom-2__O-Aa8","tooltipContentOverTrigger":"Tooltip_tooltipContentOverTrigger__VQAU3","tooltipArrow":"Tooltip_tooltipArrow__87DVL"};
 styleInject(css_248z);
 

package/dist/esm/index.js

@@ -7,6 +7,8 @@ export { SybilionAuthProvider, createSybilionApiFetch, getSybilionApiOriginFromS
 export { SYBILION_AUTH_LOGIN_PATH, normalizeApiBaseUrl } from './sybilion-auth/authPaths.js';
 export { exchangeAuth0AccessTokenForSybilionJwt } from './sybilion-auth/exchangeSybilionToken.js';
 export { ChatContext, ChatProvider, isChatEmpty, outboundPendingKey, useChat, useChatOutboundPending, useChats, useChatsForDataset, useChatsForScopeId, useCurrentChat, useIsChatLoading, useSyncChatPanelBusy } from './contexts/chat-context.js';
+export { DEFAULT_CHAT_SLASH_ITEMS, filterSlashItems } from './tiptap/slash-mention/defaultChatSlashItems.js';
+export { createSlashMentionExtension, slashMentionSuggestionRender } from './tiptap/slash-mention/createSlashMentionExtension.js';
 export { AnalysesSelector } from './components/ui/AnalysesSelector/AnalysesSelector.js';
 export { AnalysisLineIcon } from './components/ui/AnalysisLineIcon/AnalysisLineIcon.js';
 export { AppHeaderHost, AppHeaderPortal } from './components/ui/AppHeader/AppHeader.js';

package/dist/esm/tiptap/slash-mention/SlashSuggestionList.js

@@ -0,0 +1,53 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import cn from 'classnames';
+import { useState, useEffect, useCallback, useImperativeHandle } from 'react';
+import S from './SlashSuggestionList.styl.js';
+
+function SlashSuggestionListInner({ items, command, listHandleRef, }) {
+    const [selected, setSelected] = useState(0);
+    useEffect(() => {
+        setSelected(s => Math.min(s, Math.max(items.length - 1, 0)));
+    }, [items.length]);
+    const safeSel = Math.min(selected, Math.max(items.length - 1, 0));
+    const onPick = useCallback((index) => {
+        const item = items[index];
+        if (!item)
+            return;
+        command(item);
+    }, [command, items]);
+    const onKeyboardEvent = useCallback((event) => {
+        if (items.length === 0)
+            return false;
+        if (event.key === 'ArrowDown') {
+            event.preventDefault();
+            setSelected(s => Math.min(s + 1, items.length - 1));
+            return true;
+        }
+        if (event.key === 'ArrowUp') {
+            event.preventDefault();
+            setSelected(s => Math.max(s - 1, 0));
+            return true;
+        }
+        if (event.key === 'Enter') {
+            event.preventDefault();
+            const max = Math.max(items.length - 1, 0);
+            const idx = Math.min(selected, max);
+            const item = items[idx];
+            if (item)
+                command(item);
+            return true;
+        }
+        return false;
+    }, [command, items, selected]);
+    useImperativeHandle(listHandleRef, () => ({ onKeyboardEvent }), [
+        onKeyboardEvent,
+    ]);
+    return (jsx("div", { className: S.root, role: "listbox", "aria-label": "Slash commands", children: items.map((item, idx) => (jsxs("button", { type: "button", role: "option", "aria-selected": idx === safeSel, className: cn(S.item, idx === safeSel && S.itemHighlighted), onMouseDown: e => e.preventDefault(), onMouseEnter: () => setSelected(idx), onClick: () => onPick(idx), children: [jsxs("span", { className: S.itemLabel, children: ["/", item.label] }), item.description ? (jsx("span", { className: S.itemDesc, children: item.description })) : null] }, `${item.id}-${idx}`))) }));
+}
+function SlashSuggestionList(props) {
+    if (props.items.length === 0)
+        return null;
+    return (jsx(SlashSuggestionListInner, { items: props.items, command: props.command, listHandleRef: props.listHandleRef }));
+}
+
+export { SlashSuggestionList };

package/dist/esm/tiptap/slash-mention/SlashSuggestionList.styl.js

@@ -0,0 +1,7 @@
+import styleInject from 'style-inject';
+
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.SlashSuggestionList_root__9KCb1{background:var(--popover,var(--card));border:1px solid var(--border);border-radius:8px;border-radius:var(--radius-lg,8px);box-shadow:0 8px 24px rgba(0,0,0,.12);color:var(--foreground);display:flex;flex-direction:column;font-size:var(--text-sm);list-style:none;margin:0;max-height:40vh;max-width:90vw;min-width:220px;overflow-y:auto;padding:var(--p-1)}.dark .SlashSuggestionList_root__9KCb1{box-shadow:0 8px 24px rgba(0,0,0,.5)}.SlashSuggestionList_item__9JBeY{align-items:flex-start;background:transparent;border:none;border-radius:6px;border-radius:var(--radius-md,6px);color:inherit;cursor:pointer;display:flex;flex-direction:column;margin:0;padding:var(--p-1) var(--p-2);text-align:left;width:100%}.SlashSuggestionList_itemHighlighted__cStZr,.SlashSuggestionList_item__9JBeY:hover{background:var(--muted)}.SlashSuggestionList_itemLabel__OMaov{font-weight:600}.SlashSuggestionList_itemDesc__fAdcA{color:var(--muted-foreground);font-size:var(--text-xs)}";
+var S = {"root":"SlashSuggestionList_root__9KCb1","item":"SlashSuggestionList_item__9JBeY","itemHighlighted":"SlashSuggestionList_itemHighlighted__cStZr","itemLabel":"SlashSuggestionList_itemLabel__OMaov","itemDesc":"SlashSuggestionList_itemDesc__fAdcA"};
+styleInject(css_248z);
+
+export { S as default };

package/dist/esm/tiptap/slash-mention/createSlashMentionExtension.js

@@ -0,0 +1,151 @@
+import { mergeAttributes } from '@tiptap/core';
+import Mention from '@tiptap/extension-mention';
+import { ReactRenderer } from '@tiptap/react';
+import { SlashSuggestionList } from './SlashSuggestionList.js';
+import { filterSlashItems } from './defaultChatSlashItems.js';
+
+function slashMentionSuggestionRender(uiRef) {
+    let popup = null;
+    const place = (props) => {
+        if (!popup?.element)
+            return;
+        const rect = props.clientRect?.();
+        if (!rect)
+            return;
+        const el = popup.element;
+        el.style.left = `${rect.left}px`;
+        el.style.top = `${rect.bottom + 4}px`;
+    };
+    return {
+        onStart: props => {
+            uiRef.current = null;
+            popup?.destroy?.();
+            popup = new ReactRenderer(SlashSuggestionList, {
+                editor: props.editor,
+                props: {
+                    items: props.items,
+                    command: props.command,
+                    listHandleRef: uiRef,
+                },
+            });
+            popup.element.style.position = 'fixed';
+            popup.element.style.margin = '0';
+            popup.element.style.zIndex = '10002';
+            document.body.append(popup.element);
+            place(props);
+        },
+        onUpdate: props => {
+            if (!popup)
+                return;
+            popup.updateProps({
+                items: props.items,
+                command: props.command,
+                listHandleRef: uiRef,
+            });
+            place(props);
+        },
+        onExit: () => {
+            popup?.destroy();
+            popup?.element?.remove?.();
+            popup = null;
+            uiRef.current = null;
+        },
+        onKeyDown: ({ event }) => uiRef.current?.onKeyboardEvent(event) ?? false,
+    };
+}
+function insertDefaultMention(editor, range, props, slashChar) {
+    const nodeAfter = editor.view.state.selection.$to.nodeAfter;
+    const extend = nodeAfter?.text?.startsWith(' ') ? 1 : 0;
+    const adjusted = extend ? { ...range, to: range.to + extend } : range;
+    editor
+        .chain()
+        .focus()
+        .insertContentAt(adjusted, [
+        {
+            type: 'mention',
+            attrs: {
+                id: props.id,
+                label: props.label,
+                mentionSuggestionChar: slashChar,
+            },
+        },
+        { type: 'text', text: ' ' },
+    ])
+        .run();
+    queueMicrotask(() => {
+        editor.view.dom.ownerDocument?.defaultView
+            ?.getSelection?.()
+            ?.collapseToEnd();
+    });
+}
+function allowSlashTrigger({ state, range, }) {
+    const type = state.schema.nodes['mention'];
+    const $from = state.doc.resolve(range.from);
+    if (!type || !$from.parent.type.contentMatch.matchType(type))
+        return false;
+    if ($from.parentOffset === 0)
+        return true;
+    const before = state.doc.textBetween(range.from - 1, range.from);
+    return /\s/.test(before);
+}
+function createSlashMentionExtension({ items: resolvedItems, slashChar = '/', pluginKey, onItemCommand, onSuggestionUiActiveChange, }) {
+    const uiRef = {
+        current: null,
+    };
+    return Mention.configure({
+        renderText({ node }) {
+            return `/${node.attrs.id}`;
+        },
+        renderHTML({ options, node, suggestion }) {
+            const suggestionChar = suggestion?.char ?? slashChar;
+            const id = typeof node.attrs.id === 'string'
+                ? node.attrs.id
+                : String(node.attrs.id ?? '');
+            return [
+                'span',
+                mergeAttributes({
+                    'data-type': 'mention',
+                    'data-slash-command': id,
+                    class: 'slash-mention',
+                }, options.HTMLAttributes),
+                `${suggestionChar}${id}`,
+            ];
+        },
+        suggestion: {
+            char: slashChar,
+            pluginKey,
+            allowedPrefixes: [' ', '\n', '\t', '\r'],
+            allow: props => allowSlashTrigger(props),
+            items: ({ query }) => Promise.resolve(filterSlashItems(resolvedItems, query)),
+            command: ({ editor, range, props }) => {
+                const item = props;
+                if (onItemCommand?.({ editor, range, item }) === true) {
+                    queueMicrotask(() => {
+                        editor.view.dom.ownerDocument?.defaultView
+                            ?.getSelection?.()
+                            ?.collapseToEnd();
+                    });
+                    return null;
+                }
+                insertDefaultMention(editor, range, item, slashChar);
+                return null;
+            },
+            render: () => {
+                const menu = slashMentionSuggestionRender(uiRef);
+                return {
+                    ...menu,
+                    onStart: props => {
+                        onSuggestionUiActiveChange?.(true);
+                        menu.onStart?.(props);
+                    },
+                    onExit: props => {
+                        menu.onExit?.(props);
+                        onSuggestionUiActiveChange?.(false);
+                    },
+                };
+            },
+        },
+    });
+}
+
+export { createSlashMentionExtension, slashMentionSuggestionRender };