@open-iframe-resizer/vue 1.4.0 → 1.4.1

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