From 88219658b04cd890fbae12f2b45509b4c61f02ce Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Wed, 23 Mar 2022 23:59:33 +0000
Subject: [PATCH] Fix examples in HTML mode

---
 src/examples/src/cells/Cell/template.html     |  2 +-
 .../src/circle-drawer/App/composition.js      |  2 ++
 .../src/circle-drawer/App/template.html       |  2 +-
 .../src/flight-booker/App/template.html       |  4 ++--
 .../src/form-bindings/App/template.html       | 20 +++++++++----------
 src/examples/src/timer/App/template.html      |  2 +-
 src/examples/src/todomvc/App/template.html    | 10 +++++-----
 7 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/src/examples/src/cells/Cell/template.html b/src/examples/src/cells/Cell/template.html
index 5efe0477c7..257fae87a2 100644
--- a/src/examples/src/cells/Cell/template.html
+++ b/src/examples/src/cells/Cell/template.html
@@ -5,6 +5,6 @@
     @change="update"
     @blur="update"
     @vnode-mounted="({ el }) => el.focus()"
-  />
+  >
   <span v-else>{{ evalCell(cells[c][r]) }}</span>
 </div>
diff --git a/src/examples/src/circle-drawer/App/composition.js b/src/examples/src/circle-drawer/App/composition.js
index 07ac8704c9..655611af2f 100644
--- a/src/examples/src/circle-drawer/App/composition.js
+++ b/src/examples/src/circle-drawer/App/composition.js
@@ -57,10 +57,12 @@ export default {
 
     return {
       history,
+      index,
       circles,
       selected,
       adjusting,
       onClick,
+      adjust,
       undo,
       redo
     }
diff --git a/src/examples/src/circle-drawer/App/template.html b/src/examples/src/circle-drawer/App/template.html
index 7019b65d4b..98978d66b8 100644
--- a/src/examples/src/circle-drawer/App/template.html
+++ b/src/examples/src/circle-drawer/App/template.html
@@ -23,5 +23,5 @@
 
 <div class="dialog" v-if="adjusting" @click.stop>
   <p>Adjust radius of circle at ({{ selected.cx }}, {{ selected.cy }})</p>
-  <input type="range" v-model="selected.r" min="1" max="300" />
+  <input type="range" v-model="selected.r" min="1" max="300">
 </div>
diff --git a/src/examples/src/flight-booker/App/template.html b/src/examples/src/flight-booker/App/template.html
index ddb27342b3..efedf5ef89 100644
--- a/src/examples/src/flight-booker/App/template.html
+++ b/src/examples/src/flight-booker/App/template.html
@@ -3,8 +3,8 @@
   <option value="return flight">Return Flight</option>
 </select>
 
-<input type="date" v-model="departureDate" />
-<input type="date" v-model="returnDate" :disabled="!isReturn" />
+<input type="date" v-model="departureDate">
+<input type="date" v-model="returnDate" :disabled="!isReturn">
 
 <button :disabled="!canBook" @click="book">Book</button>
 
diff --git a/src/examples/src/form-bindings/App/template.html b/src/examples/src/form-bindings/App/template.html
index 065cf3a86b..fabedc6631 100644
--- a/src/examples/src/form-bindings/App/template.html
+++ b/src/examples/src/form-bindings/App/template.html
@@ -1,8 +1,8 @@
 <h2>Text Input</h2>
-<input v-model="text" /> {{ text }}
+<input v-model="text"> {{ text }}
 
 <h2>Checkbox</h2>
-<input type="checkbox" id="checkbox" v-model="checked" />
+<input type="checkbox" id="checkbox" v-model="checked">
 <label for="checkbox">Checked: {{ checked }}</label>
 
 <!--
@@ -10,21 +10,21 @@ <h2>Checkbox</h2>
   array v-model value
 -->
 <h2>Multi Checkbox</h2>
-<input type="checkbox" id="jack" value="Jack" v-model="checkedNames" />
+<input type="checkbox" id="jack" value="Jack" v-model="checkedNames">
 <label for="jack">Jack</label>
-<input type="checkbox" id="john" value="John" v-model="checkedNames" />
+<input type="checkbox" id="john" value="John" v-model="checkedNames">
 <label for="john">John</label>
-<input type="checkbox" id="mike" value="Mike" v-model="checkedNames" />
+<input type="checkbox" id="mike" value="Mike" v-model="checkedNames">
 <label for="mike">Mike</label>
 <p>Checked names: <pre>{{ checkedNames }}</pre></p>
 
 <h2>Radio</h2>
-<input type="radio" id="one" value="One" v-model="picked" />
+<input type="radio" id="one" value="One" v-model="picked">
 <label for="one">One</label>
-<br />
-<input type="radio" id="two" value="Two" v-model="picked" />
+<br>
+<input type="radio" id="two" value="Two" v-model="picked">
 <label for="two">Two</label>
-<br />
+<br>
 <span>Picked: {{ picked }}</span>
 
 <h2>Select</h2>
@@ -42,4 +42,4 @@ <h2>Multi Select</h2>
   <option>B</option>
   <option>C</option>
 </select>
-<span>Selected: {{ multiSelected }}</span>
\ No newline at end of file
+<span>Selected: {{ multiSelected }}</span>
diff --git a/src/examples/src/timer/App/template.html b/src/examples/src/timer/App/template.html
index 84e80fe266..a2151dff3b 100644
--- a/src/examples/src/timer/App/template.html
+++ b/src/examples/src/timer/App/template.html
@@ -5,7 +5,7 @@
 <div>{{ (elapsed / 1000).toFixed(1) }}s</div>
 
 <div>
-  Duration: <input type="range" v-model="duration" min="1" max="30000" />
+  Duration: <input type="range" v-model="duration" min="1" max="30000">
   {{ (duration / 1000).toFixed(1) }}s
 </div>
 
diff --git a/src/examples/src/todomvc/App/template.html b/src/examples/src/todomvc/App/template.html
index ac927cf25c..9de05cefdc 100644
--- a/src/examples/src/todomvc/App/template.html
+++ b/src/examples/src/todomvc/App/template.html
@@ -6,7 +6,7 @@ <h1>todos</h1>
       autofocus
       placeholder="What needs to be done?"
       @keyup.enter="addTodo"
-    />
+    >
   </header>
   <section class="main" v-show="todos.length">
     <input
@@ -15,7 +15,7 @@ <h1>todos</h1>
       type="checkbox"
       :checked="remaining === 0"
       @change="toggleAll"
-    />
+    >
     <label for="toggle-all">Mark all as complete</label>
     <ul class="todo-list">
       <li
@@ -25,7 +25,7 @@ <h1>todos</h1>
         :class="{ completed: todo.completed, editing: todo === editedTodo }"
       >
         <div class="view">
-          <input class="toggle" type="checkbox" v-model="todo.completed" />
+          <input class="toggle" type="checkbox" v-model="todo.completed">
           <label @dblclick="editTodo(todo)">{{ todo.title }}</label>
           <button class="destroy" @click="removeTodo(todo)"></button>
         </div>
@@ -38,7 +38,7 @@ <h1>todos</h1>
           @blur="doneEdit(todo)"
           @keyup.enter="doneEdit(todo)"
           @keyup.escape="cancelEdit(todo)"
-        />
+        >
       </li>
     </ul>
   </section>
@@ -62,4 +62,4 @@ <h1>todos</h1>
       Clear completed
     </button>
   </footer>
-</section>
\ No newline at end of file
+</section>