feat: expose success event and adjust the order of emitting error

README.md

@@ -117,6 +117,19 @@ When the template compilation or the script evaluation fail, errors are returned
 </template>
 ```
 
+### `@success`
+
+When the template compilation and the script evaluation succeed, the `@success` event is emitted. If you provided extra info to your user about previous errors, you can use this event to clear the error message.
+
+```vue
+<template>
+  <VueLive
+    :code="code"
+    @success="error = undefined"
+  />
+</template>
+```
+
 ## Props
 
 ### `code`

src/Preview.vue

@@ -110,12 +110,12 @@ export default {
        * @event
        * @property { Error } - the error thrown
        */
-      this.$emit("error", e);
       if (e.constructor === VueLiveParseTemplateError) {
         e.message = `Cannot parse template expression: ${JSON.stringify(
           e.expression.content || e.expression
         )}\n\n${e.message}`;
       }
+      this.$emit("error", e);
       this.error = e.message;
     },
     renderComponent(code) {
@@ -125,7 +125,11 @@ export default {
         const renderedComponent = compileScript(
           code,
           this.jsx
-            ? { jsx: "__pragma__(h)", objectAssign: "__concatenate__", transforms: {asyncAwait: false} }
+            ? {
+                jsx: "__pragma__(h)",
+                objectAssign: "__concatenate__",
+                transforms: { asyncAwait: false },
+              }
             : { transforms: { asyncAwait: false } }
         );
         style = renderedComponent.style;

src/VueLive.vue

@@ -4,7 +4,7 @@
     v-bind="layoutProps"
     :code="stableCode"
     :language="lang"
-    :prismLang="prismLang"
+    :prism-lang="prismLang"
     :requires="requires"
     :data-scope="dataScope"
     :components="components"
@@ -33,7 +33,7 @@
         :code="model"
         @detect-language="switchLanguage"
         @error="handleError"
-        @success="error = undefined"
+        @success="handleSuccess"
         :components="components"
         :requires="requires"
         :jsx="jsx"
@@ -191,6 +191,10 @@ export default {
         this.stableCode = this.model;
       }
     },
+    handleSuccess() {
+      this.error = undefined;
+      this.$emit("success");
+    },
     handleError(e) {
       this.error = e;
       this.$emit("error", e);