feat: present el as HTMLDivElement

Author: SSShooter

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mind-elixir",
-  "version": "0.19.7",
+  "version": "0.19.8",
   "description": "Mind elixir is a free open source mind map core.",
   "main": "dist/MindElixir.js",
   "scripts": {

src/dev.ts

@@ -15,7 +15,7 @@ interface Window {
 
 declare let window: Window
 
-const mind = new MindElixir({
+const options = {
   el: '#map',
   newTopicName: '子节点',
   direction: MindElixir.SIDE,
@@ -59,16 +59,18 @@ const mind = new MindElixir({
   primaryLinkStyle: 1,
   primaryNodeVerticalGap: 15, // 25
   primaryNodeHorizontalGap: 15, // 65
-})
+}
+
+const mind = new (MindElixir as any)(options)
 mind.init()
 function sleep() {
   return new Promise<void>((res, rej) => {
     setTimeout(() => res(), 1000)
   })
 }
 console.log('test E function', E('bd4313fbac40284b'))
-const mind2 = new MindElixirLite({
-  el: '#map2',
+const mind2 = new (MindElixirLite as any)({
+  el: document.querySelector('#map2'),
   direction: 2,
   data: example2,
   draggable: false,

src/index.lite.ts

@@ -111,7 +111,7 @@ export interface MindElixirInstance {
 
 }
 export interface Options {
-  el: string,
+  el: string | Element,
   data: MindElixirData,
   direction?: number,
   locale?: string,
@@ -147,8 +147,14 @@ function MindElixir(this: MindElixirInstance, {
   primaryNodeVerticalGap,
   mobileMenu,
 }: Options) {
-  const box = document.querySelector(el) as HTMLElement
-  if (!box) return
+  let box
+  const elType = Object.prototype.toString.call(el)
+  if (elType === '[object HTMLDivElement]') {
+    box = el as HTMLElement
+  } else if (elType === '[object String]') {
+    box = document.querySelector(el as string) as HTMLElement
+  }
+  if (!box) return new Error('MindElixir: el is not a valid element')
   this.mindElixirBox = box
   this.nodeData = data.nodeData
   this.linkData = data.linkData || {}

src/index.ts

@@ -153,7 +153,7 @@ export interface MindElixirInstance {
   mobileMenu: boolean,
 }
 export interface Options {
-  el: string,
+  el: string | Element,
   data: MindElixirData,
   direction?: number,
   locale?: string,
@@ -212,8 +212,14 @@ function MindElixir(this: MindElixirInstance, {
   primaryNodeVerticalGap,
   mobileMenu,
 }: Options) {
-  const box = document.querySelector(el) as HTMLElement
-  if (!box) return
+  let box
+  const elType = Object.prototype.toString.call(el)
+  if (elType === '[object HTMLDivElement]') {
+    box = el as HTMLElement
+  } else if (elType === '[object String]') {
+    box = document.querySelector(el as string) as HTMLElement
+  }
+  if (!box) return new Error('MindElixir: el is not a valid element')
   this.mindElixirBox = box
   this.before = before || {}
   this.nodeData = data.nodeData