angular-intlayer 6.1.6 → 7.0.0-canary.0

package/dist/esm/editor/index.mjs

@@ -1,10 +1,6 @@
 import { ContentSelectorWrapperComponent } from "./ContentSelectorWrapper.component.mjs";
 import { EditedContentRendererComponent } from "./EditedContentRenderer.component.mjs";
 import { EditorSelectorRendererComponent } from "./EditorSelectorRenderer.component.mjs";
-export * from "./installIntlayerEditor.mjs";
-export {
-  ContentSelectorWrapperComponent,
-  EditedContentRendererComponent,
-  EditorSelectorRendererComponent
-};
-//# sourceMappingURL=index.mjs.map
+import { installIntlayerEditor } from "./installIntlayerEditor.mjs";
+
+export { ContentSelectorWrapperComponent, EditedContentRendererComponent, EditorSelectorRendererComponent, installIntlayerEditor };

package/dist/esm/editor/installIntlayerEditor.mjs

@@ -1,36 +1,50 @@
-import configuration from "@intlayer/config/built";
 import { installCommunicator } from "./communicator.mjs";
-import { installDictionariesRecord } from "./dictionariesRecord.mjs";
-import { installEditedContent } from "./editedContent.mjs";
 import { installEditorEnabled } from "./editorEnabled.mjs";
 import { installFocusDictionary } from "./focusDictionary.mjs";
+import { installDictionariesRecord } from "./dictionariesRecord.mjs";
+import { installEditedContent } from "./editedContent.mjs";
+import configuration from "@intlayer/config/built";
+
+//#region src/editor/installIntlayerEditor.ts
 const { editor } = configuration;
 const { applicationURL, editorURL, cmsURL } = editor ?? {};
 const postMessage = (data) => {
-  if (typeof window === "undefined") return;
-  const isInIframe = window.self !== window.top;
-  if (!isInIframe) return;
-  if (editor.applicationURL.length > 0) {
-    window.postMessage(data, editor.applicationURL);
-  }
-  if (editor.editorURL.length > 0) {
-    window.parent.postMessage(data, editor.editorURL);
-  }
-  if (editor.cmsURL.length > 0) {
-    window.parent.postMessage(data, editor.cmsURL);
-  }
+	if (typeof window === "undefined") return;
+	if (!(window.self !== window.top)) return;
+	if (editor.applicationURL.length > 0) window.postMessage(data, editor.applicationURL);
+	if (editor.editorURL.length > 0) window.parent.postMessage(data, editor.editorURL);
+	if (editor.cmsURL.length > 0) window.parent.postMessage(data, editor.cmsURL);
 };
+/**
+* Angular-side replacement for the former <IntlayerEditorProvider> React component.
+*
+* Call **once** in your Angular application's bootstrap function or main module:
+*
+* ```typescript
+* import { bootstrapApplication } from '@angular/platform-browser';
+* import { AppComponent } from './app/app.component';
+* import { installIntlayerEditor } from 'angular-intlayer';
+*
+* bootstrapApplication(AppComponent).then(appRef => {
+*   installIntlayerEditor(appRef.injector);
+* });
+* ```
+*/
 const installIntlayerEditor = (injector) => {
-  installCommunicator(injector, {
-    postMessage,
-    allowedOrigins: [applicationURL, editorURL, cmsURL]
-  });
-  installEditorEnabled(injector);
-  installDictionariesRecord(injector);
-  installEditedContent(injector);
-  installFocusDictionary(injector);
-};
-export {
-  installIntlayerEditor
+	installCommunicator(injector, {
+		postMessage,
+		allowedOrigins: [
+			applicationURL,
+			editorURL,
+			cmsURL
+		]
+	});
+	installEditorEnabled(injector);
+	installDictionariesRecord(injector);
+	installEditedContent(injector);
+	installFocusDictionary(injector);
 };
+
+//#endregion
+export { installIntlayerEditor };
 //# sourceMappingURL=installIntlayerEditor.mjs.map

package/dist/esm/editor/installIntlayerEditor.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/installIntlayerEditor.ts"],"sourcesContent":["import { Injector } from '@angular/core';\nimport configuration from '@intlayer/config/built';\nimport { installCommunicator } from './communicator';\nimport { installDictionariesRecord } from './dictionariesRecord';\nimport { installEditedContent } from './editedContent';\nimport { installEditorEnabled } from './editorEnabled';\nimport { installFocusDictionary } from './focusDictionary';\n\nconst { editor } = configuration;\nconst { applicationURL, editorURL, cmsURL } = editor ?? {};\n\nconst postMessage = (data: any) => {\n  if (typeof window === 'undefined') return;\n\n  const isInIframe = window.self !== window.top;\n\n  if (!isInIframe) return;\n\n  if (editor.applicationURL.length > 0) {\n    window.postMessage(data, editor.applicationURL);\n  }\n\n  if (editor.editorURL.length > 0) {\n    window.parent.postMessage(data, editor.editorURL);\n  }\n\n  if (editor.cmsURL.length > 0) {\n    window.parent.postMessage(data, editor.cmsURL);\n  }\n};\n\n/**\n * Angular-side replacement for the former <IntlayerEditorProvider> React component.\n *\n * Call **once** in your Angular application's bootstrap function or main module:\n *\n * ```typescript\n * import { bootstrapApplication } from '@angular/platform-browser';\n * import { AppComponent } from './app/app.component';\n * import { installIntlayerEditor } from 'angular-intlayer';\n *\n * bootstrapApplication(AppComponent).then(appRef => {\n *   installIntlayerEditor(appRef.injector);\n * });\n * ```\n */\nexport const installIntlayerEditor = (injector: Injector): void => {\n  /* ---------------------------------------------------------------------\n   * 1. Base providers – always on\n   * -------------------------------------------------------------------*/\n\n  installCommunicator(injector, {\n    postMessage,\n    allowedOrigins: [applicationURL, editorURL, cmsURL] as string[],\n  });\n  installEditorEnabled(injector);\n  installDictionariesRecord(injector);\n  installEditedContent(injector);\n  installFocusDictionary(injector);\n};\n"],"mappings":"AACA,OAAO,mBAAmB;AAC1B,SAAS,2BAA2B;AACpC,SAAS,iCAAiC;AAC1C,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AACrC,SAAS,8BAA8B;AAEvC,MAAM,EAAE,OAAO,IAAI;AACnB,MAAM,EAAE,gBAAgB,WAAW,OAAO,IAAI,UAAU,CAAC;AAEzD,MAAM,cAAc,CAAC,SAAc;AACjC,MAAI,OAAO,WAAW,YAAa;AAEnC,QAAM,aAAa,OAAO,SAAS,OAAO;AAE1C,MAAI,CAAC,WAAY;AAEjB,MAAI,OAAO,eAAe,SAAS,GAAG;AACpC,WAAO,YAAY,MAAM,OAAO,cAAc;AAAA,EAChD;AAEA,MAAI,OAAO,UAAU,SAAS,GAAG;AAC/B,WAAO,OAAO,YAAY,MAAM,OAAO,SAAS;AAAA,EAClD;AAEA,MAAI,OAAO,OAAO,SAAS,GAAG;AAC5B,WAAO,OAAO,YAAY,MAAM,OAAO,MAAM;AAAA,EAC/C;AACF;AAiBO,MAAM,wBAAwB,CAAC,aAA6B;AAKjE,sBAAoB,UAAU;AAAA,IAC5B;AAAA,IACA,gBAAgB,CAAC,gBAAgB,WAAW,MAAM;AAAA,EACpD,CAAC;AACD,uBAAqB,QAAQ;AAC7B,4BAA0B,QAAQ;AAClC,uBAAqB,QAAQ;AAC7B,yBAAuB,QAAQ;AACjC;","names":[]}
+{"version":3,"file":"installIntlayerEditor.mjs","names":[],"sources":["../../../src/editor/installIntlayerEditor.ts"],"sourcesContent":["import type { Injector } from '@angular/core';\nimport configuration from '@intlayer/config/built';\nimport { installCommunicator } from './communicator';\nimport { installDictionariesRecord } from './dictionariesRecord';\nimport { installEditedContent } from './editedContent';\nimport { installEditorEnabled } from './editorEnabled';\nimport { installFocusDictionary } from './focusDictionary';\n\nconst { editor } = configuration;\nconst { applicationURL, editorURL, cmsURL } = editor ?? {};\n\nconst postMessage = (data: any) => {\n  if (typeof window === 'undefined') return;\n\n  const isInIframe = window.self !== window.top;\n\n  if (!isInIframe) return;\n\n  if (editor.applicationURL.length > 0) {\n    window.postMessage(data, editor.applicationURL);\n  }\n\n  if (editor.editorURL.length > 0) {\n    window.parent.postMessage(data, editor.editorURL);\n  }\n\n  if (editor.cmsURL.length > 0) {\n    window.parent.postMessage(data, editor.cmsURL);\n  }\n};\n\n/**\n * Angular-side replacement for the former <IntlayerEditorProvider> React component.\n *\n * Call **once** in your Angular application's bootstrap function or main module:\n *\n * ```typescript\n * import { bootstrapApplication } from '@angular/platform-browser';\n * import { AppComponent } from './app/app.component';\n * import { installIntlayerEditor } from 'angular-intlayer';\n *\n * bootstrapApplication(AppComponent).then(appRef => {\n *   installIntlayerEditor(appRef.injector);\n * });\n * ```\n */\nexport const installIntlayerEditor = (injector: Injector): void => {\n  /* ---------------------------------------------------------------------\n   * 1. Base providers – always on\n   * -------------------------------------------------------------------*/\n\n  installCommunicator(injector, {\n    postMessage,\n    allowedOrigins: [applicationURL, editorURL, cmsURL] as string[],\n  });\n  installEditorEnabled(injector);\n  installDictionariesRecord(injector);\n  installEditedContent(injector);\n  installFocusDictionary(injector);\n};\n"],"mappings":";;;;;;;;AAQA,MAAM,EAAE,WAAW;AACnB,MAAM,EAAE,gBAAgB,WAAW,WAAW,UAAU,EAAE;AAE1D,MAAM,eAAe,SAAc;AACjC,KAAI,OAAO,WAAW,YAAa;AAInC,KAAI,EAFe,OAAO,SAAS,OAAO,KAEzB;AAEjB,KAAI,OAAO,eAAe,SAAS,EACjC,QAAO,YAAY,MAAM,OAAO,eAAe;AAGjD,KAAI,OAAO,UAAU,SAAS,EAC5B,QAAO,OAAO,YAAY,MAAM,OAAO,UAAU;AAGnD,KAAI,OAAO,OAAO,SAAS,EACzB,QAAO,OAAO,YAAY,MAAM,OAAO,OAAO;;;;;;;;;;;;;;;;;AAmBlD,MAAa,yBAAyB,aAA6B;AAKjE,qBAAoB,UAAU;EAC5B;EACA,gBAAgB;GAAC;GAAgB;GAAW;GAAO;EACpD,CAAC;AACF,sBAAqB,SAAS;AAC9B,2BAA0B,SAAS;AACnC,sBAAqB,SAAS;AAC9B,wBAAuB,SAAS"}

package/dist/esm/editor/useCrossFrameMessageListener.mjs

@@ -1,59 +1,71 @@
-"use client";
+'use client';
+
+
+import { useCommunicator } from "./communicator.mjs";
 import { DestroyRef, inject } from "@angular/core";
 import { compareUrls } from "@intlayer/editor";
-import { useCommunicator } from "./communicator.mjs";
+
+//#region src/editor/useCrossFrameMessageListener.ts
+/** Map<key, Set<callback>> */
 const subscribers = /* @__PURE__ */ new Map();
+/** True once we've attached the single window listener */
 let windowListenerAttached = false;
+/** Helper to add/remove a callback for a key */
 function addSubscriber(key, cb) {
-  let set = subscribers.get(key);
-  if (!set) {
-    set = /* @__PURE__ */ new Set();
-    subscribers.set(key, set);
-  }
-  set.add(cb);
+	let set = subscribers.get(key);
+	if (!set) {
+		set = /* @__PURE__ */ new Set();
+		subscribers.set(key, set);
+	}
+	set.add(cb);
 }
 function removeSubscriber(key, cb) {
-  const set = subscribers.get(key);
-  if (!set) return;
-  set.delete(cb);
-  if (set.size === 0) subscribers.delete(key);
+	const set = subscribers.get(key);
+	if (!set) return;
+	set.delete(cb);
+	if (set.size === 0) subscribers.delete(key);
 }
+/** The one global window listener */
 function ensureGlobalListener(allowedOrigins, selfId) {
-  if (windowListenerAttached) return;
-  window.addEventListener("message", (event) => {
-    const { type, data, senderId } = event.data ?? {};
-    if (!type) return;
-    if (senderId === selfId) return;
-    if (!allowedOrigins || allowedOrigins.includes("*") || allowedOrigins.some((o) => compareUrls(o, event.origin))) {
-      subscribers.get(type)?.forEach((cb) => cb(data));
-    }
-  });
-  windowListenerAttached = true;
+	if (windowListenerAttached) return;
+	window.addEventListener("message", (event) => {
+		const { type, data, senderId } = event.data ?? {};
+		if (!type) return;
+		if (senderId === selfId) return;
+		if (!allowedOrigins || allowedOrigins.includes("*") || allowedOrigins.some((o) => compareUrls(o, event.origin))) subscribers.get(type)?.forEach((cb) => cb(data));
+	});
+	windowListenerAttached = true;
 }
+/**
+* useCrossFrameMessageListener
+*
+* @template S - type of the message payload
+* @param key               message type we care about
+* @param onEventTriggered  optional callback when a matching message arrives
+* @returns postMessage(data?) helper scoped to this key
+*/
 const useCrossFrameMessageListener = (key, onEventTriggered) => {
-  const { allowedOrigins, postMessage, senderId } = useCommunicator();
-  ensureGlobalListener(allowedOrigins, senderId);
-  if (onEventTriggered) {
-    addSubscriber(key, onEventTriggered);
-    try {
-      const destroyRef = inject(DestroyRef, { optional: true });
-      if (destroyRef) {
-        destroyRef.onDestroy(
-          () => removeSubscriber(key, onEventTriggered)
-        );
-      }
-    } catch {
-      console.warn(
-        "useCrossFrameMessageListener called outside injection context; cleanup may not be available."
-      );
-    }
-  }
-  const postMessageWrapper = (data) => {
-    postMessage({ type: key, data, senderId });
-  };
-  return postMessageWrapper;
-};
-export {
-  useCrossFrameMessageListener
+	const { allowedOrigins, postMessage, senderId } = useCommunicator();
+	ensureGlobalListener(allowedOrigins, senderId);
+	if (onEventTriggered) {
+		addSubscriber(key, onEventTriggered);
+		try {
+			const destroyRef = inject(DestroyRef, { optional: true });
+			if (destroyRef) destroyRef.onDestroy(() => removeSubscriber(key, onEventTriggered));
+		} catch {
+			console.warn("useCrossFrameMessageListener called outside injection context; cleanup may not be available.");
+		}
+	}
+	const postMessageWrapper = (data) => {
+		postMessage({
+			type: key,
+			data,
+			senderId
+		});
+	};
+	return postMessageWrapper;
 };
+
+//#endregion
+export { useCrossFrameMessageListener };
 //# sourceMappingURL=useCrossFrameMessageListener.mjs.map

package/dist/esm/editor/useCrossFrameMessageListener.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/useCrossFrameMessageListener.ts"],"sourcesContent":["'use client';\n\nimport { DestroyRef, inject } from '@angular/core';\nimport { type MessageKey, compareUrls } from '@intlayer/editor';\nimport { useCommunicator } from './communicator';\n\n// ---------- module-level singletons ----------\ntype AnyFn = (data: unknown) => void;\n\n/** Map<key, Set<callback>> */\nconst subscribers = new Map<string, Set<AnyFn>>();\n\n/** True once we've attached the single window listener */\nlet windowListenerAttached = false;\n\n/** Helper to add/remove a callback for a key */\nfunction addSubscriber(key: string, cb: AnyFn) {\n  let set = subscribers.get(key);\n  if (!set) {\n    set = new Set();\n    subscribers.set(key, set);\n  }\n  set.add(cb);\n}\n\nfunction removeSubscriber(key: string, cb: AnyFn) {\n  const set = subscribers.get(key);\n  if (!set) return;\n  set.delete(cb);\n  if (set.size === 0) subscribers.delete(key);\n}\n\n/** The one global window listener */\nfunction ensureGlobalListener(\n  allowedOrigins: string[] | undefined,\n  selfId: string\n) {\n  if (windowListenerAttached) return;\n  window.addEventListener('message', (event) => {\n    const { type, data, senderId } = event.data ?? {};\n    if (!type) return; // guard malformed messages\n    if (senderId === selfId) return; // ignore my own\n\n    // origin check\n    if (\n      !allowedOrigins ||\n      allowedOrigins.includes('*') ||\n      allowedOrigins.some((o) => compareUrls(o, event.origin))\n    ) {\n      // broadcast to everyone interested in this key\n      subscribers.get(type)?.forEach((cb) => cb(data));\n    }\n  });\n  windowListenerAttached = true;\n}\n// ---------- end module-level code ----------\n\n/**\n * useCrossFrameMessageListener\n *\n * @template S - type of the message payload\n * @param key               message type we care about\n * @param onEventTriggered  optional callback when a matching message arrives\n * @returns postMessage(data?) helper scoped to this key\n */\nexport const useCrossFrameMessageListener = <S>(\n  key: `${MessageKey}` | `${MessageKey}/post` | `${MessageKey}/get`,\n  onEventTriggered?: (data: S) => void\n) => {\n  // Communicator is the same for everyone, so it's fine to call every time.\n  const { allowedOrigins, postMessage, senderId } = useCommunicator();\n\n  // --- 1. make sure the global listener exists ----\n  ensureGlobalListener(allowedOrigins, senderId);\n\n  // --- 2. register this caller's callback (if any) ---\n  if (onEventTriggered) {\n    addSubscriber(key, onEventTriggered as AnyFn);\n\n    // Use Angular's DestroyRef for cleanup instead of Vue's onScopeDispose\n    try {\n      const destroyRef = inject(DestroyRef, { optional: true });\n      if (destroyRef) {\n        destroyRef.onDestroy(() =>\n          removeSubscriber(key, onEventTriggered as AnyFn)\n        );\n      }\n    } catch {\n      // If called outside injection context, no cleanup available\n      console.warn(\n        'useCrossFrameMessageListener called outside injection context; ' +\n          'cleanup may not be available.'\n      );\n    }\n  }\n\n  // --- 3. return a wrapper that tags outgoing messages with our key ---\n  const postMessageWrapper = (data?: S) => {\n    postMessage({ type: key, data, senderId });\n  };\n\n  return postMessageWrapper;\n};\n"],"mappings":";AAEA,SAAS,YAAY,cAAc;AACnC,SAA0B,mBAAmB;AAC7C,SAAS,uBAAuB;AAMhC,MAAM,cAAc,oBAAI,IAAwB;AAGhD,IAAI,yBAAyB;AAG7B,SAAS,cAAc,KAAa,IAAW;AAC7C,MAAI,MAAM,YAAY,IAAI,GAAG;AAC7B,MAAI,CAAC,KAAK;AACR,UAAM,oBAAI,IAAI;AACd,gBAAY,IAAI,KAAK,GAAG;AAAA,EAC1B;AACA,MAAI,IAAI,EAAE;AACZ;AAEA,SAAS,iBAAiB,KAAa,IAAW;AAChD,QAAM,MAAM,YAAY,IAAI,GAAG;AAC/B,MAAI,CAAC,IAAK;AACV,MAAI,OAAO,EAAE;AACb,MAAI,IAAI,SAAS,EAAG,aAAY,OAAO,GAAG;AAC5C;AAGA,SAAS,qBACP,gBACA,QACA;AACA,MAAI,uBAAwB;AAC5B,SAAO,iBAAiB,WAAW,CAAC,UAAU;AAC5C,UAAM,EAAE,MAAM,MAAM,SAAS,IAAI,MAAM,QAAQ,CAAC;AAChD,QAAI,CAAC,KAAM;AACX,QAAI,aAAa,OAAQ;AAGzB,QACE,CAAC,kBACD,eAAe,SAAS,GAAG,KAC3B,eAAe,KAAK,CAAC,MAAM,YAAY,GAAG,MAAM,MAAM,CAAC,GACvD;AAEA,kBAAY,IAAI,IAAI,GAAG,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;AAAA,IACjD;AAAA,EACF,CAAC;AACD,2BAAyB;AAC3B;AAWO,MAAM,+BAA+B,CAC1C,KACA,qBACG;AAEH,QAAM,EAAE,gBAAgB,aAAa,SAAS,IAAI,gBAAgB;AAGlE,uBAAqB,gBAAgB,QAAQ;AAG7C,MAAI,kBAAkB;AACpB,kBAAc,KAAK,gBAAyB;AAG5C,QAAI;AACF,YAAM,aAAa,OAAO,YAAY,EAAE,UAAU,KAAK,CAAC;AACxD,UAAI,YAAY;AACd,mBAAW;AAAA,UAAU,MACnB,iBAAiB,KAAK,gBAAyB;AAAA,QACjD;AAAA,MACF;AAAA,IACF,QAAQ;AAEN,cAAQ;AAAA,QACN;AAAA,MAEF;AAAA,IACF;AAAA,EACF;AAGA,QAAM,qBAAqB,CAAC,SAAa;AACvC,gBAAY,EAAE,MAAM,KAAK,MAAM,SAAS,CAAC;AAAA,EAC3C;AAEA,SAAO;AACT;","names":[]}
+{"version":3,"file":"useCrossFrameMessageListener.mjs","names":[],"sources":["../../../src/editor/useCrossFrameMessageListener.ts"],"sourcesContent":["'use client';\n\nimport { DestroyRef, inject } from '@angular/core';\nimport { compareUrls, type MessageKey } from '@intlayer/editor';\nimport { useCommunicator } from './communicator';\n\n// ---------- module-level singletons ----------\ntype AnyFn = (data: unknown) => void;\n\n/** Map<key, Set<callback>> */\nconst subscribers = new Map<string, Set<AnyFn>>();\n\n/** True once we've attached the single window listener */\nlet windowListenerAttached = false;\n\n/** Helper to add/remove a callback for a key */\nfunction addSubscriber(key: string, cb: AnyFn) {\n  let set = subscribers.get(key);\n  if (!set) {\n    set = new Set();\n    subscribers.set(key, set);\n  }\n  set.add(cb);\n}\n\nfunction removeSubscriber(key: string, cb: AnyFn) {\n  const set = subscribers.get(key);\n  if (!set) return;\n  set.delete(cb);\n  if (set.size === 0) subscribers.delete(key);\n}\n\n/** The one global window listener */\nfunction ensureGlobalListener(\n  allowedOrigins: string[] | undefined,\n  selfId: string\n) {\n  if (windowListenerAttached) return;\n  window.addEventListener('message', (event) => {\n    const { type, data, senderId } = event.data ?? {};\n    if (!type) return; // guard malformed messages\n    if (senderId === selfId) return; // ignore my own\n\n    // origin check\n    if (\n      !allowedOrigins ||\n      allowedOrigins.includes('*') ||\n      allowedOrigins.some((o) => compareUrls(o, event.origin))\n    ) {\n      // broadcast to everyone interested in this key\n      subscribers.get(type)?.forEach((cb) => cb(data));\n    }\n  });\n  windowListenerAttached = true;\n}\n// ---------- end module-level code ----------\n\n/**\n * useCrossFrameMessageListener\n *\n * @template S - type of the message payload\n * @param key               message type we care about\n * @param onEventTriggered  optional callback when a matching message arrives\n * @returns postMessage(data?) helper scoped to this key\n */\nexport const useCrossFrameMessageListener = <S>(\n  key: `${MessageKey}` | `${MessageKey}/post` | `${MessageKey}/get`,\n  onEventTriggered?: (data: S) => void\n) => {\n  // Communicator is the same for everyone, so it's fine to call every time.\n  const { allowedOrigins, postMessage, senderId } = useCommunicator();\n\n  // --- 1. make sure the global listener exists ----\n  ensureGlobalListener(allowedOrigins, senderId);\n\n  // --- 2. register this caller's callback (if any) ---\n  if (onEventTriggered) {\n    addSubscriber(key, onEventTriggered as AnyFn);\n\n    // Use Angular's DestroyRef for cleanup instead of Vue's onScopeDispose\n    try {\n      const destroyRef = inject(DestroyRef, { optional: true });\n      if (destroyRef) {\n        destroyRef.onDestroy(() =>\n          removeSubscriber(key, onEventTriggered as AnyFn)\n        );\n      }\n    } catch {\n      // If called outside injection context, no cleanup available\n      console.warn(\n        'useCrossFrameMessageListener called outside injection context; ' +\n          'cleanup may not be available.'\n      );\n    }\n  }\n\n  // --- 3. return a wrapper that tags outgoing messages with our key ---\n  const postMessageWrapper = (data?: S) => {\n    postMessage({ type: key, data, senderId });\n  };\n\n  return postMessageWrapper;\n};\n"],"mappings":";;;;;;;;;AAUA,MAAM,8BAAc,IAAI,KAAyB;;AAGjD,IAAI,yBAAyB;;AAG7B,SAAS,cAAc,KAAa,IAAW;CAC7C,IAAI,MAAM,YAAY,IAAI,IAAI;AAC9B,KAAI,CAAC,KAAK;AACR,wBAAM,IAAI,KAAK;AACf,cAAY,IAAI,KAAK,IAAI;;AAE3B,KAAI,IAAI,GAAG;;AAGb,SAAS,iBAAiB,KAAa,IAAW;CAChD,MAAM,MAAM,YAAY,IAAI,IAAI;AAChC,KAAI,CAAC,IAAK;AACV,KAAI,OAAO,GAAG;AACd,KAAI,IAAI,SAAS,EAAG,aAAY,OAAO,IAAI;;;AAI7C,SAAS,qBACP,gBACA,QACA;AACA,KAAI,uBAAwB;AAC5B,QAAO,iBAAiB,YAAY,UAAU;EAC5C,MAAM,EAAE,MAAM,MAAM,aAAa,MAAM,QAAQ,EAAE;AACjD,MAAI,CAAC,KAAM;AACX,MAAI,aAAa,OAAQ;AAGzB,MACE,CAAC,kBACD,eAAe,SAAS,IAAI,IAC5B,eAAe,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,CAAC,CAGxD,aAAY,IAAI,KAAK,EAAE,SAAS,OAAO,GAAG,KAAK,CAAC;GAElD;AACF,0BAAyB;;;;;;;;;;AAY3B,MAAa,gCACX,KACA,qBACG;CAEH,MAAM,EAAE,gBAAgB,aAAa,aAAa,iBAAiB;AAGnE,sBAAqB,gBAAgB,SAAS;AAG9C,KAAI,kBAAkB;AACpB,gBAAc,KAAK,iBAA0B;AAG7C,MAAI;GACF,MAAM,aAAa,OAAO,YAAY,EAAE,UAAU,MAAM,CAAC;AACzD,OAAI,WACF,YAAW,gBACT,iBAAiB,KAAK,iBAA0B,CACjD;UAEG;AAEN,WAAQ,KACN,+FAED;;;CAKL,MAAM,sBAAsB,SAAa;AACvC,cAAY;GAAE,MAAM;GAAK;GAAM;GAAU,CAAC;;AAG5C,QAAO"}

package/dist/esm/editor/useCrossFrameState.mjs

@@ -1,71 +1,113 @@
-import { signal } from "@angular/core";
 import { useCommunicator } from "./communicator.mjs";
 import { useCrossFrameMessageListener } from "./useCrossFrameMessageListener.mjs";
+import { signal } from "@angular/core";
+
+//#region src/editor/useCrossFrameState.ts
 const crossFrameStateCache = /* @__PURE__ */ new Map();
+/**
+* Utility to resolve either a value or an updater function (mirrors React's `setState`).
+*/
 const resolveState = (state, prevState) => {
-  if (typeof state === "function") {
-    return state(prevState);
-  }
-  return state;
+	if (typeof state === "function") return state(prevState);
+	return state;
 };
+/**
+* Creates a plain object copy that can be safely serialized
+* for postMessage communication
+*/
 const toSerializable = (obj) => {
-  if (obj === null || obj === void 0) return obj;
-  return JSON.parse(JSON.stringify(obj));
-};
-const useCrossFrameState = (key, initialState, options = { emit: true, receive: true }) => {
-  if (crossFrameStateCache.has(key)) {
-    const { state, setState: setState2, postState: postState2 } = crossFrameStateCache.get(key);
-    return [state, setState2, postState2];
-  }
-  const { emit = true, receive = true } = options;
-  const stateSignal = signal(resolveState(initialState));
-  const { postMessage, senderId } = useCommunicator();
-  const broadcastState = (value) => {
-    if (!emit || typeof postMessage !== "function" || typeof value === "undefined")
-      return;
-    postMessage({
-      type: `${key}/post`,
-      data: value,
-      senderId
-    });
-  };
-  const setState = (valueOrUpdater) => {
-    const next = resolveState(valueOrUpdater, stateSignal());
-    const serialised = toSerializable(next);
-    stateSignal.set(serialised);
-    broadcastState(serialised);
-  };
-  const postState = () => {
-    if (typeof postMessage !== "function") return;
-    postMessage({
-      type: `${key}/post`,
-      data: stateSignal(),
-      senderId
-    });
-  };
-  broadcastState(stateSignal());
-  if (receive && typeof postMessage === "function" && typeof stateSignal() === "undefined") {
-    postMessage({ type: `${key}/get`, senderId });
-  }
-  useCrossFrameMessageListener(
-    `${key}/post`,
-    receive ? (data) => {
-      stateSignal.set(data);
-    } : void 0
-  );
-  const handleGetMessage = (_, originSenderId) => {
-    if (!emit) return;
-    if (originSenderId === senderId) return;
-    broadcastState(stateSignal());
-  };
-  useCrossFrameMessageListener(
-    `${key}/get`,
-    emit ? handleGetMessage : void 0
-  );
-  crossFrameStateCache.set(key, { state: stateSignal, setState, postState });
-  return [stateSignal, setState, postState];
+	if (obj === null || obj === void 0) return obj;
+	return JSON.parse(JSON.stringify(obj));
 };
-export {
-  useCrossFrameState
+/**
+* Angular replacement for Vue's cross-frame state composable.
+* It synchronises a reactive value across frames/windows via the `postMessage` API.
+*
+* @template S The type of the state being synchronised.
+* @param key          Unique key identifying this state channel.
+* @param initialState Initial value (or lazy factory) for the state.
+* @param options      Control flags for emitting/receiving updates.
+*
+* @returns `[stateSignal, setState, postState]`
+*          - `stateSignal` – Angular `Signal<S | undefined>` holding the current state.
+*          - `setState`    – Setter with the same API as React's `setState`.
+*          - `postState`   – Manually broadcast the current state (useful after mutations outside `setState`).
+*/
+const useCrossFrameState = (key, initialState, options = {
+	emit: true,
+	receive: true
+}) => {
+	if (crossFrameStateCache.has(key)) {
+		const { state, setState: setState$1, postState: postState$1 } = crossFrameStateCache.get(key);
+		return [
+			state,
+			setState$1,
+			postState$1
+		];
+	}
+	const { emit = true, receive = true } = options;
+	/**
+	* Internal reactive state using Angular signals.
+	* We resolve the initial value here to avoid one extra render (same idea as in the React version).
+	*/
+	const stateSignal = signal(resolveState(initialState));
+	const { postMessage, senderId } = useCommunicator();
+	/**
+	* Broadcast the given value if emitting is allowed and the communicator is ready.
+	*/
+	const broadcastState = (value) => {
+		if (!emit || typeof postMessage !== "function" || typeof value === "undefined") return;
+		postMessage({
+			type: `${key}/post`,
+			data: value,
+			senderId
+		});
+	};
+	/**
+	* Setter that mirrors React's `setState` signature (supports value or updater fn).
+	*/
+	const setState = (valueOrUpdater) => {
+		const serialised = toSerializable(resolveState(valueOrUpdater, stateSignal()));
+		stateSignal.set(serialised);
+		broadcastState(serialised);
+	};
+	/**
+	* Manually broadcast the current state to peers.
+	*/
+	const postState = () => {
+		if (typeof postMessage !== "function") return;
+		postMessage({
+			type: `${key}/post`,
+			data: stateSignal(),
+			senderId
+		});
+	};
+	broadcastState(stateSignal());
+	if (receive && typeof postMessage === "function" && typeof stateSignal() === "undefined") postMessage({
+		type: `${key}/get`,
+		senderId
+	});
+	useCrossFrameMessageListener(`${key}/post`, receive ? (data) => {
+		stateSignal.set(data);
+	} : void 0);
+	const handleGetMessage = (_, originSenderId) => {
+		if (!emit) return;
+		if (originSenderId === senderId) return;
+		broadcastState(stateSignal());
+	};
+	useCrossFrameMessageListener(`${key}/get`, emit ? handleGetMessage : void 0);
+	crossFrameStateCache.set(key, {
+		state: stateSignal,
+		setState,
+		postState
+	});
+	return [
+		stateSignal,
+		setState,
+		postState
+	];
 };
+
+//#endregion
+export { useCrossFrameState };
 //# sourceMappingURL=useCrossFrameState.mjs.map

package/dist/esm/editor/useCrossFrameState.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/useCrossFrameState.ts"],"sourcesContent":["import { signal, Signal } from '@angular/core';\nimport { type MessageKey } from '@intlayer/editor';\nimport { useCommunicator } from './communicator';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\n\nexport type CrossFrameStateOptions = {\n  /** Whether to broadcast state changes to other instances (default: true) */\n  emit?: boolean;\n  /** Whether to listen for state updates from other instances (default: true) */\n  receive?: boolean;\n};\n\nconst crossFrameStateCache = new Map<\n  string,\n  {\n    state: Signal<any>;\n    setState: (v: any | ((prev: any) => any)) => void;\n    postState: () => void;\n  }\n>();\n\n/**\n * Utility to resolve either a value or an updater function (mirrors React's `setState`).\n */\nconst resolveState = <S>(\n  state: S | ((prev?: S) => S) | undefined,\n  prevState?: S\n): S | undefined => {\n  if (typeof state === 'function') {\n    return (state as (prev?: S) => S)(prevState);\n  }\n  return state as S;\n};\n\n/**\n * Creates a plain object copy that can be safely serialized\n * for postMessage communication\n */\nconst toSerializable = <T>(obj: T): T => {\n  if (obj === null || obj === undefined) return obj;\n  // Using parse/stringify for a quick deep clone to remove reactivity\n  return JSON.parse(JSON.stringify(obj));\n};\n\n/**\n * Angular replacement for Vue's cross-frame state composable.\n * It synchronises a reactive value across frames/windows via the `postMessage` API.\n *\n * @template S The type of the state being synchronised.\n * @param key          Unique key identifying this state channel.\n * @param initialState Initial value (or lazy factory) for the state.\n * @param options      Control flags for emitting/receiving updates.\n *\n * @returns `[stateSignal, setState, postState]`\n *          - `stateSignal` – Angular `Signal<S | undefined>` holding the current state.\n *          - `setState`    – Setter with the same API as React's `setState`.\n *          - `postState`   – Manually broadcast the current state (useful after mutations outside `setState`).\n */\nexport const useCrossFrameState = <S>(\n  key: `${MessageKey}`,\n  initialState?: S | (() => S),\n  options: CrossFrameStateOptions = { emit: true, receive: true }\n): [\n  Signal<S | undefined>,\n  (v: S | ((prev: S | undefined) => S)) => void,\n  () => void,\n] => {\n  if (crossFrameStateCache.has(key)) {\n    // Return the existing instance\n    const { state, setState, postState } = crossFrameStateCache.get(key)!;\n    return [state, setState, postState];\n  }\n\n  const { emit = true, receive = true } = options;\n\n  /**\n   * Internal reactive state using Angular signals.\n   * We resolve the initial value here to avoid one extra render (same idea as in the React version).\n   */\n  const stateSignal = signal<S | undefined>(resolveState<S>(initialState));\n\n  // Get communicator within injection context\n  const { postMessage, senderId } = useCommunicator();\n\n  /**\n   * Broadcast the given value if emitting is allowed and the communicator is ready.\n   */\n  const broadcastState = (value: S | undefined) => {\n    if (\n      !emit ||\n      typeof postMessage !== 'function' ||\n      typeof value === 'undefined'\n    )\n      return;\n    postMessage({\n      type: `${key}/post`,\n      data: value,\n      senderId,\n    });\n  };\n\n  /**\n   * Setter that mirrors React's `setState` signature (supports value or updater fn).\n   */\n  const setState = (valueOrUpdater: S | ((prev: S | undefined) => S)) => {\n    const next = resolveState<S>(valueOrUpdater as any, stateSignal());\n    const serialised = toSerializable(next);\n    stateSignal.set(serialised);\n    broadcastState(serialised);\n  };\n\n  /**\n   * Manually broadcast the current state to peers.\n   */\n  const postState = () => {\n    if (typeof postMessage !== 'function') return;\n    postMessage({\n      type: `${key}/post`,\n      data: stateSignal(),\n      senderId,\n    });\n  };\n\n  // Emit the initial state (if any) right away so that peers can pick it up.\n  broadcastState(stateSignal());\n\n  // If we are in receive mode but have no state yet, ask peers for theirs.\n  if (\n    receive &&\n    typeof postMessage === 'function' &&\n    typeof stateSignal() === 'undefined'\n  ) {\n    postMessage({ type: `${key}/get`, senderId });\n  }\n\n  /* ───────────────────── Incoming messages ───────────────────── */\n\n  // 1. Updates posted by other frames\n  useCrossFrameMessageListener<S>(\n    `${key}/post`,\n    receive\n      ? (data) => {\n          stateSignal.set(data);\n        }\n      : undefined\n  );\n\n  // 2. Requests from peers asking for our current value\n  const handleGetMessage = (_: unknown, originSenderId?: string) => {\n    if (!emit) return;\n    if (originSenderId === senderId) return; // Don't respond to our own request\n    broadcastState(stateSignal());\n  };\n\n  useCrossFrameMessageListener(\n    `${key}/get`,\n    emit ? handleGetMessage : undefined\n  );\n\n  // Cache this instance\n  crossFrameStateCache.set(key, { state: stateSignal, setState, postState });\n\n  return [stateSignal as Signal<S | undefined>, setState, postState];\n};\n"],"mappings":"AAAA,SAAS,cAAsB;AAE/B,SAAS,uBAAuB;AAChC,SAAS,oCAAoC;AAS7C,MAAM,uBAAuB,oBAAI,IAO/B;AAKF,MAAM,eAAe,CACnB,OACA,cACkB;AAClB,MAAI,OAAO,UAAU,YAAY;AAC/B,WAAQ,MAA0B,SAAS;AAAA,EAC7C;AACA,SAAO;AACT;AAMA,MAAM,iBAAiB,CAAI,QAAc;AACvC,MAAI,QAAQ,QAAQ,QAAQ,OAAW,QAAO;AAE9C,SAAO,KAAK,MAAM,KAAK,UAAU,GAAG,CAAC;AACvC;AAgBO,MAAM,qBAAqB,CAChC,KACA,cACA,UAAkC,EAAE,MAAM,MAAM,SAAS,KAAK,MAK3D;AACH,MAAI,qBAAqB,IAAI,GAAG,GAAG;AAEjC,UAAM,EAAE,OAAO,UAAAA,WAAU,WAAAC,WAAU,IAAI,qBAAqB,IAAI,GAAG;AACnE,WAAO,CAAC,OAAOD,WAAUC,UAAS;AAAA,EACpC;AAEA,QAAM,EAAE,OAAO,MAAM,UAAU,KAAK,IAAI;AAMxC,QAAM,cAAc,OAAsB,aAAgB,YAAY,CAAC;AAGvE,QAAM,EAAE,aAAa,SAAS,IAAI,gBAAgB;AAKlD,QAAM,iBAAiB,CAAC,UAAyB;AAC/C,QACE,CAAC,QACD,OAAO,gBAAgB,cACvB,OAAO,UAAU;AAEjB;AACF,gBAAY;AAAA,MACV,MAAM,GAAG,GAAG;AAAA,MACZ,MAAM;AAAA,MACN;AAAA,IACF,CAAC;AAAA,EACH;AAKA,QAAM,WAAW,CAAC,mBAAqD;AACrE,UAAM,OAAO,aAAgB,gBAAuB,YAAY,CAAC;AACjE,UAAM,aAAa,eAAe,IAAI;AACtC,gBAAY,IAAI,UAAU;AAC1B,mBAAe,UAAU;AAAA,EAC3B;AAKA,QAAM,YAAY,MAAM;AACtB,QAAI,OAAO,gBAAgB,WAAY;AACvC,gBAAY;AAAA,MACV,MAAM,GAAG,GAAG;AAAA,MACZ,MAAM,YAAY;AAAA,MAClB;AAAA,IACF,CAAC;AAAA,EACH;AAGA,iBAAe,YAAY,CAAC;AAG5B,MACE,WACA,OAAO,gBAAgB,cACvB,OAAO,YAAY,MAAM,aACzB;AACA,gBAAY,EAAE,MAAM,GAAG,GAAG,QAAQ,SAAS,CAAC;AAAA,EAC9C;AAKA;AAAA,IACE,GAAG,GAAG;AAAA,IACN,UACI,CAAC,SAAS;AACR,kBAAY,IAAI,IAAI;AAAA,IACtB,IACA;AAAA,EACN;AAGA,QAAM,mBAAmB,CAAC,GAAY,mBAA4B;AAChE,QAAI,CAAC,KAAM;AACX,QAAI,mBAAmB,SAAU;AACjC,mBAAe,YAAY,CAAC;AAAA,EAC9B;AAEA;AAAA,IACE,GAAG,GAAG;AAAA,IACN,OAAO,mBAAmB;AAAA,EAC5B;AAGA,uBAAqB,IAAI,KAAK,EAAE,OAAO,aAAa,UAAU,UAAU,CAAC;AAEzE,SAAO,CAAC,aAAsC,UAAU,SAAS;AACnE;","names":["setState","postState"]}
+{"version":3,"file":"useCrossFrameState.mjs","names":["setState","postState"],"sources":["../../../src/editor/useCrossFrameState.ts"],"sourcesContent":["import { type Signal, signal } from '@angular/core';\nimport type { MessageKey } from '@intlayer/editor';\nimport { useCommunicator } from './communicator';\nimport { useCrossFrameMessageListener } from './useCrossFrameMessageListener';\n\nexport type CrossFrameStateOptions = {\n  /** Whether to broadcast state changes to other instances (default: true) */\n  emit?: boolean;\n  /** Whether to listen for state updates from other instances (default: true) */\n  receive?: boolean;\n};\n\nconst crossFrameStateCache = new Map<\n  string,\n  {\n    state: Signal<any>;\n    setState: (v: any | ((prev: any) => any)) => void;\n    postState: () => void;\n  }\n>();\n\n/**\n * Utility to resolve either a value or an updater function (mirrors React's `setState`).\n */\nconst resolveState = <S>(\n  state: S | ((prev?: S) => S) | undefined,\n  prevState?: S\n): S | undefined => {\n  if (typeof state === 'function') {\n    return (state as (prev?: S) => S)(prevState);\n  }\n  return state as S;\n};\n\n/**\n * Creates a plain object copy that can be safely serialized\n * for postMessage communication\n */\nconst toSerializable = <T>(obj: T): T => {\n  if (obj === null || obj === undefined) return obj;\n  // Using parse/stringify for a quick deep clone to remove reactivity\n  return JSON.parse(JSON.stringify(obj));\n};\n\n/**\n * Angular replacement for Vue's cross-frame state composable.\n * It synchronises a reactive value across frames/windows via the `postMessage` API.\n *\n * @template S The type of the state being synchronised.\n * @param key          Unique key identifying this state channel.\n * @param initialState Initial value (or lazy factory) for the state.\n * @param options      Control flags for emitting/receiving updates.\n *\n * @returns `[stateSignal, setState, postState]`\n *          - `stateSignal` – Angular `Signal<S | undefined>` holding the current state.\n *          - `setState`    – Setter with the same API as React's `setState`.\n *          - `postState`   – Manually broadcast the current state (useful after mutations outside `setState`).\n */\nexport const useCrossFrameState = <S>(\n  key: `${MessageKey}`,\n  initialState?: S | (() => S),\n  options: CrossFrameStateOptions = { emit: true, receive: true }\n): [\n  Signal<S | undefined>,\n  (v: S | ((prev: S | undefined) => S)) => void,\n  () => void,\n] => {\n  if (crossFrameStateCache.has(key)) {\n    // Return the existing instance\n    const { state, setState, postState } = crossFrameStateCache.get(key)!;\n    return [state, setState, postState];\n  }\n\n  const { emit = true, receive = true } = options;\n\n  /**\n   * Internal reactive state using Angular signals.\n   * We resolve the initial value here to avoid one extra render (same idea as in the React version).\n   */\n  const stateSignal = signal<S | undefined>(resolveState<S>(initialState));\n\n  // Get communicator within injection context\n  const { postMessage, senderId } = useCommunicator();\n\n  /**\n   * Broadcast the given value if emitting is allowed and the communicator is ready.\n   */\n  const broadcastState = (value: S | undefined) => {\n    if (\n      !emit ||\n      typeof postMessage !== 'function' ||\n      typeof value === 'undefined'\n    )\n      return;\n    postMessage({\n      type: `${key}/post`,\n      data: value,\n      senderId,\n    });\n  };\n\n  /**\n   * Setter that mirrors React's `setState` signature (supports value or updater fn).\n   */\n  const setState = (valueOrUpdater: S | ((prev: S | undefined) => S)) => {\n    const next = resolveState<S>(valueOrUpdater as any, stateSignal());\n    const serialised = toSerializable(next);\n    stateSignal.set(serialised);\n    broadcastState(serialised);\n  };\n\n  /**\n   * Manually broadcast the current state to peers.\n   */\n  const postState = () => {\n    if (typeof postMessage !== 'function') return;\n    postMessage({\n      type: `${key}/post`,\n      data: stateSignal(),\n      senderId,\n    });\n  };\n\n  // Emit the initial state (if any) right away so that peers can pick it up.\n  broadcastState(stateSignal());\n\n  // If we are in receive mode but have no state yet, ask peers for theirs.\n  if (\n    receive &&\n    typeof postMessage === 'function' &&\n    typeof stateSignal() === 'undefined'\n  ) {\n    postMessage({ type: `${key}/get`, senderId });\n  }\n\n  /* ───────────────────── Incoming messages ───────────────────── */\n\n  // 1. Updates posted by other frames\n  useCrossFrameMessageListener<S>(\n    `${key}/post`,\n    receive\n      ? (data) => {\n          stateSignal.set(data);\n        }\n      : undefined\n  );\n\n  // 2. Requests from peers asking for our current value\n  const handleGetMessage = (_: unknown, originSenderId?: string) => {\n    if (!emit) return;\n    if (originSenderId === senderId) return; // Don't respond to our own request\n    broadcastState(stateSignal());\n  };\n\n  useCrossFrameMessageListener(\n    `${key}/get`,\n    emit ? handleGetMessage : undefined\n  );\n\n  // Cache this instance\n  crossFrameStateCache.set(key, { state: stateSignal, setState, postState });\n\n  return [stateSignal as Signal<S | undefined>, setState, postState];\n};\n"],"mappings":";;;;;AAYA,MAAM,uCAAuB,IAAI,KAO9B;;;;AAKH,MAAM,gBACJ,OACA,cACkB;AAClB,KAAI,OAAO,UAAU,WACnB,QAAQ,MAA0B,UAAU;AAE9C,QAAO;;;;;;AAOT,MAAM,kBAAqB,QAAc;AACvC,KAAI,QAAQ,QAAQ,QAAQ,OAAW,QAAO;AAE9C,QAAO,KAAK,MAAM,KAAK,UAAU,IAAI,CAAC;;;;;;;;;;;;;;;;AAiBxC,MAAa,sBACX,KACA,cACA,UAAkC;CAAE,MAAM;CAAM,SAAS;CAAM,KAK5D;AACH,KAAI,qBAAqB,IAAI,IAAI,EAAE;EAEjC,MAAM,EAAE,OAAO,sBAAU,2BAAc,qBAAqB,IAAI,IAAI;AACpE,SAAO;GAAC;GAAOA;GAAUC;GAAU;;CAGrC,MAAM,EAAE,OAAO,MAAM,UAAU,SAAS;;;;;CAMxC,MAAM,cAAc,OAAsB,aAAgB,aAAa,CAAC;CAGxE,MAAM,EAAE,aAAa,aAAa,iBAAiB;;;;CAKnD,MAAM,kBAAkB,UAAyB;AAC/C,MACE,CAAC,QACD,OAAO,gBAAgB,cACvB,OAAO,UAAU,YAEjB;AACF,cAAY;GACV,MAAM,GAAG,IAAI;GACb,MAAM;GACN;GACD,CAAC;;;;;CAMJ,MAAM,YAAY,mBAAqD;EAErE,MAAM,aAAa,eADN,aAAgB,gBAAuB,aAAa,CAAC,CAC3B;AACvC,cAAY,IAAI,WAAW;AAC3B,iBAAe,WAAW;;;;;CAM5B,MAAM,kBAAkB;AACtB,MAAI,OAAO,gBAAgB,WAAY;AACvC,cAAY;GACV,MAAM,GAAG,IAAI;GACb,MAAM,aAAa;GACnB;GACD,CAAC;;AAIJ,gBAAe,aAAa,CAAC;AAG7B,KACE,WACA,OAAO,gBAAgB,cACvB,OAAO,aAAa,KAAK,YAEzB,aAAY;EAAE,MAAM,GAAG,IAAI;EAAO;EAAU,CAAC;AAM/C,8BACE,GAAG,IAAI,QACP,WACK,SAAS;AACR,cAAY,IAAI,KAAK;KAEvB,OACL;CAGD,MAAM,oBAAoB,GAAY,mBAA4B;AAChE,MAAI,CAAC,KAAM;AACX,MAAI,mBAAmB,SAAU;AACjC,iBAAe,aAAa,CAAC;;AAG/B,8BACE,GAAG,IAAI,OACP,OAAO,mBAAmB,OAC3B;AAGD,sBAAqB,IAAI,KAAK;EAAE,OAAO;EAAa;EAAU;EAAW,CAAC;AAE1E,QAAO;EAAC;EAAsC;EAAU;EAAU"}

package/dist/esm/editor/useCrossURLPathState.mjs

@@ -1,47 +1,63 @@
+import { useCrossFrameState } from "./useCrossFrameState.mjs";
 import { DestroyRef, inject } from "@angular/core";
 import { MessageKey } from "@intlayer/editor";
-import { useCrossFrameState } from "./useCrossFrameState.mjs";
+
+//#region src/editor/useCrossURLPathState.ts
+/**
+* Hook to create and manage a cross-frame synchronized URL path state
+* @param initial - The initial URL path
+* @param opts - Options for controlling emit and receive behavior
+* @returns A tuple containing [state signal, setState function, forceSync function]
+*/
 const useCrossURLPathState = (initial, opts) => useCrossFrameState(MessageKey.INTLAYER_URL_CHANGE, initial, opts);
+/**
+* Hook for host applications to push URL path changes into the shared state
+* This also monkey patches history methods to capture navigation events
+* @param initial - The initial URL path
+* @returns A tuple containing [state signal, setState function]
+*/
 const useCrossURLPathSetter = (initial) => {
-  const [state, setState] = useCrossURLPathState(initial, {
-    emit: true,
-    receive: false
-  });
-  let originalPushState;
-  let originalReplaceState;
-  const update = () => setState(window.location.pathname);
-  try {
-    const destroyRef = inject(DestroyRef, { optional: true });
-    if (destroyRef && typeof window !== "undefined") {
-      originalPushState = history.pushState;
-      originalReplaceState = history.replaceState;
-      const wrap = (fn) => (...args) => {
-        fn.apply(history, args);
-        window.dispatchEvent(new Event("locationchange"));
-      };
-      history.pushState = wrap(originalPushState);
-      history.replaceState = wrap(originalReplaceState);
-      window.addEventListener("locationchange", update);
-      window.addEventListener("popstate", update);
-      window.addEventListener("hashchange", update);
-      update();
-      destroyRef.onDestroy(() => {
-        window.removeEventListener("locationchange", update);
-        window.removeEventListener("popstate", update);
-        window.removeEventListener("hashchange", update);
-        if (originalPushState) history.pushState = originalPushState;
-        if (originalReplaceState) history.replaceState = originalReplaceState;
-      });
-    }
-  } catch {
-    console.warn(
-      "useCrossURLPathSetter called outside injection context; URL path synchronization may not be available."
-    );
-  }
-  return [state, setState];
-};
-export {
-  useCrossURLPathSetter,
-  useCrossURLPathState
+	const [state, setState] = useCrossURLPathState(initial, {
+		emit: true,
+		receive: false
+	});
+	let originalPushState;
+	let originalReplaceState;
+	const update = () => setState(window.location.pathname);
+	try {
+		const destroyRef = inject(DestroyRef, { optional: true });
+		if (destroyRef && typeof window !== "undefined") {
+			originalPushState = history.pushState;
+			originalReplaceState = history.replaceState;
+			/**
+			* Wraps a history function to dispatch a custom event when called
+			* @param fn - The history function to wrap
+			* @returns The wrapped function
+			*/
+			const wrap = (fn) => (...args) => {
+				fn.apply(history, args);
+				window.dispatchEvent(new Event("locationchange"));
+			};
+			history.pushState = wrap(originalPushState);
+			history.replaceState = wrap(originalReplaceState);
+			window.addEventListener("locationchange", update);
+			window.addEventListener("popstate", update);
+			window.addEventListener("hashchange", update);
+			update();
+			destroyRef.onDestroy(() => {
+				window.removeEventListener("locationchange", update);
+				window.removeEventListener("popstate", update);
+				window.removeEventListener("hashchange", update);
+				if (originalPushState) history.pushState = originalPushState;
+				if (originalReplaceState) history.replaceState = originalReplaceState;
+			});
+		}
+	} catch {
+		console.warn("useCrossURLPathSetter called outside injection context; URL path synchronization may not be available.");
+	}
+	return [state, setState];
 };
+
+//#endregion
+export { useCrossURLPathSetter, useCrossURLPathState };
 //# sourceMappingURL=useCrossURLPathState.mjs.map

package/dist/esm/editor/useCrossURLPathState.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/editor/useCrossURLPathState.ts"],"sourcesContent":["import { DestroyRef, inject } from '@angular/core';\nimport { MessageKey } from '@intlayer/editor';\nimport { useCrossFrameState } from './useCrossFrameState';\n\n/**\n * Hook to create and manage a cross-frame synchronized URL path state\n * @param initial - The initial URL path\n * @param opts - Options for controlling emit and receive behavior\n * @returns A tuple containing [state signal, setState function, forceSync function]\n */\nexport const useCrossURLPathState = (\n  initial?: string,\n  opts?: Parameters<typeof useCrossFrameState>[2]\n) => useCrossFrameState<string>(MessageKey.INTLAYER_URL_CHANGE, initial, opts);\n\n/**\n * Hook for host applications to push URL path changes into the shared state\n * This also monkey patches history methods to capture navigation events\n * @param initial - The initial URL path\n * @returns A tuple containing [state signal, setState function]\n */\nexport const useCrossURLPathSetter = (initial?: string) => {\n  const [state, setState] = useCrossURLPathState(initial, {\n    emit: true,\n    receive: false,\n  });\n\n  // Original history methods\n  let originalPushState: typeof history.pushState;\n  let originalReplaceState: typeof history.replaceState;\n\n  // Function to update state with current pathname\n  const update = () => setState(window.location.pathname);\n\n  // Use Angular's DestroyRef for cleanup instead of Vue lifecycle hooks\n  try {\n    const destroyRef = inject(DestroyRef, { optional: true });\n\n    if (destroyRef && typeof window !== 'undefined') {\n      // Save original methods\n      originalPushState = history.pushState;\n      originalReplaceState = history.replaceState;\n\n      /**\n       * Wraps a history function to dispatch a custom event when called\n       * @param fn - The history function to wrap\n       * @returns The wrapped function\n       */\n      const wrap =\n        (fn: typeof history.pushState) =>\n        (...args: Parameters<typeof history.pushState>) => {\n          fn.apply(history, args);\n          window.dispatchEvent(new Event('locationchange'));\n        };\n\n      // Patch history methods\n      history.pushState = wrap(originalPushState);\n      history.replaceState = wrap(originalReplaceState);\n\n      // Add event listeners\n      window.addEventListener('locationchange', update);\n      window.addEventListener('popstate', update);\n      window.addEventListener('hashchange', update);\n\n      // Initialize immediately\n      update();\n\n      // Clean up on destroy\n      destroyRef.onDestroy(() => {\n        window.removeEventListener('locationchange', update);\n        window.removeEventListener('popstate', update);\n        window.removeEventListener('hashchange', update);\n\n        // Restore original history methods\n        if (originalPushState) history.pushState = originalPushState;\n        if (originalReplaceState) history.replaceState = originalReplaceState;\n      });\n    }\n  } catch {\n    console.warn(\n      'useCrossURLPathSetter called outside injection context; ' +\n        'URL path synchronization may not be available.'\n    );\n  }\n\n  return [state, setState] as const;\n};\n"],"mappings":"AAAA,SAAS,YAAY,cAAc;AACnC,SAAS,kBAAkB;AAC3B,SAAS,0BAA0B;AAQ5B,MAAM,uBAAuB,CAClC,SACA,SACG,mBAA2B,WAAW,qBAAqB,SAAS,IAAI;AAQtE,MAAM,wBAAwB,CAAC,YAAqB;AACzD,QAAM,CAAC,OAAO,QAAQ,IAAI,qBAAqB,SAAS;AAAA,IACtD,MAAM;AAAA,IACN,SAAS;AAAA,EACX,CAAC;AAGD,MAAI;AACJ,MAAI;AAGJ,QAAM,SAAS,MAAM,SAAS,OAAO,SAAS,QAAQ;AAGtD,MAAI;AACF,UAAM,aAAa,OAAO,YAAY,EAAE,UAAU,KAAK,CAAC;AAExD,QAAI,cAAc,OAAO,WAAW,aAAa;AAE/C,0BAAoB,QAAQ;AAC5B,6BAAuB,QAAQ;AAO/B,YAAM,OACJ,CAAC,OACD,IAAI,SAA+C;AACjD,WAAG,MAAM,SAAS,IAAI;AACtB,eAAO,cAAc,IAAI,MAAM,gBAAgB,CAAC;AAAA,MAClD;AAGF,cAAQ,YAAY,KAAK,iBAAiB;AAC1C,cAAQ,eAAe,KAAK,oBAAoB;AAGhD,aAAO,iBAAiB,kBAAkB,MAAM;AAChD,aAAO,iBAAiB,YAAY,MAAM;AAC1C,aAAO,iBAAiB,cAAc,MAAM;AAG5C,aAAO;AAGP,iBAAW,UAAU,MAAM;AACzB,eAAO,oBAAoB,kBAAkB,MAAM;AACnD,eAAO,oBAAoB,YAAY,MAAM;AAC7C,eAAO,oBAAoB,cAAc,MAAM;AAG/C,YAAI,kBAAmB,SAAQ,YAAY;AAC3C,YAAI,qBAAsB,SAAQ,eAAe;AAAA,MACnD,CAAC;AAAA,IACH;AAAA,EACF,QAAQ;AACN,YAAQ;AAAA,MACN;AAAA,IAEF;AAAA,EACF;AAEA,SAAO,CAAC,OAAO,QAAQ;AACzB;","names":[]}
+{"version":3,"file":"useCrossURLPathState.mjs","names":["originalPushState: typeof history.pushState","originalReplaceState: typeof history.replaceState"],"sources":["../../../src/editor/useCrossURLPathState.ts"],"sourcesContent":["import { DestroyRef, inject } from '@angular/core';\nimport { MessageKey } from '@intlayer/editor';\nimport { useCrossFrameState } from './useCrossFrameState';\n\n/**\n * Hook to create and manage a cross-frame synchronized URL path state\n * @param initial - The initial URL path\n * @param opts - Options for controlling emit and receive behavior\n * @returns A tuple containing [state signal, setState function, forceSync function]\n */\nexport const useCrossURLPathState = (\n  initial?: string,\n  opts?: Parameters<typeof useCrossFrameState>[2]\n) => useCrossFrameState<string>(MessageKey.INTLAYER_URL_CHANGE, initial, opts);\n\n/**\n * Hook for host applications to push URL path changes into the shared state\n * This also monkey patches history methods to capture navigation events\n * @param initial - The initial URL path\n * @returns A tuple containing [state signal, setState function]\n */\nexport const useCrossURLPathSetter = (initial?: string) => {\n  const [state, setState] = useCrossURLPathState(initial, {\n    emit: true,\n    receive: false,\n  });\n\n  // Original history methods\n  let originalPushState: typeof history.pushState;\n  let originalReplaceState: typeof history.replaceState;\n\n  // Function to update state with current pathname\n  const update = () => setState(window.location.pathname);\n\n  // Use Angular's DestroyRef for cleanup instead of Vue lifecycle hooks\n  try {\n    const destroyRef = inject(DestroyRef, { optional: true });\n\n    if (destroyRef && typeof window !== 'undefined') {\n      // Save original methods\n      originalPushState = history.pushState;\n      originalReplaceState = history.replaceState;\n\n      /**\n       * Wraps a history function to dispatch a custom event when called\n       * @param fn - The history function to wrap\n       * @returns The wrapped function\n       */\n      const wrap =\n        (fn: typeof history.pushState) =>\n        (...args: Parameters<typeof history.pushState>) => {\n          fn.apply(history, args);\n          window.dispatchEvent(new Event('locationchange'));\n        };\n\n      // Patch history methods\n      history.pushState = wrap(originalPushState);\n      history.replaceState = wrap(originalReplaceState);\n\n      // Add event listeners\n      window.addEventListener('locationchange', update);\n      window.addEventListener('popstate', update);\n      window.addEventListener('hashchange', update);\n\n      // Initialize immediately\n      update();\n\n      // Clean up on destroy\n      destroyRef.onDestroy(() => {\n        window.removeEventListener('locationchange', update);\n        window.removeEventListener('popstate', update);\n        window.removeEventListener('hashchange', update);\n\n        // Restore original history methods\n        if (originalPushState) history.pushState = originalPushState;\n        if (originalReplaceState) history.replaceState = originalReplaceState;\n      });\n    }\n  } catch {\n    console.warn(\n      'useCrossURLPathSetter called outside injection context; ' +\n        'URL path synchronization may not be available.'\n    );\n  }\n\n  return [state, setState] as const;\n};\n"],"mappings":";;;;;;;;;;;AAUA,MAAa,wBACX,SACA,SACG,mBAA2B,WAAW,qBAAqB,SAAS,KAAK;;;;;;;AAQ9E,MAAa,yBAAyB,YAAqB;CACzD,MAAM,CAAC,OAAO,YAAY,qBAAqB,SAAS;EACtD,MAAM;EACN,SAAS;EACV,CAAC;CAGF,IAAIA;CACJ,IAAIC;CAGJ,MAAM,eAAe,SAAS,OAAO,SAAS,SAAS;AAGvD,KAAI;EACF,MAAM,aAAa,OAAO,YAAY,EAAE,UAAU,MAAM,CAAC;AAEzD,MAAI,cAAc,OAAO,WAAW,aAAa;AAE/C,uBAAoB,QAAQ;AAC5B,0BAAuB,QAAQ;;;;;;GAO/B,MAAM,QACH,QACA,GAAG,SAA+C;AACjD,OAAG,MAAM,SAAS,KAAK;AACvB,WAAO,cAAc,IAAI,MAAM,iBAAiB,CAAC;;AAIrD,WAAQ,YAAY,KAAK,kBAAkB;AAC3C,WAAQ,eAAe,KAAK,qBAAqB;AAGjD,UAAO,iBAAiB,kBAAkB,OAAO;AACjD,UAAO,iBAAiB,YAAY,OAAO;AAC3C,UAAO,iBAAiB,cAAc,OAAO;AAG7C,WAAQ;AAGR,cAAW,gBAAgB;AACzB,WAAO,oBAAoB,kBAAkB,OAAO;AACpD,WAAO,oBAAoB,YAAY,OAAO;AAC9C,WAAO,oBAAoB,cAAc,OAAO;AAGhD,QAAI,kBAAmB,SAAQ,YAAY;AAC3C,QAAI,qBAAsB,SAAQ,eAAe;KACjD;;SAEE;AACN,UAAQ,KACN,yGAED;;AAGH,QAAO,CAAC,OAAO,SAAS"}