Revert "Deprecate on:load event, use on:ready instead"

This reverts commit 9790248.

Author: brunolemos

README.md

@@ -42,7 +42,11 @@ Next, you'll need to import the Email Editor component to your app.
         <button v-on:click="exportHtml">Export HTML</button>
       </div>
 
-      <EmailEditor ref="emailEditor" v-on:ready="editorReady" />
+      <EmailEditor
+        ref="emailEditor"
+        v-on:load="editorLoaded"
+        v-on:ready="editorReady"
+      />
     </div>
   </div>
 </template>
@@ -56,11 +60,16 @@ Next, you'll need to import the Email Editor component to your app.
       EmailEditor,
     },
     methods: {
-      editorReady() {
-        console.log('editorReady');
+      // called when the editor is created
+      editorLoaded() {
+        console.log('editorLoaded');
         // Pass the template JSON here
         // this.$refs.emailEditor.editor.loadDesign({});
       },
+      // called when the editor has finished loading
+      editorReady() {
+        console.log('editorReady');
+      },
       saveDesign() {
         this.$refs.emailEditor.editor.saveDesign((design) => {
           console.log('saveDesign', design);
@@ -121,6 +130,7 @@ Here's an example using the above properties...
         :tools="tools"
         :options="options"
         ref="emailEditor"
+        v-on:load="editorLoaded"
         v-on:ready="editorReady"
       />
     </div>
@@ -158,11 +168,16 @@ Here's an example using the above properties...
       };
     },
     methods: {
-      editorReady() {
-        console.log('editorReady');
+      // called when the editor is created
+      editorLoaded() {
+        console.log('editorLoaded');
         // Pass your template JSON here
         // this.$refs.emailEditor.editor.loadDesign({});
       },
+      // called when the editor has finished loading
+      editorReady() {
+        console.log('editorReady');
+      },
       saveDesign() {
         this.$refs.emailEditor.editor.saveDesign((design) => {
           console.log('saveDesign', design);

src/components/EmailEditor.vue

@@ -65,7 +65,6 @@ export default {
         },
       });
 
-      // @deprecated
       this.$emit('load');
 
       this.editor.addEventListener('editor:ready', () => {

src/views/DesignEdit.vue

@@ -9,7 +9,7 @@
         <button v-on:click="exportHtml">Export HTML</button>
       </div>
 
-      <EmailEditor ref="emailEditor" v-on:ready="editorReady" />
+      <EmailEditor ref="emailEditor" v-on:load="editorLoaded" v-on:ready="editorReady" />
     </div>
   </div>
 </template>
@@ -23,6 +23,11 @@ export default {
     EmailEditor
   },
   methods: {
+    // called when the editor is created
+    editorLoaded() {
+      console.log('editorLoaded');
+    },
+    // called when the editor has finished loading
     editorReady() {
       console.log('editorReady');
     },

src/views/Example.vue

@@ -8,7 +8,7 @@
         <button v-on:click="exportHtml">Export HTML</button>
       </div>
 
-      <EmailEditor ref="emailEditor" v-on:ready="editorReady" />
+      <EmailEditor ref="emailEditor" v-on:load="editorLoaded" v-on:ready="editorReady" />
     </div>
   </div>
 </template>
@@ -23,9 +23,14 @@ export default {
     EmailEditor
   },
   methods: {
+    // called when the editor is created
+    editorLoaded() {
+      console.log('editorLoaded');
+      this.$refs.emailEditor.editor.loadDesign(sample);
+    },
+    // called when the editor has finished loading
     editorReady() {
       console.log('editorReady');
-      this.$refs.emailEditor.editor.loadDesign(sample);
     },
     saveDesign() {
       this.$refs.emailEditor.editor.saveDesign(