Merge pull request #2414 from sveltejs/gh-2395

deconflict `value` argument in component bindings

src/compile/render-dom/wrappers/InlineComponent/index.ts

@@ -327,13 +327,14 @@ export default class InlineComponentWrapper extends Wrapper {
 				contextual_dependencies.push(object, property);
 			}
 
-			const args = ['value'];
+			const value = block.get_unique_name('value');
+			const args = [value];
 			if (contextual_dependencies.length > 0) {
 				args.push(`{ ${contextual_dependencies.join(', ')} }`);
 
 				block.builders.init.add_block(deindent`
-					function ${name}(value) {
+					function ${name}(${value}) {
-						if (ctx.${name}.call(null, value, ctx)) {
+						if (ctx.${name}.call(null, ${value}, ctx)) {
 							${updating} = true;
 						}
 					}
@@ -342,8 +343,8 @@ export default class InlineComponentWrapper extends Wrapper {
 				block.maintain_context = true; // TODO put this somewhere more logical
 			} else {
 				block.builders.init.add_block(deindent`
-					function ${name}(value) {
+					function ${name}(${value}) {
-						if (ctx.${name}.call(null, value)) {
+						if (ctx.${name}.call(null, ${value})) {
 							${updating} = true;
 						}
 					}
@@ -352,7 +353,7 @@ export default class InlineComponentWrapper extends Wrapper {
 
 			const body = deindent`
 				function ${name}(${args.join(', ')}) {
-					${lhs} = value;
+					${lhs} = ${value};
 					return ${component.invalidate(dependencies[0])}
 				}
 			`;

test/runtime/samples/deconflict-value/Widget.svelte

@@ -0,0 +1,3 @@
+<script>
+	export let value = 'foo';
+</script>

test/runtime/samples/deconflict-value/_config.js

@@ -0,0 +1,6 @@
+export default {
+	html: `
+		<p>Reactive: foo</p>
+		<p>Value: foo</p>
+	`
+};

test/runtime/samples/deconflict-value/main.svelte

@@ -0,0 +1,9 @@
+<script>
+  import Widget from './Widget.svelte';
+	let value;
+	$: reactive = value;
+</script>
+
+<Widget bind:value/>
+<p>Reactive: {reactive}</p>
+<p>Value: {value}</p>