@razaman2/reactive-view 0.0.34-beta.16 → 0.0.34-beta.18

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import * as vue from 'vue';
-import { SetupContext, ComponentPublicInstance, UnwrapRef } from 'vue';
+import { SetupContext, ComponentPublicInstance, UnwrapRef, defineComponent } from 'vue';
 
 type ComponentExtension = {
     parent?: ComponentExtension;
@@ -120,8 +120,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 const getData: (component: any, path: number | string, alternative: any) => any;
 declare const setData: (component: any, data: any, path?: string) => any;
 declare const dataPath: (component: any, path: string | number) => any;
 
-export { MergeStyles, StyleParser, access, dataPath, _default as default, extendVnode, getData, getDate, getProps, getReactiveViewComponent, safeRequest, setData, setup, useSubscription };
+export { MergeStyles, StyleParser, access, dataPath, _default as default, defineReactiveView, extendVnode, getData, getDate, getProps, getReactiveViewComponent, safeRequest, setData, setup, useSubscription };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as vue from 'vue';
-import { SetupContext, ComponentPublicInstance, UnwrapRef } from 'vue';
+import { SetupContext, ComponentPublicInstance, UnwrapRef, defineComponent } from 'vue';
 
 type ComponentExtension = {
     parent?: ComponentExtension;
@@ -120,8 +120,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 const getData: (component: any, path: number | string, alternative: any) => any;
 declare const setData: (component: any, data: any, path?: string) => any;
 declare const dataPath: (component: any, path: string | number) => any;
 
-export { MergeStyles, StyleParser, access, dataPath, _default as default, extendVnode, getData, getDate, getProps, getReactiveViewComponent, safeRequest, setData, setup, useSubscription };
+export { MergeStyles, StyleParser, access, dataPath, _default as default, defineReactiveView, extendVnode, getData, getDate, getProps, getReactiveViewComponent, safeRequest, setData, setup, useSubscription };

package/dist/index.js

@@ -61,6 +61,7 @@ __export(index_exports, {
   access: () => access,
   dataPath: () => dataPath,
   default: () => index_default,
+  defineReactiveView: () => defineReactiveView,
   extendVnode: () => extendVnode,
   getData: () => getData,
   getDate: () => getDate,
@@ -172,7 +173,7 @@ var import_vue = require("vue");
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.34-beta.16";
+var version = "0.0.34-beta.18";
 
 // src/ReactiveView.ts
 var setup = {
@@ -560,14 +561,27 @@ var extendVnode = (component, element) => {
         const finalProps = Object.assign(rest, functionalProps, { class: finalClasses, style: finalStyles });
         const finalSlots = slots ? typeof slots === "function" ? slots(vnode.children) : slots : vnode.children;
         const finalElement = ["undefined"].includes(typeof element) ? vnode.type : element;
-        return (0, import_vue2.h)(finalElement, finalProps, () => finalSlots);
+        return (0, import_vue2.h)(finalElement, finalProps, finalSlots);
       };
     }
   });
 };
+function defineReactiveView(param1, param2) {
+  return (0, import_vue2.defineComponent)({
+    props: __spreadValues({ setup }, param1.props),
+    setup() {
+      const _a = param1, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
+      return (component) => {
+        return (0, import_vue2.createVNode)(param2, Object.assign({}, rest, setup2 ? {
+          setup: (self, parent) => setup2(self, parent, component)
+        } : {}));
+      };
+    }
+  });
+}
 var getData = (component, path, alternative) => {
   const vue = access(component);
-  const data = import_object_manager2.default.on((0, import_vue2.unref)(componentState(vue)));
+  const data = import_object_manager2.default.on(componentState(vue));
   if (path) {
     return data.get(dataPath(vue, path), alternative);
   } else {
@@ -577,13 +591,13 @@ var getData = (component, path, alternative) => {
 var setData = (component, data, path) => {
   const vue = access(component);
   const diff = {
-    before: import_object_manager2.default.on((0, import_vue2.unref)(componentState(vue))).clone(),
+    before: import_object_manager2.default.on(componentState(vue)).clone(),
     after: path ? import_object_manager2.default.on(componentState(vue)).set(dataPath(vue, path), data).get() : import_object_manager2.default.on(componentState(vue)).set(data).get()
   };
   return "state" in vue ? diff : vue.$emit("update:state", diff);
 };
 var componentState = (component) => {
-  return "state" in component ? component.state : component.$attrs.state;
+  return (0, import_vue2.unref)("state" in component ? component.state : component.$attrs.state);
 };
 var dataPath = (component, path) => {
   return typeof component.$attrs["data:path"] === "function" ? component.$attrs["data:path"](path) : path;
@@ -594,6 +608,7 @@ var dataPath = (component, path) => {
   StyleParser,
   access,
   dataPath,
+  defineReactiveView,
   extendVnode,
   getData,
   getDate,

package/dist/index.mjs

@@ -128,7 +128,7 @@ import { ref, reactive, watch, isRef, isReactive, createVNode, getCurrentInstanc
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.34-beta.16";
+var version = "0.0.34-beta.18";
 
 // src/ReactiveView.ts
 var setup = {
@@ -319,7 +319,7 @@ var ReactiveView_default = {
 };
 
 // src/index.ts
-import { h, unref as unref2, toRaw, createVNode as createVNode2 } from "vue";
+import { h, unref as unref2, toRaw, 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;");
@@ -516,14 +516,27 @@ var extendVnode = (component, element) => {
         const finalProps = Object.assign(rest, functionalProps, { class: finalClasses, style: finalStyles });
         const finalSlots = slots ? typeof slots === "function" ? slots(vnode.children) : slots : vnode.children;
         const finalElement = ["undefined"].includes(typeof element) ? vnode.type : element;
-        return h(finalElement, finalProps, () => finalSlots);
+        return h(finalElement, finalProps, finalSlots);
       };
     }
   });
 };
+function defineReactiveView(param1, param2) {
+  return defineComponent({
+    props: __spreadValues({ setup }, param1.props),
+    setup() {
+      const _a = param1, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
+      return (component) => {
+        return createVNode2(param2, Object.assign({}, rest, setup2 ? {
+          setup: (self, parent) => setup2(self, parent, component)
+        } : {}));
+      };
+    }
+  });
+}
 var getData = (component, path, alternative) => {
   const vue = access(component);
-  const data = ObjectManager2.on(unref2(componentState(vue)));
+  const data = ObjectManager2.on(componentState(vue));
   if (path) {
     return data.get(dataPath(vue, path), alternative);
   } else {
@@ -533,13 +546,13 @@ var getData = (component, path, alternative) => {
 var setData = (component, data, path) => {
   const vue = access(component);
   const diff = {
-    before: ObjectManager2.on(unref2(componentState(vue))).clone(),
+    before: ObjectManager2.on(componentState(vue)).clone(),
     after: path ? ObjectManager2.on(componentState(vue)).set(dataPath(vue, path), data).get() : ObjectManager2.on(componentState(vue)).set(data).get()
   };
   return "state" in vue ? diff : vue.$emit("update:state", diff);
 };
 var componentState = (component) => {
-  return "state" in component ? component.state : component.$attrs.state;
+  return unref2("state" in component ? component.state : component.$attrs.state);
 };
 var dataPath = (component, path) => {
   return typeof component.$attrs["data:path"] === "function" ? component.$attrs["data:path"](path) : path;
@@ -550,6 +563,7 @@ export {
   access,
   dataPath,
   index_default as default,
+  defineReactiveView,
   extendVnode,
   getData,
   getDate,

package/package.json

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