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

package/dist/index.js

@@ -1 +1 @@
-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;
+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.18`,description:`This library enables you to build vue apps in an object oriented way. It provides a convenient approach to extend and override ui components. It provides a built in eventing system along with component data management.`,main:`dist/index.js`,module:`dist/index.mjs`,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===`next`?(()=>{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})})():(()=>{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})})()}};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;

package/dist/index.mjs

@@ -60,7 +60,7 @@ var T = class e {
 	}
 }, D = {
 	name: "@razaman2/reactive-view",
-	version: "0.1.0-beta.17",
+	version: "0.1.0-beta.18",
 	description: "This library enables you to build vue apps in an object oriented way. It provides a convenient approach to extend and override ui components. It provides a built in eventing system along with component data management.",
 	main: "dist/index.js",
 	module: "dist/index.mjs",
@@ -189,7 +189,113 @@ var T = class e {
 			props: n,
 			context: r
 		}) : `${n.modelName}: ${D.name}@${D.version}`), m = g(!1), _ = g(!1), v = g(typeof n.defer == "function" ? n.defer() : n.defer), y = ["Function"].includes(n.data?.constructor.name), S = ["AsyncFunction"].includes(n.data?.constructor.name), C = ["Promise"].includes(n.data?.constructor.name) || S, w = o(), T = n.getDefaultData("defaultData" in w.vnode.props ? w.vnode.props.defaultData : "data" in w.vnode.props && Array.isArray(b(w.vnode.props.data)) ? [] : {}), E = Array.isArray(T) ? [] : {};
-		return n.beta === "current" ? (() => {
+		return n.beta === "next" ? (() => {
+			let i = (e, t) => {
+				if (w && w.vnode.el) {
+					let n = new CustomEvent("emit:data", {
+						bubbles: !0,
+						composed: !0,
+						detail: {
+							before: t,
+							after: e
+						}
+					});
+					B(O).setData(e), w.vnode.el.dispatchEvent(n), w.vnode.el.dispatchEvent(new CustomEvent("data:emit", {
+						bubbles: !0,
+						composed: !0,
+						detail: {
+							before: t,
+							after: e
+						}
+					}));
+				}
+			}, o = (e) => B(O).model.setData(e), f = (t) => new Proxy(t, { get(t, r, i) {
+				return ["setData", "replaceData"].includes(r.toString()) ? (...i) => {
+					let a = B(O).beforeSetData ?? n.beforeSetData;
+					if (typeof a == "function") {
+						let n = e.on(t.getData()), o = i.length ? e.on(E).set(...i) : e.on(E).set(T);
+						a(B(O).diff(n, o), t) && t[r](...i);
+					} else t[r](...i);
+					return t;
+				} : Reflect.get(t, r, i);
+			} }), h = {
+				data: ((e) => {
+					if (l(e) || c(e)) return e;
+					if (y || C) return g(E);
+					{
+						let t = "data" in w.vnode.props;
+						try {
+							return ["Array", "Object"].includes(e?.constructor?.name) ? g(e) : g(t ? { "": e } : E);
+						} catch {
+							return g(t ? { "": e } : E);
+						}
+					}
+				})(w.vnode.props?.data),
+				defaultData: e.on(T).clone(),
+				notifications: n.notifications,
+				subscriptions: n.subscriptions,
+				name: n.modelName,
+				logging: n.logging
+			}, D = n.model ? typeof n.model == "function" ? n.model(h) : n.model : t.setConfig({ beforeGetData: (e) => l(e) ? b(e) : e }, h), O = g({
+				parent: { self: w.proxy },
+				self: {
+					template: p,
+					diff: s,
+					emit: i,
+					setData: o,
+					dataPath: u,
+					model: f(D),
+					isValid: m
+				}
+			});
+			if (r.attrs["onUpdate:model"] || r.attrs["update:model"]) {
+				let t = {
+					callback: typeof r.attrs["onUpdate:model"] == "function" ? r.attrs["onUpdate:model"] : r.attrs["update:model"],
+					options: {
+						immediate: r.attrs["model:immediate"],
+						deep: r.attrs["model:deep"],
+						once: r.attrs["model:once"]
+					}
+				};
+				a.push(x(() => e.on(D.getData()).clone(), (r, i) => {
+					let a = B(O).diff(e.on(i), e.on(r));
+					n.debug && console.warn(`[${n.modelName}]:model`, {
+						diff: a,
+						before: i,
+						after: r
+					}), a.changed && t.callback(a, { component: O });
+				}, t.options));
+			}
+			return d(async () => {
+				if (n.model !== !1) {
+					(y || C) && !("defaultData" in w.vnode.props) && console.warn(`${n.modelName}: defaultData is required for promise or function data.`, n.data);
+					let [t] = C ? await Promise.all([S ? n.data() : n.data, v.value ?? !0]) : [n.data], i = l(t) || c(t), o = typeof t == "function" || i ? t : () => t;
+					a.push(x(o, async (i, a) => {
+						let o = B(O).diff(e.on(a), e.on(i)), s = r.attrs["data:callback"];
+						n.debug && console.warn(`[${n.modelName}]:data`, {
+							diff: o,
+							data: t,
+							callback: s,
+							props: n,
+							context: r,
+							component: O
+						}), typeof s == "function" ? s(o, { component: O }) : D.replaceData(i);
+					}, {
+						immediate: r.attrs["data:immediate"] ?? !i,
+						deep: r.attrs["data:deep"],
+						once: r.attrs["data:once"]
+					}));
+				}
+			}), d(async () => {
+				_.value = await v.value ?? !0;
+			}), O.value = [B(O)].reduce((e, t) => {
+				for (; t && typeof t.setup == "function" && (e = {
+					parent: e,
+					self: t.setup(O, e) ?? {}
+				}, !B(t.$parent).ReactiveView);) t = B(t.$parent);
+				return e;
+			}, O.value), n.instance.value = typeof n.instance == "function" ? n.instance(O.value) : O.value, (e) => _.value ? B(O).template(O, e) : r.slots.loading?.({ component: O });
+		})() : (() => {
 			let i = (e, t) => {
 				if (w && w.vnode.el) {
 					let n = new CustomEvent("data:emit", {
@@ -322,112 +428,6 @@ var T = class e {
 				}, !B(t.$parent).ReactiveView);) t = B(t.$parent);
 				return e;
 			}, f.value), n.instance.value = typeof n.instance == "function" ? n.instance(f.value) : f.value, (e) => _.value ? B(f).template(f, e) : r.slots.loading?.({ component: f });
-		})() : (() => {
-			let i = (e, t) => {
-				if (w && w.vnode.el) {
-					let n = new CustomEvent("emit:data", {
-						bubbles: !0,
-						composed: !0,
-						detail: {
-							before: t,
-							after: e
-						}
-					});
-					B(O).setData(e), w.vnode.el.dispatchEvent(n), w.vnode.el.dispatchEvent(new CustomEvent("data:emit", {
-						bubbles: !0,
-						composed: !0,
-						detail: {
-							before: t,
-							after: e
-						}
-					}));
-				}
-			}, o = (e) => B(O).model.setData(e), f = (t) => new Proxy(t, { get(t, r, i) {
-				return ["setData", "replaceData"].includes(r.toString()) ? (...i) => {
-					let a = B(O).beforeSetData ?? n.beforeSetData;
-					if (typeof a == "function") {
-						let n = e.on(t.getData()), o = i.length ? e.on(E).set(...i) : e.on(E).set(T);
-						a(B(O).diff(n, o), t) && t[r](...i);
-					} else t[r](...i);
-					return t;
-				} : Reflect.get(t, r, i);
-			} }), h = {
-				data: ((e) => {
-					if (l(e) || c(e)) return e;
-					if (y || C) return g(E);
-					{
-						let t = "data" in w.vnode.props;
-						try {
-							return ["Array", "Object"].includes(e?.constructor?.name) ? g(e) : g(t ? { "": e } : E);
-						} catch {
-							return g(t ? { "": e } : E);
-						}
-					}
-				})(w.vnode.props?.data),
-				defaultData: e.on(T).clone(),
-				notifications: n.notifications,
-				subscriptions: n.subscriptions,
-				name: n.modelName,
-				logging: n.logging
-			}, D = n.model ? typeof n.model == "function" ? n.model(h) : n.model : t.setConfig({ beforeGetData: (e) => l(e) ? b(e) : e }, h), O = g({
-				parent: { self: w.proxy },
-				self: {
-					template: p,
-					diff: s,
-					emit: i,
-					setData: o,
-					dataPath: u,
-					model: f(D),
-					isValid: m
-				}
-			});
-			if (r.attrs["onUpdate:model"] || r.attrs["update:model"]) {
-				let t = {
-					callback: typeof r.attrs["onUpdate:model"] == "function" ? r.attrs["onUpdate:model"] : r.attrs["update:model"],
-					options: {
-						immediate: r.attrs["model:immediate"],
-						deep: r.attrs["model:deep"],
-						once: r.attrs["model:once"]
-					}
-				};
-				a.push(x(() => e.on(D.getData()).clone(), (r, i) => {
-					let a = B(O).diff(e.on(i), e.on(r));
-					n.debug && console.warn(`[${n.modelName}]:model`, {
-						diff: a,
-						before: i,
-						after: r
-					}), a.changed && t.callback(a, { component: O });
-				}, t.options));
-			}
-			return d(async () => {
-				if (n.model !== !1) {
-					(y || C) && !("defaultData" in w.vnode.props) && console.warn(`${n.modelName}: defaultData is required for promise or function data.`, n.data);
-					let [t] = C ? await Promise.all([S ? n.data() : n.data, v.value ?? !0]) : [n.data], i = l(t) || c(t), o = typeof t == "function" || i ? t : () => t;
-					a.push(x(o, async (i, a) => {
-						let o = B(O).diff(e.on(a), e.on(i)), s = r.attrs["data:callback"];
-						n.debug && console.warn(`[${n.modelName}]:data`, {
-							diff: o,
-							data: t,
-							callback: s,
-							props: n,
-							context: r,
-							component: O
-						}), typeof s == "function" ? s(o, { component: O }) : D.replaceData(i);
-					}, {
-						immediate: r.attrs["data:immediate"] ?? !i,
-						deep: r.attrs["data:deep"],
-						once: r.attrs["data:once"]
-					}));
-				}
-			}), d(async () => {
-				_.value = await v.value ?? !0;
-			}), O.value = [B(O)].reduce((e, t) => {
-				for (; t && typeof t.setup == "function" && (e = {
-					parent: e,
-					self: t.setup(O, e) ?? {}
-				}, !B(t.$parent).ReactiveView);) t = B(t.$parent);
-				return e;
-			}, O.value), n.instance.value = typeof n.instance == "function" ? n.instance(O.value) : O.value, (e) => _.value ? B(O).template(O, e) : r.slots.loading?.({ component: O });
 		})();
 	}
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@razaman2/reactive-view",
-    "version": "0.1.0-beta.17",
+    "version": "0.1.0-beta.18",
     "description": "This library enables you to build vue apps in an object oriented way. It provides a convenient approach to extend and override ui components. It provides a built in eventing system along with component data management.",
     "main": "dist/index.js",
     "module": "dist/index.mjs",