diff --git a/.changeset/violet-queens-perform.md b/.changeset/violet-queens-perform.md new file mode 100644 index 00000000..cf32fb0e --- /dev/null +++ b/.changeset/violet-queens-perform.md @@ -0,0 +1,5 @@ +--- +"rhino-editor": patch +--- + +Fix the UX of link insertions diff --git a/src/exports/elements/tip-tap-editor.ts b/src/exports/elements/tip-tap-editor.ts index 5adfd576..6028ea62 100644 --- a/src/exports/elements/tip-tap-editor.ts +++ b/src/exports/elements/tip-tap-editor.ts @@ -303,6 +303,7 @@ export class TipTapEditor extends TipTapEditorBase { closeLinkDialog(): void { this.linkDialogExpanded = false; + this.editor.commands.focus(); } showLinkDialog(): void { @@ -350,24 +351,26 @@ export class TipTapEditor extends TipTapEditorBase { } catch (error) { inputElement.setCustomValidity("Not a valid URL"); this.__invalidLink__ = true; + inputElement.reportValidity(); return; } if (href) { this.closeLinkDialog(); inputElement.value = ""; - const chain = this.editor - ?.chain() - .extendMarkRange("link") - .setLink({ href }); - if (chain && this.editor?.state.selection.empty) { - chain.insertContent(href); + if (this.editor.state.selection.empty && !this.editor.getAttributes('link').href) { + const from = this.editor.state.selection.anchor; + this.editor.commands.insertContent(href); + const to = this.editor.state.selection.anchor; + this.editor.commands.setTextSelection({from, to}); } - if (chain) { - chain.run(); - } + const chain = this.editor + ?.chain() + .extendMarkRange("link") + .setLink({ href }) + .run(); } }