@colijnit/corecomponents_v12 254.1.8 → 254.1.10

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -11823,7 +11823,7 @@
     var ListOfIconsComponent = /** @class */ (function () {
         function ListOfIconsComponent(icons) {
             this.icons = icons;
-            this.iconSize = 30;
+            this.iconSize = 25;
             this.itemSelected = new i0.EventEmitter();
             this.Icon = exports.CoreComponentsIcon;
             this.showMenu = false;
@@ -11843,7 +11843,9 @@
             return true;
         };
         ListOfIconsComponent.prototype.ngOnInit = function () {
-            this.activeItem = this.collection[0];
+            if (this.activeItem === undefined) {
+                this.activeItem = this.collection[0];
+            }
         };
         ListOfIconsComponent.prototype.toggleMenu = function () {
             this.showMenu = !this.showMenu;
@@ -11858,7 +11860,7 @@
     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\" [style.width.px]=\"iconSize\" [style.height.px]=\"iconSize\"></co-icon>\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\" [style.width.px]=\"iconSize\" [style.height.px]=\"iconSize\"></co-icon>\n        <div class=\"label\">{{ item.label }}</div>\n      </div>\n    </div>\n  ",
+                    template: "\n    <div class=\"icon-item active\" [class.menu-opened]=\"showMenu\" (click)=\"toggleMenu()\">\n      <co-icon [iconData]=\"activeItem.icon\" [style.width.px]=\"iconSize\" [style.height.px]=\"iconSize\"></co-icon>\n      <co-icon class=\"drop-arrow\" [iconData]=\"icons.getIcon(Icon.ArrowPointDown)\"></co-icon>\n    </div>\n    <div class=\"dropdown-menu\" *ngIf=\"showMenu\" (clickOutside)=\"showMenu = false\">\n      <div class=\"icon-item\" *ngFor=\"let item of collection\" (click)=\"selectItem(item)\" [class.active]=\"item === activeItem\">\n        <co-icon [iconData]=\"item.icon\" [style.width.px]=\"iconSize\" [style.height.px]=\"iconSize\"></co-icon>\n        <div class=\"label\">{{ item.label }}</div>\n      </div>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -11868,6 +11870,7 @@
     ListOfIconsComponent.propDecorators = {
         collection: [{ type: i0.Input }],
         iconSize: [{ type: i0.Input }],
+        activeItem: [{ type: i0.Input }],
         itemSelected: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ['class.co-list-of-icons',] }]
     };
@@ -11882,7 +11885,8 @@
                     imports: [
                         common.CommonModule,
                         forms.FormsModule,
-                        IconModule
+                        IconModule,
+                        ClickoutsideModule
                     ],
                     declarations: [
                         ListOfIconsComponent