@colijnit/corecomponents_v12 254.1.2 → 254.1.4

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -11370,6 +11370,9 @@
         // for single select
         ListOfValuesPopupComponent.prototype.selectOptionAndClosePopup = function () {
             var _this = this;
+            if (this.viewModels.length === 1) {
+                this.selectNextOption();
+            }
             if (!this.model && this.searchTerm) {
                 var wishModel = this.viewModelsMain.find(function (vmm) { return vmm.model[_this.displayField] === _this.searchTerm; });
                 if (wishModel) {
@@ -11457,7 +11460,7 @@
     ListOfValuesPopupComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-list-of-values-popup',
-                    template: "\n        <div class=\"lov-options\" [overlay]=\"parentForOverlay\" [inheritWidth]=\"true\" [ngClass]=\"customCssClass\" id=\"lov-popup\"\n             role=\"listbox\" [tabindex]=\"-1\"\n             (clickOutside)=\"closePopup.emit($event)\">\n            <co-input-search *ngIf=\"multiselect\"\n                             tabindex=\"-1\"\n                             [(model)]=\"searchTerm\"\n                             [placeholder]=\"searchPlaceholder\"\n                             (keydown)=\"handleInputKeyDown($event)\"\n                             (modelChange)=\"filterViewModels()\"></co-input-search>\n            <ul class=\"dropdown-list\" #dropDownList>\n                <li #lovItem *ngFor=\"let viewModel of viewModels; let index = index\" [class.selected]=\"viewModel === highLightModel\"\n                    (click)=\"selectViewModel(viewModel, !multiselect)\" role=\"option\">\n                    <ng-container *ngIf=\"!multiselect\">\n                        <span class=\"lov-options-text\" [textContent]=\"viewModel.model[displayField]\"></span>\n                    </ng-container>\n                    <ng-container *ngIf=\"multiselect\">\n                        <co-input-checkbox [model]=\"viewModel.checked\" (modelChange)=\"selectViewModel(viewModel, false)\"></co-input-checkbox>\n                        <span class=\"lov-options-text\" [textContent]=\"viewModel.model[displayField]\"></span>\n                    </ng-container>\n                </li>\n            </ul>\n        </div>\n    ",
+                    template: "\n    <div class=\"lov-options\" [overlay]=\"parentForOverlay\" [inheritWidth]=\"true\" [ngClass]=\"customCssClass\"\n         id=\"lov-popup\"\n         role=\"listbox\" [tabindex]=\"-1\"\n         (clickOutside)=\"closePopup.emit($event)\">\n      <co-input-search *ngIf=\"multiselect\"\n                       tabindex=\"-1\"\n                       [(model)]=\"searchTerm\"\n                       [placeholder]=\"searchPlaceholder\"\n                       (keydown)=\"handleInputKeyDown($event)\"\n                       (modelChange)=\"filterViewModels()\"></co-input-search>\n      <ul class=\"dropdown-list\" #dropDownList>\n        <li\n          #lovItem\n          *ngFor=\"let viewModel of viewModels; let index = index\"\n          [class.selected]=\"viewModel === highLightModel || viewModels.length === 1\"\n          (click)=\"selectViewModel(viewModel, !multiselect)\"\n          role=\"option\">\n          <ng-container *ngIf=\"!multiselect\">\n            <span class=\"lov-options-text\" [textContent]=\"viewModel.model[displayField]\"></span>\n          </ng-container>\n          <ng-container *ngIf=\"multiselect\">\n            <co-input-checkbox [model]=\"viewModel.checked\"\n                               (modelChange)=\"selectViewModel(viewModel, false)\"></co-input-checkbox>\n            <span class=\"lov-options-text\" [textContent]=\"viewModel.model[displayField]\"></span>\n          </ng-container>\n        </li>\n      </ul>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -11817,6 +11820,75 @@
                 },] }
     ];
 
+    var ListOfIconsComponent = /** @class */ (function () {
+        function ListOfIconsComponent(icons) {
+            this.icons = icons;
+            this.Icon = exports.CoreComponentsIcon;
+            this.showMenu = false;
+            this._collection = [];
+        }
+        Object.defineProperty(ListOfIconsComponent.prototype, "collection", {
+            get: function () {
+                return this._collection;
+            },
+            set: function (value) {
+                this._collection = value || [];
+            },
+            enumerable: false,
+            configurable: true
+        });
+        ListOfIconsComponent.prototype.showClass = function () {
+            return true;
+        };
+        ListOfIconsComponent.prototype.ngOnInit = function () {
+            console.log(this.collection);
+            this.activeItem = this.collection[0];
+        };
+        ListOfIconsComponent.prototype.toggleMenu = function () {
+            this.showMenu = !this.showMenu;
+        };
+        ListOfIconsComponent.prototype.selectItem = function (item) {
+            this.activeItem = item;
+            this.showMenu = false;
+        };
+        return ListOfIconsComponent;
+    }());
+    ListOfIconsComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'co-list-of-icons',
+                    template: "\n    <div class=\"icon-item active\" [class.menu-opened]=\"showMenu\" (click)=\"toggleMenu()\">\n      <co-icon [iconData]=\"activeItem.icon\"></co-icon>\n      <div class=\"label\">{{ activeItem.label }}</div>\n      <co-icon class=\"drop-arrow\" [iconData]=\"icons.getIcon(Icon.ArrowPointDown)\"></co-icon>\n    </div>\n    <div class=\"dropdown-menu\" *ngIf=\"showMenu\">\n      <div class=\"icon-item\" *ngFor=\"let item of collection\" (click)=\"selectItem(item)\" [class.active]=\"item === activeItem\">\n        <co-icon [iconData]=\"item.icon\"></co-icon>\n        <div class=\"label\">{{ item.label }}</div>\n      </div>\n    </div>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    ListOfIconsComponent.ctorParameters = function () { return [
+        { type: IconCacheService }
+    ]; };
+    ListOfIconsComponent.propDecorators = {
+        collection: [{ type: i0.Input }],
+        showClass: [{ type: i0.HostBinding, args: ['class.co-list-of-icons',] }]
+    };
+
+    var ListOfIconsModule = /** @class */ (function () {
+        function ListOfIconsModule() {
+        }
+        return ListOfIconsModule;
+    }());
+    ListOfIconsModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        forms.FormsModule,
+                        IconModule
+                    ],
+                    declarations: [
+                        ListOfIconsComponent
+                    ],
+                    exports: [
+                        ListOfIconsComponent
+                    ]
+                },] }
+    ];
+
     var ResponsiveTextComponent = /** @class */ (function () {
         function ResponsiveTextComponent() {
         }
@@ -14093,6 +14165,8 @@
     exports.InputTextareaModule = InputTextareaModule;
     exports.LevelIndicatorComponent = LevelIndicatorComponent;
     exports.LevelIndicatorModule = LevelIndicatorModule;
+    exports.ListOfIconsComponent = ListOfIconsComponent;
+    exports.ListOfIconsModule = ListOfIconsModule;
     exports.ListOfValuesComponent = ListOfValuesComponent;
     exports.ListOfValuesModule = ListOfValuesModule;
     exports.ListOfValuesPopupComponent = ListOfValuesPopupComponent;