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