From 4642a57ce2034d8260385ba269845b7a4721dd18 Mon Sep 17 00:00:00 2001
From: liumingye <8676207+liumingye@users.noreply.github.com>
Date: Sat, 10 Aug 2024 13:09:08 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E6=8F=92=E4=BB=B6api?=
 =?UTF-8?q?=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/core/Editor.ts                       | 17 +++++--
 packages/core/ServersPlugin.ts                | 33 +++++++++----
 packages/core/index.ts                        |  3 ++
 packages/core/interface/Editor.ts             | 48 +++++++++++++++++++
 packages/core/plugin/AddBaseTypePlugin.ts     | 12 ++++-
 packages/core/plugin/AlignGuidLinePlugin.ts   |  5 +-
 packages/core/plugin/BarCodePlugin.ts         |  9 +++-
 packages/core/plugin/CenterAlignPlugin.ts     | 10 +++-
 packages/core/plugin/ControlsPlugin.ts        |  5 +-
 packages/core/plugin/ControlsRotatePlugin.ts  |  4 +-
 packages/core/plugin/CopyPlugin.ts            | 10 +++-
 packages/core/plugin/DeleteHotKeyPlugin.ts    | 11 +++--
 packages/core/plugin/DrawLinePlugin.ts        | 10 +++-
 packages/core/plugin/DrawPolygonPlugin.ts     |  9 +++-
 packages/core/plugin/DringPlugin.ts           | 10 +++-
 packages/core/plugin/FlipPlugin.ts            | 13 +++--
 packages/core/plugin/FontPlugin.ts            |  9 +++-
 packages/core/plugin/FreeDrawPlugin.ts        |  9 +++-
 packages/core/plugin/GroupAlignPlugin.ts      | 13 ++++-
 packages/core/plugin/GroupPlugin.ts           | 10 +++-
 packages/core/plugin/GroupTextEditorPlugin.ts |  3 +-
 packages/core/plugin/HistoryPlugin.ts         | 10 +++-
 packages/core/plugin/ImageStroke.ts           | 14 ++++--
 packages/core/plugin/LayerPlugin.ts           | 10 +++-
 packages/core/plugin/LockPlugin.ts            | 11 ++++-
 packages/core/plugin/MaskPlugin.ts            | 10 +++-
 packages/core/plugin/MaterialPlugin.ts        | 13 ++++-
 packages/core/plugin/MoveHotKeyPlugin.ts      |  4 +-
 packages/core/plugin/PathTextPlugin.ts        | 10 +++-
 packages/core/plugin/PolygonModifyPlugin.ts   |  9 +++-
 packages/core/plugin/PsdPlugin.ts             | 11 +++--
 packages/core/plugin/QrCodePlugin.ts          |  9 +++-
 packages/core/plugin/ResizePlugin.ts          |  4 +-
 packages/core/plugin/RulerPlugin.ts           | 14 ++++--
 packages/core/plugin/SimpleClipImagePlugin.ts | 10 +++-
 packages/core/plugin/WaterMarkPlugin.ts       | 10 +++-
 packages/core/plugin/WorkspacePlugin.ts       | 20 +++++++-
 src/hooks/select.ts                           |  4 +-
 src/views/home/index.vue                      |  5 +-
 typings/editor.d.ts                           | 42 ----------------
 40 files changed, 334 insertions(+), 139 deletions(-)
 create mode 100644 packages/core/interface/Editor.ts
 delete mode 100644 typings/editor.d.ts

diff --git a/packages/core/Editor.ts b/packages/core/Editor.ts
index 5e2e3150..dece38d2 100644
--- a/packages/core/Editor.ts
+++ b/packages/core/Editor.ts
@@ -3,6 +3,13 @@ import hotkeys from 'hotkeys-js';
 import ContextMenu from './ContextMenu.js';
 import ServersPlugin from './ServersPlugin';
 import { AsyncSeriesHook } from 'tapable';
+import type {
+  IPluginMenu,
+  IPluginClass,
+  IPluginOption,
+  IEditorHooksType,
+  IPluginTempl,
+} from '@kuaitu/core';
 
 import Utils from './utils/utils';
 
@@ -44,10 +51,10 @@ class Editor extends EventEmitter {
   }
 
   // 引入组件
-  use(plugin: IPluginClass, options?: IPluginOption) {
+  use(plugin: IPluginTempl, options?: IPluginOption) {
     if (this._checkPlugin(plugin) && this.canvas) {
       this._saveCustomAttr(plugin);
-      const pluginRunTime = new plugin(this.canvas, this, options || {}) as IPluginClass;
+      const pluginRunTime = new (plugin as IPluginClass)(this.canvas, this, options || {});
       // 添加插件名称
       pluginRunTime.pluginName = plugin.pluginName;
       this.pluginMap[plugin.pluginName] = pluginRunTime;
@@ -73,7 +80,7 @@ class Editor extends EventEmitter {
   }
 
   // 检查组件
-  private _checkPlugin(plugin: IPluginClass) {
+  private _checkPlugin(plugin: IPluginTempl) {
     const { pluginName, events = [], apis = [] } = plugin;
     //名称检查
     if (this.pluginMap[pluginName]) {
@@ -103,7 +110,7 @@ class Editor extends EventEmitter {
           // eslint-disable-next-line prefer-rest-params
           const result = hook.apply(plugin, [...arguments]);
           // hook 兼容非 Promise 返回值
-          return result instanceof Promise ? result : Promise.resolve(result);
+          return (result as any) instanceof Promise ? result : Promise.resolve(result);
         });
       }
     });
@@ -120,7 +127,7 @@ class Editor extends EventEmitter {
   }
 
   // 保存组件自定义事件与API
-  private _saveCustomAttr(plugin: IPluginClass) {
+  private _saveCustomAttr(plugin: IPluginTempl) {
     const { events = [], apis = [] } = plugin;
     this.customApis = this.customApis.concat(apis);
     this.customEvents = this.customEvents.concat(events);
diff --git a/packages/core/ServersPlugin.ts b/packages/core/ServersPlugin.ts
index 22abdd6f..030e6c8d 100644
--- a/packages/core/ServersPlugin.ts
+++ b/packages/core/ServersPlugin.ts
@@ -8,10 +8,31 @@
 import { v4 as uuid } from 'uuid';
 import { selectFiles, clipboardText, downFile } from './utils/utils';
 import { fabric } from 'fabric';
-import Editor from './Editor';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 import { SelectEvent, SelectMode } from './eventType';
 
+type IPlugin = Pick<
+  ServersPlugin,
+  | 'insert'
+  | 'loadJSON'
+  | 'getJson'
+  | 'dragAddItem'
+  | 'clipboard'
+  | 'clipboardBase64'
+  | 'saveJson'
+  | 'saveSvg'
+  | 'saveImg'
+  | 'clear'
+  | 'preview'
+  | 'getSelectMode'
+  | 'getExtensionKey'
+>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
+
 function transformText(objects: any) {
   if (!objects) return;
   objects.forEach((item: any) => {
@@ -23,9 +44,7 @@ function transformText(objects: any) {
   });
 }
 
-class ServersPlugin {
-  public canvas: fabric.Canvas;
-  public editor: IEditor;
+class ServersPlugin implements IPluginTempl {
   public selectedMode: SelectMode;
   static pluginName = 'ServersPlugin';
   static apis = [
@@ -45,9 +64,7 @@ class ServersPlugin {
   ];
   static events = [SelectMode.ONE, SelectMode.MULTI, SelectEvent.CANCEL];
   // public hotkeys: string[] = ['left', 'right', 'down', 'up'];
-  constructor(canvas: fabric.Canvas, editor: IEditor) {
-    this.canvas = canvas;
-    this.editor = editor;
+  constructor(public canvas: fabric.Canvas, public editor: IEditor) {
     this.selectedMode = SelectMode.EMPTY;
     this._initSelectEvent();
   }
diff --git a/packages/core/index.ts b/packages/core/index.ts
index b71cc0b6..02bff02b 100644
--- a/packages/core/index.ts
+++ b/packages/core/index.ts
@@ -42,6 +42,9 @@ export { default as AddBaseTypePlugin } from './plugin/AddBaseTypePlugin';
 import EventType from './eventType';
 import Utils from './utils/utils';
 import CustomRect from './objects/CustomRect';
+// import { extend } from 'dayjs';
 
 export { EventType, Utils, CustomRect };
 export default Editor;
+
+export * from './interface/Editor';
diff --git a/packages/core/interface/Editor.ts b/packages/core/interface/Editor.ts
new file mode 100644
index 00000000..da9afaf2
--- /dev/null
+++ b/packages/core/interface/Editor.ts
@@ -0,0 +1,48 @@
+import type Editor from '@kuaitu/core';
+
+// IEditor类型包含插件实例，Editor不包含插件实例
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface IEditor extends Editor {}
+
+// 生命周期事件类型
+export type IEditorHooksType =
+  | 'hookImportBefore'
+  | 'hookImportAfter'
+  | 'hookSaveBefore'
+  | 'hookSaveAfter'
+  | 'hookTransform';
+
+// 插件实例
+export declare class IPluginTempl {
+  constructor(canvas: fabric.Canvas, editor: IEditor, options?: IPluginOption);
+  static pluginName: string;
+  static events: string[];
+  static apis: string[];
+  hotkeyEvent?: (name: string, e: KeyboardEvent) => void;
+  hookImportBefore?: (...args: unknown[]) => Promise<unknown>;
+  hookImportAfter?: (...args: unknown[]) => Promise<unknown>;
+  hookSaveBefore?: (...args: unknown[]) => Promise<unknown>;
+  hookSaveAfter?: (...args: unknown[]) => Promise<unknown>;
+  hookTransform?: (...args: unknown[]) => Promise<unknown>;
+  [propName: string]: any;
+  canvas?: fabric.Canvas;
+  editor?: IEditor;
+}
+
+export declare interface IPluginOption {
+  [propName: string]: unknown | undefined;
+}
+
+declare class IPluginClass2 extends IPluginTempl {
+  constructor();
+}
+// 插件class
+export declare interface IPluginClass {
+  new (canvas: fabric.Canvas, editor: Editor, options?: IPluginOption): IPluginClass2;
+}
+
+export declare interface IPluginMenu {
+  text: string;
+  command?: () => void;
+  child?: IPluginMenu[];
+}
diff --git a/packages/core/plugin/AddBaseTypePlugin.ts b/packages/core/plugin/AddBaseTypePlugin.ts
index a15333f4..1cec57dc 100644
--- a/packages/core/plugin/AddBaseTypePlugin.ts
+++ b/packages/core/plugin/AddBaseTypePlugin.ts
@@ -7,13 +7,20 @@
  */
 
 import { fabric } from 'fabric';
-import type Editor from '../Editor';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 import { v4 as uuid } from 'uuid';
 
+type IPlugin = Pick<AddBaseTypePlugin, 'addBaseType' | 'createImgByElement'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
+
 export default class AddBaseTypePlugin implements IPluginTempl {
   static pluginName = 'AddBaseTypePlugin';
   static apis = ['addBaseType', 'createImgByElement'];
-  constructor(public canvas: fabric.Canvas, public editor: Editor) {
+  constructor(public canvas: fabric.Canvas, public editor: IEditor) {
     this.editor = editor;
     this.canvas = canvas;
   }
@@ -61,6 +68,7 @@ export default class AddBaseTypePlugin implements IPluginTempl {
 
   _toScale(item: fabric.Object) {
     const { width } = this.editor.getWorkspase();
+    if (width === undefined) return;
     item.scaleToWidth(width / 2);
   }
 
diff --git a/packages/core/plugin/AlignGuidLinePlugin.ts b/packages/core/plugin/AlignGuidLinePlugin.ts
index f4cbbb3c..6b6d8086 100644
--- a/packages/core/plugin/AlignGuidLinePlugin.ts
+++ b/packages/core/plugin/AlignGuidLinePlugin.ts
@@ -5,11 +5,8 @@
  * @LastEditTime: 2024-04-10 17:32:48
  * @Description: 辅助线功能
  */
-
-import Editor from '../Editor';
-type IEditor = Editor;
-
 import { fabric } from 'fabric';
+import { IEditor, IPluginTempl } from '@kuaitu/core';
 
 declare interface VerticalLine {
   x: number;
diff --git a/packages/core/plugin/BarCodePlugin.ts b/packages/core/plugin/BarCodePlugin.ts
index 450f22cd..655d4e0a 100644
--- a/packages/core/plugin/BarCodePlugin.ts
+++ b/packages/core/plugin/BarCodePlugin.ts
@@ -7,10 +7,15 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import JsBarcode from 'jsbarcode';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
-type IEditor = Editor;
+type IPlugin = Pick<BarCodePlugin, 'addBarcode' | 'setBarcode' | 'getBarcodeTypes'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 // 条形码生成参数
 // https://github.com/lindell/JsBarcode/wiki/Options
diff --git a/packages/core/plugin/CenterAlignPlugin.ts b/packages/core/plugin/CenterAlignPlugin.ts
index 09e5edb5..6a9c575a 100644
--- a/packages/core/plugin/CenterAlignPlugin.ts
+++ b/packages/core/plugin/CenterAlignPlugin.ts
@@ -7,8 +7,14 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<CenterAlignPlugin, 'centerH' | 'center' | 'position' | 'centerV'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class CenterAlignPlugin implements IPluginTempl {
   static pluginName = 'CenterAlignPlugin';
diff --git a/packages/core/plugin/ControlsPlugin.ts b/packages/core/plugin/ControlsPlugin.ts
index 1531cafe..bce59795 100644
--- a/packages/core/plugin/ControlsPlugin.ts
+++ b/packages/core/plugin/ControlsPlugin.ts
@@ -5,16 +5,13 @@
  * @LastEditTime: 2024-07-16 14:59:25
  * @Description: 控制条插件
  */
-
-import Editor from '../Editor';
-type IEditor = Editor;
-
 import { fabric } from 'fabric';
 import verticalImg from '../assets/middlecontrol.svg?url';
 // import verticalImg from './middlecontrol.svg';
 import horizontalImg from '../assets/middlecontrolhoz.svg?url';
 import edgeImg from '../assets/edgecontrol.svg?url';
 import rotateImg from '../assets/rotateicon.svg?url';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
 /**
  * 实际场景: 在进行某个对象缩放的时候，由于fabricjs默认精度使用的是toFixed(2)。
diff --git a/packages/core/plugin/ControlsRotatePlugin.ts b/packages/core/plugin/ControlsRotatePlugin.ts
index a2f3d4c5..09150d1f 100644
--- a/packages/core/plugin/ControlsRotatePlugin.ts
+++ b/packages/core/plugin/ControlsRotatePlugin.ts
@@ -5,9 +5,7 @@
  * @LastEditTime: 2024-04-10 17:32:56
  * @Description: 控制条插件
  */
-
-import Editor from '../Editor';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
 // 定义旋转光标样式，根据转动角度设定光标旋转
 function rotateIcon(angle: number) {
diff --git a/packages/core/plugin/CopyPlugin.ts b/packages/core/plugin/CopyPlugin.ts
index effa34af..723da2ba 100644
--- a/packages/core/plugin/CopyPlugin.ts
+++ b/packages/core/plugin/CopyPlugin.ts
@@ -7,10 +7,16 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-type IEditor = Editor;
 import { v4 as uuid } from 'uuid';
 import { getImgStr } from '../utils/utils';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<CopyPlugin, 'clone'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class CopyPlugin implements IPluginTempl {
   static pluginName = 'CopyPlugin';
diff --git a/packages/core/plugin/DeleteHotKeyPlugin.ts b/packages/core/plugin/DeleteHotKeyPlugin.ts
index 2c3384d9..5f298652 100644
--- a/packages/core/plugin/DeleteHotKeyPlugin.ts
+++ b/packages/core/plugin/DeleteHotKeyPlugin.ts
@@ -7,9 +7,14 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-type IEditor = Editor;
-// import { v4 as uuid } from 'uuid';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<DeleteHotKeyPlugin, 'del'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class DeleteHotKeyPlugin implements IPluginTempl {
   static pluginName = 'DeleteHotKeyPlugin';
diff --git a/packages/core/plugin/DrawLinePlugin.ts b/packages/core/plugin/DrawLinePlugin.ts
index 3455cd10..314545d5 100644
--- a/packages/core/plugin/DrawLinePlugin.ts
+++ b/packages/core/plugin/DrawLinePlugin.ts
@@ -10,8 +10,14 @@ import { v4 as uuid } from 'uuid';
 import { fabric } from 'fabric';
 import Arrow from '../objects/Arrow';
 import ThinTailArrow from '../objects/ThinTailArrow';
-import Editor from '../Editor';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<DrawLinePlugin, 'setLineType' | 'setMode'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class DrawLinePlugin implements IPluginTempl {
   static pluginName = 'DrawLinePlugin';
diff --git a/packages/core/plugin/DrawPolygonPlugin.ts b/packages/core/plugin/DrawPolygonPlugin.ts
index ac3fca0c..76eec2b5 100644
--- a/packages/core/plugin/DrawPolygonPlugin.ts
+++ b/packages/core/plugin/DrawPolygonPlugin.ts
@@ -1,9 +1,14 @@
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { v4 as uuid } from 'uuid';
 import { shiftAngle } from '../utils/utils';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
-type IEditor = Editor;
+type IPlugin = Pick<DrawPolygonPlugin, 'beginDrawPolygon' | 'endDrawPolygon' | 'discardPolygon'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 type LineCoords = [fabric.Point, fabric.Point];
 type OffListener = (ev: fabric.IEvent) => void;
diff --git a/packages/core/plugin/DringPlugin.ts b/packages/core/plugin/DringPlugin.ts
index 7feafd8e..ad7daa1e 100644
--- a/packages/core/plugin/DringPlugin.ts
+++ b/packages/core/plugin/DringPlugin.ts
@@ -6,8 +6,14 @@
  * @Description: 拖拽插件
  */
 
-import Editor from '../Editor';
-type IEditor = Editor;
+import { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<DringPlugin, 'startDring' | 'endDring'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 export class DringPlugin implements IPluginTempl {
   defautOption = {};
diff --git a/packages/core/plugin/FlipPlugin.ts b/packages/core/plugin/FlipPlugin.ts
index 7376a39e..faa794b8 100644
--- a/packages/core/plugin/FlipPlugin.ts
+++ b/packages/core/plugin/FlipPlugin.ts
@@ -1,16 +1,21 @@
 import { fabric } from 'fabric';
-import type Editor from '../Editor';
 import { SelectMode } from '../eventType';
-// import { Ref } from 'vue';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<FlipPlugin, 'flip'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
-// import { t } from '@/language/index';
 const t = (key: string) => key;
 // import event from '@/utils/event/notifier';
 
 export default class FlipPlugin implements IPluginTempl {
   static pluginName = 'FlipPlugin';
   static apis = ['flip'];
-  constructor(public canvas: fabric.Canvas, public editor: Editor) {}
+  constructor(public canvas: fabric.Canvas, public editor: IEditor) {}
 
   flip(type: 'X' | 'Y') {
     const activeObject = this.canvas.getActiveObject();
diff --git a/packages/core/plugin/FontPlugin.ts b/packages/core/plugin/FontPlugin.ts
index b2a96cc1..6ddfeddc 100644
--- a/packages/core/plugin/FontPlugin.ts
+++ b/packages/core/plugin/FontPlugin.ts
@@ -9,11 +9,16 @@
 // const repoSrc = 'http://localhost:1337';
 import { fabric } from 'fabric';
 import FontFaceObserver from 'fontfaceobserver';
-import Editor from '../Editor';
 import axios from 'axios';
 import { downFile } from '../utils/utils';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
-type IEditor = Editor;
+type IPlugin = Pick<FontPlugin, 'getFontList' | 'loadFont' | 'getFontJson' | 'downFontByJSON'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 interface Font {
   type: string;
diff --git a/packages/core/plugin/FreeDrawPlugin.ts b/packages/core/plugin/FreeDrawPlugin.ts
index 3cd5960c..a5981357 100644
--- a/packages/core/plugin/FreeDrawPlugin.ts
+++ b/packages/core/plugin/FreeDrawPlugin.ts
@@ -1,8 +1,13 @@
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { v4 as uuid } from 'uuid';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
-type IEditor = Editor;
+type IPlugin = Pick<FreeDrawPlugin, 'startDraw' | 'endDraw'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 type DrawOptions = {
   width: number;
diff --git a/packages/core/plugin/GroupAlignPlugin.ts b/packages/core/plugin/GroupAlignPlugin.ts
index 295ab703..7a6c3473 100644
--- a/packages/core/plugin/GroupAlignPlugin.ts
+++ b/packages/core/plugin/GroupAlignPlugin.ts
@@ -7,8 +7,17 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<
+  GroupAlignPlugin,
+  'left' | 'right' | 'xcenter' | 'ycenter' | 'top' | 'bottom' | 'xequation' | 'yequation'
+>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class GroupAlignPlugin implements IPluginTempl {
   static pluginName = 'GroupAlignPlugin';
diff --git a/packages/core/plugin/GroupPlugin.ts b/packages/core/plugin/GroupPlugin.ts
index 60bd4557..c435a53f 100644
--- a/packages/core/plugin/GroupPlugin.ts
+++ b/packages/core/plugin/GroupPlugin.ts
@@ -7,10 +7,16 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { isGroup, isActiveSelection } from '../utils/utils';
 import { v4 as uuid } from 'uuid';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<GroupPlugin, 'unGroup' | 'group'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class GroupPlugin implements IPluginTempl {
   static pluginName = 'GroupPlugin';
diff --git a/packages/core/plugin/GroupTextEditorPlugin.ts b/packages/core/plugin/GroupTextEditorPlugin.ts
index e79032f6..19768b0e 100644
--- a/packages/core/plugin/GroupTextEditorPlugin.ts
+++ b/packages/core/plugin/GroupTextEditorPlugin.ts
@@ -7,11 +7,10 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { isGroup } from '../utils/utils';
 import { v4 as uuid } from 'uuid';
 import { pick } from 'lodash-es';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
 class GroupTextEditorPlugin implements IPluginTempl {
   static pluginName = 'GroupTextEditorPlugin';
diff --git a/packages/core/plugin/HistoryPlugin.ts b/packages/core/plugin/HistoryPlugin.ts
index 2993abcb..8eb18501 100644
--- a/packages/core/plugin/HistoryPlugin.ts
+++ b/packages/core/plugin/HistoryPlugin.ts
@@ -7,10 +7,16 @@
  * @Description: 历史记录插件
  */
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import '../utils/fabric-history.js';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<HistoryPlugin, 'undo' | 'redo' | 'historyUpdate'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
-type IEditor = Editor;
 type extendCanvas = {
   undo: () => void;
   redo: () => void;
diff --git a/packages/core/plugin/ImageStroke.ts b/packages/core/plugin/ImageStroke.ts
index 22cf04af..de63573e 100644
--- a/packages/core/plugin/ImageStroke.ts
+++ b/packages/core/plugin/ImageStroke.ts
@@ -7,15 +7,21 @@
  * @Description: 图像描边
  */
 import { fabric } from 'fabric';
-import Editor from '../Editor';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
-type IEditor = Editor;
-type IStrokeOps = {
+type IPlugin = Pick<ImageStrokePlugin, 'imageStrokeDraw'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
+
+/*type IStrokeOps = {
   enabled: boolean;
   width: number;
   color: string;
   type: 'destination-out' | 'source-over' | 'source-in';
-};
+};*/
 interface IExtendImage {
   [x: string]: any;
   originWidth?: number;
diff --git a/packages/core/plugin/LayerPlugin.ts b/packages/core/plugin/LayerPlugin.ts
index 27f40056..6cb5de05 100644
--- a/packages/core/plugin/LayerPlugin.ts
+++ b/packages/core/plugin/LayerPlugin.ts
@@ -7,8 +7,14 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<LayerPlugin, 'up' | 'down' | 'toFront' | 'toBack'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class LayerPlugin implements IPluginTempl {
   static pluginName = 'LayerPlugin';
diff --git a/packages/core/plugin/LockPlugin.ts b/packages/core/plugin/LockPlugin.ts
index 09029b6f..36b432b6 100644
--- a/packages/core/plugin/LockPlugin.ts
+++ b/packages/core/plugin/LockPlugin.ts
@@ -6,8 +6,15 @@
  * @Description: 锁定文件
  */
 import { fabric } from 'fabric';
-import type Editor from '../Editor';
 import { SelectMode } from '../eventType';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<LockPlugin, 'lock' | 'unLock'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 enum ItypeKey {
   lockMovementX = 'lockMovementX',
@@ -20,7 +27,7 @@ enum ItypeKey {
 export default class LockPlugin implements IPluginTempl {
   static pluginName = 'LockPlugin';
   static apis = ['lock', 'unLock'];
-  constructor(public canvas: fabric.Canvas, public editor: Editor) {}
+  constructor(public canvas: fabric.Canvas, public editor: IEditor) {}
 
   hookImportAfter() {
     this.canvas.forEachObject((obj) => {
diff --git a/packages/core/plugin/MaskPlugin.ts b/packages/core/plugin/MaskPlugin.ts
index 1f03100f..817a7850 100644
--- a/packages/core/plugin/MaskPlugin.ts
+++ b/packages/core/plugin/MaskPlugin.ts
@@ -7,8 +7,14 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<MaskPlugin, 'setCoverMask' | 'workspaceMaskToggle' | 'getworkspaceMaskStatus'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class MaskPlugin implements IPluginTempl {
   static pluginName = 'MaskPlugin';
diff --git a/packages/core/plugin/MaterialPlugin.ts b/packages/core/plugin/MaterialPlugin.ts
index 186fa8ef..f8e0cd9b 100644
--- a/packages/core/plugin/MaterialPlugin.ts
+++ b/packages/core/plugin/MaterialPlugin.ts
@@ -7,10 +7,19 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-type IEditor = Editor;
 import axios from 'axios';
 import qs from 'qs';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<
+  MaterialPlugin,
+  'getTemplTypeList' | 'getTemplList' | 'getMaterialTypeList' | 'getMaterialList' | 'getSizeList'
+>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class MaterialPlugin implements IPluginTempl {
   static pluginName = 'MaterialPlugin';
diff --git a/packages/core/plugin/MoveHotKeyPlugin.ts b/packages/core/plugin/MoveHotKeyPlugin.ts
index 000fbaf2..c248c92c 100644
--- a/packages/core/plugin/MoveHotKeyPlugin.ts
+++ b/packages/core/plugin/MoveHotKeyPlugin.ts
@@ -7,9 +7,7 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-type IEditor = Editor;
-// import { v4 as uuid } from 'uuid';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
 class MoveHotKeyPlugin implements IPluginTempl {
   static pluginName = 'MoveHotKeyPlugin';
diff --git a/packages/core/plugin/PathTextPlugin.ts b/packages/core/plugin/PathTextPlugin.ts
index cb3d5516..4668578c 100644
--- a/packages/core/plugin/PathTextPlugin.ts
+++ b/packages/core/plugin/PathTextPlugin.ts
@@ -1,8 +1,14 @@
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { v4 as uuid } from 'uuid';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<PathTextPlugin, 'startTextPathDraw' | 'endTextPathDraw'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
-type IEditor = Editor;
 type DrawOptions = {
   decimate: number;
   width: number;
diff --git a/packages/core/plugin/PolygonModifyPlugin.ts b/packages/core/plugin/PolygonModifyPlugin.ts
index ffbb70cd..ad78f700 100644
--- a/packages/core/plugin/PolygonModifyPlugin.ts
+++ b/packages/core/plugin/PolygonModifyPlugin.ts
@@ -1,10 +1,15 @@
-import Editor from '../Editor';
 import { fabric } from 'fabric';
 import { drawImg } from '../utils/utils';
 import edgeImg from '../assets/edgecontrol.svg?url';
 import { noop } from 'lodash-es';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
-type IEditor = Editor;
+type IPlugin = Pick<PolygonModifyPlugin, 'toggleEdit' | 'activeEdit' | 'inActiveEdit'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 export type Options = {
   fill: string;
diff --git a/packages/core/plugin/PsdPlugin.ts b/packages/core/plugin/PsdPlugin.ts
index d3e727e7..64eb9499 100644
--- a/packages/core/plugin/PsdPlugin.ts
+++ b/packages/core/plugin/PsdPlugin.ts
@@ -5,13 +5,18 @@
  * @LastEditTime: 2024-06-08 18:31:24
  * @Description: PSD插件
  */
-
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { selectFiles } from '../utils/utils';
 import psdToJson from '../utils/psd';
 import Psd from '@webtoon/psd';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<PsdPlugin, 'insertPSD'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class PsdPlugin implements IPluginTempl {
   static pluginName = 'PsdPlugin';
diff --git a/packages/core/plugin/QrCodePlugin.ts b/packages/core/plugin/QrCodePlugin.ts
index f571b968..869fa9f0 100644
--- a/packages/core/plugin/QrCodePlugin.ts
+++ b/packages/core/plugin/QrCodePlugin.ts
@@ -7,11 +7,16 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import QRCodeStyling from 'qr-code-styling';
 import { blobToBase64 } from '../utils/utils';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
-type IEditor = Editor;
+type IPlugin = Pick<QrCodePlugin, 'addQrCode' | 'setQrCode' | 'getQrCodeTypes'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 // 二维码生成参数
 
diff --git a/packages/core/plugin/ResizePlugin.ts b/packages/core/plugin/ResizePlugin.ts
index e2be85eb..55050d34 100644
--- a/packages/core/plugin/ResizePlugin.ts
+++ b/packages/core/plugin/ResizePlugin.ts
@@ -7,11 +7,9 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { throttle } from 'lodash-es';
 import '../styles/resizePlugin.css';
-
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
 
 type IPosition = 'left' | 'right' | 'top' | 'bottom';
 
diff --git a/packages/core/plugin/RulerPlugin.ts b/packages/core/plugin/RulerPlugin.ts
index d39aa5b8..230c0c65 100644
--- a/packages/core/plugin/RulerPlugin.ts
+++ b/packages/core/plugin/RulerPlugin.ts
@@ -7,9 +7,17 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
-// import { throttle } from 'lodash-es';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<
+  RulerPlugin,
+  'hideGuideline' | 'showGuideline' | 'rulerEnable' | 'rulerDisable'
+>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 import initRuler from '../ruler';
 
diff --git a/packages/core/plugin/SimpleClipImagePlugin.ts b/packages/core/plugin/SimpleClipImagePlugin.ts
index c0bfdcdc..ed3b2629 100644
--- a/packages/core/plugin/SimpleClipImagePlugin.ts
+++ b/packages/core/plugin/SimpleClipImagePlugin.ts
@@ -1,8 +1,14 @@
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { getPolygonVertices } from '../../../src/utils/math';
 import { get, set } from 'lodash-es';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<SimpleClipImagePlugin, 'addClipPathToImage' | 'removeClip'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 const getBounds = (activeObject: fabric.Object) => {
   const { left = 0, top = 0 } = activeObject;
diff --git a/packages/core/plugin/WaterMarkPlugin.ts b/packages/core/plugin/WaterMarkPlugin.ts
index 21fa6452..6cf2e19e 100644
--- a/packages/core/plugin/WaterMarkPlugin.ts
+++ b/packages/core/plugin/WaterMarkPlugin.ts
@@ -7,7 +7,14 @@
  */
 import { cloneDeep } from 'lodash-es';
 import { fabric } from 'fabric';
-import Editor from '../Editor';
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<WaterMarkPlugin, 'drawWaterMark' | 'clearWaterMMatk' | 'updateDrawStatus'>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 enum POSITION {
   lt = 'Left_Top',
@@ -17,7 +24,6 @@ enum POSITION {
   full = 'Full',
 }
 
-type IEditor = Editor;
 type IPosition = POSITION.lt | POSITION.lb | POSITION.rt | POSITION.rb | POSITION.full; // lt 左上 lr 左上 rt 右上  rb 右下 full 平铺 后续可扩展其他功能
 type IDrawOps = {
   text: string;
diff --git a/packages/core/plugin/WorkspacePlugin.ts b/packages/core/plugin/WorkspacePlugin.ts
index 5087f917..43ace4db 100644
--- a/packages/core/plugin/WorkspacePlugin.ts
+++ b/packages/core/plugin/WorkspacePlugin.ts
@@ -7,9 +7,25 @@
  */
 
 import { fabric } from 'fabric';
-import Editor from '../Editor';
 import { throttle } from 'lodash-es';
-type IEditor = Editor;
+import type { IEditor, IPluginTempl } from '@kuaitu/core';
+
+type IPlugin = Pick<
+  WorkspacePlugin,
+  | 'big'
+  | 'small'
+  | 'auto'
+  | 'one'
+  | 'setSize'
+  | 'getWorkspase'
+  | 'setWorkspaseBg'
+  | 'setCenterFromObject'
+>;
+
+declare module '@kuaitu/core' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface IEditor extends IPlugin {}
+}
 
 class WorkspacePlugin implements IPluginTempl {
   static pluginName = 'WorkspacePlugin';
diff --git a/src/hooks/select.ts b/src/hooks/select.ts
index c088b59a..7de28032 100644
--- a/src/hooks/select.ts
+++ b/src/hooks/select.ts
@@ -6,7 +6,7 @@
  * @LastEditors: 秦少卫
  * @LastEditTime: 2024-06-10 20:11:48
  */
-import Editor from '@kuaitu/core';
+import { IEditor } from '@kuaitu/core';
 import { useI18n } from 'vue-i18n';
 
 import { type Selector } from './useSelectListen';
@@ -21,7 +21,7 @@ import { type Selector } from './useSelectListen';
 export default function useSelect() {
   const fabric = inject('fabric');
   const { t } = useI18n();
-  const canvasEditor = inject('canvasEditor') as Editor;
+  const canvasEditor = inject('canvasEditor') as IEditor;
   const mixinState = inject('mixinState') as Selector;
 
   return {
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index d6f5c9f8..2f0f6323 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -175,7 +175,7 @@
   </div>
 </template>
 
-<script name="Home" setup>
+<script name="Home" setup lang="ts">
 // 导入元素
 import importJson from '@/components/importJSON.vue';
 import importFile from '@/components/importFile.vue';
@@ -242,6 +242,7 @@ const { t } = useI18n();
 const APIHOST = import.meta.env.APP_APIHOST;
 
 import Editor, {
+  IEditor,
   DringPlugin,
   AlignGuidLinePlugin,
   ControlsPlugin,
@@ -281,7 +282,7 @@ import ClipImage from '@/components/clipImage.vue';
 import AttributeTextContent from '@/components/attributeTextContent.vue';
 
 // 创建编辑器
-const canvasEditor = new Editor();
+const canvasEditor = new Editor() as IEditor;
 
 const state = reactive({
   menuActive: 1,
diff --git a/typings/editor.d.ts b/typings/editor.d.ts
deleted file mode 100644
index 986ec6c3..00000000
--- a/typings/editor.d.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-/*
- * @Author: 秦少卫
- * @Date: 2023-05-13 18:53:44
- * @LastEditors: 秦少卫
- * @LastEditTime: 2024-07-22 10:32:18
- * @Description: file content
- */
-
-declare interface IPluginOption {
-  [propName: string]: unknown | undefined;
-}
-
-// 生命周期事件类型
-declare type IEditorHooksType =
-  | 'hookImportBefore'
-  | 'hookImportAfter'
-  | 'hookSaveBefore'
-  | 'hookSaveAfter'
-  | 'hookTransform';
-
-// 插件class
-declare interface IPluginClass extends IPluginTempl {
-  new (canvas: fabric.Canvas, editor: IEditor, options?: IPluginOption);
-}
-
-declare interface IPluginMenu {
-  text: string;
-  command?: () => void;
-  child?: IPluginMenu[];
-}
-
-// 插件实例
-declare class IPluginTempl {
-  static pluginName: string;
-  static events: string[];
-  static apis: string[];
-  canvas?: fabric.Canvas | null | undefined;
-  hotkeyEvent?: (name: string, e: KeyboardEvent) => void;
-  [propName: IEditorHooksType]: () => void;
-  [propName: string]: any;
-}