109 lines
2.4 KiB
TypeScript
109 lines
2.4 KiB
TypeScript
import {
|
|
AnyNode,
|
|
Attrs,
|
|
Elem,
|
|
Fragment,
|
|
isElem,
|
|
isFragment,
|
|
isTextNode,
|
|
TextNode,
|
|
} from "../core/node.ts";
|
|
import { concat, join } from "../core/utils.ts";
|
|
import { Renderer } from "./types.ts";
|
|
|
|
interface StrRendererOpts {
|
|
doctype?: string;
|
|
forceRenderDoctype?: boolean;
|
|
wrapNode?: (node: AnyNode) => AnyNode;
|
|
}
|
|
|
|
export class StrRenderer implements Renderer<string> {
|
|
#doctype: string;
|
|
#forceRenderDoctype: boolean;
|
|
#wrapNode: (node: AnyNode) => AnyNode;
|
|
|
|
constructor(opts?: StrRendererOpts) {
|
|
this.#doctype = opts?.doctype ?? "html";
|
|
this.#forceRenderDoctype = opts?.forceRenderDoctype ?? false;
|
|
this.#wrapNode = opts?.wrapNode ?? identity;
|
|
}
|
|
|
|
render(node: AnyNode): string {
|
|
const wrappedNode = this.#wrapNode(node);
|
|
const shouldRenderDoctype = this.#forceRenderDoctype ||
|
|
(isElem(wrappedNode) && wrappedNode.tagName === "html");
|
|
return concat([
|
|
shouldRenderDoctype && encodeDoctype(this.#doctype),
|
|
encodeAnyNode(wrappedNode),
|
|
]);
|
|
}
|
|
}
|
|
|
|
function identity<T>(val: T): T {
|
|
return val;
|
|
}
|
|
|
|
function encodeDoctype(value: string): string {
|
|
return `<!doctype ${value}>`;
|
|
}
|
|
|
|
function encodeAnyNode(node: AnyNode): string {
|
|
return isTextNode(node)
|
|
? encodeTextNode(node)
|
|
: isFragment(node)
|
|
? encodeHtmlFragment(node)
|
|
: encodeHtmlElement(node);
|
|
}
|
|
|
|
function encodeTextNode(node: TextNode): string {
|
|
return node.innerText;
|
|
}
|
|
|
|
function encodeHtmlFragment(node: Fragment): string {
|
|
return concat(node.children.map(encodeAnyNode));
|
|
}
|
|
|
|
function encodeHtmlElement(
|
|
{ tagName, attrs, children }: Elem,
|
|
): string {
|
|
const open = `<${join(" ", [tagName, encodeAttrs(attrs)])}>`;
|
|
if (isSelfClosedTagName(tagName)) return open;
|
|
|
|
const encodedChildren = children.map(encodeAnyNode);
|
|
return `${open}${concat(encodedChildren)}</${tagName}>`;
|
|
}
|
|
|
|
function encodeAttrs(attrs: Attrs): string {
|
|
return join(
|
|
" ",
|
|
Object.entries(attrs).map(([key, value]) => encodeAttr(key, value)),
|
|
);
|
|
}
|
|
|
|
function encodeAttr(key: string, value: string): string {
|
|
return `${key}="${value}"`;
|
|
}
|
|
|
|
function isSelfClosedTagName(tagName: string): boolean {
|
|
return SELF_CLOSED_HTML_TAG_NAMES.includes(tagName);
|
|
}
|
|
|
|
const SELF_CLOSED_HTML_TAG_NAMES = [
|
|
"area",
|
|
"base",
|
|
"br",
|
|
"col",
|
|
"embed",
|
|
"hr",
|
|
"img",
|
|
"input",
|
|
"link",
|
|
"meta",
|
|
"param",
|
|
"source",
|
|
"track",
|
|
"wbr",
|
|
"command",
|
|
"keygen",
|
|
"menuitem",
|
|
];
|