@mx-sose-front/mx-sose-graph 1.0.4 → 1.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mx-sose-front/mx-sose-graph",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "A Vue3 graph visualization plugin library",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

package/src/index.ts

@@ -1,6 +1,7 @@
 import type { App, Plugin } from 'vue'
 import GraphView from './view/graph.vue'
 import ElementPlus from 'element-plus'
+import { setActivePinia, type Pinia } from 'pinia'
 // import { pinia } from './store'
 
 // 导出组件
@@ -11,17 +12,40 @@ export { useGraphStore, eventBus } from './store'
 
 // 导出类型
 export type { Shape, Bounds, Style, NameObject, TaggedValueLabel, Comparent, GraphEvents } from './types'
-
+/**
+ * 可选的安装参数：允许使用方主动把 pinia 传进来
+ */
+export interface MxSoseGraphOptions {
+  pinia?: Pinia
+}
 // 插件安装函数
-export const MxSoseGraphPlugin: Plugin<[]> = {
-  install(app: App) {
-    // 安装 Pinia
-    // app.use(pinia)
-    // 注册组件
+// 注意：这里给 Plugin 加了一个 [MxSoseGraphOptions?] 的泛型，方便 TS 类型推断
+export const MxSoseGraphPlugin: Plugin<[MxSoseGraphOptions?]> = {
+  install(app: App, options?: MxSoseGraphOptions) {
+    // 1️⃣ 尝试获取外部应用里的 pinia 实例
+    const externalPinia =
+      options?.pinia || // 优先使用显式传入的
+      (app._context.provides.pinia as Pinia | undefined) || // Vue3 内部提供的
+      (app.config.globalProperties.$pinia as Pinia | undefined) // 部分写法下可用
+
+    if (externalPinia) {
+      // 2️⃣ 用「库这份 pinia 模块」设置 activePinia
+      setActivePinia(externalPinia)
+    } else {
+      if (import.meta.env.DEV) {
+        console.warn(
+          '[mx-sose-graph] 未找到 pinia 实例，请确保：' +
+            '1）先 app.use(pinia)，2）再 app.use(MxSoseGraphPlugin, { pinia })'
+        )
+      }
+    }
+
+    // 3️⃣ 注册组件
     app.component('GraphView', GraphView)
-    // 安装 ElementPlus
+
+    // 4️⃣ 安装 ElementPlus（如果你希望由宿主项目自己安装，也可以删掉这行）
     app.use(ElementPlus)
-  }
+  },
 }
 
 // 默认导出插件