reactjs-tiptap-editor 0.4.2 → 1.0.0

package/lib/Mention.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("./dom-dataset-_6-diIRQ.cjs"),c=require("./index-DF2Lp4HZ.cjs"),p=require("./index-DpCrt7xs.cjs"),g=require("react/jsx-runtime"),m=require("react"),y=require("scroll-into-view-if-needed");function v({editor:e,overrideSuggestionOptions:r,extensionName:n,char:t="@"}){const i=new c.PluginKey;return{editor:e,char:t,pluginKey:i,command:({editor:o,range:a,props:d})=>{var u,s,l;const f=o.view.state.selection.$to.nodeAfter;((u=f==null?void 0:f.text)==null?void 0:u.startsWith(" "))&&(a.to+=1),o.chain().focus().insertContentAt(a,[{type:n,attrs:{...d,mentionSuggestionChar:t}},{type:"text",text:" "}]).run(),(l=(s=o.view.dom.ownerDocument.defaultView)==null?void 0:s.getSelection())==null||l.collapseToEnd()},allow:({state:o,range:a})=>{const d=o.doc.resolve(a.from),u=o.schema.nodes[n];return!!d.parent.type.contentMatch.matchType(u)},...r}}function b(e){return(e.options.suggestions.length?e.options.suggestions:[e.options.suggestion]).map(r=>v({editor:e.editor,overrideSuggestionOptions:r,extensionName:e.name,char:r.char}))}function x(e,r){const n=b(e),t=n.find(i=>i.char===r);return t||(n.length?n[0]:null)}var w=c.Node3.create({name:"mention",priority:101,addOptions(){return{HTMLAttributes:{},renderText({node:e,suggestion:r}){var n,t;return`${(n=r==null?void 0:r.char)!=null?n:"@"}${(t=e.attrs.label)!=null?t:e.attrs.id}`},deleteTriggerWithBackspace:!1,renderHTML({options:e,node:r,suggestion:n}){var t,i;return["span",c.mergeAttributes(this.HTMLAttributes,e.HTMLAttributes),`${(t=n==null?void 0:n.char)!=null?t:"@"}${(i=r.attrs.label)!=null?i:r.attrs.id}`]},suggestions:[],suggestion:{}}},group:"inline",inline:!0,selectable:!1,atom:!0,addAttributes(){return{id:{default:null,parseHTML:e=>e.getAttribute("data-id"),renderHTML:e=>e.id?{"data-id":e.id}:{}},label:{default:null,parseHTML:e=>e.getAttribute("data-label"),renderHTML:e=>e.label?{"data-label":e.label}:{}},mentionSuggestionChar:{default:"@",parseHTML:e=>e.getAttribute("data-mention-suggestion-char"),renderHTML:e=>({"data-mention-suggestion-char":e.mentionSuggestionChar})}}},parseHTML(){return[{tag:`span[data-type="${this.name}"]`}]},renderHTML({node:e,HTMLAttributes:r}){const n=x(this,e.attrs.mentionSuggestionChar);if(this.options.renderLabel!==void 0)return console.warn("renderLabel is deprecated use renderText and renderHTML instead"),["span",c.mergeAttributes({"data-type":this.name},this.options.HTMLAttributes,r),this.options.renderLabel({options:this.options,node:e,suggestion:n})];const t={...this.options};t.HTMLAttributes=c.mergeAttributes({"data-type":this.name},this.options.HTMLAttributes,r);const i=this.options.renderHTML({options:t,node:e,suggestion:n});return typeof i=="string"?["span",c.mergeAttributes({"data-type":this.name},this.options.HTMLAttributes,r),i]:i},...c.createInlineMarkdownSpec({nodeName:"mention",name:"@",selfClosing:!0,allowedAttributes:["id","label"]}),renderText({node:e}){const r={options:this.options,node:e,suggestion:x(this,e.attrs.mentionSuggestionChar)};return this.options.renderLabel!==void 0?(console.warn("renderLabel is deprecated use renderText and renderHTML instead"),this.options.renderLabel(r)):this.options.renderText(r)},addKeyboardShortcuts(){return{Backspace:()=>this.editor.commands.command(({tr:e,state:r})=>{let n=!1;const{selection:t}=r,{empty:i,anchor:o}=t;if(!i)return!1;let a=new c.Node,d=0;return r.doc.nodesBetween(o-1,o,(u,s)=>{if(u.type.name===this.name)return n=!0,a=u,d=s,!1}),n&&e.insertText(this.options.deleteTriggerWithBackspace?"":a.attrs.mentionSuggestionChar,d,d+a.nodeSize),n})}},addProseMirrorPlugins(){return b(this).map(p.Suggestion)}}),M=w;const T=m.forwardRef((e,r)=>{const n=m.useRef(null),[t,i]=m.useState(0),o=s=>{const l=e.items[s];l&&(e.command({id:l,label:l}),e!=null&&e.onClose&&(e==null||e.onClose()))},a=()=>{i((t+e.items.length-1)%e.items.length)},d=()=>{i((t+1)%e.items.length)},u=()=>{o(t)};return m.useEffect(()=>i(0),[e.items]),m.useEffect(()=>{if(Number.isNaN(t+1))return;const s=n.current.querySelector(`span:nth-of-type(${t+1})`);s&&y(s,{behavior:"smooth",scrollMode:"if-needed"})},[t]),m.useImperativeHandle(r,()=>({onKeyDown:({event:s})=>s.key==="ArrowUp"?(a(),!0):s.key==="ArrowDown"?(d(),!0):s.key==="Enter"?(u(),!0):!1})),g.jsx("div",{className:" !richtext-max-h-[320px] !richtext-w-[160px] richtext-overflow-y-auto richtext-overflow-x-hidden  richtext-rounded-md  !richtext-border !richtext-border-[hsl(var(--richtext-border))] richtext-bg-popover richtext-p-1 richtext-text-popover-foreground richtext-shadow-md richtext-outline-none",children:g.jsx("div",{ref:n,children:e.items.length>0?e.items.map((s,l)=>g.jsx("span",{className:h.clsx("richtext-flex richtext-w-full richtext-items-center richtext-gap-3 richtext-rounded-sm !richtext-border-none !richtext-bg-transparent richtext-px-2 richtext-py-1.5 richtext-text-left richtext-text-sm !richtext-text-neutral-800 !richtext-outline-none richtext-transition-colors hover:!richtext-bg-accent dark:!richtext-text-neutral-200",{"bg-item-active":l===t}),onClick:()=>o(l),children:s},l)):g.jsx("div",{className:h.clsx("itemUserEmpty"),children:"Empty"})})})}),L=[{id:"1",name:"John Doe"},{id:"2",name:"Jane Doe"},{id:"3",name:"Alice"},{id:"4",name:"Bob"}],S=M.extend({addAttributes(){return{id:{default:"",parseHTML:h.getDatasetAttribute("id")},label:{default:"",parseHTML:h.getDatasetAttribute("label")}}}}).configure({HTMLAttributes:{class:"mention"},suggestion:{items:async({query:e})=>L.map(n=>n.name).filter(n=>n.toLowerCase().startsWith(e.toLowerCase())),render:()=>{let e;function r(t){if(!e||!e.element)return;const i={getBoundingClientRect(){return t}};h.computePosition(i,e.element,{placement:"bottom-start"}).then(o=>{Object.assign(e.element.style,{left:`${o.x}px`,top:`${o.y}px`,position:o.strategy==="fixed"?"fixed":"absolute"})})}const n=()=>{e&&(document.body.contains(e.element)&&document.body.removeChild(e.element),e.destroy())};return{onStart:t=>{n(),e=new h.ReactRenderer(T,{props:{...t,onClose:n},editor:t.editor}),document.body.appendChild(e.element),r(t.clientRect())},onUpdate(t){e.updateProps(t),r(t.clientRect())},onKeyDown(t){var i;return t.event.key==="Escape"?(document.body.removeChild(e.element),e.destroy(),!0):(i=e.ref)==null?void 0:i.onKeyDown(t)}}}}});exports.Mention=S;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./index-RfTlOzIr.cjs"),v=require("@tiptap/pm/model"),g=require("./updatePosition-8Sdem5jb.cjs"),w=require("@tiptap/pm/state"),M=require("./index-BH4bc3jN.cjs"),m=require("react/jsx-runtime"),h=require("react"),x=require("./clsx-C11secjj.cjs"),T=require("scroll-into-view-if-needed"),p=require("./dom-dataset-BqoJhJXt.cjs");function L({editor:e,overrideSuggestionOptions:t,extensionName:r,char:n="@"}){const i=new w.PluginKey;return{editor:e,char:n,pluginKey:i,command:({editor:s,range:a,props:l})=>{var d,o,u;const f=s.view.state.selection.$to.nodeAfter;((d=f==null?void 0:f.text)==null?void 0:d.startsWith(" "))&&(a.to+=1),s.chain().focus().insertContentAt(a,[{type:r,attrs:{...l,mentionSuggestionChar:n}},{type:"text",text:" "}]).run(),(u=(o=s.view.dom.ownerDocument.defaultView)==null?void 0:o.getSelection())==null||u.collapseToEnd()},allow:({state:s,range:a})=>{const l=s.doc.resolve(a.from),d=s.schema.nodes[r];return!!l.parent.type.contentMatch.matchType(d)},...t}}function y(e){return(e.options.suggestions.length?e.options.suggestions:[e.options.suggestion]).map(t=>L({editor:e.editor,overrideSuggestionOptions:t,extensionName:e.name,char:t.char}))}function b(e,t){const r=y(e),n=r.find(i=>i.char===t);return n||(r.length?r[0]:null)}var S=c.Node3.create({name:"mention",priority:101,addOptions(){return{HTMLAttributes:{},renderText({node:e,suggestion:t}){var r,n;return`${(r=t==null?void 0:t.char)!=null?r:"@"}${(n=e.attrs.label)!=null?n:e.attrs.id}`},deleteTriggerWithBackspace:!1,renderHTML({options:e,node:t,suggestion:r}){var n,i;return["span",c.mergeAttributes(this.HTMLAttributes,e.HTMLAttributes),`${(n=r==null?void 0:r.char)!=null?n:"@"}${(i=t.attrs.label)!=null?i:t.attrs.id}`]},suggestions:[],suggestion:{}}},group:"inline",inline:!0,selectable:!1,atom:!0,addAttributes(){return{id:{default:null,parseHTML:e=>e.getAttribute("data-id"),renderHTML:e=>e.id?{"data-id":e.id}:{}},label:{default:null,parseHTML:e=>e.getAttribute("data-label"),renderHTML:e=>e.label?{"data-label":e.label}:{}},mentionSuggestionChar:{default:"@",parseHTML:e=>e.getAttribute("data-mention-suggestion-char"),renderHTML:e=>({"data-mention-suggestion-char":e.mentionSuggestionChar})}}},parseHTML(){return[{tag:`span[data-type="${this.name}"]`}]},renderHTML({node:e,HTMLAttributes:t}){const r=b(this,e.attrs.mentionSuggestionChar);if(this.options.renderLabel!==void 0)return console.warn("renderLabel is deprecated use renderText and renderHTML instead"),["span",c.mergeAttributes({"data-type":this.name},this.options.HTMLAttributes,t),this.options.renderLabel({options:this.options,node:e,suggestion:r})];const n={...this.options};n.HTMLAttributes=c.mergeAttributes({"data-type":this.name},this.options.HTMLAttributes,t);const i=this.options.renderHTML({options:n,node:e,suggestion:r});return typeof i=="string"?["span",c.mergeAttributes({"data-type":this.name},this.options.HTMLAttributes,t),i]:i},...c.createInlineMarkdownSpec({nodeName:"mention",name:"@",selfClosing:!0,allowedAttributes:["id","label",{name:"mentionSuggestionChar",skipIfDefault:"@"}],parseAttributes:e=>{const t={},r=/(\w+)=(?:"([^"]*)"|'([^']*)')/g;let n=r.exec(e);for(;n!==null;){const[,i,s,a]=n,l=s??a;t[i==="char"?"mentionSuggestionChar":i]=l,n=r.exec(e)}return t},serializeAttributes:e=>Object.entries(e).filter(([,t])=>t!=null).map(([t,r])=>`${t==="mentionSuggestionChar"?"char":t}="${r}"`).join(" ")}),renderText({node:e}){const t={options:this.options,node:e,suggestion:b(this,e.attrs.mentionSuggestionChar)};return this.options.renderLabel!==void 0?(console.warn("renderLabel is deprecated use renderText and renderHTML instead"),this.options.renderLabel(t)):this.options.renderText(t)},addKeyboardShortcuts(){return{Backspace:()=>this.editor.commands.command(({tr:e,state:t})=>{let r=!1;const{selection:n}=t,{empty:i,anchor:s}=n;if(!i)return!1;let a=new v.Node,l=0;return t.doc.nodesBetween(s-1,s,(d,o)=>{if(d.type.name===this.name)return r=!0,a=d,l=o,!1}),r&&e.insertText(this.options.deleteTriggerWithBackspace?"":a.attrs.mentionSuggestionChar,l,l+a.nodeSize),r})}},addProseMirrorPlugins(){return y(this).map(g.Suggestion)}}),A=S;const H=h.forwardRef((e,t)=>{const r=h.useRef(null),[n,i]=h.useState(0),s=o=>{const u=e.items[o];u&&e.command({id:u,label:u})},a=()=>{i((n+e.items.length-1)%e.items.length)},l=()=>{i((n+1)%e.items.length)},d=()=>{s(n)};return h.useEffect(()=>i(0),[e.items]),h.useEffect(()=>{if(Number.isNaN(n+1))return;const o=r.current.querySelector(`span:nth-of-type(${n+1})`);o&&T(o,{behavior:"smooth",scrollMode:"if-needed"})},[n]),h.useImperativeHandle(t,()=>({onKeyDown:({event:o})=>o.key==="ArrowUp"?(a(),!0):o.key==="ArrowDown"?(l(),!0):o.key==="Enter"?(d(),!0):!1})),m.jsx("div",{className:" !richtext-max-h-[320px] !richtext-w-[160px] richtext-overflow-y-auto richtext-overflow-x-hidden  richtext-rounded-md  !richtext-border !richtext-border-solid !richtext-border-[hsl(var(--richtext-border))] richtext-bg-popover richtext-p-1 richtext-text-popover-foreground richtext-shadow-md richtext-outline-none",children:m.jsx("div",{ref:r,children:e.items.length>0?e.items.map((o,u)=>m.jsx("span",{className:x.clsx("richtext-flex richtext-w-full richtext-items-center richtext-gap-3 richtext-rounded-sm !richtext-border-none !richtext-bg-transparent richtext-px-2 richtext-py-1.5 richtext-text-left richtext-text-sm !richtext-text-neutral-800 !richtext-outline-none richtext-transition-colors hover:!richtext-bg-accent dark:!richtext-text-neutral-200",{"bg-item-active":u===n}),onClick:()=>s(u),children:o},u)):m.jsx("div",{className:x.clsx("itemUserEmpty"),children:"Empty"})})})}),C=[{id:"1",name:"John Doe"},{id:"2",name:"Jane Doe"},{id:"3",name:"Alice"},{id:"4",name:"Bob"}],$=A.extend({addAttributes(){return{id:{default:"",parseHTML:p.getDatasetAttribute("id")},label:{default:"",parseHTML:p.getDatasetAttribute("label")}}}}).configure({HTMLAttributes:{class:"mention"},suggestion:{items:async({query:e})=>C.map(r=>r.name).filter(r=>r.toLowerCase().startsWith(e.toLowerCase())),render:()=>{let e;return{onStart:t=>{t.clientRect&&(e=new M.ReactRenderer(H,{props:t,editor:t.editor}),e.element.style.position="absolute",document.body.appendChild(e.element),g.updatePosition(t.editor,e.element))},onUpdate(t){e.updateProps(t),t.clientRect&&g.updatePosition(t.editor,e.element)},onKeyDown(t){var r;return t.event.key==="Escape"?(e.destroy(),e.element.remove(),!0):(r=e.ref)==null?void 0:r.onKeyDown(t)},onExit(){e.destroy(),e.element.remove()}}}}});exports.Mention=$;

package/lib/Mention.d.cts

@@ -37,11 +37,22 @@ declare module '@tiptap/core' {
 }
 
 
+declare module '@tiptap/core' {
+    interface Storage {
+        color: ColorStorage;
+    }
+}
+
+
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        drawer: {
-            setDrawer: (options: any, replace?: any) => ReturnType;
-            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
+        columns: {
+            insertColumns: (attrs?: {
+                cols: number;
+            }) => ReturnType;
+            addColBefore: () => ReturnType;
+            addColAfter: () => ReturnType;
+            deleteCol: () => ReturnType;
         };
     }
 }
@@ -49,8 +60,9 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        excalidraw: {
-            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
+        drawer: {
+            setDrawer: (options: any, replace?: any) => ReturnType;
+            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
         };
     }
 }
@@ -68,7 +80,16 @@ declare module '@tiptap/core' {
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         exportWord: {
-            exportToWord: () => ReturnType;
+            exportToWord: (docState: any) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        excalidraw: {
+            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
         };
     }
 }
@@ -93,10 +114,8 @@ declare module '@tiptap/core' {
 
 
 declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        painter: {
-            setPainter: (marks: Mark[]) => ReturnType;
-        };
+    interface Storage {
+        highlight: HighlightStorage;
     }
 }
 
@@ -181,16 +200,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        lineHeight: {
-            setLineHeight: (lineHeight: string) => ReturnType;
-            unsetLineHeight: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         mermaid: {
@@ -201,20 +210,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        columns: {
-            insertColumns: (attrs?: {
-                cols: number;
-            }) => ReturnType;
-            addColBefore: () => ReturnType;
-            addColAfter: () => ReturnType;
-            deleteCol: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         search: {
@@ -238,16 +233,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        tableOfContents: {
-            setTableOfContents: () => ReturnType;
-            removeTableOfContents: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         twitter: {

package/lib/Mention.d.ts

@@ -37,11 +37,22 @@ declare module '@tiptap/core' {
 }
 
 
+declare module '@tiptap/core' {
+    interface Storage {
+        color: ColorStorage;
+    }
+}
+
+
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        drawer: {
-            setDrawer: (options: any, replace?: any) => ReturnType;
-            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
+        columns: {
+            insertColumns: (attrs?: {
+                cols: number;
+            }) => ReturnType;
+            addColBefore: () => ReturnType;
+            addColAfter: () => ReturnType;
+            deleteCol: () => ReturnType;
         };
     }
 }
@@ -49,8 +60,9 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        excalidraw: {
-            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
+        drawer: {
+            setDrawer: (options: any, replace?: any) => ReturnType;
+            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
         };
     }
 }
@@ -68,7 +80,16 @@ declare module '@tiptap/core' {
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         exportWord: {
-            exportToWord: () => ReturnType;
+            exportToWord: (docState: any) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        excalidraw: {
+            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
         };
     }
 }
@@ -93,10 +114,8 @@ declare module '@tiptap/core' {
 
 
 declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        painter: {
-            setPainter: (marks: Mark[]) => ReturnType;
-        };
+    interface Storage {
+        highlight: HighlightStorage;
     }
 }
 
@@ -181,16 +200,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        lineHeight: {
-            setLineHeight: (lineHeight: string) => ReturnType;
-            unsetLineHeight: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         mermaid: {
@@ -201,20 +210,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        columns: {
-            insertColumns: (attrs?: {
-                cols: number;
-            }) => ReturnType;
-            addColBefore: () => ReturnType;
-            addColAfter: () => ReturnType;
-            deleteCol: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         search: {
@@ -238,16 +233,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        tableOfContents: {
-            setTableOfContents: () => ReturnType;
-            removeTableOfContents: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         twitter: {

package/lib/Mention.js

@@ -1,73 +1,77 @@
-import { c as g, g as f, a as y, b as v } from "./dom-dataset-lYeH6gfI.js";
-import { N as w, s as T, u as L, m as u, a as M } from "./index-kbO3iWqL.js";
-import { S as H } from "./index-J3jHHZ4d.js";
+import { N as w, y as v, m as c } from "./index-DnWWK9F_.js";
+import { Node as T } from "@tiptap/pm/model";
+import { S as L, u as g } from "./updatePosition-BPmcE0YD.js";
+import { PluginKey as M } from "@tiptap/pm/state";
+import { a as S } from "./index-DzcKxutn.js";
 import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as S, useRef as C, useState as A, useEffect as x, useImperativeHandle as N } from "react";
+import { forwardRef as H, useRef as A, useState as C, useEffect as f, useImperativeHandle as N } from "react";
+import { c as p } from "./clsx-OuTLNxxd.js";
 import $ from "scroll-into-view-if-needed";
+import { g as x } from "./dom-dataset-CIEeltF6.js";
 function k({
   editor: e,
-  overrideSuggestionOptions: r,
-  extensionName: n,
-  char: t = "@"
+  overrideSuggestionOptions: t,
+  extensionName: r,
+  char: n = "@"
 }) {
   const i = new M();
   return {
     editor: e,
-    char: t,
+    char: n,
     pluginKey: i,
-    command: ({ editor: o, range: a, props: d }) => {
-      var c, s, l;
-      const h = o.view.state.selection.$to.nodeAfter;
-      ((c = h == null ? void 0 : h.text) == null ? void 0 : c.startsWith(" ")) && (a.to += 1), o.chain().focus().insertContentAt(a, [
+    command: ({ editor: s, range: a, props: l }) => {
+      var u, o, d;
+      const h = s.view.state.selection.$to.nodeAfter;
+      ((u = h == null ? void 0 : h.text) == null ? void 0 : u.startsWith(" ")) && (a.to += 1), s.chain().focus().insertContentAt(a, [
         {
-          type: n,
-          attrs: { ...d, mentionSuggestionChar: t }
+          type: r,
+          attrs: { ...l, mentionSuggestionChar: n }
         },
         {
           type: "text",
           text: " "
         }
-      ]).run(), (l = (s = o.view.dom.ownerDocument.defaultView) == null ? void 0 : s.getSelection()) == null || l.collapseToEnd();
+      ]).run(), (d = (o = s.view.dom.ownerDocument.defaultView) == null ? void 0 : o.getSelection()) == null || d.collapseToEnd();
     },
-    allow: ({ state: o, range: a }) => {
-      const d = o.doc.resolve(a.from), c = o.schema.nodes[n];
-      return !!d.parent.type.contentMatch.matchType(c);
+    allow: ({ state: s, range: a }) => {
+      const l = s.doc.resolve(a.from), u = s.schema.nodes[r];
+      return !!l.parent.type.contentMatch.matchType(u);
     },
-    ...r
+    ...t
   };
 }
-function b(e) {
+function y(e) {
   return (e.options.suggestions.length ? e.options.suggestions : [e.options.suggestion]).map(
-    (r) => k({
+    (t) => k({
       // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility
       editor: e.editor,
-      overrideSuggestionOptions: r,
+      overrideSuggestionOptions: t,
       extensionName: e.name,
-      char: r.char
+      char: t.char
     })
   );
 }
-function p(e, r) {
-  const n = b(e), t = n.find((i) => i.char === r);
-  return t || (n.length ? n[0] : null);
+function b(e, t) {
+  const r = y(e), n = r.find((i) => i.char === t);
+  return n || (r.length ? r[0] : null);
 }
-var E = w.create({
+var D = w.create({
   name: "mention",
   priority: 101,
   addOptions() {
     return {
       HTMLAttributes: {},
-      renderText({ node: e, suggestion: r }) {
-        var n, t;
-        return `${(n = r == null ? void 0 : r.char) != null ? n : "@"}${(t = e.attrs.label) != null ? t : e.attrs.id}`;
+      renderText({ node: e, suggestion: t }) {
+        var r, n;
+        return `${(r = t == null ? void 0 : t.char) != null ? r : "@"}${(n = e.attrs.label) != null ? n : e.attrs.id}`;
       },
       deleteTriggerWithBackspace: !1,
-      renderHTML({ options: e, node: r, suggestion: n }) {
-        var t, i;
+      renderHTML({ options: e, node: t, suggestion: r }) {
+        var n, i;
         return [
           "span",
-          u(this.HTMLAttributes, e.HTMLAttributes),
-          `${(t = n == null ? void 0 : n.char) != null ? t : "@"}${(i = r.attrs.label) != null ? i : r.attrs.id}`
+          c(this.HTMLAttributes, e.HTMLAttributes),
+          `${(n = r == null ? void 0 : r.char) != null ? n : "@"}${(i = t.attrs.label) != null ? i : t.attrs.id}`
         ];
       },
       suggestions: [],
@@ -111,96 +115,106 @@ var E = w.create({
       }
     ];
   },
-  renderHTML({ node: e, HTMLAttributes: r }) {
-    const n = p(this, e.attrs.mentionSuggestionChar);
+  renderHTML({ node: e, HTMLAttributes: t }) {
+    const r = b(this, e.attrs.mentionSuggestionChar);
     if (this.options.renderLabel !== void 0)
       return console.warn("renderLabel is deprecated use renderText and renderHTML instead"), [
         "span",
-        u({ "data-type": this.name }, this.options.HTMLAttributes, r),
+        c({ "data-type": this.name }, this.options.HTMLAttributes, t),
         this.options.renderLabel({
           options: this.options,
           node: e,
-          suggestion: n
+          suggestion: r
         })
       ];
-    const t = { ...this.options };
-    t.HTMLAttributes = u(
+    const n = { ...this.options };
+    n.HTMLAttributes = c(
       { "data-type": this.name },
       this.options.HTMLAttributes,
-      r
+      t
     );
     const i = this.options.renderHTML({
-      options: t,
+      options: n,
       node: e,
-      suggestion: n
+      suggestion: r
     });
-    return typeof i == "string" ? ["span", u({ "data-type": this.name }, this.options.HTMLAttributes, r), i] : i;
+    return typeof i == "string" ? ["span", c({ "data-type": this.name }, this.options.HTMLAttributes, t), i] : i;
   },
-  ...T({
+  ...v({
     nodeName: "mention",
     name: "@",
     selfClosing: !0,
-    allowedAttributes: ["id", "label"]
+    allowedAttributes: ["id", "label", { name: "mentionSuggestionChar", skipIfDefault: "@" }],
+    parseAttributes: (e) => {
+      const t = {}, r = /(\w+)=(?:"([^"]*)"|'([^']*)')/g;
+      let n = r.exec(e);
+      for (; n !== null; ) {
+        const [, i, s, a] = n, l = s ?? a;
+        t[i === "char" ? "mentionSuggestionChar" : i] = l, n = r.exec(e);
+      }
+      return t;
+    },
+    serializeAttributes: (e) => Object.entries(e).filter(([, t]) => t != null).map(([t, r]) => `${t === "mentionSuggestionChar" ? "char" : t}="${r}"`).join(" ")
   }),
   renderText({ node: e }) {
-    const r = {
+    const t = {
       options: this.options,
       node: e,
-      suggestion: p(this, e.attrs.mentionSuggestionChar)
+      suggestion: b(this, e.attrs.mentionSuggestionChar)
     };
-    return this.options.renderLabel !== void 0 ? (console.warn("renderLabel is deprecated use renderText and renderHTML instead"), this.options.renderLabel(r)) : this.options.renderText(r);
+    return this.options.renderLabel !== void 0 ? (console.warn("renderLabel is deprecated use renderText and renderHTML instead"), this.options.renderLabel(t)) : this.options.renderText(t);
   },
   addKeyboardShortcuts() {
     return {
-      Backspace: () => this.editor.commands.command(({ tr: e, state: r }) => {
-        let n = !1;
-        const { selection: t } = r, { empty: i, anchor: o } = t;
+      Backspace: () => this.editor.commands.command(({ tr: e, state: t }) => {
+        let r = !1;
+        const { selection: n } = t, { empty: i, anchor: s } = n;
         if (!i)
           return !1;
-        let a = new L(), d = 0;
-        return r.doc.nodesBetween(o - 1, o, (c, s) => {
-          if (c.type.name === this.name)
-            return n = !0, a = c, d = s, !1;
-        }), n && e.insertText(
+        let a = new T(), l = 0;
+        return t.doc.nodesBetween(s - 1, s, (u, o) => {
+          if (u.type.name === this.name)
+            return r = !0, a = u, l = o, !1;
+        }), r && e.insertText(
           this.options.deleteTriggerWithBackspace ? "" : a.attrs.mentionSuggestionChar,
-          d,
-          d + a.nodeSize
-        ), n;
+          l,
+          l + a.nodeSize
+        ), r;
       })
     };
   },
   addProseMirrorPlugins() {
-    return b(this).map(H);
+    return y(this).map(L);
   }
-}), _ = E;
-const D = S((e, r) => {
-  const n = C(null), [t, i] = A(0), o = (s) => {
-    const l = e.items[s];
-    l && (e.command({ id: l, label: l }), e != null && e.onClose && (e == null || e.onClose()));
+}), K = D;
+const _ = H((e, t) => {
+  const r = A(null), [n, i] = C(0), s = (o) => {
+    const d = e.items[o];
+    d && e.command({ id: d, label: d });
   }, a = () => {
-    i((t + e.items.length - 1) % e.items.length);
-  }, d = () => {
-    i((t + 1) % e.items.length);
-  }, c = () => {
-    o(t);
+    i((n + e.items.length - 1) % e.items.length);
+  }, l = () => {
+    i((n + 1) % e.items.length);
+  }, u = () => {
+    s(n);
   };
-  return x(() => i(0), [e.items]), x(() => {
-    if (Number.isNaN(t + 1))
+  return f(() => i(0), [e.items]), f(() => {
+    if (Number.isNaN(n + 1))
       return;
-    const s = n.current.querySelector(`span:nth-of-type(${t + 1})`);
-    s && $(s, { behavior: "smooth", scrollMode: "if-needed" });
-  }, [t]), N(r, () => ({
-    onKeyDown: ({ event: s }) => s.key === "ArrowUp" ? (a(), !0) : s.key === "ArrowDown" ? (d(), !0) : s.key === "Enter" ? (c(), !0) : !1
-  })), /* @__PURE__ */ m("div", { className: " !richtext-max-h-[320px] !richtext-w-[160px] richtext-overflow-y-auto richtext-overflow-x-hidden  richtext-rounded-md  !richtext-border !richtext-border-[hsl(var(--richtext-border))] richtext-bg-popover richtext-p-1 richtext-text-popover-foreground richtext-shadow-md richtext-outline-none", children: /* @__PURE__ */ m("div", { ref: n, children: e.items.length > 0 ? e.items.map((s, l) => /* @__PURE__ */ m(
+    const o = r.current.querySelector(`span:nth-of-type(${n + 1})`);
+    o && $(o, { behavior: "smooth", scrollMode: "if-needed" });
+  }, [n]), N(t, () => ({
+    onKeyDown: ({ event: o }) => o.key === "ArrowUp" ? (a(), !0) : o.key === "ArrowDown" ? (l(), !0) : o.key === "Enter" ? (u(), !0) : !1
+  })), /* @__PURE__ */ m("div", { className: " !richtext-max-h-[320px] !richtext-w-[160px] richtext-overflow-y-auto richtext-overflow-x-hidden  richtext-rounded-md  !richtext-border !richtext-border-solid !richtext-border-[hsl(var(--richtext-border))] richtext-bg-popover richtext-p-1 richtext-text-popover-foreground richtext-shadow-md richtext-outline-none", children: /* @__PURE__ */ m("div", { ref: r, children: e.items.length > 0 ? e.items.map((o, d) => /* @__PURE__ */ m(
     "span",
     {
-      className: g("richtext-flex richtext-w-full richtext-items-center richtext-gap-3 richtext-rounded-sm !richtext-border-none !richtext-bg-transparent richtext-px-2 richtext-py-1.5 richtext-text-left richtext-text-sm !richtext-text-neutral-800 !richtext-outline-none richtext-transition-colors hover:!richtext-bg-accent dark:!richtext-text-neutral-200", { "bg-item-active": l === t }),
-      onClick: () => o(l),
-      children: s
+      className: p("richtext-flex richtext-w-full richtext-items-center richtext-gap-3 richtext-rounded-sm !richtext-border-none !richtext-bg-transparent richtext-px-2 richtext-py-1.5 richtext-text-left richtext-text-sm !richtext-text-neutral-800 !richtext-outline-none richtext-transition-colors hover:!richtext-bg-accent dark:!richtext-text-neutral-200", { "bg-item-active": d === n }),
+      onClick: () => s(d),
+      children: o
     },
-    l
-  )) : /* @__PURE__ */ m("div", { className: g("itemUserEmpty"), children: "Empty" }) }) });
-}), R = [
+    d
+  )) : /* @__PURE__ */ m("div", { className: p("itemUserEmpty"), children: "Empty" }) }) });
+}), E = [
   {
     id: "1",
     name: "John Doe"
@@ -217,16 +231,16 @@ const D = S((e, r) => {
     id: "4",
     name: "Bob"
   }
-], V = /* @__PURE__ */ _.extend({
+], Q = /* @__PURE__ */ K.extend({
   addAttributes() {
     return {
       id: {
         default: "",
-        parseHTML: f("id")
+        parseHTML: x("id")
       },
       label: {
         default: "",
-        parseHTML: f("label")
+        parseHTML: x("label")
       }
     };
   }
@@ -235,56 +249,30 @@ const D = S((e, r) => {
     class: "mention"
   },
   suggestion: {
-    items: async ({ query: e }) => R.map((n) => n.name).filter((n) => n.toLowerCase().startsWith(e.toLowerCase())),
+    items: async ({ query: e }) => E.map((r) => r.name).filter((r) => r.toLowerCase().startsWith(e.toLowerCase())),
     render: () => {
       let e;
-      function r(t) {
-        if (!e || !e.element)
-          return;
-        v({
-          getBoundingClientRect() {
-            return t;
-          }
-        }, e.element, {
-          placement: "bottom-start"
-        }).then((o) => {
-          Object.assign(e.element.style, {
-            left: `${o.x}px`,
-            top: `${o.y}px`,
-            position: o.strategy === "fixed" ? "fixed" : "absolute"
-          });
-        });
-      }
-      const n = () => {
-        e && (document.body.contains(e.element) && document.body.removeChild(e.element), e.destroy());
-      };
       return {
         onStart: (t) => {
-          n(), e = new y(D, {
-            props: {
-              ...t,
-              onClose: n
-            },
+          t.clientRect && (e = new S(_, {
+            props: t,
             editor: t.editor
-          }), document.body.appendChild(e.element), r(t.clientRect());
+          }), e.element.style.position = "absolute", document.body.appendChild(e.element), g(t.editor, e.element));
         },
         onUpdate(t) {
-          e.updateProps(t), r(t.clientRect());
+          e.updateProps(t), t.clientRect && g(t.editor, e.element);
         },
         onKeyDown(t) {
-          var i;
-          return t.event.key === "Escape" ? (document.body.removeChild(e.element), e.destroy(), !0) : (i = e.ref) == null ? void 0 : i.onKeyDown(t);
+          var r;
+          return t.event.key === "Escape" ? (e.destroy(), e.element.remove(), !0) : (r = e.ref) == null ? void 0 : r.onKeyDown(t);
+        },
+        onExit() {
+          e.destroy(), e.element.remove();
         }
-        // onExit() {
-        //   if (document.body.contains(component.element)) {
-        //     document.body.removeChild(component.element);
-        //   }
-        //   component.destroy();
-        // },
       };
     }
   }
 });
 export {
-  V as Mention
+  Q as Mention
 };