-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.min.js
232 lines (200 loc) · 16.8 KB
/
index.min.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
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
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
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
var h={},o=function(){let y=/\blang(?:uage)?-([\w-]+)\b/i,u=0;var t=h.Prism={manual:h.Prism&&h.Prism.manual,disableWorkerMessageHandler:h.Prism&&h.Prism.disableWorkerMessageHandler,util:{encode(e){return e instanceof p?new p(e.type,t.util.encode(e.content),e.alias):t.util.type(e)==="Array"?e.map(t.util.encode):e.replace(/&/g,"&").replace(/</g,"<").replace(/\u00a0/g," ")},type(e){return Object.prototype.toString.call(e).match(/\[object (\w+)\]/)[1]},objId(e){return e.__id||Object.defineProperty(e,"__id",{value:++u}),e.__id},clone(e,a){var i=t.util.type(e);switch(a=a||{},i){case"Object":if(a[t.util.objId(e)])return a[t.util.objId(e)];var n={};a[t.util.objId(e)]=n;for(var r in e)e.hasOwnProperty(r)&&(n[r]=t.util.clone(e[r],a));return n;case"Array":if(a[t.util.objId(e)])return a[t.util.objId(e)];var n=[];return a[t.util.objId(e)]=n,e.forEach(function(l,d){n[d]=t.util.clone(l,a)}),n}return e}},languages:{extend(e,a){var i=t.util.clone(t.languages[e]);for(var n in a)i[n]=a[n];return i},insertBefore(e,a,i,n){n=n||t.languages;var r=n[e];if(arguments.length==2){i=arguments[1];for(var l in i)i.hasOwnProperty(l)&&(r[l]=i[l]);return r}var d={};for(var s in r)if(r.hasOwnProperty(s)){if(s==a)for(var l in i)i.hasOwnProperty(l)&&(d[l]=i[l]);d[s]=r[s]}return t.languages.DFS(t.languages,function(f,b){b===n[e]&&f!=e&&(this[f]=d)}),n[e]=d},DFS(e,a,i,n){n=n||{};for(var r in e)e.hasOwnProperty(r)&&(a.call(e,r,e[r],i||r),t.util.type(e[r])==="Object"&&!n[t.util.objId(e[r])]?(n[t.util.objId(e[r])]=!0,t.languages.DFS(e[r],a,null,n)):t.util.type(e[r])==="Array"&&!n[t.util.objId(e[r])]&&(n[t.util.objId(e[r])]=!0,t.languages.DFS(e[r],a,r,n)))}},plugins:{},highlightAll(e,a){t.highlightAllUnder(document,e,a)},highlightAllUnder(e,a,i){var n={callback:i,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};t.hooks.run("before-highlightall",n);for(var r=n.elements||e.querySelectorAll(n.selector),l=0,d;d=r[l++];)t.highlightElement(d,a===!0,n.callback)},highlightElement(e,a,i){for(var n,r,l=e;l&&!y.test(l.className);)l=l.parentNode;l&&(n=(l.className.match(y)||[,""])[1].toLowerCase(),r=t.languages[n]),e.className=e.className.replace(y,"").replace(/\s+/g," ")+" language-"+n,e.parentNode&&(l=e.parentNode,/pre/i.test(l.nodeName)&&(l.className=l.className.replace(y,"").replace(/\s+/g," ")+" language-"+n));var d=e.textContent,s={element:e,language:n,grammar:r,code:d};if(t.hooks.run("before-sanity-check",s),!s.code||!s.grammar){s.code&&(t.hooks.run("before-highlight",s),s.element.textContent=s.code,t.hooks.run("after-highlight",s)),t.hooks.run("complete",s);return}if(t.hooks.run("before-highlight",s),a&&h.Worker){var f=new Worker(t.filename);f.onmessage=function(b){s.highlightedCode=b.data,t.hooks.run("before-insert",s),s.element.innerHTML=s.highlightedCode,i&&i.call(s.element),t.hooks.run("after-highlight",s),t.hooks.run("complete",s)},f.postMessage(JSON.stringify({language:s.language,code:s.code,immediateClose:!0}))}else s.highlightedCode=t.highlight(s.code,s.grammar,s.language),t.hooks.run("before-insert",s),s.element.innerHTML=s.highlightedCode,i&&i.call(e),t.hooks.run("after-highlight",s),t.hooks.run("complete",s)},highlight(e,a,i){var n={code:e,grammar:a,language:i};return t.hooks.run("before-tokenize",n),n.tokens=t.tokenize(n.code,n.grammar),t.hooks.run("after-tokenize",n),p.stringify(t.util.encode(n.tokens),n.language)},matchGrammar(e,a,i,n,r,l,d){var s=t.Token;for(var f in i)if(!(!i.hasOwnProperty(f)||!i[f])){if(f==d)return;var b=i[f];b=t.util.type(b)==="Array"?b:[b];for(var j=0;j<b.length;++j){var g=b[j],T=g.inside,M=!!g.lookbehind,z=!!g.greedy,C=0,O=g.alias;if(z&&!g.pattern.global){var N=g.pattern.toString().match(/[imuy]*$/)[0];g.pattern=RegExp(g.pattern.source,N+"g")}g=g.pattern||g;for(var m=n,k=r;m<a.length;k+=a[m].length,++m){var v=a[m];if(a.length>e.length)return;if(!(v instanceof s)){if(z&&m!=a.length-1){g.lastIndex=k;var c=g.exec(e);if(!c)break;for(var F=c.index+(M?c[1].length:0),P=c.index+c[0].length,w=m,x=k,H=a.length;w<H&&(x<P||!a[w].type&&!a[w-1].greedy);++w)x+=a[w].length,F>=x&&(++m,k=x);if(a[m]instanceof s)continue;_=w-m,v=e.slice(k,x),c.index-=k}else{g.lastIndex=0;var c=g.exec(v),_=1}if(!c){if(l)break;continue}M&&(C=c[1]?c[1].length:0);var F=c.index+C,c=c[0].slice(C),P=F+c.length,$=v.slice(0,F),I=v.slice(P),S=[m,_];$&&(++m,k+=$.length,S.push($));var B=new s(f,T?t.tokenize(c,T):c,O,c,z);if(S.push(B),I&&S.push(I),Array.prototype.splice.apply(a,S),_!=1&&t.matchGrammar(e,a,i,m,k,!0,f),l)break}}}}},tokenize(e,a,i){var n=[e],r=a.rest;if(r){for(var l in r)a[l]=r[l];delete a.rest}return t.matchGrammar(e,n,a,0,0,!1),n},hooks:{all:{},add(e,a){var i=t.hooks.all;i[e]=i[e]||[],i[e].push(a)},run(e,a){var i=t.hooks.all[e];if(!(!i||!i.length))for(var n=0,r;r=i[n++];)r(a)}}},p=t.Token=function(e,a,i,n,r){this.type=e,this.content=a,this.alias=i,this.length=(n||"").length|0,this.greedy=!!r};return p.stringify=function(e,a,i){if(typeof e=="string")return e;if(t.util.type(e)==="Array")return e.map(l=>p.stringify(l,a,e)).join("");let n={type:e.type,content:p.stringify(e.content,a,i),tag:"span",classes:["token",e.type],attributes:{},language:a,parent:i};if(e.alias){let l=t.util.type(e.alias)==="Array"?e.alias:[e.alias];Array.prototype.push.apply(n.classes,l)}t.hooks.run("wrap",n);let r=Object.keys(n.attributes).map(l=>l+'="'+(n.attributes[l]||"").replace(/"/g,""")+'"').join(" ");return`<${n.tag} class="${n.classes.join(" ")}"${r?" "+r:""}>${n.content}</${n.tag}>`},h.document||h.addEventListener&&(t.disableWorkerMessageHandler||h.addEventListener("message",e=>{var a=JSON.parse(e.data),i=a.language,n=a.code,r=a.immediateClose;h.postMessage(t.highlight(n,t.languages[i],i)),r&&h.close()},!1)),h.Prism}();typeof module!="undefined"&&module.exports&&(module.exports=o);typeof global!="undefined"&&(global.Prism=o);o.languages.markup={comment:/<!--[\s\S]*?-->/,prolog:/<\?[\s\S]+?\?>/,doctype:/<!DOCTYPE[\s\S]+?>/i,cdata:/<!\[CDATA\[[\s\S]*?]]>/i,tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s+[^\s>\/=]+(?:=(?:("|')(?:\\[\s\S]|(?!\1)[^\\])*\1|[^\s'">=]+))?)*\s*\/?>/i,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/i,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"attr-value":{pattern:/=(?:("|')(?:\\[\s\S]|(?!\1)[^\\])*\1|[^\s'">=]+)/i,inside:{punctuation:[/^=/,{pattern:/(^|[^\\])["']/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:/&#?[\da-z]{1,8};/i};o.languages.markup.tag.inside["attr-value"].inside.entity=o.languages.markup.entity;o.hooks.add("wrap",y=>{y.type==="entity"&&(y.attributes.title=y.content.replace(/&/,"&"))});o.languages.xml=o.languages.markup;o.languages.html=o.languages.markup;o.languages.mathml=o.languages.markup;o.languages.svg=o.languages.markup;o.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:/@[\w-]+?.*?(?:;|(?=\s*\{))/i,inside:{rule:/@[\w-]+/}},url:/url\((?:(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1|.*?)\)/i,selector:/[^{}\s][^{};]*?(?=\s*\{)/,string:{pattern:/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},property:/[-_a-z\xA0-\uFFFF][-\w\xA0-\uFFFF]*(?=\s*:)/i,important:/\B!important\b/i,function:/[-a-z0-9]+(?=\()/i,punctuation:/[(){};:]/};o.languages.css.atrule.inside.rest=o.languages.css;o.languages.markup&&(o.languages.insertBefore("markup","tag",{style:{pattern:/(<style[\s\S]*?>)[\s\S]*?(?=<\/style>)/i,lookbehind:!0,inside:o.languages.css,alias:"language-css",greedy:!0}}),o.languages.insertBefore("inside","attr-value",{"style-attr":{pattern:/\s*style=("|')(?:\\[\s\S]|(?!\1)[^\\])*\1/i,inside:{"attr-name":{pattern:/^\s*style/i,inside:o.languages.markup.tag.inside},punctuation:/^\s*=\s*['"]|['"]\s*$/,"attr-value":{pattern:/.+/i,inside:o.languages.css}},alias:"language-css"}},o.languages.markup.tag));o.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/((?:\b(?:class|interface|extends|implements|trait|instanceof|new)\s+)|(?:catch\s+\())[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/,boolean:/\b(?:true|false)\b/,function:/[a-z0-9_]+(?=\()/i,number:/\b0x[\da-f]+\b|(?:\b\d+\.?\d*|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/--?|\+\+?|!=?=?|<=?|>=?|==?=?|&&?|\|\|?|\?|\*|\/|~|\^|%/,punctuation:/[{}[\];(),.:]/};o.languages.javascript=o.languages.extend("clike",{keyword:/\b(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|var|void|while|with|yield)\b/,number:/\b(?:0[xX][\dA-Fa-f]+|0[bB][01]+|0[oO][0-7]+|NaN|Infinity)\b|(?:\b\d+\.?\d*|\B\.\d+)(?:[Ee][+-]?\d+)?/,function:/[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*\()/i,operator:/-[-=]?|\+[+=]?|!=?=?|<<?=?|>>?>?=?|=(?:==?|>)?|&[&=]?|\|[|=]?|\*\*?=?|\/=?|~|\^=?|%=?|\?|\.{3}/});o.languages.insertBefore("javascript","keyword",{regex:{pattern:/((?:^|[^$\w\xA0-\uFFFF."'\])\s])\s*)\/(\[[^\]\r\n]+]|\\.|[^/\\\[\r\n])+\/[gimyu]{0,5}(?=\s*($|[\r\n,.;})\]]))/,lookbehind:!0,greedy:!0},"function-variable":{pattern:/[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*=\s*(?:function\b|(?:\([^()]*\)|[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)\s*=>))/i,alias:"function"},constant:/\b[A-Z][A-Z\d_]*\b/});o.languages.insertBefore("javascript","string",{"template-string":{pattern:/`(?:\\[\s\S]|\${[^}]+}|[^\\`])*`/,greedy:!0,inside:{interpolation:{pattern:/\${[^}]+}/,inside:{"interpolation-punctuation":{pattern:/^\${|}$/,alias:"punctuation"},rest:null}},string:/[\s\S]+/}}});o.languages.javascript["template-string"].inside.interpolation.inside.rest=o.languages.javascript;o.languages.markup&&o.languages.insertBefore("markup","tag",{script:{pattern:/(<script[\s\S]*?>)[\s\S]*?(?=<\/script>)/i,lookbehind:!0,inside:o.languages.javascript,alias:"language-javascript",greedy:!0}});o.languages.js=o.languages.javascript;var L=o;var A=class extends HTMLElement{attributeChangedCallback(u,t,p){t!==p&&(this[u]=p)}get source(){return this._source}set source(u){this._source=u,this.setSource()}constructor(){super();let u=document.createElement("template");u.innerHTML=A.default(),this.attachShadow({mode:"open"}),this.shadowRoot.appendChild(document.importNode(u.content,!0)),this.sourceElement=this.shadowRoot.getElementById("source")}setSource(){let u=this._source;u=u.replace(/</g,"<"),u=u.replace(/>/g,">"),this.sourceElement.innerHTML=u,L.highlightElement(this.sourceElement)}static default(){return`
<style>
/**
* okaidia theme for JavaScript, CSS and HTML
* Loosely based on Monokai textmate theme by http://www.monokai.nl/
* @author ocodia
*/
code[class*="language-"],
pre[class*="language-"] {
color: #f8f8f2;
background: none;
text-shadow: 0 1px rgba(0, 0, 0, 0.3);
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
font-size: 1em;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
border-radius: 0.3em;
}
:not(pre) > code[class*="language-"],
pre[class*="language-"] {
background: #272822;
}
/* Inline code */
:not(pre) > code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: slategray;
}
.token.punctuation {
color: #f8f8f2;
}
.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
color: #f92672;
}
.token.boolean,
.token.number {
color: #ae81ff;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #a6e22e;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable {
color: #f8f8f2;
}
.token.atrule,
.token.attr-value,
.token.function,
.token.class-name {
color: #e6db74;
}
.token.keyword {
color: #66d9ef;
}
.token.regex,
.token.important {
color: #fd971f;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
</style>
<pre><code id="source" class="language-html"></code></pre>`}};customElements.define("source-element",A);var E=class extends HTMLElement{static get observedAttributes(){return["title","link","desc","src"]}attributeChangedCallback(u,t,p){!this.__initialized||t!==p&&(this[u]=p)}get title(){return this.getAttribute("title")}set title(u){this.setAttribute("title",u),this.setTitle()}get link(){return this.getAttribute("link")}set link(u){this.setAttribute("link",u),this.setLink()}get desc(){return this.getAttribute("desc")}set desc(u){this.setAttribute("desc",u),this.setDescription()}get src(){return this.getAttribute("src")}set src(u){this.setAttribute("src",u),this.setSrc()}constructor(){super();let u=document.createElement("template");u.innerHTML=E.template(),this.appendChild(u.content.cloneNode(!0)),this.__initialized=null,this.titleElement=this.querySelector("#title"),this.linkElement=this.querySelector("#link"),this.descElement=this.querySelector("#description"),this.sourceElement=this.querySelector("#source"),this.outputElement=this.querySelector("#output")}async connectedCallback(){this.hasAttribute("link")&&this.setLink(),this.hasAttribute("desc")&&this.setDescription(),this.hasAttribute("title")&&this.setTitle(),this.hasAttribute("src")&&this.setSrc(),this.__initialized=!0}setTitle(){this.titleElement.innerText=this.getAttribute("title")}setLink(){this.linkElement.href=this.getAttribute("link")}setDescription(){this.descElement.innerText=this.getAttribute("desc")}async setSrc(){let u=this.getAttribute("src");this.source=await this.fetchSrc(u),this.sourceElement.source=this.source,this.outputElement.innerHTML=this.source}async fetchSrc(u){return(await fetch(u)).text()}static template(){return`
<style>
@import url('https://fonts.googleapis.com/css?family=Lato|Roboto|Source+Code+Pro');
body {
font-family: 'Lato', san-serif;
}
h1, h2, h3, h4, h5 {
font-family: 'Roboto', sans-serif;
font-weight: 900;
margin: 0;
}
h2 {
margin-bottom: 10px;
}
hr {
margin: 20px;
}
textarea {
width:100%;
white-space: nowrap;
}
code {
font-family: 'Source Code Pro', monospace;
}
#header {
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height: 50px;
background: #333333;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
z-index: 999;
}
#title {
float: left;
padding-top: 10px;
padding-left: 10%;
color: white;
font-size: 1.25rem;
}
#link {
float: right;
padding-top: 10px;
padding-right: 10%;
font-size: 1.25rem;
font-weight: 600;
text-decoration: none;
color: white;
}
#container {
width: 80%;
max-width: 960px;
padding: 0 50px 0 50px;
margin: 0 auto;
display: block;
overflow-x: hidden;
background: #F0F0F0;
}
#content {
background: #F0F0F0;
margin: 50px auto 0 auto;
padding: 20px 0 20px 0;
}
#run {
margin-top: 10px;
border-radius: 15%;
}
#output {
display: block;
overflow: auto;
background-color: lightblue;
padding: .5em;
}
</style>
<div id="header">
<h1 id="title"></h1>
<h1><a id="link">GitHub</a></h1>
</div>
<div id="container">
<section id="content">
<h2>Description</h2>
<p id="description"></p>
<hr>
<h2>Usage</h2>
<source-element id="source"></source-element>
<hr />
<h2>Output</h2>
<div id="output"></div>
</section>
</div>
`}};customElements.define("wc-demo",E);export{E as WCDemo};