@open-iframe-resizer/core 1.2.1 → 1.3.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/README.md +1 -1
- package/dist/index.d.ts +38 -2
- package/dist/index.js +138 -103
- package/dist/index.umd.cjs +1 -1
- package/package.json +1 -4
package/README.md
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
|
|
9
9
|
A modern, lightweight alternative for resizing iframes dynamically. It is shipped under the MIT license, making it usable in commercial projects.
|
|
10
10
|
|
|
11
|
-
If you found this
|
|
11
|
+
If you found this project helpful, please consider starring the repository!
|
|
12
12
|
|
|
13
13
|
## Getting Started
|
|
14
14
|
|
package/dist/index.d.ts
CHANGED
|
@@ -1,3 +1,10 @@
|
|
|
1
|
+
export declare type IframeChildInitEventData = {
|
|
2
|
+
type: "iframe-child-init";
|
|
3
|
+
targetElementSelector?: string;
|
|
4
|
+
bodyPadding?: string;
|
|
5
|
+
bodyMargin?: string;
|
|
6
|
+
};
|
|
7
|
+
|
|
1
8
|
export declare type IframeResizeEvent = MessageEvent<IframeResizeEventData>;
|
|
2
9
|
|
|
3
10
|
export declare type IframeResizeEventData = {
|
|
@@ -24,6 +31,13 @@ export declare type InteractionState = {
|
|
|
24
31
|
isHovered: boolean;
|
|
25
32
|
};
|
|
26
33
|
|
|
34
|
+
export declare type RegisteredElement = {
|
|
35
|
+
iframe: HTMLIFrameElement;
|
|
36
|
+
settings: Settings;
|
|
37
|
+
interactionState: InteractionState;
|
|
38
|
+
initContext: { isInitialized: boolean; retryAttempts: number; retryTimeoutId?: number };
|
|
39
|
+
};
|
|
40
|
+
|
|
27
41
|
export declare type ResizeContext = {
|
|
28
42
|
iframe: HTMLIFrameElement;
|
|
29
43
|
settings: Settings;
|
|
@@ -57,6 +71,28 @@ export declare type Settings = {
|
|
|
57
71
|
* Default: `false`
|
|
58
72
|
*/
|
|
59
73
|
enableLegacyLibSupport: boolean;
|
|
74
|
+
/**
|
|
75
|
+
* By default, the root element observed for resizing is the <html> document.
|
|
76
|
+
* In more complex layouts, the scrolling container may be elsewhere.
|
|
77
|
+
* This setting allows you to customize the root element that should be observed for resize events.
|
|
78
|
+
*
|
|
79
|
+
* Default: `undefined`
|
|
80
|
+
*/
|
|
81
|
+
targetElementSelector?: string;
|
|
82
|
+
|
|
83
|
+
/**
|
|
84
|
+
* Customize the padding style of the iframe body.
|
|
85
|
+
*
|
|
86
|
+
* Default: `undefined`
|
|
87
|
+
*/
|
|
88
|
+
bodyPadding?: string;
|
|
89
|
+
|
|
90
|
+
/**
|
|
91
|
+
* Customize the margin style of the iframe body.
|
|
92
|
+
*
|
|
93
|
+
* Default: `undefined`
|
|
94
|
+
*/
|
|
95
|
+
bodyMargin?: string;
|
|
60
96
|
/**
|
|
61
97
|
* Listener that is called after the iframe has been resized.
|
|
62
98
|
* You can use a predefined handler like `updateParentScrollOnResize` or create your own custom handler.
|
|
@@ -69,9 +105,9 @@ export declare type Settings = {
|
|
|
69
105
|
/**
|
|
70
106
|
* Resize handler that scrolls to restore the iframe's position in the viewport as it was before the resize.
|
|
71
107
|
*
|
|
72
|
-
* *Note:* This behavior only triggers if the iframe
|
|
108
|
+
* *Note:* This behavior only triggers if the iframe currently has focus,
|
|
73
109
|
* in order to try to limit the number of scroll as it can affect the user experience.
|
|
74
110
|
*/
|
|
75
|
-
export declare const updateParentScrollOnResize: ({ previousRenderState, nextRenderState,
|
|
111
|
+
export declare const updateParentScrollOnResize: ({ previousRenderState, nextRenderState, iframe }: ResizeContext) => void;
|
|
76
112
|
|
|
77
113
|
export { }
|
package/dist/index.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
const
|
|
2
|
-
|
|
3
|
-
},
|
|
1
|
+
const p = () => typeof window < "u", R = () => window.self !== window.top, b = (e) => e instanceof HTMLIFrameElement, M = (e) => {
|
|
2
|
+
window.document.readyState === "complete" ? e() : window.addEventListener("load", e);
|
|
3
|
+
}, T = (e, t) => {
|
|
4
4
|
t(), e.addEventListener("load", t);
|
|
5
|
-
},
|
|
6
|
-
var
|
|
7
|
-
const n = ((
|
|
8
|
-
return e.src !== "about:blank" && ((
|
|
9
|
-
},
|
|
5
|
+
}, C = (e, t) => {
|
|
6
|
+
var o, r;
|
|
7
|
+
const n = ((o = e.contentWindow) == null ? void 0 : o.document.readyState) === "complete";
|
|
8
|
+
return e.src !== "about:blank" && ((r = e.contentWindow) == null ? void 0 : r.location.href) !== "about:blank" && n ? t() : e.addEventListener("load", t);
|
|
9
|
+
}, k = () => ({ offsetSize: 0, checkOrigin: !0, enableLegacyLibSupport: !1 }), B = (e) => {
|
|
10
10
|
try {
|
|
11
11
|
return new URL(e.src).origin === window.location.origin;
|
|
12
12
|
} catch {
|
|
13
13
|
return !1;
|
|
14
14
|
}
|
|
15
|
-
},
|
|
15
|
+
}, D = (e) => {
|
|
16
16
|
try {
|
|
17
17
|
const t = new URL(e.src).origin;
|
|
18
18
|
if (t !== "about:blank")
|
|
@@ -20,150 +20,185 @@ const g = () => typeof window < "u", L = () => window.self !== window.top, m = (
|
|
|
20
20
|
} catch {
|
|
21
21
|
}
|
|
22
22
|
return null;
|
|
23
|
-
},
|
|
24
|
-
const { height: t } = e.
|
|
25
|
-
return Math.ceil(t);
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
() => {
|
|
31
|
-
var t;
|
|
32
|
-
return (t = e.contentWindow) == null ? void 0 : t.postMessage("[iFrameSizer]ID:0:false:false:32:true:true::auto:::0:false:child:auto:true:::true:::false", "*");
|
|
33
|
-
}
|
|
34
|
-
);
|
|
35
|
-
}
|
|
36
|
-
function O(e) {
|
|
23
|
+
}, A = (e) => (Object.keys(e).forEach((t) => e[t] === void 0 && delete e[t]), e), L = (e) => {
|
|
24
|
+
const { height: t, width: n } = e.getBoundingClientRect();
|
|
25
|
+
return { height: Math.ceil(t), width: Math.ceil(n) };
|
|
26
|
+
}, f = (e, t) => e ? t ? e.querySelector(t) : e.documentElement : null, I = (e, t) => {
|
|
27
|
+
e && (t.bodyPadding && (e.body.style.padding = t.bodyPadding), t.bodyMargin && (e.body.style.margin = t.bodyMargin));
|
|
28
|
+
}, m = (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";
|
|
29
|
+
function P(e) {
|
|
37
30
|
if (typeof e.data == "string" && e.data.startsWith("[iFrameSizer]")) {
|
|
38
|
-
const [t, n] = e.data.split(":"),
|
|
39
|
-
return
|
|
31
|
+
const [t, n] = e.data.split(":"), i = +n;
|
|
32
|
+
return i > 0 ? i : null;
|
|
40
33
|
}
|
|
41
34
|
return null;
|
|
42
35
|
}
|
|
43
|
-
const
|
|
36
|
+
const v = q();
|
|
44
37
|
let l = [];
|
|
45
|
-
const
|
|
46
|
-
if (!
|
|
38
|
+
const K = (e, t) => {
|
|
39
|
+
if (!p())
|
|
47
40
|
return [];
|
|
48
|
-
const n = { ...
|
|
49
|
-
return
|
|
50
|
-
const s = {
|
|
41
|
+
const n = { ...k(), ...A(e ?? {}) }, i = W(t), o = x(n, i);
|
|
42
|
+
return i.map((r) => {
|
|
43
|
+
const s = {
|
|
44
|
+
iframe: r,
|
|
45
|
+
settings: n,
|
|
46
|
+
interactionState: { isHovered: !1 },
|
|
47
|
+
initContext: { isInitialized: !1, retryAttempts: 0 }
|
|
48
|
+
}, a = F(s, o);
|
|
51
49
|
return l.push(s), {
|
|
52
50
|
unsubscribe: () => {
|
|
53
|
-
|
|
51
|
+
a(), l = l.filter((d) => d.iframe !== r);
|
|
54
52
|
}
|
|
55
53
|
};
|
|
56
54
|
});
|
|
57
55
|
};
|
|
58
|
-
function
|
|
59
|
-
return typeof e == "string" ? Array.from(document.querySelectorAll(e)).filter(
|
|
56
|
+
function W(e) {
|
|
57
|
+
return typeof e == "string" ? Array.from(document.querySelectorAll(e)).filter(b) : e ? b(e) ? [e] : [] : Array.from(document.getElementsByTagName("iframe"));
|
|
60
58
|
}
|
|
61
|
-
function
|
|
59
|
+
function x(e, t) {
|
|
62
60
|
if (Array.isArray(e.checkOrigin))
|
|
63
61
|
return e.checkOrigin;
|
|
64
62
|
if (!e.checkOrigin)
|
|
65
63
|
return [];
|
|
66
64
|
const n = [];
|
|
67
|
-
for (const
|
|
68
|
-
const
|
|
69
|
-
|
|
65
|
+
for (const i of t) {
|
|
66
|
+
const o = D(i);
|
|
67
|
+
o && n.push(o);
|
|
70
68
|
}
|
|
71
69
|
return n;
|
|
72
70
|
}
|
|
73
|
-
function
|
|
74
|
-
const n =
|
|
71
|
+
function F(e, t) {
|
|
72
|
+
const n = B(e.iframe) ? U(e) : N(e, t), i = $(e);
|
|
75
73
|
return () => {
|
|
76
|
-
n(),
|
|
74
|
+
n(), i();
|
|
77
75
|
};
|
|
78
76
|
}
|
|
79
|
-
function
|
|
80
|
-
const {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
77
|
+
function N(e, t) {
|
|
78
|
+
const {
|
|
79
|
+
iframe: n,
|
|
80
|
+
initContext: i,
|
|
81
|
+
settings: { checkOrigin: o, enableLegacyLibSupport: r, targetElementSelector: s, bodyPadding: a, bodyMargin: d }
|
|
82
|
+
} = e, h = (c) => {
|
|
83
|
+
var y;
|
|
84
|
+
const E = !o || t.includes(c.origin);
|
|
85
|
+
if (!(!(n.contentWindow === c.source) || !E)) {
|
|
86
|
+
if (((y = c.data) == null ? void 0 : y.type) === "iframe-resized") {
|
|
87
|
+
const { height: u } = c.data;
|
|
88
|
+
u && g({ newHeight: u, registeredElement: e });
|
|
87
89
|
return;
|
|
88
90
|
}
|
|
89
|
-
if (r
|
|
90
|
-
const
|
|
91
|
-
|
|
91
|
+
if (r) {
|
|
92
|
+
const u = P(c);
|
|
93
|
+
u !== null && g({ newHeight: u, registeredElement: e });
|
|
92
94
|
return;
|
|
93
95
|
}
|
|
94
96
|
}
|
|
95
97
|
};
|
|
96
|
-
|
|
98
|
+
window.addEventListener("message", h);
|
|
99
|
+
const S = r ? H() : { type: "iframe-child-init", targetElementSelector: s, bodyPadding: a, bodyMargin: d }, w = () => {
|
|
100
|
+
T(n, () => {
|
|
101
|
+
var c;
|
|
102
|
+
return (c = n.contentWindow) == null ? void 0 : c.postMessage(S, "*");
|
|
103
|
+
}), i.retryAttempts++, i.retryTimeoutId = window.setTimeout(w, m(i.retryAttempts));
|
|
104
|
+
};
|
|
105
|
+
return w(), () => window.removeEventListener("message", h);
|
|
97
106
|
}
|
|
98
|
-
function
|
|
99
|
-
const t =
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
107
|
+
function U(e) {
|
|
108
|
+
const { iframe: t, settings: n } = e, { targetElementSelector: i } = n;
|
|
109
|
+
let o = 0;
|
|
110
|
+
const r = () => {
|
|
111
|
+
const s = f(t.contentDocument, i);
|
|
112
|
+
if (!t.contentDocument || !s)
|
|
113
|
+
return o++, setTimeout(r, m(o));
|
|
114
|
+
I(t.contentDocument, n), v().observe(s);
|
|
103
115
|
};
|
|
104
|
-
return
|
|
105
|
-
|
|
106
|
-
|
|
116
|
+
return C(t, r), () => {
|
|
117
|
+
const s = f(t.contentDocument, i);
|
|
118
|
+
s && v().unobserve(s), t.removeEventListener("load", r);
|
|
107
119
|
};
|
|
108
120
|
}
|
|
109
|
-
function
|
|
121
|
+
function $({ iframe: e, interactionState: t }) {
|
|
110
122
|
const n = () => {
|
|
111
123
|
t.isHovered = !0;
|
|
112
|
-
},
|
|
124
|
+
}, i = () => {
|
|
113
125
|
t.isHovered = !1;
|
|
114
126
|
};
|
|
115
|
-
return e.addEventListener("mouseenter", n), e.addEventListener("mouseleave",
|
|
116
|
-
e.removeEventListener("mouseenter", n), e.removeEventListener("mouseleave",
|
|
127
|
+
return e.addEventListener("mouseenter", n), e.addEventListener("mouseleave", i), () => {
|
|
128
|
+
e.removeEventListener("mouseenter", n), e.removeEventListener("mouseleave", i);
|
|
117
129
|
};
|
|
118
130
|
}
|
|
119
|
-
function
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
131
|
+
function q() {
|
|
132
|
+
let e = null;
|
|
133
|
+
return () => {
|
|
134
|
+
if (!e) {
|
|
135
|
+
const t = ({ target: n }) => {
|
|
136
|
+
const i = l.find(({ iframe: d }) => d.contentDocument === n.ownerDocument);
|
|
137
|
+
if (!i)
|
|
138
|
+
return;
|
|
139
|
+
const { iframe: o, settings: r } = i, s = f(o.contentDocument, r.targetElementSelector);
|
|
140
|
+
if (!s)
|
|
141
|
+
return;
|
|
142
|
+
const { height: a } = L(s);
|
|
143
|
+
a && g({ newHeight: a, registeredElement: i });
|
|
144
|
+
};
|
|
145
|
+
e = new ResizeObserver((n) => n.forEach(t));
|
|
146
|
+
}
|
|
147
|
+
return e;
|
|
132
148
|
};
|
|
133
|
-
return new ResizeObserver((t) => t.forEach(e));
|
|
134
149
|
}
|
|
135
|
-
function
|
|
136
|
-
const { iframe: n, settings:
|
|
137
|
-
|
|
150
|
+
function g({ registeredElement: e, newHeight: t }) {
|
|
151
|
+
const { iframe: n, settings: i, interactionState: o, initContext: r } = e;
|
|
152
|
+
r.isInitialized || (r.isInitialized = !0, clearTimeout(r.retryTimeoutId));
|
|
153
|
+
const s = n.getBoundingClientRect(), a = t + i.offsetSize;
|
|
154
|
+
if (n.style.height = `${a}px`, !i.onIframeResize)
|
|
138
155
|
return;
|
|
139
156
|
const d = {
|
|
140
157
|
iframe: n,
|
|
141
|
-
settings: { ...
|
|
142
|
-
interactionState: { ...
|
|
143
|
-
previousRenderState: { rect:
|
|
158
|
+
settings: { ...i },
|
|
159
|
+
interactionState: { ...o },
|
|
160
|
+
previousRenderState: { rect: s },
|
|
144
161
|
nextRenderState: { rect: n.getBoundingClientRect() }
|
|
145
162
|
};
|
|
146
|
-
|
|
163
|
+
i.onIframeResize(d);
|
|
147
164
|
}
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
height: h(document)
|
|
156
|
-
};
|
|
157
|
-
window.parent.postMessage(n, "*");
|
|
158
|
-
};
|
|
159
|
-
new ResizeObserver(e).observe(document.body);
|
|
165
|
+
const V = G();
|
|
166
|
+
let z = !1;
|
|
167
|
+
_();
|
|
168
|
+
function _() {
|
|
169
|
+
!p() || !R() || window.addEventListener("message", (e) => {
|
|
170
|
+
var t;
|
|
171
|
+
((t = e.data) == null ? void 0 : t.type) === "iframe-child-init" && M(() => O(e));
|
|
160
172
|
});
|
|
161
173
|
}
|
|
162
|
-
|
|
163
|
-
n
|
|
174
|
+
function O(e, t = 0) {
|
|
175
|
+
const { targetElementSelector: n, bodyPadding: i, bodyMargin: o } = e.data, r = f(document, n);
|
|
176
|
+
if (z || window.parent !== e.source)
|
|
177
|
+
return;
|
|
178
|
+
if (!r)
|
|
179
|
+
return setTimeout(() => O(e, t + 1), m(t));
|
|
180
|
+
I(document, { bodyMargin: o, bodyPadding: i });
|
|
181
|
+
const s = V();
|
|
182
|
+
s.disconnect(), s.observe(r), z = !0;
|
|
183
|
+
}
|
|
184
|
+
function G() {
|
|
185
|
+
let e = null;
|
|
186
|
+
return () => (e || (e = new ResizeObserver((t) => {
|
|
187
|
+
if (!t[0].target)
|
|
188
|
+
return;
|
|
189
|
+
const { height: n, width: i } = L(t[0].target), o = {
|
|
190
|
+
type: "iframe-resized",
|
|
191
|
+
width: i,
|
|
192
|
+
height: n
|
|
193
|
+
};
|
|
194
|
+
window.parent.postMessage(o, "*");
|
|
195
|
+
})), e);
|
|
196
|
+
}
|
|
197
|
+
const Q = ({ previousRenderState: e, nextRenderState: t, iframe: n }) => {
|
|
198
|
+
document.activeElement === n && window.scrollBy(0, t.rect.bottom - e.rect.bottom);
|
|
164
199
|
};
|
|
165
200
|
export {
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
201
|
+
K as initialize,
|
|
202
|
+
_ as initializeChildListener,
|
|
203
|
+
Q as updateParentScrollOnResize
|
|
169
204
|
};
|
package/dist/index.umd.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(a,
|
|
1
|
+
(function(a,l){typeof exports=="object"&&typeof module<"u"?l(exports):typeof define=="function"&&define.amd?define(["exports"],l):(a=typeof globalThis<"u"?globalThis:a||self,l(a.iframeResizer={}))})(this,function(a){"use strict";const l=()=>typeof window<"u",E=()=>window.self!==window.top,w=e=>e instanceof HTMLIFrameElement,T=e=>{window.document.readyState==="complete"?e():window.addEventListener("load",e)},M=(e,t)=>{t(),e.addEventListener("load",t)},C=(e,t)=>{var o,r;const n=((o=e.contentWindow)==null?void 0:o.document.readyState)==="complete";return e.src!=="about:blank"&&((r=e.contentWindow)==null?void 0:r.location.href)!=="about:blank"&&n?t():e.addEventListener("load",t)},k=()=>({offsetSize:0,checkOrigin:!0,enableLegacyLibSupport:!1}),B=e=>{try{return new URL(e.src).origin===window.location.origin}catch{return!1}},D=e=>{try{const t=new URL(e.src).origin;if(t!=="about:blank")return t}catch{}return null},P=e=>(Object.keys(e).forEach(t=>e[t]===void 0&&delete e[t]),e),b=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,p=(e,t)=>{e&&(t.bodyPadding&&(e.body.style.padding=t.bodyPadding),t.bodyMargin&&(e.body.style.margin=t.bodyMargin))},h=e=>e<=100?100:e<=120?1e3:1e4,A=()=>"[iFrameSizer]ID:0:false:false:32:true:true::auto:::0:false:child:auto:true:::true:::false";function H(e){if(typeof e.data=="string"&&e.data.startsWith("[iFrameSizer]")){const[t,n]=e.data.split(":"),i=+n;return i>0?i:null}return null}const z=V();let m=[];const W=(e,t)=>{if(!l())return[];const n={...k(),...P(e??{})},i=x(t),o=F(n,i);return i.map(r=>{const s={iframe:r,settings:n,interactionState:{isHovered:!1},initContext:{isInitialized:!1,retryAttempts:0}},c=N(s,o);return m.push(s),{unsubscribe:()=>{c(),m=m.filter(u=>u.iframe!==r)}}})};function x(e){return typeof e=="string"?Array.from(document.querySelectorAll(e)).filter(w):e?w(e)?[e]:[]:Array.from(document.getElementsByTagName("iframe"))}function F(e,t){if(Array.isArray(e.checkOrigin))return e.checkOrigin;if(!e.checkOrigin)return[];const n=[];for(const i of t){const o=D(i);o&&n.push(o)}return n}function N(e,t){const n=B(e.iframe)?$(e):U(e,t),i=q(e);return()=>{n(),i()}}function U(e,t){const{iframe:n,initContext:i,settings:{checkOrigin:o,enableLegacyLibSupport:r,targetElementSelector:s,bodyPadding:c,bodyMargin:u}}=e,I=d=>{var R;const K=!o||t.includes(d.origin);if(!(!(n.contentWindow===d.source)||!K)){if(((R=d.data)==null?void 0:R.type)==="iframe-resized"){const{height:f}=d.data;f&&y({newHeight:f,registeredElement:e});return}if(r){const f=H(d);f!==null&&y({newHeight:f,registeredElement:e});return}}};window.addEventListener("message",I);const J=r?A():{type:"iframe-child-init",targetElementSelector:s,bodyPadding:c,bodyMargin:u},S=()=>{M(n,()=>{var d;return(d=n.contentWindow)==null?void 0:d.postMessage(J,"*")}),i.retryAttempts++,i.retryTimeoutId=window.setTimeout(S,h(i.retryAttempts))};return S(),()=>window.removeEventListener("message",I)}function $(e){const{iframe:t,settings:n}=e,{targetElementSelector:i}=n;let o=0;const r=()=>{const s=g(t.contentDocument,i);if(!t.contentDocument||!s)return o++,setTimeout(r,h(o));p(t.contentDocument,n),z().observe(s)};return C(t,r),()=>{const s=g(t.contentDocument,i);s&&z().unobserve(s),t.removeEventListener("load",r)}}function q({iframe:e,interactionState:t}){const n=()=>{t.isHovered=!0},i=()=>{t.isHovered=!1};return e.addEventListener("mouseenter",n),e.addEventListener("mouseleave",i),()=>{e.removeEventListener("mouseenter",n),e.removeEventListener("mouseleave",i)}}function V(){let e=null;return()=>{if(!e){const t=({target:n})=>{const i=m.find(({iframe:u})=>u.contentDocument===n.ownerDocument);if(!i)return;const{iframe:o,settings:r}=i,s=g(o.contentDocument,r.targetElementSelector);if(!s)return;const{height:c}=b(s);c&&y({newHeight:c,registeredElement:i})};e=new ResizeObserver(n=>n.forEach(t))}return e}}function y({registeredElement:e,newHeight:t}){const{iframe:n,settings:i,interactionState:o,initContext:r}=e;r.isInitialized||(r.isInitialized=!0,clearTimeout(r.retryTimeoutId));const s=n.getBoundingClientRect(),c=t+i.offsetSize;if(n.style.height=`${c}px`,!i.onIframeResize)return;const u={iframe:n,settings:{...i},interactionState:{...o},previousRenderState:{rect:s},nextRenderState:{rect:n.getBoundingClientRect()}};i.onIframeResize(u)}const _=j();let v=!1;L();function L(){!l()||!E()||window.addEventListener("message",e=>{var t;((t=e.data)==null?void 0:t.type)==="iframe-child-init"&&T(()=>O(e))})}function O(e,t=0){const{targetElementSelector:n,bodyPadding:i,bodyMargin:o}=e.data,r=g(document,n);if(v||window.parent!==e.source)return;if(!r)return setTimeout(()=>O(e,t+1),h(t));p(document,{bodyMargin:o,bodyPadding:i});const s=_();s.disconnect(),s.observe(r),v=!0}function j(){let e=null;return()=>(e||(e=new ResizeObserver(t=>{if(!t[0].target)return;const{height:n,width:i}=b(t[0].target),o={type:"iframe-resized",width:i,height:n};window.parent.postMessage(o,"*")})),e)}const G=({previousRenderState:e,nextRenderState:t,iframe:n})=>{document.activeElement===n&&window.scrollBy(0,t.rect.bottom-e.rect.bottom)};a.initialize=W,a.initializeChildListener=L,a.updateParentScrollOnResize=G,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@open-iframe-resizer/core",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "1.
|
|
4
|
+
"version": "1.3.0",
|
|
5
5
|
"description": "Open-source modern iframe resizer",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"repository": {
|
|
@@ -46,8 +46,5 @@
|
|
|
46
46
|
"test:e2e": "npx playwright install --with-deps && npx playwright test",
|
|
47
47
|
"test:unit": "vitest run",
|
|
48
48
|
"prepare": "copyfiles -V ../../README.md packages/core"
|
|
49
|
-
},
|
|
50
|
-
"devDependencies": {
|
|
51
|
-
"@microsoft/tsdoc": "^0.15.0"
|
|
52
49
|
}
|
|
53
50
|
}
|