mn-angular-lib 0.0.95 → 0.0.96

package/fesm2022/mn-angular-lib.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, Optional, Inject, HostBinding, Input, Component, inject, ChangeDetectionStrategy, signal, ElementRef, DestroyRef, Self, APP_INITIALIZER, HostListener, ViewChild, forwardRef, Directive, Renderer2, EventEmitter, ChangeDetectorRef, TemplateRef, Output, ViewContainerRef, ViewChildren, ApplicationRef, EnvironmentInjector, createComponent, Pipe, SkipSelf, Attribute } from '@angular/core';
+import { InjectionToken, Injectable, Optional, Inject, HostBinding, Input, Component, inject, ChangeDetectionStrategy, signal, ElementRef, DestroyRef, Self, APP_INITIALIZER, SkipSelf, Attribute, Directive, Pipe, HostListener, ViewChild, forwardRef, Renderer2, EventEmitter, ChangeDetectorRef, TemplateRef, Output, ViewContainerRef, ViewChildren, ApplicationRef, EnvironmentInjector, createComponent } from '@angular/core';
 export { TemplateRef, Type } from '@angular/core';
 import { BehaviorSubject, firstValueFrom, skip, Subject, debounceTime, of, takeUntil, map, catchError } from 'rxjs';
 import * as i1 from '@angular/common';
@@ -1932,6 +1932,9 @@ const mnDatetimeVariants = tv({
         fullWidth: {
             true: 'w-full',
         },
+        hover: {
+            true: 'hover:cursor-pointer hover:bg-base-200',
+        },
     },
     defaultVariants: {
         size: 'md',
@@ -1939,6 +1942,140 @@ const mnDatetimeVariants = tv({
     },
 });
 
+class MnSectionDirective {
+    /** Section name contributed by this DOM node to the section path */
+    mnSection;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnSectionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: MnSectionDirective, isStandalone: true, selector: "[mn-section]", inputs: { mnSection: ["mn-section", "mnSection"] }, providers: [
+            {
+                provide: MN_SECTION_PATH,
+                // Read parent MN_SECTION_PATH from ancestor injector (skipSelf to avoid self-reference),
+                // and read the attribute value using Attribute so it's available at provider creation time.
+                deps: [[new Optional(), new SkipSelf(), MN_SECTION_PATH], new Attribute('mn-section')],
+                useFactory: (parentPath, attr) => {
+                    const parent = Array.isArray(parentPath) ? parentPath : [];
+                    const name = (attr ?? '').trim();
+                    return name ? [...parent, name] : [...parent];
+                },
+            },
+        ], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnSectionDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mn-section]',
+                    standalone: true,
+                    providers: [
+                        {
+                            provide: MN_SECTION_PATH,
+                            // Read parent MN_SECTION_PATH from ancestor injector (skipSelf to avoid self-reference),
+                            // and read the attribute value using Attribute so it's available at provider creation time.
+                            deps: [[new Optional(), new SkipSelf(), MN_SECTION_PATH], new Attribute('mn-section')],
+                            useFactory: (parentPath, attr) => {
+                                const parent = Array.isArray(parentPath) ? parentPath : [];
+                                const name = (attr ?? '').trim();
+                                return name ? [...parent, name] : [...parent];
+                            },
+                        },
+                    ],
+                }]
+        }], propDecorators: { mnSection: [{
+                type: Input,
+                args: ['mn-section']
+            }] } });
+
+class MnInstanceDirective {
+    /** Instance id for targeting per-component instance overrides */
+    mnInstance;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnInstanceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: MnInstanceDirective, isStandalone: true, selector: "[mn-instance]", inputs: { mnInstance: ["mn-instance", "mnInstance"] }, providers: [
+            {
+                provide: MN_INSTANCE_ID,
+                // Read the attribute at provider creation time using Attribute token; Inputs may not be set yet.
+                deps: [new Attribute('mn-instance')],
+                useFactory: (attr) => (attr ?? '').trim() || null,
+            },
+        ], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnInstanceDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mn-instance]',
+                    standalone: true,
+                    providers: [
+                        {
+                            provide: MN_INSTANCE_ID,
+                            // Read the attribute at provider creation time using Attribute token; Inputs may not be set yet.
+                            deps: [new Attribute('mn-instance')],
+                            useFactory: (attr) => (attr ?? '').trim() || null,
+                        },
+                    ],
+                }]
+        }], propDecorators: { mnInstance: [{
+                type: Input,
+                args: ['mn-instance']
+            }] } });
+
+/**
+ * Provides an APP_INITIALIZER that configures the MnLanguageService and
+ * preloads the requested locales during application bootstrap.
+ *
+ * Usage in app.config.ts:
+ *   ...provideMnLanguage({
+ *     urlPattern: 'assets/i18n/{locale}.json',
+ *     defaultLocale: 'en',
+ *     preload: ['en', 'nl'],
+ *   })
+ */
+function provideMnLanguage(config) {
+    return [
+        {
+            provide: APP_INITIALIZER,
+            multi: true,
+            useFactory: (svc) => async () => {
+                if (config.debug) {
+                    svc.setDebug(true);
+                }
+                svc.configure(config.urlPattern);
+                const effectiveLocale = svc.resolveLocaleForDomain(config.domainLocaleMap, config.defaultLocale);
+                const localesToLoad = config.preload ?? [effectiveLocale];
+                await Promise.all(localesToLoad.map(l => svc.loadLocale(l)));
+                await svc.setLocale(effectiveLocale);
+            },
+            deps: [MnLanguageService],
+        },
+    ];
+}
+
+/**
+ * Pipe that translates a key via MnLanguageService.
+ *
+ * Usage in templates:
+ *   {{ 'form.email.label' | mnTranslate }}
+ *   {{ 'greeting' | mnTranslate:{ name: 'World' } }}
+ *
+ * Note: This pipe is impure so it re-evaluates when the locale changes.
+ */
+class MnTranslatePipe {
+    lang;
+    constructor(lang) {
+        this.lang = lang;
+    }
+    transform(key, params) {
+        return this.lang.translate(key, params);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnTranslatePipe, deps: [{ token: MnLanguageService }], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.1.3", ngImport: i0, type: MnTranslatePipe, isStandalone: true, name: "mnTranslate", pure: false });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnTranslatePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'mnTranslate',
+                    standalone: true,
+                    pure: false,
+                }]
+        }], ctorParameters: () => [{ type: MnLanguageService }] });
+
 const MN_DATETIME_CONFIG = new InjectionToken('MN_DATETIME_CONFIG');
 class MnDatetime {
     ngControl;
@@ -2080,14 +2217,15 @@ class MnDatetime {
             borderRadius: this.props.borderRadius,
             shadow: this.props.shadow,
             fullWidth: this.props.fullWidth,
+            hover: this.props.hover,
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnDatetime, deps: [{ token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: MnDatetime, isStandalone: true, selector: "mn-lib-datetime", inputs: { props: "props" }, ngImport: i0, template: "<div class=\"flex flex-col h-full\" [class.is-fullwidth]=\"props.fullWidth\">\n  @if (uiConfig.label || props.label) {\n    <label class=\"pl-2 pb-1 flex flex-row gap-x-0.5! text-base!\" [attr.for]=\"resolvedId\">\n      <p>{{ uiConfig.label || props.label }}</p>\n      @if (isRequired()) {\n        <span class=\"text-red-500\">*</span>\n      }\n    </label>\n  }\n\n  <input\n    [id]=\"resolvedId\"\n    [attr.name]=\"resolvedName\"\n    [type]=\"resolvedMode\"\n    [attr.placeholder]=\"uiConfig.placeholder || props.placeholder || null\"\n    [attr.aria-label]=\"uiConfig.ariaLabel || uiConfig.label || props.label || null\"\n    [attr.aria-invalid]=\"showError || null\"\n    [attr.aria-describedby]=\"showError ? resolvedId + '-error' : null\"\n    [disabled]=\"isDisabled\"\n    [attr.min]=\"props.min || null\"\n    [attr.max]=\"props.max || null\"\n    [attr.step]=\"props.step || null\"\n    [value]=\"value ?? ''\"\n    [ngClass]=\"inputClasses\"\n    (input)=\"handleInput(($any($event.target)).value)\"\n    (blur)=\"handleBlur()\"\n    class=\"hover:cursor-pointer hover:bg-base-200 \"\n  />\n\n  @if (showError) {\n    @if (props.showAllErrors) {\n      <div class=\"flex flex-col gap-y-1\">\n        @for (error of errorMessages; track $index) {\n          <lib-mn-error-message [errorMessage]=\"error\" [id]=\"resolvedId + '-' + $index\"></lib-mn-error-message>\n        }\n      </div>\n    } @else {\n      @if (errorMessage != null) {\n        <lib-mn-error-message [errorMessage]=\"errorMessage\" [id]=\"resolvedId\"></lib-mn-error-message>\n      }\n    }\n  }\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MnErrorMessage, selector: "lib-mn-error-message", inputs: ["errorMessage", "id"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: MnDatetime, isStandalone: true, selector: "mn-lib-datetime", inputs: { props: "props" }, ngImport: i0, template: "<div class=\"flex flex-col h-full\" [class.is-fullwidth]=\"props.fullWidth\">\n  @if (uiConfig.label || props.label) {\n    <label class=\"pl-2 pb-1 flex flex-row gap-x-0.5! text-base!\" [attr.for]=\"resolvedId\">\n      <p>{{ uiConfig.label || props.label }}</p>\n      @if (isRequired()) {\n        <span class=\"text-red-500\">*</span>\n      }\n    </label>\n  }\n\n  <input\n    [id]=\"resolvedId\"\n    [attr.name]=\"resolvedName\"\n    [type]=\"resolvedMode\"\n    [attr.placeholder]=\"uiConfig.placeholder || props.placeholder || null\"\n    [attr.aria-label]=\"uiConfig.ariaLabel || uiConfig.label || props.label || null\"\n    [attr.aria-invalid]=\"showError || null\"\n    [attr.aria-describedby]=\"showError ? resolvedId + '-error' : null\"\n    [disabled]=\"isDisabled\"\n    [attr.min]=\"props.min || null\"\n    [attr.max]=\"props.max || null\"\n    [attr.step]=\"props.step || null\"\n    [value]=\"value ?? ''\"\n    [ngClass]=\"inputClasses\"\n    (input)=\"handleInput(($any($event.target)).value)\"\n    (blur)=\"handleBlur()\"\n  />\n\n  @if (showError) {\n    @if (props.showAllErrors) {\n      <div class=\"flex flex-col gap-y-1\">\n        @for (error of errorMessages; track $index) {\n          <lib-mn-error-message [errorMessage]=\"error\" [id]=\"resolvedId + '-' + $index\"></lib-mn-error-message>\n        }\n      </div>\n    } @else {\n      @if (errorMessage != null) {\n        <lib-mn-error-message [errorMessage]=\"errorMessage\" [id]=\"resolvedId\"></lib-mn-error-message>\n      }\n    }\n  }\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MnErrorMessage, selector: "lib-mn-error-message", inputs: ["errorMessage", "id"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnDatetime, decorators: [{
             type: Component,
-            args: [{ selector: 'mn-lib-datetime', standalone: true, imports: [NgClass, MnErrorMessage], template: "<div class=\"flex flex-col h-full\" [class.is-fullwidth]=\"props.fullWidth\">\n  @if (uiConfig.label || props.label) {\n    <label class=\"pl-2 pb-1 flex flex-row gap-x-0.5! text-base!\" [attr.for]=\"resolvedId\">\n      <p>{{ uiConfig.label || props.label }}</p>\n      @if (isRequired()) {\n        <span class=\"text-red-500\">*</span>\n      }\n    </label>\n  }\n\n  <input\n    [id]=\"resolvedId\"\n    [attr.name]=\"resolvedName\"\n    [type]=\"resolvedMode\"\n    [attr.placeholder]=\"uiConfig.placeholder || props.placeholder || null\"\n    [attr.aria-label]=\"uiConfig.ariaLabel || uiConfig.label || props.label || null\"\n    [attr.aria-invalid]=\"showError || null\"\n    [attr.aria-describedby]=\"showError ? resolvedId + '-error' : null\"\n    [disabled]=\"isDisabled\"\n    [attr.min]=\"props.min || null\"\n    [attr.max]=\"props.max || null\"\n    [attr.step]=\"props.step || null\"\n    [value]=\"value ?? ''\"\n    [ngClass]=\"inputClasses\"\n    (input)=\"handleInput(($any($event.target)).value)\"\n    (blur)=\"handleBlur()\"\n    class=\"hover:cursor-pointer hover:bg-base-200 \"\n  />\n\n  @if (showError) {\n    @if (props.showAllErrors) {\n      <div class=\"flex flex-col gap-y-1\">\n        @for (error of errorMessages; track $index) {\n          <lib-mn-error-message [errorMessage]=\"error\" [id]=\"resolvedId + '-' + $index\"></lib-mn-error-message>\n        }\n      </div>\n    } @else {\n      @if (errorMessage != null) {\n        <lib-mn-error-message [errorMessage]=\"errorMessage\" [id]=\"resolvedId\"></lib-mn-error-message>\n      }\n    }\n  }\n</div>\n" }]
+            args: [{ selector: 'mn-lib-datetime', standalone: true, imports: [NgClass, MnErrorMessage], template: "<div class=\"flex flex-col h-full\" [class.is-fullwidth]=\"props.fullWidth\">\n  @if (uiConfig.label || props.label) {\n    <label class=\"pl-2 pb-1 flex flex-row gap-x-0.5! text-base!\" [attr.for]=\"resolvedId\">\n      <p>{{ uiConfig.label || props.label }}</p>\n      @if (isRequired()) {\n        <span class=\"text-red-500\">*</span>\n      }\n    </label>\n  }\n\n  <input\n    [id]=\"resolvedId\"\n    [attr.name]=\"resolvedName\"\n    [type]=\"resolvedMode\"\n    [attr.placeholder]=\"uiConfig.placeholder || props.placeholder || null\"\n    [attr.aria-label]=\"uiConfig.ariaLabel || uiConfig.label || props.label || null\"\n    [attr.aria-invalid]=\"showError || null\"\n    [attr.aria-describedby]=\"showError ? resolvedId + '-error' : null\"\n    [disabled]=\"isDisabled\"\n    [attr.min]=\"props.min || null\"\n    [attr.max]=\"props.max || null\"\n    [attr.step]=\"props.step || null\"\n    [value]=\"value ?? ''\"\n    [ngClass]=\"inputClasses\"\n    (input)=\"handleInput(($any($event.target)).value)\"\n    (blur)=\"handleBlur()\"\n  />\n\n  @if (showError) {\n    @if (props.showAllErrors) {\n      <div class=\"flex flex-col gap-y-1\">\n        @for (error of errorMessages; track $index) {\n          <lib-mn-error-message [errorMessage]=\"error\" [id]=\"resolvedId + '-' + $index\"></lib-mn-error-message>\n        }\n      </div>\n    } @else {\n      @if (errorMessage != null) {\n        <lib-mn-error-message [errorMessage]=\"errorMessage\" [id]=\"resolvedId\"></lib-mn-error-message>\n      }\n    }\n  }\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$2.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -6817,35 +6955,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
 
 // Main component
 
-/**
- * Pipe that translates a key via MnLanguageService.
- *
- * Usage in templates:
- *   {{ 'form.email.label' | mnTranslate }}
- *   {{ 'greeting' | mnTranslate:{ name: 'World' } }}
- *
- * Note: This pipe is impure so it re-evaluates when the locale changes.
- */
-class MnTranslatePipe {
-    lang;
-    constructor(lang) {
-        this.lang = lang;
-    }
-    transform(key, params) {
-        return this.lang.translate(key, params);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnTranslatePipe, deps: [{ token: MnLanguageService }], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.1.3", ngImport: i0, type: MnTranslatePipe, isStandalone: true, name: "mnTranslate", pure: false });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnTranslatePipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'mnTranslate',
-                    standalone: true,
-                    pure: false,
-                }]
-        }], ctorParameters: () => [{ type: MnLanguageService }] });
-
 /**
  * Tab component that renders a horizontal tab bar.
  * Supports translation keys for labels via MnTranslatePipe.
@@ -6888,80 +6997,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
                 type: Output
             }] } });
 
-class MnSectionDirective {
-    /** Section name contributed by this DOM node to the section path */
-    mnSection;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnSectionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: MnSectionDirective, isStandalone: true, selector: "[mn-section]", inputs: { mnSection: ["mn-section", "mnSection"] }, providers: [
-            {
-                provide: MN_SECTION_PATH,
-                // Read parent MN_SECTION_PATH from ancestor injector (skipSelf to avoid self-reference),
-                // and read the attribute value using Attribute so it's available at provider creation time.
-                deps: [[new Optional(), new SkipSelf(), MN_SECTION_PATH], new Attribute('mn-section')],
-                useFactory: (parentPath, attr) => {
-                    const parent = Array.isArray(parentPath) ? parentPath : [];
-                    const name = (attr ?? '').trim();
-                    return name ? [...parent, name] : [...parent];
-                },
-            },
-        ], ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnSectionDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[mn-section]',
-                    standalone: true,
-                    providers: [
-                        {
-                            provide: MN_SECTION_PATH,
-                            // Read parent MN_SECTION_PATH from ancestor injector (skipSelf to avoid self-reference),
-                            // and read the attribute value using Attribute so it's available at provider creation time.
-                            deps: [[new Optional(), new SkipSelf(), MN_SECTION_PATH], new Attribute('mn-section')],
-                            useFactory: (parentPath, attr) => {
-                                const parent = Array.isArray(parentPath) ? parentPath : [];
-                                const name = (attr ?? '').trim();
-                                return name ? [...parent, name] : [...parent];
-                            },
-                        },
-                    ],
-                }]
-        }], propDecorators: { mnSection: [{
-                type: Input,
-                args: ['mn-section']
-            }] } });
-
-class MnInstanceDirective {
-    /** Instance id for targeting per-component instance overrides */
-    mnInstance;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnInstanceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: MnInstanceDirective, isStandalone: true, selector: "[mn-instance]", inputs: { mnInstance: ["mn-instance", "mnInstance"] }, providers: [
-            {
-                provide: MN_INSTANCE_ID,
-                // Read the attribute at provider creation time using Attribute token; Inputs may not be set yet.
-                deps: [new Attribute('mn-instance')],
-                useFactory: (attr) => (attr ?? '').trim() || null,
-            },
-        ], ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnInstanceDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[mn-instance]',
-                    standalone: true,
-                    providers: [
-                        {
-                            provide: MN_INSTANCE_ID,
-                            // Read the attribute at provider creation time using Attribute token; Inputs may not be set yet.
-                            deps: [new Attribute('mn-instance')],
-                            useFactory: (attr) => (attr ?? '').trim() || null,
-                        },
-                    ],
-                }]
-        }], propDecorators: { mnInstance: [{
-                type: Input,
-                args: ['mn-instance']
-            }] } });
-
 /**
  * Injection token for the base URL used by all CRUD service requests.
  *
@@ -7320,37 +7355,6 @@ class CrudService {
     }
 }
 
-/**
- * Provides an APP_INITIALIZER that configures the MnLanguageService and
- * preloads the requested locales during application bootstrap.
- *
- * Usage in app.config.ts:
- *   ...provideMnLanguage({
- *     urlPattern: 'assets/i18n/{locale}.json',
- *     defaultLocale: 'en',
- *     preload: ['en', 'nl'],
- *   })
- */
-function provideMnLanguage(config) {
-    return [
-        {
-            provide: APP_INITIALIZER,
-            multi: true,
-            useFactory: (svc) => async () => {
-                if (config.debug) {
-                    svc.setDebug(true);
-                }
-                svc.configure(config.urlPattern);
-                const effectiveLocale = svc.resolveLocaleForDomain(config.domainLocaleMap, config.defaultLocale);
-                const localesToLoad = config.preload ?? [effectiveLocale];
-                await Promise.all(localesToLoad.map(l => svc.loadLocale(l)));
-                await svc.setLocale(effectiveLocale);
-            },
-            deps: [MnLanguageService],
-        },
-    ];
-}
-
 /**
  * Enable live preview mode. Listens for postMessage events from
  * Mn Web Manager and hot-swaps config/translations at runtime.