Convert src/compiler/compile/render_ssr/Renderer.ts to JavaScript

pull/8569/head
Simon Holthausen 3 years ago
parent 6f7d19c880
commit bedaf3b529

@ -1,29 +1,24 @@
import AwaitBlock from './handlers/AwaitBlock'; import AwaitBlock from './handlers/AwaitBlock.js';
import Comment from './handlers/Comment'; import Comment from './handlers/Comment.js';
import DebugTag from './handlers/DebugTag'; import DebugTag from './handlers/DebugTag.js';
import EachBlock from './handlers/EachBlock'; import EachBlock from './handlers/EachBlock.js';
import Element from './handlers/Element'; import Element from './handlers/Element.js';
import Head from './handlers/Head'; import Head from './handlers/Head.js';
import HtmlTag from './handlers/HtmlTag'; import HtmlTag from './handlers/HtmlTag.js';
import IfBlock from './handlers/IfBlock'; import IfBlock from './handlers/IfBlock.js';
import InlineComponent from './handlers/InlineComponent'; import InlineComponent from './handlers/InlineComponent.js';
import KeyBlock from './handlers/KeyBlock'; import KeyBlock from './handlers/KeyBlock.js';
import Slot from './handlers/Slot'; import Slot from './handlers/Slot.js';
import SlotTemplate from './handlers/SlotTemplate'; import SlotTemplate from './handlers/SlotTemplate.js';
import Tag from './handlers/Tag'; import Tag from './handlers/Tag.js';
import Text from './handlers/Text'; import Text from './handlers/Text.js';
import Title from './handlers/Title'; import Title from './handlers/Title.js';
import { AppendTarget, CompileOptions } from '../../interfaces'; import { collapse_template_literal } from '../utils/collapse_template_literal.js';
import { INode } from '../nodes/interfaces'; import { escape_template } from '../utils/stringify.js';
import { Expression, TemplateLiteral, Identifier } from 'estree';
import { collapse_template_literal } from '../utils/collapse_template_literal';
import { escape_template } from '../utils/stringify';
type Handler = (node: any, renderer: Renderer, options: CompileOptions) => void;
function noop() { } function noop() { }
const handlers: Record<string, Handler> = { /** @type {Record<string, Handler>} */
const handlers = {
AwaitBlock, AwaitBlock,
Body: noop, Body: noop,
Comment, Comment,
@ -35,7 +30,7 @@ const handlers: Record<string, Handler> = {
IfBlock, IfBlock,
InlineComponent, InlineComponent,
KeyBlock, KeyBlock,
MustacheTag: Tag, // TODO MustacheTag is an anachronism MustacheTag: Tag,
Options: noop, Options: noop,
RawMustacheTag: HtmlTag, RawMustacheTag: HtmlTag,
Slot, Slot,
@ -44,86 +39,98 @@ const handlers: Record<string, Handler> = {
Title, Title,
Window: noop Window: noop
}; };
/** */
export interface RenderOptions extends CompileOptions {
locate: (c: number) => { line: number; column: number };
head_id?: string;
has_added_svelte_hash?: boolean;
}
export default class Renderer { export default class Renderer {
/** @default false */
has_bindings = false; has_bindings = false;
name: Identifier; /** @type {import('estree').Identifier} */
name = undefined;
stack: Array<{ current: { value: string }; literal: TemplateLiteral }> = []; /**
current: { value: string }; // TODO can it just be `current: string`? * @default []
literal: TemplateLiteral; * @type {Array<{ current: { value: string }; literal: TemplateLiteral }>}
*/
stack = [];
targets: AppendTarget[] = []; /** @type {{ value: string }} */
current = undefined; // TODO can it just be `current: string`?
/** @type {import('estree').TemplateLiteral} */
literal = undefined;
/**
* @default []
* @type {AppendTarget[]}
*/
targets = [];
constructor({ name }) { constructor({ name }) {
this.name = name; this.name = name;
this.push(); this.push();
} }
add_string(str: string) { /** @param {string} str */
add_string(str) {
this.current.value += escape_template(str); this.current.value += escape_template(str);
} }
add_expression(node: Expression) { /** @param {import('estree').Expression} node */
add_expression(node) {
this.literal.quasis.push({ this.literal.quasis.push({
type: 'TemplateElement', type: 'TemplateElement',
value: { raw: this.current.value, cooked: null }, value: { raw: this.current.value, cooked: null },
tail: false tail: false
}); });
this.literal.expressions.push(node); this.literal.expressions.push(node);
this.current.value = ''; this.current.value = '';
} }
push() { push() {
const current = (this.current = { value: '' }); const current = (this.current = { value: '' });
const literal = (this.literal = { const literal = (this.literal = {
type: 'TemplateLiteral', type: 'TemplateLiteral',
expressions: [], expressions: [],
quasis: [] quasis: []
}); });
this.stack.push({ current, literal }); this.stack.push({ current, literal });
} }
pop() { pop() {
this.literal.quasis.push({ this.literal.quasis.push({
type: 'TemplateElement', type: 'TemplateElement',
value: { raw: this.current.value, cooked: null }, value: { raw: this.current.value, cooked: null },
tail: true tail: true
}); });
const popped = this.stack.pop(); const popped = this.stack.pop();
const last = this.stack[this.stack.length - 1]; const last = this.stack[this.stack.length - 1];
if (last) { if (last) {
this.literal = last.literal; this.literal = last.literal;
this.current = last.current; this.current = last.current;
} }
// Optimize the TemplateLiteral to remove unnecessary nodes // Optimize the TemplateLiteral to remove unnecessary nodes
collapse_template_literal(popped.literal); collapse_template_literal(popped.literal);
return popped.literal; return popped.literal;
} }
render(nodes: INode[], options: RenderOptions) { /**
* @param {INode[]} nodes
* @param {RenderOptions} options
*/
render(nodes, options) {
nodes.forEach((node) => { nodes.forEach((node) => {
const handler = handlers[node.type]; const handler = handlers[node.type];
if (!handler) { if (!handler) {
throw new Error(`No handler for '${node.type}' nodes`); throw new Error(`No handler for '${node.type}' nodes`);
} }
handler(node, this, options); handler(node, this, options);
}); });
} }
} }
/** @typedef {(node: any, renderer: Renderer, options: CompileOptions) => void} Handler */
/** @typedef {Object} RenderOptions
* @property {(c:number)=>{line:number;column:number}} locate
* @property {string} [head_id]
* @property {boolean} [has_added_svelte_hash]
*/

@ -1,6 +1,6 @@
/** /**
* @param {Let[]} lets * @param {import('../../../nodes/Let.js').default[]} lets
* @returns {import("C:/repos/svelte/svelte/node_modules/.pnpm/@types+estree@1.0.0/node_modules/@types/estree/index").ObjectPattern} * @returns {import('estree').ObjectPattern}
*/ */
export function get_slot_scope(lets) { export function get_slot_scope(lets) {
if (lets.length === 0) return null; if (lets.length === 0) return null;

Loading…
Cancel
Save