different direction

Author: trueadm

documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md

@@ -147,7 +147,7 @@ For example, here is how you would capture and restore the value of a textarea:
 
 <form method="POST">
 	<label for="comment">Comment</label>
-	<textarea id="comment" bind:value={comment} />
+	<textarea id="comment" bind:value comment} />
 	<button>Post comment</button>
 </form>
 ```

documentation/docs/98-reference/.generated/compile-errors.md

@@ -424,6 +424,12 @@ Imports of `svelte/internal/*` are forbidden. It contains private runtime code w
 The arguments keyword cannot be used within the template or at the top level of a component
 ```
 
+### invalid_bind_directive
+
+```
+Bind directive getter/setter values (`bind:thing={ getter, setter }`) must be two JavaScript expressions separated by a single comma and enclosed in curly braces
+```
+
 ### js_parse_error
 
 ```

documentation/examples/05-bindings/00-text-inputs/App.svelte

@@ -2,5 +2,5 @@
 	let name = '';
 </script>
 
-<input bind:value={name} placeholder="enter your name" />
+<input bind:value name} placeholder="enter your name" />
 <p>Hello {name || 'stranger'}!</p>

documentation/examples/05-bindings/01-numeric-inputs/App.svelte

@@ -4,13 +4,13 @@
 </script>
 
 <label>
-	<input type="number" bind:value={a} min="0" max="10" />
-	<input type="range" bind:value={a} min="0" max="10" />
+	<input type="number" bind:value a} min="0" max="10" />
+	<input type="range" bind:value a} min="0" max="10" />
 </label>
 
 <label>
-	<input type="number" bind:value={b} min="0" max="10" />
-	<input type="range" bind:value={b} min="0" max="10" />
+	<input type="number" bind:value b} min="0" max="10" />
+	<input type="range" bind:value b} min="0" max="10" />
 </label>
 
 <p>{a} + {b} = {a + b}</p>

documentation/examples/05-bindings/02-checkbox-inputs/App.svelte

@@ -3,7 +3,7 @@
 </script>
 
 <label>
-	<input type="checkbox" bind:checked={yes} />
+	<input type="checkbox" bind:checked yes} />
 	Yes! Send me regular email spam
 </label>
 

documentation/examples/05-bindings/03-group-inputs/App.svelte

@@ -13,25 +13,25 @@
 <h2>Size</h2>
 
 <label>
-	<input type="radio" bind:group={scoops} value={1} />
+	<input type="radio" bind:group scoops} value={1} />
 	One scoop
 </label>
 
 <label>
-	<input type="radio" bind:group={scoops} value={2} />
+	<input type="radio" bind:group scoops} value={2} />
 	Two scoops
 </label>
 
 <label>
-	<input type="radio" bind:group={scoops} value={3} />
+	<input type="radio" bind:group scoops} value={3} />
 	Three scoops
 </label>
 
 <h2>Flavours</h2>
 
 {#each menu as flavour}
 	<label>
-		<input type="checkbox" bind:group={flavours} value={flavour} />
+		<input type="checkbox" bind:group flavours} value={flavour} />
 		{flavour}
 	</label>
 {/each}

documentation/examples/05-bindings/04-textarea-inputs/App.svelte

@@ -3,7 +3,7 @@
 	let text = `Some words are *italic*, some are **bold**`;
 </script>
 
-<textarea bind:value={text} />
+<textarea bind:value text} />
 
 {@html marked(text)}
 

documentation/examples/05-bindings/06-select-bindings/App.svelte

@@ -17,15 +17,15 @@
 <h2>Insecurity questions</h2>
 
 <form on:submit|preventDefault={handleSubmit}>
-	<select bind:value={selected} on:change={() => (answer = '')}>
+	<select bind:value selected} on:change={() => (answer = '')}>
 		{#each questions as question}
 			<option value={question}>
 				{question.text}
 			</option>
 		{/each}
 	</select>
 
-	<input bind:value={answer} />
+	<input bind:value answer} />
 
 	<button disabled={!answer} type="submit"> Submit </button>
 </form>

documentation/examples/05-bindings/07-multiple-select-bindings/App.svelte

@@ -13,23 +13,23 @@
 <h2>Size</h2>
 
 <label>
-	<input type="radio" bind:group={scoops} value={1} />
+	<input type="radio" bind:group scoops} value={1} />
 	One scoop
 </label>
 
 <label>
-	<input type="radio" bind:group={scoops} value={2} />
+	<input type="radio" bind:group scoops} value={2} />
 	Two scoops
 </label>
 
 <label>
-	<input type="radio" bind:group={scoops} value={3} />
+	<input type="radio" bind:group scoops} value={3} />
 	Three scoops
 </label>
 
 <h2>Flavours</h2>
 
-<select multiple bind:value={flavours}>
+<select multiple bind:value flavours}>
 	{#each menu as flavour}
 		<option value={flavour}>
 			{flavour}

documentation/examples/05-bindings/08-each-block-bindings/App.svelte

@@ -20,9 +20,9 @@
 
 {#each todos as todo}
 	<div>
-		<input type="checkbox" bind:checked={todo.done} />
+		<input type="checkbox" bind:checked todo.done} />
 
-		<input placeholder="What needs to be done?" bind:value={todo.text} disabled={todo.done} />
+		<input placeholder="What needs to be done?" bind:value todo.text} disabled={todo.done} />
 	</div>
 {/each}