@c8y/ngx-components 1023.92.0 → 1023.97.3

package/fesm2022/c8y-ngx-components-context-dashboard.mjs

@@ -4,7 +4,7 @@ import * as i2 from '@c8y/ngx-components';
 import { IconDirective, C8yTranslatePipe, Permissions, ContextRouteService, Status, NavigatorNode, NEW_DASHBOARD_ROUTER_STATE_PROP, getActivatedRoute, ViewContext, TabsOutletComponent, memoize, hookGeneric, ExtensionPointForPlugins, fromTriggerOnce, getInjectedHooks, stateToFactory, ListGroupModule, C8yComponentOutlet, AlertService, C8yTranslateDirective, DynamicComponentModule, DynamicComponentComponent, sortByPriority, isPromise, CoreModule, WIDGET_CONFIGURATION_GRID_SIZE, HighlightComponent, EmptyStateComponent, FormGroupComponent, RequiredInputPlaceholderDirective, ProductExperienceDirective, ResizableGridComponent, DashboardChildChange, CopyDashboardDisabledReason, TitleComponent, ActionBarItemComponent, HelpComponent, WidgetsDashboardComponent, DatePipe, hookRoute, hookTab, PreviewService, hookNavigator, ManagedObjectRealtimeService, BottomDrawerService, ClipboardService, InputGroupEditableComponent, MessageDirective } from '@c8y/ngx-components';
 import * as i1 from '@angular/router';
 import { RouterOutlet, ActivatedRoute, RouterModule } from '@angular/router';
-import { of, Subject, from, combineLatest, map as map$1, merge, BehaviorSubject, tap as tap$1, withLatestFrom, mergeMap as mergeMap$1, shareReplay as shareReplay$1, scan, debounceTime, isObservable, iif, timer, filter as filter$1, switchMap as switchMap$1, take, forkJoin, firstValueFrom } from 'rxjs';
+import { of, Subject, from, combineLatest, map as map$1, merge, BehaviorSubject, tap as tap$1, withLatestFrom, mergeMap as mergeMap$1, shareReplay as shareReplay$1, scan, debounceTime, isObservable, iif, timer, filter as filter$1, switchMap as switchMap$1, take, EMPTY, defer, forkJoin, firstValueFrom } from 'rxjs';
 import { gettext } from '@c8y/ngx-components/gettext';
 import { __decorate, __metadata } from 'tslib';
 import * as i3 from '@angular/common';
@@ -382,7 +382,7 @@ class ContextDashboardService {
                 this.tabs.refresh();
             });
         }
-        catch (ex) {
+        catch {
             // intended empty
         }
     }
@@ -402,17 +402,17 @@ class ContextDashboardService {
         }
         return dashboard;
     }
-    activateDashboards(route, types) {
+    activateDashboards(route, types, options) {
         const { dashboardId } = route.params;
         if (dashboardId) {
-            return this.getDashboard$(dashboardId, types, route.parent.data.contextData).pipe(tap(dashboard => {
+            return this.getDashboard$(dashboardId, types, route.parent.data.contextData, options).pipe(tap(dashboard => {
                 route.data = { dashboard };
             }), map(() => true), catchError(() => {
                 return of(false);
             }));
         }
         const { contextData: mo } = this.contextRouteService.getContextData(route);
-        this.dashboardTabs$ = this.getTabs$(mo, types, route?.parent?.data);
+        this.dashboardTabs$ = this.getTabs$(mo, types, route?.parent?.data, options);
         return this.dashboardTabs$;
     }
     getDashboard(name, defaultWidgets) {
@@ -540,10 +540,10 @@ class ContextDashboardService {
             return widget;
         }), 'id');
     }
-    getDashboard$(dashboardIdOrName, dashboardType, mo) {
+    getDashboard$(dashboardIdOrName, dashboardType, mo, options) {
         const cache = this.cache.get(dashboardIdOrName);
         const dashboards = mo
-            ? this.getContextDashboards(mo, dashboardType)
+            ? this.getContextDashboards(mo, dashboardType, options)
             : this.getNamedDashboard(dashboardIdOrName);
         const cacheRefresh = this.getContextDashboards$(dashboards).pipe(tap(dashboard => this.cacheDashboard(dashboard)), filter(dashboard => dashboard.id === dashboardIdOrName ||
             has(dashboard, `${this.FRAGMENT_NAME}${this.INDEX_SPLIT}${ContextDashboardType.Named}${this.INDEX_SPLIT}${dashboardIdOrName}`)));
@@ -660,7 +660,7 @@ class ContextDashboardService {
             return null;
         }
     }
-    async getContextDashboards(mo, dashboardType) {
+    async getContextDashboards(mo, dashboardType, options) {
         const filterCriteria = dashboardType.map(t => ({
             // it's necessary to wrap fragment in quotes because dashboard type can contain spaces
             __has: `'${this.createDashboardFragment(mo, t)}'`
@@ -678,9 +678,11 @@ class ContextDashboardService {
             ? [...filterCriteria, typeFilterCriteria]
             : filterCriteria;
         const query = this.queriesUtil.buildQuery({ __filter: { __or: finalFilterCriteria } });
+        const strictAppFilter = !!options?.strictAppFilter;
         const now = Date.now();
         const cacheHasValidResponse = this.contextDashboardsCache &&
             this.contextDashboardsCache.query === query &&
+            this.contextDashboardsCache.strictAppFilter === strictAppFilter &&
             now - this.contextDashboardsCache.timestamp < this.CACHE_TIMEOUT;
         if (cacheHasValidResponse) {
             return this.contextDashboardsCache.result;
@@ -690,7 +692,8 @@ class ContextDashboardService {
         }
         this.contextDashboardsCache = {
             query,
-            result: this.listAndFilterByApplication(query),
+            strictAppFilter,
+            result: this.listAndFilterByApplication(query, strictAppFilter),
             timestamp: now
         };
         return this.contextDashboardsCache.result;
@@ -890,8 +893,8 @@ class ContextDashboardService {
     replaceContextInIdsObj(ids, newContext, oldContext) {
         return Object.fromEntries(Object.entries(ids).map(([key, id]) => [key, id === oldContext.id ? newContext.id : id]));
     }
-    getTabs$(mo, dashboardType, context) {
-        const dashboards = this.getContextDashboards(mo, dashboardType);
+    getTabs$(mo, dashboardType, context, options) {
+        const dashboards = this.getContextDashboards(mo, dashboardType, options);
         return this.getContextDashboards$(dashboards).pipe(mergeMap(dashboard => this.verifyDashboardAvailability$(dashboard)), 
         // Due to MTM-62321 named context dashboards included fragments for device and groups.
         // therefore some device-info dashboards (from DM app) might occur in cockpit on device level.
@@ -1014,10 +1017,15 @@ class ContextDashboardService {
      * For dashboard views within applications, filter dashboards by application association.
      * Do it on the client side as the inventory query doesn't perform well on not indexed fragments.
      */
-    async listAndFilterByApplication(query) {
+    async listAndFilterByApplication(query, strictAppFilter = false) {
         const dashboards = await this.inventory.list({ query, pageSize: this.DEFAULT_PAGESIZE });
+        const appKey = this.appStateService?.currentApplication?.value?.key;
         dashboards.data = dashboards.data.filter(dashboard => {
-            return (Array.from(dashboard[this.APPLIED_TO_FRAGMENT] || []).includes(this.appStateService?.currentApplication?.value?.key) || !dashboard[this.APPLIED_TO_FRAGMENT]);
+            const appliedTo = Array.from(dashboard[this.APPLIED_TO_FRAGMENT] || []);
+            if (strictAppFilter) {
+                return !!appKey && appliedTo.includes(appKey);
+            }
+            return appliedTo.includes(appKey) || !dashboard[this.APPLIED_TO_FRAGMENT];
         });
         return dashboards;
     }
@@ -1555,7 +1563,7 @@ class DashboardDetailComponent {
         this.tabs = this.dashboardDetailService.getTabs();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DashboardDetailComponent, deps: [{ token: ContextDashboardService }, { token: i2$1.TranslateService }, { token: i2.ContextRouteService }, { token: i1.ActivatedRoute }, { token: i2.TabsService }, { token: i1.Router }, { token: i1$1.InventoryService }, { token: i1.ActivatedRoute }, { token: DashboardDetailService }, { token: i2.AppStateService }, { token: i2.GroupService }, { token: i2.ModalService }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DashboardDetailComponent, isStandalone: true, selector: "c8y-dashboard-detail", inputs: { isReport: "isReport", deviceType: "deviceType", context: "context", mo: "mo", dashboard: "dashboard", isNamedDashboard: "isNamedDashboard", hideAvailability: "hideAvailability" }, outputs: { dashboardSaved: "dashboardSaved", previewChanged: "previewChanged" }, providers: [DashboardDetailService], usesOnChanges: true, ngImport: i0, template: "<div\n  class=\"collapse c8y-top-drawer\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n>\n  <div class=\"p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom\">\n    <span class=\"h4\">{{ 'Dashboard settings' | translate }}</span>\n  </div>\n\n  @if (!isCollapsed) {\n    <div class=\"d-flex\">\n      <c8y-tabs-outlet\n        class=\"c8y-top-drawer--tabs\"\n        [tabs]=\"tabs\"\n        [outletName]=\"TABS_OUTLET_NAME\"\n        [orientation]=\"'vertical'\"\n        [openFirstTab]=\"true\"\n      ></c8y-tabs-outlet>\n\n      <div\n        class=\"inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24\"\n      >\n        <router-outlet name=\"dashboard-details\"></router-outlet>\n      </div>\n    </div>\n  }\n\n  <div class=\"c8y-top-drawer--footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--cancel-dashboard\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--save-dashboard\"\n      (click)=\"save()\"\n      [disabled]=\"\n        ((dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit) ||\n        dashboardDetailService.saveButtonDisabled\n      \"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "component", type: TabsOutletComponent, selector: "c8y-tabs-outlet,c8y-ui-tabs", inputs: ["tabs", "orientation", "navigatorOpen", "outletName", "context", "openFirstTab", "hasHeader"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DashboardDetailComponent, isStandalone: true, selector: "c8y-dashboard-detail", inputs: { isReport: "isReport", deviceType: "deviceType", context: "context", mo: "mo", dashboard: "dashboard", isNamedDashboard: "isNamedDashboard", hideAvailability: "hideAvailability" }, outputs: { dashboardSaved: "dashboardSaved", previewChanged: "previewChanged" }, providers: [DashboardDetailService], usesOnChanges: true, ngImport: i0, template: "<!--\n  [isAnimated]=\"false\": ngx-bootstrap's CollapseDirective builds an Angular animation\n  player on each open/close but never destroys it on teardown, so the root animation\n  engine retains the player and its onDone closure pins this directive \u2014 and via the\n  view tree the whole c8y-context-dashboard \u2014 on every \"Dashboard settings\" open (leak).\n-->\n<div\n  class=\"collapse c8y-top-drawer\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"false\"\n>\n  <div class=\"p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom\">\n    <span class=\"h4\">{{ 'Dashboard settings' | translate }}</span>\n  </div>\n\n  @if (!isCollapsed) {\n    <div class=\"d-flex\">\n      <c8y-tabs-outlet\n        class=\"c8y-top-drawer--tabs\"\n        [tabs]=\"tabs\"\n        [outletName]=\"TABS_OUTLET_NAME\"\n        [orientation]=\"'vertical'\"\n        [openFirstTab]=\"true\"\n      ></c8y-tabs-outlet>\n\n      <div\n        class=\"inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24\"\n      >\n        <router-outlet name=\"dashboard-details\"></router-outlet>\n      </div>\n    </div>\n  }\n\n  <div class=\"c8y-top-drawer--footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--cancel-dashboard\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--save-dashboard\"\n      (click)=\"save()\"\n      [disabled]=\"\n        ((dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit) ||\n        dashboardDetailService.saveButtonDisabled\n      \"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "component", type: TabsOutletComponent, selector: "c8y-tabs-outlet,c8y-ui-tabs", inputs: ["tabs", "orientation", "navigatorOpen", "outletName", "context", "openFirstTab", "hasHeader"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 __decorate([
     memoize(),
@@ -1565,7 +1573,7 @@ __decorate([
 ], DashboardDetailComponent.prototype, "convertStringToHash", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DashboardDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-dashboard-detail', providers: [DashboardDetailService], imports: [CollapseDirective, TabsOutletComponent, RouterOutlet, C8yTranslatePipe], template: "<div\n  class=\"collapse c8y-top-drawer\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n>\n  <div class=\"p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom\">\n    <span class=\"h4\">{{ 'Dashboard settings' | translate }}</span>\n  </div>\n\n  @if (!isCollapsed) {\n    <div class=\"d-flex\">\n      <c8y-tabs-outlet\n        class=\"c8y-top-drawer--tabs\"\n        [tabs]=\"tabs\"\n        [outletName]=\"TABS_OUTLET_NAME\"\n        [orientation]=\"'vertical'\"\n        [openFirstTab]=\"true\"\n      ></c8y-tabs-outlet>\n\n      <div\n        class=\"inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24\"\n      >\n        <router-outlet name=\"dashboard-details\"></router-outlet>\n      </div>\n    </div>\n  }\n\n  <div class=\"c8y-top-drawer--footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--cancel-dashboard\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--save-dashboard\"\n      (click)=\"save()\"\n      [disabled]=\"\n        ((dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit) ||\n        dashboardDetailService.saveButtonDisabled\n      \"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'c8y-dashboard-detail', providers: [DashboardDetailService], imports: [CollapseDirective, TabsOutletComponent, RouterOutlet, C8yTranslatePipe], template: "<!--\n  [isAnimated]=\"false\": ngx-bootstrap's CollapseDirective builds an Angular animation\n  player on each open/close but never destroys it on teardown, so the root animation\n  engine retains the player and its onDone closure pins this directive \u2014 and via the\n  view tree the whole c8y-context-dashboard \u2014 on every \"Dashboard settings\" open (leak).\n-->\n<div\n  class=\"collapse c8y-top-drawer\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"false\"\n>\n  <div class=\"p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom\">\n    <span class=\"h4\">{{ 'Dashboard settings' | translate }}</span>\n  </div>\n\n  @if (!isCollapsed) {\n    <div class=\"d-flex\">\n      <c8y-tabs-outlet\n        class=\"c8y-top-drawer--tabs\"\n        [tabs]=\"tabs\"\n        [outletName]=\"TABS_OUTLET_NAME\"\n        [orientation]=\"'vertical'\"\n        [openFirstTab]=\"true\"\n      ></c8y-tabs-outlet>\n\n      <div\n        class=\"inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24\"\n      >\n        <router-outlet name=\"dashboard-details\"></router-outlet>\n      </div>\n    </div>\n  }\n\n  <div class=\"c8y-top-drawer--footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--cancel-dashboard\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--save-dashboard\"\n      (click)=\"save()\"\n      [disabled]=\"\n        ((dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit) ||\n        dashboardDetailService.saveButtonDisabled\n      \"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: ContextDashboardService }, { type: i2$1.TranslateService }, { type: i2.ContextRouteService }, { type: i1.ActivatedRoute }, { type: i2.TabsService }, { type: i1.Router }, { type: i1$1.InventoryService }, { type: i1.ActivatedRoute }, { type: DashboardDetailService }, { type: i2.AppStateService }, { type: i2.GroupService }, { type: i2.ModalService }, { type: i2.GainsightService }], propDecorators: { isReport: [{
                 type: Input
             }], deviceType: [{
@@ -4300,7 +4308,9 @@ const canActivateDeviceInfo = (route, _) => {
     return previewFeatureService.getState$('ui.dm-dashboard-manager').pipe(switchMap$1(isPreviewEnabled => {
         return isPreviewEnabled
             ? contextDashboardService
-                .activateDashboards(route, [ContextDashboardType.Device, ContextDashboardType.Type])
+                .activateDashboards(route, [ContextDashboardType.Device, ContextDashboardType.Type], {
+                strictAppFilter: true
+            })
                 .pipe(map$1(tabs => !(Array.isArray(tabs) && tabs.length > 0)))
             : of(true);
     }), take(1));
@@ -4487,15 +4497,16 @@ class AssetPropertyMappingsService {
      *
      * @param mappings - The asset property mappings configuration.
      * @param realtimeControl$ - Observable that controls realtime notifications (true = enabled, false = disabled, default = enabled).
+     * @param refresh$ - Optional trigger; each emission forces a fresh REST fetch of all property values.
      * @returns Observable emitting updated asset property values as they change.
      */
-    getValues$(mappings, realtimeControl$ = of(true)) {
+    getValues$(mappings, realtimeControl$ = of(true), refresh$ = EMPTY) {
         if (!mappings) {
             return of({});
         }
         const { regular, computed } = this.groupByType(mappings);
         const _regularByAssetId = this.groupByAssetId(regular);
-        return merge(...computed.map(mapping => this.getComputedPropertyValues$(mapping, realtimeControl$)), ...Object.entries(_regularByAssetId).map(([assetId, mappings]) => this.getRegularPropertyValues$(assetId, mappings, realtimeControl$))).pipe(scan((acc, update) => ({ ...acc, ...update }), {}), startWith({}));
+        return merge(...computed.map(mapping => this.getComputedPropertyValues$(mapping, realtimeControl$, refresh$)), ...Object.entries(_regularByAssetId).map(([assetId, mappings]) => this.getRegularPropertyValues$(assetId, mappings, realtimeControl$, refresh$))).pipe(scan((acc, update) => ({ ...acc, ...update }), {}), startWith({}));
     }
     groupByType(mappings) {
         const regular = [];
@@ -4525,7 +4536,7 @@ class AssetPropertyMappingsService {
             return acc;
         }, {});
     }
-    getComputedPropertyValues$(mapping, realtimeControl$) {
+    getComputedPropertyValues$(mapping, realtimeControl$, refresh$) {
         if (!mapping.assetProperty) {
             return of(null);
         }
@@ -4552,28 +4563,21 @@ class AssetPropertyMappingsService {
                 return of(value);
             }
         }))));
-        return realtimeControl$.pipe(distinctUntilChanged(), switchMap(enabled => (enabled ? computedValue$ : computedValue$.pipe(take$1(1)))), map(value => ({ [mapping.name]: value })), catchError(err => {
-            // eslint-disable-next-line no-console
-            console.warn(`Error in computed property stream for asset ${mapping.assetProperty.asset.id}, property ${mapping.assetProperty.name}:`, err);
-            return of({ [mapping.name]: null });
-        }), shareReplay({ bufferSize: 1, refCount: true }));
-    }
-    getRegularPropertyValues$(assetId, mappings, realtimeControl$) {
-        return realtimeControl$.pipe(distinctUntilChanged(), switchMap(enabled => {
-            if (!enabled) {
-                return from(this.inventory.detail(assetId, { withLatestValues: true })).pipe(map(res => res?.data));
-            }
-            else {
-                return from(this.inventory.detail(assetId, { withLatestValues: true })).pipe(switchMap(initial => this.moRealtime.onAll$(assetId).pipe(map(update => update?.data), startWith(initial?.data))));
-            }
-        }), map(asset => mappings.reduce((acc, mapping) => ({
+        return combineLatest([
+            realtimeControl$.pipe(distinctUntilChanged()),
+            refresh$.pipe(startWith(undefined))
+        ]).pipe(switchMap(([enabled]) => (enabled ? computedValue$ : computedValue$.pipe(take$1(1)))), map(value => ({ [mapping.name]: value })), shareReplay({ bufferSize: 1, refCount: true }));
+    }
+    getRegularPropertyValues$(assetId, mappings, realtimeControl$, refresh$) {
+        const fetchAsset$ = defer(() => from(this.inventory.detail(assetId, { withLatestValues: true }))).pipe(map(res => res?.data));
+        const liveAsset$ = (initial) => this.moRealtime.onAll$(assetId).pipe(map(update => update?.data), startWith(initial));
+        return combineLatest([
+            realtimeControl$.pipe(distinctUntilChanged()),
+            refresh$.pipe(startWith(undefined))
+        ]).pipe(switchMap(([enabled]) => (enabled ? fetchAsset$.pipe(switchMap(liveAsset$)) : fetchAsset$)), map(asset => mappings.reduce((acc, mapping) => ({
             ...acc,
             [mapping.name]: this.getRegularPropertyValue(asset, mapping.assetProperty)
-        }), {})), catchError(err => {
-            // eslint-disable-next-line no-console
-            console.warn(`Error in controlled asset stream for asset ${assetId}:`, err);
-            return of(mappings.reduce((acc, m) => ({ ...acc, [m.name]: null }), {}));
-        }), shareReplay({ bufferSize: 1, refCount: true }));
+        }), {})), shareReplay({ bufferSize: 1, refCount: true }));
     }
     getRegularPropertyValue(asset, property) {
         if (!asset || !property) {
@@ -4699,6 +4703,10 @@ class AssetPropertyMappingsComponent {
         this.allowAddingNewMappings = input(true, ...(ngDevMode ? [{ debugName: "allowAddingNewMappings" }] : []));
         this.allowRenamingMappings = input(true, ...(ngDevMode ? [{ debugName: "allowRenamingMappings" }] : []));
         this.allowRelabellingMappings = input(true, ...(ngDevMode ? [{ debugName: "allowRelabellingMappings" }] : []));
+        /** When set, mapping names must match this regex. Validated on rename. */
+        this.mappingNameFormatRegex = input(null, ...(ngDevMode ? [{ debugName: "mappingNameFormatRegex" }] : []));
+        /** Error message shown when a name fails the mappingNameFormatRegex check. */
+        this.mappingNameFormatErrorMessage = input(gettext('Name does not match the required format.'), ...(ngDevMode ? [{ debugName: "mappingNameFormatErrorMessage" }] : []));
         this.allowEditingMappings = input(true, ...(ngDevMode ? [{ debugName: "allowEditingMappings" }] : []));
         this.allowRemovingMappings = input(true, ...(ngDevMode ? [{ debugName: "allowRemovingMappings" }] : []));
         this.showLabels = input(true, ...(ngDevMode ? [{ debugName: "showLabels" }] : []));
@@ -4711,10 +4719,14 @@ class AssetPropertyMappingsComponent {
          * Callback to transform a mapping into the text that gets copied to the clipboard.
          * Exposed as an input so widget config factories can override the default (e.g. to
          * produce a template expression like `${this.c8yProperties?.temperature}`).
+         * The second argument is the current widget config, which can be used to adjust
+         * the output based on widget-specific settings (e.g. legacy mode).
          */
         this.onBeforeCopyMappingToClipboard = input((mapping) => String(mapping.name), ...(ngDevMode ? [{ debugName: "onBeforeCopyMappingToClipboard" }] : []));
-        this.emptyStateTitle = gettext('No asset property mappings');
-        this.emptyStateSubtitle = gettext('Add first asset property mapping.');
+        this.emptyStateTitle = input(gettext('No asset property mappings'), ...(ngDevMode ? [{ debugName: "emptyStateTitle" }] : []));
+        this.emptyStateSubtitle = input(gettext('Add first asset property mapping.'), ...(ngDevMode ? [{ debugName: "emptyStateSubtitle" }] : []));
+        /** Message shown in the section's feedback area. Available placeholder: {{ count }} */
+        this.feedbackMessage = input(gettext('{{ count }} selected'), ...(ngDevMode ? [{ debugName: "feedbackMessage" }] : []));
         this.mappings$ = this.widgetConfigService.currentConfig$.pipe(map$1(config => get(config, this.widgetConfigPath())));
         this.keys$ = this.mappings$.pipe(map$1(mappings => Object.keys(mappings || {}).sort((a, b) => a.localeCompare(b))));
         this.mappingsSignal = toSignal(this.mappings$, { initialValue: null });
@@ -4753,7 +4765,7 @@ class AssetPropertyMappingsComponent {
         const config = await firstValueFrom(this.widgetConfigService.currentConfig$);
         if (!get(config, this.widgetConfigPath())) {
             const newConfig = { ...config };
-            const mappings = structuredClone(this.initialMappings());
+            const mappings = structuredClone(this.initialMappings() ?? {});
             for (const [key, mapping] of Object.entries(mappings)) {
                 if (mapping.assetProperty && !mapping.assetProperty.asset) {
                     if (!config.device) {
@@ -4815,7 +4827,7 @@ class AssetPropertyMappingsComponent {
             set(newConfig, this.widgetConfigPath(), mappings);
             this.widgetConfigService.updateConfig(newConfig);
         }
-        catch (ex) {
+        catch {
             // cancelled
         }
         finally {
@@ -4855,7 +4867,7 @@ class AssetPropertyMappingsComponent {
             set(newConfig, this.widgetConfigPath(), mappings);
             this.widgetConfigService.updateConfig(newConfig);
         }
-        catch (ex) {
+        catch {
             // cancelled
         }
         finally {
@@ -4869,7 +4881,8 @@ class AssetPropertyMappingsComponent {
     }
     async copyMappingToClipboard(name, mapping) {
         const mappingToTextFn = this.onBeforeCopyMappingToClipboard();
-        const text = mappingToTextFn({ name, ...mapping });
+        const config = await firstValueFrom(this.widgetConfigService.currentConfig$);
+        const text = mappingToTextFn({ name, ...mapping }, config);
         await this.clipboardService.writeText(text);
     }
     async removeMapping(name) {
@@ -4897,11 +4910,17 @@ class AssetPropertyMappingsComponent {
     }
     getNameValidators(key) {
         if (!this.nameValidatorCache.has(key)) {
+            const regex = this.mappingNameFormatRegex();
             this.nameValidatorCache.set(key, [
                 Validators.required,
                 ctrl => this.isNameAlreadyUsed(ctrl.value, key, this.keysSignal())
                     ? { 'key-already-used': true }
-                    : null
+                    : null,
+                ...(regex
+                    ? [
+                        (ctrl) => regex.test(ctrl.value?.trim()) ? null : { 'key-invalid-format': true }
+                    ]
+                    : [])
             ]);
         }
         return this.nameValidatorCache.get(key);
@@ -4956,7 +4975,7 @@ class AssetPropertyMappingsComponent {
         return result;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AssetPropertyMappingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AssetPropertyMappingsComponent, isStandalone: true, selector: "c8y-asset-property-mappings", inputs: { widgetConfigPath: { classPropertyName: "widgetConfigPath", publicName: "widgetConfigPath", isSignal: true, isRequired: false, transformFunction: null }, initialMappings: { classPropertyName: "initialMappings", publicName: "initialMappings", isSignal: true, isRequired: false, transformFunction: null }, allowAddingNewMappings: { classPropertyName: "allowAddingNewMappings", publicName: "allowAddingNewMappings", isSignal: true, isRequired: false, transformFunction: null }, allowRenamingMappings: { classPropertyName: "allowRenamingMappings", publicName: "allowRenamingMappings", isSignal: true, isRequired: false, transformFunction: null }, allowRelabellingMappings: { classPropertyName: "allowRelabellingMappings", publicName: "allowRelabellingMappings", isSignal: true, isRequired: false, transformFunction: null }, allowEditingMappings: { classPropertyName: "allowEditingMappings", publicName: "allowEditingMappings", isSignal: true, isRequired: false, transformFunction: null }, allowRemovingMappings: { classPropertyName: "allowRemovingMappings", publicName: "allowRemovingMappings", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null }, showNames: { classPropertyName: "showNames", publicName: "showNames", isSignal: true, isRequired: false, transformFunction: null }, showAssets: { classPropertyName: "showAssets", publicName: "showAssets", isSignal: true, isRequired: false, transformFunction: null }, showProperties: { classPropertyName: "showProperties", publicName: "showProperties", isSignal: true, isRequired: false, transformFunction: null }, showValues: { classPropertyName: "showValues", publicName: "showValues", isSignal: true, isRequired: false, transformFunction: null }, actionsColumnSpan: { classPropertyName: "actionsColumnSpan", publicName: "actionsColumnSpan", isSignal: true, isRequired: false, transformFunction: null }, onBeforeCopyMappingToClipboard: { classPropertyName: "onBeforeCopyMappingToClipboard", publicName: "onBeforeCopyMappingToClipboard", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"responsive-grid-table-wrapper--300 responsive-grid-table-wrapper--striped inner-scroll separator-top\"\n  style=\"max-height: 300px\"\n>\n  @let keys = keys$ | async;\n  @let resolvedAssets = resolvedAssets$ | async;\n  @let allMappings = mappings$ | async;\n  @if (!keys?.length) {\n    <div class=\"p-24\">\n      <c8y-ui-empty-state\n        icon=\"code\"\n        [title]=\"emptyStateTitle | translate\"\n        [subtitle]=\"emptyStateSubtitle | translate\"\n      ></c8y-ui-empty-state>\n    </div>\n  } @else {\n    @for (key of keys; track key) {\n      @let mapping = allMappings?.[key];\n      @let property = mapping?.assetProperty;\n      @let asset = resolvedAssets?.get(property?.asset?.id);\n      <div\n        class=\"responsive-grid-table responsive-grid-table__body responsive-grid-table--condensed responsive-grid-table--separator p-l-16\"\n      >\n        @if (showLabels()) {\n          <div\n            [class]=\"'col-' + row1ColumnSpans.label\"\n            [attr.aria-label]=\"'Label' | translate\"\n          >\n            <div class=\"fit-w\">\n              <p class=\"text-label-small\">{{ 'Label' | translate }}</p>\n              @if (allowRelabellingMappings()) {\n                <c8y-input-group-editable\n                  name=\"label-{{ key }}\"\n                  size=\"sm\"\n                  [ariaLabel]=\"'Label' | translate\"\n                  [ngModel]=\"mapping?.label || key\"\n                  [validators]=\"getLabelValidators(key)\"\n                  (ngModelChange)=\"saveLabel(key, $event)\"\n                >\n                  <c8y-message\n                    name=\"label-already-used\"\n                    [text]=\"'Label already used. Use a different one.' | translate\"\n                  ></c8y-message>\n                </c8y-input-group-editable>\n              } @else {\n                <span class=\"tag tag--default text-bold\">{{ mapping?.label || key }}</span>\n              }\n            </div>\n          </div>\n        }\n        @if (showNames()) {\n          <div\n            [class]=\"'col-' + row1ColumnSpans.name\"\n            [attr.aria-label]=\"'Name' | translate\"\n          >\n            <div class=\"fit-w\">\n              <p class=\"text-label-small\">{{ 'Name' | translate }}</p>\n              @if (allowRenamingMappings()) {\n                <c8y-input-group-editable\n                  class=\"text-bold\"\n                  name=\"name-{{ key }}\"\n                  size=\"sm\"\n                  [ariaLabel]=\"'Name' | translate\"\n                  [ngModel]=\"key\"\n                  [validators]=\"getNameValidators(key)\"\n                  (ngModelChange)=\"saveName(key, $event)\"\n                >\n                  <c8y-message\n                    name=\"key-already-used\"\n                    [text]=\"'Name already used. Use a different one.' | translate\"\n                  ></c8y-message>\n                </c8y-input-group-editable>\n              } @else {\n                {{ key }}\n              }\n            </div>\n          </div>\n        }\n        <div [class]=\"'showOnHover col-' + actionsColumnSpan()\">\n          <div class=\"col-actions fit-w min-width-0\">\n            <button\n              class=\"btn-dot btn-sm m-0\"\n              [attr.aria-label]=\"'Copy mapping to clipboard' | translate\"\n              tooltip=\"{{ 'Copy mapping to clipboard' | translate }}\"\n              type=\"button\"\n              [delay]=\"500\"\n              (click)=\"copyMappingToClipboard(key, mapping!)\"\n            >\n              <i\n                class=\"icon-14\"\n                c8yIcon=\"clipboard\"\n                aria-hidden=\"true\"\n              ></i>\n            </button>\n            @if (allowEditingMappings() && !mapping?.assetProperty) {\n              <button\n                class=\"btn-dot btn-sm m-0\"\n                [attr.aria-label]=\"'Assign property' | translate\"\n                tooltip=\"{{ 'Assign property' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                [disabled]=\"isDrawerOpen()\"\n                (click)=\"editMapping(key, mapping!)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"pencil\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n            @if (allowEditingMappings() && mapping?.assetProperty) {\n              <button\n                class=\"btn-dot btn-sm m-0\"\n                [attr.aria-label]=\"'Clear mapping' | translate\"\n                tooltip=\"{{ 'Clear mapping' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                (click)=\"clearMapping(key)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"remove-property\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n            @if (allowRemovingMappings()) {\n              <button\n                class=\"btn-dot btn-sm btn-dot--danger m-0\"\n                [attr.aria-label]=\"'Remove mapping' | translate\"\n                tooltip=\"{{ 'Remove mapping' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                (click)=\"removeMapping(key)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"minus-circle\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n          </div>\n        </div>\n        @if (showAssets()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.asset\"\n            [attr.aria-label]=\"'Asset' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Asset' | translate }}</p>\n              {{ mapping?.assetProperty?.asset?.name || mapping?.assetProperty?.asset?.id || '\u2014' }}\n            </div>\n          </div>\n        }\n        @if (showProperties()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.property\"\n            [attr.aria-label]=\"'Property' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Property' | translate }}</p>\n              {{ property?.label || property?.name || '\u2014' }}\n            </div>\n          </div>\n        }\n        @if (showValues()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.value\"\n            [attr.aria-label]=\"'Value' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Value' | translate }}</p>\n              @if (property && asset) {\n                @let value = (property | c8yAssetPropertyValue: asset | async) ?? '\u2014';\n                <samp\n                  class=\"text-truncate min-width-0\"\n                  title=\"{{ value }}\"\n                >\n                  {{ value }}\n                </samp>\n              }\n            </div>\n          </div>\n        }\n      </div>\n    }\n  }\n</div>\n@if (allowAddingNewMappings() || (allowRemovingMappings() && (keys$ | async)?.length)) {\n  <div class=\"p-16 separator-top d-flex j-c-between a-i-center\">\n    @if (allowAddingNewMappings()) {\n      <button\n        class=\"btn btn-default btn-sm\"\n        type=\"button\"\n        [disabled]=\"isDrawerOpen()\"\n        (click)=\"addMappings()\"\n      >\n        <i\n          c8yIcon=\"plus-circle\"\n          aria-hidden=\"true\"\n        ></i>\n        {{ 'Add mappings' | translate }}\n      </button>\n    }\n    @if (allowRemovingMappings() && (keys$ | async)?.length) {\n      <button\n        class=\"btn btn-danger btn-sm\"\n        type=\"button\"\n        [disabled]=\"isDrawerOpen()\"\n        (click)=\"removeAllMappings()\"\n      >\n        <i\n          c8yIcon=\"minus-circle\"\n          aria-hidden=\"true\"\n        ></i>\n        {{ 'Remove all mappings' | translate }}\n      </button>\n    }\n  </div>\n}\n\n<c8y-widget-config-feedback>\n  <span\n    class=\"tag tag--info chip text-12 m-4\"\n    ngNonBindable\n    translate\n    [translateParams]=\"{\n      count: (keys$ | async)?.length ?? 0\n    }\"\n  >\n    {{ count }} selected\n  </span>\n</c8y-widget-config-feedback>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: InputGroupEditableComponent, selector: "c8y-input-group-editable", inputs: ["ariaLabel", "name", "size", "placeholder", "validators", "asyncValidators"], outputs: ["save", "cancel"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "ngmodule", type: BsDropdownModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$4.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: WidgetConfigFeedbackComponent, selector: "c8y-widget-config-feedback" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AssetPropertyValuePipe, name: "c8yAssetPropertyValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AssetPropertyMappingsComponent, isStandalone: true, selector: "c8y-asset-property-mappings", inputs: { widgetConfigPath: { classPropertyName: "widgetConfigPath", publicName: "widgetConfigPath", isSignal: true, isRequired: false, transformFunction: null }, initialMappings: { classPropertyName: "initialMappings", publicName: "initialMappings", isSignal: true, isRequired: false, transformFunction: null }, allowAddingNewMappings: { classPropertyName: "allowAddingNewMappings", publicName: "allowAddingNewMappings", isSignal: true, isRequired: false, transformFunction: null }, allowRenamingMappings: { classPropertyName: "allowRenamingMappings", publicName: "allowRenamingMappings", isSignal: true, isRequired: false, transformFunction: null }, allowRelabellingMappings: { classPropertyName: "allowRelabellingMappings", publicName: "allowRelabellingMappings", isSignal: true, isRequired: false, transformFunction: null }, mappingNameFormatRegex: { classPropertyName: "mappingNameFormatRegex", publicName: "mappingNameFormatRegex", isSignal: true, isRequired: false, transformFunction: null }, mappingNameFormatErrorMessage: { classPropertyName: "mappingNameFormatErrorMessage", publicName: "mappingNameFormatErrorMessage", isSignal: true, isRequired: false, transformFunction: null }, allowEditingMappings: { classPropertyName: "allowEditingMappings", publicName: "allowEditingMappings", isSignal: true, isRequired: false, transformFunction: null }, allowRemovingMappings: { classPropertyName: "allowRemovingMappings", publicName: "allowRemovingMappings", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null }, showNames: { classPropertyName: "showNames", publicName: "showNames", isSignal: true, isRequired: false, transformFunction: null }, showAssets: { classPropertyName: "showAssets", publicName: "showAssets", isSignal: true, isRequired: false, transformFunction: null }, showProperties: { classPropertyName: "showProperties", publicName: "showProperties", isSignal: true, isRequired: false, transformFunction: null }, showValues: { classPropertyName: "showValues", publicName: "showValues", isSignal: true, isRequired: false, transformFunction: null }, actionsColumnSpan: { classPropertyName: "actionsColumnSpan", publicName: "actionsColumnSpan", isSignal: true, isRequired: false, transformFunction: null }, onBeforeCopyMappingToClipboard: { classPropertyName: "onBeforeCopyMappingToClipboard", publicName: "onBeforeCopyMappingToClipboard", isSignal: true, isRequired: false, transformFunction: null }, emptyStateTitle: { classPropertyName: "emptyStateTitle", publicName: "emptyStateTitle", isSignal: true, isRequired: false, transformFunction: null }, emptyStateSubtitle: { classPropertyName: "emptyStateSubtitle", publicName: "emptyStateSubtitle", isSignal: true, isRequired: false, transformFunction: null }, feedbackMessage: { classPropertyName: "feedbackMessage", publicName: "feedbackMessage", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"responsive-grid-table-wrapper--300 responsive-grid-table-wrapper--striped inner-scroll separator-top\"\n  style=\"max-height: 300px\"\n>\n  @let keys = keys$ | async;\n  @let resolvedAssets = resolvedAssets$ | async;\n  @let allMappings = mappings$ | async;\n  @if (!keys?.length) {\n    <div class=\"p-24\">\n      <c8y-ui-empty-state\n        icon=\"code\"\n        [title]=\"emptyStateTitle() | translate\"\n        [subtitle]=\"emptyStateSubtitle() | translate\"\n      ></c8y-ui-empty-state>\n    </div>\n  } @else {\n    @for (key of keys; track key) {\n      @let mapping = allMappings?.[key];\n      @let property = mapping?.assetProperty;\n      @let asset = resolvedAssets?.get(property?.asset?.id);\n      <div\n        class=\"responsive-grid-table responsive-grid-table__body responsive-grid-table--condensed responsive-grid-table--separator p-l-16\"\n      >\n        @if (showLabels()) {\n          <div\n            [class]=\"'col-' + row1ColumnSpans.label\"\n            [attr.aria-label]=\"'Label' | translate\"\n          >\n            <div class=\"fit-w\">\n              <p class=\"text-label-small\">{{ 'Label' | translate }}</p>\n              @if (allowRelabellingMappings()) {\n                <c8y-input-group-editable\n                  name=\"label-{{ key }}\"\n                  size=\"sm\"\n                  [ariaLabel]=\"'Label' | translate\"\n                  [ngModel]=\"mapping?.label || key\"\n                  [validators]=\"getLabelValidators(key)\"\n                  (ngModelChange)=\"saveLabel(key, $event)\"\n                >\n                  <c8y-message\n                    name=\"label-already-used\"\n                    [text]=\"'Label already used. Use a different one.' | translate\"\n                  ></c8y-message>\n                </c8y-input-group-editable>\n              } @else {\n                <span class=\"tag tag--default text-bold\">{{ mapping?.label || key }}</span>\n              }\n            </div>\n          </div>\n        }\n        @if (showNames()) {\n          <div\n            [class]=\"'col-' + row1ColumnSpans.name\"\n            [attr.aria-label]=\"'Name' | translate\"\n          >\n            <div class=\"fit-w\">\n              <p class=\"text-label-small\">{{ 'Name' | translate }}</p>\n              @if (allowRenamingMappings()) {\n                <c8y-input-group-editable\n                  class=\"text-bold\"\n                  name=\"name-{{ key }}\"\n                  size=\"sm\"\n                  [ariaLabel]=\"'Name' | translate\"\n                  [ngModel]=\"key\"\n                  [validators]=\"getNameValidators(key)\"\n                  (ngModelChange)=\"saveName(key, $event)\"\n                >\n                  <c8y-message\n                    name=\"key-already-used\"\n                    [text]=\"'Name already used. Use a different one.' | translate\"\n                  ></c8y-message>\n                  <c8y-message\n                    name=\"key-invalid-format\"\n                    [text]=\"mappingNameFormatErrorMessage() | translate\"\n                  ></c8y-message>\n                </c8y-input-group-editable>\n              } @else {\n                {{ key }}\n              }\n            </div>\n          </div>\n        }\n        <div [class]=\"'showOnHover col-' + actionsColumnSpan()\">\n          <div class=\"col-actions fit-w min-width-0\">\n            <button\n              class=\"btn-dot btn-sm m-0\"\n              [attr.aria-label]=\"'Copy mapping to clipboard' | translate\"\n              tooltip=\"{{ 'Copy mapping to clipboard' | translate }}\"\n              type=\"button\"\n              [delay]=\"500\"\n              (click)=\"copyMappingToClipboard(key, mapping!)\"\n            >\n              <i\n                class=\"icon-14\"\n                c8yIcon=\"clipboard\"\n                aria-hidden=\"true\"\n              ></i>\n            </button>\n            @if (allowEditingMappings() && !mapping?.assetProperty) {\n              <button\n                class=\"btn-dot btn-sm m-0\"\n                [attr.aria-label]=\"'Assign property' | translate\"\n                tooltip=\"{{ 'Assign property' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                [disabled]=\"isDrawerOpen()\"\n                (click)=\"editMapping(key, mapping!)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"pencil\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n            @if (allowEditingMappings() && mapping?.assetProperty) {\n              <button\n                class=\"btn-dot btn-sm m-0\"\n                [attr.aria-label]=\"'Clear mapping' | translate\"\n                tooltip=\"{{ 'Clear mapping' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                (click)=\"clearMapping(key)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"remove-property\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n            @if (allowRemovingMappings()) {\n              <button\n                class=\"btn-dot btn-sm btn-dot--danger m-0\"\n                [attr.aria-label]=\"'Remove mapping' | translate\"\n                tooltip=\"{{ 'Remove mapping' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                (click)=\"removeMapping(key)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"minus-circle\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n          </div>\n        </div>\n        @if (showAssets()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.asset\"\n            [attr.aria-label]=\"'Asset' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Asset' | translate }}</p>\n              {{ mapping?.assetProperty?.asset?.name || mapping?.assetProperty?.asset?.id || '\u2014' }}\n            </div>\n          </div>\n        }\n        @if (showProperties()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.property\"\n            [attr.aria-label]=\"'Property' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Property' | translate }}</p>\n              {{ property?.label || property?.name || '\u2014' }}\n            </div>\n          </div>\n        }\n        @if (showValues()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.value\"\n            [attr.aria-label]=\"'Value' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Value' | translate }}</p>\n              @if (property && asset) {\n                @let value = (property | c8yAssetPropertyValue: asset | async) ?? '\u2014';\n                <samp\n                  class=\"text-truncate min-width-0\"\n                  title=\"{{ value }}\"\n                >\n                  {{ value }}\n                </samp>\n              }\n            </div>\n          </div>\n        }\n      </div>\n    }\n  }\n</div>\n@if (allowAddingNewMappings() || (allowRemovingMappings() && (keys$ | async)?.length)) {\n  <div class=\"p-16 separator-top d-flex j-c-between a-i-center\">\n    @if (allowAddingNewMappings()) {\n      <button\n        class=\"btn btn-default btn-sm\"\n        type=\"button\"\n        [disabled]=\"isDrawerOpen()\"\n        (click)=\"addMappings()\"\n      >\n        <i\n          c8yIcon=\"plus-circle\"\n          aria-hidden=\"true\"\n        ></i>\n        {{ 'Add mappings' | translate }}\n      </button>\n    }\n    @if (allowRemovingMappings() && (keys$ | async)?.length) {\n      <button\n        class=\"btn btn-danger btn-sm\"\n        type=\"button\"\n        [disabled]=\"isDrawerOpen()\"\n        (click)=\"removeAllMappings()\"\n      >\n        <i\n          c8yIcon=\"minus-circle\"\n          aria-hidden=\"true\"\n        ></i>\n        {{ 'Remove all mappings' | translate }}\n      </button>\n    }\n  </div>\n}\n\n<c8y-widget-config-feedback>\n  <span class=\"tag tag--info chip text-12 m-4\">\n    {{ feedbackMessage() | translate: { count: keys?.length ?? 0 } }}\n  </span>\n</c8y-widget-config-feedback>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: InputGroupEditableComponent, selector: "c8y-input-group-editable", inputs: ["ariaLabel", "name", "size", "placeholder", "validators", "asyncValidators", "autocomplete"], outputs: ["save", "cancel"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "ngmodule", type: BsDropdownModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$4.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: WidgetConfigFeedbackComponent, selector: "c8y-widget-config-feedback" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AssetPropertyValuePipe, name: "c8yAssetPropertyValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AssetPropertyMappingsComponent, decorators: [{
             type: Component,
@@ -4965,7 +4984,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         FormsModule,
                         IconDirective,
                         C8yTranslatePipe,
-                        C8yTranslateDirective,
                         InputGroupEditableComponent,
                         MessageDirective,
                         EmptyStateComponent,
@@ -4973,12 +4991,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         BsDropdownModule,
                         TooltipModule,
                         WidgetConfigFeedbackComponent
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"responsive-grid-table-wrapper--300 responsive-grid-table-wrapper--striped inner-scroll separator-top\"\n  style=\"max-height: 300px\"\n>\n  @let keys = keys$ | async;\n  @let resolvedAssets = resolvedAssets$ | async;\n  @let allMappings = mappings$ | async;\n  @if (!keys?.length) {\n    <div class=\"p-24\">\n      <c8y-ui-empty-state\n        icon=\"code\"\n        [title]=\"emptyStateTitle | translate\"\n        [subtitle]=\"emptyStateSubtitle | translate\"\n      ></c8y-ui-empty-state>\n    </div>\n  } @else {\n    @for (key of keys; track key) {\n      @let mapping = allMappings?.[key];\n      @let property = mapping?.assetProperty;\n      @let asset = resolvedAssets?.get(property?.asset?.id);\n      <div\n        class=\"responsive-grid-table responsive-grid-table__body responsive-grid-table--condensed responsive-grid-table--separator p-l-16\"\n      >\n        @if (showLabels()) {\n          <div\n            [class]=\"'col-' + row1ColumnSpans.label\"\n            [attr.aria-label]=\"'Label' | translate\"\n          >\n            <div class=\"fit-w\">\n              <p class=\"text-label-small\">{{ 'Label' | translate }}</p>\n              @if (allowRelabellingMappings()) {\n                <c8y-input-group-editable\n                  name=\"label-{{ key }}\"\n                  size=\"sm\"\n                  [ariaLabel]=\"'Label' | translate\"\n                  [ngModel]=\"mapping?.label || key\"\n                  [validators]=\"getLabelValidators(key)\"\n                  (ngModelChange)=\"saveLabel(key, $event)\"\n                >\n                  <c8y-message\n                    name=\"label-already-used\"\n                    [text]=\"'Label already used. Use a different one.' | translate\"\n                  ></c8y-message>\n                </c8y-input-group-editable>\n              } @else {\n                <span class=\"tag tag--default text-bold\">{{ mapping?.label || key }}</span>\n              }\n            </div>\n          </div>\n        }\n        @if (showNames()) {\n          <div\n            [class]=\"'col-' + row1ColumnSpans.name\"\n            [attr.aria-label]=\"'Name' | translate\"\n          >\n            <div class=\"fit-w\">\n              <p class=\"text-label-small\">{{ 'Name' | translate }}</p>\n              @if (allowRenamingMappings()) {\n                <c8y-input-group-editable\n                  class=\"text-bold\"\n                  name=\"name-{{ key }}\"\n                  size=\"sm\"\n                  [ariaLabel]=\"'Name' | translate\"\n                  [ngModel]=\"key\"\n                  [validators]=\"getNameValidators(key)\"\n                  (ngModelChange)=\"saveName(key, $event)\"\n                >\n                  <c8y-message\n                    name=\"key-already-used\"\n                    [text]=\"'Name already used. Use a different one.' | translate\"\n                  ></c8y-message>\n                </c8y-input-group-editable>\n              } @else {\n                {{ key }}\n              }\n            </div>\n          </div>\n        }\n        <div [class]=\"'showOnHover col-' + actionsColumnSpan()\">\n          <div class=\"col-actions fit-w min-width-0\">\n            <button\n              class=\"btn-dot btn-sm m-0\"\n              [attr.aria-label]=\"'Copy mapping to clipboard' | translate\"\n              tooltip=\"{{ 'Copy mapping to clipboard' | translate }}\"\n              type=\"button\"\n              [delay]=\"500\"\n              (click)=\"copyMappingToClipboard(key, mapping!)\"\n            >\n              <i\n                class=\"icon-14\"\n                c8yIcon=\"clipboard\"\n                aria-hidden=\"true\"\n              ></i>\n            </button>\n            @if (allowEditingMappings() && !mapping?.assetProperty) {\n              <button\n                class=\"btn-dot btn-sm m-0\"\n                [attr.aria-label]=\"'Assign property' | translate\"\n                tooltip=\"{{ 'Assign property' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                [disabled]=\"isDrawerOpen()\"\n                (click)=\"editMapping(key, mapping!)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"pencil\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n            @if (allowEditingMappings() && mapping?.assetProperty) {\n              <button\n                class=\"btn-dot btn-sm m-0\"\n                [attr.aria-label]=\"'Clear mapping' | translate\"\n                tooltip=\"{{ 'Clear mapping' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                (click)=\"clearMapping(key)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"remove-property\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n            @if (allowRemovingMappings()) {\n              <button\n                class=\"btn-dot btn-sm btn-dot--danger m-0\"\n                [attr.aria-label]=\"'Remove mapping' | translate\"\n                tooltip=\"{{ 'Remove mapping' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                (click)=\"removeMapping(key)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"minus-circle\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n          </div>\n        </div>\n        @if (showAssets()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.asset\"\n            [attr.aria-label]=\"'Asset' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Asset' | translate }}</p>\n              {{ mapping?.assetProperty?.asset?.name || mapping?.assetProperty?.asset?.id || '\u2014' }}\n            </div>\n          </div>\n        }\n        @if (showProperties()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.property\"\n            [attr.aria-label]=\"'Property' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Property' | translate }}</p>\n              {{ property?.label || property?.name || '\u2014' }}\n            </div>\n          </div>\n        }\n        @if (showValues()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.value\"\n            [attr.aria-label]=\"'Value' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Value' | translate }}</p>\n              @if (property && asset) {\n                @let value = (property | c8yAssetPropertyValue: asset | async) ?? '\u2014';\n                <samp\n                  class=\"text-truncate min-width-0\"\n                  title=\"{{ value }}\"\n                >\n                  {{ value }}\n                </samp>\n              }\n            </div>\n          </div>\n        }\n      </div>\n    }\n  }\n</div>\n@if (allowAddingNewMappings() || (allowRemovingMappings() && (keys$ | async)?.length)) {\n  <div class=\"p-16 separator-top d-flex j-c-between a-i-center\">\n    @if (allowAddingNewMappings()) {\n      <button\n        class=\"btn btn-default btn-sm\"\n        type=\"button\"\n        [disabled]=\"isDrawerOpen()\"\n        (click)=\"addMappings()\"\n      >\n        <i\n          c8yIcon=\"plus-circle\"\n          aria-hidden=\"true\"\n        ></i>\n        {{ 'Add mappings' | translate }}\n      </button>\n    }\n    @if (allowRemovingMappings() && (keys$ | async)?.length) {\n      <button\n        class=\"btn btn-danger btn-sm\"\n        type=\"button\"\n        [disabled]=\"isDrawerOpen()\"\n        (click)=\"removeAllMappings()\"\n      >\n        <i\n          c8yIcon=\"minus-circle\"\n          aria-hidden=\"true\"\n        ></i>\n        {{ 'Remove all mappings' | translate }}\n      </button>\n    }\n  </div>\n}\n\n<c8y-widget-config-feedback>\n  <span\n    class=\"tag tag--info chip text-12 m-4\"\n    ngNonBindable\n    translate\n    [translateParams]=\"{\n      count: (keys$ | async)?.length ?? 0\n    }\"\n  >\n    {{ count }} selected\n  </span>\n</c8y-widget-config-feedback>\n" }]
-        }], propDecorators: { widgetConfigPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "widgetConfigPath", required: false }] }], initialMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialMappings", required: false }] }], allowAddingNewMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowAddingNewMappings", required: false }] }], allowRenamingMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowRenamingMappings", required: false }] }], allowRelabellingMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowRelabellingMappings", required: false }] }], allowEditingMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowEditingMappings", required: false }] }], allowRemovingMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowRemovingMappings", required: false }] }], showLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabels", required: false }] }], showNames: [{ type: i0.Input, args: [{ isSignal: true, alias: "showNames", required: false }] }], showAssets: [{ type: i0.Input, args: [{ isSignal: true, alias: "showAssets", required: false }] }], showProperties: [{ type: i0.Input, args: [{ isSignal: true, alias: "showProperties", required: false }] }], showValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "showValues", required: false }] }], actionsColumnSpan: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionsColumnSpan", required: false }] }], onBeforeCopyMappingToClipboard: [{ type: i0.Input, args: [{ isSignal: true, alias: "onBeforeCopyMappingToClipboard", required: false }] }] } });
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"responsive-grid-table-wrapper--300 responsive-grid-table-wrapper--striped inner-scroll separator-top\"\n  style=\"max-height: 300px\"\n>\n  @let keys = keys$ | async;\n  @let resolvedAssets = resolvedAssets$ | async;\n  @let allMappings = mappings$ | async;\n  @if (!keys?.length) {\n    <div class=\"p-24\">\n      <c8y-ui-empty-state\n        icon=\"code\"\n        [title]=\"emptyStateTitle() | translate\"\n        [subtitle]=\"emptyStateSubtitle() | translate\"\n      ></c8y-ui-empty-state>\n    </div>\n  } @else {\n    @for (key of keys; track key) {\n      @let mapping = allMappings?.[key];\n      @let property = mapping?.assetProperty;\n      @let asset = resolvedAssets?.get(property?.asset?.id);\n      <div\n        class=\"responsive-grid-table responsive-grid-table__body responsive-grid-table--condensed responsive-grid-table--separator p-l-16\"\n      >\n        @if (showLabels()) {\n          <div\n            [class]=\"'col-' + row1ColumnSpans.label\"\n            [attr.aria-label]=\"'Label' | translate\"\n          >\n            <div class=\"fit-w\">\n              <p class=\"text-label-small\">{{ 'Label' | translate }}</p>\n              @if (allowRelabellingMappings()) {\n                <c8y-input-group-editable\n                  name=\"label-{{ key }}\"\n                  size=\"sm\"\n                  [ariaLabel]=\"'Label' | translate\"\n                  [ngModel]=\"mapping?.label || key\"\n                  [validators]=\"getLabelValidators(key)\"\n                  (ngModelChange)=\"saveLabel(key, $event)\"\n                >\n                  <c8y-message\n                    name=\"label-already-used\"\n                    [text]=\"'Label already used. Use a different one.' | translate\"\n                  ></c8y-message>\n                </c8y-input-group-editable>\n              } @else {\n                <span class=\"tag tag--default text-bold\">{{ mapping?.label || key }}</span>\n              }\n            </div>\n          </div>\n        }\n        @if (showNames()) {\n          <div\n            [class]=\"'col-' + row1ColumnSpans.name\"\n            [attr.aria-label]=\"'Name' | translate\"\n          >\n            <div class=\"fit-w\">\n              <p class=\"text-label-small\">{{ 'Name' | translate }}</p>\n              @if (allowRenamingMappings()) {\n                <c8y-input-group-editable\n                  class=\"text-bold\"\n                  name=\"name-{{ key }}\"\n                  size=\"sm\"\n                  [ariaLabel]=\"'Name' | translate\"\n                  [ngModel]=\"key\"\n                  [validators]=\"getNameValidators(key)\"\n                  (ngModelChange)=\"saveName(key, $event)\"\n                >\n                  <c8y-message\n                    name=\"key-already-used\"\n                    [text]=\"'Name already used. Use a different one.' | translate\"\n                  ></c8y-message>\n                  <c8y-message\n                    name=\"key-invalid-format\"\n                    [text]=\"mappingNameFormatErrorMessage() | translate\"\n                  ></c8y-message>\n                </c8y-input-group-editable>\n              } @else {\n                {{ key }}\n              }\n            </div>\n          </div>\n        }\n        <div [class]=\"'showOnHover col-' + actionsColumnSpan()\">\n          <div class=\"col-actions fit-w min-width-0\">\n            <button\n              class=\"btn-dot btn-sm m-0\"\n              [attr.aria-label]=\"'Copy mapping to clipboard' | translate\"\n              tooltip=\"{{ 'Copy mapping to clipboard' | translate }}\"\n              type=\"button\"\n              [delay]=\"500\"\n              (click)=\"copyMappingToClipboard(key, mapping!)\"\n            >\n              <i\n                class=\"icon-14\"\n                c8yIcon=\"clipboard\"\n                aria-hidden=\"true\"\n              ></i>\n            </button>\n            @if (allowEditingMappings() && !mapping?.assetProperty) {\n              <button\n                class=\"btn-dot btn-sm m-0\"\n                [attr.aria-label]=\"'Assign property' | translate\"\n                tooltip=\"{{ 'Assign property' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                [disabled]=\"isDrawerOpen()\"\n                (click)=\"editMapping(key, mapping!)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"pencil\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n            @if (allowEditingMappings() && mapping?.assetProperty) {\n              <button\n                class=\"btn-dot btn-sm m-0\"\n                [attr.aria-label]=\"'Clear mapping' | translate\"\n                tooltip=\"{{ 'Clear mapping' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                (click)=\"clearMapping(key)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"remove-property\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n            @if (allowRemovingMappings()) {\n              <button\n                class=\"btn-dot btn-sm btn-dot--danger m-0\"\n                [attr.aria-label]=\"'Remove mapping' | translate\"\n                tooltip=\"{{ 'Remove mapping' | translate }}\"\n                type=\"button\"\n                [delay]=\"500\"\n                (click)=\"removeMapping(key)\"\n              >\n                <i\n                  class=\"icon-14\"\n                  c8yIcon=\"minus-circle\"\n                  aria-hidden=\"true\"\n                ></i>\n              </button>\n            }\n          </div>\n        </div>\n        @if (showAssets()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.asset\"\n            [attr.aria-label]=\"'Asset' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Asset' | translate }}</p>\n              {{ mapping?.assetProperty?.asset?.name || mapping?.assetProperty?.asset?.id || '\u2014' }}\n            </div>\n          </div>\n        }\n        @if (showProperties()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.property\"\n            [attr.aria-label]=\"'Property' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Property' | translate }}</p>\n              {{ property?.label || property?.name || '\u2014' }}\n            </div>\n          </div>\n        }\n        @if (showValues()) {\n          <div\n            [class]=\"'p-b-16 col-' + row2ColumnSpans.value\"\n            [attr.aria-label]=\"'Value' | translate\"\n          >\n            <div class=\"min-width-0\">\n              <p class=\"text-label-small\">{{ 'Value' | translate }}</p>\n              @if (property && asset) {\n                @let value = (property | c8yAssetPropertyValue: asset | async) ?? '\u2014';\n                <samp\n                  class=\"text-truncate min-width-0\"\n                  title=\"{{ value }}\"\n                >\n                  {{ value }}\n                </samp>\n              }\n            </div>\n          </div>\n        }\n      </div>\n    }\n  }\n</div>\n@if (allowAddingNewMappings() || (allowRemovingMappings() && (keys$ | async)?.length)) {\n  <div class=\"p-16 separator-top d-flex j-c-between a-i-center\">\n    @if (allowAddingNewMappings()) {\n      <button\n        class=\"btn btn-default btn-sm\"\n        type=\"button\"\n        [disabled]=\"isDrawerOpen()\"\n        (click)=\"addMappings()\"\n      >\n        <i\n          c8yIcon=\"plus-circle\"\n          aria-hidden=\"true\"\n        ></i>\n        {{ 'Add mappings' | translate }}\n      </button>\n    }\n    @if (allowRemovingMappings() && (keys$ | async)?.length) {\n      <button\n        class=\"btn btn-danger btn-sm\"\n        type=\"button\"\n        [disabled]=\"isDrawerOpen()\"\n        (click)=\"removeAllMappings()\"\n      >\n        <i\n          c8yIcon=\"minus-circle\"\n          aria-hidden=\"true\"\n        ></i>\n        {{ 'Remove all mappings' | translate }}\n      </button>\n    }\n  </div>\n}\n\n<c8y-widget-config-feedback>\n  <span class=\"tag tag--info chip text-12 m-4\">\n    {{ feedbackMessage() | translate: { count: keys?.length ?? 0 } }}\n  </span>\n</c8y-widget-config-feedback>\n" }]
+        }], propDecorators: { widgetConfigPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "widgetConfigPath", required: false }] }], initialMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialMappings", required: false }] }], allowAddingNewMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowAddingNewMappings", required: false }] }], allowRenamingMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowRenamingMappings", required: false }] }], allowRelabellingMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowRelabellingMappings", required: false }] }], mappingNameFormatRegex: [{ type: i0.Input, args: [{ isSignal: true, alias: "mappingNameFormatRegex", required: false }] }], mappingNameFormatErrorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "mappingNameFormatErrorMessage", required: false }] }], allowEditingMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowEditingMappings", required: false }] }], allowRemovingMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowRemovingMappings", required: false }] }], showLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabels", required: false }] }], showNames: [{ type: i0.Input, args: [{ isSignal: true, alias: "showNames", required: false }] }], showAssets: [{ type: i0.Input, args: [{ isSignal: true, alias: "showAssets", required: false }] }], showProperties: [{ type: i0.Input, args: [{ isSignal: true, alias: "showProperties", required: false }] }], showValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "showValues", required: false }] }], actionsColumnSpan: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionsColumnSpan", required: false }] }], onBeforeCopyMappingToClipboard: [{ type: i0.Input, args: [{ isSignal: true, alias: "onBeforeCopyMappingToClipboard", required: false }] }], emptyStateTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyStateTitle", required: false }] }], emptyStateSubtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyStateSubtitle", required: false }] }], feedbackMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "feedbackMessage", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ALL_GLOBAL_ROLES_SELECTED, AddDashboardComponent, AddDashboardFactory, AppearanceSettingsComponent, AssetPropertyMappingsComponent, AssetPropertyMappingsService, CONTEXT_DASHBOARD_CONFIG, ContextDashboardComponent, ContextDashboardModule, ContextDashboardService, ContextDashboardType, DASHBOARD_CHILDREN_STATE_NAME, DASHBOARD_DETAILS_OUTLET, DASHBOARD_DETAILS_TABS_OUTLET_NAME, DASHBOARD_SETTINGS_CHANGES, DASHBOARD_THEME_CLASSES, DashboardActionBarFactory, DashboardDetailComponent, DashboardDetailService, DashboardDetailsTabId, DeviceInfoDashboardComponent, DeviceInfoDashboardModule, DeviceManagementHomeDashboardComponent, DeviceManagementHomeDashboardModule, GlobalContextSectionComponent, HOOK_WIDGET_CONFIG, NewDashboardGuard, PRODUCT_EXPERIENCE, PasteDashboardActionComponent, REPORT_DEFAULT_NAVIGATION_NODE_PRIORITY, STYLING_CLASS_PREFIXES, TypeDashboardInfoComponent, WIDGET_CONTENT_CLASSES, WIDGET_HEADER_CLASSES, WidgetAssetSelectorComponent, WidgetConfigAppearanceComponent, WidgetConfigComponent, WidgetConfigFeedbackComponent, WidgetConfigGeneralComponent, WidgetConfigSectionComponent, WidgetConfigSectionService, WidgetConfigService, WidgetPreviewComponent, WidgetPreviewWrapperComponent, WidgetService, getPropertyBaseKey, hookWidgetConfig, newDashboardTab, quoteAndEscape, renamePropertyKeyInCode };
+export { ALL_GLOBAL_ROLES_SELECTED, AddDashboardComponent, AddDashboardFactory, AppearanceSettingsComponent, AssetPropertyMappingsComponent, AssetPropertyMappingsService, CONTEXT_DASHBOARD_CONFIG, ContextDashboardComponent, ContextDashboardModule, ContextDashboardService, ContextDashboardType, DASHBOARD_CHILDREN_STATE_NAME, DASHBOARD_DETAILS_OUTLET, DASHBOARD_DETAILS_TABS_OUTLET_NAME, DASHBOARD_SETTINGS_CHANGES, DASHBOARD_THEME_CLASSES, DashboardActionBarFactory, DashboardDetailComponent, DashboardDetailService, DashboardDetailsTabId, DeviceInfoDashboardComponent, DeviceInfoDashboardModule, DeviceManagementHomeDashboardComponent, DeviceManagementHomeDashboardModule, GlobalContextSectionComponent, HOOK_WIDGET_CONFIG, NewDashboardGuard, PRODUCT_EXPERIENCE, PasteDashboardActionComponent, REPORT_DEFAULT_NAVIGATION_NODE_PRIORITY, STYLING_CLASS_PREFIXES, TypeDashboardInfoComponent, WIDGET_CONTENT_CLASSES, WIDGET_HEADER_CLASSES, WidgetAssetSelectorComponent, WidgetConfigAppearanceComponent, WidgetConfigComponent, WidgetConfigFeedbackComponent, WidgetConfigGeneralComponent, WidgetConfigSectionComponent, WidgetConfigSectionService, WidgetConfigService, WidgetPreviewComponent, WidgetPreviewWrapperComponent, WidgetService, escapeForRegExp, getPropertyBaseKey, hookWidgetConfig, newDashboardTab, quoteAndEscape, renamePropertyKeyInCode };
 //# sourceMappingURL=c8y-ngx-components-context-dashboard.mjs.map