@razaman2/reactive-view 0.0.28 → 0.0.30

package/dist/index.d.mts

@@ -38,6 +38,7 @@ type PropExclusions = Array<string> | string;
 declare const setup: {
     type: FunctionConstructor;
     default: (parent?: {}, self?: {}) => {};
+    ReactiveView: boolean;
 };
 declare const _default: {
     props: {
@@ -104,7 +105,7 @@ declare function getDate(timestamp: {
     timezone?: string;
 }): string;
 declare function access(view?: ComponentExtension | UnwrapRef<any> | (() => ComponentExtension), alternative?: any): any;
-declare function getSubscription(): {
+declare function useSubscription(): {
     addSubscription(name: string, handler?: () => boolean, data?: any): void;
     replaceSubscription(name: string, handler?: () => boolean, data?: any): void;
     removeSubscriptions(): void;
@@ -116,4 +117,4 @@ declare function getSubscription(): {
 declare function StyleParser(styles?: Array<string> | Record<string, boolean> | string): {};
 declare function MergeStyles(...params: any): any;
 
-export { MergeStyles, StyleParser, access, _default as default, getDate, getProps, getReactiveViewComponent, getSubscription, safeRequest, setup };
+export { MergeStyles, StyleParser, access, _default as default, getDate, getProps, getReactiveViewComponent, safeRequest, setup, useSubscription };

package/dist/index.d.ts

@@ -38,6 +38,7 @@ type PropExclusions = Array<string> | string;
 declare const setup: {
     type: FunctionConstructor;
     default: (parent?: {}, self?: {}) => {};
+    ReactiveView: boolean;
 };
 declare const _default: {
     props: {
@@ -104,7 +105,7 @@ declare function getDate(timestamp: {
     timezone?: string;
 }): string;
 declare function access(view?: ComponentExtension | UnwrapRef<any> | (() => ComponentExtension), alternative?: any): any;
-declare function getSubscription(): {
+declare function useSubscription(): {
     addSubscription(name: string, handler?: () => boolean, data?: any): void;
     replaceSubscription(name: string, handler?: () => boolean, data?: any): void;
     removeSubscriptions(): void;
@@ -116,4 +117,4 @@ declare function getSubscription(): {
 declare function StyleParser(styles?: Array<string> | Record<string, boolean> | string): {};
 declare function MergeStyles(...params: any): any;
 
-export { MergeStyles, StyleParser, access, _default as default, getDate, getProps, getReactiveViewComponent, getSubscription, safeRequest, setup };
+export { MergeStyles, StyleParser, access, _default as default, getDate, getProps, getReactiveViewComponent, safeRequest, setup, useSubscription };

package/dist/index.js

@@ -1,9 +1,7 @@
 "use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
@@ -21,7 +19,6 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __export = (target, all) => {
   for (var name2 in all)
     __defProp(target, name2, { get: all[name2], enumerable: true });
@@ -54,9 +51,9 @@ __export(index_exports, {
   getDate: () => getDate,
   getProps: () => getProps,
   getReactiveViewComponent: () => getReactiveViewComponent,
-  getSubscription: () => getSubscription,
   safeRequest: () => safeRequest,
-  setup: () => setup
+  setup: () => setup,
+  useSubscription: () => useSubscription
 });
 module.exports = __toCommonJS(index_exports);
 var import_date_fns_tz = require("date-fns-tz");
@@ -159,12 +156,13 @@ var import_vue = require("vue");
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.28";
+var version = "0.0.30";
 
 // src/ReactiveView.ts
 var setup = {
   type: Function,
-  default: (parent = {}, self = {}) => self
+  default: (parent = {}, self = {}) => self,
+  ReactiveView: true
 };
 var ReactiveView_default = {
   props: {
@@ -238,7 +236,7 @@ var ReactiveView_default = {
     const datatype = Array.isArray(defaultData) ? [] : {};
     const config = {
       data: (0, import_vue.reactive)(
-        import_object_manager.default.on(async ? datatype : ((_f = vue.vnode.props) == null ? void 0 : _f.hasOwnProperty("data")) ? data : datatype).clone()
+        import_object_manager.default.on(async ? datatype : ((_f = vue.vnode.props) == null ? void 0 : _f.hasOwnProperty("data")) ? typeof data === "function" ? datatype : data : datatype).clone()
       ),
       defaultData: import_object_manager.default.on(defaultData).clone(),
       notifications: props.notifications,
@@ -253,7 +251,7 @@ var ReactiveView_default = {
             var _a2;
             const beforeSetData = (_a2 = access(component).beforeSetData) != null ? _a2 : props.beforeSetData;
             if (typeof beforeSetData === "function") {
-              const after = import_object_manager.default.on(datatype).set(...params).get();
+              const after = import_object_manager.default.on(datatype).set(...params.length ? params : [defaultData]).get();
               const before = target.getData();
               beforeSetData({ before, after }, target);
             } else {
@@ -314,7 +312,7 @@ var ReactiveView_default = {
       }
       return options;
     }, component.value);
-    props.instance.value = component.value;
+    props.instance.value = typeof props.instance === "function" ? props.instance(component.value) : component.value;
     return (vue2) => {
       if (ready.value) {
         return access(component).template(component, vue2);
@@ -428,7 +426,7 @@ function access(view = {}, alternative) {
     return resolve(view);
   }
 }
-function getSubscription() {
+function useSubscription() {
   const subscriptions = [];
   const subscription = Subscriptions.get();
   return {
@@ -456,19 +454,39 @@ function getSubscription() {
   };
 }
 function StyleParser(styles = {}) {
-  const transform = (style, status = true) => style.split(/\s+/).reduce((object, style2) => {
-    return __spreadProps(__spreadValues({}, object), {
-      [style2]: status
-    });
-  }, {});
+  const transform = (style, status = true) => {
+    const remove = style.split(/(-{[^}]+})/);
+    return remove.reduce((object, style2) => {
+      var _a;
+      const remove2 = /-{(.+?)}/.exec(style2);
+      (remove2 ? (_a = remove2[1]) != null ? _a : style2 : style2).split(/\s+/).forEach((item) => {
+        if (item) {
+          Object.assign(object, { [item]: remove2 ? false : status });
+        }
+      });
+      return object;
+    }, {});
+  };
   return Array.isArray(styles) ? styles.reduce((styles2, style) => Object.assign(transform(style), styles2), {}) : typeof styles === "string" ? transform(styles) : Object.entries(styles).reduce((acc, [styles2, value]) => {
     return __spreadValues(__spreadValues({}, acc), transform(styles2, value));
   }, {});
 }
 function MergeStyles(...params) {
-  return params.reduce((styles, style, index, array) => {
-    return __spreadValues(__spreadValues({}, StyleParser(array[array.length - index - 1])), styles);
-  }, {});
+  return new Proxy(params.reduce((styles, style, index, items) => {
+    var _a;
+    const item = (_a = items[items.length - index - 1]) != null ? _a : {};
+    return __spreadValues(__spreadValues({}, StyleParser(typeof item === "function" ? item(items.slice(0, index - 1)) : item)), styles);
+  }, {}), {
+    get: (target, key, receiver) => {
+      if (key === "string") {
+        return Object.entries(target).reduce((styles, [key2, val]) => {
+          return val ? styles.concat(key2) : styles;
+        }, []).join(" ");
+      } else {
+        return Reflect.get(target, key, receiver);
+      }
+    }
+  });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -478,7 +496,7 @@ function MergeStyles(...params) {
   getDate,
   getProps,
   getReactiveViewComponent,
-  getSubscription,
   safeRequest,
-  setup
+  setup,
+  useSubscription
 });

package/dist/index.mjs

@@ -1,6 +1,4 @@
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -16,7 +14,6 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
 // src/index.ts
 import { formatInTimeZone } from "date-fns-tz";
@@ -119,12 +116,13 @@ import { ref, reactive, watch, isRef, isReactive, createVNode, getCurrentInstanc
 
 // package.json
 var name = "@razaman2/reactive-view";
-var version = "0.0.28";
+var version = "0.0.30";
 
 // src/ReactiveView.ts
 var setup = {
   type: Function,
-  default: (parent = {}, self = {}) => self
+  default: (parent = {}, self = {}) => self,
+  ReactiveView: true
 };
 var ReactiveView_default = {
   props: {
@@ -198,7 +196,7 @@ var ReactiveView_default = {
     const datatype = Array.isArray(defaultData) ? [] : {};
     const config = {
       data: reactive(
-        ObjectManager.on(async ? datatype : ((_f = vue.vnode.props) == null ? void 0 : _f.hasOwnProperty("data")) ? data : datatype).clone()
+        ObjectManager.on(async ? datatype : ((_f = vue.vnode.props) == null ? void 0 : _f.hasOwnProperty("data")) ? typeof data === "function" ? datatype : data : datatype).clone()
       ),
       defaultData: ObjectManager.on(defaultData).clone(),
       notifications: props.notifications,
@@ -213,7 +211,7 @@ var ReactiveView_default = {
             var _a2;
             const beforeSetData = (_a2 = access(component).beforeSetData) != null ? _a2 : props.beforeSetData;
             if (typeof beforeSetData === "function") {
-              const after = ObjectManager.on(datatype).set(...params).get();
+              const after = ObjectManager.on(datatype).set(...params.length ? params : [defaultData]).get();
               const before = target.getData();
               beforeSetData({ before, after }, target);
             } else {
@@ -274,7 +272,7 @@ var ReactiveView_default = {
       }
       return options;
     }, component.value);
-    props.instance.value = component.value;
+    props.instance.value = typeof props.instance === "function" ? props.instance(component.value) : component.value;
     return (vue2) => {
       if (ready.value) {
         return access(component).template(component, vue2);
@@ -388,7 +386,7 @@ function access(view = {}, alternative) {
     return resolve(view);
   }
 }
-function getSubscription() {
+function useSubscription() {
   const subscriptions = [];
   const subscription = Subscriptions.get();
   return {
@@ -416,19 +414,39 @@ function getSubscription() {
   };
 }
 function StyleParser(styles = {}) {
-  const transform = (style, status = true) => style.split(/\s+/).reduce((object, style2) => {
-    return __spreadProps(__spreadValues({}, object), {
-      [style2]: status
-    });
-  }, {});
+  const transform = (style, status = true) => {
+    const remove = style.split(/(-{[^}]+})/);
+    return remove.reduce((object, style2) => {
+      var _a;
+      const remove2 = /-{(.+?)}/.exec(style2);
+      (remove2 ? (_a = remove2[1]) != null ? _a : style2 : style2).split(/\s+/).forEach((item) => {
+        if (item) {
+          Object.assign(object, { [item]: remove2 ? false : status });
+        }
+      });
+      return object;
+    }, {});
+  };
   return Array.isArray(styles) ? styles.reduce((styles2, style) => Object.assign(transform(style), styles2), {}) : typeof styles === "string" ? transform(styles) : Object.entries(styles).reduce((acc, [styles2, value]) => {
     return __spreadValues(__spreadValues({}, acc), transform(styles2, value));
   }, {});
 }
 function MergeStyles(...params) {
-  return params.reduce((styles, style, index, array) => {
-    return __spreadValues(__spreadValues({}, StyleParser(array[array.length - index - 1])), styles);
-  }, {});
+  return new Proxy(params.reduce((styles, style, index, items) => {
+    var _a;
+    const item = (_a = items[items.length - index - 1]) != null ? _a : {};
+    return __spreadValues(__spreadValues({}, StyleParser(typeof item === "function" ? item(items.slice(0, index - 1)) : item)), styles);
+  }, {}), {
+    get: (target, key, receiver) => {
+      if (key === "string") {
+        return Object.entries(target).reduce((styles, [key2, val]) => {
+          return val ? styles.concat(key2) : styles;
+        }, []).join(" ");
+      } else {
+        return Reflect.get(target, key, receiver);
+      }
+    }
+  });
 }
 export {
   MergeStyles,
@@ -438,7 +456,7 @@ export {
   getDate,
   getProps,
   getReactiveViewComponent,
-  getSubscription,
   safeRequest,
-  setup
+  setup,
+  useSubscription
 };

package/package.json

@@ -1,45 +1,45 @@
-{
-    "name": "@razaman2/reactive-view",
-    "version": "0.0.28",
-    "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",
-    "types": "dist/index.d.ts",
-    "scripts": {
-        "prepublishOnly": "npm run build",
-        "build": "tsup src/index.ts --format cjs,esm --dts",
-        "lint": "tsc",
-        "test": "cd tests/vue-ts && npm run dev"
-    },
-    "keywords": [
-        "vue",
-        "vue-helper",
-        "reactive-view",
-        "vue-class-component",
-        "reactive-ui"
-    ],
-    "author": "razaman2",
-    "license": "MIT",
-    "dependencies": {
-        "@razaman2/data-manager": "^3.2.11",
-        "@razaman2/object-manager": "^3.4.2",
-        "date-fns": "^4.1.0",
-        "date-fns-tz": "^3.2.0",
-        "uuid": "^11.1.0"
-    },
-    "peerDependencies": {
-        "vue": "^3.5.13"
-    },
-    "devDependencies": {
-        "@types/uuid": "^10.0.0",
-        "tsup": "^8.4.0",
-        "typescript": "^5.8.3",
-        "vitest": "^3.1.1"
-    },
-    "publishConfig": {
-        "access": "public"
-    },
-    "files": [
-        "dist"
-    ]
-}
+{
+    "name": "@razaman2/reactive-view",
+    "version": "0.0.30",
+    "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",
+    "types": "dist/index.d.ts",
+    "scripts": {
+        "prepublishOnly": "npm run build",
+        "build": "tsup src/index.ts --format cjs,esm --dts",
+        "lint": "tsc",
+        "test": "cd tests/vue-ts && npm run dev"
+    },
+    "keywords": [
+        "vue",
+        "vue-helper",
+        "reactive-view",
+        "vue-class-component",
+        "reactive-ui"
+    ],
+    "author": "razaman2",
+    "license": "MIT",
+    "dependencies": {
+        "@razaman2/data-manager": "^3.2.11",
+        "@razaman2/object-manager": "^3.4.2",
+        "date-fns": "^4.1.0",
+        "date-fns-tz": "^3.2.0",
+        "uuid": "^11.1.0"
+    },
+    "peerDependencies": {
+        "vue": "^3.5.13"
+    },
+    "devDependencies": {
+        "@types/uuid": "^10.0.0",
+        "tsup": "^8.4.0",
+        "typescript": "^5.8.3",
+        "vitest": "^3.1.1"
+    },
+    "publishConfig": {
+        "access": "public"
+    },
+    "files": [
+        "dist"
+    ]
+}