implement rfc 33

Author: tanhauhau

src/compiler/compile/nodes/Binding.ts

@@ -62,6 +62,12 @@ export default class Binding extends Node {
 					message: 'Cannot bind to a variable declared with {#await ... then} or {:catch} blocks'
 				});
 			}
+			if (scope.is_const(name)) {
+				component.error(this, {
+					code: 'invalid-binding',
+					message: 'Cannot bind to a variable declared with {@const ...}'
+				});
+			}
 
 			scope.dependencies_for_name.get(name).forEach(name => {
 				const variable = component.var_lookup.get(name);

src/compiler/compile/nodes/CatchBlock.ts

@@ -1,13 +1,15 @@
-import map_children from './shared/map_children';
 import TemplateScope from './shared/TemplateScope';
 import AbstractBlock from './shared/AbstractBlock';
 import AwaitBlock from './AwaitBlock';
 import Component from '../Component';
 import { TemplateNode } from '../../interfaces';
+import get_const_tags from './shared/get_const_tags';
+import ConstTag from './ConstTag';
 
 export default class CatchBlock extends AbstractBlock {
 	type: 'CatchBlock';
 	scope: TemplateScope;
+	const_tags: ConstTag[];
 
 	constructor(component: Component, parent: AwaitBlock, scope: TemplateScope, info: TemplateNode) {
 		super(component, parent, scope, info);
@@ -18,7 +20,8 @@ export default class CatchBlock extends AbstractBlock {
 				this.scope.add(context.key.name, parent.expression.dependencies, this);
 			});
 		}
-		this.children = map_children(component, parent, this.scope, info.children);
+
+		([this.const_tags, this.children] = get_const_tags(info.children, component, this));
 
 		if (!info.skip) {
 			this.warn_if_empty_block();

src/compiler/compile/nodes/ConstTag.ts

@@ -0,0 +1,66 @@
+import Node from './shared/Node';
+import Expression from './shared/Expression';
+import Component from '../Component';
+import TemplateScope from './shared/TemplateScope';
+import { Context, unpack_destructuring } from './shared/Context';
+import { ConstTag as ConstTagType } from '../../interfaces';
+import { INodeAllowConstTag } from './interfaces';
+import { walk } from 'estree-walker';
+import { extract_identifiers } from 'periscopic';
+import is_reference from 'is-reference';
+import get_object from '../utils/get_object';
+
+const allowed_parents = new Set(['EachBlock', 'CatchBlock', 'ThenBlock', 'InlineComponent', 'SlotTemplate']);
+
+export default class ConstTag extends Node {
+	type: 'ConstTag';
+	expression: Expression;
+	contexts: Context[] = [];
+	node: ConstTagType;
+	scope: TemplateScope;
+
+	assignees: Set<string> = new Set();
+  dependencies: Set<string> = new Set();
+
+	constructor(component: Component, parent: INodeAllowConstTag, scope: TemplateScope, info: ConstTagType) {
+		super(component, parent, scope, info);
+
+		if (!allowed_parents.has(parent.type)) {
+			component.error(info, { code: 'invalid-const-placement', message: '{@const} must be the immediate child of {#each}, {:then}, {:catch}, <svelte:fragment> and <Component>' });
+		}
+		this.node = info;
+		this.scope = scope;
+
+		const { assignees, dependencies } = this;
+
+		extract_identifiers(info.expression.left).forEach(({ name }) => {
+      assignees.add(name);
+			const owner = this.scope.get_owner(name);
+			if (owner === parent) {
+				component.error(info, { code: 'invalid-const-declaration', message: `'${name}' has already been declared` });
+			}
+    });
+
+    walk(info.expression.right, {
+      enter(node, parent) {
+        if (is_reference(node, parent)) {
+          const identifier = get_object(node);
+          const { name } = identifier;
+          dependencies.add(name);
+        }
+      }
+    });
+	}
+	
+	parse_expression() {
+		unpack_destructuring(this.contexts, this.node.expression.left);
+		this.expression = new Expression(this.component, this, this.scope, this.node.expression.right);
+		this.contexts.forEach(context => {
+			const owner = this.scope.get_owner(context.key.name);
+			if (owner && owner.type === 'ConstTag' && owner.parent === this.parent) {
+				this.component.error(this.node, { code: 'invalid-const-declaration', message: `'${context.key.name}' has already been declared` });
+			}
+			this.scope.add(context.key.name, this.expression.dependencies, this);
+		});
+	}
+}

src/compiler/compile/nodes/DefaultSlotTemplate.ts

@@ -1,13 +1,14 @@
 import ElseBlock from './ElseBlock';
 import Expression from './shared/Expression';
-import map_children from './shared/map_children';
 import TemplateScope from './shared/TemplateScope';
 import AbstractBlock from './shared/AbstractBlock';
 import Element from './Element';
+import ConstTag from './ConstTag';
 import { Context, unpack_destructuring } from './shared/Context';
 import { Node } from 'estree';
 import Component from '../Component';
 import { TemplateNode } from '../../interfaces';
+import get_const_tags from './shared/get_const_tags';
 
 export default class EachBlock extends AbstractBlock {
 	type: 'EachBlock';
@@ -21,6 +22,7 @@ export default class EachBlock extends AbstractBlock {
 	key: Expression;
 	scope: TemplateScope;
 	contexts: Context[];
+	const_tags: ConstTag[];
 	has_animation: boolean;
 	has_binding = false;
 	has_index_binding = false;
@@ -56,7 +58,7 @@ export default class EachBlock extends AbstractBlock {
 
 		this.has_animation = false;
 
-		this.children = map_children(component, this, this.scope, info.children);
+		([this.const_tags, this.children] = get_const_tags(info.children, component, this));
 
 		if (this.has_animation) {
 			if (this.children.length !== 1) {

src/compiler/compile/nodes/EachBlock.ts

@@ -137,7 +137,15 @@ export default class InlineComponent extends Node {
 						slot_template.attributes.push(attribute);
 					}
 				}
-		
+				// transfer const
+				for (let i = child.children.length - 1; i >= 0; i--) {
+					const child_child = child.children[i];
+					if (child_child.type === 'ConstTag') {
+						slot_template.children.push(child_child);
+						child.children.splice(i, 1);
+					}
+				}
+
 				children.push(slot_template);
 				info.children.splice(i, 1);
 			}

src/compiler/compile/nodes/InlineComponent.ts

@@ -1,16 +1,18 @@
-import map_children from './shared/map_children';
 import Component from '../Component';
 import TemplateScope from './shared/TemplateScope';
 import Node from './shared/Node';
 import Let from './Let';
 import Attribute from './Attribute';
 import { INode } from './interfaces';
+import get_const_tags from './shared/get_const_tags';
+import ConstTag from './ConstTag';
 
 export default class SlotTemplate extends Node {
 	type: 'SlotTemplate';
 	scope: TemplateScope;
 	children: INode[];
 	lets: Let[] = [];
+	const_tags: ConstTag[];
 	slot_attribute: Attribute;
 	slot_template_name: string = 'default';
 
@@ -68,7 +70,7 @@ export default class SlotTemplate extends Node {
 		});
 
 		this.scope = scope;
-		this.children = map_children(component, this, this.scope, info.children);
+		([this.const_tags, this.children] = get_const_tags(info.children, component, this));
 	}
 
 	validate_slot_template_placement() {

src/compiler/compile/nodes/SlotTemplate.ts

@@ -1,13 +1,15 @@
-import map_children from './shared/map_children';
 import TemplateScope from './shared/TemplateScope';
 import AbstractBlock from './shared/AbstractBlock';
 import AwaitBlock from './AwaitBlock';
 import Component from '../Component';
 import { TemplateNode } from '../../interfaces';
+import get_const_tags from './shared/get_const_tags';
+import ConstTag from './ConstTag';
 
 export default class ThenBlock extends AbstractBlock {
 	type: 'ThenBlock';
 	scope: TemplateScope;
+	const_tags: ConstTag[];
 
 	constructor(component: Component, parent: AwaitBlock, scope: TemplateScope, info: TemplateNode) {
 		super(component, parent, scope, info);
@@ -18,7 +20,8 @@ export default class ThenBlock extends AbstractBlock {
 				this.scope.add(context.key.name, parent.expression.dependencies, this);
 			});
 		}
-		this.children = map_children(component, parent, this.scope, info.children);
+
+		([this.const_tags, this.children] = get_const_tags(info.children, component, this));
 
 		if (!info.skip) {
 			this.warn_if_empty_block();

src/compiler/compile/nodes/ThenBlock.ts

@@ -9,6 +9,7 @@ import Body from './Body';
 import CatchBlock from './CatchBlock';
 import Class from './Class';
 import Comment from './Comment';
+import ConstTag from './ConstTag';
 import DebugTag from './DebugTag';
 import EachBlock from './EachBlock';
 import Element from './Element';
@@ -26,7 +27,6 @@ import PendingBlock from './PendingBlock';
 import RawMustacheTag from './RawMustacheTag';
 import Slot from './Slot';
 import SlotTemplate from './SlotTemplate';
-import DefaultSlotTemplate from './DefaultSlotTemplate';
 import Text from './Text';
 import ThenBlock from './ThenBlock';
 import Title from './Title';
@@ -44,6 +44,7 @@ export type INode = Action
 | CatchBlock
 | Class
 | Comment
+| ConstTag
 | DebugTag
 | EachBlock
 | Element
@@ -61,10 +62,16 @@ export type INode = Action
 | RawMustacheTag
 | Slot
 | SlotTemplate
-| DefaultSlotTemplate
 | Tag
 | Text
 | ThenBlock
 | Title
 | Transition
 | Window;
+
+export type INodeAllowConstTag =
+| EachBlock
+| CatchBlock
+| ThenBlock
+| InlineComponent
+| SlotTemplate;

src/compiler/compile/nodes/interfaces.ts

@@ -135,6 +135,13 @@ export default class Expression {
 				if (names) {
 					names.forEach(name => {
 						if (template_scope.names.has(name)) {
+							if (template_scope.is_const(name)) {
+								component.error(node, {
+									code: 'invalid-const-update',
+									message: `'${name}' is declared using {@const ...} and it is read-only`
+								});
+							}
+
 							template_scope.dependencies_for_name.get(name).forEach(name => {
 								const variable = component.var_lookup.get(name);
 								if (variable) variable[deep ? 'mutated' : 'reassigned'] = true;
@@ -174,7 +181,7 @@ export default class Expression {
 	}
 
 	// TODO move this into a render-dom wrapper?
-	manipulate(block?: Block) {
+	manipulate(block?: Block, ctx?: string | void) {
 		// TODO ideally we wouldn't end up calling this method
 		// multiple times
 		if (this.manipulated) return this.manipulated;
@@ -221,7 +228,7 @@ export default class Expression {
 							component.add_reference(name); // TODO is this redundant/misplaced?
 						}
 					} else if (is_contextual(component, template_scope, name)) {
-						const reference = block.renderer.reference(node);
+						const reference = block.renderer.reference(node, ctx);
 						this.replace(reference);
 					}
 

src/compiler/compile/nodes/shared/Expression.ts

@@ -4,8 +4,9 @@ import CatchBlock from '../CatchBlock';
 import InlineComponent from '../InlineComponent';
 import Element from '../Element';
 import SlotTemplate from '../SlotTemplate';
+import ConstTag from '../ConstTag';
 
-type NodeWithScope = EachBlock | ThenBlock | CatchBlock | InlineComponent | Element | SlotTemplate;
+type NodeWithScope = EachBlock | ThenBlock | CatchBlock | InlineComponent | Element | SlotTemplate | ConstTag;
 
 export default class TemplateScope {
 	names: Set<string>;
@@ -48,4 +49,9 @@ export default class TemplateScope {
 		const owner = this.get_owner(name);
 		return owner && (owner.type === 'ThenBlock' || owner.type === 'CatchBlock');
 	}
+
+	is_const(name: string) {
+		const owner = this.get_owner(name);
+		return owner && owner.type === 'ConstTag';
+	}
 }