@razaman2/reactive-view 0.1.0-beta.14 → 0.1.0-beta.16

package/dist/index.mjs

@@ -1,44 +1,10 @@
-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;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-
 // src/index.ts
-import ObjectManager2 from "@razaman2/object-manager";
+import OM from "@razaman2/object-manager";
 
 // src/Subscription.ts
 var Subscription = class _Subscription {
-  constructor() {
-    this.subscriptions = [];
-    this.data = {};
-  }
+  subscriptions = [];
+  data = {};
   static create() {
     return new _Subscription();
   }
@@ -116,13 +82,12 @@ var Subscription = class _Subscription {
 };
 
 // src/Subscriptions.ts
-var _Subscriptions = class _Subscriptions extends Subscription {
+var Subscriptions = class _Subscriptions extends Subscription {
+  static subscriptions = _Subscriptions.create();
   static get() {
     return this.subscriptions;
   }
 };
-_Subscriptions.subscriptions = _Subscriptions.create();
-var Subscriptions = _Subscriptions;
 
 // src/ReactiveView.ts
 import ObjectManager from "@razaman2/object-manager";
@@ -130,19 +95,26 @@ import DataManager from "@razaman2/data-manager";
 import { ref, reactive, watch, unref, isRef, isReactive, createVNode, getCurrentInstance, onBeforeUnmount } from "vue";
 
 // package.json
-var version = "0.1.0-beta.14";
 var package_default = {
   name: "@razaman2/reactive-view",
-  version,
+  version: "0.1.0-beta.16",
   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",
+  exports: {
+    ".": {
+      types: "./dist/index.d.ts",
+      require: "./dist/index.js",
+      import: "./dist/index.mjs"
+    }
+  },
   scripts: {
     prepublishOnly: "npm run build",
     build: "tsup src/index.ts --format cjs,esm --dts",
     lint: "tsc",
-    test: "cd tests/vue-ts && npm run dev",
+    test: "vitest run",
+    "test:watch": "vitest",
     pr: "sh pr.sh"
   },
   keywords: [
@@ -152,10 +124,18 @@ var package_default = {
     "vue-class-component",
     "reactive-ui"
   ],
+  repository: {
+    type: "git",
+    url: "git+https://github.com/razaman2/reactive-view.git"
+  },
+  bugs: {
+    url: "https://github.com/razaman2/reactive-view/issues"
+  },
+  homepage: "https://github.com/razaman2/reactive-view#readme",
   author: "razaman2",
   license: "MIT",
   dependencies: {
-    "@razaman2/data-manager": "^3.3.8",
+    "@razaman2/data-manager": "^3.3.12",
     "@razaman2/event-emitter": "^2.1.1",
     "@razaman2/object-manager": "^3.4.7",
     "date-fns": "^4.1.0",
@@ -222,7 +202,6 @@ var ReactiveView_default = {
     state: { default: reactive({}) }
   },
   setup(props, context) {
-    var _a, _b, _c;
     const subscriptions = [];
     onBeforeUnmount(() => subscriptions.forEach((subscription) => subscription()));
     const diff = (before, after) => {
@@ -238,30 +217,27 @@ var ReactiveView_default = {
       return { before: before.get(), after: after.get(), changes: changes.get(), changed: changed.value };
     };
     const dataPath2 = (path) => {
-      try {
-        return context.attrs["data:path"](path);
-      } catch (e) {
-        return path;
-      }
+      const handler = context.attrs["data:path"];
+      return typeof handler === "function" ? handler(path) : path;
     };
     const template = (component, vue2) => {
-      return createVNode("div", context.slots.default ? context.attrs : __spreadValues({
-        style: { color: "red", textAlign: "center" }
-      }, context.attrs), context.slots.default ? context.slots.default({ component, vue: vue2, props, context }) : `${props.modelName}: ${package_default.name}@${package_default.version}`);
+      return createVNode("div", context.slots.default ? context.attrs : {
+        style: { color: "red", textAlign: "center" },
+        ...context.attrs
+      }, context.slots.default ? context.slots.default({ component, vue: vue2, props, context }) : `${props.modelName}: ${package_default.name}@${package_default.version}`);
     };
     const isValid = ref(false);
     const isReady = ref(false);
     const defer = ref(typeof props.defer === "function" ? props.defer() : props.defer);
-    const isFunctionData = ["Function"].includes((_a = props.data) == null ? void 0 : _a.constructor.name);
-    const isAsyncFunctionData = ["AsyncFunction"].includes((_b = props.data) == null ? void 0 : _b.constructor.name);
-    const isAsyncData = ["Promise"].includes((_c = props.data) == null ? void 0 : _c.constructor.name) || isAsyncFunctionData;
+    const isFunctionData = ["Function"].includes(props.data?.constructor.name);
+    const isAsyncFunctionData = ["AsyncFunction"].includes(props.data?.constructor.name);
+    const isAsyncData = ["Promise"].includes(props.data?.constructor.name) || isAsyncFunctionData;
     const vue = getCurrentInstance();
     const defaultData = props.getDefaultData(
       "defaultData" in vue.vnode.props ? vue.vnode.props.defaultData : "data" in vue.vnode.props ? Array.isArray(unref(vue.vnode.props.data)) ? [] : {} : {}
     );
     const datatype = Array.isArray(defaultData) ? [] : {};
     const beta = () => {
-      var _a2;
       const emit = (after, before) => {
         if (vue && vue.vnode.el) {
           const event = new CustomEvent("data:emit", {
@@ -281,8 +257,7 @@ var ReactiveView_default = {
           get(target, key, receiver) {
             if (["setData", "replaceData"].includes(key.toString())) {
               return (...params) => {
-                var _a3;
-                const beforeSetData = (_a3 = access(component).beforeSetData) != null ? _a3 : props.beforeSetData;
+                const beforeSetData = access(component).beforeSetData ?? props.beforeSetData;
                 if (typeof beforeSetData === "function") {
                   const before = ObjectManager.on(target.getData());
                   const after = params.length ? ObjectManager.on(datatype).set(...params) : ObjectManager.on(datatype).set(defaultData);
@@ -309,18 +284,18 @@ var ReactiveView_default = {
         } else {
           const props2 = "data" in vue.vnode.props;
           try {
-            if (["Array", "Object"].includes(data.constructor.name)) {
+            if (["Array", "Object"].includes(data?.constructor?.name)) {
               return ref(data);
             } else {
               return ref(props2 ? { "": data } : datatype);
             }
-          } catch (e) {
+          } catch {
             return ref(props2 ? { "": data } : datatype);
           }
         }
       };
       const config = {
-        data: normalize((_a2 = vue.vnode.props) == null ? void 0 : _a2.data),
+        data: normalize(vue.vnode.props?.data),
         defaultData: ObjectManager.on(defaultData).clone(),
         notifications: props.notifications,
         subscriptions: props.subscriptions,
@@ -349,48 +324,41 @@ var ReactiveView_default = {
           }
         }, config2.options));
       }
-      const track = (source, options = {}) => {
-        var _a3, _b2, _c2, _d, _e;
-        subscriptions.push(watch(source, async (after, before) => {
-          const diff2 = access(component).diff(ObjectManager.on(before), ObjectManager.on(after));
-          const callback = context.attrs["data:callback"];
-          if (typeof callback === "function") {
-            callback(diff2, { component });
-          } else {
-            model.replaceData(after);
-          }
-        }, {
-          immediate: (_b2 = (_a3 = context.attrs["data:immediate"]) != null ? _a3 : options.immediate) != null ? _b2 : true,
-          deep: (_d = (_c2 = context.attrs["data:deep"]) != null ? _c2 : options.deep) != null ? _d : true,
-          once: (_e = context.attrs["data:once"]) != null ? _e : options.once
-        }));
-      };
       setTimeout(async () => {
-        var _a3;
-        if (props.model !== false) {
-          if (isFunctionData || isAsyncData) {
-            if (!("defaultData" in vue.vnode.props)) {
-              console.warn(`${props.modelName}: defaultData is required for promise or function data.`, props.data);
-            }
-            const [data] = isAsyncData ? await Promise.all([
-              isAsyncFunctionData ? props.data() : props.data,
-              (_a3 = defer.value) != null ? _a3 : true
-            ]) : [props.data];
-            track(typeof data === "function" ? data : (() => data));
-          } else {
-            track(isRef(props.data) || isReactive(props.data) ? props.data : () => props.data, { immediate: false, deep: false });
+        if (props.model !== false && (isFunctionData || isAsyncData)) {
+          if (!("defaultData" in vue.vnode.props)) {
+            console.warn(`${props.modelName}: defaultData is required for promise or function data.`, props.data);
           }
+          const [data] = isAsyncData ? await Promise.all([
+            isAsyncFunctionData ? props.data() : props.data,
+            defer.value ?? true
+          ]) : [props.data];
+          const source = typeof data === "function" ? data : (() => data);
+          subscriptions.push(watch(source, async (after, before) => {
+            const diff2 = access(component).diff(ObjectManager.on(before), ObjectManager.on(after));
+            const callback = context.attrs["data:callback"];
+            if (props.debug) {
+              console.warn(`[${props.modelName}]:data`, { diff: diff2, data, callback, before, after, props, context, component });
+            }
+            if (typeof callback === "function") {
+              callback(diff2, { component });
+            } else {
+              model.replaceData(after);
+            }
+          }, {
+            immediate: context.attrs["data:immediate"] ?? true,
+            deep: context.attrs["data:deep"],
+            once: context.attrs["data:once"]
+          }));
         }
       });
       setTimeout(async () => {
-        var _a3;
-        isReady.value = (_a3 = await defer.value) != null ? _a3 : true;
+        isReady.value = await defer.value ?? true;
       });
       component.value = [access(component)].reduce((options, parent) => {
-        var _a3;
         while (parent) {
           if (typeof parent.setup === "function") {
-            options = { parent: options, self: (_a3 = parent.setup(component, options)) != null ? _a3 : {} };
+            options = { parent: options, self: parent.setup(component, options) ?? {} };
             if (access(parent.$parent).ReactiveView) {
               break;
             } else {
@@ -404,16 +372,14 @@ var ReactiveView_default = {
       }, component.value);
       props.instance.value = typeof props.instance === "function" ? props.instance(component.value) : component.value;
       return (vue2) => {
-        var _a3, _b2;
         if (isReady.value) {
           return access(component).template(component, vue2);
         } else {
-          return (_b2 = (_a3 = context.slots).loading) == null ? void 0 : _b2.call(_a3, { component });
+          return context.slots.loading?.({ component });
         }
       };
     };
     const current = () => {
-      var _a2, _b2, _c2, _d;
       const emit = (after, before) => {
         if (vue && vue.vnode.el) {
           const event = new CustomEvent("data:emit", {
@@ -439,19 +405,19 @@ var ReactiveView_default = {
           } else {
             const props2 = "data" in vue.vnode.props;
             try {
-              if (["Array", "Object"].includes(data.constructor.name)) {
+              if (["Array", "Object"].includes(data?.constructor?.name)) {
                 return reactive(props2 ? data : datatype);
               } else {
                 return reactive(props2 ? { "": data } : datatype);
               }
-            } catch (e) {
+            } catch {
               return reactive(props2 ? { "": data } : datatype);
             }
           }
         }
       };
       const config = {
-        data: props.beta ? normalize((_a2 = vue.vnode.props) == null ? void 0 : _a2.data) : reactive(ObjectManager.on(
+        data: props.beta ? normalize(vue.vnode.props?.data) : reactive(ObjectManager.on(
           isAsyncData || isFunctionData || isRef(props.data) || isReactive(props.data) ? datatype : "data" in vue.vnode.props ? props.data : datatype
         ).clone()),
         defaultData: ObjectManager.on(defaultData).clone(),
@@ -464,8 +430,7 @@ var ReactiveView_default = {
         get(target, key, receiver) {
           if (["setData", "replaceData"].includes(key.toString())) {
             return (...params) => {
-              var _a3;
-              const beforeSetData = (_a3 = access(component).beforeSetData) != null ? _a3 : props.beforeSetData;
+              const beforeSetData = access(component).beforeSetData ?? props.beforeSetData;
               if (typeof beforeSetData === "function") {
                 const before = ObjectManager.on(target.getData());
                 const after = params.length ? ObjectManager.on(datatype).set(...params) : ObjectManager.on(datatype).set(defaultData);
@@ -487,20 +452,20 @@ var ReactiveView_default = {
         console.warn("[ReactiveView]:", { props, context, vue, defer, config, model, component, datatype, defaultData, isValid, isReady, isFunctionData, isAsyncFunctionData, isAsyncData });
       }
       const watchDataProp = (dataProp) => {
-        var _a3, _b3, _c3, _d2;
         const config2 = typeof context.attrs["onUpdate:data"] === "function" ? { callback: context.attrs["onUpdate:data"] } : {
-          callback: (_b3 = ((_a3 = context.attrs["onUpdate:data"]) != null ? _a3 : {}).callback) != null ? _b3 : context.attrs["data:callback"],
-          options: Object.assign(__spreadValues(__spreadValues({
-            deep: (_c3 = context.attrs["data:deep"]) != null ? _c3 : true
-          }, context.attrs["data:immediate"] ? { immediate: context.attrs["data:immediate"] } : {}), context.attrs["data:once"] ? { once: context.attrs["data:once"] } : {}), ((_d2 = context.attrs["onUpdate:data"]) != null ? _d2 : {}).options)
+          callback: (context.attrs["onUpdate:data"] ?? {}).callback ?? context.attrs["data:callback"],
+          options: Object.assign({
+            deep: context.attrs["data:deep"] ?? true,
+            ...context.attrs["data:immediate"] ? { immediate: context.attrs["data:immediate"] } : {},
+            ...context.attrs["data:once"] ? { once: context.attrs["data:once"] } : {}
+          }, (context.attrs["onUpdate:data"] ?? {}).options)
         };
         if (context.attrs["data:log"]) {
           console.warn(`[ReactiveView]:data`, { config: config2, dataProp });
         }
         subscriptions.push(watch(isFunctionData || isRef(dataProp) || isReactive(dataProp) ? dataProp : () => dataProp, (after, before) => {
-          var _a4;
           if (typeof config2.callback === "function") {
-            model.replaceData((_a4 = config2.callback(access(component).diff(ObjectManager.on(before), ObjectManager.on(after)), { component })) != null ? _a4 : after);
+            model.replaceData(config2.callback(access(component).diff(ObjectManager.on(before), ObjectManager.on(after)), { component }) ?? after);
           } else {
             model.replaceData(after);
           }
@@ -509,10 +474,12 @@ var ReactiveView_default = {
       if (context.attrs["onUpdate:model"] || context.attrs["update:model"]) {
         const config2 = typeof context.attrs["onUpdate:model"] === "function" ? {
           callback: context.attrs["onUpdate:model"],
-          options: Object.assign(__spreadValues(__spreadValues({
-            deep: (_b2 = context.attrs["model:deep"]) != null ? _b2 : true
-          }, context.attrs["model:immediate"] ? { immediate: context.attrs["model:immediate"] } : {}), context.attrs["model:once"] ? { once: context.attrs["model:once"] } : {}), ((_c2 = context.attrs["onUpdate:model"]) != null ? _c2 : {}).options)
-        } : (_d = context.attrs["onUpdate:model"]) != null ? _d : {};
+          options: Object.assign({
+            deep: context.attrs["model:deep"] ?? true,
+            ...context.attrs["model:immediate"] ? { immediate: context.attrs["model:immediate"] } : {},
+            ...context.attrs["model:once"] ? { once: context.attrs["model:once"] } : {}
+          }, (context.attrs["onUpdate:model"] ?? {}).options)
+        } : context.attrs["onUpdate:model"] ?? {};
         if (context.attrs["model:log"]) {
           console.warn(`[ReactiveView]:model`, { config: config2 });
         }
@@ -524,48 +491,43 @@ var ReactiveView_default = {
         const isRefData = isRef(props.data);
         if (isRefData || isFunctionData || isAsyncData) {
           setTimeout(async () => {
-            var _a3, _b3, _c3;
             const [data] = isAsyncData ? await Promise.all([
               isAsyncFunctionData ? props.data() : props.data,
-              (_a3 = defer.value) != null ? _a3 : true
+              defer.value ?? true
             ]) : [props.data];
             subscriptions.push(watch(isRefData ? data : isFunctionData ? data : typeof data === "function" ? data : () => data, (after, before) => {
-              var _a4;
               if (before !== void 0 || after !== void 0) {
                 const callback = context.attrs["data:callback"];
                 if (typeof callback === "function") {
                   const diff2 = access(component).diff(ObjectManager.on(before), ObjectManager.on(after));
-                  model.replaceData((_a4 = callback(diff2, { component })) != null ? _a4 : after);
+                  model.replaceData(callback(diff2, { component }) ?? after);
                 } else {
                   model.replaceData(after);
                 }
               }
             }, {
-              immediate: (_b3 = context.attrs["data:immediate"]) != null ? _b3 : true,
-              deep: (_c3 = context.attrs["data:deep"]) != null ? _c3 : true,
+              immediate: context.attrs["data:immediate"] ?? true,
+              deep: context.attrs["data:deep"] ?? true,
               once: context.attrs["data:once"]
             }));
           });
         }
       } else {
         setTimeout(async () => {
-          var _a3;
           const [data] = await Promise.all([
             isAsyncFunctionData ? props.data() : props.data,
-            (_a3 = defer.value) != null ? _a3 : true
+            defer.value ?? true
           ]);
           watchDataProp(data);
         });
       }
       setTimeout(async () => {
-        var _a3;
-        isReady.value = (_a3 = await defer.value) != null ? _a3 : true;
+        isReady.value = await defer.value ?? true;
       });
       component.value = [access(component)].reduce((options, parent) => {
-        var _a3;
         while (parent) {
           if (typeof parent.setup === "function") {
-            options = { parent: options, self: (_a3 = parent.setup(component, options)) != null ? _a3 : {} };
+            options = { parent: options, self: parent.setup(component, options) ?? {} };
             if (access(parent.$parent).ReactiveView) {
               break;
             } else {
@@ -579,11 +541,10 @@ var ReactiveView_default = {
       }, component.value);
       props.instance.value = typeof props.instance === "function" ? props.instance(component.value) : component.value;
       return (vue2) => {
-        var _a3, _b3;
         if (isReady.value) {
           return access(component).template(component, vue2);
         } else {
-          return (_b3 = (_a3 = context.slots).loading) == null ? void 0 : _b3.call(_a3, { component });
+          return context.slots.loading?.({ component });
         }
       };
     };
@@ -595,12 +556,13 @@ var ReactiveView_default = {
 import { h, ref as ref2, unref as unref2, toRaw, isRef as isRef2, isReactive as isReactive2, createApp, createVNode as createVNode2, defineComponent } from "vue";
 import { formatInTimeZone } from "date-fns-tz";
 import { twMerge } from "tailwind-merge";
+var ObjectManager2 = OM.default || OM;
+var { version } = package_default;
 console.log(`%c[ReactiveView]: ${version}`, "background-color: red; color: yellow;");
 var index_default = ReactiveView_default;
 function safeRequest(request) {
   return new Promise(async (resolve) => {
-    var _a, _b, _c, _d;
-    const { message } = (_a = request.loading) != null ? _a : {};
+    const { message } = request.loading ?? {};
     if (request.loading) {
       request.loading.status = true;
       if (request.message) {
@@ -610,26 +572,25 @@ function safeRequest(request) {
     try {
       resolve(await request.try());
     } catch (e) {
-      if ((_b = request.alternative) != null ? _b : true) {
+      if (request.alternative ?? true) {
         resolve(request.catch ? await request.catch(e) : console.log(e));
       }
     } finally {
-      await ((_c = request.finally) == null ? void 0 : _c.call(request));
+      await request.finally?.();
       if (request.loading) {
         request.loading.status = false;
       }
       if (request.loading && message) {
         request.loading.message = message;
       }
-      await ((_d = request.complete) == null ? void 0 : _d.call(request));
+      await request.complete?.();
     }
   });
 }
 function getProps(props = {}, param2) {
-  var _a;
   const exclude = Array.isArray(param2) || typeof param2 === "string" ? param2 : param2.exclude;
   const exclusions = (Array.isArray(exclude) ? exclude : [exclude]).join("|");
-  const include = (_a = param2.include) != null ? _a : {};
+  const include = param2.include ?? {};
   return Object.entries(include).reduce((props2, [key, val]) => {
     props2[key] = val;
     return props2;
@@ -644,7 +605,7 @@ function getReactiveViewComponent(component, options = {}) {
   const model = (component2) => {
     try {
       return (component2.type || component2).props.hasOwnProperty("model");
-    } catch (e) {
+    } catch {
       return false;
     }
   };
@@ -655,10 +616,9 @@ function getReactiveViewComponent(component, options = {}) {
   return model(component) ? createVNode2(component, props) : createVNode2(ReactiveView_default, props, slots);
 }
 function getDate(param1, param2) {
-  var _a, _b;
   const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
   const format = "MM/dd/yyyy h:mm a";
-  const options = typeof param2 === "string" ? { format: param2, timezone } : { format: (_a = param2 == null ? void 0 : param2.format) != null ? _a : format, timezone: (_b = param2 == null ? void 0 : param2.timezone) != null ? _b : timezone };
+  const options = typeof param2 === "string" ? { format: param2, timezone } : { format: param2?.format ?? format, timezone: param2?.timezone ?? timezone };
   const datetime = () => {
     try {
       return param1 instanceof Date ? param1 : param1.toDate();
@@ -669,7 +629,6 @@ function getDate(param1, param2) {
   return formatInTimeZone(datetime(), options.timezone, options.format);
 }
 function access(view = {}, alternative) {
-  var _a;
   const resolve = (target) => {
     return new Proxy(toRaw(target), {
       get(target2, key) {
@@ -685,16 +644,16 @@ function access(view = {}, alternative) {
         } while (component.tree);
         try {
           return new alternative();
-        } catch (e) {
+        } catch {
           return alternative;
         }
       }
     });
   };
   try {
-    const component = (_a = unref2(typeof view === "function" ? view() : view)) != null ? _a : {};
+    const component = unref2(typeof view === "function" ? view() : view) ?? {};
     return resolve("instance" in component ? component.instance : component);
-  } catch (e) {
+  } catch {
     return resolve(view);
   }
 }
@@ -726,28 +685,28 @@ function useSubscription() {
   };
 }
 var Prop = ({ default: value, type, validator, required } = {}) => {
-  const types1 = Array.isArray(type) ? type : [type != null ? type : Array];
+  const types1 = Array.isArray(type) ? type : [type ?? Array];
   const types2 = types1.includes(Object) ? types1 : types1.concat(Object);
-  return __spreadProps(__spreadValues({}, value ? { default: isRef2(value) || isReactive2(value) ? value : ref2(value) } : {}), {
+  return {
+    ...value ? { default: isRef2(value) || isReactive2(value) ? value : ref2(value) } : {},
     required,
     validator: (value2) => {
       try {
         return validator ? validator(unref2(value2)) : Array.from(new Set(types2.map((type2) => {
           return typeof type2 === "function" ? type2().constructor.name : type2;
         }))).includes(unref2(value2).constructor.name);
-      } catch (e) {
-        return required;
+      } catch {
+        return !required;
       }
     }
-  });
+  };
 };
 function StyleParser(styles = {}) {
   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) => {
+      (remove2 ? remove2[1] ?? style2 : style2).split(/\s+/).forEach((item) => {
         if (item) {
           Object.assign(object, { [item]: remove2 ? false : status });
         }
@@ -756,14 +715,19 @@ function StyleParser(styles = {}) {
     }, {});
   };
   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));
+    return {
+      ...acc,
+      ...transform(styles2, value)
+    };
   }, {});
 }
 function MergeStyles(...params) {
   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);
+    const item = items[items.length - index - 1] ?? {};
+    return {
+      ...StyleParser(typeof item === "function" ? item(items.slice(0, index - 1)) : item),
+      ...styles
+    };
   }, {}), {
     get: (target, key, receiver) => {
       const styles = Object.entries(target).reduce((styles2, [key2, val]) => {
@@ -785,22 +749,20 @@ var extendVnode = (component, element) => {
       const getVnode = () => {
         try {
           return target[key]();
-        } catch (e) {
+        } catch {
           throw new Error(`${key} does not exist as vnode on component.`);
         }
       };
       const vnode = getVnode();
       return (props = {}, slots) => {
-        var _a;
         const isFunctionClass = typeof props.class === "function";
         const isFunctionStyle = typeof props.style === "function";
-        const _b = (_a = vnode.props) != null ? _a : {}, { class: classes, style: styles } = _b, rest = __objRest(_b, ["class", "style"]);
+        const { class: classes, style: styles, ...rest } = vnode.props ?? {};
         const finalClasses = twMerge(isFunctionClass ? "" : classes, MergeStyles(isFunctionClass ? props.class(classes) : props.class).string);
         const finalStyles = MergeStyles(styles, isFunctionStyle ? props.style(styles) : props.style);
         const functionalProps = Object.entries(props).reduce((props2, [key2, value]) => {
-          var _a2;
           if (!["class", "style", "setup"].includes(key2) && typeof value === "function") {
-            props2[key2] = value((_a2 = vnode.props) == null ? void 0 : _a2[key2]);
+            props2[key2] = value(vnode.props?.[key2]);
           }
           return props2;
         }, props);
@@ -815,26 +777,27 @@ var extendVnode = (component, element) => {
 function defineReactiveView(param1, param2) {
   const instance = ref2();
   return defineComponent({
-    name: param1 == null ? void 0 : param1.modelName,
-    props: __spreadValues({ setup }, param1 ? param1.props : {}),
+    name: param1?.modelName,
+    props: { setup, ...param1 ? param1.props : {} },
     setup() {
-      const _a = param1 != null ? param1 : {}, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
+      const { setup: setup2, props, ...rest } = param1 ?? {};
       return (component) => {
         const props2 = Object.entries(rest).reduce((props3, [key, val]) => {
           return Object.assign(props3, { [key]: typeof val === "function" ? val(component, instance) : 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, __spreadProps(__spreadValues(__spreadValues({}, props2), Object.assign({}, props2, typeof setup2 === "function" ? {
-          setup: (self, parent) => setup2(self, parent, component)
-        } : {})), {
+        const slots = typeof param1?.slots === "function" ? param1.slots(component) : Array.isArray(param1?.slots) ? () => param1.slots : param1?.slots;
+        return createVNode2(param2 ?? ReactiveView_default, {
+          ...props2,
+          ...Object.assign({}, props2, typeof setup2 === "function" ? {
+            setup: (self, parent) => setup2(self, parent, component)
+          } : {}),
           instance
-        }), slots);
+        }, slots);
       };
     }
   });
 }
 function showComponent(component, options = {}) {
-  var _a;
   if (options.router) {
     console.warn("[ReactiveView]: Deprecated {router} option used with {showComponent()}. \nUse {plugins} option instead.");
   }
@@ -846,7 +809,7 @@ function showComponent(component, options = {}) {
       document.body.appendChild(dialogs);
     }
     const dialog = document.createElement("div");
-    const id = (_a = options.key) != null ? _a : `dialog_${dialogs.children.length + 1}`;
+    const id = options.key ?? `dialog_${dialogs.children.length + 1}`;
     dialog.setAttribute("id", id);
     dialogs.appendChild(dialog);
     const app = createApp(