数式をpreviewするUserScript
このUserScriptを作ったあと、Scrapboxにも数式のpreview機能がついた
このUserScriptは標準機能に比べ、エラー内容を表示してくれるという特徴がある
実装
$ \frac{1}{2}mv+\frac{1}{2}kx^2=C
以下はbundle&minifyしたもの
code:script.js
var d,Fe,R,ee,te,Ie,L={},X=[],Ue=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|inech|zoo|^ord|itera/i;function w(e,t){for(var n in t)en=tn;return e}function ne(e){var t=e.parentNode;t&&t.removeChild(e)}function C(e,t,n){var o,i,r,u=arguments,a={};for(r in t)r=="key"?o=tr:r=="ref"?i=tr:ar=tr;if(arguments.length>3)for(n=n,r=3;r<arguments.length;r++)n.push(ur);if(n!=null&&(a.children=n),typeof e=="function"&&e.defaultProps!=null)for(r in e.defaultProps)ar===void 0&&(ar=e.defaultPropsr);return H(e,a,o,i,null)}function H(e,t,n,o,i){var r={type:e,props:t,key:n,ref:o,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:i??++d.__v};return d.vnode!=null&&d.vnode(r),r}function O(e){return e.children}function $(e,t){this.props=e,this.context=t}function P(e,t){if(t==null)return e.__?P(e.__,e.__.__k.indexOf(e)+1):null;for(var n;t<e.__k.length;t++)if((n=e.__kt)!=null&&n.__e!=null)return n.__e;return typeof e.type=="function"?P(e):null}function re(e){var t,n;if((e=e.__)!=null&&e.__c!=null){for(e.__e=e.__c.base=null,t=0;t<e.__k.length;t++)if((n=e.__kt)!=null&&n.__e!=null){e.__e=e.__c.base=n.__e;break}return re(e)}}function oe(e){(!e.__d&&(e.__d=!0)&&R.push(e)&&!D.__r++||te!==d.debounceRendering)&&((te=d.debounceRendering)||ee)(D)}function D(){for(var e;D.__r=R.length;)e=R.sort(function(t,n){return t.__v.__b-n.__v.__b}),R=[],e.some(function(t){var n,o,i,r,u,a;t.__d&&(u=(r=(n=t).__v).__e,(a=n.__P)&&(o=[],(i=w({},r)).__v=r.__v+1,q(a,r,i,n.__n,a.ownerSVGElement!==void 0,r.__h!=null?u:null,o,u??P(r),r.__h),_e(o,r),r.__e!=u&&re(r)))})}function se(e,t,n,o,i,r,u,a,c,p){var s,f,_,l,h,m,v,g=o&&o.__k||X,x=g.length;for(n.__k=[],s=0;s<t.length;s++)if((l=n.__ks=(l=ts)==null||typeof l=="boolean"?null:typeof l=="string"||typeof l=="number"||typeof l=="bigint"?H(null,l,null,null,l):Array.isArray(l)?H(O,{children:l},null,null,null):l.__b>0?H(l.type,l.props,l.key,null,l.__v):l)!=null){if(l.__=n,l.__b=n.__b+1,(_=gs)===null||_&&l.key==_.key&&l.type===_.type)gs=void 0;else for(f=0;f<x;f++){if((_=gf)&&l.key==_.key&&l.type===_.type){gf=void 0;break}_=null}q(e,l,_=_||L,i,r,u,a,c,p),h=l.__e,(f=l.ref)&&_.ref!=f&&(v||(v=[]),_.ref&&v.push(_.ref,null,l),v.push(f,l.__c||h,l)),h!=null?(m==null&&(m=h),typeof l.type=="function"&&l.__k!=null&&l.__k===_.__k?l.__d=c=ie(l,c,e):c=ue(e,l,_,g,h,c),p||n.type!=="option"?typeof n.type=="function"&&(n.__d=c):e.value=""):c&&_.__e==c&&c.parentNode!=e&&(c=P(_))}for(n.__e=m,s=x;s--;)gs!=null&&(typeof n.type=="function"&&gs.__e!=null&&gs.__e==n.__d&&(n.__d=P(o,s+1)),fe(gs,gs));if(v)for(s=0;s<v.length;s++)pe(vs,v++s,v++s)}function ie(e,t,n){var o,i;for(o=0;o<e.__k.length;o++)(i=e.__ko)&&(i.__=e,t=typeof i.type=="function"?ie(i,t,n):ue(n,i,i,e.__k,i.__e,t));return t}function ue(e,t,n,o,i,r){var u,a,c;if(t.__d!==void 0)u=t.__d,t.__d=void 0;else if(n==null||i!=r||i.parentNode==null)e:if(r==null||r.parentNode!==e)e.appendChild(i),u=null;else{for(a=r,c=0;(a=a.nextSibling)&&c<o.length;c+=2)if(a==i)break e;e.insertBefore(i,r),u=r}return u!==void 0?u:i.nextSibling}function ze(e,t,n,o,i){var r;for(r in n)r==="children"||r==="key"||r in t||F(e,r,null,nr,o);for(r in t)i&&typeof tr!="function"||r==="children"||r==="key"||r==="value"||r==="checked"||nr===tr||F(e,r,tr,nr,o)}function ae(e,t,n){t0==="-"?e.setProperty(t,n):et=n==null?"":typeof n!="number"||Ue.test(t)?n:n+"px"}function F(e,t,n,o,i){var r;e:if(t==="style")if(typeof n=="string")e.style.cssText=n;else{if(typeof o=="string"&&(e.style.cssText=o=""),o)for(t in o)n&&t in n||ae(e.style,t,"");if(n)for(t in n)o&&nt===ot||ae(e.style,t,nt)}else if(t0==="o"&&t1==="n")r=t!==(t=t.replace(/Capture$/,"")),t=t.toLowerCase()in e?t.toLowerCase().slice(2):t.slice(2),e.l||(e.l={}),e.lt+r=n,n?o||e.addEventListener(t,r?le:ce,r):e.removeEventListener(t,r?le:ce,r);else if(t!=="dangerouslySetInnerHTML"){if(i)t=t.replace(/xlinkH:h/,"h").replace(/sName$/,"s");else if(t!=="href"&&t!=="list"&&t!=="form"&&t!=="tabIndex"&&t!=="download"&&t in e)try{et=n??"";break e}catch(u){}typeof n=="function"||(n!=null&&(n!==!1||t0==="a"&&t1==="r")?e.setAttribute(t,n):e.removeAttribute(t))}}function ce(e){this.le.type+!1(d.event?d.event(e):e)}function le(e){this.le.type+!0(d.event?d.event(e):e)}function q(e,t,n,o,i,r,u,a,c){var p,s,f,_,l,h,m,v,g,x,A,k=t.type;if(t.constructor!==void 0)return null;n.__h!=null&&(c=n.__h,a=t.__e=n.__e,t.__h=null,r=a),(p=d.__b)&&p(t);try{e:if(typeof k=="function"){if(v=t.props,g=(p=k.contextType)&&op.__c,x=p?g?g.props.value:p.__:o,n.__c?m=(s=t.__c=n.__c).__=s.__E:("prototype"in k&&k.prototype.render?t.__c=s=new k(v,x):(t.__c=s=new $(v,x),s.constructor=k,s.render=Xe),g&&g.sub(s),s.props=v,s.state||(s.state={}),s.context=x,s.__n=o,f=s.__d=!0,s.__h=[]),s.__s==null&&(s.__s=s.state),k.getDerivedStateFromProps!=null&&(s.__s==s.state&&(s.__s=w({},s.__s)),w(s.__s,k.getDerivedStateFromProps(v,s.__s))),_=s.props,l=s.state,f)k.getDerivedStateFromProps==null&&s.componentWillMount!=null&&s.componentWillMount(),s.componentDidMount!=null&&s.__h.push(s.componentDidMount);else{if(k.getDerivedStateFromProps==null&&v!==_&&s.componentWillReceiveProps!=null&&s.componentWillReceiveProps(v,x),!s.__e&&s.shouldComponentUpdate!=null&&s.shouldComponentUpdate(v,s.__s,x)===!1||t.__v===n.__v){s.props=v,s.state=s.__s,t.__v!==n.__v&&(s.__d=!1),s.__v=t,t.__e=n.__e,t.__k=n.__k,t.__k.forEach(function(B){B&&(B.__=t)}),s.__h.length&&u.push(s);break e}s.componentWillUpdate!=null&&s.componentWillUpdate(v,s.__s,x),s.componentDidUpdate!=null&&s.__h.push(function(){s.componentDidUpdate(_,l,h)})}s.context=x,s.props=v,s.state=s.__s,(p=d.__r)&&p(t),s.__d=!1,s.__v=t,s.__P=e,p=s.render(s.props,s.state,s.context),s.state=s.__s,s.getChildContext!=null&&(o=w(w({},o),s.getChildContext())),f||s.getSnapshotBeforeUpdate==null||(h=s.getSnapshotBeforeUpdate(_,l)),A=p!=null&&p.type===O&&p.key==null?p.props.children:p,se(e,Array.isArray(A)?A:A,t,n,o,i,r,u,a,c),s.base=t.__e,t.__h=null,s.__h.length&&u.push(s),m&&(s.__E=s.__=null),s.__e=!1}else r==null&&t.__v===n.__v?(t.__k=n.__k,t.__e=n.__e):t.__e=We(n.__e,t,n,o,i,r,u,c);(p=d.diffed)&&p(t)}catch(B){t.__v=null,(c||r!=null)&&(t.__e=a,t.__h=!!c,rr.indexOf(a)=null),d.__e(B,t,n)}}function _e(e,t){d.__c&&d.__c(t,e),e.some(function(n){try{e=n.__h,n.__h=[],e.some(function(o){o.call(n)})}catch(o){d.__e(o,n.__v)}})}function We(e,t,n,o,i,r,u,a){var c,p,s,f,_=n.props,l=t.props,h=t.type,m=0;if(h==="svg"&&(i=!0),r!=null){for(;m<r.length;m++)if((c=rm)&&(c===e||(h?c.localName==h:c.nodeType==3))){e=c,rm=null;break}}if(e==null){if(h===null)return document.createTextNode(l);e=i?document.createElementNS("http://www.w3.org/2000/svg",h):document.createElement(h,l.is&&l),r=null,a=!1}if(h===null)_===l||a&&e.data===l||(e.data=l);else{if(r=r&&X.slice.call(e.childNodes),p=(_=n.props||L).dangerouslySetInnerHTML,s=l.dangerouslySetInnerHTML,!a){if(r!=null)for(_={},f=0;f<e.attributes.length;f++)_[e.attributes[f].name]=e.attributes[f].value;(s||p)&&(s&&(p&&s.__html==p.__html||s.__html===e.innerHTML)||(e.innerHTML=s&&s.__html||""))}if(ze(e,l,_,i,a),s)t.__k=[];else if(m=t.props.children,se(e,Array.isArray(m)?m:m,t,n,o,i&&h!=="foreignObject",r,u,e.firstChild,a),r!=null)for(m=r.length;m--;)rm!=null&&ne(rm);a||("value"in l&&(m=l.value)!==void 0&&(m!==e.value||h==="progress"&&!m)&&F(e,"value",m,_.value,!1),"checked"in l&&(m=l.checked)!==void 0&&m!==e.checked&&F(e,"checked",m,_.checked,!1))}return e}function pe(e,t,n){try{typeof e=="function"?e(t):e.current=t}catch(o){d.__e(o,n)}}function fe(e,t,n){var o,i,r;if(d.unmount&&d.unmount(e),(o=e.ref)&&(o.current&&o.current!==e.__e||pe(o,null,t)),n||typeof e.type=="function"||(n=(i=e.__e)!=null),e.__e=e.__d=void 0,(o=e.__c)!=null){if(o.componentWillUnmount)try{o.componentWillUnmount()}catch(u){d.__e(u,t)}o.base=o.__P=null}if(o=e.__k)for(r=0;r<o.length;r++)or&&fe(or,t,n);i!=null&&ne(i)}function Xe(e,t,n){return this.constructor(e,n)}function T(e,t,n){var o,i,r;d.__&&d.__(e,t),i=(o=typeof n=="function")?null:n&&n.__k||t.__k,r=[],q(t,e=(!o&&n||t).__k=C(O,null,e),i||L,L,t.ownerSVGElement!==void 0,!o&&n?n:i?null:t.firstChild?X.slice.call(t.childNodes):null,r,!o&&n?n:i?i.__e:t.firstChild,o),_e(r,e)}function V(e,t){T(e,t,V)}function K(e,t,n){var o,i,r,u=arguments,a=w({},e.props);for(r in t)r=="key"?o=tr:r=="ref"?i=tr:ar=tr;if(arguments.length>3)for(n=n,r=3;r<arguments.length;r++)n.push(ur);return n!=null&&(a.children=n),H(e.type,a,o||e.key,i||e.ref,null)}d={__e:function(e,t){for(var n,o,i;t=t.__;)if((n=t.__c)&&!n.__)try{if((o=n.constructor)&&o.getDerivedStateFromError!=null&&(n.setState(o.getDerivedStateFromError(e)),i=n.__d),n.componentDidCatch!=null&&(n.componentDidCatch(e),i=n.__d),i)return n.__E=n}catch(r){e=r}throw e},__v:0},Fe=function(e){return e!=null&&e.constructor===void 0},$.prototype.setState=function(e,t){var n;n=this.__s!=null&&this.__s!==this.state?this.__s:this.__s=w({},this.state),typeof e=="function"&&(e=e(w({},n),this.props)),e&&w(n,e),e!=null&&this.__v&&(t&&this.__h.push(t),oe(this))},$.prototype.forceUpdate=function(e){this.__v&&(this.__e=!0,e&&this.__h.push(e),oe(this))},$.prototype.render=O,R=[],ee=typeof Promise=="function"?Promise.prototype.then.bind(Promise.resolve()):setTimeout,D.__r=0,Ie=0;var de=function(e,t,n,o){var i;t0=0;for(var r=1;r<t.length;r++){var u=tr++,a=tr?(t0|=u?1:2,n[tr++]):t++r;u===3?o0=a:u===4?o1=Object.assign(o1||{},a):u===5?(o1=o1||{})[t++r]=a:u===6?o1[t++r]+=a+"":u?(i=e.apply(a,de(e,a,n,"",null)),o.push(i),a0?t0|=2:(tr-2=0,tr=i)):o.push(a)}return o},me=new Map;function he(e){var t=me.get(this);return t||(t=new Map,me.set(this,t)),(t=de(this,t.get(e)||(t.set(e,t=function(n){for(var o,i,r=1,u="",a="",c=0,p=function(_){r===1&&(_||(u=u.replace(/^\s*\n\s*|\s*\n\s*$/g,"")))?c.push(0,_,u):r===3&&(_||u)?(c.push(3,_,u),r=2):r===2&&u==="..."&&_?c.push(4,_,0):r===2&&u&&!_?c.push(5,0,!0,u):r>=5&&((u||!_&&r===5)&&(c.push(r,0,u,i),r=6),_&&(c.push(r,_,0,i),r=6)),u=""},s=0;s<n.length;s++){s&&(r===1&&p(),p(s));for(var f=0;f<ns.length;f++)o=nsf,r===1?o==="<"?(p(),c=c,r=3):u+=o:r===4?u==="--"&&o===">"?(r=1,u=""):u=o+u0:a?o===a?a="":u+=o:o==='"'||o==="'"?a=o:o===">"?(p(),r=1):r&&(o==="="?(r=5,i=u,u=""):o==="/"&&(r<5||nsf+1===">")?(p(),r===3&&(c=c0),r=c,(c=c0).push(2,0,r),r=0):o===" "||o===" "||o===` ||o==="\r"?(p(),r=2):u+=o),r===3&&u==="!--"&&(r=4,c=c[0])}return p(),c}(e)),t),arguments,[])).length>1?t:t[0]}var M=he.bind(C);var ve="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.13.3/katex.min.js",ge=!1,ye=()=>new Promise(async(e,t)=>{if(document.querySelector(scriptsrc="${ve}")){ge||await be(),e();return}let n=document.createElement("script");n.addEventListener("load",async()=>{await be(),ge=!0,e()}),n.addEventListener("error",o=>t(o)),n.src=ve,document.head.appendChild(n)}),be=()=>new Promise(e=>{let t=setInterval(()=>{!window.katex||(clearInterval(t),e())},500)});var I,b,xe,N=0,G=[],ke=d.__b,we=d.__r,Ce=d.diffed,Ee=d.__c,Se=d.unmount;function J(e,t){d.__h&&d.__h(b,e,N||t),N=0;var n=b.__H||(b.__H={__:[],__h:[]});return e>=n.__.length&&n.__.push({}),n.__[e]}function S(e){return N=1,qe(Re,e)}function qe(e,t,n){var o=J(I++,2);return o.t=e,o.__c||(o.__=[n?n(t):Re(void 0,t),function(i){var r=o.t(o.__[0],i);o.__[0]!==r&&(o.__=[r,o.__[1]],o.__c.setState({}))}],o.__c=b),o.__}function j(e,t){var n=J(I++,3);!d.__s&&Me(n.__H,t)&&(n.__=e,n.__H=t,b.__H.__h.push(n))}function y(e){return N=5,E(function(){return{current:e}},[])}function E(e,t){var n=J(I++,7);return Me(n.__H,t)&&(n.__=e(),n.__H=t,n.__h=e),n.__}function Te(e,t){return N=8,E(function(){return e},t)}function Ve(){G.forEach(function(e){if(e.__P)try{e.__H.__h.forEach(U),e.__H.__h.forEach(Y),e.__H.__h=[]}catch(t){e.__H.__h=[],d.__e(t,e.__v)}}),G=[]}d.__b=function(e){b=null,ke&&ke(e)},d.__r=function(e){we&&we(e),I=0;var t=(b=e.__c).__H;t&&(t.__h.forEach(U),t.__h.forEach(Y),t.__h=[])},d.diffed=function(e){Ce&&Ce(e);var t=e.__c;t&&t.__H&&t.__H.__h.length&&(G.push(t)!==1&&xe===d.requestAnimationFrame||((xe=d.requestAnimationFrame)||function(n){var o,i=function(){clearTimeout(r),je&&cancelAnimationFrame(o),setTimeout(n)},r=setTimeout(i,100);je&&(o=requestAnimationFrame(i))})(Ve)),b=void 0},d.__c=function(e,t){t.some(function(n){try{n.__h.forEach(U),n.__h=n.__h.filter(function(o){return!o.__||Y(o)})}catch(o){t.some(function(i){i.__h&&(i.__h=[])}),t=[],d.__e(o,n.__v)}}),Ee&&Ee(e,t)},d.unmount=function(e){Se&&Se(e);var t=e.__c;if(t&&t.__H)try{t.__H.__.forEach(U)}catch(n){d.__e(n,t.__v)}};var je=typeof requestAnimationFrame=="function";function U(e){var t=b;typeof e.__c=="function"&&e.__c(),b=t}function Y(e){var t=b;e.__c=e.__(),b=t}function Me(e,t){return!e||e.length!==t.length||t.some(function(n,o){return n!==e[o]})}function Re(e,t){return typeof t=="function"?t(e):t}var He=e=>{let t=y(null),[n,o]=S(e),[i,r]=S(void 0);return j(()=>{(async()=>{await ye();try{katex.render(n,t.current),r(void 0)}catch(u){u instanceof katex.ParseError&&r(u.message)}})()},[n,t]),{ref:t,formula:n,error:i,setFormula:o}};function Ke(e,t){var n,o=null,i=y(null),r=y(null),u=Te(function(s){r.current=s,p()},[]),a=y(null),c=y(),p=function(){var f=null;r.current?f=r.current:i.current?f=i.current:t instanceof HTMLElement&&(f=t),a.current!==f&&(c.current&&(c.current(),c.current=null),a.current=f,f&&(c.current=e(f)))};return t&&!(t instanceof HTMLElement)&&(o=t),j(function(){o&&(i.current=o.current),p()},[o,(n=o)==null?void 0:n.current,t]),u}function Ge(e){e===void 0&&(e={});var t=e.onResize,n=y(void 0);n.current=t;var o=y(),i=S({width:void 0,height:void 0}),r=i[0],u=i[1],a=y(!1);j(function(){return function(){a.current=!0}},[]);var c=y({width:void 0,height:void 0}),p=Ke(function(s){return o.current||(o.current=new ResizeObserver(function(f){if(!!Array.isArray(f)&&!!f.length){var _=f[0],l=Math.round(_.contentRect.width),h=Math.round(_.contentRect.height);if(c.current.width!==l||c.current.height!==h){var m={width:l,height:h};n.current?n.current(m):(c.current.width=l,c.current.height=h,a.current||u(m))}}})),o.current.observe(s),function(){o.current&&o.current.unobserve(s)}},e.ref);return E(function(){return{ref:p,width:r.width,height:r.height}},[p,r?r.width:null,r?r.height:null])}var Q=Ge;var Pe=class{get editor(){return document.getElementById("editor")}get lines(){return document.getElementsByClassName("lines")?.[0]}get computeLine(){return document.getElementById("compute-line")}get grid(){return document.getElementsByClassName("related-page-list clearfix")?.[0]?.getElementsByClassName("grid")?.[0]}get cursorLine(){return document.getElementsByClassName("cursor-line")?.[0]}get textInput(){return document.getElementById("text-input")}get cursor(){return document.getElementsByClassName("cursor")?.[0]}get selections(){return document.getElementsByClassName("selections")?.[0]}get popupMenu(){return document.getElementsByClassName("popup-menu")?.[0]}get pageMenus(){return document.getElementsByClassName("page-menu")?.[0]}get pageInfoMenu(){return document.getElementById("page-info-menu")}get pageEditMenu(){return document.getElementById("page-edit-menu")}get pageEditButtons(){return this.pageEditMenu.nextElementSibling.getElementsByTagName("a")}get randomJumpButton(){return document.getElementsByClassName("random-jump-button")?.[0]}get pageCustomButtons(){return document.getElementsByClassName("page-menu-extension")}},Ne=new Pe;function Z(){return(Z=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e}).apply(this,arguments)}function Je(e){this.getChildContext=function(){return e.context};var t=e.children,n=function(o,i){if(o==null)return{};var r,u,a={},c=Object.keys(o);for(u=0;u<c.length;u++)i.indexOf(r=c[u])>=0||(a[r]=o[r]);return a}(e,["context","children"]);return K(t,n)}function Ye(){var e=new CustomEvent("_preact",{detail:{},bubbles:!0,cancelable:!0});this.dispatchEvent(e),this._vdom=C(Je,Z({},this._props,{context:e.detail.context}),function t(n,o){if(n.nodeType===3)return n.data;if(n.nodeType!==1)return null;var i=[],r={},u=0,a=n.attributes,c=n.childNodes;for(u=a.length;u--;)a[u].name!=="slot"&&(r[a[u].name]=a[u].value,r[Ae(a[u].name)]=a[u].value);for(u=c.length;u--;){var p=t(c[u],null),s=c[u].slot;s?r[s]=C(Be,{name:s},p):i[u]=p}var f=o?C(Be,null,i):i;return C(o||n.nodeName.toLowerCase(),r,f)}(this,this._vdomComponent)),(this.hasAttribute("hydrate")?V:T)(this._vdom,this._root)}function Ae(e){return e.replace(/-(\w)/g,function(t,n){return n?n.toUpperCase():""})}function Qe(e,t,n){if(this._vdom){var o={};o[e]=n=n??void 0,o[Ae(e)]=n,this._vdom=K(this._vdom,o),T(this._vdom,this._root)}}function Ze(){T(this._vdom=null,this._root)}function Be(e,t){var n=this;return C("slot",Z({},e,{ref:function(o){o?(n.ref=o,n._listener||(n._listener=function(i){i.stopPropagation(),i.detail.context=t},o.addEventListener("_preact",n._listener))):n.ref.removeEventListener("_preact",n._listener)}}))}function Le(e,t,n,o){function i(){var r=Reflect.construct(HTMLElement,[],i);return r._vdomComponent=e,r._root=o&&o.shadow?r.attachShadow({mode:"open"}):r,r}return(i.prototype=Object.create(HTMLElement.prototype)).constructor=i,i.prototype.connectedCallback=Ye,i.prototype.attributeChangedCallback=Qe,i.prototype.disconnectedCallback=Ze,n=n||e.observedAttributes||Object.keys(e.propTypes||{}),i.observedAttributes=n,n.forEach(function(r){Object.defineProperty(i.prototype,r,{get:function(){return this._vdom.props[r]},set:function(u){this._vdom?this.attributeChangedCallback(r,null,u):(this._props||(this._props={}),this._props[r]=u,this.connectedCallback());var a=typeof u;u!=null&&a!=="string"&&a!=="boolean"&&a!=="number"||this.setAttribute(r,u)}})}),customElements.define(t||e.tagName||e.displayName||e.name,i)}function et(e){let{cursorTop:t=0,cursorLeft:n=0}=e??{},o=e?.open==="true",i=E(()=>({styleTop:t,styleLeft:n}),[t,n]),r=y(null),{ref:u,width:a=0}=Q(),{width:c=0}=Q({ref:Ne.editor}),p=E(()=>r?.current?.assignedNodes?.()?.length===0,[r]),s=tt(i),f=nt(i,p),_=rt(c,a,i,p);return M <style>
.popup-menu {
position:absolute;
left:0;
width:100%;
z-index:300;
transform:translateY(calc(-100% - 14px));
-webkit-user-select:none;
user-select:none;
font-family:"Open Sans",Helvetica,Arial,"Hiragino Sans",sans-serif;
pointer-events:none
}
.popup-menu .button-container {
position:relative;
display:inline-block;
max-width:70vw;
min-width:80px;
text-align:center;
background-color:#111;
padding:0 1px;
border-radius:4px;
pointer-events:auto
}
max-width:90vw
}
max-width:90vw
}
.popup-menu .triangle {
position:absolute;
transform:translateX(-50%);
width:0;
height:0;
border-top:6px solid #111; border-left:8px solid transparent;
border-right:8px solid transparent
}
max-width:80vw;
text-align:left
}
</style>
<div class="popup-menu" style="${s}" hidden="${!o}">
<div ref="${u}" class="button-container" style="${_}">
<slot ref="${r}"/>
</div>
<div class="triangle" style="${f}" />
</div>}var z="x-userscript-popup-container";Le(et,z,["open","cursor-top","cursor-left"],{shadow:!0});var tt=e=>({top:e.styleTop}),nt=(e,t)=>({left:e.styleLeft,...t?{borderTopColor:"#555"}:{}});function rt(e,t,n,o){let i=n.styleLeft/e*100,r=20/t*100,u=100-r;return{left:n.styleLeft,transform:translateX(-${Math.max(r,Math.min(i,u))}%),...o?{color:"#eee",fontSize:"11px",display:"inline-block",padding:"0 5px",cursor:"not-allowed",backgroundColor:"#555"}:{}}}var Oe=(e,t,n)=>j(()=>{let o=new MutationObserver(i=>{o.disconnect(),t(i);for(let r of e)r.current&&o.observe(r.current,n)});for(let i of e)i.current&&o.observe(i.current,n);return()=>o.disconnect()},[]);function $e(e,t=0,{immediate:n=!0}={}){if(typeof e!="function")throw new Error("argument is not function.");let o,i=!1,r=t>0?()=>new Promise(a=>setTimeout(()=>a(),t)):()=>{},u=async()=>{if(await r(),!o){i=!1;return}let{parameters:a,resolve:c}=o;o=void 0,c({result:await e(...a),executed:!0}),await u()};return(...a)=>new Promise(async c=>{if(i){o?.resolve?.({executed:!1}),o={parameters:a,resolve:c};return}i=!0,n?c({result:await e(...a),executed:!0}):(o?.resolve?.({executed:!1}),o={parameters:a,resolve:c}),await u()})}function De(e,{delay:t=100,immediate:n=!0}={},o=[]){let i=E(()=>$e(async r=>{let u=r.target,a=u.style.cssText.replace(/display: none;/,"").trim(),c=r.oldValue.replace(/display: none;/,"").trim();if(a===c)return;let p=parseInt(u.style.top),s=parseInt(u.style.left),f=parseInt(u.style.height),_=u.parentElement.getBoundingClientRect(),l={top:p+_.top,left:s+_.left,right:s+1+_.left,bottom:p+f+_.top,height:f,width:1},h=document.elementsFromPoint(l.left+l.width/2,l.top+l.height/2);await e({cursorRect:l,parentRect:_,elements:h})},t,{immediate:n}),o);Oe([{current:document.getElementsByClassName("cursor")?.[0]}],([r])=>i(r),{attributes:!0,attributeFilter:["style"],attributeOldValue:!0})}var ot=()=>{let{ref:e,error:t,setFormula:n}=He(""),[o,i]=S(!1),[r,u]=S({top:0,left:0});return De(({cursorRect:{left:a},parentRect:{top:c,left:p},elements:s})=>{let f=s.find(l=>l.classList.contains("formula"));if(!f){i(!1);return}i(!0),n(f.textContent.slice(3,-1));let{top:_}=f.getBoundingClientRect();u({top:_-c,left:a-p})}),M
<style>
.error {color:#fd7373; }
.katex-display {
display: inline-block !important;
margin: 0 !important;
text-align: inherit !important;
}
</style>
<${z} cursor-top="${r.top}" cursor-left="${r.left}" open="${o}">
${t&&M<span class="error">${t}</span>}
<span class="katex-display" ref="${e}" />
</${z}>
},W=document.createElement("div");W.dataset.userscriptName="katex-previewer";document.getElementById("editor").append(W);W.attachShadow({mode:"open"});T(M<${ot} />`,W.shadowRoot);