on-codemerge
Version:
A WYSIWYG editor for on-codemerge is a user-friendly interface that allows users to edit and view their code in real time, exactly as it will appear in the final product
3 lines (2 loc) • 3.77 kB
JavaScript
/*! on-codemerge v1.3.1 @author Pavel Kuzmin @license MIT @homepage https://s00d.github.io/on-codemerge/ @repository git+https://github.com/s00d/on-codemerge.git Copyright (c) 2026 Pavel Kuzmin - Built on 2026-07-02T13:39:17.947Z */
"use strict";var u=Object.defineProperty;var c=(r,t,e)=>t in r?u(r,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):r[t]=e;var i=(r,t,e)=>c(r,typeof t!="symbol"?t+"":t,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css */;/* empty css */const h=require("./components/LinkMenu.cjs"),a=require("../ToolbarPlugin/utils.cjs"),d=require("../../icons/delete.svg.cjs"),f=require("../../icons/edit.svg.cjs"),g=require("../../icons/link.svg.cjs"),m=require("../../core/ui/ContextMenu.cjs"),x=require("../../utils/helpers.cjs");class M{constructor(){i(this,"name","link");i(this,"hotkeys",[{keys:"Ctrl+Alt+Z",description:"Insert link",command:"link",icon:"🔗"}]);i(this,"editor",null);i(this,"menu",null);i(this,"contextMenu",null);i(this,"currentRange",null);i(this,"toolbarButton",null);i(this,"handleContextMenu",t=>{var o;const e=t.target.closest("a");if(e instanceof HTMLAnchorElement){t.preventDefault();const n=t.clientX,l=t.clientY;console.log("Mouse coordinates:",n,l),(o=this.contextMenu)==null||o.show(e,n,l)}})}initialize(t){var e,o;this.menu=new h.LinkMenu(t),this.contextMenu=new m.ContextMenu(t,[{label:(e=this.editor)==null?void 0:e.t("Edit"),icon:f.default,iconPosition:"right",hotkey:"S",onClick:n=>{n&&this.editLink(n)}},{type:"divider"},{label:(o=this.editor)==null?void 0:o.t("Remove"),icon:d.default,iconPosition:"right",hotkey:"D",onClick:n=>{n&&this.removeLink(n)}}],{orientation:"horizontal"}),this.editor=t,this.addToolbarButton(),this.setupContextMenu(),this.editor.on("link",()=>{this.openModal()})}addToolbarButton(){var e,o;const t=(e=this.editor)==null?void 0:e.getToolbar();t&&(this.toolbarButton=a.createToolbarButton({icon:g.default,title:(o=this.editor)==null?void 0:o.t("Insert Link"),onClick:()=>{this.openModal()}}),t.appendChild(this.toolbarButton))}setupContextMenu(){if(!this.editor)return;this.editor.getContainer().addEventListener("contextmenu",this.handleContextMenu)}openModal(){var o,n,l;if(!this.editor)return;(o=this.editor)==null||o.ensureEditorFocus();const t=(n=this.editor.getTextFormatter())==null?void 0:n.getSelection();t&&t.rangeCount>0&&(this.currentRange=t.getRangeAt(0).cloneRange());const e=t?t.toString().trim():"";(l=this.menu)==null||l.show(s=>{this.handleLinkInsertion(s,e)},{anchor:e})}handleLinkInsertion(t,e){if(!this.editor||!this.currentRange)return;const o=t.anchor||e,n=x.createLink(o,t.url);t.title&&(n.title=t.title),t.nofollow&&(n.rel="nofollow"),t.targetBlank&&(n.target="_blank"),this.currentRange.deleteContents(),this.currentRange.insertNode(n),this.currentRange.collapse(!1),this.currentRange=null}editLink(t){var o;if(!this.editor)return;const e={url:t.href,anchor:t.textContent||"",title:t.title,nofollow:t.rel.includes("nofollow"),targetBlank:t.target==="_blank"};(o=this.menu)==null||o.show(n=>{t.href=n.url,t.textContent=n.anchor||n.url,t.title=n.title||"",t.rel=n.nofollow?"nofollow":"",t.target=n.targetBlank?"_blank":""},e)}removeLink(t){if(!this.editor)return;const e=document.createTextNode(t.textContent||"");t.replaceWith(e)}destroy(){var e,o;(e=this.editor)==null||e.off("link"),this.contextMenu&&(this.contextMenu.destroy(),this.contextMenu=null),this.toolbarButton&&this.toolbarButton.parentElement&&(this.toolbarButton.parentElement.removeChild(this.toolbarButton),this.toolbarButton=null);const t=(o=this.editor)==null?void 0:o.getContainer();t&&t.removeEventListener("contextmenu",this.handleContextMenu),this.menu=null,this.editor=null,this.currentRange=null}}exports.LinkPlugin=M;