@ama-mfe/ng-utils 12.1.0-prerelease.73

package/fesm2022/ama-mfe-ng-utils.mjs

@@ -0,0 +1,1016 @@
+import { isServiceMessage } from '@amadeus-it-group/microfrontends';
+import { MessagePeerService, MESSAGE_PEER_CONFIG, MESSAGE_PEER_CONNECT_OPTIONS } from '@amadeus-it-group/microfrontends-angular';
+export { MessagePeerService as ConnectionService } from '@amadeus-it-group/microfrontends-angular';
+import * as i0 from '@angular/core';
+import { Injectable, inject, signal, effect, DestroyRef, afterNextRender, input, computed, ElementRef, Renderer2, Directive, untracked, SecurityContext, Pipe, HostBinding, makeEnvironmentProviders } from '@angular/core';
+import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
+import { RESIZE_MESSAGE_TYPE, NAVIGATION_MESSAGE_TYPE, THEME_MESSAGE_TYPE } from '@ama-mfe/messages';
+import { Router, ActivatedRoute, NavigationEnd } from '@angular/router';
+import { Subject, filter, map } from 'rxjs';
+import { DomSanitizer } from '@angular/platform-browser';
+
+/**
+ * Gets the available consumers and formats them into a {@see DeclareMessages} object.
+ * @param consumers - The list of registered message consumers.
+ * @returns The formatted DeclareMessages object.
+ */
+const getAvailableConsumers = (consumers) => {
+    return {
+        type: 'declare_messages',
+        version: '1.0',
+        messages: consumers.flatMap(({ type, supportedVersions }) => Object.keys(supportedVersions).map((version) => ({ type, version })))
+    };
+};
+
+/**
+ * Helper function to send an error message by the given endpoint (peer)
+ * @param peer The endpoint sending the message
+ * @param content the content of the error message to be sent
+ */
+const sendError = (peer, content) => {
+    return peer.send({
+        type: 'error',
+        version: '1.0',
+        ...content
+    });
+};
+/**
+ * Check if the given message is of type error and the error reson is present too
+ * @param message the message to be checked
+ */
+// eslint-disable-next-line @stylistic/max-len -- constant definition
+const isErrorMessage = (message) => (message && typeof message === 'object' && message.type === 'error' && !!message.reason);
+
+class ProducerManagerService {
+    constructor() {
+        this.registeredProducers = new Set();
+    }
+    /** Get the list of registered producers of messages. The list will contain unique elements */
+    get producers() {
+        return [...this.registeredProducers];
+    }
+    /**
+     * Register a producer of a message
+     * @param producer The instance of the message producer
+     */
+    register(producer) {
+        this.registeredProducers.add((producer));
+    }
+    /**
+     * Unregister a producer of a message
+     * @param producer The instance of the message producer
+     */
+    unregister(producer) {
+        this.registeredProducers.delete((producer));
+    }
+    /**
+     * Handles the received error message for the given message type by invoking the appropriate producer handlers.
+     * @template T - The type of the message, extending from Message.
+     * @param message - The error message to handle.
+     * @returns - A promise that resolves to true if the error was handled by at least one handler, false otherwise.
+     */
+    async dispatchError(message) {
+        const handlers = this.producers
+            .filter(({ types }) => (Array.isArray(types) ? types : [types]).includes(message.source.type));
+        const handlersPresent = handlers.length > 0;
+        if (handlersPresent) {
+            await Promise.all(handlers.map((handler) => handler.handleError(message)));
+        }
+        return handlersPresent;
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ProducerManagerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ProducerManagerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ProducerManagerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class ConsumerManagerService {
+    constructor() {
+        this.messageService = inject(MessagePeerService);
+        this.producerManagerService = inject(ProducerManagerService);
+        this.registeredConsumers = signal([]);
+        /** The list of registered consumers */
+        this.consumers = this.registeredConsumers.asReadonly();
+        this.messageService.messages$.pipe(takeUntilDestroyed()).subscribe((message) => this.consumeMessage(message));
+        // Each time a consumer is registered/unregistered update the list of registered messages
+        effect(() => {
+            const declareMessages = getAvailableConsumers(this.consumers());
+            // registering consumed messages locally for validation
+            for (const message of declareMessages.messages) {
+                this.messageService.registerMessage(message);
+            }
+        });
+    }
+    /**
+     * Consume a received message
+     * @param message the received message body
+     */
+    async consumeMessage(message) {
+        if (isErrorMessage(message.payload)) {
+            const isHandled = await this.producerManagerService.dispatchError(message.payload);
+            if (!isHandled) {
+                // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+                // eslint-disable-next-line no-console -- placeholder for implementation with logger
+                console.warn('Error message not handled', message);
+            }
+            return;
+        }
+        return this.consumeAdditionalMessage(message);
+    }
+    /**
+     * Call the registered message callback(s) to consume the given message
+     * Handle error messages of internal communication protocol messages
+     * @param message message to consume
+     */
+    async consumeAdditionalMessage(message) {
+        if (!message.payload) {
+            // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+            // eslint-disable-next-line no-console -- placeholder for implementation with logger
+            console.warn('Cannot consume a messages with undefined payload.');
+            return;
+        }
+        // not interested in service messages like 'connect' or 'disconnect'
+        if (isServiceMessage(message.payload)) {
+            return;
+        }
+        const consumers = this.consumers();
+        const typeMatchingConsumers = consumers
+            .filter((consumer) => consumer.type === message.payload.type);
+        if (typeMatchingConsumers.length === 0) {
+            // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+            // eslint-disable-next-line no-console -- placeholder for implementation with logger
+            console.warn(`No consumer found for message type: ${message.payload.type}`);
+            return sendError(this.messageService, { reason: 'unknown_type', source: message.payload });
+        }
+        const versionMatchingConsumers = typeMatchingConsumers
+            .filter((consumer) => consumer.supportedVersions[message.payload.version])
+            .flat();
+        if (versionMatchingConsumers.length === 0) {
+            // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+            // eslint-disable-next-line no-console -- placeholder for implementation with logger
+            console.warn(`No consumer found for message version: ${message.payload.version}`);
+            return sendError(this.messageService, { reason: 'version_mismatch', source: message.payload });
+        }
+        await Promise.all(versionMatchingConsumers
+            .map(async (consumer) => {
+            try {
+                await consumer.supportedVersions[message.payload.version](message);
+            }
+            catch (error) {
+                // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+                // eslint-disable-next-line no-console -- notify directly in the console the error at message consume
+                console.error('Error while consuming message', error);
+                sendError(this.messageService, { reason: 'internal_error', source: message.payload });
+            }
+        }));
+    }
+    /**
+     * Register a message consumer
+     * @param consumer an instance of message consumer
+     */
+    register(consumer) {
+        this.registeredConsumers.update((consumers) => {
+            return [...new Set(consumers).add(consumer)];
+        });
+    }
+    /**
+     * Unregister a message consumer
+     * @param consumer an instance of message consumer
+     */
+    unregister(consumer) {
+        this.registeredConsumers.update((consumers) => {
+            return consumers.filter((c) => c !== consumer);
+        });
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ConsumerManagerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ConsumerManagerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ConsumerManagerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+/** the error message type */
+const ERROR_MESSAGE_TYPE = 'error';
+
+/**
+ * This service listens for resize messages and updates the height of elements based on the received messages.
+ */
+class ResizeConsumerService {
+    constructor() {
+        this.newHeight = signal(undefined);
+        /**
+         * A readonly signal that provides the new height information from the channel.
+         */
+        this.newHeightFromChannel = this.newHeight.asReadonly();
+        /**
+         * The type of messages this service handles ('resize').
+         */
+        this.type = RESIZE_MESSAGE_TYPE;
+        /**
+         * The supported versions of resize messages and their handlers.
+         */
+        this.supportedVersions = {
+            /**
+             * Use the message paylod to compute a new height and emit it via the public signal
+             * @param message message to consume
+             */
+            '1.0': (message) => this.newHeight.set({ height: message.payload.height, channelId: message.from })
+        };
+        this.consumerManagerService = inject(ConsumerManagerService);
+        this.start();
+        inject(DestroyRef).onDestroy(() => this.stop());
+    }
+    /**
+     * Starts the resize handler service by registering it into the consumer manager service.
+     */
+    start() {
+        this.consumerManagerService.register(this);
+    }
+    /**
+     * Stops the resize handler service by unregistering it from the consumer manager service.
+     */
+    stop() {
+        this.consumerManagerService.unregister(this);
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ResizeConsumerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ResizeConsumerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ResizeConsumerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * This service observe changes in the document's body height.
+ * When the height changes, it sends a resize message with the new height, to the connected peers
+ */
+class ResizeService {
+    constructor() {
+        this.messageService = inject((MessagePeerService));
+        /**
+         * @inheritdoc
+         */
+        this.types = RESIZE_MESSAGE_TYPE;
+        const producerManagerService = inject(ProducerManagerService);
+        producerManagerService.register(this);
+        inject(DestroyRef).onDestroy(() => {
+            this.resizeObserver?.disconnect();
+            producerManagerService.unregister(this);
+        });
+    }
+    /**
+     * @inheritdoc
+     */
+    handleError(message) {
+        // eslint-disable-next-line no-console -- error handling placeholder
+        console.error('Error in resize service message', message);
+    }
+    /**
+     * This method sets up a `ResizeObserver` to observe changes in the document's body height.
+     * When the height changes, it sends a resize message with the new height, to the connected peers
+     */
+    startResizeObserver() {
+        this.resizeObserver = new ResizeObserver(() => {
+            if (document.body.scrollHeight !== this.actualHeight) {
+                this.actualHeight = document.body.scrollHeight;
+                const messageV10 = {
+                    type: 'resize',
+                    version: '1.0',
+                    height: document.body.scrollHeight
+                };
+                // TODO: sendBest() is not implemented -- https://github.com/AmadeusITGroup/microfrontends/issues/11
+                this.messageService.send(messageV10);
+            }
+        });
+        afterNextRender(() => this.resizeObserver?.observe(document.body));
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ResizeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ResizeService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ResizeService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * A directive that adjusts the height of an element based on resize messages from a specified channel.
+ */
+class ScalableDirective {
+    constructor() {
+        /**
+         * The connection ID for the element, used as channel id backup
+         */
+        this.connect = input();
+        /**
+         * The channel id
+         */
+        this.scalable = input();
+        this.resizeHandler = inject(ResizeConsumerService);
+        /**
+         * This signal checks if the current channel requesting the resize matches the channel ID from the resize handler.
+         * If they match, it returns the new height information; otherwise, it returns undefined.
+         */
+        this.newHeightFromChannel = computed(() => {
+            const channelAskingResize = this.scalable() || this.connect();
+            const newHeightFromChannel = this.resizeHandler.newHeightFromChannel();
+            if (channelAskingResize && newHeightFromChannel?.channelId === channelAskingResize) {
+                return newHeightFromChannel;
+            }
+            return undefined;
+        });
+        const elem = inject(ElementRef);
+        const renderer = inject(Renderer2);
+        this.resizeHandler.start();
+        /** When a new height value is received set the height of the host element (in pixels) */
+        effect(() => {
+            const newHeightFromChannel = this.newHeightFromChannel();
+            if (newHeightFromChannel) {
+                renderer.setStyle(elem.nativeElement, 'height', `${newHeightFromChannel.height}px`);
+            }
+        });
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ScalableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.7", type: ScalableDirective, isStandalone: true, selector: "[scalable]", inputs: { connect: { classPropertyName: "connect", publicName: "connect", isSignal: true, isRequired: false, transformFunction: null }, scalable: { classPropertyName: "scalable", publicName: "scalable", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ScalableDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scalable]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * A service that handles navigation messages and routing.
+ *
+ * This service listens for navigation messages and updates the router state accordingly.
+ */
+class NavigationConsumerService {
+    constructor() {
+        this.router = inject(Router);
+        this.activeRoute = inject(ActivatedRoute);
+        this.requestedUrl = new Subject();
+        /**
+         * An observable that emits the requested URL and optional channel ID.
+         */
+        this.requestedUrl$ = this.requestedUrl.asObservable();
+        /**
+         * The type of messages this service handles.
+         */
+        this.type = NAVIGATION_MESSAGE_TYPE;
+        /**
+         * @inheritdoc
+         */
+        this.supportedVersions = {
+            /**
+             * Use the message paylod to compute a new url and emit it via the public subject
+             * Additionally navigate to the new url
+             * @param message message to consume
+             */
+            '1.0': (message) => {
+                const channelId = message.from || undefined;
+                this.requestedUrl.next({ url: message.payload.url, channelId });
+                this.navigate(message.payload.url, channelId);
+            }
+        };
+        this.consumerManagerService = inject(ConsumerManagerService);
+        this.start();
+        inject(DestroyRef).onDestroy(() => this.stop());
+    }
+    /**
+     * Parses a URL and returns an object containing the paths and query parameters.
+     * @param url - The URL to parse.
+     * @returns An object containing the paths and query parameters.
+     */
+    parseUrl(url) {
+        const urlObject = new URL(window.origin + url);
+        const paths = urlObject.pathname.split('/').filter((segment) => !!segment);
+        const queryParams = Object.fromEntries(urlObject.searchParams.entries());
+        return { paths, queryParams };
+    }
+    /**
+     * Navigates to the specified URL with optional channel ID.
+     * @param url - The URL to navigate to.
+     * @param channelId - The optional channel ID for the navigation state. This is the endpoint from where the message is received
+     */
+    navigate(url, channelId) {
+        const { paths, queryParams } = this.parseUrl(url);
+        void this.router.navigate(paths, { relativeTo: this.activeRoute.children.at(-1), queryParams, state: { channelId }, replaceUrl: true });
+    }
+    /**
+     * @inheritdoc
+     */
+    start() {
+        this.consumerManagerService.register(this);
+    }
+    /**
+     * @inheritdoc
+     */
+    stop() {
+        this.consumerManagerService.unregister(this);
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: NavigationConsumerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: NavigationConsumerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: NavigationConsumerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * This service allows routes to be memorized with an optional lifetime and provides methods to retrieve and manage these routes.
+ */
+class RouteMemorizeService {
+    constructor() {
+        this.routeTimers = {};
+        /** All memorized routes */
+        this.routeStack = {};
+    }
+    /**
+     * Memorizes a route for a given channel ID with an optional lifetime.
+     * @param channelId - The ID of the channel to memorize the route for.
+     * @param url - The URL of the route to memorize.
+     * @param liveTime - The optional lifetime of the memorized route in milliseconds. If provided, the route will be removed after this time.
+     */
+    memorizeRoute(channelId, url, liveTime) {
+        this.routeStack[channelId] = url;
+        const timerRef = this.routeTimers[channelId];
+        if (timerRef) {
+            clearTimeout(timerRef);
+        }
+        if (liveTime && liveTime > 0) {
+            this.routeTimers[channelId] = setTimeout(() => {
+                delete this.routeStack[channelId];
+                delete this.routeTimers[channelId];
+            }, liveTime);
+        }
+    }
+    /**
+     * Retrieves the memorized route for a given channel ID.
+     * @param channelId - The ID of the channel to retrieve the memorized route for.
+     * @returns The memorized route URL or undefined if no route is memorized for the given channel ID.
+     */
+    getRoute(channelId) {
+        return this.routeStack[channelId];
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RouteMemorizeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RouteMemorizeService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RouteMemorizeService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class RouteMemorizeDirective {
+    constructor() {
+        /**
+         * Whether to memorize the route.
+         * Default is true.
+         */
+        this.memorizeRoute = input(true);
+        /**
+         * The ID used to memorize the route.
+         */
+        this.memorizeRouteId = input();
+        /**
+         * The maximum age for memorizing the route.
+         * Default is 0.
+         */
+        this.memorizeMaxAge = input(0);
+        /**
+         * The maximum age for memorizing the route, used as a fallback.
+         * Default is 0.
+         */
+        this.memorizeRouteMaxAge = input(0);
+        /**
+         * The connection ID for the iframe where the actual directive is applied.
+         */
+        this.connect = input();
+        this.maxAge = computed(() => {
+            return this.memorizeMaxAge() || this.memorizeRouteMaxAge();
+        });
+        const memory = inject(RouteMemorizeService);
+        const requestedUrlSignal = toSignal(inject(NavigationConsumerService).requestedUrl$);
+        /**
+         * This effect listens for changes in the `memorizeRoute`, `requestedUrlSignal`, and `memorizeRouteId` or `connect` inputs.
+         * If `memorizeRoute` is not false and a requested URL with a matching channel ID is found, it memorizes the route using the route memory service.
+         */
+        effect(() => {
+            const memorizeRoute = this.memorizeRoute();
+            if (memorizeRoute === false) {
+                return;
+            }
+            const requested = requestedUrlSignal();
+            const id = this.memorizeRouteId() || this.connect();
+            if (requested && id && requested.channelId === id) {
+                memory.memorizeRoute(id, requested.url, untracked(this.maxAge));
+            }
+        });
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RouteMemorizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.7", type: RouteMemorizeDirective, isStandalone: true, selector: "iframe[memorizeRoute]", inputs: { memorizeRoute: { classPropertyName: "memorizeRoute", publicName: "memorizeRoute", isSignal: true, isRequired: false, transformFunction: null }, memorizeRouteId: { classPropertyName: "memorizeRouteId", publicName: "memorizeRouteId", isSignal: true, isRequired: false, transformFunction: null }, memorizeMaxAge: { classPropertyName: "memorizeMaxAge", publicName: "memorizeMaxAge", isSignal: true, isRequired: false, transformFunction: null }, memorizeRouteMaxAge: { classPropertyName: "memorizeRouteMaxAge", publicName: "memorizeRouteMaxAge", isSignal: true, isRequired: false, transformFunction: null }, connect: { classPropertyName: "connect", publicName: "connect", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RouteMemorizeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'iframe[memorizeRoute]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * A service that handles routing and message production for navigation events.
+ *
+ * This service listens to Angular router events and sends navigation messages
+ * to a message peer service. It also handles errors related to navigation messages.
+ */
+class RoutingService {
+    constructor() {
+        this.router = inject(Router);
+        this.activatedRoute = inject(ActivatedRoute);
+        this.messageService = inject((MessagePeerService));
+        /**
+         * @inheritdoc
+         */
+        this.types = NAVIGATION_MESSAGE_TYPE;
+        const producerManagerService = inject(ProducerManagerService);
+        producerManagerService.register(this);
+        inject(DestroyRef).onDestroy(() => {
+            producerManagerService.unregister(this);
+        });
+    }
+    /**
+     * @inheritdoc
+     */
+    handleError(message) {
+        // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+        // eslint-disable-next-line no-console -- placeholder for the implementation with a logger
+        console.error('Error in navigation service message', message);
+    }
+    /**
+     * Handles embedded routing by listening to router events and sending navigation messages to the connected endpoints.
+     * It can be a parent window or another iframe
+     * @note - This method has to be called in an injection context
+     * @param options - Optional parameters to control the routing behavior {@see RoutingServiceOptions}.
+     */
+    handleEmbeddedRouting(options) {
+        const subRouteOnly = options?.subRouteOnly ?? false;
+        this.router.events.pipe(takeUntilDestroyed(), filter((event) => event instanceof NavigationEnd), map(({ urlAfterRedirects }) => {
+            const channelId = this.router.getCurrentNavigation()?.extras?.state?.channelId;
+            const currentRouteRegExp = subRouteOnly && this.activatedRoute.routeConfig?.path && new RegExp('^' + this.activatedRoute.routeConfig.path.replace(/(?=\W)/g, '\\'), 'i');
+            return ({ url: currentRouteRegExp ? urlAfterRedirects.replace(currentRouteRegExp, '') : urlAfterRedirects, channelId });
+        })).subscribe(({ url, channelId }) => {
+            const messageV10 = {
+                type: 'navigation',
+                version: '1.0',
+                url
+            };
+            // TODO: sendBest() is not implemented -- https://github.com/AmadeusITGroup/microfrontends/issues/11
+            if (document.referrer) {
+                this.messageService.send(messageV10);
+            }
+            else {
+                if (channelId === undefined) {
+                    // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+                    // eslint-disable-next-line no-console -- warning message as channel id not mandatory
+                    console.warn('No channelId provided for navigation message');
+                }
+                else {
+                    try {
+                        this.messageService.send(messageV10, { to: [channelId] });
+                    }
+                    catch (error) {
+                        // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+                        // eslint-disable-next-line no-console -- send the error in the console, do not fail silently
+                        console.error('Error sending navigation message', error);
+                    }
+                }
+            }
+        });
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RoutingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RoutingService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RoutingService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * A pipe that restores a route with optional query parameters and memory channel ID.
+ *
+ * This pipe is used to transform a URL or SafeResourceUrl by appending query parameters
+ * and adjusting the pathname based on the current active route and memorized route.
+ */
+class RestoreRoute {
+    constructor() {
+        this.activeRoute = inject(ActivatedRoute);
+        this.domSanitizer = inject(DomSanitizer);
+        this.routeMemorizeService = inject(RouteMemorizeService, { optional: true });
+    }
+    transform(url, options) {
+        const urlString = typeof url === 'string'
+            ? url
+            : this.domSanitizer.sanitize(SecurityContext.RESOURCE_URL, url || null);
+        if (!url) {
+            return undefined;
+        }
+        if (urlString) {
+            const moduleUrl = new URL(urlString);
+            const queryParamsModule = new URLSearchParams(moduleUrl.searchParams);
+            const channelId = options?.memoryChannelId;
+            const memorizedRoute = channelId && this.routeMemorizeService?.getRoute(channelId);
+            const topWindowUrl = new URL(memorizedRoute ? window.origin + memorizedRoute : window.location.href);
+            const queryParamsTopWindow = new URLSearchParams(topWindowUrl.search);
+            if (options?.propagateQueryParams) {
+                for (const [key, value] of queryParamsTopWindow) {
+                    if (options?.overrideQueryParams || !queryParamsModule.has(key)) {
+                        queryParamsModule.set(key, value);
+                    }
+                }
+            }
+            moduleUrl.search = queryParamsModule.toString();
+            moduleUrl.pathname += topWindowUrl.pathname.split(`/${this.activeRoute.routeConfig?.path}`).pop() || '';
+            moduleUrl.pathname = moduleUrl.pathname.replace(/\/{2,}/g, '/');
+            const moduleUrlStringyfied = moduleUrl.toString();
+            return typeof url === 'string' ? moduleUrlStringyfied : this.domSanitizer.bypassSecurityTrustResourceUrl(moduleUrlStringyfied);
+        }
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RestoreRoute, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    /** @nocollapse */ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.1.7", ngImport: i0, type: RestoreRoute, isStandalone: true, name: "restoreRoute" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: RestoreRoute, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'restoreRoute'
+                }]
+        }] });
+
+/** Default suffix for an url containing a theme css file */
+const THEME_URL_SUFFIX = '-theme.css';
+/** Default name for the query parameter containing the theme name */
+const THEME_QUERY_PARAM_NAME = 'theme';
+/**
+ * Fetches a CSS document and returns the content as a string.
+ * @param cssPath - The path to download the CSS.
+ * @returns The content of the CSS document as a string, empty string if the fetch fails.
+ */
+async function getStyle(cssPath) {
+    try {
+        const myRequest = new Request(cssPath);
+        const response = await fetch(myRequest);
+        const cssText = response.ok ? await response.text() : '';
+        return cssText;
+    }
+    catch (error) {
+        // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+        // eslint-disable-next-line no-console -- display the warning instead of failing silently
+        console.warn(`Failed to download style from: ${cssPath} with error: ${error?.toString()}`);
+    }
+    return '';
+}
+/**
+ * Applies the given CSS theme as a stylesheet.
+ * @param themeValue - CSS as text containing a theme definition.
+ * @param cleanPrevious - Whether to remove previously applied stylesheets if no themeValue provided. Default is true.
+ */
+function applyTheme(themeValue, cleanPrevious = true) {
+    if (themeValue !== undefined) {
+        const sheet = new CSSStyleSheet();
+        sheet.replaceSync(themeValue);
+        document.adoptedStyleSheets = cleanPrevious ? [sheet] : [...document.adoptedStyleSheets, sheet];
+    }
+    else if (cleanPrevious) { // remove the styles if the theme value comes undefined or empty string
+        document.adoptedStyleSheets = [];
+    }
+}
+/**
+ * Applies the initial theme based on the URL query parameters.
+ *
+ * This function fetches the CSS theme specified in the URL query parameters and applies it as a stylesheet.
+ * If a referrer is present, it also attempts to fetch and apply the theme from the referrer's URL.
+ */
+async function applyInitialTheme() {
+    const searchParams = new URLSearchParams(window.location.search);
+    let cssHref = searchParams.get(THEME_QUERY_PARAM_NAME);
+    document.adoptedStyleSheets = [];
+    if (cssHref) {
+        cssHref = `${cssHref.endsWith('.css') ? cssHref : cssHref + THEME_URL_SUFFIX}`;
+        const themeRequest = [];
+        themeRequest.push(getStyle(cssHref).then((styleToApply) => applyTheme(styleToApply, false)));
+        if (document.referrer) {
+            const url = new URL(document.referrer);
+            url.pathname += `${url.pathname.endsWith('/') ? '' : '/'}${cssHref}`;
+            themeRequest.push(getStyle(url.toString()).then((styleToApply) => applyTheme(styleToApply, false)));
+        }
+        return Promise.allSettled(themeRequest);
+    }
+    return undefined;
+}
+
+/**
+ * This service exposing the current theme signal
+ */
+class ThemeProducerService {
+    constructor() {
+        this.messageService = inject((MessagePeerService));
+        /**
+         * The type of messages this service handles ('theme').
+         */
+        this.types = THEME_MESSAGE_TYPE;
+        const producerManagerService = inject(ProducerManagerService);
+        producerManagerService.register(this);
+        inject(DestroyRef).onDestroy(() => {
+            producerManagerService.unregister(this);
+        });
+        // get the current theme name from the url (if any) and emit a first value for the current theme
+        const parentUrl = new URL(window.location.toString());
+        const selectedThemeName = parentUrl.searchParams.get(THEME_QUERY_PARAM_NAME);
+        this.currentThemeSelection = signal(selectedThemeName
+            ? {
+                name: selectedThemeName,
+                css: null
+            }
+            : undefined);
+        this.currentTheme = this.currentThemeSelection.asReadonly();
+        if (selectedThemeName) {
+            void this.changeTheme(selectedThemeName);
+        }
+        // When the current theme changes, apply it to the current application
+        effect(() => {
+            const themeObj = this.currentTheme();
+            if (themeObj?.css !== null) {
+                applyTheme(themeObj?.css);
+            }
+        });
+        /**
+         * This effect listens for changes in the `currentTheme` signal. If a valid theme object with CSS is present,
+         * it creates a theme message and sends it via the message service.
+         */
+        effect(() => {
+            const themeObj = this.currentTheme();
+            if (themeObj && themeObj.css !== null) {
+                const messageV10 = {
+                    type: 'theme',
+                    name: themeObj.name,
+                    css: themeObj.css,
+                    version: '1.0'
+                };
+                // TODO: sendBest() is not yet implemented -- https://github.com/AmadeusITGroup/microfrontends/issues/11
+                this.messageService.send(messageV10);
+            }
+        });
+    }
+    /**
+     * Changes the current theme to the specified theme name.
+     * @param themeName - The name of the theme to change to.
+     */
+    async changeTheme(themeName) {
+        const cssHref = themeName && `${themeName}${THEME_URL_SUFFIX}`;
+        const styleObj = cssHref ? await getStyle(cssHref) : '';
+        this.currentThemeSelection.update((theme) => {
+            this.previousTheme = theme;
+            return themeName
+                ? { name: themeName, css: styleObj }
+                : undefined;
+        });
+    }
+    /**
+     * Reverts to the previous theme.
+     */
+    revertToPreviousTheme() {
+        this.currentThemeSelection.set(this.previousTheme);
+    }
+    /**
+     * @inheritdoc
+     */
+    handleError(message) {
+        // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+        // eslint-disable-next-line no-console -- error message should be made available with the logger
+        console.error('Error in theme service message', message);
+        this.revertToPreviousTheme();
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeProducerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeProducerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeProducerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * A pipe that applies the current theme from a theme manager service, to a given URL or SafeResourceUrl, as query param
+ */
+class ApplyTheme {
+    constructor() {
+        this.themeManagerService = inject(ThemeProducerService);
+        this.domSanitizer = inject(DomSanitizer);
+    }
+    transform(url) {
+        if (!url) {
+            return undefined;
+        }
+        const currentTheme = this.themeManagerService.currentTheme();
+        const urlString = typeof url === 'string'
+            ? url
+            : this.domSanitizer.sanitize(SecurityContext.RESOURCE_URL, url);
+        if (urlString) {
+            const moduleUrl = new URL(urlString);
+            if (currentTheme) {
+                moduleUrl.searchParams.set('theme', currentTheme.name);
+            }
+            const moduleUrlStringyfied = moduleUrl.toString();
+            return typeof url === 'string' ? moduleUrlStringyfied : this.domSanitizer.bypassSecurityTrustResourceUrl(moduleUrlStringyfied);
+        }
+        return undefined;
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ApplyTheme, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    /** @nocollapse */ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.1.7", ngImport: i0, type: ApplyTheme, isStandalone: true, name: "applyTheme" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ApplyTheme, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'applyTheme'
+                }]
+        }] });
+
+/**
+ * A service that handles theme messages and applies the received theme.
+ */
+class ThemeConsumerService {
+    constructor() {
+        this.domSanitizer = inject(DomSanitizer);
+        this.consumerManagerService = inject(ConsumerManagerService);
+        /**
+         * The type of messages this service handles ('theme').
+         */
+        this.type = THEME_MESSAGE_TYPE;
+        /**
+         * The supported versions of theme messages and their handlers.
+         */
+        this.supportedVersions = {
+            /**
+             * Use the message paylod to get the theme and apply it
+             * @param message message to consume
+             */
+            '1.0': (message) => {
+                const sanitizedCss = this.domSanitizer.sanitize(SecurityContext.STYLE, message.payload.css);
+                if (sanitizedCss !== null) {
+                    applyTheme(sanitizedCss);
+                }
+            }
+        };
+        this.start();
+        inject(DestroyRef).onDestroy(() => this.stop());
+    }
+    /**
+     * Starts the theme handler service by registering it into the consumer manager service.
+     */
+    start() {
+        this.consumerManagerService.register(this);
+    }
+    /**
+     * Stops the theme handler service by unregistering it from the consumer manager service.
+     */
+    stop() {
+        this.consumerManagerService.unregister(this);
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeConsumerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeConsumerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ThemeConsumerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+class ConnectDirective {
+    /**
+     * Binds the `src` attribute of the iframe to the sanitized source URL.
+     */
+    get srcAttr() {
+        return this.src();
+    }
+    constructor() {
+        /**
+         * The connection ID required for the message peer service.
+         */
+        this.connect = input.required();
+        /**
+         * The sanitized source URL for the iframe.
+         */
+        this.src = input();
+        this.messageService = inject(MessagePeerService);
+        this.domSanitizer = inject(DomSanitizer);
+        this.elRef = inject(ElementRef);
+        this.clientOrigin = computed(() => {
+            const src = this.src();
+            const srcString = src && this.domSanitizer.sanitize(SecurityContext.RESOURCE_URL, src);
+            return srcString && new URL(srcString).origin;
+        });
+        // When the origin url or the peer id changes it will remake the connection with the new updates. The old connection is closed
+        effect(async () => {
+            const clientOrigin = this.clientOrigin();
+            const connectId = this.connect();
+            const moduleWindow = this.elRef.nativeElement.contentWindow;
+            this.messageService.disconnect();
+            if (clientOrigin && moduleWindow) {
+                try {
+                    await this.messageService.listen(connectId, {
+                        window: moduleWindow,
+                        origin: clientOrigin
+                    });
+                }
+                catch (e) {
+                    // TODO https://github.com/AmadeusITGroup/otter/issues/2887 - proper logger
+                    // eslint-disable-next-line no-console -- log the error - replace this with a proper logger
+                    console.error(e);
+                }
+            }
+        });
+        // When the directive is destroyed clean up the connection too.
+        inject(DestroyRef).onDestroy(() => this.messageService.disconnect());
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ConnectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.7", type: ConnectDirective, isStandalone: true, selector: "iframe[connect]", inputs: { connect: { classPropertyName: "connect", publicName: "connect", isSignal: true, isRequired: true, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "src": "this.srcAttr" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ConnectDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'iframe[connect]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [], propDecorators: { srcAttr: [{
+                type: HostBinding,
+                args: ['src']
+            }] } });
+
+/**
+ * A constant array of known message types and their versions.
+ */
+const KNOWN_MESSAGES = [
+    {
+        type: ERROR_MESSAGE_TYPE,
+        version: '1.0'
+    }
+];
+/**
+ * Returns the default options for starting a client endpoint peer connection.
+ * As origin it will take the parent origin and the window will be the parent window
+ */
+function getDefaultClientEndpointStartOptions() {
+    if (document.referrer) {
+        return {
+            origin: new URL(document.referrer).origin,
+            window: window.parent
+        };
+    }
+    return {};
+}
+
+/**
+ * Provide the communication protocol connection configuration
+ * @param connectionConfig The identifier of the application in the communication protocol ecosystem plus the types of messages able to exchange
+ */
+function provideConnection(connectionConfig) {
+    const config = { id: connectionConfig.id, knownMessages: [...KNOWN_MESSAGES, ...(connectionConfig.knownMessages || [])] };
+    return makeEnvironmentProviders([
+        {
+            provide: MESSAGE_PEER_CONFIG, useValue: config
+        },
+        {
+            provide: MESSAGE_PEER_CONNECT_OPTIONS, useValue: getDefaultClientEndpointStartOptions()
+        },
+        {
+            // in the case of the ConnectionService will extends the base service 'useExisting' should be used
+            provide: MessagePeerService, useClass: MessagePeerService, deps: [MESSAGE_PEER_CONFIG]
+        }
+    ]);
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ApplyTheme, ConnectDirective, ConsumerManagerService, ERROR_MESSAGE_TYPE, KNOWN_MESSAGES, NavigationConsumerService, ProducerManagerService, ResizeConsumerService, ResizeService, RestoreRoute, RouteMemorizeDirective, RouteMemorizeService, RoutingService, ScalableDirective, THEME_QUERY_PARAM_NAME, THEME_URL_SUFFIX, ThemeConsumerService, ThemeProducerService, applyInitialTheme, applyTheme, getAvailableConsumers, getDefaultClientEndpointStartOptions, getStyle, isErrorMessage, provideConnection, sendError };
+//# sourceMappingURL=ama-mfe-ng-utils.mjs.map