@lesjoursfr/edith 2.2.3 → 2.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/edith.js +1 -1
- package/dist/css/edith.scss +224 -224
- package/package.json +35 -34
- package/src/css/edith.scss +224 -224
package/build/edith.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("CodeMirror"),require("Popper")):"function"==typeof define&&define.amd?define(["CodeMirror","Popper"],e):"object"==typeof exports?exports.Edith=e(require("CodeMirror"),require("Popper")):t.Edith=e(t.CodeMirror,t.Popper)}(self,(function(t,e){return function(){"use strict";var n={690:function(e){e.exports=t},74:function(t){t.exports=e}},i={};function o(t){var e=i[t];if(void 0!==e)return e.exports;var s=i[t]={exports:{}};return n[t](s,s.exports,o),s.exports}o.d=function(t,e){for(var n in e)o.o(e,n)&&!o.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},o.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)};var s={};return function(){function t(t,e){return n(t)&&t.tagName===e.toUpperCase()}function e(t){return t.nodeType===Node.TEXT_NODE}function n(t){return t.nodeType===Node.ELEMENT_NODE}function i(t,e){return t.getAttribute(e)}function r(t,e){return"string"==typeof e?t.tagName===e.toUpperCase():e.some((e=>t.tagName===e.toUpperCase()))}function a(t,e){return t.classList.contains(e)}function c(t,{innerHTML:e,textContent:n,attributes:i}={}){const o=document.createElement(t);if(i)for(const t in i)Object.hasOwnProperty.call(i,t)&&o.setAttribute(t,i[t]);return"string"==typeof e?o.innerHTML=e:"string"==typeof n&&(o.textContent=n),o}function l(t,e){return t.replaceWith(e),e}function d(t){const e=[...t.childNodes];return t.replaceWith(...e),e}function h(t){const e=document.createTextNode(t.textContent??"");return t.replaceWith(e),e}function u(t){return["AREA","BASE","BR","COL","EMBED","HR","IMG","INPUT","KEYGEN","LINK","META","PARAM","SOURCE","TRACK","WBR"].includes(t)}function p(t,e){for(const n of[...t.childNodes])e(n)&&n.remove()}function f(t,e){if(e(t))t.remove();else for(const n of[...t.childNodes])f(n,e)}function m(t){p(t,(t=>function(t){return t.nodeType===Node.COMMENT_NODE}(t)))}function b(t,e){for(const n of t.getAttributeNames())void 0===e[n]&&t.removeAttribute(n);for(const n of Object.keys(e))t.setAttribute(n,e[n])}function g(t){const e=t.getAttribute("style")||"";return(r(t,"b")&&e.match(/font-weight\s*:\s*(normal|400);/)||r(t,"i")&&e.match(/font-style\s*:\s*normal;/)||r(t,["u","s"])&&e.match(/text-decoration\s*:\s*none;/))&&(t=l(t,c("span",{attributes:{style:e},innerHTML:t.innerHTML}))),e.match(/font-weight\s*:\s*(bold|700|800|900);/)?t=l(t,c("b",{innerHTML:`<span style="${e.replace(/font-weight\s*:\s*(bold|700|800|900);/,"")}">${t.innerHTML}</span>`})):e.match(/font-style\s*:\s*italic;/)?t=l(t,c("i",{innerHTML:`<span style="${e.replace(/font-style\s*:\s*italic;/,"")}">${t.innerHTML}</span>`})):e.match(/text-decoration\s*:\s*underline;/)?t=l(t,c("u",{innerHTML:`<span style="${e.replace(/text-decoration\s*:\s*underline;/,"")}">${t.innerHTML}</span>`})):e.match(/text-decoration\s*:\s*line-through;/)&&(t=l(t,c("s",{innerHTML:`<span style="${e.replace(/text-decoration\s*:\s*line-through;/,"")}">${t.innerHTML}</span>`}))),t}function v(e,n){const i=e.childNodes;for(;i.length>0&&t(i[0],n);)i[0].remove();for(;i.length>0&&t(i[i.length-1],n);)i[i.length-1].remove()}o.d(s,{default:function(){return Z}});let y=0;function E(t){const[e,...n]=t.split(".");return{type:e,ns:n??null}}function w(t,e,n){void 0===t.ljbtEvents&&(t.ljbtEvents={});for(const i of e.split(" ")){const{type:e,ns:o}=E(i),s=(++y).toString(10);t.addEventListener(e,n),t.ljbtEvents[s]={type:e,ns:o,handler:n}}}function C(t,e,n){void 0===t.ljbtEvents&&(t.ljbtEvents={});for(const i of e.split(" ")){const{type:e,ns:o}=E(i);for(const[i,s]of Object.entries(t.ljbtEvents))s.type!==e&&"*"!==e||null!==o&&!s.ns?.includes(o[0])||void 0!==n&&("function"!=typeof n||n!==s.handler)||(delete t.ljbtEvents[i],t.removeEventListener(s.type,s.handler))}}function x(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)t[i]=n[i]}return t}var k;(function t(e,n){function i(t,i,o){if("undefined"!=typeof document){"number"==typeof(o=x({},n,o)).expires&&(o.expires=new Date(Date.now()+864e5*o.expires)),o.expires&&(o.expires=o.expires.toUTCString()),t=encodeURIComponent(t).replace(/%(2[346B]|5E|60|7C)/g,decodeURIComponent).replace(/[()]/g,escape);var s="";for(var r in o)o[r]&&(s+="; "+r,!0!==o[r]&&(s+="="+o[r].split(";")[0]));return document.cookie=t+"="+e.write(i,t)+s}}return Object.create({set:i,get:function(t){if("undefined"!=typeof document&&(!arguments.length||t)){for(var n=document.cookie?document.cookie.split("; "):[],i={},o=0;o<n.length;o++){var s=n[o].split("="),r=s.slice(1).join("=");try{var a=decodeURIComponent(s[0]);if(i[a]=e.read(r,a),t===a)break}catch(t){}}return t?i[t]:i}},remove:function(t,e){i(t,"",x({},e,{expires:-1}))},withAttributes:function(e){return t(this.converter,x({},this.attributes,e))},withConverter:function(e){return t(x({},this.converter,e),this.attributes)}},{attributes:{value:Object.freeze(n)},converter:{value:Object.freeze(e)}})})({read:function(t){return'"'===t[0]&&(t=t.slice(1,-1)),t.replace(/(%[\dA-F]{2})+/gi,decodeURIComponent)},write:function(t){return encodeURIComponent(t).replace(/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,decodeURIComponent)}},{path:"/"});!function(t){t[t.localStorage=1]="localStorage",t[t.cookies=2]="cookies"}(k||(k={}));function T(t,e,n={}){let i,o,s,r,a,c=0;const l=!!n.leading,d="maxWait"in n,h=d?Math.max(n.maxWait||0,e):void 0,u=!("trailing"in n)||!!n.trailing;function p(e){const n=i,r=o;return i=o=void 0,c=e,s=t.apply(r,n),s}function f(t,e){return setTimeout(t,e)}function m(t){const n=t-a;return void 0===a||n>=e||n<0||d&&t-c>=h}function b(){const t=Date.now();if(m(t))return function(t){if(r=void 0,u&&i)return p(t);return i=o=void 0,s}(t);r=f(b,function(t){const n=t-c,i=e-(t-a);return d?Math.min(i,h-n):i}(t))}return function(...t){const n=Date.now(),h=m(n);if(i=t,o=this,a=n,h){if(void 0===r)return function(t){return c=t,r=f(b,e),l?p(t):s}(a);if(d)return r=f(b,e),p(a)}return void 0===r&&(r=f(b,e)),s}}const N=/[&<>"']/g;RegExp(N.source),Object.freeze({"&":"&","<":"<",">":">",'"':""","'":"'"});function M(){const t=window.getSelection();return{sel:t,range:t.rangeCount?t.getRangeAt(0):void 0}}function A(t){const e=document.createRange(),n=window.getSelection();e.setStart(t,1),e.collapse(!0),n.removeAllRanges(),n.addRange(e)}function L(t){const e=document.createRange(),n=window.getSelection();e.setStartAfter(t),e.collapse(!0),n.removeAllRanges(),n.addRange(e)}function S(t){if(1===t.length&&n(t[0])&&u(t[0].tagName))return void L(t[0]);const e=document.createRange(),i=window.getSelection();e.setStartBefore(t[0]),e.setEndAfter(t[t.length-1]),i.removeAllRanges(),i.addRange(e)}function H(t){const{range:e}=M();return void 0!==e&&(t.contains(e.startContainer)&&t.contains(e.endContainer))}function R(t,e){const n=e.parentNode,i=t.cloneRange();i.setStart(n,0);const o=i.extractContents(),s=document.createTextNode("");return o.append(s),n.prepend(o),A(s),s}function O(t,e){const i=e.parentNode,o=new Range;o.selectNodeContents(i),o.setEnd(t.startContainer,t.startOffset);const s=new Range;s.selectNodeContents(i),s.setStart(t.endContainer,t.endOffset);const r=o.extractContents(),a=s.extractContents();i.prepend(r),i.append(a);let c=n(t.commonAncestorContainer)?t.commonAncestorContainer:t.commonAncestorContainer.parentNode;for(;c.tagName!==e.tagName;)c=c.parentNode;const l=d(c);return S(l),l[0].parentNode}function I(t,e={}){const{sel:i,range:o}=M();if(void 0===o)return;if(o.collapsed){let n=i.anchorNode.parentNode;for(;!a(n,"edith-visual");){if(r(n,t))return R(o,n);n=n.parentNode}return function(t,e,n={}){const i=document.createElement(e);return"a"===e?i.textContent=n.textContent||"lien":i.innerHTML="",t.insertNode(i),"a"===e&&i.insertAdjacentText("afterend"," "),A(i),i}(o,t,e)}let s=o.commonAncestorContainer;for(;!n(s)||!a(s,"edith-visual");){if(n(s)&&r(s,t))return O(o,s);s=s.parentNode}for(const e of[...s.getElementsByTagName(t)])if(i.containsNode(e,!0)){return S(d(e)),s.normalize(),s}const c=document.createElement(t);return c.appendChild(o.extractContents()),o.insertNode(c),p(s,(t=>n(t)&&!u(t.tagName)&&(null===t.textContent||0===t.textContent.length))),function(t){const e=document.createRange(),n=window.getSelection();e.selectNodeContents(t),e.collapse(!1),n.removeAllRanges(),n.addRange(e)}(c),c}function j(t,e){for(let n of[...t.children]){if(r(n,"span")&&a(n,"edith-nbsp")){b(n,{class:"edith-nbsp",contenteditable:"false"}),n.innerHTML="¶";continue}n.hasAttribute("style")&&(n=g(n)),e[n.tagName]&&(n=l(n,c("span",{attributes:{style:n.getAttribute("style")||""},innerHTML:n.innerHTML})));const t={...e};if(r(n,["b","i","q","u","s"])&&(t[n.tagName]=!0),j(n,t),r(n,"a")){const t={};n.hasAttribute("href")&&(t.href=n.getAttribute("href")),n.hasAttribute("target")&&(t.target=n.getAttribute("target")),b(n,t)}else if(r(n,["b","i","q","u","s","br","sup"]))b(n,{});else if(r(n,["style","meta","link"]))n.remove();else if(r(n,"p")){if(null===n.textContent||0===n.textContent.trim().length){n.remove();continue}b(n,{}),v(n,"br")}else d(n)}}function D(t,n){const i=document.createElement("div");return i.innerHTML=t,j(i,n),i.normalize(),p(i,(t=>e(t)&&(null===t.textContent||0===t.textContent.trim().length))),i.innerHTML=i.innerHTML.replace(/\s* \s*/g," ").replace(/\s+/g," ").replace(/(<\/b>[\n\r\s]*<b>|<\/i>[\n\r\s]*<i>|<\/u>[\n\r\s]*<u>|<\/s>[\n\r\s]*<s>)/g," "),m(i),i}var z,B;!function(t){t.modeChanged="edith-mode-changed",t.initialized="edith-initialized"}(z||(z={}));class V{buffer=[];constructor(){}push(t){this.buffer.push(t),this.buffer.length>20&&this.buffer.shift()}pop(){return 0===this.buffer.length?null:this.buffer.pop()}}!function(t){t[t.Visual=1]="Visual",t[t.Code=2]="Code"}(B||(B={}));const U={height:80,resizable:!1,toolbar:[["style",["bold","italic","underline","strikethrough"]]],buttons:{},initialContent:""};var $=o(74);class P{el;ctx;icon;title;onclick;showOnCodeView;popperEl;popper;constructor(t,e){this.ctx=t,this.icon=e.icon,this.title=e.title,this.onclick=e.onclick,this.showOnCodeView=!0===e.showOnCodeView}click(t){t.preventDefault(),this.onclick(this.ctx,t)}showTooltip(){if(void 0!==this.popper)return;this.popperEl=c("div",{textContent:this.title,attributes:{class:"edith-tooltip"}});const t=c("div",{attributes:{class:"arrow","data-popper-arrow":""}});this.popperEl.append(t),this.ctx.toolbar.append(this.popperEl),this.popper=(0,$.createPopper)(this.el,this.popperEl,{placement:"bottom",modifiers:[{name:"arrow",options:{padding:5}},{name:"offset",options:{offset:[0,8]}}]})}hideTooltip(){void 0!==this.popper&&(this.popper.destroy(),this.popper=void 0,this.popperEl?.remove())}onEditorModeChange(t){t.detail.mode===B.Code?this.el.setAttribute("disabled","disabled"):this.el.removeAttribute("disabled")}render(){return this.el=c("button",{attributes:{class:`edith-btn ${this.icon}`,type:"button"}}),this.el.onclick=this.click.bind(this),this.el.onmouseenter=this.showTooltip.bind(this),this.el.onmouseleave=this.hideTooltip.bind(this),!0!==this.showOnCodeView&&this.ctx.on(z.modeChanged,this.onEditorModeChange.bind(this)),this.el}}const q=Object.freeze({bold:t=>new P(t,{icon:"fa-solid fa-bold",title:"Gras",onclick:t=>{t.editor.wrapInsideTag("b")}}),italic:t=>new P(t,{icon:"fa-solid fa-italic",title:"Italique",onclick:t=>{t.editor.wrapInsideTag("i")}}),underline:t=>new P(t,{icon:"fa-solid fa-underline",title:"Souligner",onclick:t=>{t.editor.wrapInsideTag("u")}}),strikethrough:t=>new P(t,{icon:"fa-solid fa-strikethrough",title:"Barrer",onclick:t=>{t.editor.wrapInsideTag("s")}}),subscript:t=>new P(t,{icon:"fa-solid fa-subscript",title:"Indice",onclick:t=>{t.editor.wrapInsideTag("sub")}}),superscript:t=>new P(t,{icon:"fa-solid fa-superscript",title:"Exposant",onclick:t=>{t.editor.wrapInsideTag("sup")}}),nbsp:t=>new P(t,{icon:"edith-btn-nbsp",title:"Ajouter une espace insécable",onclick:t=>{t.editor.replaceByHtml('<span class="edith-nbsp" contenteditable="false">¶</span>')}}),clear:t=>new P(t,{icon:"fa-solid fa-eraser",title:"Effacer la mise en forme",onclick:t=>{t.editor.clearStyle()}}),link:t=>new P(t,{icon:"fa-solid fa-link",title:"Lien",onclick:t=>{t.editor.insertLink()}}),codeview:t=>new P(t,{icon:"fa-solid fa-code",title:"Afficher le code HTML",onclick:t=>{t.editor.toggleCodeView()},showOnCodeView:!0})});var K,W=o(690);function _(t){const e=document.createElement("div");e.setAttribute("class","edith-modal-input");const n=document.createElement("label");n.textContent=t.label;const i=document.createElement("input");return i.setAttribute("name",t.name),i.setAttribute("type","text"),null!==t.initialState&&(i.value=t.initialState.toString()),e.append(n),e.append(i),e}function F(t){const e=document.createElement("div");e.setAttribute("class","edith-modal-checkbox");const n=document.createElement("label");n.textContent=t.label;const i=document.createElement("input");return i.setAttribute("name",t.name),i.setAttribute("type","checkbox"),t.initialState&&(i.checked=!0),n.prepend(i),e.append(n),e}function G(t,e,n=null){return{fieldType:K.input,label:t,name:e,initialState:n}}function J(t,e,n=!1){return{fieldType:K.checkbox,label:t,name:e,initialState:n}}!function(t){t[t.input=1]="input",t[t.checkbox=2]="checkbox"}(K||(K={}));class Q{el;ctx;title;fields;callback;constructor(t,e){this.ctx=t,this.title=e.title,this.fields=e.fields||[],this.callback=e.callback}cancel(t){t.preventDefault(),this.callback(null),this.close()}submit(t){t.preventDefault();const e={};for(const t of this.el.querySelectorAll("input"))n="name",t.hasAttribute(n)&&(e[i(t,"name")]="checkbox"===i(t,"type")?t.checked:t.value);var n;this.callback(e),this.close()}close(){this.el.remove()}show(){this.el=c("div",{attributes:{class:"edith-modal"}});const t=c("div",{attributes:{class:"edith-modal-header"}}),e=c("span",{textContent:this.title,attributes:{class:"edith-modal-title"}});t.append(e);const n=c("div",{attributes:{class:"edith-modal-content"}});for(const t of this.fields)switch(t.fieldType){case K.input:n.append(_(t));break;case K.checkbox:n.append(F(t));break;default:throw new Error(`Unknown fieldType ${t.fieldType}`)}const i=c("div",{attributes:{class:"edith-modal-footer"}}),o=c("button",{textContent:"Annuler",attributes:{class:"edith-modal-cancel",type:"button"}});i.append(o);const s=c("button",{textContent:"Valider",attributes:{class:"edith-modal-submit",type:"button"}});return i.append(s),this.el.append(t),this.el.append(n),this.el.append(i),this.ctx.modals.append(this.el),o.onclick=this.cancel.bind(this),s.onclick=this.submit.bind(this),this.el}}class X{el;ctx;content;height;resizable;mode;visualEditor;codeEditor;codeMirror;history;throttledSnapshots;constructor(t,e){this.ctx=t,this.content=e.initialContent,this.height=e.height,this.resizable=e.resizable,this.mode=B.Visual,this.history=new V,this.throttledSnapshots=function(t,e,n={}){return T(t,e,{leading:!("leading"in n)||!!n.leading,trailing:!("trailing"in n)||!!n.trailing,maxWait:e})}((()=>this.takeSnapshot()),3e3,{leading:!1,trailing:!0}),this.content=this.content.replace(/ /g,'<span class="edith-nbsp" contenteditable="false">¶</span>')}render(){this.el=c("div",{attributes:{class:"edith-editing-area",style:this.resizable?`min-height: ${this.height}px; resize: vertical`:`height: ${this.height}px`}}),this.visualEditor=c("div",{innerHTML:this.content,attributes:{class:"edith-visual",contenteditable:"true",style:this.resizable?`min-height: ${this.height-10}px`:`height: ${this.height-10}px`}}),this.el.append(this.visualEditor),this.codeEditor=c("div",{attributes:{class:"edith-code edith-hidden"}}),this.el.append(this.codeEditor);const t=this.onKeyEvent.bind(this);this.visualEditor.addEventListener("keydown",t),this.visualEditor.addEventListener("keyup",t);const e=this.onPasteEvent.bind(this);return this.visualEditor.addEventListener("paste",e),this.el}getVisualEditorElement(){return this.visualEditor}getCodeEditorElement(){return this.codeEditor}setContent(t){t=t.replace(/ /g,'<span class="edith-nbsp" contenteditable="false">¶</span>'),this.mode===B.Visual?this.visualEditor.innerHTML=t:this.codeMirror.dispatch({changes:{from:0,to:this.codeMirror.state.doc.length,insert:t}})}getContent(){const t=this.mode===B.Visual?this.visualEditor.innerHTML:this.codeMirror.state.doc.toJSON().map((t=>t.trim())).join("\n");if("<p><br></p>"===t)return"";const e=c("div",{innerHTML:t});f(e,(t=>n(t)&&!u(t.tagName)&&(null===t.textContent||0===t.textContent.length)));for(const t of e.querySelectorAll("[style]"))t.removeAttribute("style");for(const t of e.querySelectorAll("span"))0===t.attributes.length&&d(t);return e.innerHTML.replace(/\u200B/gi,"").replace(/<\/p>\s*<p>/gi,"<br>").replace(/(<p>|<\/p>)/gi,"").replace(/<span[^>]+class="edith-nbsp"[^>]*>[^<]*<\/span>/gi," ").replace(/(?:<br\s?\/?>)+$/gi,"")}takeSnapshot(){this.history.push(this.visualEditor.innerHTML)}restoreSnapshot(){this.visualEditor.innerHTML=this.history.pop()??""}wrapInsideTag(t){H(this.visualEditor)&&(I(t),this.takeSnapshot())}replaceByHtml(t){H(this.visualEditor)&&(!function(t){const{sel:e,range:n}=M();if(void 0===n)return;const i=document.createDocumentFragment(),o=c("div",{innerHTML:t});i.append(...o.childNodes);const s=i.childNodes[i.childNodes.length-1];e.deleteFromDocument(),n.insertNode(i),L(s)}(t),this.takeSnapshot())}clearStyle(){!function(){const{sel:t,range:e}=M();if(void 0!==e&&n(e.commonAncestorContainer))for(const n of[...e.commonAncestorContainer.children])t.containsNode(n,!0)&&h(n)}(),this.takeSnapshot()}insertLink(){const{sel:t,range:e}=M();if(void 0===e)return;const i=new Q(this.ctx,{title:"Insérer un lien",fields:[G("Texte à afficher","text",e.toString()),G("URL du lien","href"),J("Ouvrir dans une nouvelle fenêtre","openInNewTab",!0)],callback:i=>{null!==i&&(function(t){const e=window.getSelection();e.removeAllRanges(),void 0!==t.range&&e.addRange(t.range)}({sel:t,range:e}),function(t,e,i){const o=I("a",{textContent:t});if(void 0!==o)n(o)&&(o.setAttribute("href",e),!0===i&&o.setAttribute("target","_blank"))}(i.text,i.href,i.openInNewTab))}});i.show()}toggleCodeView(){if(this.mode===B.Visual){this.mode=B.Code,this.visualEditor.classList.add("edith-hidden"),this.codeEditor.classList.remove("edith-hidden");const t=document.createElement("div");this.codeEditor.append(t),this.codeMirror=new W.EditorView({doc:this.visualEditor.innerHTML,extensions:[W.basicSetup,W.EditorView.lineWrapping,(0,W.html)({matchClosingTags:!0,autoCloseTags:!0})],parent:t})}else this.mode=B.Visual,this.codeEditor.classList.add("edith-hidden"),this.visualEditor.classList.remove("edith-hidden"),this.visualEditor.innerHTML=this.codeMirror.state.doc.toJSON().map((t=>t.trim())).join("\n"),this.codeMirror.destroy(),this.codeMirror=void 0,this.codeEditor.innerHTML="";this.ctx.trigger(z.modeChanged,{mode:this.mode})}onKeyEvent(t){(t.metaKey||t.ctrlKey?this._processKeyEventWithMeta(t):this._processKeyEvent(t))&&(t.preventDefault(),t.stopPropagation())}_processKeyEvent(t){return"Enter"===t.key?("keydown"===t.type&&this.replaceByHtml("<br />"),!0):(this.throttledSnapshots(),!1)}_processKeyEventWithMeta(t){switch(t.key){case"Enter":return"keydown"===t.type&&this.replaceByHtml("<br />"),!0;case" ":return"keydown"===t.type&&this.replaceByHtml('<span class="edith-nbsp" contenteditable="false">¶</span>'),!0;case"b":return"keydown"===t.type&&this.wrapInsideTag("b"),!0;case"i":return"keydown"===t.type&&this.wrapInsideTag("i"),!0;case"k":return"keydown"===t.type&&this.insertLink(),!0;case"u":return"keydown"===t.type&&this.wrapInsideTag("u"),!0;case"s":return"keydown"===t.type&&this.wrapInsideTag("s"),!0;case"z":return"keydown"===t.type&&this.restoreSnapshot(),!0}return!1}onPasteEvent(t){t.preventDefault(),t.stopPropagation();const{sel:n,range:i}=M();if(void 0===i||null===t.clipboardData)return;const o=document.createDocumentFragment();if(t.clipboardData.types.includes("text/html")){let i=e(n.anchorNode)?n.anchorNode.parentNode:n.anchorNode;const s={B:!1,I:!1,U:!1,S:!1,Q:!1};for(;null!==i&&!a(i,"edith-visual");)r(i,["b","i","u","s","q"])&&(s[(i.tagName,"Q")]=!0),i=i.parentNode;let c=t.clipboardData.getData("text/html").replace(/[\r\n]+/g," ");/^<html>\s*<body>/.test(c)||(c="<html><body>"+c+"</body></html>");const l=D(c,s);o.append(...l.childNodes)}else{const e=t.clipboardData.getData("text/plain").split(/[\r\n]+/g);for(let t=0;t<e.length;t++)0!==t&&o.append(document.createElement("br")),o.append(document.createTextNode(e[t]))}n.deleteFromDocument(),i.insertNode(o)}destroy(){this.codeMirror?.destroy(),this.codeMirror=void 0,this.el.remove()}}class Y{element;toolbar;editor;modals;constructor(t,e){var n,i;this.element=t,n=this.element,"string"==typeof(i="edith")?n.classList.add(i):n.classList.add(...i),this.toolbar=c("div",{attributes:{class:"edith-toolbar"}}),this.element.append(this.toolbar);const o=e.buttons??U.buttons,s=e.toolbar??U.toolbar;for(const{0:t,1:e}of s){const n=document.createElement("div");n.setAttribute("id",t),n.setAttribute("class","edith-btn-group"),this.toolbar.append(n);for(const t of e){const e=o[t]??q[t];n.append(e(this).render())}}this.editor=new X(this,{initialContent:e.initialContent??U.initialContent,height:e.height??U.height,resizable:e.resizable??U.resizable}),this.element.append(this.editor.render()),this.modals=c("div",{attributes:{class:"edith-modals"}}),this.element.append(this.modals),this.element.edith=this,this.trigger(z.initialized)}on(t,e){!function(t,e,n){if(t instanceof NodeList)for(const i of t)w(i,e,n);else w(t,e,n)}(this.element,t,e)}off(t,e){!function(t,e,n){if(t instanceof NodeList)for(const i of t)C(i,e,n);else C(t,e,n)}(this.element,t,e)}trigger(t,e){!function(t,e,n){t.dispatchEvent("string"==typeof e?new CustomEvent(e,{detail:n}):e)}(this.element,t,e)}setContent(t){this.editor.setContent(t)}getContent(){return this.editor.getContent()}destroy(){var t,e;t=this.element,"string"==typeof(e="edith")?t.classList.remove(e):t.classList.remove(...e),this.modals.remove(),this.editor.destroy(),this.toolbar.remove(),this.element.remove()}}Y.EdithButton=P;var Z=Y}(),s=s.default}()}));
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("CodeMirror"),require("Popper")):"function"==typeof define&&define.amd?define(["CodeMirror","Popper"],e):"object"==typeof exports?exports.Edith=e(require("CodeMirror"),require("Popper")):t.Edith=e(t.CodeMirror,t.Popper)}(self,(function(t,e){return function(){"use strict";var n={690:function(e){e.exports=t},74:function(t){t.exports=e}},i={};function o(t){var e=i[t];if(void 0!==e)return e.exports;var s=i[t]={exports:{}};return n[t](s,s.exports,o),s.exports}o.d=function(t,e){for(var n in e)o.o(e,n)&&!o.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},o.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)};var s={};function r(t,e){return c(t)&&t.tagName===e.toUpperCase()}function a(t){return t.nodeType===Node.TEXT_NODE}function c(t){return t.nodeType===Node.ELEMENT_NODE}function l(t,e){return t.getAttribute(e)}function d(t,e){return"string"==typeof e?t.tagName===e.toUpperCase():e.some((e=>t.tagName===e.toUpperCase()))}function h(t,e){return t.classList.contains(e)}function u(t,{innerHTML:e,textContent:n,attributes:i}={}){const o=document.createElement(t);if(i)for(const t in i)Object.hasOwnProperty.call(i,t)&&o.setAttribute(t,i[t]);return"string"==typeof e?o.innerHTML=e:"string"==typeof n&&(o.textContent=n),o}function p(t,e){return t.replaceWith(e),e}function f(t){const e=[...t.childNodes];return t.replaceWith(...e),e}function m(t){const e=document.createTextNode(t.textContent??"");return t.replaceWith(e),e}function b(t){return["AREA","BASE","BR","COL","EMBED","HR","IMG","INPUT","KEYGEN","LINK","META","PARAM","SOURCE","TRACK","WBR"].includes(t)}function g(t,e){for(const n of[...t.childNodes])e(n)&&n.remove()}function v(t,e){if(e(t))t.remove();else for(const n of[...t.childNodes])v(n,e)}function y(t){g(t,(t=>function(t){return t.nodeType===Node.COMMENT_NODE}(t)))}function E(t,e){for(const n of t.getAttributeNames())void 0===e[n]&&t.removeAttribute(n);for(const n of Object.keys(e))t.setAttribute(n,e[n])}function w(t){const e=t.getAttribute("style")||"";return(d(t,"b")&&e.match(/font-weight\s*:\s*(normal|400);/)||d(t,"i")&&e.match(/font-style\s*:\s*normal;/)||d(t,["u","s"])&&e.match(/text-decoration\s*:\s*none;/))&&(t=p(t,u("span",{attributes:{style:e},innerHTML:t.innerHTML}))),e.match(/font-weight\s*:\s*(bold|700|800|900);/)?t=p(t,u("b",{innerHTML:`<span style="${e.replace(/font-weight\s*:\s*(bold|700|800|900);/,"")}">${t.innerHTML}</span>`})):e.match(/font-style\s*:\s*italic;/)?t=p(t,u("i",{innerHTML:`<span style="${e.replace(/font-style\s*:\s*italic;/,"")}">${t.innerHTML}</span>`})):e.match(/text-decoration\s*:\s*underline;/)?t=p(t,u("u",{innerHTML:`<span style="${e.replace(/text-decoration\s*:\s*underline;/,"")}">${t.innerHTML}</span>`})):e.match(/text-decoration\s*:\s*line-through;/)&&(t=p(t,u("s",{innerHTML:`<span style="${e.replace(/text-decoration\s*:\s*line-through;/,"")}">${t.innerHTML}</span>`}))),t}function C(t,e){const n=t.childNodes;for(;n.length>0&&r(n[0],e);)n[0].remove();for(;n.length>0&&r(n[n.length-1],e);)n[n.length-1].remove()}o.d(s,{default:function(){return it}});let x=0;function k(t){const[e,...n]=t.split(".");return{type:e,ns:n??null}}function T(t,e,n){void 0===t.ljbtEvents&&(t.ljbtEvents={});for(const i of e.split(" ")){const{type:e,ns:o}=k(i),s=(++x).toString(10);t.addEventListener(e,n),t.ljbtEvents[s]={type:e,ns:o,handler:n}}}function N(t,e,n){void 0===t.ljbtEvents&&(t.ljbtEvents={});for(const i of e.split(" ")){const{type:e,ns:o}=k(i);for(const[i,s]of Object.entries(t.ljbtEvents))s.type!==e&&"*"!==e||null!==o&&!s.ns?.includes(o[0])||void 0!==n&&("function"!=typeof n||n!==s.handler)||(delete t.ljbtEvents[i],t.removeEventListener(s.type,s.handler))}}function M(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)t[i]=n[i]}return t}var A;(function t(e,n){function i(t,i,o){if("undefined"!=typeof document){"number"==typeof(o=M({},n,o)).expires&&(o.expires=new Date(Date.now()+864e5*o.expires)),o.expires&&(o.expires=o.expires.toUTCString()),t=encodeURIComponent(t).replace(/%(2[346B]|5E|60|7C)/g,decodeURIComponent).replace(/[()]/g,escape);var s="";for(var r in o)o[r]&&(s+="; "+r,!0!==o[r]&&(s+="="+o[r].split(";")[0]));return document.cookie=t+"="+e.write(i,t)+s}}return Object.create({set:i,get:function(t){if("undefined"!=typeof document&&(!arguments.length||t)){for(var n=document.cookie?document.cookie.split("; "):[],i={},o=0;o<n.length;o++){var s=n[o].split("="),r=s.slice(1).join("=");try{var a=decodeURIComponent(s[0]);if(i[a]=e.read(r,a),t===a)break}catch(t){}}return t?i[t]:i}},remove:function(t,e){i(t,"",M({},e,{expires:-1}))},withAttributes:function(e){return t(this.converter,M({},this.attributes,e))},withConverter:function(e){return t(M({},this.converter,e),this.attributes)}},{attributes:{value:Object.freeze(n)},converter:{value:Object.freeze(e)}})})({read:function(t){return'"'===t[0]&&(t=t.slice(1,-1)),t.replace(/(%[\dA-F]{2})+/gi,decodeURIComponent)},write:function(t){return encodeURIComponent(t).replace(/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,decodeURIComponent)}},{path:"/"});!function(t){t[t.localStorage=1]="localStorage",t[t.cookies=2]="cookies"}(A||(A={}));function L(t,e,n={}){let i,o,s,r,a,c=0;const l=!!n.leading,d="maxWait"in n,h=d?Math.max(n.maxWait||0,e):void 0,u=!("trailing"in n)||!!n.trailing;function p(e){const n=i,r=o;return i=o=void 0,c=e,s=t.apply(r,n),s}function f(t,e){return setTimeout(t,e)}function m(t){const n=t-a;return void 0===a||n>=e||n<0||d&&t-c>=h}function b(){const t=Date.now();if(m(t))return function(t){if(r=void 0,u&&i)return p(t);return i=o=void 0,s}(t);r=f(b,function(t){const n=t-c,i=e-(t-a);return d?Math.min(i,h-n):i}(t))}return function(...t){const n=Date.now(),h=m(n);if(i=t,o=this,a=n,h){if(void 0===r)return function(t){return c=t,r=f(b,e),l?p(t):s}(a);if(d)return r=f(b,e),p(a)}return void 0===r&&(r=f(b,e)),s}}const S=/[&<>"']/g;RegExp(S.source),Object.freeze({"&":"&","<":"<",">":">",'"':""","'":"'"});function H(){const t=window.getSelection();return{sel:t,range:t.rangeCount?t.getRangeAt(0):void 0}}function R(t){const e=document.createRange(),n=window.getSelection();e.setStart(t,1),e.collapse(!0),n.removeAllRanges(),n.addRange(e)}function O(t){const e=document.createRange(),n=window.getSelection();e.setStartAfter(t),e.collapse(!0),n.removeAllRanges(),n.addRange(e)}function I(t){if(1===t.length&&c(t[0])&&b(t[0].tagName))return void O(t[0]);const e=document.createRange(),n=window.getSelection();e.setStartBefore(t[0]),e.setEndAfter(t[t.length-1]),n.removeAllRanges(),n.addRange(e)}function j(t){const{range:e}=H();return void 0!==e&&(t.contains(e.startContainer)&&t.contains(e.endContainer))}function D(t,e){const n=e.parentNode,i=t.cloneRange();i.setStart(n,0);const o=i.extractContents(),s=document.createTextNode("");return o.append(s),n.prepend(o),R(s),s}function z(t,e){const n=e.parentNode,i=new Range;i.selectNodeContents(n),i.setEnd(t.startContainer,t.startOffset);const o=new Range;o.selectNodeContents(n),o.setStart(t.endContainer,t.endOffset);const s=i.extractContents(),r=o.extractContents();n.prepend(s),n.append(r);let a=c(t.commonAncestorContainer)?t.commonAncestorContainer:t.commonAncestorContainer.parentNode;for(;a.tagName!==e.tagName;)a=a.parentNode;const l=f(a);return I(l),l[0].parentNode}function B(t,e={}){const{sel:n,range:i}=H();if(void 0===i)return;if(i.collapsed){let o=n.anchorNode.parentNode;for(;!h(o,"edith-visual");){if(d(o,t))return D(i,o);o=o.parentNode}return function(t,e,n={}){const i=document.createElement(e);return"a"===e?i.textContent=n.textContent||"lien":i.innerHTML="",t.insertNode(i),"a"===e&&i.insertAdjacentText("afterend"," "),R(i),i}(i,t,e)}let o=i.commonAncestorContainer;for(;!c(o)||!h(o,"edith-visual");){if(c(o)&&d(o,t))return z(i,o);o=o.parentNode}for(const e of[...o.getElementsByTagName(t)])if(n.containsNode(e,!0)){return I(f(e)),o.normalize(),o}const s=document.createElement(t);return s.appendChild(i.extractContents()),i.insertNode(s),g(o,(t=>c(t)&&!b(t.tagName)&&(null===t.textContent||0===t.textContent.length))),function(t){const e=document.createRange(),n=window.getSelection();e.selectNodeContents(t),e.collapse(!1),n.removeAllRanges(),n.addRange(e)}(s),s}function V(t,e){for(let n of[...t.children]){if(d(n,"span")&&h(n,"edith-nbsp")){E(n,{class:"edith-nbsp",contenteditable:"false"}),n.innerHTML="¶";continue}n.hasAttribute("style")&&(n=w(n)),e[n.tagName]&&(n=p(n,u("span",{attributes:{style:n.getAttribute("style")||""},innerHTML:n.innerHTML})));const t={...e};if(d(n,["b","i","q","u","s"])&&(t[n.tagName]=!0),V(n,t),d(n,"a")){const t={};n.hasAttribute("href")&&(t.href=n.getAttribute("href")),n.hasAttribute("target")&&(t.target=n.getAttribute("target")),E(n,t)}else if(d(n,["b","i","q","u","s","br","sup"]))E(n,{});else if(d(n,["style","meta","link"]))n.remove();else if(d(n,"p")){if(null===n.textContent||0===n.textContent.trim().length){n.remove();continue}E(n,{}),C(n,"br")}else f(n)}}function U(t,e){const n=document.createElement("div");return n.innerHTML=t,V(n,e),n.normalize(),g(n,(t=>a(t)&&(null===t.textContent||0===t.textContent.trim().length))),n.innerHTML=n.innerHTML.replace(/\s* \s*/g," ").replace(/\s+/g," ").replace(/(<\/b>[\n\r\s]*<b>|<\/i>[\n\r\s]*<i>|<\/u>[\n\r\s]*<u>|<\/s>[\n\r\s]*<s>)/g," "),y(n),n}var $,P;!function(t){t.modeChanged="edith-mode-changed",t.initialized="edith-initialized"}($||($={}));class q{buffer=[];constructor(){}push(t){this.buffer.push(t),this.buffer.length>20&&this.buffer.shift()}pop(){return 0===this.buffer.length?null:this.buffer.pop()}}!function(t){t[t.Visual=1]="Visual",t[t.Code=2]="Code"}(P||(P={}));const K={height:80,resizable:!1,toolbar:[["style",["bold","italic","underline","strikethrough"]]],buttons:{},initialContent:""};var W=o(74);class _{el;ctx;icon;title;onclick;showOnCodeView;popperEl;popper;constructor(t,e){this.ctx=t,this.icon=e.icon,this.title=e.title,this.onclick=e.onclick,this.showOnCodeView=!0===e.showOnCodeView}click(t){t.preventDefault(),this.onclick(this.ctx,t)}showTooltip(){if(void 0!==this.popper)return;this.popperEl=u("div",{textContent:this.title,attributes:{class:"edith-tooltip"}});const t=u("div",{attributes:{class:"arrow","data-popper-arrow":""}});this.popperEl.append(t),this.ctx.toolbar.append(this.popperEl),this.popper=(0,W.createPopper)(this.el,this.popperEl,{placement:"bottom",modifiers:[{name:"arrow",options:{padding:5}},{name:"offset",options:{offset:[0,8]}}]})}hideTooltip(){void 0!==this.popper&&(this.popper.destroy(),this.popper=void 0,this.popperEl?.remove())}onEditorModeChange(t){t.detail.mode===P.Code?this.el.setAttribute("disabled","disabled"):this.el.removeAttribute("disabled")}render(){return this.el=u("button",{attributes:{class:`edith-btn ${this.icon}`,type:"button"}}),this.el.onclick=this.click.bind(this),this.el.onmouseenter=this.showTooltip.bind(this),this.el.onmouseleave=this.hideTooltip.bind(this),!0!==this.showOnCodeView&&this.ctx.on($.modeChanged,this.onEditorModeChange.bind(this)),this.el}}const F=Object.freeze({bold:t=>new _(t,{icon:"fa-solid fa-bold",title:"Gras",onclick:t=>{t.editor.wrapInsideTag("b")}}),italic:t=>new _(t,{icon:"fa-solid fa-italic",title:"Italique",onclick:t=>{t.editor.wrapInsideTag("i")}}),underline:t=>new _(t,{icon:"fa-solid fa-underline",title:"Souligner",onclick:t=>{t.editor.wrapInsideTag("u")}}),strikethrough:t=>new _(t,{icon:"fa-solid fa-strikethrough",title:"Barrer",onclick:t=>{t.editor.wrapInsideTag("s")}}),subscript:t=>new _(t,{icon:"fa-solid fa-subscript",title:"Indice",onclick:t=>{t.editor.wrapInsideTag("sub")}}),superscript:t=>new _(t,{icon:"fa-solid fa-superscript",title:"Exposant",onclick:t=>{t.editor.wrapInsideTag("sup")}}),nbsp:t=>new _(t,{icon:"edith-btn-nbsp",title:"Ajouter une espace insécable",onclick:t=>{t.editor.replaceByHtml('<span class="edith-nbsp" contenteditable="false">¶</span>')}}),clear:t=>new _(t,{icon:"fa-solid fa-eraser",title:"Effacer la mise en forme",onclick:t=>{t.editor.clearStyle()}}),link:t=>new _(t,{icon:"fa-solid fa-link",title:"Lien",onclick:t=>{t.editor.insertLink()}}),codeview:t=>new _(t,{icon:"fa-solid fa-code",title:"Afficher le code HTML",onclick:t=>{t.editor.toggleCodeView()},showOnCodeView:!0})});var G,J=o(690);function Q(t){const e=document.createElement("div");e.setAttribute("class","edith-modal-input");const n=document.createElement("label");n.textContent=t.label;const i=document.createElement("input");return i.setAttribute("name",t.name),i.setAttribute("type","text"),null!==t.initialState&&(i.value=t.initialState.toString()),e.append(n),e.append(i),e}function X(t){const e=document.createElement("div");e.setAttribute("class","edith-modal-checkbox");const n=document.createElement("label");n.textContent=t.label;const i=document.createElement("input");return i.setAttribute("name",t.name),i.setAttribute("type","checkbox"),t.initialState&&(i.checked=!0),n.prepend(i),e.append(n),e}function Y(t,e,n=null){return{fieldType:G.input,label:t,name:e,initialState:n}}function Z(t,e,n=!1){return{fieldType:G.checkbox,label:t,name:e,initialState:n}}!function(t){t[t.input=1]="input",t[t.checkbox=2]="checkbox"}(G||(G={}));class tt{el;ctx;title;fields;callback;constructor(t,e){this.ctx=t,this.title=e.title,this.fields=e.fields||[],this.callback=e.callback}cancel(t){t.preventDefault(),this.callback(null),this.close()}submit(t){t.preventDefault();const e={};for(const t of this.el.querySelectorAll("input"))n="name",t.hasAttribute(n)&&(e[l(t,"name")]="checkbox"===l(t,"type")?t.checked:t.value);var n;this.callback(e),this.close()}close(){this.el.remove()}show(){this.el=u("div",{attributes:{class:"edith-modal"}});const t=u("div",{attributes:{class:"edith-modal-header"}}),e=u("span",{textContent:this.title,attributes:{class:"edith-modal-title"}});t.append(e);const n=u("div",{attributes:{class:"edith-modal-content"}});for(const t of this.fields)switch(t.fieldType){case G.input:n.append(Q(t));break;case G.checkbox:n.append(X(t));break;default:throw new Error(`Unknown fieldType ${t.fieldType}`)}const i=u("div",{attributes:{class:"edith-modal-footer"}}),o=u("button",{textContent:"Annuler",attributes:{class:"edith-modal-cancel",type:"button"}});i.append(o);const s=u("button",{textContent:"Valider",attributes:{class:"edith-modal-submit",type:"button"}});return i.append(s),this.el.append(t),this.el.append(n),this.el.append(i),this.ctx.modals.append(this.el),o.onclick=this.cancel.bind(this),s.onclick=this.submit.bind(this),this.el}}class et{el;ctx;content;height;resizable;mode;visualEditor;codeEditor;codeMirror;history;throttledSnapshots;constructor(t,e){this.ctx=t,this.content=e.initialContent,this.height=e.height,this.resizable=e.resizable,this.mode=P.Visual,this.history=new q,this.throttledSnapshots=function(t,e,n={}){return L(t,e,{leading:!("leading"in n)||!!n.leading,trailing:!("trailing"in n)||!!n.trailing,maxWait:e})}((()=>this.takeSnapshot()),3e3,{leading:!1,trailing:!0}),this.content=this.content.replace(/ /g,'<span class="edith-nbsp" contenteditable="false">¶</span>')}render(){this.el=u("div",{attributes:{class:"edith-editing-area",style:this.resizable?`min-height: ${this.height}px; resize: vertical`:`height: ${this.height}px`}}),this.visualEditor=u("div",{innerHTML:this.content,attributes:{class:"edith-visual",contenteditable:"true",style:this.resizable?`min-height: ${this.height-10}px`:`height: ${this.height-10}px`}}),this.el.append(this.visualEditor),this.codeEditor=u("div",{attributes:{class:"edith-code edith-hidden"}}),this.el.append(this.codeEditor);const t=this.onKeyEvent.bind(this);this.visualEditor.addEventListener("keydown",t),this.visualEditor.addEventListener("keyup",t);const e=this.onPasteEvent.bind(this);return this.visualEditor.addEventListener("paste",e),this.el}getVisualEditorElement(){return this.visualEditor}getCodeEditorElement(){return this.codeEditor}setContent(t){t=t.replace(/ /g,'<span class="edith-nbsp" contenteditable="false">¶</span>'),this.mode===P.Visual?this.visualEditor.innerHTML=t:this.codeMirror.dispatch({changes:{from:0,to:this.codeMirror.state.doc.length,insert:t}})}getContent(){const t=this.mode===P.Visual?this.visualEditor.innerHTML:this.codeMirror.state.doc.toJSON().map((t=>t.trim())).join("\n");if("<p><br></p>"===t)return"";const e=u("div",{innerHTML:t});v(e,(t=>c(t)&&!b(t.tagName)&&(null===t.textContent||0===t.textContent.length)));for(const t of e.querySelectorAll("[style]"))t.removeAttribute("style");for(const t of e.querySelectorAll("span"))0===t.attributes.length&&f(t);return e.innerHTML.replace(/\u200B/gi,"").replace(/<\/p>\s*<p>/gi,"<br>").replace(/(<p>|<\/p>)/gi,"").replace(/<span[^>]+class="edith-nbsp"[^>]*>[^<]*<\/span>/gi," ").replace(/(?:<br\s?\/?>)+$/gi,"")}takeSnapshot(){this.history.push(this.visualEditor.innerHTML)}restoreSnapshot(){this.visualEditor.innerHTML=this.history.pop()??""}wrapInsideTag(t){j(this.visualEditor)&&(B(t),this.takeSnapshot())}replaceByHtml(t){j(this.visualEditor)&&(!function(t){const{sel:e,range:n}=H();if(void 0===n)return;const i=document.createDocumentFragment(),o=u("div",{innerHTML:t});i.append(...o.childNodes);const s=i.childNodes[i.childNodes.length-1];e.deleteFromDocument(),n.insertNode(i),O(s)}(t),this.takeSnapshot())}clearStyle(){!function(){const{sel:t,range:e}=H();if(void 0!==e&&c(e.commonAncestorContainer))for(const n of[...e.commonAncestorContainer.children])t.containsNode(n,!0)&&m(n)}(),this.takeSnapshot()}insertLink(){const{sel:t,range:e}=H();if(void 0===e)return;const n=new tt(this.ctx,{title:"Insérer un lien",fields:[Y("Texte à afficher","text",e.toString()),Y("URL du lien","href"),Z("Ouvrir dans une nouvelle fenêtre","openInNewTab",!0)],callback:n=>{null!==n&&(function(t){const e=window.getSelection();e.removeAllRanges(),void 0!==t.range&&e.addRange(t.range)}({sel:t,range:e}),function(t,e,n){const i=B("a",{textContent:t});if(void 0!==i)c(i)&&(i.setAttribute("href",e),!0===n&&i.setAttribute("target","_blank"))}(n.text,n.href,n.openInNewTab))}});n.show()}toggleCodeView(){if(this.mode===P.Visual){this.mode=P.Code,this.visualEditor.classList.add("edith-hidden"),this.codeEditor.classList.remove("edith-hidden");const t=document.createElement("div");this.codeEditor.append(t),this.codeMirror=new J.EditorView({doc:this.visualEditor.innerHTML,extensions:[J.basicSetup,J.EditorView.lineWrapping,(0,J.html)({matchClosingTags:!0,autoCloseTags:!0})],parent:t})}else this.mode=P.Visual,this.codeEditor.classList.add("edith-hidden"),this.visualEditor.classList.remove("edith-hidden"),this.visualEditor.innerHTML=this.codeMirror.state.doc.toJSON().map((t=>t.trim())).join("\n"),this.codeMirror.destroy(),this.codeMirror=void 0,this.codeEditor.innerHTML="";this.ctx.trigger($.modeChanged,{mode:this.mode})}onKeyEvent(t){(t.metaKey||t.ctrlKey?this._processKeyEventWithMeta(t):this._processKeyEvent(t))&&(t.preventDefault(),t.stopPropagation())}_processKeyEvent(t){return"Enter"===t.key?("keydown"===t.type&&this.replaceByHtml("<br />"),!0):(this.throttledSnapshots(),!1)}_processKeyEventWithMeta(t){switch(t.key){case"Enter":return"keydown"===t.type&&this.replaceByHtml("<br />"),!0;case" ":return"keydown"===t.type&&this.replaceByHtml('<span class="edith-nbsp" contenteditable="false">¶</span>'),!0;case"b":return"keydown"===t.type&&this.wrapInsideTag("b"),!0;case"i":return"keydown"===t.type&&this.wrapInsideTag("i"),!0;case"k":return"keydown"===t.type&&this.insertLink(),!0;case"u":return"keydown"===t.type&&this.wrapInsideTag("u"),!0;case"s":return"keydown"===t.type&&this.wrapInsideTag("s"),!0;case"z":return"keydown"===t.type&&this.restoreSnapshot(),!0}return!1}onPasteEvent(t){t.preventDefault(),t.stopPropagation();const{sel:e,range:n}=H();if(void 0===n||null===t.clipboardData)return;const i=document.createDocumentFragment();if(t.clipboardData.types.includes("text/html")){let n=a(e.anchorNode)?e.anchorNode.parentNode:e.anchorNode;const o={B:!1,I:!1,U:!1,S:!1,Q:!1};for(;null!==n&&!h(n,"edith-visual");)d(n,["b","i","u","s","q"])&&(o[(n.tagName,"Q")]=!0),n=n.parentNode;let s=t.clipboardData.getData("text/html").replace(/[\r\n]+/g," ");/^<html>\s*<body>/.test(s)||(s="<html><body>"+s+"</body></html>");const r=U(s,o);i.append(...r.childNodes)}else{const e=t.clipboardData.getData("text/plain").split(/[\r\n]+/g);for(let t=0;t<e.length;t++)0!==t&&i.append(document.createElement("br")),i.append(document.createTextNode(e[t]))}e.deleteFromDocument(),n.insertNode(i)}destroy(){this.codeMirror?.destroy(),this.codeMirror=void 0,this.el.remove()}}class nt{element;toolbar;editor;modals;constructor(t,e){var n,i;this.element=t,n=this.element,"string"==typeof(i="edith")?n.classList.add(i):n.classList.add(...i),this.toolbar=u("div",{attributes:{class:"edith-toolbar"}}),this.element.append(this.toolbar);const o=e.buttons??K.buttons,s=e.toolbar??K.toolbar;for(const{0:t,1:e}of s){const n=document.createElement("div");n.setAttribute("id",t),n.setAttribute("class","edith-btn-group"),this.toolbar.append(n);for(const t of e){const e=o[t]??F[t];n.append(e(this).render())}}this.editor=new et(this,{initialContent:e.initialContent??K.initialContent,height:e.height??K.height,resizable:e.resizable??K.resizable}),this.element.append(this.editor.render()),this.modals=u("div",{attributes:{class:"edith-modals"}}),this.element.append(this.modals),this.element.edith=this,this.trigger($.initialized)}on(t,e){!function(t,e,n){if(t instanceof NodeList)for(const i of t)T(i,e,n);else T(t,e,n)}(this.element,t,e)}off(t,e){!function(t,e,n){if(t instanceof NodeList)for(const i of t)N(i,e,n);else N(t,e,n)}(this.element,t,e)}trigger(t,e){!function(t,e,n){t.dispatchEvent("string"==typeof e?new CustomEvent(e,{detail:n}):e)}(this.element,t,e)}setContent(t){this.editor.setContent(t)}getContent(){return this.editor.getContent()}destroy(){var t,e;t=this.element,"string"==typeof(e="edith")?t.classList.remove(e):t.classList.remove(...e),this.modals.remove(),this.editor.destroy(),this.toolbar.remove(),this.element.remove()}}nt.EdithButton=_;var it=nt;return s=s.default}()}));
|
package/dist/css/edith.scss
CHANGED
|
@@ -24,260 +24,260 @@ $color-modal-submit-color: #fff;
|
|
|
24
24
|
$color-modal-submit-border: #0d6efd;
|
|
25
25
|
|
|
26
26
|
.edith {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
background-color: $color-toolbar;
|
|
28
|
+
border: 1px solid $color-toolbar-border;
|
|
29
|
+
border-radius: 0.25rem;
|
|
30
|
+
padding: 5px;
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
.edith-toolbar {
|
|
34
|
-
|
|
34
|
+
background-color: $color-toolbar;
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
.edith-btn {
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
38
|
+
background-color: $color-button;
|
|
39
|
+
border: 1px solid $color-button-border;
|
|
40
|
+
border-radius: 0.25rem;
|
|
41
|
+
color: $color-button-text;
|
|
42
|
+
cursor: pointer;
|
|
43
|
+
display: inline-block;
|
|
44
|
+
font-size: 1rem;
|
|
45
|
+
font-weight: 900;
|
|
46
|
+
line-height: 1.5;
|
|
47
|
+
padding: 0.375rem 0.75rem;
|
|
48
|
+
text-align: center;
|
|
49
|
+
text-decoration: none;
|
|
50
|
+
user-select: none;
|
|
51
|
+
vertical-align: middle;
|
|
52
|
+
|
|
53
|
+
&:disabled {
|
|
54
|
+
color: color.scale($color-button-text, $lightness: 70%);
|
|
55
|
+
cursor: not-allowed;
|
|
56
|
+
}
|
|
57
57
|
}
|
|
58
58
|
|
|
59
59
|
.edith-btn-group {
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
60
|
+
display: inline-flex;
|
|
61
|
+
position: relative;
|
|
62
|
+
vertical-align: middle;
|
|
63
|
+
|
|
64
|
+
&:not(:first-child) {
|
|
65
|
+
margin-left: 10px;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
:not(:first-child) {
|
|
69
|
+
margin-left: -1px;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.edith-btn:not(:last-child) {
|
|
73
|
+
border-bottom-right-radius: 0;
|
|
74
|
+
border-top-right-radius: 0;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.edith-btn:not(:first-child) {
|
|
78
|
+
border-bottom-left-radius: 0;
|
|
79
|
+
border-top-left-radius: 0;
|
|
80
|
+
}
|
|
81
81
|
}
|
|
82
82
|
|
|
83
83
|
.edith-btn-nbsp {
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
84
|
+
&::before {
|
|
85
|
+
content: "\0020";
|
|
86
|
+
display: block;
|
|
87
|
+
height: 16px;
|
|
88
|
+
width: 12px;
|
|
89
|
+
}
|
|
90
90
|
}
|
|
91
91
|
|
|
92
92
|
.edith-tooltip {
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
93
|
+
background: $color-tooltip;
|
|
94
|
+
border-radius: 4px;
|
|
95
|
+
color: $color-tooltip-text;
|
|
96
|
+
font-size: 13px;
|
|
97
|
+
font-weight: bold;
|
|
98
|
+
padding: 4px 8px;
|
|
99
|
+
z-index: 10;
|
|
100
|
+
|
|
101
|
+
.arrow,
|
|
102
|
+
.arrow::before {
|
|
103
|
+
background: inherit;
|
|
104
|
+
height: 8px;
|
|
105
|
+
position: absolute;
|
|
106
|
+
width: 8px;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.arrow {
|
|
110
|
+
visibility: hidden;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.arrow::before {
|
|
114
|
+
content: "";
|
|
115
|
+
transform: rotate(45deg);
|
|
116
|
+
visibility: visible;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
&[data-popper-placement^="top"] > .arrow {
|
|
120
|
+
bottom: -4px;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
&[data-popper-placement^="bottom"] > .arrow {
|
|
124
|
+
top: -4px;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
&[data-popper-placement^="left"] > .arrow {
|
|
128
|
+
right: -4px;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
&[data-popper-placement^="right"] > .arrow {
|
|
132
|
+
left: -4px;
|
|
133
|
+
}
|
|
134
134
|
}
|
|
135
135
|
|
|
136
136
|
.edith-editing-area {
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
137
|
+
background-color: $color-editor;
|
|
138
|
+
border-radius: 0.25rem;
|
|
139
|
+
margin-top: 5px;
|
|
140
|
+
padding: 5px;
|
|
141
141
|
}
|
|
142
142
|
|
|
143
143
|
.edith-visual,
|
|
144
144
|
.edith-code {
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
145
|
+
height: 100%;
|
|
146
|
+
outline: none;
|
|
147
|
+
overflow: auto;
|
|
148
148
|
}
|
|
149
149
|
|
|
150
150
|
.edith-hidden {
|
|
151
|
-
|
|
151
|
+
display: none;
|
|
152
152
|
}
|
|
153
153
|
|
|
154
154
|
.edith-visual {
|
|
155
|
-
|
|
155
|
+
color: $color-editor-text;
|
|
156
156
|
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
157
|
+
.edith-nbsp {
|
|
158
|
+
color: color.scale($color-button-text, $lightness: 70%);
|
|
159
|
+
}
|
|
160
160
|
}
|
|
161
161
|
|
|
162
162
|
.edith-modal {
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
163
|
+
background: $color-modal;
|
|
164
|
+
border: 2px solid $color-modal-border;
|
|
165
|
+
border-radius: 10px;
|
|
166
|
+
left: calc(50% - 200px);
|
|
167
|
+
position: fixed;
|
|
168
|
+
top: 20%;
|
|
169
|
+
width: 400px;
|
|
170
|
+
z-index: 10;
|
|
171
|
+
|
|
172
|
+
.edith-modal-header {
|
|
173
|
+
border-bottom: 1px solid $color-modal-border;
|
|
174
|
+
color: $color-modal-title;
|
|
175
|
+
font-size: 20px;
|
|
176
|
+
font-weight: 700;
|
|
177
|
+
line-height: 1.4;
|
|
178
|
+
padding: 5px 10px;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
.edith-modal-content {
|
|
182
|
+
color: $color-modal-text;
|
|
183
|
+
margin: 10px;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.edith-modal-input {
|
|
187
|
+
display: flex;
|
|
188
|
+
flex-wrap: wrap;
|
|
189
|
+
margin: 10px 0;
|
|
190
|
+
|
|
191
|
+
label,
|
|
192
|
+
input {
|
|
193
|
+
width: 100%;
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
input {
|
|
197
|
+
appearance: none;
|
|
198
|
+
background-clip: padding-box;
|
|
199
|
+
background-color: $color-modal;
|
|
200
|
+
border: 1px solid $color-checkbox-border;
|
|
201
|
+
border-radius: 0.25rem;
|
|
202
|
+
font-size: 1rem;
|
|
203
|
+
font-weight: 400;
|
|
204
|
+
line-height: 1.5;
|
|
205
|
+
outline: 0;
|
|
206
|
+
padding: 0.375rem 0.75rem;
|
|
207
|
+
width: 100%;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
label {
|
|
211
|
+
font-size: 16px;
|
|
212
|
+
font-weight: 700;
|
|
213
|
+
margin-bottom: 5px;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
.edith-modal-checkbox {
|
|
218
|
+
margin: 10px 0;
|
|
219
|
+
|
|
220
|
+
label {
|
|
221
|
+
display: flex;
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
input {
|
|
225
|
+
appearance: none;
|
|
226
|
+
background-color: $color-modal;
|
|
227
|
+
background-position: 50%;
|
|
228
|
+
background-repeat: no-repeat;
|
|
229
|
+
background-size: contain;
|
|
230
|
+
border: 1px solid $color-checkbox-border;
|
|
231
|
+
border-radius: 0.25em;
|
|
232
|
+
height: 1em;
|
|
233
|
+
margin-top: 0.25em;
|
|
234
|
+
vertical-align: top;
|
|
235
|
+
width: 1em;
|
|
236
|
+
|
|
237
|
+
&:checked {
|
|
238
|
+
background-color: $color-checkbox-background;
|
|
239
|
+
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3E%3C/svg%3E");
|
|
240
|
+
border-color: $color-checkbox-background;
|
|
241
|
+
}
|
|
242
|
+
}
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
.edith-modal-footer {
|
|
246
|
+
border-top: 1px solid $color-modal-border;
|
|
247
|
+
display: flex;
|
|
248
|
+
justify-content: flex-end;
|
|
249
|
+
padding: 5px 10px;
|
|
250
|
+
|
|
251
|
+
:not(:last-child) {
|
|
252
|
+
margin-right: 10px;
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
.edith-modal-cancel,
|
|
257
|
+
.edith-modal-submit {
|
|
258
|
+
border: 1px solid transparent;
|
|
259
|
+
border-radius: 0.25rem;
|
|
260
|
+
cursor: pointer;
|
|
261
|
+
display: inline-block;
|
|
262
|
+
font-size: 1rem;
|
|
263
|
+
font-weight: 400;
|
|
264
|
+
line-height: 1.5;
|
|
265
|
+
padding: 0.375rem 0.75rem;
|
|
266
|
+
text-align: center;
|
|
267
|
+
text-decoration: none;
|
|
268
|
+
user-select: none;
|
|
269
|
+
vertical-align: middle;
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
.edith-modal-cancel {
|
|
273
|
+
background-color: $color-modal-cancel-background;
|
|
274
|
+
border-color: $color-modal-cancel-border;
|
|
275
|
+
color: $color-modal-cancel-color;
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
.edith-modal-submit {
|
|
279
|
+
background-color: $color-modal-submit-background;
|
|
280
|
+
border-color: $color-modal-submit-border;
|
|
281
|
+
color: $color-modal-submit-color;
|
|
282
|
+
}
|
|
283
283
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lesjoursfr/edith",
|
|
3
|
-
"version": "2.2.
|
|
3
|
+
"version": "2.2.4",
|
|
4
4
|
"description": "Simple WYSIWYG editor.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": "lesjoursfr/edith",
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
"access": "public"
|
|
13
13
|
},
|
|
14
14
|
"engines": {
|
|
15
|
-
"node": "
|
|
15
|
+
"node": "20.x || 22.x"
|
|
16
16
|
},
|
|
17
17
|
"browserslist": [
|
|
18
18
|
"> 1%",
|
|
@@ -24,8 +24,8 @@
|
|
|
24
24
|
"type": "module",
|
|
25
25
|
"scripts": {
|
|
26
26
|
"freshlock": "rm -rf node_modules/ && rm .yarn/install-state.gz && rm yarn.lock && yarn",
|
|
27
|
-
"eslint-check": "eslint
|
|
28
|
-
"eslint-fix": "eslint
|
|
27
|
+
"eslint-check": "eslint",
|
|
28
|
+
"eslint-fix": "eslint --fix",
|
|
29
29
|
"stylelint-check": "stylelint **/*.scss",
|
|
30
30
|
"stylelint-fix": "stylelint **/*.scss --fix",
|
|
31
31
|
"prettier-check": "prettier --check .",
|
|
@@ -47,52 +47,53 @@
|
|
|
47
47
|
"editor"
|
|
48
48
|
],
|
|
49
49
|
"dependencies": {
|
|
50
|
-
"@lesjoursfr/browser-tools": "^1.1.
|
|
50
|
+
"@lesjoursfr/browser-tools": "^1.1.3"
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
|
-
"@babel/core": "^7.
|
|
54
|
-
"@babel/preset-env": "^7.
|
|
55
|
-
"@codemirror/lang-html": "^6.4.
|
|
56
|
-
"@
|
|
53
|
+
"@babel/core": "^7.25.2",
|
|
54
|
+
"@babel/preset-env": "^7.25.3",
|
|
55
|
+
"@codemirror/lang-html": "^6.4.9",
|
|
56
|
+
"@eslint/js": "^9.8.0",
|
|
57
|
+
"@fortawesome/fontawesome-free": "^6.6.0",
|
|
57
58
|
"@popperjs/core": "^2.11.8",
|
|
58
|
-
"@tsconfig/next": "^2.0.
|
|
59
|
+
"@tsconfig/next": "^2.0.3",
|
|
59
60
|
"@types/babel__core": "^7.20.5",
|
|
60
|
-
"@types/babel__preset-env": "^7.9.
|
|
61
|
+
"@types/babel__preset-env": "^7.9.7",
|
|
61
62
|
"@types/color": "^3.0.6",
|
|
62
|
-
"@types/jsdom": "^21.1.
|
|
63
|
-
"@types/mocha": "^10.0.
|
|
64
|
-
"@types/node": "^20.
|
|
65
|
-
"@typescript-eslint/eslint-plugin": "^7.1.0",
|
|
66
|
-
"@typescript-eslint/parser": "^7.1.0",
|
|
63
|
+
"@types/jsdom": "^21.1.7",
|
|
64
|
+
"@types/mocha": "^10.0.7",
|
|
65
|
+
"@types/node": "^20.14.13",
|
|
67
66
|
"babel-loader": "^9.1.3",
|
|
68
67
|
"codemirror": "^6.0.1",
|
|
69
|
-
"css-loader": "^
|
|
70
|
-
"css-minimizer-webpack-plugin": "^
|
|
71
|
-
"eslint": "^8.
|
|
68
|
+
"css-loader": "^7.1.2",
|
|
69
|
+
"css-minimizer-webpack-plugin": "^7.0.0",
|
|
70
|
+
"eslint": "^9.8.0",
|
|
72
71
|
"eslint-config-prettier": "^9.1.0",
|
|
73
72
|
"fs-extra": "^11.2.0",
|
|
74
|
-
"
|
|
75
|
-
"
|
|
76
|
-
"
|
|
77
|
-
"
|
|
78
|
-
"
|
|
79
|
-
"
|
|
80
|
-
"sass
|
|
81
|
-
"
|
|
82
|
-
"stylelint
|
|
73
|
+
"globals": "^15.9.0",
|
|
74
|
+
"jsdom": "^24.1.1",
|
|
75
|
+
"mini-css-extract-plugin": "^2.9.0",
|
|
76
|
+
"mocha": "^10.7.0",
|
|
77
|
+
"postcss": "^8.4.40",
|
|
78
|
+
"prettier": "^3.3.3",
|
|
79
|
+
"sass": "^1.77.8",
|
|
80
|
+
"sass-loader": "^16.0.0",
|
|
81
|
+
"stylelint": "^16.8.1",
|
|
82
|
+
"stylelint-config-standard-scss": "^13.1.0",
|
|
83
83
|
"terser-webpack-plugin": "^5.3.10",
|
|
84
84
|
"ts-loader": "^9.5.1",
|
|
85
85
|
"ts-node": "^10.9.2",
|
|
86
|
-
"typescript": "^5.
|
|
87
|
-
"
|
|
86
|
+
"typescript": "^5.5.4",
|
|
87
|
+
"typescript-eslint": "^8.0.0",
|
|
88
|
+
"webpack": "^5.93.0",
|
|
88
89
|
"webpack-cli": "^5.1.4",
|
|
89
|
-
"webpack-dev-server": "^5.0.
|
|
90
|
+
"webpack-dev-server": "^5.0.4"
|
|
90
91
|
},
|
|
91
92
|
"peerDependencies": {
|
|
92
|
-
"@codemirror/lang-html": "^6.4.
|
|
93
|
-
"@fortawesome/fontawesome-free": "^6.
|
|
93
|
+
"@codemirror/lang-html": "^6.4.9",
|
|
94
|
+
"@fortawesome/fontawesome-free": "^6.6.0",
|
|
94
95
|
"@popperjs/core": "^2.11.8",
|
|
95
96
|
"codemirror": "^6.0.1"
|
|
96
97
|
},
|
|
97
|
-
"packageManager": "yarn@4.1
|
|
98
|
+
"packageManager": "yarn@4.3.1"
|
|
98
99
|
}
|
package/src/css/edith.scss
CHANGED
|
@@ -24,260 +24,260 @@ $color-modal-submit-color: #fff;
|
|
|
24
24
|
$color-modal-submit-border: #0d6efd;
|
|
25
25
|
|
|
26
26
|
.edith {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
background-color: $color-toolbar;
|
|
28
|
+
border: 1px solid $color-toolbar-border;
|
|
29
|
+
border-radius: 0.25rem;
|
|
30
|
+
padding: 5px;
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
.edith-toolbar {
|
|
34
|
-
|
|
34
|
+
background-color: $color-toolbar;
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
.edith-btn {
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
38
|
+
background-color: $color-button;
|
|
39
|
+
border: 1px solid $color-button-border;
|
|
40
|
+
border-radius: 0.25rem;
|
|
41
|
+
color: $color-button-text;
|
|
42
|
+
cursor: pointer;
|
|
43
|
+
display: inline-block;
|
|
44
|
+
font-size: 1rem;
|
|
45
|
+
font-weight: 900;
|
|
46
|
+
line-height: 1.5;
|
|
47
|
+
padding: 0.375rem 0.75rem;
|
|
48
|
+
text-align: center;
|
|
49
|
+
text-decoration: none;
|
|
50
|
+
user-select: none;
|
|
51
|
+
vertical-align: middle;
|
|
52
|
+
|
|
53
|
+
&:disabled {
|
|
54
|
+
color: color.scale($color-button-text, $lightness: 70%);
|
|
55
|
+
cursor: not-allowed;
|
|
56
|
+
}
|
|
57
57
|
}
|
|
58
58
|
|
|
59
59
|
.edith-btn-group {
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
60
|
+
display: inline-flex;
|
|
61
|
+
position: relative;
|
|
62
|
+
vertical-align: middle;
|
|
63
|
+
|
|
64
|
+
&:not(:first-child) {
|
|
65
|
+
margin-left: 10px;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
:not(:first-child) {
|
|
69
|
+
margin-left: -1px;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.edith-btn:not(:last-child) {
|
|
73
|
+
border-bottom-right-radius: 0;
|
|
74
|
+
border-top-right-radius: 0;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.edith-btn:not(:first-child) {
|
|
78
|
+
border-bottom-left-radius: 0;
|
|
79
|
+
border-top-left-radius: 0;
|
|
80
|
+
}
|
|
81
81
|
}
|
|
82
82
|
|
|
83
83
|
.edith-btn-nbsp {
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
84
|
+
&::before {
|
|
85
|
+
content: "\0020";
|
|
86
|
+
display: block;
|
|
87
|
+
height: 16px;
|
|
88
|
+
width: 12px;
|
|
89
|
+
}
|
|
90
90
|
}
|
|
91
91
|
|
|
92
92
|
.edith-tooltip {
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
93
|
+
background: $color-tooltip;
|
|
94
|
+
border-radius: 4px;
|
|
95
|
+
color: $color-tooltip-text;
|
|
96
|
+
font-size: 13px;
|
|
97
|
+
font-weight: bold;
|
|
98
|
+
padding: 4px 8px;
|
|
99
|
+
z-index: 10;
|
|
100
|
+
|
|
101
|
+
.arrow,
|
|
102
|
+
.arrow::before {
|
|
103
|
+
background: inherit;
|
|
104
|
+
height: 8px;
|
|
105
|
+
position: absolute;
|
|
106
|
+
width: 8px;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.arrow {
|
|
110
|
+
visibility: hidden;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.arrow::before {
|
|
114
|
+
content: "";
|
|
115
|
+
transform: rotate(45deg);
|
|
116
|
+
visibility: visible;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
&[data-popper-placement^="top"] > .arrow {
|
|
120
|
+
bottom: -4px;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
&[data-popper-placement^="bottom"] > .arrow {
|
|
124
|
+
top: -4px;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
&[data-popper-placement^="left"] > .arrow {
|
|
128
|
+
right: -4px;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
&[data-popper-placement^="right"] > .arrow {
|
|
132
|
+
left: -4px;
|
|
133
|
+
}
|
|
134
134
|
}
|
|
135
135
|
|
|
136
136
|
.edith-editing-area {
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
137
|
+
background-color: $color-editor;
|
|
138
|
+
border-radius: 0.25rem;
|
|
139
|
+
margin-top: 5px;
|
|
140
|
+
padding: 5px;
|
|
141
141
|
}
|
|
142
142
|
|
|
143
143
|
.edith-visual,
|
|
144
144
|
.edith-code {
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
145
|
+
height: 100%;
|
|
146
|
+
outline: none;
|
|
147
|
+
overflow: auto;
|
|
148
148
|
}
|
|
149
149
|
|
|
150
150
|
.edith-hidden {
|
|
151
|
-
|
|
151
|
+
display: none;
|
|
152
152
|
}
|
|
153
153
|
|
|
154
154
|
.edith-visual {
|
|
155
|
-
|
|
155
|
+
color: $color-editor-text;
|
|
156
156
|
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
157
|
+
.edith-nbsp {
|
|
158
|
+
color: color.scale($color-button-text, $lightness: 70%);
|
|
159
|
+
}
|
|
160
160
|
}
|
|
161
161
|
|
|
162
162
|
.edith-modal {
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
163
|
+
background: $color-modal;
|
|
164
|
+
border: 2px solid $color-modal-border;
|
|
165
|
+
border-radius: 10px;
|
|
166
|
+
left: calc(50% - 200px);
|
|
167
|
+
position: fixed;
|
|
168
|
+
top: 20%;
|
|
169
|
+
width: 400px;
|
|
170
|
+
z-index: 10;
|
|
171
|
+
|
|
172
|
+
.edith-modal-header {
|
|
173
|
+
border-bottom: 1px solid $color-modal-border;
|
|
174
|
+
color: $color-modal-title;
|
|
175
|
+
font-size: 20px;
|
|
176
|
+
font-weight: 700;
|
|
177
|
+
line-height: 1.4;
|
|
178
|
+
padding: 5px 10px;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
.edith-modal-content {
|
|
182
|
+
color: $color-modal-text;
|
|
183
|
+
margin: 10px;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.edith-modal-input {
|
|
187
|
+
display: flex;
|
|
188
|
+
flex-wrap: wrap;
|
|
189
|
+
margin: 10px 0;
|
|
190
|
+
|
|
191
|
+
label,
|
|
192
|
+
input {
|
|
193
|
+
width: 100%;
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
input {
|
|
197
|
+
appearance: none;
|
|
198
|
+
background-clip: padding-box;
|
|
199
|
+
background-color: $color-modal;
|
|
200
|
+
border: 1px solid $color-checkbox-border;
|
|
201
|
+
border-radius: 0.25rem;
|
|
202
|
+
font-size: 1rem;
|
|
203
|
+
font-weight: 400;
|
|
204
|
+
line-height: 1.5;
|
|
205
|
+
outline: 0;
|
|
206
|
+
padding: 0.375rem 0.75rem;
|
|
207
|
+
width: 100%;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
label {
|
|
211
|
+
font-size: 16px;
|
|
212
|
+
font-weight: 700;
|
|
213
|
+
margin-bottom: 5px;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
.edith-modal-checkbox {
|
|
218
|
+
margin: 10px 0;
|
|
219
|
+
|
|
220
|
+
label {
|
|
221
|
+
display: flex;
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
input {
|
|
225
|
+
appearance: none;
|
|
226
|
+
background-color: $color-modal;
|
|
227
|
+
background-position: 50%;
|
|
228
|
+
background-repeat: no-repeat;
|
|
229
|
+
background-size: contain;
|
|
230
|
+
border: 1px solid $color-checkbox-border;
|
|
231
|
+
border-radius: 0.25em;
|
|
232
|
+
height: 1em;
|
|
233
|
+
margin-top: 0.25em;
|
|
234
|
+
vertical-align: top;
|
|
235
|
+
width: 1em;
|
|
236
|
+
|
|
237
|
+
&:checked {
|
|
238
|
+
background-color: $color-checkbox-background;
|
|
239
|
+
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3E%3C/svg%3E");
|
|
240
|
+
border-color: $color-checkbox-background;
|
|
241
|
+
}
|
|
242
|
+
}
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
.edith-modal-footer {
|
|
246
|
+
border-top: 1px solid $color-modal-border;
|
|
247
|
+
display: flex;
|
|
248
|
+
justify-content: flex-end;
|
|
249
|
+
padding: 5px 10px;
|
|
250
|
+
|
|
251
|
+
:not(:last-child) {
|
|
252
|
+
margin-right: 10px;
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
.edith-modal-cancel,
|
|
257
|
+
.edith-modal-submit {
|
|
258
|
+
border: 1px solid transparent;
|
|
259
|
+
border-radius: 0.25rem;
|
|
260
|
+
cursor: pointer;
|
|
261
|
+
display: inline-block;
|
|
262
|
+
font-size: 1rem;
|
|
263
|
+
font-weight: 400;
|
|
264
|
+
line-height: 1.5;
|
|
265
|
+
padding: 0.375rem 0.75rem;
|
|
266
|
+
text-align: center;
|
|
267
|
+
text-decoration: none;
|
|
268
|
+
user-select: none;
|
|
269
|
+
vertical-align: middle;
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
.edith-modal-cancel {
|
|
273
|
+
background-color: $color-modal-cancel-background;
|
|
274
|
+
border-color: $color-modal-cancel-border;
|
|
275
|
+
color: $color-modal-cancel-color;
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
.edith-modal-submit {
|
|
279
|
+
background-color: $color-modal-submit-background;
|
|
280
|
+
border-color: $color-modal-submit-border;
|
|
281
|
+
color: $color-modal-submit-color;
|
|
282
|
+
}
|
|
283
283
|
}
|