Pass unlayer instance to onLoad and onReady callbacks

Closes #201

Closes #180

Author: brunolemos

demo/src/example/index.tsx

@@ -2,9 +2,7 @@ import React, { useRef, useState } from 'react';
 import styled from 'styled-components';
 
 import packageJson from '../../../package.json';
-
-import EmailEditor from '../../../src';
-import { EditorRef } from '../../../src/types';
+import EmailEditor, { EditorRef, EmailEditorProps } from '../../../src'; // use react-email-editor instead
 import sample from './sample.json';
 
 const Container = styled.div`
@@ -75,19 +73,14 @@ const Example = () => {
     console.log('onDesignLoad', data);
   };
 
-  const onLoad = () => {
-    console.log('onLoad');
-
-    emailEditorRef.current?.editor?.addEventListener(
-      'design:loaded',
-      onDesignLoad
-    );
-
-    emailEditorRef.current?.editor?.loadDesign(sample);
+  const onLoad: EmailEditorProps['onLoad'] = (unlayer) => {
+    console.log('onLoad', unlayer);
+    unlayer.addEventListener('design:loaded', onDesignLoad);
+    unlayer.loadDesign(sample);
   };
 
-  const onReady = () => {
-    console.log('onReady');
+  const onReady: EmailEditorProps['onReady'] = (unlayer) => {
+    console.log('onReady', unlayer);
   };
 
   return (

src/EmailEditor.tsx

@@ -70,7 +70,7 @@ export const EmailEditor = React.forwardRef<EditorRef, EmailEditorProps>(
     useEffect(() => {
       if (!editor) return;
 
-      onLoad?.();
+      onLoad?.(editor);
 
       // All properties starting with on[Name] are registered as event listeners.
       methodProps.forEach((methodProp) => {
@@ -84,7 +84,11 @@ export const EmailEditor = React.forwardRef<EditorRef, EmailEditorProps>(
         }
       });
 
-      if (onReady) editor.addEventListener('editor:ready', onReady);
+      if (onReady) {
+        editor.addEventListener('editor:ready', () => {
+          onReady(editor);
+        });
+      }
     }, [editor, Object.keys(methodProps).join(',')]);
 
     return (

src/types.ts

@@ -17,8 +17,8 @@ export interface EditorRef {
 export interface EmailEditorProps {
   editorId?: string | undefined;
   minHeight?: number | string | undefined;
-  onLoad?(): void;
-  onReady?(): void;
+  onLoad?(unlayer: Editor): void;
+  onReady?(unlayer: Editor): void;
   options?: UnlayerOptions | undefined;
   scriptUrl?: string | undefined;
   style?: CSSProperties | undefined;