@iizotikov/editor-js-tg-spoiler
Version:
Inline tool for adding spoilers to text fragments, supporting export to telegram
7 lines (6 loc) • 1.92 kB
JavaScript
(function(s,e){typeof exports=="object"&&typeof module<"u"?module.exports=e():typeof define=="function"&&define.amd?define(e):(s=typeof globalThis<"u"?globalThis:s||self,s.TgSpoilerEditorJS=e())})(this,function(){"use strict";const e=class e{constructor(){this.commandName="spoiler",this.CSS={button:"ce-inline-tool",buttonActive:"ce-inline-tool--active",buttonModifier:"ce-inline-tool--spoiler"},this.nodes={button:null}}static get sanitize(){return{span:{class:"tg-spoiler"}}}render(){return this.nodes.button=document.createElement("button"),this.nodes.button.type="button",this.nodes.button.classList.add(this.CSS.button,this.CSS.buttonModifier),this.nodes.button.innerHTML=`
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M14.5 8.50001C13.5 7 10.935 6.66476 9.75315 7.79706C9.27092 8.25909 9 8.88574 9 9.53915C9 10.1926 9.27092 10.8192 9.75315 11.2812C10.9835 12.46 13.0165 11.5457 14.2468 12.7244C14.7291 13.1865 15 13.8131 15 14.4665C15 15.1199 14.7291 15.7466 14.2468 16.2086C12.8659 17.5317 10 17.5 9 16"></path>
</svg>
`,this.nodes.button}surround(){document.execCommand(this.commandName),this.addSpoilerClass()}addSpoilerClass(){const t=window.getSelection();if(!t||!t.rangeCount)return;const o=t.getRangeAt(0),n=o.commonAncestorContainer;this.findAllSpoilerTags(n,o).forEach(d=>{d.classList.contains("tg-spoiler")||d.classList.add("tg-spoiler")})}findAllSpoilerTags(t,o){const n=[];return t.nodeType===Node.ELEMENT_NODE&&t.nodeName==="SPAN"&&o.intersectsNode(t)&&n.push(t),t.childNodes.forEach(i=>{n.push(...this.findAllSpoilerTags(i,o))}),n}checkState(){const t=document.queryCommandState(this.commandName);return this.nodes.button.classList.toggle(this.CSS.buttonActive,t),t}};e.isInline=!0,e.title="Spoiler";let s=e;return s});