@onemrvapublic/design-system 18.1.4 → 18.2.0-develop.1

package/fesm2022/onemrvapublic-design-system-shared.mjs

@@ -1,26 +1,321 @@
-import { CommonModule, DOCUMENT } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Directive, HostListener, EventEmitter, Output, Input, HostBinding, Component, NgModule, Injectable, APP_INITIALIZER, Pipe, InjectionToken, Optional, Inject } from '@angular/core';
-import { OnemrvaMatColor } from '@onemrvapublic/design-system/utils';
-import * as i1 from '@angular/cdk/layout';
+import { Injectable, Component, InjectionToken, Inject, Directive, HostListener, EventEmitter, Output, Input, HostBinding, Pipe, Optional, NgModule, APP_INITIALIZER } from '@angular/core';
+import { NativeDateAdapter, MatNativeDateModule, MAT_DATE_LOCALE, DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
+import { DateTime } from 'luxon';
+import { Subject, takeUntil, merge, NEVER, take, tap, catchError, startWith, switchMap, shareReplay, filter, finalize, of, forkJoin, ReplaySubject, skip, distinctUntilChanged, map as map$1, combineLatestWith, from } from 'rxjs';
+import * as i1 from '@ngx-translate/core';
+import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import * as i2 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
 import * as i3 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import * as i1$1 from '@angular/cdk/clipboard';
-import { NativeDateAdapter, MatNativeDateModule, MAT_DATE_LOCALE, DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
-import * as i1$2 from '@ngx-translate/core';
-import { TranslateModule, TranslateService } from '@ngx-translate/core';
-import { LuxonDateModule } from '@angular/material-luxon-adapter';
-import { Subject, takeUntil, of, ReplaySubject, skip, distinctUntilChanged, map, merge, NEVER, take, tap, catchError, startWith, switchMap, shareReplay, filter, finalize, combineLatestWith, from } from 'rxjs';
-import { MatDatepickerModule } from '@angular/material/datepicker';
-import { DateTime } from 'luxon';
-import * as i1$3 from '@angular/common/http';
-import { __decorate } from 'tslib';
-import { startWith as startWith$1, map as map$1 } from 'rxjs/operators';
-import * as i1$4 from '@angular/cdk/platform';
+import { DOCUMENT, CommonModule } from '@angular/common';
+import * as i1$2 from '@angular/cdk/platform';
 import { _isTestEnvironment } from '@angular/cdk/platform';
+import { OnemrvaMatColor } from '@onemrvapublic/design-system/utils';
+import * as i1$3 from '@angular/cdk/layout';
+import { catchError as catchError$1, map, startWith as startWith$1 } from 'rxjs/operators';
+import * as i1$4 from '@angular/common/http';
+import { __decorate } from 'tslib';
 import { countrySpecs, validateIBAN, electronicFormatIBAN, ValidationErrorsIBAN } from 'ibantools';
+import { LuxonDateModule } from '@angular/material-luxon-adapter';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+
+const ONEMRVA_FORMAT = {
+    parse: {
+        dateInput: 'LL',
+    },
+    display: {
+        dateInput: 'dd/MM/yyyy',
+        monthYearLabel: 'MMM yyyy',
+        dateA11yLabel: 'LL',
+        monthYearA11yLabel: 'MMMM yyyy',
+    },
+};
+
+class OnemrvaDateAdapter extends NativeDateAdapter {
+    constructor(translateService) {
+        super();
+        this.translateService = translateService;
+        this.dateFormat = ONEMRVA_FORMAT.display.dateInput;
+        this.destroyNotifier$ = new Subject();
+        this.setLocale(this.translateService.currentLang);
+        this.translateService.onLangChange
+            .pipe(takeUntil(this.destroyNotifier$))
+            .subscribe(({ lang }) => {
+            this.setLocale(lang);
+        });
+    }
+    format(date) {
+        const dt = DateTime.fromJSDate(date);
+        return dt.toFormat(this.dateFormat);
+    }
+    parse(value) {
+        if (value && typeof value === 'string') {
+            value = value.replace(/\D/g, '/');
+        }
+        if (value === null || value === '') {
+            return null;
+        }
+        const dt = DateTime.fromFormat(value, this.dateFormat, {
+            locale: this.locale,
+        });
+        if (dt.isValid) {
+            return dt.toJSDate();
+        }
+        const formats = ['ddMMyyyy', 'd/M/yyyy', 'dd/M/yyyy', 'd/MM/yyyy'];
+        for (const format of formats) {
+            const parsed = DateTime.fromFormat(value, format, {
+                locale: this.locale,
+            });
+            if (parsed.isValid) {
+                return parsed.toJSDate();
+            }
+        }
+        return this.invalid();
+    }
+    getFirstDayOfWeek() {
+        return 1;
+    }
+    ngOnDestroy() {
+        this.destroyNotifier$.next();
+        this.destroyNotifier$.complete();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDateAdapter, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDateAdapter }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDateAdapter, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: i1.TranslateService }] });
+
+class ClipboardIconComponent {
+    constructor(_elementRef, clipboardService) {
+        this._elementRef = _elementRef;
+        this.clipboardService = clipboardService;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: ClipboardIconComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.Clipboard }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: ClipboardIconComponent, isStandalone: true, selector: "lib-clipboard-icon", ngImport: i0, template: "<mat-icon [matTooltip]=\"'TEST'\">content_copy</mat-icon>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: ClipboardIconComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-clipboard-icon', standalone: true, imports: [MatIconModule, MatTooltipModule], template: "<mat-icon [matTooltip]=\"'TEST'\">content_copy</mat-icon>\n" }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$1.Clipboard }] });
+
+var CDNUrlModeOptions;
+(function (CDNUrlModeOptions) {
+    CDNUrlModeOptions["PROD"] = "production";
+    CDNUrlModeOptions["VAL"] = "validation";
+})(CDNUrlModeOptions || (CDNUrlModeOptions = {}));
+
+const CDN_URLS = {
+    prod: 'https://cdn.services.rvaonem.fgov.be',
+    val: 'https://cdn.servicesval.rvaonem.fgov.be',
+};
+const NISS_MASK = '000000/000-00';
+
+const CDN_URL_MODE = new InjectionToken('This is cdn url that will be used (val/prod)');
+
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+/** Container inside which all overlays will render. */
+class WebComponentOverlayContainer {
+    constructor(document, _platform) {
+        this._platform = _platform;
+        this._containerElement = null;
+        this._document = document;
+    }
+    ngOnDestroy() {
+        this._containerElement?.remove();
+    }
+    /**
+     * This method returns the overlay container element. It will lazily
+     * create the element the first time it is called to facilitate using
+     * the container in non-browser environments.
+     * @returns the container element
+     */
+    getContainerElement() {
+        if (this._containerElement === null) {
+            this._createContainer();
+        }
+        return this._containerElement;
+    }
+    /**
+     * Create the overlay container element, which is simply a div
+     * with the 'cdk-overlay-container' class on the document body.
+     */
+    _createContainer() {
+        const containerClass = 'cdk-overlay-container';
+        // module or Angular starts tearing down the testing `NgModule`. See:
+        // https://github.com/angular/angular/issues/18831
+        if (this._platform.isBrowser || _isTestEnvironment()) {
+            const oppositePlatformContainers = this._document.querySelectorAll(`.${containerClass}[platform="server"], ` +
+                `.${containerClass}[platform="test"]`);
+            // Remove any old containers from the opposite platform.
+            // This can happen when transitioning from the server to the client.
+            for (let i = 0; i < oppositePlatformContainers.length; i++) {
+                oppositePlatformContainers[i].remove();
+            }
+        }
+        const containerwrap = this._document.createElement('div');
+        containerwrap.classList.add('onemrva-theme');
+        const container = this._document.createElement('div');
+        container.classList.add(containerClass);
+        // A long time ago we kept adding new overlay containers whenever a new app was instantiated,
+        // but at some point we added logic which clears the duplicate ones in order to avoid leaks.
+        // The new logic was a little too aggressive since it was breaking some legitimate use cases.
+        // To mitigate the problem we made it so that only containers from a different platform are
+        // cleared, but the side-effect was that people started depending on the overly-aggressive
+        // logic to clean up their tests for them. Until we can introduce an overlay-specific testing
+        // module which does the cleanup, we try to detect that we're in a test environment and we
+        // always clear the container. See #17006.
+        if (_isTestEnvironment()) {
+            container.setAttribute('platform', 'test');
+        }
+        else if (!this._platform.isBrowser) {
+            container.setAttribute('platform', 'server');
+        }
+        containerwrap.appendChild(container);
+        this._document.body.appendChild(containerwrap);
+        this._containerElement = container;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: WebComponentOverlayContainer, deps: [{ token: DOCUMENT }, { token: i1$2.Platform }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: WebComponentOverlayContainer, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: WebComponentOverlayContainer, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [DOCUMENT]
+                }] }, { type: i1$2.Platform }] });
+
+class DefaultStorage {
+    constructor() {
+        this.storage = new Map();
+    }
+    getItem(key) {
+        return this.storage.get(key);
+    }
+    setItem(key, item) {
+        this.storage.set(key, item);
+    }
+    deleteItem(key) {
+        this.storage.delete(key);
+    }
+}
+class RequestTimes {
+    constructor() {
+        this.storage = new Map();
+    }
+    getItem(key) {
+        return this.storage.get(key);
+    }
+    setItem(key, item) {
+        this.storage.set(key, item);
+    }
+    deleteItem(key) {
+        this.storage.delete(key);
+    }
+}
+const HttpRequestCache = (optionsHandler) => {
+    return (target, methodName, descriptor) => {
+        if (!(descriptor?.value instanceof Function)) {
+            throw Error(`'@HttpRequestCache' can be applied only to the class method which returns an Observable`);
+        }
+        const cacheKeyPrefix = `${target.constructor.name}_${methodName}`;
+        const originalMethod = descriptor.value;
+        const working = {};
+        let subscribers = 0;
+        descriptor.value = function (...args) {
+            const options = optionsHandler?.call(this, this, ...args);
+            if (!options?.storage && !target._____storage_____) {
+                target._____storage_____ = new DefaultStorage();
+            }
+            if (options?.ttl && !target._____ttl_storage_____) {
+                target._____ttl_storage_____ = new RequestTimes();
+            }
+            const storage = options?.storage ?? target._____storage_____;
+            const key = `${cacheKeyPrefix}_${JSON.stringify(args)}`;
+            let ttl = undefined;
+            if (options?.ttl) {
+                ttl = target._____ttl_storage_____.getItem(key);
+                if (!ttl) {
+                    ttl = {
+                        requestTime: Date.now(),
+                        subject: new Subject(),
+                    };
+                }
+                else if (ttl.requestTime + options.ttl <= Date.now()) {
+                    working[key] = true;
+                    ttl.requestTime = Date.now();
+                    ttl.subject.next();
+                }
+                target._____ttl_storage_____.setItem(key, ttl);
+            }
+            const refreshOn = merge(options?.refreshOn ?? NEVER, ttl?.subject ?? NEVER);
+            return storage.getItem(key).pipe(take(1), tap(value => {
+                subscribers++;
+                if (value === null)
+                    throw '';
+            }), catchError(() => {
+                const observable = refreshOn.pipe(startWith(true), switchMap(() => originalMethod.apply(this, [...args])), tap(() => {
+                    delete working[key];
+                }), shareReplay({
+                    bufferSize: 1,
+                    refCount: options?.refCount ?? false,
+                    windowTime: options?.windowTime ?? Infinity,
+                }), filter(() => {
+                    return !working[key];
+                }), finalize(() => {
+                    subscribers--;
+                    if (subscribers === 0 && options?.refCount) {
+                        storage.deleteItem(key);
+                        target._____ttl_storage_____?.deleteItem(key);
+                    }
+                }));
+                storage.setItem(key, observable);
+                return observable;
+            }));
+            // let observable = storage.getItem(key);
+            //
+            // if (!observable) {
+            //
+            //   observable = refreshOn.pipe(
+            //     startWith(true),
+            //     switchMap(() => originalMethod.apply(this, [...args])),
+            //     tap(() => {
+            //       delete working[key];
+            //     }),
+            //     shareReplay({
+            //       bufferSize: 1,
+            //       refCount: options?.refCount ?? false,
+            //       windowTime: options?.windowTime ?? Infinity,
+            //     }),
+            //     filter(() => {
+            //       return !working[key];
+            //     }),
+            //     finalize(() => {
+            //       subscribers--;
+            //       if (subscribers === 0 && options?.refCount) {
+            //         storage.deleteItem(key);
+            //         (target as any)._____ttl_storage_____?.deleteItem(key);
+            //       }
+            //     })
+            //   );
+            //   storage.setItem(key, observable);
+            // }
+            //      subscribers++;
+            //      return observable;
+        };
+        return descriptor;
+    };
+};
 
 class DigitOnlyDirective {
     constructor() { }
@@ -163,7 +458,7 @@ class IfWidthIsDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: IfWidthIsDirective, deps: [{ token: i1.BreakpointObserver }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: IfWidthIsDirective, deps: [{ token: i1$3.BreakpointObserver }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.5", type: IfWidthIsDirective, selector: "[ifWidthIs]", inputs: { ifWidthIs: "ifWidthIs" }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: IfWidthIsDirective, decorators: [{
@@ -171,7 +466,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImpor
             args: [{
                     selector: '[ifWidthIs]',
                 }]
-        }], ctorParameters: () => [{ type: i1.BreakpointObserver }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }], propDecorators: { ifWidthIs: [{
+        }], ctorParameters: () => [{ type: i1$3.BreakpointObserver }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }], propDecorators: { ifWidthIs: [{
                 type: Input
             }] } });
 
@@ -432,19 +727,6 @@ function isAllowed(rule, character) {
     return false;
 }
 
-class ClipboardIconComponent {
-    constructor(_elementRef, clipboardService) {
-        this._elementRef = _elementRef;
-        this.clipboardService = clipboardService;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: ClipboardIconComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.Clipboard }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.5", type: ClipboardIconComponent, isStandalone: true, selector: "lib-clipboard-icon", ngImport: i0, template: "<mat-icon [matTooltip]=\"'TEST'\">content_copy</mat-icon>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: ClipboardIconComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-clipboard-icon', standalone: true, imports: [MatIconModule, MatTooltipModule], template: "<mat-icon [matTooltip]=\"'TEST'\">content_copy</mat-icon>\n" }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$1.Clipboard }] });
-
 /**
  * Conditionally adds component to the tree if screen width matches at least one size in input
  */
@@ -510,160 +792,78 @@ const directives = [
     OnemrvaMaskDirective,
 ];
 
-class OnemrvaSharedModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaSharedModule, declarations: [DigitOnlyDirective, MatRowClickableDirective, OnemRvaClipboardDirective, OnemRvaIconRightDirective, IfWidthIsDirective, OnemRvaColorDirective, OnemrvaMaskDirective], imports: [CommonModule], exports: [DigitOnlyDirective, MatRowClickableDirective, OnemRvaClipboardDirective, OnemRvaIconRightDirective, IfWidthIsDirective, OnemRvaColorDirective, OnemrvaMaskDirective, CommonModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaSharedModule, imports: [CommonModule, CommonModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaSharedModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [...directives],
-                    imports: [CommonModule],
-                    exports: [...directives, CommonModule],
-                }]
-        }] });
-
-const ONEMRVA_FORMAT = {
-    parse: {
-        dateInput: 'LL',
-    },
-    display: {
-        dateInput: 'dd/MM/yyyy',
-        monthYearLabel: 'MMM yyyy',
-        dateA11yLabel: 'LL',
-        monthYearA11yLabel: 'MMMM yyyy',
-    },
-};
-
-class OnemrvaDateAdapter extends NativeDateAdapter {
-    constructor(translateService) {
-        super();
-        this.translateService = translateService;
-        this.dateFormat = ONEMRVA_FORMAT.display.dateInput;
-        this.destroyNotifier$ = new Subject();
-        this.setLocale(this.translateService.currentLang);
-        this.translateService.onLangChange
-            .pipe(takeUntil(this.destroyNotifier$))
-            .subscribe(({ lang }) => {
-            this.setLocale(lang);
-        });
-    }
-    format(date) {
-        const dt = DateTime.fromJSDate(date);
-        return dt.toFormat(this.dateFormat);
-    }
-    parse(value) {
-        if (value && typeof value === 'string') {
-            value = value.replace(/\D/g, '/');
-        }
-        if (value === null || value === '') {
-            return null;
-        }
-        const dt = DateTime.fromFormat(value, this.dateFormat, {
-            locale: this.locale,
+function setTranslationLanguage(translateService, languages = ['en', 'fr', 'nl', 'de'], default_language = 'en') {
+    return async () => {
+        translateService.onLangChange.subscribe(value => {
+            localStorage.setItem('language', value.lang);
         });
-        if (dt.isValid) {
-            return dt.toJSDate();
-        }
-        const formats = ['ddMMyyyy', 'd/M/yyyy', 'dd/M/yyyy', 'd/MM/yyyy'];
-        for (const format of formats) {
-            const parsed = DateTime.fromFormat(value, format, {
-                locale: this.locale,
-            });
-            if (parsed.isValid) {
-                return parsed.toJSDate();
+        translateService.addLangs(languages);
+        let language = localStorage.getItem('language');
+        if (language === null || languages.indexOf(language) < 0) {
+            // getting language from browser
+            if (languages.indexOf(navigator.language) >= 0) {
+                language = navigator.language;
+            }
+            else {
+                // getting language from one of the browser's languages
+                for (const lng of navigator.languages) {
+                    if (languages.indexOf(lng) >= 0) {
+                        language = lng;
+                        break;
+                    }
+                }
+                // getting default language
+                if (language === null || languages.indexOf(language) < 0) {
+                    language = default_language;
+                }
             }
         }
-        return this.invalid();
-    }
-    getFirstDayOfWeek() {
-        return 1;
+        await translateService.use(language).toPromise();
+    };
+}
+
+class OnemrvaTranslateCDNLoader {
+    constructor(cdn, projects = [], prefix = '/i18n/', suffix = '.json') {
+        this.cdn = cdn;
+        this.projects = projects;
+        this.prefix = prefix;
+        this.suffix = suffix;
     }
-    ngOnDestroy() {
-        this.destroyNotifier$.next();
-        this.destroyNotifier$.complete();
+    /**
+     * Gets the translations from the server
+     */
+    getTranslation(lang) {
+        return this.cdn.getTranslations(this.projects, lang, this.prefix, this.suffix);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDateAdapter, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDateAdapter }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDateAdapter, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: i1$2.TranslateService }] });
 
-function translateDatepicker(translateService, adapter) {
-    return () => {
-        // For some cosmic reason, return translateService.onLangChange().asObservable()) + pipe(tap()) does not work
-        translateService.onLangChange.subscribe(event => {
-            adapter.setLocale(event.lang);
-        });
-        // But this works fine...
-        return of('sin (a +- b) = sin a . cos b +- cos a . sin b');
-    };
-}
-class OnemrvaDatepickerSharedModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDatepickerSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDatepickerSharedModule, imports: [MatDatepickerModule,
-            TranslateModule,
-            MatNativeDateModule,
-            LuxonDateModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDatepickerSharedModule, providers: [
-            {
-                provide: MAT_DATE_LOCALE,
-                useValue: 'fr',
-            },
-            {
-                provide: DateAdapter,
-                useClass: OnemrvaDateAdapter,
-            },
-            {
-                provide: MAT_DATE_FORMATS,
-                useValue: ONEMRVA_FORMAT,
-            },
-            {
-                provide: APP_INITIALIZER,
-                useFactory: translateDatepicker,
-                deps: [TranslateService, (DateAdapter)],
-                multi: true,
-            },
-        ], imports: [MatDatepickerModule,
-            TranslateModule,
-            MatNativeDateModule,
-            LuxonDateModule] }); }
+class OnemrvaTranslateHttpLoader {
+    constructor(http, prefix = '/assets/i18n/', suffix = '.json', modules = []) {
+        this.http = http;
+        this.prefix = prefix;
+        this.suffix = suffix;
+        this.modules = modules;
+    }
+    /**
+     * Gets the translations from the server
+     */
+    getTranslation(lang) {
+        const observables = [
+            this.http
+                .get(`${this.prefix}${lang}${this.suffix}`)
+                .pipe(catchError$1(() => of(null))),
+            ...this.modules.map(m => {
+                this.http
+                    .get(`${this.prefix}${m}/${lang}${this.suffix}`)
+                    .pipe(catchError$1(() => of(null)));
+                //console.log(`${this.prefix}${m}/${lang}${this.suffix}`);
+            }),
+        ];
+        return forkJoin(observables).pipe(map(all => {
+            return all.filter(v => !!v).reduce((s, c) => ({ ...s, ...c }), {});
+        }));
+    }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDatepickerSharedModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [],
-                    imports: [
-                        MatDatepickerModule,
-                        TranslateModule,
-                        MatNativeDateModule,
-                        LuxonDateModule,
-                    ],
-                    exports: [],
-                    providers: [
-                        {
-                            provide: MAT_DATE_LOCALE,
-                            useValue: 'fr',
-                        },
-                        {
-                            provide: DateAdapter,
-                            useClass: OnemrvaDateAdapter,
-                        },
-                        {
-                            provide: MAT_DATE_FORMATS,
-                            useValue: ONEMRVA_FORMAT,
-                        },
-                        {
-                            provide: APP_INITIALIZER,
-                            useFactory: translateDatepicker,
-                            deps: [TranslateService, (DateAdapter)],
-                            multi: true,
-                        },
-                    ],
-                }]
-        }] });
 
 class OnemrvaBcePipe {
     transform(value) {
@@ -701,81 +901,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImpor
                 }]
         }] });
 
-class OnemrvaValidators {
-    static bceValidator(required = false, control) {
-        if (control.value === null || control.value.trim() === '') {
-            return !required ? null : { bceNull: true };
-        }
-        const bceCandidate = control.value.trim().replace(/\/|\.|-/g, '');
-        if (bceCandidate.length !== 10)
-            return { bceLengthError: { value: bceCandidate } };
-        if (Number.isNaN(+bceCandidate))
-            return { bceNan: { value: bceCandidate } };
-        return null;
-    }
-    static bce(required = false) {
-        return (control) => {
-            return this.bceValidator(required, control);
-        };
-    }
-    static nissValidator(required = false, control) {
-        if (control.value === null || control.value.trim() === '') {
-            return !required ? null : { nissNull: true };
-        }
-        const nissCandidate = control.value.trim().replace(/\/|\.|-/g, '');
-        if (nissCandidate.length !== 11) {
-            return { nissLengthError: { value: nissCandidate } };
-        }
-        if (Number.isNaN(+nissCandidate)) {
-            return { nissNan: { value: nissCandidate } };
-        }
-        // Niss day and year are actual values, the month can be different according to the logic below
-        // [20-32] & [40-52] => foreigners & temporary NISS values
-        // it is not necessary to check for the actual date to be valid
-        const checksumValue = nissCandidate.substring(9);
-        const nissNumbersToCheck = nissCandidate.substring(0, 9);
-        const isValidChecksumYear1900 = 97 - (+nissNumbersToCheck % 97) === +checksumValue;
-        const isValidChecksumYear2000 = 97 - (+`2${nissNumbersToCheck}` % 97) === +checksumValue;
-        if (!isValidChecksumYear1900 && !isValidChecksumYear2000) {
-            return { nissCheckDigitError: { value: nissCandidate } };
-        }
-        /*
-          Below checks aren't really necessary but are here to exclude even more potential errors
-          We could still improve this to include february days & 30 day months + the real potential ranges
-        */
-        const monthString = nissCandidate.substring(2, 4);
-        const month = parseInt(monthString) - 1;
-        const real_month = (parseInt(monthString) % 20) - 1;
-        if (real_month > 11 || month > 51) {
-            return { nissInvalidMonth: { value: nissCandidate } };
-        }
-        const day = +nissCandidate.substring(4, 6);
-        if (day > 31) {
-            return { nissInvalidDate: { value: nissCandidate } };
-        }
-        return null;
-    }
-    static niss(required = false) {
-        return (control) => {
-            return this.nissValidator(required, control);
-        };
-    }
-    static nissOrBce(required = false) {
-        return (control) => {
-            if (control.value === null || control.value.trim() === '')
-                return !required ? null : { nissNull: true };
-            const nissCandidate = control.value.trim().replace(/\/|\.|-/g, '');
-            if (control.value.length === 11) {
-                return this.nissValidator(required, control);
-            }
-            else if (control.value.length === 10) {
-                return this.bceValidator(required, control);
-            }
-            return { lengthError: { value: nissCandidate } };
-        };
-    }
-}
-
 class CommonCountryLookupService {
     constructor(http) {
         this.http = http;
@@ -795,12 +920,12 @@ class CommonCountryLookupService {
         return this._countries$.pipe(skip(+refresh), distinctUntilChanged());
     }
     getCountryByCode(code) {
-        return this._countries$.pipe(map(countries => {
+        return this._countries$.pipe(map$1(countries => {
             const country = countries.find(country => country.code === code);
             return country || null;
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: CommonCountryLookupService, deps: [{ token: i1$3.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: CommonCountryLookupService, deps: [{ token: i1$4.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: CommonCountryLookupService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: CommonCountryLookupService, decorators: [{
@@ -808,142 +933,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImpor
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: i1$3.HttpClient }] });
-
-const CDN_URL_MODE = new InjectionToken('This is cdn url that will be used (val/prod)');
-
-var CDNUrlModeOptions;
-(function (CDNUrlModeOptions) {
-    CDNUrlModeOptions["PROD"] = "production";
-    CDNUrlModeOptions["VAL"] = "validation";
-})(CDNUrlModeOptions || (CDNUrlModeOptions = {}));
-
-const CDN_URLS = {
-    prod: 'https://cdn.services.rvaonem.fgov.be',
-    val: 'https://cdn.servicesval.rvaonem.fgov.be',
-};
-
-class DefaultStorage {
-    constructor() {
-        this.storage = new Map();
-    }
-    getItem(key) {
-        return this.storage.get(key);
-    }
-    setItem(key, item) {
-        this.storage.set(key, item);
-    }
-    deleteItem(key) {
-        this.storage.delete(key);
-    }
-}
-class RequestTimes {
-    constructor() {
-        this.storage = new Map();
-    }
-    getItem(key) {
-        return this.storage.get(key);
-    }
-    setItem(key, item) {
-        this.storage.set(key, item);
-    }
-    deleteItem(key) {
-        this.storage.delete(key);
-    }
-}
-const HttpRequestCache = (optionsHandler) => {
-    return (target, methodName, descriptor) => {
-        if (!(descriptor?.value instanceof Function)) {
-            throw Error(`'@HttpRequestCache' can be applied only to the class method which returns an Observable`);
-        }
-        const cacheKeyPrefix = `${target.constructor.name}_${methodName}`;
-        const originalMethod = descriptor.value;
-        const working = {};
-        let subscribers = 0;
-        descriptor.value = function (...args) {
-            const options = optionsHandler?.call(this, this, ...args);
-            if (!options?.storage && !target._____storage_____) {
-                target._____storage_____ = new DefaultStorage();
-            }
-            if (options?.ttl && !target._____ttl_storage_____) {
-                target._____ttl_storage_____ = new RequestTimes();
-            }
-            const storage = options?.storage ?? target._____storage_____;
-            const key = `${cacheKeyPrefix}_${JSON.stringify(args)}`;
-            let ttl = undefined;
-            if (options?.ttl) {
-                ttl = target._____ttl_storage_____.getItem(key);
-                if (!ttl) {
-                    ttl = {
-                        requestTime: Date.now(),
-                        subject: new Subject(),
-                    };
-                }
-                else if (ttl.requestTime + options.ttl <= Date.now()) {
-                    working[key] = true;
-                    ttl.requestTime = Date.now();
-                    ttl.subject.next();
-                }
-                target._____ttl_storage_____.setItem(key, ttl);
-            }
-            const refreshOn = merge(options?.refreshOn ?? NEVER, ttl?.subject ?? NEVER);
-            return storage.getItem(key).pipe(take(1), tap(value => {
-                subscribers++;
-                if (value === null)
-                    throw '';
-            }), catchError(() => {
-                const observable = refreshOn.pipe(startWith(true), switchMap(() => originalMethod.apply(this, [...args])), tap(() => {
-                    delete working[key];
-                }), shareReplay({
-                    bufferSize: 1,
-                    refCount: options?.refCount ?? false,
-                    windowTime: options?.windowTime ?? Infinity,
-                }), filter(() => {
-                    return !working[key];
-                }), finalize(() => {
-                    subscribers--;
-                    if (subscribers === 0 && options?.refCount) {
-                        storage.deleteItem(key);
-                        target._____ttl_storage_____?.deleteItem(key);
-                    }
-                }));
-                storage.setItem(key, observable);
-                return observable;
-            }));
-            // let observable = storage.getItem(key);
-            //
-            // if (!observable) {
-            //
-            //   observable = refreshOn.pipe(
-            //     startWith(true),
-            //     switchMap(() => originalMethod.apply(this, [...args])),
-            //     tap(() => {
-            //       delete working[key];
-            //     }),
-            //     shareReplay({
-            //       bufferSize: 1,
-            //       refCount: options?.refCount ?? false,
-            //       windowTime: options?.windowTime ?? Infinity,
-            //     }),
-            //     filter(() => {
-            //       return !working[key];
-            //     }),
-            //     finalize(() => {
-            //       subscribers--;
-            //       if (subscribers === 0 && options?.refCount) {
-            //         storage.deleteItem(key);
-            //         (target as any)._____ttl_storage_____?.deleteItem(key);
-            //       }
-            //     })
-            //   );
-            //   storage.setItem(key, observable);
-            // }
-            //      subscribers++;
-            //      return observable;
-        };
-        return descriptor;
-    };
-};
+        }], ctorParameters: () => [{ type: i1$4.HttpClient }] });
 
 class CacheService {
     constructor() { }
@@ -975,9 +965,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImpor
         }], ctorParameters: () => [] });
 
 class OnemRvaCDNService {
-    constructor(cacheService, translateService, http, cdnUrlMode) {
+    constructor(cacheService, http, cdnUrlMode) {
         this.cacheService = cacheService;
-        this.translateService = translateService;
         this.http = http;
         this.refresh$ = new Subject();
         switch (cdnUrlMode) {
@@ -1003,8 +992,55 @@ class OnemRvaCDNService {
     fetch(endpoint) {
         return this.http.get(this.cdnUrl + endpoint);
     }
+    fetchNoCache(endpoint) {
+        return this.http.get(this.cdnUrl + endpoint);
+    }
+    getTranslations(projects, lang, prefix = '', suffix = '') {
+        const observables = [
+            this.http
+                .get(`${this.cdnUrl}${prefix}design-system/design-system/${lang}${suffix}`)
+                .pipe(catchError$1(() => of({}))),
+            ...projects.map(m => {
+                return this.http
+                    .get(`${this.cdnUrl}${prefix}${m}/${lang}${suffix}`)
+                    .pipe(catchError$1(() => {
+                    return of({});
+                }));
+            }),
+        ];
+        return forkJoin(observables).pipe(map(all => {
+            return all.filter(v => !!v).reduce((s, c) => ({ ...s, ...c }), {});
+        }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNService, deps: [{ token: CacheService }, { token: i1$4.HttpClient }, { token: CDN_URL_MODE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNService, providedIn: 'root' }); }
+}
+__decorate([
+    HttpRequestCache(cdnService => ({
+        refreshOn: cdnService.refresh$,
+        storage: cdnService.cacheService,
+        ttl: 3600000,
+    }))
+], OnemRvaCDNService.prototype, "fetch", null);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [{ type: CacheService }, { type: i1$4.HttpClient }, { type: CDNUrlModeOptions, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [CDN_URL_MODE]
+                }] }], propDecorators: { fetch: [] } });
+
+class OnemRvaCDNCountryService {
+    constructor(cdnService, translateService) {
+        this.cdnService = cdnService;
+        this.translateService = translateService;
+    }
     getCountries() {
-        return this.fetch('/json/countries.json').pipe(combineLatestWith(from(this.translateService.onLangChange).pipe(startWith$1(this.translateService.currentLang))), map$1(([response]) => {
+        return this.cdnService.fetch('/json/countries.json').pipe(combineLatestWith(from(this.translateService.onLangChange).pipe(startWith$1(this.translateService.currentLang))), map(([response]) => {
             return response
                 .slice()
                 .map(country => {
@@ -1024,7 +1060,7 @@ class OnemRvaCDNService {
         }));
     }
     getCountriesByZone(zone) {
-        return this.getCountries().pipe(map$1(countries => {
+        return this.getCountries().pipe(map(countries => {
             return countries.filter(country => country.zone === zone);
         }));
     }
@@ -1038,128 +1074,106 @@ class OnemRvaCDNService {
         return country.name;
     }
     findCountryFromCode(code) {
-        return this.getCountries().pipe(map$1(countries => {
+        return this.getCountries().pipe(map(countries => {
             return countries.find((country) => country.code.toLowerCase() === code.toLowerCase());
         }));
     }
     findCountryFromVIESCode(code) {
-        console.log(code);
-        return this.getCountriesByZone('EU').pipe(map$1(countries => {
+        return this.getCountriesByZone('EU').pipe(map(countries => {
             return countries.find((country) => country.pattern.substring(0, 2) === code.substring(0, 2));
         }));
     }
     findCountryFromPrefix(number) {
-        console.warn(number);
-        return this.getCountries().pipe(map$1(countries => {
+        return this.getCountries().pipe(map(countries => {
             return countries.find((country) => {
-                console.log('--------------------------------');
-                console.log(country.dial_code);
-                console.log(number.substring(0, country.dial_code.length));
-                console.log('--------------------------------');
                 return (country.dial_code === number.substring(0, country.dial_code.length));
             });
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNService, deps: [{ token: CacheService }, { token: i1$2.TranslateService }, { token: i1$3.HttpClient }, { token: CDN_URL_MODE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNCountryService, deps: [{ token: OnemRvaCDNService }, { token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNCountryService, providedIn: 'root' }); }
 }
-__decorate([
-    HttpRequestCache(cdnService => ({
-        refreshOn: cdnService.refresh$,
-        storage: cdnService.cacheService,
-        ttl: 3600000,
-    }))
-], OnemRvaCDNService.prototype, "fetch", null);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemRvaCDNCountryService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: CacheService }, { type: i1$2.TranslateService }, { type: i1$3.HttpClient }, { type: CDNUrlModeOptions, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [CDN_URL_MODE]
-                }] }], propDecorators: { fetch: [] } });
+        }], ctorParameters: () => [{ type: OnemRvaCDNService }, { type: i1.TranslateService }] });
 
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/** Container inside which all overlays will render. */
-class WebComponentOverlayContainer {
-    constructor(document, _platform) {
-        this._platform = _platform;
-        this._containerElement = null;
-        this._document = document;
+class OnemrvaValidators {
+    static bceValidator(required = false, control) {
+        if (control.value === null || control.value.trim() === '') {
+            return !required ? null : { bceNull: true };
+        }
+        const bceCandidate = control.value.trim().replace(/\/|\.|-/g, '');
+        if (bceCandidate.length !== 10)
+            return { bceLengthError: { value: bceCandidate } };
+        if (Number.isNaN(+bceCandidate))
+            return { bceNan: { value: bceCandidate } };
+        return null;
     }
-    ngOnDestroy() {
-        this._containerElement?.remove();
+    static bce(required = false) {
+        return (control) => {
+            return this.bceValidator(required, control);
+        };
     }
-    /**
-     * This method returns the overlay container element. It will lazily
-     * create the element the first time it is called to facilitate using
-     * the container in non-browser environments.
-     * @returns the container element
-     */
-    getContainerElement() {
-        if (this._containerElement === null) {
-            this._createContainer();
+    static nissValidator(required = false, control) {
+        if (control.value === null || control.value.trim() === '') {
+            return !required ? null : { nissNull: true };
         }
-        return this._containerElement;
-    }
-    /**
-     * Create the overlay container element, which is simply a div
-     * with the 'cdk-overlay-container' class on the document body.
-     */
-    _createContainer() {
-        const containerClass = 'cdk-overlay-container';
-        // module or Angular starts tearing down the testing `NgModule`. See:
-        // https://github.com/angular/angular/issues/18831
-        if (this._platform.isBrowser || _isTestEnvironment()) {
-            const oppositePlatformContainers = this._document.querySelectorAll(`.${containerClass}[platform="server"], ` +
-                `.${containerClass}[platform="test"]`);
-            // Remove any old containers from the opposite platform.
-            // This can happen when transitioning from the server to the client.
-            for (let i = 0; i < oppositePlatformContainers.length; i++) {
-                oppositePlatformContainers[i].remove();
-            }
+        const nissCandidate = control.value.trim().replace(/\/|\.|-/g, '');
+        if (nissCandidate.length !== 11) {
+            return { nissLengthError: { value: nissCandidate } };
         }
-        const containerwrap = this._document.createElement('div');
-        containerwrap.classList.add('onemrva-theme');
-        const container = this._document.createElement('div');
-        container.classList.add(containerClass);
-        // A long time ago we kept adding new overlay containers whenever a new app was instantiated,
-        // but at some point we added logic which clears the duplicate ones in order to avoid leaks.
-        // The new logic was a little too aggressive since it was breaking some legitimate use cases.
-        // To mitigate the problem we made it so that only containers from a different platform are
-        // cleared, but the side-effect was that people started depending on the overly-aggressive
-        // logic to clean up their tests for them. Until we can introduce an overlay-specific testing
-        // module which does the cleanup, we try to detect that we're in a test environment and we
-        // always clear the container. See #17006.
-        if (_isTestEnvironment()) {
-            container.setAttribute('platform', 'test');
+        if (Number.isNaN(+nissCandidate)) {
+            return { nissNan: { value: nissCandidate } };
         }
-        else if (!this._platform.isBrowser) {
-            container.setAttribute('platform', 'server');
+        // Niss day and year are actual values, the month can be different according to the logic below
+        // [20-32] & [40-52] => foreigners & temporary NISS values
+        // it is not necessary to check for the actual date to be valid
+        const checksumValue = nissCandidate.substring(9);
+        const nissNumbersToCheck = nissCandidate.substring(0, 9);
+        const isValidChecksumYear1900 = 97 - (+nissNumbersToCheck % 97) === +checksumValue;
+        const isValidChecksumYear2000 = 97 - (+`2${nissNumbersToCheck}` % 97) === +checksumValue;
+        if (!isValidChecksumYear1900 && !isValidChecksumYear2000) {
+            return { nissCheckDigitError: { value: nissCandidate } };
         }
-        containerwrap.appendChild(container);
-        this._document.body.appendChild(containerwrap);
-        this._containerElement = container;
+        /*
+          Below checks aren't really necessary but are here to exclude even more potential errors
+          We could still improve this to include february days & 30 day months + the real potential ranges
+        */
+        const monthString = nissCandidate.substring(2, 4);
+        const month = parseInt(monthString) - 1;
+        const real_month = (parseInt(monthString) % 20) - 1;
+        if (real_month > 11 || month > 51) {
+            return { nissInvalidMonth: { value: nissCandidate } };
+        }
+        const day = +nissCandidate.substring(4, 6);
+        if (day > 31) {
+            return { nissInvalidDate: { value: nissCandidate } };
+        }
+        return null;
+    }
+    static niss(required = false) {
+        return (control) => {
+            return this.nissValidator(required, control);
+        };
+    }
+    static nissOrBce(required = false) {
+        return (control) => {
+            if (control.value === null || control.value.trim() === '')
+                return !required ? null : { nissNull: true };
+            const nissCandidate = control.value.trim().replace(/\/|\.|-/g, '');
+            if (control.value.length === 11) {
+                return this.nissValidator(required, control);
+            }
+            else if (control.value.length === 10) {
+                return this.bceValidator(required, control);
+            }
+            return { lengthError: { value: nissCandidate } };
+        };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: WebComponentOverlayContainer, deps: [{ token: DOCUMENT }, { token: i1$4.Platform }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: WebComponentOverlayContainer, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: WebComponentOverlayContainer, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }, { type: i1$4.Platform }] });
 
 const IBAN_SUPPORTED_COUNTRIES = Object.keys(countrySpecs);
 const internValidateIban = (iban = '') => {
@@ -1205,14 +1219,101 @@ const bankAccountValidator = () => {
     };
 };
 
+class OnemrvaSharedModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaSharedModule, declarations: [DigitOnlyDirective, MatRowClickableDirective, OnemRvaClipboardDirective, OnemRvaIconRightDirective, IfWidthIsDirective, OnemRvaColorDirective, OnemrvaMaskDirective], imports: [CommonModule], exports: [DigitOnlyDirective, MatRowClickableDirective, OnemRvaClipboardDirective, OnemRvaIconRightDirective, IfWidthIsDirective, OnemRvaColorDirective, OnemrvaMaskDirective, CommonModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaSharedModule, imports: [CommonModule, CommonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaSharedModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [...directives],
+                    imports: [CommonModule],
+                    exports: [...directives, CommonModule],
+                }]
+        }] });
+
+function translateDatepicker(translateService, adapter) {
+    return () => {
+        // For some cosmic reason, return translateService.onLangChange().asObservable()) + pipe(tap()) does not work
+        translateService.onLangChange.subscribe(event => {
+            adapter.setLocale(event.lang);
+        });
+        // But this works fine...
+        return of('sin (a +- b) = sin a . cos b +- cos a . sin b');
+    };
+}
+class OnemrvaDatepickerSharedModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDatepickerSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDatepickerSharedModule, imports: [MatDatepickerModule,
+            TranslateModule,
+            MatNativeDateModule,
+            LuxonDateModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDatepickerSharedModule, providers: [
+            {
+                provide: MAT_DATE_LOCALE,
+                useValue: 'fr',
+            },
+            {
+                provide: DateAdapter,
+                useClass: OnemrvaDateAdapter,
+            },
+            {
+                provide: MAT_DATE_FORMATS,
+                useValue: ONEMRVA_FORMAT,
+            },
+            {
+                provide: APP_INITIALIZER,
+                useFactory: translateDatepicker,
+                deps: [TranslateService, (DateAdapter)],
+                multi: true,
+            },
+        ], imports: [MatDatepickerModule,
+            TranslateModule,
+            MatNativeDateModule,
+            LuxonDateModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: OnemrvaDatepickerSharedModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    imports: [
+                        MatDatepickerModule,
+                        TranslateModule,
+                        MatNativeDateModule,
+                        LuxonDateModule,
+                    ],
+                    exports: [],
+                    providers: [
+                        {
+                            provide: MAT_DATE_LOCALE,
+                            useValue: 'fr',
+                        },
+                        {
+                            provide: DateAdapter,
+                            useClass: OnemrvaDateAdapter,
+                        },
+                        {
+                            provide: MAT_DATE_FORMATS,
+                            useValue: ONEMRVA_FORMAT,
+                        },
+                        {
+                            provide: APP_INITIALIZER,
+                            useFactory: translateDatepicker,
+                            deps: [TranslateService, (DateAdapter)],
+                            multi: true,
+                        },
+                    ],
+                }]
+        }] });
+
 /*
  * Public API Surface of shared
  */
-const NISS_MASK = '000000/000-00';
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { CommonCountryLookupService, DigitOnlyDirective, IBAN_SUPPORTED_COUNTRIES, IfWidthIsDirective, MatRowClickableDirective, NISS_MASK, ONEMRVA_FORMAT, OnemRvaCDNService, OnemRvaClipboardDirective, OnemRvaColorDirective, OnemRvaIconRightDirective, OnemrvaBcePipe, OnemrvaDateAdapter, OnemrvaDatepickerSharedModule, OnemrvaMaskDirective, OnemrvaNissPipe, OnemrvaSharedModule, OnemrvaValidators, WebComponentOverlayContainer, bankAccountValidator, directives };
+export { CDNUrlModeOptions, CDN_URLS, CDN_URL_MODE, ClipboardIconComponent, CommonCountryLookupService, DefaultStorage, DigitOnlyDirective, HttpRequestCache, IBAN_SUPPORTED_COUNTRIES, IfWidthIsDirective, MatRowClickableDirective, NISS_MASK, ONEMRVA_FORMAT, OnemRvaCDNCountryService, OnemRvaCDNService, OnemRvaClipboardDirective, OnemRvaColorDirective, OnemRvaIconRightDirective, OnemrvaBcePipe, OnemrvaDateAdapter, OnemrvaDatepickerSharedModule, OnemrvaMaskDirective, OnemrvaNissPipe, OnemrvaSharedModule, OnemrvaTranslateCDNLoader, OnemrvaTranslateHttpLoader, OnemrvaValidators, RequestTimes, WebComponentOverlayContainer, bankAccountValidator, directives, setTranslationLanguage };
 //# sourceMappingURL=onemrvapublic-design-system-shared.mjs.map