phecda-vue 3.0.0-beta.19 → 3.0.0-beta.21

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as vue from 'vue';
-import { Ref, App, UnwrapNestedRefs } from 'vue';
+import { Ref, App, UnwrapNestedRefs, WatchOptions } from 'vue';
 import { Construct, Events } from 'phecda-web';
 export * from 'phecda-web';
 
@@ -62,5 +62,6 @@ declare function useEvent<Key extends keyof Events>(eventName: Key, cb: (event:
 declare function initialize<M extends Construct>(model: M, deleteOtherProperty?: boolean): InstanceType<M> | void;
 
 declare function Shallow(model: any): void;
+declare function WatchEffect(option?: WatchOptions): (proto: any, key: string) => void;
 
-export { DeepPartial, RE, Raw, RawSymbol, ReplaceInstanceValues, SchemaToObj, Shallow, createFilter, createPhecda, createSharedReactive, initialize, isObject, markRaw, mergeReactiveObjects, phecdaSymbol, useEvent, useO, usePatch, useR, useRaw, useV };
+export { DeepPartial, RE, Raw, RawSymbol, ReplaceInstanceValues, SchemaToObj, Shallow, WatchEffect, createFilter, createPhecda, createSharedReactive, initialize, isObject, markRaw, mergeReactiveObjects, phecdaSymbol, useEvent, useO, usePatch, useR, useRaw, useV };

package/dist/index.js

@@ -24,6 +24,7 @@ var src_exports = {};
 __export(src_exports, {
   RE: () => RE,
   Shallow: () => Shallow,
+  WatchEffect: () => WatchEffect,
   createFilter: () => createFilter,
   createPhecda: () => createPhecda,
   createSharedReactive: () => createSharedReactive,
@@ -222,21 +223,31 @@ __name(createSharedReactive, "createSharedReactive");
 
 // src/composable.ts
 var REF_SYMBOL = Symbol("ref");
+function initInstance(model) {
+  const proxyFn = (0, import_phecda_web2.get)(model.prototype, "shallow") ? import_vue4.shallowReactive : import_vue4.reactive;
+  const instance = proxyFn(new model());
+  instance._promise = (0, import_phecda_web2.invokeHandler)("init", instance);
+  return instance;
+}
+__name(initInstance, "initInstance");
 function useO(model) {
   const { state, origin } = (0, import_phecda_web2.getActiveInstance)();
-  const proxyFn = (0, import_phecda_web2.get)(model.prototype, "shallow") ? import_vue4.shallowReactive : import_vue4.reactive;
-  if ((0, import_phecda_web2.get)(model.prototype, "isolate")) {
-    const instance = proxyFn(new model());
-    instance._promise = (0, import_phecda_web2.invokeHandler)("init", instance);
-    return instance;
-  }
+  if ((0, import_phecda_web2.get)(model.prototype, "isolate"))
+    return initInstance(model);
   const tag = (0, import_phecda_web2.getTag)(model);
-  if (!(tag in state)) {
-    const instance = proxyFn(new model());
-    instance._promise = (0, import_phecda_web2.invokeHandler)("init", instance);
-    state[tag] = instance;
-    origin.set(instance, model);
+  if (tag in state) {
+    if (process.env.NODE_ENV === "development") {
+      if (origin.get(state[tag]) === model)
+        return state[tag];
+    } else {
+      if (origin.get(state[tag]) !== model)
+        console.warn(`Synonym model: Module taged "${String(tag)}" has been loaded before, so won't load Module "${model.name}"`);
+      return state[tag];
+    }
   }
+  const instance = initInstance(model);
+  state[tag] = instance;
+  origin.set(instance, model);
   return state[tag];
 }
 __name(useO, "useO");
@@ -312,14 +323,33 @@ __name(initialize, "initialize");
 
 // src/decorator.ts
 var import_phecda_web3 = require("phecda-web");
+var import_vue5 = require("vue");
 function Shallow(model) {
   (0, import_phecda_web3.set)(model.prototype, "shallow", true);
 }
 __name(Shallow, "Shallow");
+function WatchEffect(option) {
+  return (proto, key) => {
+    (0, import_phecda_web3.setStateKey)(proto, key);
+    let stopHandler;
+    (0, import_phecda_web3.setHandler)(proto, key, {
+      init(instance) {
+        if (typeof instance[key] !== "function")
+          throw new TypeError(" WatchEffect must decorate function");
+        stopHandler = (0, import_vue5.watchEffect)(instance[key].bind(instance), option);
+      },
+      unmount() {
+        return stopHandler?.();
+      }
+    });
+  };
+}
+__name(WatchEffect, "WatchEffect");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   RE,
   Shallow,
+  WatchEffect,
   createFilter,
   createPhecda,
   createSharedReactive,

package/dist/index.mjs

@@ -182,21 +182,31 @@ __name(createSharedReactive, "createSharedReactive");
 
 // src/composable.ts
 var REF_SYMBOL = Symbol("ref");
+function initInstance(model) {
+  const proxyFn = get(model.prototype, "shallow") ? shallowReactive : reactive;
+  const instance = proxyFn(new model());
+  instance._promise = invokeHandler2("init", instance);
+  return instance;
+}
+__name(initInstance, "initInstance");
 function useO(model) {
   const { state, origin } = getActiveInstance2();
-  const proxyFn = get(model.prototype, "shallow") ? shallowReactive : reactive;
-  if (get(model.prototype, "isolate")) {
-    const instance = proxyFn(new model());
-    instance._promise = invokeHandler2("init", instance);
-    return instance;
-  }
+  if (get(model.prototype, "isolate"))
+    return initInstance(model);
   const tag = getTag(model);
-  if (!(tag in state)) {
-    const instance = proxyFn(new model());
-    instance._promise = invokeHandler2("init", instance);
-    state[tag] = instance;
-    origin.set(instance, model);
+  if (tag in state) {
+    if (process.env.NODE_ENV === "development") {
+      if (origin.get(state[tag]) === model)
+        return state[tag];
+    } else {
+      if (origin.get(state[tag]) !== model)
+        console.warn(`Synonym model: Module taged "${String(tag)}" has been loaded before, so won't load Module "${model.name}"`);
+      return state[tag];
+    }
   }
+  const instance = initInstance(model);
+  state[tag] = instance;
+  origin.set(instance, model);
   return state[tag];
 }
 __name(useO, "useO");
@@ -271,14 +281,33 @@ function initialize(model, deleteOtherProperty = true) {
 __name(initialize, "initialize");
 
 // src/decorator.ts
-import { set } from "phecda-web";
+import { set, setHandler, setStateKey } from "phecda-web";
+import { watchEffect } from "vue";
 function Shallow(model) {
   set(model.prototype, "shallow", true);
 }
 __name(Shallow, "Shallow");
+function WatchEffect(option) {
+  return (proto, key) => {
+    setStateKey(proto, key);
+    let stopHandler;
+    setHandler(proto, key, {
+      init(instance) {
+        if (typeof instance[key] !== "function")
+          throw new TypeError(" WatchEffect must decorate function");
+        stopHandler = watchEffect(instance[key].bind(instance), option);
+      },
+      unmount() {
+        return stopHandler?.();
+      }
+    });
+  };
+}
+__name(WatchEffect, "WatchEffect");
 export {
   RE,
   Shallow,
+  WatchEffect,
   createFilter,
   createPhecda,
   createSharedReactive,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "phecda-vue",
-  "version": "3.0.0-beta.19",
+  "version": "3.0.0-beta.21",
   "description": "provide phecda function to vue",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -13,7 +13,7 @@
   "license": "MIT",
   "dependencies": {
     "vue": "^3.2.45",
-    "phecda-web": "1.0.1-beta.12"
+    "phecda-web": "1.0.1-beta.13"
   },
   "devDependencies": {
     "tsup": "^6.5.0"