'use client';


import { useCommunicator } from "./CommunicatorContext.mjs";
import { compareUrls } from "./editor/dist/esm/compareUrls.mjs";
import { useEffect } from "react";

//#region ../react-intlayer/dist/esm/@intlayer/editor-react/dist/esm/useCrossFrameMessageListener.mjs
/**
* useCrossFrameMessageListener
*
* This React hook listens for messages sent via the `postMessage` API and triggers a callback
* whenever a message of the specified type (`key`) is received. It is useful for synchronizing
* state or events across different windows, iframes, or contexts.
*
* @template S - The type of the data payload in the message.
* @param key - A unique identifier for the message type to listen for.
* @param [onEventTriggered] - A callback function triggered when a message
* @param [revalidator] - A function that re-suscribes the listener. Could be usefull if onEventTriggered depend of some state
* with the specified key is received. The callback receives the message data as its argument.
*
* @returns {{ postMessage: (data: S) => void }} An object containing a `postMessage` function
* that allows broadcasting messages with the specified key and data.
*/
const useCrossFrameMessageListener = (key, onEventTriggered, revalidator) => {
	const { allowedOrigins, postMessage, senderId } = useCommunicator();
	useEffect(() => {
		if (onEventTriggered) {
			/**
			* Message handler to process incoming messages.
			*
			* - **Message Filtering:** Ensures only messages with the specified `key` are processed.
			* - **Origin Validation:** Checks that the origin of the message is within the allowed origins.
			*
			* @param {MessageEvent<{ type: string; data: S }>} event - The incoming message event object.
			*/
			const handleMessage = (event) => {
				const { type, data, senderId: msgSenderId } = event.data;
				if (type !== key) return;
				if (msgSenderId === senderId) return;
				if (typeof allowedOrigins === "undefined" || allowedOrigins?.filter((url) => ![
					null,
					void 0,
					"",
					"*"
				].includes(url)).some((url) => compareUrls(url, event.origin)) || allowedOrigins?.includes("*")) onEventTriggered(data);
			};
			window.addEventListener("message", handleMessage);
			return () => window.removeEventListener("message", handleMessage);
		}
	}, [
		allowedOrigins,
		postMessage,
		senderId,
		revalidator
	]);
	/**
	* A wrapper function around the `postMessage` function to broadcast messages efficiently.
	*
	* - **Encapsulation:** Ensures the `postMessage` function is scoped to the provided key.
	* - **Ease of Use:** Simplifies broadcasting messages with consistent type and format.
	*
	* @param {S} data - The data payload to include in the message.
	* @returns {void}
	*/
	const postMessageWrapper = (data) => {
		postMessage({
			type: key,
			data,
			senderId
		});
	};
	return postMessageWrapper;
};

//#endregion
export { useCrossFrameMessageListener };
//# sourceMappingURL=useCrossFrameMessageListener.mjs.map