diff --git a/playground/next/editor.mjs b/playground/next/editor.mjs
index f37ccca5..f51c2858 100644
--- a/playground/next/editor.mjs
+++ b/playground/next/editor.mjs
@@ -101,6 +101,7 @@ function editorListener(docName) {
             const parsed = JSON.parse(latestChange);
             this[docName] = parsed;
             this.parseError = '';
+            this.setOutputTab(this.outputTab);
           } catch (err) {
             this.parseError = err.message;
           };
@@ -329,13 +330,12 @@ window.app = createApp({
   inputTab: 'json-ld',
   outputTab: 'expanded',
   options: {
-    processingMode: '',
+    processingMode: 'json-ld-1.1',
     base: '',
-    baseUrl: '',
     compactArrays: true,
     compactToRelative: true,
     rdfDirection: '',
-    safe: ''
+    safe: false
   },
   tabs: {
     expanded: {icon: 'expand alternate', label: 'Expanded'},
@@ -431,7 +431,7 @@ window.app = createApp({
     this.setOutputTab(this.outputTab);
   },
   async setOutputTab(value) {
-    if (!value || !this.doc) return;
+    if (!this.doc) return;
     if (value) this.outputTab = value;
     let context = this.contextDoc;
     switch (this.outputTab) {
@@ -442,7 +442,7 @@ window.app = createApp({
           setEditorValue(readOnlyEditor, expanded);
           this.parseError = '';
         } catch(err) {
-          this.parseError = err.message;
+          this.parseError = err;
         }
         break;
       case 'compacted':
diff --git a/playground/next/index.html b/playground/next/index.html
index dda25087..599b766d 100644
--- a/playground/next/index.html
+++ b/playground/next/index.html
@@ -143,24 +143,17 @@ <h2 class="ui massive header">JSON-LD Playground</h2>
         <form class="ui form">
           <div class="inline fields" id="options-api-processingMode">
             <label for="options-api-processingMode" class="two wide field">Processing Mode</label>
-            <div class="field">
-              <div class="ui radio checkbox">
-                <input type="radio" id="options-api-processingMode-default" name="processingMode" value="" checked
-                  v-model="options.processingMode">
-                <label for="options-api-processingMode-default">Default</label>
-              </div>
-            </div>
             <div class="field">
               <div class="ui radio checkbox">
                 <input type="radio" id="options-api-processingMode-1-0" name="processingMode" value="json-ld-1.0"
-                  v-model="options.processingMode">
+                  v-model="options.processingMode" @change="setOutputTab()">
                 <label for="options-api-processingMode-1-0">JSON-LD 1.0</label>
               </div>
             </div>
             <div class="field">
               <div class="ui radio checkbox">
                 <input type="radio" id="options-api-processingMode-1-1" name="processingMode" value="json-ld-1.1"
-                  v-model="options.processingMode">
+                  v-model="options.processingMode" @change="setOutputTab()">
                 <label for="options-api-processingMode-1-1">JSON-LD 1.1</label>
               </div>
             </div>
@@ -168,23 +161,9 @@ <h2 class="ui massive header">JSON-LD Playground</h2>
 
           <div class="inline fields" id="options-api-base">
             <label for="options-api-base" class="two wide field">Base</label>
-            <div class="field">
-              <div class="ui radio checkbox">
-                <input type="radio" id="options-api-base-default" name="base" value="" checked
-                  v-model="options.base">
-                <label for="options-api-base-default">Default</label>
-              </div>
-            </div>
-            <div class="field">
-              <div class="ui radio checkbox">
-                <input type="radio" id="options-api-base-custom" name="base" value="custom"
-                  v-model="options.base">
-                <label for="options-api-base-custom">Custom URL</label>
-              </div>
-            </div>
-            <div class="eleven wide field">
+            <div class="sixteen wide field">
               <input type="text" id="options-api-base-url" placeholder="URL"
-                v-model="options.baseUrl">
+                v-model="options.base" @change="setOutputTab()">
             </div>
           </div>
 
@@ -193,7 +172,7 @@ <h2 class="ui massive header">JSON-LD Playground</h2>
             <div class="field">
               <div class="ui checkbox">
                 <input type="checkbox" id="options-api-compactArrays"
-                  v-model="options.compactArrays">
+                  v-model="options.compactArrays" @change="setOutputTab()">
                 <label for="options-api-compactArrays">Compact Arrays</label>
               </div>
             </div>
@@ -204,7 +183,7 @@ <h2 class="ui massive header">JSON-LD Playground</h2>
             <div class="field">
               <div class="ui checkbox">
                 <input type="checkbox" id="options-api-compactToRelative"
-                  v-model="options.compactToRelative">
+                  v-model="options.compactToRelative" @change="setOutputTab()">
                 <label for="options-api-compactToRelative">Compact To Relative</label>
               </div>
             </div>
@@ -216,14 +195,14 @@ <h2 class="ui massive header">JSON-LD Playground</h2>
               <div class="field">
                 <div class="ui radio checkbox">
                   <input type="radio" id="options-api-rdfDirection-default" name="rdfDirection" value="" checked
-                    v-model="options.rdfDirection">
+                    v-model="options.rdfDirection" @change="setOutputTab()">
                   <label for="options-api-rdfDirection-default">Default (null)</label>
                 </div>
               </div>
               <div class="field">
                 <div class="ui radio checkbox">
                   <input type="radio" id="options-api-rdfDirection-i18n-datatype" name="rdfDirection" value="i18n-datatype"
-                    v-model="options.rdfDirection">
+                    v-model="options.rdfDirection" @change="setOutputTab()">
                   <label for="options-api-rdfDirection-i18n-datatype">"i18n-datatype"</label>
                 </div>
               </div>
@@ -235,22 +214,15 @@ <h2 class="ui massive header">JSON-LD Playground</h2>
               <label for="options-api-safe" class="two wide field">Safe</label>
               <div class="field">
                 <div class="ui radio checkbox">
-                  <input type="radio" id="options-api-safe-default" name="safe" value="" checked
-                    v-model="options.safe">
-                  <label for="options-api-safe-default">Default (False)</label>
-                </div>
-              </div>
-              <div class="field">
-                <div class="ui radio checkbox">
-                  <input type="radio" id="options-api-safe-false" name="safe" value="false"
-                    v-model="options.safe">
+                  <input type="radio" id="options-api-safe-false" name="safe" :value="false"
+                    v-model="options.safe" @change="setOutputTab()">
                   <label for="options-api-safe-false">False</label>
                 </div>
               </div>
               <div class="field">
                 <div class="ui radio checkbox">
-                  <input type="radio" id="options-api-safe-true" name="safe" value="true"
-                    v-model="options.safe">
+                  <input type="radio" id="options-api-safe-true" name="safe" :value="true"
+                    v-model="options.safe" @change="setOutputTab()">
                   <label for="options-api-safe-true">True</label>
                 </div>
               </div>
@@ -291,7 +263,12 @@ <h2 class="ui massive header">JSON-LD Playground</h2>
     </div>
   </div>
   <!-- errors -->
-  <div class="ui error message" v-show="parseError" v-text="parseError"></div>
+  <div class="ui error message" v-show="parseError.message">
+    <div class="header" v-text="parseError.message"></div>
+    <div class="content">
+      <pre v-text="JSON.stringify(parseError?.details?.event, null, 2)"></pre>
+    </div>
+  </div>
   <!-- outputs and renderings -->
   <div class="ui top attached tabular menu">
     <div v-for="(tab, key) in tabs" :class="{ active: outputTab == key, disabled: doc === '' }" class="item" @click="setOutputTab(key)"><i class="icon" :class="tab.icon"></i> <span v-text="tab.label"></span></div>