start moving build logic into individual nodes

src/generators/Generator.ts

@@ -715,6 +715,9 @@ export default class Generator {
 				if (node.type === 'Element' && (node.name === ':Component' || node.name === ':Self' || generator.components.has(node.name))) {
 					node.type = 'Component';
 					node.__proto__ = nodes.Component.prototype;
+				} else if (node.name === ':Window') { // TODO do this in parse?
+					node.type = 'Window';
+					node.__proto__ = nodes.Window.prototype;
 				} else if (node.type in nodes) {
 					node.__proto__ = nodes[node.type].prototype;
 				}

src/generators/dom/State.ts

@@ -25,7 +25,7 @@ export default class State {
 		assign(this, data)
 	}
 
-	child(data: StateData) {
+	child(data?: StateData) {
 		return new State(assign({}, this, {
 			parentNode: null,
 			parentNodes: 'nodes'

src/generators/dom/index.ts

@@ -103,7 +103,7 @@ export default function dom(
 	// parsed.html.children.forEach((node: Node) => {
 	// 	visit(generator, block, state, node, [], []);
 	// });
-	parsed.html.build();
+	parsed.html.build(block, state);
 
 	const builder = new CodeBuilder();
 	const computationBuilder = new CodeBuilder();

src/generators/dom/visitors/shared/Tag.ts

@@ -2,7 +2,7 @@ import deindent from '../../../../utils/deindent';
 import { DomGenerator } from '../../index';
 import Block from '../../Block';
 import { Node } from '../../../../interfaces';
-import { State } from '../../interfaces';
+import State from '../../State';
 
 export default function visitTag(
 	generator: DomGenerator,

src/generators/nodes/AwaitBlock.ts

@@ -1,10 +1,11 @@
 import Node from './shared/Node';
 import { DomGenerator } from '../dom/index';
 import Block from '../dom/Block';
+import visitAwaitBlock from '../dom/visitors/AwaitBlock';
 import PendingBlock from './PendingBlock';
 import ThenBlock from './ThenBlock';
 import CatchBlock from './CatchBlock';
-import { State } from '../dom/interfaces';
+import State from '../dom/State';
 import createDebuggingComment from '../../utils/createDebuggingComment';
 
 export default class AwaitBlock extends Node {
@@ -65,4 +66,13 @@ export default class AwaitBlock extends Node {
 		this.then._block.hasUpdateMethod = dynamic;
 		this.catch._block.hasUpdateMethod = dynamic;
 	}
+
+	build(
+		block: Block,
+		state: State,
+		elementStack: Node[],
+		componentStack: Node[]
+	) {
+		visitAwaitBlock(this.generator, block, state, this, elementStack, componentStack);
+	}
 }

src/generators/nodes/Component.ts

@@ -1,6 +1,7 @@
 import Node from './shared/Node';
 import Block from '../dom/Block';
 import State from '../dom/State';
+import visitComponent from '../dom/visitors/Component';
 
 export default class Component extends Node {
 	type: 'Component'; // TODO fix this?
@@ -58,4 +59,13 @@ export default class Component extends Node {
 			});
 		}
 	}
+
+	build(
+		block: Block,
+		state: State,
+		elementStack: Node[],
+		componentStack: Node[]
+	) {
+		visitComponent(this.generator, block, state, this, elementStack, componentStack);
+	}
 }

src/generators/nodes/EachBlock.ts

@@ -3,6 +3,7 @@ import ElseBlock from './ElseBlock';
 import { DomGenerator } from '../dom/index';
 import Block from '../dom/Block';
 import State from '../dom/State';
+import visitEachBlock from '../dom/visitors/EachBlock';
 import createDebuggingComment from '../../utils/createDebuggingComment';
 
 export default class EachBlock extends Node {
@@ -112,4 +113,13 @@ export default class EachBlock extends Node {
 			this.else._block.hasUpdateMethod = this.else._block.dependencies.size > 0;
 		}
 	}
+
+	build(
+		block: Block,
+		state: State,
+		elementStack: Node[],
+		componentStack: Node[]
+	) {
+		visitEachBlock(this.generator, block, state, this, elementStack, componentStack);
+	}
 }

src/generators/nodes/Element.ts

@@ -1,12 +1,20 @@
+import deindent from '../../utils/deindent';
+import { stringify } from '../../utils/stringify';
+import flattenReference from '../../utils/flattenReference';
+import isVoidElementName from '../../utils/isVoidElementName';
+import validCalleeObjects from '../../utils/validCalleeObjects';
+import reservedNames from '../../utils/reservedNames';
 import Node from './shared/Node';
 import Block from '../dom/Block';
 import State from '../dom/State';
 import Attribute from './Attribute';
 import * as namespaces from '../../utils/namespaces';
 
-const meta: Record<string, any> = {
-	':Window': {}, // TODO this should be dealt with in walkTemplate
-};
+// temp - move this logic in here
+import addBindings from '../dom/visitors/Element/addBindings';
+import addTransitions from '../dom/visitors/Element/addTransitions';
+import visitAttribute from '../dom/visitors/Element/Attribute';
+import visitSlot from '../dom/visitors/Slot';
 
 export default class Element extends Node {
 	type: 'Element';
@@ -141,17 +149,14 @@ export default class Element extends Node {
 	build(
 		block: Block,
 		state: State,
-		node: Node,
 		elementStack: Node[],
 		componentStack: Node[]
 	) {
-		if (this.name in meta) {
-			return meta[this.name](generator, block, this);
-		}
+		const { generator } = this;
 
 		if (this.name === 'slot') { // TODO deal with in walkTemplate
 			if (this.generator.customElement) {
-				const slotName = getStaticAttributeValue(this, 'name') || 'default';
+				const slotName = this.getStaticAttributeValue('name') || 'default';
 				this.generator.slots.add(slotName);
 			} else {
 				return visitSlot(this.generator, block, state, this, elementStack, componentStack);
@@ -177,7 +182,7 @@ export default class Element extends Node {
 
 		if (this.generator.hydratable) {
 			block.builders.claim.addBlock(deindent`
-				${name} = ${getClaimStatement(generator, childState.namespace, state.parentNodes, node)};
+				${name} = ${getClaimStatement(generator, childState.namespace, state.parentNodes, this)};
 				var ${childState.parentNodes} = @children(${name});
 			`);
 		}
@@ -195,8 +200,8 @@ export default class Element extends Node {
 		}
 
 		// add CSS encapsulation attribute
-		if (this._needsCssAttribute && !generator.customElement) {
-			generator.needsEncapsulateHelper = true;
+		if (this._needsCssAttribute && !this.generator.customElement) {
+			this.generator.needsEncapsulateHelper = true;
 			block.builders.hydrate.addLine(
 				`@encapsulateStyles(${name});`
 			);
@@ -235,32 +240,32 @@ export default class Element extends Node {
 			}
 		} else {
 			this.children.forEach((child: Node) => {
-				visit(generator, block, childState, child, elementStack.concat(this), componentStack);
+				child.build(block, childState, elementStack.concat(this), componentStack);
 			});
 		}
 
-		addBindings(generator, block, childState, this);
+		addBindings(this.generator, block, childState, this);
 
 		this.attributes.filter((a: Node) => a.type === 'Attribute').forEach((attribute: Node) => {
-			visitAttribute(generator, block, childState, this, attribute);
+			visitAttribute(this.generator, block, childState, this, attribute);
 		});
 
 		// event handlers
 		this.attributes.filter((a: Node) => a.type === 'EventHandler').forEach((attribute: Node) => {
-			const isCustomEvent = this.generator.events.has(attribute.name);
+			const isCustomEvent = generator.events.has(attribute.name);
 			const shouldHoist = !isCustomEvent && state.inEachBlock;
 
 			const context = shouldHoist ? null : name;
 			const usedContexts: string[] = [];
 
 			if (attribute.expression) {
-				this.generator.addSourcemapLocations(attribute.expression);
+				generator.addSourcemapLocations(attribute.expression);
 
 				const flattened = flattenReference(attribute.expression.callee);
 				if (!validCalleeObjects.has(flattened.name)) {
 					// allow event.stopPropagation(), this.select() etc
 					// TODO verify that it's a valid callee (i.e. built-in or declared method)
-					this.generator.code.prependRight(
+					generator.code.prependRight(
 						attribute.expression.start,
 						`${block.alias('component')}.`
 					);
@@ -294,7 +299,7 @@ export default class Element extends Node {
 
 			// get a name for the event handler that is globally unique
 			// if hoisted, locally unique otherwise
-			const handlerName = (shouldHoist ? generator : block).getUniqueName(
+			const handlerName = (shouldHoist ? this.generator : block).getUniqueName(
 				`${attribute.name.replace(/[^a-zA-Z0-9_$]/g, '_')}_handler`
 			);
 
@@ -344,7 +349,7 @@ export default class Element extends Node {
 		});
 
 		// refs
-		this.node.attributes.filter((a: Node) => a.type === 'Ref').forEach((attribute: Node) => {
+		this.attributes.filter((a: Node) => a.type === 'Ref').forEach((attribute: Node) => {
 			const ref = `#component.refs.${attribute.name}`;
 
 			block.builders.mount.addLine(
@@ -358,7 +363,7 @@ export default class Element extends Node {
 			this.generator.usesRefs = true; // so component.refs object is created
 		});
 
-		addTransitions(this.generator, block, childState, node);
+		addTransitions(this.generator, block, childState, this);
 
 		if (childState.allUsedContexts.length || childState.usesComponent) {
 			const initialProps: string[] = [];

src/generators/nodes/ElseBlock.ts

@@ -1,5 +1,11 @@
 import Node from './shared/Node';
+import Block from '../dom/Block';
+import State from '../dom/State';
 
 export default class ElseBlock extends Node {
+	type: 'ElseBlock';
+	children: Node[];
 
+	_block: Block;
+	_state: State;
 }

src/generators/nodes/Fragment.ts

@@ -40,15 +40,11 @@ export default class Fragment extends Node {
 	}
 
 	build(
-		generator: DomGenerator,
 		block: Block,
-		state: State,
-		node: Node,
-		elementStack: Node[],
-		componentStack: Node[]
+		state: State
 	) {
 		this.children.forEach(child => {
-			child.build(block, state, node, elementStack, componentStack);
+			child.build(block, state, [], []);
 		});
 	}
 }