@razaman2/reactive-view 0.0.34-beta.20 → 0.0.34-beta.22

package/dist/index.d.mts

@@ -121,7 +121,9 @@ declare function useSubscription(): {
 declare function StyleParser(styles?: Array<string> | Record<string, boolean> | string): {};
 declare function MergeStyles(...params: any): any;
 declare const extendVnode: (component: Record<string, any>, element: any) => Record<string, (props?: Record<string, any>, slots?: Record<string, any> | ((slots: Record<string, any>) => Record<string, any>)) => any>;
-declare function defineReactiveView(options: Record<string, any>, component: typeof _default, _options: Record<string, any>): ReturnType<typeof defineComponent>;
+declare function defineReactiveView(): ReturnType<typeof defineComponent>;
+declare function defineReactiveView(options: Record<string, any>): ReturnType<typeof defineComponent>;
+declare function defineReactiveView(options: Record<string, any>, component: typeof _default): ReturnType<typeof defineComponent>;
 declare function showComponent(component: any, options?: {
     container?: string;
     key?: string;

package/dist/index.d.ts

@@ -121,7 +121,9 @@ declare function useSubscription(): {
 declare function StyleParser(styles?: Array<string> | Record<string, boolean> | string): {};
 declare function MergeStyles(...params: any): any;
 declare const extendVnode: (component: Record<string, any>, element: any) => Record<string, (props?: Record<string, any>, slots?: Record<string, any> | ((slots: Record<string, any>) => Record<string, any>)) => any>;
-declare function defineReactiveView(options: Record<string, any>, component: typeof _default, _options: Record<string, any>): ReturnType<typeof defineComponent>;
+declare function defineReactiveView(): ReturnType<typeof defineComponent>;
+declare function defineReactiveView(options: Record<string, any>): ReturnType<typeof defineComponent>;
+declare function defineReactiveView(options: Record<string, any>, component: typeof _default): ReturnType<typeof defineComponent>;
 declare function showComponent(component: any, options?: {
     container?: string;
     key?: string;

package/dist/index.js

@@ -174,7 +174,7 @@ var import_vue = require("vue");
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.34-beta.20";
+var version = "0.0.34-beta.22";
 
 // src/ReactiveView.ts
 var setup = {
@@ -218,7 +218,7 @@ var ReactiveView_default = {
     state: { default: () => (0, import_vue.reactive)({}) }
   },
   setup(props, context) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+    var _a, _b, _c, _d, _e, _f, _g;
     const diff = (before, after) => {
       const change = after.paths().reduce((change2, path) => {
         if (before.get(path) !== after.get(path)) {
@@ -255,12 +255,11 @@ var ReactiveView_default = {
       console.error("[ReactiveView]: defaultData is required for promise or async function data.");
     }
     const defaultData = props.getDefaultData(
-      ((_d = vue.vnode.props) == null ? void 0 : _d.hasOwnProperty("defaultData")) ? vue.vnode.props.defaultData : ((_e = vue.vnode.props) == null ? void 0 : _e.hasOwnProperty("data")) ? Array.isArray(vue.vnode.props.data) ? [] : {} : {}
+      "defaultData" in vue.vnode.props ? vue.vnode.props.defaultData : "data" in vue.vnode.props ? Array.isArray(vue.vnode.props.data) ? [] : {} : {}
     );
     const datatype = Array.isArray(defaultData) ? [] : {};
     const normalize = (data) => {
-      var _a2, _b2, _c2;
-      console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, data, defaultData);
+      console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData });
       if ((0, import_vue.isReactive)(data)) {
         return data;
       } else if ((0, import_vue.isRef)(data)) {
@@ -275,22 +274,23 @@ var ReactiveView_default = {
         }
       } else {
         if (isFunctionData || isPromiseData) {
+          return (0, import_vue.reactive)(datatype);
         } else {
           try {
             if (["Array", "Object"].includes(data.constructor.name)) {
-              return (0, import_vue.reactive)(((_a2 = vue.vnode.props) == null ? void 0 : _a2.hasOwnProperty("data")) ? data : defaultData);
+              return (0, import_vue.reactive)("data" in vue.vnode.props ? data : defaultData);
             } else {
-              return (0, import_vue.reactive)({ "": ((_b2 = vue.vnode.props) == null ? void 0 : _b2.hasOwnProperty("data")) ? data : defaultData });
+              return (0, import_vue.reactive)("data" in vue.vnode.props ? { "": data } : defaultData);
             }
           } catch (e) {
-            return (0, import_vue.reactive)({ "": ((_c2 = vue.vnode.props) == null ? void 0 : _c2.hasOwnProperty("data")) ? data : defaultData });
+            return (0, import_vue.reactive)("data" in vue.vnode.props ? { "": data } : defaultData);
           }
         }
       }
     };
     const config = {
-      data: props.beta ? normalize((_f = vue.vnode.props) == null ? void 0 : _f.data) : (0, import_vue.reactive)(import_object_manager.default.on(
-        isPromiseData || isFunctionData || (0, import_vue.isRef)(props.data) || (0, import_vue.isReactive)(props.data) ? datatype : ((_g = vue.vnode.props) == null ? void 0 : _g.hasOwnProperty("data")) ? props.data : datatype
+      data: props.beta ? normalize((_d = vue.vnode.props) == null ? void 0 : _d.data) : (0, import_vue.reactive)(import_object_manager.default.on(
+        isPromiseData || isFunctionData || (0, import_vue.isRef)(props.data) || (0, import_vue.isReactive)(props.data) ? datatype : "data" in vue.vnode.props ? props.data : datatype
       ).clone()),
       defaultData: import_object_manager.default.on(defaultData).clone(),
       notifications: props.notifications,
@@ -348,9 +348,9 @@ var ReactiveView_default = {
       const config2 = typeof context.attrs["onUpdate:model"] === "function" ? {
         callback: context.attrs["onUpdate:model"],
         options: Object.assign(__spreadValues(__spreadValues({
-          deep: (_h = context.attrs["model:deep"]) != null ? _h : true
-        }, context.attrs["model:immediate"] ? { immediate: context.attrs["model:immediate"] } : {}), context.attrs["model:once"] ? { once: context.attrs["model:once"] } : {}), ((_i = context.attrs["onUpdate:model"]) != null ? _i : {}).options)
-      } : (_j = context.attrs["onUpdate:model"]) != null ? _j : {};
+          deep: (_e = context.attrs["model:deep"]) != null ? _e : true
+        }, context.attrs["model:immediate"] ? { immediate: context.attrs["model:immediate"] } : {}), context.attrs["model:once"] ? { once: context.attrs["model:once"] } : {}), ((_f = context.attrs["onUpdate:model"]) != null ? _f : {}).options)
+      } : (_g = context.attrs["onUpdate:model"]) != null ? _g : {};
       if (context.attrs["model:log"]) {
         console.log(`[ReactiveView]:model`, { config: config2 });
       }
@@ -364,6 +364,12 @@ var ReactiveView_default = {
         const [data] = await Promise.all([isAsyncFunctionData ? props.data() : props.data, (_a2 = defer.value) != null ? _a2 : true]);
         watchDataProp(data);
       });
+    } else if (props.beta && (isFunctionData || isPromiseData)) {
+      setTimeout(async () => {
+        var _a2;
+        const [data] = await Promise.all([isFunctionData || isAsyncFunctionData ? props.data() : props.data, (_a2 = defer.value) != null ? _a2 : true]);
+        model.replaceData((0, import_vue.toRaw)((0, import_vue.unref)(data)));
+      });
     }
     setTimeout(async () => {
       var _a2;
@@ -603,14 +609,18 @@ var extendVnode = (component, element) => {
 function defineReactiveView(param1, param2) {
   console.log(`log params:`, { param1, param2 });
   return (0, import_vue2.defineComponent)({
-    props: __spreadValues({ setup }, param1.props),
+    name: param1 == null ? void 0 : param1.modelName,
+    props: __spreadValues({ setup }, param1 ? param1.props : {}),
     setup() {
-      const _a = param1, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
+      const _a = param1 != null ? param1 : {}, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
       return (component) => {
-        return (0, import_vue2.createVNode)(param2 != null ? param2 : ReactiveView_default, Object.assign({}, rest, setup2 ? {
+        const props2 = Object.entries(rest).reduce((props3, [key, val]) => {
+          return Object.assign(props3, { [key]: typeof val === "function" ? val(component) : val });
+        }, {});
+        const slots = typeof (param1 == null ? void 0 : param1.slots) === "function" ? param1.slots(component) : Array.isArray(param1 == null ? void 0 : param1.slots) ? () => param1.slots : param1 == null ? void 0 : param1.slots;
+        return (0, import_vue2.createVNode)(param2 != null ? param2 : ReactiveView_default, __spreadValues(__spreadValues({}, props2), Object.assign({}, props2, typeof setup2 === "function" ? {
           setup: (self, parent) => setup2(self, parent, component)
-          // @ts-ignore
-        } : {}), typeof param1.slots === "function" ? param1.slots(component) : param1.slots);
+        } : {})), slots);
       };
     }
   });

package/dist/index.mjs

@@ -124,11 +124,11 @@ var Subscriptions = _Subscriptions;
 // src/ReactiveView.ts
 import ObjectManager from "@razaman2/object-manager";
 import DataManager from "@razaman2/data-manager";
-import { ref, reactive, watch, unref, isRef, isReactive, createVNode, getCurrentInstance } from "vue";
+import { ref, reactive, watch, unref, toRaw, isRef, isReactive, createVNode, getCurrentInstance } from "vue";
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.34-beta.20";
+var version = "0.0.34-beta.22";
 
 // src/ReactiveView.ts
 var setup = {
@@ -172,7 +172,7 @@ var ReactiveView_default = {
     state: { default: () => reactive({}) }
   },
   setup(props, context) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+    var _a, _b, _c, _d, _e, _f, _g;
     const diff = (before, after) => {
       const change = after.paths().reduce((change2, path) => {
         if (before.get(path) !== after.get(path)) {
@@ -209,12 +209,11 @@ var ReactiveView_default = {
       console.error("[ReactiveView]: defaultData is required for promise or async function data.");
     }
     const defaultData = props.getDefaultData(
-      ((_d = vue.vnode.props) == null ? void 0 : _d.hasOwnProperty("defaultData")) ? vue.vnode.props.defaultData : ((_e = vue.vnode.props) == null ? void 0 : _e.hasOwnProperty("data")) ? Array.isArray(vue.vnode.props.data) ? [] : {} : {}
+      "defaultData" in vue.vnode.props ? vue.vnode.props.defaultData : "data" in vue.vnode.props ? Array.isArray(vue.vnode.props.data) ? [] : {} : {}
     );
     const datatype = Array.isArray(defaultData) ? [] : {};
     const normalize = (data) => {
-      var _a2, _b2, _c2;
-      console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, data, defaultData);
+      console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData });
       if (isReactive(data)) {
         return data;
       } else if (isRef(data)) {
@@ -229,22 +228,23 @@ var ReactiveView_default = {
         }
       } else {
         if (isFunctionData || isPromiseData) {
+          return reactive(datatype);
         } else {
           try {
             if (["Array", "Object"].includes(data.constructor.name)) {
-              return reactive(((_a2 = vue.vnode.props) == null ? void 0 : _a2.hasOwnProperty("data")) ? data : defaultData);
+              return reactive("data" in vue.vnode.props ? data : defaultData);
             } else {
-              return reactive({ "": ((_b2 = vue.vnode.props) == null ? void 0 : _b2.hasOwnProperty("data")) ? data : defaultData });
+              return reactive("data" in vue.vnode.props ? { "": data } : defaultData);
             }
           } catch (e) {
-            return reactive({ "": ((_c2 = vue.vnode.props) == null ? void 0 : _c2.hasOwnProperty("data")) ? data : defaultData });
+            return reactive("data" in vue.vnode.props ? { "": data } : defaultData);
           }
         }
       }
     };
     const config = {
-      data: props.beta ? normalize((_f = vue.vnode.props) == null ? void 0 : _f.data) : reactive(ObjectManager.on(
-        isPromiseData || isFunctionData || isRef(props.data) || isReactive(props.data) ? datatype : ((_g = vue.vnode.props) == null ? void 0 : _g.hasOwnProperty("data")) ? props.data : datatype
+      data: props.beta ? normalize((_d = vue.vnode.props) == null ? void 0 : _d.data) : reactive(ObjectManager.on(
+        isPromiseData || isFunctionData || isRef(props.data) || isReactive(props.data) ? datatype : "data" in vue.vnode.props ? props.data : datatype
       ).clone()),
       defaultData: ObjectManager.on(defaultData).clone(),
       notifications: props.notifications,
@@ -302,9 +302,9 @@ var ReactiveView_default = {
       const config2 = typeof context.attrs["onUpdate:model"] === "function" ? {
         callback: context.attrs["onUpdate:model"],
         options: Object.assign(__spreadValues(__spreadValues({
-          deep: (_h = context.attrs["model:deep"]) != null ? _h : true
-        }, context.attrs["model:immediate"] ? { immediate: context.attrs["model:immediate"] } : {}), context.attrs["model:once"] ? { once: context.attrs["model:once"] } : {}), ((_i = context.attrs["onUpdate:model"]) != null ? _i : {}).options)
-      } : (_j = context.attrs["onUpdate:model"]) != null ? _j : {};
+          deep: (_e = context.attrs["model:deep"]) != null ? _e : true
+        }, context.attrs["model:immediate"] ? { immediate: context.attrs["model:immediate"] } : {}), context.attrs["model:once"] ? { once: context.attrs["model:once"] } : {}), ((_f = context.attrs["onUpdate:model"]) != null ? _f : {}).options)
+      } : (_g = context.attrs["onUpdate:model"]) != null ? _g : {};
       if (context.attrs["model:log"]) {
         console.log(`[ReactiveView]:model`, { config: config2 });
       }
@@ -318,6 +318,12 @@ var ReactiveView_default = {
         const [data] = await Promise.all([isAsyncFunctionData ? props.data() : props.data, (_a2 = defer.value) != null ? _a2 : true]);
         watchDataProp(data);
       });
+    } else if (props.beta && (isFunctionData || isPromiseData)) {
+      setTimeout(async () => {
+        var _a2;
+        const [data] = await Promise.all([isFunctionData || isAsyncFunctionData ? props.data() : props.data, (_a2 = defer.value) != null ? _a2 : true]);
+        model.replaceData(toRaw(unref(data)));
+      });
     }
     setTimeout(async () => {
       var _a2;
@@ -352,7 +358,7 @@ var ReactiveView_default = {
 };
 
 // src/index.ts
-import { h, unref as unref2, toRaw, createApp, createVNode as createVNode2, defineComponent } from "vue";
+import { h, unref as unref2, toRaw as toRaw2, createApp, createVNode as createVNode2, defineComponent } from "vue";
 import { formatInTimeZone } from "date-fns-tz";
 import { twMerge } from "tailwind-merge";
 console.log(`%c[ReactiveView]: ${version}`, "background-color: red; color: yellow;");
@@ -430,7 +436,7 @@ function getDate(param1, param2) {
 }
 function access(view = {}, alternative) {
   const resolve = (target) => {
-    return new Proxy(toRaw(target), {
+    return new Proxy(toRaw2(target), {
       get(target2, key) {
         const component = { tree: target2 };
         do {
@@ -557,14 +563,18 @@ var extendVnode = (component, element) => {
 function defineReactiveView(param1, param2) {
   console.log(`log params:`, { param1, param2 });
   return defineComponent({
-    props: __spreadValues({ setup }, param1.props),
+    name: param1 == null ? void 0 : param1.modelName,
+    props: __spreadValues({ setup }, param1 ? param1.props : {}),
     setup() {
-      const _a = param1, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
+      const _a = param1 != null ? param1 : {}, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
       return (component) => {
-        return createVNode2(param2 != null ? param2 : ReactiveView_default, Object.assign({}, rest, setup2 ? {
+        const props2 = Object.entries(rest).reduce((props3, [key, val]) => {
+          return Object.assign(props3, { [key]: typeof val === "function" ? val(component) : val });
+        }, {});
+        const slots = typeof (param1 == null ? void 0 : param1.slots) === "function" ? param1.slots(component) : Array.isArray(param1 == null ? void 0 : param1.slots) ? () => param1.slots : param1 == null ? void 0 : param1.slots;
+        return createVNode2(param2 != null ? param2 : ReactiveView_default, __spreadValues(__spreadValues({}, props2), Object.assign({}, props2, typeof setup2 === "function" ? {
           setup: (self, parent) => setup2(self, parent, component)
-          // @ts-ignore
-        } : {}), typeof param1.slots === "function" ? param1.slots(component) : param1.slots);
+        } : {})), slots);
       };
     }
   });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@razaman2/reactive-view",
-    "version": "0.0.34-beta.20",
+    "version": "0.0.34-beta.22",
     "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",