UNPKG

@kelche/codebox

Version:

A fork from dev-juju/Codebox Code syntax highlighting tool for Editor.js

1 lines 13 kB
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.CodeBox=t():e.CodeBox=t()}(self,(()=>(()=>{"use strict";var e={426:(e,t,n)=>{n.d(t,{Z:()=>c});var o=n(81),i=n.n(o),r=n(645),a=n.n(r)()(i());a.push([e.id,".codeBoxHolder{\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n}\n\n.codeBoxTextArea{\n width: 100%;\n min-height: 30px;\n padding: 10px;\n border-radius: 2px 2px 2px 0;\n border: none !important;\n outline: none !important;\n font: 14px monospace;\n}\n\n.codeBoxSelectDiv{\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n position: relative;\n}\n\n.codeBoxSelectInput{\n border-radius: 0 0 20px 2px;\n padding: 2px 26px;\n padding-top: 0;\n padding-right: 0;\n text-align: left;\n cursor: pointer;\n border: none !important;\n outline: none !important;\n}\n\n.codeBoxSelectDropIcon{\n position: absolute !important;\n left: 10px !important;\n bottom: 0 !important;\n width: unset !important;\n height: unset !important;\n font-size: 16px !important;\n}\n\n.codeBoxSelectPreview{\n display: none;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n border-radius: 2px;\n box-shadow: 0 3px 15px -3px rgba(13,20,33,.13);\n position: absolute;\n top: 100%;\n margin: 5px 0;\n max-height: 30vh;\n overflow-x: hidden;\n overflow-y: auto;\n z-index: 10000;\n}\n\n.codeBoxSelectItem{\n width: 100%;\n padding: 5px 20px;\n margin: 0;\n cursor: pointer;\n}\n\n.codeBoxSelectItem:hover{\n opacity: 0.7;\n}\n\n.codeBoxSelectedItem{\n background-color: lightblue !important;\n}\n\n.codeBoxShow{\n display: flex !important;\n}\n\n.dark{\n color: #abb2bf;\n background-color: #282c34;\n}\n\n.light{\n color: #383a42;\n background-color: #fafafa;\n}\n",""]);const c=a},645:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",o=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),o&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),o&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,o,i,r){"string"==typeof e&&(e=[[null,e,void 0]]);var a={};if(o)for(var c=0;c<this.length;c++){var s=this[c][0];null!=s&&(a[s]=!0)}for(var l=0;l<e.length;l++){var u=[].concat(e[l]);o&&a[u[0]]||(void 0!==r&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=r),n&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=n):u[2]=n),i&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=i):u[4]="".concat(i)),t.push(u))}},t}},81:e=>{e.exports=function(e){return e[1]}},654:(e,t,n)=>{var o=n(379),i=n.n(o),r=n(795),a=n.n(r),c=n(569),s=n.n(c),l=n(565),u=n.n(l),d=n(216),h=n.n(d),p=n(589),f=n.n(p),g=n(426),m={};m.styleTagTransform=f(),m.setAttributes=u(),m.insert=s().bind(null,"head"),m.domAPI=a(),m.insertStyleElement=h(),i()(g.Z,m),g.Z&&g.Z.locals&&g.Z.locals},379:e=>{var t=[];function n(e){for(var n=-1,o=0;o<t.length;o++)if(t[o].identifier===e){n=o;break}return n}function o(e,o){for(var r={},a=[],c=0;c<e.length;c++){var s=e[c],l=o.base?s[0]+o.base:s[0],u=r[l]||0,d="".concat(l," ").concat(u);r[l]=u+1;var h=n(d),p={css:s[1],media:s[2],sourceMap:s[3],supports:s[4],layer:s[5]};if(-1!==h)t[h].references++,t[h].updater(p);else{var f=i(p,o);o.byIndex=c,t.splice(c,0,{identifier:d,updater:f,references:1})}a.push(d)}return a}function i(e,t){var n=t.domAPI(t);return n.update(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap&&t.supports===e.supports&&t.layer===e.layer)return;n.update(e=t)}else n.remove()}}e.exports=function(e,i){var r=o(e=e||[],i=i||{});return function(e){e=e||[];for(var a=0;a<r.length;a++){var c=n(r[a]);t[c].references--}for(var s=o(e,i),l=0;l<r.length;l++){var u=n(r[l]);0===t[u].references&&(t[u].updater(),t.splice(u,1))}r=s}}},569:e=>{var t={};e.exports=function(e,n){var o=function(e){if(void 0===t[e]){var n=document.querySelector(e);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}t[e]=n}return t[e]}(e);if(!o)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");o.appendChild(n)}},216:e=>{e.exports=function(e){var t=document.createElement("style");return e.setAttributes(t,e.attributes),e.insert(t,e.options),t}},565:(e,t,n)=>{e.exports=function(e){var t=n.nc;t&&e.setAttribute("nonce",t)}},795:e=>{e.exports=function(e){var t=e.insertStyleElement(e);return{update:function(n){!function(e,t,n){var o="";n.supports&&(o+="@supports (".concat(n.supports,") {")),n.media&&(o+="@media ".concat(n.media," {"));var i=void 0!==n.layer;i&&(o+="@layer".concat(n.layer.length>0?" ".concat(n.layer):""," {")),o+=n.css,i&&(o+="}"),n.media&&(o+="}"),n.supports&&(o+="}");var r=n.sourceMap;r&&"undefined"!=typeof btoa&&(o+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(r))))," */")),t.styleTagTransform(o,e,t.options)}(t,e,n)},remove:function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(t)}}}},589:e=>{e.exports=function(e,t){if(t.styleSheet)t.styleSheet.cssText=e;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(e))}}}},t={};function n(o){var i=t[o];if(void 0!==i)return i.exports;var r=t[o]={id:o,exports:{}};return e[o](r,r.exports,n),r.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var o in t)n.o(t,o)&&!n.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.nc=void 0;var o={};return(()=>{n.r(o),n.d(o,{default:()=>i}),n(654).toString();var e=["light","dark"],t={none:"Auto-detect",apache:"Apache",bash:"Bash",cs:"C#",cpp:"C++",css:"CSS",coffeescript:"CoffeeScript",diff:"Diff",go:"Go",html:"HTML, XML",http:"HTTP",json:"JSON",java:"Java",javascript:"JavaScript",kotlin:"Kotlin",less:"Less",lua:"Lua",makefile:"Makefile",markdown:"Markdown",nginx:"Nginx",objectivec:"Objective-C",php:"PHP",perl:"Perl",properties:"Properties",python:"Python",ruby:"Ruby",rust:"Rust",scss:"SCSS",sql:"SQL",shell:"Shell Session",swift:"Swift",toml:"TOML, also INI",typescript:"TypeScript",yaml:"YAML",plaintext:"Plaintext"};const i=function(){function n(t){var n=t.data,o=t.api,i=t.config,r=t.readOnly;this.api=o,this.config={themeName:i.themeName&&"string"==typeof i.themeName?i.themeName:"",themeURL:i.themeURL&&"string"==typeof i.themeURL?i.themeURL:"",useDefaultTheme:i.useDefaultTheme&&"string"==typeof i.useDefaultTheme&&e.includes(i.useDefaultTheme.toLowerCase())?i.useDefaultTheme:"dark"},this.data={code:n.code&&"string"==typeof n.code?n.code:"",language:n.language&&"string"==typeof n.language?n.language:"Auto-detect",theme:n.theme&&"string"==typeof n.theme?n.theme:this._getThemeURLFromConfig()},this.readOnly=r,this.highlightScriptID="highlightJSScriptElement",this.highlightCSSID="highlightJSCSSElement",this.codeArea=document.createElement("div"),this.selectInput=document.createElement("input"),this.selectDropIcon=document.createElement("i"),this._injectHighlightJSScriptElement(),this._injectHighlightJSCSSElement(),this.api.listeners.on(window,"click",this._closeAllLanguageSelects,!0)}return Object.defineProperty(n,"sanitize",{get:function(){return{code:!0,language:!1,theme:!1}},enumerable:!1,configurable:!0}),Object.defineProperty(n,"toolbox",{get:function(){return{title:"CodeBox",icon:'<svg width="20" height="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.71,6.29a1,1,0,0,0-1.42,0l-5,5a1,1,0,0,0,0,1.42l5,5a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L5.41,12l4.3-4.29A1,1,0,0,0,9.71,6.29Zm11,5-5-5a1,1,0,0,0-1.42,1.42L18.59,12l-4.3,4.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l5-5A1,1,0,0,0,20.71,11.29Z"/></svg>'}},enumerable:!1,configurable:!0}),Object.defineProperty(n,"isReadOnlySupported",{get:function(){return!0},enumerable:!1,configurable:!0}),Object.defineProperty(n,"displayInToolbox",{get:function(){return!0},enumerable:!1,configurable:!0}),Object.defineProperty(n,"enableLineBreaks",{get:function(){return!0},enumerable:!1,configurable:!0}),n.prototype.render=function(){var e=this,t=document.createElement("pre"),n=this._createLanguageSelectElement();return t.setAttribute("class","codeBoxHolder"),this.codeArea.setAttribute("class","codeBoxTextArea ".concat(this.config.useDefaultTheme," ").concat(this.data.language)),this.codeArea.setAttribute("contenteditable","true"),this.codeArea.innerHTML=this.data.code,this.api.listeners.on(this.codeArea,"blur",(function(t){return e._highlightCodeArea(t)}),!1),this.api.listeners.on(this.codeArea,"paste",(function(t){return e._handleCodeAreaPaste(t)}),!1),this.readOnly?this.codeArea.setAttribute("contenteditable","false"):this.codeArea.setAttribute("contenteditable","true"),t.appendChild(this.codeArea),t.appendChild(n),t},n.prototype.save=function(e){return Object.assign(this.data,{code:this.codeArea.innerHTML,theme:this._getThemeURLFromConfig()})},n.prototype.validate=function(e){return!!e.code.trim()},n.prototype.destroy=function(){var e=this;this.api.listeners.off(window,"click",this._closeAllLanguageSelects,!0),this.api.listeners.off(this.codeArea,"blur",(function(t){return e._highlightCodeArea(t)}),!1),this.api.listeners.off(this.codeArea,"paste",(function(t){return e._handleCodeAreaPaste(t)}),!1),this.api.listeners.off(this.selectInput,"click",(function(t){return e._handleSelectInputClick(t)}),!1)},n.prototype._createLanguageSelectElement=function(){var e=this,n=document.createElement("div"),o=document.createElement("div"),i=Object.entries(t);return n.setAttribute("class","codeBoxSelectDiv"),this.selectDropIcon.setAttribute("class","codeBoxSelectDropIcon ".concat(this.config.useDefaultTheme)),this.selectDropIcon.innerHTML="&#8595;",this.selectInput.setAttribute("class","codeBoxSelectInput ".concat(this.config.useDefaultTheme)),this.selectInput.setAttribute("type","text"),this.selectInput.setAttribute("readonly","true"),this.selectInput.value=this.data.language,this.api.listeners.on(this.selectInput,"click",(function(t){return e._handleSelectInputClick(t)}),!1),o.setAttribute("class","codeBoxSelectPreview"),i.forEach((function(t){var n=document.createElement("p");n.setAttribute("class","codeBoxSelectItem ".concat(e.config.useDefaultTheme)),n.setAttribute("data-key",t[0]),n.textContent=t[1],e.api.listeners.on(n,"click",(function(n){return e._handleSelectItemClick(n,t)}),!1),o.appendChild(n)})),n.appendChild(this.selectDropIcon),n.appendChild(this.selectInput),n.appendChild(o),n},n.prototype._highlightCodeArea=function(e){window.hljs.highlightBlock(this.codeArea)},n.prototype._handleCodeAreaPaste=function(e){e.stopPropagation()},n.prototype._handleSelectInputClick=function(e){e.target.nextSibling.classList.toggle("codeBoxShow")},n.prototype._handleSelectItemClick=function(e,t){e.target.parentNode.parentNode.querySelector(".codeBoxSelectInput").value=t[1],e.target.parentNode.classList.remove("codeBoxShow"),this.codeArea.removeAttribute("class"),this.data.language=t[0],this.codeArea.setAttribute("class","codeBoxTextArea ".concat(this.config.useDefaultTheme," ").concat(this.data.language)),window.hljs.highlightBlock(this.codeArea)},n.prototype._closeAllLanguageSelects=function(){for(var e=document.querySelectorAll(".codeBoxSelectPreview"),t=0,n=e.length;t<n;t++)e[t].classList.remove("codeBoxShow")},n.prototype._injectHighlightJSScriptElement=function(){var e=document.querySelector("#".concat(this.highlightScriptID)),t="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/highlight.min.js";if(e)e.setAttribute("src",t);else{var n=document.createElement("script"),o=document.querySelector("head");n.setAttribute("src",t),n.setAttribute("id",this.highlightScriptID),o&&o.appendChild(n)}},n.prototype._injectHighlightJSCSSElement=function(){var e=document.querySelector("#".concat(this.highlightCSSID)),t=this._getThemeURLFromConfig();if(e)e.setAttribute("href",t);else{var n=document.createElement("link"),o=document.querySelector("head");n.setAttribute("rel","stylesheet"),n.setAttribute("href",t),n.setAttribute("id",this.highlightCSSID),o&&o.appendChild(n)}},n.prototype._getThemeURLFromConfig=function(){var e="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/styles/atom-one-".concat(this.config.useDefaultTheme,".min.css");return this.config.themeName&&(e="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.18.1/build/styles/".concat(this.config.themeName,".min.css")),this.config.themeURL&&(e=this.config.themeURL),e},n}()})(),o})()));