@open-iframe-resizer/vue 2.3.1 → 2.4.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.
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
const
|
|
1
|
+
import { defineComponent as D, ref as A, onMounted as H, onBeforeUnmount as _, createElementBlock as T, openBlock as W, mergeProps as x } from "vue";
|
|
2
|
+
const E = () => typeof window < "u", C = () => {
|
|
3
3
|
try {
|
|
4
4
|
return window.self !== window.top;
|
|
5
5
|
} catch {
|
|
6
6
|
return !0;
|
|
7
7
|
}
|
|
8
|
-
},
|
|
8
|
+
}, p = (e) => e instanceof HTMLIFrameElement, z = (e) => {
|
|
9
9
|
window.document.readyState === "complete" ? e() : window.addEventListener("load", e, { once: !0 });
|
|
10
|
-
}, C = (e, t) => {
|
|
11
|
-
t(), e.addEventListener("load", t, { once: !0 });
|
|
12
10
|
}, F = (e, t) => {
|
|
11
|
+
t(), e.addEventListener("load", t, { once: !0 });
|
|
12
|
+
}, $ = (e, t) => {
|
|
13
13
|
const n = e.contentWindow?.document.readyState === "complete";
|
|
14
|
-
|
|
15
|
-
},
|
|
16
|
-
async function
|
|
14
|
+
e.src !== "about:blank" && e.contentWindow?.location.href !== "about:blank" && n && t();
|
|
15
|
+
}, N = () => ({ offsetSize: 0, checkOrigin: !0, enableLegacyLibSupport: !1 });
|
|
16
|
+
async function U(e) {
|
|
17
17
|
try {
|
|
18
18
|
return e.contentDocument?.URL === "about:blank" ? new Promise((t) => {
|
|
19
19
|
e.addEventListener("load", () => t(e.contentDocument !== null), { once: !0 });
|
|
@@ -22,7 +22,7 @@ async function N(e) {
|
|
|
22
22
|
return !1;
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
|
-
const
|
|
25
|
+
const j = (e) => {
|
|
26
26
|
try {
|
|
27
27
|
const t = new URL(e.src).origin;
|
|
28
28
|
if (t !== "about:blank")
|
|
@@ -30,26 +30,29 @@ const U = (e) => {
|
|
|
30
30
|
} catch {
|
|
31
31
|
}
|
|
32
32
|
return null;
|
|
33
|
-
},
|
|
33
|
+
}, q = (e) => (Object.keys(e).forEach((t) => {
|
|
34
34
|
e[t] === void 0 && delete e[t];
|
|
35
|
-
}), e),
|
|
35
|
+
}), e), S = (e) => {
|
|
36
36
|
const { height: t, width: n } = e.getBoundingClientRect();
|
|
37
37
|
return { height: Math.ceil(t), width: Math.ceil(n) };
|
|
38
|
-
}, f = (e, t) => e ? t ? e.querySelector(t) : e.documentElement : null,
|
|
38
|
+
}, f = (e, t) => e ? t ? e.querySelector(t) : e.documentElement : null, L = (e, t) => {
|
|
39
39
|
e && (t.bodyPadding && (e.body.style.padding = t.bodyPadding), t.bodyMargin && (e.body.style.margin = t.bodyMargin));
|
|
40
|
-
},
|
|
41
|
-
function
|
|
42
|
-
if (typeof e.data != "string" || !e.data.startsWith("[iFrameSizer]")
|
|
40
|
+
}, h = (e) => e <= 100 ? 100 : e <= 120 ? 1e3 : 1e4, G = () => "[iFrameSizer]ID:0:false:false:32:true:true::auto:::0:false:child:auto:true:::true:::false";
|
|
41
|
+
function J(e) {
|
|
42
|
+
if (typeof e.data != "string" || !e.data.startsWith("[iFrameSizer]"))
|
|
43
|
+
return null;
|
|
44
|
+
const t = e.data.endsWith("mutationObserver") || e.data.endsWith("resizeObserver"), n = e.data.search(/:init(:[\d.]+)?/g) >= 0;
|
|
45
|
+
if (!t && !n)
|
|
43
46
|
return null;
|
|
44
|
-
const [
|
|
45
|
-
return
|
|
47
|
+
const [r, i] = e.data.split(":"), o = +i;
|
|
48
|
+
return o > 0 ? o : null;
|
|
46
49
|
}
|
|
47
|
-
const
|
|
50
|
+
const v = te();
|
|
48
51
|
let m = [];
|
|
49
|
-
const
|
|
50
|
-
if (!
|
|
52
|
+
const K = async (e, t) => {
|
|
53
|
+
if (!E())
|
|
51
54
|
return [];
|
|
52
|
-
const n = {
|
|
55
|
+
const n = { ...N(), ...q(e ?? {}) }, r = Q(t), i = V(n, r);
|
|
53
56
|
return Promise.all(
|
|
54
57
|
r.map(async (o) => {
|
|
55
58
|
const s = {
|
|
@@ -57,7 +60,7 @@ const J = async (e, t) => {
|
|
|
57
60
|
settings: n,
|
|
58
61
|
interactionState: { isHovered: !1 },
|
|
59
62
|
initContext: { isInitialized: !1, retryAttempts: 0 }
|
|
60
|
-
}, { unsubscribe: a, resize: u } = await
|
|
63
|
+
}, { unsubscribe: a, resize: u } = await X(s, i);
|
|
61
64
|
return m.push(s), {
|
|
62
65
|
unsubscribe: () => {
|
|
63
66
|
a(), m = m.filter((c) => c.iframe !== o);
|
|
@@ -67,23 +70,23 @@ const J = async (e, t) => {
|
|
|
67
70
|
})
|
|
68
71
|
);
|
|
69
72
|
};
|
|
70
|
-
function
|
|
71
|
-
return typeof e == "string" ? Array.from(document.querySelectorAll(e)).filter(
|
|
73
|
+
function Q(e) {
|
|
74
|
+
return typeof e == "string" ? Array.from(document.querySelectorAll(e)).filter(p) : e ? p(e) ? [e] : [] : Array.from(document.getElementsByTagName("iframe"));
|
|
72
75
|
}
|
|
73
|
-
function
|
|
76
|
+
function V(e, t) {
|
|
74
77
|
if (Array.isArray(e.checkOrigin))
|
|
75
78
|
return e.checkOrigin;
|
|
76
79
|
if (!e.checkOrigin)
|
|
77
80
|
return [];
|
|
78
81
|
const n = [];
|
|
79
82
|
for (const r of t) {
|
|
80
|
-
const i =
|
|
83
|
+
const i = j(r);
|
|
81
84
|
i && n.push(i);
|
|
82
85
|
}
|
|
83
86
|
return n;
|
|
84
87
|
}
|
|
85
|
-
async function
|
|
86
|
-
const n = await
|
|
88
|
+
async function X(e, t) {
|
|
89
|
+
const n = await U(e.iframe), { unsubscribe: r, resize: i } = n ? Z(e) : Y(e, t), o = ee(e);
|
|
87
90
|
return {
|
|
88
91
|
unsubscribe: () => {
|
|
89
92
|
r(), o();
|
|
@@ -91,32 +94,36 @@ async function V(e, t) {
|
|
|
91
94
|
resize: i
|
|
92
95
|
};
|
|
93
96
|
}
|
|
94
|
-
function
|
|
97
|
+
function Y(e, t) {
|
|
95
98
|
const {
|
|
96
99
|
iframe: n,
|
|
97
100
|
initContext: r,
|
|
98
101
|
settings: { checkOrigin: i, enableLegacyLibSupport: o, targetElementSelector: s, bodyPadding: a, bodyMargin: u }
|
|
99
102
|
} = e, c = (d) => {
|
|
100
|
-
const
|
|
101
|
-
if (!(n.contentWindow !== d.source || !
|
|
103
|
+
const B = d.origin === "null", P = !i || B || t.includes(d.origin);
|
|
104
|
+
if (!(n.contentWindow !== d.source || !P)) {
|
|
102
105
|
if (d.data?.type === "iframe-resized") {
|
|
103
106
|
const { height: l } = d.data;
|
|
104
|
-
l &&
|
|
107
|
+
l && b({ newHeight: l, registeredElement: e });
|
|
105
108
|
return;
|
|
106
109
|
}
|
|
107
110
|
if (o) {
|
|
108
|
-
const l =
|
|
109
|
-
l !== null &&
|
|
111
|
+
const l = J(d);
|
|
112
|
+
l !== null && b({ newHeight: l, registeredElement: e });
|
|
110
113
|
return;
|
|
111
114
|
}
|
|
112
115
|
}
|
|
113
116
|
};
|
|
114
117
|
window.addEventListener("message", c);
|
|
115
|
-
const
|
|
116
|
-
|
|
118
|
+
const O = o ? G() : { type: "iframe-child-init", targetElementSelector: s, bodyPadding: a, bodyMargin: u }, g = () => {
|
|
119
|
+
F(n, () => n.contentWindow?.postMessage(O, "*")), r.retryAttempts++, r.retryTimeoutId = window.setTimeout(g, h(r.retryAttempts));
|
|
120
|
+
}, w = () => {
|
|
121
|
+
r.isInitialized && (r.isInitialized = !1, r.retryAttempts = 0, g());
|
|
117
122
|
};
|
|
118
|
-
return
|
|
119
|
-
unsubscribe: () =>
|
|
123
|
+
return n.addEventListener("load", w), g(), {
|
|
124
|
+
unsubscribe: () => {
|
|
125
|
+
window.removeEventListener("message", c), n.removeEventListener("load", w);
|
|
126
|
+
},
|
|
120
127
|
resize: () => {
|
|
121
128
|
const d = { type: "iframe-get-child-dimensions" };
|
|
122
129
|
n.contentWindow?.postMessage(d, "*");
|
|
@@ -129,18 +136,18 @@ function Z(e) {
|
|
|
129
136
|
const o = () => {
|
|
130
137
|
const s = f(t.contentDocument, r);
|
|
131
138
|
if (!t.contentDocument || !s)
|
|
132
|
-
return i++, setTimeout(o,
|
|
133
|
-
|
|
139
|
+
return i++, setTimeout(o, h(i));
|
|
140
|
+
L(t.contentDocument, n), v().observe(s);
|
|
134
141
|
};
|
|
135
|
-
return
|
|
142
|
+
return $(t, o), t.addEventListener("load", o), {
|
|
136
143
|
unsubscribe: () => {
|
|
137
144
|
const s = f(t.contentDocument, r);
|
|
138
|
-
s &&
|
|
145
|
+
s && v().unobserve(s), t.removeEventListener("load", o);
|
|
139
146
|
},
|
|
140
147
|
resize: () => R(e)
|
|
141
148
|
};
|
|
142
149
|
}
|
|
143
|
-
function
|
|
150
|
+
function ee({ iframe: e, interactionState: t, settings: n }) {
|
|
144
151
|
if (!n.onBeforeIframeResize && !n.onIframeResize)
|
|
145
152
|
return () => {
|
|
146
153
|
};
|
|
@@ -153,7 +160,7 @@ function Y({ iframe: e, interactionState: t, settings: n }) {
|
|
|
153
160
|
e.removeEventListener("mouseenter", r), e.removeEventListener("mouseleave", i);
|
|
154
161
|
};
|
|
155
162
|
}
|
|
156
|
-
function
|
|
163
|
+
function te() {
|
|
157
164
|
let e = null;
|
|
158
165
|
return () => {
|
|
159
166
|
if (!e) {
|
|
@@ -170,10 +177,10 @@ function R(e) {
|
|
|
170
177
|
const { iframe: t, settings: n } = e, r = f(t.contentDocument, n.targetElementSelector);
|
|
171
178
|
if (!r)
|
|
172
179
|
return;
|
|
173
|
-
const { height: i } =
|
|
174
|
-
i &&
|
|
180
|
+
const { height: i } = S(r);
|
|
181
|
+
i && b({ newHeight: i, registeredElement: e });
|
|
175
182
|
}
|
|
176
|
-
function
|
|
183
|
+
function b({ registeredElement: e, newHeight: t }) {
|
|
177
184
|
const { iframe: n, settings: r, interactionState: i, initContext: o } = e;
|
|
178
185
|
if (o.isInitialized || (o.isInitialized = !0, clearTimeout(o.retryTimeoutId)), r.onBeforeIframeResize?.({ iframe: n, interactionState: { ...i }, settings: { ...r }, observedHeight: t }) === !1)
|
|
179
186
|
return;
|
|
@@ -189,45 +196,45 @@ function g({ registeredElement: e, newHeight: t }) {
|
|
|
189
196
|
};
|
|
190
197
|
r.onIframeResize(u);
|
|
191
198
|
}
|
|
192
|
-
const
|
|
193
|
-
let
|
|
194
|
-
|
|
195
|
-
function
|
|
196
|
-
!
|
|
199
|
+
const ne = oe();
|
|
200
|
+
let y = !1, I;
|
|
201
|
+
re();
|
|
202
|
+
function re() {
|
|
203
|
+
!E() || !C() || window.addEventListener("message", (e) => {
|
|
197
204
|
if (e.data?.type === "iframe-child-init")
|
|
198
|
-
return
|
|
205
|
+
return z(() => k(e));
|
|
199
206
|
if (e.data?.type === "iframe-get-child-dimensions")
|
|
200
|
-
return
|
|
207
|
+
return z(() => ie(e));
|
|
201
208
|
});
|
|
202
209
|
}
|
|
203
|
-
function
|
|
210
|
+
function k(e, t = 0) {
|
|
204
211
|
const { targetElementSelector: n, bodyPadding: r, bodyMargin: i } = e.data, o = f(document, n);
|
|
205
|
-
if (
|
|
212
|
+
if (y || window.parent !== e.source)
|
|
206
213
|
return;
|
|
207
214
|
if (!o)
|
|
208
|
-
return setTimeout(() =>
|
|
209
|
-
|
|
210
|
-
const s =
|
|
211
|
-
s.disconnect(), s.observe(o),
|
|
215
|
+
return setTimeout(() => k(e, t + 1), h(t));
|
|
216
|
+
L(document, { bodyMargin: i, bodyPadding: r }), I = n;
|
|
217
|
+
const s = ne();
|
|
218
|
+
s.disconnect(), s.observe(o), y = !0;
|
|
212
219
|
}
|
|
213
|
-
function
|
|
214
|
-
const t = f(document,
|
|
215
|
-
!
|
|
220
|
+
function ie(e) {
|
|
221
|
+
const t = f(document, I);
|
|
222
|
+
!y || window.parent !== e.source || !t || M(t);
|
|
216
223
|
}
|
|
217
|
-
function
|
|
224
|
+
function oe() {
|
|
218
225
|
let e = null;
|
|
219
226
|
return () => (e || (e = new ResizeObserver((t) => {
|
|
220
|
-
t[0].target &&
|
|
227
|
+
t[0].target && M(t[0].target);
|
|
221
228
|
})), e);
|
|
222
229
|
}
|
|
223
|
-
const
|
|
224
|
-
const { width: t, height: n } =
|
|
230
|
+
const M = (e) => {
|
|
231
|
+
const { width: t, height: n } = S(e), r = {
|
|
225
232
|
type: "iframe-resized",
|
|
226
233
|
width: t,
|
|
227
234
|
height: n
|
|
228
235
|
};
|
|
229
236
|
window.parent.postMessage(r, "*");
|
|
230
|
-
},
|
|
237
|
+
}, se = D({
|
|
231
238
|
name: "ResizableIframe",
|
|
232
239
|
props: {
|
|
233
240
|
offsetSize: [String, Number, Object],
|
|
@@ -240,7 +247,7 @@ const k = (e) => {
|
|
|
240
247
|
enableLegacyLibSupport: Boolean
|
|
241
248
|
},
|
|
242
249
|
setup(e, { attrs: t }) {
|
|
243
|
-
const n =
|
|
250
|
+
const n = A(null);
|
|
244
251
|
let r = [], i = !1;
|
|
245
252
|
const o = async (s) => {
|
|
246
253
|
const a = {
|
|
@@ -256,14 +263,14 @@ const k = (e) => {
|
|
|
256
263
|
Object.keys(a).forEach((c) => {
|
|
257
264
|
a[c] === void 0 && delete a[c];
|
|
258
265
|
});
|
|
259
|
-
const u = await
|
|
266
|
+
const u = await K(a, s);
|
|
260
267
|
i ? u.forEach((c) => {
|
|
261
268
|
c.unsubscribe();
|
|
262
269
|
}) : r = u;
|
|
263
270
|
};
|
|
264
|
-
return
|
|
271
|
+
return H(() => {
|
|
265
272
|
n.value && o(n.value);
|
|
266
|
-
}),
|
|
273
|
+
}), _(() => {
|
|
267
274
|
i = !0, r.forEach((s) => {
|
|
268
275
|
s.unsubscribe();
|
|
269
276
|
}), r = [];
|
|
@@ -272,21 +279,21 @@ const k = (e) => {
|
|
|
272
279
|
attrs: t
|
|
273
280
|
};
|
|
274
281
|
}
|
|
275
|
-
}),
|
|
282
|
+
}), ae = (e, t) => {
|
|
276
283
|
const n = e.__vccOpts || e;
|
|
277
284
|
for (const [r, i] of t)
|
|
278
285
|
n[r] = i;
|
|
279
286
|
return n;
|
|
280
287
|
};
|
|
281
|
-
function
|
|
282
|
-
return
|
|
288
|
+
function ce(e, t, n, r, i, o) {
|
|
289
|
+
return W(), T("iframe", x({ ref: "iframeRef" }, e.$attrs), null, 16);
|
|
283
290
|
}
|
|
284
|
-
const
|
|
291
|
+
const ue = /* @__PURE__ */ ae(se, [["render", ce]]), le = {
|
|
285
292
|
install(e) {
|
|
286
|
-
e.component("IframeResizer",
|
|
293
|
+
e.component("IframeResizer", ue);
|
|
287
294
|
}
|
|
288
295
|
};
|
|
289
296
|
export {
|
|
290
|
-
|
|
291
|
-
|
|
297
|
+
ue as IframeResizer,
|
|
298
|
+
le as IframeResizerPlugin
|
|
292
299
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(d,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],a):(d=typeof globalThis<"u"?globalThis:d||self,a(d["open-iframe-resizer-vue"]={},d.Vue))})(this,(function(d,a){"use strict";const
|
|
1
|
+
(function(d,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],a):(d=typeof globalThis<"u"?globalThis:d||self,a(d["open-iframe-resizer-vue"]={},d.Vue))})(this,(function(d,a){"use strict";const z=()=>typeof window<"u",D=()=>{try{return window.self!==window.top}catch{return!0}},v=e=>e instanceof HTMLIFrameElement,S=e=>{window.document.readyState==="complete"?e():window.addEventListener("load",e,{once:!0})},T=(e,t)=>{t(),e.addEventListener("load",t,{once:!0})},A=(e,t)=>{const n=e.contentWindow?.document.readyState==="complete";e.src!=="about:blank"&&e.contentWindow?.location.href!=="about:blank"&&n&&t()},H=()=>({offsetSize:0,checkOrigin:!0,enableLegacyLibSupport:!1});async function _(e){try{return e.contentDocument?.URL==="about:blank"?new Promise(t=>{e.addEventListener("load",()=>t(e.contentDocument!==null),{once:!0})}):e.contentDocument!==null}catch{return!1}}const W=e=>{try{const t=new URL(e.src).origin;if(t!=="about:blank")return t}catch{}return null},x=e=>(Object.keys(e).forEach(t=>{e[t]===void 0&&delete e[t]}),e),E=e=>{const{height:t,width:n}=e.getBoundingClientRect();return{height:Math.ceil(t),width:Math.ceil(n)}},m=(e,t)=>e?t?e.querySelector(t):e.documentElement:null,R=(e,t)=>{e&&(t.bodyPadding&&(e.body.style.padding=t.bodyPadding),t.bodyMargin&&(e.body.style.margin=t.bodyMargin))},y=e=>e<=100?100:e<=120?1e3:1e4,C=()=>"[iFrameSizer]ID:0:false:false:32:true:true::auto:::0:false:child:auto:true:::true:::false";function F(e){if(typeof e.data!="string"||!e.data.startsWith("[iFrameSizer]"))return null;const t=e.data.endsWith("mutationObserver")||e.data.endsWith("resizeObserver"),n=e.data.search(/:init(:[\d.]+)?/g)>=0;if(!t&&!n)return null;const[r,i]=e.data.split(":"),o=+i;return o>0?o:null}const L=J();let b=[];const $=async(e,t)=>{if(!z())return[];const n={...H(),...x(e??{})},r=j(t),i=N(n,r);return Promise.all(r.map(async o=>{const s={iframe:o,settings:n,interactionState:{isHovered:!1},initContext:{isInitialized:!1,retryAttempts:0}},{unsubscribe:c,resize:f}=await U(s,i);return b.push(s),{unsubscribe:()=>{c(),b=b.filter(u=>u.iframe!==o)},resize:f}}))};function j(e){return typeof e=="string"?Array.from(document.querySelectorAll(e)).filter(v):e?v(e)?[e]:[]:Array.from(document.getElementsByTagName("iframe"))}function N(e,t){if(Array.isArray(e.checkOrigin))return e.checkOrigin;if(!e.checkOrigin)return[];const n=[];for(const r of t){const i=W(r);i&&n.push(i)}return n}async function U(e,t){const n=await _(e.iframe),{unsubscribe:r,resize:i}=n?V(e):q(e,t),o=G(e);return{unsubscribe:()=>{r(),o()},resize:i}}function q(e,t){const{iframe:n,initContext:r,settings:{checkOrigin:i,enableLegacyLibSupport:o,targetElementSelector:s,bodyPadding:c,bodyMargin:f}}=e,u=l=>{const ie=l.origin==="null",oe=!i||ie||t.includes(l.origin);if(!(n.contentWindow!==l.source||!oe)){if(l.data?.type==="iframe-resized"){const{height:g}=l.data;g&&h({newHeight:g,registeredElement:e});return}if(o){const g=F(l);g!==null&&h({newHeight:g,registeredElement:e});return}}};window.addEventListener("message",u);const re=o?C():{type:"iframe-child-init",targetElementSelector:s,bodyPadding:c,bodyMargin:f},w=()=>{T(n,()=>n.contentWindow?.postMessage(re,"*")),r.retryAttempts++,r.retryTimeoutId=window.setTimeout(w,y(r.retryAttempts))},B=()=>{r.isInitialized&&(r.isInitialized=!1,r.retryAttempts=0,w())};return n.addEventListener("load",B),w(),{unsubscribe:()=>{window.removeEventListener("message",u),n.removeEventListener("load",B)},resize:()=>{const l={type:"iframe-get-child-dimensions"};n.contentWindow?.postMessage(l,"*")}}}function V(e){const{iframe:t,settings:n}=e,{targetElementSelector:r}=n;let i=0;const o=()=>{const s=m(t.contentDocument,r);if(!t.contentDocument||!s)return i++,setTimeout(o,y(i));R(t.contentDocument,n),L().observe(s)};return A(t,o),t.addEventListener("load",o),{unsubscribe:()=>{const s=m(t.contentDocument,r);s&&L().unobserve(s),t.removeEventListener("load",o)},resize:()=>I(e)}}function G({iframe:e,interactionState:t,settings:n}){if(!n.onBeforeIframeResize&&!n.onIframeResize)return()=>{};const r=()=>{t.isHovered=!0},i=()=>{t.isHovered=!1};return e.addEventListener("mouseenter",r),e.addEventListener("mouseleave",i),()=>{e.removeEventListener("mouseenter",r),e.removeEventListener("mouseleave",i)}}function J(){let e=null;return()=>{if(!e){const t=({target:n})=>{const r=b.find(({iframe:i})=>i.contentDocument===n.ownerDocument);r&&I(r)};e=new ResizeObserver(n=>n.forEach(t))}return e}}function I(e){const{iframe:t,settings:n}=e,r=m(t.contentDocument,n.targetElementSelector);if(!r)return;const{height:i}=E(r);i&&h({newHeight:i,registeredElement:e})}function h({registeredElement:e,newHeight:t}){const{iframe:n,settings:r,interactionState:i,initContext:o}=e;if(o.isInitialized||(o.isInitialized=!0,clearTimeout(o.retryTimeoutId)),r.onBeforeIframeResize?.({iframe:n,interactionState:{...i},settings:{...r},observedHeight:t})===!1)return;const s=n.getBoundingClientRect(),c=t+r.offsetSize;if(n.style.height=`${c}px`,!r.onIframeResize)return;const f={iframe:n,settings:{...r},interactionState:{...i},previousRenderState:{rect:s},nextRenderState:{rect:n.getBoundingClientRect()}};r.onIframeResize(f)}const K=Y();let p=!1,M;Q();function Q(){!z()||!D()||window.addEventListener("message",e=>{if(e.data?.type==="iframe-child-init")return S(()=>O(e));if(e.data?.type==="iframe-get-child-dimensions")return S(()=>X(e))})}function O(e,t=0){const{targetElementSelector:n,bodyPadding:r,bodyMargin:i}=e.data,o=m(document,n);if(p||window.parent!==e.source)return;if(!o)return setTimeout(()=>O(e,t+1),y(t));R(document,{bodyMargin:i,bodyPadding:r}),M=n;const s=K();s.disconnect(),s.observe(o),p=!0}function X(e){const t=m(document,M);!p||window.parent!==e.source||!t||k(t)}function Y(){let e=null;return()=>(e||(e=new ResizeObserver(t=>{t[0].target&&k(t[0].target)})),e)}const k=e=>{const{width:t,height:n}=E(e),r={type:"iframe-resized",width:t,height:n};window.parent.postMessage(r,"*")},Z=a.defineComponent({name:"ResizableIframe",props:{offsetSize:[String,Number,Object],checkOrigin:[Boolean,Array],onIframeResize:Function,onBeforeIframeResize:Function,targetElementSelector:String,bodyMargin:[String,Number],bodyPadding:[String,Number],enableLegacyLibSupport:Boolean},setup(e,{attrs:t}){const n=a.ref(null);let r=[],i=!1;const o=async s=>{const c={offsetSize:e.offsetSize,enableLegacyLibSupport:e.enableLegacyLibSupport,checkOrigin:e.checkOrigin,onIframeResize:e.onIframeResize,onBeforeIframeResize:e.onBeforeIframeResize,targetElementSelector:e.targetElementSelector,bodyMargin:e.bodyMargin,bodyPadding:e.bodyPadding};Object.keys(c).forEach(u=>{c[u]===void 0&&delete c[u]});const f=await $(c,s);i?f.forEach(u=>{u.unsubscribe()}):r=f};return a.onMounted(()=>{n.value&&o(n.value)}),a.onBeforeUnmount(()=>{i=!0,r.forEach(s=>{s.unsubscribe()}),r=[]}),{iframeRef:n,attrs:t}}}),ee=(e,t)=>{const n=e.__vccOpts||e;for(const[r,i]of t)n[r]=i;return n};function te(e,t,n,r,i,o){return a.openBlock(),a.createElementBlock("iframe",a.mergeProps({ref:"iframeRef"},e.$attrs),null,16)}const P=ee(Z,[["render",te]]),ne={install(e){e.component("IframeResizer",P)}};d.IframeResizer=P,d.IframeResizerPlugin=ne,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})}));
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@open-iframe-resizer/vue",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "2.
|
|
4
|
+
"version": "2.4.0",
|
|
5
5
|
"description": "Open-source modern iframe resizer component",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"repository": {
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"test": "npx playwright install --with-deps && npx playwright test"
|
|
44
44
|
},
|
|
45
45
|
"dependencies": {
|
|
46
|
-
"@open-iframe-resizer/core": "2.
|
|
46
|
+
"@open-iframe-resizer/core": "2.4.0"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@vitejs/plugin-vue": "^6.0.3",
|