@inera/ids-angular 2.5.0 → 3.0.0

package/bundles/inera-ids-angular.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@inera/ids-core/components/alert/register'), require('@angular/common'), require('@inera/ids-core/components/alert-global/register'), require('@inera/ids-core/components/agent/register'), require('@inera/ids-core/components/badge/register'), require('@inera/ids-core/components/button/register'), require('@inera/ids-core/components/button-group/register'), require('@inera/ids-core/components/carousel/register'), require('@angular/platform-browser'), require('@angular/router'), require('@inera/ids-core/components/breadcrumbs/register'), require('@inera/ids-core/components/card/register'), require('@inera/ids-core/components/date-label/register'), require('@inera/ids-core/components/dialog/register'), require('@inera/ids-core/components/expandable/register'), require('@inera/ids-core/components/icon/register'), require('@inera/ids-core/components/form/input/register'), require('@inera/ids-core/components/form/checkbox/register'), require('@inera/ids-core/components/form/checkbox-group/register'), require('@inera/ids-core/components/form/error-message/register'), require('@inera/ids-core/components/form/radio/register'), require('@inera/ids-core/components/form/range/register'), require('@inera/ids-core/components/form/select/register'), require('@inera/ids-core/components/form/select-multiple/register'), require('@inera/ids-core/components/form/spinner/register'), require('@inera/ids-core/components/form/time/register'), require('@inera/ids-core/components/form/textarea/register'), require('@inera/ids-core/components/grid/row/register'), require('@inera/ids-core/components/grid/column/register'), require('@inera/ids-core/components/grid/container/register'), require('@inera/ids-core/components/link/register'), require('@inera/ids-core/components/list/register'), require('@inera/ids-core/components/navigation/content/register'), require('@inera/ids-core/components/notification/badge/register'), require('@inera/ids-core/components/mobile/menu/register'), require('@inera/ids-core/components/popover/register'), require('@inera/ids-core/components/progressbar/register'), require('@inera/ids-core/components/footer/register'), require('@inera/ids-core/components/header/register'), require('@inera/ids-core/components/stepper/register'), require('@inera/ids-core/components/tabs/register'), require('@inera/ids-core/components/tag/register'), require('@inera/ids-core/components/tooltip/register')) :
-    typeof define === 'function' && define.amd ? define('@inera/ids-angular', ['exports', '@angular/core', '@inera/ids-core/components/alert/register', '@angular/common', '@inera/ids-core/components/alert-global/register', '@inera/ids-core/components/agent/register', '@inera/ids-core/components/badge/register', '@inera/ids-core/components/button/register', '@inera/ids-core/components/button-group/register', '@inera/ids-core/components/carousel/register', '@angular/platform-browser', '@angular/router', '@inera/ids-core/components/breadcrumbs/register', '@inera/ids-core/components/card/register', '@inera/ids-core/components/date-label/register', '@inera/ids-core/components/dialog/register', '@inera/ids-core/components/expandable/register', '@inera/ids-core/components/icon/register', '@inera/ids-core/components/form/input/register', '@inera/ids-core/components/form/checkbox/register', '@inera/ids-core/components/form/checkbox-group/register', '@inera/ids-core/components/form/error-message/register', '@inera/ids-core/components/form/radio/register', '@inera/ids-core/components/form/range/register', '@inera/ids-core/components/form/select/register', '@inera/ids-core/components/form/select-multiple/register', '@inera/ids-core/components/form/spinner/register', '@inera/ids-core/components/form/time/register', '@inera/ids-core/components/form/textarea/register', '@inera/ids-core/components/grid/row/register', '@inera/ids-core/components/grid/column/register', '@inera/ids-core/components/grid/container/register', '@inera/ids-core/components/link/register', '@inera/ids-core/components/list/register', '@inera/ids-core/components/navigation/content/register', '@inera/ids-core/components/notification/badge/register', '@inera/ids-core/components/mobile/menu/register', '@inera/ids-core/components/popover/register', '@inera/ids-core/components/progressbar/register', '@inera/ids-core/components/footer/register', '@inera/ids-core/components/header/register', '@inera/ids-core/components/stepper/register', '@inera/ids-core/components/tabs/register', '@inera/ids-core/components/tag/register', '@inera/ids-core/components/tooltip/register'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.inera = global.inera || {}, global.inera["ids-angular"] = {}), global.ng.core, null, global.ng.common, null, null, null, null, null, null, global.ng.platformBrowser, global.ng.router));
-})(this, (function (exports, i0, register, i2, register$1, register$2, register$3, register$4, register$5, register$6, i1, i3) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@inera/ids-core/components/alert/register'), require('@angular/common'), require('@inera/ids-core/components/alert-global/register'), require('@inera/ids-core/components/agent/register'), require('@inera/ids-core/components/badge/register'), require('@inera/ids-core/components/button/register'), require('@inera/ids-core/components/icon/register'), require('@inera/ids-core/components/button-group/register'), require('@inera/ids-core/components/carousel/register'), require('@angular/platform-browser'), require('@angular/router'), require('@inera/ids-core/components/breadcrumbs/register'), require('@inera/ids-core/components/card/register'), require('@inera/ids-core/components/date-label/register'), require('@inera/ids-core/components/dialog/register'), require('@inera/ids-core/components/expandable/register'), require('@inera/ids-core/components/form/input/register'), require('@inera/ids-core/components/form/checkbox/register'), require('@inera/ids-core/components/form/checkbox-group/register'), require('@inera/ids-core/components/form/error-message/register'), require('@inera/ids-core/components/form/radio/register'), require('@inera/ids-core/components/form/range/register'), require('@inera/ids-core/components/form/select/register'), require('@inera/ids-core/components/form/select-multiple/register'), require('@inera/ids-core/components/form/spinner/register'), require('@inera/ids-core/components/form/time/register'), require('@inera/ids-core/components/form/textarea/register'), require('@inera/ids-core/components/grid/row/register'), require('@inera/ids-core/components/grid/column/register'), require('@inera/ids-core/components/grid/container/register'), require('@inera/ids-core/components/link/register'), require('@inera/ids-core/components/list/register'), require('@inera/ids-core/components/navigation/content/register'), require('@inera/ids-core/components/notification/badge/register'), require('@inera/ids-core/components/mobile/menu/register'), require('@inera/ids-core/components/popover/register'), require('@inera/ids-core/components/progressbar/register'), require('@inera/ids-core/components/footer/register'), require('@inera/ids-core/components/header/register'), require('@inera/ids-core/components/stepper/register'), require('@inera/ids-core/components/tabs/register'), require('@inera/ids-core/components/tag/register'), require('@inera/ids-core/components/tooltip/register'), require('@inera/ids-core/components/form/toggle/register')) :
+    typeof define === 'function' && define.amd ? define('@inera/ids-angular', ['exports', '@angular/core', '@inera/ids-core/components/alert/register', '@angular/common', '@inera/ids-core/components/alert-global/register', '@inera/ids-core/components/agent/register', '@inera/ids-core/components/badge/register', '@inera/ids-core/components/button/register', '@inera/ids-core/components/icon/register', '@inera/ids-core/components/button-group/register', '@inera/ids-core/components/carousel/register', '@angular/platform-browser', '@angular/router', '@inera/ids-core/components/breadcrumbs/register', '@inera/ids-core/components/card/register', '@inera/ids-core/components/date-label/register', '@inera/ids-core/components/dialog/register', '@inera/ids-core/components/expandable/register', '@inera/ids-core/components/form/input/register', '@inera/ids-core/components/form/checkbox/register', '@inera/ids-core/components/form/checkbox-group/register', '@inera/ids-core/components/form/error-message/register', '@inera/ids-core/components/form/radio/register', '@inera/ids-core/components/form/range/register', '@inera/ids-core/components/form/select/register', '@inera/ids-core/components/form/select-multiple/register', '@inera/ids-core/components/form/spinner/register', '@inera/ids-core/components/form/time/register', '@inera/ids-core/components/form/textarea/register', '@inera/ids-core/components/grid/row/register', '@inera/ids-core/components/grid/column/register', '@inera/ids-core/components/grid/container/register', '@inera/ids-core/components/link/register', '@inera/ids-core/components/list/register', '@inera/ids-core/components/navigation/content/register', '@inera/ids-core/components/notification/badge/register', '@inera/ids-core/components/mobile/menu/register', '@inera/ids-core/components/popover/register', '@inera/ids-core/components/progressbar/register', '@inera/ids-core/components/footer/register', '@inera/ids-core/components/header/register', '@inera/ids-core/components/stepper/register', '@inera/ids-core/components/tabs/register', '@inera/ids-core/components/tag/register', '@inera/ids-core/components/tooltip/register', '@inera/ids-core/components/form/toggle/register'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.inera = global.inera || {}, global.inera["ids-angular"] = {}), global.ng.core, null, global.ng.common, null, null, null, null, null, null, null, global.ng.platformBrowser, global.ng.router));
+})(this, (function (exports, i0, register, i2, register$1, register$2, register$3, register$4, register$5, register$6, register$7, i1, i3) { 'use strict';
 
     function _interopNamespace(e) {
         if (e && e.__esModule) return e;
@@ -31,19 +31,21 @@
         function IDAlertComponent() {
             this.dismissible = false;
             this.collapsable = false;
-            this.srCollapseText = '';
-            this.srExpandText = '';
+            this.collapsed = false;
+            this.srcollapsetext = '';
+            this.srexpandtext = '';
             this.headline = '';
             this.live = '';
             this.type = '';
-            this.srCloseText = '';
-            this.srIconTitle = '';
-            this.closed = new i0.EventEmitter();
+            this.srclosetext = '';
+            this.sricontitle = '';
+            this.onClosed = new i0.EventEmitter();
+            this.onCollapsed = new i0.EventEmitter();
         }
         return IDAlertComponent;
     }());
     IDAlertComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDAlertComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDAlertComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDAlertComponent, selector: "id-alert", inputs: { dismissible: "dismissible", collapsable: "collapsable", srCollapseText: "srCollapseText", srExpandText: "srExpandText", headline: "headline", live: "live", type: "type", srCloseText: "srCloseText", srIconTitle: "srIconTitle" }, outputs: { closed: "closed" }, ngImport: i0__namespace, template: "<ids-alert \r\n  [headline]=\"headline\"\r\n  [attr.dismissible]=\"dismissible ? true : null\"\r\n  [attr.collapsable]=\"collapsable ? true : null\"\r\n  [srcollapsetext]=\"srCollapseText\"\r\n  [srexpandtext]=\"srExpandText\"\r\n  [attr.aria-live]=\"live\"\r\n  [type]=\"type\"\r\n  [srclosetext]=\"srCloseText\"\r\n  [sricontitle]=\"srIconTitle\"\r\n  (closed)=\"closed.emit(true)\">\r\n  <ng-content></ng-content>\r\n</ids-alert>", styles: [":host { display: block; }"] });
+    IDAlertComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDAlertComponent, selector: "id-alert", inputs: { dismissible: "dismissible", collapsable: "collapsable", collapsed: "collapsed", srcollapsetext: "srcollapsetext", srexpandtext: "srexpandtext", headline: "headline", live: "live", type: "type", srclosetext: "srclosetext", sricontitle: "sricontitle" }, outputs: { onClosed: "onClosed", onCollapsed: "onCollapsed" }, ngImport: i0__namespace, template: "<ids-alert \r\n  [headline]=\"headline\"\r\n  [attr.dismissible]=\"dismissible ? true : null\"\r\n  [attr.collapsable]=\"collapsable ? true : null\"\r\n  [attr.collapsed]=\"collapsed ? true : null\"\r\n  [srcollapsetext]=\"srcollapsetext\"\r\n  [srexpandtext]=\"srexpandtext\"\r\n  [attr.aria-live]=\"live\"\r\n  [type]=\"type\"\r\n  [srclosetext]=\"srclosetext\"\r\n  [sricontitle]=\"sricontitle\"\r\n  (closed)=\"onClosed.emit(true)\"\r\n  (collapsed)=\"onCollapsed.emit(true)\">\r\n  <ng-content></ng-content>\r\n</ids-alert>", styles: [":host { display: block; }"] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDAlertComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -55,9 +57,11 @@
                     type: i0.Input
                 }], collapsable: [{
                     type: i0.Input
-                }], srCollapseText: [{
+                }], collapsed: [{
                     type: i0.Input
-                }], srExpandText: [{
+                }], srcollapsetext: [{
+                    type: i0.Input
+                }], srexpandtext: [{
                     type: i0.Input
                 }], headline: [{
                     type: i0.Input
@@ -65,11 +69,13 @@
                     type: i0.Input
                 }], type: [{
                     type: i0.Input
-                }], srCloseText: [{
+                }], srclosetext: [{
                     type: i0.Input
-                }], srIconTitle: [{
+                }], sricontitle: [{
                     type: i0.Input
-                }], closed: [{
+                }], onClosed: [{
+                    type: i0.Output
+                }], onCollapsed: [{
                     type: i0.Output
                 }] } });
 
@@ -99,15 +105,16 @@
         function IDAlertGlobalComponent() {
             this.expanded = true;
             this.headline = '';
-            this.hideMobileIcon = '';
-            this.showText = 'Visa meddelande';
-            this.hideText = 'Dölj meddelande';
-            this.didToggleExpansion = new i0.EventEmitter();
+            this.hidemobileicon = '';
+            this.showtext = 'Visa meddelande';
+            this.hidetext = 'Dölj meddelande';
+            this.icon = undefined;
+            this.onDidToggleExpansion = new i0.EventEmitter();
         }
         return IDAlertGlobalComponent;
     }());
     IDAlertGlobalComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDAlertGlobalComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDAlertGlobalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDAlertGlobalComponent, selector: "id-alert-global", inputs: { expanded: "expanded", headline: "headline", hideMobileIcon: "hideMobileIcon", showText: "showText", hideText: "hideText" }, outputs: { didToggleExpansion: "didToggleExpansion" }, ngImport: i0__namespace, template: "<ids-alert-global \r\n  [headline]=\"headline\"\r\n  [showtext]=\"showText\"\r\n  [hidetext]=\"hideText\"\r\n  [expanded]=\"expanded\"\r\n  [hidemobileicon]=\"hideMobileIcon ? true : null\"\r\n  (closed)=\"didToggleExpansion.emit(true)\">\r\n  <ng-content></ng-content>\r\n</ids-alert-global>", styles: [":host { display: block; }"] });
+    IDAlertGlobalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDAlertGlobalComponent, selector: "id-alert-global", inputs: { expanded: "expanded", headline: "headline", hidemobileicon: "hidemobileicon", showtext: "showtext", hidetext: "hidetext", icon: "icon" }, outputs: { onDidToggleExpansion: "onDidToggleExpansion" }, ngImport: i0__namespace, template: "<ids-alert-global \r\n  [headline]=\"headline\"\r\n  [showtext]=\"showtext\"\r\n  [hidetext]=\"hidetext\"\r\n  [expanded]=\"expanded\"\r\n  [hidemobileicon]=\"hidemobileicon ? true : null\"\r\n  (didToggleExpansion)=\"onDidToggleExpansion.emit(true)\">\r\n  <ids-icon *ngIf=\"icon !== undefined\"\r\n    [attr.name]=\"icon?.name\"\r\n    [attr.title]=\"icon?.title\" \r\n    [attr.color]=\"icon?.color\" \r\n    [attr.color2]=\"icon?.color2\" \r\n    [attr.size]=\"icon?.size\" \r\n    [attr.padding]=\"icon?.padding\"  \r\n    [attr.rotate]=\"icon?.rotate\" \r\n    [attr.colorpreset]=\"icon?.colorpreset\"   \r\n    [attr.height]=\"icon?.height\"   \r\n    [attr.width]=\"icon?.width\"></ids-icon>\r\n  <ng-content></ng-content>\r\n</ids-alert-global>", styles: [":host { display: block; }"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDAlertGlobalComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -119,13 +126,15 @@
                     type: i0.Input
                 }], headline: [{
                     type: i0.Input
-                }], hideMobileIcon: [{
+                }], hidemobileicon: [{
                     type: i0.Input
-                }], showText: [{
+                }], showtext: [{
                     type: i0.Input
-                }], hideText: [{
+                }], hidetext: [{
+                    type: i0.Input
+                }], icon: [{
                     type: i0.Input
-                }], didToggleExpansion: [{
+                }], onDidToggleExpansion: [{
                     type: i0.Output
                 }] } });
 
@@ -155,14 +164,14 @@
         function IDAgentComponent() {
             this.expanded = true;
             this.headline = '';
-            this.showText = 'Visa meddelande';
-            this.hideText = 'Dölj meddelande';
-            this.didToggleExpansion = new i0.EventEmitter();
+            this.showtext = 'Visa meddelande';
+            this.hidetext = 'Dölj meddelande';
+            this.onDidToggleExpansion = new i0.EventEmitter();
         }
         return IDAgentComponent;
     }());
     IDAgentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDAgentComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDAgentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDAgentComponent, selector: "id-agent", inputs: { expanded: "expanded", headline: "headline", showText: "showText", hideText: "hideText" }, outputs: { didToggleExpansion: "didToggleExpansion" }, ngImport: i0__namespace, template: "<ids-agent\r\n  [headline]=\"headline\"\r\n  [showtext]=\"showText\"\r\n  [hidetext]=\"hideText\"\r\n  [expanded]=\"expanded\"\r\n  (didToggleExpansion)=\"didToggleExpansion.emit(true)\">\r\n  <h3 slot=\"alert-headline\" *ngIf=\"headline\">\r\n    {{headline}}\r\n  </h3>\r\n  <ng-content></ng-content>\r\n</ids-agent>", styles: [":host { display: block; }"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    IDAgentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDAgentComponent, selector: "id-agent", inputs: { expanded: "expanded", headline: "headline", showtext: "showtext", hidetext: "hidetext" }, outputs: { onDidToggleExpansion: "onDidToggleExpansion" }, ngImport: i0__namespace, template: "<ids-agent\r\n  [headline]=\"headline\"\r\n  [showtext]=\"showtext\"\r\n  [hidetext]=\"hidetext\"\r\n  [expanded]=\"expanded\"\r\n  (didToggleExpansion)=\"onDidToggleExpansion.emit(true)\">\r\n  <h3 slot=\"alert-headline\" *ngIf=\"headline\">\r\n    {{headline}}\r\n  </h3>\r\n  <ng-content></ng-content>\r\n</ids-agent>", styles: [":host { display: block; }"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDAgentComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -174,11 +183,11 @@
                     type: i0.Input
                 }], headline: [{
                     type: i0.Input
-                }], showText: [{
+                }], showtext: [{
                     type: i0.Input
-                }], hideText: [{
+                }], hidetext: [{
                     type: i0.Input
-                }], didToggleExpansion: [{
+                }], onDidToggleExpansion: [{
                     type: i0.Output
                 }] } });
 
@@ -206,7 +215,7 @@
 
     var IDBadgeComponent = /** @class */ (function () {
         function IDBadgeComponent() {
-            this.type = 'main';
+            this.type = 'primary';
         }
         return IDBadgeComponent;
     }());
@@ -251,8 +260,8 @@
             this.tertiary = false;
             this.toggle = false;
             this.block = false;
-            this.sBlock = false;
-            this.mBlock = false;
+            this.sblock = false;
+            this.mblock = false;
             this.active = false;
             this.submit = false;
             this.search = false;
@@ -260,12 +269,14 @@
             this.disabled = false;
             this.type = undefined;
             this.color = undefined;
-            this.clicked = new i0.EventEmitter();
+            // Internal Icon
+            this.iconobject = undefined;
+            this.onClicked = new i0.EventEmitter();
         }
         return IDButtonComponent;
     }());
     IDButtonComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDButtonComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDButtonComponent, selector: "id-button", inputs: { secondary: "secondary", fab: "fab", icon: "icon", tertiary: "tertiary", toggle: "toggle", block: "block", sBlock: "sBlock", mBlock: "mBlock", active: "active", submit: "submit", search: "search", size: "size", disabled: "disabled", type: "type", color: "color" }, outputs: { clicked: "clicked" }, ngImport: i0__namespace, template: "<ids-button \r\n  [secondary]=\"secondary ? 'true' : null\"\r\n  [attr.fab]=\"fab ? 'true' : null\"\r\n  [attr.icon]=\"icon ? 'true' : null\"\r\n  [tertiary]=\"tertiary ? 'true' : null\"\r\n  [toggle]=\"toggle ? 'true' : null\"\r\n  [active]=\"active ? 'true' : null\"\r\n  [submit]=\"submit ? 'true' : null\"\r\n  [search]=\"search ? 'true' : null\"\r\n  [disabled]=\"disabled ? 'true' : null\"\r\n  [block]=\"block ? 'true' : null\"\r\n  [sblock]=\"sBlock ? 'true' : null\"\r\n  [mblock]=\"mBlock ? 'true' : null\"\r\n  [size]=\"size\"\r\n  [type]=\"type\"\r\n  [color]=\"color\"\r\n  (clicked)=\"clicked.emit(true)\">\r\n  <ng-content></ng-content>\r\n</ids-button>", styles: ["id-button[ng-reflect-block=true], id-button[ng-reflect-mblock=true], id-button[ng-reflect-sblock=true] { display: contents; }"], encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDButtonComponent, selector: "id-button", inputs: { secondary: "secondary", fab: "fab", icon: "icon", tertiary: "tertiary", toggle: "toggle", block: "block", sblock: "sblock", mblock: "mblock", active: "active", submit: "submit", search: "search", size: "size", disabled: "disabled", type: "type", color: "color", iconobject: "iconobject" }, outputs: { onClicked: "onClicked" }, ngImport: i0__namespace, template: "<ids-button \r\n  [secondary]=\"secondary ? 'true' : null\"\r\n  [attr.fab]=\"fab ? 'true' : null\"\r\n  [attr.icon]=\"icon ? 'true' : null\"\r\n  [tertiary]=\"tertiary ? 'true' : null\"\r\n  [toggle]=\"toggle ? 'true' : null\"\r\n  [active]=\"active ? 'true' : null\"\r\n  [submit]=\"submit ? 'true' : null\"\r\n  [search]=\"search ? 'true' : null\"\r\n  [disabled]=\"disabled ? 'true' : null\"\r\n  [block]=\"block ? 'true' : null\"\r\n  [sblock]=\"sblock ? 'true' : null\"\r\n  [mblock]=\"mblock ? 'true' : null\"\r\n  [size]=\"size\"\r\n  [type]=\"type\"\r\n  [color]=\"color\"\r\n  (clicked)=\"onClicked.emit(true)\">\r\n  <ids-icon *ngIf=\"iconobject !== undefined\"\r\n    [attr.name]=\"iconobject?.name\"\r\n    [attr.title]=\"iconobject?.title\" \r\n    [attr.color]=\"iconobject?.color\" \r\n    [attr.color2]=\"iconobject?.color2\" \r\n    [attr.size]=\"iconobject?.size\" \r\n    [attr.padding]=\"iconobject?.padding\"  \r\n    [attr.rotate]=\"iconobject?.rotate\" \r\n    [attr.colorpreset]=\"iconobject?.colorpreset\"   \r\n    [attr.height]=\"iconobject?.height\"   \r\n    [attr.width]=\"iconobject?.width\"></ids-icon>\r\n  <ng-content></ng-content>\r\n</ids-button>", styles: ["id-button[ng-reflect-block=true], id-button[ng-reflect-mblock=true], id-button[ng-reflect-sblock=true] { display: contents; }"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDButtonComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -286,9 +297,9 @@
                     type: i0.Input
                 }], block: [{
                     type: i0.Input
-                }], sBlock: [{
+                }], sblock: [{
                     type: i0.Input
-                }], mBlock: [{
+                }], mblock: [{
                     type: i0.Input
                 }], active: [{
                     type: i0.Input
@@ -304,18 +315,87 @@
                     type: i0.Input
                 }], color: [{
                     type: i0.Input
-                }], clicked: [{
+                }], iconobject: [{
+                    type: i0.Input
+                }], onClicked: [{
                     type: i0.Output
                 }] } });
 
+    var IDIconComponent = /** @class */ (function () {
+        function IDIconComponent() {
+            this.name = undefined;
+            this.rotate = undefined;
+            this.color = undefined;
+            this.color2 = undefined;
+            this.colorpreset = undefined;
+            this.title = undefined;
+            this.size = 'm';
+            this.inline = false;
+            this.width = undefined;
+            this.height = undefined;
+        }
+        return IDIconComponent;
+    }());
+    IDIconComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    IDIconComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDIconComponent, selector: "id-icon", inputs: { name: "name", rotate: "rotate", color: "color", color2: "color2", colorpreset: "colorpreset", title: "title", size: "size", inline: "inline", width: "width", height: "height" }, ngImport: i0__namespace, template: "<ids-icon \r\n  [attr.name]=\"name\"\r\n  [attr.inline]=\"inline ? true : undefined\"\r\n  [attr.rotate]=\"rotate\"\r\n  [attr.color]=\"color\"\r\n  [attr.color2]=\"color2\"\r\n  [attr.size]=\"size\"\r\n  [attr.width]=\"width\"\r\n  [attr.height]=\"height\"\r\n  [attr.colorpreset]=\"colorpreset\">\r\n</ids-icon >", encapsulation: i0__namespace.ViewEncapsulation.None });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'id-icon',
+                        templateUrl: './icon.component.html',
+                        encapsulation: i0.ViewEncapsulation.None,
+                    }]
+            }], ctorParameters: function () { return []; }, propDecorators: { name: [{
+                    type: i0.Input
+                }], rotate: [{
+                    type: i0.Input
+                }], color: [{
+                    type: i0.Input
+                }], color2: [{
+                    type: i0.Input
+                }], colorpreset: [{
+                    type: i0.Input
+                }], title: [{
+                    type: i0.Input
+                }], size: [{
+                    type: i0.Input
+                }], inline: [{
+                    type: i0.Input
+                }], width: [{
+                    type: i0.Input
+                }], height: [{
+                    type: i0.Input
+                }] } });
+
+    var IDIconModule = /** @class */ (function () {
+        function IDIconModule() {
+        }
+        return IDIconModule;
+    }());
+    IDIconModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    IDIconModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconModule, declarations: [IDIconComponent], exports: [IDIconComponent] });
+    IDIconModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconModule });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        declarations: [
+                            IDIconComponent
+                        ],
+                        exports: [
+                            IDIconComponent
+                        ],
+                        schemas: [i0.CUSTOM_ELEMENTS_SCHEMA],
+                    }]
+            }] });
+
     var IDButtonModule = /** @class */ (function () {
         function IDButtonModule() {
         }
         return IDButtonModule;
     }());
     IDButtonModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDButtonModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    IDButtonModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDButtonModule, declarations: [IDButtonComponent], exports: [IDButtonComponent] });
-    IDButtonModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDButtonModule });
+    IDButtonModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDButtonModule, declarations: [IDButtonComponent], imports: [i2.CommonModule, IDIconModule], exports: [IDButtonComponent] });
+    IDButtonModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDButtonModule, imports: [[i2.CommonModule, IDIconModule]] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDButtonModule, decorators: [{
                 type: i0.NgModule,
                 args: [{
@@ -325,6 +405,7 @@
                         exports: [
                             IDButtonComponent
                         ],
+                        imports: [i2.CommonModule, IDIconModule],
                         schemas: [i0.CUSTOM_ELEMENTS_SCHEMA],
                     }]
             }] });
@@ -372,14 +453,14 @@
     var IDCarouselComponent = /** @class */ (function () {
         function IDCarouselComponent() {
             this.autoplay = false;
-            this.srNextLabel = 'Nästa slide';
-            this.srPrevLabel = 'Föregående slide';
-            this.autoplayDelay = 5000;
+            this.srnextlabel = 'Nästa slide';
+            this.srprevlabel = 'Föregående slide';
+            this.autoplaydelay = 5000;
         }
         return IDCarouselComponent;
     }());
     IDCarouselComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDCarouselComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDCarouselComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDCarouselComponent, selector: "id-carousel", inputs: { autoplay: "autoplay", srNextLabel: "srNextLabel", srPrevLabel: "srPrevLabel", autoplayDelay: "autoplayDelay" }, ngImport: i0__namespace, template: "<ids-carousel\r\n  [srnextlabel]=\"srNextLabel\"\r\n  [srnextlabel]=\"srNextLabel\"\r\n  [autoplay]=\"autoplay ? true : null\"\r\n  [autoplaydelay]=\"autoplayDelay\">\r\n  <ng-content></ng-content>\r\n</ids-carousel>" });
+    IDCarouselComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDCarouselComponent, selector: "id-carousel", inputs: { autoplay: "autoplay", srnextlabel: "srnextlabel", srprevlabel: "srprevlabel", autoplaydelay: "autoplaydelay" }, ngImport: i0__namespace, template: "<ids-carousel\r\n  [srnextlabel]=\"srnextlabel\"\r\n  [srprevlabel]=\"srprevlabel\"\r\n  [autoplay]=\"autoplay ? true : null\"\r\n  [autoplaydelay]=\"autoplaydelay\">\r\n  <ng-content></ng-content>\r\n</ids-carousel>" });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDCarouselComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -388,11 +469,11 @@
                     }]
             }], ctorParameters: function () { return []; }, propDecorators: { autoplay: [{
                     type: i0.Input
-                }], srNextLabel: [{
+                }], srnextlabel: [{
                     type: i0.Input
-                }], srPrevLabel: [{
+                }], srprevlabel: [{
                     type: i0.Input
-                }], autoplayDelay: [{
+                }], autoplaydelay: [{
                     type: i0.Input
                 }] } });
 
@@ -980,15 +1061,15 @@
 
     var IDBreadcrumbsComponent = /** @class */ (function () {
         function IDBreadcrumbsComponent() {
-            this.links = [];
+            this.lead = 'Du är här:';
             this.current = '';
-            this.lead = '';
-            this.srLabel = '';
+            this.srlabel = 'Du är här';
+            this.links = [];
         }
         return IDBreadcrumbsComponent;
     }());
     IDBreadcrumbsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDBreadcrumbsComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDBreadcrumbsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDBreadcrumbsComponent, selector: "id-breadcrumbs", inputs: { links: "links", mobileLink: "mobileLink", current: "current", lead: "lead", srLabel: "srLabel" }, ngImport: i0__namespace, template: "<ids-breadcrumbs\r\n  [current]=\"current\"\r\n  [lead]=\"lead\"\r\n  [srlabel]=\"srLabel\">\r\n  <ids-crumb *ngFor=\"let link of links\">\r\n    <id-anchor [link]=\"link\"></id-anchor>\r\n  </ids-crumb>\r\n  <ids-crumb mobile=\"true\" *ngIf=\"mobileLink\">\r\n    <id-anchor [link]=\"mobileLink\"></id-anchor>\r\n  </ids-crumb>\r\n</ids-breadcrumbs>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDBreadcrumbsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDBreadcrumbsComponent, selector: "id-breadcrumbs", inputs: { lead: "lead", current: "current", srlabel: "srlabel", links: "links", mobilelink: "mobilelink" }, ngImport: i0__namespace, template: "<ids-breadcrumbs\r\n  [current]=\"current\"\r\n  [lead]=\"lead\"\r\n  [srlabel]=\"srlabel\">\r\n  <ids-crumb *ngFor=\"let link of links\">\r\n    <id-anchor [link]=\"link\"></id-anchor>\r\n  </ids-crumb>\r\n  <ids-crumb mobile=\"true\" *ngIf=\"mobilelink\">\r\n    <id-anchor [link]=\"mobilelink\"></id-anchor>\r\n  </ids-crumb>\r\n</ids-breadcrumbs>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDBreadcrumbsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -996,15 +1077,15 @@
                         templateUrl: './breadcrumbs.component.html',
                         encapsulation: i0.ViewEncapsulation.None,
                     }]
-            }], ctorParameters: function () { return []; }, propDecorators: { links: [{
-                    type: i0.Input
-                }], mobileLink: [{
+            }], ctorParameters: function () { return []; }, propDecorators: { lead: [{
                     type: i0.Input
                 }], current: [{
                     type: i0.Input
-                }], lead: [{
+                }], srlabel: [{
                     type: i0.Input
-                }], srLabel: [{
+                }], links: [{
+                    type: i0.Input
+                }], mobilelink: [{
                     type: i0.Input
                 }] } });
 
@@ -1038,11 +1119,9 @@
         return IDBreadcrumbsModule;
     }());
     IDBreadcrumbsModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDBreadcrumbsModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    IDBreadcrumbsModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDBreadcrumbsModule, declarations: [IDBreadcrumbsComponent], imports: [i2.CommonModule,
-            IDAnchorModule], exports: [IDBreadcrumbsComponent] });
+    IDBreadcrumbsModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDBreadcrumbsModule, declarations: [IDBreadcrumbsComponent], imports: [i2.CommonModule, IDAnchorModule], exports: [IDBreadcrumbsComponent] });
     IDBreadcrumbsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDBreadcrumbsModule, imports: [[
-                i2.CommonModule,
-                IDAnchorModule
+                i2.CommonModule, IDAnchorModule
             ]] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDBreadcrumbsModule, decorators: [{
                 type: i0.NgModule,
@@ -1054,8 +1133,7 @@
                             IDBreadcrumbsComponent
                         ],
                         imports: [
-                            i2.CommonModule,
-                            IDAnchorModule
+                            i2.CommonModule, IDAnchorModule
                         ],
                         schemas: [i0.CUSTOM_ELEMENTS_SCHEMA],
                     }]
@@ -1106,13 +1184,13 @@
             this.date = null;
             this.year = null;
             this.month = null;
-            this.monthLabel = null;
+            this.monthlabel = null;
             this.day = null;
         }
         return IDDateLabelComponent;
     }());
     IDDateLabelComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDDateLabelComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDDateLabelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDDateLabelComponent, selector: "id-date-label", inputs: { date: "date", year: "year", month: "month", monthLabel: "monthLabel", day: "day" }, ngImport: i0__namespace, template: "<ids-date-label \n  [date]=\"date?.toString()\"\n  [year]=\"year\"\n  [month]=\"month\"\n  [monthlabel]=\"monthLabel\"\n  [day]=\"day\">\n  <ng-content></ng-content>\n</ids-date-label>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDDateLabelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDDateLabelComponent, selector: "id-date-label", inputs: { date: "date", year: "year", month: "month", monthlabel: "monthlabel", day: "day" }, ngImport: i0__namespace, template: "<ids-date-label \n  [date]=\"date?.toString()\"\n  [year]=\"year\"\n  [month]=\"month\"\n  [monthlabel]=\"monthlabel\"\n  [day]=\"day\">\n  <ng-content></ng-content>\n</ids-date-label>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDDateLabelComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1126,7 +1204,7 @@
                     type: i0.Input
                 }], month: [{
                     type: i0.Input
-                }], monthLabel: [{
+                }], monthlabel: [{
                     type: i0.Input
                 }], day: [{
                     type: i0.Input
@@ -1156,18 +1234,22 @@
     var IDDialogComponent = /** @class */ (function () {
         function IDDialogComponent() {
             this.dismissible = false;
-            this.srCloseText = false;
-            this.noFocusTrap = false;
+            this.srclosetext = '';
+            this.nofocustrap = false;
             this.headline = '';
             this.overlay = false;
             this.persistent = false;
             this.show = false;
             this.width = '';
+            this.onClosed = new i0.EventEmitter();
         }
+        IDDialogComponent.prototype.emitOnClosed = function (e) {
+            this.onClosed.emit(e);
+        };
         return IDDialogComponent;
     }());
     IDDialogComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDDialogComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDDialogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDDialogComponent, selector: "id-dialog", inputs: { dismissible: "dismissible", srCloseText: "srCloseText", noFocusTrap: "noFocusTrap", headline: "headline", overlay: "overlay", persistent: "persistent", show: "show", width: "width" }, ngImport: i0__namespace, template: "<ids-dialog \r\n  [dismissible]=\"dismissible\"\r\n  [headline]=\"headline\"\r\n  [overlay]=\"overlay ? true : null\"\r\n  [nofocustrap]=\"noFocusTrap ? true : null\"\r\n  [persistent]=\"persistent\"\r\n  [show]=\"show\"\r\n  [width]=\"width\"\r\n  nofocustrap=\"noFocusTrap\"\r\n  [srclosetext]=\"srCloseText\">\r\n  <ng-content></ng-content>\r\n</ids-dialog>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDDialogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDDialogComponent, selector: "id-dialog", inputs: { dismissible: "dismissible", srclosetext: "srclosetext", nofocustrap: "nofocustrap", headline: "headline", overlay: "overlay", persistent: "persistent", show: "show", width: "width" }, outputs: { onClosed: "onClosed" }, ngImport: i0__namespace, template: "<ids-dialog \r\n  [attr.dismissible]=\"dismissible ? true : null\"\r\n  [attr.headline]=\"headline\"\r\n  [attr.overlay]=\"overlay ? true : null\"\r\n  [attr.nofocustrap]=\"nofocustrap ? true : null\"\r\n  [attr.persistent]=\"persistent ? true : null\"\r\n  [show]=\"show\"\r\n  [width]=\"width\"\r\n  nofocustrap=\"nofocustrap\"\r\n  [srclosetext]=\"srclosetext\"\r\n  (closed)=\"emitOnClosed\">\r\n  <ng-content></ng-content>\r\n</ids-dialog>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDDialogComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1177,9 +1259,9 @@
                     }]
             }], ctorParameters: function () { return []; }, propDecorators: { dismissible: [{
                     type: i0.Input
-                }], srCloseText: [{
+                }], srclosetext: [{
                     type: i0.Input
-                }], noFocusTrap: [{
+                }], nofocustrap: [{
                     type: i0.Input
                 }], headline: [{
                     type: i0.Input
@@ -1191,6 +1273,8 @@
                     type: i0.Input
                 }], width: [{
                     type: i0.Input
+                }], onClosed: [{
+                    type: i0.Output
                 }] } });
 
     var IDDialogActionsComponent = /** @class */ (function () {
@@ -1244,7 +1328,7 @@
         return IDExpandableComponent;
     }());
     IDExpandableComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDExpandableComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDExpandableComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDExpandableComponent, selector: "id-expandable", inputs: { borderless: "borderless", expanded: "expanded", headline: "headline", variation: "variation" }, ngImport: i0__namespace, template: "<ids-expandable [attr.borderless]=\"borderless ? true : null\" [expanded]=\"expanded\" [headline]=\"headline\" [variation]=\"variation\">\r\n  <ng-content></ng-content>\r\n</ids-expandable>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDExpandableComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDExpandableComponent, selector: "id-expandable", inputs: { borderless: "borderless", expanded: "expanded", headline: "headline", variation: "variation" }, ngImport: i0__namespace, template: "<ids-expandable \r\n  [attr.borderless]=\"borderless ? true : null\"\r\n  [expanded]=\"expanded ? true : null\"\r\n  [headline]=\"headline\"\r\n  [variation]=\"variation\">\r\n  <ng-content></ng-content>\r\n</ids-expandable>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDExpandableComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1360,77 +1444,11 @@
         return IDIcon;
     }());
 
-    var IDIconComponent = /** @class */ (function () {
-        function IDIconComponent() {
-            this.name = undefined;
-            this.rotate = undefined;
-            this.color = undefined;
-            this.color2 = undefined;
-            this.colorpreset = undefined;
-            this.title = undefined;
-            this.size = 'm';
-            this.inline = false;
-            this.width = undefined;
-            this.height = undefined;
-        }
-        return IDIconComponent;
-    }());
-    IDIconComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDIconComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDIconComponent, selector: "id-icon", inputs: { name: "name", rotate: "rotate", color: "color", color2: "color2", colorpreset: "colorpreset", title: "title", size: "size", inline: "inline", width: "width", height: "height" }, ngImport: i0__namespace, template: "<ids-icon \r\n  [attr.name]=\"name\"\r\n  [attr.inline]=\"inline ? true : undefined\"\r\n  [attr.rotate]=\"rotate\"\r\n  [attr.color]=\"color\"\r\n  [attr.color2]=\"color2\"\r\n  [attr.size]=\"size\"\r\n  [attr.width]=\"width\"\r\n  [attr.height]=\"height\"\r\n  [attr.colorpreset]=\"colorpreset\">\r\n</ids-icon >", encapsulation: i0__namespace.ViewEncapsulation.None });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconComponent, decorators: [{
-                type: i0.Component,
-                args: [{
-                        selector: 'id-icon',
-                        templateUrl: './icon.component.html',
-                        encapsulation: i0.ViewEncapsulation.None,
-                    }]
-            }], ctorParameters: function () { return []; }, propDecorators: { name: [{
-                    type: i0.Input
-                }], rotate: [{
-                    type: i0.Input
-                }], color: [{
-                    type: i0.Input
-                }], color2: [{
-                    type: i0.Input
-                }], colorpreset: [{
-                    type: i0.Input
-                }], title: [{
-                    type: i0.Input
-                }], size: [{
-                    type: i0.Input
-                }], inline: [{
-                    type: i0.Input
-                }], width: [{
-                    type: i0.Input
-                }], height: [{
-                    type: i0.Input
-                }] } });
-
-    var IDIconModule = /** @class */ (function () {
-        function IDIconModule() {
-        }
-        return IDIconModule;
-    }());
-    IDIconModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    IDIconModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconModule, declarations: [IDIconComponent], exports: [IDIconComponent] });
-    IDIconModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconModule });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDIconModule, decorators: [{
-                type: i0.NgModule,
-                args: [{
-                        declarations: [
-                            IDIconComponent
-                        ],
-                        exports: [
-                            IDIconComponent
-                        ],
-                        schemas: [i0.CUSTOM_ELEMENTS_SCHEMA],
-                    }]
-            }] });
-
     var IDFormBase = /** @class */ (function () {
         function IDFormBase() {
             this.valid = 'true';
-            this.noValidation = false;
+            this.light = false;
+            this.novalidation = false;
         }
         return IDFormBase;
     }());
@@ -1440,7 +1458,9 @@
                 type: i0.Injectable
             }], ctorParameters: function () { return []; }, propDecorators: { valid: [{
                     type: i0.Input
-                }], noValidation: [{
+                }], light: [{
+                    type: i0.Input
+                }], novalidation: [{
                     type: i0.Input
                 }] } });
 
@@ -1449,13 +1469,12 @@
         function IDInputComponent() {
             var _this = _super.call(this) || this;
             _this.autofocus = false;
-            _this.appendIcon = null;
             return _this;
         }
         return IDInputComponent;
     }(IDFormBase));
     IDInputComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDInputComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDInputComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDInputComponent, selector: "id-input", inputs: { autofocus: "autofocus", appendIcon: "appendIcon" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-input [attr.valid]=\"valid\" \r\n  [attr.novalidation]=\"noValidation ? noValidation : null\"\r\n  [attr.autofocus]=\"autofocus ? autofocus : null\">\r\n  <ng-content></ng-content>\r\n  <ids-icon *ngIf=\"appendIcon !== null\"\r\n    [attr.name]=\"appendIcon?.name\"\r\n    [attr.title]=\"appendIcon?.title\" \r\n    [attr.color]=\"appendIcon?.color\" \r\n    [attr.color2]=\"appendIcon?.color2\" \r\n    [attr.size]=\"appendIcon?.size\" \r\n    [attr.padding]=\"appendIcon?.padding\"  \r\n    [attr.rotate]=\"appendIcon?.rotate\" \r\n    [attr.colorpreset]=\"appendIcon?.colorpreset\"   \r\n    [attr.height]=\"appendIcon?.height\"   \r\n    [attr.width]=\"appendIcon?.width\"></ids-icon>\r\n</ids-input>", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDInputComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDInputComponent, selector: "id-input", inputs: { autofocus: "autofocus" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-input [attr.valid]=\"valid\" \r\n  [attr.novalidation]=\"novalidation ? true : null\"\r\n  [attr.light]=\"light ? light : null\"\r\n  [attr.autofocus]=\"autofocus ? autofocus : null\">\r\n  <ng-content></ng-content>\r\n</ids-input>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDInputComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1465,8 +1484,6 @@
                     }]
             }], ctorParameters: function () { return []; }, propDecorators: { autofocus: [{
                     type: i0.Input
-                }], appendIcon: [{
-                    type: i0.Input
                 }] } });
 
     var IDInputModule = /** @class */ (function () {
@@ -1501,7 +1518,7 @@
         return IDCheckboxComponent;
     }(IDFormBase));
     IDCheckboxComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDCheckboxComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDCheckboxComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDCheckboxComponent, selector: "id-checkbox", inputs: { compact: "compact" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-checkbox \r\n  [attr.compact]=\"compact ? true : null\"\r\n  [attr.valid]=\"valid\" \r\n  [attr.novalidation]=\"noValidation ? noValidation : null\">\r\n  <ng-content></ng-content>\r\n</ids-checkbox>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDCheckboxComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDCheckboxComponent, selector: "id-checkbox", inputs: { compact: "compact" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-checkbox \r\n  [attr.compact]=\"compact ? true : null\"\r\n  [attr.light]=\"light ? true : null\"\r\n  [attr.valid]=\"valid\" \r\n  [attr.novalidation]=\"novalidation ? true : null\">\r\n  <ng-content></ng-content>\r\n</ids-checkbox>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDCheckboxComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1548,7 +1565,7 @@
         return IDCheckboxGroupComponent;
     }(IDFormBase));
     IDCheckboxGroupComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDCheckboxGroupComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDCheckboxGroupComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDCheckboxGroupComponent, selector: "id-checkbox-group", inputs: { errorMessage: "errorMessage", legend: "legend", compact: "compact" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-checkbox-group \r\n  [legend]=\"legend\"\r\n  [valid]=\"valid\" \r\n  [attr.novalidation]=\"noValidation ? noValidation : null\"\r\n  [attr.compact]=\"compact ? true : null\">\r\n  <ng-content></ng-content>\r\n  <ids-error-message *ngIf=\"errorMessage\">{{errorMessage}}</ids-error-message>\r\n</ids-checkbox-group>\r\n", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDCheckboxGroupComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDCheckboxGroupComponent, selector: "id-checkbox-group", inputs: { errorMessage: "errorMessage", legend: "legend", compact: "compact" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-checkbox-group \r\n  [legend]=\"legend\"\r\n  [valid]=\"valid\" \r\n  [attr.novalidation]=\"novalidation ? true : null\"\r\n  [attr.compact]=\"compact ? true : null\">\r\n  <ng-content></ng-content>\r\n  <ids-error-message *ngIf=\"errorMessage\">{{errorMessage}}</ids-error-message>\r\n</ids-checkbox-group>\r\n", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDCheckboxGroupComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1627,13 +1644,15 @@
                     }]
             }] });
 
-    var IDRadioComponent = /** @class */ (function () {
+    var IDRadioComponent = /** @class */ (function (_super) {
+        __extends(IDRadioComponent, _super);
         function IDRadioComponent() {
+            return _super !== null && _super.apply(this, arguments) || this;
         }
         return IDRadioComponent;
-    }());
-    IDRadioComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDRadioComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDRadioComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDRadioComponent, selector: "id-radio", ngImport: i0__namespace, template: "<ids-radio>\r\n  <ng-content></ng-content>\r\n</ids-radio>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    }(IDFormBase));
+    IDRadioComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDRadioComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+    IDRadioComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDRadioComponent, selector: "id-radio", usesInheritance: true, ngImport: i0__namespace, template: "<ids-radio [light]=\"light ? true : null\">\r\n  <ng-content></ng-content>\r\n</ids-radio>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDRadioComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1641,19 +1660,19 @@
                         templateUrl: './radio.component.html',
                         encapsulation: i0.ViewEncapsulation.None,
                     }]
-            }], ctorParameters: function () { return []; } });
+            }] });
 
     var IDRadioGroupComponent = /** @class */ (function () {
         function IDRadioGroupComponent() {
             this.name = undefined;
             this.legend = undefined;
             this.required = false;
-            this.errorMessage = undefined;
+            this.errormessage = undefined;
         }
         return IDRadioGroupComponent;
     }());
     IDRadioGroupComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDRadioGroupComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDRadioGroupComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDRadioGroupComponent, selector: "id-radio-group", inputs: { name: "name", legend: "legend", required: "required", errorMessage: "errorMessage" }, ngImport: i0__namespace, template: "<ids-radio-group [name]=\"name\" [legend]=\"legend\" [required]=\"required\">\r\n  <ng-content></ng-content>\r\n  <ids-error-message *ngIf=\"errorMessage\">{{errorMessage}}</ids-error-message>\r\n</ids-radio-group>", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDRadioGroupComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDRadioGroupComponent, selector: "id-radio-group", inputs: { name: "name", legend: "legend", required: "required", errormessage: "errormessage" }, ngImport: i0__namespace, template: "<ids-radio-group [name]=\"name\" [legend]=\"legend\" [required]=\"required\">\r\n  <ng-content></ng-content>\r\n  <ids-error-message *ngIf=\"errormessage\">{{errormessage}}</ids-error-message>\r\n</ids-radio-group>", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDRadioGroupComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1667,7 +1686,7 @@
                     type: i0.Input
                 }], required: [{
                     type: i0.Input
-                }], errorMessage: [{
+                }], errormessage: [{
                     type: i0.Input
                 }] } });
 
@@ -1703,12 +1722,12 @@
 
     var IDRangeComponent = /** @class */ (function () {
         function IDRangeComponent() {
-            this.showTicks = false;
+            this.showticks = false;
         }
         return IDRangeComponent;
     }());
     IDRangeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDRangeComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDRangeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDRangeComponent, selector: "id-range", inputs: { showTicks: "showTicks" }, ngImport: i0__namespace, template: "<ids-range [showticks]=\"showTicks\">\r\n  <ng-content></ng-content>\r\n</ids-range>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDRangeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDRangeComponent, selector: "id-range", inputs: { showticks: "showticks" }, ngImport: i0__namespace, template: "<ids-range [showticks]=\"showticks\">\r\n  <ng-content></ng-content>\r\n</ids-range>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDRangeComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1716,7 +1735,7 @@
                         templateUrl: './range.component.html',
                         encapsulation: i0.ViewEncapsulation.None,
                     }]
-            }], propDecorators: { showTicks: [{
+            }], propDecorators: { showticks: [{
                     type: i0.Input
                 }] } });
 
@@ -1744,12 +1763,12 @@
     var IDSelectComponent = /** @class */ (function (_super) {
         __extends(IDSelectComponent, _super);
         function IDSelectComponent() {
-            return _super.call(this) || this;
+            return _super !== null && _super.apply(this, arguments) || this;
         }
         return IDSelectComponent;
     }(IDFormBase));
-    IDSelectComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDSelectComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDSelectComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDSelectComponent, selector: "id-select", usesInheritance: true, ngImport: i0__namespace, template: "<ids-select [attr.valid]=\"valid\" [attr.novalidation]=\"noValidation ? noValidation : null\">\r\n  <ng-content></ng-content>\r\n</ids-select>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDSelectComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDSelectComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+    IDSelectComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDSelectComponent, selector: "id-select", usesInheritance: true, ngImport: i0__namespace, template: "<ids-select \r\n  [attr.valid]=\"valid\"\r\n  [attr.light]=\"light ? true : null\"\r\n  [attr.novalidation]=\"novalidation ? true : null\">\r\n  <ng-content></ng-content>\r\n</ids-select>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDSelectComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1757,7 +1776,7 @@
                         templateUrl: './select.component.html',
                         encapsulation: i0.ViewEncapsulation.None,
                     }]
-            }], ctorParameters: function () { return []; } });
+            }] });
 
     var IDSelectModule = /** @class */ (function () {
         function IDSelectModule() {
@@ -1785,7 +1804,7 @@
         function IDSelectMultipleComponent() {
             var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
             _this.label = undefined;
-            _this.errorMessage = undefined;
+            _this.errormessage = undefined;
             _this.maxHeight = undefined;
             _this.placeholder = '';
             return _this;
@@ -1793,7 +1812,7 @@
         return IDSelectMultipleComponent;
     }(IDFormBase));
     IDSelectMultipleComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDSelectMultipleComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDSelectMultipleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDSelectMultipleComponent, selector: "id-select-multiple", inputs: { label: "label", errorMessage: "errorMessage", maxHeight: "maxHeight", placeholder: "placeholder" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-select-multiple \r\n  [attr.valid]=\"valid\" \r\n  [attr.novalidation]=\"noValidation ? noValidation : null\" \r\n  [label]=\"label\" \r\n  [placeholder]=\"placeholder\"\r\n  [maxheight]=\"maxHeight\">\r\n  <ng-content></ng-content>\r\n  <ids-error-message  *ngIf=\"errorMessage\">{{errorMessage}}</ids-error-message>\r\n</ids-select-multiple>", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDSelectMultipleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDSelectMultipleComponent, selector: "id-select-multiple", inputs: { label: "label", errormessage: "errormessage", maxHeight: "maxHeight", placeholder: "placeholder" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-select-multiple \r\n  [attr.light]=\"light ? true : null\"\r\n  [attr.valid]=\"valid\" \r\n  [attr.novalidation]=\"novalidation ? true : null\" \r\n  [label]=\"label\" \r\n  [placeholder]=\"placeholder\"\r\n  [maxheight]=\"maxHeight\">\r\n  <ng-content></ng-content>\r\n  <ids-error-message  *ngIf=\"errormessage\">{{errormessage}}</ids-error-message>\r\n</ids-select-multiple>", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDSelectMultipleComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1803,7 +1822,7 @@
                     }]
             }], propDecorators: { label: [{
                     type: i0.Input
-                }], errorMessage: [{
+                }], errormessage: [{
                     type: i0.Input
                 }], maxHeight: [{
                     type: i0.Input
@@ -1880,13 +1899,15 @@
                     }]
             }] });
 
-    var IDTimeComponent = /** @class */ (function () {
+    var IDTimeComponent = /** @class */ (function (_super) {
+        __extends(IDTimeComponent, _super);
         function IDTimeComponent() {
+            return _super !== null && _super.apply(this, arguments) || this;
         }
         return IDTimeComponent;
-    }());
-    IDTimeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTimeComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDTimeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTimeComponent, selector: "id-time", ngImport: i0__namespace, template: "<ids-time>\r\n  <ng-content></ng-content>\r\n</ids-time>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    }(IDFormBase));
+    IDTimeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTimeComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+    IDTimeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTimeComponent, selector: "id-time", usesInheritance: true, ngImport: i0__namespace, template: "<ids-time [attr.light]=\"light ? true : null\">\r\n  <ng-content></ng-content>\r\n</ids-time>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTimeComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1894,7 +1915,7 @@
                         templateUrl: './time.component.html',
                         encapsulation: i0.ViewEncapsulation.None,
                     }]
-            }], ctorParameters: function () { return []; } });
+            }] });
 
     var IDTimeModule = /** @class */ (function () {
         function IDTimeModule() {
@@ -1927,7 +1948,7 @@
         return IDTextareaComponent;
     }(IDFormBase));
     IDTextareaComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTextareaComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDTextareaComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTextareaComponent, selector: "id-textarea", inputs: { noFade: "noFade" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-textarea [attr.nofade]=\"noFade ? true : null\" [attr.valid]=\"valid\" [attr.novalidation]=\"noValidation ? noValidation : null\">\r\n  <ng-content></ng-content>\r\n</ids-textarea>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDTextareaComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTextareaComponent, selector: "id-textarea", inputs: { noFade: "noFade" }, usesInheritance: true, ngImport: i0__namespace, template: "<ids-textarea \r\n  [attr.light]=\"light ? true : null\"\r\n  [attr.nofade]=\"noFade ? true : null\"\r\n  [attr.valid]=\"valid\"\r\n  [attr.novalidation]=\"novalidation ? true : null\">\r\n  <ng-content></ng-content>\r\n</ids-textarea>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTextareaComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -2123,37 +2144,38 @@
     var IDLinkComponent = /** @class */ (function () {
         function IDLinkComponent() {
             this.link = null;
-            this.notificationBadge = null;
-            this.prependIcon = null;
-            this.appendIcon = null;
+            this.notificationbadge = null;
+            this.prependicon = null;
+            this.appendicon = null;
             this.underlined = false;
             this.padding = null;
             this.outline = null;
             this.block = false;
             this.color = undefined;
             this.size = undefined;
-            this.activeIcon = false;
-            this.activeIconBackground = undefined;
+            this.activeicon = false;
+            this.activeiconbackground = undefined;
             this.external = false;
             this.slot = undefined;
         }
         return IDLinkComponent;
     }());
     IDLinkComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDLinkComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDLinkComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDLinkComponent, selector: "id-link", inputs: { link: "link", notificationBadge: "notificationBadge", prependIcon: "prependIcon", appendIcon: "appendIcon", underlined: "underlined", padding: "padding", outline: "outline", block: "block", color: "color", size: "size", activeIcon: "activeIcon", activeIconBackground: "activeIconBackground", external: "external", slot: "slot" }, host: { properties: { "class.ids-block": "this.block" } }, ngImport: i0__namespace, template: "<ids-link \r\n  [attr.underlined]=\"underlined ? '' : null\"\r\n  [color]=\"color\"\r\n  [size]=\"size\"\r\n  [attr.activeicon]=\"activeIcon ? true : null\"\r\n  [activeiconbackground]=\"activeIconBackground\"\r\n  [padding]=\"padding\"\r\n  [outline]=\"outline\"\r\n  [block]=\"block\"\r\n  [attr.slot]=\"slot\"\r\n  >\r\n    <ids-icon *ngIf=\"prependIcon !== null\"\r\n    slot=\"prepend-icon\" \r\n    [attr.name]=\"prependIcon?.name\"\r\n    [attr.title]=\"prependIcon?.title\" \r\n    [attr.color]=\"prependIcon?.color\" \r\n    [attr.color2]=\"prependIcon?.color2\" \r\n    [attr.size]=\"prependIcon?.size\" \r\n    [attr.padding]=\"prependIcon?.padding\"  \r\n    [attr.rotate]=\"prependIcon?.rotate\" \r\n    [attr.colorpreset]=\"prependIcon?.colorpreset\"   \r\n    [attr.height]=\"prependIcon?.height\"   \r\n    [attr.width]=\"prependIcon?.width\"></ids-icon>\r\n    <id-anchor *ngIf=\"link\" [link]=\"link\"></id-anchor>\r\n    <ng-content *ngIf=\"!link\"></ng-content>\r\n    <ids-icon *ngIf=\"appendIcon !== null\" \r\n    slot=\"append-icon\" \r\n    [attr.name]=\"appendIcon?.name\"\r\n    [attr.title]=\"appendIcon?.title\" \r\n    [attr.color]=\"appendIcon?.color\" \r\n    [attr.color2]=\"appendIcon?.color2\"\r\n    [attr.size]=\"appendIcon?.size\"  \r\n    [attr.padding]=\"appendIcon?.padding\"  \r\n    [attr.rotate]=\"appendIcon?.rotate\"  \r\n    [attr.colorpreset]=\"appendIcon?.colorpreset\"   \r\n    [attr.height]=\"appendIcon?.height\"   \r\n    [attr.width]=\"appendIcon?.width\"></ids-icon>\r\n    <ids-notification-badge \r\n    *ngIf=\"notificationBadge !== null\"\r\n    [attr.type]=\"notificationBadge.type\"\r\n    [attr.size]=\"notificationBadge.size\">\r\n    {{notificationBadge.value}}\r\n  </ids-notification-badge>\r\n</ids-link>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    IDLinkComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDLinkComponent, selector: "id-link", inputs: { link: "link", notificationbadge: "notificationbadge", prependicon: "prependicon", appendicon: "appendicon", underlined: "underlined", padding: "padding", outline: "outline", block: "block", color: "color", size: "size", activeicon: "activeicon", activeiconbackground: "activeiconbackground", external: "external", slot: "slot" }, host: { properties: { "class.ids-block": "this.block" } }, ngImport: i0__namespace, template: "<ids-link \r\n  [attr.underlined]=\"underlined ? '' : null\"\r\n  [color]=\"color\"\r\n  [size]=\"size\"\r\n  [attr.activeicon]=\"activeicon ? true : null\"\r\n  [activeiconbackground]=\"activeiconbackground\"\r\n  [padding]=\"padding\"\r\n  [outline]=\"outline\"\r\n  [block]=\"block ? true : null\"\r\n  [attr.slot]=\"slot\"\r\n  >\r\n    <ids-icon *ngIf=\"prependicon !== null\"\r\n    slot=\"prepend-icon\" \r\n    [attr.name]=\"prependicon?.name\"\r\n    [attr.title]=\"prependicon?.title\" \r\n    [attr.color]=\"prependicon?.color\" \r\n    [attr.color2]=\"prependicon?.color2\" \r\n    [attr.size]=\"prependicon?.size\" \r\n    [attr.padding]=\"prependicon?.padding\"  \r\n    [attr.rotate]=\"prependicon?.rotate\" \r\n    [attr.colorpreset]=\"prependicon?.colorpreset\"   \r\n    [attr.height]=\"prependicon?.height\"   \r\n    [attr.width]=\"prependicon?.width\"></ids-icon>\r\n    <id-anchor *ngIf=\"link\" [link]=\"link\"></id-anchor>\r\n    <ng-content *ngIf=\"!link\"></ng-content>\r\n    <ids-icon *ngIf=\"appendicon !== null\" \r\n    slot=\"append-icon\" \r\n    [attr.name]=\"appendicon?.name\"\r\n    [attr.title]=\"appendicon?.title\" \r\n    [attr.color]=\"appendicon?.color\" \r\n    [attr.color2]=\"appendicon?.color2\"\r\n    [attr.size]=\"appendicon?.size\"  \r\n    [attr.padding]=\"appendicon?.padding\"  \r\n    [attr.rotate]=\"appendicon?.rotate\"  \r\n    [attr.colorpreset]=\"appendicon?.colorpreset\"   \r\n    [attr.height]=\"appendicon?.height\"   \r\n    [attr.width]=\"appendicon?.width\"></ids-icon>\r\n    <ids-notification-badge \r\n    *ngIf=\"notificationbadge !== null\"\r\n    [attr.type]=\"notificationbadge.type\"\r\n    [attr.size]=\"notificationbadge.size\">\r\n    {{notificationbadge.value}}\r\n  </ids-notification-badge>\r\n</ids-link>", styles: [":host { display: inline; }"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDLinkComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         selector: 'id-link',
-                        templateUrl: './link.component.html'
+                        templateUrl: './link.component.html',
+                        styles: [':host { display: inline; }']
                     }]
             }], ctorParameters: function () { return []; }, propDecorators: { link: [{
                     type: i0.Input
-                }], notificationBadge: [{
+                }], notificationbadge: [{
                     type: i0.Input
-                }], prependIcon: [{
+                }], prependicon: [{
                     type: i0.Input
-                }], appendIcon: [{
+                }], appendicon: [{
                     type: i0.Input
                 }], underlined: [{
                     type: i0.Input
@@ -2170,9 +2192,9 @@
                     type: i0.Input
                 }], size: [{
                     type: i0.Input
-                }], activeIcon: [{
+                }], activeicon: [{
                     type: i0.Input
-                }], activeIconBackground: [{
+                }], activeiconbackground: [{
                     type: i0.Input
                 }], external: [{
                     type: i0.Input
@@ -2186,15 +2208,15 @@
         return IDLinkModule;
     }());
     IDLinkModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDLinkModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    IDLinkModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDLinkModule, declarations: [IDLinkComponent], imports: [i2.CommonModule, IDAnchorModule], exports: [IDLinkComponent] });
-    IDLinkModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDLinkModule, imports: [[i2.CommonModule, IDAnchorModule]] });
+    IDLinkModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDLinkModule, declarations: [IDLinkComponent], imports: [i2.CommonModule], exports: [IDLinkComponent] });
+    IDLinkModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDLinkModule, imports: [[i2.CommonModule]] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDLinkModule, decorators: [{
                 type: i0.NgModule,
                 args: [{
                         declarations: [
                             IDLinkComponent
                         ],
-                        imports: [i2.CommonModule, IDAnchorModule],
+                        imports: [i2.CommonModule],
                         exports: [
                             IDLinkComponent
                         ],
@@ -2245,14 +2267,14 @@
             this.date = null;
             this.year = null;
             this.month = null;
-            this.monthLabel = null;
+            this.monthlabel = null;
             this.day = null;
-            this.showDateLabel = false;
+            this.showdatelabel = false;
         }
         return IDListItemComponent;
     }());
     IDListItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDListItemComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDListItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDListItemComponent, selector: "id-list-item", inputs: { headline: "headline", date: "date", year: "year", month: "month", monthLabel: "monthLabel", day: "day", showDateLabel: "showDateLabel" }, ngImport: i0__namespace, template: "<ids-list-item\r\n[headline]=\"headline\"\r\n[date]=\"date\"\r\n[year]=\"year\"\r\n[month]=\"month\"\r\n[monthlabel]=\"monthLabel\"\r\n[day]=\"day\"\r\n[showdatelabel]=\"showDateLabel\">\r\n  <ng-content></ng-content>\r\n</ids-list-item>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    IDListItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDListItemComponent, selector: "id-list-item", inputs: { headline: "headline", date: "date", year: "year", month: "month", monthlabel: "monthlabel", day: "day", showdatelabel: "showdatelabel" }, ngImport: i0__namespace, template: "<ids-list-item\r\n[headline]=\"headline\"\r\n[date]=\"date\"\r\n[year]=\"year\"\r\n[month]=\"month\"\r\n[monthlabel]=\"monthlabel\"\r\n[day]=\"day\"\r\n[showdatelabel]=\"showdatelabel\">\r\n  <ng-content></ng-content>\r\n</ids-list-item>", encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDListItemComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -2268,11 +2290,11 @@
                     type: i0.Input
                 }], month: [{
                     type: i0.Input
-                }], monthLabel: [{
+                }], monthlabel: [{
                     type: i0.Input
                 }], day: [{
                     type: i0.Input
-                }], showDateLabel: [{
+                }], showdatelabel: [{
                     type: i0.Input
                 }] } });
 
@@ -2455,7 +2477,7 @@
         return IDMobileMenuComponent;
     }());
     IDMobileMenuComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDMobileMenuComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDMobileMenuComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDMobileMenuComponent, selector: "id-mobile-menu", inputs: { type: "type", variation: "variation", items: "items" }, ngImport: i0__namespace, template: "<ids-mobile-menu \n  [type]=\"type\"\n  [variation]=\"variation\">\n  <ids-mobile-menu-item *ngFor=\"let item of items\"\n    [attr.type]=\"type\"\n    [headline]=\"item?.headline\"\n    [expanded]=\"item?.expanded\"\n    [secondary]=\"item?.secondary\"\n    [variation]=\"variation\"\n    [active]=\"item?.active\"\n    (didToggleExpansion)=\"item.togleExpansion()\">\n      <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\n      <ids-mobile-menu-item *ngFor=\"let item of item.items\"\n      [attr.type]=\"type\"\n      [headline]=\"item?.headline\"\n      [expanded]=\"item?.expanded\"\n      [secondary]=\"item?.secondary\"\n      [active]=\"item?.active\"\n      [variation]=\"variation\"\n      (didToggleExpansion)=\"item.togleExpansion()\">\n        <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\n        <ids-mobile-menu-item *ngFor=\"let item of item.items\"\n        [attr.type]=\"type\"\n        [headline]=\"item?.headline\"\n        [expanded]=\"item?.expanded\"\n        [secondary]=\"item?.secondary\"\n        [active]=\"item?.active\"\n        [variation]=\"variation\"\n        (didToggleExpansion)=\"item.togleExpansion()\">\n          <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\n            <ids-mobile-menu-item *ngFor=\"let item of item.items\"\n            [attr.type]=\"type\"\n            [headline]=\"item?.headline\"\n            [expanded]=\"item?.expanded\"\n            [secondary]=\"item?.secondary\"\n            [active]=\"item?.active\"\n            [variation]=\"variation\"\n            (didToggleExpansion)=\"item.togleExpansion()\">\n              <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\n            </ids-mobile-menu-item>\n        </ids-mobile-menu-item>\n      </ids-mobile-menu-item>\n  </ids-mobile-menu-item>\n</ids-mobile-menu>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    IDMobileMenuComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDMobileMenuComponent, selector: "id-mobile-menu", inputs: { type: "type", variation: "variation", items: "items" }, ngImport: i0__namespace, template: "<ids-mobile-menu \r\n  [type]=\"type\"\r\n  [variation]=\"variation\">\r\n  <ids-mobile-menu-item *ngFor=\"let item of items\"\r\n    [attr.type]=\"type\"\r\n    [headline]=\"item?.headline\"\r\n    [expanded]=\"item?.expanded\"\r\n    [secondary]=\"item?.secondary\"\r\n    [variation]=\"variation\"\r\n    [active]=\"item?.active\"\r\n    (didToggleExpansion)=\"item.togleExpansion()\">\r\n      <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n      <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n      [attr.type]=\"type\"\r\n      [headline]=\"item?.headline\"\r\n      [expanded]=\"item?.expanded\"\r\n      [secondary]=\"item?.secondary\"\r\n      [active]=\"item?.active\"\r\n      [variation]=\"variation\"\r\n      (didToggleExpansion)=\"item.togleExpansion()\">\r\n        <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n        <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n        [attr.type]=\"type\"\r\n        [headline]=\"item?.headline\"\r\n        [expanded]=\"item?.expanded\"\r\n        [secondary]=\"item?.secondary\"\r\n        [active]=\"item?.active\"\r\n        [variation]=\"variation\"\r\n        (didToggleExpansion)=\"item.togleExpansion()\">\r\n          <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n            <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n            [attr.type]=\"type\"\r\n            [headline]=\"item?.headline\"\r\n            [expanded]=\"item?.expanded\"\r\n            [secondary]=\"item?.secondary\"\r\n            [active]=\"item?.active\"\r\n            [variation]=\"variation\"\r\n            (didToggleExpansion)=\"item.togleExpansion()\">\r\n              <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n            </ids-mobile-menu-item>\r\n        </ids-mobile-menu-item>\r\n      </ids-mobile-menu-item>\r\n  </ids-mobile-menu-item>\r\n</ids-mobile-menu>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDMobileMenuComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -2562,24 +2584,24 @@
 
     var IDPopoverComponent = /** @class */ (function () {
         function IDPopoverComponent() {
-            this.maxWidth = '260px';
-            this.maxHeight = '260px';
+            this.maxwidth = '260px';
+            this.maxheight = '260px';
             this.cathegory = undefined;
             this.position = 'bottom';
         }
         return IDPopoverComponent;
     }());
     IDPopoverComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDPopoverComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDPopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDPopoverComponent, selector: "id-popover", inputs: { maxWidth: "maxWidth", maxHeight: "maxHeight", cathegory: "cathegory", position: "position" }, ngImport: i0__namespace, template: "<ids-popover \r\n  [attr.cathegory]=\"cathegory\"\r\n  [attr.position]=\"position\">\r\n  <ng-content></ng-content>\r\n  <ids-popover-content \r\n    [attr.maxwidth]=\"maxWidth\"\r\n    [attr.maxheight]=\"maxHeight\">\r\n    <ng-content select=\"[popover-content]\"></ng-content>\r\n  </ids-popover-content>\r\n</ids-popover>" });
+    IDPopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDPopoverComponent, selector: "id-popover", inputs: { maxwidth: "maxwidth", maxheight: "maxheight", cathegory: "cathegory", position: "position" }, ngImport: i0__namespace, template: "<ids-popover \r\n  [attr.cathegory]=\"cathegory\"\r\n  [attr.position]=\"position\">\r\n  <ng-content></ng-content>\r\n  <ids-popover-content \r\n    [attr.maxwidth]=\"maxwidth\"\r\n    [attr.maxheight]=\"maxheight\">\r\n    <ng-content select=\"[popover-content]\"></ng-content>\r\n  </ids-popover-content>\r\n</ids-popover>" });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDPopoverComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         selector: 'id-popover',
                         templateUrl: './popover.component.html',
                     }]
-            }], ctorParameters: function () { return []; }, propDecorators: { maxWidth: [{
+            }], ctorParameters: function () { return []; }, propDecorators: { maxwidth: [{
                     type: i0.Input
-                }], maxHeight: [{
+                }], maxheight: [{
                     type: i0.Input
                 }], cathegory: [{
                     type: i0.Input
@@ -2656,15 +2678,16 @@
             this.headline = '';
             this.servicename = '';
             this.subheadline = '';
+            this.cols = 3;
             this.linkcol1 = '2';
             this.linkcol2 = '2';
             this.linkcol3 = '2';
-            this.mobileMenuItems = undefined;
+            this.mobilemenuitems = undefined;
         }
         return IDFooterComponent;
     }());
     IDFooterComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDFooterComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDFooterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDFooterComponent, selector: "id-footer", inputs: { type: "type", headline: "headline", servicename: "servicename", subheadline: "subheadline", linkcol1: "linkcol1", linkcol2: "linkcol2", linkcol3: "linkcol3", mobileMenuItems: "mobileMenuItems" }, ngImport: i0__namespace, template: "<ids-footer \r\n  [type]=\"type\"\r\n  [headline]=\"headline\"\r\n  [subheadline]=\"subheadline\"\r\n  [servicename]=\"servicename\"\r\n  [linkcol1]=\"linkcol1\"\r\n  [linkcol2]=\"linkcol2\"\r\n  [linkcol3]=\"linkcol3\">\r\n  <ng-content></ng-content>\r\n  <ids-mobile-menu \r\n  slot=\"mobile-menu\"\r\n  variation=\"2\"\r\n  *ngIf=\"mobileMenuItems\"\r\n  [type]=\"type\">\r\n    <ids-mobile-menu-item *ngFor=\"let item of mobileMenuItems\"\r\n      [attr.type]=\"type\"\r\n      [headline]=\"item?.headline\"\r\n      [expanded]=\"item?.expanded\"\r\n      [secondary]=\"item?.secondary\"\r\n      [active]=\"item?.active\"\r\n      (didToggleExpansion)=\"item.togleExpansion()\">\r\n        <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n        <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n        [attr.type]=\"type\"\r\n        [headline]=\"item?.headline\"\r\n        [expanded]=\"item?.expanded\"\r\n        [secondary]=\"item?.secondary\"\r\n        [active]=\"item?.active\"\r\n        (didToggleExpansion)=\"item.togleExpansion()\">\r\n          <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n          <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n          [attr.type]=\"type\"\r\n          [headline]=\"item?.headline\"\r\n          [expanded]=\"item?.expanded\"\r\n          [secondary]=\"item?.secondary\"\r\n          [active]=\"item?.active\"\r\n          (didToggleExpansion)=\"item.togleExpansion()\">\r\n            <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n              <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n              [attr.type]=\"type\"\r\n              [headline]=\"item?.headline\"\r\n              [expanded]=\"item?.expanded\"\r\n              [secondary]=\"item?.secondary\"\r\n              [active]=\"item?.active\"\r\n              (didToggleExpansion)=\"item.togleExpansion()\">\r\n                <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n              </ids-mobile-menu-item>\r\n          </ids-mobile-menu-item>\r\n        </ids-mobile-menu-item>\r\n    </ids-mobile-menu-item>\r\n  </ids-mobile-menu>\r\n</ids-footer>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+    IDFooterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDFooterComponent, selector: "id-footer", inputs: { type: "type", headline: "headline", servicename: "servicename", subheadline: "subheadline", cols: "cols", linkcol1: "linkcol1", linkcol2: "linkcol2", linkcol3: "linkcol3", mobilemenuitems: "mobilemenuitems" }, ngImport: i0__namespace, template: "<ids-footer \r\n  [type]=\"type\"\r\n  [headline]=\"headline\"\r\n  [subheadline]=\"subheadline\"\r\n  [servicename]=\"servicename\"\r\n  [cols]=\"cols\"\r\n  [linkcol1]=\"linkcol1\"\r\n  [linkcol2]=\"linkcol2\"\r\n  [linkcol3]=\"linkcol3\">\r\n  <ng-content></ng-content>\r\n  <ids-mobile-menu \r\n  slot=\"mobile-menu\"\r\n  variation=\"2\"\r\n  *ngIf=\"mobilemenuitems\"\r\n  [type]=\"type\">\r\n    <ids-mobile-menu-item *ngFor=\"let item of mobilemenuitems\"\r\n      [attr.type]=\"type\"\r\n      [headline]=\"item?.headline\"\r\n      [expanded]=\"item?.expanded\"\r\n      [secondary]=\"item?.secondary\"\r\n      [active]=\"item?.active\"\r\n      (didToggleExpansion)=\"item.togleExpansion()\">\r\n        <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n        <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n        [attr.type]=\"type\"\r\n        [headline]=\"item?.headline\"\r\n        [expanded]=\"item?.expanded\"\r\n        [secondary]=\"item?.secondary\"\r\n        [active]=\"item?.active\"\r\n        (didToggleExpansion)=\"item.togleExpansion()\">\r\n          <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n          <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n          [attr.type]=\"type\"\r\n          [headline]=\"item?.headline\"\r\n          [expanded]=\"item?.expanded\"\r\n          [secondary]=\"item?.secondary\"\r\n          [active]=\"item?.active\"\r\n          (didToggleExpansion)=\"item.togleExpansion()\">\r\n            <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n              <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n              [attr.type]=\"type\"\r\n              [headline]=\"item?.headline\"\r\n              [expanded]=\"item?.expanded\"\r\n              [secondary]=\"item?.secondary\"\r\n              [active]=\"item?.active\"\r\n              (didToggleExpansion)=\"item.togleExpansion()\">\r\n                <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n              </ids-mobile-menu-item>\r\n          </ids-mobile-menu-item>\r\n        </ids-mobile-menu-item>\r\n    </ids-mobile-menu-item>\r\n  </ids-mobile-menu>\r\n</ids-footer>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDFooterComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -2679,13 +2702,15 @@
                     type: i0.Input
                 }], subheadline: [{
                     type: i0.Input
+                }], cols: [{
+                    type: i0.Input
                 }], linkcol1: [{
                     type: i0.Input
                 }], linkcol2: [{
                     type: i0.Input
                 }], linkcol3: [{
                     type: i0.Input
-                }], mobileMenuItems: [{
+                }], mobilemenuitems: [{
                     type: i0.Input
                 }] } });
 
@@ -2714,21 +2739,21 @@
     var IDHeaderComponent = /** @class */ (function () {
         function IDHeaderComponent() {
             this.type = '';
-            this.mobileMenuText = 'Meny';
-            this.hideRegionPicker = false;
+            this.hideregionpicker = false;
+            this.fluid = false;
             this.unresponsive = false;
-            this.hideBrand = false;
-            this.logoHref = '';
-            this.pickRegionText = 'Välj region';
-            this.srLogoLabel = 'Logotyp';
-            this.avatarMaxWidth = '';
-            this.persistentMobileMenu = false;
-            this.didToggleRegion = new i0.EventEmitter();
+            this.hidebrand = false;
+            this.logohref = '';
+            this.pickregiontext = 'Välj region';
+            this.srlogolabel = 'Logotyp';
+            this.avatarmaxwidth = '';
+            this.persistentmobilemenu = false;
+            this.onDidToggleRegion = new i0.EventEmitter();
         }
         return IDHeaderComponent;
     }());
     IDHeaderComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDHeaderComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDHeaderComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDHeaderComponent, selector: "id-header", inputs: { type: "type", brandText: "brandText", brandTextTop: "brandTextTop", brandTextBottom: "brandTextBottom", mobileMenuText: "mobileMenuText", hideRegionPicker: "hideRegionPicker", unresponsive: "unresponsive", hideBrand: "hideBrand", logoHref: "logoHref", pickRegionText: "pickRegionText", regionIcon: "regionIcon", regionIconTitle: "regionIconTitle", srLogoLabel: "srLogoLabel", items: "items", avatar: "avatar", avatarMaxWidth: "avatarMaxWidth", navItems: "navItems", persistentMobileMenu: "persistentMobileMenu", mobileItems: "mobileItems", mobileMenuItems: "mobileMenuItems" }, outputs: { didToggleRegion: "didToggleRegion" }, ngImport: i0__namespace, template: "<ids-header \r\n  [attr.type]=\"type\"\r\n  [attr.brandtext]=\"brandText\"\r\n  [attr.brandtexttop]=\"brandTextTop\"\r\n  [attr.brandtextbottom]=\"brandTextBottom\"\r\n  [unresponsive]=\"unresponsive\"\r\n  [hideregionpicker]=\"hideRegionPicker\"\r\n  [logohref]=\"logoHref\"\r\n  [hidebrand]=\"hideBrand\"\r\n  [pickregiontext]=\"pickRegionText\"\r\n  [regionicon]=\"regionIcon\"\r\n  [regionicontitle]=\"regionIconTitle\"\r\n  [srlogolabel]=\"srLogoLabel\"\r\n  (didToggleRegion)=\"didToggleRegion.emit(true)\">\r\n\r\n  <ids-header-item *ngFor=\"let item of items\" \r\n    [attr.type]=\"type\"\r\n    [icon]=\"item.iconName\" \r\n    [mobile]=\"item.mobile\"\r\n    [attr.separatorleft]=\"item.separatorLeft\">\r\n    <id-anchor [link]=\"item.link\"></id-anchor>\r\n  </ids-header-item>\r\n\r\n  <ids-header-nav slot=\"header-nav\" *ngIf=\"navItems || mobileItems\" [attr.type]=\"type\">\r\n    <ids-header-nav-item *ngFor=\"let navItem of navItems; let i = index\" [attr.type]=\"type\" [label]=\"navItem.label\" [link]=\"navItem.link\" [active]=\"navItem.active\">\r\n      <id-anchor *ngIf=\"navItem.link\" [link]=\"navItem.link\"></id-anchor>\r\n      <ids-link slot=\"col-1\" [block]=\"true\" *ngFor=\"let link of navItem.col1\">\r\n        <ids-icon *ngIf=\"type.indexOf('1177')\" name=\"arrow\"></ids-icon>\r\n        <ids-icon *ngIf=\"type.indexOf('inera')\" color=\"var(--color-main)\" name=\"arrow\"></ids-icon>\r\n        <id-anchor [link]=\"link\"></id-anchor>\r\n      </ids-link> \r\n      <ids-link slot=\"col-2\" [block]=\"true\" *ngFor=\"let link of navItem.col2\">\r\n        <ids-icon *ngIf=\"type.indexOf('1177')\" name=\"arrow\"></ids-icon>\r\n        <ids-icon *ngIf=\"type.indexOf('inera')\" color=\"var(--color-main)\" name=\"arrow\"></ids-icon>\r\n        <id-anchor [link]=\"link\"></id-anchor>\r\n      </ids-link>\r\n      <ids-link slot=\"col-3\" [block]=\"true\" *ngFor=\"let link of navItem.col3\">\r\n        <ids-icon *ngIf=\"type.indexOf('1177')\" name=\"arrow\"></ids-icon>\r\n        <ids-icon *ngIf=\"type.indexOf('inera')\" color=\"var(--color-main)\" name=\"arrow\"></ids-icon>\r\n        <id-anchor [link]=\"link\"></id-anchor>\r\n      </ids-link>\r\n      <div slot=\"col-4\">\r\n        <h2 style=\"margin-bottom: 15px; color: var(--header-nav-item-heading_color);\" class=\"ids-heading-2\">{{navItem.headline}}</h2>\r\n        <p class=\"body\">{{navItem.paragraph}}</p>\r\n        <id-anchor [link]=\"navItem.paragraphLink\"></id-anchor>\r\n      </div>\r\n    </ids-header-nav-item>\r\n    <ids-header-mobile-item [attr.type]=\"type\" *ngFor=\"let mobileItem of mobileItems\" [icon]=\"mobileItem.iconName\">\r\n      <id-anchor [link]=\"mobileItem.link\"></id-anchor>\r\n    </ids-header-mobile-item>\r\n    \r\n    <ids-header-mobile-menu \r\n      [attr.persistent]=\"persistentMobileMenu ? true : null\"\r\n      [attr.type]=\"type\" *ngIf=\"mobileMenuItems\">\r\n      {{mobileMenuText}}\r\n      <ids-mobile-menu-item [attr.type]=\"type\" *ngFor=\"let item of mobileMenuItems\"\r\n        slot=\"menu-link\"\r\n        [attr.type]=\"type\"\r\n        [headline]=\"item?.headline\"\r\n        [expanded]=\"item?.expanded\"\r\n        [secondary]=\"item?.secondary\"\r\n        [active]=\"item?.active\"\r\n        (didToggleExpansion)=\"item.togleExpansion()\">\r\n          <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n          <ids-mobile-menu-item [attr.type]=\"type\" *ngFor=\"let item of item.items\"\r\n          [attr.type]=\"type\"\r\n          [headline]=\"item?.headline\"\r\n          [expanded]=\"item?.expanded\"\r\n          [secondary]=\"item?.secondary\"\r\n          [active]=\"item?.active\"\r\n          (didToggleExpansion)=\"item.togleExpansion()\">\r\n            <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n            <ids-mobile-menu-item [attr.type]=\"type\" *ngFor=\"let item of item.items\"\r\n            [attr.type]=\"type\"\r\n            [headline]=\"item?.headline\"\r\n            [expanded]=\"item?.expanded\"\r\n            [secondary]=\"item?.secondary\"\r\n            [active]=\"item?.active\"\r\n            (didToggleExpansion)=\"item.togleExpansion()\">\r\n              <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n                <ids-mobile-menu-item [attr.type]=\"type\" *ngFor=\"let item of item.items\"\r\n                [attr.type]=\"type\"\r\n                [headline]=\"item?.headline\"\r\n                [expanded]=\"item?.expanded\"\r\n                [secondary]=\"item?.secondary\"\r\n                [active]=\"item?.active\"\r\n                (didToggleExpansion)=\"item.togleExpansion()\">\r\n                  <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n                </ids-mobile-menu-item>\r\n            </ids-mobile-menu-item>\r\n          </ids-mobile-menu-item>\r\n      </ids-mobile-menu-item>\r\n    </ids-header-mobile-menu>\r\n  </ids-header-nav>\r\n\r\n  <ids-header-avatar [maxwidth]=\"avatarMaxWidth\" [attr.type]=\"type\" *ngIf=\"avatar\" [unit]=\"avatar.unit\" [username]=\"avatar.username\">\r\n    <ng-content select=\"[avatar]\"></ng-content>\r\n    <id-anchor [link]=\"avatar.linkLeft\" slot=\"avatar-left\"></id-anchor>\r\n    <id-anchor [link]=\"avatar.linkRight\" slot=\"avatar-right\"></id-anchor>\r\n  </ids-header-avatar>\r\n\r\n  <ng-content></ng-content>\r\n\r\n  <ids-header-mobile-menu \r\n    [attr.persistent]=\"persistentMobileMenu ? true : null\"\r\n    *ngIf=\"type !== '1177' && (mobileMenuItems || avatar)\"\r\n    [type]=\"type\">\r\n    <ids-mobile-menu-item *ngFor=\"let item of mobileMenuItems\"\r\n      [attr.type]=\"type\"\r\n      [headline]=\"item?.headline\"\r\n      [expanded]=\"item?.expanded\"\r\n      (didToggleExpansion)=\"item.togleExpansion()\">\r\n        <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n        <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n        [attr.type]=\"type\"\r\n        [headline]=\"item?.headline\"\r\n        [expanded]=\"item?.expanded\"\r\n        (didToggleExpansion)=\"item.togleExpansion()\">\r\n          <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n          <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n          [attr.type]=\"type\"\r\n          [headline]=\"item?.headline\"\r\n          [expanded]=\"item?.expanded\"\r\n          (didToggleExpansion)=\"item.togleExpansion()\">\r\n            <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n              <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n              [attr.type]=\"type\"\r\n              [headline]=\"item?.headline\"\r\n              [expanded]=\"item?.expanded\"\r\n              (didToggleExpansion)=\"item.togleExpansion()\">\r\n                <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n              </ids-mobile-menu-item>\r\n          </ids-mobile-menu-item>\r\n        </ids-mobile-menu-item>\r\n    </ids-mobile-menu-item>\r\n    <ids-mobile-menu-avatar *ngIf=\"avatar\" [username]=\"avatar.username\" [unit]=\"avatar.unit\">\r\n      <ng-content select=\"[avatarMobile]\"></ng-content>\r\n      <id-anchor style=\"color: var(--mobile-menu-avatar-link)\" *ngIf=\"avatar.linkMobile\" [link]=\"avatar.linkMobile\"></id-anchor>\r\n    </ids-mobile-menu-avatar>\r\n  </ids-header-mobile-menu>\r\n</ids-header>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    IDHeaderComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDHeaderComponent, selector: "id-header", inputs: { type: "type", brandtext: "brandtext", brandtexttop: "brandtexttop", brandtextbottom: "brandtextbottom", hideregionpicker: "hideregionpicker", fluid: "fluid", unresponsive: "unresponsive", hidebrand: "hidebrand", logohref: "logohref", pickregiontext: "pickregiontext", regionicon: "regionicon", regionicontitle: "regionicontitle", srlogolabel: "srlogolabel", items: "items", avatar: "avatar", avatarmaxwidth: "avatarmaxwidth", navitems: "navitems", persistentmobilemenu: "persistentmobilemenu", mobileitems: "mobileitems", mobilemenuitems: "mobilemenuitems" }, outputs: { onDidToggleRegion: "onDidToggleRegion" }, ngImport: i0__namespace, template: "<ids-header \r\n  [attr.type]=\"type\"\r\n  [attr.fluid]=\"fluid ? true : null\"\r\n  [attr.brandtext]=\"brandtext\"\r\n  [attr.brandtexttop]=\"brandtexttop\"\r\n  [attr.brandtextbottom]=\"brandtextbottom\"\r\n  [unresponsive]=\"unresponsive ? true : null\"\r\n  [hideregionpicker]=\"hideregionpicker ? true : null\"\r\n  [logohref]=\"logohref\"\r\n  [hidebrand]=\"hidebrand\"\r\n  [pickregiontext]=\"pickregiontext\"\r\n  [srlogolabel]=\"srlogolabel\"\r\n  (didToggleRegion)=\"onDidToggleRegion.emit(true)\">\r\n  <ids-icon *ngIf=\"regionicon\" slot=\"region\" [name]=\"regionicon\" [title]=\"regionicontitle\"></ids-icon>\r\n  <ids-header-item *ngFor=\"let item of items\" \r\n    [attr.type]=\"type\"\r\n    [mobile]=\"item.mobile\"\r\n    [attr.separatorleft]=\"item.separatorLeft\">\r\n    <ids-icon [name]=\"item.iconName\"></ids-icon>\r\n    <id-anchor [link]=\"item.link\"></id-anchor>\r\n  </ids-header-item>\r\n\r\n  <ids-header-nav slot=\"header-nav\" *ngIf=\"navitems || mobileitems\" [attr.type]=\"type\">\r\n    <ids-header-nav-item *ngFor=\"let navitem of navitems; let i = index\" [attr.type]=\"type\" [label]=\"navitem.label\" [link]=\"navitem.link\" [active]=\"navitem.active\">\r\n      <id-anchor *ngIf=\"navitem.link\" [link]=\"navitem.link\"></id-anchor>\r\n      <ids-link slot=\"col-1\" [block]=\"true\" *ngFor=\"let link of navitem.col1\">\r\n        <ids-icon *ngIf=\"type.indexOf('1177')\" name=\"arrow\"></ids-icon>\r\n        <ids-icon *ngIf=\"type.indexOf('inera')\" color=\"var(--color-main)\" name=\"arrow\"></ids-icon>\r\n        <id-anchor [link]=\"link\"></id-anchor>\r\n      </ids-link> \r\n      <ids-link slot=\"col-2\" [block]=\"true\" *ngFor=\"let link of navitem.col2\">\r\n        <ids-icon *ngIf=\"type.indexOf('1177')\" name=\"arrow\"></ids-icon>\r\n        <ids-icon *ngIf=\"type.indexOf('inera')\" color=\"var(--color-main)\" name=\"arrow\"></ids-icon>\r\n        <id-anchor [link]=\"link\"></id-anchor>\r\n      </ids-link>\r\n      <ids-link slot=\"col-3\" [block]=\"true\" *ngFor=\"let link of navitem.col3\">\r\n        <ids-icon *ngIf=\"type.indexOf('1177')\" name=\"arrow\"></ids-icon>\r\n        <ids-icon *ngIf=\"type.indexOf('inera')\" color=\"var(--color-main)\" name=\"arrow\"></ids-icon>\r\n        <id-anchor [link]=\"link\"></id-anchor>\r\n      </ids-link>\r\n      <div slot=\"col-4\">\r\n        <h2 style=\"margin-bottom: 15px; color: var(--header-nav-item-heading_color);\" class=\"ids-heading-2\">{{navitem.headline}}</h2>\r\n        <p class=\"body\">{{navitem.paragraph}}</p>\r\n        <id-anchor [link]=\"navitem.paragraphLink\"></id-anchor>\r\n      </div>\r\n    </ids-header-nav-item>\r\n    <ids-header-mobile-item [attr.type]=\"type\" *ngFor=\"let mobileItem of mobileitems\">\r\n      <ids-icon [name]=\"mobileItem.iconName\"></ids-icon>\r\n      <id-anchor [link]=\"mobileItem.link\"></id-anchor>\r\n    </ids-header-mobile-item>\r\n    \r\n    <ids-header-mobile-menu \r\n      [attr.persistent]=\"persistentmobilemenu ? true : null\"\r\n      [attr.type]=\"type\" *ngIf=\"mobilemenuitems\">\r\n      <ids-mobile-menu-item [attr.type]=\"type\" *ngFor=\"let item of mobilemenuitems\"\r\n        slot=\"menu-link\"\r\n        [attr.type]=\"type\"\r\n        [headline]=\"item?.headline\"\r\n        [expanded]=\"item?.expanded\"\r\n        [secondary]=\"item?.secondary\"\r\n        [active]=\"item?.active\"\r\n        (didToggleExpansion)=\"item.togleExpansion()\">\r\n          <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n          <ids-mobile-menu-item [attr.type]=\"type\" *ngFor=\"let item of item.items\"\r\n          [attr.type]=\"type\"\r\n          [headline]=\"item?.headline\"\r\n          [expanded]=\"item?.expanded\"\r\n          [secondary]=\"item?.secondary\"\r\n          [active]=\"item?.active\"\r\n          (didToggleExpansion)=\"item.togleExpansion()\">\r\n            <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n            <ids-mobile-menu-item [attr.type]=\"type\" *ngFor=\"let item of item.items\"\r\n            [attr.type]=\"type\"\r\n            [headline]=\"item?.headline\"\r\n            [expanded]=\"item?.expanded\"\r\n            [secondary]=\"item?.secondary\"\r\n            [active]=\"item?.active\"\r\n            (didToggleExpansion)=\"item.togleExpansion()\">\r\n              <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n                <ids-mobile-menu-item [attr.type]=\"type\" *ngFor=\"let item of item.items\"\r\n                [attr.type]=\"type\"\r\n                [headline]=\"item?.headline\"\r\n                [expanded]=\"item?.expanded\"\r\n                [secondary]=\"item?.secondary\"\r\n                [active]=\"item?.active\"\r\n                (didToggleExpansion)=\"item.togleExpansion()\">\r\n                  <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n                </ids-mobile-menu-item>\r\n            </ids-mobile-menu-item>\r\n          </ids-mobile-menu-item>\r\n      </ids-mobile-menu-item>\r\n    </ids-header-mobile-menu>\r\n  </ids-header-nav>\r\n\r\n  <ids-header-avatar [maxwidth]=\"avatar.maxWidth\" [attr.type]=\"type\" *ngIf=\"avatar\" [unit]=\"avatar.unit\" [username]=\"avatar.username\">\r\n    <ng-content select=\"[avatar]\"></ng-content>\r\n    <id-anchor [link]=\"avatar.linkLeft\" slot=\"avatar-left\"></id-anchor>\r\n    <id-anchor [link]=\"avatar.linkRight\" slot=\"avatar-right\"></id-anchor>\r\n  </ids-header-avatar>\r\n\r\n  <ng-content></ng-content>\r\n\r\n  <ids-header-mobile-menu \r\n    [attr.persistent]=\"persistentmobilemenu ? true : null\"\r\n    *ngIf=\"type !== '1177' && (mobilemenuitems || avatar)\"\r\n    [type]=\"type\">\r\n    <ids-mobile-menu-item *ngFor=\"let item of mobilemenuitems\"\r\n      [attr.type]=\"type\"\r\n      [headline]=\"item?.headline\"\r\n      [expanded]=\"item?.expanded\"\r\n      (didToggleExpansion)=\"item.togleExpansion()\">\r\n        <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n        <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n        [attr.type]=\"type\"\r\n        [headline]=\"item?.headline\"\r\n        [expanded]=\"item?.expanded\"\r\n        (didToggleExpansion)=\"item.togleExpansion()\">\r\n          <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n          <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n          [attr.type]=\"type\"\r\n          [headline]=\"item?.headline\"\r\n          [expanded]=\"item?.expanded\"\r\n          (didToggleExpansion)=\"item.togleExpansion()\">\r\n            <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n              <ids-mobile-menu-item *ngFor=\"let item of item.items\"\r\n              [attr.type]=\"type\"\r\n              [headline]=\"item?.headline\"\r\n              [expanded]=\"item?.expanded\"\r\n              (didToggleExpansion)=\"item.togleExpansion()\">\r\n                <id-anchor *ngIf=\"item.link\" [link]=\"item.link\"></id-anchor>\r\n              </ids-mobile-menu-item>\r\n          </ids-mobile-menu-item>\r\n        </ids-mobile-menu-item>\r\n    </ids-mobile-menu-item>\r\n    <ids-mobile-menu-avatar *ngIf=\"avatar\" [username]=\"avatar.username\" [unit]=\"avatar.unit\">\r\n      <ng-content select=\"[avatarMobile]\"></ng-content>\r\n      <id-anchor style=\"color: var(--mobile-menu-avatar-link)\" *ngIf=\"avatar.linkMobile\" [link]=\"avatar.linkMobile\"></id-anchor>\r\n    </ids-mobile-menu-avatar>\r\n  </ids-header-mobile-menu>\r\n</ids-header>", components: [{ type: IDAnchorComponent, selector: "id-anchor", inputs: ["link", "contextClasses"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDHeaderComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -2737,45 +2762,45 @@
                     }]
             }], propDecorators: { type: [{
                     type: i0.Input
-                }], brandText: [{
+                }], brandtext: [{
                     type: i0.Input
-                }], brandTextTop: [{
+                }], brandtexttop: [{
                     type: i0.Input
-                }], brandTextBottom: [{
+                }], brandtextbottom: [{
                     type: i0.Input
-                }], mobileMenuText: [{
+                }], hideregionpicker: [{
                     type: i0.Input
-                }], hideRegionPicker: [{
+                }], fluid: [{
                     type: i0.Input
                 }], unresponsive: [{
                     type: i0.Input
-                }], hideBrand: [{
+                }], hidebrand: [{
                     type: i0.Input
-                }], logoHref: [{
+                }], logohref: [{
                     type: i0.Input
-                }], pickRegionText: [{
+                }], pickregiontext: [{
                     type: i0.Input
-                }], regionIcon: [{
+                }], regionicon: [{
                     type: i0.Input
-                }], regionIconTitle: [{
+                }], regionicontitle: [{
                     type: i0.Input
-                }], srLogoLabel: [{
+                }], srlogolabel: [{
                     type: i0.Input
                 }], items: [{
                     type: i0.Input
                 }], avatar: [{
                     type: i0.Input
-                }], avatarMaxWidth: [{
+                }], avatarmaxwidth: [{
                     type: i0.Input
-                }], navItems: [{
+                }], navitems: [{
                     type: i0.Input
-                }], persistentMobileMenu: [{
+                }], persistentmobilemenu: [{
                     type: i0.Input
-                }], mobileItems: [{
+                }], mobileitems: [{
                     type: i0.Input
-                }], mobileMenuItems: [{
+                }], mobilemenuitems: [{
                     type: i0.Input
-                }], didToggleRegion: [{
+                }], onDidToggleRegion: [{
                     type: i0.Output
                 }] } });
 
@@ -2785,8 +2810,8 @@
         return IDHeaderModule;
     }());
     IDHeaderModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDHeaderModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
-    IDHeaderModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDHeaderModule, declarations: [IDHeaderComponent], imports: [i2.CommonModule, IDAnchorModule], exports: [IDHeaderComponent] });
-    IDHeaderModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDHeaderModule, imports: [[i2.CommonModule, IDAnchorModule]] });
+    IDHeaderModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDHeaderModule, declarations: [IDHeaderComponent], imports: [i2.CommonModule, IDAnchorModule, IDIconModule], exports: [IDHeaderComponent] });
+    IDHeaderModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDHeaderModule, imports: [[i2.CommonModule, IDAnchorModule, IDIconModule]] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDHeaderModule, decorators: [{
                 type: i0.NgModule,
                 args: [{
@@ -2796,7 +2821,7 @@
                         exports: [
                             IDHeaderComponent
                         ],
-                        imports: [i2.CommonModule, IDAnchorModule],
+                        imports: [i2.CommonModule, IDAnchorModule, IDIconModule],
                         schemas: [i0.CUSTOM_ELEMENTS_SCHEMA],
                     }]
             }] });
@@ -2847,6 +2872,13 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(IDHeaderAvatar.prototype, "maxWidth", {
+            get: function () {
+                return this._props.maxWidth;
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(IDHeaderAvatar.prototype, "linkLeft", {
             get: function () {
                 return this._props.linkLeft;
@@ -3030,7 +3062,7 @@
         return IDTabsComponent;
     }());
     IDTabsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTabsComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDTabsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTabsComponent, selector: "id-tabs", inputs: { responsive: "responsive", unresponsive: "unresponsive", selectLabel: "selectLabel" }, ngImport: i0__namespace, template: "<ids-tabs \n  [unresponsive]=\"unresponsive ? true : null\"\n  [responsive]=\"responsive\"\n  [selectlabel]=\"selectLabel\">\n  <ng-content></ng-content>\n</ids-tabs>" });
+    IDTabsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTabsComponent, selector: "id-tabs", inputs: { responsive: "responsive", unresponsive: "unresponsive", selectLabel: "selectLabel" }, ngImport: i0__namespace, template: "<ids-tabs \r\n  [unresponsive]=\"unresponsive ? true : null\"\r\n  [responsive]=\"responsive\"\r\n  [selectlabel]=\"selectLabel\">\r\n  <ng-content></ng-content>\r\n</ids-tabs>" });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTabsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -3048,20 +3080,20 @@
     var IDTabPanelComponent = /** @class */ (function () {
         function IDTabPanelComponent(elementRef) {
             this.elementRef = elementRef;
-            this['noFocus'] = undefined;
+            this.nofocus = undefined;
             elementRef.nativeElement.setAttribute('slot', 'tab-panel');
         }
         return IDTabPanelComponent;
     }());
     IDTabPanelComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTabPanelComponent, deps: [{ token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDTabPanelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTabPanelComponent, selector: "id-tab-panel", inputs: { noFocus: "noFocus" }, ngImport: i0__namespace, template: "<ids-tab-panel [attr.nofocus]=\"noFocus\">\r\n  <ng-content></ng-content>\r\n</ids-tab-panel>" });
+    IDTabPanelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTabPanelComponent, selector: "id-tab-panel", inputs: { nofocus: "nofocus" }, ngImport: i0__namespace, template: "<ids-tab-panel [attr.nofocus]=\"nofocus ? true : null\">\r\n  <ng-content></ng-content>\r\n</ids-tab-panel>" });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTabPanelComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         selector: 'id-tab-panel',
                         templateUrl: './tab-panel.component.html'
                     }]
-            }], ctorParameters: function () { return [{ type: i0__namespace.ElementRef }]; }, propDecorators: { 'noFocus': [{
+            }], ctorParameters: function () { return [{ type: i0__namespace.ElementRef }]; }, propDecorators: { nofocus: [{
                     type: i0.Input
                 }] } });
 
@@ -3071,14 +3103,15 @@
             this.notices = 0;
             this.notifications = 0;
             this.label = '';
-            this.icon = '';
             this.selected = false;
+            // Internal icon
+            this.icon = undefined;
             elementRef.nativeElement.setAttribute('slot', 'tab');
         }
         return IDTabComponent;
     }());
     IDTabComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTabComponent, deps: [{ token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDTabComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTabComponent, selector: "id-tab", inputs: { notices: "notices", notifications: "notifications", label: "label", icon: "icon", selected: "selected" }, ngImport: i0__namespace, template: "<ids-tab\r\n  [notices]=\"notices === 0 ? null : notices\"\r\n  [notifications]=\"notifications === 0 ? null : notifications\"\r\n  [label]=\"label\"\r\n  [attr.icon]=\"icon\"\r\n  [attr.selected]=\"selected ? '':null\">\r\n</ids-tab>" });
+    IDTabComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTabComponent, selector: "id-tab", inputs: { notices: "notices", notifications: "notifications", label: "label", selected: "selected", icon: "icon" }, ngImport: i0__namespace, template: "<ids-tab\r\n  [notices]=\"notices === 0 ? null : notices\"\r\n  [notifications]=\"notifications === 0 ? null : notifications\"\r\n  [label]=\"label\"\r\n  [attr.selected]=\"selected ? '':null\">\r\n  <ids-icon *ngIf=\"icon\"\r\n    slot=\"icon\" \r\n    [attr.name]=\"icon?.name\"\r\n    [attr.title]=\"icon?.title\" \r\n    [attr.color]=\"icon?.color\" \r\n    [attr.color2]=\"icon?.color2\" \r\n    [attr.size]=\"icon?.size\" \r\n    [attr.padding]=\"icon?.padding\"  \r\n    [attr.rotate]=\"icon?.rotate\" \r\n    [attr.colorpreset]=\"icon?.colorpreset\"   \r\n    [attr.height]=\"icon?.height\"   \r\n    [attr.width]=\"icon?.width\"></ids-icon>\r\n  <ng-content></ng-content>\r\n</ids-tab>", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTabComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -3091,10 +3124,10 @@
                     type: i0.Input
                 }], label: [{
                     type: i0.Input
-                }], icon: [{
-                    type: i0.Input
                 }], selected: [{
                     type: i0.Input
+                }], icon: [{
+                    type: i0.Input
                 }] } });
 
     var IDTabsModule = /** @class */ (function () {
@@ -3131,14 +3164,14 @@
         function IDTagComponent() {
             this.clickable = false;
             this.closeable = false;
-            this.srCloseLabel = '';
-            this.clicked = new i0.EventEmitter();
-            this.closed = new i0.EventEmitter();
+            this.srcloselabel = '';
+            this.onClicked = new i0.EventEmitter();
+            this.onClosed = new i0.EventEmitter();
         }
         return IDTagComponent;
     }());
     IDTagComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTagComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    IDTagComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTagComponent, selector: "id-tag", inputs: { clickable: "clickable", closeable: "closeable", srCloseLabel: "srCloseLabel" }, outputs: { clicked: "clicked", closed: "closed" }, ngImport: i0__namespace, template: "<ids-tag\r\n  [clickable]=\"clickable ? true : null\"\r\n  [closeable]=\"closeable ? true : null\"\r\n  [srcloselabel]=\"srCloseLabel\"\r\n  (clicked)=\"clicked.emit(true)\"\r\n  (closed)=\"closed.emit(true)\">\r\n  <ng-content></ng-content>\r\n</ids-tag>" });
+    IDTagComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDTagComponent, selector: "id-tag", inputs: { clickable: "clickable", closeable: "closeable", srcloselabel: "srcloselabel" }, outputs: { onClicked: "onClicked", onClosed: "onClosed" }, ngImport: i0__namespace, template: "<ids-tag\r\n  [clickable]=\"clickable ? true : null\"\r\n  [closeable]=\"closeable ? true : null\"\r\n  [srcloselabel]=\"srcloselabel\"\r\n  (clicked)=\"onClicked.emit(true)\"\r\n  (closed)=\"onClosed.emit(true)\">\r\n  <ng-content></ng-content>\r\n</ids-tag>" });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDTagComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -3149,11 +3182,11 @@
                     type: i0.Input
                 }], closeable: [{
                     type: i0.Input
-                }], srCloseLabel: [{
+                }], srcloselabel: [{
                     type: i0.Input
-                }], clicked: [{
+                }], onClicked: [{
                     type: i0.Output
-                }], closed: [{
+                }], onClosed: [{
                     type: i0.Output
                 }] } });
 
@@ -3214,9 +3247,262 @@
                     }]
             }] });
 
+    var IDToggleComponent = /** @class */ (function () {
+        function IDToggleComponent() {
+        }
+        return IDToggleComponent;
+    }());
+    IDToggleComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDToggleComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    IDToggleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IDToggleComponent, selector: "id-toggle", ngImport: i0__namespace, template: "<ids-toggle>\r\n  <ng-content></ng-content>\r\n</ids-toggle>", encapsulation: i0__namespace.ViewEncapsulation.None });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDToggleComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: 'id-toggle',
+                        templateUrl: './toggle.component.html',
+                        encapsulation: i0.ViewEncapsulation.None,
+                    }]
+            }], ctorParameters: function () { return []; } });
+
+    var IDToggleModule = /** @class */ (function () {
+        function IDToggleModule() {
+        }
+        return IDToggleModule;
+    }());
+    IDToggleModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDToggleModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    IDToggleModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDToggleModule, declarations: [IDToggleComponent], exports: [IDToggleComponent] });
+    IDToggleModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDToggleModule });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IDToggleModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        declarations: [
+                            IDToggleComponent
+                        ],
+                        exports: [
+                            IDToggleComponent
+                        ],
+                        schemas: [i0.CUSTOM_ELEMENTS_SCHEMA],
+                    }]
+            }] });
+
     /*
      * Public API Surface of ids-angular
-     */
+     */
+    /* Icons to be included when needed
+
+    export * from './lib/components/icons/1177/icon-1177.module';
+    export * from './lib/components/icons/agent/icon-agent.module';
+    export * from './lib/components/icons/arrow/icon-arrow.module';
+    export * from './lib/components/icons/attention/icon-attention.module';
+    export * from './lib/components/icons/blekinge/icon-blekinge.module';
+    export * from './lib/components/icons/bookmark/icon-bookmark.module';
+    export * from './lib/components/icons/calendar/icon-calendar.module';
+    export * from './lib/components/icons/call/icon-call.module';
+    export * from './lib/components/icons/call-active/icon-call-active.module';
+    export * from './lib/components/icons/camera-off/icon-camera-off.module';
+    export * from './lib/components/icons/camera-on/icon-camera-on.module';
+    export * from './lib/components/icons/camera-switch/icon-camera-switch.module';
+    export * from './lib/components/icons/chart-bar/icon-chart-bar.module';
+    export * from './lib/components/icons/chart-line/icon-chart-line.module';
+    export * from './lib/components/icons/check/icon-check.module';
+    export * from './lib/components/icons/chevron/icon-chevron.module';
+    export * from './lib/components/icons/chevron-bold/icon-chevron-bold.module';
+    export * from './lib/components/icons/clipboard/icon-clipboard.module';
+    export * from './lib/components/icons/clipboard-cross/icon-clipboard-cross.module';
+    export * from './lib/components/icons/clipboard-text/icon-clipboard-text.module';
+    export * from './lib/components/icons/clock/icon-clock.module';
+    export * from './lib/components/icons/close/icon-close.module';
+    export * from './lib/components/icons/close-bold/icon-close-bold.module';
+    export * from './lib/components/icons/cog/icon-cog.module';
+    export * from './lib/components/icons/computer/icon-computer.module';
+    export * from './lib/components/icons/computer-inera/icon-computer-inera.module';
+    export * from './lib/components/icons/copy-file/icon-copy-file.module';
+    export * from './lib/components/icons/copy-link/icon-copy-link.module';
+    export * from './lib/components/icons/doctors-bag/icon-doctors-bag.module';
+    export * from './lib/components/icons/drag-n-drop/icon-drag-n-drop.module';
+    export * from './lib/components/icons/ear-hearing/icon-ear-hearing.module';
+    export * from './lib/components/icons/edit/icon-edit.module';
+    export * from './lib/components/icons/email/icon-email.module';
+    export * from './lib/components/icons/expand/icon-expand.module';
+    export * from './lib/components/icons/external/icon-external.module';
+    export * from './lib/components/icons/facebook/icon-facebook.module';
+    export * from './lib/components/icons/file-excel/icon-file-excel.module';
+    export * from './lib/components/icons/file-other/icon-file-other.module';
+    export * from './lib/components/icons/file-pdf/icon-file-pdf.module';
+    export * from './lib/components/icons/file-picture/icon-file-picture.module';
+    export * from './lib/components/icons/file-powerpoint/icon-file-powerpoint.module';
+    export * from './lib/components/icons/file-word/icon-file-word.module';
+    export * from './lib/components/icons/find-care/icon-find-care.module';
+    export * from './lib/components/icons/find-region/icon-find-region.module';
+    export * from './lib/components/icons/gotland/icon-gotland.module';
+    export * from './lib/components/icons/halland/icon-halland.module';
+    export * from './lib/components/icons/house/icon-house.module';
+    export * from './lib/components/icons/id-card/icon-id-card.module';
+    export * from './lib/components/icons/id-card-locked/icon-id-card-locked.module';
+    export * from './lib/components/icons/image/icon-image.module';
+    export * from './lib/components/icons/inera/icon-inera.module';
+    export * from './lib/components/icons/inera-legacy/icon-inera-legacy.module';
+    export * from './lib/components/icons/information/icon-information.module';
+    export * from './lib/components/icons/jamtland-harjedalen/icon-jamtland-harjedalen.module';
+    export * from './lib/components/icons/jonkoping/icon-jonkoping.module';
+    export * from './lib/components/icons/kalmar/icon-kalmar.module';
+    export * from './lib/components/icons/kronoberg/icon-kronoberg.module';
+    export * from './lib/components/icons/lightbulb/icon-lightbulb.module';
+    export * from './lib/components/icons/linkedin/icon-linkedin.module';
+    export * from './lib/components/icons/list/icon-list.module';
+    export * from './lib/components/icons/lock/icon-lock.module';
+    export * from './lib/components/icons/lock-open/icon-lock-open.module';
+    export * from './lib/components/icons/log/icon-log.module';
+    export * from './lib/components/icons/log-locked/icon-log-locked.module';
+    export * from './lib/components/icons/menu/icon-menu.module';
+    export * from './lib/components/icons/minus/icon-minus.module';
+    export * from './lib/components/icons/norrbotten/icon-norrbotten.module';
+    export * from './lib/components/icons/office-building/icon-office-building.module';
+    export * from './lib/components/icons/orebro/icon-orebro.module';
+    export * from './lib/components/icons/organization/icon-organization.module';
+    export * from './lib/components/icons/ostergotland/icon-ostergotland.module';
+    export * from './lib/components/icons/plus/icon-plus.module';
+    export * from './lib/components/icons/print/icon-print.module';
+    export * from './lib/components/icons/question/icon-question.module';
+    export * from './lib/components/icons/reload/icon-reload.module';
+    export * from './lib/components/icons/reply/icon-reply.module';
+    export * from './lib/components/icons/search-inera/icon-search-inera.module';
+    export * from './lib/components/icons/search/icon-search.module';
+    export * from './lib/components/icons/shield-locked-primary/icon-shield-locked-primary.module';
+    export * from './lib/components/icons/shield-locked/icon-shield-locked.module';
+    export * from './lib/components/icons/skane/icon-skane.module';
+    export * from './lib/components/icons/sormland/icon-sormland.module';
+    export * from './lib/components/icons/star-filled/icon-star-filled.module';
+    export * from './lib/components/icons/star/icon-star.module';
+    export * from './lib/components/icons/stockholm/icon-stockholm.module';
+    export * from './lib/components/icons/success/icon-success.module';
+    export * from './lib/components/icons/swap/icon-swap.module';
+    export * from './lib/components/icons/telephone/icon-telephone.module';
+    export * from './lib/components/icons/test-tube-analyze/icon-test-tube-analyze.module';
+    export * from './lib/components/icons/test-tube-empty/icon-test-tube-empty.module';
+    export * from './lib/components/icons/test-tube/icon-test-tube.module';
+    export * from './lib/components/icons/toggle-card/icon-toggle-card.module';
+    export * from './lib/components/icons/toggle-list/icon-toggle-list.module';
+    export * from './lib/components/icons/twitter/icon-twitter.module';
+    export * from './lib/components/icons/uppsala/icon-uppsala.module';
+    export * from './lib/components/icons/user/icon-user.module';
+    export * from './lib/components/icons/vasterbotten/icon-vasterbotten.module';
+    export * from './lib/components/icons/vasternorrland/icon-vasternorrland.module';
+    export * from './lib/components/icons/vastmanland/icon-vastmanland.module';
+    export * from './lib/components/icons/vastra-gotaland/icon-vastra-gotaland.module';
+    export * from './lib/components/icons/video-off/icon-video-off.module';
+    export * from './lib/components/icons/video-on/icon-video-on.module';
+    export * from './lib/components/icons/video-switch/icon-video-switch.module';
+    export * from './lib/components/icons/visibility-off/icon-visibility-off.module';
+    export * from './lib/components/icons/visibility/icon-visibility.module';
+    export * from './lib/components/icons/warning/icon-warning.module';
+    export * from './lib/components/icons/1177/icon-1177.component';
+    export * from './lib/components/icons/agent/icon-agent.component';
+    export * from './lib/components/icons/arrow/icon-arrow.component';
+    export * from './lib/components/icons/attention/icon-attention.component';
+    export * from './lib/components/icons/blekinge/icon-blekinge.component';
+    export * from './lib/components/icons/bookmark/icon-bookmark.component';
+    export * from './lib/components/icons/calendar/icon-calendar.component';
+    export * from './lib/components/icons/call/icon-call.component';
+    export * from './lib/components/icons/call-active/icon-call-active.component';
+    export * from './lib/components/icons/camera-off/icon-camera-off.component';
+    export * from './lib/components/icons/camera-on/icon-camera-on.component';
+    export * from './lib/components/icons/camera-switch/icon-camera-switch.component';
+    export * from './lib/components/icons/chart-bar/icon-chart-bar.component';
+    export * from './lib/components/icons/chart-line/icon-chart-line.component';
+    export * from './lib/components/icons/check/icon-check.component';
+    export * from './lib/components/icons/chevron/icon-chevron.component';
+    export * from './lib/components/icons/chevron-bold/icon-chevron-bold.component';
+    export * from './lib/components/icons/clipboard/icon-clipboard.component';
+    export * from './lib/components/icons/clipboard-cross/icon-clipboard-cross.component';
+    export * from './lib/components/icons/clipboard-text/icon-clipboard-text.component';
+    export * from './lib/components/icons/clock/icon-clock.component';
+    export * from './lib/components/icons/close/icon-close.component';
+    export * from './lib/components/icons/close-bold/icon-close-bold.component';
+    export * from './lib/components/icons/cog/icon-cog.component';
+    export * from './lib/components/icons/computer/icon-computer.component';
+    export * from './lib/components/icons/computer-inera/icon-computer-inera.component';
+    export * from './lib/components/icons/copy-file/icon-copy-file.component';
+    export * from './lib/components/icons/copy-link/icon-copy-link.component';
+    export * from './lib/components/icons/doctors-bag/icon-doctors-bag.component';
+    export * from './lib/components/icons/drag-n-drop/icon-drag-n-drop.component';
+    export * from './lib/components/icons/ear-hearing/icon-ear-hearing.component';
+    export * from './lib/components/icons/edit/icon-edit.component';
+    export * from './lib/components/icons/email/icon-email.component';
+    export * from './lib/components/icons/expand/icon-expand.component';
+    export * from './lib/components/icons/external/icon-external.component';
+    export * from './lib/components/icons/facebook/icon-facebook.component';
+    export * from './lib/components/icons/file-excel/icon-file-excel.component';
+    export * from './lib/components/icons/file-other/icon-file-other.component';
+    export * from './lib/components/icons/file-pdf/icon-file-pdf.component';
+    export * from './lib/components/icons/file-picture/icon-file-picture.component';
+    export * from './lib/components/icons/file-powerpoint/icon-file-powerpoint.component';
+    export * from './lib/components/icons/file-word/icon-file-word.component';
+    export * from './lib/components/icons/find-care/icon-find-care.component';
+    export * from './lib/components/icons/find-region/icon-find-region.component';
+    export * from './lib/components/icons/gotland/icon-gotland.component';
+    export * from './lib/components/icons/halland/icon-halland.component';
+    export * from './lib/components/icons/house/icon-house.component';
+    export * from './lib/components/icons/id-card/icon-id-card.component';
+    export * from './lib/components/icons/id-card-locked/icon-id-card-locked.component';
+    export * from './lib/components/icons/image/icon-image.component';
+    export * from './lib/components/icons/inera/icon-inera.component';
+    export * from './lib/components/icons/inera-legacy/icon-inera-legacy.component';
+    export * from './lib/components/icons/information/icon-information.component';
+    export * from './lib/components/icons/jamtland-harjedalen/icon-jamtland-harjedalen.component';
+    export * from './lib/components/icons/jonkoping/icon-jonkoping.component';
+    export * from './lib/components/icons/kalmar/icon-kalmar.component';
+    export * from './lib/components/icons/kronoberg/icon-kronoberg.component';
+    export * from './lib/components/icons/lightbulb/icon-lightbulb.component';
+    export * from './lib/components/icons/linkedin/icon-linkedin.component';
+    export * from './lib/components/icons/list/icon-list.component';
+    export * from './lib/components/icons/lock/icon-lock.component';
+    export * from './lib/components/icons/lock-open/icon-lock-open.component';
+    export * from './lib/components/icons/log/icon-log.component';
+    export * from './lib/components/icons/log-locked/icon-log-locked.component';
+    export * from './lib/components/icons/menu/icon-menu.component';
+    export * from './lib/components/icons/minus/icon-minus.component';
+    export * from './lib/components/icons/norrbotten/icon-norrbotten.component';
+    export * from './lib/components/icons/office-building/icon-office-building.component';
+    export * from './lib/components/icons/orebro/icon-orebro.component';
+    export * from './lib/components/icons/organization/icon-organization.component';
+    export * from './lib/components/icons/ostergotland/icon-ostergotland.component';
+    export * from './lib/components/icons/plus/icon-plus.component';
+    export * from './lib/components/icons/print/icon-print.component';
+    export * from './lib/components/icons/question/icon-question.component';
+    export * from './lib/components/icons/reload/icon-reload.component';
+    export * from './lib/components/icons/reply/icon-reply.component';
+    export * from './lib/components/icons/search-inera/icon-search-inera.component';
+    export * from './lib/components/icons/search/icon-search.component';
+    export * from './lib/components/icons/shield-locked-primary/icon-shield-locked-primary.component';
+    export * from './lib/components/icons/shield-locked/icon-shield-locked.component';
+    export * from './lib/components/icons/skane/icon-skane.component';
+    export * from './lib/components/icons/sormland/icon-sormland.component';
+    export * from './lib/components/icons/star-filled/icon-star-filled.component';
+    export * from './lib/components/icons/star/icon-star.component';
+    export * from './lib/components/icons/stockholm/icon-stockholm.component';
+    export * from './lib/components/icons/success/icon-success.component';
+    export * from './lib/components/icons/swap/icon-swap.component';
+    export * from './lib/components/icons/telephone/icon-telephone.component';
+    export * from './lib/components/icons/test-tube-analyze/icon-test-tube-analyze.component';
+    export * from './lib/components/icons/test-tube-empty/icon-test-tube-empty.component';
+    export * from './lib/components/icons/test-tube/icon-test-tube.component';
+    export * from './lib/components/icons/toggle-card/icon-toggle-card.component';
+    export * from './lib/components/icons/toggle-list/icon-toggle-list.component';
+    export * from './lib/components/icons/twitter/icon-twitter.component';
+    export * from './lib/components/icons/uppsala/icon-uppsala.component';
+    export * from './lib/components/icons/user/icon-user.component';
+    export * from './lib/components/icons/vasterbotten/icon-vasterbotten.component';
+    export * from './lib/components/icons/vasternorrland/icon-vasternorrland.component';
+    export * from './lib/components/icons/vastmanland/icon-vastmanland.component';
+    export * from './lib/components/icons/vastra-gotaland/icon-vastra-gotaland.component';
+    export * from './lib/components/icons/video-off/icon-video-off.component';
+    export * from './lib/components/icons/video-on/icon-video-on.component';
+    export * from './lib/components/icons/video-switch/icon-video-switch.component';
+    export * from './lib/components/icons/visibility-off/icon-visibility-off.component';
+    export * from './lib/components/icons/visibility/icon-visibility.component';
+    export * from './lib/components/icons/warning/icon-warning.component';
+
+    */
 
     /**
      * Generated bundle index. Do not edit.
@@ -3320,6 +3606,8 @@
     exports.IDTextareaModule = IDTextareaModule;
     exports.IDTimeComponent = IDTimeComponent;
     exports.IDTimeModule = IDTimeModule;
+    exports.IDToggleComponent = IDToggleComponent;
+    exports.IDToggleModule = IDToggleModule;
     exports.IDTooltipComponent = IDTooltipComponent;
     exports.IDTooltipModule = IDTooltipModule;