tiny-essentials 1.25.1 → 1.25.3

package/dist/v1/TinyIframeEvents.min.js

@@ -1 +1 @@
-(()=>{"use strict";var e={d:(t,n)=>{for(var s in n)e.o(n,s)&&!e.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:n[s]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};e.d(t,{TinyIframeEvents:()=>r});const n=class{#e=new Map;#t=10;#n=!1;#s(e,t){if("string"==typeof e)return[e];if(Array.isArray(e)&&e.every(e=>"string"==typeof e))return e;throw new TypeError(`${t}(event): event must be a string or string[]`)}setThrowOnMaxListeners(e){if("boolean"!=typeof e)throw new TypeError("setThrowOnMaxListeners(value): value must be a boolean");this.#n=e}getThrowOnMaxListeners(){return this.#n}#r(e,t,{once:n=!1}={}){let s=this.#e.get(e);Array.isArray(s)||(s=[],this.#e.set(e,s)),s.unshift({handler:t,config:{once:n}});const r=this.#t;if(r>0&&s.length>r){const t=`Possible memory leak detected. ${s.length} "${e}" listeners added. Use setMaxListeners() to increase limit.`;if(this.#n)throw new Error(t);console.warn(t)}}prependListener(e,t){const n=this.#s(e,"prependListener");if("function"!=typeof t)throw new TypeError("prependListener(event, handler): handler must be a function");for(const e of n)this.#r(e,t)}prependListenerOnce(e,t){const n=this.#s(e,"prependListenerOnce");if("function"!=typeof t)throw new TypeError("prependListenerOnce(event, handler): handler must be a function");const s=[];for(const e of n){const n=(...s)=>{this.off(e,n),t(...s)};this.#r(e,n,{once:!0}),s.push(n)}return s}#i(e,t,{once:n=!1}={}){const s=this.#s(e,"on");for(const e of s){let s=this.#e.get(e);Array.isArray(s)||(s=[],this.#e.set(e,s)),s.push({handler:t,config:{once:n}});const r=this.#t;if(r>0&&s.length>r){const t=`Possible memory leak detected. ${s.length} "${e}" listeners added. Use setMaxListeners() to increase limit.`;if(this.#n)throw new Error(t);console.warn(t)}}}on(e,t){if("function"!=typeof t)throw new TypeError("on(event, handler): handler must be a function");return this.#i(e,t)}once(e,t){const n=this.#s(e,"once");if("function"!=typeof t)throw new TypeError("once(event, handler): handler must be a function");const s=[];for(const e of n){const n=(...s)=>{this.off(e,n),t(...s)};this.#i(e,n,{once:!0}),s.push(n)}return s}appendListener(e,t){return this.on(e,t)}appendListenerOnce(e,t){return this.once(e,t)}off(e,t){const n=this.#s(e,"off");if("function"!=typeof t)throw new TypeError("off(event, handler): handler must be a function");for(const e of n){const n=this.#e.get(e);if(!Array.isArray(n))continue;const s=n.findIndex(e=>e.handler===t);-1!==s&&n.splice(s,1),0===n.length&&this.#e.delete(e)}}offAll(e){const t=this.#s(e,"offAll");for(const e of t)this.#e.delete(e)}offAllTypes(){this.#e.clear()}listenerCount(e){if("string"!=typeof e)throw new TypeError("listenerCount(event): event name must be a string");const t=this.#e.get(e);return Array.isArray(t)?t.length:0}listeners(e){if("string"!=typeof e)throw new TypeError("listeners(event): event name must be a string");const t=this.#e.get(e);return Array.isArray(t)?[...t].filter(e=>!e.config.once).map(e=>e.handler):[]}onceListeners(e){if("string"!=typeof e)throw new TypeError("onceListeners(event): event name must be a string");const t=this.#e.get(e);return Array.isArray(t)?[...t].filter(e=>e.config.once).map(e=>e.handler):[]}allListeners(e){if("string"!=typeof e)throw new TypeError("allListeners(event): event name must be a string");const t=this.#e.get(e);return Array.isArray(t)?[...t].map(e=>e.handler):[]}eventNames(){return[...this.#e.keys()]}emit(e,...t){const n=this.#s(e,"emit"),s=[];for(const e of n){const n=this.#e.get(e);Array.isArray(n)&&0!==n.length?(n.forEach(e=>e.handler(...t)),s.push(!0)):s.push(!1)}return s}setMaxListeners(e){if(!Number.isInteger(e)||e<0)throw new TypeError("setMaxListeners(n): n must be a non-negative integer");this.#t=e}getMaxListeners(){return this.#t}},s=new WeakMap,r=class{#o=new n;setThrowOnMaxListeners(e){return this.#o.setThrowOnMaxListeners(e)}getThrowOnMaxListeners(){return this.#o.getThrowOnMaxListeners()}prependListener(e,t){return this.#o.prependListener(e,t)}prependListenerOnce(e,t){return this.#o.prependListenerOnce(e,t)}appendListener(e,t){return this.#o.appendListener(e,t)}appendListenerOnce(e,t){return this.#o.appendListenerOnce(e,t)}on(e,t){return this.#o.on(e,t)}once(e,t){return this.#o.once(e,t)}off(e,t){return this.#o.off(e,t)}offAll(e){return this.#o.offAll(e)}offAllTypes(){return this.#o.offAllTypes()}listenerCount(e){return this.#o.listenerCount(e)}listeners(e){return this.#o.listeners(e)}onceListeners(e){return this.#o.onceListeners(e)}allListeners(e){return this.#o.allListeners(e)}eventNames(){return this.#o.eventNames()}setMaxListeners(e){return this.#o.setMaxListeners(e)}getMaxListeners(){return this.#o.getMaxListeners()}#a;#h;#d;#f=!1;#c=!1;#l=[];#p="__tinyIframeEvent__";get secretEventName(){return this.#p}set secretEventName(e){if("string"!=typeof e)throw new TypeError("TinyIframeEvents: secretEventName must be a string.");this.#p=e}constructor({targetIframe:e,targetOrigin:t}={}){if(!(void 0===e||e instanceof HTMLIFrameElement&&e.contentWindow))throw new TypeError('[TinyIframeEvents] Invalid "targetIframe" provided: expected a HTML Iframe Element, received '+typeof e);if(void 0!==t&&"string"!=typeof t)throw new TypeError('[TinyIframeEvents] Invalid "targetOrigin" provided: expected a string, received '+typeof t);if(this.#a=e?.contentWindow??window.parent,this.#h=t??window.location.origin,this.#d=e?"parent":"iframe",s.has(this.#a))throw new Error("Duplicate window reference.");this._boundOnMessage=this.#u.bind(this),this._boundOnceMessage=this.#g.bind(this),"complete"===this.#a.document.readyState||"interactive"===this.#a.document.readyState?this.#g():(this.#a.addEventListener("load",this._boundOnceMessage,!1),this.#a.addEventListener("DOMContentLoaded",this._boundOnceMessage,!1)),window.addEventListener("message",this._boundOnMessage,!1),s.set(this.#a,this)}#g(){this.#c||(this.#c=!0,this.#y())}#u(e){const{data:t,source:n}=e;if(null===(s=t)||"object"!=typeof s||Array.isArray(s)||"[object Object]"!==Object.prototype.toString.call(s)||!t[this.#p])return;var s;const{eventName:r,payload:i,direction:o}=t;n===this.#a&&("iframe"===this.#d&&"iframe"!==o||"parent"===this.#d&&"parent"!==o||this.#o.emit(r,i,e))}emit(e,t){if("string"!=typeof e)throw new TypeError("Event name must be a string.");if(this.#f)throw new Error("Cannot emit: instance has been destroyed.");const n={[this.#p]:!0,eventName:e,payload:t,direction:"parent"===this.#d?"iframe":"parent"};this.#c?this.#a.postMessage(n,this.#h):this.#l.push(n)}#y(){for(;this.#l.length;){const e=this.#l.shift();e&&this.#a.postMessage(e,this.#h)}}isDestroyed(){return this.#f}destroy(){this.#f=!0,window.removeEventListener("message",this._boundOnMessage),this.#a.removeEventListener("load",this._boundOnceMessage,!1),this.#a.removeEventListener("DOMContentLoaded",this._boundOnceMessage,!1),this.#o.offAllTypes(),this.#l=[],s.delete(this.#a)}};window.TinyIframeEvents=t.TinyIframeEvents})();
+(()=>{"use strict";var e={d:(t,n)=>{for(var s in n)e.o(n,s)&&!e.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:n[s]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};function n(e){return null!==e&&"object"==typeof e&&!Array.isArray(e)&&"[object Object]"===Object.prototype.toString.call(e)}e.d(t,{TinyIframeEvents:()=>i});const s=class{#e=new Map;#t=10;#n=!1;#s(e,t){if("string"==typeof e)return[e];if(Array.isArray(e)&&e.every(e=>"string"==typeof e))return e;throw new TypeError(`${t}(event): event must be a string or string[]`)}setThrowOnMaxListeners(e){if("boolean"!=typeof e)throw new TypeError("setThrowOnMaxListeners(value): value must be a boolean");this.#n=e}getThrowOnMaxListeners(){return this.#n}#r(e,t,{once:n=!1}={}){let s=this.#e.get(e);Array.isArray(s)||(s=[],this.#e.set(e,s)),s.unshift({handler:t,config:{once:n}});const r=this.#t;if(r>0&&s.length>r){const t=`Possible memory leak detected. ${s.length} "${e}" listeners added. Use setMaxListeners() to increase limit.`;if(this.#n)throw new Error(t);console.warn(t)}}prependListener(e,t){const n=this.#s(e,"prependListener");if("function"!=typeof t)throw new TypeError("prependListener(event, handler): handler must be a function");for(const e of n)this.#r(e,t)}prependListenerOnce(e,t){const n=this.#s(e,"prependListenerOnce");if("function"!=typeof t)throw new TypeError("prependListenerOnce(event, handler): handler must be a function");const s=[];for(const e of n){const n=(...s)=>{this.off(e,n),t(...s)};this.#r(e,n,{once:!0}),s.push(n)}return s}#i(e,t,{once:n=!1}={}){const s=this.#s(e,"on");for(const e of s){let s=this.#e.get(e);Array.isArray(s)||(s=[],this.#e.set(e,s)),s.push({handler:t,config:{once:n}});const r=this.#t;if(r>0&&s.length>r){const t=`Possible memory leak detected. ${s.length} "${e}" listeners added. Use setMaxListeners() to increase limit.`;if(this.#n)throw new Error(t);console.warn(t)}}}on(e,t){if("function"!=typeof t)throw new TypeError("on(event, handler): handler must be a function");return this.#i(e,t)}once(e,t){const n=this.#s(e,"once");if("function"!=typeof t)throw new TypeError("once(event, handler): handler must be a function");const s=[];for(const e of n){const n=(...s)=>{this.off(e,n),t(...s)};this.#i(e,n,{once:!0}),s.push(n)}return s}appendListener(e,t){return this.on(e,t)}appendListenerOnce(e,t){return this.once(e,t)}off(e,t){const n=this.#s(e,"off");if("function"!=typeof t)throw new TypeError("off(event, handler): handler must be a function");for(const e of n){const n=this.#e.get(e);if(!Array.isArray(n))continue;const s=n.findIndex(e=>e.handler===t);-1!==s&&n.splice(s,1),0===n.length&&this.#e.delete(e)}}offAll(e){const t=this.#s(e,"offAll");for(const e of t)this.#e.delete(e)}offAllTypes(){this.#e.clear()}listenerCount(e){if("string"!=typeof e)throw new TypeError("listenerCount(event): event name must be a string");const t=this.#e.get(e);return Array.isArray(t)?t.length:0}listeners(e){if("string"!=typeof e)throw new TypeError("listeners(event): event name must be a string");const t=this.#e.get(e);return Array.isArray(t)?[...t].filter(e=>!e.config.once).map(e=>e.handler):[]}onceListeners(e){if("string"!=typeof e)throw new TypeError("onceListeners(event): event name must be a string");const t=this.#e.get(e);return Array.isArray(t)?[...t].filter(e=>e.config.once).map(e=>e.handler):[]}allListeners(e){if("string"!=typeof e)throw new TypeError("allListeners(event): event name must be a string");const t=this.#e.get(e);return Array.isArray(t)?[...t].map(e=>e.handler):[]}eventNames(){return[...this.#e.keys()]}emit(e,...t){const n=this.#s(e,"emit"),s=[];for(const e of n){const n=this.#e.get(e);Array.isArray(n)&&0!==n.length?(n.forEach(e=>e.handler(...t)),s.push(!0)):s.push(!1)}return s}setMaxListeners(e){if(!Number.isInteger(e)||e<0)throw new TypeError("setMaxListeners(n): n must be a non-negative integer");this.#t=e}getMaxListeners(){return this.#t}},r=new WeakMap,i=class{#o=new s;setThrowOnMaxListeners(e){return this.#o.setThrowOnMaxListeners(e)}getThrowOnMaxListeners(){return this.#o.getThrowOnMaxListeners()}prependListener(e,t){return this.#o.prependListener(e,t)}prependListenerOnce(e,t){return this.#o.prependListenerOnce(e,t)}appendListener(e,t){return this.#o.appendListener(e,t)}appendListenerOnce(e,t){return this.#o.appendListenerOnce(e,t)}on(e,t){return this.#o.on(e,t)}once(e,t){return this.#o.once(e,t)}off(e,t){return this.#o.off(e,t)}offAll(e){return this.#o.offAll(e)}offAllTypes(){return this.#o.offAllTypes()}listenerCount(e){return this.#o.listenerCount(e)}listeners(e){return this.#o.listeners(e)}onceListeners(e){return this.#o.onceListeners(e)}allListeners(e){return this.#o.allListeners(e)}eventNames(){return this.#o.eventNames()}setMaxListeners(e){return this.#o.setMaxListeners(e)}getMaxListeners(){return this.#o.getMaxListeners()}#a;get targetWindow(){return this.#a}#h;get targetIframeElement(){return this.#h}#d;get targetOrigin(){return this.#d}#f;get selfType(){return this.#f}#l=!1;#p=!1;get ready(){return this.#p}onReady(e){this.#p?e():this.#o.once(this.#m,e)}#c=null;#y=[];#u;#g;#m;#v=null;constructor({targetIframe:e,targetOrigin:t=window.location.origin,secretEventName:n="__tinyIframeEvent__",handshakeEventName:s="__tinyIframeHandshake__",readyEventName:i="__tinyIframeReady__"}={}){if(!(void 0===e||e instanceof HTMLIFrameElement&&e.contentWindow))throw new TypeError('[TinyIframeEvents] Invalid "targetIframe": expected HTMLIFrameElement, received '+typeof e);if("string"!=typeof t)throw new TypeError('[TinyIframeEvents] Invalid "targetOrigin": expected string, received '+typeof t);if(this.#h=e,this.#a=e?.contentWindow??window.parent,this.#d=t,this.#f=e?"parent":"iframe",this.#u=n,this.#g=s,this.#m=i,r.has(this.#a))throw new Error("Duplicate window reference.");this._boundWindowMessage=this.#w.bind(this),this._boundPortMessage=this.#E.bind(this),this.#L(),r.set(this.#a,this)}get secretEventName(){return this.#u}set secretEventName(e){if("string"!=typeof e)throw new TypeError("TinyIframeEvents: secretEventName must be a string.");this.#u=e}get handshakeEventName(){return this.#g}set handshakeEventName(e){if("string"!=typeof e)throw new TypeError("TinyIframeEvents: handshakeEventName must be a string.");this.#g=e}get readyEventName(){return this.#m}set readyEventName(e){if("string"!=typeof e)throw new TypeError("TinyIframeEvents: readyEventName must be a string.");this.#m=e}#L(){"parent"===this.#f?(this.#v=()=>{if(this.#l)return;this.#c&&this.#c.close();const e=new MessageChannel;this.#c=e.port1,this.#c.onmessage=this._boundPortMessage,this.#p=!1,this.#a.postMessage({type:this.#g},this.#d,[e.port2])},this.#h&&(this.#h.addEventListener("load",this.#v),this.#v())):window.addEventListener("message",this._boundWindowMessage,!1)}#w(e){const t=e.data,s=e.ports;n(t)&&t.type===this.#g&&0!==s.length&&(this.#c=s[0],this.#c.onmessage=this._boundPortMessage,window.removeEventListener("message",this._boundWindowMessage),this.#c.postMessage({type:`${this.#g}_ACK`}),this.#T())}#E(e){const t=e.data;if(n(t)&&t.type===`${this.#g}_ACK`)return void this.#T();if(!n(t)||!t[this.#u])return;const s=t.eventName,r=t.payload,i=t.direction;"string"!=typeof s||"iframe"===this.#f&&"iframe"!==i||"parent"===this.#f&&"parent"!==i||this.#o.emit(s,r,e)}#T(){this.#p||(this.#p=!0,this.#b(),this.#o.emit(this.#m))}#b(){for(;this.#y.length>0;){const e=this.#y.shift();e&&this.#c&&this.#c.postMessage(e)}}emit(e,t){if("string"!=typeof e)throw new TypeError("Event name must be a string.");if(this.#l)throw new Error("Cannot emit: instance has been destroyed.");const n={[this.#u]:!0,eventName:e,payload:t,direction:"parent"===this.#f?"iframe":"parent"};this.#p&&this.#c?this.#c.postMessage(n):this.#y.push(n)}isDestroyed(){return this.#l}destroy(){this.#l=!0,this.#p=!1,window.removeEventListener("message",this._boundWindowMessage),this.#h&&this.#v&&this.#h.removeEventListener("load",this.#v),this.#c&&(this.#c.close(),this.#c=null),this.#o.offAllTypes(),this.#y=[],r.delete(this.#a)}};window.TinyIframeEvents=t.TinyIframeEvents})();

package/dist/v1/basics/array.cjs

@@ -8,8 +8,9 @@
  * This implementation ensures a uniform distribution of permutations.
  * Original algorithm source: StackOverflow (link above).
  *
- * @param {any[]} items - The array to shuffle.
- * @returns {any[]} The same array instance, now shuffled in place.
+ * @template {any[]} T
+ * @param {T} items - The array to shuffle.
+ * @returns {T} The same array instance, now shuffled in place.
  */
 function shuffleArray(items) {
   let currentIndex = items.length,
@@ -31,9 +32,9 @@ function shuffleArray(items) {
 /**
  * Generates an array with repeated phases according to counts.
  *
- * @param {string[]} phases - Array of phase names, e.g., ['Full', 'Half1', 'Half2', 'New'].
+ * @param {any[]} phases - Array of phase names, e.g., ['Full', 'Half1', 'Half2', 'New'].
  * @param {number[]} counts - Array of integers specifying how many times to repeat each phase, e.g., [4,5,5,4].
- * @returns {string[]} - Flattened array containing phases repeated according to counts, concatenated in order.
+ * @returns {any[]} - Flattened array containing phases repeated according to counts, concatenated in order.
  */
 function multiplyArrayBlocks(phases, counts) {
   // phases: array de strings, cada fase (ex: ['Full', 'Half1', 'Half2', 'New'])

package/dist/v1/basics/array.d.mts

@@ -4,18 +4,19 @@
  * This implementation ensures a uniform distribution of permutations.
  * Original algorithm source: StackOverflow (link above).
  *
- * @param {any[]} items - The array to shuffle.
- * @returns {any[]} The same array instance, now shuffled in place.
+ * @template {any[]} T
+ * @param {T} items - The array to shuffle.
+ * @returns {T} The same array instance, now shuffled in place.
  */
-export function shuffleArray(items: any[]): any[];
+export function shuffleArray<T extends any[]>(items: T): T;
 /**
  * Generates an array with repeated phases according to counts.
  *
- * @param {string[]} phases - Array of phase names, e.g., ['Full', 'Half1', 'Half2', 'New'].
+ * @param {any[]} phases - Array of phase names, e.g., ['Full', 'Half1', 'Half2', 'New'].
  * @param {number[]} counts - Array of integers specifying how many times to repeat each phase, e.g., [4,5,5,4].
- * @returns {string[]} - Flattened array containing phases repeated according to counts, concatenated in order.
+ * @returns {any[]} - Flattened array containing phases repeated according to counts, concatenated in order.
  */
-export function multiplyArrayBlocks(phases: string[], counts: number[]): string[];
+export function multiplyArrayBlocks(phases: any[], counts: number[]): any[];
 /**
  * Diff two class lists.
  * @param {any[]} oldItems

package/dist/v1/basics/array.mjs

@@ -5,8 +5,9 @@
  * This implementation ensures a uniform distribution of permutations.
  * Original algorithm source: StackOverflow (link above).
  *
- * @param {any[]} items - The array to shuffle.
- * @returns {any[]} The same array instance, now shuffled in place.
+ * @template {any[]} T
+ * @param {T} items - The array to shuffle.
+ * @returns {T} The same array instance, now shuffled in place.
  */
 export function shuffleArray(items) {
     let currentIndex = items.length, randomIndex;
@@ -23,9 +24,9 @@ export function shuffleArray(items) {
 /**
  * Generates an array with repeated phases according to counts.
  *
- * @param {string[]} phases - Array of phase names, e.g., ['Full', 'Half1', 'Half2', 'New'].
+ * @param {any[]} phases - Array of phase names, e.g., ['Full', 'Half1', 'Half2', 'New'].
  * @param {number[]} counts - Array of integers specifying how many times to repeat each phase, e.g., [4,5,5,4].
- * @returns {string[]} - Flattened array containing phases repeated according to counts, concatenated in order.
+ * @returns {any[]} - Flattened array containing phases repeated according to counts, concatenated in order.
  */
 export function multiplyArrayBlocks(phases, counts) {
     // phases: array de strings, cada fase (ex: ['Full', 'Half1', 'Half2', 'New'])

package/dist/v1/libs/TinyIframeEvents.cjs

@@ -14,18 +14,37 @@ const instances = new WeakMap();
  */
 
 /**
- * A flexible event routing system for structured communication
- * between a parent window and its iframe using `postMessage`.
+ * @typedef {object} TinyIframeEventsConfig
+ * Configuration object for initializing TinyIframeEvents.
+ * @property {HTMLIFrameElement} [targetIframe] - The target iframe element to post messages to. Required if instantiated in the parent window.
+ * @property {string} [targetOrigin] - The target origin to restrict messages to. Defaults to `window.location.origin`.
+ * @property {string} [secretEventName] - Custom internal name used to validate standard routing messages.
+ * @property {string} [handshakeEventName] - Custom internal name used for the initial MessageChannel handshake.
+ * @property {string} [readyEventName] - Custom internal name used for the ready event trigger.
+ */
+
+/**
+ * @typedef {object} IframeEventBase
+ * Internal message structure for routed communication.
+ * @property {boolean} [secretIndicator] - Dynamic key based on secretEventName to validate the message.
+ * @property {string} eventName - The name of the custom event route.
+ * @property {any} payload - The data being sent (can be any type).
+ * @property {'iframe' | 'parent'} direction - Indicates the sender: 'iframe' or 'parent'.
+ */
+
+/**
+ * A highly secure and flexible event routing system for structured communication
+ * between a parent window and its iframe using `MessageChannel`.
  *
- * This class abstracts the complexity of cross-origin and window-type handling,
- * allowing both the iframe and parent to:
- * - Send events with arbitrary payloads
- * - Listen to specific event names
- * - Filter events by origin and source
- * - Work symmetrically from both sides with automatic direction handling
+ * This class abstracts the complexity of cross-origin communication by establishing
+ * a direct, un-interceptable port connection after a secure initial handshake.
  *
- * Use this class when building applications that require modular, event-driven
- * communication across embedded frames.
+ * Features:
+ * - Secure direct pipeline via `MessageChannel`.
+ * - Customizable internal event names to avoid collisions.
+ * - Symmetrical usage for both parent and iframe.
+ * - Queue management for messages sent before the connection is established.
+ * - Auto-reconnects and resets ports if the target iframe is reloaded.
  */
 class TinyIframeEvents {
   #events = new TinyEvents();
@@ -219,36 +238,120 @@ class TinyIframeEvents {
   /** @type {Window} */
   #targetWindow;
 
+  get targetWindow() {
+    return this.#targetWindow;
+  }
+
+  /** @type {HTMLIFrameElement | undefined} */
+  #targetIframeElement;
+
+  get targetIframeElement() {
+    return this.#targetIframeElement;
+  }
+
   /** @type {string} */
   #targetOrigin;
 
-  /** @type {string} */
+  get targetOrigin() {
+    return this.#targetOrigin;
+  }
+
+  /** @type {'iframe' | 'parent'} */
   #selfType;
 
+  get selfType() {
+    return this.#selfType;
+  }
+
   /** @type {boolean} */
   #isDestroyed = false;
 
   /** @type {boolean} */
   #ready = false;
 
+  get ready() {
+    return this.#ready;
+  }
+
   /**
-   * @typedef {object} IframeEventBase
-   * @property {string} eventName - The name of the custom event route.
-   * @property {any} payload - The data being sent (can be any type).
-   * @property {'iframe' | 'parent'} direction - Indicates the sender: 'iframe' or 'parent'.
+   * Executes the provided callback when the secure MessageChannel connection is fully established.
+   * If the connection is already ready, the callback is executed immediately.
+   *
+   * @param {function(): void} handler - The callback function to execute.
    */
+  onReady(handler) {
+    if (this.#ready) {
+      handler();
+    } else {
+      this.#events.once(this.#readyEventName, handler);
+    }
+  }
+
+  /** @type {MessagePort | null} */
+  #port = null;
+
+  /** @type {IframeEventBase[]} */
+  #pendingQueue = [];
+
+  /** @type {string} */
+  #secretEventName;
+
+  /** @type {string} */
+  #handshakeEventName;
+
+  /** @type {string} */
+  #readyEventName;
+
+  /** @type {(() => void) | null} */
+  #boundSendPort = null;
 
   /**
-   * Queue of messages emitted before connection is ready
-   * @type {IframeEventBase[]}
+   * Creates a new TinyIframeEvents instance to manage secure communication.
+   * Automatically establishes a MessageChannel connection between contexts.
+   *
+   * @param {TinyIframeEventsConfig} config - Configuration object.
    */
-  #pendingQueue = [];
+  constructor({
+    targetIframe,
+    targetOrigin = window.location.origin,
+    secretEventName = '__tinyIframeEvent__',
+    handshakeEventName = '__tinyIframeHandshake__',
+    readyEventName = '__tinyIframeReady__',
+  } = {}) {
+    if (
+      targetIframe !== undefined &&
+      (!(targetIframe instanceof HTMLIFrameElement) || !targetIframe.contentWindow)
+    ) {
+      throw new TypeError(
+        `[TinyIframeEvents] Invalid "targetIframe": expected HTMLIFrameElement, received ${typeof targetIframe}`,
+      );
+    }
+
+    if (typeof targetOrigin !== 'string') {
+      throw new TypeError(
+        `[TinyIframeEvents] Invalid "targetOrigin": expected string, received ${typeof targetOrigin}`,
+      );
+    }
+
+    this.#targetIframeElement = targetIframe;
+    this.#targetWindow = targetIframe?.contentWindow ?? window.parent;
+    this.#targetOrigin = targetOrigin;
+    this.#selfType = !targetIframe ? 'iframe' : 'parent';
+    this.#secretEventName = secretEventName;
+    this.#handshakeEventName = handshakeEventName;
+    this.#readyEventName = readyEventName;
+
+    if (instances.has(this.#targetWindow)) throw new Error('Duplicate window reference.');
+
+    this._boundWindowMessage = this.#onWindowMessage.bind(this);
+    this._boundPortMessage = this.#onPortMessage.bind(this);
 
-  /** @type {string} Internal message type for routed communication */
-  #secretEventName = '__tinyIframeEvent__';
+    this.#initializeConnection();
+    instances.set(this.#targetWindow, this);
+  }
 
   /**
-   * Gets the internal secret iframe event name.
+   * Gets the internal secret iframe event name used for validation.
    * @returns {string}
    */
   get secretEventName() {
@@ -267,89 +370,160 @@ class TinyIframeEvents {
   }
 
   /**
-   * Creates a new TinyIframeEvents instance to manage communication between iframe and parent.
-   * Automatically determines the current context (`iframe` or `parent`) based on the `targetWindow`.
-   *
-   * @param {Object} config - Configuration object.
-   * @param {HTMLIFrameElement} [config.targetIframe] - The target window to post messages to. Defaults to `window.parent` (assumes this is inside an iframe).
-   * @param {string} [config.targetOrigin] - The target origin to restrict messages to. Defaults to `window.location.origin`.
+   * Gets the internal handshake event name used for establishing the MessageChannel.
+   * @returns {string}
    */
-  constructor({ targetIframe, targetOrigin } = {}) {
-    if (
-      typeof targetIframe !== 'undefined' &&
-      (!(targetIframe instanceof HTMLIFrameElement) || !targetIframe.contentWindow)
-    )
-      throw new TypeError(
-        `[TinyIframeEvents] Invalid "targetIframe" provided: expected a HTML Iframe Element, received ${typeof targetIframe}`,
-      );
-    if (typeof targetOrigin !== 'undefined' && typeof targetOrigin !== 'string')
-      throw new TypeError(
-        `[TinyIframeEvents] Invalid "targetOrigin" provided: expected a string, received ${typeof targetOrigin}`,
-      );
-
-    this.#targetWindow = targetIframe?.contentWindow ?? window.parent;
-    this.#targetOrigin = targetOrigin ?? window.location.origin;
-    this.#selfType = !targetIframe ? 'iframe' : 'parent';
-    if (instances.has(this.#targetWindow)) throw new Error('Duplicate window reference.');
+  get handshakeEventName() {
+    return this.#handshakeEventName;
+  }
 
-    this._boundOnMessage = this.#onMessage.bind(this);
-    this._boundOnceMessage = this.#onceMessage.bind(this);
+  /**
+   * Sets the internal handshake event name.
+   * @param {string} name
+   * @throws {TypeError} If the value is not a string.
+   */
+  set handshakeEventName(name) {
+    if (typeof name !== 'string')
+      throw new TypeError('TinyIframeEvents: handshakeEventName must be a string.');
+    this.#handshakeEventName = name;
+  }
 
-    if (
-      this.#targetWindow.document.readyState === 'complete' ||
-      this.#targetWindow.document.readyState === 'interactive'
-    )
-      this.#onceMessage();
-    else {
-      this.#targetWindow.addEventListener('load', this._boundOnceMessage, false);
-      this.#targetWindow.addEventListener('DOMContentLoaded', this._boundOnceMessage, false);
-    }
+  /**
+   * Gets the internal ready event name used when the connection is fully established.
+   * @returns {string}
+   */
+  get readyEventName() {
+    return this.#readyEventName;
+  }
 
-    window.addEventListener('message', this._boundOnMessage, false);
-    instances.set(this.#targetWindow, this);
+  /**
+   * Sets the internal ready event name.
+   * @param {string} name
+   * @throws {TypeError} If the value is not a string.
+   */
+  set readyEventName(name) {
+    if (typeof name !== 'string')
+      throw new TypeError('TinyIframeEvents: readyEventName must be a string.');
+    this.#readyEventName = name;
   }
 
   /**
-   * Marks the communication as ready and flushes any queued messages.
+   * Initializes the correct connection strategy based on the current context (parent or iframe).
    */
-  #onceMessage() {
-    if (this.#ready) return;
-    this.#ready = true;
-    this.#flushQueue();
+  #initializeConnection() {
+    if (this.#selfType === 'parent') {
+      this.#boundSendPort = () => {
+        if (this.#isDestroyed) return;
+
+        // Closes any existing port to prevent memory leaks during iframe reloads
+        if (this.#port) {
+          this.#port.close();
+        }
+
+        // Creates a fresh channel for every attempt to prevent clone errors
+        const channel = new MessageChannel();
+        this.#port = channel.port1;
+        this.#port.onmessage = this._boundPortMessage;
+
+        // Resets ready state to require a new ACK
+        this.#ready = false;
+
+        this.#targetWindow.postMessage({ type: this.#handshakeEventName }, this.#targetOrigin, [
+          channel.port2,
+        ]);
+      };
+
+      if (this.#targetIframeElement) {
+        this.#targetIframeElement.addEventListener('load', this.#boundSendPort);
+        this.#boundSendPort();
+      }
+    } else {
+      window.addEventListener('message', this._boundWindowMessage, false);
+    }
   }
 
   /**
-   * Internal handler for the message event. Filters and dispatches incoming messages.
+   * Internal handler for the initial window message event (used by iframe to receive the port).
    *
    * @param {MessageEvent<any>} event - The message event received via `postMessage`.
    */
-  #onMessage(event) {
-    const { data, source } = event;
+  #onWindowMessage(event) {
+    const data = event.data;
+    const ports = event.ports;
 
-    // Reject non-object or unrelated messages
-    if (!objChecker.isJsonObject(data) || !data[this.#secretEventName]) return;
+    if (!objChecker.isJsonObject(data) || data.type !== this.#handshakeEventName || ports.length === 0) return;
+
+    this.#port = ports[0];
+    this.#port.onmessage = this._boundPortMessage;
+    window.removeEventListener('message', this._boundWindowMessage);
+
+    this.#port.postMessage({ type: `${this.#handshakeEventName}_ACK` });
+    this.#markReady();
+  }
+
+  /**
+   * Internal handler for messages received through the secure MessageChannel port.
+   *
+   * @param {MessageEvent<any>} event - The message event received via `MessagePort`.
+   */
+  #onPortMessage(event) {
+    /** @type {any} */
+    const data = event.data;
 
-    const { eventName, payload, direction } = data;
+    if (objChecker.isJsonObject(data) && data.type === `${this.#handshakeEventName}_ACK`) {
+      this.#markReady();
+      return;
+    }
 
-    // Reject if not from the expected window (for security)
-    if (source !== this.#targetWindow) return;
+    if (!objChecker.isJsonObject(data) || !data[this.#secretEventName]) return;
+
+    const eventName = data.eventName;
+    const payload = data.payload;
+    const direction = data.direction;
 
-    // Reject if direction is not meant for this side
     if (
+      typeof eventName !== 'string' ||
       (this.#selfType === 'iframe' && direction !== 'iframe') ||
       (this.#selfType === 'parent' && direction !== 'parent')
-    )
+    ) {
       return;
+    }
+
+    this.#events.emit(eventName, payload, event);
+  }
 
-    this.#events.emit(/** @type {string} */ (eventName), payload, event);
+  /**
+   * Marks the communication as ready, flushes any queued messages,
+   * and triggers the internal ready event for any waiting listeners.
+   */
+  #markReady() {
+    if (this.#ready) return;
+    this.#ready = true;
+    this.#flushQueue();
+    this.#events.emit(this.#readyEventName);
   }
 
   /**
-   * Sends an event to the target window.
+   * Sends all pending messages queued before the secure port was established.
+   */
+  #flushQueue() {
+    while (this.#pendingQueue.length > 0) {
+      /** @type {IframeEventBase | undefined} */
+      const data = this.#pendingQueue.shift();
+
+      if (data && this.#port) {
+        this.#port.postMessage(data);
+      }
+    }
+  }
+
+  /**
+   * Sends an event to the target window through the secure MessageChannel.
    *
    * @param {string} eventName - A unique name identifying the event.
    * @param {*} payload - The data to send with the event. Can be any serializable value.
-   * @throws {Error} If `eventName` is not a string.
+   * @throws {TypeError} If `eventName` is not a string.
+   * @throws {Error} If instance has been destroyed.
    */
   emit(eventName, payload) {
     if (typeof eventName !== 'string') throw new TypeError('Event name must be a string.');
@@ -363,44 +537,42 @@ class TinyIframeEvents {
       direction: this.#selfType === 'parent' ? 'iframe' : 'parent',
     };
 
-    if (!this.#ready) {
+    if (!this.#ready || !this.#port) {
       this.#pendingQueue.push(message);
       return;
     }
 
-    this.#targetWindow.postMessage(message, this.#targetOrigin);
-  }
-
-  /**
-   * Sends all pending messages queued before handshake completion.
-   *
-   * @returns {void}
-   */
-  #flushQueue() {
-    while (this.#pendingQueue.length) {
-      const data = this.#pendingQueue.shift();
-      if (data) this.#targetWindow.postMessage(data, this.#targetOrigin);
-    }
+    this.#port.postMessage(message);
   }
 
   /**
    * Checks if the communication instance has been destroyed.
    *
-   * @returns {boolean}
+   * @returns {boolean} True if destroyed, false otherwise.
    */
   isDestroyed() {
     return this.#isDestroyed;
   }
 
   /**
-   * Unsubscribes all registered event listeners and removes the message handler.
+   * Unsubscribes all registered event listeners, closes the message port, and cleans up references.
    * Call this when the instance is no longer needed to prevent memory leaks.
    */
   destroy() {
     this.#isDestroyed = true;
-    window.removeEventListener('message', this._boundOnMessage);
-    this.#targetWindow.removeEventListener('load', this._boundOnceMessage, false);
-    this.#targetWindow.removeEventListener('DOMContentLoaded', this._boundOnceMessage, false);
+    this.#ready = false;
+
+    window.removeEventListener('message', this._boundWindowMessage);
+
+    if (this.#targetIframeElement && this.#boundSendPort) {
+      this.#targetIframeElement.removeEventListener('load', this.#boundSendPort);
+    }
+
+    if (this.#port) {
+      this.#port.close();
+      this.#port = null;
+    }
+
     this.#events.offAllTypes();
     this.#pendingQueue = [];
     instances.delete(this.#targetWindow);