@djvlc/runtime-host-vue 1.0.4 → 1.0.6

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";var e=require("vue"),t=require("@djvlc/runtime-core");function r(r){const n=e.shallowRef(null),a=e.ref(!0),o=e.ref("idle"),i=e.shallowRef(null),s=e.shallowRef(null),l=e.shallowRef(null),c=e.computed(()=>"ready"===o.value),u=e.computed(()=>"error"===o.value||null!==s.value),d=e.shallowRef({initTime:0,loadTime:0,renderTime:0,totalTime:0,initTimestamp:null,readyTimestamp:null});let p=0,m=0,f=0,y=0;const h=async()=>{if(!n.value)throw new Error("Runtime not initialized");f=performance.now();const e=await n.value.load();return i.value=e,l.value=n.value.getHostApi(),r.enableMetrics&&(d.value={...d.value,loadTime:performance.now()-f}),e},v=async()=>{if(!n.value)throw new Error("Runtime not initialized");if(y=performance.now(),await n.value.render(),a.value=!1,r.enableMetrics){const e=performance.now();d.value={...d.value,renderTime:e-y,totalTime:e-p,readyTimestamp:Date.now()}}};return{runtime:n,loading:e.readonly(a),phase:e.readonly(o),page:i,error:s,hostApi:l,isReady:c,hasError:u,metrics:d,init:async()=>{const e=r.containerRef?.value;if(!e)throw new Error("Container element not found");p=performance.now(),m=p,r.enableMetrics&&(d.value={...d.value,initTimestamp:Date.now()});const c=t.createRuntime({...r,container:e,onError:e=>{s.value=e,r.onError?.(e)},onEvent:e=>{r.onEvent?.(e)}});n.value=c,c.onStateChange(e=>{o.value=e.phase,a.value="ready"!==e.phase&&"error"!==e.phase,e.page&&(i.value=e.page),e.error&&(s.value=e.error)}),await c.init(),l.value=c.getHostApi(),r.enableMetrics&&(d.value={...d.value,initTime:performance.now()-m})},load:h,render:v,destroy:()=>{n.value?.destroy(),n.value=null,l.value=null,i.value=null,s.value=null,o.value="idle",a.value=!0},reload:async()=>{if(!n.value)throw new Error("Runtime not initialized");s.value=null,a.value=!0,await h(),await v()},setVariable:(e,t)=>{n.value?.setVariable(e,t)},setVariables:e=>{n.value&&Object.entries(e).forEach(([e,t])=>{n.value?.setVariable(e,t)})},getVariable:e=>n.value?.getState().variables[e],refreshData:async e=>{await(n.value?.refreshData(e))},executeAction:async(e,t)=>{const r=l.value;if(!r)throw new Error("HostAPI not available");const n=await r.executeAction(e,t||{});if(n.success)return n.data;throw new Error(n.errorMessage||"Action failed")}}}var n=Symbol("DJVRuntime");function a(t){e.provide(n,t)}function o(){const t=e.inject(n);if(!t)throw new Error("useDJVRuntime must be used within a DJVProvider");return t}function i(t,r){const n=o(),a=e.ref(!1),i=e.shallowRef(),s=e.ref(null),l=e.ref(0),c=async(e,a)=>{const o=n.value.hostApi;if(!o)throw new Error("HostAPI not available");try{const r=await o.executeAction(t,e);if(r.success)return r.data;throw new Error(r.errorMessage||"Action failed")}catch(t){if(a>0)return await new Promise(e=>setTimeout(e,r?.retryDelay||1e3)),c(e,a-1);throw t}};return{execute:async e=>{a.value=!0,s.value=null,l.value++;try{const t=await c(e,r?.retryCount||0);return i.value=t,r?.onSuccess?.(t),t}catch(e){const t=e;throw s.value=t,r?.onError?.(t),e}finally{a.value=!1}},loading:a,result:i,error:s,reset:()=>{i.value=void 0,s.value=null,l.value=0},executionCount:l}}var s=e.defineComponent({name:"DJVRenderer",props:{pageUid:{type:String,required:!0},apiBaseUrl:{type:String,required:!0},cdnBaseUrl:{type:String,required:!0},channel:{type:String,default:"prod"},userId:String,deviceId:String,authToken:String,previewToken:String,debug:{type:Boolean,default:!1},enableSRI:{type:Boolean,default:!0},retryCount:{type:Number,default:3},retryDelay:{type:Number,default:1e3},timeout:{type:Number,default:3e4}},emits:["load","error","ready","phase-change"],setup(t,{emit:n,slots:o}){const i=e.ref(null),s=e.ref(!0),l=e.ref(0),c=e.ref("idle"),u=e.shallowRef({runtime:null,state:{phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},hostApi:null});a(u);let d=null;const p=async()=>{if(!i.value||!s.value)return;const e={pageUid:t.pageUid,apiBaseUrl:t.apiBaseUrl,cdnBaseUrl:t.cdnBaseUrl,channel:t.channel,userId:t.userId,deviceId:t.deviceId,authToken:t.authToken,previewToken:t.previewToken,debug:t.debug,enableSRI:t.enableSRI,containerRef:i,onError:e=>{n("error",e)}};d=r(e);try{await(a=(async()=>{if(await d.init(),!s.value)return;c.value="loading",n("phase-change","loading"),u.value={runtime:d.runtime.value,state:d.runtime.value?.getState()||u.value.state,hostApi:d.hostApi.value};const e=await d.load();s.value&&(n("load",e),u.value={...u.value,state:d.runtime.value?.getState()||u.value.state,hostApi:d.hostApi.value},await d.render(),s.value&&(c.value="ready",n("phase-change","ready"),n("ready"),l.value=0,d.runtime.value?.onStateChange(e=>{s.value&&(u.value={...u.value,state:e},c.value=e.phase,n("phase-change",e.phase))})))})(),o=t.timeout,Promise.race([a,new Promise((e,t)=>setTimeout(()=>t(new Error("加载超时")),o))]))}catch(e){if(!s.value)return;l.value<t.retryCount?(l.value++,t.debug,setTimeout(()=>{s.value&&p()},t.retryDelay)):(c.value="error",n("phase-change","error"),n("error",e))}var a,o},m=()=>{l.value=0,p()};return e.onMounted(()=>{s.value=!0,p()}),e.onUnmounted(()=>{s.value=!1,d?.destroy()}),e.watch(()=>t.pageUid,()=>{d?.destroy(),l.value=0,p()}),()=>{const r=d?.loading.value??!1,n=d?.error.value,a=d?.page.value;return e.h("div",{ref:i,class:"djvlc-renderer","data-phase":c.value,"data-page-uid":t.pageUid},[r&&(o.loading?.()||e.h("div",{class:"djvlc-loading"},[e.h("div",{class:"djvlc-loading-spinner"}),e.h("span",{},"加载中..."),l.value>0&&e.h("span",{class:"djvlc-loading-retry"},`重试 ${l.value}/${t.retryCount}`)])),n&&(o.error?.({error:n,retry:m})||(s=n,e.h("div",{class:"djvlc-error"},[e.h("div",{class:"djvlc-error-icon"},"⚠️"),e.h("span",{class:"djvlc-error-message"},`加载失败：${s.message}`),e.h("button",{class:"djvlc-error-retry-btn",onClick:m,type:"button"},"重试")]))),!r&&!n&&!a&&"ready"===c.value&&(o.empty?.()||e.h("div",{class:"djvlc-empty"},[e.h("span",{},"暂无内容")])),o.default?.()]);var s}}}),l={phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},c=e.defineComponent({name:"DJVProvider",props:{runtime:{type:Object,default:null},hostApi:{type:Object,default:null},class:{type:String,default:""},debug:{type:Boolean,default:!1}},emits:["state-change","phase-change","error"],setup(t,{slots:r,emit:n}){let o=null;const i=e.shallowRef({runtime:t.runtime,state:t.runtime?.getState()||l,hostApi:t.hostApi});a(i);const s=e=>{o&&(o(),o=null),e&&(o=e.onStateChange(e=>{const r=i.value.state.phase;i.value={...i.value,state:e},n("state-change",e),e.phase!==r&&(n("phase-change",e.phase),t.debug),e.error&&n("error",e.error)}))};return s(t.runtime),e.watch(()=>t.runtime,(e,r)=>{e!==r&&(i.value={runtime:e,state:e?.getState()||l,hostApi:t.hostApi},s(e))}),e.watch(()=>t.hostApi,e=>{i.value={...i.value,hostApi:e}}),e.onUnmounted(()=>{o&&(o(),o=null)}),()=>e.h("div",{class:["djvlc-provider",t.class].filter(Boolean).join(" "),"data-phase":i.value.state.phase},r.default?.())}}),u="djvlc-config";function d(e,t){window.dispatchEvent(new CustomEvent("djvlc:track",{detail:{event:e,data:t,timestamp:Date.now()}}))}function p(e,t){e.style.display=t?"":"none"}function m(e,t,r){let n=r.get(e);t?(n||(n=document.createElement("div"),n.className="djvlc-loading-overlay",n.innerHTML='\n        <div class="djvlc-loading-spinner"></div>\n      ',n.style.cssText="\n        position: absolute;\n        inset: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        background: rgba(255, 255, 255, 0.8);\n        z-index: 100;\n      ",e.appendChild(n),r.set(e,n)),n.style.display="flex"):n&&(n.style.display="none")}var f={install(e,t={}){const r=t.componentPrefix||"";!1!==t.registerComponents&&(e.component(`${r}DJVRenderer`,s),e.component(`${r}DJVProvider`,c)),!1!==t.registerDirectives&&(e.directive("djv-track",function(){const e=new WeakSet;return{mounted(t,r){const{event:n,data:a={},trigger:o="click"}=r.value;if("click"===o)t.addEventListener("click",()=>{d(n,{...a,element:t.tagName})});else if("view"===o){if(!e.has(t)){e.add(t);const r=new IntersectionObserver(e=>{e.forEach(e=>{e.isIntersecting&&(d(n,{...a,element:t.tagName}),r.unobserve(t))})},{threshold:.5});r.observe(t)}}else"mounted"===o&&d(n,{...a,element:t.tagName})}}}()),e.directive("djv-visible",{mounted(e,t){p(e,t.value)},updated(e,t){p(e,t.value)}}),e.directive("djv-loading",function(){const e=new WeakMap;return{mounted(t,r){t.style.position="relative",m(t,r.value,e)},updated(t,r){m(t,r.value,e)},unmounted(t){const r=e.get(t);r&&(r.remove(),e.delete(t))}}}()));const n={apiBaseUrl:t.apiBaseUrl,cdnBaseUrl:t.cdnBaseUrl,channel:t.channel,debug:t.debug,enableSRI:t.enableSRI,enableMetrics:t.enableMetrics,retryCount:t.retryCount,retryDelay:t.retryDelay,timeout:t.timeout};e.provide(u,n),e.config.globalProperties.$djvlc={config:n,track:d}}};exports.DJVLC_CONFIG_KEY=u,exports.DJVPlugin=f,exports.DJVProvider=c,exports.DJVRenderer=s,exports.RuntimeContextKey=n,exports.createVueRuntime=r,exports.injectRuntime=o,exports.provideRuntime=a,exports.useAction=i,exports.useComponentState=function(t){const r=o(),n=e.computed(()=>r.value.state.components.get(t));return{isLoaded:e.computed(()=>"loaded"===n.value?.status),isLoading:e.computed(()=>"loading"===n.value?.status),hasError:e.computed(()=>"failed"===n.value?.status),loadTime:e.computed(()=>n.value?.loadTime),info:n}},exports.useDJVRuntime=function(){const t=o(),r=e.computed(()=>{const e=t.value.state.phase;return"ready"!==e&&"error"!==e}),n=e.computed(()=>"ready"===t.value.state.phase),a=e.computed(()=>"error"===t.value.state.phase||null!==t.value.state.error);return{runtime:e.computed(()=>t.value.runtime),state:e.computed(()=>t.value.state),loading:r,phase:e.computed(()=>t.value.state.phase),error:e.computed(()=>t.value.state.error),page:e.computed(()=>t.value.state.page),isReady:n,hasError:a,reload:async()=>{const e=t.value.runtime;if(!e)throw new Error("Runtime not available");await e.load(),await e.render()}}},exports.useData=function(t,r,n){const a=o(),i=e.shallowRef(),s=e.ref(!1),l=e.ref(null),c=e.ref(!1);let u=null;const d=async e=>{const o=a.value.hostApi;if(!o)throw new Error("HostAPI not available");s.value=!0,l.value=null;try{const a=await o.requestData(t,e||(()=>{if(r)return"object"==typeof r&&"value"in r?r.value:r})());i.value=a,c.value=!0,n?.onSuccess?.(a)}catch(e){const t=e;l.value=t,n?.onError?.(t)}finally{s.value=!1}};return r&&"object"==typeof r&&"value"in r&&!1!==n?.refreshOnParamsChange&&e.watch(r,()=>{c.value&&d()},{deep:!0}),e.onMounted(()=>{!1!==n?.immediate&&a.value.hostApi&&d(),n?.refreshInterval&&n.refreshInterval>0&&(u=setInterval(d,n.refreshInterval))}),e.onUnmounted(()=>{u&&clearInterval(u)}),{data:i,loading:s,error:l,refetch:d,isFetched:c}},exports.useDebouncedAction=function(t,r=300){const{execute:n,loading:a,result:o,error:s}=i(t);let l=null;const c=()=>{l&&(clearTimeout(l),l=null)};return e.onUnmounted(()=>{c()}),{execute:e=>{l&&clearTimeout(l),l=setTimeout(()=>{n(e).catch(()=>{})},r)},loading:a,result:o,error:s,cancel:c}},exports.useGlobalConfig=function(){return e.inject("djvlc-config",{})},exports.useHostApi=function(){const e=o().value.hostApi;if(!e)throw new Error("HostAPI not available. Make sure runtime is initialized.");return e},exports.useLifecycle=function(t){const r=o(),n=e.ref(!1),a=e.ref(!1);return e.watch(()=>r.value.state.phase,async(e,o)=>{if(t?.onPhaseChange?.(e),!n.value&&"idle"!==e){n.value=!0;try{await(t?.onMounted?.())}catch(e){t?.onError?.(e)}}if(!a.value&&"ready"===e){a.value=!0;try{await(t?.onReady?.())}catch(e){t?.onError?.(e)}}"error"===e&&"error"!==o&&t?.onError?.(r.value.state.error)},{immediate:!0}),{phase:e.computed(()=>r.value.state.phase),hasMounted:e.readonly(n),hasReady:e.readonly(a)}},exports.usePageInfo=function(){const t=o();return{pageUid:e.computed(()=>t.value.state.page?.pageUid),pageVersionId:e.computed(()=>t.value.state.page?.pageVersionId),schemaVersion:e.computed(()=>t.value.state.page?.pageJson?.schemaVersion),title:e.computed(()=>{const e=t.value.state.page;return e?.title}),config:e.computed(()=>{const e=t.value.state.page;return e?.config}),isLoaded:e.computed(()=>null!==t.value.state.page)}},exports.useQuery=function(t,r){const n=o(),a=e.ref(!1),i=e.ref(null),s=e.ref(null);let l=null;const c=e.computed(()=>n.value.state.queries[t]),u=async()=>{a.value=!0,i.value=null;try{await(n.value.runtime?.refreshData(t)),s.value=Date.now()}catch(e){i.value=e}finally{a.value=!1}};return e.onMounted(()=>{r?.refreshOnMount&&n.value.runtime&&u(),r?.refreshInterval&&r.refreshInterval>0&&(l=setInterval(u,r.refreshInterval)),r?.refreshOnFocus&&window.addEventListener("focus",u)}),e.onUnmounted(()=>{l&&clearInterval(l),r?.refreshOnFocus&&window.removeEventListener("focus",u)}),{data:c,loading:a,error:i,refetch:u,lastUpdated:s}},exports.useRuntimeEvent=function(t,r){const n=o(),a=n.value.runtime?.on(t,e=>{r(e.data)});e.onUnmounted(()=>{a?.()})},exports.useRuntimeState=function(t){const r=o();return e.computed(()=>r.value.state.variables[t])},exports.useRuntimeStateWritable=function(t,r){const n=o();return[e.computed(()=>n.value.state.variables[t]??r),e=>{n.value.runtime?.setVariable(t,e)}]},exports.useWhen=function(t,r,n){const a=e.ref(!1),{once:o=!0,immediate:i=!0}=n||{},s=e.watch(t,async e=>{!e||o&&a.value||(a.value=!0,await r(),o&&s())},{immediate:i});return e.onUnmounted(()=>{s()}),{executed:e.readonly(a),stop:s}};
+"use strict";var e=require("vue"),t=require("@djvlc/runtime-core");function r(r){const n=e.shallowRef(null),a=e.ref(!0),o=e.ref("idle"),i=e.shallowRef(null),s=e.shallowRef(null),l=e.shallowRef(null),c=e.computed(()=>"ready"===o.value),u=e.computed(()=>"error"===o.value||null!==s.value),d=e.shallowRef({initTime:0,loadTime:0,renderTime:0,totalTime:0,initTimestamp:null,readyTimestamp:null});let p=0,m=0,f=0,y=0;const h=async()=>{if(!n.value)throw new Error("Runtime not initialized");f=performance.now();const e=await n.value.load();return i.value=e,l.value=n.value.getHostApi(),r.enableMetrics&&(d.value={...d.value,loadTime:performance.now()-f}),e},v=async()=>{if(!n.value)throw new Error("Runtime not initialized");if(y=performance.now(),await n.value.render(),a.value=!1,r.enableMetrics){const e=performance.now();d.value={...d.value,renderTime:e-y,totalTime:e-p,readyTimestamp:Date.now()}}};return{runtime:n,loading:e.readonly(a),phase:e.readonly(o),page:i,error:s,hostApi:l,isReady:c,hasError:u,metrics:d,init:async()=>{const e=r.containerRef?.value;if(!e)throw new Error("Container element not found");p=performance.now(),m=p,r.enableMetrics&&(d.value={...d.value,initTimestamp:Date.now()});const c=t.createRuntime({...r,container:e,onError:e=>{s.value=e,r.onError?.(e)},onEvent:e=>{r.onEvent?.(e)}});n.value=c,c.onStateChange(e=>{o.value=e.phase,a.value="ready"!==e.phase&&"error"!==e.phase,e.page&&(i.value=e.page),e.error&&(s.value=e.error)}),await c.init(),l.value=c.getHostApi(),r.enableMetrics&&(d.value={...d.value,initTime:performance.now()-m})},load:h,render:v,destroy:()=>{n.value?.destroy(),n.value=null,l.value=null,i.value=null,s.value=null,o.value="idle",a.value=!0},reload:async()=>{if(!n.value)throw new Error("Runtime not initialized");s.value=null,a.value=!0,await h(),await v()},setVariable:(e,t)=>{n.value?.setVariable(e,t)},setVariables:e=>{n.value&&Object.entries(e).forEach(([e,t])=>{n.value?.setVariable(e,t)})},getVariable:e=>n.value?.getState().variables[e],refreshData:async e=>{await(n.value?.refreshData(e))},executeAction:async(e,t)=>{const r=l.value;if(!r)throw new Error("HostAPI not available");const n=await r.executeAction(e,t||{});if(n.success)return n.data;throw new Error(n.errorMessage||"Action failed")}}}var n=Symbol("DJVRuntime");function a(t){e.provide(n,t)}function o(){const t=e.inject(n);if(!t)throw new Error("useDJVRuntime must be used within a DJVProvider");return t}function i(t,r){const n=o(),a=e.ref(!1),i=e.shallowRef(),s=e.ref(null),l=e.ref(0),c=async(e,a)=>{const o=n.value.hostApi;if(!o)throw new Error("HostAPI not available");try{const r=await o.executeAction(t,e);if(r.success)return r.data;throw new Error(r.errorMessage||"Action failed")}catch(t){if(a>0)return await new Promise(e=>setTimeout(e,r?.retryDelay||1e3)),c(e,a-1);throw t}};return{execute:async e=>{a.value=!0,s.value=null,l.value++;try{const t=await c(e,r?.retryCount||0);return i.value=t,r?.onSuccess?.(t),t}catch(e){const t=e;throw s.value=t,r?.onError?.(t),e}finally{a.value=!1}},loading:a,result:i,error:s,reset:()=>{i.value=void 0,s.value=null,l.value=0},executionCount:l}}var s=e.defineComponent({name:"DJVRenderer",props:{pageId:{type:String,required:!0},apiBaseUrl:{type:String,required:!0},cdnBaseUrl:{type:String,required:!0},channel:{type:String,default:"prod"},userId:String,deviceId:String,authToken:String,previewToken:String,debug:{type:Boolean,default:!1},enableSRI:{type:Boolean,default:!0},retryCount:{type:Number,default:3},retryDelay:{type:Number,default:1e3},timeout:{type:Number,default:3e4}},emits:["load","error","ready","phase-change"],setup(t,{emit:n,slots:o}){const i=e.ref(null),s=e.ref(!0),l=e.ref(0),c=e.ref("idle"),u=e.shallowRef({runtime:null,state:{phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},hostApi:null});a(u);let d=null;const p=async()=>{if(!i.value||!s.value)return;const e={pageId:t.pageId,apiBaseUrl:t.apiBaseUrl,cdnBaseUrl:t.cdnBaseUrl,channel:t.channel,userId:t.userId,deviceId:t.deviceId,authToken:t.authToken,previewToken:t.previewToken,debug:t.debug,enableSRI:t.enableSRI,containerRef:i,onError:e=>{n("error",e)}};d=r(e);try{await(a=(async()=>{if(await d.init(),!s.value)return;c.value="loading",n("phase-change","loading"),u.value={runtime:d.runtime.value,state:d.runtime.value?.getState()||u.value.state,hostApi:d.hostApi.value};const e=await d.load();s.value&&(n("load",e),u.value={...u.value,state:d.runtime.value?.getState()||u.value.state,hostApi:d.hostApi.value},await d.render(),s.value&&(c.value="ready",n("phase-change","ready"),n("ready"),l.value=0,d.runtime.value?.onStateChange(e=>{s.value&&(u.value={...u.value,state:e},c.value=e.phase,n("phase-change",e.phase))})))})(),o=t.timeout,Promise.race([a,new Promise((e,t)=>setTimeout(()=>t(new Error("加载超时")),o))]))}catch(e){if(!s.value)return;l.value<t.retryCount?(l.value++,t.debug,setTimeout(()=>{s.value&&p()},t.retryDelay)):(c.value="error",n("phase-change","error"),n("error",e))}var a,o},m=()=>{l.value=0,p()};return e.onMounted(()=>{s.value=!0,p()}),e.onUnmounted(()=>{s.value=!1,d?.destroy()}),e.watch(()=>t.pageId,()=>{d?.destroy(),l.value=0,p()}),()=>{const r=d?.loading.value??!1,n=d?.error.value,a=d?.page.value;return e.h("div",{ref:i,class:"djvlc-renderer","data-phase":c.value,"data-page-id":t.pageId},[r&&(o.loading?.()||e.h("div",{class:"djvlc-loading"},[e.h("div",{class:"djvlc-loading-spinner"}),e.h("span",{},"加载中..."),l.value>0&&e.h("span",{class:"djvlc-loading-retry"},`重试 ${l.value}/${t.retryCount}`)])),n&&(o.error?.({error:n,retry:m})||(s=n,e.h("div",{class:"djvlc-error"},[e.h("div",{class:"djvlc-error-icon"},"⚠️"),e.h("span",{class:"djvlc-error-message"},`加载失败：${s.message}`),e.h("button",{class:"djvlc-error-retry-btn",onClick:m,type:"button"},"重试")]))),!r&&!n&&!a&&"ready"===c.value&&(o.empty?.()||e.h("div",{class:"djvlc-empty"},[e.h("span",{},"暂无内容")])),o.default?.()]);var s}}}),l={phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},c=e.defineComponent({name:"DJVProvider",props:{runtime:{type:Object,default:null},hostApi:{type:Object,default:null},class:{type:String,default:""},debug:{type:Boolean,default:!1}},emits:["state-change","phase-change","error"],setup(t,{slots:r,emit:n}){let o=null;const i=e.shallowRef({runtime:t.runtime,state:t.runtime?.getState()||l,hostApi:t.hostApi});a(i);const s=e=>{o&&(o(),o=null),e&&(o=e.onStateChange(e=>{const r=i.value.state.phase;i.value={...i.value,state:e},n("state-change",e),e.phase!==r&&(n("phase-change",e.phase),t.debug),e.error&&n("error",e.error)}))};return s(t.runtime),e.watch(()=>t.runtime,(e,r)=>{e!==r&&(i.value={runtime:e,state:e?.getState()||l,hostApi:t.hostApi},s(e))}),e.watch(()=>t.hostApi,e=>{i.value={...i.value,hostApi:e}}),e.onUnmounted(()=>{o&&(o(),o=null)}),()=>e.h("div",{class:["djvlc-provider",t.class].filter(Boolean).join(" "),"data-phase":i.value.state.phase},r.default?.())}}),u="djvlc-config";function d(e,t){window.dispatchEvent(new CustomEvent("djvlc:track",{detail:{event:e,data:t,timestamp:Date.now()}}))}function p(e,t){e.style.display=t?"":"none"}function m(e,t,r){let n=r.get(e);t?(n||(n=document.createElement("div"),n.className="djvlc-loading-overlay",n.innerHTML='\n        <div class="djvlc-loading-spinner"></div>\n      ',n.style.cssText="\n        position: absolute;\n        inset: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        background: rgba(255, 255, 255, 0.8);\n        z-index: 100;\n      ",e.appendChild(n),r.set(e,n)),n.style.display="flex"):n&&(n.style.display="none")}var f={install(e,t={}){const r=t.componentPrefix||"";!1!==t.registerComponents&&(e.component(`${r}DJVRenderer`,s),e.component(`${r}DJVProvider`,c)),!1!==t.registerDirectives&&(e.directive("djv-track",function(){const e=new WeakSet;return{mounted(t,r){const{event:n,data:a={},trigger:o="click"}=r.value;if("click"===o)t.addEventListener("click",()=>{d(n,{...a,element:t.tagName})});else if("view"===o){if(!e.has(t)){e.add(t);const r=new IntersectionObserver(e=>{e.forEach(e=>{e.isIntersecting&&(d(n,{...a,element:t.tagName}),r.unobserve(t))})},{threshold:.5});r.observe(t)}}else"mounted"===o&&d(n,{...a,element:t.tagName})}}}()),e.directive("djv-visible",{mounted(e,t){p(e,t.value)},updated(e,t){p(e,t.value)}}),e.directive("djv-loading",function(){const e=new WeakMap;return{mounted(t,r){t.style.position="relative",m(t,r.value,e)},updated(t,r){m(t,r.value,e)},unmounted(t){const r=e.get(t);r&&(r.remove(),e.delete(t))}}}()));const n={apiBaseUrl:t.apiBaseUrl,cdnBaseUrl:t.cdnBaseUrl,channel:t.channel,debug:t.debug,enableSRI:t.enableSRI,enableMetrics:t.enableMetrics,retryCount:t.retryCount,retryDelay:t.retryDelay,timeout:t.timeout};e.provide(u,n),e.config.globalProperties.$djvlc={config:n,track:d}}};exports.DJVLC_CONFIG_KEY=u,exports.DJVPlugin=f,exports.DJVProvider=c,exports.DJVRenderer=s,exports.RuntimeContextKey=n,exports.createVueRuntime=r,exports.injectRuntime=o,exports.provideRuntime=a,exports.useAction=i,exports.useComponentState=function(t){const r=o(),n=e.computed(()=>r.value.state.components.get(t));return{isLoaded:e.computed(()=>"loaded"===n.value?.status),isLoading:e.computed(()=>"loading"===n.value?.status),hasError:e.computed(()=>"failed"===n.value?.status),loadTime:e.computed(()=>n.value?.loadTime),info:n}},exports.useDJVRuntime=function(){const t=o(),r=e.computed(()=>{const e=t.value.state.phase;return"ready"!==e&&"error"!==e}),n=e.computed(()=>"ready"===t.value.state.phase),a=e.computed(()=>"error"===t.value.state.phase||null!==t.value.state.error);return{runtime:e.computed(()=>t.value.runtime),state:e.computed(()=>t.value.state),loading:r,phase:e.computed(()=>t.value.state.phase),error:e.computed(()=>t.value.state.error),page:e.computed(()=>t.value.state.page),isReady:n,hasError:a,reload:async()=>{const e=t.value.runtime;if(!e)throw new Error("Runtime not available");await e.load(),await e.render()}}},exports.useData=function(t,r,n){const a=o(),i=e.shallowRef(),s=e.ref(!1),l=e.ref(null),c=e.ref(!1);let u=null;const d=async e=>{const o=a.value.hostApi;if(!o)throw new Error("HostAPI not available");s.value=!0,l.value=null;try{const a=await o.requestData(t,e||(()=>{if(r)return"object"==typeof r&&"value"in r?r.value:r})());i.value=a,c.value=!0,n?.onSuccess?.(a)}catch(e){const t=e;l.value=t,n?.onError?.(t)}finally{s.value=!1}};return r&&"object"==typeof r&&"value"in r&&!1!==n?.refreshOnParamsChange&&e.watch(r,()=>{c.value&&d()},{deep:!0}),e.onMounted(()=>{!1!==n?.immediate&&a.value.hostApi&&d(),n?.refreshInterval&&n.refreshInterval>0&&(u=setInterval(d,n.refreshInterval))}),e.onUnmounted(()=>{u&&clearInterval(u)}),{data:i,loading:s,error:l,refetch:d,isFetched:c}},exports.useDebouncedAction=function(t,r=300){const{execute:n,loading:a,result:o,error:s}=i(t);let l=null;const c=()=>{l&&(clearTimeout(l),l=null)};return e.onUnmounted(()=>{c()}),{execute:e=>{l&&clearTimeout(l),l=setTimeout(()=>{n(e).catch(()=>{})},r)},loading:a,result:o,error:s,cancel:c}},exports.useGlobalConfig=function(){return e.inject("djvlc-config",{})},exports.useHostApi=function(){const e=o().value.hostApi;if(!e)throw new Error("HostAPI not available. Make sure runtime is initialized.");return e},exports.useLifecycle=function(t){const r=o(),n=e.ref(!1),a=e.ref(!1);return e.watch(()=>r.value.state.phase,async(e,o)=>{if(t?.onPhaseChange?.(e),!n.value&&"idle"!==e){n.value=!0;try{await(t?.onMounted?.())}catch(e){t?.onError?.(e)}}if(!a.value&&"ready"===e){a.value=!0;try{await(t?.onReady?.())}catch(e){t?.onError?.(e)}}"error"===e&&"error"!==o&&t?.onError?.(r.value.state.error)},{immediate:!0}),{phase:e.computed(()=>r.value.state.phase),hasMounted:e.readonly(n),hasReady:e.readonly(a)}},exports.usePageInfo=function(){const t=o();return{pageId:e.computed(()=>t.value.state.page?.pageId),pageVersionId:e.computed(()=>t.value.state.page?.pageVersionId),schemaVersion:e.computed(()=>t.value.state.page?.pageJson?.schemaVersion),title:e.computed(()=>{const e=t.value.state.page;return e?.title}),config:e.computed(()=>{const e=t.value.state.page;return e?.config}),isLoaded:e.computed(()=>null!==t.value.state.page)}},exports.useQuery=function(t,r){const n=o(),a=e.ref(!1),i=e.ref(null),s=e.ref(null);let l=null;const c=e.computed(()=>n.value.state.queries[t]),u=async()=>{a.value=!0,i.value=null;try{await(n.value.runtime?.refreshData(t)),s.value=Date.now()}catch(e){i.value=e}finally{a.value=!1}};return e.onMounted(()=>{r?.refreshOnMount&&n.value.runtime&&u(),r?.refreshInterval&&r.refreshInterval>0&&(l=setInterval(u,r.refreshInterval)),r?.refreshOnFocus&&window.addEventListener("focus",u)}),e.onUnmounted(()=>{l&&clearInterval(l),r?.refreshOnFocus&&window.removeEventListener("focus",u)}),{data:c,loading:a,error:i,refetch:u,lastUpdated:s}},exports.useRuntimeEvent=function(t,r){const n=o(),a=n.value.runtime?.on(t,e=>{r(e.data)});e.onUnmounted(()=>{a?.()})},exports.useRuntimeState=function(t){const r=o();return e.computed(()=>r.value.state.variables[t])},exports.useRuntimeStateWritable=function(t,r){const n=o();return[e.computed(()=>n.value.state.variables[t]??r),e=>{n.value.runtime?.setVariable(t,e)}]},exports.useWhen=function(t,r,n){const a=e.ref(!1),{once:o=!0,immediate:i=!0}=n||{},s=e.watch(t,async e=>{!e||o&&a.value||(a.value=!0,await r(),o&&s())},{immediate:i});return e.onUnmounted(()=>{s()}),{executed:e.readonly(a),stop:s}};

package/dist/index.d.cts

@@ -88,7 +88,7 @@ declare function createVueRuntime(options: VueRuntimeOptions): VueRuntimeReturn;
  */
 interface DJVRendererProps {
     /** 页面 UID */
-    pageUid: string;
+    pageId: string;
     /** API 基础 URL */
     apiBaseUrl: string;
     /** CDN 基础 URL */
@@ -118,7 +118,7 @@ interface DJVRendererProps {
  * DJV 渲染器组件
  */
 declare const DJVRenderer: vue.DefineComponent<vue.ExtractPropTypes<{
-    pageUid: {
+    pageId: {
         type: StringConstructor;
         required: true;
     };
@@ -161,7 +161,7 @@ declare const DJVRenderer: vue.DefineComponent<vue.ExtractPropTypes<{
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("ready" | "error" | "load" | "phase-change")[], "ready" | "error" | "load" | "phase-change", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    pageUid: {
+    pageId: {
         type: StringConstructor;
         required: true;
     };
@@ -392,7 +392,7 @@ declare function useRuntimeEvent<T = unknown>(eventType: string, handler: (data:
  */
 declare function usePageInfo(): {
     /** 页面 UID */
-    pageUid: vue.ComputedRef<string | undefined>;
+    pageId: vue.ComputedRef<string | undefined>;
     /** 页面版本 ID */
     pageVersionId: vue.ComputedRef<string | undefined>;
     /** Schema 版本 */

package/dist/index.d.ts

@@ -88,7 +88,7 @@ declare function createVueRuntime(options: VueRuntimeOptions): VueRuntimeReturn;
  */
 interface DJVRendererProps {
     /** 页面 UID */
-    pageUid: string;
+    pageId: string;
     /** API 基础 URL */
     apiBaseUrl: string;
     /** CDN 基础 URL */
@@ -118,7 +118,7 @@ interface DJVRendererProps {
  * DJV 渲染器组件
  */
 declare const DJVRenderer: vue.DefineComponent<vue.ExtractPropTypes<{
-    pageUid: {
+    pageId: {
         type: StringConstructor;
         required: true;
     };
@@ -161,7 +161,7 @@ declare const DJVRenderer: vue.DefineComponent<vue.ExtractPropTypes<{
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("ready" | "error" | "load" | "phase-change")[], "ready" | "error" | "load" | "phase-change", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    pageUid: {
+    pageId: {
         type: StringConstructor;
         required: true;
     };
@@ -392,7 +392,7 @@ declare function useRuntimeEvent<T = unknown>(eventType: string, handler: (data:
  */
 declare function usePageInfo(): {
     /** 页面 UID */
-    pageUid: vue.ComputedRef<string | undefined>;
+    pageId: vue.ComputedRef<string | undefined>;
     /** 页面版本 ID */
     pageVersionId: vue.ComputedRef<string | undefined>;
     /** Schema 版本 */

package/dist/index.js

@@ -1 +1 @@
-import{defineComponent as e,ref as t,shallowRef as n,onMounted as r,onUnmounted as a,watch as o,h as i,provide as l,computed as s,readonly as c,inject as u}from"vue";import{createRuntime as d}from"@djvlc/runtime-core";function p(e){const r=n(null),a=t(!0),o=t("idle"),i=n(null),l=n(null),u=n(null),p=s(()=>"ready"===o.value),m=s(()=>"error"===o.value||null!==l.value),f=n({initTime:0,loadTime:0,renderTime:0,totalTime:0,initTimestamp:null,readyTimestamp:null});let y=0,h=0,v=0,w=0;const g=async()=>{if(!r.value)throw new Error("Runtime not initialized");v=performance.now();const t=await r.value.load();return i.value=t,u.value=r.value.getHostApi(),e.enableMetrics&&(f.value={...f.value,loadTime:performance.now()-v}),t},b=async()=>{if(!r.value)throw new Error("Runtime not initialized");if(w=performance.now(),await r.value.render(),a.value=!1,e.enableMetrics){const e=performance.now();f.value={...f.value,renderTime:e-w,totalTime:e-y,readyTimestamp:Date.now()}}};return{runtime:r,loading:c(a),phase:c(o),page:i,error:l,hostApi:u,isReady:p,hasError:m,metrics:f,init:async()=>{const t=e.containerRef?.value;if(!t)throw new Error("Container element not found");y=performance.now(),h=y,e.enableMetrics&&(f.value={...f.value,initTimestamp:Date.now()});const n=d({...e,container:t,onError:t=>{l.value=t,e.onError?.(t)},onEvent:t=>{e.onEvent?.(t)}});r.value=n,n.onStateChange(e=>{o.value=e.phase,a.value="ready"!==e.phase&&"error"!==e.phase,e.page&&(i.value=e.page),e.error&&(l.value=e.error)}),await n.init(),u.value=n.getHostApi(),e.enableMetrics&&(f.value={...f.value,initTime:performance.now()-h})},load:g,render:b,destroy:()=>{r.value?.destroy(),r.value=null,u.value=null,i.value=null,l.value=null,o.value="idle",a.value=!0},reload:async()=>{if(!r.value)throw new Error("Runtime not initialized");l.value=null,a.value=!0,await g(),await b()},setVariable:(e,t)=>{r.value?.setVariable(e,t)},setVariables:e=>{r.value&&Object.entries(e).forEach(([e,t])=>{r.value?.setVariable(e,t)})},getVariable:e=>r.value?.getState().variables[e],refreshData:async e=>{await(r.value?.refreshData(e))},executeAction:async(e,t)=>{const n=u.value;if(!n)throw new Error("HostAPI not available");const r=await n.executeAction(e,t||{});if(r.success)return r.data;throw new Error(r.errorMessage||"Action failed")}}}var m=Symbol("DJVRuntime");function f(e){l(m,e)}function y(){const e=u(m);if(!e)throw new Error("useDJVRuntime must be used within a DJVProvider");return e}function h(){const e=y(),t=s(()=>{const t=e.value.state.phase;return"ready"!==t&&"error"!==t}),n=s(()=>"ready"===e.value.state.phase),r=s(()=>"error"===e.value.state.phase||null!==e.value.state.error);return{runtime:s(()=>e.value.runtime),state:s(()=>e.value.state),loading:t,phase:s(()=>e.value.state.phase),error:s(()=>e.value.state.error),page:s(()=>e.value.state.page),isReady:n,hasError:r,reload:async()=>{const t=e.value.runtime;if(!t)throw new Error("Runtime not available");await t.load(),await t.render()}}}function v(){const e=y().value.hostApi;if(!e)throw new Error("HostAPI not available. Make sure runtime is initialized.");return e}function w(e){const t=y();return s(()=>t.value.state.variables[e])}function g(e,t){const n=y();return[s(()=>n.value.state.variables[e]??t),t=>{n.value.runtime?.setVariable(e,t)}]}function b(e,n){const o=y(),i=t(!1),l=t(null),c=t(null);let u=null;const d=s(()=>o.value.state.queries[e]),p=async()=>{i.value=!0,l.value=null;try{await(o.value.runtime?.refreshData(e)),c.value=Date.now()}catch(e){l.value=e}finally{i.value=!1}};return r(()=>{n?.refreshOnMount&&o.value.runtime&&p(),n?.refreshInterval&&n.refreshInterval>0&&(u=setInterval(p,n.refreshInterval)),n?.refreshOnFocus&&window.addEventListener("focus",p)}),a(()=>{u&&clearInterval(u),n?.refreshOnFocus&&window.removeEventListener("focus",p)}),{data:d,loading:i,error:l,refetch:p,lastUpdated:c}}function j(e,r){const a=y(),o=t(!1),i=n(),l=t(null),s=t(0),c=async(t,n)=>{const o=a.value.hostApi;if(!o)throw new Error("HostAPI not available");try{const n=await o.executeAction(e,t);if(n.success)return n.data;throw new Error(n.errorMessage||"Action failed")}catch(e){if(n>0)return await new Promise(e=>setTimeout(e,r?.retryDelay||1e3)),c(t,n-1);throw e}};return{execute:async e=>{o.value=!0,l.value=null,s.value++;try{const t=await c(e,r?.retryCount||0);return i.value=t,r?.onSuccess?.(t),t}catch(e){const t=e;throw l.value=t,r?.onError?.(t),e}finally{o.value=!1}},loading:o,result:i,error:l,reset:()=>{i.value=void 0,l.value=null,s.value=0},executionCount:s}}function T(e,i,l){const s=y(),c=n(),u=t(!1),d=t(null),p=t(!1);let m=null;const f=async t=>{const n=s.value.hostApi;if(!n)throw new Error("HostAPI not available");u.value=!0,d.value=null;try{const r=await n.requestData(e,t||(()=>{if(i)return"object"==typeof i&&"value"in i?i.value:i})());c.value=r,p.value=!0,l?.onSuccess?.(r)}catch(e){const t=e;d.value=t,l?.onError?.(t)}finally{u.value=!1}};return i&&"object"==typeof i&&"value"in i&&!1!==l?.refreshOnParamsChange&&o(i,()=>{p.value&&f()},{deep:!0}),r(()=>{!1!==l?.immediate&&s.value.hostApi&&f(),l?.refreshInterval&&l.refreshInterval>0&&(m=setInterval(f,l.refreshInterval))}),a(()=>{m&&clearInterval(m)}),{data:c,loading:u,error:d,refetch:f,isFetched:p}}function E(e,t){const n=y(),r=n.value.runtime?.on(e,e=>{t(e.data)});a(()=>{r?.()})}function I(){const e=y();return{pageUid:s(()=>e.value.state.page?.pageUid),pageVersionId:s(()=>e.value.state.page?.pageVersionId),schemaVersion:s(()=>e.value.state.page?.pageJson?.schemaVersion),title:s(()=>{const t=e.value.state.page;return t?.title}),config:s(()=>{const t=e.value.state.page;return t?.config}),isLoaded:s(()=>null!==e.value.state.page)}}function k(e){const t=y(),n=s(()=>t.value.state.components.get(e));return{isLoaded:s(()=>"loaded"===n.value?.status),isLoading:s(()=>"loading"===n.value?.status),hasError:s(()=>"failed"===n.value?.status),loadTime:s(()=>n.value?.loadTime),info:n}}function A(e){const n=y(),r=t(!1),a=t(!1);return o(()=>n.value.state.phase,async(t,o)=>{if(e?.onPhaseChange?.(t),!r.value&&"idle"!==t){r.value=!0;try{await(e?.onMounted?.())}catch(t){e?.onError?.(t)}}if(!a.value&&"ready"===t){a.value=!0;try{await(e?.onReady?.())}catch(t){e?.onError?.(t)}}"error"===t&&"error"!==o&&e?.onError?.(n.value.state.error)},{immediate:!0}),{phase:s(()=>n.value.state.phase),hasMounted:c(r),hasReady:c(a)}}function R(e,n,r){const i=t(!1),{once:l=!0,immediate:s=!0}=r||{},u=o(e,async e=>{!e||l&&i.value||(i.value=!0,await n(),l&&u())},{immediate:s});return a(()=>{u()}),{executed:c(i),stop:u}}function D(e,t=300){const{execute:n,loading:r,result:o,error:i}=j(e);let l=null;const s=()=>{l&&(clearTimeout(l),l=null)};return a(()=>{s()}),{execute:e=>{l&&clearTimeout(l),l=setTimeout(()=>{n(e).catch(()=>{})},t)},loading:r,result:o,error:i,cancel:s}}function S(){return u("djvlc-config",{})}var V=e({name:"DJVRenderer",props:{pageUid:{type:String,required:!0},apiBaseUrl:{type:String,required:!0},cdnBaseUrl:{type:String,required:!0},channel:{type:String,default:"prod"},userId:String,deviceId:String,authToken:String,previewToken:String,debug:{type:Boolean,default:!1},enableSRI:{type:Boolean,default:!0},retryCount:{type:Number,default:3},retryDelay:{type:Number,default:1e3},timeout:{type:Number,default:3e4}},emits:["load","error","ready","phase-change"],setup(e,{emit:l,slots:s}){const c=t(null),u=t(!0),d=t(0),m=t("idle"),y=n({runtime:null,state:{phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},hostApi:null});f(y);let h=null;const v=async()=>{if(!c.value||!u.value)return;const t={pageUid:e.pageUid,apiBaseUrl:e.apiBaseUrl,cdnBaseUrl:e.cdnBaseUrl,channel:e.channel,userId:e.userId,deviceId:e.deviceId,authToken:e.authToken,previewToken:e.previewToken,debug:e.debug,enableSRI:e.enableSRI,containerRef:c,onError:e=>{l("error",e)}};h=p(t);try{await(n=(async()=>{if(await h.init(),!u.value)return;m.value="loading",l("phase-change","loading"),y.value={runtime:h.runtime.value,state:h.runtime.value?.getState()||y.value.state,hostApi:h.hostApi.value};const e=await h.load();u.value&&(l("load",e),y.value={...y.value,state:h.runtime.value?.getState()||y.value.state,hostApi:h.hostApi.value},await h.render(),u.value&&(m.value="ready",l("phase-change","ready"),l("ready"),d.value=0,h.runtime.value?.onStateChange(e=>{u.value&&(y.value={...y.value,state:e},m.value=e.phase,l("phase-change",e.phase))})))})(),r=e.timeout,Promise.race([n,new Promise((e,t)=>setTimeout(()=>t(new Error("加载超时")),r))]))}catch(t){if(!u.value)return;d.value<e.retryCount?(d.value++,e.debug,setTimeout(()=>{u.value&&v()},e.retryDelay)):(m.value="error",l("phase-change","error"),l("error",t))}var n,r},w=()=>{d.value=0,v()};return r(()=>{u.value=!0,v()}),a(()=>{u.value=!1,h?.destroy()}),o(()=>e.pageUid,()=>{h?.destroy(),d.value=0,v()}),()=>{const t=h?.loading.value??!1,n=h?.error.value,r=h?.page.value;return i("div",{ref:c,class:"djvlc-renderer","data-phase":m.value,"data-page-uid":e.pageUid},[t&&(s.loading?.()||i("div",{class:"djvlc-loading"},[i("div",{class:"djvlc-loading-spinner"}),i("span",{},"加载中..."),d.value>0&&i("span",{class:"djvlc-loading-retry"},`重试 ${d.value}/${e.retryCount}`)])),n&&(s.error?.({error:n,retry:w})||(a=n,i("div",{class:"djvlc-error"},[i("div",{class:"djvlc-error-icon"},"⚠️"),i("span",{class:"djvlc-error-message"},`加载失败：${a.message}`),i("button",{class:"djvlc-error-retry-btn",onClick:w,type:"button"},"重试")]))),!t&&!n&&!r&&"ready"===m.value&&(s.empty?.()||i("div",{class:"djvlc-empty"},[i("span",{},"暂无内容")])),s.default?.()]);var a}}}),x={phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},B=e({name:"DJVProvider",props:{runtime:{type:Object,default:null},hostApi:{type:Object,default:null},class:{type:String,default:""},debug:{type:Boolean,default:!1}},emits:["state-change","phase-change","error"],setup(e,{slots:t,emit:r}){let l=null;const s=n({runtime:e.runtime,state:e.runtime?.getState()||x,hostApi:e.hostApi});f(s);const c=t=>{l&&(l(),l=null),t&&(l=t.onStateChange(t=>{const n=s.value.state.phase;s.value={...s.value,state:t},r("state-change",t),t.phase!==n&&(r("phase-change",t.phase),e.debug),t.error&&r("error",t.error)}))};return c(e.runtime),o(()=>e.runtime,(t,n)=>{t!==n&&(s.value={runtime:t,state:t?.getState()||x,hostApi:e.hostApi},c(t))}),o(()=>e.hostApi,e=>{s.value={...s.value,hostApi:e}}),a(()=>{l&&(l(),l=null)}),()=>i("div",{class:["djvlc-provider",e.class].filter(Boolean).join(" "),"data-phase":s.value.state.phase},t.default?.())}}),P="djvlc-config";function U(e,t){window.dispatchEvent(new CustomEvent("djvlc:track",{detail:{event:e,data:t,timestamp:Date.now()}}))}function J(e,t){e.style.display=t?"":"none"}function C(e,t,n){let r=n.get(e);t?(r||(r=document.createElement("div"),r.className="djvlc-loading-overlay",r.innerHTML='\n        <div class="djvlc-loading-spinner"></div>\n      ',r.style.cssText="\n        position: absolute;\n        inset: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        background: rgba(255, 255, 255, 0.8);\n        z-index: 100;\n      ",e.appendChild(r),n.set(e,r)),r.style.display="flex"):r&&(r.style.display="none")}var M={install(e,t={}){const n=t.componentPrefix||"";!1!==t.registerComponents&&(e.component(`${n}DJVRenderer`,V),e.component(`${n}DJVProvider`,B)),!1!==t.registerDirectives&&(e.directive("djv-track",function(){const e=new WeakSet;return{mounted(t,n){const{event:r,data:a={},trigger:o="click"}=n.value;if("click"===o)t.addEventListener("click",()=>{U(r,{...a,element:t.tagName})});else if("view"===o){if(!e.has(t)){e.add(t);const n=new IntersectionObserver(e=>{e.forEach(e=>{e.isIntersecting&&(U(r,{...a,element:t.tagName}),n.unobserve(t))})},{threshold:.5});n.observe(t)}}else"mounted"===o&&U(r,{...a,element:t.tagName})}}}()),e.directive("djv-visible",{mounted(e,t){J(e,t.value)},updated(e,t){J(e,t.value)}}),e.directive("djv-loading",function(){const e=new WeakMap;return{mounted(t,n){t.style.position="relative",C(t,n.value,e)},updated(t,n){C(t,n.value,e)},unmounted(t){const n=e.get(t);n&&(n.remove(),e.delete(t))}}}()));const r={apiBaseUrl:t.apiBaseUrl,cdnBaseUrl:t.cdnBaseUrl,channel:t.channel,debug:t.debug,enableSRI:t.enableSRI,enableMetrics:t.enableMetrics,retryCount:t.retryCount,retryDelay:t.retryDelay,timeout:t.timeout};e.provide(P,r),e.config.globalProperties.$djvlc={config:r,track:U}}};export{P as DJVLC_CONFIG_KEY,M as DJVPlugin,B as DJVProvider,V as DJVRenderer,m as RuntimeContextKey,p as createVueRuntime,y as injectRuntime,f as provideRuntime,j as useAction,k as useComponentState,h as useDJVRuntime,T as useData,D as useDebouncedAction,S as useGlobalConfig,v as useHostApi,A as useLifecycle,I as usePageInfo,b as useQuery,E as useRuntimeEvent,w as useRuntimeState,g as useRuntimeStateWritable,R as useWhen};
+import{defineComponent as e,ref as t,shallowRef as n,onMounted as r,onUnmounted as a,watch as o,h as i,provide as l,computed as s,readonly as c,inject as u}from"vue";import{createRuntime as d}from"@djvlc/runtime-core";function p(e){const r=n(null),a=t(!0),o=t("idle"),i=n(null),l=n(null),u=n(null),p=s(()=>"ready"===o.value),m=s(()=>"error"===o.value||null!==l.value),f=n({initTime:0,loadTime:0,renderTime:0,totalTime:0,initTimestamp:null,readyTimestamp:null});let y=0,h=0,v=0,w=0;const g=async()=>{if(!r.value)throw new Error("Runtime not initialized");v=performance.now();const t=await r.value.load();return i.value=t,u.value=r.value.getHostApi(),e.enableMetrics&&(f.value={...f.value,loadTime:performance.now()-v}),t},b=async()=>{if(!r.value)throw new Error("Runtime not initialized");if(w=performance.now(),await r.value.render(),a.value=!1,e.enableMetrics){const e=performance.now();f.value={...f.value,renderTime:e-w,totalTime:e-y,readyTimestamp:Date.now()}}};return{runtime:r,loading:c(a),phase:c(o),page:i,error:l,hostApi:u,isReady:p,hasError:m,metrics:f,init:async()=>{const t=e.containerRef?.value;if(!t)throw new Error("Container element not found");y=performance.now(),h=y,e.enableMetrics&&(f.value={...f.value,initTimestamp:Date.now()});const n=d({...e,container:t,onError:t=>{l.value=t,e.onError?.(t)},onEvent:t=>{e.onEvent?.(t)}});r.value=n,n.onStateChange(e=>{o.value=e.phase,a.value="ready"!==e.phase&&"error"!==e.phase,e.page&&(i.value=e.page),e.error&&(l.value=e.error)}),await n.init(),u.value=n.getHostApi(),e.enableMetrics&&(f.value={...f.value,initTime:performance.now()-h})},load:g,render:b,destroy:()=>{r.value?.destroy(),r.value=null,u.value=null,i.value=null,l.value=null,o.value="idle",a.value=!0},reload:async()=>{if(!r.value)throw new Error("Runtime not initialized");l.value=null,a.value=!0,await g(),await b()},setVariable:(e,t)=>{r.value?.setVariable(e,t)},setVariables:e=>{r.value&&Object.entries(e).forEach(([e,t])=>{r.value?.setVariable(e,t)})},getVariable:e=>r.value?.getState().variables[e],refreshData:async e=>{await(r.value?.refreshData(e))},executeAction:async(e,t)=>{const n=u.value;if(!n)throw new Error("HostAPI not available");const r=await n.executeAction(e,t||{});if(r.success)return r.data;throw new Error(r.errorMessage||"Action failed")}}}var m=Symbol("DJVRuntime");function f(e){l(m,e)}function y(){const e=u(m);if(!e)throw new Error("useDJVRuntime must be used within a DJVProvider");return e}function h(){const e=y(),t=s(()=>{const t=e.value.state.phase;return"ready"!==t&&"error"!==t}),n=s(()=>"ready"===e.value.state.phase),r=s(()=>"error"===e.value.state.phase||null!==e.value.state.error);return{runtime:s(()=>e.value.runtime),state:s(()=>e.value.state),loading:t,phase:s(()=>e.value.state.phase),error:s(()=>e.value.state.error),page:s(()=>e.value.state.page),isReady:n,hasError:r,reload:async()=>{const t=e.value.runtime;if(!t)throw new Error("Runtime not available");await t.load(),await t.render()}}}function v(){const e=y().value.hostApi;if(!e)throw new Error("HostAPI not available. Make sure runtime is initialized.");return e}function w(e){const t=y();return s(()=>t.value.state.variables[e])}function g(e,t){const n=y();return[s(()=>n.value.state.variables[e]??t),t=>{n.value.runtime?.setVariable(e,t)}]}function b(e,n){const o=y(),i=t(!1),l=t(null),c=t(null);let u=null;const d=s(()=>o.value.state.queries[e]),p=async()=>{i.value=!0,l.value=null;try{await(o.value.runtime?.refreshData(e)),c.value=Date.now()}catch(e){l.value=e}finally{i.value=!1}};return r(()=>{n?.refreshOnMount&&o.value.runtime&&p(),n?.refreshInterval&&n.refreshInterval>0&&(u=setInterval(p,n.refreshInterval)),n?.refreshOnFocus&&window.addEventListener("focus",p)}),a(()=>{u&&clearInterval(u),n?.refreshOnFocus&&window.removeEventListener("focus",p)}),{data:d,loading:i,error:l,refetch:p,lastUpdated:c}}function j(e,r){const a=y(),o=t(!1),i=n(),l=t(null),s=t(0),c=async(t,n)=>{const o=a.value.hostApi;if(!o)throw new Error("HostAPI not available");try{const n=await o.executeAction(e,t);if(n.success)return n.data;throw new Error(n.errorMessage||"Action failed")}catch(e){if(n>0)return await new Promise(e=>setTimeout(e,r?.retryDelay||1e3)),c(t,n-1);throw e}};return{execute:async e=>{o.value=!0,l.value=null,s.value++;try{const t=await c(e,r?.retryCount||0);return i.value=t,r?.onSuccess?.(t),t}catch(e){const t=e;throw l.value=t,r?.onError?.(t),e}finally{o.value=!1}},loading:o,result:i,error:l,reset:()=>{i.value=void 0,l.value=null,s.value=0},executionCount:s}}function T(e,i,l){const s=y(),c=n(),u=t(!1),d=t(null),p=t(!1);let m=null;const f=async t=>{const n=s.value.hostApi;if(!n)throw new Error("HostAPI not available");u.value=!0,d.value=null;try{const r=await n.requestData(e,t||(()=>{if(i)return"object"==typeof i&&"value"in i?i.value:i})());c.value=r,p.value=!0,l?.onSuccess?.(r)}catch(e){const t=e;d.value=t,l?.onError?.(t)}finally{u.value=!1}};return i&&"object"==typeof i&&"value"in i&&!1!==l?.refreshOnParamsChange&&o(i,()=>{p.value&&f()},{deep:!0}),r(()=>{!1!==l?.immediate&&s.value.hostApi&&f(),l?.refreshInterval&&l.refreshInterval>0&&(m=setInterval(f,l.refreshInterval))}),a(()=>{m&&clearInterval(m)}),{data:c,loading:u,error:d,refetch:f,isFetched:p}}function E(e,t){const n=y(),r=n.value.runtime?.on(e,e=>{t(e.data)});a(()=>{r?.()})}function I(){const e=y();return{pageId:s(()=>e.value.state.page?.pageId),pageVersionId:s(()=>e.value.state.page?.pageVersionId),schemaVersion:s(()=>e.value.state.page?.pageJson?.schemaVersion),title:s(()=>{const t=e.value.state.page;return t?.title}),config:s(()=>{const t=e.value.state.page;return t?.config}),isLoaded:s(()=>null!==e.value.state.page)}}function k(e){const t=y(),n=s(()=>t.value.state.components.get(e));return{isLoaded:s(()=>"loaded"===n.value?.status),isLoading:s(()=>"loading"===n.value?.status),hasError:s(()=>"failed"===n.value?.status),loadTime:s(()=>n.value?.loadTime),info:n}}function A(e){const n=y(),r=t(!1),a=t(!1);return o(()=>n.value.state.phase,async(t,o)=>{if(e?.onPhaseChange?.(t),!r.value&&"idle"!==t){r.value=!0;try{await(e?.onMounted?.())}catch(t){e?.onError?.(t)}}if(!a.value&&"ready"===t){a.value=!0;try{await(e?.onReady?.())}catch(t){e?.onError?.(t)}}"error"===t&&"error"!==o&&e?.onError?.(n.value.state.error)},{immediate:!0}),{phase:s(()=>n.value.state.phase),hasMounted:c(r),hasReady:c(a)}}function R(e,n,r){const i=t(!1),{once:l=!0,immediate:s=!0}=r||{},u=o(e,async e=>{!e||l&&i.value||(i.value=!0,await n(),l&&u())},{immediate:s});return a(()=>{u()}),{executed:c(i),stop:u}}function D(e,t=300){const{execute:n,loading:r,result:o,error:i}=j(e);let l=null;const s=()=>{l&&(clearTimeout(l),l=null)};return a(()=>{s()}),{execute:e=>{l&&clearTimeout(l),l=setTimeout(()=>{n(e).catch(()=>{})},t)},loading:r,result:o,error:i,cancel:s}}function S(){return u("djvlc-config",{})}var V=e({name:"DJVRenderer",props:{pageId:{type:String,required:!0},apiBaseUrl:{type:String,required:!0},cdnBaseUrl:{type:String,required:!0},channel:{type:String,default:"prod"},userId:String,deviceId:String,authToken:String,previewToken:String,debug:{type:Boolean,default:!1},enableSRI:{type:Boolean,default:!0},retryCount:{type:Number,default:3},retryDelay:{type:Number,default:1e3},timeout:{type:Number,default:3e4}},emits:["load","error","ready","phase-change"],setup(e,{emit:l,slots:s}){const c=t(null),u=t(!0),d=t(0),m=t("idle"),y=n({runtime:null,state:{phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},hostApi:null});f(y);let h=null;const v=async()=>{if(!c.value||!u.value)return;const t={pageId:e.pageId,apiBaseUrl:e.apiBaseUrl,cdnBaseUrl:e.cdnBaseUrl,channel:e.channel,userId:e.userId,deviceId:e.deviceId,authToken:e.authToken,previewToken:e.previewToken,debug:e.debug,enableSRI:e.enableSRI,containerRef:c,onError:e=>{l("error",e)}};h=p(t);try{await(n=(async()=>{if(await h.init(),!u.value)return;m.value="loading",l("phase-change","loading"),y.value={runtime:h.runtime.value,state:h.runtime.value?.getState()||y.value.state,hostApi:h.hostApi.value};const e=await h.load();u.value&&(l("load",e),y.value={...y.value,state:h.runtime.value?.getState()||y.value.state,hostApi:h.hostApi.value},await h.render(),u.value&&(m.value="ready",l("phase-change","ready"),l("ready"),d.value=0,h.runtime.value?.onStateChange(e=>{u.value&&(y.value={...y.value,state:e},m.value=e.phase,l("phase-change",e.phase))})))})(),r=e.timeout,Promise.race([n,new Promise((e,t)=>setTimeout(()=>t(new Error("加载超时")),r))]))}catch(t){if(!u.value)return;d.value<e.retryCount?(d.value++,e.debug,setTimeout(()=>{u.value&&v()},e.retryDelay)):(m.value="error",l("phase-change","error"),l("error",t))}var n,r},w=()=>{d.value=0,v()};return r(()=>{u.value=!0,v()}),a(()=>{u.value=!1,h?.destroy()}),o(()=>e.pageId,()=>{h?.destroy(),d.value=0,v()}),()=>{const t=h?.loading.value??!1,n=h?.error.value,r=h?.page.value;return i("div",{ref:c,class:"djvlc-renderer","data-phase":m.value,"data-page-id":e.pageId},[t&&(s.loading?.()||i("div",{class:"djvlc-loading"},[i("div",{class:"djvlc-loading-spinner"}),i("span",{},"加载中..."),d.value>0&&i("span",{class:"djvlc-loading-retry"},`重试 ${d.value}/${e.retryCount}`)])),n&&(s.error?.({error:n,retry:w})||(a=n,i("div",{class:"djvlc-error"},[i("div",{class:"djvlc-error-icon"},"⚠️"),i("span",{class:"djvlc-error-message"},`加载失败：${a.message}`),i("button",{class:"djvlc-error-retry-btn",onClick:w,type:"button"},"重试")]))),!t&&!n&&!r&&"ready"===m.value&&(s.empty?.()||i("div",{class:"djvlc-empty"},[i("span",{},"暂无内容")])),s.default?.()]);var a}}}),x={phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},B=e({name:"DJVProvider",props:{runtime:{type:Object,default:null},hostApi:{type:Object,default:null},class:{type:String,default:""},debug:{type:Boolean,default:!1}},emits:["state-change","phase-change","error"],setup(e,{slots:t,emit:r}){let l=null;const s=n({runtime:e.runtime,state:e.runtime?.getState()||x,hostApi:e.hostApi});f(s);const c=t=>{l&&(l(),l=null),t&&(l=t.onStateChange(t=>{const n=s.value.state.phase;s.value={...s.value,state:t},r("state-change",t),t.phase!==n&&(r("phase-change",t.phase),e.debug),t.error&&r("error",t.error)}))};return c(e.runtime),o(()=>e.runtime,(t,n)=>{t!==n&&(s.value={runtime:t,state:t?.getState()||x,hostApi:e.hostApi},c(t))}),o(()=>e.hostApi,e=>{s.value={...s.value,hostApi:e}}),a(()=>{l&&(l(),l=null)}),()=>i("div",{class:["djvlc-provider",e.class].filter(Boolean).join(" "),"data-phase":s.value.state.phase},t.default?.())}}),P="djvlc-config";function J(e,t){window.dispatchEvent(new CustomEvent("djvlc:track",{detail:{event:e,data:t,timestamp:Date.now()}}))}function U(e,t){e.style.display=t?"":"none"}function C(e,t,n){let r=n.get(e);t?(r||(r=document.createElement("div"),r.className="djvlc-loading-overlay",r.innerHTML='\n        <div class="djvlc-loading-spinner"></div>\n      ',r.style.cssText="\n        position: absolute;\n        inset: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        background: rgba(255, 255, 255, 0.8);\n        z-index: 100;\n      ",e.appendChild(r),n.set(e,r)),r.style.display="flex"):r&&(r.style.display="none")}var M={install(e,t={}){const n=t.componentPrefix||"";!1!==t.registerComponents&&(e.component(`${n}DJVRenderer`,V),e.component(`${n}DJVProvider`,B)),!1!==t.registerDirectives&&(e.directive("djv-track",function(){const e=new WeakSet;return{mounted(t,n){const{event:r,data:a={},trigger:o="click"}=n.value;if("click"===o)t.addEventListener("click",()=>{J(r,{...a,element:t.tagName})});else if("view"===o){if(!e.has(t)){e.add(t);const n=new IntersectionObserver(e=>{e.forEach(e=>{e.isIntersecting&&(J(r,{...a,element:t.tagName}),n.unobserve(t))})},{threshold:.5});n.observe(t)}}else"mounted"===o&&J(r,{...a,element:t.tagName})}}}()),e.directive("djv-visible",{mounted(e,t){U(e,t.value)},updated(e,t){U(e,t.value)}}),e.directive("djv-loading",function(){const e=new WeakMap;return{mounted(t,n){t.style.position="relative",C(t,n.value,e)},updated(t,n){C(t,n.value,e)},unmounted(t){const n=e.get(t);n&&(n.remove(),e.delete(t))}}}()));const r={apiBaseUrl:t.apiBaseUrl,cdnBaseUrl:t.cdnBaseUrl,channel:t.channel,debug:t.debug,enableSRI:t.enableSRI,enableMetrics:t.enableMetrics,retryCount:t.retryCount,retryDelay:t.retryDelay,timeout:t.timeout};e.provide(P,r),e.config.globalProperties.$djvlc={config:r,track:J}}};export{P as DJVLC_CONFIG_KEY,M as DJVPlugin,B as DJVProvider,V as DJVRenderer,m as RuntimeContextKey,p as createVueRuntime,y as injectRuntime,f as provideRuntime,j as useAction,k as useComponentState,h as useDJVRuntime,T as useData,D as useDebouncedAction,S as useGlobalConfig,v as useHostApi,A as useLifecycle,I as usePageInfo,b as useQuery,E as useRuntimeEvent,w as useRuntimeState,g as useRuntimeStateWritable,R as useWhen};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djvlc/runtime-host-vue",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "description": "DJV 低代码平台 Vue3 宿主适配器",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -26,7 +26,7 @@
     "clean": "rimraf dist"
   },
   "dependencies": {
-    "@djvlc/runtime-core": "1.0.2"
+    "@djvlc/runtime-core": "1.1.0"
   },
   "devDependencies": {
     "@types/node": "^20.10.0",