From 9aca4a03cd9d5c85c72e0d1a06d605ad006a12dd Mon Sep 17 00:00:00 2001
From: chenshenhai <cshenhai@gmail.com>
Date: Sun, 8 Aug 2021 16:51:36 +0800
Subject: [PATCH] feat: implement event mouseOver and mouseLeave for Element

---
 packages/core/examples/features/lib/main.js | 10 +++++++---
 packages/core/src/index.ts                  | 12 +++++++++++-
 packages/core/src/lib/core-event.ts         |  6 +++---
 3 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/packages/core/examples/features/lib/main.js b/packages/core/examples/features/lib/main.js
index 05c8e95..f33d280 100644
--- a/packages/core/examples/features/lib/main.js
+++ b/packages/core/examples/features/lib/main.js
@@ -46,9 +46,13 @@ core.on('changeScreen', (data) => {
 core.on('screenSelectElement', (data) => {
   console.log('screenSelectElement: ', data);
 });
-// core.on('screenHoverElement', (data) => {
-//   console.log('screenHoverElement: ', data);
-// });
+core.on('mouseOverElement', (data) => {
+  console.log('mouseOverElement: ', data);
+});
+core.on('mouseLeaveElement', (data) => {
+  console.log('mouseLeaveElement: ', data);
+});
+
 core.on('screenMoveElementStart', (data) => {
   console.log('screenMoveElementStart: ', data);
 });
diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
index f3936a4..8a72f54 100644
--- a/packages/core/src/index.ts
+++ b/packages/core/src/index.ts
@@ -379,6 +379,8 @@ class Core {
   }
 
   private [_handleHover](point: TypePoint): void {
+    let isMouseOverElement: boolean = false;
+    
     if (this[_mode] === Mode.SELECT_AREA) {
       this[_board].resetCursor();
     } else if (this[_cursorStatus] === CursorStatus.NULL) {
@@ -389,11 +391,19 @@ class Core {
         if (index !== null && index >= 0) {
           const elem = this[_data].elements[index];
           if (elem) {
-            this[_coreEvent].trigger('mouseOverElement', { index, uuid: elem.uuid, element: elem, })
+            this[_coreEvent].trigger('mouseOverElement', { index, uuid: elem.uuid, element: elem, });
+            this[_tempData].set('hoverUUID', elem.uuid);
+            isMouseOverElement = true;
           }
         }
       }
     }
+    if (isMouseOverElement !== true && this[_tempData].get('hoverUUID') !== null) {
+      const uuid = this[_tempData].get('hoverUUID');
+      const index: number | null = this[_helper].getElementIndexByUUID(uuid || '');
+      this[_coreEvent].trigger('mouseLeaveElement', { uuid, index })
+      this[_tempData].set('hoverUUID', null); 
+    }
   }
 
   private [_dragElements](uuids: string[], point: TypePoint, prevPoint: TypePoint|null): void {
diff --git a/packages/core/src/lib/core-event.ts b/packages/core/src/lib/core-event.ts
index fab1314..d220406 100644
--- a/packages/core/src/lib/core-event.ts
+++ b/packages/core/src/lib/core-event.ts
@@ -7,14 +7,14 @@ import {
 } from '@idraw/types';
 
 export type TypeCoreEventSelectBaseArg = {
-  index: number;
-  uuid: string;
+  index: number | null;
+  uuid: string | null;
 }
 
 export type TypeCoreEventArgMap  = {
   'error': any;
   'mouseOverElement': TypeCoreEventSelectBaseArg & { element: TypeElement<keyof TypeElemDesc> }
-  'mouseLeaveElement': void;
+  'mouseLeaveElement': TypeCoreEventSelectBaseArg;
   'screenSelectElement': TypeCoreEventSelectBaseArg & { element: TypeElement<keyof TypeElemDesc> }
   'screenMoveElementStart': TypeCoreEventSelectBaseArg & TypePoint,
   'screenMoveElementEnd': TypeCoreEventSelectBaseArg & TypePoint,