@open-iframe-resizer/core 1.2.0 → 1.3.0

package/README.md

@@ -1,10 +1,14 @@
 # Open Iframe Resizer
 
+![NPM Version](https://img.shields.io/npm/v/%40open-iframe-resizer%2Fcore)
+![NPM License](https://img.shields.io/npm/l/%40open-iframe-resizer%2Fcore)
+[![](https://data.jsdelivr.com/v1/package/npm/@open-iframe-resizer/core/badge)](https://www.jsdelivr.com/package/npm/@open-iframe-resizer/core)
+
 ## Overview
 
 A modern, lightweight alternative for resizing iframes dynamically. It is shipped under the MIT license, making it usable in commercial projects.
 
-If you found this plugin helpful, please consider starring the repository!
+If you found this project helpful, please consider starring the repository!
 
 ## Getting Started
 
@@ -13,7 +17,7 @@ If you found this plugin helpful, please consider starring the repository!
 ```html
 
 <script type="module">
-  import { initialize } from "https://cdn.jsdelivr.net/npm/@open-iframe-resizer/core@latest/dist/index.js";
+  import { initialize } from "https://cdn.jsdelivr.net/npm/@open-iframe-resizer/core@latest/dist/index.min.js";
 
   initialize({}, "#my-iframe");
 </script>
@@ -45,7 +49,7 @@ You can execute a custom function after an iframe has been resized. Also, you ca
 like `updateParentScrollOnResize` to help keep the iframe within the viewport after resizing:
 
 ```javascript
-import { initialize, updateParentScrollOnResize } from "https://cdn.jsdelivr.net/npm/@open-iframe-resizer/core@latest/dist/index.js";
+import { initialize, updateParentScrollOnResize } from "https://cdn.jsdelivr.net/npm/@open-iframe-resizer/core@latest/dist/index.min.js";
 
 initialize({ onIframeResize: updateParentScrollOnResize }, "#myIframe");
 ```

package/dist/index.d.ts

@@ -1,4 +1,113 @@
-export * from './parent';
-export * from './child';
-export * from './resize-handlers';
-export type * from './type';
+export declare type IframeChildInitEventData = {
+    type: "iframe-child-init";
+    targetElementSelector?: string;
+    bodyPadding?: string;
+    bodyMargin?: string;
+};
+
+export declare type IframeResizeEvent = MessageEvent<IframeResizeEventData>;
+
+export declare type IframeResizeEventData = {
+    type: "iframe-resized";
+    width: number;
+    height?: number;
+};
+
+export declare const initialize: InitializeFunction;
+
+export declare function initializeChildListener(): void;
+
+/**
+ * Automatically resize the selected iframes when their inner content grows.
+ * @param settings The settings for the selected iframes. The default settings properties are picked if empty.
+ * @param selector The selector for the iframe(s) or the HTMLIFrameElement to be resized. If empty, all document iframe elements will be selected.
+ * @returns A result array, which can be used to clean up the listeners if you often remove iframes from the document.
+ */
+export declare type InitializeFunction = (settings?: Partial<Settings>, selector?: string | HTMLIFrameElement) => InitializeResult[];
+
+export declare type InitializeResult = { unsubscribe: () => void };
+
+export declare type InteractionState = {
+    isHovered: boolean;
+};
+
+export declare type RegisteredElement = {
+    iframe: HTMLIFrameElement;
+    settings: Settings;
+    interactionState: InteractionState;
+    initContext: { isInitialized: boolean; retryAttempts: number; retryTimeoutId?: number };
+};
+
+export declare type ResizeContext = {
+    iframe: HTMLIFrameElement;
+    settings: Settings;
+    interactionState: InteractionState;
+    previousRenderState: ResizeRenderState;
+    nextRenderState: ResizeRenderState;
+};
+
+export declare type ResizeRenderState = { rect: DOMRect };
+
+export declare type Settings = {
+    /**
+     * Offset added to the resize size (in pixels).
+     *
+     * Default: `0`
+     */
+    offsetSize: number;
+    /**
+     * Specifies whether to check the origin of incoming messages.
+     * Accepts an array of allowed origins or a boolean.
+     * If `true`, incoming messages are allowed from the origins of the registered iframes.
+     *
+     * Default: `true`
+     */
+    checkOrigin: string[] | boolean;
+    /**
+     * Allows the library to communicate with a cross-origin child iframe
+     * containing the original "iframe-resizer" script.
+     * Useful if you do not control the child domain.
+     *
+     * Default: `false`
+     */
+    enableLegacyLibSupport: boolean;
+    /**
+     * By default, the root element observed for resizing is the <html> document.
+     * In more complex layouts, the scrolling container may be elsewhere.
+     * This setting allows you to customize the root element that should be observed for resize events.
+     *
+     * Default: `undefined`
+     */
+    targetElementSelector?: string;
+
+    /**
+     * Customize the padding style of the iframe body.
+     *
+     * Default: `undefined`
+     */
+    bodyPadding?: string;
+
+    /**
+     * Customize the margin style of the iframe body.
+     *
+     * Default: `undefined`
+     */
+    bodyMargin?: string;
+    /**
+     * Listener that is called after the iframe has been resized.
+     * You can use a predefined handler like `updateParentScrollOnResize` or create your own custom handler.
+     *
+     * Default: `undefined`
+     */
+    onIframeResize?: (context: ResizeContext) => void;
+};
+
+/**
+ * Resize handler that scrolls to restore the iframe's position in the viewport as it was before the resize.
+ *
+ * *Note:* This behavior only triggers if the iframe currently has focus,
+ * in order to try to limit the number of scroll as it can affect the user experience.
+ */
+export declare const updateParentScrollOnResize: ({ previousRenderState, nextRenderState, iframe }: ResizeContext) => void;
+
+export { }

package/dist/index.js

@@ -1,18 +1,18 @@
-const h = () => window && window.self !== window.top, l = (e) => e instanceof HTMLIFrameElement, L = (e, t) => {
-  e.document.readyState === "complete" ? t() : e.addEventListener("load", t);
-}, b = (e, t) => {
+const p = () => typeof window < "u", R = () => window.self !== window.top, b = (e) => e instanceof HTMLIFrameElement, M = (e) => {
+  window.document.readyState === "complete" ? e() : window.addEventListener("load", e);
+}, T = (e, t) => {
   t(), e.addEventListener("load", t);
-}, v = (e, t) => {
-  var i, o;
-  const n = ((i = e.contentWindow) == null ? void 0 : i.document.readyState) === "complete";
-  return e.src !== "about:blank" && ((o = e.contentWindow) == null ? void 0 : o.location.href) !== "about:blank" && n ? t() : e.addEventListener("load", t);
-}, w = () => ({ offsetSize: 0, checkOrigin: !0, enableLegacyLibSupport: !1 }), y = (e) => {
+}, 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;
   }
-}, p = (e) => {
+}, D = (e) => {
   try {
     const t = new URL(e.src).origin;
     if (t !== "about:blank")
@@ -20,152 +20,185 @@ const h = () => window && window.self !== window.top, l = (e) => e instanceof HT
   } catch {
   }
   return null;
-}, z = (e) => (Object.keys(e).forEach((t) => e[t] === void 0 && delete e[t]), e), g = (e) => {
-  const { height: t } = e.documentElement.getBoundingClientRect();
-  return Math.ceil(t);
-};
-function O(e) {
-  b(
-    e,
-    () => {
-      var t;
-      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", "*");
-    }
-  );
-}
-function I(e) {
+}, A = (e) => (Object.keys(e).forEach((t) => e[t] === void 0 && delete e[t]), e), L = (e) => {
+  const { height: t, width: n } = e.getBoundingClientRect();
+  return { height: Math.ceil(t), width: Math.ceil(n) };
+}, f = (e, t) => e ? t ? e.querySelector(t) : e.documentElement : null, I = (e, t) => {
+  e && (t.bodyPadding && (e.body.style.padding = t.bodyPadding), t.bodyMargin && (e.body.style.margin = t.bodyMargin));
+}, 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";
+function P(e) {
   if (typeof e.data == "string" && e.data.startsWith("[iFrameSizer]")) {
-    const [t, n] = e.data.split(":"), r = +n;
-    return r > 0 ? r : null;
+    const [t, n] = e.data.split(":"), i = +n;
+    return i > 0 ? i : null;
   }
   return null;
 }
-const m = B();
-let u = [];
-const W = (e, t) => {
-  const n = { ...w(), ...z(e ?? {}) }, r = R(t), i = S(n, r);
-  return r.map((o) => {
-    const s = { iframe: o, settings: n, interactionState: { isHovered: !1 } }, c = E(s, i);
-    return u.push(s), {
+const v = q();
+let l = [];
+const K = (e, t) => {
+  if (!p())
+    return [];
+  const n = { ...k(), ...A(e ?? {}) }, i = W(t), o = x(n, i);
+  return i.map((r) => {
+    const s = {
+      iframe: r,
+      settings: n,
+      interactionState: { isHovered: !1 },
+      initContext: { isInitialized: !1, retryAttempts: 0 }
+    }, a = F(s, o);
+    return l.push(s), {
       unsubscribe: () => {
-        c(), u = u.filter((d) => d.iframe !== o);
+        a(), l = l.filter((d) => d.iframe !== r);
       }
     };
   });
 };
-function R(e) {
-  return typeof e == "string" ? Array.from(document.querySelectorAll(e)).filter(l) : e ? l(e) ? [e] : [] : Array.from(document.getElementsByTagName("iframe"));
+function W(e) {
+  return typeof e == "string" ? Array.from(document.querySelectorAll(e)).filter(b) : e ? b(e) ? [e] : [] : Array.from(document.getElementsByTagName("iframe"));
 }
-function S(e, t) {
+function x(e, t) {
   if (Array.isArray(e.checkOrigin))
     return e.checkOrigin;
   if (!e.checkOrigin)
     return [];
   const n = [];
-  for (const r of t) {
-    const i = p(r);
-    i && n.push(i);
+  for (const i of t) {
+    const o = D(i);
+    o && n.push(o);
   }
   return n;
 }
-function E(e, t) {
-  const n = y(e.iframe) ? k(e) : C(e, t), r = H(e);
+function F(e, t) {
+  const n = B(e.iframe) ? U(e) : N(e, t), i = $(e);
   return () => {
-    n(), r();
+    n(), i();
   };
 }
-function C(e, t) {
-  const { iframe: n, settings: r } = e, i = (o) => {
-    var d;
-    const s = !r.checkOrigin || t.includes(o.origin);
-    if (!(!(n.contentWindow === o.source) || !s)) {
-      if (((d = o.data) == null ? void 0 : d.type) === "iframe-resized") {
-        const { height: a } = o.data;
-        a && f({ newHeight: a, registeredElement: e });
+function N(e, t) {
+  const {
+    iframe: n,
+    initContext: i,
+    settings: { checkOrigin: o, enableLegacyLibSupport: r, targetElementSelector: s, bodyPadding: a, bodyMargin: d }
+  } = e, h = (c) => {
+    var y;
+    const E = !o || t.includes(c.origin);
+    if (!(!(n.contentWindow === c.source) || !E)) {
+      if (((y = c.data) == null ? void 0 : y.type) === "iframe-resized") {
+        const { height: u } = c.data;
+        u && g({ newHeight: u, registeredElement: e });
         return;
       }
-      if (r.enableLegacyLibSupport) {
-        const a = I(o);
-        a !== null && f({ newHeight: a, registeredElement: e });
+      if (r) {
+        const u = P(c);
+        u !== null && g({ newHeight: u, registeredElement: e });
         return;
       }
     }
   };
-  return window.addEventListener("message", i), r.enableLegacyLibSupport && O(n), () => window.removeEventListener("message", i);
+  window.addEventListener("message", h);
+  const S = r ? H() : { type: "iframe-child-init", targetElementSelector: s, bodyPadding: a, bodyMargin: d }, w = () => {
+    T(n, () => {
+      var c;
+      return (c = n.contentWindow) == null ? void 0 : c.postMessage(S, "*");
+    }), i.retryAttempts++, i.retryTimeoutId = window.setTimeout(w, m(i.retryAttempts));
+  };
+  return w(), () => window.removeEventListener("message", h);
 }
-function k(e) {
-  const { iframe: t } = e, n = () => {
-    var i;
-    const r = (i = t.contentDocument) == null ? void 0 : i.body;
-    if (!r) {
-      console.error("Unable to observe the iframe content document body");
-      return;
-    }
-    m.observe(r);
+function U(e) {
+  const { iframe: t, settings: n } = e, { targetElementSelector: i } = n;
+  let o = 0;
+  const r = () => {
+    const s = f(t.contentDocument, i);
+    if (!t.contentDocument || !s)
+      return o++, setTimeout(r, m(o));
+    I(t.contentDocument, n), v().observe(s);
   };
-  return v(t, n), () => {
-    var r;
-    (r = t.contentDocument) != null && r.body && m.unobserve(t.contentDocument.body), t.removeEventListener("load", n);
+  return C(t, r), () => {
+    const s = f(t.contentDocument, i);
+    s && v().unobserve(s), t.removeEventListener("load", r);
   };
 }
-function H(e) {
-  const { iframe: t, interactionState: n } = e, r = () => {
-    n.isHovered = !0;
+function $({ iframe: e, interactionState: t }) {
+  const n = () => {
+    t.isHovered = !0;
   }, i = () => {
-    n.isHovered = !1;
+    t.isHovered = !1;
   };
-  return t.addEventListener("mouseenter", r), t.addEventListener("mouseleave", i), () => {
-    t.removeEventListener("mouseenter", r), t.removeEventListener("mouseleave", i);
+  return e.addEventListener("mouseenter", n), e.addEventListener("mouseleave", i), () => {
+    e.removeEventListener("mouseenter", n), e.removeEventListener("mouseleave", i);
   };
 }
-function B() {
-  const e = ({ target: t }) => {
-    const n = u.find((o) => {
-      var s;
-      return ((s = o.iframe.contentDocument) == null ? void 0 : s.body) === t;
-    });
-    if (!n)
-      return;
-    const { iframe: r } = n;
-    if (!r.contentDocument)
-      return;
-    const i = g(r.contentDocument);
-    i && f({ newHeight: i, registeredElement: n });
+function q() {
+  let e = null;
+  return () => {
+    if (!e) {
+      const t = ({ target: n }) => {
+        const i = l.find(({ iframe: d }) => d.contentDocument === n.ownerDocument);
+        if (!i)
+          return;
+        const { iframe: o, settings: r } = i, s = f(o.contentDocument, r.targetElementSelector);
+        if (!s)
+          return;
+        const { height: a } = L(s);
+        a && g({ newHeight: a, registeredElement: i });
+      };
+      e = new ResizeObserver((n) => n.forEach(t));
+    }
+    return e;
   };
-  return new ResizeObserver((t) => t.forEach(e));
 }
-function f({ registeredElement: e, newHeight: t }) {
-  const { iframe: n, settings: r, interactionState: i } = e, o = n.getBoundingClientRect(), s = t + r.offsetSize;
-  if (n.style.height = `${s}px`, !r.onIframeResize)
+function g({ 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(), a = t + i.offsetSize;
+  if (n.style.height = `${a}px`, !i.onIframeResize)
     return;
-  const c = {
+  const d = {
     iframe: n,
-    settings: { ...r },
-    interactionState: { ...i },
-    previousRenderState: { rect: o },
+    settings: { ...i },
+    interactionState: { ...o },
+    previousRenderState: { rect: s },
     nextRenderState: { rect: n.getBoundingClientRect() }
   };
-  r.onIframeResize(c);
+  i.onIframeResize(d);
 }
-h() && M();
-function M() {
-  L(window, () => {
-    const e = () => {
-      const n = {
-        type: "iframe-resized",
-        width: document.documentElement.scrollWidth,
-        height: g(document)
-      };
-      window.parent.postMessage(n, "*");
-    };
-    new ResizeObserver(e).observe(document.body);
+const V = G();
+let z = !1;
+_();
+function _() {
+  !p() || !R() || window.addEventListener("message", (e) => {
+    var t;
+    ((t = e.data) == null ? void 0 : t.type) === "iframe-child-init" && M(() => O(e));
   });
 }
-const D = ({ previousRenderState: e, nextRenderState: t, interactionState: n }) => {
-  n.isHovered && window.scrollBy(0, t.rect.bottom - e.rect.bottom);
+function O(e, t = 0) {
+  const { targetElementSelector: n, bodyPadding: i, bodyMargin: o } = e.data, r = f(document, n);
+  if (z || window.parent !== e.source)
+    return;
+  if (!r)
+    return setTimeout(() => O(e, t + 1), m(t));
+  I(document, { bodyMargin: o, bodyPadding: i });
+  const s = V();
+  s.disconnect(), s.observe(r), z = !0;
+}
+function G() {
+  let e = null;
+  return () => (e || (e = new ResizeObserver((t) => {
+    if (!t[0].target)
+      return;
+    const { height: n, width: i } = L(t[0].target), o = {
+      type: "iframe-resized",
+      width: i,
+      height: n
+    };
+    window.parent.postMessage(o, "*");
+  })), e);
+}
+const Q = ({ previousRenderState: e, nextRenderState: t, iframe: n }) => {
+  document.activeElement === n && window.scrollBy(0, t.rect.bottom - e.rect.bottom);
 };
 export {
-  W as initialize,
-  M as initializeChildListener,
-  D as updateParentScrollOnResize
+  K as initialize,
+  _ as initializeChildListener,
+  Q as updateParentScrollOnResize
 };

package/dist/index.umd.cjs

@@ -1 +1 @@
-(function(a,c){typeof exports=="object"&&typeof module<"u"?c(exports):typeof define=="function"&&define.amd?define(["exports"],c):(a=typeof globalThis<"u"?globalThis:a||self,c(a.iframeResizer={}))})(this,function(a){"use strict";const c=()=>window&&window.self!==window.top,g=e=>e instanceof HTMLIFrameElement,v=(e,t)=>{e.document.readyState==="complete"?t():e.addEventListener("load",t)},w=(e,t)=>{t(),e.addEventListener("load",t)},y=(e,t)=>{var r,o;const n=((r=e.contentWindow)==null?void 0:r.document.readyState)==="complete";return e.src!=="about:blank"&&((o=e.contentWindow)==null?void 0:o.location.href)!=="about:blank"&&n?t():e.addEventListener("load",t)},p=()=>({offsetSize:0,checkOrigin:!0,enableLegacyLibSupport:!1}),z=e=>{try{return new URL(e.src).origin===window.location.origin}catch{return!1}},O=e=>{try{const t=new URL(e.src).origin;if(t!=="about:blank")return t}catch{}return null},S=e=>(Object.keys(e).forEach(t=>e[t]===void 0&&delete e[t]),e),h=e=>{const{height:t}=e.documentElement.getBoundingClientRect();return Math.ceil(t)};function R(e){w(e,()=>{var t;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","*")})}function I(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 b=W();let u=[];const E=(e,t)=>{const n={...p(),...S(e??{})},i=C(t),r=k(n,i);return i.map(o=>{const s={iframe:o,settings:n,interactionState:{isHovered:!1}},f=H(s,r);return u.push(s),{unsubscribe:()=>{f(),u=u.filter(l=>l.iframe!==o)}}})};function C(e){return typeof e=="string"?Array.from(document.querySelectorAll(e)).filter(g):e?g(e)?[e]:[]:Array.from(document.getElementsByTagName("iframe"))}function k(e,t){if(Array.isArray(e.checkOrigin))return e.checkOrigin;if(!e.checkOrigin)return[];const n=[];for(const i of t){const r=O(i);r&&n.push(r)}return n}function H(e,t){const n=z(e.iframe)?B(e):M(e,t),i=T(e);return()=>{n(),i()}}function M(e,t){const{iframe:n,settings:i}=e,r=o=>{var l;const s=!i.checkOrigin||t.includes(o.origin);if(!(!(n.contentWindow===o.source)||!s)){if(((l=o.data)==null?void 0:l.type)==="iframe-resized"){const{height:d}=o.data;d&&m({newHeight:d,registeredElement:e});return}if(i.enableLegacyLibSupport){const d=I(o);d!==null&&m({newHeight:d,registeredElement:e});return}}};return window.addEventListener("message",r),i.enableLegacyLibSupport&&R(n),()=>window.removeEventListener("message",r)}function B(e){const{iframe:t}=e,n=()=>{var r;const i=(r=t.contentDocument)==null?void 0:r.body;if(!i){console.error("Unable to observe the iframe content document body");return}b.observe(i)};return y(t,n),()=>{var i;(i=t.contentDocument)!=null&&i.body&&b.unobserve(t.contentDocument.body),t.removeEventListener("load",n)}}function T(e){const{iframe:t,interactionState:n}=e,i=()=>{n.isHovered=!0},r=()=>{n.isHovered=!1};return t.addEventListener("mouseenter",i),t.addEventListener("mouseleave",r),()=>{t.removeEventListener("mouseenter",i),t.removeEventListener("mouseleave",r)}}function W(){const e=({target:t})=>{const n=u.find(o=>{var s;return((s=o.iframe.contentDocument)==null?void 0:s.body)===t});if(!n)return;const{iframe:i}=n;if(!i.contentDocument)return;const r=h(i.contentDocument);r&&m({newHeight:r,registeredElement:n})};return new ResizeObserver(t=>t.forEach(e))}function m({registeredElement:e,newHeight:t}){const{iframe:n,settings:i,interactionState:r}=e,o=n.getBoundingClientRect(),s=t+i.offsetSize;if(n.style.height=`${s}px`,!i.onIframeResize)return;const f={iframe:n,settings:{...i},interactionState:{...r},previousRenderState:{rect:o},nextRenderState:{rect:n.getBoundingClientRect()}};i.onIframeResize(f)}c()&&L();function L(){v(window,()=>{const e=()=>{const n={type:"iframe-resized",width:document.documentElement.scrollWidth,height:h(document)};window.parent.postMessage(n,"*")};new ResizeObserver(e).observe(document.body)})}const D=({previousRenderState:e,nextRenderState:t,interactionState:n})=>{n.isHovered&&window.scrollBy(0,t.rect.bottom-e.rect.bottom)};a.initialize=E,a.initializeChildListener=L,a.updateParentScrollOnResize=D,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})});
+(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

@@ -1,7 +1,7 @@
 {
 	"name": "@open-iframe-resizer/core",
 	"private": false,
-	"version": "1.2.0",
+	"version": "1.3.0",
 	"description": "Open-source modern iframe resizer",
 	"license": "MIT",
 	"repository": {
@@ -46,8 +46,5 @@
 		"test:e2e": "npx playwright install --with-deps && npx playwright test",
 		"test:unit": "vitest run",
 		"prepare": "copyfiles -V ../../README.md packages/core"
-	},
-	"devDependencies": {
-		"@microsoft/tsdoc": "^0.15.0"
 	}
 }

package/dist/child.d.ts

@@ -1,2 +0,0 @@
-declare function initializeChildListener(): void;
-export { initializeChildListener };

package/dist/common.d.ts

@@ -1,16 +0,0 @@
-import { Settings } from './type';
-export declare const isInIframe: () => boolean;
-export declare const isHtmlIframeElement: (element: Element) => element is HTMLIFrameElement;
-export declare const deferWhenWindowIsLoaded: (_window: Window, executable: () => void) => void;
-/**
- * Post the message twice, it assures the target to receive the message at least once
- */
-export declare const safePostMessageToCrossOriginIframe: (iframe: HTMLIFrameElement, executable: () => void) => void;
-export declare const deferWhenSameOriginIframeIsLoaded: (iframe: HTMLIFrameElement, executable: () => void) => void;
-export declare const getDefaultSettings: () => Settings;
-export declare const isIframeSameOrigin: (iframe: HTMLIFrameElement) => boolean;
-export declare const extractIframeOrigin: (iframe: HTMLIFrameElement) => string | null;
-export declare const removeUndefinedProperties: <T extends {
-    [key: string]: unknown;
-}>(object: T) => T;
-export declare const getBoundingRectHeight: (document: Document) => number;

package/dist/compat.d.ts

@@ -1,2 +0,0 @@
-export declare function sendLegacyLibInitMessageOnIframeLoad(iframe: HTMLIFrameElement): void;
-export declare function handleLegacyLibResizeMessage(event: MessageEvent): number | null;

package/dist/parent.d.ts

@@ -1,3 +0,0 @@
-import { InitializeFunction } from './type';
-declare const initialize: InitializeFunction;
-export { initialize };

package/dist/resize-handlers.d.ts

@@ -1,8 +0,0 @@
-import { ResizeContext } from './type';
-/**
- * Resize handler that scrolls to restore the iframe's position in the viewport as it was before the resize.
- *
- * *Note:* This behavior only triggers if the iframe is currently being hovered by the user,
- * in order to try to limit the number of scroll as it can affect the user experience.
- */
-export declare const updateParentScrollOnResize: ({ previousRenderState, nextRenderState, interactionState }: ResizeContext) => void;

package/dist/type.d.ts

@@ -1,68 +0,0 @@
-interface Window {
-  iframeResizer: {
-    initialize: InitializeFunction;
-  };
-}
-
-/**
- * Automatically resizes the selected iframes.
- * @param settings The settings for the selected iframes. The default settings properties are picked if empty.
- * @param selector The selector for the iframe(s) or the HTMLIFrameElement to be resized. If empty, all document iframe elements will be selected.
- * @returns A result array, which can be used to clean up the listeners if you often remove iframes from the document.
- */
-export type InitializeFunction = (settings?: Partial<Settings>, selector?: string | HTMLIFrameElement) => InitializeResult[];
-export type InitializeResult = { unsubscribe: () => void };
-
-export type Settings = {
-  /**
-   * Offset added to the resize size (in pixels).
-   *
-   * Default: `0`
-   */
-  offsetSize: number;
-  /**
-   * Specifies whether to check the origin of incoming messages.
-   * Accepts an array of allowed origins or a boolean.
-   * If `true`, incoming messages are allowed from the origins of the registered iframes.
-   *
-   * Default: `true`
-   */
-  checkOrigin: string[] | boolean;
-  /**
-   * Allows the library to communicate with a cross-origin child iframe
-   * containing the original "iframe-resizer" script.
-   * Useful if you do not control the child domain.
-   *
-   * Default: `false`
-   */
-  enableLegacyLibSupport: boolean;
-  /**
-   * Listener that is called after the iframe has been resized.
-   * You can use a predefined handler like `updateParentScrollOnResize` or create your own custom handler.
-   *
-   * Default: `undefined`
-   */
-  onIframeResize?: (context: ResizeContext) => void;
-};
-
-export type IframeResizeEventData = {
-  type: "iframe-resized";
-  width: number;
-  height?: number;
-};
-
-export type IframeResizeEvent = MessageEvent<IframeResizeEventData>;
-
-export type InteractionState = {
-  isHovered: boolean;
-};
-
-export type ResizeRenderState = { rect: DOMRect };
-
-export type ResizeContext = {
-  iframe: HTMLIFrameElement;
-  settings: Settings;
-  interactionState: InteractionState;
-  previousRenderState: ResizeRenderState;
-  nextRenderState: ResizeRenderState;
-};