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

package/dist/index.js

@@ -1,930 +1 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  MergeStyles: () => MergeStyles,
-  Prop: () => Prop,
-  StyleParser: () => StyleParser,
-  access: () => access,
-  dataPath: () => dataPath,
-  default: () => index_default,
-  defineReactiveView: () => defineReactiveView,
-  extendVnode: () => extendVnode,
-  getData: () => getData,
-  getDate: () => getDate,
-  getProps: () => getProps,
-  getReactiveViewComponent: () => getReactiveViewComponent,
-  safeRequest: () => safeRequest,
-  setData: () => setData,
-  setup: () => setup,
-  showComponent: () => showComponent,
-  useSubscription: () => useSubscription
-});
-module.exports = __toCommonJS(index_exports);
-var import_object_manager2 = __toESM(require("@razaman2/object-manager"));
-
-// src/Subscription.ts
-var Subscription = class _Subscription {
-  subscriptions = [];
-  data = {};
-  static create() {
-    return new _Subscription();
-  }
-  subscribe(name, handler, data) {
-    if (this.isNameAvailable(name)) {
-      this.subscriptions.push({
-        name,
-        handler
-      });
-      this.data[name] = data;
-    }
-    return this;
-  }
-  replace(name, handler, data) {
-    this.unsubscribe(name);
-    return this.subscribe(name, handler, data);
-  }
-  unsubscribe(param1) {
-    if (!Array.isArray(param1)) {
-      param1 = param1 ? [param1] : [];
-    }
-    const log = (name) => {
-      return console.log(`%cUnsubscribed From Subscription (${name})`, "background-color: yellow; color: green; font-weight: bold; padding: 3px;");
-    };
-    if (param1.length) {
-      param1.forEach((name) => {
-        const subscription = this.find(name);
-        if (subscription) {
-          subscription.handler();
-          this.remove(subscription);
-          log(name);
-        }
-      });
-    } else {
-      this.subscriptions.forEach((subscription) => {
-        subscription.handler();
-        log(subscription.name);
-      });
-      this.subscriptions = [];
-    }
-    return this;
-  }
-  size() {
-    return this.subscriptions.length;
-  }
-  hasSubscription(name) {
-    return Boolean(this.find(name));
-  }
-  remove(subscription) {
-    this.subscriptions.splice(this.subscriptions.indexOf(subscription), 1);
-  }
-  find(name) {
-    return this.subscriptions.find((subscription) => {
-      return subscription.name === name;
-    });
-  }
-  isNameAvailable(name) {
-    if (this.hasSubscription(name)) {
-      throw new Error(`There is already a subscription called "${name}".`);
-    } else {
-      return true;
-    }
-  }
-  registrations() {
-    return this.subscriptions;
-  }
-  get(name) {
-    const subscription = this.find(name);
-    if (subscription) {
-      return subscription;
-    } else {
-      throw new Error(`Subscription "${name}" doesn't exist!`);
-    }
-  }
-};
-
-// src/Subscriptions.ts
-var Subscriptions = class _Subscriptions extends Subscription {
-  static subscriptions = _Subscriptions.create();
-  static get() {
-    return this.subscriptions;
-  }
-};
-
-// src/ReactiveView.ts
-var import_object_manager = __toESM(require("@razaman2/object-manager"));
-var import_data_manager = __toESM(require("@razaman2/data-manager"));
-var import_vue = require("vue");
-
-// package.json
-var package_default = {
-  name: "@razaman2/reactive-view",
-  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: "vitest run",
-    "test:watch": "vitest",
-    pr: "sh pr.sh"
-  },
-  keywords: [
-    "vue",
-    "vue-helper",
-    "reactive-view",
-    "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.12",
-    "@razaman2/event-emitter": "^2.1.1",
-    "@razaman2/object-manager": "^3.4.7",
-    "date-fns": "^4.1.0",
-    "date-fns-tz": "^3.2.0",
-    "tailwind-merge": "^3.5.0",
-    uuid: "^13.0.0"
-  },
-  peerDependencies: {
-    vue: ">=3.0.0"
-  },
-  devDependencies: {
-    "@types/uuid": "^11.0.0",
-    tsup: "^8.5.1",
-    typescript: "^5.9.3",
-    vitest: "^4.1.2"
-  },
-  publishConfig: {
-    access: "public"
-  },
-  files: [
-    "dist"
-  ]
-};
-
-// src/ReactiveView.ts
-var setup = {
-  type: Function,
-  default: (parent = {}, self = {}) => self,
-  ReactiveView: true
-};
-var ReactiveView_default = {
-  props: {
-    setup: {},
-    beta: [Boolean, String],
-    ReactiveView: {
-      type: Boolean,
-      default: true
-    },
-    instance: { default: (0, import_vue.ref)() },
-    notifications: Object,
-    subscriptions: Object,
-    beforeSetData: Function,
-    data: { default: (0, import_vue.reactive)({}) },
-    defaultData: {},
-    getDefaultData: {
-      type: Function,
-      default: (data) => data
-    },
-    model: {},
-    defer: {},
-    logging: {
-      validator: (logging) => {
-        return ["Boolean"].includes(logging.constructor.name);
-      }
-    },
-    modelName: {
-      type: String,
-      default: "ReactiveView"
-    },
-    debug: {
-      type: Boolean,
-      default: false
-    },
-    state: { default: (0, import_vue.reactive)({}) }
-  },
-  setup(props, context) {
-    const subscriptions = [];
-    (0, import_vue.onBeforeUnmount)(() => subscriptions.forEach((subscription) => subscription()));
-    const diff = (before, after) => {
-      const changed = (0, import_vue.ref)(false);
-      const paths = Array.from(new Set(before.paths().concat(after.paths())));
-      const changes = paths.reduce((changes2, path) => {
-        if (before.get(path) !== after.get(path)) {
-          changes2.set(path, after.get(path));
-          changed.value = true;
-        }
-        return changes2;
-      }, import_object_manager.default.on({}));
-      return { before: before.get(), after: after.get(), changes: changes.get(), changed: changed.value };
-    };
-    const dataPath2 = (path) => {
-      const handler = context.attrs["data:path"];
-      return typeof handler === "function" ? handler(path) : path;
-    };
-    const template = (component, vue2) => {
-      return (0, import_vue.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 = (0, import_vue.ref)(false);
-    const isReady = (0, import_vue.ref)(false);
-    const defer = (0, import_vue.ref)(typeof props.defer === "function" ? props.defer() : props.defer);
-    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 = (0, import_vue.getCurrentInstance)();
-    const defaultData = props.getDefaultData(
-      "defaultData" in vue.vnode.props ? vue.vnode.props.defaultData : "data" in vue.vnode.props ? Array.isArray((0, import_vue.unref)(vue.vnode.props.data)) ? [] : {} : {}
-    );
-    const datatype = Array.isArray(defaultData) ? [] : {};
-    const beta = () => {
-      const emit = (after, before) => {
-        if (vue && vue.vnode.el) {
-          const event = new CustomEvent("data:emit", {
-            bubbles: true,
-            // Key: allows it to travel up
-            composed: true,
-            // Key: allows it to cross Shadow DOM boundaries
-            detail: { before, after }
-            // Payload goes here
-          });
-          access(component).model.setData(after);
-          vue.vnode.el.dispatchEvent(event);
-        }
-      };
-      const proxy = (data) => {
-        return new Proxy(data, {
-          get(target, key, receiver) {
-            if (["setData", "replaceData"].includes(key.toString())) {
-              return (...params) => {
-                const beforeSetData = access(component).beforeSetData ?? props.beforeSetData;
-                if (typeof beforeSetData === "function") {
-                  const before = import_object_manager.default.on(target.getData());
-                  const after = params.length ? import_object_manager.default.on(datatype).set(...params) : import_object_manager.default.on(datatype).set(defaultData);
-                  const diff2 = access(component).diff(before, after);
-                  if (beforeSetData(diff2, target)) {
-                    target[key](...params);
-                  }
-                } else {
-                  target[key](...params);
-                }
-                return target;
-              };
-            } else {
-              return Reflect.get(target, key, receiver);
-            }
-          }
-        });
-      };
-      const normalize = (data) => {
-        if ((0, import_vue.isRef)(data) || (0, import_vue.isReactive)(data)) {
-          return data;
-        } else if (isFunctionData || isAsyncData) {
-          return (0, import_vue.ref)(datatype);
-        } else {
-          const props2 = "data" in vue.vnode.props;
-          try {
-            if (["Array", "Object"].includes(data?.constructor?.name)) {
-              return (0, import_vue.ref)(data);
-            } else {
-              return (0, import_vue.ref)(props2 ? { "": data } : datatype);
-            }
-          } catch {
-            return (0, import_vue.ref)(props2 ? { "": data } : datatype);
-          }
-        }
-      };
-      const config = {
-        data: normalize(vue.vnode.props?.data),
-        defaultData: import_object_manager.default.on(defaultData).clone(),
-        notifications: props.notifications,
-        subscriptions: props.subscriptions,
-        name: props.modelName,
-        logging: props.logging
-      };
-      const model = props.model ? typeof props.model === "function" ? props.model(config) : props.model : import_data_manager.default.setConfig({ beforeGetData: (data) => (0, import_vue.isRef)(data) ? (0, import_vue.unref)(data) : data }, config);
-      const component = (0, import_vue.ref)({ parent: { self: vue.proxy }, self: { template, diff, emit, dataPath: dataPath2, model: proxy(model), isValid } });
-      if (context.attrs["onUpdate:model"] || context.attrs["update:model"]) {
-        const config2 = {
-          callback: typeof context.attrs["onUpdate:model"] === "function" ? context.attrs["onUpdate:model"] : context.attrs["update:model"],
-          options: {
-            immediate: context.attrs["model:immediate"],
-            deep: context.attrs["model:deep"],
-            once: context.attrs["model:once"]
-          }
-        };
-        const source = () => import_object_manager.default.on(model.getData()).clone();
-        subscriptions.push((0, import_vue.watch)(source, (after, before) => {
-          const diff2 = access(component).diff(import_object_manager.default.on(before), import_object_manager.default.on(after));
-          if (props.debug) {
-            console.warn(`[${props.modelName}]:model`, { diff: diff2, before, after });
-          }
-          if (diff2.changed) {
-            config2.callback(diff2, { component });
-          }
-        }, config2.options));
-      }
-      setTimeout(async () => {
-        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((0, import_vue.watch)(source, async (after, before) => {
-            const diff2 = access(component).diff(import_object_manager.default.on(before), import_object_manager.default.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 () => {
-        isReady.value = await defer.value ?? true;
-      });
-      component.value = [access(component)].reduce((options, parent) => {
-        while (parent) {
-          if (typeof parent.setup === "function") {
-            options = { parent: options, self: parent.setup(component, options) ?? {} };
-            if (access(parent.$parent).ReactiveView) {
-              break;
-            } else {
-              parent = access(parent.$parent);
-            }
-          } else {
-            break;
-          }
-        }
-        return options;
-      }, component.value);
-      props.instance.value = typeof props.instance === "function" ? props.instance(component.value) : component.value;
-      return (vue2) => {
-        if (isReady.value) {
-          return access(component).template(component, vue2);
-        } else {
-          return context.slots.loading?.({ component });
-        }
-      };
-    };
-    const current = () => {
-      const emit = (after, before) => {
-        if (vue && vue.vnode.el) {
-          const event = new CustomEvent("data:emit", {
-            bubbles: true,
-            // Key: allows it to travel up
-            composed: true,
-            // Key: allows it to cross Shadow DOM boundaries
-            detail: { before, after }
-            // Payload goes here
-          });
-          vue.vnode.el.dispatchEvent(event);
-        }
-      };
-      const normalize = (data) => {
-        if (props.debug) {
-          console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData, isRef: (0, import_vue.isRef)(data), isReactive: (0, import_vue.isReactive)(data) });
-        }
-        if ((0, import_vue.isReactive)(data)) {
-          return data;
-        } else {
-          if ((0, import_vue.isRef)(data) || isFunctionData || isAsyncData) {
-            return (0, import_vue.reactive)(datatype);
-          } else {
-            const props2 = "data" in vue.vnode.props;
-            try {
-              if (["Array", "Object"].includes(data?.constructor?.name)) {
-                return (0, import_vue.reactive)(props2 ? data : datatype);
-              } else {
-                return (0, import_vue.reactive)(props2 ? { "": data } : datatype);
-              }
-            } catch {
-              return (0, import_vue.reactive)(props2 ? { "": data } : datatype);
-            }
-          }
-        }
-      };
-      const config = {
-        data: props.beta ? normalize(vue.vnode.props?.data) : (0, import_vue.reactive)(import_object_manager.default.on(
-          isAsyncData || 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,
-        subscriptions: props.subscriptions,
-        name: props.modelName,
-        logging: props.logging
-      };
-      const model = new Proxy(props.model ? typeof props.model === "function" ? props.model(config) : props.model : new import_data_manager.default(config), {
-        get(target, key, receiver) {
-          if (["setData", "replaceData"].includes(key.toString())) {
-            return (...params) => {
-              const beforeSetData = access(component).beforeSetData ?? props.beforeSetData;
-              if (typeof beforeSetData === "function") {
-                const before = import_object_manager.default.on(target.getData());
-                const after = params.length ? import_object_manager.default.on(datatype).set(...params) : import_object_manager.default.on(datatype).set(defaultData);
-                if (beforeSetData(access(component).diff(before, after), target)) {
-                  target[key](...params);
-                }
-              } else {
-                target[key](...params);
-              }
-              return target;
-            };
-          } else {
-            return Reflect.get(target, key, receiver);
-          }
-        }
-      });
-      const component = (0, import_vue.ref)({ parent: { self: vue.proxy }, self: { template, model, diff, emit, dataPath: dataPath2, isValid } });
-      if (props.debug) {
-        console.warn("[ReactiveView]:", { props, context, vue, defer, config, model, component, datatype, defaultData, isValid, isReady, isFunctionData, isAsyncFunctionData, isAsyncData });
-      }
-      const watchDataProp = (dataProp) => {
-        const config2 = typeof context.attrs["onUpdate:data"] === "function" ? { callback: context.attrs["onUpdate:data"] } : {
-          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((0, import_vue.watch)(isFunctionData || (0, import_vue.isRef)(dataProp) || (0, import_vue.isReactive)(dataProp) ? dataProp : () => dataProp, (after, before) => {
-          if (typeof config2.callback === "function") {
-            model.replaceData(config2.callback(access(component).diff(import_object_manager.default.on(before), import_object_manager.default.on(after)), { component }) ?? after);
-          } else {
-            model.replaceData(after);
-          }
-        }, config2.options));
-      };
-      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({
-            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 });
-        }
-        subscriptions.push((0, import_vue.watch)(() => import_object_manager.default.on(model.getData()).clone(), (after, before) => {
-          config2.callback(access(component).diff(import_object_manager.default.on(before), import_object_manager.default.on(after)), { component });
-        }, config2.options));
-      }
-      if (props.beta) {
-        const isRefData = (0, import_vue.isRef)(props.data);
-        if (isRefData || isFunctionData || isAsyncData) {
-          setTimeout(async () => {
-            const [data] = isAsyncData ? await Promise.all([
-              isAsyncFunctionData ? props.data() : props.data,
-              defer.value ?? true
-            ]) : [props.data];
-            subscriptions.push((0, import_vue.watch)(isRefData ? data : isFunctionData ? data : typeof data === "function" ? data : () => data, (after, before) => {
-              if (before !== void 0 || after !== void 0) {
-                const callback = context.attrs["data:callback"];
-                if (typeof callback === "function") {
-                  const diff2 = access(component).diff(import_object_manager.default.on(before), import_object_manager.default.on(after));
-                  model.replaceData(callback(diff2, { component }) ?? after);
-                } else {
-                  model.replaceData(after);
-                }
-              }
-            }, {
-              immediate: context.attrs["data:immediate"] ?? true,
-              deep: context.attrs["data:deep"] ?? true,
-              once: context.attrs["data:once"]
-            }));
-          });
-        }
-      } else {
-        setTimeout(async () => {
-          const [data] = await Promise.all([
-            isAsyncFunctionData ? props.data() : props.data,
-            defer.value ?? true
-          ]);
-          watchDataProp(data);
-        });
-      }
-      setTimeout(async () => {
-        isReady.value = await defer.value ?? true;
-      });
-      component.value = [access(component)].reduce((options, parent) => {
-        while (parent) {
-          if (typeof parent.setup === "function") {
-            options = { parent: options, self: parent.setup(component, options) ?? {} };
-            if (access(parent.$parent).ReactiveView) {
-              break;
-            } else {
-              parent = access(parent.$parent);
-            }
-          } else {
-            break;
-          }
-        }
-        return options;
-      }, component.value);
-      props.instance.value = typeof props.instance === "function" ? props.instance(component.value) : component.value;
-      return (vue2) => {
-        if (isReady.value) {
-          return access(component).template(component, vue2);
-        } else {
-          return context.slots.loading?.({ component });
-        }
-      };
-    };
-    return props.beta === "next" ? beta() : current();
-  }
-};
-
-// src/index.ts
-var import_vue2 = require("vue");
-var import_date_fns_tz = require("date-fns-tz");
-var import_tailwind_merge = require("tailwind-merge");
-var ObjectManager2 = import_object_manager2.default.default || import_object_manager2.default;
-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) => {
-    const { message } = request.loading ?? {};
-    if (request.loading) {
-      request.loading.status = true;
-      if (request.message) {
-        request.loading.message = request.message;
-      }
-    }
-    try {
-      resolve(await request.try());
-    } catch (e) {
-      if (request.alternative ?? true) {
-        resolve(request.catch ? await request.catch(e) : console.log(e));
-      }
-    } finally {
-      await request.finally?.();
-      if (request.loading) {
-        request.loading.status = false;
-      }
-      if (request.loading && message) {
-        request.loading.message = message;
-      }
-      await request.complete?.();
-    }
-  });
-}
-function getProps(props = {}, param2) {
-  const exclude = Array.isArray(param2) || typeof param2 === "string" ? param2 : param2.exclude;
-  const exclusions = (Array.isArray(exclude) ? exclude : [exclude]).join("|");
-  const include = param2.include ?? {};
-  return Object.entries(include).reduce((props2, [key, val]) => {
-    props2[key] = val;
-    return props2;
-  }, Object.entries(props).reduce((props2, [key, val]) => {
-    if (!RegExp(`(^|\\|)${key}($|\\|)`, "i").test(exclusions)) {
-      props2[key] = val;
-    }
-    return props2;
-  }, {}));
-}
-function getReactiveViewComponent(component, options = {}) {
-  const model = (component2) => {
-    try {
-      return (component2.type || component2).props.hasOwnProperty("model");
-    } catch {
-      return false;
-    }
-  };
-  const props = getProps(options, "setup");
-  const slots = typeof component === "function" ? component : () => {
-    return (component.type || component).setup ? (0, import_vue2.createVNode)(component, component.setup ? {} : props) : component;
-  };
-  return model(component) ? (0, import_vue2.createVNode)(component, props) : (0, import_vue2.createVNode)(ReactiveView_default, props, slots);
-}
-function getDate(param1, param2) {
-  const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
-  const format = "MM/dd/yyyy h:mm a";
-  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();
-    } catch (e) {
-      return /* @__PURE__ */ new Date();
-    }
-  };
-  return (0, import_date_fns_tz.formatInTimeZone)(datetime(), options.timezone, options.format);
-}
-function access(view = {}, alternative) {
-  const resolve = (target) => {
-    return new Proxy((0, import_vue2.toRaw)(target), {
-      get(target2, key) {
-        const component = { tree: target2 };
-        do {
-          if (key in component.tree) {
-            return component.tree[key];
-          } else if ("self" in component.tree && key in component.tree.self) {
-            return component.tree.self[key];
-          } else {
-            component.tree = "parent" in component.tree && component.tree.parent;
-          }
-        } while (component.tree);
-        try {
-          return new alternative();
-        } catch {
-          return alternative;
-        }
-      }
-    });
-  };
-  try {
-    const component = (0, import_vue2.unref)(typeof view === "function" ? view() : view) ?? {};
-    return resolve("instance" in component ? component.instance : component);
-  } catch {
-    return resolve(view);
-  }
-}
-function useSubscription() {
-  const subscriptions = [];
-  const subscription = Subscriptions.get();
-  return {
-    addSubscription(name, handler = () => false, data) {
-      subscription.subscribe(name, handler, data);
-      subscriptions.push(() => subscription.unsubscribe(name));
-    },
-    replaceSubscription(name, handler = () => false, data) {
-      subscription.replace(name, handler, data);
-      subscriptions.push(() => subscription.unsubscribe(name));
-    },
-    removeSubscriptions() {
-      subscriptions.forEach((subscription2) => safeRequest({
-        try: () => subscription2()
-      }));
-    },
-    removeSubscription(name) {
-      subscription.unsubscribe(name);
-    },
-    hasSubscription(name) {
-      return subscription.hasSubscription(name);
-    },
-    subscriptions,
-    subscription
-  };
-}
-var Prop = ({ default: value, type, validator, required } = {}) => {
-  const types1 = Array.isArray(type) ? type : [type ?? Array];
-  const types2 = types1.includes(Object) ? types1 : types1.concat(Object);
-  return {
-    ...value ? { default: (0, import_vue2.isRef)(value) || (0, import_vue2.isReactive)(value) ? value : (0, import_vue2.ref)(value) } : {},
-    required,
-    validator: (value2) => {
-      try {
-        return validator ? validator((0, import_vue2.unref)(value2)) : Array.from(new Set(types2.map((type2) => {
-          return typeof type2 === "function" ? type2().constructor.name : type2;
-        }))).includes((0, import_vue2.unref)(value2).constructor.name);
-      } catch {
-        return !required;
-      }
-    }
-  };
-};
-function StyleParser(styles = {}) {
-  const transform = (style, status = true) => {
-    const remove = style.split(/(-{[^}]+})/);
-    return remove.reduce((object, style2) => {
-      const remove2 = /-{(.+?)}/.exec(style2);
-      (remove2 ? remove2[1] ?? 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 {
-      ...acc,
-      ...transform(styles2, value)
-    };
-  }, {});
-}
-function MergeStyles(...params) {
-  return new Proxy(params.reduce((styles, style, index, items) => {
-    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]) => {
-        return val ? styles2.concat(key2) : styles2;
-      }, []);
-      if (key === "string") {
-        return styles.join(" ");
-      } else if (key === "array") {
-        return styles;
-      } else {
-        return Reflect.get(target, key, receiver);
-      }
-    }
-  });
-}
-var extendVnode = (component, element) => {
-  return new Proxy(access(component), {
-    get: (target, key) => {
-      const getVnode = () => {
-        try {
-          return target[key]();
-        } catch {
-          throw new Error(`${key} does not exist as vnode on component.`);
-        }
-      };
-      const vnode = getVnode();
-      return (props = {}, slots) => {
-        const isFunctionClass = typeof props.class === "function";
-        const isFunctionStyle = typeof props.style === "function";
-        const { class: classes, style: styles, ...rest } = vnode.props ?? {};
-        const finalClasses = (0, import_tailwind_merge.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]) => {
-          if (!["class", "style", "setup"].includes(key2) && typeof value === "function") {
-            props2[key2] = value(vnode.props?.[key2]);
-          }
-          return props2;
-        }, props);
-        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);
-      };
-    }
-  });
-};
-function defineReactiveView(param1, param2) {
-  const instance = (0, import_vue2.ref)();
-  return (0, import_vue2.defineComponent)({
-    name: param1?.modelName,
-    props: { setup, ...param1 ? param1.props : {} },
-    setup() {
-      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?.slots === "function" ? param1.slots(component) : Array.isArray(param1?.slots) ? () => param1.slots : param1?.slots;
-        return (0, import_vue2.createVNode)(param2 ?? ReactiveView_default, {
-          ...props2,
-          ...Object.assign({}, props2, typeof setup2 === "function" ? {
-            setup: (self, parent) => setup2(self, parent, component)
-          } : {}),
-          instance
-        }, slots);
-      };
-    }
-  });
-}
-function showComponent(component, options = {}) {
-  if (options.router) {
-    console.warn("[ReactiveView]: Deprecated {router} option used with {showComponent()}. \nUse {plugins} option instead.");
-  }
-  if (!options.key || !document.getElementById(options.key)) {
-    const container = options.container || "app-dialogs";
-    const dialogs = document.getElementById(container) || document.createElement("div");
-    if (!dialogs.hasAttribute("id")) {
-      dialogs.setAttribute("id", container);
-      document.body.appendChild(dialogs);
-    }
-    const dialog = document.createElement("div");
-    const id = options.key ?? `dialog_${dialogs.children.length + 1}`;
-    dialog.setAttribute("id", id);
-    dialogs.appendChild(dialog);
-    const app = (0, import_vue2.createApp)(
-      {
-        setup() {
-          return () => component;
-        }
-      },
-      {
-        __cleanup__: () => {
-          document.querySelectorAll(`#${id}`).forEach((element) => element.remove());
-          app.unmount();
-        }
-      }
-    );
-    if (options.router) {
-      return app.use(options.router).mount(`#${id}`);
-    } else if (options.plugins) {
-      return options.plugins.reduce((app2, plugin) => {
-        return app2.use(...Array.isArray(plugin) ? plugin : [plugin]);
-      }, app).mount(`#${id}`);
-    } else {
-      return app.mount(`#${id}`);
-    }
-  }
-}
-var getData = (component, path, alternative) => {
-  const vue = access(component);
-  const data = ObjectManager2.on(componentState(vue));
-  if (path) {
-    return data.get(dataPath(vue, path), alternative);
-  } else {
-    return data.get();
-  }
-};
-var setData = (component, data, path) => {
-  const vue = access(component);
-  const diff = {
-    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 (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;
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  MergeStyles,
-  Prop,
-  StyleParser,
-  access,
-  dataPath,
-  defineReactiveView,
-  extendVnode,
-  getData,
-  getDate,
-  getProps,
-  getReactiveViewComponent,
-  safeRequest,
-  setData,
-  setup,
-  showComponent,
-  useSubscription
-});
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require(`@razaman2/object-manager`);c=s(c);let l=require(`@razaman2/data-manager`);l=s(l);let u=require(`vue`),d=require(`date-fns-tz`),f=require(`tailwind-merge`);var p=class e{subscriptions=[];data={};static create(){return new e}subscribe(e,t,n){return this.isNameAvailable(e)&&(this.subscriptions.push({name:e,handler:t}),this.data[e]=n),this}replace(e,t,n){return this.unsubscribe(e),this.subscribe(e,t,n)}unsubscribe(e){Array.isArray(e)||(e=e?[e]:[]);let t=e=>console.log(`%cUnsubscribed From Subscription (${e})`,`background-color: yellow; color: green; font-weight: bold; padding: 3px;`);return e.length?e.forEach(e=>{let n=this.find(e);n&&(n.handler(),this.remove(n),t(e))}):(this.subscriptions.forEach(e=>{e.handler(),t(e.name)}),this.subscriptions=[]),this}size(){return this.subscriptions.length}hasSubscription(e){return!!this.find(e)}remove(e){this.subscriptions.splice(this.subscriptions.indexOf(e),1)}find(e){return this.subscriptions.find(t=>t.name===e)}isNameAvailable(e){if(this.hasSubscription(e))throw Error(`There is already a subscription called "${e}".`);return!0}registrations(){return this.subscriptions}get(e){let t=this.find(e);if(t)return t;throw Error(`Subscription "${e}" doesn't exist!`)}},m=class e extends p{static subscriptions=e.create();static get(){return this.subscriptions}},h={name:`@razaman2/reactive-view`,version:`0.1.0-beta.17`,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:`vue-tsc -p tsconfig.build.json && vite build`,lint:`eslint "src/**/*.ts" "tests/**/*.ts"`,"lint:fix":`eslint "src/**/*.ts" "tests/**/*.ts" --fix`,format:`prettier --write "src/**/*.ts" "tests/**/*.ts"`,typecheck:`tsc`,test:`vitest run`,"test:watch":`vitest`,pr:`sh pr.sh`},keywords:[`vue`,`vue-helper`,`reactive-view`,`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.12`,"@razaman2/event-emitter":`^2.1.1`,"@razaman2/object-manager":`^3.4.7`,"date-fns":`^4.1.0`,"date-fns-tz":`^3.2.0`,"tailwind-merge":`^3.5.0`},peerDependencies:{vue:`>=3.0.0`},devDependencies:{"@eslint/js":`^10.0.1`,"@stylistic/eslint-plugin":`^5.10.0`,"@typescript-eslint/eslint-plugin":`^8.59.2`,"@typescript-eslint/parser":`^8.59.2`,"@vitejs/plugin-vue":`^6.0.6`,"@vitejs/plugin-vue-jsx":`^5.1.5`,"@vue/server-renderer":`^3.5.34`,"@vue/test-utils":`^2.4.10`,eslint:`^10.3.0`,"eslint-config-prettier":`^10.1.8`,"eslint-plugin-prettier":`^5.5.5`,"eslint-plugin-vue":`^10.9.1`,jsdom:`^29.1.1`,prettier:`^3.8.3`,typescript:`^5.9.3`,"typescript-eslint":`^8.59.2`,vite:`^8.0.11`,vitest:`^4.1.5`,"vue-tsc":`^3.2.8`},publishConfig:{access:`public`},files:[`dist`]},g={type:Function,default:(e={},t={})=>t,ReactiveView:!0},_={props:{setup:{},beta:[Boolean,String],ReactiveView:{type:Boolean,default:!0},instance:{default:(0,u.ref)()},notifications:Object,subscriptions:Object,beforeSetData:Function,data:{default:(0,u.reactive)({})},defaultData:{},getDefaultData:{type:Function,default:e=>e},model:{},defer:{},logging:{validator:e=>[`Boolean`].includes(e.constructor.name)},modelName:{type:String,default:`ReactiveView`},debug:{type:Boolean,default:!1},state:{default:(0,u.reactive)({})}},setup(e,t){let n=[];(0,u.onBeforeUnmount)(()=>n.forEach(e=>e()));let r=(e,t)=>{let n=(0,u.ref)(!1),r=Array.from(new Set(e.paths().concat(t.paths()))).reduce((r,i)=>(e.get(i)!==t.get(i)&&(r.set(i,t.get(i)),n.value=!0),r),c.default.on({}));return{before:e.get(),after:t.get(),changes:r.get(),changed:n.value}},i=e=>{let n=t.attrs[`data:path`];return typeof n==`function`?n(e):e},a=(n,r)=>(0,u.createVNode)(`div`,t.slots.default?t.attrs:{style:{color:`red`,textAlign:`center`},...t.attrs},t.slots.default?t.slots.default({component:n,vue:r,props:e,context:t}):`${e.modelName}: ${h.name}@${h.version}`),o=(0,u.ref)(!1),s=(0,u.ref)(!1),d=(0,u.ref)(typeof e.defer==`function`?e.defer():e.defer),f=[`Function`].includes(e.data?.constructor.name),p=[`AsyncFunction`].includes(e.data?.constructor.name),m=[`Promise`].includes(e.data?.constructor.name)||p,g=(0,u.getCurrentInstance)(),_=e.getDefaultData(`defaultData`in g.vnode.props?g.vnode.props.defaultData:`data`in g.vnode.props&&Array.isArray((0,u.unref)(g.vnode.props.data))?[]:{}),v=Array.isArray(_)?[]:{};return e.beta===`current`?(()=>{let h=(e,t)=>{if(g&&g.vnode.el){let n=new CustomEvent(`data:emit`,{bubbles:!0,composed:!0,detail:{before:t,after:e}});g.vnode.el.dispatchEvent(n)}},y={data:e.beta?(t=>{if(e.debug&&console.warn(`[ReactiveView]: using beta props data in [${e.modelName}] component`,{vue:g,data:t,defaultData:_,isRef:(0,u.isRef)(t),isReactive:(0,u.isReactive)(t)}),(0,u.isReactive)(t))return t;if((0,u.isRef)(t)||f||m)return(0,u.reactive)(v);{let e=`data`in g.vnode.props;try{return[`Array`,`Object`].includes(t?.constructor?.name)?(0,u.reactive)(e?t:v):(0,u.reactive)(e?{"":t}:v)}catch{return(0,u.reactive)(e?{"":t}:v)}}})(g.vnode.props?.data):(0,u.reactive)(c.default.on(m||f||(0,u.isRef)(e.data)||(0,u.isReactive)(e.data)?v:`data`in g.vnode.props?e.data:v).clone()),defaultData:c.default.on(_).clone(),notifications:e.notifications,subscriptions:e.subscriptions,name:e.modelName,logging:e.logging},b=new Proxy(e.model?typeof e.model==`function`?e.model(y):e.model:new l.default(y),{get(t,n,r){return[`setData`,`replaceData`].includes(n.toString())?(...r)=>{let i=O(x).beforeSetData??e.beforeSetData;if(typeof i==`function`){let e=c.default.on(t.getData()),a=r.length?c.default.on(v).set(...r):c.default.on(v).set(_);i(O(x).diff(e,a),t)&&t[n](...r)}else t[n](...r);return t}:Reflect.get(t,n,r)}}),x=(0,u.ref)({parent:{self:g.proxy},self:{template:a,model:b,diff:r,emit:h,dataPath:i,isValid:o}});e.debug&&console.warn(`[ReactiveView]:`,{props:e,context:t,vue:g,defer:d,config:y,model:b,component:x,datatype:v,defaultData:_,isValid:o,isReady:s,isFunctionData:f,isAsyncFunctionData:p,isAsyncData:m});let S=e=>{let r=typeof t.attrs[`onUpdate:data`]==`function`?{callback:t.attrs[`onUpdate:data`]}:{callback:(t.attrs[`onUpdate:data`]??{}).callback??t.attrs[`data:callback`],options:Object.assign({deep:t.attrs[`data:deep`]??!0,...t.attrs[`data:immediate`]?{immediate:t.attrs[`data:immediate`]}:{},...t.attrs[`data:once`]?{once:t.attrs[`data:once`]}:{}},(t.attrs[`onUpdate:data`]??{}).options)};t.attrs[`data:log`]&&console.warn(`[ReactiveView]:data`,{config:r,dataProp:e}),n.push((0,u.watch)(f||(0,u.isRef)(e)||(0,u.isReactive)(e)?e:()=>e,(e,t)=>{typeof r.callback==`function`?b.replaceData(r.callback(O(x).diff(c.default.on(t),c.default.on(e)),{component:x})??e):b.replaceData(e)},r.options))};if(t.attrs[`onUpdate:model`]||t.attrs[`update:model`]){let e=typeof t.attrs[`onUpdate:model`]==`function`?{callback:t.attrs[`onUpdate:model`],options:Object.assign({deep:t.attrs[`model:deep`]??!0,...t.attrs[`model:immediate`]?{immediate:t.attrs[`model:immediate`]}:{},...t.attrs[`model:once`]?{once:t.attrs[`model:once`]}:{}},(t.attrs[`onUpdate:model`]??{}).options)}:t.attrs[`onUpdate:model`]??{};t.attrs[`model:log`]&&console.warn(`[ReactiveView]:model`,{config:e}),n.push((0,u.watch)(()=>c.default.on(b.getData()).clone(),(t,n)=>{e.callback(O(x).diff(c.default.on(n),c.default.on(t)),{component:x})},e.options))}if(e.beta){let r=(0,u.isRef)(e.data);(r||f||m)&&setTimeout(async()=>{let[i]=m?await Promise.all([p?e.data():e.data,d.value??!0]):[e.data];n.push((0,u.watch)(r||f||typeof i==`function`?i:()=>i,(e,n)=>{if(n!==void 0||e!==void 0){let r=t.attrs[`data:callback`];if(typeof r==`function`){let t=O(x).diff(c.default.on(n),c.default.on(e));b.replaceData(r(t,{component:x})??e)}else b.replaceData(e)}},{immediate:t.attrs[`data:immediate`]??!0,deep:t.attrs[`data:deep`]??!0,once:t.attrs[`data:once`]}))})}else setTimeout(async()=>{let[t]=await Promise.all([p?e.data():e.data,d.value??!0]);S(t)});return setTimeout(async()=>{s.value=await d.value??!0}),x.value=[O(x)].reduce((e,t)=>{for(;t&&typeof t.setup==`function`&&(e={parent:e,self:t.setup(x,e)??{}},!O(t.$parent).ReactiveView);)t=O(t.$parent);return e},x.value),e.instance.value=typeof e.instance==`function`?e.instance(x.value):x.value,e=>s.value?O(x).template(x,e):t.slots.loading?.({component:x})})():(()=>{let h=(e,t)=>{if(g&&g.vnode.el){let n=new CustomEvent(`emit:data`,{bubbles:!0,composed:!0,detail:{before:t,after:e}});O(C).setData(e),g.vnode.el.dispatchEvent(n),g.vnode.el.dispatchEvent(new CustomEvent(`data:emit`,{bubbles:!0,composed:!0,detail:{before:t,after:e}}))}},y=e=>O(C).model.setData(e),b=t=>new Proxy(t,{get(t,n,r){return[`setData`,`replaceData`].includes(n.toString())?(...r)=>{let i=O(C).beforeSetData??e.beforeSetData;if(typeof i==`function`){let e=c.default.on(t.getData()),a=r.length?c.default.on(v).set(...r):c.default.on(v).set(_);i(O(C).diff(e,a),t)&&t[n](...r)}else t[n](...r);return t}:Reflect.get(t,n,r)}}),x={data:(e=>{if((0,u.isRef)(e)||(0,u.isReactive)(e))return e;if(f||m)return(0,u.ref)(v);{let t=`data`in g.vnode.props;try{return[`Array`,`Object`].includes(e?.constructor?.name)?(0,u.ref)(e):(0,u.ref)(t?{"":e}:v)}catch{return(0,u.ref)(t?{"":e}:v)}}})(g.vnode.props?.data),defaultData:c.default.on(_).clone(),notifications:e.notifications,subscriptions:e.subscriptions,name:e.modelName,logging:e.logging},S=e.model?typeof e.model==`function`?e.model(x):e.model:l.default.setConfig({beforeGetData:e=>(0,u.isRef)(e)?(0,u.unref)(e):e},x),C=(0,u.ref)({parent:{self:g.proxy},self:{template:a,diff:r,emit:h,setData:y,dataPath:i,model:b(S),isValid:o}});if(t.attrs[`onUpdate:model`]||t.attrs[`update:model`]){let r={callback:typeof t.attrs[`onUpdate:model`]==`function`?t.attrs[`onUpdate:model`]:t.attrs[`update:model`],options:{immediate:t.attrs[`model:immediate`],deep:t.attrs[`model:deep`],once:t.attrs[`model:once`]}};n.push((0,u.watch)(()=>c.default.on(S.getData()).clone(),(t,n)=>{let i=O(C).diff(c.default.on(n),c.default.on(t));e.debug&&console.warn(`[${e.modelName}]:model`,{diff:i,before:n,after:t}),i.changed&&r.callback(i,{component:C})},r.options))}return(0,u.nextTick)(async()=>{if(e.model!==!1){(f||m)&&!(`defaultData`in g.vnode.props)&&console.warn(`${e.modelName}: defaultData is required for promise or function data.`,e.data);let[r]=m?await Promise.all([p?e.data():e.data,d.value??!0]):[e.data],i=(0,u.isRef)(r)||(0,u.isReactive)(r),a=typeof r==`function`||i?r:()=>r;n.push((0,u.watch)(a,async(n,i)=>{let a=O(C).diff(c.default.on(i),c.default.on(n)),o=t.attrs[`data:callback`];e.debug&&console.warn(`[${e.modelName}]:data`,{diff:a,data:r,callback:o,props:e,context:t,component:C}),typeof o==`function`?o(a,{component:C}):S.replaceData(n)},{immediate:t.attrs[`data:immediate`]??!i,deep:t.attrs[`data:deep`],once:t.attrs[`data:once`]}))}}),(0,u.nextTick)(async()=>{s.value=await d.value??!0}),C.value=[O(C)].reduce((e,t)=>{for(;t&&typeof t.setup==`function`&&(e={parent:e,self:t.setup(C,e)??{}},!O(t.$parent).ReactiveView);)t=O(t.$parent);return e},C.value),e.instance.value=typeof e.instance==`function`?e.instance(C.value):C.value,e=>s.value?O(C).template(C,e):t.slots.loading?.({component:C})})()}};function v(e,t={}){let n=e=>{let n=t.id??`dialog_${e.children.length+1}`,r=document.createElement(`div`);return r.setAttribute(`id`,n),e.appendChild(r),r},r=e=>{let t=document.getElementById(e);if(t)return n(t);{let t=document.createElement(`div`);return t.setAttribute(`id`,e),document.body.appendChild(t),n(t)}},i=t.container||`app-dialogs`,a=r(i),o=(0,u.createVNode)({setup:()=>()=>e},{container:i,unmount:()=>{(0,u.render)(null,a),a.remove()}}),s=t.app??document.querySelector(`[data-v-app]`);try{o.appContext=s.__vue_app__._context,(0,u.render)(o,a)}catch{console.warn(`[ReactiveView]: showComponent called without an active app context.`)}}var y=P({modelName:`CustomButton`,props:{label:[Number,String],tag:{type:String,default:`button`},loading:{type:[Boolean,Function],default:!1},padding:{type:Boolean,default:!0},buttonClass:{},loadingClass:{}},setup(e,t,n){let r=typeof n.loading==`function`?n.loading:()=>n.loading,i=(0,u.ref)(!1);return(0,u.watchEffect)(()=>{i.value=r()}),{template:()=>(0,u.createVNode)(n.tag,{class:(0,f.twMerge)(M({"px-0 h-min":!n.padding,"btn uppercase rounded-lg text-sm font-normal leading-none":!0}).string,M(n.buttonClass).string)},{default:()=>[O(e).buttonLoading(),(0,u.createVNode)(`div`,{class:{hidden:i.value,contents:!0}},[O(e).buttonIcon(),n.$slots.default?n.$slots.default({component:e}):n.label])]}),buttonIcon:()=>{if(n.$slots.icon)return n.$slots.icon({component:e})},buttonLoading:()=>{if(i.value)return n.$slots.loading?n.$slots.loading({component:e}):(0,u.createVNode)(`span`,{class:M(`loading`,n.loadingClass)},null)}}}}),b=P({modelName:`CustomModal`,props:{title:{type:[Boolean,Number,String],default:`Modal Title`},persistent:{type:Boolean,default:!1},header:{type:Boolean,default:!0},actions:{type:Boolean,default:!0},ok:{type:Boolean,default:!0},cancel:{type:Boolean,default:!1},close:{type:Boolean,default:!0},show:{type:Boolean,default:!0},whenOk:{type:Function,default:()=>{}},whenCancel:{type:Function,default:()=>{}},whenClose:{type:Function,default:()=>{}},whenEscape:{type:Function,default:()=>{}},whenDismiss:{type:Function,default:()=>{}},whenRouteChange:{type:Function,default:()=>{}},class:{},headerClass:{},titleClass:{},actionsClass:{},backdropClass:{},timeout:{default:!1,validator:e=>typeof e==`number`||e===!1},modal:{type:Boolean,default:!1},id:[Number,String]},setup:(e,t,n)=>{(0,u.provide)(`dialog`,e);let r=(0,u.ref)(),i=(0,u.ref)(),a=document.getElementById(n.$attrs.container??`app-dialogs`),o=(0,u.computed)(()=>O(e).trigger??n.$slots.trigger),s=(0,u.computed)(()=>o.value?!1:n.show),c=(0,u.computed)(()=>!0),l=e=>{throw Error(e)},d=()=>(0,u.createVNode)(`div`,null,[(0,u.createVNode)(`dialog`,(0,u.mergeProps)({class:`modal`,ref:r},o.value||O(e).watch?{}:a?{id:a.lastChild?.id}:l(`Modal should be called with showComponent.ts | trigger element | trigger slot`)),[O(e).modalBox(),O(e).modalBackdrop()]),o.value?.({component:e})]),p=()=>(0,u.createVNode)(`div`,{class:(0,f.twMerge)(M(`modal-box flex flex-col p-0`,n.class).string,M(n.class).string)},[O(e).modalHeader(),O(e).modalContent(),O(e).modalActions()]),m=()=>n.$slots.default?n.$slots.default({component:e}):(0,u.createVNode)(`div`,{class:`px-4`},[(0,u.createTextVNode)(`No Content`)]),h=()=>(0,u.createVNode)(`div`,{class:(0,f.twMerge)(`modal-backdrop`,M({"pointer-events-none":n.persistent}).string,M(n.backdropClass).string),onClick:()=>O(e).hide(`backdrop`)},null),g=()=>{if(n.actions)return(0,u.createVNode)(`div`,{style:`margin: 0;`,class:(0,f.twMerge)(`modal-action px-4 pb-4`,M(n.actionsClass).string)},[O(e).okButton(),O(e).cancelButton()])},_=()=>{if(n.header)return(0,u.createVNode)(`div`,{class:(0,f.twMerge)(`flex items-center justify-between px-4 pt-4`,M(n.headerClass).string)},[O(e).title(),O(e).closeButton()])},v=()=>{if(n.close)return(0,u.createVNode)((0,u.resolveComponent)(`i-mdi-close`),{class:`cursor-pointer rounded-full text-xl transition duration-500 hover:scale-80 hover:ring`,onClick:async()=>{await n.whenClose(),O(e).hide(`close`)}},null)},b=()=>{if(n.ok)return(0,u.createVNode)(y,{label:`ok`,class:`btn-sm btn-success text-white`,onClick:()=>O(e).triggerOk(),disabled:!O(e).isValid},null)},x=()=>{if(n.cancel)return(0,u.createVNode)(y,{label:`cancel`,class:`btn-sm btn-error text-white`,onClick:async()=>{await n.whenCancel(),O(e).hide(`cancel`)}},null)},S=()=>{if([`String`,`Number`].includes(n.title.constructor.name))return(0,u.createVNode)(`h3`,{class:(0,f.twMerge)(`w-full text-center font-bold`,M(n.titleClass).string)},[n.title])},C=()=>r.value[n.modal?`showModal`:`show`](),w=e=>r.value.close(e),T=()=>r.value.open,E=e=>{n.$attrs.unmount?.(e),clearTimeout(i.value)};return setTimeout(()=>{let t=`open`;r.value&&(new MutationObserver(async()=>{if(O(e).showing())try{await(await import(`@razaman2/event-emitter`)).default.global().emit(`dialog:${t}`,{type:t,component:e,id:n.id})}finally{}}).observe(r.value,{attributes:!0,attributeFilter:[t]}),r.value.addEventListener(`close`,async t=>{let r=t.target.returnValue||`escape`;try{await(await import(`@razaman2/event-emitter`)).default.global().emit(`dialog:close`,{e:t,type:r,component:e,id:n.id})}finally{await n.whenDismiss({type:r}),E({type:r})}}),typeof n.timeout==`number`&&(i.value=setTimeout(()=>O(e).hide(`timeout`),n.timeout)),O(e).watch?(0,u.watch)(O(e).watch,t=>{r.value&&t?O(e).show():r.value&&O(e).hide()},{deep:!0}):s.value&&O(e).show()),document.addEventListener(`keydown`,async e=>{let t=e.key===`Escape`;n.persistent&&t?(e.stopPropagation(),e.preventDefault()):t&&await n.whenEscape()})}),{template:d,title:S,modalBox:p,modalHeader:_,modalContent:m,modalActions:g,modalBackdrop:h,closeButton:v,okButton:b,cancelButton:x,show:C,hide:w,showing:T,triggerOk:async()=>{await n.whenOk(O(e).model.getData()),O(e).hide(`ok`)},isValid:c,modalRef:r}}}),x={props:{setup:g,title:{type:String},description:{type:String},close:{type:Boolean,default:!0},timeout:{default:3e3,validator:e=>typeof e==`number`||e===!1}},setup(e,t){return e=>(0,u.createVNode)(C,{modelName:`CustomAlert`,setup:n=>{let r={default:(0,u.createVNode)(`path`,{"stroke-linecap":`round`,"stroke-linejoin":`round`,"stroke-width":`2`,d:`M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z`},null),"alert-info":(0,u.createVNode)(`path`,{"stroke-linecap":`round`,"stroke-linejoin":`round`,"stroke-width":`2`,d:`M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z`},null),"alert-success":(0,u.createVNode)(`path`,{"stroke-linecap":`round`,"stroke-linejoin":`round`,"stroke-width":`2`,d:`M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z`},null),"alert-warning":(0,u.createVNode)(`path`,{"stroke-linecap":`round`,"stroke-linejoin":`round`,"stroke-width":`2`,d:`M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z`},null),"alert-error":(0,u.createVNode)(`path`,{"stroke-linecap":`round`,"stroke-linejoin":`round`,"stroke-width":`2`,d:`M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z`},null)},i=/alert-(info|success|warning|error)/.exec(e.$attrs.class)?.shift();return e.timeout&&(0,u.onMounted)(()=>{setTimeout(()=>O(n).hide(`timeout`),e.timeout)}),{template:()=>(0,u.createVNode)(`div`,{role:`alert`,class:`alert`},[O(n).alertIcon(),(0,u.createVNode)(`div`,null,[O(n).alertTitle(),e.$slots.default?e.$slots.default({component:n}):O(n).alertDescription()]),O(n).alertClose()]),alertIcon:()=>(0,u.createVNode)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,class:{[i?`stroke-current`:`stroke-black`]:!0,"h-6 w-6 shrink-0":!0},fill:`none`,viewBox:`0 0 24 24`},[r[i]||r.default]),alertTitle:()=>(0,u.createVNode)(`h3`,{class:`font-bold`},[e.title]),alertDescription:()=>(0,u.createVNode)(`div`,{class:`text-xs`},[e.description]),alertClose:()=>{if(e.close)return(0,u.createVNode)((0,u.resolveComponent)(`i-mdi-close`),{id:`alert-close`,class:`text-xl cursor-pointer rounded-full hover:scale-80 hover:ring transition duration-500`,onClick:()=>O(n).hide(`close`)},null)},hide:n=>{e.$el.remove(),t.emit(`close`,n)}}}},e.$slots)}},S=c.default.default||c.default;console.log(`%c[ReactiveView]: ${h.version}`,`background-color: red; color: yellow;`);var C=_;async function w(e){let{message:t}=e.loading??{};e.loading&&(e.loading.status=!0,e.message&&(e.loading.message=e.message));try{return await e.try()}catch(t){if(e.alternative??!0)return e.catch?await e.catch(t):console.log(t)}finally{await e.finally?.(),e.loading&&(e.loading.status=!1),e.loading&&t&&(e.loading.message=t),await e.complete?.()}}function T(e={},t){let n=Array.isArray(t)||typeof t==`string`?t:t.exclude,r=(Array.isArray(n)?n:[n]).join(`|`),i=t.include??{};return Object.entries(i).reduce((e,[t,n])=>(e[t]=n,e),Object.entries(e).reduce((e,[t,n])=>(RegExp(`(^|\\|)${t}($|\\|)`,`i`).test(r)||(e[t]=n),e),{}))}function E(e,t={}){let n=e=>{try{let t=(e.type||e).props;return t&&Object.prototype.hasOwnProperty.call(t,`model`)}catch{return!1}},r=T(t,`setup`),i=typeof e==`function`?e:()=>(e.type||e).setup?(0,u.createVNode)(e,e.setup?{}:r):e;return n(e)?(0,u.createVNode)(e,r):(0,u.createVNode)(_,r,i)}function D(e,t){let n=Intl.DateTimeFormat().resolvedOptions().timeZone,r=typeof t==`string`?{format:t,timezone:n}:{format:t?.format??`MM/dd/yyyy h:mm a`,timezone:t?.timezone??n};return(0,d.formatInTimeZone)((()=>{try{return e instanceof Date?e:e.toDate()}catch{return new Date}})(),r.timezone,r.format)}function O(e={},t){let n=e=>new Proxy((0,u.toRaw)(e),{get(e,n){let r={tree:e};do if(n in r.tree)return r.tree[n];else if(`self`in r.tree&&n in r.tree.self)return r.tree.self[n];else r.tree=`parent`in r.tree&&r.tree.parent;while(r.tree);try{return new t}catch{return t}}});try{let t=(0,u.unref)(typeof e==`function`?e():e)??{};return n(`instance`in t?t.instance:t)}catch{return n(e)}}function k(){let e=[],t=m.get();return{addSubscription(n,r,i){t.subscribe(n,r,i),e.push(()=>t.unsubscribe(n))},replaceSubscription(n,r,i){t.replace(n,r,i),e.push(()=>t.unsubscribe(n))},removeSubscriptions(){e.forEach(e=>w({try:()=>e()}))},removeSubscription(e){t.unsubscribe(e)},hasSubscription(e){return t.hasSubscription(e)},subscriptions:e,subscription:t}}var A=({default:e,type:t,validator:n,required:r}={})=>{let i=Array.isArray(t)?t:[t??Array],a=i.includes(Object)?i:i.concat(Object);return{...e?{default:(0,u.isRef)(e)||(0,u.isReactive)(e)?e:(0,u.ref)(e)}:{},required:r,validator:e=>{try{return n?n((0,u.unref)(e)):Array.from(new Set(a.map(e=>typeof e==`function`?e().constructor.name:e))).includes((0,u.unref)(e).constructor.name)}catch{return!r}}}};function j(e={}){let t=(e,t=!0)=>e.split(/(-{[^}]+})/).reduce((e,n)=>{let r=/-{(.+?)}/.exec(n);return(r?r[1]??n:n).split(/\s+/).forEach(n=>{n&&Object.assign(e,{[n]:r?!1:t})}),e},{});return Array.isArray(e)?e.reduce((e,n)=>Object.assign(t(n),e),{}):typeof e==`string`?t(e):Object.entries(e).reduce((e,[n,r])=>({...e,...t(n,r)}),{})}function M(...e){return new Proxy(e.reduce((e,t,n,r)=>{let i=r[r.length-n-1]??{};return{...j(typeof i==`function`?i(r.slice(0,n-1)):i),...e}},{}),{get:(e,t,n)=>{let r=Object.entries(e).reduce((e,[t,n])=>n?e.concat(t):e,[]);return t===`string`?r.join(` `):t===`array`?r:Reflect.get(e,t,n)}})}var N=(e,t)=>new Proxy(O(e),{get:(e,n)=>{let r=(()=>{try{return e[n]()}catch{throw Error(`${n} does not exist as vnode on component.`)}})();return(e={},n)=>{let i=typeof e.class==`function`,a=typeof e.style==`function`,{class:o,style:s,...c}=r.props??{},l=(0,f.twMerge)(i?``:o,M(i?e.class(o):e.class).string),d=M(s,a?e.style(s):e.style),p=Object.entries(e).reduce((e,[t,n])=>(![`class`,`style`,`setup`].includes(t)&&typeof n==`function`&&(e[t]=n(r.props?.[t])),e),e),m=Object.assign(c,p,{class:l,style:d}),h=n?typeof n==`function`?n(r.children):n:r.children;return(0,u.h)([`undefined`].includes(typeof t)?r.type:t,m,h)}}});function P(e,t){let n=(0,u.ref)();return(0,u.defineComponent)({name:e?.modelName,props:{setup:g,...e?e.props:{}},setup(){let{setup:r,props:i,...a}=e??{};return i=>{let o=Object.entries(a).reduce((e,[t,r])=>Object.assign(e,{[t]:typeof r==`function`?r(i,n):r}),{}),s=typeof e?.slots==`function`?e.slots(i):Array.isArray(e?.slots)?()=>e.slots:e?.slots;return(0,u.createVNode)(t??_,{...o,...Object.assign({},o,typeof r==`function`?{setup:(e,t)=>r(e,t,i)}:{}),instance:n},s)}}})}var F=(e,t,n)=>{let r=O(e),i=S.on(L(r));return t?i.get(R(r,t),n):i.get()},I=(e,t,n)=>{let r=O(e),i={before:S.on(L(r)).clone(),after:n?S.on(L(r)).set(R(r,n),t).get():S.on(L(r)).set(t).get()};return`state`in r?i:r.$emit(`update:state`,i)},L=e=>(0,u.unref)(`state`in e?e.state:e.$attrs.state),R=(e,t)=>typeof e.$attrs[`data:path`]==`function`?e.$attrs[`data:path`](t):t;exports.CustomAlert=x,exports.CustomButton=y,exports.CustomModal=b,exports.MergeStyles=M,exports.Prop=A,exports.StyleParser=j,exports.access=O,exports.dataPath=R,exports.default=C,exports.defineReactiveView=P,exports.extendVnode=N,exports.getData=F,exports.getDate=D,exports.getProps=T,exports.getReactiveViewComponent=E,exports.safeRequest=w,exports.setData=I,exports.setup=g,exports.showComponent=v,exports.useSubscription=k;