on-codemerge/dist/src/plugins/HTMLViewerPlugin/index.cjs

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

"use strict";var r=Object.defineProperty;var l=(e,t,o)=>t in e?r(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o;var i=(e,t,o)=>l(e,typeof t!="symbol"?t+"":t,o);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css             */;/* empty css              */const n=require("./components/HTMLViewerModal.cjs"),s=require("../ToolbarPlugin/utils.cjs"),a=require("../../icons/html.svg.cjs");class h{constructor(){i(this,"name","html-viewer");i(this,"hotkeys",[{keys:"Ctrl+Alt+W",description:"View HTML",command:"html-viewer",icon:"🖥️"}]);i(this,"editor",null);i(this,"modal",null);i(this,"toolbarButton",null)}initialize(t){this.modal=new n.HTMLViewerModal(t),this.editor=t,this.addToolbarButton(),this.editor.on("html-viewer",()=>{this.showHTML()})}addToolbarButton(){var o;const t=document.querySelector(".editor-toolbar");t&&(this.toolbarButton=s.createToolbarButton({icon:a.default,title:((o=this.editor)==null?void 0:o.t("View HTML"))??"",onClick:()=>this.showHTML()}),t.appendChild(this.toolbarButton))}showHTML(){var t;this.editor&&((t=this.modal)==null||t.show(this.editor.getHtml()))}destroy(){var t;this.modal&&(this.modal.destroy(),this.modal=null),this.toolbarButton&&this.toolbarButton.parentElement&&(this.toolbarButton.parentElement.removeChild(this.toolbarButton),this.toolbarButton=null),(t=this.editor)==null||t.off("html-viewer"),this.editor=null}}exports.HTMLViewerPlugin=h;