Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 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 | 110x 29x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 110x 174x 174x 174x 174x 174x 1x 1x 1x 1x 1x 1x 1x 110x 110x 110x 498x 498x 498x 498x 110x 110x 110x 1x 1x 1x 6x 110x | import { html } from 'lit';
import { unsafeHTML } from 'lit-html/directives/unsafe-html.js';
import {
directive,
Directive,
Part,
PartInfo,
PartType
} from 'lit/directive.js';
import { Remarkable } from 'remarkable';
export const markdown = new Remarkable();
// Base class for markdown rendering directives
abstract class BaseMarkdownDirective extends Directive {
constructor(partInfo: PartInfo) {
super(partInfo);
// When necessary, validate part in constructor using `part.type`
if (partInfo.type !== PartType.CHILD) {
throw new Error('markdown directives only support child expressions');
}
}
// Optional: override update to perform any direct DOM manipulation
update(part: Part, [initialValue]: any) {
/* Any imperative updates to DOM/parts would go here */
return this.render(initialValue);
}
// Abstract method to be implemented by subclasses
abstract render(initialValue: string): any;
}
// Class-based directive for block markdown rendering
export class RenderMarkdown extends BaseMarkdownDirective {
render(initialValue: string) {
return html`${unsafeHTML(markdown.render(initialValue))}`;
}
}
// Class-based directive for inline markdown rendering
export class RenderMarkdownInline extends BaseMarkdownDirective {
render(initialValue: string) {
return html`${unsafeHTML(markdown.renderInline(initialValue))}`;
}
}
export const renderMarkdown = directive(RenderMarkdown);
export const renderMarkdownInline = directive(RenderMarkdownInline);
|