Merge branch 'master' into gh-2356

site/content/examples/09-transitions/06-deferred-transitions/App.svelte

@@ -43,12 +43,6 @@
 	function remove(todo) {
 		todos = todos.filter(t => t !== todo);
 	}
-
-	function handleKeydown(event) {
-		if (event.which === 13) {
-			addTodo(event.target);
-		}
-	}
 </script>
 
 <style>
@@ -114,7 +108,7 @@
 </style>
 
 <div class='board'>
-	<input class="new-todo" placeholder="what needs to be done?" on:enter={add}>
+	<input class="new-todo" placeholder="what needs to be done?" on:keydown="{event => event.which === 13 && add(event.target)}">
 
 	<div class='left'>
 		<h2>todo</h2>

site/src/routes/blog/_posts.js

@@ -1,6 +1,6 @@
 import fs from 'fs';
 import path from 'path';
-import { extract_frontmatter, langs } from '../../utils/markdown.js';
+import { extract_frontmatter, langs, link_renderer } from '../../utils/markdown.js';
 import marked from 'marked';
 import PrismJS from 'prismjs';
 import 'prismjs/components/prism-bash';
@@ -20,6 +20,8 @@ export default function() {
 
 			const renderer = new marked.Renderer();
 
+			renderer.link = link_renderer;
+
 			renderer.code = (source, lang) => {
 				const plang = langs[lang];
 				const highlighted = PrismJS.highlight(

site/src/routes/docs/_sections.js

@@ -1,6 +1,6 @@
 import fs from 'fs';
 import path from 'path';
-import { extract_frontmatter, extract_metadata, langs } from '../../utils/markdown.js';
+import { extract_frontmatter, extract_metadata, langs, link_renderer } from '../../utils/markdown.js';
 import marked from 'marked';
 import PrismJS from 'prismjs';
 import 'prismjs/components/prism-bash';
@@ -50,6 +50,8 @@ export default function() {
 
 			let block_open = false;
 
+			renderer.link = link_renderer;
+
 			renderer.hr = (...args) => {
 				block_open = true;
 

site/src/routes/tutorial/[slug]/index.json.js

@@ -2,7 +2,7 @@ import * as fs from 'fs';
 import * as path from 'path';
 import marked from 'marked';
 import PrismJS from 'prismjs';
-import { extract_frontmatter, extract_metadata, langs } from '../../../utils/markdown';
+import { extract_frontmatter, extract_metadata, langs, link_renderer } from '../../../utils/markdown';
 
 const cache = new Map();
 
@@ -33,6 +33,8 @@ function get_tutorial(slug) {
 
 	const renderer = new marked.Renderer();
 
+	renderer.link = link_renderer;
+
 	renderer.code = (source, lang) => {
 		source = source.replace(/^ +/gm, match =>
 			match.split('    ').join('\t')

site/src/utils/markdown.js

@@ -42,3 +42,20 @@ export const langs = {
 	js: 'javascript',
 	css: 'css'
 };
+
+
+// links renderer
+export function link_renderer(href,title,text) {
+	let target_attr = '';
+	let title_attr = '';
+	
+	if(href.startsWith("http")) {
+		target_attr = ' target="_blank"';
+	}
+
+	if(title !== null) {
+		title_attr = ` title="${title}"`;
+	}
+	
+	return `<a href="${href}"${target_attr}${title_attr}>${text}</a>`;
+};

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

@@ -324,13 +324,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) {
-						ctx.${name}.call(null, value, ctx);
+					function ${name}(${value}) {
+						ctx.${name}.call(null, ${value}, ctx);
 						${updating} = true;
 						@add_flush_callback(() => ${updating} = false);
 					}
@@ -339,17 +340,18 @@ 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) {
-						ctx.${name}.call(null, value);
+					function ${name}(${value}) {
+						ctx.${name}.call(null, ${value});
 						${updating} = true;
 						@add_flush_callback(() => ${updating} = false);
+						}
 					}
 				`);
 			}
 
 			const body = deindent`
 				function ${name}(${args.join(', ')}) {
-					${lhs} = value;
+					${lhs} = ${value};
 					${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>