@yuebai008/cli
Version:
Command line interface for rapid qg-minigame development
5 lines • 2.4 kB
JavaScript
import*as LitHtml from"../../lit-html/lit-html.js";import*as ComponentHelpers from"../../components/helpers/helpers.js";import markdownViewStyles from"./markdownView.css.js";import{MarkdownLink}from"./MarkdownLink.js";import{MarkdownImage}from"./MarkdownImage.js";const html=LitHtml.html,render=LitHtml.render;export class MarkdownView extends HTMLElement{static litTagName=LitHtml.literal`devtools-markdown-view`;#e=this.attachShadow({mode:"open"});#t=[];connectedCallback(){this.#e.adoptedStyleSheets=[markdownViewStyles]}set data(e){this.#t=e.tokens,this.#r()}#r(){this.#n()}#n(){render(html`
<div class='message'>
${this.#t.map(renderToken)}
</div>
`,this.#e,{host:this})}}ComponentHelpers.CustomElements.defineComponent("devtools-markdown-view",MarkdownView);const renderChildTokens=e=>{if("tokens"in e&&e.tokens)return e.tokens.map(renderToken);throw new Error("Tokens not found")},unescape=e=>{const t=new Map([["&","&"],["<","<"],[">",">"],[""",'"'],["'","'"]]);return e.replace(/&(amp|lt|gt|quot|#39);/g,(e=>{const r=t.get(e);return r||e}))},renderText=e=>"tokens"in e&&e.tokens?html`${renderChildTokens(e)}`:html`${unescape("text"in e?e.text:"")}`,renderHeading=e=>{switch(e.depth){case 1:return html`<h1>${renderText(e)}</h1>`;case 2:return html`<h2>${renderText(e)}</h2>`;case 3:return html`<h3>${renderText(e)}</h3>`;case 4:return html`<h4>${renderText(e)}</h4>`;case 5:return html`<h5>${renderText(e)}</h5>`;default:return html`<h6>${renderText(e)}</h6>`}};function templateForToken(e){switch(e.type){case"paragraph":return html`<p>${renderChildTokens(e)}`;case"list":return html`<ul>${e.items.map(renderToken)}</ul>`;case"list_item":return html`<li>${renderChildTokens(e)}`;case"text":return renderText(e);case"codespan":return html`<code>${unescape(e.text)}</code>`;case"space":return html``;case"link":return html`<${MarkdownLink.litTagName} .data=${{key:e.href,title:e.text}}></${MarkdownLink.litTagName}>`;case"image":return html`<${MarkdownImage.litTagName} .data=${{key:e.href,title:e.text}}></${MarkdownImage.litTagName}>`;case"heading":return renderHeading(e);case"strong":return html`<strong>${renderText(e)}</strong>`;case"em":return html`<em>${renderText(e)}</em>`;default:return null}}export const renderToken=e=>{const t=templateForToken(e);if(null===t)throw new Error(`Markdown token type '${e.type}' not supported.`);return t};