@razaman2/reactive-view 0.0.3 → 0.0.5

package/dist/index.d.mts

@@ -63,6 +63,10 @@ declare const _default$1: {
                 subscription: Subscription;
             };
         };
+        sync: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
         setup: {
             type: FunctionConstructor;
             default: (param1?: {}, param2?: {}) => {};

package/dist/index.d.ts

@@ -63,6 +63,10 @@ declare const _default$1: {
                 subscription: Subscription;
             };
         };
+        sync: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
         setup: {
             type: FunctionConstructor;
             default: (param1?: {}, param2?: {}) => {};

package/dist/index.js

@@ -191,10 +191,9 @@ var import_vue = require("vue");
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.3";
+var version = "0.0.5";
 
 // src/ReactiveView.ts
-var import_uuid = require("uuid");
 var props = {
   defaultData: {},
   getDefaultData: {
@@ -217,6 +216,10 @@ var props = {
   subscriptions: {
     type: Object,
     default: getSubscription()
+  },
+  sync: {
+    type: Boolean,
+    default: true
   }
 };
 var setup = {
@@ -230,7 +233,7 @@ var setup = {
 var ReactiveView_default = {
   props: __spreadValues(__spreadValues({}, setup), props),
   setup(props2, context) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _f;
     const template = (vue, options2) => {
       var _a2, _b2, _c2;
       const vnode = context.slots.default ? (0, import_vue.h)(
@@ -265,13 +268,9 @@ var ReactiveView_default = {
     };
     const setup2 = (_d = props2.setup(options)) != null ? _d : options;
     const _e = setup2, { parent = {}, self = {} } = _e, rest = __objRest(_e, ["parent", "self"]);
-    let sync = false;
+    const sync = (0, import_vue.ref)(false);
     if (context.attrs["onUpdate:modelState"]) {
       const config2 = typeof context.attrs["onUpdate:modelState"] === "function" ? { callback: context.attrs["onUpdate:modelState"] } : context.attrs["onUpdate:modelState"];
-      const subscriptionName = `
-${props2.modelName}
-onUpdate:modelState
-${(0, import_uuid.v4)()}`;
       const subscription = (0, import_vue.watch)(() => import_object_manager.default.on(stateRef.value).clone(), (after, before) => {
         var _a2;
         const transform = (_a2 = config2.transform) != null ? _a2 : access(setup2).$transform;
@@ -279,22 +278,22 @@ ${(0, import_uuid.v4)()}`;
           before: (before == null ? void 0 : before.hasOwnProperty("")) ? before[""] : before,
           after: (after == null ? void 0 : after.hasOwnProperty("")) ? after[""] : after
         };
-        if (sync) {
-          sync = false;
+        if (sync.value) {
+          sync.value = false;
         } else {
           config2.callback(transform ? transform(diff) : diff, getState);
         }
       }, config2.options);
     }
-    if (context.attrs["onUpdate:propsState"]) {
-      const config2 = typeof context.attrs["onUpdate:propsState"] === "function" ? { callback: context.attrs["onUpdate:propsState"] } : context.attrs["onUpdate:propsState"];
-      const subscriptionName = `
-${props2.modelName}
-onUpdate:propsState
-${(0, import_uuid.v4)()}`;
+    if (context.attrs["onUpdate:propsState"] || props2.sync) {
+      const config2 = (_f = typeof context.attrs["onUpdate:propsState"] === "function" ? { callback: context.attrs["onUpdate:propsState"] } : context.attrs["onUpdate:propsState"]) != null ? _f : {};
       const subscription = (0, import_vue.watch)(() => props2.state, (after, before) => {
-        config2.callback({ before, after }, getState);
-        sync = true;
+        if (props2.sync && typeof config2.callback !== "function") {
+          getState.replaceData(after);
+        } else if (typeof config2.callback === "function") {
+          config2.callback({ before, after }, getState);
+        }
+        sync.value = true;
       }, config2.options);
     }
     return ($vue) => {

package/dist/index.mjs

@@ -148,10 +148,9 @@ import { h, ref, watch } from "vue";
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.3";
+var version = "0.0.5";
 
 // src/ReactiveView.ts
-import { v4 as uuid } from "uuid";
 var props = {
   defaultData: {},
   getDefaultData: {
@@ -174,6 +173,10 @@ var props = {
   subscriptions: {
     type: Object,
     default: getSubscription()
+  },
+  sync: {
+    type: Boolean,
+    default: true
   }
 };
 var setup = {
@@ -187,7 +190,7 @@ var setup = {
 var ReactiveView_default = {
   props: __spreadValues(__spreadValues({}, setup), props),
   setup(props2, context) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _f;
     const template = (vue, options2) => {
       var _a2, _b2, _c2;
       const vnode = context.slots.default ? h(
@@ -222,13 +225,9 @@ var ReactiveView_default = {
     };
     const setup2 = (_d = props2.setup(options)) != null ? _d : options;
     const _e = setup2, { parent = {}, self = {} } = _e, rest = __objRest(_e, ["parent", "self"]);
-    let sync = false;
+    const sync = ref(false);
     if (context.attrs["onUpdate:modelState"]) {
       const config2 = typeof context.attrs["onUpdate:modelState"] === "function" ? { callback: context.attrs["onUpdate:modelState"] } : context.attrs["onUpdate:modelState"];
-      const subscriptionName = `
-${props2.modelName}
-onUpdate:modelState
-${uuid()}`;
       const subscription = watch(() => ObjectManager.on(stateRef.value).clone(), (after, before) => {
         var _a2;
         const transform = (_a2 = config2.transform) != null ? _a2 : access(setup2).$transform;
@@ -236,22 +235,22 @@ ${uuid()}`;
           before: (before == null ? void 0 : before.hasOwnProperty("")) ? before[""] : before,
           after: (after == null ? void 0 : after.hasOwnProperty("")) ? after[""] : after
         };
-        if (sync) {
-          sync = false;
+        if (sync.value) {
+          sync.value = false;
         } else {
           config2.callback(transform ? transform(diff) : diff, getState);
         }
       }, config2.options);
     }
-    if (context.attrs["onUpdate:propsState"]) {
-      const config2 = typeof context.attrs["onUpdate:propsState"] === "function" ? { callback: context.attrs["onUpdate:propsState"] } : context.attrs["onUpdate:propsState"];
-      const subscriptionName = `
-${props2.modelName}
-onUpdate:propsState
-${uuid()}`;
+    if (context.attrs["onUpdate:propsState"] || props2.sync) {
+      const config2 = (_f = typeof context.attrs["onUpdate:propsState"] === "function" ? { callback: context.attrs["onUpdate:propsState"] } : context.attrs["onUpdate:propsState"]) != null ? _f : {};
       const subscription = watch(() => props2.state, (after, before) => {
-        config2.callback({ before, after }, getState);
-        sync = true;
+        if (props2.sync && typeof config2.callback !== "function") {
+          getState.replaceData(after);
+        } else if (typeof config2.callback === "function") {
+          config2.callback({ before, after }, getState);
+        }
+        sync.value = true;
       }, config2.options);
     }
     return ($vue) => {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@razaman2/reactive-view",
-    "version": "0.0.3",
+    "version": "0.0.5",
     "description": "This library enables you to build vue apps in an object oriented way. It provides a convenient approach to extend and override ui components. It provides a built in eventing system along with component data management.",
     "main": "dist/index.js",
     "module": "dist/index.mjs",