fix: parcel vue warnings

Author: André Dietrich

src/components/Editor.vue

@@ -113,21 +113,15 @@ function blobToUint8Array(blob) {
 export default {
   name: "Editor",
   components: { Recorder },
-  props: ["storageId", "content", "lights", "connection", "toolbar"],
+  inheritAttrs: false,
+  props: ["storageId", "content", "connection", "toolbar"],
 
   data() {
     const config = Utils.loadConfig();
 
-    let toolbar = true;
-
-    if (this.$props.toolbar !== undefined) {
-      toolbar = this.$props.toolbar;
-    }
-
     return {
       lights: config.lights,
       user: config.user,
-      toolbar: toolbar,
       recorder: { audio: false, webcam: false, desktop: false },
 
       online: null,
@@ -1340,7 +1334,7 @@ I (study) ~[[ am going to study ]]~ harder this term.
 
 <template>
   <nav
-    v-if="toolbar"
+    v-if="toolbar !== false"
     class="navbar navbar-light bg-light"
     style="
       border-top: solid lightgray 2px;

src/index.ts

@@ -1,3 +1,10 @@
+// Vue compile-time feature flags — required by the esm-bundler build of Vue.
+// Parcel has no built-in DefinePlugin equivalent, so we set them on globalThis
+// before Vue runs so the typeof-checks in vue/dist/vue.esm-bundler.js resolve.
+(globalThis as any).__VUE_OPTIONS_API__ = true;
+(globalThis as any).__VUE_PROD_DEVTOOLS__ = false;
+(globalThis as any).__VUE_PROD_HYDRATION_MISMATCH_DETAILS__ = false;
+
 import { createApp } from 'vue'
 
 // Configure Monaco Editor web workers for Parcel bundler.

src/views/LiaScript.vue

@@ -89,7 +89,7 @@ export default {
         document.documentElement.clientWidth < document.documentElement.clientHeight,
       previewNotReady: true,
       compilationCounter: 0,
-      mode: this.$props.mode || 0,
+      currentMode: this.$props.mode || 0,
       editorIsReady: false,
       database,
       meta: {},
@@ -132,7 +132,7 @@ export default {
     },
 
     changeMode(mode: number) {
-      this.mode = mode;
+      this.currentMode = mode;
     },
 
     nostr() {
@@ -477,7 +477,7 @@ export default {
             id="btnradio1"
             autocomplete="off"
             @click="changeMode(-1)"
-            :checked="mode < 0"
+            :checked="currentMode < 0"
           />
           <label class="btn btn-outline-secondary" for="btnradio1" title="Editor only">
             <i class="bi bi-pencil"></i>
@@ -489,7 +489,7 @@ export default {
             name="btnradio"
             id="btnradio2"
             autocomplete="off"
-            :checked="mode === 0"
+            :checked="currentMode === 0"
             @click="changeMode(0)"
           />
           <label class="btn btn-outline-secondary" for="btnradio2" title="Split view">
@@ -507,7 +507,7 @@ export default {
             id="btnradio3"
             autocomplete="off"
             @click="changeMode(1)"
-            :checked="mode > 0"
+            :checked="currentMode > 0"
           />
           <label class="btn btn-outline-secondary" for="btnradio3" title="Preview only">
             <i class="bi bi-eye"></i>
@@ -872,11 +872,11 @@ export default {
       :horizontal="horizontal"
     >
       <pane
-        :hidden="mode > 0"
+        :hidden="currentMode > 0"
         style="border-right: solid lightgray 2px"
         :class="{
-          fullHeight: mode < 0 && horizontal,
-          fullWidth: mode < 0 && !horizontal,
+          fullHeight: currentMode < 0 && horizontal,
+          fullWidth: currentMode < 0 && !horizontal,
         }"
       >
         <Editor
@@ -895,10 +895,10 @@ export default {
       </pane>
 
       <pane
-        :hidden="mode < 0"
+        :hidden="currentMode < 0"
         :class="{
-          fullHeight: mode > 0 && horizontal,
-          fullWidth: mode > 0 && !horizontal,
+          fullHeight: currentMode > 0 && horizontal,
+          fullWidth: currentMode > 0 && !horizontal,
         }"
       >
         <div