diff --git a/examples/index.html b/examples/index.html index 7520510..e662b30 100644 --- a/examples/index.html +++ b/examples/index.html @@ -1,27 +1,28 @@ - + - - - - - Muya Example - - -
- - - - - - - - - - -
-
-
-
- - - \ No newline at end of file + + + + + Muya Example + + +
+ + + + + + + + + + + +
+
+
+
+ + + diff --git a/examples/package.json b/examples/package.json index 17bc4af..8ff7632 100644 --- a/examples/package.json +++ b/examples/package.json @@ -1,15 +1,15 @@ { - "name": "muya-examples", - "version": "0.0.1", - "description": "Muya vanilla ts demo project", - "author": "jocs ", - "scripts": { - "dev:demo": "vite" - }, - "keywords": [], - "license": "MIT", - "dependencies": { - "@muyajs/core": "workspace:*", - "intl-segmenter-polyfill": "^0.4.4" - } -} \ No newline at end of file + "name": "muya-examples", + "version": "0.0.1", + "description": "Muya vanilla ts demo project", + "author": "jocs ", + "license": "MIT", + "keywords": [], + "scripts": { + "dev:demo": "vite" + }, + "dependencies": { + "@muyajs/core": "workspace:*", + "intl-segmenter-polyfill": "^0.4.4" + } +} diff --git a/examples/src/main.ts b/examples/src/main.ts index a1fa0f1..91f116d 100644 --- a/examples/src/main.ts +++ b/examples/src/main.ts @@ -72,6 +72,7 @@ const allBtn: HTMLButtonElement = document.querySelector('#all')!; const setContentBtn: HTMLButtonElement = document.querySelector('#set-content')!; const selectAllBtn: HTMLButtonElement = document.querySelector('#select-all')!; +const destroyBtn: HTMLButtonElement = document.querySelector('#destroy')!; const muya = new Muya(container, { markdown: DEFAULT_MARKDOWN, @@ -115,6 +116,10 @@ selectAllBtn.addEventListener('click', () => { muya.selectAll(); }); +destroyBtn.addEventListener('click', () => { + muya.destroy(); +}); + const content = [ { name: 'paragraph', diff --git a/packages/core/src/muya.ts b/packages/core/src/muya.ts index b5c21b9..200f3a0 100644 --- a/packages/core/src/muya.ts +++ b/packages/core/src/muya.ts @@ -142,8 +142,14 @@ export class Muya { this.domNode.remove(); // Hide all float tools. - if (this.ui) + if (this.ui) { this.ui.hideAllFloatTools(); + this.ui.destroy(); + } + + for (const plugin of Object.values(this._uiPlugins)) { + plugin?.destroy?.(); + } } } diff --git a/packages/core/src/ui/imageResizeBar/index.ts b/packages/core/src/ui/imageResizeBar/index.ts index c17d6d6..753684d 100644 --- a/packages/core/src/ui/imageResizeBar/index.ts +++ b/packages/core/src/ui/imageResizeBar/index.ts @@ -50,7 +50,8 @@ export class ImageResizeBar { if ( !this.resizing && this.status - && Math.abs((event.target as HTMLElement).scrollTop - this.lastScrollTop) > 50 + && Math.abs((event.target as HTMLElement).scrollTop - this.lastScrollTop) + > 50 ) { this.hide(); } @@ -181,8 +182,7 @@ export class ImageResizeBar { event.preventDefault(); const { eventCenter } = this.muya; if (this.eventId.length) { - for (const id of this.eventId) - eventCenter.detachDOMEvent(id); + for (const id of this.eventId) eventCenter.detachDOMEvent(id); this.eventId = []; } @@ -204,4 +204,9 @@ export class ImageResizeBar { this.status = false; eventCenter.emit('muya-float', this, false); } + + destroy() { + if (this.container) + this.container?.remove(); + } } diff --git a/packages/core/src/ui/ui.ts b/packages/core/src/ui/ui.ts index ba8912f..31467be 100644 --- a/packages/core/src/ui/ui.ts +++ b/packages/core/src/ui/ui.ts @@ -27,4 +27,12 @@ export class Ui { for (const btn of this.shownButton) btn.hide(); } + + destroy() { + for (const tool of this.shownFloat) + tool.destroy(); + + for (const btn of this.shownButton) + btn.destroy(); + } }