@razaman2/reactive-view 0.0.10 → 0.0.12

package/dist/index.js

@@ -162,7 +162,7 @@ var import_vue = require("vue");
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.10";
+var version = "0.0.12";
 
 // src/ReactiveView.ts
 var props = {
@@ -218,7 +218,6 @@ var ReactiveView_default = {
       return (_c2 = (_b2 = (_a2 = context.slots).template) == null ? void 0 : _b2.call(_a2, { $vue: vue, vnode })) != null ? _c2 : vnode;
     };
     const isValid = (0, import_vue.ref)(false);
-    const isRendered = (0, import_vue.ref)(false);
     const defaultData = props2.getDefaultData(
       Array.isArray(props2.state) ? (_a = props2.defaultData) != null ? _a : [] : (_b = props2.defaultData) != null ? _b : {}
     );
@@ -234,6 +233,7 @@ var ReactiveView_default = {
     };
     const getState = props2.model ? typeof props2.model === "function" ? props2.model(config) : props2.model : new import_data_manager.default(config);
     const sync = (0, import_vue.ref)(false);
+    const rendered = (0, import_vue.ref)(false);
     const options = {
       parent: { self: (0, import_vue.getCurrentInstance)().proxy },
       self: { template, isValid, getState }
@@ -247,8 +247,10 @@ var ReactiveView_default = {
     if (props2.defer instanceof Promise) {
       (0, import_vue.nextTick)(async () => {
         var _a2;
-        isRendered.value = (_a2 = await props2.defer) != null ? _a2 : true;
+        rendered.value = (_a2 = await props2.defer) != null ? _a2 : true;
       });
+    } else {
+      rendered.value = true;
     }
     if (context.attrs["onUpdate:modelState"]) {
       const config2 = typeof context.attrs["onUpdate:modelState"] === "function" ? { callback: context.attrs["onUpdate:modelState"] } : context.attrs["onUpdate:modelState"];
@@ -268,7 +270,7 @@ var ReactiveView_default = {
     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 : {};
       (0, import_vue.onMounted)(() => {
-        (0, import_vue.watch)(() => props2.state, (after, before) => {
+        (0, import_vue.watch)(() => import_object_manager.default.on(props2.state).clone(), (after, before) => {
           if (props2.sync && typeof config2.callback !== "function") {
             getState.replaceData(after);
           } else if (typeof config2.callback === "function") {
@@ -290,7 +292,7 @@ var ReactiveView_default = {
         setup2.options = setup2.options.parent;
         setup2.$vue = setup2.$vue.$parent;
       }
-      if (isRendered.value) {
+      if (rendered.value) {
         return access($vue).template($vue, { parent, self });
       }
     };

package/dist/index.mjs

@@ -125,7 +125,7 @@ import { h, ref, reactive, watch, nextTick, getCurrentInstance, onMounted } from
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.10";
+var version = "0.0.12";
 
 // src/ReactiveView.ts
 var props = {
@@ -181,7 +181,6 @@ var ReactiveView_default = {
       return (_c2 = (_b2 = (_a2 = context.slots).template) == null ? void 0 : _b2.call(_a2, { $vue: vue, vnode })) != null ? _c2 : vnode;
     };
     const isValid = ref(false);
-    const isRendered = ref(false);
     const defaultData = props2.getDefaultData(
       Array.isArray(props2.state) ? (_a = props2.defaultData) != null ? _a : [] : (_b = props2.defaultData) != null ? _b : {}
     );
@@ -197,6 +196,7 @@ var ReactiveView_default = {
     };
     const getState = props2.model ? typeof props2.model === "function" ? props2.model(config) : props2.model : new DataManager(config);
     const sync = ref(false);
+    const rendered = ref(false);
     const options = {
       parent: { self: getCurrentInstance().proxy },
       self: { template, isValid, getState }
@@ -210,8 +210,10 @@ var ReactiveView_default = {
     if (props2.defer instanceof Promise) {
       nextTick(async () => {
         var _a2;
-        isRendered.value = (_a2 = await props2.defer) != null ? _a2 : true;
+        rendered.value = (_a2 = await props2.defer) != null ? _a2 : true;
       });
+    } else {
+      rendered.value = true;
     }
     if (context.attrs["onUpdate:modelState"]) {
       const config2 = typeof context.attrs["onUpdate:modelState"] === "function" ? { callback: context.attrs["onUpdate:modelState"] } : context.attrs["onUpdate:modelState"];
@@ -231,7 +233,7 @@ var ReactiveView_default = {
     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 : {};
       onMounted(() => {
-        watch(() => props2.state, (after, before) => {
+        watch(() => ObjectManager.on(props2.state).clone(), (after, before) => {
           if (props2.sync && typeof config2.callback !== "function") {
             getState.replaceData(after);
           } else if (typeof config2.callback === "function") {
@@ -253,7 +255,7 @@ var ReactiveView_default = {
         setup2.options = setup2.options.parent;
         setup2.$vue = setup2.$vue.$parent;
       }
-      if (isRendered.value) {
+      if (rendered.value) {
         return access($vue).template($vue, { parent, self });
       }
     };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@razaman2/reactive-view",
-    "version": "0.0.10",
+    "version": "0.0.12",
     "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",