npm - @c8y/ngx-components - Versions diffs - 1022.44.3 → 1022.45.2 - Mend

@c8y/ngx-components 1022.44.3 → 1022.45.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (76) hide show

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

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { Injectable, Component, inject, InjectionToken, EventEmitter, Output, Input, TemplateRef, ViewChild, Optional, Inject, HostListener, HostBinding, NgModule } from '@angular/core';
 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, DynamicComponentModule, DynamicComponentComponent, sortByPriority, isPromise, CoreModule, WIDGET_CONFIGURATION_GRID_SIZE, C8yTranslateDirective, HighlightComponent, EmptyStateComponent, FormGroupComponent, RequiredInputPlaceholderDirective, ProductExperienceDirective, ResizableGridComponent, DashboardChildChange, CopyDashboardDisabledReason, TitleComponent, ActionBarItemComponent, HelpComponent, WidgetsDashboardComponent, DatePipe, hookRoute, hookTab, hookNavigator } 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, hookNavigator } 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, timer, BehaviorSubject, tap as tap$1, withLatestFrom, mergeMap as mergeMap$1, shareReplay as shareReplay$1, merge, scan, debounceTime, isObservable, iif } from 'rxjs';
@@ -295,7 +295,7 @@ class ContextDashboardService {
         this._formDisabled = value;
         this.formDisabledSubject.next(value);
     }
-    constructor(inventory, tabs, modal, translateService, router, navigator, permissions, alert, dynamicComponent, groupService, optionsService) {
+    constructor(inventory, tabs, modal, translateService, router, navigator, permissions, alert, dynamicComponent, groupService, optionsService, appStateService) {
         this.inventory = inventory;
         this.tabs = tabs;
         this.modal = modal;
@@ -307,6 +307,7 @@ class ContextDashboardService {
         this.dynamicComponent = dynamicComponent;
         this.groupService = groupService;
         this.optionsService = optionsService;
+        this.appStateService = appStateService;
         this.REPORT_PARTIAL_NAME = 'report_';
         this.VERSION_HISTORY_SIZE_LIMIT = 10;
         this.INVENTORY_ROLES = [
@@ -316,11 +317,13 @@ class ContextDashboardService {
         this.cache = new Map();
         this.DEFAULT_PAGESIZE = 1000;
         this.FRAGMENT_NAME = 'c8y_Dashboard';
+        this.APPLIED_TO_FRAGMENT = 'c8y_AppliedToApplications';
         this.DASHBOARD_ROUTE_PATH = 'dashboard';
         this.INDEX_SPLIT = '!';
         this.CACHE_TIMEOUT = 500;
         this._formDisabled = true;
         this.formDisabledSubject = new Subject();
+        this.appName = '';
         this.HIDE_TYPE_DASHBOARD_FOR_ASSETS = 'hideTypeDashboardForAssets';
         this.formDisabled$ = this.formDisabledSubject.asObservable();
         this.queriesUtil = new QueriesUtil();
@@ -334,6 +337,9 @@ class ContextDashboardService {
             assign(dashboard, { c8y_Global: {} });
         }
         dashboard.name = dashboard.c8y_Dashboard.name;
+        if (this.appStateService?.currentApplication?.value) {
+            dashboard[this.APPLIED_TO_FRAGMENT] = [this.appStateService?.currentApplication?.value.key];
+        }
         const { data } = dashboardType === ContextDashboardType.Group ||
             dashboardType === ContextDashboardType.Device ||
             (context?.contextData?.id && dashboardType === ContextDashboardType.Named)
@@ -351,7 +357,7 @@ class ContextDashboardService {
         const dashboardCfg = dashboard.c8y_Dashboard;
         dashboard.name = dashboard.c8y_Dashboard.name;
         assign(dashboard, this.adjustDashboardFor24Columns({ c8y_Dashboard: dashboardCfg }), this.updateDashboardHistory(dashboard, dashboardCfg));
-        const keepFragments = this.clean(pick(dashboard, [this.FRAGMENT_NAME, 'id', 'name']));
+        const keepFragments = this.clean(pick(dashboard, [this.FRAGMENT_NAME, 'id', 'name', this.APPLIED_TO_FRAGMENT]));
         keepFragments.c8y_DashboardHistory = dashboard.c8y_DashboardHistory;
         await this.serializeWidgetConfigs(keepFragments);
         const [, dashboardTypeFragments] = this.getDashboardFragments(dashboard, context, '', true);
@@ -694,7 +700,11 @@ class ContextDashboardService {
         const finalFilterCriteria = typeFilterCriteria
             ? [...filterCriteria, typeFilterCriteria]
             : filterCriteria;
-        const query = this.queriesUtil.buildQuery({ __filter: { __or: finalFilterCriteria } });
+        const query = this.queriesUtil.buildQuery({
+            __filter: {
+                __and: [{ __or: finalFilterCriteria }, this.appliedToFilter()]
+            }
+        });
         const now = Date.now();
         const cacheHasValidResponse = this.contextDashboardsCache &&
             this.contextDashboardsCache.query === query &&
@@ -712,6 +722,18 @@ class ContextDashboardService {
         };
         return this.contextDashboardsCache.result;
     }
+    appliedToFilter() {
+        const key = this.appStateService?.currentApplication?.value?.key || '';
+        if (!key) {
+            return {};
+        }
+        return {
+            __or: [
+                { __not: { __has: this.APPLIED_TO_FRAGMENT } }, // legacy / unlabeled ⇒ show in all
+                { [this.APPLIED_TO_FRAGMENT]: { __in: [key] } }
+            ]
+        };
+    }
     /**
      * Creates a tuple describing the dashboard type and its fragments. For assets like devices and groups, it's possible
      * to have two fragments: one indicating this particular device/asset with its ID, and the second indicating
@@ -991,13 +1013,13 @@ class ContextDashboardService {
             [`c8y_Dashboard!name!${dashboardCfg.name}`]: {}
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ContextDashboardService, deps: [{ token: i1$1.InventoryService }, { token: i2.TabsService }, { token: i2.ModalService }, { token: i2$1.TranslateService }, { token: i1.Router }, { token: i2.NavigatorService }, { token: i2.Permissions }, { token: i2.AlertService }, { token: i2.DynamicComponentService }, { token: i2.GroupService }, { token: i2.OptionsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ContextDashboardService, deps: [{ token: i1$1.InventoryService }, { token: i2.TabsService }, { token: i2.ModalService }, { token: i2$1.TranslateService }, { token: i1.Router }, { token: i2.NavigatorService }, { token: i2.Permissions }, { token: i2.AlertService }, { token: i2.DynamicComponentService }, { token: i2.GroupService }, { token: i2.OptionsService }, { token: i2.AppStateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ContextDashboardService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ContextDashboardService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1$1.InventoryService }, { type: i2.TabsService }, { type: i2.ModalService }, { type: i2$1.TranslateService }, { type: i1.Router }, { type: i2.NavigatorService }, { type: i2.Permissions }, { type: i2.AlertService }, { type: i2.DynamicComponentService }, { type: i2.GroupService }, { type: i2.OptionsService }] });
+        }], ctorParameters: () => [{ type: i1$1.InventoryService }, { type: i2.TabsService }, { type: i2.ModalService }, { type: i2$1.TranslateService }, { type: i1.Router }, { type: i2.NavigatorService }, { type: i2.Permissions }, { type: i2.AlertService }, { type: i2.DynamicComponentService }, { type: i2.GroupService }, { type: i2.OptionsService }, { type: i2.AppStateService }] });
 const DEFAULT_DUPLICATE_WITHOUT_TYPE = () => {
     throw new Error('duplicateWithoutTypeFn Not implemented');
@@ -1856,6 +1878,11 @@ class WidgetAssetSelectorComponent {
          * If set to true, a device must be selected. Default is true.
          */
         this.isRequired = true;
+        /**
+         * Template for displaying device names with their IDs.
+         * @ignore
+         */
+        this.deviceWithIdTpl = gettext('Device {{ id }}');
     }
     /**
      * @ignore
@@ -1878,7 +1905,7 @@ class WidgetAssetSelectorComponent {
         else if (this.isRequired && !this.hasContext(this.widgetConfigService.currentConfig)) {
             this.sectionComponent.section.expanded = true;
         }
-        else if (this.hasContext(this.widgetConfigService.currentConfig)) {
+        else if (this.hasContext(this.widgetConfigService.currentConfig) && this.isRequired) {
             this.selectedDevice = this.widgetConfigService.currentConfig.settings?.context;
         }
         this.assetSelectorConfig = {
@@ -1914,11 +1941,15 @@ class WidgetAssetSelectorComponent {
             this.updateConfig($event.change.item);
         }
     }
+    selectCurrentContext() {
+        this.selectedDevice = this.widgetConfigService.currentConfig.settings?.context;
+        this.updateConfig(this.selectedDevice);
+    }
     updateConfig(device) {
         this.widgetConfigService.updateConfig({ device });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: WidgetAssetSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: WidgetAssetSelectorComponent, isStandalone: true, selector: "c8y-widget-asset-selector", inputs: { isRequired: "isRequired", showUnassigned: "showUnassigned", groupsSelectable: "groupsSelectable", assetSelectorConfig: "assetSelectorConfig", selectedDevice: "selectedDevice" }, host: { classAttribute: "bg-level-1" }, ngImport: i0, template: "<div class=\"card borderless\">\n  <div\n    class=\"card-block p-0 bg-inherit\"\n    style=\"height: 315px\"\n  >\n    <!-- \n      ngIf is needed to avoid a race condition as \n      asset-selector seems not to support dynamic config changes\n    -->\n    <c8y-asset-selector-miller\n      class=\"d-block bg-inherit p-relative\"\n      *ngIf=\"assetSelectorConfig\"\n      (onSelected)=\"selectionChanged($event)\"\n      [config]=\"assetSelectorConfig\"\n      [asset]=\"(widgetConfigService.currentConfig$ | async).settings?.context\"\n      [(ngModel)]=\"selectedDevice\"\n      [required]=\"isRequired\"\n      name=\"configAsset\"\n    ></c8y-asset-selector-miller>\n  </div>\n\n  <c8y-widget-config-feedback>\n    <span\n      class=\"tag chip text-12 m-4\"\n      [ngClass]=\"{\n        'tag--info': selectedDevice || !isRequired,\n        'tag--danger': !selectedDevice && isRequired\n      }\"\n    >\n      <button\n        class=\"btn-clean text-12 m-r-4\"\n        title=\"{{ 'Deselect' | translate }}\"\n        type=\"button\"\n        *ngIf=\"selectedDevice\"\n        (click)=\"selectedDevice = null; updateConfig(null)\"\n      >\n        <i c8yIcon=\"times\"></i>\n      </button>\n      <span\n        class=\"text-truncate\"\n        title=\"{{ selectedDevice.name || 'Device ' + selectedDevice.id }}\"\n        *ngIf=\"selectedDevice\"\n      >\n        {{ selectedDevice.name || 'Device ' + selectedDevice.id }}\n      </span>\n      <span\n        *ngIf=\"!selectedDevice\"\n        translate\n      >\n        No asset selected\n      </span>\n    </span>\n  </c8y-widget-config-feedback>\n</div>\n", dependencies: [{ kind: "ngmodule", type: AssetSelectorModule }, { kind: "component", type: i1$2.MillerViewComponent, selector: "c8y-asset-selector-miller", inputs: ["config", "asset", "selectedDevice", "rootNode", "container"], outputs: ["onSelected", "onClearSelected"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: WidgetConfigFeedbackComponent, selector: "c8y-widget-config-feedback" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: WidgetAssetSelectorComponent, isStandalone: true, selector: "c8y-widget-asset-selector", inputs: { isRequired: "isRequired", showUnassigned: "showUnassigned", groupsSelectable: "groupsSelectable", assetSelectorConfig: "assetSelectorConfig", selectedDevice: "selectedDevice" }, host: { classAttribute: "bg-level-1" }, ngImport: i0, template: "<div class=\"card borderless\">\n  <div\n    class=\"card-block p-0 bg-inherit\"\n    style=\"height: 315px\"\n  >\n    <div\n      class=\"alert alert-info m-4\"\n      *ngIf=\"widgetConfigService.isDeviceTypeDashboard$ | async\"\n    >\n      <i class=\"fa fa-info-circle m-r-4\"></i>\n      <span translate>\n        This widget is used within a dashboard template, so the asset selector is unavailable. The\n        widget automatically inherits the asset from the context in which the dashboard is\n        displayed.\n      </span>\n\n      <div\n        class=\"p-t-8\"\n        *ngIf=\"!isRequired\"\n      >\n        <p translate>Asset selection is optional for this widget.</p>\n        <button\n          class=\"btn btn-primary btn-sm m-t-8\"\n          *ngIf=\"!selectedDevice\"\n          (click)=\"selectCurrentContext()\"\n          ngNonBindable\n          translate\n          [translateParams]=\"{\n            deviceName:\n              (widgetConfigService.currentConfig$ | async)?.settings?.context?.name ||\n              (deviceWithIdTpl\n                | translate\n                  : { id: (widgetConfigService.currentConfig$ | async)?.settings?.context?.id })\n          }\"\n        >\n          Use context asset \"{{ deviceName }}\"\n        </button>\n        <button\n          class=\"btn btn-default btn-sm m-t-8\"\n          *ngIf=\"selectedDevice\"\n          (click)=\"selectedDevice = null; updateConfig(null)\"\n          ngNonBindable\n          translate\n          [translateParams]=\"{\n            deviceName:\n              selectedDevice.name || (deviceWithIdTpl | translate: { id: selectedDevice.id })\n          }\"\n        >\n          Use without asset \"{{ deviceName }}\"\n        </button>\n      </div>\n    </div>\n    <c8y-asset-selector-miller\n      class=\"d-block bg-inherit p-relative\"\n      name=\"configAsset\"\n      *ngIf=\"!(widgetConfigService.isDeviceTypeDashboard$ | async) && assetSelectorConfig\"\n      (onSelected)=\"selectionChanged($event)\"\n      [config]=\"assetSelectorConfig\"\n      [asset]=\"(widgetConfigService.currentConfig$ | async).settings?.context\"\n      [(ngModel)]=\"selectedDevice\"\n      [required]=\"isRequired\"\n    ></c8y-asset-selector-miller>\n\n    <c8y-widget-config-feedback>\n      <span\n        class=\"tag chip text-12 m-4\"\n        [ngClass]=\"{\n          'tag--info': selectedDevice || !isRequired,\n          'tag--danger': !selectedDevice && isRequired\n        }\"\n      >\n        <button\n          class=\"btn-clean text-12 m-r-4\"\n          title=\"{{ 'Deselect' | translate }}\"\n          type=\"button\"\n          *ngIf=\"\n            selectedDevice &&\n            (!(widgetConfigService.isDeviceTypeDashboard$ | async) ||\n              (!isRequired && (widgetConfigService.isDeviceTypeDashboard$ | async)))\n          \"\n          (click)=\"selectedDevice = null; updateConfig(null)\"\n        >\n          <i c8yIcon=\"times\"></i>\n        </button>\n        <span\n          class=\"text-truncate\"\n          title=\"{{\n            selectedDevice.name || (deviceWithIdTpl | translate: { id: selectedDevice.id })\n          }}\"\n          *ngIf=\"selectedDevice\"\n        >\n          {{ selectedDevice.name || (deviceWithIdTpl | translate: { id: selectedDevice.id }) }}\n        </span>\n        <span\n          *ngIf=\"!selectedDevice\"\n          translate\n        >\n          No asset selected\n        </span>\n      </span>\n    </c8y-widget-config-feedback>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: AssetSelectorModule }, { kind: "component", type: i1$2.MillerViewComponent, selector: "c8y-asset-selector-miller", inputs: ["config", "asset", "selectedDevice", "rootNode", "container"], outputs: ["onSelected", "onClearSelected"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: WidgetConfigFeedbackComponent, selector: "c8y-widget-config-feedback" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: WidgetAssetSelectorComponent, decorators: [{
             type: Component,
@@ -1930,8 +1961,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
                         NgClass,
                         C8yTranslatePipe,
                         IconDirective,
-                        FormsModule
-                    ], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], template: "<div class=\"card borderless\">\n  <div\n    class=\"card-block p-0 bg-inherit\"\n    style=\"height: 315px\"\n  >\n    <!-- \n      ngIf is needed to avoid a race condition as \n      asset-selector seems not to support dynamic config changes\n    -->\n    <c8y-asset-selector-miller\n      class=\"d-block bg-inherit p-relative\"\n      *ngIf=\"assetSelectorConfig\"\n      (onSelected)=\"selectionChanged($event)\"\n      [config]=\"assetSelectorConfig\"\n      [asset]=\"(widgetConfigService.currentConfig$ | async).settings?.context\"\n      [(ngModel)]=\"selectedDevice\"\n      [required]=\"isRequired\"\n      name=\"configAsset\"\n    ></c8y-asset-selector-miller>\n  </div>\n\n  <c8y-widget-config-feedback>\n    <span\n      class=\"tag chip text-12 m-4\"\n      [ngClass]=\"{\n        'tag--info': selectedDevice || !isRequired,\n        'tag--danger': !selectedDevice && isRequired\n      }\"\n    >\n      <button\n        class=\"btn-clean text-12 m-r-4\"\n        title=\"{{ 'Deselect' | translate }}\"\n        type=\"button\"\n        *ngIf=\"selectedDevice\"\n        (click)=\"selectedDevice = null; updateConfig(null)\"\n      >\n        <i c8yIcon=\"times\"></i>\n      </button>\n      <span\n        class=\"text-truncate\"\n        title=\"{{ selectedDevice.name || 'Device ' + selectedDevice.id }}\"\n        *ngIf=\"selectedDevice\"\n      >\n        {{ selectedDevice.name || 'Device ' + selectedDevice.id }}\n      </span>\n      <span\n        *ngIf=\"!selectedDevice\"\n        translate\n      >\n        No asset selected\n      </span>\n    </span>\n  </c8y-widget-config-feedback>\n</div>\n" }]
+                        FormsModule,
+                        C8yTranslateDirective
+                    ], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], template: "<div class=\"card borderless\">\n  <div\n    class=\"card-block p-0 bg-inherit\"\n    style=\"height: 315px\"\n  >\n    <div\n      class=\"alert alert-info m-4\"\n      *ngIf=\"widgetConfigService.isDeviceTypeDashboard$ | async\"\n    >\n      <i class=\"fa fa-info-circle m-r-4\"></i>\n      <span translate>\n        This widget is used within a dashboard template, so the asset selector is unavailable. The\n        widget automatically inherits the asset from the context in which the dashboard is\n        displayed.\n      </span>\n\n      <div\n        class=\"p-t-8\"\n        *ngIf=\"!isRequired\"\n      >\n        <p translate>Asset selection is optional for this widget.</p>\n        <button\n          class=\"btn btn-primary btn-sm m-t-8\"\n          *ngIf=\"!selectedDevice\"\n          (click)=\"selectCurrentContext()\"\n          ngNonBindable\n          translate\n          [translateParams]=\"{\n            deviceName:\n              (widgetConfigService.currentConfig$ | async)?.settings?.context?.name ||\n              (deviceWithIdTpl\n                | translate\n                  : { id: (widgetConfigService.currentConfig$ | async)?.settings?.context?.id })\n          }\"\n        >\n          Use context asset \"{{ deviceName }}\"\n        </button>\n        <button\n          class=\"btn btn-default btn-sm m-t-8\"\n          *ngIf=\"selectedDevice\"\n          (click)=\"selectedDevice = null; updateConfig(null)\"\n          ngNonBindable\n          translate\n          [translateParams]=\"{\n            deviceName:\n              selectedDevice.name || (deviceWithIdTpl | translate: { id: selectedDevice.id })\n          }\"\n        >\n          Use without asset \"{{ deviceName }}\"\n        </button>\n      </div>\n    </div>\n    <c8y-asset-selector-miller\n      class=\"d-block bg-inherit p-relative\"\n      name=\"configAsset\"\n      *ngIf=\"!(widgetConfigService.isDeviceTypeDashboard$ | async) && assetSelectorConfig\"\n      (onSelected)=\"selectionChanged($event)\"\n      [config]=\"assetSelectorConfig\"\n      [asset]=\"(widgetConfigService.currentConfig$ | async).settings?.context\"\n      [(ngModel)]=\"selectedDevice\"\n      [required]=\"isRequired\"\n    ></c8y-asset-selector-miller>\n\n    <c8y-widget-config-feedback>\n      <span\n        class=\"tag chip text-12 m-4\"\n        [ngClass]=\"{\n          'tag--info': selectedDevice || !isRequired,\n          'tag--danger': !selectedDevice && isRequired\n        }\"\n      >\n        <button\n          class=\"btn-clean text-12 m-r-4\"\n          title=\"{{ 'Deselect' | translate }}\"\n          type=\"button\"\n          *ngIf=\"\n            selectedDevice &&\n            (!(widgetConfigService.isDeviceTypeDashboard$ | async) ||\n              (!isRequired && (widgetConfigService.isDeviceTypeDashboard$ | async)))\n          \"\n          (click)=\"selectedDevice = null; updateConfig(null)\"\n        >\n          <i c8yIcon=\"times\"></i>\n        </button>\n        <span\n          class=\"text-truncate\"\n          title=\"{{\n            selectedDevice.name || (deviceWithIdTpl | translate: { id: selectedDevice.id })\n          }}\"\n          *ngIf=\"selectedDevice\"\n        >\n          {{ selectedDevice.name || (deviceWithIdTpl | translate: { id: selectedDevice.id }) }}\n        </span>\n        <span\n          *ngIf=\"!selectedDevice\"\n          translate\n        >\n          No asset selected\n        </span>\n      </span>\n    </c8y-widget-config-feedback>\n  </div>\n</div>\n" }]
         }], propDecorators: { isRequired: [{
                 type: Input
             }], showUnassigned: [{
@@ -1982,10 +2014,15 @@ class WidgetConfigService {
         this.widgetConfigSectionService = widgetConfigSectionService;
         this._currentConfig$ = new BehaviorSubject(null);
         this._instanceId$ = new BehaviorSubject(null);
+        this._isDeviceTypeDashboard$ = new BehaviorSubject(false);
         /**
          * The unique identifier of the current widget instance.
          */
         this.instanceId$ = this._instanceId$.asObservable();
+        /**
+         * Indicates if the selected widget is placed on a device type dashboard.
+         */
+        this.isDeviceTypeDashboard$ = this._isDeviceTypeDashboard$.asObservable();
         /**
          * The preview of the currently selected widget. If `null` no preview is shown
          * (except if the selected widget has no configuration).
@@ -2151,10 +2188,12 @@ class WidgetConfigService {
      * Select a widget
      * @param selected The widget to select.
      * @param identifier An optional unique identifier for the widget instance. Only used if the widget is not new.
+     * @param isDeviceTypeDashboard Indicates if the selected widget is placed on a device-type dashboard. This is used to determine if the default asset selector should be shown.
      */
-    selectWidget(selected, identifier = null) {
+    selectWidget(selected, identifier = null, isDeviceTypeDashboard = false) {
         this.selected$.next(selected);
         this._instanceId$.next(identifier);
+        this._isDeviceTypeDashboard$.next(isDeviceTypeDashboard);
     }
     /**
      * Deselect the currently selected.
@@ -2521,7 +2560,7 @@ class WidgetConfigComponent {
         this.selected.data.title = this.selected.data.title || cmp.label;
         this.componentLabel = cmp.label;
         this.widgetConfigService.initConfig(this.widgetConfig);
-        this.widgetConfigService.selectWidget(this.selected, this.identifier);
+        this.widgetConfigService.selectWidget(this.selected, this.identifier, this.isDeviceTypeDashboard);
     }
     search() {
         if (this.searchTerm.length > 0) {
@@ -2614,18 +2653,9 @@ class WidgetConfigComponent {
         const noDeviceTarget = widgetConfig.settings.ng1
             ? widgetConfig.settings.ng1.options.noDeviceTarget
             : widgetConfig.settings.noDeviceTarget;
-        if (isDeviceType) {
-            widgetConfig.settings.hideTarget = isDeviceType;
-            if (!noDeviceTarget) {
-                widgetConfig.device = {
-                    id: this.context.id,
-                    name: this.context.name
-                };
-            }
-        }
-        else if (this.context?.id && !noDeviceTarget) {
-            // if the widget is a new widget, we assign the current context
-            // as well to have the device available on init of the component
+        const needsTargetAndIsDeviceType = isDeviceType && !noDeviceTarget && widgetConfig.device;
+        const isNewWidgetWithContext = !this.isEdit && this.context?.id && !noDeviceTarget;
+        if (needsTargetAndIsDeviceType || isNewWidgetWithContext) {
             widgetConfig.device = {
                 id: this.context.id,
                 name: this.context.name
@@ -2634,7 +2664,7 @@ class WidgetConfigComponent {
         return widgetConfig;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: WidgetConfigComponent, deps: [{ token: WidgetService }, { token: i2.BottomDrawerRef }, { token: ContextDashboardService }, { token: WidgetConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: WidgetConfigComponent, isStandalone: true, selector: "c8y-widget-config", host: { classAttribute: "d-contents" }, viewQueries: [{ propertyName: "configForm", first: true, predicate: ["configForm"], descendants: true }], ngImport: i0, template: "<!-- select widget -->\n<ng-container *ngIf=\"!(widgetConfigService.selected$ | async)\">\n  <div class=\"card-header j-c-center separator\">\n    <div class=\"h4 text-center\">\n      {{ 'Select widget' | translate }}\n    </div>\n  </div>\n  <div class=\"card-inner-scroll fit-h bg-level-2\">\n    <div\n      class=\"bg-level-0 p-l-24 p-r-24 p-t-8 p-b-8 sticky-header-top-0 elevation-md\"\n      style=\"z-index: 2\"\n    >\n      <div class=\"row\">\n        <div class=\"col-sm-6 col-sm-offset-3\">\n          <div class=\"input-group input-group-search\">\n            <input\n              class=\"form-control\"\n              [attr.aria-label]=\"'Search' | translate\"\n              placeholder=\"{{ 'Search\u2026' | translate }}\"\n              type=\"text\"\n              data-cy=\"widget-config--Search\"\n              [(ngModel)]=\"searchTerm\"\n              [ngModelOptions]=\"{ standalone: true }\"\n              (keydown)=\"searchChange$.next($event)\"\n            />\n            <span class=\"input-group-btn\">\n              <button\n                class=\"btn btn-dot\"\n                title=\"{{ 'Search' | translate }}\"\n                type=\"button\"\n                (click)=\"resetSearch()\"\n              >\n                <i [c8yIcon]=\"searchTerm.length === 0 ? 'search' : 'close'\"></i>\n              </button>\n            </span>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"card-block\">\n      <div class=\"card-group p-l-24 p-r-24 d-grid grid__col--auto-300 gap-24 card-select m-b-0\">\n        <button\n          class=\"btn-clean d-col card m-b-0\"\n          [title]=\"cmp.description || cmp.label | translate\"\n          type=\"button\"\n          data-cy=\"widget-config--widget-list\"\n          *ngFor=\"let cmp of searchResult || components\"\n          (click)=\"select(cmp)\"\n        >\n          <div\n            class=\"border-bottom\"\n            role=\"presentation\"\n          >\n            <ng-container *ngIf=\"!cmp.previewImage; else previewImage\">\n              <div class=\"h1\"><i c8yIcon=\"file-image-o\"></i></div>\n              <small translate>Preview not available</small>\n            </ng-container>\n            <ng-template #previewImage>\n              <img\n                class=\"widget-thumbnail\"\n                alt=\"{{ cmp.label | translate }}\"\n                [src]=\"cmp.previewImage\"\n              />\n            </ng-template>\n          </div>\n          <div class=\"card-block\">\n            <p class=\"card-title text-truncate text-medium\">\n              <c8y-highlight\n                text=\"{{ cmp.label | translate }}\"\n                [pattern]=\"searchTerm\"\n              ></c8y-highlight>\n            </p>\n            <p\n              class=\"small text-default\"\n              style=\"white-space: wrap\"\n            >\n              {{ cmp.description | translate }}\n            </p>\n          </div>\n        </button>\n        <c8y-ui-empty-state\n          class=\"p-24 grid__col--fullspan\"\n          [icon]=\"'search'\"\n          [title]=\"'No widgets found.' | translate\"\n          [subtitle]=\"' Rephrase your search term.' | translate\"\n          *ngIf=\"searchResult && searchResult.length === 0\"\n        >\n          <button\n            class=\"btn btn-primary\"\n            title=\"{{ 'Reset search' | translate }}\"\n            type=\"button\"\n            (click)=\"resetSearch()\"\n          >\n            {{ 'Reset search' | translate }}\n          </button>\n        </c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n  <div class=\"card-footer text-center separator flex-no-shrink\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"widget-config--cancel-widget\"\n      (click)=\"close()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n  </div>\n</ng-container>\n\n<!-- widget configuration -->\n<ng-container *ngIf=\"!!(widgetConfigService.selected$ | async)\">\n  <div class=\"card-header d-block separator-bottom flex-no-shrink\">\n    <div\n      class=\"h3 p-t-16\"\n      title=\"{{ selected?.label | translate }}\"\n    >\n      <span>{{ selected?.label | translate }}</span>\n      <button\n        class=\"btn btn-default btn-sm m-l-8\"\n        [title]=\"'Change widget' | translate\"\n        (click)=\"backToWidgetSelection(); (false)\"\n      >\n        <i c8yIcon=\"replace\"></i>\n        {{ 'Change widget' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"p-t-8\"\n      *ngIf=\"selected\"\n    >\n      <p>\n        {{ selected.description | translate }}\n      </p>\n    </div>\n  </div>\n\n  <c8y-resizable-grid\n    class=\"min-height-0 flex-grow\"\n    [trackId]=\"'c8y-widget-resizable-grid-size-' + (widgetConfigService.instanceId$ | async)\"\n    [leftColumnWidth]=\"\n      (widgetConfigService.currentConfig$ | async)?.settings?.configurationViewGridSize ||\n      WIDGET_CONFIGURATION_GRID_SIZE.HALF\n    \"\n  >\n    <div\n      class=\"bg-level-1 inner-scroll\"\n      left-pane\n    >\n      <div class=\"p-16 flex-no-shrink separator-bottom bg-level-1\">\n        <c8y-form-group>\n          <label\n            for=\"widgetTitle\"\n            translate\n          >\n            Widget title\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"widgetTitle\"\n            placeholder=\"{{ 'e.g.' | translate }} {{ componentLabel | translate }}\"\n            name=\"title\"\n            type=\"text\"\n            required\n            [(ngModel)]=\"selected?.data.title\"\n          />\n        </c8y-form-group>\n      </div>\n\n      <c8y-ui-empty-state\n        class=\"p-24\"\n        [icon]=\"'settings'\"\n        [title]=\"'No configuration needed.' | translate\"\n        [subtitle]=\"'This widget does not need any specific configuration.' | translate\"\n        [horizontal]=\"true\"\n        *ngIf=\"!(widgetConfigService.hasConfig$ | async)\"\n      ></c8y-ui-empty-state>\n      <div>\n        <form\n          name=\"form\"\n          #configForm=\"ngForm\"\n        >\n          <ng-container *ngIf=\"widgetConfigService.hasConfig$ | async\">\n            <ng-container *ngIf=\"widgetConfigService.providers$ | async as providers\">\n              <ng-container\n                *c8yComponentOutlet=\"widgetConfigRoot; providers: providers\"\n              ></ng-container>\n            </ng-container>\n          </ng-container>\n        </form>\n      </div>\n    </div>\n    <div\n      class=\"inner-scroll p-32 p-t-0\"\n      right-pane\n    >\n      <c8y-widget-preview [previewClasses]=\"getStyle(true)\"></c8y-widget-preview>\n\n      <c8y-appearance-settings\n        [(themeClass)]=\"styling.contentClass\"\n        [(headerClass)]=\"styling.headerClass\"\n        [possibleStylingTheme]=\"possibleStyling.WIDGET_CONTENT_CLASSES\"\n        [possibleStylingHeader]=\"possibleStyling.WIDGET_HEADER_CLASSES\"\n        [defaultThemeClass]=\"defaultStyling.contentClass\"\n        [defaultHeaderClass]=\"defaultStyling.headerClass\"\n        [columns]=\"2\"\n      ></c8y-appearance-settings>\n    </div>\n  </c8y-resizable-grid>\n  <div class=\"card-footer separator text-center\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"widget-config--cancel-widget\"\n      (click)=\"close()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"submit\"\n      data-cy=\"widget-config--save-widget\"\n      (click)=\"save()\"\n      [disabled]=\"(contextDashboardService.formDisabled$ | async) || isSaveDisabled()\"\n      c8yProductExperience\n      [actionName]=\"current ? 'editWidget' : 'createWidget'\"\n      [actionData]=\"{ widgetName: selected && selected.id }\"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: C8yComponentOutlet, selector: "[c8yComponentOutlet]", inputs: ["c8yComponentOutlet", "c8yComponentOutletInjector", "c8yComponentOutletEnvironmentInjector", "c8yComponentOutletProviders", "c8yComponentOutletInitialState"] }, { kind: "component", type: WidgetPreviewComponent, selector: "c8y-widget-preview", inputs: ["previewClasses"] }, { kind: "component", type: AppearanceSettingsComponent, selector: "c8y-appearance-settings", inputs: ["themeClass", "headerClass", "defaultThemeClass", "defaultHeaderClass", "dashboardSettings", "possibleStylingTheme", "possibleStylingHeader", "columns"], outputs: ["themeClassChange", "headerClassChange", "onChange"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: ResizableGridComponent, selector: "c8y-resizable-grid", inputs: ["leftColumnWidth", "trackId", "collapseThreshold"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: WidgetConfigComponent, isStandalone: true, selector: "c8y-widget-config", host: { classAttribute: "d-contents" }, viewQueries: [{ propertyName: "configForm", first: true, predicate: ["configForm"], descendants: true }], ngImport: i0, template: "<!-- select widget -->\n<ng-container *ngIf=\"!(widgetConfigService.selected$ | async)\">\n  <div class=\"card-header j-c-center separator\">\n    <div class=\"h4 text-center\" id=\"drawerTitle\">\n      {{ 'Select widget' | translate }}\n    </div>\n  </div>\n  <div class=\"card-inner-scroll fit-h bg-level-2\">\n    <div\n      class=\"bg-level-0 p-l-24 p-r-24 p-t-8 p-b-8 sticky-header-top-0 elevation-md\"\n      style=\"z-index: 2\"\n    >\n      <div class=\"row\">\n        <div class=\"col-sm-6 col-sm-offset-3\">\n          <div class=\"input-group input-group-search\">\n            <input\n              class=\"form-control\"\n              [attr.aria-label]=\"'Search' | translate\"\n              placeholder=\"{{ 'Search\u2026' | translate }}\"\n              type=\"text\"\n              data-cy=\"widget-config--Search\"\n              [(ngModel)]=\"searchTerm\"\n              [ngModelOptions]=\"{ standalone: true }\"\n              (keydown)=\"searchChange$.next($event)\"\n            />\n            <span class=\"input-group-btn\">\n              <button\n                class=\"btn btn-dot\"\n                title=\"{{ 'Search' | translate }}\"\n                type=\"button\"\n                (click)=\"resetSearch()\"\n              >\n                <i [c8yIcon]=\"searchTerm.length === 0 ? 'search' : 'close'\"></i>\n              </button>\n            </span>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"card-block\">\n      <div class=\"card-group p-l-24 p-r-24 d-grid grid__col--auto-300 gap-24 card-select m-b-0\">\n        <button\n          class=\"btn-clean d-col card m-b-0\"\n          [title]=\"cmp.description || cmp.label | translate\"\n          type=\"button\"\n          data-cy=\"widget-config--widget-list\"\n          *ngFor=\"let cmp of searchResult || components\"\n          (click)=\"select(cmp)\"\n        >\n          <div\n            class=\"border-bottom\"\n            role=\"presentation\"\n          >\n            <ng-container *ngIf=\"!cmp.previewImage; else previewImage\">\n              <div class=\"h1\"><i c8yIcon=\"file-image-o\"></i></div>\n              <small translate>Preview not available</small>\n            </ng-container>\n            <ng-template #previewImage>\n              <img\n                class=\"widget-thumbnail\"\n                alt=\"{{ cmp.label | translate }}\"\n                [src]=\"cmp.previewImage\"\n              />\n            </ng-template>\n          </div>\n          <div class=\"card-block\">\n            <p class=\"card-title text-truncate text-medium\">\n              <c8y-highlight\n                text=\"{{ cmp.label | translate }}\"\n                [pattern]=\"searchTerm\"\n              ></c8y-highlight>\n            </p>\n            <p\n              class=\"small text-default\"\n              style=\"white-space: wrap\"\n            >\n              {{ cmp.description | translate }}\n            </p>\n          </div>\n        </button>\n        <c8y-ui-empty-state\n          class=\"p-24 grid__col--fullspan\"\n          [icon]=\"'search'\"\n          [title]=\"'No widgets found.' | translate\"\n          [subtitle]=\"' Rephrase your search term.' | translate\"\n          *ngIf=\"searchResult && searchResult.length === 0\"\n        >\n          <button\n            class=\"btn btn-primary\"\n            title=\"{{ 'Reset search' | translate }}\"\n            type=\"button\"\n            (click)=\"resetSearch()\"\n          >\n            {{ 'Reset search' | translate }}\n          </button>\n        </c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n  <div class=\"card-footer text-center separator flex-no-shrink\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"widget-config--cancel-widget\"\n      (click)=\"close()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n  </div>\n</ng-container>\n\n<!-- widget configuration -->\n<ng-container *ngIf=\"!!(widgetConfigService.selected$ | async)\">\n  <div class=\"card-header d-block separator-bottom flex-no-shrink\">\n    <div\n      class=\"h3 p-t-16\"\n      title=\"{{ selected?.label | translate }}\"\n    >\n      <span>{{ selected?.label | translate }}</span>\n      <button\n        class=\"btn btn-default btn-sm m-l-8\"\n        [title]=\"'Change widget' | translate\"\n        (click)=\"backToWidgetSelection(); (false)\"\n      >\n        <i c8yIcon=\"replace\"></i>\n        {{ 'Change widget' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"p-t-8\"\n      *ngIf=\"selected\"\n    >\n      <p>\n        {{ selected.description | translate }}\n      </p>\n    </div>\n  </div>\n\n  <c8y-resizable-grid\n    class=\"min-height-0 flex-grow\"\n    [trackId]=\"'c8y-widget-resizable-grid-size-' + (widgetConfigService.instanceId$ | async)\"\n    [leftColumnWidth]=\"\n      (widgetConfigService.currentConfig$ | async)?.settings?.configurationViewGridSize ||\n      WIDGET_CONFIGURATION_GRID_SIZE.HALF\n    \"\n  >\n    <div\n      class=\"bg-level-1 inner-scroll\"\n      left-pane\n    >\n      <div class=\"p-16 flex-no-shrink separator-bottom bg-level-1\">\n        <c8y-form-group>\n          <label\n            for=\"widgetTitle\"\n            translate\n          >\n            Widget title\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"widgetTitle\"\n            placeholder=\"{{ 'e.g.' | translate }} {{ componentLabel | translate }}\"\n            name=\"title\"\n            type=\"text\"\n            required\n            [(ngModel)]=\"selected?.data.title\"\n          />\n        </c8y-form-group>\n      </div>\n\n      <c8y-ui-empty-state\n        class=\"p-24\"\n        [icon]=\"'settings'\"\n        [title]=\"'No configuration needed.' | translate\"\n        [subtitle]=\"'This widget does not need any specific configuration.' | translate\"\n        [horizontal]=\"true\"\n        *ngIf=\"!(widgetConfigService.hasConfig$ | async)\"\n      ></c8y-ui-empty-state>\n      <div>\n        <form\n          name=\"form\"\n          #configForm=\"ngForm\"\n        >\n          <ng-container *ngIf=\"widgetConfigService.hasConfig$ | async\">\n            <ng-container *ngIf=\"widgetConfigService.providers$ | async as providers\">\n              <ng-container\n                *c8yComponentOutlet=\"widgetConfigRoot; providers: providers\"\n              ></ng-container>\n            </ng-container>\n          </ng-container>\n        </form>\n      </div>\n    </div>\n    <div\n      class=\"inner-scroll p-32 p-t-0\"\n      right-pane\n    >\n      <c8y-widget-preview [previewClasses]=\"getStyle(true)\"></c8y-widget-preview>\n\n      <c8y-appearance-settings\n        [(themeClass)]=\"styling.contentClass\"\n        [(headerClass)]=\"styling.headerClass\"\n        [possibleStylingTheme]=\"possibleStyling.WIDGET_CONTENT_CLASSES\"\n        [possibleStylingHeader]=\"possibleStyling.WIDGET_HEADER_CLASSES\"\n        [defaultThemeClass]=\"defaultStyling.contentClass\"\n        [defaultHeaderClass]=\"defaultStyling.headerClass\"\n        [columns]=\"2\"\n      ></c8y-appearance-settings>\n    </div>\n  </c8y-resizable-grid>\n  <div class=\"card-footer separator text-center\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"widget-config--cancel-widget\"\n      (click)=\"close()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"submit\"\n      data-cy=\"widget-config--save-widget\"\n      (click)=\"save()\"\n      [disabled]=\"(contextDashboardService.formDisabled$ | async) || isSaveDisabled()\"\n      c8yProductExperience\n      [actionName]=\"current ? 'editWidget' : 'createWidget'\"\n      [actionData]=\"{ widgetName: selected && selected.id }\"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: C8yComponentOutlet, selector: "[c8yComponentOutlet]", inputs: ["c8yComponentOutlet", "c8yComponentOutletInjector", "c8yComponentOutletEnvironmentInjector", "c8yComponentOutletProviders", "c8yComponentOutletInitialState"] }, { kind: "component", type: WidgetPreviewComponent, selector: "c8y-widget-preview", inputs: ["previewClasses"] }, { kind: "component", type: AppearanceSettingsComponent, selector: "c8y-appearance-settings", inputs: ["themeClass", "headerClass", "defaultThemeClass", "defaultHeaderClass", "dashboardSettings", "possibleStylingTheme", "possibleStylingHeader", "columns"], outputs: ["themeClassChange", "headerClassChange", "onChange"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: ResizableGridComponent, selector: "c8y-resizable-grid", inputs: ["leftColumnWidth", "trackId", "collapseThreshold"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: WidgetConfigComponent, decorators: [{
             type: Component,
@@ -2655,7 +2685,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
                         C8yTranslatePipe,
                         AsyncPipe,
                         ResizableGridComponent
-                    ], standalone: true, template: "<!-- select widget -->\n<ng-container *ngIf=\"!(widgetConfigService.selected$ | async)\">\n  <div class=\"card-header j-c-center separator\">\n    <div class=\"h4 text-center\">\n      {{ 'Select widget' | translate }}\n    </div>\n  </div>\n  <div class=\"card-inner-scroll fit-h bg-level-2\">\n    <div\n      class=\"bg-level-0 p-l-24 p-r-24 p-t-8 p-b-8 sticky-header-top-0 elevation-md\"\n      style=\"z-index: 2\"\n    >\n      <div class=\"row\">\n        <div class=\"col-sm-6 col-sm-offset-3\">\n          <div class=\"input-group input-group-search\">\n            <input\n              class=\"form-control\"\n              [attr.aria-label]=\"'Search' | translate\"\n              placeholder=\"{{ 'Search\u2026' | translate }}\"\n              type=\"text\"\n              data-cy=\"widget-config--Search\"\n              [(ngModel)]=\"searchTerm\"\n              [ngModelOptions]=\"{ standalone: true }\"\n              (keydown)=\"searchChange$.next($event)\"\n            />\n            <span class=\"input-group-btn\">\n              <button\n                class=\"btn btn-dot\"\n                title=\"{{ 'Search' | translate }}\"\n                type=\"button\"\n                (click)=\"resetSearch()\"\n              >\n                <i [c8yIcon]=\"searchTerm.length === 0 ? 'search' : 'close'\"></i>\n              </button>\n            </span>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"card-block\">\n      <div class=\"card-group p-l-24 p-r-24 d-grid grid__col--auto-300 gap-24 card-select m-b-0\">\n        <button\n          class=\"btn-clean d-col card m-b-0\"\n          [title]=\"cmp.description || cmp.label | translate\"\n          type=\"button\"\n          data-cy=\"widget-config--widget-list\"\n          *ngFor=\"let cmp of searchResult || components\"\n          (click)=\"select(cmp)\"\n        >\n          <div\n            class=\"border-bottom\"\n            role=\"presentation\"\n          >\n            <ng-container *ngIf=\"!cmp.previewImage; else previewImage\">\n              <div class=\"h1\"><i c8yIcon=\"file-image-o\"></i></div>\n              <small translate>Preview not available</small>\n            </ng-container>\n            <ng-template #previewImage>\n              <img\n                class=\"widget-thumbnail\"\n                alt=\"{{ cmp.label | translate }}\"\n                [src]=\"cmp.previewImage\"\n              />\n            </ng-template>\n          </div>\n          <div class=\"card-block\">\n            <p class=\"card-title text-truncate text-medium\">\n              <c8y-highlight\n                text=\"{{ cmp.label | translate }}\"\n                [pattern]=\"searchTerm\"\n              ></c8y-highlight>\n            </p>\n            <p\n              class=\"small text-default\"\n              style=\"white-space: wrap\"\n            >\n              {{ cmp.description | translate }}\n            </p>\n          </div>\n        </button>\n        <c8y-ui-empty-state\n          class=\"p-24 grid__col--fullspan\"\n          [icon]=\"'search'\"\n          [title]=\"'No widgets found.' | translate\"\n          [subtitle]=\"' Rephrase your search term.' | translate\"\n          *ngIf=\"searchResult && searchResult.length === 0\"\n        >\n          <button\n            class=\"btn btn-primary\"\n            title=\"{{ 'Reset search' | translate }}\"\n            type=\"button\"\n            (click)=\"resetSearch()\"\n          >\n            {{ 'Reset search' | translate }}\n          </button>\n        </c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n  <div class=\"card-footer text-center separator flex-no-shrink\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"widget-config--cancel-widget\"\n      (click)=\"close()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n  </div>\n</ng-container>\n\n<!-- widget configuration -->\n<ng-container *ngIf=\"!!(widgetConfigService.selected$ | async)\">\n  <div class=\"card-header d-block separator-bottom flex-no-shrink\">\n    <div\n      class=\"h3 p-t-16\"\n      title=\"{{ selected?.label | translate }}\"\n    >\n      <span>{{ selected?.label | translate }}</span>\n      <button\n        class=\"btn btn-default btn-sm m-l-8\"\n        [title]=\"'Change widget' | translate\"\n        (click)=\"backToWidgetSelection(); (false)\"\n      >\n        <i c8yIcon=\"replace\"></i>\n        {{ 'Change widget' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"p-t-8\"\n      *ngIf=\"selected\"\n    >\n      <p>\n        {{ selected.description | translate }}\n      </p>\n    </div>\n  </div>\n\n  <c8y-resizable-grid\n    class=\"min-height-0 flex-grow\"\n    [trackId]=\"'c8y-widget-resizable-grid-size-' + (widgetConfigService.instanceId$ | async)\"\n    [leftColumnWidth]=\"\n      (widgetConfigService.currentConfig$ | async)?.settings?.configurationViewGridSize ||\n      WIDGET_CONFIGURATION_GRID_SIZE.HALF\n    \"\n  >\n    <div\n      class=\"bg-level-1 inner-scroll\"\n      left-pane\n    >\n      <div class=\"p-16 flex-no-shrink separator-bottom bg-level-1\">\n        <c8y-form-group>\n          <label\n            for=\"widgetTitle\"\n            translate\n          >\n            Widget title\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"widgetTitle\"\n            placeholder=\"{{ 'e.g.' | translate }} {{ componentLabel | translate }}\"\n            name=\"title\"\n            type=\"text\"\n            required\n            [(ngModel)]=\"selected?.data.title\"\n          />\n        </c8y-form-group>\n      </div>\n\n      <c8y-ui-empty-state\n        class=\"p-24\"\n        [icon]=\"'settings'\"\n        [title]=\"'No configuration needed.' | translate\"\n        [subtitle]=\"'This widget does not need any specific configuration.' | translate\"\n        [horizontal]=\"true\"\n        *ngIf=\"!(widgetConfigService.hasConfig$ | async)\"\n      ></c8y-ui-empty-state>\n      <div>\n        <form\n          name=\"form\"\n          #configForm=\"ngForm\"\n        >\n          <ng-container *ngIf=\"widgetConfigService.hasConfig$ | async\">\n            <ng-container *ngIf=\"widgetConfigService.providers$ | async as providers\">\n              <ng-container\n                *c8yComponentOutlet=\"widgetConfigRoot; providers: providers\"\n              ></ng-container>\n            </ng-container>\n          </ng-container>\n        </form>\n      </div>\n    </div>\n    <div\n      class=\"inner-scroll p-32 p-t-0\"\n      right-pane\n    >\n      <c8y-widget-preview [previewClasses]=\"getStyle(true)\"></c8y-widget-preview>\n\n      <c8y-appearance-settings\n        [(themeClass)]=\"styling.contentClass\"\n        [(headerClass)]=\"styling.headerClass\"\n        [possibleStylingTheme]=\"possibleStyling.WIDGET_CONTENT_CLASSES\"\n        [possibleStylingHeader]=\"possibleStyling.WIDGET_HEADER_CLASSES\"\n        [defaultThemeClass]=\"defaultStyling.contentClass\"\n        [defaultHeaderClass]=\"defaultStyling.headerClass\"\n        [columns]=\"2\"\n      ></c8y-appearance-settings>\n    </div>\n  </c8y-resizable-grid>\n  <div class=\"card-footer separator text-center\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"widget-config--cancel-widget\"\n      (click)=\"close()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"submit\"\n      data-cy=\"widget-config--save-widget\"\n      (click)=\"save()\"\n      [disabled]=\"(contextDashboardService.formDisabled$ | async) || isSaveDisabled()\"\n      c8yProductExperience\n      [actionName]=\"current ? 'editWidget' : 'createWidget'\"\n      [actionData]=\"{ widgetName: selected && selected.id }\"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</ng-container>\n" }]
+                    ], standalone: true, template: "<!-- select widget -->\n<ng-container *ngIf=\"!(widgetConfigService.selected$ | async)\">\n  <div class=\"card-header j-c-center separator\">\n    <div class=\"h4 text-center\" id=\"drawerTitle\">\n      {{ 'Select widget' | translate }}\n    </div>\n  </div>\n  <div class=\"card-inner-scroll fit-h bg-level-2\">\n    <div\n      class=\"bg-level-0 p-l-24 p-r-24 p-t-8 p-b-8 sticky-header-top-0 elevation-md\"\n      style=\"z-index: 2\"\n    >\n      <div class=\"row\">\n        <div class=\"col-sm-6 col-sm-offset-3\">\n          <div class=\"input-group input-group-search\">\n            <input\n              class=\"form-control\"\n              [attr.aria-label]=\"'Search' | translate\"\n              placeholder=\"{{ 'Search\u2026' | translate }}\"\n              type=\"text\"\n              data-cy=\"widget-config--Search\"\n              [(ngModel)]=\"searchTerm\"\n              [ngModelOptions]=\"{ standalone: true }\"\n              (keydown)=\"searchChange$.next($event)\"\n            />\n            <span class=\"input-group-btn\">\n              <button\n                class=\"btn btn-dot\"\n                title=\"{{ 'Search' | translate }}\"\n                type=\"button\"\n                (click)=\"resetSearch()\"\n              >\n                <i [c8yIcon]=\"searchTerm.length === 0 ? 'search' : 'close'\"></i>\n              </button>\n            </span>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"card-block\">\n      <div class=\"card-group p-l-24 p-r-24 d-grid grid__col--auto-300 gap-24 card-select m-b-0\">\n        <button\n          class=\"btn-clean d-col card m-b-0\"\n          [title]=\"cmp.description || cmp.label | translate\"\n          type=\"button\"\n          data-cy=\"widget-config--widget-list\"\n          *ngFor=\"let cmp of searchResult || components\"\n          (click)=\"select(cmp)\"\n        >\n          <div\n            class=\"border-bottom\"\n            role=\"presentation\"\n          >\n            <ng-container *ngIf=\"!cmp.previewImage; else previewImage\">\n              <div class=\"h1\"><i c8yIcon=\"file-image-o\"></i></div>\n              <small translate>Preview not available</small>\n            </ng-container>\n            <ng-template #previewImage>\n              <img\n                class=\"widget-thumbnail\"\n                alt=\"{{ cmp.label | translate }}\"\n                [src]=\"cmp.previewImage\"\n              />\n            </ng-template>\n          </div>\n          <div class=\"card-block\">\n            <p class=\"card-title text-truncate text-medium\">\n              <c8y-highlight\n                text=\"{{ cmp.label | translate }}\"\n                [pattern]=\"searchTerm\"\n              ></c8y-highlight>\n            </p>\n            <p\n              class=\"small text-default\"\n              style=\"white-space: wrap\"\n            >\n              {{ cmp.description | translate }}\n            </p>\n          </div>\n        </button>\n        <c8y-ui-empty-state\n          class=\"p-24 grid__col--fullspan\"\n          [icon]=\"'search'\"\n          [title]=\"'No widgets found.' | translate\"\n          [subtitle]=\"' Rephrase your search term.' | translate\"\n          *ngIf=\"searchResult && searchResult.length === 0\"\n        >\n          <button\n            class=\"btn btn-primary\"\n            title=\"{{ 'Reset search' | translate }}\"\n            type=\"button\"\n            (click)=\"resetSearch()\"\n          >\n            {{ 'Reset search' | translate }}\n          </button>\n        </c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n  <div class=\"card-footer text-center separator flex-no-shrink\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"widget-config--cancel-widget\"\n      (click)=\"close()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n  </div>\n</ng-container>\n\n<!-- widget configuration -->\n<ng-container *ngIf=\"!!(widgetConfigService.selected$ | async)\">\n  <div class=\"card-header d-block separator-bottom flex-no-shrink\">\n    <div\n      class=\"h3 p-t-16\"\n      title=\"{{ selected?.label | translate }}\"\n    >\n      <span>{{ selected?.label | translate }}</span>\n      <button\n        class=\"btn btn-default btn-sm m-l-8\"\n        [title]=\"'Change widget' | translate\"\n        (click)=\"backToWidgetSelection(); (false)\"\n      >\n        <i c8yIcon=\"replace\"></i>\n        {{ 'Change widget' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"p-t-8\"\n      *ngIf=\"selected\"\n    >\n      <p>\n        {{ selected.description | translate }}\n      </p>\n    </div>\n  </div>\n\n  <c8y-resizable-grid\n    class=\"min-height-0 flex-grow\"\n    [trackId]=\"'c8y-widget-resizable-grid-size-' + (widgetConfigService.instanceId$ | async)\"\n    [leftColumnWidth]=\"\n      (widgetConfigService.currentConfig$ | async)?.settings?.configurationViewGridSize ||\n      WIDGET_CONFIGURATION_GRID_SIZE.HALF\n    \"\n  >\n    <div\n      class=\"bg-level-1 inner-scroll\"\n      left-pane\n    >\n      <div class=\"p-16 flex-no-shrink separator-bottom bg-level-1\">\n        <c8y-form-group>\n          <label\n            for=\"widgetTitle\"\n            translate\n          >\n            Widget title\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"widgetTitle\"\n            placeholder=\"{{ 'e.g.' | translate }} {{ componentLabel | translate }}\"\n            name=\"title\"\n            type=\"text\"\n            required\n            [(ngModel)]=\"selected?.data.title\"\n          />\n        </c8y-form-group>\n      </div>\n\n      <c8y-ui-empty-state\n        class=\"p-24\"\n        [icon]=\"'settings'\"\n        [title]=\"'No configuration needed.' | translate\"\n        [subtitle]=\"'This widget does not need any specific configuration.' | translate\"\n        [horizontal]=\"true\"\n        *ngIf=\"!(widgetConfigService.hasConfig$ | async)\"\n      ></c8y-ui-empty-state>\n      <div>\n        <form\n          name=\"form\"\n          #configForm=\"ngForm\"\n        >\n          <ng-container *ngIf=\"widgetConfigService.hasConfig$ | async\">\n            <ng-container *ngIf=\"widgetConfigService.providers$ | async as providers\">\n              <ng-container\n                *c8yComponentOutlet=\"widgetConfigRoot; providers: providers\"\n              ></ng-container>\n            </ng-container>\n          </ng-container>\n        </form>\n      </div>\n    </div>\n    <div\n      class=\"inner-scroll p-32 p-t-0\"\n      right-pane\n    >\n      <c8y-widget-preview [previewClasses]=\"getStyle(true)\"></c8y-widget-preview>\n\n      <c8y-appearance-settings\n        [(themeClass)]=\"styling.contentClass\"\n        [(headerClass)]=\"styling.headerClass\"\n        [possibleStylingTheme]=\"possibleStyling.WIDGET_CONTENT_CLASSES\"\n        [possibleStylingHeader]=\"possibleStyling.WIDGET_HEADER_CLASSES\"\n        [defaultThemeClass]=\"defaultStyling.contentClass\"\n        [defaultHeaderClass]=\"defaultStyling.headerClass\"\n        [columns]=\"2\"\n      ></c8y-appearance-settings>\n    </div>\n  </c8y-resizable-grid>\n  <div class=\"card-footer separator text-center\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"widget-config--cancel-widget\"\n      (click)=\"close()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"submit\"\n      data-cy=\"widget-config--save-widget\"\n      (click)=\"save()\"\n      [disabled]=\"(contextDashboardService.formDisabled$ | async) || isSaveDisabled()\"\n      c8yProductExperience\n      [actionName]=\"current ? 'editWidget' : 'createWidget'\"\n      [actionData]=\"{ widgetName: selected && selected.id }\"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</ng-container>\n" }]
         }], ctorParameters: () => [{ type: WidgetService }, { type: i2.BottomDrawerRef }, { type: ContextDashboardService }, { type: WidgetConfigService }], propDecorators: { configForm: [{
                 type: ViewChild,
                 args: ['configForm', { static: false }]