@myop/vue 0.0.46 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { defineComponent as X, useSlots as Z, computed as y, createElementBlock as T, openBlock as S, normalizeStyle as q, renderSlot as H, unref as he, ref as p, shallowRef as ct, watch as le, onMounted as Re, onUnmounted as ut, createElementVNode as Ae, createBlock as Ie, createCommentVNode as fe, withCtx as De, markRaw as Fe, useAttrs as ft, getCurrentInstance as pt, reactive as dt, watchEffect as mt, Fragment as ht, mergeProps as gt } from "vue";
1
+ import { defineComponent as X, useSlots as Z, computed as y, createElementBlock as T, openBlock as S, normalizeStyle as q, renderSlot as H, unref as me, ref as p, shallowRef as ct, watch as le, onMounted as Re, onUnmounted as ut, createElementVNode as Ae, createBlock as Ie, createCommentVNode as fe, withCtx as De, markRaw as Fe, useAttrs as ft, getCurrentInstance as pt, reactive as dt, watchEffect as ht, Fragment as mt, mergeProps as gt } from "vue";
2
2
  import { containerStyleObject as yt, loaderStyleObject as _t, getMyopLogoHtml as Te, fallbackStyleObject as Ct, hostSDK as He } from "@myop/sdk/host";
3
3
  import { isPreloaded as vt, getCloudRepository as Et, CloudRepository as Nt } from "@myop/sdk/helpers";
4
4
  import { enableLocalDev as Dn, enableSelfHosted as Fn, getCloudRepository as $n, getPreloadedParams as xn, isPreloaded as Rn, preloadComponents as An, setCloudRepository as Tn, setCloudRepositoryUrl as Hn, setEnvironment as Mn } from "@myop/sdk/helpers";
@@ -31,7 +31,7 @@ const bt = ["innerHTML"], St = /* @__PURE__ */ X({
31
31
  ], 4)) : (S(), T("div", {
32
32
  key: 1,
33
33
  style: q(i.value),
34
- innerHTML: he(a)
34
+ innerHTML: me(a)
35
35
  }, null, 12, bt));
36
36
  }
37
37
  }), wt = ["innerHTML"], Ot = /* @__PURE__ */ X({
@@ -59,7 +59,7 @@ const bt = ["innerHTML"], St = /* @__PURE__ */ X({
59
59
  ])) : (S(), T("div", {
60
60
  key: 1,
61
61
  style: r,
62
- innerHTML: he(i)
62
+ innerHTML: me(i)
63
63
  }, null, 8, wt));
64
64
  }
65
65
  }), On = /* @__PURE__ */ X({
@@ -69,6 +69,7 @@ const bt = ["innerHTML"], St = /* @__PURE__ */ X({
69
69
  componentId: {},
70
70
  componentConfig: {},
71
71
  data: {},
72
+ loaderOptions: {},
72
73
  fadeDuration: { default: 200 },
73
74
  autoSize: { type: Boolean, default: !0 },
74
75
  environment: {},
@@ -102,20 +103,20 @@ const bt = ["innerHTML"], St = /* @__PURE__ */ X({
102
103
  oe.value = !0;
103
104
  let f = !1;
104
105
  try {
105
- const m = JSON.parse(JSON.stringify({
106
+ const h = JSON.parse(JSON.stringify({
106
107
  componentId: u.componentId,
107
108
  data: u.data,
108
109
  environment: u.environment,
109
110
  preview: u.preview,
110
111
  autoSize: u.autoSize
111
112
  }));
112
- if (!m.componentId && !u.componentConfig) {
113
+ if (!h.componentId && !u.componentConfig) {
113
114
  se("No component configuration provided");
114
115
  return;
115
116
  }
116
- const it = m.preview === !0 ? !0 : void 0, lt = u.componentConfig ? JSON.parse(JSON.stringify(u.componentConfig)) : await Et().fetchComponentV2(
117
- m.componentId,
118
- m.environment,
117
+ const it = h.preview === !0 ? !0 : void 0, lt = u.componentConfig ? JSON.parse(JSON.stringify(u.componentConfig)) : await Et().fetchComponentV2(
118
+ h.componentId,
119
+ h.environment,
119
120
  it
120
121
  );
121
122
  if (!l.value) {
@@ -123,10 +124,14 @@ const bt = ["innerHTML"], St = /* @__PURE__ */ X({
123
124
  return;
124
125
  }
125
126
  const at = Fe({
126
- data: m.data,
127
+ // Spread user-provided loader options first (e.g. injectCss, hooks, timeout)
128
+ // so the wrapper-managed fields below take precedence.
129
+ ...u.loaderOptions ?? {},
127
130
  _environment: {
128
- props: m
129
- }
131
+ props: h
132
+ },
133
+ // Explicit `data` prop wins over loaderOptions.data when provided.
134
+ ...h.data !== void 0 ? { data: h.data } : {}
130
135
  }), we = await He.loadComponent(
131
136
  lt,
132
137
  l.value,
@@ -149,12 +154,12 @@ const bt = ["innerHTML"], St = /* @__PURE__ */ X({
149
154
  Ne.value = { fillWidth: Oe, fillHeight: ke }, (!(i.autoSize ?? !0) || Oe && ke) && re(), (Se = c.value) != null && Se.props && (c.value.props.myop_cta_handler = (U, Ve) => {
150
155
  i.on && i.on(U, Ve), a("cta", U, Ve);
151
156
  }), a("load", c.value);
152
- } catch (m) {
153
- f || se((m == null ? void 0 : m.message) || "Unknown error");
157
+ } catch (h) {
158
+ f || se((h == null ? void 0 : h.message) || "Unknown error");
154
159
  } finally {
155
160
  if (oe.value = !1, L.value !== null && !f) {
156
- const m = L.value;
157
- L.value = null, await ie(m);
161
+ const h = L.value;
162
+ L.value = null, await ie(h);
158
163
  }
159
164
  }
160
165
  return () => {
@@ -513,7 +518,7 @@ function Ut(e, t, n, o = !0, s = !1) {
513
518
  console.error(e);
514
519
  }
515
520
  }
516
- const h = [];
521
+ const m = [];
517
522
  let v = -1;
518
523
  const A = [];
519
524
  let b = null, x = 0;
@@ -521,18 +526,18 @@ const Jt = /* @__PURE__ */ Promise.resolve();
521
526
  let de = null;
522
527
  const Wt = 100;
523
528
  function qt(e) {
524
- let t = v + 1, n = h.length;
529
+ let t = v + 1, n = m.length;
525
530
  for (; t < n; ) {
526
- const o = t + n >>> 1, s = h[o], r = z(s);
531
+ const o = t + n >>> 1, s = m[o], r = z(s);
527
532
  r < e || r === e && s.flags & 2 ? t = o + 1 : n = o;
528
533
  }
529
534
  return t;
530
535
  }
531
536
  function Bt(e) {
532
537
  if (!(e.flags & 1)) {
533
- const t = z(e), n = h[h.length - 1];
538
+ const t = z(e), n = m[m.length - 1];
534
539
  !n || // fast path when the job id is larger than the tail
535
- !(e.flags & 2) && t >= z(n) ? h.push(e) : h.splice(qt(t), 0, e), e.flags |= 1, Ue();
540
+ !(e.flags & 2) && t >= z(n) ? m.push(e) : m.splice(qt(t), 0, e), e.flags |= 1, Ue();
536
541
  }
537
542
  }
538
543
  function Ue() {
@@ -562,8 +567,8 @@ function Je(e) {
562
567
  process.env.NODE_ENV !== "production" && (e = e || /* @__PURE__ */ new Map());
563
568
  const t = process.env.NODE_ENV !== "production" ? (n) => We(e, n) : Me;
564
569
  try {
565
- for (v = 0; v < h.length; v++) {
566
- const n = h[v];
570
+ for (v = 0; v < m.length; v++) {
571
+ const n = m[v];
567
572
  if (n && !(n.flags & 8)) {
568
573
  if (process.env.NODE_ENV !== "production" && t(n))
569
574
  continue;
@@ -575,11 +580,11 @@ function Je(e) {
575
580
  }
576
581
  }
577
582
  } finally {
578
- for (; v < h.length; v++) {
579
- const n = h[v];
583
+ for (; v < m.length; v++) {
584
+ const n = m[v];
580
585
  n && (n.flags &= -2);
581
586
  }
582
- v = -1, h.length = 0, Yt(e), de = null, (h.length || A.length) && Je(e);
587
+ v = -1, m.length = 0, Yt(e), de = null, (m.length || A.length) && Je(e);
583
588
  }
584
589
  }
585
590
  function We(e, t) {
@@ -732,7 +737,7 @@ function dn(e, t = null, n = null, o = 0, s = null, r = e === Ye ? 0 : 1, i = !1
732
737
  };
733
738
  return a ? (Ee(l, n), r & 128 && e.normalize(l)) : n && (l.shapeFlag |= w(n) ? 8 : 16), process.env.NODE_ENV !== "production" && l.key !== l.key && O("VNode created with invalid key (NaN). VNode type:", l.type), l;
734
739
  }
735
- const mn = process.env.NODE_ENV !== "production" ? pn : Qe;
740
+ const hn = process.env.NODE_ENV !== "production" ? pn : Qe;
736
741
  function Qe(e, t = null, n = null, o = 0, s = null, r = !1) {
737
742
  if ((!e || e === rn) && (process.env.NODE_ENV !== "production" && !e && O(`Invalid vnode type when creating vnode: ${e}.`), e = un), fn(e)) {
738
743
  const a = Q(
@@ -744,7 +749,7 @@ function Qe(e, t = null, n = null, o = 0, s = null, r = !1) {
744
749
  return n && Ee(a, n), a.patchFlag = -2, a;
745
750
  }
746
751
  if (nt(e) && (e = e.__vccOpts), t) {
747
- t = hn(t);
752
+ t = mn(t);
748
753
  let { class: a, style: l } = t;
749
754
  a && !w(a) && (t.class = _e(a)), M(l) && (/* @__PURE__ */ pe(l) && !C(l) && (l = ge({}, l)), t.style = ye(l));
750
755
  }
@@ -765,7 +770,7 @@ Component that was made reactive: `,
765
770
  !0
766
771
  );
767
772
  }
768
- function hn(e) {
773
+ function mn(e) {
769
774
  return e ? /* @__PURE__ */ pe(e) || Ke(e) ? ge({}, e) : e : null;
770
775
  }
771
776
  function Q(e, t, n = !1, o = !1) {
@@ -823,7 +828,7 @@ function Xe(e) {
823
828
  return C(e.children) && (t.children = e.children.map(Xe)), t;
824
829
  }
825
830
  function gn(e = " ", t = 0) {
826
- return mn(cn, null, e, t);
831
+ return hn(cn, null, e, t);
827
832
  }
828
833
  function Ee(e, t) {
829
834
  let n = 0;
@@ -858,7 +863,7 @@ function yn(...e) {
858
863
  }
859
864
  return t;
860
865
  }
861
- let ne = null, me;
866
+ let ne = null, he;
862
867
  {
863
868
  const e = ee(), t = (n, o) => {
864
869
  let s;
@@ -866,7 +871,7 @@ let ne = null, me;
866
871
  s.length > 1 ? s.forEach((i) => i(r)) : s[0](r);
867
872
  };
868
873
  };
869
- me = t(
874
+ he = t(
870
875
  "__VUE_INSTANCE_SETTERS__",
871
876
  (n) => ne = n
872
877
  ), t(
@@ -876,8 +881,8 @@ let ne = null, me;
876
881
  }
877
882
  const _n = (e) => {
878
883
  const t = ne;
879
- return me(e), e.scope.on(), () => {
880
- e.scope.off(), me(t);
884
+ return he(e), e.scope.on(), () => {
885
+ e.scope.off(), he(t);
881
886
  };
882
887
  };
883
888
  let Ze = !1;
@@ -949,10 +954,10 @@ const kn = /* @__PURE__ */ X({
949
954
  }
950
955
  });
951
956
  const g = dt({});
952
- return t(g), mt(() => {
957
+ return t(g), ht(() => {
953
958
  Object.assign(g, d.value);
954
- }), (k, E) => (S(), T(ht, null, [
955
- Ae("div", gt(he(o), {
959
+ }), (k, E) => (S(), T(mt, null, [
960
+ Ae("div", gt(me(o), {
956
961
  ref_key: "myopContainer",
957
962
  ref: r
958
963
  }), null, 16),
@@ -1,4 +1,4 @@
1
- (function(d,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("vue"),require("@myop/sdk/host"),require("@myop/sdk/helpers")):typeof define=="function"&&define.amd?define(["exports","vue","@myop/sdk/host","@myop/sdk/helpers"],s):(d=typeof globalThis<"u"?globalThis:d||self,s(d["@myop/vue"]={},d.Vue,d.host,d.helpers))})(this,(function(d,s,V,h){"use strict";const Je=["innerHTML"],he=s.defineComponent({__name:"MyopLoader",props:{opacity:{default:1},fadeDuration:{default:200}},setup(e){const t=e,n=s.useSlots(),o=a=>!a||a.length===0?!1:a.some(u=>typeof u.children=="string"?u.children.trim()!=="":Array.isArray(u.children)?o(u.children):!!(u.type&&typeof u.type!="symbol"||u.children)),i=s.computed(()=>{const a=n.default;if(!a)return!1;const u=a();return o(u)}),r=s.computed(()=>({...V.containerStyleObject,opacity:t.opacity,transition:`opacity ${t.fadeDuration}ms ease-out`})),l=s.computed(()=>({...V.loaderStyleObject,opacity:t.opacity,transition:`opacity ${t.fadeDuration}ms ease-out`})),c=V.getMyopLogoHtml();return(a,u)=>i.value?(s.openBlock(),s.createElementBlock("div",{key:0,style:s.normalizeStyle(r.value)},[s.renderSlot(a.$slots,"default")],4)):(s.openBlock(),s.createElementBlock("div",{key:1,style:s.normalizeStyle(l.value),innerHTML:s.unref(c)},null,12,Je))}}),We=["innerHTML"],ye=s.defineComponent({__name:"MyopFallback",setup(e){const t=s.useSlots(),n=c=>!c||c.length===0?!1:c.some(a=>typeof a.children=="string"?a.children.trim()!=="":Array.isArray(a.children)?n(a.children):!!(a.type&&typeof a.type!="symbol"||a.children)),o=s.computed(()=>{const c=t.default;if(!c)return!1;const a=c();return n(a)}),i={position:"absolute",top:"0",left:"0",right:"0",bottom:"0"},r={...V.fallbackStyleObject},l=V.getMyopLogoHtml();return(c,a)=>o.value?(s.openBlock(),s.createElementBlock("div",{key:0,style:i},[s.renderSlot(c.$slots,"default")])):(s.openBlock(),s.createElementBlock("div",{key:1,style:r,innerHTML:s.unref(l)},null,8,We))}}),qe=s.defineComponent({name:"MyopComponent",__name:"MyopComponent",props:{componentId:{},componentConfig:{},data:{},fadeDuration:{default:200},autoSize:{type:Boolean,default:!0},environment:{},preview:{type:Boolean},on:{}},emits:["load","error","sizeChange","cta"],setup(e,{expose:t,emit:n}){const o=s.useSlots(),i=f=>!f||f.length===0?!1:f.some(p=>typeof p.children=="string"?p.children.trim()!=="":Array.isArray(p.children)?i(p.children):!!(p.type&&typeof p.type!="symbol"||p.children)),r=s.computed(()=>{const f=o.loader;if(!f)return!1;const p=f();return i(p)});s.computed(()=>{const f=o.fallback;if(!f)return!1;const p=f();return i(p)});const l=e,c=n,a=s.ref(null),u=s.shallowRef(null),m=l.componentId?h.isPreloaded(l.componentId):!1,_=s.ref(!m),D=s.ref(1),w=s.ref(!1),R=s.ref(!1),F=s.ref(void 0),ze=s.ref({fillWidth:!1,fillHeight:!1}),fe=s.ref(!1),Y=s.ref(null);let M=null;const pe=()=>{D.value=0,setTimeout(()=>{_.value=!1},l.fadeDuration)},de=f=>{console.error("[MyopComponent] Error:",f),pe(),w.value=!0,c("error",f)},me=async f=>{var O,Q,je;fe.value=!0;let p=!1;try{const g=JSON.parse(JSON.stringify({componentId:f.componentId,data:f.data,environment:f.environment,preview:f.preview,autoSize:f.autoSize}));if(!g.componentId&&!f.componentConfig){de("No component configuration provided");return}const Bt=g.preview===!0?!0:void 0,Jt=f.componentConfig?JSON.parse(JSON.stringify(f.componentConfig)):await h.getCloudRepository().fetchComponentV2(g.componentId,g.environment,Bt);if(!a.value){de("Container element not found");return}const Wt=s.markRaw({data:g.data,_environment:{props:g}}),Le=await V.hostSDK.loadComponent(Jt,a.value,Wt);if(p){Le.dispose();return}if(u.value=s.markRaw(Le),await u.value.initiated(),p){(O=u.value)==null||O.dispose();return}if(await new Promise(X=>requestAnimationFrame(X)),p||!u.value||u.value.markedForDisposed){u.value&&!u.value.markedForDisposed&&u.value.dispose();return}R.value=!0;const A=(Q=u.value)==null?void 0:Q.sizeMeta,ve=(A==null?void 0:A.width)==="100%",Ue=(A==null?void 0:A.height)==="100%";ze.value={fillWidth:ve,fillHeight:Ue},(!(l.autoSize??!0)||ve&&Ue)&&pe(),(je=u.value)!=null&&je.props&&(u.value.props.myop_cta_handler=(X,Be)=>{l.on&&l.on(X,Be),c("cta",X,Be)}),c("load",u.value)}catch(g){p||de((g==null?void 0:g.message)||"Unknown error")}finally{if(fe.value=!1,Y.value!==null&&!p){const g=Y.value;Y.value=null,await me(g)}}return()=>{p=!0}},Lt=()=>{var p;if(!R.value||!((p=u.value)!=null&&p.observeAutoSize))return;let f=!0;M=u.value.observeAutoSize({explicitWidth:void 0,explicitHeight:void 0,forceAutoSize:l.autoSize??!0,loaderMinHeight:50,onSizeChange:O=>{c("sizeChange",O),F.value=O,f&&(f=!1,pe())}})};s.watch(()=>l.componentId,async(f,p)=>{f!==p&&(R.value=!1,w.value=!1,_.value=!0,D.value=1,u.value&&(u.value.dispose(),u.value=null),M&&(M(),M=null),fe.value?Y.value={...l}:await me(l))}),s.watch(()=>l.data,f=>{var p;if(R.value&&f!==void 0&&u.value){const O=(p=u.value.props)==null?void 0:p.myop_init_interface;if(O){const Q=JSON.parse(JSON.stringify(f));O(Q)}}},{deep:!0}),s.watch(()=>R.value,f=>{f&&Lt()}),s.onMounted(async()=>{(l.componentId||l.componentConfig)&&await me(l)}),s.onUnmounted(()=>{M&&M(),u.value&&u.value.dispose()});const G=s.computed(()=>_.value?50:void 0),xe=s.computed(()=>!(l.autoSize??!0)||!R.value||ze.value.fillHeight),vt=s.computed(()=>{var f,p;return xe.value?{position:"relative",width:"100%",height:"100%",minHeight:G.value?`${G.value}px`:void 0}:{position:"relative",width:(f=F.value)!=null&&f.autoSizingWidth?`${F.value.width}px`:"100%",height:(p=F.value)!=null&&p.height?`${F.value.height}px`:void 0,minHeight:G.value?`${G.value}px`:void 0}}),Ut=s.computed(()=>{var f;return xe.value?{position:"absolute",inset:"0"}:{width:"100%",height:(f=F.value)!=null&&f.height?`${F.value.height}px`:void 0}});return t({myopComponent:u,isLoaded:R}),(f,p)=>(s.openBlock(),s.createElementBlock("div",{style:s.normalizeStyle(vt.value)},[s.createElementVNode("div",{ref_key:"myopContainer",ref:a,style:s.normalizeStyle(Ut.value)},null,4),_.value&&r.value?(s.openBlock(),s.createBlock(he,{key:0,opacity:D.value,"fade-duration":e.fadeDuration},{default:s.withCtx(()=>[s.renderSlot(f.$slots,"loader")]),_:3},8,["opacity","fade-duration"])):s.createCommentVNode("",!0),w.value?(s.openBlock(),s.createBlock(ye,{key:1},{default:s.withCtx(()=>[s.renderSlot(f.$slots,"fallback")]),_:3})):s.createCommentVNode("",!0)],4))}});/**
1
+ (function(p,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("vue"),require("@myop/sdk/host"),require("@myop/sdk/helpers")):typeof define=="function"&&define.amd?define(["exports","vue","@myop/sdk/host","@myop/sdk/helpers"],s):(p=typeof globalThis<"u"?globalThis:p||self,s(p["@myop/vue"]={},p.Vue,p.host,p.helpers))})(this,(function(p,s,V,y){"use strict";const Je=["innerHTML"],he=s.defineComponent({__name:"MyopLoader",props:{opacity:{default:1},fadeDuration:{default:200}},setup(e){const t=e,n=s.useSlots(),o=a=>!a||a.length===0?!1:a.some(u=>typeof u.children=="string"?u.children.trim()!=="":Array.isArray(u.children)?o(u.children):!!(u.type&&typeof u.type!="symbol"||u.children)),i=s.computed(()=>{const a=n.default;if(!a)return!1;const u=a();return o(u)}),r=s.computed(()=>({...V.containerStyleObject,opacity:t.opacity,transition:`opacity ${t.fadeDuration}ms ease-out`})),l=s.computed(()=>({...V.loaderStyleObject,opacity:t.opacity,transition:`opacity ${t.fadeDuration}ms ease-out`})),c=V.getMyopLogoHtml();return(a,u)=>i.value?(s.openBlock(),s.createElementBlock("div",{key:0,style:s.normalizeStyle(r.value)},[s.renderSlot(a.$slots,"default")],4)):(s.openBlock(),s.createElementBlock("div",{key:1,style:s.normalizeStyle(l.value),innerHTML:s.unref(c)},null,12,Je))}}),We=["innerHTML"],ye=s.defineComponent({__name:"MyopFallback",setup(e){const t=s.useSlots(),n=c=>!c||c.length===0?!1:c.some(a=>typeof a.children=="string"?a.children.trim()!=="":Array.isArray(a.children)?n(a.children):!!(a.type&&typeof a.type!="symbol"||a.children)),o=s.computed(()=>{const c=t.default;if(!c)return!1;const a=c();return n(a)}),i={position:"absolute",top:"0",left:"0",right:"0",bottom:"0"},r={...V.fallbackStyleObject},l=V.getMyopLogoHtml();return(c,a)=>o.value?(s.openBlock(),s.createElementBlock("div",{key:0,style:i},[s.renderSlot(c.$slots,"default")])):(s.openBlock(),s.createElementBlock("div",{key:1,style:r,innerHTML:s.unref(l)},null,8,We))}}),qe=s.defineComponent({name:"MyopComponent",__name:"MyopComponent",props:{componentId:{},componentConfig:{},data:{},loaderOptions:{},fadeDuration:{default:200},autoSize:{type:Boolean,default:!0},environment:{},preview:{type:Boolean},on:{}},emits:["load","error","sizeChange","cta"],setup(e,{expose:t,emit:n}){const o=s.useSlots(),i=f=>!f||f.length===0?!1:f.some(d=>typeof d.children=="string"?d.children.trim()!=="":Array.isArray(d.children)?i(d.children):!!(d.type&&typeof d.type!="symbol"||d.children)),r=s.computed(()=>{const f=o.loader;if(!f)return!1;const d=f();return i(d)});s.computed(()=>{const f=o.fallback;if(!f)return!1;const d=f();return i(d)});const l=e,c=n,a=s.ref(null),u=s.shallowRef(null),m=l.componentId?y.isPreloaded(l.componentId):!1,_=s.ref(!m),D=s.ref(1),w=s.ref(!1),R=s.ref(!1),F=s.ref(void 0),ze=s.ref({fillWidth:!1,fillHeight:!1}),fe=s.ref(!1),Y=s.ref(null);let M=null;const de=()=>{D.value=0,setTimeout(()=>{_.value=!1},l.fadeDuration)},pe=f=>{console.error("[MyopComponent] Error:",f),de(),w.value=!0,c("error",f)},me=async f=>{var O,Q,je;fe.value=!0;let d=!1;try{const h=JSON.parse(JSON.stringify({componentId:f.componentId,data:f.data,environment:f.environment,preview:f.preview,autoSize:f.autoSize}));if(!h.componentId&&!f.componentConfig){pe("No component configuration provided");return}const Bt=h.preview===!0?!0:void 0,Jt=f.componentConfig?JSON.parse(JSON.stringify(f.componentConfig)):await y.getCloudRepository().fetchComponentV2(h.componentId,h.environment,Bt);if(!a.value){pe("Container element not found");return}const Wt=s.markRaw({...f.loaderOptions??{},_environment:{props:h},...h.data!==void 0?{data:h.data}:{}}),Le=await V.hostSDK.loadComponent(Jt,a.value,Wt);if(d){Le.dispose();return}if(u.value=s.markRaw(Le),await u.value.initiated(),d){(O=u.value)==null||O.dispose();return}if(await new Promise(X=>requestAnimationFrame(X)),d||!u.value||u.value.markedForDisposed){u.value&&!u.value.markedForDisposed&&u.value.dispose();return}R.value=!0;const A=(Q=u.value)==null?void 0:Q.sizeMeta,ve=(A==null?void 0:A.width)==="100%",Ue=(A==null?void 0:A.height)==="100%";ze.value={fillWidth:ve,fillHeight:Ue},(!(l.autoSize??!0)||ve&&Ue)&&de(),(je=u.value)!=null&&je.props&&(u.value.props.myop_cta_handler=(X,Be)=>{l.on&&l.on(X,Be),c("cta",X,Be)}),c("load",u.value)}catch(h){d||pe((h==null?void 0:h.message)||"Unknown error")}finally{if(fe.value=!1,Y.value!==null&&!d){const h=Y.value;Y.value=null,await me(h)}}return()=>{d=!0}},Lt=()=>{var d;if(!R.value||!((d=u.value)!=null&&d.observeAutoSize))return;let f=!0;M=u.value.observeAutoSize({explicitWidth:void 0,explicitHeight:void 0,forceAutoSize:l.autoSize??!0,loaderMinHeight:50,onSizeChange:O=>{c("sizeChange",O),F.value=O,f&&(f=!1,de())}})};s.watch(()=>l.componentId,async(f,d)=>{f!==d&&(R.value=!1,w.value=!1,_.value=!0,D.value=1,u.value&&(u.value.dispose(),u.value=null),M&&(M(),M=null),fe.value?Y.value={...l}:await me(l))}),s.watch(()=>l.data,f=>{var d;if(R.value&&f!==void 0&&u.value){const O=(d=u.value.props)==null?void 0:d.myop_init_interface;if(O){const Q=JSON.parse(JSON.stringify(f));O(Q)}}},{deep:!0}),s.watch(()=>R.value,f=>{f&&Lt()}),s.onMounted(async()=>{(l.componentId||l.componentConfig)&&await me(l)}),s.onUnmounted(()=>{M&&M(),u.value&&u.value.dispose()});const G=s.computed(()=>_.value?50:void 0),xe=s.computed(()=>!(l.autoSize??!0)||!R.value||ze.value.fillHeight),vt=s.computed(()=>{var f,d;return xe.value?{position:"relative",width:"100%",height:"100%",minHeight:G.value?`${G.value}px`:void 0}:{position:"relative",width:(f=F.value)!=null&&f.autoSizingWidth?`${F.value.width}px`:"100%",height:(d=F.value)!=null&&d.height?`${F.value.height}px`:void 0,minHeight:G.value?`${G.value}px`:void 0}}),Ut=s.computed(()=>{var f;return xe.value?{position:"absolute",inset:"0"}:{width:"100%",height:(f=F.value)!=null&&f.height?`${F.value.height}px`:void 0}});return t({myopComponent:u,isLoaded:R}),(f,d)=>(s.openBlock(),s.createElementBlock("div",{style:s.normalizeStyle(vt.value)},[s.createElementVNode("div",{ref_key:"myopContainer",ref:a,style:s.normalizeStyle(Ut.value)},null,4),_.value&&r.value?(s.openBlock(),s.createBlock(he,{key:0,opacity:D.value,"fade-duration":e.fadeDuration},{default:s.withCtx(()=>[s.renderSlot(f.$slots,"loader")]),_:3},8,["opacity","fade-duration"])):s.createCommentVNode("",!0),w.value?(s.openBlock(),s.createBlock(ye,{key:1},{default:s.withCtx(()=>[s.renderSlot(f.$slots,"fallback")]),_:3})):s.createCommentVNode("",!0)],4))}});/**
2
2
  * @vue/shared v3.5.27
3
3
  * (c) 2018-present Yuxi (Evan) You and Vue contributors
4
4
  * @license MIT
@@ -13,5 +13,5 @@
13
13
  **/const I=[];function rt(e){I.push(e)}function it(){I.pop()}let oe=!1;function N(e,...t){if(oe)return;oe=!0;const n=I.length?I[I.length-1].component:null,o=n&&n.appContext.config.warnHandler,i=st();if(o)L(o,n,11,[e+t.map(r=>{var l,c;return(c=(l=r.toString)==null?void 0:l.call(r))!=null?c:JSON.stringify(r)}).join(""),n&&n.proxy,i.map(({vnode:r})=>`at <${Ae(n,r.type)}>`).join(`
14
14
  `),i]);else{const r=[`[Vue warn]: ${e}`,...t];i.length&&r.push(`
15
15
  `,...lt(i)),console.warn(...r)}oe=!1}function st(){let e=I[I.length-1];if(!e)return[];const t=[];for(;e;){const n=t[0];n&&n.vnode===e?n.recurseCount++:t.push({vnode:e,recurseCount:0});const o=e.component&&e.component.parent;e=o&&o.vnode}return t}function lt(e){const t=[];return e.forEach((n,o)=>{t.push(...o===0?[]:[`
16
- `],...at(n))}),t}function at({vnode:e,recurseCount:t}){const n=t>0?`... (${t} recursive calls)`:"",o=e.component?e.component.parent==null:!1,i=` at <${Ae(e.component,e.type,o)}`,r=">"+n;return e.props?[i,...ct(e.props),r]:[i+r]}function ct(e){const t=[],n=Object.keys(e);return n.slice(0,3).forEach(o=>{t.push(...Ee(o,e[o]))}),n.length>3&&t.push(" ..."),t}function Ee(e,t,n){return S(t)?(t=JSON.stringify(t),n?t:[`${e}=${t}`]):typeof t=="number"||typeof t=="boolean"||t==null?n?t:[`${e}=${t}`]:be(t)?(t=Ee(e,j(t.value),!0),n?t:[`${e}=Ref<`,t,">"]):b(t)?[`${e}=fn${t.name?`<${t.name}>`:""}`]:(t=j(t),n?t:[`${e}=`,t])}const re={sp:"serverPrefetch hook",bc:"beforeCreate hook",c:"created hook",bm:"beforeMount hook",m:"mounted hook",bu:"beforeUpdate hook",u:"updated",bum:"beforeUnmount hook",um:"unmounted hook",a:"activated hook",da:"deactivated hook",ec:"errorCaptured hook",rtc:"renderTracked hook",rtg:"renderTriggered hook",0:"setup function",1:"render function",2:"watcher getter",3:"watcher callback",4:"watcher cleanup function",5:"native event handler",6:"component event handler",7:"vnode hook",8:"directive hook",9:"transition hook",10:"app errorHandler",11:"app warnHandler",12:"ref function",13:"async component loader",14:"scheduler flush",15:"component update",16:"app unmount cleanup function"};function L(e,t,n,o){try{return o?e(...o):e()}catch(i){ie(i,t,n)}}function Se(e,t,n,o){if(b(e)){const i=L(e,t,n,o);return i&&Qe(i)&&i.catch(r=>{ie(r,t,n)}),i}if(C(e)){const i=[];for(let r=0;r<e.length;r++)i.push(Se(e[r],t,n,o));return i}else process.env.NODE_ENV!=="production"&&N(`Invalid value type passed to callWithAsyncErrorHandling(): ${typeof e}`)}function ie(e,t,n,o=!0){const i=t?t.vnode:null,{errorHandler:r,throwUnhandledErrorInProduction:l}=t&&t.appContext.config||Ke;if(t){let c=t.parent;const a=t.proxy,u=process.env.NODE_ENV!=="production"?re[n]:`https://vuejs.org/error-reference/#runtime-${n}`;for(;c;){const m=c.ec;if(m){for(let _=0;_<m.length;_++)if(m[_](e,a,u)===!1)return}c=c.parent}if(r){L(r,null,10,[e,a,u]);return}}ut(e,n,i,o,l)}function ut(e,t,n,o=!0,i=!1){if(process.env.NODE_ENV!=="production"){const r=re[t];if(n&&rt(n),N(`Unhandled error${r?` during execution of ${r}`:""}`),n&&it(),o)throw e;console.error(e)}else{if(i)throw e;console.error(e)}}const y=[];let E=-1;const T=[];let k=null,$=0;const ft=Promise.resolve();let se=null;const pt=100;function dt(e){let t=E+1,n=y.length;for(;t<n;){const o=t+n>>>1,i=y[o],r=z(i);r<e||r===e&&i.flags&2?t=o+1:n=o}return t}function mt(e){if(!(e.flags&1)){const t=z(e),n=y[y.length-1];!n||!(e.flags&2)&&t>=z(n)?y.push(e):y.splice(dt(t),0,e),e.flags|=1,Ne()}}function Ne(){se||(se=ft.then(ke))}function ht(e){C(e)?T.push(...e):k&&e.id===-1?k.splice($+1,0,e):e.flags&1||(T.push(e),e.flags|=1),Ne()}function yt(e){if(T.length){const t=[...new Set(T)].sort((n,o)=>z(n)-z(o));if(T.length=0,k){k.push(...t);return}for(k=t,process.env.NODE_ENV!=="production"&&(e=e||new Map),$=0;$<k.length;$++){const n=k[$];process.env.NODE_ENV!=="production"&&we(e,n)||(n.flags&4&&(n.flags&=-2),n.flags&8||n(),n.flags&=-2)}k=null,$=0}}const z=e=>e.id==null?e.flags&2?-1:1/0:e.id;function ke(e){process.env.NODE_ENV!=="production"&&(e=e||new Map);const t=process.env.NODE_ENV!=="production"?n=>we(e,n):ge;try{for(E=0;E<y.length;E++){const n=y[E];if(n&&!(n.flags&8)){if(process.env.NODE_ENV!=="production"&&t(n))continue;n.flags&4&&(n.flags&=-2),L(n,n.i,n.i?15:14),n.flags&4||(n.flags&=-2)}}}finally{for(;E<y.length;E++){const n=y[E];n&&(n.flags&=-2)}E=-1,y.length=0,yt(e),se=null,(y.length||T.length)&&ke(e)}}function we(e,t){const n=e.get(t)||0;if(n>pt){const o=t.i,i=o&&Me(o.type);return ie(`Maximum recursive updates exceeded${i?` in component <${i}>`:""}. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.`,null,10),!0}return e.set(t,n+1),!1}const le=new Map;process.env.NODE_ENV!=="production"&&(x().__VUE_HMR_RUNTIME__={createRecord:ae(gt),rerender:ae(_t),reload:ae(Ct)});const v=new Map;function gt(e,t){return v.has(e)?!1:(v.set(e,{initialDef:U(t),instances:new Set}),!0)}function U(e){return Pe(e)?e.__vccOpts:e}function _t(e,t){const n=v.get(e);n&&(n.initialDef.render=t,[...n.instances].forEach(o=>{t&&(o.render=t,U(o.type).render=t),o.renderCache=[],o.job.flags&8||o.update()}))}function Ct(e,t){const n=v.get(e);if(!n)return;t=U(t),Oe(n.initialDef,t);const o=[...n.instances];for(let i=0;i<o.length;i++){const r=o[i],l=U(r.type);let c=le.get(l);c||(l!==n.initialDef&&Oe(l,t),le.set(l,c=new Set)),c.add(r),r.appContext.propsCache.delete(r.type),r.appContext.emitsCache.delete(r.type),r.appContext.optionsCache.delete(r.type),r.ceReload?(c.add(r),r.ceReload(t.styles),c.delete(r)):r.parent?mt(()=>{r.job.flags&8||(r.parent.update(),c.delete(r))}):r.appContext.reload?r.appContext.reload():typeof window<"u"?window.location.reload():console.warn("[HMR] Root or manually mounted instance modified. Full reload required."),r.root.ce&&r!==r.root&&r.root.ce._removeChildStyle(l)}ht(()=>{le.clear()})}function Oe(e,t){Z(e,t);for(const n in e)n!=="__file"&&!(n in t)&&delete e[n]}function ae(e){return(t,n)=>{try{return e(t,n)}catch(o){console.error(o),console.warn("[HMR] Something went wrong during Vue component hot-reload. Full reload required.")}}}let H,B=[];function Ve(e,t){var n,o;H=e,H?(H.enabled=!0,B.forEach(({event:i,args:r})=>H.emit(i,...r)),B=[]):typeof window<"u"&&window.HTMLElement&&!((o=(n=window.navigator)==null?void 0:n.userAgent)!=null&&o.includes("jsdom"))?((t.__VUE_DEVTOOLS_HOOK_REPLAY__=t.__VUE_DEVTOOLS_HOOK_REPLAY__||[]).push(r=>{Ve(r,t)}),setTimeout(()=>{H||(t.__VUE_DEVTOOLS_HOOK_REPLAY__=null,B=[])},3e3)):B=[]}let J=null,bt=null;const Et=e=>e.__isTeleport;function Ie(e,t){e.shapeFlag&6&&e.component?(e.transition=t,Ie(e.component.subTree,t)):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}x().requestIdleCallback,x().cancelIdleCallback;function St(e,t,n=K,o=!1){if(n){const i=n[e]||(n[e]=[]),r=t.__weh||(t.__weh=(...l)=>{const c=Pt(n),a=Se(t,n,e,l);return c(),a});return o?i.unshift(r):i.push(r),r}else if(process.env.NODE_ENV!=="production"){const i=Ze(re[e].replace(/ hook$/,""));N(`${i} is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup(). If you are using async setup(), make sure to register lifecycle hooks before the first await statement.`)}}const Nt=(e=>(t,n=K)=>{(!He||e==="sp")&&St(e,(...o)=>t(...o),n)})("u"),kt=Symbol.for("v-ndc"),wt={};process.env.NODE_ENV!=="production"&&(wt.ownKeys=e=>(N("Avoid app logic that relies on enumerating keys on a component instance. The keys will be empty in production mode to avoid performance overhead."),Reflect.ownKeys(e)));const Ot={},De=e=>Object.getPrototypeOf(e)===Ot,Vt=e=>e.__isSuspense,Re=Symbol.for("v-fgt"),It=Symbol.for("v-txt"),Dt=Symbol.for("v-cmt");function Rt(e){return e?e.__v_isVNode===!0:!1}const Ft=(...e)=>Te(...e),Fe=({key:e})=>e??null,W=({ref:e,ref_key:t,ref_for:n})=>(typeof e=="number"&&(e=""+e),e!=null?S(e)||be(e)||b(e)?{i:J,r:e,k:t,f:!!n}:e:null);function Tt(e,t=null,n=null,o=0,i=null,r=e===Re?0:1,l=!1,c=!1){const a={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&Fe(t),ref:t&&W(t),scopeId:bt,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetStart:null,targetAnchor:null,staticCount:0,shapeFlag:r,patchFlag:o,dynamicProps:i,dynamicChildren:null,appContext:null,ctx:J};return c?(ce(a,n),r&128&&e.normalize(a)):n&&(a.shapeFlag|=S(n)?8:16),process.env.NODE_ENV!=="production"&&a.key!==a.key&&N("VNode created with invalid key (NaN). VNode type:",a.type),a}const $t=process.env.NODE_ENV!=="production"?Ft:Te;function Te(e,t=null,n=null,o=0,i=null,r=!1){if((!e||e===kt)&&(process.env.NODE_ENV!=="production"&&!e&&N(`Invalid vnode type when creating vnode: ${e}.`),e=Dt),Rt(e)){const c=q(e,t,!0);return n&&ce(c,n),c.patchFlag=-2,c}if(Pe(e)&&(e=e.__vccOpts),t){t=Ht(t);let{class:c,style:a}=t;c&&!S(c)&&(t.class=te(c)),P(a)&&(ne(a)&&!C(a)&&(a=Z({},a)),t.style=ee(a))}const l=S(e)?1:Vt(e)?128:Et(e)?64:P(e)?4:b(e)?2:0;return process.env.NODE_ENV!=="production"&&l&4&&ne(e)&&(e=j(e),N("Vue received a Component that was made a reactive object. This can lead to unnecessary performance overhead and should be avoided by marking the component with `markRaw` or using `shallowRef` instead of `ref`.",`
17
- Component that was made reactive: `,e)),Tt(e,t,n,o,i,l,r,!0)}function Ht(e){return e?ne(e)||De(e)?Z({},e):e:null}function q(e,t,n=!1,o=!1){const{props:i,ref:r,patchFlag:l,children:c,transition:a}=e,u=t?At(i||{},t):i,m={__v_isVNode:!0,__v_skip:!0,type:e.type,props:u,key:u&&Fe(u),ref:t&&t.ref?n&&r?C(r)?r.concat(W(t)):[r,W(t)]:W(t):r,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:process.env.NODE_ENV!=="production"&&l===-1&&C(c)?c.map($e):c,target:e.target,targetStart:e.targetStart,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==Re?l===-1?16:l|16:l,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:a,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&q(e.ssContent),ssFallback:e.ssFallback&&q(e.ssFallback),placeholder:e.placeholder,el:e.el,anchor:e.anchor,ctx:e.ctx,ce:e.ce};return a&&o&&Ie(m,a.clone(m)),m}function $e(e){const t=q(e);return C(e.children)&&(t.children=e.children.map($e)),t}function Mt(e=" ",t=0){return $t(It,null,e,t)}function ce(e,t){let n=0;const{shapeFlag:o}=e;if(t==null)t=null;else if(C(t))n=16;else if(typeof t=="object")if(o&65){const i=t.default;i&&(i._c&&(i._d=!1),ce(e,i()),i._c&&(i._d=!0));return}else n=32,!t._&&!De(t)&&(t._ctx=J);else b(t)?(t={default:t,_ctx:J},n=32):(t=String(t),o&64?(n=16,t=[Mt(t)]):n=8);e.children=t,e.shapeFlag|=n}function At(...e){const t={};for(let n=0;n<e.length;n++){const o=e[n];for(const i in o)if(i==="class")t.class!==o.class&&(t.class=te([t.class,o.class]));else if(i==="style")t.style=ee([t.style,o.style]);else if(Ye(i)){const r=t[i],l=o[i];l&&r!==l&&!(C(r)&&r.includes(l))&&(t[i]=r?[].concat(r,l):l)}else i!==""&&(t[i]=o[i])}return t}let K=null,ue;{const e=x(),t=(n,o)=>{let i;return(i=e[n])||(i=e[n]=[]),i.push(o),r=>{i.length>1?i.forEach(l=>l(r)):i[0](r)}};ue=t("__VUE_INSTANCE_SETTERS__",n=>K=n),t("__VUE_SSR_SETTERS__",n=>He=n)}const Pt=e=>{const t=K;return ue(e),e.scope.on(),()=>{e.scope.off(),ue(t)}};let He=!1;process.env.NODE_ENV;const zt=/(?:^|[-_])\w/g,xt=e=>e.replace(zt,t=>t.toUpperCase()).replace(/[-_]/g,"");function Me(e,t=!0){return b(e)?e.displayName||e.name:e.name||t&&e.__name}function Ae(e,t,n=!1){let o=Me(t);if(!o&&t.__file){const i=t.__file.match(/([^/\\]+)\.\w+$/);i&&(o=i[1])}if(!o&&e){const i=r=>{for(const l in r)if(r[l]===t)return l};o=i(e.components)||e.parent&&i(e.parent.type.components)||i(e.appContext.components)}return o?xt(o):n?"App":"Anonymous"}function Pe(e){return b(e)&&"__vccOpts"in e}process.env.NODE_ENV,process.env.NODE_ENV,process.env.NODE_ENV;const jt=s.defineComponent({inheritAttrs:!0,__name:"MyopVueComponent",props:{flowId:{},componentId:{},onReady:{type:Function}},setup(e,{expose:t}){const n=e,o=s.useAttrs(),i=s.useSlots(),r=s.ref(null),l=s.ref(!0),c=s.ref(null),a=s.ref(null),u=s.getCurrentInstance(),m=s.ref(null);Nt(()=>{a&&a.value&&a.value(o)}),s.onMounted(async()=>{if(r.value){const D=await h.CloudRepository.Main.fetchComponent(n.componentId,n.flowId);c.value=await V.hostSDK.loadComponent(D,r==null?void 0:r.value,{_environment:{props:o,slots:i,context:u==null?void 0:u.appContext,vueContainerRef:r,defineUpdater:w=>{a.value=w},defineInnerVueComponentRef:w=>{m.value=w.value}}}),l.value=!1,n.onReady&&n.onReady(c.value,m.value)}});const _=s.reactive({});return t(_),s.watchEffect(()=>{Object.assign(_,m.value)}),(D,w)=>(s.openBlock(),s.createElementBlock(s.Fragment,null,[s.createElementVNode("div",s.mergeProps(s.unref(o),{ref_key:"myopContainer",ref:r}),null,16),l.value?s.renderSlot(D.$slots,"loading",{key:0}):s.createCommentVNode("",!0)],64))}});Object.defineProperty(d,"enableLocalDev",{enumerable:!0,get:()=>h.enableLocalDev}),Object.defineProperty(d,"enableSelfHosted",{enumerable:!0,get:()=>h.enableSelfHosted}),Object.defineProperty(d,"getCloudRepository",{enumerable:!0,get:()=>h.getCloudRepository}),Object.defineProperty(d,"getPreloadedParams",{enumerable:!0,get:()=>h.getPreloadedParams}),Object.defineProperty(d,"isPreloaded",{enumerable:!0,get:()=>h.isPreloaded}),Object.defineProperty(d,"preloadComponents",{enumerable:!0,get:()=>h.preloadComponents}),Object.defineProperty(d,"setCloudRepository",{enumerable:!0,get:()=>h.setCloudRepository}),Object.defineProperty(d,"setCloudRepositoryUrl",{enumerable:!0,get:()=>h.setCloudRepositoryUrl}),Object.defineProperty(d,"setEnvironment",{enumerable:!0,get:()=>h.setEnvironment}),d.MyopComponent=qe,d.MyopContainer=jt,d.MyopFallback=ye,d.MyopLoader=he,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})}));
16
+ `],...at(n))}),t}function at({vnode:e,recurseCount:t}){const n=t>0?`... (${t} recursive calls)`:"",o=e.component?e.component.parent==null:!1,i=` at <${Ae(e.component,e.type,o)}`,r=">"+n;return e.props?[i,...ct(e.props),r]:[i+r]}function ct(e){const t=[],n=Object.keys(e);return n.slice(0,3).forEach(o=>{t.push(...Ee(o,e[o]))}),n.length>3&&t.push(" ..."),t}function Ee(e,t,n){return S(t)?(t=JSON.stringify(t),n?t:[`${e}=${t}`]):typeof t=="number"||typeof t=="boolean"||t==null?n?t:[`${e}=${t}`]:be(t)?(t=Ee(e,j(t.value),!0),n?t:[`${e}=Ref<`,t,">"]):b(t)?[`${e}=fn${t.name?`<${t.name}>`:""}`]:(t=j(t),n?t:[`${e}=`,t])}const re={sp:"serverPrefetch hook",bc:"beforeCreate hook",c:"created hook",bm:"beforeMount hook",m:"mounted hook",bu:"beforeUpdate hook",u:"updated",bum:"beforeUnmount hook",um:"unmounted hook",a:"activated hook",da:"deactivated hook",ec:"errorCaptured hook",rtc:"renderTracked hook",rtg:"renderTriggered hook",0:"setup function",1:"render function",2:"watcher getter",3:"watcher callback",4:"watcher cleanup function",5:"native event handler",6:"component event handler",7:"vnode hook",8:"directive hook",9:"transition hook",10:"app errorHandler",11:"app warnHandler",12:"ref function",13:"async component loader",14:"scheduler flush",15:"component update",16:"app unmount cleanup function"};function L(e,t,n,o){try{return o?e(...o):e()}catch(i){ie(i,t,n)}}function Se(e,t,n,o){if(b(e)){const i=L(e,t,n,o);return i&&Qe(i)&&i.catch(r=>{ie(r,t,n)}),i}if(C(e)){const i=[];for(let r=0;r<e.length;r++)i.push(Se(e[r],t,n,o));return i}else process.env.NODE_ENV!=="production"&&N(`Invalid value type passed to callWithAsyncErrorHandling(): ${typeof e}`)}function ie(e,t,n,o=!0){const i=t?t.vnode:null,{errorHandler:r,throwUnhandledErrorInProduction:l}=t&&t.appContext.config||Ke;if(t){let c=t.parent;const a=t.proxy,u=process.env.NODE_ENV!=="production"?re[n]:`https://vuejs.org/error-reference/#runtime-${n}`;for(;c;){const m=c.ec;if(m){for(let _=0;_<m.length;_++)if(m[_](e,a,u)===!1)return}c=c.parent}if(r){L(r,null,10,[e,a,u]);return}}ut(e,n,i,o,l)}function ut(e,t,n,o=!0,i=!1){if(process.env.NODE_ENV!=="production"){const r=re[t];if(n&&rt(n),N(`Unhandled error${r?` during execution of ${r}`:""}`),n&&it(),o)throw e;console.error(e)}else{if(i)throw e;console.error(e)}}const g=[];let E=-1;const T=[];let k=null,$=0;const ft=Promise.resolve();let se=null;const dt=100;function pt(e){let t=E+1,n=g.length;for(;t<n;){const o=t+n>>>1,i=g[o],r=z(i);r<e||r===e&&i.flags&2?t=o+1:n=o}return t}function mt(e){if(!(e.flags&1)){const t=z(e),n=g[g.length-1];!n||!(e.flags&2)&&t>=z(n)?g.push(e):g.splice(pt(t),0,e),e.flags|=1,Ne()}}function Ne(){se||(se=ft.then(ke))}function ht(e){C(e)?T.push(...e):k&&e.id===-1?k.splice($+1,0,e):e.flags&1||(T.push(e),e.flags|=1),Ne()}function yt(e){if(T.length){const t=[...new Set(T)].sort((n,o)=>z(n)-z(o));if(T.length=0,k){k.push(...t);return}for(k=t,process.env.NODE_ENV!=="production"&&(e=e||new Map),$=0;$<k.length;$++){const n=k[$];process.env.NODE_ENV!=="production"&&we(e,n)||(n.flags&4&&(n.flags&=-2),n.flags&8||n(),n.flags&=-2)}k=null,$=0}}const z=e=>e.id==null?e.flags&2?-1:1/0:e.id;function ke(e){process.env.NODE_ENV!=="production"&&(e=e||new Map);const t=process.env.NODE_ENV!=="production"?n=>we(e,n):ge;try{for(E=0;E<g.length;E++){const n=g[E];if(n&&!(n.flags&8)){if(process.env.NODE_ENV!=="production"&&t(n))continue;n.flags&4&&(n.flags&=-2),L(n,n.i,n.i?15:14),n.flags&4||(n.flags&=-2)}}}finally{for(;E<g.length;E++){const n=g[E];n&&(n.flags&=-2)}E=-1,g.length=0,yt(e),se=null,(g.length||T.length)&&ke(e)}}function we(e,t){const n=e.get(t)||0;if(n>dt){const o=t.i,i=o&&Me(o.type);return ie(`Maximum recursive updates exceeded${i?` in component <${i}>`:""}. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.`,null,10),!0}return e.set(t,n+1),!1}const le=new Map;process.env.NODE_ENV!=="production"&&(x().__VUE_HMR_RUNTIME__={createRecord:ae(gt),rerender:ae(_t),reload:ae(Ct)});const v=new Map;function gt(e,t){return v.has(e)?!1:(v.set(e,{initialDef:U(t),instances:new Set}),!0)}function U(e){return Pe(e)?e.__vccOpts:e}function _t(e,t){const n=v.get(e);n&&(n.initialDef.render=t,[...n.instances].forEach(o=>{t&&(o.render=t,U(o.type).render=t),o.renderCache=[],o.job.flags&8||o.update()}))}function Ct(e,t){const n=v.get(e);if(!n)return;t=U(t),Oe(n.initialDef,t);const o=[...n.instances];for(let i=0;i<o.length;i++){const r=o[i],l=U(r.type);let c=le.get(l);c||(l!==n.initialDef&&Oe(l,t),le.set(l,c=new Set)),c.add(r),r.appContext.propsCache.delete(r.type),r.appContext.emitsCache.delete(r.type),r.appContext.optionsCache.delete(r.type),r.ceReload?(c.add(r),r.ceReload(t.styles),c.delete(r)):r.parent?mt(()=>{r.job.flags&8||(r.parent.update(),c.delete(r))}):r.appContext.reload?r.appContext.reload():typeof window<"u"?window.location.reload():console.warn("[HMR] Root or manually mounted instance modified. Full reload required."),r.root.ce&&r!==r.root&&r.root.ce._removeChildStyle(l)}ht(()=>{le.clear()})}function Oe(e,t){Z(e,t);for(const n in e)n!=="__file"&&!(n in t)&&delete e[n]}function ae(e){return(t,n)=>{try{return e(t,n)}catch(o){console.error(o),console.warn("[HMR] Something went wrong during Vue component hot-reload. Full reload required.")}}}let H,B=[];function Ve(e,t){var n,o;H=e,H?(H.enabled=!0,B.forEach(({event:i,args:r})=>H.emit(i,...r)),B=[]):typeof window<"u"&&window.HTMLElement&&!((o=(n=window.navigator)==null?void 0:n.userAgent)!=null&&o.includes("jsdom"))?((t.__VUE_DEVTOOLS_HOOK_REPLAY__=t.__VUE_DEVTOOLS_HOOK_REPLAY__||[]).push(r=>{Ve(r,t)}),setTimeout(()=>{H||(t.__VUE_DEVTOOLS_HOOK_REPLAY__=null,B=[])},3e3)):B=[]}let J=null,bt=null;const Et=e=>e.__isTeleport;function Ie(e,t){e.shapeFlag&6&&e.component?(e.transition=t,Ie(e.component.subTree,t)):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}x().requestIdleCallback,x().cancelIdleCallback;function St(e,t,n=K,o=!1){if(n){const i=n[e]||(n[e]=[]),r=t.__weh||(t.__weh=(...l)=>{const c=Pt(n),a=Se(t,n,e,l);return c(),a});return o?i.unshift(r):i.push(r),r}else if(process.env.NODE_ENV!=="production"){const i=Ze(re[e].replace(/ hook$/,""));N(`${i} is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup(). If you are using async setup(), make sure to register lifecycle hooks before the first await statement.`)}}const Nt=(e=>(t,n=K)=>{(!He||e==="sp")&&St(e,(...o)=>t(...o),n)})("u"),kt=Symbol.for("v-ndc"),wt={};process.env.NODE_ENV!=="production"&&(wt.ownKeys=e=>(N("Avoid app logic that relies on enumerating keys on a component instance. The keys will be empty in production mode to avoid performance overhead."),Reflect.ownKeys(e)));const Ot={},De=e=>Object.getPrototypeOf(e)===Ot,Vt=e=>e.__isSuspense,Re=Symbol.for("v-fgt"),It=Symbol.for("v-txt"),Dt=Symbol.for("v-cmt");function Rt(e){return e?e.__v_isVNode===!0:!1}const Ft=(...e)=>Te(...e),Fe=({key:e})=>e??null,W=({ref:e,ref_key:t,ref_for:n})=>(typeof e=="number"&&(e=""+e),e!=null?S(e)||be(e)||b(e)?{i:J,r:e,k:t,f:!!n}:e:null);function Tt(e,t=null,n=null,o=0,i=null,r=e===Re?0:1,l=!1,c=!1){const a={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&Fe(t),ref:t&&W(t),scopeId:bt,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetStart:null,targetAnchor:null,staticCount:0,shapeFlag:r,patchFlag:o,dynamicProps:i,dynamicChildren:null,appContext:null,ctx:J};return c?(ce(a,n),r&128&&e.normalize(a)):n&&(a.shapeFlag|=S(n)?8:16),process.env.NODE_ENV!=="production"&&a.key!==a.key&&N("VNode created with invalid key (NaN). VNode type:",a.type),a}const $t=process.env.NODE_ENV!=="production"?Ft:Te;function Te(e,t=null,n=null,o=0,i=null,r=!1){if((!e||e===kt)&&(process.env.NODE_ENV!=="production"&&!e&&N(`Invalid vnode type when creating vnode: ${e}.`),e=Dt),Rt(e)){const c=q(e,t,!0);return n&&ce(c,n),c.patchFlag=-2,c}if(Pe(e)&&(e=e.__vccOpts),t){t=Ht(t);let{class:c,style:a}=t;c&&!S(c)&&(t.class=te(c)),P(a)&&(ne(a)&&!C(a)&&(a=Z({},a)),t.style=ee(a))}const l=S(e)?1:Vt(e)?128:Et(e)?64:P(e)?4:b(e)?2:0;return process.env.NODE_ENV!=="production"&&l&4&&ne(e)&&(e=j(e),N("Vue received a Component that was made a reactive object. This can lead to unnecessary performance overhead and should be avoided by marking the component with `markRaw` or using `shallowRef` instead of `ref`.",`
17
+ Component that was made reactive: `,e)),Tt(e,t,n,o,i,l,r,!0)}function Ht(e){return e?ne(e)||De(e)?Z({},e):e:null}function q(e,t,n=!1,o=!1){const{props:i,ref:r,patchFlag:l,children:c,transition:a}=e,u=t?At(i||{},t):i,m={__v_isVNode:!0,__v_skip:!0,type:e.type,props:u,key:u&&Fe(u),ref:t&&t.ref?n&&r?C(r)?r.concat(W(t)):[r,W(t)]:W(t):r,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:process.env.NODE_ENV!=="production"&&l===-1&&C(c)?c.map($e):c,target:e.target,targetStart:e.targetStart,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==Re?l===-1?16:l|16:l,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:a,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&q(e.ssContent),ssFallback:e.ssFallback&&q(e.ssFallback),placeholder:e.placeholder,el:e.el,anchor:e.anchor,ctx:e.ctx,ce:e.ce};return a&&o&&Ie(m,a.clone(m)),m}function $e(e){const t=q(e);return C(e.children)&&(t.children=e.children.map($e)),t}function Mt(e=" ",t=0){return $t(It,null,e,t)}function ce(e,t){let n=0;const{shapeFlag:o}=e;if(t==null)t=null;else if(C(t))n=16;else if(typeof t=="object")if(o&65){const i=t.default;i&&(i._c&&(i._d=!1),ce(e,i()),i._c&&(i._d=!0));return}else n=32,!t._&&!De(t)&&(t._ctx=J);else b(t)?(t={default:t,_ctx:J},n=32):(t=String(t),o&64?(n=16,t=[Mt(t)]):n=8);e.children=t,e.shapeFlag|=n}function At(...e){const t={};for(let n=0;n<e.length;n++){const o=e[n];for(const i in o)if(i==="class")t.class!==o.class&&(t.class=te([t.class,o.class]));else if(i==="style")t.style=ee([t.style,o.style]);else if(Ye(i)){const r=t[i],l=o[i];l&&r!==l&&!(C(r)&&r.includes(l))&&(t[i]=r?[].concat(r,l):l)}else i!==""&&(t[i]=o[i])}return t}let K=null,ue;{const e=x(),t=(n,o)=>{let i;return(i=e[n])||(i=e[n]=[]),i.push(o),r=>{i.length>1?i.forEach(l=>l(r)):i[0](r)}};ue=t("__VUE_INSTANCE_SETTERS__",n=>K=n),t("__VUE_SSR_SETTERS__",n=>He=n)}const Pt=e=>{const t=K;return ue(e),e.scope.on(),()=>{e.scope.off(),ue(t)}};let He=!1;process.env.NODE_ENV;const zt=/(?:^|[-_])\w/g,xt=e=>e.replace(zt,t=>t.toUpperCase()).replace(/[-_]/g,"");function Me(e,t=!0){return b(e)?e.displayName||e.name:e.name||t&&e.__name}function Ae(e,t,n=!1){let o=Me(t);if(!o&&t.__file){const i=t.__file.match(/([^/\\]+)\.\w+$/);i&&(o=i[1])}if(!o&&e){const i=r=>{for(const l in r)if(r[l]===t)return l};o=i(e.components)||e.parent&&i(e.parent.type.components)||i(e.appContext.components)}return o?xt(o):n?"App":"Anonymous"}function Pe(e){return b(e)&&"__vccOpts"in e}process.env.NODE_ENV,process.env.NODE_ENV,process.env.NODE_ENV;const jt=s.defineComponent({inheritAttrs:!0,__name:"MyopVueComponent",props:{flowId:{},componentId:{},onReady:{type:Function}},setup(e,{expose:t}){const n=e,o=s.useAttrs(),i=s.useSlots(),r=s.ref(null),l=s.ref(!0),c=s.ref(null),a=s.ref(null),u=s.getCurrentInstance(),m=s.ref(null);Nt(()=>{a&&a.value&&a.value(o)}),s.onMounted(async()=>{if(r.value){const D=await y.CloudRepository.Main.fetchComponent(n.componentId,n.flowId);c.value=await V.hostSDK.loadComponent(D,r==null?void 0:r.value,{_environment:{props:o,slots:i,context:u==null?void 0:u.appContext,vueContainerRef:r,defineUpdater:w=>{a.value=w},defineInnerVueComponentRef:w=>{m.value=w.value}}}),l.value=!1,n.onReady&&n.onReady(c.value,m.value)}});const _=s.reactive({});return t(_),s.watchEffect(()=>{Object.assign(_,m.value)}),(D,w)=>(s.openBlock(),s.createElementBlock(s.Fragment,null,[s.createElementVNode("div",s.mergeProps(s.unref(o),{ref_key:"myopContainer",ref:r}),null,16),l.value?s.renderSlot(D.$slots,"loading",{key:0}):s.createCommentVNode("",!0)],64))}});Object.defineProperty(p,"enableLocalDev",{enumerable:!0,get:()=>y.enableLocalDev}),Object.defineProperty(p,"enableSelfHosted",{enumerable:!0,get:()=>y.enableSelfHosted}),Object.defineProperty(p,"getCloudRepository",{enumerable:!0,get:()=>y.getCloudRepository}),Object.defineProperty(p,"getPreloadedParams",{enumerable:!0,get:()=>y.getPreloadedParams}),Object.defineProperty(p,"isPreloaded",{enumerable:!0,get:()=>y.isPreloaded}),Object.defineProperty(p,"preloadComponents",{enumerable:!0,get:()=>y.preloadComponents}),Object.defineProperty(p,"setCloudRepository",{enumerable:!0,get:()=>y.setCloudRepository}),Object.defineProperty(p,"setCloudRepositoryUrl",{enumerable:!0,get:()=>y.setCloudRepositoryUrl}),Object.defineProperty(p,"setEnvironment",{enumerable:!0,get:()=>y.setEnvironment}),p.MyopComponent=qe,p.MyopContainer=jt,p.MyopFallback=ye,p.MyopLoader=he,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})}));
package/dist/types.d.ts CHANGED
@@ -1,4 +1,5 @@
1
- import type { IMyopComponent } from "@myop/sdk/host";
1
+ import type { IMyopComponent, loaderOptions } from "@myop/sdk/host";
2
+ export type { loaderOptions };
2
3
  export interface IComponentInstanceConfig {
3
4
  id: string;
4
5
  componentId: string;
@@ -62,6 +63,12 @@ export interface IBaseProps<TDataType = any, TPayloads extends Record<string, an
62
63
  componentId?: string;
63
64
  componentConfig?: IComponentInstanceConfig;
64
65
  data?: TDataType;
66
+ /**
67
+ * Raw SDK loader options forwarded to hostSDK.loadComponent.
68
+ * Use this to pass options like `injectCss` (theming), `hooks`, `timeout`, etc.
69
+ * The `data` prop, when provided, takes precedence over `loaderOptions.data`.
70
+ */
71
+ loaderOptions?: loaderOptions;
65
72
  fadeDuration?: number;
66
73
  autoSize?: boolean;
67
74
  environment?: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@myop/vue",
3
- "version": "0.0.46",
3
+ "version": "0.1.0",
4
4
  "type": "module",
5
5
  "main": "./dist/index.umd.cjs",
6
6
  "module": "./dist/index.js",
@@ -26,11 +26,11 @@
26
26
  "release": "npm publish --access public"
27
27
  },
28
28
  "peerDependencies": {
29
- "@myop/sdk": "^0.3.29",
29
+ "@myop/sdk": "^0.3.32",
30
30
  "vue": "^3.5.13"
31
31
  },
32
32
  "devDependencies": {
33
- "@myop/sdk": "^0.3.29",
33
+ "@myop/sdk": "^0.3.32",
34
34
  "@types/node": "^22.14.0",
35
35
  "@vitejs/plugin-vue": "^5.2.1",
36
36
  "@vue/tsconfig": "^0.7.0",