@eui/base 23.0.0-alpha.1 → 23.0.0-alpha.2

package/docs/json/documentation.json

@@ -1544,12 +1544,12 @@
         },
         {
             "name": "EuiServiceModel",
-            "id": "interface-EuiServiceModel-e9132d3f4903942a1ce129a8f89fbc7f234381e7a11e802724aba9a17db912d4e921e6ed31c8b20cfa41a87b2fd7166ff5cb1e4663e5d90353fb929d3b31af98",
+            "id": "interface-EuiServiceModel-6c072c68250cd88ba317937e0a34489a84c952e84a33e3311d45156434f863e376c7fd001fee45311d599580ff6c530923c9f317b1ddc57c4d569c6d263d9811",
             "file": "packages/base/src/lib/eui-models/eui-service.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { Observable, Subject, Subscription } from 'rxjs';\nimport { ModuleConfig } from './eui-config/eui-app-config';\nimport { LoadedConfigModules } from './eui-store/state/app.state';\nimport { EuiStoreServiceModel } from './eui-store/eui-store-service.model';\nimport { filter, switchMap } from 'rxjs/operators';\nimport { Selector } from 'reselect';\nimport { CoreState } from './eui-store';\n\nexport interface EuiServiceModel<T> {\n    init(t: T): Observable<EuiServiceStatus>;\n\n    /**\n     * retrieves the State of the service. If you don't pass anything it will retrieve the whole State\n     * of that service. If you pass a selector or MapFunction it will retrieve a slice of the state. If\n     * you pass a string that's a key of the Service State type it will retrieve that slice of the state.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    getState<K = T>(): Observable<T>;\n    getState<K>(mapFn: (state: T) => K): Observable<K>;\n    getState<A extends keyof T>(key: A): Observable<T[A]>;\n    getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    updateState(t: T): void;\n}\n\nexport type DeepPartial<T> = {\n    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport abstract class EuiService<T> implements EuiServiceModel<T> {\n    protected stateInstance: T;\n    protected prevStateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n    onStateChange: Subject<T> = new Subject<T>();\n\n    protected constructor(defaultState: T) {\n        this.stateInstance = defaultState;\n    }\n\n    initEuiService(): void {\n        this.unSubscribe();\n        this.$stateSubs = this.getState().subscribe((newState: T) => {\n            // set previous state of service\n            this.prevStateInstance = this.copy(this.stateInstance);\n            // update state before emit event\n            this.stateInstance = this.copy(newState);\n            // inform about state change\n            this.onStateChange.next(newState);\n        });\n    }\n\n    abstract init(t?: T): Observable<EuiServiceStatus>;\n\n    abstract getState<K = T>(): Observable<T>;\n    abstract getState<K>(mapFn?: (state: T) => K): Observable<K>;\n    abstract getState<A extends keyof T>(key?: A): Observable<T[A]>;\n    abstract getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    abstract updateState(t: DeepPartial<T>): void;\n\n    protected unSubscribe(): void {\n        if (this.$stateSubs && this.$stateSubs.unsubscribe) {\n            this.$stateSubs.unsubscribe();\n        }\n        if (this.$stateLazyLoadSubs && this.$stateLazyLoadSubs.unsubscribe) {\n            this.$stateLazyLoadSubs.unsubscribe();\n        }\n    }\n\n    /**\n     * deep merge two objects\n     * @param target the object that will be merged into\n     * @param source the object that will be merged from\n     */\n    protected deepMerge<T>(target: T, source: DeepPartial<T>): T {\n        const output = Object.assign({}, target);\n        if (this.isObject(target) && this.isObject(source)) {\n            Object.keys(source).forEach(key => {\n                // Check if source[key] is an object and target[key] is either undefined, null, or an object\n                if (this.isObject(source[key])) {\n                    if (!(key in target) || target[key] === null) {\n                        // If target[key] doesn't exist or is null, directly assign source[key]\n                        Object.assign(output, { [key]: structuredClone(source[key]) });\n                    } else {\n                        // Only deep merge if target[key] is also an object\n                        output[key] = this.isObject(target[key])\n                            ? this.deepMerge(target[key], source[key])\n                            : structuredClone(source[key]);\n                    }\n                } else {\n                    Object.assign(output, { [key]: source[key] });\n                }\n            });\n        }\n        return output;\n    }\n\n    /**\n     * checks if the given item is an object\n     * @param item the item that will be checked\n     */\n    private isObject(item: unknown): item is object {\n        return item && typeof item === 'object' && !Array.isArray(item);\n    }\n\n    /**\n     * returns a copy of the given value whether this value is object or primitive. For the arrays it will cover\n     * multidimensional arrays, but it will not cover an object that contain functions. JSON.parse and JSON.stringify\n     * might have performance issues on large scale objects but that's an edge case scenario. In case that happens in\n     * the future follow the technique of NGRX with function caching.\n     *\n     * @param state\n     */\n    private copy(state: T): T {\n        if (typeof state === 'undefined') {\n            return undefined;\n        }\n        return JSON.parse(JSON.stringify(state));\n    }\n}\n\nconst getAppLoadedConfigModules: Selector<CoreState, LoadedConfigModules> = (state: CoreState) => state?.app?.loadedConfigModules\n\nexport abstract class EuiLazyService<T> extends EuiService<T> {\n    protected stateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n\n    protected constructor(defaultState: T) {\n        super(defaultState);\n    }\n\n    abstract lazyLoadInit(moduleConfig: ModuleConfig, moduleName?: string): Observable<EuiServiceStatus>;\n\n    // todo it should use abstract store service\n    initEuiService(storeForLazyLoad?: EuiStoreServiceModel<T>): void {\n        super.initEuiService();\n\n        if (storeForLazyLoad) {\n            this.$stateLazyLoadSubs = storeForLazyLoad\n                .select(getAppLoadedConfigModules)\n                .pipe(\n                    filter((loadedConfigModules: LoadedConfigModules) =>\n                        loadedConfigModules?.modulesConfig?.[loadedConfigModules.lastAddedModule] ? true : false,\n                    ),\n                    switchMap((loadedConfigModules: LoadedConfigModules) =>\n                        this.lazyLoadInit(\n                            loadedConfigModules.modulesConfig[loadedConfigModules.lastAddedModule],\n                            loadedConfigModules.lastAddedModule,\n                        ),\n                    ),\n                )\n                .subscribe(null);\n        }\n    }\n}\n\n/**\n * EuiServiceStatus is a model that represents the status of the service. It has a boolean property that indicates\n * whether the service was successful or not. If the service was not successful it will have an error property that\n * contains the error message.\n * @param T the type of the error message\n * @property success a boolean property that indicates whether the service was successful or not\n * @property error an optional property that contains the error message\n */\nexport interface EuiServiceStatus<T = unknown> {\n    success: boolean;\n    error?: T;\n}\n",
+            "sourceCode": "import { Observable, Subject, Subscription } from 'rxjs';\nimport { ModuleConfig } from './eui-config/eui-app-config';\nimport { LoadedConfigModules } from './eui-store/state/app.state';\nimport { EuiStoreServiceModel } from './eui-store/eui-store-service.model';\nimport { filter, switchMap } from 'rxjs/operators';\nimport { Selector } from 'reselect';\nimport { CoreState } from './eui-store';\n\nexport interface EuiServiceModel<T> {\n    init(t: T): Observable<EuiServiceStatus>;\n\n    /**\n     * retrieves the State of the service. If you don't pass anything it will retrieve the whole State\n     * of that service. If you pass a selector or MapFunction it will retrieve a slice of the state. If\n     * you pass a string that's a key of the Service State type it will retrieve that slice of the state.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    getState<K = T>(): Observable<T>;\n    getState<K>(mapFn: (state: T) => K): Observable<K>;\n    getState<A extends keyof T>(key: A): Observable<T[A]>;\n    getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    updateState(t: T): void;\n}\n\nexport type DeepPartial<T> = {\n    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport abstract class EuiService<T> implements EuiServiceModel<T> {\n    protected stateInstance: T;\n    protected prevStateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n    onStateChange: Subject<T> = new Subject<T>();\n\n    protected constructor(defaultState: T) {\n        this.stateInstance = defaultState;\n    }\n\n    initEuiService(): void {\n        this.unSubscribe();\n        this.$stateSubs = this.getState().subscribe((newState: T) => {\n            // set previous state of service\n            this.prevStateInstance = this.copy(this.stateInstance);\n            // update state before emit event\n            this.stateInstance = this.copy(newState);\n            // inform about state change\n            this.onStateChange.next(newState);\n        });\n    }\n\n    abstract init(t?: T): Observable<EuiServiceStatus>;\n\n    abstract getState<K = T>(): Observable<T>;\n    abstract getState<K>(mapFn?: (state: T) => K): Observable<K>;\n    abstract getState<A extends keyof T>(key?: A): Observable<T[A]>;\n    abstract getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    abstract updateState(t: DeepPartial<T>): void;\n\n    protected unSubscribe(): void {\n        if (this.$stateSubs && this.$stateSubs.unsubscribe) {\n            this.$stateSubs.unsubscribe();\n        }\n        if (this.$stateLazyLoadSubs && this.$stateLazyLoadSubs.unsubscribe) {\n            this.$stateLazyLoadSubs.unsubscribe();\n        }\n    }\n\n    /**\n     * deep merge two objects\n     * @param target the object that will be merged into\n     * @param source the object that will be merged from\n     */\n    protected deepMerge<T>(target: T, source: DeepPartial<T>): T {\n        const output = Object.assign({}, target);\n        if (this.isObject(target) && this.isObject(source)) {\n            Object.keys(source).forEach(key => {\n                // Check if source[key] is an object and target[key] is either undefined, null, or an object\n                if (this.isObject(source[key])) {\n                    if (!(key in target) || target[key] === null) {\n                        // If target[key] doesn't exist or is null, directly assign source[key]\n                        Object.assign(output, { [key]: structuredClone(source[key]) });\n                    } else {\n                        // Only deep merge if target[key] is also an object\n                        output[key] = this.isObject(target[key])\n                            ? this.deepMerge(target[key], source[key])\n                            : structuredClone(source[key]);\n                    }\n                } else {\n                    Object.assign(output, { [key]: source[key] });\n                }\n            });\n        }\n        return output;\n    }\n\n    /**\n     * checks if the given item is an object\n     * @param item the item that will be checked\n     */\n    private isObject(item: unknown): item is object {\n        return item && typeof item === 'object' && !Array.isArray(item);\n    }\n\n    /**\n     * returns a copy of the given value whether this value is object or primitive. For the arrays it will cover\n     * multidimensional arrays, but it will not cover an object that contain functions. JSON.parse and JSON.stringify\n     * might have performance issues on large scale objects but that's an edge case scenario. In case that happens in\n     * the future follow the technique of NGRX with function caching.\n     *\n     * @param state\n     */\n    private copy(state: T): T {\n        if (typeof state === 'undefined') {\n            return undefined;\n        }\n        return JSON.parse(JSON.stringify(state));\n    }\n}\n\nconst getAppLoadedConfigModules: Selector<CoreState, LoadedConfigModules> = (state: CoreState) => state?.app?.loadedConfigModules\n\nexport abstract class EuiLazyService<T> extends EuiService<T> {\n    protected override stateInstance: T;\n    protected override $stateSubs: Subscription;\n    protected override $stateLazyLoadSubs: Subscription;\n\n    protected constructor(defaultState: T) {\n        super(defaultState);\n    }\n\n    abstract lazyLoadInit(moduleConfig: ModuleConfig, moduleName?: string): Observable<EuiServiceStatus>;\n\n    // todo it should use abstract store service\n    override initEuiService(storeForLazyLoad?: EuiStoreServiceModel<T>): void {\n        super.initEuiService();\n\n        if (storeForLazyLoad) {\n            this.$stateLazyLoadSubs = storeForLazyLoad\n                .select(getAppLoadedConfigModules)\n                .pipe(\n                    filter((loadedConfigModules: LoadedConfigModules) =>\n                        loadedConfigModules?.modulesConfig?.[loadedConfigModules.lastAddedModule] ? true : false,\n                    ),\n                    switchMap((loadedConfigModules: LoadedConfigModules) =>\n                        this.lazyLoadInit(\n                            loadedConfigModules.modulesConfig[loadedConfigModules.lastAddedModule],\n                            loadedConfigModules.lastAddedModule,\n                        ),\n                    ),\n                )\n                .subscribe(null);\n        }\n    }\n}\n\n/**\n * EuiServiceStatus is a model that represents the status of the service. It has a boolean property that indicates\n * whether the service was successful or not. If the service was not successful it will have an error property that\n * contains the error message.\n * @param T the type of the error message\n * @property success a boolean property that indicates whether the service was successful or not\n * @property error an optional property that contains the error message\n */\nexport interface EuiServiceStatus<T = unknown> {\n    success: boolean;\n    error?: T;\n}\n",
             "properties": [],
             "indexSignatures": [],
             "kind": 174,
@@ -1737,12 +1737,12 @@
         },
         {
             "name": "EuiServiceStatus",
-            "id": "interface-EuiServiceStatus-e9132d3f4903942a1ce129a8f89fbc7f234381e7a11e802724aba9a17db912d4e921e6ed31c8b20cfa41a87b2fd7166ff5cb1e4663e5d90353fb929d3b31af98",
+            "id": "interface-EuiServiceStatus-6c072c68250cd88ba317937e0a34489a84c952e84a33e3311d45156434f863e376c7fd001fee45311d599580ff6c530923c9f317b1ddc57c4d569c6d263d9811",
             "file": "packages/base/src/lib/eui-models/eui-service.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { Observable, Subject, Subscription } from 'rxjs';\nimport { ModuleConfig } from './eui-config/eui-app-config';\nimport { LoadedConfigModules } from './eui-store/state/app.state';\nimport { EuiStoreServiceModel } from './eui-store/eui-store-service.model';\nimport { filter, switchMap } from 'rxjs/operators';\nimport { Selector } from 'reselect';\nimport { CoreState } from './eui-store';\n\nexport interface EuiServiceModel<T> {\n    init(t: T): Observable<EuiServiceStatus>;\n\n    /**\n     * retrieves the State of the service. If you don't pass anything it will retrieve the whole State\n     * of that service. If you pass a selector or MapFunction it will retrieve a slice of the state. If\n     * you pass a string that's a key of the Service State type it will retrieve that slice of the state.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    getState<K = T>(): Observable<T>;\n    getState<K>(mapFn: (state: T) => K): Observable<K>;\n    getState<A extends keyof T>(key: A): Observable<T[A]>;\n    getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    updateState(t: T): void;\n}\n\nexport type DeepPartial<T> = {\n    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport abstract class EuiService<T> implements EuiServiceModel<T> {\n    protected stateInstance: T;\n    protected prevStateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n    onStateChange: Subject<T> = new Subject<T>();\n\n    protected constructor(defaultState: T) {\n        this.stateInstance = defaultState;\n    }\n\n    initEuiService(): void {\n        this.unSubscribe();\n        this.$stateSubs = this.getState().subscribe((newState: T) => {\n            // set previous state of service\n            this.prevStateInstance = this.copy(this.stateInstance);\n            // update state before emit event\n            this.stateInstance = this.copy(newState);\n            // inform about state change\n            this.onStateChange.next(newState);\n        });\n    }\n\n    abstract init(t?: T): Observable<EuiServiceStatus>;\n\n    abstract getState<K = T>(): Observable<T>;\n    abstract getState<K>(mapFn?: (state: T) => K): Observable<K>;\n    abstract getState<A extends keyof T>(key?: A): Observable<T[A]>;\n    abstract getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    abstract updateState(t: DeepPartial<T>): void;\n\n    protected unSubscribe(): void {\n        if (this.$stateSubs && this.$stateSubs.unsubscribe) {\n            this.$stateSubs.unsubscribe();\n        }\n        if (this.$stateLazyLoadSubs && this.$stateLazyLoadSubs.unsubscribe) {\n            this.$stateLazyLoadSubs.unsubscribe();\n        }\n    }\n\n    /**\n     * deep merge two objects\n     * @param target the object that will be merged into\n     * @param source the object that will be merged from\n     */\n    protected deepMerge<T>(target: T, source: DeepPartial<T>): T {\n        const output = Object.assign({}, target);\n        if (this.isObject(target) && this.isObject(source)) {\n            Object.keys(source).forEach(key => {\n                // Check if source[key] is an object and target[key] is either undefined, null, or an object\n                if (this.isObject(source[key])) {\n                    if (!(key in target) || target[key] === null) {\n                        // If target[key] doesn't exist or is null, directly assign source[key]\n                        Object.assign(output, { [key]: structuredClone(source[key]) });\n                    } else {\n                        // Only deep merge if target[key] is also an object\n                        output[key] = this.isObject(target[key])\n                            ? this.deepMerge(target[key], source[key])\n                            : structuredClone(source[key]);\n                    }\n                } else {\n                    Object.assign(output, { [key]: source[key] });\n                }\n            });\n        }\n        return output;\n    }\n\n    /**\n     * checks if the given item is an object\n     * @param item the item that will be checked\n     */\n    private isObject(item: unknown): item is object {\n        return item && typeof item === 'object' && !Array.isArray(item);\n    }\n\n    /**\n     * returns a copy of the given value whether this value is object or primitive. For the arrays it will cover\n     * multidimensional arrays, but it will not cover an object that contain functions. JSON.parse and JSON.stringify\n     * might have performance issues on large scale objects but that's an edge case scenario. In case that happens in\n     * the future follow the technique of NGRX with function caching.\n     *\n     * @param state\n     */\n    private copy(state: T): T {\n        if (typeof state === 'undefined') {\n            return undefined;\n        }\n        return JSON.parse(JSON.stringify(state));\n    }\n}\n\nconst getAppLoadedConfigModules: Selector<CoreState, LoadedConfigModules> = (state: CoreState) => state?.app?.loadedConfigModules\n\nexport abstract class EuiLazyService<T> extends EuiService<T> {\n    protected stateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n\n    protected constructor(defaultState: T) {\n        super(defaultState);\n    }\n\n    abstract lazyLoadInit(moduleConfig: ModuleConfig, moduleName?: string): Observable<EuiServiceStatus>;\n\n    // todo it should use abstract store service\n    initEuiService(storeForLazyLoad?: EuiStoreServiceModel<T>): void {\n        super.initEuiService();\n\n        if (storeForLazyLoad) {\n            this.$stateLazyLoadSubs = storeForLazyLoad\n                .select(getAppLoadedConfigModules)\n                .pipe(\n                    filter((loadedConfigModules: LoadedConfigModules) =>\n                        loadedConfigModules?.modulesConfig?.[loadedConfigModules.lastAddedModule] ? true : false,\n                    ),\n                    switchMap((loadedConfigModules: LoadedConfigModules) =>\n                        this.lazyLoadInit(\n                            loadedConfigModules.modulesConfig[loadedConfigModules.lastAddedModule],\n                            loadedConfigModules.lastAddedModule,\n                        ),\n                    ),\n                )\n                .subscribe(null);\n        }\n    }\n}\n\n/**\n * EuiServiceStatus is a model that represents the status of the service. It has a boolean property that indicates\n * whether the service was successful or not. If the service was not successful it will have an error property that\n * contains the error message.\n * @param T the type of the error message\n * @property success a boolean property that indicates whether the service was successful or not\n * @property error an optional property that contains the error message\n */\nexport interface EuiServiceStatus<T = unknown> {\n    success: boolean;\n    error?: T;\n}\n",
+            "sourceCode": "import { Observable, Subject, Subscription } from 'rxjs';\nimport { ModuleConfig } from './eui-config/eui-app-config';\nimport { LoadedConfigModules } from './eui-store/state/app.state';\nimport { EuiStoreServiceModel } from './eui-store/eui-store-service.model';\nimport { filter, switchMap } from 'rxjs/operators';\nimport { Selector } from 'reselect';\nimport { CoreState } from './eui-store';\n\nexport interface EuiServiceModel<T> {\n    init(t: T): Observable<EuiServiceStatus>;\n\n    /**\n     * retrieves the State of the service. If you don't pass anything it will retrieve the whole State\n     * of that service. If you pass a selector or MapFunction it will retrieve a slice of the state. If\n     * you pass a string that's a key of the Service State type it will retrieve that slice of the state.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    getState<K = T>(): Observable<T>;\n    getState<K>(mapFn: (state: T) => K): Observable<K>;\n    getState<A extends keyof T>(key: A): Observable<T[A]>;\n    getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    updateState(t: T): void;\n}\n\nexport type DeepPartial<T> = {\n    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport abstract class EuiService<T> implements EuiServiceModel<T> {\n    protected stateInstance: T;\n    protected prevStateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n    onStateChange: Subject<T> = new Subject<T>();\n\n    protected constructor(defaultState: T) {\n        this.stateInstance = defaultState;\n    }\n\n    initEuiService(): void {\n        this.unSubscribe();\n        this.$stateSubs = this.getState().subscribe((newState: T) => {\n            // set previous state of service\n            this.prevStateInstance = this.copy(this.stateInstance);\n            // update state before emit event\n            this.stateInstance = this.copy(newState);\n            // inform about state change\n            this.onStateChange.next(newState);\n        });\n    }\n\n    abstract init(t?: T): Observable<EuiServiceStatus>;\n\n    abstract getState<K = T>(): Observable<T>;\n    abstract getState<K>(mapFn?: (state: T) => K): Observable<K>;\n    abstract getState<A extends keyof T>(key?: A): Observable<T[A]>;\n    abstract getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    abstract updateState(t: DeepPartial<T>): void;\n\n    protected unSubscribe(): void {\n        if (this.$stateSubs && this.$stateSubs.unsubscribe) {\n            this.$stateSubs.unsubscribe();\n        }\n        if (this.$stateLazyLoadSubs && this.$stateLazyLoadSubs.unsubscribe) {\n            this.$stateLazyLoadSubs.unsubscribe();\n        }\n    }\n\n    /**\n     * deep merge two objects\n     * @param target the object that will be merged into\n     * @param source the object that will be merged from\n     */\n    protected deepMerge<T>(target: T, source: DeepPartial<T>): T {\n        const output = Object.assign({}, target);\n        if (this.isObject(target) && this.isObject(source)) {\n            Object.keys(source).forEach(key => {\n                // Check if source[key] is an object and target[key] is either undefined, null, or an object\n                if (this.isObject(source[key])) {\n                    if (!(key in target) || target[key] === null) {\n                        // If target[key] doesn't exist or is null, directly assign source[key]\n                        Object.assign(output, { [key]: structuredClone(source[key]) });\n                    } else {\n                        // Only deep merge if target[key] is also an object\n                        output[key] = this.isObject(target[key])\n                            ? this.deepMerge(target[key], source[key])\n                            : structuredClone(source[key]);\n                    }\n                } else {\n                    Object.assign(output, { [key]: source[key] });\n                }\n            });\n        }\n        return output;\n    }\n\n    /**\n     * checks if the given item is an object\n     * @param item the item that will be checked\n     */\n    private isObject(item: unknown): item is object {\n        return item && typeof item === 'object' && !Array.isArray(item);\n    }\n\n    /**\n     * returns a copy of the given value whether this value is object or primitive. For the arrays it will cover\n     * multidimensional arrays, but it will not cover an object that contain functions. JSON.parse and JSON.stringify\n     * might have performance issues on large scale objects but that's an edge case scenario. In case that happens in\n     * the future follow the technique of NGRX with function caching.\n     *\n     * @param state\n     */\n    private copy(state: T): T {\n        if (typeof state === 'undefined') {\n            return undefined;\n        }\n        return JSON.parse(JSON.stringify(state));\n    }\n}\n\nconst getAppLoadedConfigModules: Selector<CoreState, LoadedConfigModules> = (state: CoreState) => state?.app?.loadedConfigModules\n\nexport abstract class EuiLazyService<T> extends EuiService<T> {\n    protected override stateInstance: T;\n    protected override $stateSubs: Subscription;\n    protected override $stateLazyLoadSubs: Subscription;\n\n    protected constructor(defaultState: T) {\n        super(defaultState);\n    }\n\n    abstract lazyLoadInit(moduleConfig: ModuleConfig, moduleName?: string): Observable<EuiServiceStatus>;\n\n    // todo it should use abstract store service\n    override initEuiService(storeForLazyLoad?: EuiStoreServiceModel<T>): void {\n        super.initEuiService();\n\n        if (storeForLazyLoad) {\n            this.$stateLazyLoadSubs = storeForLazyLoad\n                .select(getAppLoadedConfigModules)\n                .pipe(\n                    filter((loadedConfigModules: LoadedConfigModules) =>\n                        loadedConfigModules?.modulesConfig?.[loadedConfigModules.lastAddedModule] ? true : false,\n                    ),\n                    switchMap((loadedConfigModules: LoadedConfigModules) =>\n                        this.lazyLoadInit(\n                            loadedConfigModules.modulesConfig[loadedConfigModules.lastAddedModule],\n                            loadedConfigModules.lastAddedModule,\n                        ),\n                    ),\n                )\n                .subscribe(null);\n        }\n    }\n}\n\n/**\n * EuiServiceStatus is a model that represents the status of the service. It has a boolean property that indicates\n * whether the service was successful or not. If the service was not successful it will have an error property that\n * contains the error message.\n * @param T the type of the error message\n * @property success a boolean property that indicates whether the service was successful or not\n * @property error an optional property that contains the error message\n */\nexport interface EuiServiceStatus<T = unknown> {\n    success: boolean;\n    error?: T;\n}\n",
             "properties": [
                 {
                     "name": "error",
@@ -2033,12 +2033,12 @@
         },
         {
             "name": "I18nConfig",
-            "id": "interface-I18nConfig-d3ab1e025b3bb93d28aa42a6c9e9c1057b451107c39e09ff2f7e6196182ad9a5f4b0da0c70d251efaae48248e69dc85b0f067b085d126dc7d1bce7bf8e3e16d3",
+            "id": "interface-I18nConfig-b0a3a5425955f09a46ff08822b65a5ae1d4ca4dc78c1b96e6a14c0c5f7972681fa7b353d2a3fe08cca30bc79ecfcf44c57f08bb6d54ede82673cc3a54119254a",
             "file": "packages/base/src/lib/eui-models/eui-config/i18n.config.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { GlobalConfig } from './eui-app-config';\nimport { EuiLanguage } from '../eui-language/eui-language.model';\n\nexport interface I18nResource {\n    /** prefix of the resource could be like the 2 char language code e.g. /en */\n    prefix: string;\n    /** suffix can be either .json or anything related of the resource HTTP call */\n    suffix?: string;\n    /**\n     It is an ID of the function which should be defined into the customHandlers with the interface TranslationsCompiler\n     */\n    compileTranslations?: string;\n}\n\n/**\n * a factory to compile translations into the main object holding them all\n *\n * @param translations the object to be pre-processed\n * @param lang the translations language\n * @returns the pre-processed translations\n */\nexport type TranslationsCompiler<T = unknown, C = unknown> = (translations: T, lang: string) => C;\n\nexport interface I18nConfig {\n    i18nService: I18nServiceConfig;\n    i18nLoader: I18nLoaderConfig;\n}\n\nexport interface I18nServiceConfig {\n    /** an ISO 2 char code array of available languages */\n    languages?: (string | EuiLanguage)[];\n    /** default language to be used in case of not any has been set */\n    defaultLanguage?: string;\n}\n\nexport interface I18nLoaderConfig {\n    /**\n     * Those folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\n     * e.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\n     * Important! the language code will be added automatically to the end of the url except if the url ends with a slash.\n     */\n    i18nFolders?: string | string[];\n    /**\n     * Array of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\n     * Keep in mind that the url should be the prefix and not contain any suffix.\n     */\n    i18nServices?: string | string[];\n    /**\n     * It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\n     * provide the prefix and suffix of the resource, or both.\n     *\n     * @example\n     * ```typescript\n     * export function CompileTranslations(translations: any): any {\n     *     const result = {};\n     *     translations.forEach((translation: any) => {\n     *         // extract the key and value from the translation object\n     *         const key = translation['key'];\n     *         const value = translation['value'];\n     *         if (key && value) {\n     *             result[key] = value;\n     *         }\n     *     });\n     *     return result;\n     * }\n     * export const appConfig: EuiAppConfig = {\n     *     ...,\n     *     customHandler: {\n     *         'CompileTranslations_ID': CompileTranslations\n     *     }\n     * };\n     * export const GLOBAL: GlobalConfig = {\n     *     ...,\n     *     i18n: {\n     *       i18nLoader: {\n     *         i18nFolders: ['i18n-eui'],\n     *         i18nResources: [{\n     *             prefix: 'api/translations/',\n     *             compileTranslations: 'CompileTranslations_ID',\n     *         }]\n     *       }\n     *     }\n     * };\n     *\n     */\n    i18nResources?: I18nResource | I18nResource[];\n}\n\nexport const getI18nServiceConfigFromBase = (baseGlobalConfig: GlobalConfig): I18nServiceConfig => {\n    if(!baseGlobalConfig) throw new Error('baseGlobalConfig is required');\n    const i18nServiceConfig = baseGlobalConfig && baseGlobalConfig.i18n && baseGlobalConfig.i18n.i18nService;\n    const { languages, defaultLanguage } = getI18nServiceConfig(i18nServiceConfig);\n\n    return { languages, defaultLanguage };\n};\n\nexport const getI18nServiceConfig = (config: I18nServiceConfig): I18nServiceConfig => Object.assign({}, config);\n\nexport const getI18nLoaderConfig = (config: I18nLoaderConfig): I18nLoaderConfig => {\n    const { i18nFolders, i18nServices, i18nResources } = Object.assign({}, config);\n    return { i18nFolders, i18nServices, i18nResources };\n};\n\n/**\n * returns a language code based on https://tools.ietf.org/rfc/bcp/bcp47.txt specification. To get the Browser's\n * it's using the navigator.language, splits by hyphen and get the first part.\n */\nexport const getBrowserDefaultLanguage = (): string => navigator.language.split('-')[0];\n\n/**\n * returns an array of DOMStrings representing the user's preferred languages. The language is described using BCP 47\n * language tags. In the returned array they are ordered by preference with the most preferred language first.\n * The array languages will be lower cased 2 char code.\n */\nexport const getBrowserPreferredLanguages = (): string[] => navigator.languages.map((lang) => lang.split('-')[0]);\n",
+            "sourceCode": "import { GlobalConfig } from './eui-app-config';\nimport { EuiLanguage } from '../eui-language/eui-language.model';\n\nexport interface I18nResource {\n    /** prefix of the resource could be like the 2 char language code e.g. /en */\n    prefix: string;\n    /** suffix can be either .json or anything related of the resource HTTP call */\n    suffix?: string;\n    /**\n     It is an ID of the function which should be defined into the customHandlers with the interface TranslationsCompiler\n     */\n    compileTranslations?: string;\n}\n\n/**\n * a factory to compile translations into the main object holding them all\n *\n * @param translations the object to be pre-processed\n * @param lang the translations language\n * @returns the pre-processed translations\n */\nexport type TranslationsCompiler<T = unknown, C = unknown> = (translations: T, lang: string) => C;\n\nexport interface I18nConfig {\n    icuEnabled?: boolean;\n    i18nService: I18nServiceConfig;\n    i18nLoader: I18nLoaderConfig;\n}\n\nexport interface I18nServiceConfig {\n    /** an ISO 2 char code array of available languages */\n    languages?: (string | EuiLanguage)[];\n    /** default language to be used in case of not any has been set */\n    defaultLanguage?: string;\n}\n\nexport interface I18nLoaderConfig {\n    /**\n     * Those folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\n     * e.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\n     * Important! the language code will be added automatically to the end of the url except if the url ends with a slash.\n     */\n    i18nFolders?: string | string[];\n    /**\n     * Array of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\n     * Keep in mind that the url should be the prefix and not contain any suffix.\n     */\n    i18nServices?: string | string[];\n    /**\n     * It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\n     * provide the prefix and suffix of the resource, or both.\n     *\n     * @example\n     * ```typescript\n     * export function CompileTranslations(translations: any): any {\n     *     const result = {};\n     *     translations.forEach((translation: any) => {\n     *         // extract the key and value from the translation object\n     *         const key = translation['key'];\n     *         const value = translation['value'];\n     *         if (key && value) {\n     *             result[key] = value;\n     *         }\n     *     });\n     *     return result;\n     * }\n     * export const appConfig: EuiAppConfig = {\n     *     ...,\n     *     customHandler: {\n     *         'CompileTranslations_ID': CompileTranslations\n     *     }\n     * };\n     * export const GLOBAL: GlobalConfig = {\n     *     ...,\n     *     i18n: {\n     *       i18nLoader: {\n     *         i18nFolders: ['i18n-eui'],\n     *         i18nResources: [{\n     *             prefix: 'api/translations/',\n     *             compileTranslations: 'CompileTranslations_ID',\n     *         }]\n     *       }\n     *     }\n     * };\n     *\n     */\n    i18nResources?: I18nResource | I18nResource[];\n}\n\nexport const getI18nServiceConfigFromBase = (baseGlobalConfig: GlobalConfig): I18nServiceConfig => {\n    if(!baseGlobalConfig) throw new Error('baseGlobalConfig is required');\n    const i18nServiceConfig = baseGlobalConfig && baseGlobalConfig.i18n && baseGlobalConfig.i18n.i18nService;\n    const { languages, defaultLanguage } = getI18nServiceConfig(i18nServiceConfig);\n\n    return { languages, defaultLanguage };\n};\n\nexport const getI18nServiceConfig = (config: I18nServiceConfig): I18nServiceConfig => Object.assign({}, config);\n\nexport const getI18nLoaderConfig = (config: I18nLoaderConfig): I18nLoaderConfig => {\n    const { i18nFolders, i18nServices, i18nResources } = Object.assign({}, config);\n    return { i18nFolders, i18nServices, i18nResources };\n};\n\n/**\n * returns a language code based on https://tools.ietf.org/rfc/bcp/bcp47.txt specification. To get the Browser's\n * it's using the navigator.language, splits by hyphen and get the first part.\n */\nexport const getBrowserDefaultLanguage = (): string => navigator.language.split('-')[0];\n\n/**\n * returns an array of DOMStrings representing the user's preferred languages. The language is described using BCP 47\n * language tags. In the returned array they are ordered by preference with the most preferred language first.\n * The array languages will be lower cased 2 char code.\n */\nexport const getBrowserPreferredLanguages = (): string[] => navigator.languages.map((lang) => lang.split('-')[0]);\n",
             "properties": [
                 {
                     "name": "i18nLoader",
@@ -2048,7 +2048,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 26
+                    "line": 27
                 },
                 {
                     "name": "i18nService",
@@ -2058,6 +2058,16 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
+                    "line": 26
+                },
+                {
+                    "name": "icuEnabled",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "boolean",
+                    "indexKey": "",
+                    "optional": true,
+                    "description": "",
                     "line": 25
                 }
             ],
@@ -2068,12 +2078,12 @@
         },
         {
             "name": "I18nLoaderConfig",
-            "id": "interface-I18nLoaderConfig-d3ab1e025b3bb93d28aa42a6c9e9c1057b451107c39e09ff2f7e6196182ad9a5f4b0da0c70d251efaae48248e69dc85b0f067b085d126dc7d1bce7bf8e3e16d3",
+            "id": "interface-I18nLoaderConfig-b0a3a5425955f09a46ff08822b65a5ae1d4ca4dc78c1b96e6a14c0c5f7972681fa7b353d2a3fe08cca30bc79ecfcf44c57f08bb6d54ede82673cc3a54119254a",
             "file": "packages/base/src/lib/eui-models/eui-config/i18n.config.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { GlobalConfig } from './eui-app-config';\nimport { EuiLanguage } from '../eui-language/eui-language.model';\n\nexport interface I18nResource {\n    /** prefix of the resource could be like the 2 char language code e.g. /en */\n    prefix: string;\n    /** suffix can be either .json or anything related of the resource HTTP call */\n    suffix?: string;\n    /**\n     It is an ID of the function which should be defined into the customHandlers with the interface TranslationsCompiler\n     */\n    compileTranslations?: string;\n}\n\n/**\n * a factory to compile translations into the main object holding them all\n *\n * @param translations the object to be pre-processed\n * @param lang the translations language\n * @returns the pre-processed translations\n */\nexport type TranslationsCompiler<T = unknown, C = unknown> = (translations: T, lang: string) => C;\n\nexport interface I18nConfig {\n    i18nService: I18nServiceConfig;\n    i18nLoader: I18nLoaderConfig;\n}\n\nexport interface I18nServiceConfig {\n    /** an ISO 2 char code array of available languages */\n    languages?: (string | EuiLanguage)[];\n    /** default language to be used in case of not any has been set */\n    defaultLanguage?: string;\n}\n\nexport interface I18nLoaderConfig {\n    /**\n     * Those folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\n     * e.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\n     * Important! the language code will be added automatically to the end of the url except if the url ends with a slash.\n     */\n    i18nFolders?: string | string[];\n    /**\n     * Array of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\n     * Keep in mind that the url should be the prefix and not contain any suffix.\n     */\n    i18nServices?: string | string[];\n    /**\n     * It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\n     * provide the prefix and suffix of the resource, or both.\n     *\n     * @example\n     * ```typescript\n     * export function CompileTranslations(translations: any): any {\n     *     const result = {};\n     *     translations.forEach((translation: any) => {\n     *         // extract the key and value from the translation object\n     *         const key = translation['key'];\n     *         const value = translation['value'];\n     *         if (key && value) {\n     *             result[key] = value;\n     *         }\n     *     });\n     *     return result;\n     * }\n     * export const appConfig: EuiAppConfig = {\n     *     ...,\n     *     customHandler: {\n     *         'CompileTranslations_ID': CompileTranslations\n     *     }\n     * };\n     * export const GLOBAL: GlobalConfig = {\n     *     ...,\n     *     i18n: {\n     *       i18nLoader: {\n     *         i18nFolders: ['i18n-eui'],\n     *         i18nResources: [{\n     *             prefix: 'api/translations/',\n     *             compileTranslations: 'CompileTranslations_ID',\n     *         }]\n     *       }\n     *     }\n     * };\n     *\n     */\n    i18nResources?: I18nResource | I18nResource[];\n}\n\nexport const getI18nServiceConfigFromBase = (baseGlobalConfig: GlobalConfig): I18nServiceConfig => {\n    if(!baseGlobalConfig) throw new Error('baseGlobalConfig is required');\n    const i18nServiceConfig = baseGlobalConfig && baseGlobalConfig.i18n && baseGlobalConfig.i18n.i18nService;\n    const { languages, defaultLanguage } = getI18nServiceConfig(i18nServiceConfig);\n\n    return { languages, defaultLanguage };\n};\n\nexport const getI18nServiceConfig = (config: I18nServiceConfig): I18nServiceConfig => Object.assign({}, config);\n\nexport const getI18nLoaderConfig = (config: I18nLoaderConfig): I18nLoaderConfig => {\n    const { i18nFolders, i18nServices, i18nResources } = Object.assign({}, config);\n    return { i18nFolders, i18nServices, i18nResources };\n};\n\n/**\n * returns a language code based on https://tools.ietf.org/rfc/bcp/bcp47.txt specification. To get the Browser's\n * it's using the navigator.language, splits by hyphen and get the first part.\n */\nexport const getBrowserDefaultLanguage = (): string => navigator.language.split('-')[0];\n\n/**\n * returns an array of DOMStrings representing the user's preferred languages. The language is described using BCP 47\n * language tags. In the returned array they are ordered by preference with the most preferred language first.\n * The array languages will be lower cased 2 char code.\n */\nexport const getBrowserPreferredLanguages = (): string[] => navigator.languages.map((lang) => lang.split('-')[0]);\n",
+            "sourceCode": "import { GlobalConfig } from './eui-app-config';\nimport { EuiLanguage } from '../eui-language/eui-language.model';\n\nexport interface I18nResource {\n    /** prefix of the resource could be like the 2 char language code e.g. /en */\n    prefix: string;\n    /** suffix can be either .json or anything related of the resource HTTP call */\n    suffix?: string;\n    /**\n     It is an ID of the function which should be defined into the customHandlers with the interface TranslationsCompiler\n     */\n    compileTranslations?: string;\n}\n\n/**\n * a factory to compile translations into the main object holding them all\n *\n * @param translations the object to be pre-processed\n * @param lang the translations language\n * @returns the pre-processed translations\n */\nexport type TranslationsCompiler<T = unknown, C = unknown> = (translations: T, lang: string) => C;\n\nexport interface I18nConfig {\n    icuEnabled?: boolean;\n    i18nService: I18nServiceConfig;\n    i18nLoader: I18nLoaderConfig;\n}\n\nexport interface I18nServiceConfig {\n    /** an ISO 2 char code array of available languages */\n    languages?: (string | EuiLanguage)[];\n    /** default language to be used in case of not any has been set */\n    defaultLanguage?: string;\n}\n\nexport interface I18nLoaderConfig {\n    /**\n     * Those folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\n     * e.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\n     * Important! the language code will be added automatically to the end of the url except if the url ends with a slash.\n     */\n    i18nFolders?: string | string[];\n    /**\n     * Array of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\n     * Keep in mind that the url should be the prefix and not contain any suffix.\n     */\n    i18nServices?: string | string[];\n    /**\n     * It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\n     * provide the prefix and suffix of the resource, or both.\n     *\n     * @example\n     * ```typescript\n     * export function CompileTranslations(translations: any): any {\n     *     const result = {};\n     *     translations.forEach((translation: any) => {\n     *         // extract the key and value from the translation object\n     *         const key = translation['key'];\n     *         const value = translation['value'];\n     *         if (key && value) {\n     *             result[key] = value;\n     *         }\n     *     });\n     *     return result;\n     * }\n     * export const appConfig: EuiAppConfig = {\n     *     ...,\n     *     customHandler: {\n     *         'CompileTranslations_ID': CompileTranslations\n     *     }\n     * };\n     * export const GLOBAL: GlobalConfig = {\n     *     ...,\n     *     i18n: {\n     *       i18nLoader: {\n     *         i18nFolders: ['i18n-eui'],\n     *         i18nResources: [{\n     *             prefix: 'api/translations/',\n     *             compileTranslations: 'CompileTranslations_ID',\n     *         }]\n     *       }\n     *     }\n     * };\n     *\n     */\n    i18nResources?: I18nResource | I18nResource[];\n}\n\nexport const getI18nServiceConfigFromBase = (baseGlobalConfig: GlobalConfig): I18nServiceConfig => {\n    if(!baseGlobalConfig) throw new Error('baseGlobalConfig is required');\n    const i18nServiceConfig = baseGlobalConfig && baseGlobalConfig.i18n && baseGlobalConfig.i18n.i18nService;\n    const { languages, defaultLanguage } = getI18nServiceConfig(i18nServiceConfig);\n\n    return { languages, defaultLanguage };\n};\n\nexport const getI18nServiceConfig = (config: I18nServiceConfig): I18nServiceConfig => Object.assign({}, config);\n\nexport const getI18nLoaderConfig = (config: I18nLoaderConfig): I18nLoaderConfig => {\n    const { i18nFolders, i18nServices, i18nResources } = Object.assign({}, config);\n    return { i18nFolders, i18nServices, i18nResources };\n};\n\n/**\n * returns a language code based on https://tools.ietf.org/rfc/bcp/bcp47.txt specification. To get the Browser's\n * it's using the navigator.language, splits by hyphen and get the first part.\n */\nexport const getBrowserDefaultLanguage = (): string => navigator.language.split('-')[0];\n\n/**\n * returns an array of DOMStrings representing the user's preferred languages. The language is described using BCP 47\n * language tags. In the returned array they are ordered by preference with the most preferred language first.\n * The array languages will be lower cased 2 char code.\n */\nexport const getBrowserPreferredLanguages = (): string[] => navigator.languages.map((lang) => lang.split('-')[0]);\n",
             "properties": [
                 {
                     "name": "i18nFolders",
@@ -2083,7 +2093,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "<p>Those folders will be used to load the translations files from {@link <a href=\"https://angular.io/guide/workspace-config#extra-build-and-test-options\">https://angular.io/guide/workspace-config#extra-build-and-test-options</a> assets}.\ne.g [<code>${environment.apiBaseUrl}translations/</code>, <code>${environment.apiBaseUrl}translations?lang=</code>]\nImportant! the language code will be added automatically to the end of the url except if the url ends with a slash.</p>\n",
-                    "line": 42,
+                    "line": 43,
                     "rawdescription": "\n\nThose folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\ne.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\nImportant! the language code will be added automatically to the end of the url except if the url ends with a slash.\n"
                 },
                 {
@@ -2094,20 +2104,20 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "<p>It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\nprovide the prefix and suffix of the resource, or both.</p>\n<b>Example :</b><div><pre class=\"line-numbers\"><code class=\"language-typescript\">export function CompileTranslations(translations: any): any {\n    const result = {};\n    translations.forEach((translation: any) =&gt; {\n        // extract the key and value from the translation object\n        const key = translation[&#39;key&#39;];\n        const value = translation[&#39;value&#39;];\n        if (key &amp;&amp; value) {\n            result[key] = value;\n        }\n    });\n    return result;\n}\nexport const appConfig: EuiAppConfig = {\n    ...,\n    customHandler: {\n        &#39;CompileTranslations_ID&#39;: CompileTranslations\n    }\n};\nexport const GLOBAL: GlobalConfig = {\n    ...,\n    i18n: {\n      i18nLoader: {\n        i18nFolders: [&#39;i18n-eui&#39;],\n        i18nResources: [{\n            prefix: &#39;api/translations/&#39;,\n            compileTranslations: &#39;CompileTranslations_ID&#39;,\n        }]\n      }\n    }\n};\n___COMPODOC_EMPTY_LINE___\n___COMPODOC_EMPTY_LINE___</code></pre></div>",
-                    "line": 86,
+                    "line": 87,
                     "rawdescription": "\n\nIt is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\nprovide the prefix and suffix of the resource, or both.\n\n```typescript\nexport function CompileTranslations(translations: any): any {\n    const result = {};\n    translations.forEach((translation: any) => {\n        // extract the key and value from the translation object\n        const key = translation['key'];\n        const value = translation['value'];\n        if (key && value) {\n            result[key] = value;\n        }\n    });\n    return result;\n}\nexport const appConfig: EuiAppConfig = {\n    ...,\n    customHandler: {\n        'CompileTranslations_ID': CompileTranslations\n    }\n};\nexport const GLOBAL: GlobalConfig = {\n    ...,\n    i18n: {\n      i18nLoader: {\n        i18nFolders: ['i18n-eui'],\n        i18nResources: [{\n            prefix: 'api/translations/',\n            compileTranslations: 'CompileTranslations_ID',\n        }]\n      }\n    }\n};\n___COMPODOC_EMPTY_LINE___\n___COMPODOC_EMPTY_LINE___",
                     "jsdoctags": [
                         {
-                            "pos": 2127,
-                            "end": 3164,
+                            "pos": 2153,
+                            "end": 3190,
                             "kind": 328,
                             "id": 0,
                             "flags": 16777216,
                             "modifierFlagsCache": 0,
                             "transformFlags": 0,
                             "tagName": {
-                                "pos": 2128,
-                                "end": 2135,
+                                "pos": 2154,
+                                "end": 2161,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16777216,
@@ -2126,7 +2136,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "<p>Array of service urls to translation, don&#39;t add the language it will be added e.g. <a href=\"http://net1/trans/en\">http://net1/trans/en</a>\nKeep in mind that the url should be the prefix and not contain any suffix.</p>\n",
-                    "line": 47,
+                    "line": 48,
                     "rawdescription": "\n\nArray of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\nKeep in mind that the url should be the prefix and not contain any suffix.\n"
                 }
             ],
@@ -2137,12 +2147,12 @@
         },
         {
             "name": "I18nResource",
-            "id": "interface-I18nResource-d3ab1e025b3bb93d28aa42a6c9e9c1057b451107c39e09ff2f7e6196182ad9a5f4b0da0c70d251efaae48248e69dc85b0f067b085d126dc7d1bce7bf8e3e16d3",
+            "id": "interface-I18nResource-b0a3a5425955f09a46ff08822b65a5ae1d4ca4dc78c1b96e6a14c0c5f7972681fa7b353d2a3fe08cca30bc79ecfcf44c57f08bb6d54ede82673cc3a54119254a",
             "file": "packages/base/src/lib/eui-models/eui-config/i18n.config.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { GlobalConfig } from './eui-app-config';\nimport { EuiLanguage } from '../eui-language/eui-language.model';\n\nexport interface I18nResource {\n    /** prefix of the resource could be like the 2 char language code e.g. /en */\n    prefix: string;\n    /** suffix can be either .json or anything related of the resource HTTP call */\n    suffix?: string;\n    /**\n     It is an ID of the function which should be defined into the customHandlers with the interface TranslationsCompiler\n     */\n    compileTranslations?: string;\n}\n\n/**\n * a factory to compile translations into the main object holding them all\n *\n * @param translations the object to be pre-processed\n * @param lang the translations language\n * @returns the pre-processed translations\n */\nexport type TranslationsCompiler<T = unknown, C = unknown> = (translations: T, lang: string) => C;\n\nexport interface I18nConfig {\n    i18nService: I18nServiceConfig;\n    i18nLoader: I18nLoaderConfig;\n}\n\nexport interface I18nServiceConfig {\n    /** an ISO 2 char code array of available languages */\n    languages?: (string | EuiLanguage)[];\n    /** default language to be used in case of not any has been set */\n    defaultLanguage?: string;\n}\n\nexport interface I18nLoaderConfig {\n    /**\n     * Those folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\n     * e.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\n     * Important! the language code will be added automatically to the end of the url except if the url ends with a slash.\n     */\n    i18nFolders?: string | string[];\n    /**\n     * Array of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\n     * Keep in mind that the url should be the prefix and not contain any suffix.\n     */\n    i18nServices?: string | string[];\n    /**\n     * It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\n     * provide the prefix and suffix of the resource, or both.\n     *\n     * @example\n     * ```typescript\n     * export function CompileTranslations(translations: any): any {\n     *     const result = {};\n     *     translations.forEach((translation: any) => {\n     *         // extract the key and value from the translation object\n     *         const key = translation['key'];\n     *         const value = translation['value'];\n     *         if (key && value) {\n     *             result[key] = value;\n     *         }\n     *     });\n     *     return result;\n     * }\n     * export const appConfig: EuiAppConfig = {\n     *     ...,\n     *     customHandler: {\n     *         'CompileTranslations_ID': CompileTranslations\n     *     }\n     * };\n     * export const GLOBAL: GlobalConfig = {\n     *     ...,\n     *     i18n: {\n     *       i18nLoader: {\n     *         i18nFolders: ['i18n-eui'],\n     *         i18nResources: [{\n     *             prefix: 'api/translations/',\n     *             compileTranslations: 'CompileTranslations_ID',\n     *         }]\n     *       }\n     *     }\n     * };\n     *\n     */\n    i18nResources?: I18nResource | I18nResource[];\n}\n\nexport const getI18nServiceConfigFromBase = (baseGlobalConfig: GlobalConfig): I18nServiceConfig => {\n    if(!baseGlobalConfig) throw new Error('baseGlobalConfig is required');\n    const i18nServiceConfig = baseGlobalConfig && baseGlobalConfig.i18n && baseGlobalConfig.i18n.i18nService;\n    const { languages, defaultLanguage } = getI18nServiceConfig(i18nServiceConfig);\n\n    return { languages, defaultLanguage };\n};\n\nexport const getI18nServiceConfig = (config: I18nServiceConfig): I18nServiceConfig => Object.assign({}, config);\n\nexport const getI18nLoaderConfig = (config: I18nLoaderConfig): I18nLoaderConfig => {\n    const { i18nFolders, i18nServices, i18nResources } = Object.assign({}, config);\n    return { i18nFolders, i18nServices, i18nResources };\n};\n\n/**\n * returns a language code based on https://tools.ietf.org/rfc/bcp/bcp47.txt specification. To get the Browser's\n * it's using the navigator.language, splits by hyphen and get the first part.\n */\nexport const getBrowserDefaultLanguage = (): string => navigator.language.split('-')[0];\n\n/**\n * returns an array of DOMStrings representing the user's preferred languages. The language is described using BCP 47\n * language tags. In the returned array they are ordered by preference with the most preferred language first.\n * The array languages will be lower cased 2 char code.\n */\nexport const getBrowserPreferredLanguages = (): string[] => navigator.languages.map((lang) => lang.split('-')[0]);\n",
+            "sourceCode": "import { GlobalConfig } from './eui-app-config';\nimport { EuiLanguage } from '../eui-language/eui-language.model';\n\nexport interface I18nResource {\n    /** prefix of the resource could be like the 2 char language code e.g. /en */\n    prefix: string;\n    /** suffix can be either .json or anything related of the resource HTTP call */\n    suffix?: string;\n    /**\n     It is an ID of the function which should be defined into the customHandlers with the interface TranslationsCompiler\n     */\n    compileTranslations?: string;\n}\n\n/**\n * a factory to compile translations into the main object holding them all\n *\n * @param translations the object to be pre-processed\n * @param lang the translations language\n * @returns the pre-processed translations\n */\nexport type TranslationsCompiler<T = unknown, C = unknown> = (translations: T, lang: string) => C;\n\nexport interface I18nConfig {\n    icuEnabled?: boolean;\n    i18nService: I18nServiceConfig;\n    i18nLoader: I18nLoaderConfig;\n}\n\nexport interface I18nServiceConfig {\n    /** an ISO 2 char code array of available languages */\n    languages?: (string | EuiLanguage)[];\n    /** default language to be used in case of not any has been set */\n    defaultLanguage?: string;\n}\n\nexport interface I18nLoaderConfig {\n    /**\n     * Those folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\n     * e.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\n     * Important! the language code will be added automatically to the end of the url except if the url ends with a slash.\n     */\n    i18nFolders?: string | string[];\n    /**\n     * Array of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\n     * Keep in mind that the url should be the prefix and not contain any suffix.\n     */\n    i18nServices?: string | string[];\n    /**\n     * It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\n     * provide the prefix and suffix of the resource, or both.\n     *\n     * @example\n     * ```typescript\n     * export function CompileTranslations(translations: any): any {\n     *     const result = {};\n     *     translations.forEach((translation: any) => {\n     *         // extract the key and value from the translation object\n     *         const key = translation['key'];\n     *         const value = translation['value'];\n     *         if (key && value) {\n     *             result[key] = value;\n     *         }\n     *     });\n     *     return result;\n     * }\n     * export const appConfig: EuiAppConfig = {\n     *     ...,\n     *     customHandler: {\n     *         'CompileTranslations_ID': CompileTranslations\n     *     }\n     * };\n     * export const GLOBAL: GlobalConfig = {\n     *     ...,\n     *     i18n: {\n     *       i18nLoader: {\n     *         i18nFolders: ['i18n-eui'],\n     *         i18nResources: [{\n     *             prefix: 'api/translations/',\n     *             compileTranslations: 'CompileTranslations_ID',\n     *         }]\n     *       }\n     *     }\n     * };\n     *\n     */\n    i18nResources?: I18nResource | I18nResource[];\n}\n\nexport const getI18nServiceConfigFromBase = (baseGlobalConfig: GlobalConfig): I18nServiceConfig => {\n    if(!baseGlobalConfig) throw new Error('baseGlobalConfig is required');\n    const i18nServiceConfig = baseGlobalConfig && baseGlobalConfig.i18n && baseGlobalConfig.i18n.i18nService;\n    const { languages, defaultLanguage } = getI18nServiceConfig(i18nServiceConfig);\n\n    return { languages, defaultLanguage };\n};\n\nexport const getI18nServiceConfig = (config: I18nServiceConfig): I18nServiceConfig => Object.assign({}, config);\n\nexport const getI18nLoaderConfig = (config: I18nLoaderConfig): I18nLoaderConfig => {\n    const { i18nFolders, i18nServices, i18nResources } = Object.assign({}, config);\n    return { i18nFolders, i18nServices, i18nResources };\n};\n\n/**\n * returns a language code based on https://tools.ietf.org/rfc/bcp/bcp47.txt specification. To get the Browser's\n * it's using the navigator.language, splits by hyphen and get the first part.\n */\nexport const getBrowserDefaultLanguage = (): string => navigator.language.split('-')[0];\n\n/**\n * returns an array of DOMStrings representing the user's preferred languages. The language is described using BCP 47\n * language tags. In the returned array they are ordered by preference with the most preferred language first.\n * The array languages will be lower cased 2 char code.\n */\nexport const getBrowserPreferredLanguages = (): string[] => navigator.languages.map((lang) => lang.split('-')[0]);\n",
             "properties": [
                 {
                     "name": "compileTranslations",
@@ -2185,12 +2195,12 @@
         },
         {
             "name": "I18nServiceConfig",
-            "id": "interface-I18nServiceConfig-d3ab1e025b3bb93d28aa42a6c9e9c1057b451107c39e09ff2f7e6196182ad9a5f4b0da0c70d251efaae48248e69dc85b0f067b085d126dc7d1bce7bf8e3e16d3",
+            "id": "interface-I18nServiceConfig-b0a3a5425955f09a46ff08822b65a5ae1d4ca4dc78c1b96e6a14c0c5f7972681fa7b353d2a3fe08cca30bc79ecfcf44c57f08bb6d54ede82673cc3a54119254a",
             "file": "packages/base/src/lib/eui-models/eui-config/i18n.config.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { GlobalConfig } from './eui-app-config';\nimport { EuiLanguage } from '../eui-language/eui-language.model';\n\nexport interface I18nResource {\n    /** prefix of the resource could be like the 2 char language code e.g. /en */\n    prefix: string;\n    /** suffix can be either .json or anything related of the resource HTTP call */\n    suffix?: string;\n    /**\n     It is an ID of the function which should be defined into the customHandlers with the interface TranslationsCompiler\n     */\n    compileTranslations?: string;\n}\n\n/**\n * a factory to compile translations into the main object holding them all\n *\n * @param translations the object to be pre-processed\n * @param lang the translations language\n * @returns the pre-processed translations\n */\nexport type TranslationsCompiler<T = unknown, C = unknown> = (translations: T, lang: string) => C;\n\nexport interface I18nConfig {\n    i18nService: I18nServiceConfig;\n    i18nLoader: I18nLoaderConfig;\n}\n\nexport interface I18nServiceConfig {\n    /** an ISO 2 char code array of available languages */\n    languages?: (string | EuiLanguage)[];\n    /** default language to be used in case of not any has been set */\n    defaultLanguage?: string;\n}\n\nexport interface I18nLoaderConfig {\n    /**\n     * Those folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\n     * e.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\n     * Important! the language code will be added automatically to the end of the url except if the url ends with a slash.\n     */\n    i18nFolders?: string | string[];\n    /**\n     * Array of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\n     * Keep in mind that the url should be the prefix and not contain any suffix.\n     */\n    i18nServices?: string | string[];\n    /**\n     * It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\n     * provide the prefix and suffix of the resource, or both.\n     *\n     * @example\n     * ```typescript\n     * export function CompileTranslations(translations: any): any {\n     *     const result = {};\n     *     translations.forEach((translation: any) => {\n     *         // extract the key and value from the translation object\n     *         const key = translation['key'];\n     *         const value = translation['value'];\n     *         if (key && value) {\n     *             result[key] = value;\n     *         }\n     *     });\n     *     return result;\n     * }\n     * export const appConfig: EuiAppConfig = {\n     *     ...,\n     *     customHandler: {\n     *         'CompileTranslations_ID': CompileTranslations\n     *     }\n     * };\n     * export const GLOBAL: GlobalConfig = {\n     *     ...,\n     *     i18n: {\n     *       i18nLoader: {\n     *         i18nFolders: ['i18n-eui'],\n     *         i18nResources: [{\n     *             prefix: 'api/translations/',\n     *             compileTranslations: 'CompileTranslations_ID',\n     *         }]\n     *       }\n     *     }\n     * };\n     *\n     */\n    i18nResources?: I18nResource | I18nResource[];\n}\n\nexport const getI18nServiceConfigFromBase = (baseGlobalConfig: GlobalConfig): I18nServiceConfig => {\n    if(!baseGlobalConfig) throw new Error('baseGlobalConfig is required');\n    const i18nServiceConfig = baseGlobalConfig && baseGlobalConfig.i18n && baseGlobalConfig.i18n.i18nService;\n    const { languages, defaultLanguage } = getI18nServiceConfig(i18nServiceConfig);\n\n    return { languages, defaultLanguage };\n};\n\nexport const getI18nServiceConfig = (config: I18nServiceConfig): I18nServiceConfig => Object.assign({}, config);\n\nexport const getI18nLoaderConfig = (config: I18nLoaderConfig): I18nLoaderConfig => {\n    const { i18nFolders, i18nServices, i18nResources } = Object.assign({}, config);\n    return { i18nFolders, i18nServices, i18nResources };\n};\n\n/**\n * returns a language code based on https://tools.ietf.org/rfc/bcp/bcp47.txt specification. To get the Browser's\n * it's using the navigator.language, splits by hyphen and get the first part.\n */\nexport const getBrowserDefaultLanguage = (): string => navigator.language.split('-')[0];\n\n/**\n * returns an array of DOMStrings representing the user's preferred languages. The language is described using BCP 47\n * language tags. In the returned array they are ordered by preference with the most preferred language first.\n * The array languages will be lower cased 2 char code.\n */\nexport const getBrowserPreferredLanguages = (): string[] => navigator.languages.map((lang) => lang.split('-')[0]);\n",
+            "sourceCode": "import { GlobalConfig } from './eui-app-config';\nimport { EuiLanguage } from '../eui-language/eui-language.model';\n\nexport interface I18nResource {\n    /** prefix of the resource could be like the 2 char language code e.g. /en */\n    prefix: string;\n    /** suffix can be either .json or anything related of the resource HTTP call */\n    suffix?: string;\n    /**\n     It is an ID of the function which should be defined into the customHandlers with the interface TranslationsCompiler\n     */\n    compileTranslations?: string;\n}\n\n/**\n * a factory to compile translations into the main object holding them all\n *\n * @param translations the object to be pre-processed\n * @param lang the translations language\n * @returns the pre-processed translations\n */\nexport type TranslationsCompiler<T = unknown, C = unknown> = (translations: T, lang: string) => C;\n\nexport interface I18nConfig {\n    icuEnabled?: boolean;\n    i18nService: I18nServiceConfig;\n    i18nLoader: I18nLoaderConfig;\n}\n\nexport interface I18nServiceConfig {\n    /** an ISO 2 char code array of available languages */\n    languages?: (string | EuiLanguage)[];\n    /** default language to be used in case of not any has been set */\n    defaultLanguage?: string;\n}\n\nexport interface I18nLoaderConfig {\n    /**\n     * Those folders will be used to load the translations files from {@link https://angular.io/guide/workspace-config#extra-build-and-test-options assets}.\n     * e.g [`${environment.apiBaseUrl}translations/`, `${environment.apiBaseUrl}translations?lang=`]\n     * Important! the language code will be added automatically to the end of the url except if the url ends with a slash.\n     */\n    i18nFolders?: string | string[];\n    /**\n     * Array of service urls to translation, don't add the language it will be added e.g. http://net1/trans/en\n     * Keep in mind that the url should be the prefix and not contain any suffix.\n     */\n    i18nServices?: string | string[];\n    /**\n     * It is a set of more customized resources to be loaded. You can provide a function to compile the translations or simply\n     * provide the prefix and suffix of the resource, or both.\n     *\n     * @example\n     * ```typescript\n     * export function CompileTranslations(translations: any): any {\n     *     const result = {};\n     *     translations.forEach((translation: any) => {\n     *         // extract the key and value from the translation object\n     *         const key = translation['key'];\n     *         const value = translation['value'];\n     *         if (key && value) {\n     *             result[key] = value;\n     *         }\n     *     });\n     *     return result;\n     * }\n     * export const appConfig: EuiAppConfig = {\n     *     ...,\n     *     customHandler: {\n     *         'CompileTranslations_ID': CompileTranslations\n     *     }\n     * };\n     * export const GLOBAL: GlobalConfig = {\n     *     ...,\n     *     i18n: {\n     *       i18nLoader: {\n     *         i18nFolders: ['i18n-eui'],\n     *         i18nResources: [{\n     *             prefix: 'api/translations/',\n     *             compileTranslations: 'CompileTranslations_ID',\n     *         }]\n     *       }\n     *     }\n     * };\n     *\n     */\n    i18nResources?: I18nResource | I18nResource[];\n}\n\nexport const getI18nServiceConfigFromBase = (baseGlobalConfig: GlobalConfig): I18nServiceConfig => {\n    if(!baseGlobalConfig) throw new Error('baseGlobalConfig is required');\n    const i18nServiceConfig = baseGlobalConfig && baseGlobalConfig.i18n && baseGlobalConfig.i18n.i18nService;\n    const { languages, defaultLanguage } = getI18nServiceConfig(i18nServiceConfig);\n\n    return { languages, defaultLanguage };\n};\n\nexport const getI18nServiceConfig = (config: I18nServiceConfig): I18nServiceConfig => Object.assign({}, config);\n\nexport const getI18nLoaderConfig = (config: I18nLoaderConfig): I18nLoaderConfig => {\n    const { i18nFolders, i18nServices, i18nResources } = Object.assign({}, config);\n    return { i18nFolders, i18nServices, i18nResources };\n};\n\n/**\n * returns a language code based on https://tools.ietf.org/rfc/bcp/bcp47.txt specification. To get the Browser's\n * it's using the navigator.language, splits by hyphen and get the first part.\n */\nexport const getBrowserDefaultLanguage = (): string => navigator.language.split('-')[0];\n\n/**\n * returns an array of DOMStrings representing the user's preferred languages. The language is described using BCP 47\n * language tags. In the returned array they are ordered by preference with the most preferred language first.\n * The array languages will be lower cased 2 char code.\n */\nexport const getBrowserPreferredLanguages = (): string[] => navigator.languages.map((lang) => lang.split('-')[0]);\n",
             "properties": [
                 {
                     "name": "defaultLanguage",
@@ -2200,7 +2210,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "<p>default language to be used in case of not any has been set</p>\n",
-                    "line": 33,
+                    "line": 34,
                     "rawdescription": "\ndefault language to be used in case of not any has been set"
                 },
                 {
@@ -2211,7 +2221,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "<p>an ISO 2 char code array of available languages</p>\n",
-                    "line": 31,
+                    "line": 32,
                     "rawdescription": "\nan ISO 2 char code array of available languages"
                 }
             ],
@@ -3081,12 +3091,12 @@
         },
         {
             "name": "UxErrorFeedback",
-            "id": "interface-UxErrorFeedback-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "interface-UxErrorFeedback-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "properties": [
                 {
                     "name": "attributes",
@@ -3096,7 +3106,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 99
+                    "line": 100
                 },
                 {
                     "name": "br",
@@ -3106,7 +3116,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 101
+                    "line": 102
                 },
                 {
                     "name": "doc",
@@ -3116,7 +3126,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 102
+                    "line": 103
                 },
                 {
                     "name": "errGroupId",
@@ -3126,7 +3136,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 100
+                    "line": 101
                 },
                 {
                     "name": "severity",
@@ -3136,7 +3146,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 98
+                    "line": 99
                 }
             ],
             "indexSignatures": [],
@@ -3148,16 +3158,16 @@
         },
         {
             "name": "UxErrorFollowMap",
-            "id": "interface-UxErrorFollowMap-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "interface-UxErrorFollowMap-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "properties": [],
             "indexSignatures": [
                 {
-                    "id": "index-declaration-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+                    "id": "index-declaration-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
                     "args": [
                         {
                             "name": "groupId",
@@ -3167,7 +3177,7 @@
                         }
                     ],
                     "returnType": "boolean",
-                    "line": 68,
+                    "line": 69,
                     "deprecated": false,
                     "deprecationMessage": ""
                 }
@@ -3178,12 +3188,12 @@
         },
         {
             "name": "UxErrorInfo",
-            "id": "interface-UxErrorInfo-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "interface-UxErrorInfo-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "properties": [
                 {
                     "name": "code",
@@ -3193,7 +3203,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 88
+                    "line": 89
                 },
                 {
                     "name": "details",
@@ -3203,7 +3213,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 90
+                    "line": 91
                 },
                 {
                     "name": "doc",
@@ -3213,7 +3223,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 89
+                    "line": 90
                 }
             ],
             "indexSignatures": [],
@@ -3223,12 +3233,12 @@
         },
         {
             "name": "UxErrorMessage",
-            "id": "interface-UxErrorMessage-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "interface-UxErrorMessage-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "properties": [
                 {
                     "name": "description",
@@ -3238,7 +3248,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 107
+                    "line": 108
                 },
                 {
                     "name": "msgId",
@@ -3248,7 +3258,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 106
+                    "line": 107
                 }
             ],
             "indexSignatures": [],
@@ -3283,12 +3293,12 @@
         },
         {
             "name": "UxHttpErrorInfo",
-            "id": "interface-UxHttpErrorInfo-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "interface-UxHttpErrorInfo-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "properties": [
                 {
                     "name": "requestId",
@@ -3298,7 +3308,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 94
+                    "line": 95
                 }
             ],
             "indexSignatures": [],
@@ -3308,12 +3318,12 @@
         },
         {
             "name": "UxHttpErrorResponse",
-            "id": "interface-UxHttpErrorResponse-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "interface-UxHttpErrorResponse-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "properties": [
                 {
                     "name": "uxHttpErrorOutput",
@@ -3323,7 +3333,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 151
+                    "line": 152
                 }
             ],
             "indexSignatures": [],
@@ -3380,12 +3390,12 @@
         },
         {
             "name": "UxValidationErrorAttribute",
-            "id": "interface-UxValidationErrorAttribute-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "interface-UxValidationErrorAttribute-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "properties": [
                 {
                     "name": "key",
@@ -3395,7 +3405,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 113
+                    "line": 114
                 },
                 {
                     "name": "value",
@@ -3405,7 +3415,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 114
+                    "line": 115
                 }
             ],
             "indexSignatures": [],
@@ -3879,12 +3889,12 @@
     "classes": [
         {
             "name": "ConsoleAppender",
-            "id": "class-ConsoleAppender-9966e57658a6dac3b80cf8dec51f67ac4cc4cadc04d3b1ed21ee7d95dce2d0e93036f357f517f97c890743cb394df515ada337e769078b142c57cfb8e4aed88e",
+            "id": "class-ConsoleAppender-e5779b4182b26ff22a33a2cdd79e982f9d127903cd804dc651a8cadfe25f88400b2079ab651ea1d2d60e3e7d7b20a1b0e29d35a20ba138a10a3f8c5d9b744658",
             "file": "packages/base/src/lib/eui-models/log/console.appender.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { LogAppender } from './log.appender';\nimport { ConsoleAppenderConfig, ConsoleAppenderPrefixConverters } from '../eui-config';\nimport { LogEvent, LogLevel } from './log.model';\n\n/** Default console prefix converters */\nexport const DEFAULT_CONSOLE_APPENDER_PREFIX_CONVERTERS: ConsoleAppenderPrefixConverters = {\n    '{level}': (event: LogEvent) => event.levelName,\n    '{logger}': (event: LogEvent) => event.loggerName,\n    '{date}': (event: LogEvent) => event.timestamp.toLocaleDateString(),\n    '{time}': (event: LogEvent) => event.timestamp.toLocaleTimeString(),\n};\n\n/**\n * Console Appender\n */\nexport class ConsoleAppender extends LogAppender<ConsoleAppenderConfig> {\n    constructor(public config: ConsoleAppenderConfig = {}) {\n        super(config);\n        // apply the default prefix converters\n        config.prefixConverters = Object.assign({}, DEFAULT_CONSOLE_APPENDER_PREFIX_CONVERTERS, config.prefixConverters);\n    }\n\n    /**\n     * Logs an event in the console\n     */\n    append(event: LogEvent): void {\n        // retrieve the prefix\n        const prefix = this.getPrefix(event);\n        // append it to the message array\n        const messages = prefix ? [prefix, ...event.messages] : event.messages;\n\n        // log the event in the console\n        switch (event.level) {\n            case LogLevel.FATAL:\n            case LogLevel.ERROR:\n                console.error(...messages);\n                break;\n            case LogLevel.WARN:\n                console.warn(...messages);\n                break;\n            default:\n                console.log(...messages);\n                break;\n        }\n    }\n\n    /**\n     * Returns the prefix to be added to the messages\n     *\n     * @param event the log event\n     * @returns the formatted prefix, as string\n     */\n    protected getPrefix(event: LogEvent): string {\n        // in case of no prefixFormat, return null\n        if (!this.config || !this.config.prefixFormat) {\n            return null;\n        }\n\n        // start creating the prefix from the format\n        let prefix = this.config.prefixFormat;\n\n        // apply the prefix converters\n        Object.keys(this.config.prefixConverters).forEach((key) => {\n            prefix = this.convert(prefix, key, this.config.prefixConverters[key](event));\n        });\n\n        return prefix;\n    }\n\n    /**\n     * Utility method to replace a placeholder\n     *\n     * @param str the string with placeholders\n     * @param find the placeholder\n     * @param replace the string to replace the placeholder\n     * @returns the converted string\n     */\n    protected convert(str: string, find: string, replace: string): string {\n        return str.replace(new RegExp(find, 'g'), replace);\n    }\n}\n",
+            "sourceCode": "import { LogAppender } from './log.appender';\nimport { ConsoleAppenderConfig, ConsoleAppenderPrefixConverters } from '../eui-config';\nimport { LogEvent, LogLevel } from './log.model';\n\n/** Default console prefix converters */\nexport const DEFAULT_CONSOLE_APPENDER_PREFIX_CONVERTERS: ConsoleAppenderPrefixConverters = {\n    '{level}': (event: LogEvent) => event.levelName,\n    '{logger}': (event: LogEvent) => event.loggerName,\n    '{date}': (event: LogEvent) => event.timestamp.toLocaleDateString(),\n    '{time}': (event: LogEvent) => event.timestamp.toLocaleTimeString(),\n};\n\n/**\n * Console Appender\n */\nexport class ConsoleAppender extends LogAppender<ConsoleAppenderConfig> {\n    constructor(public override config: ConsoleAppenderConfig = {}) {\n        super(config);\n        // apply the default prefix converters\n        config.prefixConverters = Object.assign({}, DEFAULT_CONSOLE_APPENDER_PREFIX_CONVERTERS, config.prefixConverters);\n    }\n\n    /**\n     * Logs an event in the console\n     */\n    append(event: LogEvent): void {\n        // retrieve the prefix\n        const prefix = this.getPrefix(event);\n        // append it to the message array\n        const messages = prefix ? [prefix, ...event.messages] : event.messages;\n\n        // log the event in the console\n        switch (event.level) {\n            case LogLevel.FATAL:\n            case LogLevel.ERROR:\n                console.error(...messages);\n                break;\n            case LogLevel.WARN:\n                console.warn(...messages);\n                break;\n            default:\n                console.log(...messages);\n                break;\n        }\n    }\n\n    /**\n     * Returns the prefix to be added to the messages\n     *\n     * @param event the log event\n     * @returns the formatted prefix, as string\n     */\n    protected getPrefix(event: LogEvent): string {\n        // in case of no prefixFormat, return null\n        if (!this.config || !this.config.prefixFormat) {\n            return null;\n        }\n\n        // start creating the prefix from the format\n        let prefix = this.config.prefixFormat;\n\n        // apply the prefix converters\n        Object.keys(this.config.prefixConverters).forEach((key) => {\n            prefix = this.convert(prefix, key, this.config.prefixConverters[key](event));\n        });\n\n        return prefix;\n    }\n\n    /**\n     * Utility method to replace a placeholder\n     *\n     * @param str the string with placeholders\n     * @param find the placeholder\n     * @param replace the string to replace the placeholder\n     * @returns the converted string\n     */\n    protected convert(str: string, find: string, replace: string): string {\n        return str.replace(new RegExp(find, 'g'), replace);\n    }\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -3927,7 +3937,8 @@
                     "description": "",
                     "line": 17,
                     "modifierKind": [
-                        125
+                        125,
+                        164
                     ]
                 }
             ],
@@ -4003,8 +4014,8 @@
                     "jsdoctags": [
                         {
                             "name": {
-                                "pos": 2404,
-                                "end": 2407,
+                                "pos": 2413,
+                                "end": 2416,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4015,8 +4026,8 @@
                             "deprecated": false,
                             "deprecationMessage": "",
                             "tagName": {
-                                "pos": 2398,
-                                "end": 2403,
+                                "pos": 2407,
+                                "end": 2412,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4027,8 +4038,8 @@
                         },
                         {
                             "name": {
-                                "pos": 2451,
-                                "end": 2455,
+                                "pos": 2460,
+                                "end": 2464,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4039,8 +4050,8 @@
                             "deprecated": false,
                             "deprecationMessage": "",
                             "tagName": {
-                                "pos": 2445,
-                                "end": 2450,
+                                "pos": 2454,
+                                "end": 2459,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4051,8 +4062,8 @@
                         },
                         {
                             "name": {
-                                "pos": 2486,
-                                "end": 2493,
+                                "pos": 2495,
+                                "end": 2502,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4063,8 +4074,8 @@
                             "deprecated": false,
                             "deprecationMessage": "",
                             "tagName": {
-                                "pos": 2480,
-                                "end": 2485,
+                                "pos": 2489,
+                                "end": 2494,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4075,8 +4086,8 @@
                         },
                         {
                             "tagName": {
-                                "pos": 2540,
-                                "end": 2547,
+                                "pos": 2549,
+                                "end": 2556,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4111,8 +4122,8 @@
                     "jsdoctags": [
                         {
                             "name": {
-                                "pos": 1715,
-                                "end": 1720,
+                                "pos": 1724,
+                                "end": 1729,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4123,8 +4134,8 @@
                             "deprecated": false,
                             "deprecationMessage": "",
                             "tagName": {
-                                "pos": 1709,
-                                "end": 1714,
+                                "pos": 1718,
+                                "end": 1723,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4135,8 +4146,8 @@
                         },
                         {
                             "tagName": {
-                                "pos": 1743,
-                                "end": 1750,
+                                "pos": 1752,
+                                "end": 1759,
                                 "kind": 80,
                                 "id": 0,
                                 "flags": 16842752,
@@ -4640,12 +4651,12 @@
         },
         {
             "name": "EuiLazyService",
-            "id": "class-EuiLazyService-e9132d3f4903942a1ce129a8f89fbc7f234381e7a11e802724aba9a17db912d4e921e6ed31c8b20cfa41a87b2fd7166ff5cb1e4663e5d90353fb929d3b31af98",
+            "id": "class-EuiLazyService-6c072c68250cd88ba317937e0a34489a84c952e84a33e3311d45156434f863e376c7fd001fee45311d599580ff6c530923c9f317b1ddc57c4d569c6d263d9811",
             "file": "packages/base/src/lib/eui-models/eui-service.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { Observable, Subject, Subscription } from 'rxjs';\nimport { ModuleConfig } from './eui-config/eui-app-config';\nimport { LoadedConfigModules } from './eui-store/state/app.state';\nimport { EuiStoreServiceModel } from './eui-store/eui-store-service.model';\nimport { filter, switchMap } from 'rxjs/operators';\nimport { Selector } from 'reselect';\nimport { CoreState } from './eui-store';\n\nexport interface EuiServiceModel<T> {\n    init(t: T): Observable<EuiServiceStatus>;\n\n    /**\n     * retrieves the State of the service. If you don't pass anything it will retrieve the whole State\n     * of that service. If you pass a selector or MapFunction it will retrieve a slice of the state. If\n     * you pass a string that's a key of the Service State type it will retrieve that slice of the state.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    getState<K = T>(): Observable<T>;\n    getState<K>(mapFn: (state: T) => K): Observable<K>;\n    getState<A extends keyof T>(key: A): Observable<T[A]>;\n    getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    updateState(t: T): void;\n}\n\nexport type DeepPartial<T> = {\n    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport abstract class EuiService<T> implements EuiServiceModel<T> {\n    protected stateInstance: T;\n    protected prevStateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n    onStateChange: Subject<T> = new Subject<T>();\n\n    protected constructor(defaultState: T) {\n        this.stateInstance = defaultState;\n    }\n\n    initEuiService(): void {\n        this.unSubscribe();\n        this.$stateSubs = this.getState().subscribe((newState: T) => {\n            // set previous state of service\n            this.prevStateInstance = this.copy(this.stateInstance);\n            // update state before emit event\n            this.stateInstance = this.copy(newState);\n            // inform about state change\n            this.onStateChange.next(newState);\n        });\n    }\n\n    abstract init(t?: T): Observable<EuiServiceStatus>;\n\n    abstract getState<K = T>(): Observable<T>;\n    abstract getState<K>(mapFn?: (state: T) => K): Observable<K>;\n    abstract getState<A extends keyof T>(key?: A): Observable<T[A]>;\n    abstract getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    abstract updateState(t: DeepPartial<T>): void;\n\n    protected unSubscribe(): void {\n        if (this.$stateSubs && this.$stateSubs.unsubscribe) {\n            this.$stateSubs.unsubscribe();\n        }\n        if (this.$stateLazyLoadSubs && this.$stateLazyLoadSubs.unsubscribe) {\n            this.$stateLazyLoadSubs.unsubscribe();\n        }\n    }\n\n    /**\n     * deep merge two objects\n     * @param target the object that will be merged into\n     * @param source the object that will be merged from\n     */\n    protected deepMerge<T>(target: T, source: DeepPartial<T>): T {\n        const output = Object.assign({}, target);\n        if (this.isObject(target) && this.isObject(source)) {\n            Object.keys(source).forEach(key => {\n                // Check if source[key] is an object and target[key] is either undefined, null, or an object\n                if (this.isObject(source[key])) {\n                    if (!(key in target) || target[key] === null) {\n                        // If target[key] doesn't exist or is null, directly assign source[key]\n                        Object.assign(output, { [key]: structuredClone(source[key]) });\n                    } else {\n                        // Only deep merge if target[key] is also an object\n                        output[key] = this.isObject(target[key])\n                            ? this.deepMerge(target[key], source[key])\n                            : structuredClone(source[key]);\n                    }\n                } else {\n                    Object.assign(output, { [key]: source[key] });\n                }\n            });\n        }\n        return output;\n    }\n\n    /**\n     * checks if the given item is an object\n     * @param item the item that will be checked\n     */\n    private isObject(item: unknown): item is object {\n        return item && typeof item === 'object' && !Array.isArray(item);\n    }\n\n    /**\n     * returns a copy of the given value whether this value is object or primitive. For the arrays it will cover\n     * multidimensional arrays, but it will not cover an object that contain functions. JSON.parse and JSON.stringify\n     * might have performance issues on large scale objects but that's an edge case scenario. In case that happens in\n     * the future follow the technique of NGRX with function caching.\n     *\n     * @param state\n     */\n    private copy(state: T): T {\n        if (typeof state === 'undefined') {\n            return undefined;\n        }\n        return JSON.parse(JSON.stringify(state));\n    }\n}\n\nconst getAppLoadedConfigModules: Selector<CoreState, LoadedConfigModules> = (state: CoreState) => state?.app?.loadedConfigModules\n\nexport abstract class EuiLazyService<T> extends EuiService<T> {\n    protected stateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n\n    protected constructor(defaultState: T) {\n        super(defaultState);\n    }\n\n    abstract lazyLoadInit(moduleConfig: ModuleConfig, moduleName?: string): Observable<EuiServiceStatus>;\n\n    // todo it should use abstract store service\n    initEuiService(storeForLazyLoad?: EuiStoreServiceModel<T>): void {\n        super.initEuiService();\n\n        if (storeForLazyLoad) {\n            this.$stateLazyLoadSubs = storeForLazyLoad\n                .select(getAppLoadedConfigModules)\n                .pipe(\n                    filter((loadedConfigModules: LoadedConfigModules) =>\n                        loadedConfigModules?.modulesConfig?.[loadedConfigModules.lastAddedModule] ? true : false,\n                    ),\n                    switchMap((loadedConfigModules: LoadedConfigModules) =>\n                        this.lazyLoadInit(\n                            loadedConfigModules.modulesConfig[loadedConfigModules.lastAddedModule],\n                            loadedConfigModules.lastAddedModule,\n                        ),\n                    ),\n                )\n                .subscribe(null);\n        }\n    }\n}\n\n/**\n * EuiServiceStatus is a model that represents the status of the service. It has a boolean property that indicates\n * whether the service was successful or not. If the service was not successful it will have an error property that\n * contains the error message.\n * @param T the type of the error message\n * @property success a boolean property that indicates whether the service was successful or not\n * @property error an optional property that contains the error message\n */\nexport interface EuiServiceStatus<T = unknown> {\n    success: boolean;\n    error?: T;\n}\n",
+            "sourceCode": "import { Observable, Subject, Subscription } from 'rxjs';\nimport { ModuleConfig } from './eui-config/eui-app-config';\nimport { LoadedConfigModules } from './eui-store/state/app.state';\nimport { EuiStoreServiceModel } from './eui-store/eui-store-service.model';\nimport { filter, switchMap } from 'rxjs/operators';\nimport { Selector } from 'reselect';\nimport { CoreState } from './eui-store';\n\nexport interface EuiServiceModel<T> {\n    init(t: T): Observable<EuiServiceStatus>;\n\n    /**\n     * retrieves the State of the service. If you don't pass anything it will retrieve the whole State\n     * of that service. If you pass a selector or MapFunction it will retrieve a slice of the state. If\n     * you pass a string that's a key of the Service State type it will retrieve that slice of the state.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    getState<K = T>(): Observable<T>;\n    getState<K>(mapFn: (state: T) => K): Observable<K>;\n    getState<A extends keyof T>(key: A): Observable<T[A]>;\n    getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    updateState(t: T): void;\n}\n\nexport type DeepPartial<T> = {\n    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport abstract class EuiService<T> implements EuiServiceModel<T> {\n    protected stateInstance: T;\n    protected prevStateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n    onStateChange: Subject<T> = new Subject<T>();\n\n    protected constructor(defaultState: T) {\n        this.stateInstance = defaultState;\n    }\n\n    initEuiService(): void {\n        this.unSubscribe();\n        this.$stateSubs = this.getState().subscribe((newState: T) => {\n            // set previous state of service\n            this.prevStateInstance = this.copy(this.stateInstance);\n            // update state before emit event\n            this.stateInstance = this.copy(newState);\n            // inform about state change\n            this.onStateChange.next(newState);\n        });\n    }\n\n    abstract init(t?: T): Observable<EuiServiceStatus>;\n\n    abstract getState<K = T>(): Observable<T>;\n    abstract getState<K>(mapFn?: (state: T) => K): Observable<K>;\n    abstract getState<A extends keyof T>(key?: A): Observable<T[A]>;\n    abstract getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    abstract updateState(t: DeepPartial<T>): void;\n\n    protected unSubscribe(): void {\n        if (this.$stateSubs && this.$stateSubs.unsubscribe) {\n            this.$stateSubs.unsubscribe();\n        }\n        if (this.$stateLazyLoadSubs && this.$stateLazyLoadSubs.unsubscribe) {\n            this.$stateLazyLoadSubs.unsubscribe();\n        }\n    }\n\n    /**\n     * deep merge two objects\n     * @param target the object that will be merged into\n     * @param source the object that will be merged from\n     */\n    protected deepMerge<T>(target: T, source: DeepPartial<T>): T {\n        const output = Object.assign({}, target);\n        if (this.isObject(target) && this.isObject(source)) {\n            Object.keys(source).forEach(key => {\n                // Check if source[key] is an object and target[key] is either undefined, null, or an object\n                if (this.isObject(source[key])) {\n                    if (!(key in target) || target[key] === null) {\n                        // If target[key] doesn't exist or is null, directly assign source[key]\n                        Object.assign(output, { [key]: structuredClone(source[key]) });\n                    } else {\n                        // Only deep merge if target[key] is also an object\n                        output[key] = this.isObject(target[key])\n                            ? this.deepMerge(target[key], source[key])\n                            : structuredClone(source[key]);\n                    }\n                } else {\n                    Object.assign(output, { [key]: source[key] });\n                }\n            });\n        }\n        return output;\n    }\n\n    /**\n     * checks if the given item is an object\n     * @param item the item that will be checked\n     */\n    private isObject(item: unknown): item is object {\n        return item && typeof item === 'object' && !Array.isArray(item);\n    }\n\n    /**\n     * returns a copy of the given value whether this value is object or primitive. For the arrays it will cover\n     * multidimensional arrays, but it will not cover an object that contain functions. JSON.parse and JSON.stringify\n     * might have performance issues on large scale objects but that's an edge case scenario. In case that happens in\n     * the future follow the technique of NGRX with function caching.\n     *\n     * @param state\n     */\n    private copy(state: T): T {\n        if (typeof state === 'undefined') {\n            return undefined;\n        }\n        return JSON.parse(JSON.stringify(state));\n    }\n}\n\nconst getAppLoadedConfigModules: Selector<CoreState, LoadedConfigModules> = (state: CoreState) => state?.app?.loadedConfigModules\n\nexport abstract class EuiLazyService<T> extends EuiService<T> {\n    protected override stateInstance: T;\n    protected override $stateSubs: Subscription;\n    protected override $stateLazyLoadSubs: Subscription;\n\n    protected constructor(defaultState: T) {\n        super(defaultState);\n    }\n\n    abstract lazyLoadInit(moduleConfig: ModuleConfig, moduleName?: string): Observable<EuiServiceStatus>;\n\n    // todo it should use abstract store service\n    override initEuiService(storeForLazyLoad?: EuiStoreServiceModel<T>): void {\n        super.initEuiService();\n\n        if (storeForLazyLoad) {\n            this.$stateLazyLoadSubs = storeForLazyLoad\n                .select(getAppLoadedConfigModules)\n                .pipe(\n                    filter((loadedConfigModules: LoadedConfigModules) =>\n                        loadedConfigModules?.modulesConfig?.[loadedConfigModules.lastAddedModule] ? true : false,\n                    ),\n                    switchMap((loadedConfigModules: LoadedConfigModules) =>\n                        this.lazyLoadInit(\n                            loadedConfigModules.modulesConfig[loadedConfigModules.lastAddedModule],\n                            loadedConfigModules.lastAddedModule,\n                        ),\n                    ),\n                )\n                .subscribe(null);\n        }\n    }\n}\n\n/**\n * EuiServiceStatus is a model that represents the status of the service. It has a boolean property that indicates\n * whether the service was successful or not. If the service was not successful it will have an error property that\n * contains the error message.\n * @param T the type of the error message\n * @property success a boolean property that indicates whether the service was successful or not\n * @property error an optional property that contains the error message\n */\nexport interface EuiServiceStatus<T = unknown> {\n    success: boolean;\n    error?: T;\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -4688,7 +4699,8 @@
                     "description": "",
                     "line": 128,
                     "modifierKind": [
-                        124
+                        124,
+                        164
                     ],
                     "inheritance": {
                         "file": "EuiService"
@@ -4704,7 +4716,8 @@
                     "description": "",
                     "line": 127,
                     "modifierKind": [
-                        124
+                        124,
+                        164
                     ],
                     "inheritance": {
                         "file": "EuiService"
@@ -4720,7 +4733,8 @@
                     "description": "",
                     "line": 126,
                     "modifierKind": [
-                        124
+                        124,
+                        164
                     ],
                     "inheritance": {
                         "file": "EuiService"
@@ -4775,6 +4789,9 @@
                     "line": 137,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "jsdoctags": [
                         {
                             "name": "storeForLazyLoad",
@@ -5361,12 +5378,12 @@
         },
         {
             "name": "EuiService",
-            "id": "class-EuiService-e9132d3f4903942a1ce129a8f89fbc7f234381e7a11e802724aba9a17db912d4e921e6ed31c8b20cfa41a87b2fd7166ff5cb1e4663e5d90353fb929d3b31af98",
+            "id": "class-EuiService-6c072c68250cd88ba317937e0a34489a84c952e84a33e3311d45156434f863e376c7fd001fee45311d599580ff6c530923c9f317b1ddc57c4d569c6d263d9811",
             "file": "packages/base/src/lib/eui-models/eui-service.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { Observable, Subject, Subscription } from 'rxjs';\nimport { ModuleConfig } from './eui-config/eui-app-config';\nimport { LoadedConfigModules } from './eui-store/state/app.state';\nimport { EuiStoreServiceModel } from './eui-store/eui-store-service.model';\nimport { filter, switchMap } from 'rxjs/operators';\nimport { Selector } from 'reselect';\nimport { CoreState } from './eui-store';\n\nexport interface EuiServiceModel<T> {\n    init(t: T): Observable<EuiServiceStatus>;\n\n    /**\n     * retrieves the State of the service. If you don't pass anything it will retrieve the whole State\n     * of that service. If you pass a selector or MapFunction it will retrieve a slice of the state. If\n     * you pass a string that's a key of the Service State type it will retrieve that slice of the state.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    getState<K = T>(): Observable<T>;\n    getState<K>(mapFn: (state: T) => K): Observable<K>;\n    getState<A extends keyof T>(key: A): Observable<T[A]>;\n    getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    updateState(t: T): void;\n}\n\nexport type DeepPartial<T> = {\n    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport abstract class EuiService<T> implements EuiServiceModel<T> {\n    protected stateInstance: T;\n    protected prevStateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n    onStateChange: Subject<T> = new Subject<T>();\n\n    protected constructor(defaultState: T) {\n        this.stateInstance = defaultState;\n    }\n\n    initEuiService(): void {\n        this.unSubscribe();\n        this.$stateSubs = this.getState().subscribe((newState: T) => {\n            // set previous state of service\n            this.prevStateInstance = this.copy(this.stateInstance);\n            // update state before emit event\n            this.stateInstance = this.copy(newState);\n            // inform about state change\n            this.onStateChange.next(newState);\n        });\n    }\n\n    abstract init(t?: T): Observable<EuiServiceStatus>;\n\n    abstract getState<K = T>(): Observable<T>;\n    abstract getState<K>(mapFn?: (state: T) => K): Observable<K>;\n    abstract getState<A extends keyof T>(key?: A): Observable<T[A]>;\n    abstract getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    abstract updateState(t: DeepPartial<T>): void;\n\n    protected unSubscribe(): void {\n        if (this.$stateSubs && this.$stateSubs.unsubscribe) {\n            this.$stateSubs.unsubscribe();\n        }\n        if (this.$stateLazyLoadSubs && this.$stateLazyLoadSubs.unsubscribe) {\n            this.$stateLazyLoadSubs.unsubscribe();\n        }\n    }\n\n    /**\n     * deep merge two objects\n     * @param target the object that will be merged into\n     * @param source the object that will be merged from\n     */\n    protected deepMerge<T>(target: T, source: DeepPartial<T>): T {\n        const output = Object.assign({}, target);\n        if (this.isObject(target) && this.isObject(source)) {\n            Object.keys(source).forEach(key => {\n                // Check if source[key] is an object and target[key] is either undefined, null, or an object\n                if (this.isObject(source[key])) {\n                    if (!(key in target) || target[key] === null) {\n                        // If target[key] doesn't exist or is null, directly assign source[key]\n                        Object.assign(output, { [key]: structuredClone(source[key]) });\n                    } else {\n                        // Only deep merge if target[key] is also an object\n                        output[key] = this.isObject(target[key])\n                            ? this.deepMerge(target[key], source[key])\n                            : structuredClone(source[key]);\n                    }\n                } else {\n                    Object.assign(output, { [key]: source[key] });\n                }\n            });\n        }\n        return output;\n    }\n\n    /**\n     * checks if the given item is an object\n     * @param item the item that will be checked\n     */\n    private isObject(item: unknown): item is object {\n        return item && typeof item === 'object' && !Array.isArray(item);\n    }\n\n    /**\n     * returns a copy of the given value whether this value is object or primitive. For the arrays it will cover\n     * multidimensional arrays, but it will not cover an object that contain functions. JSON.parse and JSON.stringify\n     * might have performance issues on large scale objects but that's an edge case scenario. In case that happens in\n     * the future follow the technique of NGRX with function caching.\n     *\n     * @param state\n     */\n    private copy(state: T): T {\n        if (typeof state === 'undefined') {\n            return undefined;\n        }\n        return JSON.parse(JSON.stringify(state));\n    }\n}\n\nconst getAppLoadedConfigModules: Selector<CoreState, LoadedConfigModules> = (state: CoreState) => state?.app?.loadedConfigModules\n\nexport abstract class EuiLazyService<T> extends EuiService<T> {\n    protected stateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n\n    protected constructor(defaultState: T) {\n        super(defaultState);\n    }\n\n    abstract lazyLoadInit(moduleConfig: ModuleConfig, moduleName?: string): Observable<EuiServiceStatus>;\n\n    // todo it should use abstract store service\n    initEuiService(storeForLazyLoad?: EuiStoreServiceModel<T>): void {\n        super.initEuiService();\n\n        if (storeForLazyLoad) {\n            this.$stateLazyLoadSubs = storeForLazyLoad\n                .select(getAppLoadedConfigModules)\n                .pipe(\n                    filter((loadedConfigModules: LoadedConfigModules) =>\n                        loadedConfigModules?.modulesConfig?.[loadedConfigModules.lastAddedModule] ? true : false,\n                    ),\n                    switchMap((loadedConfigModules: LoadedConfigModules) =>\n                        this.lazyLoadInit(\n                            loadedConfigModules.modulesConfig[loadedConfigModules.lastAddedModule],\n                            loadedConfigModules.lastAddedModule,\n                        ),\n                    ),\n                )\n                .subscribe(null);\n        }\n    }\n}\n\n/**\n * EuiServiceStatus is a model that represents the status of the service. It has a boolean property that indicates\n * whether the service was successful or not. If the service was not successful it will have an error property that\n * contains the error message.\n * @param T the type of the error message\n * @property success a boolean property that indicates whether the service was successful or not\n * @property error an optional property that contains the error message\n */\nexport interface EuiServiceStatus<T = unknown> {\n    success: boolean;\n    error?: T;\n}\n",
+            "sourceCode": "import { Observable, Subject, Subscription } from 'rxjs';\nimport { ModuleConfig } from './eui-config/eui-app-config';\nimport { LoadedConfigModules } from './eui-store/state/app.state';\nimport { EuiStoreServiceModel } from './eui-store/eui-store-service.model';\nimport { filter, switchMap } from 'rxjs/operators';\nimport { Selector } from 'reselect';\nimport { CoreState } from './eui-store';\n\nexport interface EuiServiceModel<T> {\n    init(t: T): Observable<EuiServiceStatus>;\n\n    /**\n     * retrieves the State of the service. If you don't pass anything it will retrieve the whole State\n     * of that service. If you pass a selector or MapFunction it will retrieve a slice of the state. If\n     * you pass a string that's a key of the Service State type it will retrieve that slice of the state.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    getState<K = T>(): Observable<T>;\n    getState<K>(mapFn: (state: T) => K): Observable<K>;\n    getState<A extends keyof T>(key: A): Observable<T[A]>;\n    getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    updateState(t: T): void;\n}\n\nexport type DeepPartial<T> = {\n    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport abstract class EuiService<T> implements EuiServiceModel<T> {\n    protected stateInstance: T;\n    protected prevStateInstance: T;\n    protected $stateSubs: Subscription;\n    protected $stateLazyLoadSubs: Subscription;\n    onStateChange: Subject<T> = new Subject<T>();\n\n    protected constructor(defaultState: T) {\n        this.stateInstance = defaultState;\n    }\n\n    initEuiService(): void {\n        this.unSubscribe();\n        this.$stateSubs = this.getState().subscribe((newState: T) => {\n            // set previous state of service\n            this.prevStateInstance = this.copy(this.stateInstance);\n            // update state before emit event\n            this.stateInstance = this.copy(newState);\n            // inform about state change\n            this.onStateChange.next(newState);\n        });\n    }\n\n    abstract init(t?: T): Observable<EuiServiceStatus>;\n\n    abstract getState<K = T>(): Observable<T>;\n    abstract getState<K>(mapFn?: (state: T) => K): Observable<K>;\n    abstract getState<A extends keyof T>(key?: A): Observable<T[A]>;\n    abstract getState<K>(keyOrMapFn?: ((state: T) => K) | string): Observable<K>;\n\n    abstract updateState(t: DeepPartial<T>): void;\n\n    protected unSubscribe(): void {\n        if (this.$stateSubs && this.$stateSubs.unsubscribe) {\n            this.$stateSubs.unsubscribe();\n        }\n        if (this.$stateLazyLoadSubs && this.$stateLazyLoadSubs.unsubscribe) {\n            this.$stateLazyLoadSubs.unsubscribe();\n        }\n    }\n\n    /**\n     * deep merge two objects\n     * @param target the object that will be merged into\n     * @param source the object that will be merged from\n     */\n    protected deepMerge<T>(target: T, source: DeepPartial<T>): T {\n        const output = Object.assign({}, target);\n        if (this.isObject(target) && this.isObject(source)) {\n            Object.keys(source).forEach(key => {\n                // Check if source[key] is an object and target[key] is either undefined, null, or an object\n                if (this.isObject(source[key])) {\n                    if (!(key in target) || target[key] === null) {\n                        // If target[key] doesn't exist or is null, directly assign source[key]\n                        Object.assign(output, { [key]: structuredClone(source[key]) });\n                    } else {\n                        // Only deep merge if target[key] is also an object\n                        output[key] = this.isObject(target[key])\n                            ? this.deepMerge(target[key], source[key])\n                            : structuredClone(source[key]);\n                    }\n                } else {\n                    Object.assign(output, { [key]: source[key] });\n                }\n            });\n        }\n        return output;\n    }\n\n    /**\n     * checks if the given item is an object\n     * @param item the item that will be checked\n     */\n    private isObject(item: unknown): item is object {\n        return item && typeof item === 'object' && !Array.isArray(item);\n    }\n\n    /**\n     * returns a copy of the given value whether this value is object or primitive. For the arrays it will cover\n     * multidimensional arrays, but it will not cover an object that contain functions. JSON.parse and JSON.stringify\n     * might have performance issues on large scale objects but that's an edge case scenario. In case that happens in\n     * the future follow the technique of NGRX with function caching.\n     *\n     * @param state\n     */\n    private copy(state: T): T {\n        if (typeof state === 'undefined') {\n            return undefined;\n        }\n        return JSON.parse(JSON.stringify(state));\n    }\n}\n\nconst getAppLoadedConfigModules: Selector<CoreState, LoadedConfigModules> = (state: CoreState) => state?.app?.loadedConfigModules\n\nexport abstract class EuiLazyService<T> extends EuiService<T> {\n    protected override stateInstance: T;\n    protected override $stateSubs: Subscription;\n    protected override $stateLazyLoadSubs: Subscription;\n\n    protected constructor(defaultState: T) {\n        super(defaultState);\n    }\n\n    abstract lazyLoadInit(moduleConfig: ModuleConfig, moduleName?: string): Observable<EuiServiceStatus>;\n\n    // todo it should use abstract store service\n    override initEuiService(storeForLazyLoad?: EuiStoreServiceModel<T>): void {\n        super.initEuiService();\n\n        if (storeForLazyLoad) {\n            this.$stateLazyLoadSubs = storeForLazyLoad\n                .select(getAppLoadedConfigModules)\n                .pipe(\n                    filter((loadedConfigModules: LoadedConfigModules) =>\n                        loadedConfigModules?.modulesConfig?.[loadedConfigModules.lastAddedModule] ? true : false,\n                    ),\n                    switchMap((loadedConfigModules: LoadedConfigModules) =>\n                        this.lazyLoadInit(\n                            loadedConfigModules.modulesConfig[loadedConfigModules.lastAddedModule],\n                            loadedConfigModules.lastAddedModule,\n                        ),\n                    ),\n                )\n                .subscribe(null);\n        }\n    }\n}\n\n/**\n * EuiServiceStatus is a model that represents the status of the service. It has a boolean property that indicates\n * whether the service was successful or not. If the service was not successful it will have an error property that\n * contains the error message.\n * @param T the type of the error message\n * @property success a boolean property that indicates whether the service was successful or not\n * @property error an optional property that contains the error message\n */\nexport interface EuiServiceStatus<T = unknown> {\n    success: boolean;\n    error?: T;\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -6762,12 +6779,12 @@
         },
         {
             "name": "LoggerMock",
-            "id": "class-LoggerMock-a327e3b3efe4eecaf3ef20133b1017856847aa4e03369358b35c3b66c566e1bf9369e6209076b05135c32dae261b84cefd25fb6367c20ac8a168e484919d7146",
+            "id": "class-LoggerMock-b07234d58d09a7b6061cd618fe24cf4c5f23df0461ce3a953abd12d3c2884a8820756cadb7c91f865998293f3b62be33e63cfc96ae50cc0aa707488e19fdd82b",
             "file": "packages/base/src/lib/eui-models/log/log.logger.mock.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { Logger } from './log.logger';\n\nexport class LoggerMock extends Logger {\n    constructor() {\n        super(null, null, null);\n    }\n\n    getLevel(): null {\n        return null;\n    }\n\n    setLevel(): void {\n        /* empty */\n    }\n\n    fatal(): void {\n        /* empty */\n    }\n\n    error(): void {\n        /* empty */\n    }\n\n    warn(): void {\n        /* empty */\n    }\n\n    info(): void {\n        /* empty */\n    }\n\n    debug(): void {\n        /* empty */\n    }\n\n    trace(): void {\n        /* empty */\n    }\n\n    isDisabled = (): boolean => false;\n    isEnabledFor = (): boolean => false;\n    isFatalEnabled = (): boolean => false;\n    isErrorEnabled = (): boolean => false;\n    isWarnEnabled = (): boolean => false;\n    isInfoEnabled = (): boolean => false;\n    isDebugEnabled = (): boolean => false;\n    isTraceEnabled = (): boolean => false;\n    isAllEnabled = (): boolean => false;\n}\n",
+            "sourceCode": "import { Logger } from './log.logger';\n\nexport class LoggerMock extends Logger {\n    constructor() {\n        super(null, null, null);\n    }\n\n    override getLevel(): null {\n        return null;\n    }\n\n    override setLevel(): void {\n        /* empty */\n    }\n\n    override fatal(): void {\n        /* empty */\n    }\n\n    override error(): void {\n        /* empty */\n    }\n\n    override warn(): void {\n        /* empty */\n    }\n\n    override info(): void {\n        /* empty */\n    }\n\n    override debug(): void {\n        /* empty */\n    }\n\n    override trace(): void {\n        /* empty */\n    }\n\n    override isDisabled = (): boolean => false;\n    override isEnabledFor = (): boolean => false;\n    override isFatalEnabled = (): boolean => false;\n    override isErrorEnabled = (): boolean => false;\n    override isWarnEnabled = (): boolean => false;\n    override isInfoEnabled = (): boolean => false;\n    override isDebugEnabled = (): boolean => false;\n    override isTraceEnabled = (): boolean => false;\n    override isAllEnabled = (): boolean => false;\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -6789,6 +6806,9 @@
                     "optional": false,
                     "description": "",
                     "line": 48,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6803,6 +6823,9 @@
                     "optional": false,
                     "description": "",
                     "line": 46,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6817,6 +6840,9 @@
                     "optional": false,
                     "description": "",
                     "line": 40,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6831,6 +6857,9 @@
                     "optional": false,
                     "description": "",
                     "line": 41,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6845,6 +6874,9 @@
                     "optional": false,
                     "description": "",
                     "line": 43,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6859,6 +6891,9 @@
                     "optional": false,
                     "description": "",
                     "line": 42,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6873,6 +6908,9 @@
                     "optional": false,
                     "description": "",
                     "line": 45,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6887,6 +6925,9 @@
                     "optional": false,
                     "description": "",
                     "line": 47,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6901,6 +6942,9 @@
                     "optional": false,
                     "description": "",
                     "line": 44,
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6916,6 +6960,9 @@
                     "line": 32,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6929,6 +6976,9 @@
                     "line": 20,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6942,6 +6992,9 @@
                     "line": 16,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6954,6 +7007,9 @@
                     "line": 8,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6967,6 +7023,9 @@
                     "line": 28,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6980,6 +7039,9 @@
                     "line": 12,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -6993,6 +7055,9 @@
                     "line": 36,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -7006,6 +7071,9 @@
                     "line": 24,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        164
+                    ],
                     "inheritance": {
                         "file": "Logger"
                     }
@@ -7149,12 +7217,12 @@
         },
         {
             "name": "UrlAppender",
-            "id": "class-UrlAppender-0bdc618b783f4ea54c12ee5585077820dc14422ec24bfdb3af2a332d8075a7d9847b65aade8b8c4941ff8f42ea08d31e8fe036fb607fc9f1708a481ed36a79d6",
+            "id": "class-UrlAppender-22bf1f9c046444e4a2f8f56b5ec9e0081a0b641e5afd19186bacc2d36d37f5bcd77dc6dc05e32fab2cd9e1e66e2a4870efb98fc7bf8a1cd840c519b16034bceb",
             "file": "packages/base/src/lib/eui-models/log/url.appender.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { Injector } from '@angular/core';\nimport { HttpClient } from '@angular/common/http';\nimport { LogEvent, LogPosition } from './log.model';\nimport { LogAppender } from './log.appender';\nimport { Logger } from './log.logger';\nimport { UrlAppenderConfig, UrlLogEvent } from '../eui-config';\n\n/**\n * Url Appender\n */\nexport class UrlAppender extends LogAppender<UrlAppenderConfig> {\n    protected http: HttpClient;\n\n    constructor(public config: UrlAppenderConfig, protected injector: Injector) {\n        super(config, injector);\n        // set the http client\n        this.http = injector && injector.get(HttpClient, null);\n        if (!this.http) {\n            console.error('UrlAppender needs HttpClient service to be defined as a provider.');\n        }\n    }\n\n    /**\n     * Logs an event to a server\n     */\n    append(event: LogEvent): void {\n        // eventual http errors will be caught by the HttpErrorHandlerInterceptor\n        if (this.http) {\n            this.http.post(this.config.url, this.toUrlEvent(event)).subscribe();\n        }\n    }\n\n    /**\n     * Maps a LogEvent into a UrlLogEvent\n     */\n    protected toUrlEvent(event: LogEvent): UrlLogEvent {\n        // check if the urlEventFromLevel allows the mapping to url log event\n        const toUrlEvent = this.config.detailedEventFromLevel && Logger.isEnabledFor(this.config.detailedEventFromLevel, event.level);\n        // returns the url event or the regular log event\n        return toUrlEvent\n            ? Object.assign({}, this.filterErrorType(event), {\n                  position: this.getPosition(),\n                  location: this.getLocation(),\n              })\n            : event;\n    }\n\n    /**\n     * returns the code position from where the log has been triggered\n     */\n    protected getPosition(): LogPosition {\n        // create a dummy error, just for the stack trace\n        const error = new Error();\n\n        try {\n            // throw it ...\n            throw error;\n        } catch (e) {\n            // ... and catch it\n            try {\n                // extract the correct stack line\n                let stackLine = error.stack.split('\\n')[3].trim();\n                if (stackLine.startsWith('at ')) {\n                    stackLine = stackLine.substring('at '.length);\n                }\n                // if the path is specified in parentheses\n                if (stackLine.lastIndexOf('(') > 0) {\n                    stackLine = stackLine.substring(stackLine.lastIndexOf('(') + 1, stackLine.indexOf(')'));\n                }\n                // strip base path, then parse file, line and column\n                const data = stackLine.substring(stackLine.lastIndexOf('/') + 1).split(':');\n                // if the data is parsed correctly\n                if (data.length === 3) {\n                    return {\n                        file: data[0],\n                        line: +data[1],\n                        column: +data[2],\n                    };\n                }\n            } catch (err) {\n                /* empty */\n            }\n        }\n        /* istanbul ignore next */\n        return null;\n    }\n\n    /**\n     * returns the url of the current page\n     */\n    protected getLocation(): string {\n        return window && window.location && window.location.href;\n    }\n\n    /**\n     * check messages if object type is Error and make its properties enumerable\n     */\n    protected filterErrorType(event: LogEvent): LogEvent {\n        event.messages = event.messages.map((m) => (m instanceof Error ? Object.getOwnPropertyDescriptors(m) : m));\n        return event;\n    }\n}\n",
+            "sourceCode": "import { Injector } from '@angular/core';\nimport { HttpClient } from '@angular/common/http';\nimport { LogEvent, LogPosition } from './log.model';\nimport { LogAppender } from './log.appender';\nimport { Logger } from './log.logger';\nimport { UrlAppenderConfig, UrlLogEvent } from '../eui-config';\n\n/**\n * Url Appender\n */\nexport class UrlAppender extends LogAppender<UrlAppenderConfig> {\n    protected http: HttpClient;\n\n    constructor(public override config: UrlAppenderConfig, protected override injector: Injector) {\n        super(config, injector);\n        // set the http client\n        this.http = injector && injector.get(HttpClient, null);\n        if (!this.http) {\n            console.error('UrlAppender needs HttpClient service to be defined as a provider.');\n        }\n    }\n\n    /**\n     * Logs an event to a server\n     */\n    append(event: LogEvent): void {\n        // eventual http errors will be caught by the HttpErrorHandlerInterceptor\n        if (this.http) {\n            this.http.post(this.config.url, this.toUrlEvent(event)).subscribe();\n        }\n    }\n\n    /**\n     * Maps a LogEvent into a UrlLogEvent\n     */\n    protected toUrlEvent(event: LogEvent): UrlLogEvent {\n        // check if the urlEventFromLevel allows the mapping to url log event\n        const toUrlEvent = this.config.detailedEventFromLevel && Logger.isEnabledFor(this.config.detailedEventFromLevel, event.level);\n        // returns the url event or the regular log event\n        return toUrlEvent\n            ? Object.assign({}, this.filterErrorType(event), {\n                  position: this.getPosition(),\n                  location: this.getLocation(),\n              })\n            : event;\n    }\n\n    /**\n     * returns the code position from where the log has been triggered\n     */\n    protected getPosition(): LogPosition {\n        // create a dummy error, just for the stack trace\n        const error = new Error();\n\n        try {\n            // throw it ...\n            throw error;\n        } catch (e) {\n            // ... and catch it\n            try {\n                // extract the correct stack line\n                let stackLine = error.stack.split('\\n')[3].trim();\n                if (stackLine.startsWith('at ')) {\n                    stackLine = stackLine.substring('at '.length);\n                }\n                // if the path is specified in parentheses\n                if (stackLine.lastIndexOf('(') > 0) {\n                    stackLine = stackLine.substring(stackLine.lastIndexOf('(') + 1, stackLine.indexOf(')'));\n                }\n                // strip base path, then parse file, line and column\n                const data = stackLine.substring(stackLine.lastIndexOf('/') + 1).split(':');\n                // if the data is parsed correctly\n                if (data.length === 3) {\n                    return {\n                        file: data[0],\n                        line: +data[1],\n                        column: +data[2],\n                    };\n                }\n            } catch (err) {\n                /* empty */\n            }\n        }\n        /* istanbul ignore next */\n        return null;\n    }\n\n    /**\n     * returns the url of the current page\n     */\n    protected getLocation(): string {\n        return window && window.location && window.location.href;\n    }\n\n    /**\n     * check messages if object type is Error and make its properties enumerable\n     */\n    protected filterErrorType(event: LogEvent): LogEvent {\n        event.messages = event.messages.map((m) => (m instanceof Error ? Object.getOwnPropertyDescriptors(m) : m));\n        return event;\n    }\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -7209,7 +7277,8 @@
                     "description": "",
                     "line": 14,
                     "modifierKind": [
-                        125
+                        125,
+                        164
                     ]
                 },
                 {
@@ -7464,12 +7533,12 @@
         },
         {
             "name": "UxClearErrorFeedbackEvent",
-            "id": "class-UxClearErrorFeedbackEvent-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "class-UxClearErrorFeedbackEvent-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -7491,7 +7560,7 @@
                         "optional": true
                     }
                 ],
-                "line": 166,
+                "line": 167,
                 "jsdoctags": [
                     {
                         "name": "id",
@@ -7526,7 +7595,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 167,
+                    "line": 168,
                     "modifierKind": [
                         125
                     ]
@@ -7539,7 +7608,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 167,
+                    "line": 168,
                     "modifierKind": [
                         125
                     ]
@@ -7553,12 +7622,12 @@
         },
         {
             "name": "UxErrorGroupOnClickEvent",
-            "id": "class-UxErrorGroupOnClickEvent-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "class-UxErrorGroupOnClickEvent-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -7579,7 +7648,7 @@
                         "optional": true
                     }
                 ],
-                "line": 64,
+                "line": 65,
                 "jsdoctags": [
                     {
                         "name": "groupId",
@@ -7613,7 +7682,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 65,
+                    "line": 66,
                     "modifierKind": [
                         125
                     ]
@@ -7626,7 +7695,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 65,
+                    "line": 66,
                     "modifierKind": [
                         125
                     ]
@@ -7640,12 +7709,12 @@
         },
         {
             "name": "UxErrorOutput",
-            "id": "class-UxErrorOutput-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "class-UxErrorOutput-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -8351,12 +8420,12 @@
         },
         {
             "name": "UxPublishErrorFeedbackEvent",
-            "id": "class-UxPublishErrorFeedbackEvent-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "class-UxPublishErrorFeedbackEvent-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -8391,7 +8460,7 @@
                         "optional": true
                     }
                 ],
-                "line": 162,
+                "line": 163,
                 "jsdoctags": [
                     {
                         "name": "err",
@@ -8445,7 +8514,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 163,
+                    "line": 164,
                     "modifierKind": [
                         125
                     ]
@@ -8458,7 +8527,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 163,
+                    "line": 164,
                     "modifierKind": [
                         125
                     ]
@@ -8471,7 +8540,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 163,
+                    "line": 164,
                     "modifierKind": [
                         125
                     ]
@@ -8484,7 +8553,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 163,
+                    "line": 164,
                     "modifierKind": [
                         125
                     ]
@@ -8498,12 +8567,12 @@
         },
         {
             "name": "UxValidationErrorClass",
-            "id": "class-UxValidationErrorClass-a68197a3eaa39d4b7bb6fef00903f2119f42138c29c0ec23b6c68702b2d23284d5446044739ac12cde95ab18110221f5be7aa9977534a363d1f68b3eff489d99",
+            "id": "class-UxValidationErrorClass-a5db7b78f6d67f8705c73d2a4706b59f8663f863256bf761780a8b388bc1b8ce0e7381ed68537e922ec0f02845f46f1c05dc63c8d6d7dcc04fd59099dce5b7d4",
             "file": "packages/base/src/lib/ux-models/ux-error-feedback.model.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "class",
-            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
+            "sourceCode": "import { HttpErrorResponse } from '@angular/common/http';\n\nexport class UxErrorOutput<DETAILS = unknown> implements UxErrorInfo, UxHttpErrorInfo, UxErrorFeedback {\n    code?: string;\n    requestId?: string;\n    doc?: string;\n    details?: DETAILS;\n    severity = UxMessageSeverity.danger;\n    msgId: string;\n    description: string;\n    errGroupMap?: Array<UxErrorGroupMap>;\n    subErrors?: SubErrors;\n\n    constructor(\n        info: UxErrorInfo & UxHttpErrorInfo,\n        errorFeedback: UxErrorFeedback,\n        subErrors?: SubErrors,\n        errGroupMap?: Array<UxErrorGroupMap>,\n    ) {\n        if (!subErrors) {\n            Object.assign(this, { ...info }, { ...errorFeedback });\n        } else {\n            Object.assign(this, { ...info }, { ...errorFeedback }, { subErrors }, { errGroupMap });\n        }\n    }\n\n    getFeedBacks(byKey?: string): Array<UxErrorFeedback> {\n        if (this.subErrors) {\n            return this.subErrors\n                .filter((err) => {\n                    if (err instanceof UxValidationErrorClass) {\n                        if (byKey && err.attributes) {\n                            return this.checkAttribute(byKey, err.attributes);\n                        } else if (byKey && !err.attributes) {\n                            return false;\n                        } else if (!byKey) {\n                            return true;\n                        }\n                    }\n                    return null;\n                })\n                .map((err) => ({\n                    msgId: err.msgId,\n                    description: err.description,\n                    severity: err.severity,\n                    attributes: err.attributes,\n                    errGroupId: err.errGroupId,\n                    br: err.br,\n                    doc: err.doc,\n                }));\n        } else {\n            if (!byKey) {\n                return [{ msgId: this.msgId, description: this.description, severity: this.severity, doc: this.doc }];\n            } else {\n                return [];\n            }\n        }\n    }\n\n    private checkAttribute(key: string, attributes: UxValidationErrorAttributes): boolean {\n        return attributes.some((attr) => key === attr.key);\n    }\n}\n\nexport class UxErrorGroupOnClickEvent {\n    constructor(public groupId: string, public err?: UxErrorFeedback) {}\n}\n\nexport interface UxErrorFollowMap {\n    [groupId: string]: boolean;\n}\n\nexport type UxErrorGroupMap = {\n    id: string;\n    description: string;\n    severity: UxMessageSeverity;\n};\n\nexport type UxErrorGroupItem = {\n    groupId: string;\n    description: string;\n    severity: UxMessageSeverity;\n    errors: Array<UxErrorFeedback>;\n};\n\n// T extends U ? X : Y\n// Let's look at the ways to do detailed generic, like error\nexport interface UxErrorInfo<DETAILS = unknown> {\n    code?: string;\n    doc?: string;\n    details?: DETAILS;\n}\n\nexport interface UxHttpErrorInfo {\n    requestId?: string;\n}\n\nexport interface UxErrorFeedback extends UxErrorMessage {\n    severity?: UxMessageSeverity;\n    attributes?: UxValidationErrorAttributes;\n    errGroupId?: string;\n    br?: string;\n    doc?: string;\n}\n\nexport interface UxErrorMessage {\n    msgId: string;\n    description?: string;\n}\n\nexport type UxValidationErrorAttributes = Array<UxValidationErrorAttribute>;\n\nexport interface UxValidationErrorAttribute {\n    key: string | Array<string>;\n    value: string;\n}\n\nexport enum UxMessageSeverity {\n    info = 'info',\n    warning = 'warning',\n    danger = 'danger',\n    success = 'success',\n}\n\nexport enum UxMessageSeverityMetrics {\n    info = 0,\n    warning = 1,\n    danger = 2,\n    success = 3,\n}\n\nexport type SubErrors = Array<UxValidationErrorClass>;\n\nexport class UxValidationErrorClass<Details = object> implements UxErrorInfo<Details>, UxErrorFeedback {\n    msgId: string;\n    description?: string;\n    severity = UxMessageSeverity.danger;\n    attributes: UxValidationErrorAttributes;\n    br?: string;\n    doc?: string;\n    details?: Details;\n    errGroupId?: string;\n\n    constructor(data: UxValidationErrorClass) {\n        Object.assign(this, data);\n    }\n}\n\nexport type ErrorMappingHandler<Error = object> = (err: Error) => UxErrorOutput;\n\nexport interface UxHttpErrorResponse extends HttpErrorResponse {\n    uxHttpErrorOutput: UxErrorOutput;\n}\n\nexport const transformToUxHttpResponse = (resp: HttpErrorResponse, mapper: ErrorMappingHandler): UxHttpErrorResponse => {\n    const updatedErr = resp as UxHttpErrorResponse;\n    updatedErr.uxHttpErrorOutput = mapper(resp.error);\n    return updatedErr;\n};\n\nexport type UxErrorFeedbackEventType = UxPublishErrorFeedbackEvent | UxClearErrorFeedbackEvent;\n\nexport class UxPublishErrorFeedbackEvent {\n    constructor(public err: UxErrorOutput, public id?: string, public groupId?: string, public accumulate?: boolean) {}\n}\n\nexport class UxClearErrorFeedbackEvent {\n    constructor(public id?: string, public groupId?: string) {}\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -8517,7 +8586,7 @@
                         "deprecationMessage": ""
                     }
                 ],
-                "line": 141,
+                "line": 142,
                 "jsdoctags": [
                     {
                         "name": "data",
@@ -8541,7 +8610,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 137
+                    "line": 138
                 },
                 {
                     "name": "br",
@@ -8551,7 +8620,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 138
+                    "line": 139
                 },
                 {
                     "name": "description",
@@ -8561,7 +8630,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 135
+                    "line": 136
                 },
                 {
                     "name": "details",
@@ -8571,7 +8640,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 140
+                    "line": 141
                 },
                 {
                     "name": "doc",
@@ -8581,7 +8650,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 139
+                    "line": 140
                 },
                 {
                     "name": "errGroupId",
@@ -8591,7 +8660,7 @@
                     "indexKey": "",
                     "optional": true,
                     "description": "",
-                    "line": 141
+                    "line": 142
                 },
                 {
                     "name": "msgId",
@@ -8601,7 +8670,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 134
+                    "line": 135
                 },
                 {
                     "name": "severity",
@@ -8612,7 +8681,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 136
+                    "line": 137
                 }
             ],
             "methods": [],