@c8y/ngx-components 1023.14.2 → 1023.14.8

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.
@@ -2971,6 +2971,18 @@ const MESSAGES_CORE_I18N = {
2971
2971
  placeholders: {
2972
2972
  revokedSerials: '$1'
2973
2973
  }
2974
+ },
2975
+ "^Certificate serial number hex: '(.+?)'.*$": {
2976
+ gettext: gettext$1('Certificate serial number: "{{ serialNumber }}"'),
2977
+ placeholders: {
2978
+ serialNumber: '$1'
2979
+ }
2980
+ },
2981
+ '^Tenant certificate authority\\(CA\\) signed certificate for device: (.+?)\\.$': {
2982
+ gettext: gettext$1('Tenant certificate authority (CA) signed certificate for device: "{{ deviceId }}".'),
2983
+ placeholders: {
2984
+ deviceId: '$1'
2985
+ }
2974
2986
  }
2975
2987
  };
2976
2988
 
@@ -11604,6 +11616,55 @@ class DynamicBulkIIdentifiedResolver extends DynamicBulkDetailsResolver {
11604
11616
  }
11605
11617
  }
11606
11618
 
11619
+ class MOChunkLoaderService {
11620
+ constructor(inventory) {
11621
+ this.inventory = inventory;
11622
+ }
11623
+ async processInChunks(ids, chunkSize, loadChunkFn) {
11624
+ if (!ids.length) {
11625
+ return { results: [], errors: [] };
11626
+ }
11627
+ const promiseArray = [];
11628
+ const idsCopy = [...ids];
11629
+ while (idsCopy.length) {
11630
+ const batch = idsCopy.splice(0, chunkSize);
11631
+ promiseArray.push(loadChunkFn(batch));
11632
+ }
11633
+ const chunkResults = await Promise.all(promiseArray);
11634
+ const results = chunkResults.flatMap(r => r.managedObjects);
11635
+ const errors = chunkResults.flatMap(r => r.errors);
11636
+ return { results, errors };
11637
+ }
11638
+ async loadAChunkOfManagedObjectsBase(uniqIds, inventory, pageSize, getStatusDetails, queryFilter) {
11639
+ const { data: managedObjects } = await inventory.list(Object.assign({}, queryFilter || {}, {
11640
+ ids: uniqIds.join(),
11641
+ pageSize
11642
+ }));
11643
+ const notFoundMOs = uniqIds.filter(id => !managedObjects.find(tmp => tmp.id === id));
11644
+ if (notFoundMOs.length) {
11645
+ const promArray = notFoundMOs.map(id => getStatusDetails(id));
11646
+ const res = await Promise.all(promArray);
11647
+ return { managedObjects, errors: res };
11648
+ }
11649
+ return { managedObjects, errors: [] };
11650
+ }
11651
+ async getStatusDetails(moId) {
11652
+ try {
11653
+ const res = await this.inventory.detail(moId);
11654
+ return { id: moId, ...pick(res.res, ['status', 'statusText']) };
11655
+ }
11656
+ catch (e) {
11657
+ return { id: moId, ...pick(e.res, ['status', 'statusText']) };
11658
+ }
11659
+ }
11660
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MOChunkLoaderService, deps: [{ token: i1.InventoryService }], target: i0.ɵɵFactoryTarget.Injectable }); }
11661
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MOChunkLoaderService, providedIn: 'root' }); }
11662
+ }
11663
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MOChunkLoaderService, decorators: [{
11664
+ type: Injectable,
11665
+ args: [{ providedIn: 'root' }]
11666
+ }], ctorParameters: () => [{ type: i1.InventoryService }] });
11667
+
11607
11668
  /**
11608
11669
  * A DynamicDetailsResolver responsible to resolve managedObjects for dynamic components.
11609
11670
  * This service implements bulk resolving. This reduces the number of requests made to
@@ -11748,55 +11809,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
11748
11809
  args: [{ providedIn: 'root' }]
11749
11810
  }] });
11750
11811
 
11751
- class MOChunkLoaderService {
11752
- constructor(inventory) {
11753
- this.inventory = inventory;
11754
- }
11755
- async processInChunks(ids, chunkSize, loadChunkFn) {
11756
- if (!ids.length) {
11757
- return { results: [], errors: [] };
11758
- }
11759
- const promiseArray = [];
11760
- const idsCopy = [...ids];
11761
- while (idsCopy.length) {
11762
- const batch = idsCopy.splice(0, chunkSize);
11763
- promiseArray.push(loadChunkFn(batch));
11764
- }
11765
- const chunkResults = await Promise.all(promiseArray);
11766
- const results = chunkResults.flatMap(r => r.managedObjects);
11767
- const errors = chunkResults.flatMap(r => r.errors);
11768
- return { results, errors };
11769
- }
11770
- async loadAChunkOfManagedObjectsBase(uniqIds, inventory, pageSize, getStatusDetails, queryFilter) {
11771
- const { data: managedObjects } = await inventory.list(Object.assign({}, queryFilter || {}, {
11772
- ids: uniqIds.join(),
11773
- pageSize
11774
- }));
11775
- const notFoundMOs = uniqIds.filter(id => !managedObjects.find(tmp => tmp.id === id));
11776
- if (notFoundMOs.length) {
11777
- const promArray = notFoundMOs.map(id => getStatusDetails(id));
11778
- const res = await Promise.all(promArray);
11779
- return { managedObjects, errors: res };
11780
- }
11781
- return { managedObjects, errors: [] };
11782
- }
11783
- async getStatusDetails(moId) {
11784
- try {
11785
- const res = await this.inventory.detail(moId);
11786
- return { id: moId, ...pick(res.res, ['status', 'statusText']) };
11787
- }
11788
- catch (e) {
11789
- return { id: moId, ...pick(e.res, ['status', 'statusText']) };
11790
- }
11791
- }
11792
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MOChunkLoaderService, deps: [{ token: i1.InventoryService }], target: i0.ɵɵFactoryTarget.Injectable }); }
11793
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MOChunkLoaderService, providedIn: 'root' }); }
11794
- }
11795
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MOChunkLoaderService, decorators: [{
11796
- type: Injectable,
11797
- args: [{ providedIn: 'root' }]
11798
- }], ctorParameters: () => [{ type: i1.InventoryService }] });
11799
-
11800
11812
  class AppSwitcherService {
11801
11813
  constructor(ui) {
11802
11814
  this.ui = ui;
@@ -21745,7 +21757,7 @@ class SelectComponent {
21745
21757
  multi: true
21746
21758
  },
21747
21759
  SelectKeyboardService
21748
- ], queries: [{ propertyName: "projectedSelectedItems", first: true, predicate: SelectedItemsDirective, descendants: true }, { propertyName: "projectedSelectableItems", predicate: SelectItemDirective }], viewQueries: [{ propertyName: "searchControl", first: true, predicate: ["searchControl"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "list", predicate: ListItemComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"c8y-search-dropdown dropdown fit-w\"\n placement=\"bottom left\"\n dropdown\n [container]=\"container\"\n #dropdown=\"bs-dropdown\"\n [autoClose]=\"autoClose\"\n [isDisabled]=\"disabled\"\n [insideClick]=\"insideClick\"\n (onShown)=\"onShown()\"\n (onHidden)=\"onHidden()\"\n dropdownToggle\n (click)=\"open()\"\n>\n <div\n class=\"input-group input-group-dropdown\"\n role=\"button\"\n >\n <div\n class=\"form-control text-truncate\"\n [ngClass]=\"{\n 'm-r-80': canDeselect && selected.length > 0,\n 'm-r-40': !canDeselect || selected.length === 0,\n 'text-truncate': !multi,\n 'inner-scroll d-flex a-i-center': multi\n }\"\n >\n <!-- rendering of selected items (with content projection) -->\n @if (projectedSelectedItems) {\n <div class=\"selected-items\">\n @for (selectedItem of selected; track selectedItem) {\n <ng-container\n *ngTemplateOutlet=\"\n projectedSelectedItems.templateRef;\n context: { $implicit: selectedItem }\n \"\n ></ng-container>\n }\n </div>\n @if (selected.length === 0 && !searchHasFocus && searchControl.value.length === 0) {\n <i class=\"text-muted\">\n {{ placeholder | translate }}\n </i>\n }\n } @else {\n <div class=\"selected-items\">\n @if (!multi) {\n @if (searchHasFocus && preselectedItem && !filterItems) {\n <span>{{ preselectedItem.label | translate }}</span>\n }\n @if (!searchHasFocus && selected.length === 1) {\n <span>{{ selected[0].label | translate }}</span>\n }\n }\n @if (selected.length === 0 && !preselectedItem && searchControl.value.length === 0) {\n <i class=\"text-muted\">\n {{ placeholder | translate }}\n </i>\n }\n @if (multi) {\n <span class=\"m-r-4\">{{ searchControl.value }}</span>\n @for (selectedItem of selected; track selectedItem) {\n <span class=\"tag tag--info chip\">\n <button\n class=\"btn btn-xs btn-clean text-10 m-r-4\"\n title=\"{{ selectedItem.label | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"\n $event.preventDefault(); $event.stopPropagation(); deselect(selectedItem)\n \"\n >\n <i c8yIcon=\"times\"></i>\n </button>\n {{ selectedItem.label | translate }}\n </span>\n }\n }\n </div>\n }\n </div>\n\n <input\n class=\"form-control text-truncate\"\n type=\"text\"\n autocomplete=\"off\"\n #searchControl\n [ngClass]=\"{\n 'p-absolute': true,\n 'm-r-80': canDeselect && selected.length > 0,\n 'm-r-40': !canDeselect || selected.length === 0\n }\"\n [required]=\"required\"\n (blur)=\"doBlur()\"\n (focus)=\"doFocus()\"\n [name]=\"name\"\n [disabled]=\"disabled\"\n />\n\n <span class=\"input-group-btn\">\n <!-- this button is displayed only if we have something selected and are allowed to deselect -->\n @if (canDeselect && selected.length > 0) {\n <button\n class=\"btn btn-dot\"\n title=\"{{ 'Deselect' | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); deselectAll()\"\n data-cy=\"deselect-all-button\"\n >\n <i c8yIcon=\"times\"></i>\n </button>\n }\n <button\n class=\"btn btn-dot\"\n title=\"{{ 'Search' | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"onIconClick.emit({ icon, $event })\"\n data-cy=\"select-button\"\n >\n <i\n class=\"text-primary\"\n [c8yIcon]=\"icon\"\n ></i>\n </button>\n </span>\n </div>\n\n <c8y-list-group\n class=\"dropdown-menu dropdown-menu--modal dropdown-menu--select\"\n [style.width]=\"container === 'body' ? searchControl.parentNode.clientWidth + 'px' : undefined\"\n role=\"menu\"\n data-cy=\"select--dropdown-menu\"\n *dropdownMenu\n >\n <!-- rendering of items (default) -->\n @for (item of filterItems ? (items | filterBy: searchControl.value) : items; track item) {\n <c8y-li\n style=\"cursor: pointer\"\n [selectable]=\"true\"\n [dense]=\"true\"\n [active]=\"!multi && item.value === selected[0]?.value\"\n (click)=\"select(item)\"\n >\n <span [attr.data-search-label]=\"item.label | translate\"></span>\n @if (multi) {\n <c8y-li-checkbox\n [selected]=\"selected.indexOf(item) > -1\"\n (click)=\"$event.preventDefault()\"\n ></c8y-li-checkbox>\n }\n @if (!item.template) {\n <c8y-li-body>\n {{ item.label | translate }}\n </c8y-li-body>\n }\n <ng-container\n *ngTemplateOutlet=\"item?.template\"\n ngProjectAs=\"c8y-li-body\"\n ></ng-container>\n </c8y-li>\n }\n <ng-content select=\"div\"></ng-content>\n </c8y-list-group>\n</div>\n", dependencies: [{ kind: "ngmodule", type: BsDropdownModule }, { kind: "directive", type: i1$4.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i1$4.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i1$4.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemCheckboxComponent, selector: "c8y-list-item-checkbox, c8y-li-checkbox", inputs: ["selected", "indeterminate", "disabled", "displayAsSwitch"], outputs: ["onSelect"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: FilterByPipe, name: "filterBy" }] }); }
21760
+ ], queries: [{ propertyName: "projectedSelectedItems", first: true, predicate: SelectedItemsDirective, descendants: true }, { propertyName: "projectedSelectableItems", predicate: SelectItemDirective }], viewQueries: [{ propertyName: "searchControl", first: true, predicate: ["searchControl"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "list", predicate: ListItemComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"c8y-search-dropdown dropdown fit-w\"\n placement=\"bottom left\"\n dropdown\n [container]=\"container\"\n #dropdown=\"bs-dropdown\"\n [autoClose]=\"autoClose\"\n [isDisabled]=\"disabled\"\n [insideClick]=\"insideClick\"\n (onShown)=\"onShown()\"\n (onHidden)=\"onHidden()\"\n dropdownToggle\n (click)=\"open()\"\n>\n <div\n class=\"input-group input-group-dropdown\"\n role=\"button\"\n >\n <div\n class=\"form-control text-truncate\"\n [ngClass]=\"{\n 'm-r-80': canDeselect && selected.length > 0,\n 'm-r-40': !canDeselect || selected.length === 0,\n 'text-truncate': !multi,\n 'inner-scroll d-flex a-i-center': multi\n }\"\n >\n <!-- rendering of selected items (with content projection) -->\n @if (projectedSelectedItems) {\n <div class=\"selected-items\">\n @for (selectedItem of selected; track selectedItem) {\n <ng-container\n *ngTemplateOutlet=\"\n projectedSelectedItems.templateRef;\n context: { $implicit: selectedItem }\n \"\n ></ng-container>\n }\n </div>\n @if (selected.length === 0 && !searchHasFocus && searchControl.value.length === 0) {\n <i class=\"text-muted\">\n {{ placeholder | translate }}\n </i>\n }\n } @else {\n <div class=\"selected-items\">\n @if (!multi) {\n <!-- hidden is needed, otherwise the propagation does not work correctly -->\n <span [hidden]=\"!searchHasFocus || !preselectedItem || filterItems\">\n {{ preselectedItem?.label | translate }}\n </span>\n <span [hidden]=\"searchHasFocus || selected.length !== 1\">\n {{ selected[0]?.label | translate }}\n </span>\n }\n @if (selected.length === 0 && !preselectedItem && searchControl.value.length === 0) {\n <i class=\"text-muted\">\n {{ placeholder | translate }}\n </i>\n }\n @if (multi) {\n <span class=\"m-r-4\">{{ searchControl.value }}</span>\n @for (selectedItem of selected; track selectedItem) {\n <span class=\"tag tag--info chip\">\n <button\n class=\"btn btn-xs btn-clean text-10 m-r-4\"\n title=\"{{ selectedItem.label | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"\n $event.preventDefault(); $event.stopPropagation(); deselect(selectedItem)\n \"\n >\n <i c8yIcon=\"times\"></i>\n </button>\n {{ selectedItem.label | translate }}\n </span>\n }\n }\n </div>\n }\n </div>\n\n <input\n class=\"form-control text-truncate\"\n type=\"text\"\n autocomplete=\"off\"\n #searchControl\n [ngClass]=\"{\n 'p-absolute': true,\n 'm-r-80': canDeselect && selected.length > 0,\n 'm-r-40': !canDeselect || selected.length === 0\n }\"\n [required]=\"required\"\n (blur)=\"doBlur()\"\n (focus)=\"doFocus()\"\n [name]=\"name\"\n [disabled]=\"disabled\"\n />\n\n <span class=\"input-group-btn\">\n <!-- this button is displayed only if we have something selected and are allowed to deselect -->\n @if (canDeselect && selected.length > 0) {\n <button\n class=\"btn btn-dot\"\n title=\"{{ 'Deselect' | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); deselectAll()\"\n data-cy=\"deselect-all-button\"\n >\n <i c8yIcon=\"times\"></i>\n </button>\n }\n <button\n class=\"btn btn-dot\"\n title=\"{{ 'Search' | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"onIconClick.emit({ icon, $event })\"\n data-cy=\"select-button\"\n >\n <i\n class=\"text-primary\"\n [c8yIcon]=\"icon\"\n ></i>\n </button>\n </span>\n </div>\n\n <c8y-list-group\n class=\"dropdown-menu dropdown-menu--modal dropdown-menu--select\"\n [style.width]=\"container === 'body' ? searchControl.parentNode.clientWidth + 'px' : undefined\"\n role=\"menu\"\n data-cy=\"select--dropdown-menu\"\n *dropdownMenu\n >\n <!-- rendering of items (default) -->\n @for (item of filterItems ? (items | filterBy: searchControl.value) : items; track item) {\n <c8y-li\n style=\"cursor: pointer\"\n [selectable]=\"true\"\n [dense]=\"true\"\n [active]=\"!multi && item.value === selected[0]?.value\"\n (click)=\"select(item)\"\n >\n <span [attr.data-search-label]=\"item.label | translate\"></span>\n @if (multi) {\n <c8y-li-checkbox\n [selected]=\"selected.indexOf(item) > -1\"\n (click)=\"$event.preventDefault()\"\n ></c8y-li-checkbox>\n }\n @if (!item.template) {\n <c8y-li-body>\n {{ item.label | translate }}\n </c8y-li-body>\n }\n <ng-container\n *ngTemplateOutlet=\"item?.template\"\n ngProjectAs=\"c8y-li-body\"\n ></ng-container>\n </c8y-li>\n }\n <ng-content select=\"div\"></ng-content>\n </c8y-list-group>\n</div>\n", dependencies: [{ kind: "ngmodule", type: BsDropdownModule }, { kind: "directive", type: i1$4.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i1$4.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i1$4.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemCheckboxComponent, selector: "c8y-list-item-checkbox, c8y-li-checkbox", inputs: ["selected", "indeterminate", "disabled", "displayAsSwitch"], outputs: ["onSelect"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: FilterByPipe, name: "filterBy" }] }); }
21749
21761
  }
21750
21762
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SelectComponent, decorators: [{
21751
21763
  type: Component,
@@ -21773,7 +21785,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
21773
21785
  ListItemBodyComponent,
21774
21786
  C8yTranslatePipe,
21775
21787
  FilterByPipe
21776
- ], template: "<div\n class=\"c8y-search-dropdown dropdown fit-w\"\n placement=\"bottom left\"\n dropdown\n [container]=\"container\"\n #dropdown=\"bs-dropdown\"\n [autoClose]=\"autoClose\"\n [isDisabled]=\"disabled\"\n [insideClick]=\"insideClick\"\n (onShown)=\"onShown()\"\n (onHidden)=\"onHidden()\"\n dropdownToggle\n (click)=\"open()\"\n>\n <div\n class=\"input-group input-group-dropdown\"\n role=\"button\"\n >\n <div\n class=\"form-control text-truncate\"\n [ngClass]=\"{\n 'm-r-80': canDeselect && selected.length > 0,\n 'm-r-40': !canDeselect || selected.length === 0,\n 'text-truncate': !multi,\n 'inner-scroll d-flex a-i-center': multi\n }\"\n >\n <!-- rendering of selected items (with content projection) -->\n @if (projectedSelectedItems) {\n <div class=\"selected-items\">\n @for (selectedItem of selected; track selectedItem) {\n <ng-container\n *ngTemplateOutlet=\"\n projectedSelectedItems.templateRef;\n context: { $implicit: selectedItem }\n \"\n ></ng-container>\n }\n </div>\n @if (selected.length === 0 && !searchHasFocus && searchControl.value.length === 0) {\n <i class=\"text-muted\">\n {{ placeholder | translate }}\n </i>\n }\n } @else {\n <div class=\"selected-items\">\n @if (!multi) {\n @if (searchHasFocus && preselectedItem && !filterItems) {\n <span>{{ preselectedItem.label | translate }}</span>\n }\n @if (!searchHasFocus && selected.length === 1) {\n <span>{{ selected[0].label | translate }}</span>\n }\n }\n @if (selected.length === 0 && !preselectedItem && searchControl.value.length === 0) {\n <i class=\"text-muted\">\n {{ placeholder | translate }}\n </i>\n }\n @if (multi) {\n <span class=\"m-r-4\">{{ searchControl.value }}</span>\n @for (selectedItem of selected; track selectedItem) {\n <span class=\"tag tag--info chip\">\n <button\n class=\"btn btn-xs btn-clean text-10 m-r-4\"\n title=\"{{ selectedItem.label | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"\n $event.preventDefault(); $event.stopPropagation(); deselect(selectedItem)\n \"\n >\n <i c8yIcon=\"times\"></i>\n </button>\n {{ selectedItem.label | translate }}\n </span>\n }\n }\n </div>\n }\n </div>\n\n <input\n class=\"form-control text-truncate\"\n type=\"text\"\n autocomplete=\"off\"\n #searchControl\n [ngClass]=\"{\n 'p-absolute': true,\n 'm-r-80': canDeselect && selected.length > 0,\n 'm-r-40': !canDeselect || selected.length === 0\n }\"\n [required]=\"required\"\n (blur)=\"doBlur()\"\n (focus)=\"doFocus()\"\n [name]=\"name\"\n [disabled]=\"disabled\"\n />\n\n <span class=\"input-group-btn\">\n <!-- this button is displayed only if we have something selected and are allowed to deselect -->\n @if (canDeselect && selected.length > 0) {\n <button\n class=\"btn btn-dot\"\n title=\"{{ 'Deselect' | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); deselectAll()\"\n data-cy=\"deselect-all-button\"\n >\n <i c8yIcon=\"times\"></i>\n </button>\n }\n <button\n class=\"btn btn-dot\"\n title=\"{{ 'Search' | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"onIconClick.emit({ icon, $event })\"\n data-cy=\"select-button\"\n >\n <i\n class=\"text-primary\"\n [c8yIcon]=\"icon\"\n ></i>\n </button>\n </span>\n </div>\n\n <c8y-list-group\n class=\"dropdown-menu dropdown-menu--modal dropdown-menu--select\"\n [style.width]=\"container === 'body' ? searchControl.parentNode.clientWidth + 'px' : undefined\"\n role=\"menu\"\n data-cy=\"select--dropdown-menu\"\n *dropdownMenu\n >\n <!-- rendering of items (default) -->\n @for (item of filterItems ? (items | filterBy: searchControl.value) : items; track item) {\n <c8y-li\n style=\"cursor: pointer\"\n [selectable]=\"true\"\n [dense]=\"true\"\n [active]=\"!multi && item.value === selected[0]?.value\"\n (click)=\"select(item)\"\n >\n <span [attr.data-search-label]=\"item.label | translate\"></span>\n @if (multi) {\n <c8y-li-checkbox\n [selected]=\"selected.indexOf(item) > -1\"\n (click)=\"$event.preventDefault()\"\n ></c8y-li-checkbox>\n }\n @if (!item.template) {\n <c8y-li-body>\n {{ item.label | translate }}\n </c8y-li-body>\n }\n <ng-container\n *ngTemplateOutlet=\"item?.template\"\n ngProjectAs=\"c8y-li-body\"\n ></ng-container>\n </c8y-li>\n }\n <ng-content select=\"div\"></ng-content>\n </c8y-list-group>\n</div>\n" }]
21788
+ ], template: "<div\n class=\"c8y-search-dropdown dropdown fit-w\"\n placement=\"bottom left\"\n dropdown\n [container]=\"container\"\n #dropdown=\"bs-dropdown\"\n [autoClose]=\"autoClose\"\n [isDisabled]=\"disabled\"\n [insideClick]=\"insideClick\"\n (onShown)=\"onShown()\"\n (onHidden)=\"onHidden()\"\n dropdownToggle\n (click)=\"open()\"\n>\n <div\n class=\"input-group input-group-dropdown\"\n role=\"button\"\n >\n <div\n class=\"form-control text-truncate\"\n [ngClass]=\"{\n 'm-r-80': canDeselect && selected.length > 0,\n 'm-r-40': !canDeselect || selected.length === 0,\n 'text-truncate': !multi,\n 'inner-scroll d-flex a-i-center': multi\n }\"\n >\n <!-- rendering of selected items (with content projection) -->\n @if (projectedSelectedItems) {\n <div class=\"selected-items\">\n @for (selectedItem of selected; track selectedItem) {\n <ng-container\n *ngTemplateOutlet=\"\n projectedSelectedItems.templateRef;\n context: { $implicit: selectedItem }\n \"\n ></ng-container>\n }\n </div>\n @if (selected.length === 0 && !searchHasFocus && searchControl.value.length === 0) {\n <i class=\"text-muted\">\n {{ placeholder | translate }}\n </i>\n }\n } @else {\n <div class=\"selected-items\">\n @if (!multi) {\n <!-- hidden is needed, otherwise the propagation does not work correctly -->\n <span [hidden]=\"!searchHasFocus || !preselectedItem || filterItems\">\n {{ preselectedItem?.label | translate }}\n </span>\n <span [hidden]=\"searchHasFocus || selected.length !== 1\">\n {{ selected[0]?.label | translate }}\n </span>\n }\n @if (selected.length === 0 && !preselectedItem && searchControl.value.length === 0) {\n <i class=\"text-muted\">\n {{ placeholder | translate }}\n </i>\n }\n @if (multi) {\n <span class=\"m-r-4\">{{ searchControl.value }}</span>\n @for (selectedItem of selected; track selectedItem) {\n <span class=\"tag tag--info chip\">\n <button\n class=\"btn btn-xs btn-clean text-10 m-r-4\"\n title=\"{{ selectedItem.label | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"\n $event.preventDefault(); $event.stopPropagation(); deselect(selectedItem)\n \"\n >\n <i c8yIcon=\"times\"></i>\n </button>\n {{ selectedItem.label | translate }}\n </span>\n }\n }\n </div>\n }\n </div>\n\n <input\n class=\"form-control text-truncate\"\n type=\"text\"\n autocomplete=\"off\"\n #searchControl\n [ngClass]=\"{\n 'p-absolute': true,\n 'm-r-80': canDeselect && selected.length > 0,\n 'm-r-40': !canDeselect || selected.length === 0\n }\"\n [required]=\"required\"\n (blur)=\"doBlur()\"\n (focus)=\"doFocus()\"\n [name]=\"name\"\n [disabled]=\"disabled\"\n />\n\n <span class=\"input-group-btn\">\n <!-- this button is displayed only if we have something selected and are allowed to deselect -->\n @if (canDeselect && selected.length > 0) {\n <button\n class=\"btn btn-dot\"\n title=\"{{ 'Deselect' | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"$event.preventDefault(); $event.stopPropagation(); deselectAll()\"\n data-cy=\"deselect-all-button\"\n >\n <i c8yIcon=\"times\"></i>\n </button>\n }\n <button\n class=\"btn btn-dot\"\n title=\"{{ 'Search' | translate }}\"\n type=\"button\"\n [disabled]=\"disabled\"\n (click)=\"onIconClick.emit({ icon, $event })\"\n data-cy=\"select-button\"\n >\n <i\n class=\"text-primary\"\n [c8yIcon]=\"icon\"\n ></i>\n </button>\n </span>\n </div>\n\n <c8y-list-group\n class=\"dropdown-menu dropdown-menu--modal dropdown-menu--select\"\n [style.width]=\"container === 'body' ? searchControl.parentNode.clientWidth + 'px' : undefined\"\n role=\"menu\"\n data-cy=\"select--dropdown-menu\"\n *dropdownMenu\n >\n <!-- rendering of items (default) -->\n @for (item of filterItems ? (items | filterBy: searchControl.value) : items; track item) {\n <c8y-li\n style=\"cursor: pointer\"\n [selectable]=\"true\"\n [dense]=\"true\"\n [active]=\"!multi && item.value === selected[0]?.value\"\n (click)=\"select(item)\"\n >\n <span [attr.data-search-label]=\"item.label | translate\"></span>\n @if (multi) {\n <c8y-li-checkbox\n [selected]=\"selected.indexOf(item) > -1\"\n (click)=\"$event.preventDefault()\"\n ></c8y-li-checkbox>\n }\n @if (!item.template) {\n <c8y-li-body>\n {{ item.label | translate }}\n </c8y-li-body>\n }\n <ng-container\n *ngTemplateOutlet=\"item?.template\"\n ngProjectAs=\"c8y-li-body\"\n ></ng-container>\n </c8y-li>\n }\n <ng-content select=\"div\"></ng-content>\n </c8y-list-group>\n</div>\n" }]
21777
21789
  }], ctorParameters: () => [{ type: SelectKeyboardService }], propDecorators: { placeholder: [{
21778
21790
  type: Input
21779
21791
  }], items: [{
@@ -29050,7 +29062,7 @@ class DashboardChildChange {
29050
29062
  this.child = childToChange;
29051
29063
  }
29052
29064
  get resize$() {
29053
- return this.child.dragSource.moved.pipe(map(move => this.getPixelSize(move)), tap(resizeDimension => this.setPixelSize(resizeDimension)), map(resizeDimension => this.getDimensionSize(resizeDimension)), distinctUntilChanged((prev, next) => prev.width === next.width && prev.height === next.height), map(dimension => this.setDimension(dimension)), tap(() => console.log('Resize dimension:', this.child)), this.arrangePipe());
29065
+ return this.child.dragSource.moved.pipe(map(move => this.getPixelSize(move)), tap(resizeDimension => this.setPixelSize(resizeDimension)), map(resizeDimension => this.getDimensionSize(resizeDimension)), distinctUntilChanged((prev, next) => prev.width === next.width && prev.height === next.height), map(dimension => this.setDimension(dimension)), this.arrangePipe());
29054
29066
  }
29055
29067
  get drag$() {
29056
29068
  return this.child.dragSource.moved.pipe(map(move => this.getDimensionPosition(move)), filter(dimension => dimension.x >= 0 &&